admin-vue3/src/views/crm/contract/detail/ContractChangeDetail.vue

624 lines
21 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<ContentWrap class="mt-10px">
<processForm
ref="formRef"
v-loading="formLoading"
:model="formData"
:fields="formFields"
:rules="formRules"
label-width="120px"
>
<!-- <el-col :span="8">
<el-form-item label="合同查询" prop="quotationId">
<el-select
@change="handleQuotationChange"
v-model="formData.quotationId"
class="w-1/1"
>
<el-option
v-for="item in quotationList"
:key="item.id"
:label="item.no"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col> -->
<template #customerId>
<el-col :span="8">
<el-form-item label="客户名称" prop="customerId">
<SelectComponent :customerList="customerList" :disabled="true" v-model="formData.customerId" />
</el-form-item>
</el-col>
</template>
<template #processInstanceId>
<el-col :span="8">
<el-form-item label="协议编码" prop="processInstanceId">
<el-input v-model="formData.processInstanceId" disabled placeholder="协议编码" />
</el-form-item>
</el-col>
</template>
<!-- <template #auditStatus>
<el-col :span="8">
<el-form-item label="合同状态" prop="auditStatus">
<el-select v-model="formData.auditStatus" disabled clearable placeholder="请选择合同状态">
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_AUDIT_STATUS)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</el-col>
</template> -->
<template #endTime>
<el-col :span="8">
<el-form-item label="协议截止日期" prop="endTime">
<el-date-picker
v-model="formData.endTime"
disabled
type="date"
value-format="x"
placeholder="请选择协议截止日期"
style="width: 100%"
/>
</el-form-item>
</el-col>
</template>
<template #changeItem>
<el-col :span="24">
<el-form-item label="变更项目" prop="changeItem">
<el-radio-group v-model="formData.changeItem" :disabled="formFields.changeItem !== 2 || isTrue">
<el-radio :value="1">额度</el-radio>
<el-radio :value="2">授权人</el-radio>
<el-radio :value="3">延期</el-radio>
<el-radio :value="4">终止</el-radio>
<el-radio :value="5">关联</el-radio>
<el-radio :value="6">重签</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</template>
<template #other>
<!-- 子表的表单 -->
<ContractChangeLimit
v-if="formData.changeItem == 1"
ref="limitFormRef"
:formFields="formFields"
:data="formData"
/>
<div v-if="formData.changeItem == 2">
<ContentWrap style="border: none">
甲方现授权人信息
</ContentWrap>
<ContractAuthPersonInfo
:disabled="true"
ref="personDataRef"
:products="formData.contractAAuthorizedPersons"
/>
<ContentWrap style="border: none">
甲方授权人
</ContentWrap>
<ContractBAuthorizedPersonForm :formFields="formFields" :type="1" :data="formData.contractAAuthorizedCompanysHis" ref="ContractBAuthorizedPersonFormRef" :customerId="formData.customerId" :contract-id="formData.id" />
</div>
<ContracExtension ref="contractExtensionFormRef" :isTrue="isTrue" :formFields="formFields" v-if="formData.changeItem == 3" :data="formData" />
<el-col :span="24">
<ContractStop ref="contractStopFormRef" :isTrue="false" :formFields="formFields" :formData="formData" v-if="formData.changeItem == 4" />
</el-col>
<ContractAAuthorizedCompanyForm :formFields="formFields" ref="contractAAuthorizedCompanyFormRef1" :type="true" v-if="formData.changeItem == 5" :data="formData.contractAAuthorizedCompanys" />
<ContractForm ref="contractFormRef" :type="1" :data="formData" :id="formData.contractId" v-if="formData.changeItem == 6" />
</template>
</processForm>
</ContentWrap>
</template>
<script lang="ts" setup>
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
import * as CustomerApi from '@/api/crm/customer'
import * as ContractApi from '@/api/crm/contract'
import * as ContactApi from '@/api/crm/contact'
import * as UserApi from '@/api/system/user'
import { QuotationApi,QuotationVO } from '@/api/crm/quotation'
import { erpPriceMultiply, erpPriceInputFormatter, jsonParse } from '@/utils'
import { useUserStore } from '@/store/modules/user'
import ContractChangeLimit from '@/views/crm/contract/components/ContractChangeLimit.vue'
import ContractAuthPersonInfo from '@/views/crm/contract/components/ContractAuthPersonInfo.vue'
import ContracExtension from '@/views/crm/contract/components/ContractExtension.vue'
import ContractStop from '@/views/crm/contract/components/ContracStop.vue'
import ContractProductForm from '@/views/crm/contract/components/ContractProductForm.vue'
import ContractAAuthorizedCompanyForm from '../components/ContractAAuthorizedCompanyForm.vue'
import ContractBAuthorizedPersonForm from '../components/ContractAAuthorizedPersonForm.vue'
import ContractForm from './ContractDetail.vue'
import { propTypes } from '@/utils/propTypes'
import { getLimitForm } from '@/api/bpm/form'
const isTrue = ref(false)
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const { proxy }: any = getCurrentInstance();
const props = defineProps({
id: propTypes.number.def(undefined),
})
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中1修改时的数据加载2提交的按钮禁用
const formType = ref('') // 表单的类型create - 新增update - 修改
const formFields = ref({
customerId: 1,
processInstanceId: 1,
auditStatus: 1,
endTime: 1,
changeItem: 1,
other: 1,
cooperationType: 1,
regType: 1,
actualCapital: 1,
socialEmployeeNum: 1,
defendantRecord: 1,
abnormalService: 1,
equityPledge: 1,
dishonestyRecord: 1,
financeRecord: 1,
judgmentRecord: 1,
seriousIllegal: 1,
liquidation: 1,
creditAmount: 1,
creditLimit: 1,
partnerCompanyId: 1,
contractDetailcooperationType: 1,
contractDetailregType: 1,
contractDetailactualCapital: 1,
contractDetailsocialEmployeeNum: 1,
contractDetaildefendantRecord: 1,
contractDetailabnormalService: 1,
contractDetailequityPledge: 1,
contractDetaildishonestyRecord: 1,
contractDetailfinanceRecord: 1,
contractDetailjudgmentRecord: 1,
contractDetailcreditAmount: 1,
contractDetailcreditLimit: 1,
contractDetailpartnerCompanyId: 1,
changeAmount: 1,
afterAmount: 1,
changeAmountDeadline: 1,
contractAAuthorizedCompanysother: 1,
contractAAuthorizedCompanyscustomerName: 1,
contractAAuthorizedCompanysunifiedCreditCode: 1,
contractAAuthorizedCompanysinvoicingAddress: 1,
contractAAuthorizedCompanysinvoicingTelephone: 1,
contractAAuthorizedCompanyscompanyBank: 1,
contractAAuthorizedCompanyscompanyAccount: 1,
contractAAuthorizedCompanyscompanyAddress: 1,
contractAAuthorizedCompanysother2: 1,
contractAAuthorizedPersonsother: 1,
contractAAuthorizedPersonscustomerName: 1,
contractAAuthorizedPersonsauthPersonType: 1,
contractAAuthorizedPersonsphoneNumber: 1,
contractAAuthorizedPersonswechat: 1,
contractAAuthorizedPersonsidNumber: 1,
contractAAuthorizedPersonsemail: 1,
contractAAuthorizedPersonsother2: 1,
contractBAuthorizedPersonsother: 1,
contractBAuthorizedPersonsauthType: 1,
contractBAuthorizedPersonsuserId: 1,
contractBAuthorizedPersonspostName: 1,
contractBAuthorizedPersonsuserRank: 1,
contractBAuthorizedPersonsauthDesc: 1,
contractBAuthorizedPersonsphoneNumber: 1,
contractBAuthorizedPersonswechat: 1,
contractBAuthorizedPersonsemail: 1,
contractBAuthorizedPersonsother2: 1,
agreementDeadline: 1,
extensionYears: 1,
extensionDate: 1,
terminationDate: 1,
terminationReason: 1,
note: 1
})
const formData = ref({
authPerson: [],
id: undefined,
name: undefined,
no: undefined,
customerId: undefined,
quotationId: undefined,
invoiceTemplateId: undefined,
processInstanceId: undefined,
auditStatus: undefined,
startTime: undefined,
endTime: undefined,
penaltyRate: undefined,
latePaymentRate: undefined,
settleMethod: undefined,
lastPayDate: undefined,
contractTerm: undefined,
signUserId: undefined,
signPhoneNumber: undefined,
signEmail: undefined,
signWechat: undefined,
offlinePrice: undefined,
onlinePrice: undefined,
ownerUserId: undefined,
expanderUserId: undefined,
pricingUserId: undefined,
afterSaleUserId: undefined,
collUserId: undefined,
totalPrice: undefined,
contractBody: undefined,
contractAgreement: undefined,
creditMethod: undefined,
creditCalcCycle: undefined,
creditLimit: undefined,
partnerCompanyId: undefined,
deptId: undefined,
quotationTimes: undefined,
changeItem: 1,
products: [],
contractAAuthorizedCompanysHis: []
})
const formRules = reactive({
name: [{ required: true, message: '合同名称不能为空', trigger: 'blur' }],
customerId: [{ required: true, message: '客户不能为空', trigger: 'blur' }],
orderDate: [{ required: true, message: '下单日期不能为空', trigger: 'blur' }],
ownerUserId: [{ required: true, message: '负责人不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
const customerList = ref([]) // 客户列表的数据
const quotationList = ref<QuotationVO[]>([])
const contactList = ref<ContactApi.ContactVO[]>([])
/** 子表的表单 */
const subTabsName = ref('limit')
const ContractBAuthorizedPersonFormRef = ref()
const contractAAuthorizedCompanyFormRef1 = ref()
const limitFormRef = ref()
const contractExtensionFormRef = ref()
const contractStopFormRef = ref()
const contractFormRef = ref()
/** 计算 discountPrice、totalPrice 价格 */
watch(
() => formData.value,
(val) => {
if (!val) {
return
}
// const totalPrice = val.products.reduce((prev, curr) => prev + curr.totalPrice, 0)
// 赋值
// formData.value.totalPrice = totalPrice
},
{ deep: true }
)
/** 打开弹窗 */
const open = async (type: string) => {
if (type) {
formLoading.value = true
try {
// formData.value = Object.assign(formData.value, data)
let data = await ContractApi.getChangeContract(type)
formData.value = data.contractDetail
formData.value.contractAAuthorizedCompanysHis = JSON.parse(JSON.stringify(data.contractAAuthorizedPersons))
formData.value.contractAAuthorizedCompanys = data.contractAAuthorizedCompanys
//重签拿contractDetail字段
if (data.changeItem == 6) formData.value = JSON.parse(data.newContract)
console.log('%csrc/views/crm/contract/detail/ContractChangeDetail.vue:309 object', 'color: red;', formData.value,12345);
formData.value.contractId = data.contractDetail.id
formData.value.changeItem = data.changeItem
formData.value.changeAmount = data.changeAmount
formData.value.afterAmount = data.afterAmount
formData.value.changeAmountDeadline = data.changeAmountDeadline
formData.value.agreementDeadline = data.agreementDeadline
formData.value.extensionYears = data.extensionYears
formData.value.extensionDate = data.extensionDate
formData.value.note = data.note
formData.value.id = data.id
formData.value.creditAmount = data.creditAmount
formData.value.creditLimit = data.beforeAmount
console.log('%csrc/views/crm/contract/detail/ContractChangeDetail.vue:310 object', 'color: #007acc;', formData.value);
} finally {
formLoading.value = false
}
}
}
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
const submitForm = async () => {
// 校验表单
if (!formRef) return
const valid = await formRef.value.innerFormRef.validate()
if (!valid) return
// const Authalid = await contractAAuthorizedCompanyFormRef.value.validate()
// if (!Authalid) return
// const Authalid1 = await contractAAuthorizedCompanyFormRef1.value.validate()
// if (!Authalid1) return
if(ContractBAuthorizedPersonFormRef.value) {
const Authalid = await ContractBAuthorizedPersonFormRef.value.validate()
if (!Authalid) return
}
if(contractAAuthorizedCompanyFormRef1.value) {
const Authalid1 = await contractAAuthorizedCompanyFormRef1.value.validate()
if (!Authalid1) return
}
if(limitFormRef.value) {
const limitValid = await limitFormRef.value.validate()
if (!limitValid) return
}
if(contractExtensionFormRef.value) {
const extensionValid = await contractExtensionFormRef.value.validate()
if (!extensionValid) return
}
if(contractStopFormRef.value) {
const stopValid = await contractStopFormRef.value.validate()
if (!stopValid) return
}
if(contractFormRef.value) {
const contractValid = await contractFormRef.value.validate()
if (!contractValid) return
}
// const stopValid = await contractStopFormRef.value.validate()
// if (!stopValid) return
// const contractValid = await contractFormRef.value.validate()
// if (!contractValid) return
// 提交请求
formLoading.value = true
try {
const data = unref(JSON.parse(JSON.stringify(formData.value))) as unknown as ContractApi.ContractVO
// 拼接子表的数据
let proChangeObj = {
1: limitFormRef,
2: ContractBAuthorizedPersonFormRef,
3: contractExtensionFormRef,
4: contractStopFormRef,
5: contractAAuthorizedCompanyFormRef1,
6: contractFormRef
}
let proChangeData = {
1: 'limitFormRef',
2: 'contractAAuthorizedPersons',
3: 'contractExtensionFormRef',
4: 'contractStopFormRef',
5: 'contractAAuthorizedCompanys',
6: 'contractFormRef'
}
console.log('%csrc/views/crm/contract/detail/ContractChangeDetail.vue:396 formData.value', 'color: #007acc;', formData.value);
let dataFormList = proChangeObj[formData.value.changeItem].value.getData()
if(formData.value.changeItem == 2 || formData.value.changeItem == 5) {
data[proChangeData[formData.value.changeItem]] = dataFormList
}
if(formData.value.changeItem == 1) {
data.changeAmount = dataFormList.changeAmount
data.changeAmountDeadline = dataFormList.changeAmountDeadline
} else if(formData.value.changeItem == 2) {
// let ids = []
// dataFormList.map(item => {
// ids.push(item.id)
// })
data.afterAuthorizerId = JSON.stringify(dataFormList)
} else if(formData.value.changeItem == 3) {
data.agreementDeadline = dataFormList.agreementDeadline
data.extensionYears = dataFormList.extensionYears
data.extensionDate = dataFormList.extensionDate
data.note = dataFormList.note
} else if(formData.value.changeItem == 4) {
data.terminationDate = dataFormList.terminationDate
data.terminationReason = dataFormList.terminationReason
data.note = dataFormList.note
} else if(formData.value.changeItem == 5) {
let ids = []
dataFormList.map(item => {
ids.push(item.customerCompanyId)
})
data.afterAffiliateCompanyId = ids.join(',')
} else if(formData.value.changeItem == 6) {
data.newContract = dataFormList
}
dialogVisible.value = false
// return
await ContractApi.changeContractUpdate(data)
message.success(t('common.updateSuccess'))
// 发送操作成功的事件
} finally {
formLoading.value = false
}
}
defineExpose({ open, submitForm }) // 提供 open 方法,用于打开弹窗
const goBack = ()=> {
proxy.$router.go(-1)
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
name: undefined,
no: undefined,
customerId: undefined,
quotationId: undefined,
invoiceTemplateId: undefined,
processInstanceId: undefined,
auditStatus: undefined,
startTime: undefined,
endTime: undefined,
penaltyRate: undefined,
latePaymentRate: undefined,
settleMethod: undefined,
lastPayDate: undefined,
contractTerm: undefined,
signUserId: undefined,
signPhoneNumber: undefined,
signEmail: undefined,
signWechat: undefined,
offlinePrice: undefined,
onlinePrice: undefined,
ownerUserId: undefined,
expanderUserId: undefined,
pricingUserId: undefined,
afterSaleUserId: undefined,
collUserId: undefined,
totalPrice: undefined,
contractBody: undefined,
contractAgreement: undefined,
creditMethod: undefined,
creditCalcCycle: undefined,
creditLimit: undefined,
partnerCompanyId: undefined,
deptId: undefined,
quotationTimes: undefined,
changeItem: 1,
products: []
}
formRef.value?.resetFields()
}
/** 处理商机变化 */
const handleQuotationChange = async (quotationId: number) => {
if (!quotationId) return
try {
const quotation = await QuotationApi.getQuotation(quotationId)
formData.value.products = quotation.products;
formData.value.customerId = quotation.customerId;
formData.value.invoiceTemplateId = quotation.invoiceTemplateId;
formData.value.ownerUserId = quotation.ownerUserId;
formData.value.expanderUserId = quotation.expanderUserId;
formData.value.pricingUserId = quotation.pricingUserId;
formData.value.signUserId = quotation.signUserId;
formData.value.signPhoneNumber = quotation.signPhoneNumber;
formData.value.signEmail = quotation.signEmail;
formData.value.signWechat = quotation.signWechat;
formData.value.partnerCompanyId = quotation.partnerCompanyId;
formData.value.creditLimit = quotation.creditLimit;
formData.value.creditMethod = quotation.creditMethod;
formData.value.creditCalcCycle = quotation.creditCalcCycle;
formData.value.deptId = quotation.deptId;
formData.value.offlinePrice = quotation.offlinePrice;
formData.value.onlinePrice = quotation.onlinePrice;
formData.value.totalPrice = quotation.totalPrice;
// 🔁 自动加载客户详情
await onCustomerChange(quotation.customerId);
} catch (err) {
} finally {
}
}
const onCustomerChange = async (customerId: string) => {
if (!customerId) return;
try {
formLoading.value = true;
const customerRes = await CustomerApi.getCustomer(customerId);
formData.value.cooperationType = customerRes.cooperationType;
formData.value.companyType = customerRes.companyType;
formData.value.listingStatus = customerRes.listingStatus;
formData.value.financingInfo = customerRes.financingInfo;
formData.value.paidInCapital = customerRes.paidInCapital;
formData.value.insuredCount = customerRes.insuredCount;
formData.value.establishmentDate = customerRes.establishmentDate;
formData.value.enterpriseType = customerRes.enterpriseType;
formData.value.businessStatus = customerRes.businessStatus;
formData.value.defendantRecord = customerRes.defendantRecord;
formData.value.businessAbnormal = customerRes.businessAbnormal;
formData.value.equityPledge = customerRes.equityPledge;
formData.value.dishonestRecord = customerRes.dishonestRecord;
formData.value.financingRecord = customerRes.financingRecord;
formData.value.enforcementRecord = customerRes.enforcementRecord;
} catch (err) {
console.error('获取客户详情失败:', err);
} finally {
formLoading.value = false;
}
}
/** 动态获取客户联系人 */
const getContactOptions = computed(() =>
contactList.value.filter((item) => item.customerId == formData.value.customerId)
)
const route = useRoute();
//获取字段权限
const getLimit = async () => {
let data = {
modelNodeId: route.query.taskDefinitionKey,
processDefinitionId: route.query.processDefinitionId
}
let field = await getLimitForm(data)
for(let key in formFields.value) {
if(formFields.value.hasOwnProperty(key)) {
field.fields.map( v => {
let newKey = v.field
if(v.field.indexOf('.') > -1) {
newKey = v.field.split('.')[0] + v.field.split('.')[1]
}
if(newKey === key) formFields.value[key] = v.permission
})
}
}
console.log('%csrc/views/crm/contract/detail/ContractChangeDetail.vue:574 object', 'color: #007acc;', formFields.value,555);
}
onMounted(async () => {
isTrue.value = !!route.query.isDetail
formType.value = props.id || route.query.id;
if (formType.value) open(formType.value)
if(route.query.processDefinitionId) getLimit()
// 获得客户列表
customerList.value = await CustomerApi.getCustomerSimpleList()
// 获得用户列表
userOptions.value = await UserApi.getSimpleUserList()
// 获得报价列表
quotationList.value = await QuotationApi.getSimpleQuotationList()
// 默认新建时选中自己
// if (formType.value === 'create') {
// formData.value.ownerUserId = useUserStore().getUser.id
// }
// 获取联系人
contactList.value = await CustomerApi.getCustomerSimpleList()
});
</script>