Skip to content

Y
yd-csf-front
Commit b55b8938 by yuzhenWang
Options

修改证件类型为多位

parent 231d894f
Showing with 343 additions and 83 deletions
src/formJson/customer.js
......@@ -25,6 +25,54 @@ const customer = [
}
]
},
// 证件信息
{
fatherTitle: '证件信息',
keyType: 'Array', //用于表单收集值时，判断是数组还是对象
key: 'apiCertificateDtoList',
anchorKey: 'apiCertificateDtoList',
moudleType: 'apiCertificateDtoList',
dataLength: 1, //设置dataLength,用于控制子级dom的个数，子级保存一个样例数据，便于加子级数据
showMoudle: true,
showTable: true,
addChildren: true, //是否可以新增子级dom
addChildrenTxt: '证件', //新增按钮得文本
fatherRequired: false, //父级必填,代表个人资料这个模块有必填项
isOpen: false, //dom是否展开
// 表格列配置
columns: [
{
label: '证件类型',
prop: 'documentType',
type: 'select',
dictType: 'csf_id_type',
placeholder: '请选择证件类型',
required: true
},
{
label: '证件号码',
prop: 'idNumber',
type: 'input',
placeholder: '请输入证件号码',
required: true
},
{
label: '证件有效期',
prop: 'certificateValidityPeriod',
type: 'datePicker',
timeType: 'daterange',
placeholder: '请选择证件有效期',
required: true
},
{
label: '是否长期有效',
prop: 'isPermanent',
type: 'radioGroup',
required: false
}
],
data: []
},
// 基础信息
{
fatherTitle: '基础信息',
......@@ -68,35 +116,35 @@ const customer = [
lg: 8 //栅格布局份数
},
{
label: '证件类型',
key: 'documentType',
domType: 'Select',
required: true,
disabled: false,
placeholder: '请选择',
dictType: 'csf_id_type',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
},
{
label: '证件号码',
key: 'idNumber',
domType: 'Input',
inputType: 'text',
required: true,
maxLength: 20,
disabled: false,
placeholder: '请输入',
show: true,
labelPosition: 'top', //标签的位置
labelWidth: '120px', //标签宽度
sm: 12, //栅格布局份数
lg: 8 //栅格布局份数
},
// {
// label: '证件类型',
// key: 'documentType',
// domType: 'Select',
// required: true,
// disabled: false,
// placeholder: '请选择',
// dictType: 'csf_id_type',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
// {
// label: '证件号码',
// key: 'idNumber',
// domType: 'Input',
// inputType: 'text',
// required: true,
// maxLength: 20,
// disabled: false,
// placeholder: '请输入',
// show: true,
// labelPosition: 'top', //标签的位置
// labelWidth: '120px', //标签宽度
// sm: 12, //栅格布局份数
// lg: 8 //栅格布局份数
// },
{
label: '性别',
......@@ -346,6 +394,21 @@ const customer = [
addChildrenTxt: '税务', //新增按钮得文本
fatherRequired: false, //父级必填,代表个人资料这个模块有必填项
isOpen: false, //dom是否展开
// 表格列配置
columns: [
{
label: '税务国家',
prop: 'taxCountry',
type: 'Input',
placeholder: '请输入税务国家'
},
{
label: '税务编号',
prop: 'taxId',
type: 'Input',
placeholder: '请税务编号'
}
],
data: [
// {
// id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识
......
src/views/sign/FnaList/components/customer.vue
......@@ -149,37 +149,115 @@
>
</el-col>
<el-table :data="father.data" border v-if="father.data.length > 0">
<template v-if="father.key == 'apiTaxationDtoList'">
<el-table-column label="税务国家" prop="taxCountry" align="center">
<template #default="scope">
<el-input
size="default"
placeholder="请输入"
v-model="scope.row.taxCountry"
:disabled="editStatus"
/>
</template>
</el-table-column>
<el-table-column label="税务编号" prop="taxId" align="center">
<template #default="scope">
<el-input
v-model="scope.row.taxId"
size="default"
placeholder="请输入"
:disabled="editStatus"
<!-- 动态渲染列 -->
<!-- :label="column.label" -->
<el-table-column
v-for="column in father.columns"
:key="column.prop"
:prop="column.prop"
align="center"
>
<template #header>
<span
:class="{ 'required-label': column.required ? 'required-label' : '' }"
>{{ column.label }}</span
>
</template>
<template #default="scope">
<!-- 远程搜索选择框 -->
<el-select
v-if="column.type === 'remoteSelect'"
v-model="scope.row[column.prop]"
filterable
remote
reserve-keyword
:placeholder="column.placeholder"
:remote-method="
query => searchSelectList(query, column.searchType, scope.row)
"
:loading="searchLoadingStates[column.searchType]"
:disabled="editStatus"
@change="handleRemoteSelectChange(scope.row, column, father)"
>
<template>
<el-option
v-for="item in searchOptions[column.searchType] || []"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</template>
</el-select>
<!-- 普通选择框 -->
<el-select
v-else-if="column.type === 'select'"
v-model="scope.row[column.prop]"
:placeholder="column.placeholder"
:disabled="editStatus"
@change="changeSelect(father, scope.row, column.prop, $event)"
>
<el-option
v-for="item in fetchDictData(column.dictType)"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</template>
</el-table-column>
<el-table-column width="60px" align="center" label="操作">
<template #default="scope">
<el-icon
class="deleteIcon"
@click="deleteChildren(father, scope.$index)"
><Delete
/></el-icon>
</template>
</el-table-column>
</template>
</el-select>
<!-- 日期选择器 -->
<el-date-picker
v-else-if="column.type === 'datePicker'"
v-model="scope.row[column.prop]"
:type="column.timeType"
:placeholder="column.placeholder"
:disabled="editStatus"
style="width: 100%"
range-separator="至"
start-placeholder="开始"
end-placeholder="结束"
/>
<el-input
v-else-if="column.type === 'inputNumber'"
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-radio-group
v-model="scope.row[column.prop]"
v-else-if="column.type === 'radioGroup'"
>
<el-radio value="1" size="large">是</el-radio>
<el-radio value="0" size="large">否</el-radio>
</el-radio-group>
<!-- 普通输入框（默认） -->
<el-input
v-else
v-model="scope.row[column.prop]"
:placeholder="column.placeholder"
:disabled="editStatus"
@blur="tableInputBlur(father, scope.row, column.prop, $event)"
/>
</template>
</el-table-column>
<!-- 操作列（固定） -->
<el-table-column width="80" align="center" label="操作">
<template #default="scope">
<el-button
type="danger"
size="small"
@click="deleteChildren(father, scope.$index)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
</template>
......@@ -358,6 +436,8 @@ const props = defineProps({
})
const emit = defineEmits(['handleSuccess'])
const { proxy } = getCurrentInstance()
const tempPolicyholderDom = ref([]) //投保人dom
const tempInsurantDom = ref([]) //受保人dom
const customerRightRef = ref(null)
const showPhoneDrawer = ref(false) //电话抽屉开关
const showAddressDrawer = ref(false) //地址抽屉开关
......@@ -368,7 +448,6 @@ const errorFields = ref([]) // 存储校验失败的字段信息
const editStatus = ref(true) // 表单是否可编辑,若是修改初始不可编辑
const openList = ref(false) // 客户列表弹窗
const oldObjInfo = ref({}) // 修改时存储原始数据，便于撤销操作
const tableLoading = ref(false)
const tableData = ref([])
const total = ref(0)
......@@ -463,7 +542,29 @@ const operationBtnList = ref([
}
])
const customerFormRef = ref(null)
// 表格改变下拉框
const changeSelect = (father, row, prop, newValue) => {
if (prop == 'documentType') {
// 检查其他行是否已有相同的证件类型（排除自己）
const hasDuplicate = father.data.some(item => item !== row && item.documentType === newValue)
if (hasDuplicate) {
//如果选择的是身份证，给性别，生日，年龄赋值
proxy.$modal.confirm(`该证件类型已存在，请勿重复添加！`, {
showCancel: '0',
title: '填写提示'
})
// 清空当前行的选择
row.documentType = null // 或者 undefined，根据你的数据结构
}
}
console.log('提交', processedCustomerData.value)
}
const tableInputBlur = (father, row, prop, newValue) => {
if (prop == 'idNumber' && row.documentType == 'idCard') {
getFieldValue(prop, row.idNumber)
}
}
const changePageNo = val => {
queryParams.value.pageNo = val
customerList()
......@@ -501,9 +602,7 @@ const handleAppendInput = child => {
}
}
const handleInputBlur = child => {
if (form.value['documentType'] == 'idCard' && child.key == 'idNumber') {
getFieldValue(child.key)
} else if (
if (
(child.key == 'weight' || child.key == 'height') &&
form.value['weight'] &&
form.value['height']
......@@ -513,12 +612,12 @@ const handleInputBlur = child => {
getFieldValue(child.key)
}
}
const getFieldValue = key => {
const getFieldValue = (key, value) => {
let obj = {}
if (form.value['documentType'] == 'idCard' && key == 'idNumber') {
if (key == 'idNumber') {
obj = {
calculateType: 6,
requestValue: form.value['idNumber']
requestValue: value
}
} else if (key == 'weight' || key == 'height') {
obj = {
......@@ -561,11 +660,22 @@ const addChildren = father => {
taxCountry: '',
taxId: ''
}
let obj5 = {
id: Date.now() + Math.floor(Math.random() * 1000), //唯一标识
span: 24, //栅格布局份数
documentType: '',
idNumber: '',
certificateValidityPeriod: '',
isPermanent: ''
}
for (const section of processedData) {
if (father.key == 'apiTaxationDtoList' && section.key == father.key) {
section.data.push(obj4)
}
if (father.key == 'apiCertificateDtoList' && section.key == father.key) {
section.data.push(obj5)
}
}
processedCustomerData.value = processedData
console.log('processedCustomerData.value', processedCustomerData.value)
......@@ -580,6 +690,9 @@ const deleteChildren = (father, childIndex) => {
if (father.key == 'apiTaxationDtoList' && section.key == father.key) {
section.data.splice(childIndex, 1)
}
if (father.key == 'apiCertificateDtoList' && section.key == father.key) {
section.data.splice(childIndex, 1)
}
}
processedCustomerData.value = processedData
}
......@@ -921,6 +1034,15 @@ const handleSelectChange = child => {
// 强制同步：确保form.value.policyholderRel与当前选择的值一致
processedCustomerData.value.forEach(section => {
if (section.keyType == 'Array') {
section.data = []
}
if (section.data) {
for (const field of section.data) {
form.value[field.key] = ''
delete saveKey.value[field.key]
}
}
if (form.value[child.key] == 'MYSELF') {
if (section.key == 'policyholderRel') {
section.showMoudle = true
......@@ -931,7 +1053,6 @@ const handleSelectChange = child => {
section.showMoudle = true
}
})
console.log('下拉', form.value)
break
default:
......@@ -971,6 +1092,7 @@ const setFormValue = (obj, formData, exportValue) => {
form.value = JSON.parse(JSON.stringify(obj))
// 深拷贝原始数据
const processedData = JSON.parse(JSON.stringify(formData))
for (const section of processedData) {
// 这里还要回显受供养人数，等调试的时候再加
// if (section.key == 'personInfo') {
......@@ -983,6 +1105,21 @@ const setFormValue = (obj, formData, exportValue) => {
) {
section.data = JSON.parse(JSON.stringify(obj.apiTaxationDtoList))
}
if (
section.key == 'apiCertificateDtoList' &&
obj.apiCertificateDtoList &&
obj.apiCertificateDtoList.length > 0
) {
obj.apiCertificateDtoList.forEach(item => {
if (item.certificateStartDate) {
item.certificateValidityPeriod = [item.certificateStartDate, item.certificateEndDate]
}
if (item.isPermanent || item.isPermanent == 0) {
item.isPermanent = String(item.isPermanent)
}
})
section.data = JSON.parse(JSON.stringify(obj.apiCertificateDtoList))
}
// 编辑状态当tab为受保人时，与投保人关系为本人控制受保人信息模块隐藏
if (
props.activeName == 'insurantInfo' &&
......@@ -1076,6 +1213,12 @@ const setFormValue = (obj, formData, exportValue) => {
default:
break
}
for (const key in obj) {
if (field.key == key && !obj[key]) {
obj[key] = ''
form.value[key] = ''
}
}
}
}
}
......@@ -1094,6 +1237,7 @@ const setFormValue = (obj, formData, exportValue) => {
}
}
})
if (form.value['birthday']) {
let age = calculateExactAge(proxy.formatToDate(form.value.birthday))
if (age >= 18) {
......@@ -1147,9 +1291,6 @@ const resetForm = () => {
.confirm('是否确认撤销所作操作？')
.then(function () {
customerFormRef.value.resetFields()
console.log('切换之前的form', oldObjInfo.value)
console.log('切换之前的dom', oldCustomerData.value)
// processedCustomerData.value = JSON.parse(JSON.stringify(oldCustomerData.value))
setFormValue(oldObjInfo.value, oldCustomerData.value)
})
......@@ -1181,18 +1322,28 @@ const resetShow = (key, status) => {
//source：因为这个组件是公共组件所以提交的时候要知道是哪里要获取表单的值
const handleFormValues = source => {
let submitObj = {}
let processedData = []
// 因为投保人没有policyholderRel的校验会影响 受保人，所以暂时先赋值处理
if (source == 'policyHolderInfoRef') {
form.value['policyholderRel'] = '111' //因为校验在form上所以这句不能去除
submitObj = { ...policyholderForm.value }
processedData = JSON.parse(JSON.stringify(tempPolicyholderDom.value))
} else if (source == 'insuredInfoRef') {
submitObj = { ...insuredForm.value }
processedData = JSON.parse(JSON.stringify(tempInsurantDom.value))
} else {
submitObj = { ...form.value }
processedData = JSON.parse(JSON.stringify(processedCustomerData.value))
}
console.log('投保人form', submitObj)
let tipName =
props.activeName == 'policyHolderInfo'
? '投保人'
: source == 'insuredInfo'
? '受保人'
: props.activeName == 'customer'
? '客户资料'
: ''
let processedData = JSON.parse(JSON.stringify(processedCustomerData.value))
return new Promise(async resolve => {
// 如果没有点击受保人这个tab页就进行填写提醒，
if (
......@@ -1203,6 +1354,7 @@ const handleFormValues = source => {
resolve(undefined)
return
}
if (processedData.length > 0) {
customerFormRef.value.validate((valid, fields) => {
if (valid) {
......@@ -1216,6 +1368,8 @@ const handleFormValues = source => {
}
errorFields.value = [] // 清空错误信息
console.log('errorFields.value', errorFields.value)
//处理表单数据
for (const key1 in form.value) {
for (const key2 in saveKey.value) {
......@@ -1248,8 +1402,43 @@ const handleFormValues = source => {
if (addressList.length > 0) {
submitObj['addressList'] = addressList
}
let obj1 = {
documentType: '证件类型',
idNumber: '证件号码'
}
processedCustomerData.value.forEach(item => {
processedData.forEach(item => {
if (item.key == 'apiCertificateDtoList' && item.data.length > 0) {
item.data.forEach((item1, index) => {
if (!item1.isPermanent || item1.isPermanent == '0') {
obj1.certificateValidityPeriod = '证件有效期'
} else {
delete obj1.certificateValidityPeriod
}
for (const key in obj1) {
if (!item1[key]) {
errorFields.value.push({
message: `${tipName}证件信息-第${index + 1}行${obj1[key]}不能为空`
})
return
}
if (key == 'certificateValidityPeriod' && item1[key]) {
item1.certificateStartDate = proxy.formatToDate(
item1.certificateValidityPeriod[0]
)
item1.certificateEndDate = proxy.formatToDate(
item1.certificateValidityPeriod[1]
)
delete item1.certificateValidityPeriod
}
}
})
submitObj['apiCertificateDtoList'] = item.data
} else if (item.key == 'apiCertificateDtoList' && item.data.length == 0) {
errorFields.value.push({
message: `${tipName}证件信息不能为空`
})
}
if (item.key == 'apiTaxationDtoList' && item.data.length > 0) {
submitObj['apiTaxationDtoList'] = item.data.filter(item => {
return item.taxCountry && item.taxCountry.trim() && item.taxId && item.taxId.trim()
......@@ -1261,7 +1450,6 @@ const handleFormValues = source => {
deleteKeyList.value.forEach(item => {
delete submitObj[item]
})
if (errorFields.value.length > 0) {
proxy.$message.error(errorFields.value[0].message)
return undefined
......@@ -1319,10 +1507,6 @@ const handleFormValues = source => {
resolve(props.apiInsurantInfoDto)
}
} else {
// 新增状态
// 因为这两个在同一个大提交里，所以要判断是哪个提交，方便这两个都有自己独立的提交验证
console.log('走这里了')
resolve(undefined)
}
}
......@@ -1347,8 +1531,17 @@ watch(
} else if (props.activeName == 'insurantInfo') {
insuredForm.value = JSON.parse(JSON.stringify(newVal))
}
console.log('form值变化policyholderForm', policyholderForm.value)
console.log('form值变化insuredForm', insuredForm.value)
},
{ immediate: true, deep: true }
)
watch(
() => processedCustomerData.value,
newVal => {
if (props.activeName == 'policyholder') {
tempPolicyholderDom.value = JSON.parse(JSON.stringify(newVal))
} else if (props.activeName == 'insurantInfo') {
tempInsurantDom.value = JSON.parse(JSON.stringify(newVal))
}
},
{ immediate: true, deep: true }
)
......@@ -1414,6 +1607,11 @@ defineExpose({
height: 600px;
overflow-y: scroll;
}
.required-label::before {
content: '*';
color: #f56c6c;
margin-right: 4px;
}
.customerContainer {
/* display: flex; */
height: 100%;
......
src/views/sign/appointment/appointmentEdit.vue
......@@ -83,13 +83,13 @@
<el-row v-if="isEmbed">
<el-col>
<div class="topButtonBox">
<el-button
<!-- <el-button
v-if="!idsObj.appointmentBizId"
type="primary"
icon="Plus"
@click="execlDialog = true"
>导入</el-button
>
> -->
<el-button
v-if="pageSource !== 'policyList' && idsObj.appointmentBizId"
type="primary"
......@@ -927,7 +927,6 @@ const beforeTabLeave = async (activeTabName, oldTabName) => {
}
}
const handleSubmit = async type => {
// 提交得时候要拿到各个步骤得表单数据
if (appointmentInfoRef.value) {
......
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