zhangwei
7 天以前 1a1a7b401b0f75d2588256fdc3dfd3a98d0fb66c
Web/src/views/Customer/fBS_CusExtend/index.vue
@@ -8,8 +8,12 @@
import printDialog from '/@/views/system/print/component/hiprint/preview.vue'
import ModifyRecord from '/@/components/table/modifyRecord.vue';
import ImportData from "/@/components/table/importData.vue";
import { useFBS_ExRoleApi } from '/@/api/Customer/fBS_ExRole';
import { formatDate } from '/@/utils/formatTime';
const fBS_CusExtendApi = useFBS_CusExtendApi();
const fBS_ExRoleApi = useFBS_ExRoleApi();
const printDialogRef = ref();
const editDialogRef = ref();
const importDataRef = ref();
@@ -29,12 +33,33 @@
    order: 'descending', // 排序方向
    descStr: 'descending', // 降序排序的关键字符
  },
  tableParams1: {
    page: 1,
    pageSize: 20,
    total: 0,
    field: 'createTime', // 默认的排序字段
    order: 'descending', // 排序方向
    descStr: 'descending', // 降序排序的关键字符
  },
  tableData: [],
  roleList: [],
  qiyeList:[],
  shenheList:[]
});
// 页面加载时
onMounted(async () => {
  handleQueryRole()
  getParamList()
});
const getParamList = async()=>{
  let res = await fBS_CusExtendApi.getParam().then(res => res.data.result);
  state.qiyeList = res.enterpriseTypes
  state.shenheList = res.stepsTypeItems
  console.log(res,state.qiyeList,state.shenheList);
}
// 查询操作
const handleQuery = async (params: any = {}) => {
@@ -44,6 +69,12 @@
  state.tableParams.total = result?.total;
  state.tableData = result?.items ?? [];
  state.tableLoading = false;
};
// 查询角色
const handleQueryRole = async (params: any = {}) => {
  const result = await fBS_ExRoleApi.page(Object.assign({}, state.tableParams1)).then(res => res.data.result);
  state.roleList = result?.items ?? [];
};
// 列排序
@@ -104,129 +135,84 @@
<template>
  <div class="fBS_CusExtend-container" v-loading="state.exportLoading">
    <el-card shadow="hover" :body-style="{ paddingBottom: '0' }"> 
      <el-form :model="state.tableQueryParams" ref="queryForm" labelWidth="90">
      <el-form :model="state.tableQueryParams" ref="queryForm" labelWidth="120">
        <el-row>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10">
            <el-form-item label="关键字">
              <el-input v-model="state.tableQueryParams.keyword" clearable placeholder="请输入模糊查询关键字"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="用户ID">
              <el-input v-model="state.tableQueryParams.customerId" clearable placeholder="请输入用户ID"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业类型 ">
              <el-input v-model="state.tableQueryParams.enterpriseType" clearable placeholder="请输入企业类型 "/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="交易主体code">
              <el-input v-model="state.tableQueryParams.transactionCode" clearable placeholder="请输入交易主体code"/>
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="交易主体">
              <el-input v-model="state.tableQueryParams.transactionCode" clearable placeholder="请输入交易主体"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="营业执照文件路径">
              <el-input v-model="state.tableQueryParams.businessLicense" clearable placeholder="请输入营业执照文件路径"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业名称">
              <el-input v-model="state.tableQueryParams.enterpriseName" clearable placeholder="请输入企业名称"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="统一社会信用代码">
              <el-input v-model="state.tableQueryParams.unifiedSocialCreditCode" clearable placeholder="请输入统一社会信用代码"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="注册资金">
              <el-input v-model="state.tableQueryParams.registeredCapital" clearable placeholder="请输入注册资金"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.legalRepresentativeName" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人身份证文件路径">
              <el-input v-model="state.tableQueryParams.legalRepresentativeIdCard" clearable placeholder="请输入法定代表人身份证文件路径"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.legalRepresentativeIdNumber" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.legalRepresentativePhone" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业住所">
              <el-input v-model="state.tableQueryParams.residence" clearable placeholder="请输入企业住所"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业联系电话">
              <el-input v-model="state.tableQueryParams.enterprisePhone" clearable placeholder="请输入企业联系电话"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业成立时间">
              <el-date-picker type="daterange" v-model="state.tableQueryParams.establishmentTimeRange"  value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业主营业务">
              <el-input v-model="state.tableQueryParams.mainBusiness" clearable placeholder="请输入企业主营业务"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="企业邮箱">
              <el-input v-model="state.tableQueryParams.enterpriseEmail" clearable placeholder="请输入企业邮箱"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="业务经办人姓名">
              <el-input v-model="state.tableQueryParams.operatorName" clearable placeholder="请输入业务经办人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="业务经办人身份证文件路径或标识">
              <el-input v-model="state.tableQueryParams.operatorIdCard" clearable placeholder="请输入业务经办人身份证文件路径或标识"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.operatorIdNumber" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.operatorPhone" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.bankName" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="法定代表人姓名">
              <el-input v-model="state.tableQueryParams.bankAccount" clearable placeholder="请输入法定代表人姓名"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="审核步骤">
              <g-sys-dict v-model="state.tableQueryParams.steps" code="CusExtendStep" render-as="select" placeholder="请选择审核步骤" clearable filterable />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="4" class="mb10">
            <el-form-item >
              <el-button-group style="display: flex; align-items: center;">
                <el-button type="primary"  icon="ele-Search" @click="handleQuery" v-auth="'fBS_CusExtend:page'" v-reclick="1000"> 查询 </el-button>
@@ -253,45 +239,102 @@
      </el-form>
    </el-card>
    <el-card class="full-table" shadow="hover" style="margin-top: 5px">
      <el-table :data="state.tableData" @selection-change="(val: any[]) => { state.selectData = val; }" style="width: 100%" v-loading="state.tableLoading" tooltip-effect="light" row-key="id" @sort-change="sortChange" border>
      <el-table :data="state.tableData" @selection-change="(val: any[]) => { state.selectData = val; }" fit style="width: 100%" v-loading="state.tableLoading" tooltip-effect="light" row-key="id" @sort-change="sortChange" border>
        <el-table-column type="selection" width="40" align="center" v-if="auth('fBS_CusExtend:batchDelete') || auth('fBS_CusExtend:export')" />
        <el-table-column type="index" label="序号" width="55" align="center"/>
        <el-table-column prop='customerId' label='用户ID' show-overflow-tooltip />
        <!-- <el-table-column prop='customerId' label='用户ID' show-overflow-tooltip /> -->
        <el-table-column prop='enterpriseType' label='企业类型 ' show-overflow-tooltip />
        <el-table-column prop='transactionCode' label='交易主体code' show-overflow-tooltip />
        <el-table-column prop='businessLicense' label='营业执照文件路径' show-overflow-tooltip />
        <el-table-column prop='enterpriseName' label='企业名称' show-overflow-tooltip />
        <el-table-column prop='unifiedSocialCreditCode' label='统一社会信用代码' show-overflow-tooltip />
        <el-table-column prop='registeredCapital' label='注册资金' show-overflow-tooltip />
        <el-table-column prop='legalRepresentativeName' label='法定代表人姓名' show-overflow-tooltip />
        <el-table-column prop='legalRepresentativeIdCard' label='法定代表人身份证文件路径' show-overflow-tooltip />
        <el-table-column prop='legalRepresentativeIdNumber' label='法定代表人姓名' show-overflow-tooltip />
        <el-table-column prop='legalRepresentativePhone' label='法定代表人姓名' show-overflow-tooltip />
        <el-table-column prop='residence' label='企业住所' show-overflow-tooltip />
        <el-table-column prop='enterprisePhone' label='企业联系电话' show-overflow-tooltip />
        <el-table-column prop='establishmentTime' label='企业成立时间' show-overflow-tooltip />
        <el-table-column prop='mainBusiness' label='企业主营业务' show-overflow-tooltip />
        <el-table-column prop='enterpriseEmail' label='企业邮箱' show-overflow-tooltip />
        <el-table-column prop='operatorName' label='业务经办人姓名' show-overflow-tooltip />
        <el-table-column prop='operatorIdCard' label='业务经办人身份证文件路径或标识' show-overflow-tooltip />
        <el-table-column prop='operatorIdNumber' label='业务经办人姓名' show-overflow-tooltip />
        <el-table-column prop='operatorPhone' label='业务经办人电话' show-overflow-tooltip />
        <el-table-column prop='bankName' label='开户行名称' show-overflow-tooltip />
        <el-table-column prop='bankAccount' label='开户行账号' show-overflow-tooltip />
        <el-table-column prop='steps' label='审核步骤' show-overflow-tooltip>
          <template #default="scope">
            <g-sys-dict v-model="scope.row.steps" code="CusExtendStep" />
        <el-table-column prop='transactionCode' label='交易主体' show-overflow-tooltip width="100">
          <template v-slot="scope">
            <span v-for="(item, index) in state.roleList" :key="index">
          <span v-if="item.code == scope.row.transactionCode">{{ item.name }}</span>
        </span>
          </template>
        </el-table-column>
        <el-table-column label="修改记录" width="100" align="center" show-overflow-tooltip>
        <el-table-column prop='businessLicense' label='营业执照' show-overflow-tooltip width="120">
          <template v-slot="scope">
             <el-image
                        :src="scope.row.businessLicense"
                        :zoom-rate="1.2"
                        :preview-src-list="[scope.row.businessLicense]"
                        preview-teleported
                        fit="cover"
                  />
          </template>
        </el-table-column>
        <el-table-column prop='enterpriseName' label='企业名称' show-overflow-tooltip width="180"/>
        <el-table-column prop='unifiedSocialCreditCode' label='统一社会信用代码' show-overflow-tooltip width="150"/>
        <el-table-column prop='registeredCapital' label='注册资金' show-overflow-tooltip />
        <el-table-column prop='enterprisePhone' label='联系电话' show-overflow-tooltip width="100"/>
        <el-table-column prop='establishmentTime' label='成立时间' show-overflow-tooltip >
          <template #default="scope">
              {{ formatDate(new Date(scope.row.establishmentTime), 'YYYY-mm-dd') }}
            </template>
        </el-table-column>
        <!-- <el-table-column prop='mainBusiness' label='企业主营业务' show-overflow-tooltip /> -->
        <el-table-column prop='enterpriseEmail' label='企业邮箱' show-overflow-tooltip width="150"/>
        <el-table-column prop='legalRepresentativeName' label='法定代表人姓名' show-overflow-tooltip  width="110"/>
        <el-table-column prop='legalRepresentativeIdCard' label='法定代表人身份证' show-overflow-tooltip width="120">
          <template v-slot="scope">
             <el-image
                        :src="scope.row.legalRepresentativeIdCard"
                        :zoom-rate="1.2"
                        :preview-src-list="[scope.row.legalRepresentativeIdCard]"
                        preview-teleported
                        fit="cover"
                  />
          </template></el-table-column>
        <!-- <el-table-column prop='legalRepresentativeIdNumber' label='法定代表人身份证号码' show-overflow-tooltip width="120"/> -->
        <el-table-column prop='legalRepresentativePhone' label='法定代表人联系电话' show-overflow-tooltip width="130"/>
        <!-- <el-table-column prop='residence' label='企业住所' show-overflow-tooltip /> -->
        <el-table-column prop='operatorName' label='业务经办人姓名' show-overflow-tooltip width="110"/>
        <el-table-column prop='operatorIdCard' label='业务经办人身份证' show-overflow-tooltip width="120">
          <template v-slot="scope">
             <el-image
                        :src="scope.row.operatorIdCard"
                        :zoom-rate="1.2"
                        :preview-src-list="[scope.row.operatorIdCard]"
                        preview-teleported
                        fit="cover"
                  />
          </template>
        </el-table-column>
        <!-- <el-table-column prop='operatorIdNumber' label='业务经办人身份证号码' show-overflow-tooltip width="120"/> -->
        <el-table-column prop='operatorPhone' label='业务经办人电话' show-overflow-tooltip width="120"/>
        <!-- <el-table-column prop='bankName' label='开户行名称' show-overflow-tooltip /> -->
        <!-- <el-table-column prop='bankAccount' label='开户行账号' show-overflow-tooltip width="120"/> -->
        <el-table-column prop='steps' label='审核步骤' show-overflow-tooltip>
          <template v-slot="scope">
            <span v-for="(item, index) in state.shenheList" :key="index">
              <el-tag v-if="item.value == scope.row.steps">{{ item.description }}</el-tag>
            </span>
          </template>
          <!-- <template #default="scope">
            <el-tag v-if="scope.row.steps==0" type='warning'>
              待审核
            </el-tag>
            <el-tag v-else-if="scope.row.steps==1" type='primary'>
              更改
            </el-tag>
            <el-tag v-else-if="scope.row.steps==2" type='success'>
              通过
            </el-tag>
            <el-tag v-else-if="scope.row.steps==3" type='error'>
              未通过
            </el-tag>
          </template> -->
        </el-table-column>
        <!-- <el-table-column label="修改记录" width="100" align="center" show-overflow-tooltip>
          <template #default="scope">
            <ModifyRecord :data="scope.row" />
          </template>
        </el-table-column>
        <el-table-column label="操作" width="140" align="center" fixed="right" show-overflow-tooltip v-if="auth('fBS_CusExtend:update') || auth('fBS_CusExtend:delete')">
        </el-table-column> -->
        <el-table-column label="操作" width="70" align="center" fixed="right" show-overflow-tooltip v-if="auth('fBS_CusExtend:update') || auth('fBS_CusExtend:delete')">
          <template #default="scope">
            <el-button icon="ele-Edit" size="small" text type="primary" @click="editDialogRef.openDialog(scope.row, '编辑企业资料')" v-auth="'fBS_CusExtend:update'"> 编辑 </el-button>
            <el-button icon="ele-Delete" size="small" text type="primary" @click="delFBS_CusExtend(scope.row)" v-auth="'fBS_CusExtend:delete'"> 删除 </el-button>
            <el-button icon="ele-Edit" size="small" text type="primary" @click="editDialogRef.openDialog(scope.row, '编辑企业资料', state.qiyeList,state.roleList)" v-auth="'fBS_CusExtend:update'">  </el-button>
            <el-button icon="ele-Delete" size="small" text type="primary" @click="delFBS_CusExtend(scope.row)" v-auth="'fBS_CusExtend:delete'">  </el-button>
          </template>
        </el-table-column>
      </el-table>