|
|
@@ -1,209 +1,16 @@
|
|
|
<!-- 交易商管理-交易商管理-交易商管理-详情 -->
|
|
|
<template>
|
|
|
- <app-drawer title="详情" width="900" v-model:show="show" :loading="loading" :refresh="refresh">
|
|
|
- <app-table-details title="基本信息" :data="oldData?.userAccountDetailVo" :label-width="160"
|
|
|
- :cell-props="detailProps1" :column="2">
|
|
|
- <!-- 交易商名称 -->
|
|
|
- <template #accountName="{ value }">
|
|
|
- <p>{{ value }}</p>
|
|
|
- <p class="red" v-if="newData && newData.userAccountDetailVo.accountName !== value">
|
|
|
- {{ newData.userAccountDetailVo.accountName }}
|
|
|
- </p>
|
|
|
- </template>
|
|
|
- <!-- 开户方式 -->
|
|
|
- <template #openMode>
|
|
|
- {{ oldData?.userinfoDetailVo.openMode }}
|
|
|
- </template>
|
|
|
- <!-- 申请人 -->
|
|
|
- <template #createName="{ value }">
|
|
|
- <span v-if="oldData?.userinfoDetailVo.openMode === 1">{{ value }}</span>
|
|
|
- <span v-else>{{ oldData?.userAccountDetailVo.accountName }}</span>
|
|
|
- </template>
|
|
|
- </app-table-details>
|
|
|
- <app-table-details :title="oldData?.userinfoDetailVo.userinfoType === UserInfoType.Personal ? '个人资料' : '企业资料'"
|
|
|
- :data="oldData?.userinfoDetailVo" :label-width="160" :cell-props="detailProps2" :column="2">
|
|
|
- <!-- 证件照正面 -->
|
|
|
- <template #cardFrontPhotoUrl="{ value }">
|
|
|
- <el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
- </template>
|
|
|
- <!-- 证件照反面 -->
|
|
|
- <template #cardBackPhotoUrl="{ value }">
|
|
|
- <el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
- </template>
|
|
|
- <!-- 通迅地址 -->
|
|
|
- <template #address="{ value }">
|
|
|
- {{ handleNoneValue(oldData?.userinfoDetailVo.pathName + value) }}
|
|
|
- </template>
|
|
|
- <!-- 法人身份证正面 -->
|
|
|
- <template #legalcardfrontphotourl="{ value }">
|
|
|
- <el-image :src="value" fit="cover" lazy style="width: 128px; height: 72px" />
|
|
|
- </template>
|
|
|
- <!-- 法人身份证反面 -->
|
|
|
- <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>
|
|
|
- </app-table-details>
|
|
|
- <template #footer>
|
|
|
- <el-button @click="onCancel(false)">关闭</el-button>
|
|
|
- </template>
|
|
|
- </app-drawer>
|
|
|
+ <DetailsView v-bind="{ userId: record.userId, modifyStatus: record.modifyStatus }" />
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref, PropType, computed } from 'vue'
|
|
|
-import { handleNoneValue, formatDate } from '@/filters'
|
|
|
-import { decryptAES } from '@/services/crypto'
|
|
|
-import { useEnum } from '@/hooks/enum'
|
|
|
-import { UserInfoType, getGenderName } from '@/constants/member'
|
|
|
-import { useRequest } from '@/hooks/request'
|
|
|
-import { queryInvestorListDetail } 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'
|
|
|
+import { PropType } from 'vue'
|
|
|
+import DetailsView from './view.vue'
|
|
|
|
|
|
-const props = defineProps({
|
|
|
+defineProps({
|
|
|
record: {
|
|
|
type: Object as PropType<Model.InvestorListRsp>,
|
|
|
required: true
|
|
|
}
|
|
|
})
|
|
|
-
|
|
|
-const show = ref(true)
|
|
|
-const refresh = ref(false)
|
|
|
-const loading = ref(false)
|
|
|
-const hideField = [2, 3, 4].includes(props.record.modifyStatus) // 根据状态是否隐藏字段
|
|
|
-const newData = ref<Model.InvestorListDetailRsp['newResult']>()
|
|
|
-const oldData = ref<Model.InvestorListDetailRsp['oldResult']>()
|
|
|
-
|
|
|
-// 是否实名
|
|
|
-const hasauthEnum = useEnum('hasauth')
|
|
|
-// 状态
|
|
|
-const areastatusEnum = useEnum('areastatus')
|
|
|
-// 变更状态
|
|
|
-const modifystatusEnum = useEnum('modifystatus')
|
|
|
-// 企业性质枚举
|
|
|
-const biznatureEnum = useEnum('biznature')
|
|
|
-// 个人证件类型
|
|
|
-const certypepersonEnum = useEnum('certypeperson')
|
|
|
-// 企业证件类型
|
|
|
-const certypecompanyEnum = useEnum('certypecompany')
|
|
|
-
|
|
|
-useRequest(queryInvestorListDetail, {
|
|
|
- params: {
|
|
|
- userid: props.record.userId,
|
|
|
- modifyFlag: props.record.modifyStatus
|
|
|
- },
|
|
|
- onSuccess: (res) => {
|
|
|
- const { newResult, oldResult } = res.data
|
|
|
- const baseUrl = service.getConfig('apiUrl')
|
|
|
- const getUrl = (value: string) => value && new URL(value, baseUrl).href
|
|
|
-
|
|
|
- if (newResult) {
|
|
|
- const detail = newResult.userinfoDetailVo
|
|
|
- detail.cardFrontPhotoUrl = getUrl(detail.cardFrontPhotoUrl)
|
|
|
- detail.cardBackPhotoUrl = getUrl(detail.cardBackPhotoUrl)
|
|
|
- detail.halfBodyPhotoUrl = getUrl(detail.halfBodyPhotoUrl)
|
|
|
- detail.legalCardFrontPhotoUrl = getUrl(detail.legalCardFrontPhotoUrl)
|
|
|
- detail.legalCardBackPhotoUrl = getUrl(detail.legalCardBackPhotoUrl)
|
|
|
- detail.otherUrl = getUrl(detail.otherUrl)
|
|
|
-
|
|
|
- detail.cardNum = decryptAES(detail.cardNum)
|
|
|
- detail.mobile = decryptAES(detail.mobile)
|
|
|
- detail.telPhone = decryptAES(detail.telPhone)
|
|
|
- detail.wechat = decryptAES(detail.wechat)
|
|
|
- detail.email = decryptAES(detail.email)
|
|
|
- }
|
|
|
- if (oldResult) {
|
|
|
- const detail = oldResult.userinfoDetailVo
|
|
|
- detail.cardFrontPhotoUrl = getUrl(detail.cardFrontPhotoUrl)
|
|
|
- detail.cardBackPhotoUrl = getUrl(detail.cardBackPhotoUrl)
|
|
|
- detail.halfBodyPhotoUrl = getUrl(detail.halfBodyPhotoUrl)
|
|
|
- detail.legalCardFrontPhotoUrl = getUrl(detail.legalCardFrontPhotoUrl)
|
|
|
- detail.legalCardBackPhotoUrl = getUrl(detail.legalCardBackPhotoUrl)
|
|
|
- detail.otherUrl = getUrl(detail.otherUrl)
|
|
|
-
|
|
|
- detail.cardNum = decryptAES(detail.cardNum)
|
|
|
- detail.mobile = decryptAES(detail.mobile)
|
|
|
- detail.telPhone = decryptAES(detail.telPhone)
|
|
|
- detail.wechat = decryptAES(detail.wechat)
|
|
|
- detail.email = decryptAES(detail.email)
|
|
|
- }
|
|
|
-
|
|
|
- newData.value = newResult
|
|
|
- oldData.value = oldResult
|
|
|
- }
|
|
|
-})
|
|
|
-
|
|
|
-const detailProps1: CellProp[] = [
|
|
|
- { prop: 'userId', label: '交易商代码:' },
|
|
|
- { prop: 'accountName', label: '交易商名称:' },
|
|
|
- { prop: 'memberUserName', label: '所属会员:' },
|
|
|
- { prop: 'parentUserName', label: '所属机构:' },
|
|
|
- { prop: 'openMode', label: '开户方式:' },
|
|
|
- { prop: 'createTime', label: '开户时间:', formatValue: (val) => formatDate(val) },
|
|
|
- { prop: 'createName', formatLabel: () => oldData.value?.userinfoDetailVo.openMode === 1 ? '开户人' : '申请人' },
|
|
|
- { prop: 'accountStatus', label: '机构状态:', formatValue: (val) => areastatusEnum.getEnumTypeName(val), show: !hideField },
|
|
|
- { prop: 'modifyStatus', label: '变更状态:', formatValue: (val) => modifystatusEnum.getEnumTypeName(val) },
|
|
|
- { prop: 'isAuth', label: '是否认证:', formatValue: (val) => hasauthEnum.getEnumTypeName(val) },
|
|
|
- { prop: 'modifyTime', label: '修改时间:', formatValue: (val) => formatDate(val) },
|
|
|
- { prop: 'modifyName', label: '修改人:' },
|
|
|
- { prop: 'auditTime', label: '审核时间:', formatValue: (val) => formatDate(val), show: !hideField },
|
|
|
- { prop: 'auditAccountName', label: '审核人:', show: !hideField },
|
|
|
- { prop: 'modifyRemark', label: '变更审核备注:', show: hideField },
|
|
|
-]
|
|
|
-
|
|
|
-const detailProps2 = computed<CellProp[]>(() => {
|
|
|
- const type = oldData.value?.userinfoDetailVo.userinfoType
|
|
|
- if (type === UserInfoType.Personal) {
|
|
|
- return [
|
|
|
- { prop: 'cardTypeId', label: '证件类型:', formatValue: (val) => certypepersonEnum.getEnumTypeName(val) },
|
|
|
- { prop: 'cardNum', label: '证件号码:' },
|
|
|
- { prop: 'company', label: '所属公司:' },
|
|
|
- { prop: 'sex', label: '性别:', formatValue: (val) => getGenderName(val) },
|
|
|
- { prop: 'mobile', label: '手机号:' },
|
|
|
- { prop: 'telPhone', label: '联系电话:' },
|
|
|
- { prop: 'address', label: '通迅地址:' },
|
|
|
- { prop: 'postalCode', label: '邮政编码:' },
|
|
|
- { prop: 'wechat', label: '微信:' },
|
|
|
- { prop: 'email', label: '邮箱:' },
|
|
|
- { prop: 'cardFrontPhotoUrl', label: '证件照正面:' },
|
|
|
- { prop: 'cardBackPhotoUrl', label: '证件照反面:' },
|
|
|
- { prop: 'remark', label: '备注:' },
|
|
|
- ]
|
|
|
- }
|
|
|
- if (type === UserInfoType.Company) {
|
|
|
- return [
|
|
|
- { prop: 'needInvoice', label: '是否需要发票:' },
|
|
|
- { prop: 'cardTypeId', label: '证件类型:', formatValue: (val) => certypecompanyEnum.getEnumTypeName(val) },
|
|
|
- { prop: 'cardNum', label: '证件号码:' },
|
|
|
- { prop: 'customerName', label: '企业名称:' },
|
|
|
- { prop: 'bizNature', label: '企业性质:', formatValue: (val) => biznatureEnum.getEnumTypeName(val) },
|
|
|
- { prop: 'legalPersonName', label: '法人姓名:' },
|
|
|
- { prop: 'contactName', label: '联系人:' },
|
|
|
- { prop: 'sex', label: '性别:', formatValue: (val) => getGenderName(val) },
|
|
|
- { prop: 'mobile', label: '手机号:' },
|
|
|
- { prop: 'telPhone', label: '联系电话:' },
|
|
|
- { prop: 'address', label: '通迅地址:' },
|
|
|
- { prop: 'postalCode', label: '邮政编码:' },
|
|
|
- { prop: 'email', label: '邮箱:' },
|
|
|
- { prop: 'wechat', label: '微信:' },
|
|
|
- { prop: 'cardFrontPhotoUrl', label: '营业执照:' },
|
|
|
- { prop: 'legalCardFrontPhotoUrl', label: '法人身份证正面照:' },
|
|
|
- { prop: 'legalCardBackPhotoUrl', label: '法人身份证背面照:' },
|
|
|
- { prop: 'otherUrl', label: '法人授权书:' },
|
|
|
- { prop: 'remark', label: '备注:' },
|
|
|
- ]
|
|
|
- }
|
|
|
- return []
|
|
|
-})
|
|
|
-
|
|
|
-const onCancel = (isRefresh = false) => {
|
|
|
- show.value = false
|
|
|
- refresh.value = isRefresh
|
|
|
-}
|
|
|
</script>
|