LK/income_payments_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 工作组成员--企业联系人可以加到十个

Browse Source
This commit is contained in:
zhaoxiao
2022-04-22 16:12:25 +08:00
parent dee42866a0
commit b07da0cfa6
3 changed files with 292 additions and 266 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/projectManagement/modules/WorkingGroupMemberUnitModule.vue
+229 -155
View File
@@ -35,67 +35,96 @@
</a-form-item>
</a-col>
</a-row>
<template v-if="model.payWorkingGroupSubItemContactsList && model.payWorkingGroupSubItemContactsList.length > 0">
<a-row v-for="(item, index) in model.payWorkingGroupSubItemContactsList" :key="index + ''">
<a-col :xl="12" :sm="24">
<a-form-item :label="`企业联系人${index + 1}`" :labelCol="labelCol" :wrapperCol="wrapperCol">
<select-contacts :selected-company="selectedCompany"
:init-contacts="selectedContact1"
:placeholder="`请选择企业联系人${index + 1}`"
v-decorator="[`payWorkingGroupSubItemContactsList[${index}].contactsId`, {rules: [{ required: index === 0, validator: index === 0 ? validateContactRequired : validateContact }],validateTrigger: 'change'}]"
:maxLength='50'
:ref="`selectContacts${index}`"
@ok="addContactsOneOk"
@change="value => contactsChange(value, index)"></select-contacts>
</a-form-item>
</a-col>
<a-col :xl="9" :sm="20">
<!-- v-show="hasContactOne"-->
<a-form-item :label="`备注${index + 1}`" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:placeholder="`请输入备注${index + 1}`"
v-decorator="[`payWorkingGroupSubItemContactsList[${index}].remarks`]"
:maxLength='50'
@change="e => {e.target.value = (e.target.value + '').trim()}">
</a-input>
</a-form-item>
</a-col>
<a-col :xl="3" :sm="4">
<a-button type="link" class="contact-btn" @click="handleAddContact(index)">添加</a-button>
<a-button type="link" class="contact-btn del-btn" @click="handleDelContact(index)">删除</a-button>
</a-col>
</a-row>
</template>
<!-- <a-row>-->
<!-- <a-col :xl="12" :sm="24">-->
<!-- <a-form-item label="企业联系人2" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <select-contacts :selected-company="selectedCompany"-->
<!-- :init-contacts="selectedContact2"-->
<!-- placeholder="请选择企业联系人2"-->
<!-- v-decorator="['contactsIdTwo',validatorRules.contactsRepeat]"-->
<!-- :maxLength='50'-->
<!-- ref="selectContacts2"-->
<!-- @change="contactsTwoChange"-->
<!-- @ok="addContactsTwoOk"></select-contacts>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :xl="9" :sm="20">-->
<!-- &lt;!&ndash; v-show="hasContactTwo"&ndash;&gt;-->
<!-- <a-form-item label="备注2" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <a-input-->
<!-- placeholder="请输入备注2"-->
<!-- v-decorator="['remarksTwo']"-->
<!-- :maxLength='50'-->
<!-- @change="e => {e.target.value = (e.target.value + '').trim()}">-->
<!-- </a-input>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :xl="3" :sm="4">-->
<!-- <a-button type="link" class="contact-btn">添加</a-button>-->
<!-- <a-button type="link" class="contact-btn del-btn">删除</a-button>-->
<!-- </a-col>-->
<!-- </a-row>-->
<!-- <a-row>-->
<!-- <a-col :xl="12" :sm="24">-->
<!-- <a-form-item label="企业联系人3" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <select-contacts :selected-company="selectedCompany"-->
<!-- :init-contacts="selectedContact3"-->
<!-- placeholder="请选择企业联系人3"-->
<!-- v-decorator="['contactsIdThree',validatorRules.contactsRepeat]"-->
<!-- :maxLength='50'-->
<!-- ref="selectContacts3"-->
<!-- @change="contactsThreeChange"-->
<!-- @ok="addContactsThreeOk"></select-contacts>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :xl="9" :sm="20">-->
<!-- &lt;!&ndash; v-show="hasContactThree"&ndash;&gt;-->
<!-- <a-form-item label="备注3" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <a-input-->
<!-- placeholder="请输入备注3"-->
<!-- v-decorator="['remarksThree']"-->
<!-- :maxLength='50'-->
<!-- @change="e => {e.target.value = (e.target.value + '').trim()}">-->
<!-- </a-input>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :xl="3" :sm="4">-->
<!-- <a-button type="link" class="contact-btn">添加</a-button>-->
<!-- <a-button type="link" class="contact-btn del-btn">删除</a-button>-->
<!-- </a-col>-->
<!-- </a-row>-->
<a-row>
<a-col :xl="12" :sm="24">
<a-form-item label="企业联系人1" :labelCol="labelCol" :wrapperCol="wrapperCol">
<select-contacts :selected-company="selectedCompany"
:init-contacts="selectedContact1"
placeholder="请选择企业联系人1"
v-decorator="['contactsIdOne',validatorRules.contactsIdOne]"
:maxLength='50'
ref="selectContacts1"
@ok="addContactsOneOk"
@change="contactsChange"></select-contacts>
</a-form-item>
</a-col>
<a-col :xl="12" :sm="24">
<a-form-item label="企业联系人2" :labelCol="labelCol" :wrapperCol="wrapperCol">
<select-contacts :selected-company="selectedCompany"
:init-contacts="selectedContact2"
placeholder="请选择企业联系人2"
v-decorator="['contactsIdTwo',validatorRules.contactsRepeat]"
:maxLength='50'
ref="selectContacts2"
@change="contactsTwoChange"
@ok="addContactsTwoOk"></select-contacts>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :xl="12" :sm="24">
<a-form-item label="备注1" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="hasContactOne">
<a-input
placeholder="请输入备注1"
v-decorator="['remarksOne']"
:maxLength='50'
@change="e => {e.target.value = (e.target.value + '').trim()}">
</a-input>
</a-form-item>
</a-col>
<a-col :xl="12" :sm="24">
<a-form-item label="备注2" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="hasContactTwo">
<a-input
placeholder="请输入备注2"
v-decorator="['remarksTwo']"
:maxLength='50'
@change="e => {e.target.value = (e.target.value + '').trim()}">
</a-input>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :xl="12" :sm="24">
<a-form-item label="企业联系人3" :labelCol="labelCol" :wrapperCol="wrapperCol">
<select-contacts :selected-company="selectedCompany"
:init-contacts="selectedContact3"
placeholder="请选择企业联系人3"
v-decorator="['contactsIdThree',validatorRules.contactsRepeat]"
:maxLength='50'
ref="selectContacts3"
@change="contactsThreeChange"
@ok="addContactsThreeOk"></select-contacts>
</a-form-item>
</a-col>
<a-col :xl="12" :sm="24">
<a-form-item label="邮寄联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
<select-contacts :selected-company="selectedCompany"
@@ -103,20 +132,8 @@
placeholder="请选择邮寄联系人"
v-decorator="['mailContactsId',validatorRules.mailContactsId]"
:maxLength='50'
ref="selectMailContacts"
@ok="addMailContactsOk"></select-contacts>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :xl="12" :sm="24">
<a-form-item label="备注3" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="hasContactThree">
<a-input
placeholder="请输入备注3"
v-decorator="['remarksThree']"
:maxLength='50'
@change="e => {e.target.value = (e.target.value + '').trim()}">
</a-input>
ref="selectMailContacts">
</select-contacts>
</a-form-item>
</a-col>
</a-row>
@@ -400,12 +417,17 @@ export default {
workingGroupList: [],
disabledCompany: false, // 企业是否禁用
isAssociatedContract: false, // 是否关联合同
hasContactOne: false, // 是否选择联系人1
hasContactTwo: false, // 是否选择联系人2
hasContactThree: false, // 是否选择联系人3
// hasContactOne: false, // 是否选择联系人1
// hasContactTwo: false, // 是否选择联系人2
// hasContactThree: false, // 是否选择联系人3
url: {
add: '/project/payWorkingGroupSubitem/add',
edit: '/project/payWorkingGroupSubitem/edit'
},
// 默认的联系人数据
defaultPayWorkingGroupSubItemContact: {
contactsId: undefined,
remarks: null
}
}
},
@@ -468,7 +490,7 @@ export default {
this.companyChange(this.selectedCompany)
this.form.resetFields()
record.contractNum = record.contractNum || undefined
this.model = Object.assign({}, record)
this.model = Object.assign({}, JSON.parse(JSON.stringify(record)))
// 是否存在从收入合同传入的签订联系人id
this.model.contactsIdOne = this.signedContactId || this.model.contactsTemporaryIdOne || undefined
this.model.contactsIdTwo = this.model.contactsTemporaryIdTwo || undefined
@@ -492,22 +514,28 @@ export default {
id: this.model.mailContactsTemporaryId,
name: this.model.mailContactsTemporaryName
}
// 是否需要显示联系人备注信息
if (this.model.contactsTemporaryIdOne) {
this.hasContactOne = true
}
if (this.model.contactsTemporaryIdTwo) {
this.hasContactTwo = true
}
if (this.model.contactsTemporaryIdThree) {
this.hasContactThree = true
}
// // 是否需要显示联系人备注信息
// if (this.model.contactsTemporaryIdOne) {
// this.hasContactOne = true
// }
// if (this.model.contactsTemporaryIdTwo) {
// this.hasContactTwo = true
// }
// if (this.model.contactsTemporaryIdThree) {
// this.hasContactThree = true
// }
} else {
// 新增处理默认显示的三个企业联系人
this.model.payWorkingGroupSubItemContactsList = []
this.model.payWorkingGroupSubItemContactsList.push(this.defaultPayWorkingGroupSubItemContact)
this.model.payWorkingGroupSubItemContactsList.push(this.defaultPayWorkingGroupSubItemContact)
this.model.payWorkingGroupSubItemContactsList.push(this.defaultPayWorkingGroupSubItemContact)
}
this.chargeWayType = record.chargeWay
this.pickChargeNoticeType(record.charge, true)
this.visible = true
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'chargeCompany', 'contactsIdOne', 'contactsIdTwo', 'contactsIdThree', 'mailContactsId', 'chargeWay', 'charge', 'receivableAmount', 'contractNum', 'receivableAmount', 'chargeNoticeId', 'needInvoice', 'remarks', 'remarksOne', 'remarksTwo', 'remarksThree'))
this.form.setFieldsValue(pick(this.model, 'chargeCompany', 'contactsIdOne', 'contactsIdTwo', 'contactsIdThree', 'mailContactsId', 'chargeWay', 'charge', 'receivableAmount', 'contractNum', 'receivableAmount', 'chargeNoticeId', 'needInvoice', 'remarks', 'remarksOne', 'remarksTwo', 'remarksThree', 'payWorkingGroupSubItemContactsList'))
})
},
close() {
@@ -523,10 +551,12 @@ export default {
this.isAssociatedContract = false
this.disabledCompany = false
// 清除联系人备注信息
this.hasContactOne = false
this.hasContactTwo = false
this.hasContactThree = false
// this.hasContactOne = false
// this.hasContactTwo = false
// this.hasContactThree = false
this.visible = false
this.model = Object.assign({}, {})
this.form.resetFields()
},
handleOk() {
if (this.confirmLoading) {
@@ -557,7 +587,12 @@ export default {
if (this.workingGroupId) {
values.workingGroupId = this.workingGroupId
}
const formData = Object.assign(this.model, values)
// 企业联系人信息中将没有值的去掉
let haveValueContactArr = values.payWorkingGroupSubItemContactsList.filter(tt => tt.contactsId)
let obj = {
payWorkingGroupSubItemContactsList: haveValueContactArr
}
const formData = Object.assign(this.model, values, obj)
console.log('表单提交数据', formData)
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
@@ -679,18 +714,6 @@ export default {
* 在新增成功后重新获取联系人列表
*/
addContactsOneOk() {
this.$refs.selectContacts2.getContactsList()
this.$refs.selectContacts3.getContactsList()
this.$refs.selectMailContacts.getContactsList()
},
addContactsTwoOk() {
this.$refs.selectContacts1.getContactsList()
this.$refs.selectContacts3.getContactsList()
this.$refs.selectMailContacts.getContactsList()
},
addContactsThreeOk() {
this.$refs.selectContacts1.getContactsList()
this.$refs.selectContacts2.getContactsList()
this.$refs.selectMailContacts.getContactsList()
},
addMailContactsOk() {
@@ -698,6 +721,12 @@ export default {
this.$refs.selectContacts2.getContactsList()
this.$refs.selectContacts3.getContactsList()
},
validateContactRequired(rule, value, callback) {
if (value) {
callback()
}
callback('请选择企业联系人1')
},
/**
* 校验企业联系人是否重复
* @param rule
@@ -706,21 +735,12 @@ export default {
*/
validateContact(rule, value, callback) {
if (value) {
// 需要联动验证的字段
let fieldArr = ['contactsIdOne', 'contactsIdTwo', 'contactsIdThree']
// 去掉当前更改的字段
fieldArr = fieldArr.filter(tt => tt !== rule.field)
const contactObj = this.form.getFieldsValue(['contactsIdOne', 'contactsIdTwo', 'contactsIdThree'])
const contactArr = Object.values(contactObj)
contactArr.filter(tt => tt !== undefined)
if (isRepeat(contactArr)) {
callback('请选择不同的企业联系人')
} else {
// 进行其余两个联系人字段的重复校验
this.form.validateFields(fieldArr)
let contactsList = this.form.getFieldValue('payWorkingGroupSubItemContactsList')
let hasValueArr = contactsList.filter(tt => tt.contactsId === value)
if (hasValueArr.length <= 1) {
callback()
}
callback()
callback('请选择不同的联系人')
return
}
callback()
@@ -728,58 +748,101 @@ export default {
/**
* 企业联系人1、邮寄联系人联动
* @param value
* @param index
*/
contactsChange(value) {
contactsChange(value, index) {
let formData = this.form.getFieldValue('payWorkingGroupSubItemContactsList')
formData[index].contactsId = value
// 如果没有值，清空对应的备注
if (!value) {
this.hasContactOne = false
this.form.setFieldsValue({ remarksOne: null })
return
}
this.hasContactOne = true
// 判断联系人是否和原来的一致，不一致则清空备注内容
if (value !== this.model.contactsTemporaryIdOne) {
this.form.setFieldsValue({ remarksOne: null })
}
let mailContact = Object.values(this.form.getFieldValue(['mailContactsId']))[0]
// 邮寄联系人非undefined时赋值
if (!mailContact) {
this.model.mailContactsId = value
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'mailContactsId'))
})
formData[index].remarks = null
} else {
// 如果值和初始值不一致，则清除备注
if (this.model.payWorkingGroupSubItemContactsList[index].contactsId !== value) {
formData[index].remarks = null
}
let mailContact = Object.values(this.form.getFieldValue(['mailContactsId']))[0]
// 邮寄联系人非undefined时赋值
if (!mailContact && index === 0) {
this.model.mailContactsId = value
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'mailContactsId'))
})
}
}
this.$nextTick(() => {
this.form.setFieldsValue({ payWorkingGroupSubItemContactsList: formData })
this.form.validateFields(['payWorkingGroupSubItemContactsList'])
})
},
/**
* 企业联系人2变化
* @param value
*/
contactsTwoChange(value) {
if (!value) {
this.hasContactTwo = false
this.form.setFieldsValue({ remarksTwo: null })
return
}
this.hasContactTwo = true
// 判断联系人是否和原来的一致，不一致则清空备注内容
if (value !== this.model.contactsTemporaryIdTwo) {
this.form.setFieldsValue({ remarksTwo: null })
}
},
// contactsTwoChange(value) {
// if (!value) {
// this.hasContactTwo = false
// this.form.setFieldsValue({ remarksTwo: null })
// return
// }
// this.hasContactTwo = true
// // 判断联系人是否和原来的一致，不一致则清空备注内容
// if (value !== this.model.contactsTemporaryIdTwo) {
// this.form.setFieldsValue({ remarksTwo: null })
// }
// },
/**
* 企业联系人3变化
* @param value
*/
contactsThreeChange(value) {
if (!value) {
this.hasContactThree = false
this.form.setFieldsValue({ remarksThree: null })
// contactsThreeChange(value) {
// if (!value) {
// this.hasContactThree = false
// this.form.setFieldsValue({ remarksThree: null })
// return
// }
// this.hasContactThree = true
// // 判断联系人是否和原来的一致，不一致则清空备注内容
// if (value !== this.model.contactsTemporaryIdThree) {
// this.form.setFieldsValue({ remarksThree: null })
// }
// },
/**
* 添加联系人
* @param index
*/
handleAddContact(index) {
if (this.model.payWorkingGroupSubItemContactsList.length >= 10) {
this.$message.warn('最多添加十个企业联系人')
return
}
this.hasContactThree = true
// 判断联系人是否和原来的一致，不一致则清空备注内容
if (value !== this.model.contactsTemporaryIdThree) {
this.form.setFieldsValue({ remarksThree: null })
let obj = {
contactsId: undefined,
remarks: null
}
this.model.payWorkingGroupSubItemContactsList.splice(index + 1, 0, obj)
this.$forceUpdate()
let formData = this.form.getFieldValue('payWorkingGroupSubItemContactsList')
formData.splice(index + 1, 0, obj)
this.$nextTick(() => {
this.form.setFieldsValue({ payWorkingGroupSubItemContactsList: formData })
})
},
/**
* 删除联系人
* @param index
*/
handleDelContact(index) {
if (this.model.payWorkingGroupSubItemContactsList.length === 1) {
this.$message.warn('最少需要一个企业联系人')
return
}
this.model.payWorkingGroupSubItemContactsList.splice(index, 1)
let formData = this.form.getFieldValue('payWorkingGroupSubItemContactsList')
formData.splice(index, 1)
this.$nextTick(() => {
this.form.setFieldsValue({ payWorkingGroupSubItemContactsList: formData })
})
}
}
}
@@ -808,4 +871,15 @@ export default {
}
}
}
.contact-btn {
display: inline-block;
margin: 0 8px;
padding: 0;
height: 40px;
}
.del-btn {
color: #ff4d4f
}
</style>