|
|
@@ -0,0 +1,91 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <Des :list="desList" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts">
|
|
|
+import { defineComponent, PropType, watchEffect } from 'vue';
|
|
|
+import { QueryCustomInfoType } from '@/services/go/ermcp/customInfo/interface';
|
|
|
+import { getStatusName } from '@/common/constants/enumsName';
|
|
|
+import { formatValue } from '@/common/methods';
|
|
|
+import { getCardTypeEnumItemName } from '@/common/constants/enumsName';
|
|
|
+import { Des, handleDesList } from '@/common/components/commonDes';
|
|
|
+import { handlePreviewImg } from '@/common/setup/upload';
|
|
|
+
|
|
|
+export default defineComponent({
|
|
|
+ name: 'custom-detail-desc',
|
|
|
+ components: { Des },
|
|
|
+ props: {
|
|
|
+ selectedRow: {
|
|
|
+ type: Object as PropType<QueryCustomInfoType>,
|
|
|
+ default: {},
|
|
|
+ },
|
|
|
+ },
|
|
|
+ setup(props) {
|
|
|
+ function isPersonal() {
|
|
|
+ return props.selectedRow.userinfotype === '1';
|
|
|
+ }
|
|
|
+ const { desList, getDesList } = handleDesList();
|
|
|
+ // 预览附件
|
|
|
+ const { previewVisible, previewImage, cancelImg, previewImg, getImgName } = handlePreviewImg();
|
|
|
+
|
|
|
+ watchEffect(() => {
|
|
|
+ if (props.selectedRow.customername) {
|
|
|
+ const data = props.selectedRow;
|
|
|
+ // 个人
|
|
|
+ const person = [
|
|
|
+ { label: '客户类型', value: '个人' },
|
|
|
+ { label: '姓名', value: data.customername },
|
|
|
+ { label: '身份证号码', value: formatValue(data.cardnum) },
|
|
|
+ { label: '手机号码', value: formatValue(data.mobile) },
|
|
|
+ { label: '身份证正面照', value: formatValue(getImgName(data.cardfrontphotourl)), className: 'blue' },
|
|
|
+ { label: '身份证反面照', value: formatValue(getImgName(data.cardbackphotourl)), className: 'blue' },
|
|
|
+ { label: '邮箱', value: formatValue(data.email) },
|
|
|
+ { label: '联系电话', value: formatValue(data.telphone) },
|
|
|
+ { label: '通讯地址', value: formatValue(data.address) },
|
|
|
+ { label: '备注', value: formatValue(data.remark) },
|
|
|
+ ];
|
|
|
+ // 企业
|
|
|
+ const company = [
|
|
|
+ { label: '客户类型', value: '企业' },
|
|
|
+ { label: '企业名称', value: data.customername },
|
|
|
+ { label: '企业简称', value: formatValue(data.nickname) },
|
|
|
+ { label: '证件类型', value: getCardTypeEnumItemName(data.cardtype) },
|
|
|
+ { label: '法定代表人', value: formatValue(data.legalpersonname) },
|
|
|
+ { label: '证件号码', value: formatValue(data.cardnum) },
|
|
|
+ { label: '纳税人识别号', value: formatValue(data.taxpayernum) },
|
|
|
+ { label: '营业执照', value: formatValue(getImgName(data.attachment1)), className: 'blue' },
|
|
|
+ { label: '联系人', value: formatValue(data.contactname) },
|
|
|
+ { label: '联系人手机号', value: formatValue(data.mobile) },
|
|
|
+ { label: '联系电话', value: formatValue(data.telphone) },
|
|
|
+ { label: '状态', value: getStatusName(data.status), className: 'green' },
|
|
|
+ { label: '通讯地址', value: formatValue(data.address) },
|
|
|
+ { label: '备注', value: formatValue(data.remark) },
|
|
|
+ ];
|
|
|
+ getDesList(isPersonal() ? person : company);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return {
|
|
|
+ desList,
|
|
|
+ previewVisible,
|
|
|
+ previewImage,
|
|
|
+ cancelImg,
|
|
|
+ };
|
|
|
+ },
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+.custom-detail {
|
|
|
+ .ant-form.inlineForm {
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+ .upload {
|
|
|
+ .look {
|
|
|
+ margin-left: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>;
|