|
|
@@ -1,18 +1,7 @@
|
|
|
-<!-- 会员机构管理-机构管理-机构开户申请-详情 -->
|
|
|
+<!-- 交易商管理-开户管理-交易商开户-详情 -->
|
|
|
<template>
|
|
|
- <app-drawer title="详情" width="860" v-model:show="show" :loading="loading" :refresh="refresh">
|
|
|
- <app-table-details title="基本信息" :data="data" :label-width="160" :cell-props="detailProps1" :column="2">
|
|
|
- <!-- 创建时间 -->
|
|
|
- <template #createtime="{ value }">
|
|
|
- {{ formatDate(value) }}
|
|
|
- </template>
|
|
|
- </app-table-details>
|
|
|
- <app-table-details title="个人资料" :data="data" :label-width="160" :cell-props="detailProps2" :column="2"
|
|
|
- v-if="isPerson">
|
|
|
- <!-- 证件类型 -->
|
|
|
- <template #cardtype="{ value }">
|
|
|
- {{ certypepersonEnum.getEnumTypeName(value) }}
|
|
|
- </template>
|
|
|
+ <app-drawer title="详情" width="900" v-model:show="show">
|
|
|
+ <app-table-details :data="data" :label-width="140" :cell-props="detailProps" :column="2">
|
|
|
<!-- 证件照正面 -->
|
|
|
<template #cardfrontphotourl="{ value }">
|
|
|
<el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
@@ -21,18 +10,8 @@
|
|
|
<template #cardbackphotourl="{ value }">
|
|
|
<el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
</template>
|
|
|
- </app-table-details>
|
|
|
- <app-table-details title="企业资料" :data="data" :label-width="160" :cell-props="detailProps3" :column="2" v-else>
|
|
|
- <!-- 企业性质 -->
|
|
|
- <template #biznature="{ value }">
|
|
|
- {{ biznatureEnum.getEnumTypeName(value) }}
|
|
|
- </template>
|
|
|
- <!-- 证件类型 -->
|
|
|
- <template #cardtype="{ value }">
|
|
|
- {{ certypecompanyEnum.getEnumTypeName(value) }}
|
|
|
- </template>
|
|
|
- <!-- 证件照正面 -->
|
|
|
- <template #cardfrontphotourl="{ value }">
|
|
|
+ <!-- 手持证件照 -->
|
|
|
+ <template #halfbodyphotourl="{ value }">
|
|
|
<el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
</template>
|
|
|
<!-- 法人身份证正面 -->
|
|
|
@@ -43,74 +22,64 @@
|
|
|
<template #legalcardbackphotourl="{ value }">
|
|
|
<el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
</template>
|
|
|
+ <!-- 法人授权书 -->
|
|
|
+ <template #otherurl="{ value }">
|
|
|
+ <el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
+ </template>
|
|
|
+ <!-- 银行卡正面 -->
|
|
|
+ <template #bankcardfrontphotourl="{ value }">
|
|
|
+ <el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
+ </template>
|
|
|
</app-table-details>
|
|
|
- <app-table-details title="附件" :data="data" :label-width="160" :cell-props="detailProps4" :column="2" />
|
|
|
<template #footer>
|
|
|
<el-button @click="onCancel(false)">关闭</el-button>
|
|
|
- <template v-if="data?.userstate === 2">
|
|
|
- <el-button @click="openComponent('Refuse')" type="primary">审核拒绝</el-button>
|
|
|
- <el-button @click="openComponent('Agree')" type="primary">审核通过</el-button>
|
|
|
- </template>
|
|
|
</template>
|
|
|
- <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)"
|
|
|
- @closed="closeComponent" v-if="componentId" />
|
|
|
</app-drawer>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { shallowRef, PropType, defineAsyncComponent } from 'vue'
|
|
|
+import { shallowRef, PropType, computed } from 'vue'
|
|
|
import { ElMessage } from 'element-plus'
|
|
|
-import { formatDate } from '@/filters'
|
|
|
+import { decryptAES } from '@/services/crypto'
|
|
|
+import { getUserInfoTypeName, getGenderName, UserInfoType } from '@/constants/member'
|
|
|
import { useEnum } from '@/hooks/enum'
|
|
|
-import { useComponent } from '@/hooks/component'
|
|
|
import { useRequest } from '@/hooks/request'
|
|
|
-import { queryWskhUserinfoDetail } from '@/services/api/member'
|
|
|
+import { queryInvestorDetail } from '@/services/api/investor'
|
|
|
+import { CellProp } from '@pc/components/base/table-details/types'
|
|
|
import AppDrawer from '@pc/components/base/drawer/index.vue'
|
|
|
import AppTableDetails from '@pc/components/base/table-details/index.vue'
|
|
|
import service from '@/services'
|
|
|
|
|
|
const props = defineProps({
|
|
|
selectedRow: {
|
|
|
- type: Object as PropType<Model.MemberDetail>,
|
|
|
+ type: Object as PropType<Model.InvestorRsp>,
|
|
|
required: true
|
|
|
}
|
|
|
})
|
|
|
|
|
|
-const componentMap = new Map<string, unknown>([
|
|
|
- ['Agree', defineAsyncComponent(() => import('./agree.vue'))], // 同意
|
|
|
- ['Refuse', defineAsyncComponent(() => import('./refuse.vue'))], // 拒绝
|
|
|
-])
|
|
|
-
|
|
|
const show = shallowRef(true)
|
|
|
const refresh = shallowRef(false)
|
|
|
-const loading = shallowRef(false)
|
|
|
-// 是否个人
|
|
|
-const isPerson = props.selectedRow.userinfotype === 1
|
|
|
-// 企业性质枚举
|
|
|
-const biznatureEnum = useEnum('biznature')
|
|
|
-// 个人证件类型
|
|
|
-const certypepersonEnum = useEnum('certypeperson')
|
|
|
-// 企业证件类型
|
|
|
-const certypecompanyEnum = useEnum('certypecompany')
|
|
|
|
|
|
-const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => onCancel(true))
|
|
|
+// 证件类型
|
|
|
+const certificatetypeEnum = useEnum('certificatetype')
|
|
|
+// 开户状态
|
|
|
+const userstateEnum = useEnum('investorOpenStatus')
|
|
|
|
|
|
-const { data } = useRequest(queryWskhUserinfoDetail, {
|
|
|
+const { data } = useRequest(queryInvestorDetail, {
|
|
|
params: {
|
|
|
- userId: props.selectedRow.userid
|
|
|
+ userId: props.selectedRow.userId,
|
|
|
},
|
|
|
- onSuccess: (res) => {
|
|
|
- const { cardfrontphotourl, cardbackphotourl, legalcardfrontphotourl, legalcardbackphotourl, attachment1, attachment2 } = res.data
|
|
|
+ onSuccess: () => {
|
|
|
if (data.value) {
|
|
|
const baseUrl = service.getConfig('apiUrl')
|
|
|
const getUrl = (value: string) => value && new URL(value, baseUrl).href
|
|
|
|
|
|
- data.value.cardfrontphotourl = getUrl(cardfrontphotourl)
|
|
|
- data.value.cardbackphotourl = getUrl(cardbackphotourl)
|
|
|
- data.value.legalcardfrontphotourl = getUrl(legalcardfrontphotourl)
|
|
|
- data.value.legalcardbackphotourl = getUrl(legalcardbackphotourl)
|
|
|
- data.value.attachment1 = getUrl(attachment1)
|
|
|
- data.value.attachment2 = getUrl(attachment2)
|
|
|
+ data.value.cardfrontphotourl = getUrl(data.value.cardfrontphotourl)
|
|
|
+ data.value.cardbackphotourl = getUrl(data.value.cardbackphotourl)
|
|
|
+ data.value.halfbodyphotourl = getUrl(data.value.halfbodyphotourl)
|
|
|
+ data.value.legalcardfrontphotourl = getUrl(data.value.legalcardfrontphotourl)
|
|
|
+ data.value.legalcardbackphotourl = getUrl(data.value.legalcardbackphotourl)
|
|
|
+ data.value.otherurl = getUrl(data.value.otherurl)
|
|
|
}
|
|
|
},
|
|
|
onError: (err) => {
|
|
|
@@ -118,54 +87,45 @@ const { data } = useRequest(queryWskhUserinfoDetail, {
|
|
|
}
|
|
|
})
|
|
|
|
|
|
-const detailProps1 = [
|
|
|
- { prop: 'username', label: '机构名称:' },
|
|
|
- { prop: 'userinfotype', label: '所有者类型:' },
|
|
|
- { prop: 'usertype', label: '机构类型:' },
|
|
|
- { prop: 'referral', label: '推荐人:' },
|
|
|
- { prop: 'userstate', label: '开户状态:' },
|
|
|
- { prop: 'createtime', label: '创建时间:' },
|
|
|
-]
|
|
|
-
|
|
|
-const detailProps2 = [
|
|
|
- { prop: 'customername', label: '名称:' },
|
|
|
- { prop: 'company', label: '公司:' },
|
|
|
- { prop: 'cardtype', label: '证件类型:' },
|
|
|
- { prop: 'cardnum', label: '证件号码:' },
|
|
|
- { prop: 'cardfrontphotourl', label: '证件照正面:' },
|
|
|
- { prop: 'cardbackphotourl', label: '证件照反面:' },
|
|
|
- { prop: 'sex', label: '性别:' },
|
|
|
- { prop: 'mobilephone', label: '手机号:' },
|
|
|
- { prop: 'telphone', label: '联系电话:' },
|
|
|
- { prop: 'address', label: '地址:' },
|
|
|
- { prop: 'postalcode', label: '邮政编码:' },
|
|
|
- { prop: 'email', label: '邮箱:' },
|
|
|
- { prop: 'remark', label: '备注:' },
|
|
|
-]
|
|
|
-
|
|
|
-const detailProps3 = [
|
|
|
- { prop: 'customername', label: '名称:' },
|
|
|
- { prop: 'biznature', label: '企业性质:' },
|
|
|
- { prop: 'cardtype', label: '证件类型:' },
|
|
|
- { prop: 'cardnum', label: '证件号码:' },
|
|
|
- { prop: 'cardfrontphotourl', label: '证件照正面:' },
|
|
|
- { prop: 'legalpersonname', label: '法人姓名:' },
|
|
|
- { prop: 'legalcardfrontphotourl', label: '法人身份证正面:' },
|
|
|
- { prop: 'legalcardbackphotourl', label: '法人身份证反面:' },
|
|
|
- { prop: 'contactname', label: '联系人:' },
|
|
|
- { prop: 'sex', label: '性别:' },
|
|
|
- { prop: 'mobilephone', label: '手机号:' },
|
|
|
- { prop: 'telphone', label: '联系电话:' },
|
|
|
- { prop: 'address', label: '地址:' },
|
|
|
- { prop: 'postalcode', label: '邮政编码:' },
|
|
|
- { prop: 'email', label: '邮箱:' },
|
|
|
- { prop: 'remark', label: '备注:' },
|
|
|
-]
|
|
|
-
|
|
|
-const detailProps4 = [
|
|
|
- { prop: 'attachment1', label: '附件1:' },
|
|
|
- { prop: 'attachment2', label: '附件2:' },
|
|
|
-]
|
|
|
+const detailProps = computed(() => {
|
|
|
+ const isPerson = data.value?.userinfotype === UserInfoType.Personal
|
|
|
+ const result: CellProp[] = [
|
|
|
+ { prop: 'username', formatLabel: () => isPerson ? '用户名称:' : '企业名称:' },
|
|
|
+ { prop: 'userinfotype', label: '信息类型:', formatValue: (val) => getUserInfoTypeName(val) },
|
|
|
+ { prop: 'cardtype', label: '证件类型:', formatValue: (val) => certificatetypeEnum.getEnumTypeName(val) },
|
|
|
+ { prop: 'cardnum', label: '证件号码:', formatValue: (val) => decryptAES(val) },
|
|
|
+ { prop: 'pathname', label: '地址:' },
|
|
|
+ { prop: 'legalpersonname', label: '法人名称:', show: !isPerson },
|
|
|
+ { prop: 'contactname', label: '联系人:', show: !isPerson },
|
|
|
+ { prop: 'sex', label: '性别:', formatValue: (val) => getGenderName(val) },
|
|
|
+ { prop: 'mobilephone', label: '手机号:', formatValue: (val) => decryptAES(val) },
|
|
|
+ { prop: 'postalcode', label: '邮政编码:' },
|
|
|
+ { prop: 'wechat', label: '微信:', formatValue: (val) => decryptAES(val) },
|
|
|
+ { prop: 'telphone', label: '联系电话:', formatValue: (val) => decryptAES(val) },
|
|
|
+ { prop: 'email', label: '邮箱:', formatValue: (val) => decryptAES(val) },
|
|
|
+ { prop: 'company', label: '所属公司:', show: isPerson },
|
|
|
+ { prop: 'memberusername', label: '所属会员:' },
|
|
|
+ { prop: 'areaname', label: '所属机构:' },
|
|
|
+ { prop: 'brokername', label: '经纪人:' },
|
|
|
+ { prop: 'referralname', label: '推荐人:' },
|
|
|
+ { prop: 'cardfrontphotourl', formatLabel: () => isPerson ? '证件照正面:' : '营业执照:' },
|
|
|
+ { prop: 'cardbackphotourl', label: '证件照反面:', show: !!data.value?.cardbackphotourl },
|
|
|
+ { prop: 'halfbodyphotourl', label: '手持证件照:', show: !!data.value?.halfbodyphotourl },
|
|
|
+ { prop: 'legalcardfrontphotourl', label: '身份证正面照:', show: !isPerson },
|
|
|
+ { prop: 'legalcardbackphotourl', label: '身份证背面照:', show: !isPerson },
|
|
|
+ { prop: 'otherurl', label: '法人授权书:', show: !isPerson },
|
|
|
+ { prop: 'userstate', label: '状态:', formatValue: (val) => userstateEnum.getEnumTypeName(val) },
|
|
|
+ { prop: 'remark', label: '备注:' },
|
|
|
+ ]
|
|
|
+ if (data.value?.bankid) {
|
|
|
+ result.push(
|
|
|
+ { prop: 'bankname', label: '银行名称:' },
|
|
|
+ { prop: 'bankaccount', label: '银行账户:' },
|
|
|
+ { prop: 'bankcardfrontphotourl', label: '银行卡正面:' },
|
|
|
+ )
|
|
|
+ }
|
|
|
+ return result
|
|
|
+})
|
|
|
|
|
|
const onCancel = (isRefresh = false) => {
|
|
|
show.value = false
|