Commit d1ab312c by yuzhenWang

Merge branch 'feature-20250827wyz-写业务' into 'test'

Feature 20250827wyz 写业务

See merge request !35
parents ef6e03ce 6bbe241c
...@@ -143,6 +143,14 @@ export function getInsuranceCompany(data) { ...@@ -143,6 +143,14 @@ export function getInsuranceCompany(data) {
method: 'post' method: 'post'
}) })
} }
// 获取保险险种列表
export function getInsuranceCategory(data) {
return request({
url: '/insurance/base/api/insuranceCategory/page',
data: data,
method: 'post'
})
}
// 通用excel导入 // 通用excel导入
export function importExcel(data) { export function importExcel(data) {
return request({ return request({
...@@ -151,4 +159,41 @@ export function importExcel(data) { ...@@ -151,4 +159,41 @@ export function importExcel(data) {
data: data data: data
}) })
} }
// 上传获取材料列表
export function uploadMaterialList(data) {
return request({
url: '/oss/api/material/list',
data: data,
method: 'post'
})
}
// 删除上传文件
export function delUploadFile(fileBizId) {
return request({
url: `/oss/api/ossFile/del?fileBizId=${fileBizId}`,
method: 'delete'
})
}
// 上传获取材料列表2
export function uploadRelObjectMaterialList(data) {
return request({
url: '/oss/api/relObjectMaterial/page',
data: data,
method: 'post'
})
}
// 删除材料
export function delMaterial(relObjectMaterialBizId) {
return request({
url: `/oss/api/relObjectMaterial/del?relObjectMaterialBizId=${relObjectMaterialBizId}`,
method: 'delete'
})
}
// 获取文件详情
export function uploadOssFileList(data) {
return request({
url: '/oss/api/ossFile/list',
data: data,
method: 'post'
})
}
const beneficiary = [ const beneficiary = [
{ {
bigTitle: '受益人', fatherTitle: '是否法定受益人',
deleteIcon: true, keyType: 'Object', //用于表单收集值时,判断是数组还是对象
id: 1, //唯一标识,用于删除 key: 'isLegalBeneficiary',
children: [ anchorKey: 'isLegalBeneficiary',
// 客户信息 此模块始终展示
{
fatherTitle: '客户信息',
type: 'object',
key: 'customer',
showMoudle: true, //模块是否展示 showMoudle: true, //模块是否展示
showTable: false, //是否展示表格
fatherRequired: true, //父级必填,代表个人资料这个模块有必填项
data: [ data: [
{ {
label: '客户类型', label: '是否法定受益人',
key: 'customerType', key: 'isLegalBeneficiary',
customerKey: 'customerType',
domType: 'Select', domType: 'Select',
required: true, required: true,
disabled: false, disabled: false,
placeholder: '请选择', placeholder: '请选择',
dictType: 'csf_customer_type', dictType: 'sys_no_yes',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
},
{
label: '与受保人关系',
key: 'insurantRel',
domType: 'Select',
required: true,
disabled: false,
placeholder: '请选择',
dictType: 'csf_ap_rel',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
...@@ -42,191 +24,75 @@ const beneficiary = [ ...@@ -42,191 +24,75 @@ const beneficiary = [
} }
] ]
}, },
// 基础信息 //受益人
{ {
fatherTitle: '基础信息', showMoudle: false, //模块是否展示
type: 'object', fatherTitle: '受益人',
key: 'person', keyType: 'Array', //用于表单收集值时,判断是数组还是对象
labelPosition: 'top', //标签的位置 key: 'apiBeneficiaryInfoDtoList',
showMoudle: true, //模块是否展示 anchorKey: 'apiBeneficiaryInfoDtoList',
// description: '证件信息至少填写一项', fatherRequired: true, //父级必填,代表个人资料这个模块有必填项
data: [ addChildren: true,
addChildrenTxt: '新增受益人',
showTable: true, //是否展示表格
columns: [
{ {
label: '名字', label: '与受保人关系',
key: 'name', prop: 'insurantRelName',
customerKey: 'name', type: 'text'
domType: 'Input',
inputType: 'text',
required: false,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '名字-英文', label: '姓名(中文)',
key: 'nameEn', prop: 'nameCn',
customerKey: 'firstNamePinyin', type: 'text'
showEn: true, //是否填写英文
domType: 'Input',
inputType: 'text',
required: true,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '性别', label: '姓名(拼音/英文)',
key: 'gender', prop: 'namePyEn',
customerKey: 'gender', type: 'text'
domType: 'Select',
required: true,
disabled: false,
placeholder: '请选择',
dictType: 'sys_gender',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '证件类型', label: '证件类型',
key: 'documentType', prop: 'documentTypeName',
customerKey: 'idType', type: 'text'
domType: 'Select',
required: true,
disabled: false,
placeholder: '请选择',
dictType: 'csf_id_type',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '证件号码', label: '证件号码',
key: 'idNumber', prop: 'idNumber',
customerKey: 'idCard', type: 'text'
domType: 'Input',
inputType: 'number',
required: true,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '出生日期', label: '性别',
key: 'birthTime', prop: 'genderName',
customerKey: 'birthdate', type: 'text'
domType: 'DatePicker',
required: false,
disabled: false,
placeholder: '请选择',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}
]
},
// 公司信息
{
fatherTitle: '公司信息',
type: 'object',
key: 'company',
labelPosition: 'top', //标签的位置
showMoudle: false, //模块是否展示
data: [
{
label: '公司名称',
key: 'companyName',
customerKey: '',
domType: 'Input',
inputType: 'text',
required: true,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '公司名称(英文)', label: '出生日期',
key: 'companyNameEn', prop: 'birthday',
customerKey: 'companyNameEn', type: 'text'
showEn: true, //是否填写英文
domType: 'Input',
inputType: 'text',
required: true,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '公司商业登记号码', label: '国籍',
key: 'companyBusinessNo', prop: 'nationality',
customerKey: 'companyBusinessNo', type: 'text'
domType: 'Input',
inputType: 'text',
required: true,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}, },
{ {
label: '公司注册日期', label: '受益比例',
key: 'companyRegisterTime', prop: 'benefitRatio',
customerKey: '', type: 'text'
domType: 'DatePicker', }
required: true, ],
disabled: false, data: [],
placeholder: '请选择', // 弹窗表单的配置
show: true, formItem: [
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
},
{ {
label: '公司注册地区', label: '与受保人关系',
key: 'companyRegisterRegion', key: 'insurantRel',
customerKey: '',
domType: 'Select', domType: 'Select',
required: true, required: false,
disabled: false, disabled: false,
placeholder: '请选择', placeholder: '请选择',
dictType: 'csf_ap_registration', dictType: 'csf_ap_rel',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
...@@ -234,76 +100,55 @@ const beneficiary = [ ...@@ -234,76 +100,55 @@ const beneficiary = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '公司电话', label: '名字(中文)',
key: 'companyMobile', key: 'nameCn',
customerKey: '',
domType: 'arrowRight',
required: true,
disabled: false,
placeholder: '请填写',
show: true,
drawerType: 'phone',
companyMobile: {}, //带有区号得电话一定要有一个和key一样得对象用于收集区号和号码
code: 'companyMobileCode',
maxLength: 20,
labelPosition: 'top', //标签的位置
labelWidth: '180px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
},
{
label: '公司邮箱',
key: 'companyEmail',
customerKey: '',
domType: 'Input', domType: 'Input',
unit: '历史客户',
unitColor: 'rgba(0, 82, 217, 1)',
inputType: 'text', inputType: 'text',
required: false, required: false,
maxLength: 20, maxLength: 15,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入2~6位汉字',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '公司登记地址', label: '姓名(拼音/英文)',
key: 'companyEnterAddress', key: 'namePyEn',
customerKey: '', domType: 'Input',
domType: 'arrowRight', inputType: 'text',
required: false, required: false,
maxLength: 30,
disabled: false, disabled: false,
placeholder: '请填写', placeholder: '请输入',
show: true, show: true,
drawerType: 'address',
companyEnterAddress: {},
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '通讯地址', label: '证件类型',
key: 'txAddress', key: 'documentType',
customerKey: '', domType: 'Select',
domType: 'arrowRight',
required: false, required: false,
disabled: false, disabled: false,
placeholder: '请填写', placeholder: '请选择',
dictType: 'csf_id_type',
show: true, show: true,
drawerType: 'address',
txAddress: {},
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '授权代表姓名中文-名字', label: '证件号码',
key: 'authNameCn', key: 'idNumber',
customerKey: '',
domType: 'Input', domType: 'Input',
inputType: 'text', inputType: 'text',
required: false, required: false,
...@@ -316,17 +161,15 @@ const beneficiary = [ ...@@ -316,17 +161,15 @@ const beneficiary = [
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '授权代表姓名英文-名字', label: '性别',
key: 'authNameEn', key: 'gender',
customerKey: '', domType: 'Select',
showEn: true, //是否填写英文
domType: 'Input',
inputType: 'text',
required: false, required: false,
maxLength: 20,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请选择',
dictType: 'sys_gender',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
...@@ -334,15 +177,12 @@ const beneficiary = [ ...@@ -334,15 +177,12 @@ const beneficiary = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '授权代表职称', label: '生日',
key: 'authProfessional', key: 'birthday',
customerKey: '', domType: 'DatePicker',
domType: 'Input',
inputType: 'text',
required: false, required: false,
maxLength: 20,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请选择',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
...@@ -350,65 +190,33 @@ const beneficiary = [ ...@@ -350,65 +190,33 @@ const beneficiary = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '授权代表电话', label: '国籍(国家/地区)',
key: 'authMobile', key: 'nationality',
customerKey: '',
domType: 'arrowRight', domType: 'arrowRight',
required: false, required: false,
disabled: false, disabled: false,
placeholder: '请填写', placeholder: '请填写',
show: true, show: true,
drawerType: 'phone', drawerType: 'country',
authMobile: {}, //带有区号得电话一定要有一个和key一样得对象用于收集区号和号码
code: 'authMobileCode',
maxLength: 20,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '180px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}
]
}, },
// 其他信息
{
fatherTitle: '其他信息',
type: 'object',
key: 'customer',
showMoudle: true, //模块是否展示
data: [
{ {
label: '受益比例(%)', label: '受益比例',
key: 'benefitRatio', key: 'benefitRatio',
customerKey: 'idCard',
domType: 'Input', domType: 'Input',
inputType: 'number', inputType: 'number',
required: false, required: false,
maxLength: 20, maxLength: 300,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入受益比例',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
},
{
label: '备注',
key: 'remark',
customerKey: 'idCard',
domType: 'Input',
inputType: 'textarea',
required: false,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 24, //栅格布局份数
lg: 24 //栅格布局份数
}
]
} }
] ]
} }
......
...@@ -62,14 +62,14 @@ const fnaForm = [ ...@@ -62,14 +62,14 @@ const fnaForm = [
} }
], ],
data: [ data: [
{ // {
brokerName: '', // brokerName: '',
brokerGender: '', // brokerGender: '',
brokerNumber: '', // brokerNumber: '',
brokerTeam: '', // brokerTeam: '',
brokerRatio: '', // brokerRatio: '',
remark: '' // remark: ''
} // }
] ]
}, },
// 受供养人信息 // 受供养人信息
...@@ -105,10 +105,10 @@ const fnaForm = [ ...@@ -105,10 +105,10 @@ const fnaForm = [
} }
], ],
data: [ data: [
{ // {
policyholderRel: '', // policyholderRel: '',
dependantAge: '' // dependantAge: ''
} // }
] ]
}, },
// 已生效仍在缴费期的保单情况 // 已生效仍在缴费期的保单情况
...@@ -157,24 +157,24 @@ const fnaForm = [ ...@@ -157,24 +157,24 @@ const fnaForm = [
type: 'datePicker', type: 'datePicker',
placeholder: '请选择日期', placeholder: '请选择日期',
required: true required: true
} },
// 有重疾险才让填写 // 有重疾险才让填写
// {
// label: '保额',
// prop: 'sumInsured',
// type: 'inputNumber',
// placeholder: '请输入保额',
// required: true
// },
],
data: [
{ {
insurer: '', label: '保额(重疾险填写)',
insuranceType: '', prop: 'sumInsured',
sumInsured: '', type: 'inputNumber',
currency: '', placeholder: '请输入保额',
policyIssueDate: '' required: true
} }
],
data: [
// {
// insurer: '',
// insuranceType: '',
// sumInsured: '',
// currency: '',
// policyIssueDate: ''
// }
] ]
}, },
// 不动产信息 // 不动产信息
...@@ -225,18 +225,18 @@ const fnaForm = [ ...@@ -225,18 +225,18 @@ const fnaForm = [
} }
], ],
data: [ data: [
{ // {
propertyType: '', // propertyType: '',
address: '', // address: '',
marketValue: '', // marketValue: '',
currency: '' // currency: ''
} // }
] ]
}, },
// 保费负担能力评估 // 保费负担能力评估
{ {
fatherTitle: '保费负担能力评估', fatherTitle: '保费负担能力评估',
type: 'object', keyType: 'Object',
key: 'premiumAffordability', key: 'premiumAffordability',
anchorKey: 'premiumAffordability', anchorKey: 'premiumAffordability',
showTable: false, showTable: false,
......
import { anchorKey } from 'element-plus/es/components/anchor/src/constants.mjs'
const productPlan = [ const productPlan = [
{ {
fatherTitle: '基础信息', fatherTitle: '基础信息',
...@@ -29,6 +27,7 @@ const productPlan = [ ...@@ -29,6 +27,7 @@ const productPlan = [
key: 'insuranceTypeName', key: 'insuranceTypeName',
domType: 'SearchSelect', domType: 'SearchSelect',
required: true, required: true,
maxLength: 30, maxLength: 30,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入',
...@@ -57,7 +56,6 @@ const productPlan = [ ...@@ -57,7 +56,6 @@ const productPlan = [
key: 'issueNumber', key: 'issueNumber',
domType: 'Select', domType: 'Select',
required: true, required: true,
disabled: false,
placeholder: '请选择', placeholder: '请选择',
dictType: 'issueNumber', dictType: 'issueNumber',
show: true, show: true,
...@@ -71,7 +69,7 @@ const productPlan = [ ...@@ -71,7 +69,7 @@ const productPlan = [
key: 'guaranteePeriod', key: 'guaranteePeriod',
domType: 'Input', domType: 'Input',
inputType: 'number', inputType: 'number',
required: true, required: false,
maxLength: 20, maxLength: 20,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入',
...@@ -95,21 +93,7 @@ const productPlan = [ ...@@ -95,21 +93,7 @@ const productPlan = [
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{
label: '保单额度(重疾)',
key: 'sumInsured',
domType: 'Input',
inputType: 'number',
required: false,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
},
{ {
label: '付款频率', label: '付款频率',
key: 'paymentFrequency', key: 'paymentFrequency',
...@@ -251,36 +235,22 @@ const productPlan = [ ...@@ -251,36 +235,22 @@ const productPlan = [
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
},
{
label: '保单额度(重疾)',
key: 'sumInsured',
domType: 'Input',
inputType: 'number',
required: false,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: false,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
} }
// {
// label: '地区',
// key: 'region',
// domType: 'Input',
// inputType: 'text',
// required: false,
// maxLength: 20,
// disabled: true,
// placeholder: '请输入',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '保单生效日',
// key: 'policyEffectiveDate',
// domType: 'DatePicker',
// required: false,
// disabled: false,
// placeholder: '请选择',
// show: false,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// }
] ]
}, },
//附加险 //附加险
...@@ -294,135 +264,53 @@ const productPlan = [ ...@@ -294,135 +264,53 @@ const productPlan = [
addChildren: true, addChildren: true,
addChildrenTxt: '新增附加险', addChildrenTxt: '新增附加险',
showTable: true, //是否展示表格 showTable: true, //是否展示表格
data: [ data: [],
// { columns: [
// id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识 {
// span: 24, //栅格布局份数 label: '产品名称',
// childTitle: '附加险', prop: 'productLaunchNameValue',
// deleteBtn: true, type: 'text'
// children: [ },
// { {
// label: '产品名称', label: '供款期数',
// key: 'addProductName', prop: 'issueNumber',
// domType: 'SearchSelect', type: 'text'
// required: true, },
// maxLength: 30, {
// disabled: false, label: '保障年期',
// placeholder: '请输入', prop: 'guaranteePeriod',
// show: true, type: 'text'
// labelWidth: '120px', //标签宽度 },
// sm: 12, //栅格布局份数 {
// labelPosition: 'top', //标签的位置 label: '保单币种',
// lg: 8 //栅格布局份数 prop: 'policyCurrency',
// }, type: 'text'
// { },
// label: '保额', {
// key: 'sumInsured', label: '保单额度',
// domType: 'Input', prop: 'sumInsured',
// inputType: 'number', type: 'text'
// required: true, },
// maxLength: 300, {
// disabled: false, label: '每期保费',
// placeholder: '请输入', prop: 'eachIssuePremium',
// show: true, type: 'text'
// labelPosition: 'top', //标签的位置 },
// labelWidth: '120px', //标签宽度 {
// sm: 12, //栅格布局份数 label: '保障级别',
// lg: 8 //栅格布局份数 prop: 'protectionLevel',
// }, type: 'text'
// { },
// label: '保费', {
// key: 'premium', label: '自付额',
// domType: 'Input', prop: 'deductibles',
// inputType: 'number', type: 'text'
// required: true, },
// maxLength: 300, {
// disabled: false, label: '附加保障',
// placeholder: '请输入', prop: 'additionalSafeguards',
// show: true, type: 'text'
// labelPosition: 'top', //标签的位置 }
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '保障地区',
// key: 'guaranteeRegion',
// domType: 'Input',
// inputType: 'text',
// required: false,
// maxLength: 300,
// disabled: false,
// placeholder: '请输入',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '货币',
// key: 'currency',
// domType: 'Select',
// inputType: 'text',
// required: false,
// maxLength: 300,
// disabled: false,
// placeholder: '请输入',
// show: true,
// dictType: 'bx_currency_type',
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '等级',
// key: 'insuranceType',
// domType: 'Input',
// inputType: 'text',
// required: false,
// maxLength: 300,
// disabled: false,
// placeholder: '请输入',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '自付额',
// key: 'deductibles',
// domType: 'Input',
// inputType: 'number',
// required: false,
// maxLength: 300,
// disabled: false,
// placeholder: '请输入',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '附加保障',
// key: 'additionalSafeguards',
// domType: 'Input',
// inputType: 'textarea',
// required: false,
// maxLength: 300,
// disabled: false,
// placeholder: '请输入',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 24, //栅格布局份数
// lg: 24 //栅格布局份数
// }
// ]
// }
], ],
// 弹窗表单的配置 // 弹窗表单的配置
formItem: [ formItem: [
...@@ -499,7 +387,7 @@ const productPlan = [ ...@@ -499,7 +387,7 @@ const productPlan = [
maxLength: 300, maxLength: 300,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入',
show: true, show: false,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
......
const secondHolder = [ const secondHolder = [
// 基础信息
{ {
fatherTitle: '', fatherTitle: '是否有第二持有人',
type: 'object', keyType: 'Object', //用于表单收集值时,判断是数组还是对象
key: 'person', key: 'isSecond',
labelPosition: 'top', //标签的位置 anchorKey: 'isSecond',
showMoudle: true, //模块是否展示 showMoudle: true, //模块是否展示
// description: '证件信息至少填写一项', showTable: false, //是否展示表格
fatherRequired: true, //父级必填,代表个人资料这个模块有必填项
data: [
{
label: '是否有第二持有人',
key: 'isSecond',
domType: 'Select',
required: true,
disabled: false,
placeholder: '请选择',
dictType: 'sys_no_yes',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
}
]
},
//受益人
{
showMoudle: false, //模块是否展示
fatherTitle: '受益人',
keyType: 'Object', //用于表单收集值时,判断是数组还是对象
key: 'apiSecondHolderInfoDto',
anchorKey: 'apiSecondHolderInfoDto',
fatherRequired: true, //父级必填,代表个人资料这个模块有必填项
addChildren: true,
addChildrenTxt: '新增受益人',
showTable: false, //是否展示表格
data: [ data: [
{ {
label: '与受保人关系', label: '与受保人关系',
...@@ -23,30 +52,30 @@ const secondHolder = [ ...@@ -23,30 +52,30 @@ const secondHolder = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '名字', label: '名字(中文)',
key: 'name', key: 'nameCn',
customerKey: 'name',
domType: 'Input', domType: 'Input',
unit: '历史客户',
unitColor: 'rgba(0, 82, 217, 1)',
inputType: 'text', inputType: 'text',
required: false, required: false,
maxLength: 20, maxLength: 15,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入2~6位汉字',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '名字-英文', label: '姓名(拼音/英文)',
key: 'nameEn', key: 'namePyEn',
customerKey: 'firstNamePinyin',
showEn: true, //是否填写英文
domType: 'Input', domType: 'Input',
inputType: 'text', inputType: 'text',
required: false, required: false,
maxLength: 20, maxLength: 30,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入',
show: true, show: true,
...@@ -56,14 +85,13 @@ const secondHolder = [ ...@@ -56,14 +85,13 @@ const secondHolder = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '性别', label: '证件类型',
key: 'gender', key: 'documentType',
customerKey: 'gender',
domType: 'Select', domType: 'Select',
required: false, required: false,
disabled: false, disabled: false,
placeholder: '请选择', placeholder: '请选择',
dictType: 'sys_gender', dictType: 'csf_id_type',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
...@@ -71,29 +99,29 @@ const secondHolder = [ ...@@ -71,29 +99,29 @@ const secondHolder = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '出生日期', label: '证件号码',
key: 'birthTime', key: 'idNumber',
customerKey: 'birthdate', domType: 'Input',
domType: 'DatePicker', inputType: 'text',
required: false, required: false,
maxLength: 20,
disabled: false, disabled: false,
placeholder: '请选择', placeholder: '请输入',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '年龄', label: '性别',
key: 'age', key: 'gender',
customerKey: 'age', domType: 'Select',
domType: 'Input',
inputType: 'number',
required: false, required: false,
maxLength: 20, disabled: false,
disabled: true, placeholder: '请选择',
placeholder: '请输入', dictType: 'sys_gender',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
...@@ -101,30 +129,28 @@ const secondHolder = [ ...@@ -101,30 +129,28 @@ const secondHolder = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '证件类型', label: '生日',
key: 'documentType', key: 'birthday',
customerKey: 'idType', domType: 'DatePicker',
domType: 'Select',
required: false, required: false,
disabled: false, disabled: false,
placeholder: '请选择', placeholder: '请选择',
dictType: 'csf_id_type',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数 sm: 12, //栅格布局份数
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '证件号码', label: '受益比例',
key: 'idNumber', key: 'benefitRatio',
customerKey: 'idCard',
domType: 'Input', domType: 'Input',
inputType: 'number', inputType: 'number',
required: false, required: false,
maxLength: 20, maxLength: 300,
disabled: false, disabled: false,
placeholder: '请输入', placeholder: '请输入受益比例',
show: true, show: true,
labelPosition: 'top', //标签的位置 labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度 labelWidth: '120px', //标签宽度
......
...@@ -87,8 +87,10 @@ ...@@ -87,8 +87,10 @@
v-if="child.domType === 'Select'" v-if="child.domType === 'Select'"
v-model="form[child.key]" v-model="form[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
:data-key="child.key"
@change="handleSelectChange(child)" @change="handleSelectChange(child)"
:disabled="editStatus" :disabled="editStatus"
clearable
> >
<el-option <el-option
v-for="item in child.options" v-for="item in child.options"
...@@ -187,7 +189,6 @@ ...@@ -187,7 +189,6 @@
:disabled="editStatus" :disabled="editStatus"
>取消</el-button >取消</el-button
> >
<!-- @click="submitForm" -->
<el-button <el-button
type="primary" type="primary"
icon="Check" icon="Check"
...@@ -341,7 +342,8 @@ const props = defineProps({ ...@@ -341,7 +342,8 @@ const props = defineProps({
tabIndex: { type: [String, Number], default: '' }, //tab索引 tabIndex: { type: [String, Number], default: '' }, //tab索引
affixOffset: { type: Number, default: 250 }, //锚点吸顶距离 affixOffset: { type: Number, default: 250 }, //锚点吸顶距离
customerBizId: { type: String, default: '' }, //提交状态,新增、修改 customerBizId: { type: String, default: '' }, //提交状态,新增、修改
tabSource: { type: String, default: '' } //引用这个组件的页面来源,用于逻辑判断 tabSource: { type: String, default: '' },
idsObj: { type: Object, default: () => ({}) } //引用这个组件的页面来源,用于逻辑判断
}) })
const emit = defineEmits(['handleSuccess']) const emit = defineEmits(['handleSuccess'])
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
...@@ -361,6 +363,7 @@ const tableData = ref([]) ...@@ -361,6 +363,7 @@ const tableData = ref([])
const total = ref(0) const total = ref(0)
//计算默认显示的日期(18年前的今天) //计算默认显示的日期(18年前的今天)
const defaultDisplayDate = ref(dayjs().subtract(18, 'year').toDate()) const defaultDisplayDate = ref(dayjs().subtract(18, 'year').toDate())
// 地址组件菜单数据 // 地址组件菜单数据
const addressMenuList = ref([ const addressMenuList = ref([
{ {
...@@ -719,12 +722,6 @@ const processFormData = async () => { ...@@ -719,12 +722,6 @@ const processFormData = async () => {
] ]
} }
} }
// if (field.key === 'bmi') {
// rules.value[field.key] = [
// { required: false, trigger: 'change' },
// { validator: validateBMI,trigger: 'change' }
// ]
// }
} }
} }
} }
...@@ -734,12 +731,19 @@ const processFormData = async () => { ...@@ -734,12 +731,19 @@ const processFormData = async () => {
{ required: true, message: `与投保人关系不能为空`, trigger: 'blur' } { required: true, message: `与投保人关系不能为空`, trigger: 'blur' }
] ]
} }
if (props.customerBizId) { if (props.customerBizId && props.tabSource == 'customer') {
// 在客户资料中是编辑客户资料,需要回显客户资料
getCustomerInfo(props.customerBizId, processedData)
} else if (
props.customerBizId &&
(props.tabSource == 'policyholder' || props.tabSource == 'insurantInfo') &&
!props.idsObj.appointmentBizId
) {
//是投保人/受保人但是新增预约 需要引用客户资料的值
getCustomerInfo(props.customerBizId, processedData) getCustomerInfo(props.customerBizId, processedData)
} else { } else {
processedCustomerData.value = oldCustomerData.value = processedData processedCustomerData.value = oldCustomerData.value = processedData
} }
console.log('form', form.value)
} }
//弹出右侧抽屉 //弹出右侧抽屉
...@@ -899,6 +903,8 @@ const handleSelectChange = child => { ...@@ -899,6 +903,8 @@ const handleSelectChange = child => {
} }
break break
case 'policyholderRel': case 'policyholderRel':
// 强制同步:确保form.value.policyholderRel与当前选择的值一致
processedCustomerData.value.forEach(section => { processedCustomerData.value.forEach(section => {
if (form.value[child.key] == 'MYSELF') { if (form.value[child.key] == 'MYSELF') {
if (section.key == 'policyholderRel') { if (section.key == 'policyholderRel') {
...@@ -910,6 +916,8 @@ const handleSelectChange = child => { ...@@ -910,6 +916,8 @@ const handleSelectChange = child => {
section.showMoudle = true section.showMoudle = true
} }
}) })
console.log('下拉', form.value)
break break
default: default:
break break
...@@ -946,6 +954,9 @@ const setFormValue = (obj, formData, exportValue) => { ...@@ -946,6 +954,9 @@ const setFormValue = (obj, formData, exportValue) => {
phoneQuickList.value = [] phoneQuickList.value = []
// 深拷贝原始数据 // 深拷贝原始数据
form.value = JSON.parse(JSON.stringify(obj)) form.value = JSON.parse(JSON.stringify(obj))
if (props.activeName == 'insurantInfo' && !props.idsObj.appointmentBizId) {
form.value['policyholderRel'] = ''
}
// 深拷贝原始数据 // 深拷贝原始数据
const processedData = JSON.parse(JSON.stringify(formData)) const processedData = JSON.parse(JSON.stringify(formData))
for (const section of processedData) { for (const section of processedData) {
...@@ -1066,10 +1077,6 @@ const setFormValue = (obj, formData, exportValue) => { ...@@ -1066,10 +1077,6 @@ const setFormValue = (obj, formData, exportValue) => {
phoneQuickList.value = removeDuplicates(tempPhoneList, 'phoneString') phoneQuickList.value = removeDuplicates(tempPhoneList, 'phoneString')
addressQuickList.value = removeDuplicates(tempAddressList, 'addressString') addressQuickList.value = removeDuplicates(tempAddressList, 'addressString')
// if (!exportValue) {
// // 保存一份就得表单数据便于做撤销操作
// oldObjInfo.value = JSON.parse(JSON.stringify(form.value))
// }
processedCustomerData.value = processedData processedCustomerData.value = processedData
} }
// 数组去重 // 数组去重
...@@ -1136,59 +1143,38 @@ const resetShow = (key, status) => { ...@@ -1136,59 +1143,38 @@ const resetShow = (key, status) => {
} }
} }
// 方法1:使用 Promise 包装 validateField // 暴露一个同步获取数据的方法
const debugValidation = async () => { const getFormData = () => {
const fieldNames = Object.keys(rules.value) // 确保form对象包含所有必要的字段
console.log('开始验证以下字段:', fieldNames) const formData = { ...form.value }
// 1. 为每个字段创建验证Promise,并直接返回该字段的验证结果 // 如果policyholderRel不存在,尝试从select元素获取
const validationPromises = fieldNames.map(field => { if (!formData.hasOwnProperty('policyholderRel') || !formData.policyholderRel) {
return new Promise(resolve => { // 这里可以根据你的实际情况获取最新的值
if (!customerFormRef.value) { const selectElement = document.querySelector('[data-key="policyholderRel"]')
console.error(`[${field}] 表单实例不存在`) if (selectElement) {
resolve({ field, error: null, valid: false }) // 标记为无效 formData.policyholderRel = selectElement.value
return
} }
customerFormRef.value.validateField(field, errorMessage => {
console.log(`[${field}] 验证结果:`, errorMessage ? `失败 - ${errorMessage}` : '通过')
// 关键修改:只有当 errorMessage 存在(有错误)时,才携带错误信息
if (errorMessage) {
resolve({ field, error: errorMessage, valid: false })
} else {
resolve({ field, error: null, valid: true })
} }
})
})
})
// 2. 等待所有验证完成
const results = await Promise.all(validationPromises)
// 3. 筛选出所有验证失败的字段 return formData
const errors = results
.filter(result => !result.valid && result.error)
.map(result => ({ field: result.field, message: result.error }))
console.log('最终收集到的错误列表:', errors)
return errors
}
// 滚动到第一个错误字段
const scrollToFirstError = () => {
const firstError = document.querySelector('.el-form-item__error')
if (firstError) {
firstError.scrollIntoView({ behavior: 'smooth', block: 'center' })
}
} }
const handleFormValues = () => { //source:因为这个组件是公共组件所以提交的时候要知道是哪里要获取表单的值
const handleFormValues = source => {
return new Promise(async resolve => { return new Promise(async resolve => {
let submitObj = { ...form.value } let submitObj = {}
// 因为投保人没有policyholderRel的校验会影响 受保人,所以暂时先赋值处理
if (source == 'policyHolderInfoRef') {
form.value['policyholderRel'] = '111' //因为校验在form上所以这句不能去除
submitObj = { ...policyholderForm.value }
} else if (source == 'insuredInfoRef') {
submitObj = { ...insuredForm.value }
} else {
submitObj = { ...form.value }
}
let addressList = [] let addressList = []
submitObj['birthday'] = proxy.formatToDate(submitObj['birthday']) submitObj['birthday'] = proxy.formatToDate(submitObj['birthday'])
customerFormRef.value.validate((valid, fields) => { customerFormRef.value.validate((valid, fields) => {
if (valid) { if (valid) {
errorFields.value = [] // 清空错误信息 errorFields.value = [] // 清空错误信息
//处理表单数据 //处理表单数据
...@@ -1269,6 +1255,7 @@ const handleFormValues = () => { ...@@ -1269,6 +1255,7 @@ const handleFormValues = () => {
} }
}) })
} }
resolve(errorFields.value.length == 0 ? submitObj : null) resolve(errorFields.value.length == 0 ? submitObj : null)
} else { } else {
errorFields.value = getInvalidFields(fields) errorFields.value = getInvalidFields(fields)
...@@ -1289,10 +1276,22 @@ const anchorList = computed(() => { ...@@ -1289,10 +1276,22 @@ const anchorList = computed(() => {
} }
return data return data
}) })
const policyholderForm = ref({}) //投保人表单值
const insuredForm = ref({}) //受保人表单值
watch( watch(
() => props.activeName, () => form.value,
newVal => { newVal => {
if (props.activeName == 'policyholder') {
policyholderForm.value = JSON.parse(JSON.stringify(newVal))
} else if (props.activeName == 'insurantInfo') {
insuredForm.value = JSON.parse(JSON.stringify(newVal))
}
},
{ immediate: true, deep: true }
)
watch(
() => props.activeName,
(newVal, oldVal) => {
editStatus.value = false editStatus.value = false
customerRightRef.value = null customerRightRef.value = null
if (newVal === 'customer' || newVal === 'policyholder' || newVal === 'insurantInfo') { if (newVal === 'customer' || newVal === 'policyholder' || newVal === 'insurantInfo') {
...@@ -1304,6 +1303,12 @@ watch( ...@@ -1304,6 +1303,12 @@ watch(
editStatus.value = false editStatus.value = false
} }
} }
// 切换tab要保存各自的表单值
if (oldVal == 'policyholder') {
policyholderForm.value = JSON.parse(JSON.stringify(form.value))
} else if (oldVal == 'insurantInfo') {
insuredForm.value = JSON.parse(JSON.stringify(form.value))
}
} }
) )
watch( watch(
...@@ -1315,7 +1320,8 @@ watch( ...@@ -1315,7 +1320,8 @@ watch(
// 暴露给父组件 // 暴露给父组件
defineExpose({ defineExpose({
handleFormValues, handleFormValues,
handleEditStatus handleEditStatus,
getRawForm: () => JSON.parse(JSON.stringify(form.value))
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
<template> <template>
<div v-if="processedFanFormData.length > 0"> <div v-if="processedFanFormData.length > 0">
<div ref="fanContainerRef"> <div ref="fanContainerRef">
<!-- <el-row> <div class="editBtn">
<el-col :span="24">
<div class="topBtn">
<el-button <el-button
v-if="props.fnaFormBizId" v-if="props.fnaFormBizId && props.tabSource == 'fnaform'"
type="primary" type="primary"
icon="EditPen" icon="EditPen"
@click="handleEditStatus" @click="handleEditStatus"
>编辑</el-button >编辑</el-button
> >
</div> </div>
</el-col>
</el-row> -->
<CommonForm <CommonForm
:anchorList="anchorList" :anchorList="anchorList"
:affixOffset="250" :affixOffset="250"
...@@ -32,9 +29,12 @@ ...@@ -32,9 +29,12 @@
<template #mainTitCustom> <template #mainTitCustom>
<div <div
class="dependNum" class="dependNum"
v-if="father.key == 'dependantList' && father.data.length > 0" v-if="
father.key == 'dependantList' &&
father.data.filter(item => !item.unSave).length > 0
"
> >
受供养人数目:{{ father.data.length }} 受供养人数目:{{ father.data.filter(item => !item.unSave).length }}
</div> </div>
</template> </template>
<template #content> <template #content>
...@@ -48,7 +48,18 @@ ...@@ -48,7 +48,18 @@
? '' ? ''
: child.label : child.label
" "
:prop="child.key" :prop="father.key + '.' + child.key"
:rules="
child.required
? [
{
required: true,
message: `${child.label}不能为空`,
trigger: child.domType === 'Select' ? 'change' : 'blur'
}
]
: undefined
"
:key="child.key" :key="child.key"
:label-width="child.labelWidth" :label-width="child.labelWidth"
:label-position="child.labelPosition" :label-position="child.labelPosition"
...@@ -71,7 +82,7 @@ ...@@ -71,7 +82,7 @@
<el-input <el-input
v-if="child.domType === 'Input'" v-if="child.domType === 'Input'"
:type="child.inputType" :type="child.inputType"
v-model="child.value" v-model="form[father.key][child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
maxlength="30" maxlength="30"
:disabled="editStatus" :disabled="editStatus"
...@@ -82,7 +93,7 @@ ...@@ -82,7 +93,7 @@
</el-input> </el-input>
<el-select <el-select
v-if="child.domType === 'Select'" v-if="child.domType === 'Select'"
v-model="child.value" v-model="form[father.key][child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
@change="handleSelectChange(child)" @change="handleSelectChange(child)"
:disabled="editStatus" :disabled="editStatus"
...@@ -97,7 +108,7 @@ ...@@ -97,7 +108,7 @@
<el-date-picker <el-date-picker
style="width: 100%" style="width: 100%"
v-if="child.domType === 'DatePicker'" v-if="child.domType === 'DatePicker'"
v-model="child.value" v-model="form[father.key][child.key]"
type="date" type="date"
format="YYYY-MM-DD" format="YYYY-MM-DD"
value-format="YYYY-MM-DD" value-format="YYYY-MM-DD"
...@@ -110,7 +121,7 @@ ...@@ -110,7 +121,7 @@
<el-input <el-input
v-if="child.domType === 'arrowRight'" v-if="child.domType === 'arrowRight'"
v-model="child.value" v-model="form[father.key][child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
@click="handleFoucs(child)" @click="handleFoucs(child)"
:suffix-icon="ArrowRight" :suffix-icon="ArrowRight"
...@@ -120,7 +131,7 @@ ...@@ -120,7 +131,7 @@
</el-input> </el-input>
<el-checkbox-group <el-checkbox-group
v-if="child.domType === 'Checkbox'" v-if="child.domType === 'Checkbox'"
v-model="child.value" v-model="form[father.key][child.key]"
:disabled="editStatus" :disabled="editStatus"
> >
<template class="customCheckBox"> <template class="customCheckBox">
...@@ -136,9 +147,11 @@ ...@@ -136,9 +147,11 @@
style="width: 250px" style="width: 250px"
v-if=" v-if="
child.key === 'liquidAssetType' && child.key === 'liquidAssetType' &&
child.value.filter(item => item == 'G').length > 0 form[father.key][child.key] &&
form[father.key][child.key].filter(item => item == 'G')
.length > 0
" "
v-model="child.otherLiquidAsset" v-model="form[father.key]['otherLiquidAsset']"
placeholder="请输入说明" placeholder="请输入说明"
:disabled="editStatus" :disabled="editStatus"
/> />
...@@ -179,17 +192,29 @@ ...@@ -179,17 +192,29 @@
remote remote
reserve-keyword reserve-keyword
:placeholder="column.placeholder" :placeholder="column.placeholder"
:remote-method="query => searchSelectList(query, column.searchType)" :remote-method="
query => searchSelectList(query, column.searchType, scope.row)
"
:loading="searchLoadingStates[column.searchType]" :loading="searchLoadingStates[column.searchType]"
:disabled="editStatus" :disabled="editStatus"
@change="handleRemoteSelectChange(scope.row, column)" @change="handleRemoteSelectChange(scope.row, column, father)"
> >
<template v-if="column.searchType !== 'insuranceType'">
<el-option <el-option
v-for="item in searchOptions[column.searchType] || []" v-for="item in searchOptions[column.searchType] || []"
:key="item.id" :key="item.id"
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
/> />
</template>
<template v-else>
<el-option
v-for="item in scope.row.insuranceTypeOption || []"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</template>
</el-select> </el-select>
<!-- 普通选择框 --> <!-- 普通选择框 -->
...@@ -221,7 +246,20 @@ ...@@ -221,7 +246,20 @@
<!-- 数字输入框 --> <!-- 数字输入框 -->
<el-input <el-input
v-else-if="column.type === 'inputNumber'" v-else-if="
column.type === 'inputNumber' && !!scope.row.showSumInsured
"
v-model.number="scope.row[column.prop]"
:placeholder="column.placeholder"
:disabled="editStatus"
type="number"
>
<template v-if="column.unit" #append>
<span>{{ column.unit }}</span>
</template>
</el-input>
<el-input
v-else-if="column.type === 'inputNumber' && scope.row.showSumInsured"
v-model.number="scope.row[column.prop]" v-model.number="scope.row[column.prop]"
:placeholder="column.placeholder" :placeholder="column.placeholder"
:disabled="editStatus" :disabled="editStatus"
...@@ -231,10 +269,9 @@ ...@@ -231,10 +269,9 @@
<span>{{ column.unit }}</span> <span>{{ column.unit }}</span>
</template> </template>
</el-input> </el-input>
<!-- 普通输入框(默认) --> <!-- 普通输入框(默认) -->
<el-input <el-input
v-else v-else-if="column.prop !== 'sumInsured'"
v-model="scope.row[column.prop]" v-model="scope.row[column.prop]"
:placeholder="column.placeholder" :placeholder="column.placeholder"
:disabled="editStatus" :disabled="editStatus"
...@@ -243,13 +280,27 @@ ...@@ -243,13 +280,27 @@
</el-table-column> </el-table-column>
<!-- 操作列(固定) --> <!-- 操作列(固定) -->
<el-table-column width="60px" align="center" label="操作"> <el-table-column
:width="father.key == 'dependantList' ? 150 : 80"
align="center"
label="操作"
>
<template #default="scope"> <template #default="scope">
<el-icon <el-button
class="deleteIcon" type="primary"
size="small"
v-if="father.key == 'dependantList'"
@click="saveTableData(father, scope.row)"
>
{{ scope.row.unSave ? '未保存' : '已保存' }}
</el-button>
<el-button
type="danger"
size="small"
@click="deleteChildren(father, scope.$index)" @click="deleteChildren(father, scope.$index)"
><Delete >
/></el-icon> 删除
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -295,7 +346,12 @@ import useDictStore from '@/store/modules/dict' ...@@ -295,7 +346,12 @@ import useDictStore from '@/store/modules/dict'
import fanFormDomData from '@/formJson/fnaForm' import fanFormDomData from '@/formJson/fnaForm'
import { watch, nextTick } from 'vue' import { watch, nextTick } from 'vue'
import { addfanForm, getfanFormDetail, editFanForm, getCustomerList } from '@/api/sign/fna' import { addfanForm, getfanFormDetail, editFanForm, getCustomerList } from '@/api/sign/fna'
import { getUserSaleExpandList, getAllTeam, getInsuranceCompany } from '@/api/common' import {
getUserSaleExpandList,
getAllTeam,
getInsuranceCompany,
getInsuranceCategory
} from '@/api/common'
import useUserStore from '@/store/modules/user' import useUserStore from '@/store/modules/user'
const userStore = useUserStore() const userStore = useUserStore()
const dictStore = useDictStore() //获取字典数据 const dictStore = useDictStore() //获取字典数据
...@@ -307,7 +363,8 @@ const props = defineProps({ ...@@ -307,7 +363,8 @@ const props = defineProps({
customerBizId: { type: String, default: '' }, //提交状态,新增、修改 customerBizId: { type: String, default: '' }, //提交状态,新增、修改
dictTypeLists: { type: Array, default: () => [] }, //多个字典值数据 dictTypeLists: { type: Array, default: () => [] }, //多个字典值数据
anchorContainer: { type: String, default: '' }, //锚点滚动容器 anchorContainer: { type: String, default: '' }, //锚点滚动容器
tabIndex: { type: [String, Number], default: '' } //tab索引 tabIndex: { type: [String, Number], default: '' }, //tab索引
tabSource: { type: String, default: '' } //引用这个组件的页面来源,用于逻辑判断
}) })
const emit = defineEmits(['handleSuccess']) const emit = defineEmits(['handleSuccess'])
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
...@@ -342,14 +399,37 @@ const { ...@@ -342,14 +399,37 @@ const {
tempFanFormValue, tempFanFormValue,
tempFanFormData tempFanFormData
} = toRefs(data) } = toRefs(data)
const handleRemoteSelectChange = (row, column) => { const handleRemoteSelectChange = async (row, column, father) => {
console.log(row, column) console.log(row, column)
// 通过保险公司查保险种类 row中收集了insurer的值 // 通过保险公司查保险种类 row中收集了insurer的值
if (column.prop == 'insurer') { if (column.prop == 'insurer') {
const params1 = {
pageNo: 1,
pageSize: 10
}
const response1 = await getInsuranceCategory(params1)
if (response1.code == 200) {
response1.data.records = response1.data.records.map(item => {
return {
...item,
label: item.name,
value: item.insuranceCategoryBizId
}
})
row.insuranceTypeOption = response1.data.records
}
}
if (column.prop == 'insuranceType' && row.insuranceType) {
//如果险种选择了重疾险,则显示重疾险的输入框
row.insuranceTypeOption.forEach(item => {
if (item.value == row.insuranceType && item.code == 'CI') {
row.showSumInsured = true
}
})
} }
} }
// 搜索方法 // 搜索方法
const searchSelectList = async (query, fieldKey) => { const searchSelectList = async (query, fieldKey, row) => {
// 设置该字段的加载状态 // 设置该字段的加载状态
searchLoadingStates.value[fieldKey] = true searchLoadingStates.value[fieldKey] = true
let queryString = query.trim() let queryString = query.trim()
...@@ -406,6 +486,31 @@ const searchSelectList = async (query, fieldKey) => { ...@@ -406,6 +486,31 @@ const searchSelectList = async (query, fieldKey) => {
}) })
searchOptions.value[fieldKey] = response9.data.records searchOptions.value[fieldKey] = response9.data.records
} }
} else if (fieldKey == 'insuranceType') {
if (!row.insurer) {
proxy.$modal.confirm(`请先选择保险公司`, {
showCancel: '0',
title: '填写提示'
})
row.insuranceType = ''
return
}
const params1 = {
pageNo: 1,
pageSize: 10,
name: queryString
}
const response1 = await getInsuranceCategory(params1)
if (response1.code == 200) {
response1.data.records = response1.data.records.map(item => {
return {
...item,
label: item.name,
value: item.insuranceCategoryBizId
}
})
row.insuranceTypeOption = response1.data.records
}
} }
} catch (error) { } catch (error) {
console.error(`${fieldKey} 搜索失败`, error) console.error(`${fieldKey} 搜索失败`, error)
...@@ -450,46 +555,21 @@ const processFormData = async () => { ...@@ -450,46 +555,21 @@ const processFormData = async () => {
rules.value[section.key] = {} rules.value[section.key] = {}
} }
//给表单赋值各模块key,对应表单的father.key便于收集值 //给表单赋值各模块key,对应表单的father.key便于收集值
if (section.keyType == 'Array') { if (section.keyType == 'Object') {
form.value[section.key] = []
if (section.key == 'familyMembers') {
form.value[section.key] = section.data
}
} else if (section.keyType == 'Object') {
form.value[section.key] = {} form.value[section.key] = {}
} }
if (section.data) { if (section.data) {
for (const field of section.data) { for (const field of section.data) {
// 为下拉搜索框加options
// if (field.domType == 'SearchSelect') {
// if (field.key == 'accountName') {
// searchOptions.value[field.key] = dictStore.tenantUserList
// }
// }
if (field.dictType) { if (field.dictType) {
// 获取字典数据 // 获取字典数据
field.options = fetchDictData(field.dictType) field.options = fetchDictData(field.dictType)
if (field.dictType == 'sys_no_yes') {
noYesList.value = field.options
}
}
if (field.required) {
rules.value[field.key] = [
{ required: true, message: `${field.label}不能为空`, trigger: 'blur' }
]
}
if (props.fnaFormBizId) {
field.disabled = true
} else {
field.disabled = false
} }
} }
} }
} }
if (props.fnaFormBizId) { if (props.fnaFormBizId) {
// getFanformInfo(props.fnaFormBizId, processedData) getFanformInfo(props.fnaFormBizId, processedData)
// editStatus.value = true editStatus.value = true
} else { } else {
// tab切走在切回来时,表单会重置,所以这里需要把表单的值赋回去 // tab切走在切回来时,表单会重置,所以这里需要把表单的值赋回去
if (Object.keys(tempFanFormValue.value).length > 0) { if (Object.keys(tempFanFormValue.value).length > 0) {
...@@ -504,7 +584,6 @@ const processFormData = async () => { ...@@ -504,7 +584,6 @@ const processFormData = async () => {
} }
editStatus.value = false editStatus.value = false
loading.value = false loading.value = false
console.log('processedFanFormData.value', processedFanFormData.value)
} }
processedFanFormData.value = oldFanFormData.value = processedData processedFanFormData.value = oldFanFormData.value = processedData
} }
...@@ -522,15 +601,16 @@ const addChildren = father => { ...@@ -522,15 +601,16 @@ const addChildren = father => {
let obj2 = { let obj2 = {
id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识 id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识
policyholderRel: '', policyholderRel: '',
dependantAge: '' dependantAge: '',
unSave: true //新增受供养人的时候是未保存状态
} }
let obj3 = { let obj3 = {
id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识 id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识
insurer: '', insurer: '',
insuranceType: '', insuranceType: '',
sumInsured: '',
currency: '', currency: '',
policyIssueDate: '' policyIssueDate: '',
showSumInsured: false //重疾险显示保额输入框
} }
let obj4 = { let obj4 = {
propertyType: '', propertyType: '',
...@@ -544,7 +624,14 @@ const addChildren = father => { ...@@ -544,7 +624,14 @@ const addChildren = father => {
section.data.push(obj1) section.data.push(obj1)
} }
if (father.key == 'dependantList' && section.key == father.key) { if (father.key == 'dependantList' && section.key == father.key) {
if (father.data.length == 0 || father.data.filter(item => item.unSave).length == 0) {
section.data.push(obj2) section.data.push(obj2)
} else if (father.data.filter(item => item.unSave).length > 0) {
proxy.$modal.confirm(`请先保存‘新增的受供养人’信息再添加`, {
showCancel: '0',
title: '填写提示'
})
}
} }
if (father.key == 'existingSecurityOwner' && section.key == father.key) { if (father.key == 'existingSecurityOwner' && section.key == father.key) {
section.data.push(obj3) section.data.push(obj3)
...@@ -555,6 +642,7 @@ const addChildren = father => { ...@@ -555,6 +642,7 @@ const addChildren = father => {
} }
processedFanFormData.value = processedData processedFanFormData.value = processedData
} }
const deleteChildren = (father, childIndex) => { const deleteChildren = (father, childIndex) => {
if (editStatus.value) { if (editStatus.value) {
proxy.$modal.confirm(`请先点击编辑再进行删除操作`, { showCancel: '0', title: '填写提示' }) proxy.$modal.confirm(`请先点击编辑再进行删除操作`, { showCancel: '0', title: '填写提示' })
...@@ -562,31 +650,33 @@ const deleteChildren = (father, childIndex) => { ...@@ -562,31 +650,33 @@ const deleteChildren = (father, childIndex) => {
} }
const processedData = JSON.parse(JSON.stringify(processedFanFormData.value)) const processedData = JSON.parse(JSON.stringify(processedFanFormData.value))
for (const section of processedData) { for (const section of processedData) {
if (father.key == 'familyMembers' && section.key == father.key) { if (father.key == 'brokerList' && section.key == father.key) {
section.data.splice(childIndex, 1) section.data.splice(childIndex, 1)
} }
if (father.key == 'taxList' && section.key == father.key) { if (father.key == 'dependantList' && section.key == father.key) {
section.data.splice(childIndex, 1) section.data.splice(childIndex, 1)
} }
if ( if (father.key == 'existingSecurityOwner' && section.key == father.key) {
(father.key == 'existingSecurityOwner' || father.key == 'existingSecurityInsured') &&
section.key == father.key
) {
section.data.splice(childIndex, 1) section.data.splice(childIndex, 1)
} }
if ( if (father.key == 'primaryResidence' && section.key == father.key) {
(father.key == 'investment' || father.key == 'primaryResidence') &&
section.key == father.key
) {
section.data.splice(childIndex, 1) section.data.splice(childIndex, 1)
} }
} }
//更新form表单对应的数据,以便收集填写的值
form.value[father.key].splice(childIndex, 1)
processedFanFormData.value = processedData processedFanFormData.value = processedData
} }
// 根据联动重置表单项的显示与否 // 保存表格数据
const saveTableData = (father, row) => {
if (father.key == 'dependantList') {
console.log(!row.policyholderRel && !row.dependantAge)
if (!row.policyholderRel && !row.dependantAge) {
proxy.$modal.confirm(`请先填写受供养人信息再保存`, { showCancel: '0', title: '填写提示' })
return
}
row.unSave = false
}
}
const resetShow = (childKey, status) => { const resetShow = (childKey, status) => {
console.log(childKey, status) console.log(childKey, status)
...@@ -650,171 +740,22 @@ const handleEditStatus = () => { ...@@ -650,171 +740,22 @@ const handleEditStatus = () => {
} }
//给表单赋值 方便表单回显 obj 为表单数据 //给表单赋值 方便表单回显 obj 为表单数据
const setFormValue = (obj, formData) => { const setFormValue = (obj, formData) => {
loading.value = true console.log('回显值', obj)
let newForm = JSON.parse(JSON.stringify(form.value)) loading.value = true
// 1.先正确的拿到表单的回显值 let processedData = JSON.parse(JSON.stringify(formData))
for (const key in newForm) {
for (const key2 in obj) {
if (isObject(newForm[key]) && key == key2) {
newForm[key] = obj[key2]
}
if (isArray(newForm[key]) && key == key2 && obj[key2] && obj[key2].length > 0) {
newForm[key] = obj[key2]
}
}
}
// 2.根据最新的表单数据更新processedFanFormData的值,因为有些模块是多项的,所以表单数据要和dom对应上,防止dom有form表单里没有对应的数据会报错
let newChildren = {
type: '4',
childTitle: '儿女',
delete: true, //是否显示删除按钮
age: '',
needProvide: '',
options: noYesList.value
}
// 深拷贝原始表单dom数据
const processedData = JSON.parse(JSON.stringify(formData))
for (const section of processedData) {
for (const key in newForm) {
//回显的数据有的没填写就会是null,收集表单值得时候和dom对应不上,对于null值得项要根据section得keyType给form正确得数据类型
if (!newForm[key]) {
if (section.keyType == 'Array' && key == section.key) {
newForm[key] = []
} else if (section.keyType == 'Object' && key == section.key) {
newForm[key] = {}
}
}
if (section.data) {
if (section.key == 'familyMembers' && section.key == key) {
// 根据家人得type对应,如果填写得有儿女processedFanFormData和form应该加上对应得值
newForm[key].forEach((item, index) => {
// 儿女特殊处理,因为可能有多个儿女为了区分是哪个儿女,所以加上id
if (item.type == '4') {
item.id = index + 1
section.data.push({ id: index + 1, ...newChildren })
form.value[key].push({ id: index + 1, ...newChildren })
}
})
} else if (key !== 'familyMembers' && section.key == key) {
if (isArray(newForm[key]) && newForm[key].length <= section.dataLength) {
let num = section.dataLength - newForm[key].length
for (let i = 0; i < num; i++) {
newForm[key].push(section.data[0])
}
}
}
if (section.key == 'personalData' && key == section.key) {
if (isObject(newForm[key])) {
for (const key2 in newForm[key]) {
// 如果就业情况为其他,显示其他就业情况
if (key2 == 'employment' && newForm[key][key2] == 'OTHER') {
for (const item of section.data) {
if (item.key == 'otherEmployment') {
item.show = true
}
}
}
}
}
}
}
}
}
// 回显表单值特殊处理
for (const key in form.value) {
for (const key2 in newForm) {
if (key == key2 && key == 'familyMembers') {
if (newForm[key2].length > 0) {
form.value[key] = form.value[key].map(item1 => {
newForm[key2].forEach(item2 => {
if (item1.type == '4' && item1.id == item2.id) {
item1.age = item2.age
item1.needProvide = item2.needProvide
} else {
if (item1.type == item2.type && !item2.id) {
item1.age = item2.age
item1.needProvide = item2.needProvide
}
}
})
return item1
})
}
} else if (key == key2 && key !== 'familyMembers') {
if (isArray(newForm[key2]) && newForm[key].length > 0) {
form.value[key] = newForm[key2]
} else if (isObject(newForm[key2])) {
for (const key3 in newForm[key2]) {
if (!newForm[key2][key3]) {
if (key3 == 'premiumFundingSource' || key3 == 'liquidAssetType') {
newForm[key2][key3] = []
} else {
newForm[key2][key3] = ''
}
} else {
if (key3 == 'premiumFundingSource' || key3 == 'liquidAssetType') {
newForm[key2][key3] = newForm[key2][key3].split(',')
}
}
}
form.value[key] = newForm[key2]
}
}
}
}
for (const section of processedData) { for (const section of processedData) {
for (const key1 in obj) { if (section.keyType == 'Array') {
if (section.data) { section.data = obj[section.key] ? obj[section.key] : []
if ( } else if (section.keyType == 'Object') {
obj[key1] && obj[section.key].premiumFundingSource = obj[section.key].premiumFundingSource
key1 !== 'familyMembers' && ? obj[section.key].premiumFundingSource.split(',')
key1 == section.key && : []
section.keyType == 'Array' obj[section.key].liquidAssetType = obj[section.key].liquidAssetType
) { ? obj[section.key].liquidAssetType.split(',')
section.data = obj[key1].map(item => { : []
for (const key2 in item) { form.value[section.key] = obj[section.key]
if (key2 == 'currency') {
item.options = fetchDictData('bx_currency_type')
} else if (key2 == 'needProvide') {
item.options = fetchDictData('sys_no_yes')
}
}
return {
...item
}
})
} else if (
key1 == 'familyMembers' &&
key1 == section.key &&
section.keyType == 'Array' &&
obj[key1]
) {
section.data = form.value[key1].map(item => {
for (const key2 in item) {
if (key2 == 'needProvide') {
item.options = fetchDictData('sys_no_yes')
}
}
return {
...item
}
})
}
// 流动资产包含其他的时候,显示其他说明
if (section.key == 'liquidAssets') {
for (const field of section.data) {
if (
field.key == 'otherLiquidAsset' &&
obj[section.key]['liquidAssetType'] &&
obj[section.key]['liquidAssetType'].includes('G')
) {
field.show = true
}
}
}
}
} }
} }
...@@ -850,63 +791,57 @@ const isObject = value => { ...@@ -850,63 +791,57 @@ const isObject = value => {
// 表单提交 // 表单提交
const submitForm = saveType => { const submitForm = saveType => {
let oldForm = JSON.parse(JSON.stringify(form.value))
// 深拷贝原始数据 // 深拷贝原始数据
let result = JSON.parse(JSON.stringify(form.value))
let resDom = JSON.parse(JSON.stringify(processedFanFormData.value)) let resDom = JSON.parse(JSON.stringify(processedFanFormData.value))
console.log('result', result) let result = {}
// return // return
proxy.$refs['fanFormRef'].validate((valid, fields) => { proxy.$refs['fanFormRef'].validate((valid, fields) => {
if (valid) { if (valid) {
for (const section of resDom) { for (const section of resDom) {
for (const key1 in result) { if (section.keyType == 'Array' && section.data.length > 0) {
// key1 !== 'familyMembers' && section.data.forEach(item => {
if (section.key == key1 && section.keyType == 'Array') { if (item.brokerName) {
result[key1] = section.data dictStore.userSaleExpandList.forEach(item2 => {
} if (item2.value == item.brokerName) {
} item.brokerName = item2.label
} }
for (const key in result) {
if (isObject(result[key])) {
for (const key2 in result[key]) {
if (isArray(result[key][key2])) {
if (
key == 'liquidAssets' &&
key2 == 'liquidAssetType' &&
!result[key][key2].includes('G')
) {
result[key]['otherLiquidAsset'] = ''
}
result[key][key2] = result[key][key2].join(',')
}
}
}
if (isArray(result[key])) {
result[key] = result[key]
.map(item => {
// 删除指定字段
delete item.childTitle
delete item.children
delete item.disabled
delete item.id
delete item.span
delete item.dictType
delete item.options
delete item.delete
delete item.subTitle
if (item.policyIssueDate) {
item.policyIssueDate = proxy.formatToDate(item.policyIssueDate)
}
return item
}) })
.filter(item => Object.keys(item).length > 0) // 过滤空对象
} }
if (key == 'familyMembers') { if (item.brokerTeam) {
result[key] = result[key].filter(item => { dictStore.allTeaList.forEach(item2 => {
if (item.age || item.needProvide) return item if (item2.value == item.brokerTeam) {
item.brokerTeam = item2.label
}
}) })
} }
if (item.insurer) {
dictStore.allInsuranceCompanyList.forEach(item2 => {
if (item2.value == item.insurer) {
item.insurer = item2.label
}
})
}
if (item.insuranceType) {
item.insuranceTypeOption.forEach(item2 => {
if (item2.value == item.insuranceType) {
item.insuranceType = item2.label
}
})
}
})
result[section.key] = section.data
}
}
result.premiumAffordability = JSON.parse(JSON.stringify(form.value.premiumAffordability))
result.premiumAffordability.liquidAssetType =
result.premiumAffordability.liquidAssetType.join(',')
result.premiumAffordability.premiumFundingSource =
result.premiumAffordability.premiumFundingSource.join(',')
if (result.premiumAffordability.liquidAssetType.includes('G')) {
result.premiumAffordability.otherLiquidAsset = oldForm.premiumAffordability.otherLiquidAsset
} }
result.saveType = saveType result.saveType = saveType
result.customerBizId = props.customerBizId result.customerBizId = props.customerBizId
...@@ -991,6 +926,12 @@ watch( ...@@ -991,6 +926,12 @@ watch(
) )
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.editBtn {
position: fixed;
right: 3.5%;
top: 22%;
z-index: 999;
}
.dependNum { .dependNum {
font-size: 14px; font-size: 14px;
font-weight: none; font-weight: none;
......
...@@ -102,6 +102,7 @@ ...@@ -102,6 +102,7 @@
@handleSuccess="handleSuccess" @handleSuccess="handleSuccess"
:tabIndex="tabsList.findIndex(t => t.name === 'fnaform')" :tabIndex="tabsList.findIndex(t => t.name === 'fnaform')"
anchorContainer=".tabPaneBox" anchorContainer=".tabPaneBox"
tabSource="fnaform"
/> />
</div> </div>
<div v-if="tab.name === 'appointment'"> <div v-if="tab.name === 'appointment'">
...@@ -378,7 +379,9 @@ const getDictsData = async () => { ...@@ -378,7 +379,9 @@ const getDictsData = async () => {
'wj_question_second_category', 'wj_question_second_category',
'csf_ap_policy_transfer', 'csf_ap_policy_transfer',
'md_bank', 'md_bank',
'csf_property_type' 'csf_property_type',
'oss_data_type',
'oss_data_person'
]) ])
} }
......
...@@ -119,7 +119,7 @@ ...@@ -119,7 +119,7 @@
</div> </div>
<!-- 投保人 --> <!-- 投保人 -->
<div v-if="tab.name === 'policyholder'"> <div v-if="tab.name === 'policyholder'">
<!-- :customerBizId="processInfo.customerBizId" @handleSuccess="handleSuccess"--> <!-- @handleSuccess="handleSuccess"-->
<Customer <Customer
:activeName="activeName" :activeName="activeName"
:fatherTabName="tabName" :fatherTabName="tabName"
...@@ -130,6 +130,10 @@ ...@@ -130,6 +130,10 @@
tabSource="policyholder" tabSource="policyholder"
ref="policyHolderInfoRef" ref="policyHolderInfoRef"
:fatherEditStatus="editStatus" :fatherEditStatus="editStatus"
:customerInfo="customerInfo"
:apiPolicyholderInfoDto="appointmentSummeryInfo.apiPolicyholderInfoDto"
:idsObj="idsObj"
:customerBizId="props.processDetail.customerBizId"
/> />
<!-- <PolicyHolderInfo <!-- <PolicyHolderInfo
:activeName="activeName" :activeName="activeName"
...@@ -157,6 +161,8 @@ ...@@ -157,6 +161,8 @@
tabSource="insurantInfo" tabSource="insurantInfo"
ref="insuredInfoRef" ref="insuredInfoRef"
:fatherEditStatus="editStatus" :fatherEditStatus="editStatus"
:idsObj="idsObj"
:customerBizId="props.processDetail.customerBizId"
/> />
<!-- <InsuredInfo <!-- <InsuredInfo
:activeName="activeName" :activeName="activeName"
...@@ -186,6 +192,10 @@ ...@@ -186,6 +192,10 @@
:pageSource="pageSource" :pageSource="pageSource"
:showSubmitBtn="showSubmitBtn" :showSubmitBtn="showSubmitBtn"
@policyEditSuccess="getPolicyDetail" @policyEditSuccess="getPolicyDetail"
:tabIndex="tabsList.findIndex(t => t.name === 'secondHolder')"
anchorContainer=".appointmentTabPaneBox"
:fatherTabName="tabName"
:editStatus="editStatus"
/> />
</div> </div>
<div v-if="tab.name === 'beneficiary'"> <div v-if="tab.name === 'beneficiary'">
...@@ -200,6 +210,10 @@ ...@@ -200,6 +210,10 @@
:pageSource="pageSource" :pageSource="pageSource"
:showSubmitBtn="showSubmitBtn" :showSubmitBtn="showSubmitBtn"
@policyEditSuccess="getPolicyDetail" @policyEditSuccess="getPolicyDetail"
:tabIndex="tabsList.findIndex(t => t.name === 'beneficiary')"
anchorContainer=".appointmentTabPaneBox"
:fatherTabName="tabName"
:editStatus="editStatus"
/> />
</div> </div>
<div v-if="tab.name === 'questionnaires'"> <div v-if="tab.name === 'questionnaires'">
...@@ -213,6 +227,10 @@ ...@@ -213,6 +227,10 @@
:pageSource="pageSource" :pageSource="pageSource"
:showSubmitBtn="showSubmitBtn" :showSubmitBtn="showSubmitBtn"
:foldInsurantInfo="foldInsurantInfo" :foldInsurantInfo="foldInsurantInfo"
:affixOffset="360"
:tabIndex="tabsList.findIndex(t => t.name === 'questionnaires')"
anchorContainer=".appointmentTabPaneBox"
:editStatus="editStatus"
/> />
</div> </div>
<div v-if="tab.name === 'fna'"> <div v-if="tab.name === 'fna'">
...@@ -244,6 +262,7 @@ ...@@ -244,6 +262,7 @@
@handleSuccessEdit="getAppointmentInfo(idsObj.appointmentBizId)" @handleSuccessEdit="getAppointmentInfo(idsObj.appointmentBizId)"
:pageSource="pageSource" :pageSource="pageSource"
:showSubmitBtn="showSubmitBtn" :showSubmitBtn="showSubmitBtn"
ref="appointmentAccessoriesRef"
/> />
</div> </div>
<div v-if="tab.name === 'policyInfo'"> <div v-if="tab.name === 'policyInfo'">
...@@ -400,6 +419,7 @@ const insuredInfoRef = ref(null) ...@@ -400,6 +419,7 @@ const insuredInfoRef = ref(null)
const secondHolderInfoRef = ref(null) const secondHolderInfoRef = ref(null)
const beneficiaryInfoRef = ref(null) const beneficiaryInfoRef = ref(null)
const policyTransferRef = ref(null) const policyTransferRef = ref(null)
const appointmentAccessoriesRef = ref(null)
const questionnairesInfoRef = ref(null) const questionnairesInfoRef = ref(null)
const customerInfo = ref({}) const customerInfo = ref({})
const idsObj = ref({}) //各个模块的bizId const idsObj = ref({}) //各个模块的bizId
...@@ -797,7 +817,9 @@ const getDictsData = async () => { ...@@ -797,7 +817,9 @@ const getDictsData = async () => {
'wj_question_first_category', 'wj_question_first_category',
'wj_question_second_category', 'wj_question_second_category',
'csf_ap_status', 'csf_ap_status',
'md_bank' 'md_bank',
'oss_data_type',
'oss_data_person'
]) ])
} }
// Tab切换前的验证 // Tab切换前的验证
...@@ -805,12 +827,6 @@ const beforeTabLeave = (activeTabName, oldTabName) => { ...@@ -805,12 +827,6 @@ const beforeTabLeave = (activeTabName, oldTabName) => {
return true return true
} }
const handleBack = () => {
// 先手动清理状态
submitAppointmentObj.value = {}
appointmentSummeryInfo.value = {}
router.go(-1)
}
// 判断是否为数组 // 判断是否为数组
const isArray = value => { const isArray = value => {
return Array.isArray(value) return Array.isArray(value)
...@@ -829,24 +845,49 @@ const handleSubmit = async type => { ...@@ -829,24 +845,49 @@ const handleSubmit = async type => {
// } // }
// if (productPlanRef.value) { // if (productPlanRef.value) {
// submitAppointmentObj.value.apiProductPlanInfoDto = productPlanRef.value[0].handleSubmitForm() // submitAppointmentObj.value.apiProductPlanInfoDto =
// await productPlanRef.value[0].handleSubmitForm()
// if (!submitAppointmentObj.value.apiProductPlanInfoDto) return
// } // }
if (policyHolderInfoRef.value) { // 获取投保人form
submitAppointmentObj.value.apiPolicyholderInfoDto = // if (policyHolderInfoRef.value) {
policyHolderInfoRef.value[0].handleFormValues() // submitAppointmentObj.value.apiPolicyholderInfoDto =
} // await policyHolderInfoRef.value[0].handleFormValues('policyHolderInfoRef')
if (insuredInfoRef.value) { // if (!submitAppointmentObj.value.apiPolicyholderInfoDto) return
submitAppointmentObj.value.apiInsurantInfoDto = insuredInfoRef.value[0].handleFormValues() // }
} // 获取受保人form
return // if (insuredInfoRef.value) {
if (secondHolderInfoRef.value) { // console.log('insuredInfoRef.value', insuredInfoRef.value)
submitAppointmentObj.value.apiSecondHolderInfoDto =
secondHolderInfoRef.value[0].handleFormValues() // await nextTick() // 👈 加这一行!
} // const result = await insuredInfoRef.value[0].handleFormValues('insuredInfoRef')
if (beneficiaryInfoRef.value) { // console.log('result', result)
submitAppointmentObj.value.apiBeneficiaryInfoDtoList =
beneficiaryInfoRef.value[0].handleFormValues() // if (!result) return
// submitAppointmentObj.value.apiInsurantInfoDto = result
// }
// if (secondHolderInfoRef.value) {
// submitAppointmentObj.value.apiSecondHolderInfoDto =
// await secondHolderInfoRef.value[0].handleFormValues()
// if (!submitAppointmentObj.value.apiSecondHolderInfoDto) return
// }
// if (beneficiaryInfoRef.value) {
// submitAppointmentObj.value.apiBeneficiaryInfoFzDto =
// await beneficiaryInfoRef.value[0].handleFormValues()
// if (!submitAppointmentObj.value.apiBeneficiaryInfoFzDto) return
// }
// if (questionnairesInfoRef.value && questionnairesInfoRef.value[0].questionLength > 0) {
// submitAppointmentObj.value.questionnairesDetailResponse =
// await questionnairesInfoRef.value[0].handleFormValues()
// if (!submitAppointmentObj.value.questionnairesDetailResponse) return
// }
if (appointmentAccessoriesRef.value) {
submitAppointmentObj.value.materialDtoList =
appointmentAccessoriesRef.value[0].handleFormValues()
if (!submitAppointmentObj.value.materialDtoList) return
} }
console.log('大提交', submitAppointmentObj.value)
return return
// 代表新增预约 // 代表新增预约
if (formStatus.value == 'appointmentAdd' && !idsObj.value.appointmentBizId) { if (formStatus.value == 'appointmentAdd' && !idsObj.value.appointmentBizId) {
...@@ -1005,7 +1046,7 @@ watch( ...@@ -1005,7 +1046,7 @@ watch(
//代表是新增预约状态 //代表是新增预约状态
if (!idsObj.value.appointmentBizId) { if (!idsObj.value.appointmentBizId) {
formStatus.value = 'appointmentAdd' formStatus.value = 'appointmentAdd'
// getCustomerInfo(props.processDetail.customerBizId) getCustomerInfo(props.processDetail.customerBizId)
tabsList.value = [ tabsList.value = [
{ {
...@@ -1048,6 +1089,20 @@ watch( ...@@ -1048,6 +1089,20 @@ watch(
id: 5, id: 5,
status: '0', status: '0',
key: 'secondHolderBizId' key: 'secondHolderBizId'
},
{
label: '健康信息',
name: 'questionnaires',
id: 7,
status: '0',
key: 'questionnaireBizId'
},
{
label: '附件', //大提交的时候不用提交了,因为上传文件的时候已经入库了
name: 'accessories',
id: 10,
status: '0',
key: 'fnaBizId'
} }
] ]
nextTick(() => { nextTick(() => {
...@@ -1306,6 +1361,7 @@ const showSubmitBtn = computed(() => { ...@@ -1306,6 +1361,7 @@ const showSubmitBtn = computed(() => {
return false return false
} }
}) })
//刚进页面的编辑状态
if (route.query.appointmentNo && route.query.source == 'appointmentList') { if (route.query.appointmentNo && route.query.source == 'appointmentList') {
editStatus.value = true editStatus.value = true
} else if (route.query.source == 'policyList') { } else if (route.query.source == 'policyList') {
...@@ -1315,7 +1371,6 @@ if (route.query.appointmentNo && route.query.source == 'appointmentList') { ...@@ -1315,7 +1371,6 @@ if (route.query.appointmentNo && route.query.source == 'appointmentList') {
} else if (route.query.source == 'fnaList' && !idsObj.value.appointmentBizId) { } else if (route.query.source == 'fnaList' && !idsObj.value.appointmentBizId) {
editStatus.value = false editStatus.value = false
} }
console.log('editStatus.value ', editStatus.value, idsObj.value)
onUnmounted(() => { onUnmounted(() => {
// 彻底重置所有响应式数据 // 彻底重置所有响应式数据
......
<template> <template>
<!-- v-if="processedBeneficiaryData.length > 0" -->
<div> <div>
<div v-if="processedBeneficiaryData.length > 0"> <div ref="beneficiaryRef">
<el-row> <CommonForm :showAnchor="false">
<el-col :span="24"> <template #form-right>
<div class="topBtn"> <el-form ref="beneficiaryInfoFormRef" :model="form" :rules="rules">
<el-button <el-row v-for="father in processedBeneficiaryData" style="margin-bottom: 10px">
type="warning" <div class="formBox formFna">
icon="DocumentAdd" <CardOne :title="father.fatherTitle" v-if="father.showMoudle">
@click="addBeneficiary" <template #content>
<el-row v-if="!father.showTable" :gutter="20">
<template v-for="child in father.data" :key="child.key">
<el-col :sm="child.sm" :lg="child.lg" class="formItem" v-if="child.show">
<div>
<el-form-item
:label="child.label"
:prop="child.key"
:key="child.key"
:label-width="child.labelWidth"
:label-position="child.labelPosition"
>
<el-input
v-if="child.domType === 'Input'"
:type="child.inputType"
v-model="form[child.key]"
:placeholder="child.placeholder"
maxlength="30"
:disabled="editStatus"
:style="{ width: child.inputWidth ? child.inputWidth : '100%' }"
/>
<el-select
v-if="child.domType === 'Select'"
v-model="form[child.key]"
:placeholder="child.placeholder"
@change="handleSelectChange(father, child)"
:disabled="editStatus" :disabled="editStatus"
>新增受益人</el-button
> >
<el-option
v-for="item in child.options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-date-picker
style="width: 100%"
v-if="child.domType === 'DatePicker'"
v-model="form[child.key]"
type="date"
:placeholder="child.placeholder"
:disabled="editStatus"
/>
<el-checkbox-group
v-if="child.domType === 'Checkbox'"
v-model="form[child.key]"
:disabled="editStatus"
>
<el-checkbox
v-for="item in child.options"
:key="item.value"
:label="item.value"
>
{{ item.label }}
</el-checkbox>
</el-checkbox-group>
<el-select
v-model="form[child.key]"
v-if="child.domType === 'SearchSelect'"
filterable
remote
reserve-keyword
placeholder="请输入关键词搜索"
:remote-method="query => searchSelectList(query, child.key)"
:loading="searchLoadingStates[child.key]"
:disabled="editStatus"
@change="handleSearchSelectChange(child.key)"
>
<el-option
v-for="item in searchOptions[child.key] || []"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</div>
</el-col>
</template>
</el-row>
<!-- 是表格数据 -->
<el-row v-if="father.showTable">
<el-col :span="24" v-if="father.addChildren">
<el-button <el-button
v-if="props.showSubmitBtn" :disabled="editStatus"
type="primary" type="primary"
icon="EditPen" icon="Plus"
@click="handleEditStatus(!editStatus)" size="small"
style="margin-left: 10px" style="margin-bottom: 10px"
>编辑</el-button @click="addChildren(father)"
>{{ father.addChildrenTxt }}</el-button
> >
</div>
</el-col> </el-col>
<el-table :data="father.data" border v-if="father.data.length > 0">
<!-- 动态渲染列 -->
<el-table-column
v-for="column in father.columns"
:key="column.prop"
:label="column.label"
:prop="column.prop"
align="center"
>
<template #default="scope">
<span v-if="column.type === 'text'">{{ scope.row[column.prop] }}</span>
</template>
</el-table-column>
<!-- 操作列(固定) -->
<el-table-column align="center" label="操作" width="150">
<template #default="scope">
<el-button
type="primary"
size="small"
@click="updateChildren(father, scope.row)"
>
修改
</el-button>
<el-button
type="danger"
size="small"
@click="deleteChildren(father, scope.$index)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-row> </el-row>
<el-form ref="beneficiaryInfoFormRef" :model="form" label-width="120px"> </template>
<div v-for="(level1, l1) in processedBeneficiaryData" :key="level1.id"> </CardOne>
<el-row style="margin-bottom: 10px">
<div class="formBox">
<div class="level1Label">
<span>{{ level1.bigTitle }}-{{ l1 + 1 }}</span>
<el-icon
@click="deleteBeneficiary(l1, level1)"
v-if="level1.deleteIcon && processedBeneficiaryData.length > 1"
style="color: red; font-size: 18px; margin-left: 10px"
><Delete
/></el-icon>
</div> </div>
<div v-for="(level2, l2) in level1.children" :key="level2.key"> </el-row>
<div class="fatherLable" v-if="level2.showMoudle">{{ level2.fatherTitle }}</div> </el-form>
<el-row :gutter="20" v-if="level2.showMoudle"> </template>
<template v-for="child in level2.data" :key="child.key"> </CommonForm>
<el-col :sm="child.sm" :lg="child.lg" class="formItem" v-if="child.show">
<div> <CommonDialog
<!-- :rules=" :dialogTitle="dialogTitle"
child.required confirmText="确定"
? [ cancleText="关闭"
{ dialogWidth="70%"
required: true, :showClose="true"
message: `${child.label}不能为空`, :openDialog="dialogVisible"
trigger: 'blur' @close="dialogVisible = false"
} @confirm="dialogConfirm"
] >
: [] <div class="dialogBox">
" --> <el-form :model="dialogForm" ref="dialogFormRef">
<el-row :gutter="20">
<template v-for="(child, dIndex) in addBeneficiaryForm">
<el-col :sm="child.sm" :lg="child.lg" class="formItem">
<el-form-item <el-form-item
:label-width="child.labelWidth"
:label="child.label" :label="child.label"
:prop="`apiBeneficiaryInfoDtoList.${l1}.${child.key}`" :prop="child.key"
:key="child.key" :key="child.key"
:label-width="child.labelWidth"
:label-position="child.labelPosition" :label-position="child.labelPosition"
:rules="getRules(child)" :rules="getRules(child)"
> >
<!-- @input="handleInputChange(father, child, l1)" -->
<el-input <el-input
v-if="child.domType === 'Input'" v-if="child.domType === 'Input'"
:type="child.inputType" :type="child.inputType"
v-model="form['apiBeneficiaryInfoDtoList'][l1][child.key]" v-model="dialogForm[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
maxlength="30" maxlength="30"
:disabled="child.disabled" @blur="handleInputBlur(child)"
/> />
<el-select <el-select
v-if="child.domType === 'Select'" v-if="child.domType === 'Select'"
v-model="form['apiBeneficiaryInfoDtoList'][l1][child.key]" v-model="dialogForm[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
@change="handleSelectChange(child, l1, l2)"
:disabled="child.disabled"
> >
<el-option <el-option
v-for="item in child.options" v-for="item in child.options"
...@@ -84,100 +189,32 @@ ...@@ -84,100 +189,32 @@
/> />
</el-select> </el-select>
<el-date-picker <el-date-picker
v-model="form['apiBeneficiaryInfoDtoList'][l1][child.key]"
style="width: 100%" style="width: 100%"
v-if="child.domType === 'DatePicker'" v-if="child.domType === 'DatePicker'"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
v-model="dialogForm[child.key]"
type="date" type="date"
:placeholder="child.placeholder" :placeholder="child.placeholder"
:disabled="child.disabled"
:disabled-date="disabledDate"
/> />
<el-input <el-input
v-if="child.domType === 'arrowRight'" v-if="child.domType === 'arrowRight'"
v-model="form['apiBeneficiaryInfoDtoList'][l1][child.key]" v-model="dialogForm[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
@click="handleFoucs(child, l1, level1)" @click="handleFoucs(child)"
:suffix-icon="ArrowRight" :suffix-icon="ArrowRight"
readonly readonly
:disabled="child.disabled" :disabled="editStatus"
> >
</el-input> </el-input>
</el-form-item> </el-form-item>
</div>
</el-col> </el-col>
</template> </template>
</el-row> </el-row>
</div>
</div>
</el-row>
</div>
<el-row v-if="props.showSubmitBtn">
<el-col>
<div class="tabButton">
<!-- <el-button
type="primary"
icon="RefreshRight"
@click="resetForm"
size="large"
:disabled="editStatus"
>重置</el-button
> -->
<el-button
type="primary"
icon="Check"
@click="submitForm"
size="large"
:disabled="editStatus"
>提交</el-button
>
</div>
</el-col>
</el-row>
</el-form> </el-form>
<el-dialog title="联系人信息" v-model="openList" width="600px" append-to-body>
<div>
<el-form :model="queryParams" ref="queryRef" :inline="true" label-width="85px">
<el-form-item label="联系人姓名" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入姓名" @input="customerList" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" circle @click="customerList" />
<el-button type="info" icon="Refresh" circle @click="resetCustomerList" />
</el-form-item>
</el-form>
<div class="customerBox">
<div class="customerItem" v-for="item in tableData" :key="item.id">
<div class="top">
<div class="right">
<el-button type="primary" size="small" @click="handleExport(item)"
>导入联系人</el-button
>
</div>
</div>
<div class="bottom">
<div class="left">
<div class="infoItem">
<span>姓名:</span>
<span> {{ item.name || '暂无' }}</span>
</div>
<div class="infoItem">
<span>性别:</span>
<span>
<dict-tag :options="fetchDictData('sys_gender')" :value="item.gender"
/></span>
</div>
<div class="infoItem">
<span>年龄:</span>
<span> {{ item.age || '暂无' }}</span>
</div> </div>
</CommonDialog>
</div> </div>
</div>
</div>
</div>
</div>
</el-dialog>
</div>
<!-- <div v-else class="domEmpty" v-loading="loading"></div> -->
<Phone <Phone
@close="handleCloseDrawer" @close="handleCloseDrawer"
:showDrawer="showPhoneDrawer" :showDrawer="showPhoneDrawer"
...@@ -202,6 +239,11 @@ ...@@ -202,6 +239,11 @@
</div> </div>
</template> </template>
<script setup name="beneficiaryInfo"> <script setup name="beneficiaryInfo">
import { getCustomerList, calculateFieldValue } from '@/api/sign/fna'
import CommonDialog from '@/components/commonDialog'
import CardOne from '@/components/formCard/cardOne'
import CommonForm from '@/views/components/commonForm'
import { validateEnglish } from '@/utils/validate' import { validateEnglish } from '@/utils/validate'
import { ArrowRight } from '@element-plus/icons-vue' import { ArrowRight } from '@element-plus/icons-vue'
import beneficiaryDomData from '@/formJson/beneficiary' import beneficiaryDomData from '@/formJson/beneficiary'
...@@ -210,7 +252,6 @@ import Phone from '@/views/components/phone' ...@@ -210,7 +252,6 @@ import Phone from '@/views/components/phone'
import Address from '@/views/components/address' import Address from '@/views/components/address'
import { watch, nextTick } from 'vue' import { watch, nextTick } from 'vue'
import { getCustomerList } from '@/api/sign/fna'
import { updatePolicyBeneficiary, delPolicyBeneficiary } from '@/api/sign/underwritingMain' import { updatePolicyBeneficiary, delPolicyBeneficiary } from '@/api/sign/underwritingMain'
import { editBeneficiaryInfo, delBeneficiary } from '@/api/sign/appointment' import { editBeneficiaryInfo, delBeneficiary } from '@/api/sign/appointment'
import useDictStore from '@/store/modules/dict' import useDictStore from '@/store/modules/dict'
...@@ -225,7 +266,11 @@ const props = defineProps({ ...@@ -225,7 +266,11 @@ const props = defineProps({
appointmentStatus: { type: Number }, //父组件传递过来的预约的状态 appointmentStatus: { type: Number }, //父组件传递过来的预约的状态
customerInfo: { type: Object, default: () => ({}) }, //客户详情回显表单用 customerInfo: { type: Object, default: () => ({}) }, //客户详情回显表单用
showSubmitBtn: { type: Boolean, default: false }, //父组件状态,新增、修改 showSubmitBtn: { type: Boolean, default: false }, //父组件状态,新增、修改
pageSource: { type: String, default: false } //页面来源 pageSource: { type: String, default: false }, //页面来源
fatherTabName: { type: String, default: '' }, //一级tab名称
anchorContainer: { type: String, default: '' }, //锚点滚动容器
editStatus: { type: Boolean, default: true }, //编辑状态
tabIndex: { type: [String, Number], default: '' } //tab索引
}) })
const emit = defineEmits(['handleSuccessEdit', 'policyEditSuccess']) const emit = defineEmits(['handleSuccessEdit', 'policyEditSuccess'])
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
...@@ -237,7 +282,7 @@ const drawerInfo = ref({}) // 用于存储所有arrowRight类型的输入框输 ...@@ -237,7 +282,7 @@ const drawerInfo = ref({}) // 用于存储所有arrowRight类型的输入框输
const saveKey = ref({}) // 用于存储当前点击的drawer框返回的对象,修改的时候回显值也要存key const saveKey = ref({}) // 用于存储当前点击的drawer框返回的对象,修改的时候回显值也要存key
const tempSaveKey = ref({}) // 用于tab切换的时候保存一份临时的值,防止切换的时候数据丢失 const tempSaveKey = ref({}) // 用于tab切换的时候保存一份临时的值,防止切换的时候数据丢失
const errorFields = ref([]) // 存储校验失败的字段信息 const errorFields = ref([]) // 存储校验失败的字段信息
const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑 // const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑
const openList = ref(false) // 客户列表弹窗 const openList = ref(false) // 客户列表弹窗
const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作 const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作
const phoneOraddressKey = ref([]) // 存储当前点击的drawer框返回的对象,修改的时候回显值也要存key const phoneOraddressKey = ref([]) // 存储当前点击的drawer框返回的对象,修改的时候回显值也要存key
...@@ -301,6 +346,10 @@ const tempAddressQuickList = ref([]) ...@@ -301,6 +346,10 @@ const tempAddressQuickList = ref([])
const tempPhoneQuickList = ref([]) const tempPhoneQuickList = ref([])
const personalObj = ref({}) //存储个人key const personalObj = ref({}) //存储个人key
const companyObj = ref({}) //存储公司key const companyObj = ref({}) //存储公司key
const dialogVisible = ref(false) //新增受益人弹窗
const addBeneficiaryForm = ref([]) //新增受益人表单
const dialogTitle = ref('') //新增受益人弹窗标题
const dialogKey = ref('') //新增受益人弹窗标题
const deleteKeyList = ref([ const deleteKeyList = ref([
'objType', 'objType',
'mailingAddress', 'mailingAddress',
...@@ -319,6 +368,7 @@ const data = reactive({ ...@@ -319,6 +368,7 @@ const data = reactive({
tempBeneficiaryDomData: [], //保存旧的表单Dom,便于撤销操作 tempBeneficiaryDomData: [], //保存旧的表单Dom,便于撤销操作
oldAppointmentData: [], // 保存旧的表单Dom,便于撤销操作 oldAppointmentData: [], // 保存旧的表单Dom,便于撤销操作
rules: {}, //表单验证规则, rules: {}, //表单验证规则,
dialogForm: {},
queryParams: { queryParams: {
pageNo: 1, pageNo: 1,
pageSize: 4, pageSize: 4,
...@@ -332,95 +382,127 @@ const { ...@@ -332,95 +382,127 @@ const {
queryParams, queryParams,
oldAppointmentData, oldAppointmentData,
tempBeneficiaryForm, tempBeneficiaryForm,
tempBeneficiaryDomData tempBeneficiaryDomData,
dialogForm
} = toRefs(data) } = toRefs(data)
// 获取表单项的校验规则 const deleteChildren = (father, index) => {
const getRules = child => { if (father.key == 'apiBeneficiaryInfoDtoList') {
const rules = [] father.data.splice(index, 1)
proxy.$message.success('受益人删除成功')
}
}
const updateChildren = (father, row) => {
dialogForm.value = JSON.parse(JSON.stringify(row))
if (father.key == 'apiBeneficiaryInfoDtoList') {
dialogTitle.value = '修改受益人'
dialogKey.value = 'apiBeneficiaryInfoDtoList'
addBeneficiaryForm.value = JSON.parse(JSON.stringify(father.formItem))
}
dialogVisible.value = true
}
// 必填校验 const dialogConfirm = () => {
if (child.required) { let newDOM = JSON.parse(JSON.stringify(processedBeneficiaryData.value))
rules.push({ proxy.$refs['dialogFormRef'].validate((valid, fields) => {
required: true, if (valid) {
message: `${child.label}不能为空`, for (const section of newDOM) {
trigger: 'blur' if (section.key == dialogKey.value) {
// 处理下拉值得显示
for (const child of section.formItem) {
if (child.domType == 'Select' && dialogForm.value[child.key]) {
child.options.forEach(item => {
if (item.value == dialogForm.value[child.key]) {
dialogForm.value[child.key + 'Name'] = item.label
}
}) })
} }
}
// 为英文姓名添加自定义校验 let index = section.data.findIndex(item => item.id == dialogForm.value.id)
if (child.key === 'nameEn') { if (index == -1) {
rules.push({ section.data.push(dialogForm.value)
validator: validateEnglish, } else {
trigger: 'change' section.data[index] = JSON.parse(JSON.stringify(dialogForm.value))
}
}
}
processedBeneficiaryData.value = newDOM
dialogVisible.value = false
dialogForm.value = {}
}
}) })
}
// 添加表单子级dom
const addChildren = father => {
if (props.editStatus) {
proxy.$message.warning('请先点击编辑')
return
} }
dialogForm.value = { id: Date.now() + Math.floor(Math.random()) }
if (father.key == 'apiBeneficiaryInfoDtoList') {
dialogTitle.value = '新增受益人'
dialogKey.value = 'apiBeneficiaryInfoDtoList'
addBeneficiaryForm.value = JSON.parse(JSON.stringify(father.formItem))
return rules dialogVisible.value = true
}
} }
const handleInputBlur = child => {
// 新增受益人 if (dialogForm.value['documentType'] == 'idCard' && child.key == 'idNumber') {
const addBeneficiary = () => { getFieldValue(child.key)
let oneMoudle = JSON.parse(JSON.stringify(processedBeneficiaryData.value[0])) } else if (child.key == 'nameCn' && dialogForm.value['nameCn']) {
oneMoudle.id = Date.now() + Math.floor(Math.random() * 1000) //唯一标识,用于删除 getFieldValue(child.key)
processedBeneficiaryData.value.push(oneMoudle) }
form.value.apiBeneficiaryInfoDtoList.push({ id: oneMoudle.id })
} }
// 删除受益人 const getFieldValue = key => {
const deleteBeneficiary = (l1, level1) => { let obj = {}
console.log('====================================') if (dialogForm.value['documentType'] == 'idCard' && key == 'idNumber') {
console.log('l1', form.value.apiBeneficiaryInfoDtoList[l1]) obj = {
console.log('====================================') calculateType: 6,
if (editStatus.value) { requestValue: dialogForm.value['idNumber']
proxy.$modal.confirm(`编辑状态下才能删除`, { showCancel: '0', title: '填写提示' })
return
} }
if (processedBeneficiaryData.value.length == 1) { } else if (key == 'nameCn') {
proxy.$modal.confirm(`至少保留一个受益人`, { showCancel: '0', title: '填写提示' }) obj = {
return calculateType: 1,
requestValue: dialogForm.value['nameCn']
} }
if (
level1.beneficiaryBizId &&
(props.pageSource == 'fnaList' || props.pageSource == 'appointmentList')
) {
delBeneficiary(level1.beneficiaryBizId).then(res => {
if (res.code == 200) {
proxy.$message.success('预约-受益人删除成功')
processedBeneficiaryData.value.splice(l1, 1)
form.value.apiBeneficiaryInfoDtoList.splice(l1, 1)
emit('handleSuccessEdit')
} }
}) calculateFieldValue(obj).then(res => {
} else if (
form.value.apiBeneficiaryInfoDtoList[l1].policyBeneficiaryBizId &&
props.pageSource == 'policyList'
) {
delPolicyBeneficiary(form.value.apiBeneficiaryInfoDtoList[l1].policyBeneficiaryBizId).then(
res => {
if (res.code == 200) { if (res.code == 200) {
proxy.$message.success('新单跟进-受益人删除成功') res.data.forEach(item => {
processedBeneficiaryData.value.splice(l1, 1) if (obj.calculateType == 6) {
form.value.apiBeneficiaryInfoDtoList.splice(l1, 1) if (item.calculateType == 2) {
emit('policyEditSuccess') dialogForm.value['gender'] = item.responseKey
} else if (item.calculateType == 3) {
dialogForm.value['birthday'] = item.requestValue
} else if (item.calculateType == 4) {
dialogForm.value['age'] = item.requestValue
}
} else if (obj.calculateType == 1) {
dialogForm.value['namePyEn'] = item.responseValue
} }
})
} }
) })
} else { }
proxy.$message.success('受益人删除成功') // 获取表单项的校验规则
processedBeneficiaryData.value.splice(l1, 1) const getRules = child => {
form.value.apiBeneficiaryInfoDtoList.splice(l1, 1) const rules = []
// 必填校验
if (child.required) {
rules.push({
required: true,
message: `${child.label}不能为空`,
trigger: 'blur'
})
} }
return rules
} }
const disabledDate = time => { const disabledDate = time => {
return time.getTime() > Date.now() return time.getTime() > Date.now()
} }
const exportInfo = () => {
if (props.customerBizId && editStatus.value) {
proxy.$modal.confirm(`请先点击编辑在导入客户信息`, { showCancel: '0', title: '填写提示' })
return
}
openList.value = true
customerList()
}
const customerList = () => { const customerList = () => {
console.log('触发了') console.log('触发了')
...@@ -477,30 +559,24 @@ const fetchDictData = dictType => { ...@@ -477,30 +559,24 @@ const fetchDictData = dictType => {
const processFormData = async obj => { const processFormData = async obj => {
// 深拷贝原始数据 // 深拷贝原始数据
const processedData = JSON.parse(JSON.stringify(obj.domdata)) const processedData = JSON.parse(JSON.stringify(obj.domdata))
for (const item of processedData) { for (const section of processedData) {
if (tempBeneficiaryDomData.value.length == 0) {
form.value.apiBeneficiaryInfoDtoList.push({ id: item.id })
}
if (item.children) {
for (const section of item.children) {
if (section.data) { if (section.data) {
for (const field of section.data) { for (const field of section.data) {
if (section.key == 'customer' || section.key == 'other') { rules.value[field.key] = [
personalObj.value[field.key] = field.key { required: true, message: `${field.label}不能为空`, trigger: 'blur' }
companyObj.value[field.key] = field.key ]
}
// 收集key,区分个人和企业
if (section.key == 'person') {
personalObj.value[field.key] = field.key
} else if (section.key == 'company') {
companyObj.value[field.key] = field.key
}
if (field.dictType) { if (field.dictType) {
// 获取字典数据 // 获取字典数据
field.options = fetchDictData(field.dictType) field.options = fetchDictData(field.dictType)
} }
} }
} }
if (section.formItem) {
for (const field of section.formItem) {
if (field.dictType) {
// 获取字典数据
field.options = fetchDictData(field.dictType)
}
} }
} }
} }
...@@ -517,50 +593,46 @@ const processFormData = async obj => { ...@@ -517,50 +593,46 @@ const processFormData = async obj => {
} else { } else {
processedBeneficiaryData.value = oldAppointmentData.value = processedData processedBeneficiaryData.value = oldAppointmentData.value = processedData
} }
if (props.showSubmitBtn) { // if (props.showSubmitBtn) {
editStatus.value = true // } else {
} else {
editStatus.value = false
// processedBeneficiaryData.value = oldAppointmentData.value = processedData // processedBeneficiaryData.value = oldAppointmentData.value = processedData
} // }
} }
//弹出右侧抽屉 //弹出右侧抽屉
const handleFoucs = (child, l1, level1) => { const handleFoucs = (child, l1, level1) => {
if (child.disabled) return if (child.disabled) return
child.l1 = l1
child.id = level1.id
drawerInfo.value = JSON.parse(JSON.stringify(child)) drawerInfo.value = JSON.parse(JSON.stringify(child))
console.log('drawerInfo', drawerInfo.value) console.log('drawerInfo', drawerInfo.value)
switch (child.drawerType) { switch (child.drawerType) {
case 'phone': // case 'phone':
phoneMenuList.value[0].key = child.code // phoneMenuList.value[0].key = child.code
phoneMenuList.value[1].key = child.key // phoneMenuList.value[1].key = child.key
phoneMenuList.value.forEach(item => { // phoneMenuList.value.forEach(item => {
item.value = '' // item.value = ''
}) // })
let phoneString = form.value.apiBeneficiaryInfoDtoList[l1][child.key] // let phoneString = form.value.apiBeneficiaryInfoDtoList[l1][child.key]
if (phoneString) { // if (phoneString) {
phoneMenuList.value[0].value = phoneString.split(' ')[0] // phoneMenuList.value[0].value = phoneString.split(' ')[0]
phoneMenuList.value[1].value = phoneString.split(' ')[1] // phoneMenuList.value[1].value = phoneString.split(' ')[1]
} // }
showPhoneDrawer.value = true // showPhoneDrawer.value = true
break // break
case 'address': // case 'address':
addressMenuList.value.forEach(item => { // addressMenuList.value.forEach(item => {
item.value = '' // item.value = ''
phoneOraddressKey.value.forEach(item1 => { // phoneOraddressKey.value.forEach(item1 => {
if (item1.id == level1.id && item1.type == child.key) { // if (item1.id == level1.id && item1.type == child.key) {
for (const key in item1) { // for (const key in item1) {
if (item.key == key) { // if (item.key == key) {
item.value = item1[key] // item.value = item1[key]
} // }
} // }
} // }
}) // })
}) // })
showAddressDrawer.value = true // showAddressDrawer.value = true
break // break
case 'country': case 'country':
showCountryDrawer.value = true showCountryDrawer.value = true
break break
...@@ -651,7 +723,7 @@ const confirmDrawer = info => { ...@@ -651,7 +723,7 @@ const confirmDrawer = info => {
break break
case 'country': case 'country':
// info.objType = drawerInfo.value.drawerType // info.objType = drawerInfo.value.drawerType
// form.value[drawerInfo.value.key] = info.name dialogForm.value[drawerInfo.value.key] = info.name
// saveKey.value[drawerInfo.value.key] = info // saveKey.value[drawerInfo.value.key] = info
break break
default: default:
...@@ -692,85 +764,15 @@ const resetShow = obj => { ...@@ -692,85 +764,15 @@ const resetShow = obj => {
break break
} }
} }
console.log('更新', processedBeneficiaryData.value)
} }
const handleSelectChange = (child, l1, l2) => { const handleSelectChange = (father, child) => {
let customerType = form.value['apiBeneficiaryInfoDtoList'][l1]['customerType']
let insurantRel = form.value['apiBeneficiaryInfoDtoList'][l1]['insurantRel']
switch (child.key) { switch (child.key) {
case 'customerType': case 'isLegalBeneficiary':
const newDOM = JSON.parse(JSON.stringify(processedBeneficiaryData.value)) if (form.value[child.key] == '0') {
//这里存在一个对index得问题,暂不解决先放在这 resetShow({ type: 'father', key: 'apiBeneficiaryInfoDtoList', status: true })
for (const section of newDOM[l1].children) {
if (
(customerType == 'COMPANY' || customerType == 'INDIVIDUAL') &&
insurantRel &&
insurantRel == 'MYSELF' &&
section.key == 'customer'
) {
section.showMoudle = true
} else if (customerType == 'COMPANY' && insurantRel && insurantRel !== 'MYSELF') {
if (section.key == 'person') {
section.showMoudle = false
} else { } else {
section.showMoudle = true resetShow({ type: 'father', key: 'apiBeneficiaryInfoDtoList', status: false })
}
} else if (customerType == 'INDIVIDUAL' && insurantRel && insurantRel !== 'MYSELF') {
if (section.key == 'company') {
section.showMoudle = false
} else {
section.showMoudle = true
}
} else if (customerType == 'COMPANY' && !insurantRel) {
if (section.key == 'company') {
section.showMoudle = true
} else if (section.key == 'person') {
section.showMoudle = false
}
} else if (customerType == 'INDIVIDUAL' && !insurantRel) {
if (section.key == 'company') {
section.showMoudle = false
} else if (section.key == 'person') {
section.showMoudle = true
}
}
}
processedBeneficiaryData.value = newDOM
break
case 'insurantRel':
const newDOM1 = JSON.parse(JSON.stringify(processedBeneficiaryData.value))
for (const child of newDOM1[l1].children) {
if (insurantRel == 'MYSELF') {
if (child.key == 'customer') {
child.showMoudle = true
} else {
child.showMoudle = false
}
} else {
if (customerType == 'COMPANY') {
if (child.key == 'company') {
child.showMoudle = true
} else if (child.key == 'person') {
child.showMoudle = false
}
} else {
if (child.key == 'company') {
child.showMoudle = false
} else {
child.showMoudle = true
}
}
}
}
processedBeneficiaryData.value = newDOM1
break
case 'smokingAllowed':
// 选择吸烟,展示吸烟数量
if (form.value[child.key] == '1') {
resetShow({ type: 'child', key: 'smokingVolume', status: true })
} else {
resetShow({ type: 'child', key: 'smokingVolume', status: false })
} }
break break
...@@ -965,139 +967,37 @@ const getInvalidFields = fields => { ...@@ -965,139 +967,37 @@ const getInvalidFields = fields => {
// 处理表单填写得数据 // 处理表单填写得数据
const handleFormValues = () => { const handleFormValues = () => {
//提交的时候记得填写区号的电话,把相对应的区号字段加上 return new Promise(async resolve => {
//地址相关的还没处理 let submitObj = { ...form.value }
// 因为投保人没有policyholderRel的校验会影响 受保人,所以暂时先赋值处理
let submitForm = []
let result = {}
if (props.activeName == 'beneficiary') {
result = JSON.parse(JSON.stringify(form.value))
} else {
result = JSON.parse(JSON.stringify(tempBeneficiaryForm.value))
}
const pattern = /Time$/ // 以Time结尾
for (const section of result['apiBeneficiaryInfoDtoList']) {
let submitObj = {}
if (
props.pageSource == 'policyList' &&
props.idsObj.policyBizId &&
section.policyBeneficiaryBizId
) {
submitObj['policyBeneficiaryBizId'] = section.policyBeneficiaryBizId
submitObj['policyBizId'] = section.policyBizId
}
if (phoneOraddressKey.value.length > 0) {
submitObj.addressList = []
}
for (const key in section) {
if (pattern.test(key) && section[key]) {
section[key] = proxy.formatToDateTime(section[key])
}
//客户类型为个人的时候
if (section['customerType'] == 'INDIVIDUAL' && section[key]) {
for (const key1 in personalObj.value) {
if (key == key1) {
submitObj[key1] = section[key]
}
}
}
// 客户类型为公司的时候
if (section['customerType'] == 'COMPANY' && section[key]) {
for (const key2 in companyObj.value) {
if (key == key2) {
submitObj[key2] = section[key]
}
}
}
}
if (submitObj['companyMobile']) {
submitObj['companyMobileCode'] = submitObj['companyMobile'].split(' ')[0]
submitObj['companyMobile'] = submitObj['companyMobile'].split(' ')[1]
}
if (submitObj['mobile']) {
submitObj['mobileCode'] = submitObj['mobile'].split(' ')[0]
submitObj['mobile'] = submitObj['mobile'].split(' ')[1]
}
if (submitObj['authMobile']) {
submitObj['authMobileCode'] = submitObj['authMobile'].split(' ')[0]
submitObj['authMobile'] = submitObj['authMobile'].split(' ')[1]
}
phoneOraddressKey.value.forEach(item => {
if (item.drawerType == 'address' && item.id === section.id) {
submitObj.addressList.push({
type: item.type,
location: item.location,
street: item.street,
city: item.city,
region: item.region
})
}
})
deleteKeyList.value.forEach(item => {
delete submitObj[item]
})
submitForm.push(submitObj)
// if (Object.keys(submitObj).length > 0) {
// submitForm.push(submitObj)
// }
}
console.log('====================================')
console.log('提交受益人', submitForm)
console.log('====================================')
// 删除多余字段
return submitForm
}
// 表单提交
const submitForm = () => {
proxy.$refs['beneficiaryInfoFormRef'].validate((valid, fields) => { proxy.$refs['beneficiaryInfoFormRef'].validate((valid, fields) => {
if (valid) { if (valid) {
let submitObj = handleFormValues() errorFields.value = [] // 清空错误信息
//处理表单数据
// return processedBeneficiaryData.value.forEach(item => {
if (item.keyType == 'Array') {
if ( submitObj[item.key] = item.data
props.idsObj.appointmentBizId &&
(props.pageSource == 'fnaList' || props.pageSource == 'appointmentList')
) {
editBeneficiaryInfo({
appointmentBizId: props.idsObj.appointmentBizId,
apiBeneficiaryInfoDtoList: submitObj
}).then(res => {
if (res.code == 200) {
handleEditStatus(true)
proxy.$message.success('受益人修改成功')
emit('handleSuccessEdit')
}
})
}
if (props.idsObj.policyBizId && props.pageSource == 'policyList') {
updatePolicyBeneficiary({
policyBizId: props.idsObj.policyBizId,
policyBeneficiaryList: submitObj
}).then(res => {
if (res.code == 200) {
handleEditStatus(true)
proxy.$message.success('新单跟进-受益人修改成功')
emit('policyEditSuccess')
} }
}) })
if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message)
return undefined
} }
errorFields.value = [] // 清空错误信息
resolve(errorFields.value.length == 0 ? submitObj : null)
} else { } else {
// 获取校验失败的字段信息
errorFields.value = getInvalidFields(fields) errorFields.value = getInvalidFields(fields)
if (errorFields.value.length > 0) { if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message) proxy.$message.error(errorFields.value[0].message)
} }
resolve(undefined)
} }
}) })
})
} }
const resetForm = () => { const resetForm = () => {
proxy.$modal proxy.$modal
.confirm('是否确认撤销所作操作?') .confirm('是否确认撤销所作操作?')
...@@ -1127,8 +1027,6 @@ watch( ...@@ -1127,8 +1027,6 @@ watch(
if (newVal === 'beneficiary') { if (newVal === 'beneficiary') {
openList.value = false openList.value = false
setTimeout(() => {
// 修改状态
if (props.showSubmitBtn) { if (props.showSubmitBtn) {
setFormValue() setFormValue()
} else { } else {
...@@ -1138,7 +1036,6 @@ watch( ...@@ -1138,7 +1036,6 @@ watch(
exportValue: null exportValue: null
}) })
} }
}, 500)
} }
} }
) )
......
<template> <template>
<!-- :limit="limit" :on-exceed="handleExceed"--> <div class="uploadContainer">
<div> <CardOne title="材料信息">
<!-- 来自新单跟进的不需要上传预约附件,只能看预约附件 --> <template #content>
<div v-if="props.pageSource !== 'policyList'"> <el-table v-loading="loading" :data="fileTableList" boder>
<div class="fileUploadBox"> <el-table-column label="序号" type="index" width="55" />
<el-upload <el-table-column label="资料人" align="center" prop="dataPerson" width="200">
:action="uploadImgUrl" <template #default="scope">
:headers="headers" <dict-tag :options="fetchDictData('oss_data_person')" :value="scope.row.dataPerson" />
:show-file-list="false" </template>
:on-success="uploadSuccess" </el-table-column>
:before-upload="handleBeforeUpload"
<el-table-column label="资料类型" align="center" prop="dataType" width="200">
<template #default="scope">
<dict-tag :options="fetchDictData('oss_data_type')" :value="scope.row.dataType" />
</template>
</el-table-column>
<el-table-column label="注意事项" align="center" prop="precautions" />
<el-table-column
label="上传状态"
align="center"
prop="status"
v-if="fileTableList.length > 0 && fileTableList[0].relObjectMaterialBizId"
> >
<div class="uploadBox">
<el-icon size="20"><DocumentAdd /></el-icon>
<div class="file">选择文件</div>
</div>
</el-upload>
</div>
<div class="tip">(支持Word,Excel,PDF,图片格式)</div>
</div>
<el-table v-loading="loading" :data="fileTableList">
<!-- <el-table-column type="selection" width="55" /> -->
<el-table-column label="序号" type="index" width="50" />
<el-table-column label="文件名" align="center" prop="fileName" width="200" />
<!-- sortable -->
<el-table-column label="上传时间" align="center" prop="createTime" width="200">
<template #default="scope"> <template #default="scope">
<span>{{ parseTime(scope.row.createTime) }}</span> <span v-if="scope.row.status === 1">已上传</span>
<span v-if="scope.row.status === 0" style="color: red">待上传</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="上传人" align="center" prop="creatorName" />
<el-table-column label="文件类型" align="center" prop="fileType" />
<el-table-column <el-table-column
label="操作" label="操作"
align="center" align="center"
width="250" width="180"
class-name="small-padding fixed-width" class-name="small-padding fixed-width"
fixed="right" fixed="right"
> >
<template #default="scope"> <template #default="scope">
<el-button type="primary" link @click="downloadFile(scope.row)">下载</el-button> <!-- <el-button type="primary" link @click="downloadFile(scope.row)">下载</el-button> -->
<el-button <el-button
v-if="isImageFile(scope.row.fileName)"
type="primary" type="primary"
link link
@click="handleView(scope.row)" @click="handleUploadFile(scope.row)"
v-if="scope.row.fileBizIdList.length == 0"
> >
查看 上传
</el-button> </el-button>
<el-button <el-button
v-if="props.pageSource !== 'policyList'" v-if="props.pageSource !== 'policyList' && scope.row.fileBizIdList.length > 0"
type="primary" type="primary"
link link
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
>修改</el-button >查看</el-button
> >
<el-button <el-button
v-if="props.pageSource !== 'policyList'" v-if="props.pageSource !== 'policyList'"
...@@ -65,32 +61,62 @@ ...@@ -65,32 +61,62 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination </template>
v-show="total >= 0" </CardOne>
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getFileList"
/>
<el-dialog title="重命名文件" v-model="editVisible" width="800px" append-to-body>
<el-form>
<el-row>
<el-col :span="12">
<el-form-item label="文件名">
<el-input v-model="form.fileName" placeholder="请输入文件名" maxlength="300" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer> <CommonDialog
<div class="dialog-footer"> dialogTitle="上传附件"
<el-button type="primary" @click="submitForm">确 定</el-button> cancleText="取消"
<el-button @click="canelEdit">取 消</el-button> confirmText="确认"
dialogWidth="70%"
:openDialog="editVisible"
@close="editVisible = false"
@confirm="handleSubmitUpload"
:showClose="true"
>
<div class="dialogBox">
<div class="dialogLeft">
<div class="fileUploadBox">
<el-upload
:action="uploadImgUrl"
:headers="headers"
multiple
:limit="limit"
:show-file-list="false"
:on-exceed="handleExceed"
:on-success="uploadSuccess"
:before-upload="handleBeforeUpload"
>
<div class="uploadBox">
<el-icon size="20"><DocumentAdd /></el-icon>
<div class="file">选择文件</div>
</div> </div>
</template> </el-upload>
</el-dialog> </div>
<!-- 图片查看器 --> <div class="tip">(支持Word,Excel,PDF,图片格式)</div>
</div>
<div class="dialogRight">
<div
v-if="uploadedFiles.length === 0"
style="color: #999; padding: 20px; text-align: center"
>
暂无上传文件
</div>
<el-scrollbar max-height="300px">
<div
v-for="(file, index) in uploadedFiles"
:key="file.fileBizId"
class="uploaded-file-item"
>
<div class="fileName">{{ file.originalName }}</div>
<el-icon color="red" size="18" @click="removeUploadedFile(file, index)"
><Delete
/></el-icon>
</div>
</el-scrollbar>
</div>
</div>
</CommonDialog>
<el-dialog v-model="imageViewerVisible" title="图片预览" width="60%"> <el-dialog v-model="imageViewerVisible" title="图片预览" width="60%">
<div style="text-align: center"> <div style="text-align: center">
<el-image :src="imageUrl" fit="contain" /> <el-image :src="imageUrl" fit="contain" />
...@@ -100,60 +126,96 @@ ...@@ -100,60 +126,96 @@
</template> </template>
<script setup name="FileUpload"> <script setup name="FileUpload">
import CommonDialog from '@/components/commonDialog'
import CardOne from '@/components/formCard/cardOne'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import { addFile, getAppointmentFile, delFile, editAppointmentFile } from '@/api/sign/appointment' import { addFile, getAppointmentFile, delFile, editAppointmentFile } from '@/api/sign/appointment'
import useDictStore from '@/store/modules/dict'
import {
uploadMaterialList,
delUploadFile,
uploadRelObjectMaterialList,
uploadOssFileList
} from '@/api/common'
const props = defineProps({ const props = defineProps({
activeName: { type: String, default: '' }, //tab名称 activeName: { type: String, default: '' }, //tab名称
idsObj: { type: Object, default: () => ({}) }, //父组件传递过来的id对象 idsObj: { type: Object, default: () => ({}) }, //父组件传递过来的id对象
pageSource: { type: String, default: '' } //页面来源 pageSource: { type: String, default: '' } //页面来源
}) })
const dictStore = useDictStore() //获取字典数据
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
const editVisible = ref(false) const editVisible = ref(false)
const loading = ref(true) const loading = ref(true)
const total = ref(0) const total = ref(0)
const fileTableList = ref([]) const fileTableList = ref([])
const limit = ref(2) const limit = ref(10)
const fileSize = ref(10) const fileSize = ref(10)
const headers = ref({ Authorization: 'Bearer ' + getToken() }) const headers = ref({ Authorization: 'Bearer ' + getToken() })
const uploadImgUrl = ref(import.meta.env.VITE_APP_BASE_API + '/oss/api/oss/upload') // 上传的服务器地址 const uploadImgUrl = ref(import.meta.env.VITE_APP_BASE_API + '/oss/api/oss/upload') // 上传的服务器地址
// 图片查看相关状态 // 图片查看相关状态
const imageViewerVisible = ref(false) const imageViewerVisible = ref(false)
const imageUrl = ref('') const imageUrl = ref('')
const tempFileTableList = ref([])
const data = reactive({ const data = reactive({
form: {}, form: {},
queryParams: { queryParams: {
pageNo: 1, objectType: 'appointment'
pageSize: 4,
startTime: '',
endTime: '',
appointmentBizId: props.idsObj.appointmentBizId
} }
}) })
const { queryParams, form } = toRefs(data) const { queryParams, form } = toRefs(data)
const canelEdit = () => { // 新增:用于存储已上传成功的文件列表
const uploadedFiles = ref([])
const currentUploadRow = ref([])
const handleSubmitUpload = () => {
if (uploadedFiles.value.length > 0) {
fileTableList.value.forEach(item => {
if (item.materialBizId == currentUploadRow.value.materialBizId) {
item.fileBizIdList = JSON.parse(JSON.stringify(uploadedFiles.value))
}
})
}
editVisible.value = false editVisible.value = false
form.value = {}
console.log('fileTableList', fileTableList.value)
} }
const submitForm = () => { // 获取字典数据
let obj = { const fetchDictData = dictType => {
appointmentFileBizId: form.value.appointmentFileBizId, let options = []
fileName: form.value.fileName try {
dictStore.dictTypeLists.forEach(item => {
if (item.dictType == 'sys_no_yes') {
item.dictItemList.forEach(item2 => {
item2.value = String(item2.itemValue)
})
} }
editAppointmentFile(obj).then(response => { if (item.dictType == dictType) {
if (response.code == 200) { options = item.dictItemList
proxy.$modal.msgSuccess('文件名修改成功')
editVisible.value = false
getFileList()
} }
}) })
return options
} catch (error) {
console.error('获取字典数据失败:', error)
return []
}
}
// 重置上传列表(比如关闭弹窗时清空)
const resetUploadedList = () => {
uploadedFiles.value = []
} }
const handleUploadFile = row => {
currentUploadRow.value = JSON.parse(JSON.stringify(row))
editVisible.value = true
}
const handleDetele = row => { const handleDetele = row => {
proxy.$modal proxy.$modal
.confirm('是否确认删除名称为"' + row.fileName + '"的文件?') .confirm('是否确认删除此行数据?')
.then(function () { .then(function () {
return delFile(row.appointmentFileBizId) if (row.relObjectMaterialBizId) {
return delMaterial(row.relObjectMaterialBizId)
} else {
fileTableList.value.splice(row.index, 1)
}
}) })
.then(res => { .then(res => {
if (res.code == 200) { if (res.code == 200) {
...@@ -167,8 +229,22 @@ const isImageFile = fileName => { ...@@ -167,8 +229,22 @@ const isImageFile = fileName => {
return /\.(jpg|jpeg|png|gif|bmp|webp|svg|ico)$/i.test(fileName || '') return /\.(jpg|jpeg|png|gif|bmp|webp|svg|ico)$/i.test(fileName || '')
} }
const handleUpdate = row => { const handleUpdate = row => {
currentUploadRow.value = JSON.parse(JSON.stringify(row))
if (row.relObjectMaterialBizId) {
try {
uploadOssFileList({ objectBizId: row.relObjectMaterialBizId }).then(response => {
uploadedFiles.value = response.data
editVisible.value = true
})
} catch (error) {
uploadedFiles.value = []
proxy.$message.error('文件获取失败')
}
} else {
editVisible.value = true editVisible.value = true
form.value = JSON.parse(JSON.stringify(row)) uploadedFiles.value = JSON.parse(JSON.stringify(row.fileBizIdList))
}
} }
const handleView = row => { const handleView = row => {
imageUrl.value = row.fileUrl imageUrl.value = row.fileUrl
...@@ -208,57 +284,104 @@ function handleBeforeUpload(file) { ...@@ -208,57 +284,104 @@ function handleBeforeUpload(file) {
function handleExceed() { function handleExceed() {
proxy.$modal.msgError(`一次只能上传${limit.value}个文件!`) proxy.$modal.msgError(`一次只能上传${limit.value}个文件!`)
} }
const uploadSuccess = res => { // 文件上传成功回调
console.log('上传成功', res) const uploadSuccess = (res, file, fileList) => {
if (res.code == 200) { console.log('上传成功', res, file)
if (props.idsObj.appointmentBizId) { if (res.code === 200) {
let submitObj = { // 构造前端使用的文件对象(保留原始 file 信息 + 后端返回的 url 等)
appointmentBizId: props.idsObj.appointmentBizId, const uploadedFile = {
fileUrl: res.data.url, fileBizId: res.data.fileBizId, // 用于唯一标识
fileName: res.data.originalName, originalName: res.data.originalName || file.name,
ossFileBizId: res.data.fileBizId url: res.data.url,
size: file.size,
raw: file.raw // 原始 File 对象(如需后续操作)
} }
addFile(submitObj).then(res => { uploadedFiles.value.push(uploadedFile)
if (res.code == 200) {
proxy.$message.success('文件上传成功') proxy.$message.success('文件上传成功')
queryParams.value.pageNo = 1 } else {
getFileList() proxy.$message.error(res.msg || '上传失败')
// emit('handleSuccessEdit')
} }
}
// 删除已上传的文件(仅从列表移除,不调用后端删除)
const removeUploadedFile = (file, index) => {
try {
delUploadFile(file.fileBizId).then(response => {
uploadedFiles.value.splice(index, 1)
}) })
} } catch (error) {
proxy.$message.error('文件删除失败')
} }
} }
const getFileList = () => { const getFileList = () => {
loading.value = true loading.value = true
try { try {
getAppointmentFile(queryParams.value).then(response => { if (!props.idsObj.appointmentBizId) {
total.value = response.data.total uploadMaterialList(queryParams.value).then(response => {
fileTableList.value = response.data.records fileTableList.value = response.data
if (fileTableList.value.length > 0) { if (fileTableList.value.length > 0) {
for (const item of fileTableList.value) { fileTableList.value.forEach(item => {
item.fileType = '预约文件' item.fileBizIdList = []
})
} }
loading.value = false
})
} else {
let obj = {
objectType: 'appointment',
objectBizId: props.idsObj.appointmentBizId
} }
uploadRelObjectMaterialList(obj).then(response => {
fileTableList.value = response.data
loading.value = false loading.value = false
}) })
}
if (tempFileTableList.value.length > 0) {
fileTableList.value = JSON.parse(JSON.stringify(tempFileTableList.value))
}
} catch (error) { } catch (error) {
fileTableList.value = [] fileTableList.value = []
} finally { } finally {
loading.value = false loading.value = false
} }
} }
const handleFormValues = () => {
let submitData = []
fileTableList.value.forEach(item => {
if (item.fileBizIdList.length > 0) {
submitData.push({
materialBizId: item.materialBizId,
fileBizIdList: item.fileBizIdList.map(item => item.fileBizId)
})
}
})
return submitData
}
// 关闭弹窗时清空已上传列表
watch(editVisible, newVal => {
if (!newVal) {
resetUploadedList()
}
})
watch( watch(
() => props.activeName, () => props.activeName,
newVal => { newVal => {
tempFileTableList.value = JSON.parse(JSON.stringify(fileTableList.value))
if (newVal === 'accessories') { if (newVal === 'accessories') {
queryParams.value.pageNo = 1
getFileList() getFileList()
} }
} }
) )
// 暴露给父组件
defineExpose({
handleFormValues
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.uploadContainer {
padding-left: 10px;
padding-top: 10px;
}
.fileUploadBox { .fileUploadBox {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -267,12 +390,14 @@ watch( ...@@ -267,12 +390,14 @@ watch(
width: 100%; width: 100%;
padding: 20px 0; padding: 20px 0;
border: 1px dashed #dcdfe6; border: 1px dashed #dcdfe6;
height: 200px;
} }
.uploadBox { .uploadBox {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 100%;
.file { .file {
font-size: 14px; font-size: 14px;
margin-top: 10px; margin-top: 10px;
...@@ -284,4 +409,26 @@ watch( ...@@ -284,4 +409,26 @@ watch(
color: #909399; color: #909399;
margin: 10px 0 20px 0; margin: 10px 0 20px 0;
} }
.dialogBox {
width: 100%;
display: flex;
justify-content: space-between;
}
.dialogLeft {
width: 40%;
}
.dialogRight {
width: 55%;
}
.uploaded-file-item {
width: 100%;
background: rgba(247, 248, 250, 1);
border-radius: 4px;
padding: 10px;
margin-bottom: 5px;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 16px;
}
</style> </style>
<template> <template>
<div> <div>
<div v-if="questionnairesDom.length > 0"> <div v-if="questionnairesDom.length > 0" ref="questionRef">
<el-row> <CommonForm
<el-col :span="24"> :anchorList="anchorList"
<div class="topBtn"> :affixOffset="affixOffset"
<!-- <el-button type="warning" icon="DocumentAdd" @click="exportInfo" v-if="showContacts" :anchorOffset="10"
>导入联系人</el-button :scrollContainerSelector="anchorContainer"
> --> :scrollOffset="10"
<el-button :domIndex="tabIndex"
v-if="props.idsObj.appointmentBizId" :activeName="activeName"
type="primary" v-if="questionRef"
icon="EditPen"
@click="handleEditStatus(!editStatus)"
>编辑</el-button
> >
</div> <template #form-right>
</el-col>
</el-row>
<el-form ref="heathFormRef" :model="form" :rules="rules"> <el-form ref="heathFormRef" :model="form" :rules="rules">
<div v-for="(level1, l1) in questionnairesDom" :key="level1.firstCategory"> <div
v-for="(level1, l1) in questionnairesDom"
:key="level1.firstCategory"
:id="level1.firstCategory"
>
<el-row style="margin-bottom: 10px"> <el-row style="margin-bottom: 10px">
<div class="formBox"> <div class="formBox">
<div class="fatherLable"> <CardOne :title="level1.firstCategoryName">
<span>{{ level1.firstCategoryName }}</span> <template #content>
<div class="openCon" v-if="level1.showIcon" @click="changeOpenStatus(level1)">
<el-icon v-if="!level1.showMoudle"><Hide /></el-icon>
<el-icon v-else><View /></el-icon>
</div>
</div>
<el-row :gutter="20" v-if="level1.showMoudle"> <el-row :gutter="20" v-if="level1.showMoudle">
<template <template
v-for="(level2, l2) in level1.secondCategoryDtoList" v-for="(level2, l2) in level1.secondCategoryDtoList"
...@@ -39,7 +32,10 @@ ...@@ -39,7 +32,10 @@
{{ level2.secondCategoryName }} {{ level2.secondCategoryName }}
</div> </div>
<div> <div>
<div class="level2Content" v-for="(level3, l3) in level2.questionsDtoList"> <div
class="level2Content"
v-for="(level3, l3) in level2.questionsDtoList"
>
<div <div
class="level2Left" class="level2Left"
v-if="level2.secondCategory !== 'MEDICAL_CONDITION'" v-if="level2.secondCategory !== 'MEDICAL_CONDITION'"
...@@ -58,12 +54,11 @@ ...@@ -58,12 +54,11 @@
class="level3Content" class="level3Content"
v-if="level2.secondCategory !== 'MEDICAL_CONDITION'" v-if="level2.secondCategory !== 'MEDICAL_CONDITION'"
> >
<!-- 回显得时候拿不到optionBizId -->
<el-radio-group <el-radio-group
v-model=" v-model="
form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][l3][ form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][
'answerSessionsDto' l3
]['optionBizId'] ]['answerSessionsDto']['optionBizId']
" "
@change="handleRadioChange(l1, l2, l3, level3)" @change="handleRadioChange(l1, l2, l3, level3)"
:disabled="editStatus" :disabled="editStatus"
...@@ -78,9 +73,9 @@ ...@@ -78,9 +73,9 @@
<!--选择是才展示附加条件 --> <!--选择是才展示附加条件 -->
<div <div
v-if=" v-if="
form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][l3][ form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][
'answerSessionsDto' l3
]['optionBizId'] == 'option_1002' ]['answerSessionsDto']['optionBizId'] == 'option_1002'
" "
style="width: 100%" style="width: 100%"
> >
...@@ -107,9 +102,9 @@ ...@@ -107,9 +102,9 @@
v-if="level4.type === 'TEXT'" v-if="level4.type === 'TEXT'"
:type="level4.type" :type="level4.type"
v-model=" v-model="
form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][ form[l1]['secondCategoryDtoList'][l2][
l3 'questionsDtoList'
]['addQuestionsDtoList'][l4]['content'] ][l3]['addQuestionsDtoList'][l4]['content']
" "
placeholder="请输入" placeholder="请输入"
maxlength="30" maxlength="30"
...@@ -121,9 +116,9 @@ ...@@ -121,9 +116,9 @@
v-if="level4.type === 'DATE'" v-if="level4.type === 'DATE'"
:disabled="editStatus" :disabled="editStatus"
v-model=" v-model="
form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][ form[l1]['secondCategoryDtoList'][l2][
l3 'questionsDtoList'
]['addQuestionsDtoList'][l4]['content'] ][l3]['addQuestionsDtoList'][l4]['content']
" "
type="date" type="date"
placeholder="请输入" placeholder="请输入"
...@@ -136,39 +131,46 @@ ...@@ -136,39 +131,46 @@
</div> </div>
</div> </div>
<div v-if="level2.secondCategory == 'MEDICAL_CONDITION'"> <div v-if="level2.secondCategory == 'MEDICAL_CONDITION'">
<el-button
style="margin-bottom: 10px"
class="addBtn"
type="primary"
:icon="Plus"
size="small"
@click="addMedical(l1, l2, l3)"
:disabled="editStatus"
>继续添加</el-button
>
<div <div
v-for="(question, q4) in level3.answerSessionsDto v-for="(question, q4) in level3.answerSessionsDto
.questionTextJsonDtoList" .questionTextJsonDtoList"
style="margin-bottom: 10px" style="margin-bottom: 10px"
> >
<div class="questionContent"> <div class="questionContent">
<div class="questionTitle">{{ `${question.title}${q4 + 1}` }}</div> <div class="questionTitle">
{{ `${question.title}${q4 + 1}` }}
</div>
<el-input <el-input
type="text" type="text"
:disabled="editStatus" :disabled="editStatus"
v-model=" v-model="
form[l1]['secondCategoryDtoList'][l2]['questionsDtoList'][l3][ form[l1]['secondCategoryDtoList'][l2][
'answerSessionsDto' 'questionsDtoList'
]['questionTextJsonDtoList'][q4]['content'] ][l3]['answerSessionsDto']['questionTextJsonDtoList'][
q4
]['content']
" "
placeholder="请输入" placeholder="请输入"
maxlength="300" maxlength="300"
style="width: 70%" style="width: 70%"
/> />
<el-icon class="deleteIcon" @click="deleteMedical(l1, l2, l3, q4)" <el-icon
class="deleteIcon"
@click="deleteMedical(l1, l2, l3, q4)"
><Remove ><Remove
/></el-icon> /></el-icon>
</div> </div>
</div> </div>
<el-button
class="addBtn"
type="primary"
:icon="Plus"
size="small"
@click="addMedical(l1, l2, l3)"
:disabled="editStatus"
>继续添加</el-button
>
</div> </div>
</div> </div>
</div> </div>
...@@ -176,20 +178,14 @@ ...@@ -176,20 +178,14 @@
</el-col> </el-col>
</template> </template>
</el-row> </el-row>
</template>
</CardOne>
</div> </div>
</el-row> </el-row>
</div> </div>
<el-row> <!-- <el-row>
<el-col> <el-col>
<div class="tabButton"> <div class="tabButton">
<!-- <el-button
type="primary"
icon="RefreshRight"
@click="resetForm"
size="large"
:disabled="editStatus"
>重置</el-button
> -->
<el-button <el-button
type="primary" type="primary"
icon="Check" icon="Check"
...@@ -200,15 +196,18 @@ ...@@ -200,15 +196,18 @@
> >
</div> </div>
</el-col> </el-col>
</el-row> </el-row> -->
</el-form> </el-form>
</template>
</CommonForm>
</div> </div>
<div v-else class="domEmpty" v-loading="loading"></div> <div v-else class="domEmpty" v-loading="loading"></div>
</div> </div>
</template> </template>
<script setup name="secondHolderInfo"> <script setup name="secondHolderInfo">
import { Plus } from '@element-plus/icons-vue' import { Plus } from '@element-plus/icons-vue'
import CommonForm from '@/views/components/commonForm'
import CardOne from '@/components/formCard/cardOne'
import { watch } from 'vue' import { watch } from 'vue'
import { getQuestionnaires, saveQuestionnaires } from '@/api/sign/appointment' import { getQuestionnaires, saveQuestionnaires } from '@/api/sign/appointment'
import useDictStore from '@/store/modules/dict' import useDictStore from '@/store/modules/dict'
...@@ -216,28 +215,34 @@ import useDictStore from '@/store/modules/dict' ...@@ -216,28 +215,34 @@ import useDictStore from '@/store/modules/dict'
const dictStore = useDictStore() //获取字典数据 const dictStore = useDictStore() //获取字典数据
const props = defineProps({ const props = defineProps({
activeName: { type: String, default: '' }, //tab名称 activeName: { type: String, default: '' }, //tab名称
fearthStatus: { type: String, default: '' }, //父组件状态,新增、修改 editStatus: {
type: Boolean,
default: false
}, //父组件状态,新增、修改
formStatus: { type: String, default: '' }, //父组件状态,新增、修改 formStatus: { type: String, default: '' }, //父组件状态,新增、修改
idsObj: { type: Object, default: () => ({}) }, //父组件传递过来的id对象 idsObj: { type: Object, default: () => ({}) }, //父组件传递过来的id对象
appointmentStatus: { type: Number }, //父组件传递过来的预约的状态 appointmentStatus: { type: Number }, //父组件传递过来的预约的状态
customerInfo: { type: Object, default: () => ({}) }, customerInfo: { type: Object, default: () => ({}) },
//客户详情回显表单用 //客户详情回显表单用
showSubmitBtn: { type: Boolean, default: false }, //父组件状态,新增、修改 showSubmitBtn: { type: Boolean, default: false }, //父组件状态,新增、修改
foldInsurantInfo: { type: Boolean, default: false }, //是否隐藏受保人信息 foldInsurantInfo: { type: Boolean, default: false }, //是否隐藏受保人信息
pageSource: { type: String, default: '' } //页面来源 pageSource: { type: String, default: '' }, //页面来源
anchorContainer: { type: String, default: '' }, //锚点滚动容器
tabIndex: { type: [String, Number], default: '' }, //tab索引
affixOffset: { type: Number, default: 250 } //锚点吸顶距离
}) })
const emit = defineEmits(['handleSuccessEdit']) const emit = defineEmits(['handleSuccessEdit'])
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
const loading = ref(false) const loading = ref(false)
const errorFields = ref([]) // 存储校验失败的字段信息 const errorFields = ref([]) // 存储校验失败的字段信息
const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑 const questionRef = ref(null)
const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作 const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作
const showInsurant = ref(false) //是否显示受保人信息 const showInsurant = ref(false) //是否显示受保人信息
const questionnairesDom = ref([])
const data = reactive({ const data = reactive({
form: [], form: [],
tempSecondHolderForm: [], //由于切换tab的时候,表单数据会重置,所以需要 tempSecondHolderForm: [], //由于切换tab的时候,表单数据会重置,所以需要
questionnairesDom: [], // 处理后的表单数据 // questionnairesDom: [], // 处理后的表单数据
oldAppointmentData: [], // 保存旧的表单Dom,便于撤销操作 oldAppointmentData: [], // 保存旧的表单Dom,便于撤销操作
rules: {}, //表单验证规则, rules: {}, //表单验证规则,
queryParams: { queryParams: {
...@@ -246,8 +251,7 @@ const data = reactive({ ...@@ -246,8 +251,7 @@ const data = reactive({
name: undefined name: undefined
} }
}) })
const { form, rules, questionnairesDom, queryParams, oldAppointmentData, tempSecondHolderForm } = const { form, rules, queryParams, oldAppointmentData, tempSecondHolderForm } = toRefs(data)
toRefs(data)
const changeOpenStatus = level1 => { const changeOpenStatus = level1 => {
console.log('level1', level1) console.log('level1', level1)
let newDom = JSON.parse(JSON.stringify(questionnairesDom.value)) let newDom = JSON.parse(JSON.stringify(questionnairesDom.value))
...@@ -267,7 +271,7 @@ const addMedical = (l1, l2, l3) => { ...@@ -267,7 +271,7 @@ const addMedical = (l1, l2, l3) => {
}) })
} }
const deleteMedical = (l1, l2, l3, index) => { const deleteMedical = (l1, l2, l3, index) => {
if (editStatus.value) { if (props.editStatus) {
proxy.$modal.confirm(`请先点击编辑在删除病况`, { showCancel: '0', title: '填写提示' }) proxy.$modal.confirm(`请先点击编辑在删除病况`, { showCancel: '0', title: '填写提示' })
return return
} }
...@@ -304,9 +308,7 @@ const handleRadioChange = (l1, l2, l3, level3) => { ...@@ -304,9 +308,7 @@ const handleRadioChange = (l1, l2, l3, level3) => {
}) })
} }
} }
console.log('====================================')
console.log('answer', answer)
console.log('====================================')
let optionItem = level3.optionsDtoList.filter(item => item.optionBizId === answer.optionBizId) let optionItem = level3.optionsDtoList.filter(item => item.optionBizId === answer.optionBizId)
let newObj = { let newObj = {
...@@ -380,6 +382,10 @@ const getInvalidFields = fields => { ...@@ -380,6 +382,10 @@ const getInvalidFields = fields => {
// 处理表单填写得数据 // 处理表单填写得数据
const handleFormValues = () => { const handleFormValues = () => {
return new Promise(async resolve => {
proxy.$refs['heathFormRef'].validate((valid, fields) => {
if (valid) {
errorFields.value = [] // 清空错误信息
let submitObj = [] let submitObj = []
if (props.activeName == 'questionnaires') { if (props.activeName == 'questionnaires') {
submitObj = JSON.parse(JSON.stringify(form.value)) submitObj = JSON.parse(JSON.stringify(form.value))
...@@ -429,38 +435,15 @@ const handleFormValues = () => { ...@@ -429,38 +435,15 @@ const handleFormValues = () => {
} else if (props.idsObj.policyBizId && props.pageSource == 'policyList') { } else if (props.idsObj.policyBizId && props.pageSource == 'policyList') {
objectBizId = props.idsObj.policyBizId objectBizId = props.idsObj.policyBizId
} }
resolve(
return { errorFields.value.length == 0
? {
questionnaireBizId: 'questionnaires_1001', questionnaireBizId: 'questionnaires_1001',
objectBizId: objectBizId, objectBizId: objectBizId,
answerSessionsDtoList answerSessionsDtoList
} }
} : null
// 表单提交 )
const submitForm = () => {
proxy.$refs['heathFormRef'].validate((valid, fields) => {
if (valid) {
let submitObj = handleFormValues()
saveQuestionnaires(submitObj).then(res => {
if (res.code == 200) {
handleEditStatus(true)
proxy.$message.success('健康信息修改成功')
// emit('handleSuccessEdit')
getQuestionnairesInfo()
}
})
// if (props.idsObj.appointmentBizId || props.idsObj.policyBizId) {
// saveQuestionnaires(submitObj).then(res => {
// if (res.code == 200) {
// handleEditStatus(true)
// proxy.$message.success('健康信息修改成功')
// emit('handleSuccessEdit')
// getQuestionnairesInfo()
// }
// })
// }
errorFields.value = [] // 清空错误信息
} else { } else {
// 获取校验失败的字段信息 // 获取校验失败的字段信息
errorFields.value = getInvalidFields(fields) errorFields.value = getInvalidFields(fields)
...@@ -469,8 +452,10 @@ const submitForm = () => { ...@@ -469,8 +452,10 @@ const submitForm = () => {
} }
} }
}) })
})
} }
const getQuestionnairesInfo = () => { const getQuestionnairesInfo = () => {
loading.value = true loading.value = true
let id = '' let id = ''
...@@ -506,7 +491,7 @@ const getQuestionnairesInfo = () => { ...@@ -506,7 +491,7 @@ const getQuestionnairesInfo = () => {
level1.showMoudle = true level1.showMoudle = true
} else if (level1.firstCategory == 'INSURED_PERSON') { } else if (level1.firstCategory == 'INSURED_PERSON') {
level1.showIcon = true level1.showIcon = true
level1.showMoudle = false level1.showMoudle = true
} }
level1.secondCategoryDtoList.forEach((level2, l2) => { level1.secondCategoryDtoList.forEach((level2, l2) => {
level2.sm = 24 level2.sm = 24
...@@ -581,10 +566,19 @@ const getQuestionnairesInfo = () => { ...@@ -581,10 +566,19 @@ const getQuestionnairesInfo = () => {
questionnairesDom.value = form.value = result questionnairesDom.value = form.value = result
loading.value = false loading.value = false
console.log('questionnairesDom.value', questionnairesDom.value)
} }
}) })
} }
const anchorList = computed(() => {
let data = []
for (const section of questionnairesDom.value) {
if (section.showMoudle) {
data.push({ title: section.firstCategory, name: section.firstCategoryName })
}
}
return data
})
watch( watch(
() => props.activeName, () => props.activeName,
newVal => { newVal => {
...@@ -596,9 +590,7 @@ watch( ...@@ -596,9 +590,7 @@ watch(
props.idsObj.appointmentBizId && props.idsObj.appointmentBizId &&
(props.pageSource == 'fnaList' || props.pageSource == 'appointmentList') (props.pageSource == 'fnaList' || props.pageSource == 'appointmentList')
) { ) {
editStatus.value = true
} else if (props.idsObj.policyBizId && props.pageSource == 'policyList') { } else if (props.idsObj.policyBizId && props.pageSource == 'policyList') {
editStatus.value = true
} }
getQuestionnairesInfo() getQuestionnairesInfo()
console.log('foldInsurantInfo', props.foldInsurantInfo) console.log('foldInsurantInfo', props.foldInsurantInfo)
...@@ -609,7 +601,11 @@ watch( ...@@ -609,7 +601,11 @@ watch(
// 暴露给父组件 // 暴露给父组件
defineExpose({ defineExpose({
handleFormValues, handleFormValues,
handleEditStatus handleEditStatus,
questionLength: computed(() => {
return questionnairesDom.value.length
})
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -663,6 +659,7 @@ defineExpose({ ...@@ -663,6 +659,7 @@ defineExpose({
.level2Left { .level2Left {
margin-right: 15px; margin-right: 15px;
margin-top: 3px; margin-top: 3px;
color: #0052d9;
} }
.level2Right { .level2Right {
width: calc(100% - 30px); width: calc(100% - 30px);
......
<template> <template>
<!-- 只画好了样式具体的逻辑还没处理 --> <!-- v-if="processedProductData.length > 0" -->
<div v-if="processedProductData.length > 0"> <div>
<div ref="productRef"> <div ref="productRef">
<CommonForm <CommonForm
:anchorList="anchorList" :anchorList="anchorList"
...@@ -87,7 +87,7 @@ ...@@ -87,7 +87,7 @@
:remote-method="query => searchSelectList(query, child.key)" :remote-method="query => searchSelectList(query, child.key)"
:loading="searchLoadingStates[child.key]" :loading="searchLoadingStates[child.key]"
:disabled="editStatus" :disabled="editStatus"
@change="handleSearchSelectChange(father, child)" @change="handleSearchSelectChange(child.key)"
> >
<el-option <el-option
v-for="item in searchOptions[child.key] || []" v-for="item in searchOptions[child.key] || []"
...@@ -115,18 +115,38 @@ ...@@ -115,18 +115,38 @@
> >
</el-col> </el-col>
<el-table :data="father.data" border v-if="father.data.length > 0"> <el-table :data="father.data" border v-if="father.data.length > 0">
<template v-if="father.key == 'apiProductPlanAdditionalInfoDtoList'"> <!-- 动态渲染列 -->
<el-table-column label="姓名" prop="realName" align="center" /> <el-table-column
<el-table-column width="60px" align="center" label="操作"> v-for="column in father.columns"
:key="column.prop"
:label="column.label"
:prop="column.prop"
align="center"
>
<template #default="scope"> <template #default="scope">
<el-icon <span v-if="column.type === 'text'">{{ scope.row[column.prop] }}</span>
class="deleteIcon"
@click="deleteChildren(father, scope.$index)"
><Delete
/></el-icon>
</template> </template>
</el-table-column> </el-table-column>
<!-- 操作列(固定) -->
<el-table-column align="center" label="操作" width="150" fixed="right">
<template #default="scope">
<el-button
type="primary"
size="small"
@click="updateChildren(father, scope.row)"
>
修改
</el-button>
<el-button
type="danger"
size="small"
@click="deleteChildren(father, scope.$index)"
>
删除
</el-button>
</template> </template>
</el-table-column>
</el-table> </el-table>
</el-row> </el-row>
</template> </template>
...@@ -145,9 +165,10 @@ ...@@ -145,9 +165,10 @@
:showClose="true" :showClose="true"
:openDialog="dialogVisible" :openDialog="dialogVisible"
@close="dialogVisible = false" @close="dialogVisible = false"
@confirm="dialogProductConfirm"
> >
<div class="dialogBox"> <div class="dialogBox">
<el-form> <el-form :model="dialogForm" ref="dialogFormRef">
<el-row :gutter="20"> <el-row :gutter="20">
<template v-for="(child, dIndex) in additionalProductForm"> <template v-for="(child, dIndex) in additionalProductForm">
<el-col :sm="child.sm" :lg="child.lg" class="formItem"> <el-col :sm="child.sm" :lg="child.lg" class="formItem">
...@@ -161,14 +182,14 @@ ...@@ -161,14 +182,14 @@
<el-input <el-input
v-if="child.domType === 'Input'" v-if="child.domType === 'Input'"
:type="child.inputType" :type="child.inputType"
v-model="child.value" v-model="dialogForm[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
maxlength="30" maxlength="30"
/> />
<el-select <el-select
v-if="child.domType === 'Select'" v-if="child.domType === 'Select'"
v-model="child.value" v-model="dialogForm[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
> >
<el-option <el-option
...@@ -181,12 +202,12 @@ ...@@ -181,12 +202,12 @@
<el-date-picker <el-date-picker
style="width: 100%" style="width: 100%"
v-if="child.domType === 'DatePicker'" v-if="child.domType === 'DatePicker'"
v-model="child.value" v-model="dialogForm[child.key]"
type="date" type="date"
:placeholder="child.placeholder" :placeholder="child.placeholder"
/> />
<el-select <el-select
v-model="child.value" v-model="dialogForm[child.key]"
v-if="child.domType === 'SearchSelect'" v-if="child.domType === 'SearchSelect'"
filterable filterable
remote remote
...@@ -224,7 +245,9 @@ import { watch } from 'vue' ...@@ -224,7 +245,9 @@ import { watch } from 'vue'
import { import {
getInsuranceProductList, getInsuranceProductList,
getAdditionalProductList, getAdditionalProductList,
secondAdditonalList secondAdditonalList,
getInsuranceCategory,
getInsuranceCompany
} from '@/api/common' } from '@/api/common'
import { editProductPlanInfo, delAdditional } from '@/api/sign/appointment' import { editProductPlanInfo, delAdditional } from '@/api/sign/appointment'
import { updatePolicyProduct, delPolicyAdditional } from '@/api/sign/underwritingMain' import { updatePolicyProduct, delPolicyAdditional } from '@/api/sign/underwritingMain'
...@@ -252,11 +275,11 @@ const emit = defineEmits(['handleSuccessEdit', 'policyEditSuccess']) ...@@ -252,11 +275,11 @@ const emit = defineEmits(['handleSuccessEdit', 'policyEditSuccess'])
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
// const { sys_no_yes } = proxy.useDict('sys_no_yes') // const { sys_no_yes } = proxy.useDict('sys_no_yes')
const dialogTitle = ref('新增') const dialogTitle = ref('新增')
const dialogKey = ref('')
const dialogVisible = ref(false) const dialogVisible = ref(false)
const productRef = ref(null) // 用于存储当前点击的drawer框返回的对象,修改的时候回显值也要存key const productRef = ref(null) // 用于存储当前点击的drawer框返回的对象,修改的时候回显值也要存key
const errorFields = ref([]) // 存储校验失败的字段信息 const errorFields = ref([]) // 存储校验失败的字段信息
// const anchorList = ref([]) // 存储校验失败的字段信息
// const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑
const openList = ref(false) // 客户列表弹窗 const openList = ref(false) // 客户列表弹窗
const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作 const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作
const currencyType = ref([]) // 是否列表 const currencyType = ref([]) // 是否列表
...@@ -269,86 +292,89 @@ const data = reactive({ ...@@ -269,86 +292,89 @@ const data = reactive({
processedProductData: [], // 处理后的表单数据 processedProductData: [], // 处理后的表单数据
oldProductDomData: [], // 保存旧的表单Dom,便于撤销操作 oldProductDomData: [], // 保存旧的表单Dom,便于撤销操作
rules: {}, //表单验证规则, rules: {}, //表单验证规则,
dialogForm: {},
queryParams: { queryParams: {
pageNo: 1, pageNo: 1,
pageSize: 4, pageSize: 4,
name: undefined name: undefined
} }
}) })
const { form, rules, processedProductData, queryParams, oldProductDomData, tempForm } = toRefs(data) const { form, rules, processedProductData, queryParams, oldProductDomData, tempForm, dialogForm } =
// 添加表单子级dom toRefs(data)
const addChildren = father => { const deleteChildren = (father, index) => {
if (props.editStatus) { if (father.key == 'apiProductPlanAdditionalInfoDtoList') {
proxy.$message.warning('请先点击编辑') father.data.splice(index, 1)
return proxy.$message.success('附加计划删除成功')
} }
}
const updateChildren = (father, row) => {
dialogForm.value = JSON.parse(JSON.stringify(row))
if (father.key == 'apiProductPlanAdditionalInfoDtoList') { if (father.key == 'apiProductPlanAdditionalInfoDtoList') {
dialogTitle.value = '新增附加计划' dialogTitle.value = '修改附加计划'
dialogKey.value = 'apiProductPlanAdditionalInfoDtoList'
additionalProductForm.value = JSON.parse(JSON.stringify(father.formItem)) additionalProductForm.value = JSON.parse(JSON.stringify(father.formItem))
dialogVisible.value = true
} }
dialogVisible.value = true
} }
const deleteChildren = (father, childIndex) => { const dialogProductConfirm = () => {
if (editStatus.value) { proxy.$refs['dialogFormRef'].validate((valid, fields) => {
proxy.$message.warning('编辑状态下才能删除') if (valid) {
return let newDOM = JSON.parse(JSON.stringify(processedProductData.value))
} for (const section of newDOM) {
return if (section.key == dialogKey.value) {
const processedData = JSON.parse(JSON.stringify(processedProductData.value)) // 处理下拉值得显示
if ( for (const child of section.formItem) {
props.idsObj.appointmentBizId && if (child.domType == 'Select' && dialogForm.value[child.key]) {
form.value[father.key][childIndex].additionalBizId && child.options.forEach(item => {
(props.pageSource == 'appointmentList' || props.pageSource == 'fnaList') if (item.value == dialogForm.value[child.key]) {
) { dialogForm.value[child.key + 'Value'] = item.label
delAdditional(form.value[father.key][childIndex].additionalBizId).then(res => {
if (res.code == 200) {
proxy.$message.success('附加险删除成功')
for (const section of processedData) {
if (father.key == 'apiProductPlanAdditionalInfoDtoList' && section.key == father.key) {
section.data.splice(childIndex, 1)
} }
})
} }
//更新form表单对应的数据,以便收集填写的值 if (child.domType == 'SearchSelect' && dialogForm.value[child.key]) {
form.value[father.key].splice(childIndex, 1) if (child.key == 'productLaunchName') {
emit('handleSuccessEdit') dictStore.productAdditionalList.forEach(item => {
if (item.value == dialogForm.value[child.key]) {
dialogForm.value[child.key + 'Value'] = item.label
} }
}) })
} else if (
props.idsObj.policyBizId &&
form.value[father.key][childIndex].id &&
props.pageSource == 'policyList'
) {
delPolicyAdditional(form.value[father.key][childIndex].id).then(res => {
if (res.code == 200) {
proxy.$message.success('附加险删除成功')
for (const section of processedData) {
if (father.key == 'apiProductPlanAdditionalInfoDtoList' && section.key == father.key) {
section.data.splice(childIndex, 1)
} }
} }
//更新form表单对应的数据,以便收集填写的值
form.value[father.key].splice(childIndex, 1)
emit('policyEditSuccess')
} }
}) let index = section.data.findIndex(item => item.id == dialogForm.value.id)
if (index == -1) {
section.data.push(dialogForm.value)
} else { } else {
for (const section of processedData) { section.data[index] = JSON.parse(JSON.stringify(dialogForm.value))
if (father.key == 'apiProductPlanAdditionalInfoDtoList' && section.key == father.key) {
section.data.splice(childIndex, 1)
} }
} }
//更新form表单对应的数据,以便收集填写的值
form.value[father.key].splice(childIndex, 1)
} }
processedProductData.value = newDOM
processedProductData.value = processedData dialogVisible.value = false
dialogForm.value = {}
}
})
}
// 添加表单子级dom
const addChildren = father => {
if (props.editStatus) {
proxy.$message.warning('请先点击编辑')
return
}
dialogForm.value = { id: Date.now() + Math.floor(Math.random()) }
if (father.key == 'apiProductPlanAdditionalInfoDtoList') {
dialogTitle.value = '新增附加计划'
dialogKey.value = father.key
additionalProductForm.value = JSON.parse(JSON.stringify(father.formItem))
dialogVisible.value = true
}
} }
const handleSearchSelectChange = (key, index) => { const handleSearchSelectChange = (key, index) => {
// 附加计划选择产品后,给供款期数下拉框赋值 // 附加计划选择产品后,给供款期数下拉框赋值
if (key == 'productLaunchName') { if (key == 'productLaunchName') {
additionalProductForm.value.forEach(item => { additionalProductForm.value.forEach(item => {
searchOptions.value['productLaunchName'].forEach(item1 => { searchOptions.value['productLaunchName'].forEach(item1 => {
if (item1.value == additionalProductForm.value[index]['value']) { if (item1.value == dialogForm.value['productLaunchName']) {
item1.apiAttributeSettingDtoList.forEach(item2 => { item1.apiAttributeSettingDtoList.forEach(item2 => {
if ( if (
item2.attributeSettingBizId == 'attribute_setting_okpcuc8tlXRfVIAy' && item2.attributeSettingBizId == 'attribute_setting_okpcuc8tlXRfVIAy' &&
...@@ -371,6 +397,17 @@ const handleSearchSelectChange = (key, index) => { ...@@ -371,6 +397,17 @@ const handleSearchSelectChange = (key, index) => {
}) })
}) })
} }
if (key == 'insuranceTypeName') {
searchOptions.value['insuranceTypeName'].forEach(item => {
if (item.value == form.value['apiProductPlanMainInfoDto']['insuranceTypeName']) {
if (item.code == 'CI') {
resetShow('sumInsured', true)
} else {
resetShow('sumInsured', false)
}
}
})
}
} }
// 下拉框搜索方法 // 下拉框搜索方法
// 搜索方法 // 搜索方法
...@@ -423,6 +460,48 @@ const searchSelectList = async (query, fieldKey) => { ...@@ -423,6 +460,48 @@ const searchSelectList = async (query, fieldKey) => {
}) })
searchOptions.value[fieldKey] = response.data.records searchOptions.value[fieldKey] = response.data.records
} }
} else if (fieldKey === 'companyName') {
const params9 = {
pageNo: 1,
pageSize: 10,
queryContent: query.trim()
}
const response9 = await getInsuranceCompany(params9)
if (response9.code == 200) {
response9.data.records = response9.data.records.map(item => {
return {
...item,
label: item.fullName,
value: item.insuranceCompanyBizId
}
})
searchOptions.value[fieldKey] = response9.data.records
}
} else if (fieldKey == 'insuranceTypeName') {
if (!form.value['apiProductPlanMainInfoDto'].companyName) {
proxy.$modal.confirm(`请先选择保险公司`, {
showCancel: '0',
title: '填写提示'
})
// row.insuranceType = ''
return
}
const params1 = {
pageNo: 1,
pageSize: 10,
name: query.trim()
}
const response1 = await getInsuranceCategory(params1)
if (response1.code == 200) {
response1.data.records = response1.data.records.map(item => {
return {
...item,
label: item.name,
value: item.insuranceCategoryBizId
}
})
searchOptions.value[fieldKey] = response1.data.records
}
} }
} catch (error) { } catch (error) {
console.error(`${fieldKey} 搜索失败`, error) console.error(`${fieldKey} 搜索失败`, error)
...@@ -453,7 +532,6 @@ const processFormData = async () => { ...@@ -453,7 +532,6 @@ const processFormData = async () => {
const processedData = JSON.parse(JSON.stringify(productDomData)) const processedData = JSON.parse(JSON.stringify(productDomData))
for (const section of processedData) { for (const section of processedData) {
// anchorList.value.push({ title: section.anchorKey, name: section.fatherTitle })
if (section.fatherRequired) { if (section.fatherRequired) {
rules.value[section.key] = {} rules.value[section.key] = {}
} }
...@@ -493,11 +571,6 @@ const processFormData = async () => { ...@@ -493,11 +571,6 @@ const processFormData = async () => {
currencyType.value = child.options currencyType.value = child.options
} }
} }
if (props.fnaFormBizId) {
child.disabled = true
} else {
child.disabled = false
}
} }
} }
if (field.dictType) { if (field.dictType) {
...@@ -513,11 +586,6 @@ const processFormData = async () => { ...@@ -513,11 +586,6 @@ const processFormData = async () => {
{ required: true, message: `${field.label}不能为空`, trigger: 'blur' } { required: true, message: `${field.label}不能为空`, trigger: 'blur' }
] ]
} }
if (props.showSubmitBtn) {
field.disabled = true
} else {
field.disabled = false
}
} }
} }
} }
...@@ -548,14 +616,15 @@ const processFormData = async () => { ...@@ -548,14 +616,15 @@ const processFormData = async () => {
// idsObj.appointmentBizId // idsObj.appointmentBizId
// 证明是修改 // 证明是修改
if (props.showSubmitBtn) { if (props.showSubmitBtn) {
// editStatus.value = true
// processedProductData.value = processedData
//在流程和预约的时候要调用这个方法回显修改数据 //在流程和预约的时候要调用这个方法回显修改数据
setFormValue(props.apiProductPlanInfoDto, processedData) setFormValue(props.apiProductPlanInfoDto, processedData)
} else { } else {
// editStatus.value = false if (oldProductDomData.value.length > 0) {
processedProductData.value = JSON.parse(JSON.stringify(oldProductDomData.value))
} else {
processedProductData.value = processedData processedProductData.value = processedData
} }
}
} }
// 根据联动重置表单项的显示与否 // 根据联动重置表单项的显示与否
...@@ -564,7 +633,7 @@ const resetShow = (childKey, status) => { ...@@ -564,7 +633,7 @@ const resetShow = (childKey, status) => {
for (const section of processedProductData.value) { for (const section of processedProductData.value) {
// 暂时没考虑data里嵌套children的情况 // 暂时没考虑data里嵌套children的情况
if (section.data) { if (section.data && section.data.length > 0) {
for (const field of section.data) { for (const field of section.data) {
if (field.key == childKey) { if (field.key == childKey) {
// 获取字典数据 // 获取字典数据
...@@ -834,7 +903,7 @@ const getInvalidFields = fields => { ...@@ -834,7 +903,7 @@ const getInvalidFields = fields => {
if (fields[field] && fields[field].length > 0) { if (fields[field] && fields[field].length > 0) {
errors.push({ errors.push({
field: field, field: field,
message: fields[field][0].message message: `产品计划模块-${fields[field][0].message}`
}) })
} }
} }
...@@ -850,105 +919,57 @@ const isObject = value => { ...@@ -850,105 +919,57 @@ const isObject = value => {
return typeof value === 'object' && value !== null && !Array.isArray(value) return typeof value === 'object' && value !== null && !Array.isArray(value)
} }
const handleSubmitForm = () => { const handleSubmitForm = () => {
let result = {} let submitObj = {}
if (props.activeName == 'productPlan') { if (props.activeName == 'productPlan') {
result = JSON.parse(JSON.stringify(form.value)) submitObj = JSON.parse(JSON.stringify(form.value))
} else { } else {
result = JSON.parse(JSON.stringify(tempForm.value)) submitObj = JSON.parse(JSON.stringify(tempForm.value))
}
for (const key in result) {
if (isObject(result[key])) {
for (const key2 in result[key]) {
if (key2 == 'isBacktrack' && result[key][key2] == '0') {
result[key]['policyEffectiveDate'] = null
}
if (key2 == 'policyEffectiveDate' && result[key][key2]) {
result[key][key2] = proxy.formatToDateTime(result[key][key2])
}
for (const section of dictStore.insureProductList) {
if (key2 == 'productName' && section.productBizId == result[key][key2]) {
result[key][key2] = section.productName
result[key]['productBizId'] = section.productBizId
result[key]['companyName'] = section.ssDeptName
}
}
} }
let resDom = JSON.parse(JSON.stringify(processedProductData.value))
return new Promise(async resolve => {
proxy.$refs['productFormRef'].validate((valid, fields) => {
if (valid) {
errorFields.value = [] // 清空错误信息
resDom.forEach(section => {
if (section.keyType == 'Array' && section.data.length > 0) {
submitObj[section.key] = JSON.parse(JSON.stringify(section.data))
} }
if (isArray(result[key])) {
result[key] = result[key]
.map(item => {
// 删除指定字段
delete item.childTitle
delete item.children
delete item.disabled
delete item.id
delete item.span
delete item.deleteBtn
return item
}) })
.filter(item => Object.keys(item).length > 0) // 过滤空对象 // 保险公司名称转换
} dictStore.allInsuranceCompanyList.forEach(item => {
if (key == 'apiProductPlanAdditionalInfoDtoList') { if (submitObj.apiProductPlanMainInfoDto.companyName == item.value) {
if (result[key].length > 0) { submitObj.apiProductPlanMainInfoDto.companyName = item.label
result[key] = result[key].filter(item => {
for (const key4 in item) {
for (const section of dictStore.additionalProductList) {
if (key4 == 'addProductName' && section.additionalProductBizId == item[key4]) {
item[key4] = section.productName
item['additionalProductBizId'] = section.additionalProductBizId
}
}
if (item[key4]) return item
} }
}) })
} searchOptions.value['insuranceTypeName'].forEach(item => {
} if (submitObj.apiProductPlanMainInfoDto.insuranceTypeName == item.value) {
} submitObj.apiProductPlanMainInfoDto.insuranceTypeName = item.label
console.log('新单提交产品计划', result)
return result
}
// 表单提交
const submitForm = saveType => {
// return
proxy.$refs['productFormRef'].validate((valid, fields) => {
if (valid) {
let result = handleSubmitForm()
if (
props.idsObj.appointmentBizId &&
(props.pageSource == 'fnaList' || props.pageSource == 'appointmentList')
) {
editProductPlanInfo(result).then(res => {
if (res.code == 200) {
handleEditStatus(true)
proxy.$message.success('预约-产品计划修改成功')
emit('handleSuccessEdit')
} }
}) })
} searchOptions.value['productLaunchName'].forEach(item => {
if (props.idsObj.policyBizId && props.pageSource == 'policyList') { if (submitObj.apiProductPlanMainInfoDto.productLaunchName == item.value) {
result.policyBizId = props.idsObj.policyBizId submitObj.apiProductPlanMainInfoDto.productLaunchName = item.label
updatePolicyProduct(result).then(res => {
if (res.code == 200) {
handleEditStatus(true)
proxy.$message.success('新单跟进-产品计划修改成功')
emit('policyEditSuccess')
} }
}) })
console.log('产品计划', submitObj)
if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message)
return undefined
} }
errorFields.value = [] // 清空错误信息
resolve(errorFields.value.length == 0 ? submitObj : null)
} else { } else {
// 获取校验失败的字段信息
errorFields.value = getInvalidFields(fields) errorFields.value = getInvalidFields(fields)
if (errorFields.value.length > 0) { if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message) proxy.$message.error(errorFields.value[0].message)
} }
resolve(undefined)
} }
}) })
})
} }
const anchorList = computed(() => { const anchorList = computed(() => {
let data = [] let data = []
for (const section of processedProductData.value) { for (const section of processedProductData.value) {
...@@ -972,6 +993,7 @@ watch( ...@@ -972,6 +993,7 @@ watch(
newVal => { newVal => {
productRef.value = null productRef.value = null
tempForm.value = { ...form.value } tempForm.value = { ...form.value }
oldProductDomData.value = JSON.parse(JSON.stringify(processedProductData.value))
if (newVal === 'productPlan') { if (newVal === 'productPlan') {
openList.value = false openList.value = false
processFormData() processFormData()
......
<template> <template>
<!-- v-if="processedSecondHolderData.length > 0" -->
<div> <div>
<div v-if="processedSecondHolderData.length > 0"> <div>
<el-row> <CommonForm :showAnchor="false">
<el-col :span="24"> <template #form-right>
<div class="topBtn"> <el-form ref="secondHolderFormRef" :model="form" :rules="rules">
<!-- <el-button type="warning" icon="DocumentAdd" @click="exportInfo" v-if="showContacts" <el-row v-for="father in processedSecondHolderData" style="margin-bottom: 10px">
>导入联系人</el-button <div class="formBox formFna">
> --> <CardOne :title="father.fatherTitle" v-if="father.showMoudle">
<el-button <template #content>
v-if="props.showSubmitBtn" <el-row v-if="!father.showTable" :gutter="20">
type="primary"
icon="EditPen"
@click="handleEditStatus(!editStatus)"
>编辑</el-button
>
</div>
</el-col>
</el-row>
<el-form ref="secondHolderFormRef" :model="form" :rules="rules" label-width="120px">
<div v-for="father in processedSecondHolderData">
<el-row style="margin-bottom: 10px" v-if="father.showMoudle">
<div class="formBox">
<div class="fatherLable">{{ father.fatherTitle }}</div>
<div class="fatherDes">{{ father.description }}</div>
<el-row :gutter="20">
<template v-for="child in father.data" :key="child.key"> <template v-for="child in father.data" :key="child.key">
<el-col :sm="child.sm" :lg="child.lg" class="formItem" v-if="child.show"> <el-col :sm="child.sm" :lg="child.lg" class="formItem" v-if="child.show">
<div> <div>
<el-form-item <el-form-item
:label-width="child.labelWidth"
:label="child.label" :label="child.label"
:prop="child.key" :prop="child.key"
:key="child.key" :key="child.key"
:label-width="child.labelWidth"
:label-position="child.labelPosition" :label-position="child.labelPosition"
> >
<el-input <el-input
...@@ -41,15 +26,15 @@ ...@@ -41,15 +26,15 @@
v-model="form[child.key]" v-model="form[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
maxlength="30" maxlength="30"
:disabled="child.disabled" :disabled="editStatus"
@input="handleInputChange(father, child)" :style="{ width: child.inputWidth ? child.inputWidth : '100%' }"
/> />
<el-select <el-select
v-if="child.domType === 'Select'" v-if="child.domType === 'Select'"
v-model="form[child.key]" v-model="form[child.key]"
:placeholder="child.placeholder" :placeholder="child.placeholder"
@change="handleSelectChange(father, child)" @change="handleSelectChange(father, child)"
:disabled="child.disabled" :disabled="editStatus"
> >
<el-option <el-option
v-for="item in child.options" v-for="item in child.options"
...@@ -59,59 +44,106 @@ ...@@ -59,59 +44,106 @@
/> />
</el-select> </el-select>
<el-date-picker <el-date-picker
v-model="form[child.key]"
style="width: 100%" style="width: 100%"
v-if="child.domType === 'DatePicker'" v-if="child.domType === 'DatePicker'"
v-model="form[child.key]"
type="date" type="date"
:placeholder="child.placeholder" :placeholder="child.placeholder"
:disabled="child.disabled" :disabled="editStatus"
:disabled-date="disabledDate"
@change="handleDateChange(child)"
/> />
<el-input <el-checkbox-group
v-if="child.domType === 'arrowRight'" v-if="child.domType === 'Checkbox'"
v-model="form[child.key]" v-model="form[child.key]"
:placeholder="child.placeholder" :disabled="editStatus"
@click="handleFoucs(child)" >
:suffix-icon="ArrowRight" <el-checkbox
readonly v-for="item in child.options"
:disabled="child.disabled" :key="item.value"
:label="item.value"
> >
</el-input> {{ item.label }}
<el-button v-if="child.domType === 'button'" :type="child.buttonType">{{ </el-checkbox>
child.buttonTxt </el-checkbox-group>
}}</el-button> <!-- <el-select
v-model="form[child.key]"
v-if="child.domType === 'SearchSelect'"
filterable
remote
reserve-keyword
placeholder="请输入关键词搜索"
:remote-method="query => searchSelectList(query, child.key)"
:loading="searchLoadingStates[child.key]"
:disabled="editStatus"
@change="handleSearchSelectChange(child.key)"
>
<el-option
v-for="item in searchOptions[child.key] || []"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select> -->
</el-form-item> </el-form-item>
</div> </div>
</el-col> </el-col>
</template> </template>
</el-row> </el-row>
</div> <!-- 是表格数据 -->
</el-row> <el-row v-if="father.showTable">
</div> <el-col :span="24" v-if="father.addChildren">
<el-row v-if="props.showSubmitBtn"> <el-button
<el-col>
<div class="tabButton">
<!-- <el-button
type="primary"
icon="RefreshRight"
@click="resetForm"
size="large"
:disabled="editStatus" :disabled="editStatus"
>重置</el-button type="primary"
> --> icon="Plus"
size="small"
style="margin-bottom: 10px"
@click="addChildren(father)"
>{{ father.addChildrenTxt }}</el-button
>
</el-col>
<el-table :data="father.data" border v-if="father.data.length > 0">
<!-- 动态渲染列 -->
<el-table-column
v-for="column in father.columns"
:key="column.prop"
:label="column.label"
:prop="column.prop"
align="center"
>
<template #default="scope">
<span v-if="column.type === 'text'">{{ scope.row[column.prop] }}</span>
</template>
</el-table-column>
<!-- 操作列(固定) -->
<el-table-column align="center" label="操作" width="150">
<template #default="scope">
<el-button <el-button
type="primary" type="primary"
icon="Check" size="small"
@click="submitForm" @click="updateChildren(father, scope.row)"
size="large"
:disabled="editStatus"
>提交</el-button
> >
修改
</el-button>
<el-button
type="danger"
size="small"
@click="deleteChildren(father, scope.$index)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
</template>
</CardOne>
</div> </div>
</el-col>
</el-row> </el-row>
</el-form> </el-form>
</template>
</CommonForm>
<el-dialog title="联系人信息" v-model="openList" width="600px" append-to-body> <el-dialog title="联系人信息" v-model="openList" width="600px" append-to-body>
<div> <div>
<el-form :model="queryParams" ref="queryRef" :inline="true" label-width="85px"> <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="85px">
...@@ -179,6 +211,8 @@ ...@@ -179,6 +211,8 @@
</div> </div>
</template> </template>
<script setup name="secondHolderInfo"> <script setup name="secondHolderInfo">
import CardOne from '@/components/formCard/cardOne'
import CommonForm from '@/views/components/commonForm'
import { calculateExactAge } from '@/utils/date' import { calculateExactAge } from '@/utils/date'
import { ArrowRight } from '@element-plus/icons-vue' import { ArrowRight } from '@element-plus/icons-vue'
import secondHolderDomData from '@/formJson/secondHolder' import secondHolderDomData from '@/formJson/secondHolder'
...@@ -202,7 +236,11 @@ const props = defineProps({ ...@@ -202,7 +236,11 @@ const props = defineProps({
appointmentStatus: { type: Number }, //父组件传递过来的预约的状态 appointmentStatus: { type: Number }, //父组件传递过来的预约的状态
customerInfo: { type: Object, default: () => ({}) }, //客户详情回显表单用 customerInfo: { type: Object, default: () => ({}) }, //客户详情回显表单用
showSubmitBtn: { type: Boolean, default: false }, //父组件状态,新增、修改 showSubmitBtn: { type: Boolean, default: false }, //父组件状态,新增、修改
pageSource: { type: String, default: false } //页面来源 pageSource: { type: String, default: false }, //页面来源
fatherTabName: { type: String, default: '' }, //一级tab名称
anchorContainer: { type: String, default: '' }, //锚点滚动容器
editStatus: { type: Boolean, default: false }, //编辑状态
tabIndex: { type: [String, Number], default: '' } //tab索引
}) })
const emit = defineEmits(['handleSuccessEdit', 'policyEditSuccess']) const emit = defineEmits(['handleSuccessEdit', 'policyEditSuccess'])
...@@ -214,7 +252,7 @@ const showCountryDrawer = ref(false) //国家/地区抽屉开关 ...@@ -214,7 +252,7 @@ const showCountryDrawer = ref(false) //国家/地区抽屉开关
const drawerInfo = ref({}) // 用于存储所有arrowRight类型的输入框输入值 const drawerInfo = ref({}) // 用于存储所有arrowRight类型的输入框输入值
const saveKey = ref({}) // 用于存储当前点击的drawer框返回的对象,修改的时候回显值也要存key const saveKey = ref({}) // 用于存储当前点击的drawer框返回的对象,修改的时候回显值也要存key
const errorFields = ref([]) // 存储校验失败的字段信息 const errorFields = ref([]) // 存储校验失败的字段信息
const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑 // const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑
const openList = ref(false) // 客户列表弹窗 const openList = ref(false) // 客户列表弹窗
const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作 const oldObjInfo = ref({}) // 修改时存储原始数据,便于撤销操作
const showContacts = ref(true) const showContacts = ref(true)
...@@ -317,14 +355,7 @@ const handleDateChange = child => { ...@@ -317,14 +355,7 @@ const handleDateChange = child => {
const disabledDate = time => { const disabledDate = time => {
return time.getTime() > Date.now() return time.getTime() > Date.now()
} }
const exportInfo = () => {
if (props.customerBizId && editStatus.value) {
proxy.$modal.confirm(`请先点击编辑在导入客户信息`, { showCancel: '0', title: '填写提示' })
return
}
openList.value = true
customerList()
}
const customerList = () => { const customerList = () => {
tableLoading.value = true tableLoading.value = true
getCustomerList(queryParams.value).then(res => { getCustomerList(queryParams.value).then(res => {
...@@ -397,17 +428,10 @@ const processFormData = async obj => { ...@@ -397,17 +428,10 @@ const processFormData = async obj => {
field.options = fetchDictData(field.dictType) field.options = fetchDictData(field.dictType)
} }
if (field.required) { if (field.required) {
if (field.showEn) {
rules.value[field.key] = [
{ required: true, message: `${field.label}不能为空`, trigger: 'blur' },
{ validator: validateEnglish, trigger: 'change' }
]
} else {
rules.value[field.key] = [ rules.value[field.key] = [
{ required: true, message: `${field.label}不能为空`, trigger: 'blur' } { required: true, message: `${field.label}不能为空`, trigger: 'blur' }
] ]
} }
}
if (obj.customerInfo) { if (obj.customerInfo) {
for (const key1 in obj.customerInfo) { for (const key1 in obj.customerInfo) {
if (key1 == 'birthdate' && obj.customerInfo[key1]) { if (key1 == 'birthdate' && obj.customerInfo[key1]) {
...@@ -419,10 +443,6 @@ const processFormData = async obj => { ...@@ -419,10 +443,6 @@ const processFormData = async obj => {
} }
} }
} }
if (props.showSubmitBtn) {
field.disabled = true
}
} }
} }
} }
...@@ -437,9 +457,7 @@ const processFormData = async obj => { ...@@ -437,9 +457,7 @@ const processFormData = async obj => {
} }
if (props.showSubmitBtn) { if (props.showSubmitBtn) {
form.value = { ...props.apiSecondHolderInfoDto } form.value = { ...props.apiSecondHolderInfoDto }
editStatus.value = true
} else { } else {
editStatus.value = false
} }
processedSecondHolderData.value = oldAppointmentData.value = processedData processedSecondHolderData.value = oldAppointmentData.value = processedData
} }
...@@ -559,24 +577,30 @@ const resetShow = obj => { ...@@ -559,24 +577,30 @@ const resetShow = obj => {
} }
} }
const handleSelectChange = (father, child) => { const handleSelectChange = (father, child) => {
const processData = JSON.parse(JSON.stringify(processedSecondHolderData.value))
for (const section of processData) {
switch (child.key) { switch (child.key) {
case 'isSecond':
if (form.value[child.key] == '1') {
resetShow({ type: 'father', key: 'apiSecondHolderInfoDto', status: true })
} else {
resetShow({ type: 'father', key: 'apiSecondHolderInfoDto', status: false })
}
break
case 'insurantRel': case 'insurantRel':
for (const field of section.data) { // 是本人自动带入信息
for (const key1 in field) { if (form.value[child.key] == 'MYSELF') {
for (const key2 in props.customerInfo) { for (const section of father.data) {
//当选择得关系是本人 用dom得key和用户信息得key做对比,给表单赋值 for (const cKey in props.customerInfo) {
if (key1 == 'customerKey' && field[key1] == key2) { if (section.key == cKey) {
form.value[field.key] = props.customerInfo[key2] form.value[cKey] = props.customerInfo[cKey]
} }
} }
} }
} else {
// 不是本人清空信息
for (const section of father.data) {
if (section.key !== 'insurantRel') {
form.value[section.key] = ''
} }
if (form.value['birthTime']) {
let age = calculateExactAge(proxy.formatToDate(form.value.birthTime))
if (age >= 0) {
form.value.age = age
} }
} }
break break
...@@ -584,18 +608,8 @@ const handleSelectChange = (father, child) => { ...@@ -584,18 +608,8 @@ const handleSelectChange = (father, child) => {
default: default:
break break
} }
}
} }
const handleInputChange = (father, child) => {
switch (child.key) {
case 'nameEn':
validateEnglish(form.value[child.key], child.key)
break
default:
break
}
}
// 改变编辑状态 // 改变编辑状态
const handleEditStatus = status => { const handleEditStatus = status => {
editStatus.value = status editStatus.value = status
...@@ -646,6 +660,7 @@ const getInvalidFields = fields => { ...@@ -646,6 +660,7 @@ const getInvalidFields = fields => {
// 处理表单填写得数据 // 处理表单填写得数据
const handleFormValues = () => { const handleFormValues = () => {
return new Promise(async resolve => {
let submitObj = {} let submitObj = {}
if (props.activeName == 'secondHolder') { if (props.activeName == 'secondHolder') {
submitObj = JSON.parse(JSON.stringify(form.value)) submitObj = JSON.parse(JSON.stringify(form.value))
...@@ -653,12 +668,34 @@ const handleFormValues = () => { ...@@ -653,12 +668,34 @@ const handleFormValues = () => {
submitObj = JSON.parse(JSON.stringify(tempSecondHolderForm.value)) submitObj = JSON.parse(JSON.stringify(tempSecondHolderForm.value))
} }
//处理表单数据 proxy.$refs['secondHolderFormRef'].validate((valid, fields) => {
for (const key1 in submitObj) { if (valid) {
if (key1 == 'birthTime') { errorFields.value = [] // 清空错误信息
submitObj[key1] = proxy.formatToDateTime(submitObj[key1]) if (submitObj.isSecond && submitObj.isSecond == '0') {
for (const key in submitObj) {
if (key !== 'isSecond') {
submitObj[key] = ''
} }
} }
}
if (submitObj['birthday']) {
submitObj['birthday'] = proxy.formatToDate(submitObj['birthday'])
}
if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message)
return undefined
}
resolve(errorFields.value.length == 0 ? submitObj : null)
} else {
errorFields.value = getInvalidFields(fields)
if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message)
}
resolve(undefined)
}
})
})
return submitObj return submitObj
} }
...@@ -726,12 +763,10 @@ watch( ...@@ -726,12 +763,10 @@ watch(
if (newVal === 'secondHolder') { if (newVal === 'secondHolder') {
openList.value = false openList.value = false
setTimeout(() => {
processFormData({ processFormData({
domdata: secondHolderDomData, domdata: secondHolderDomData,
exportValue: null exportValue: null
}) })
}, 500)
} }
} }
) )
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment