合同要素
This commit is contained in:
‘huanghaiixia’
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" destroyOnClose @register="registerModal" showFooter :title="getTitle" width="40%" @ok="handleSubmit" @cancel="handleCancel" :showOkBtn="!isDisable">
|
||||
<BasicModal v-bind="$attrs" destroyOnClose @register="registerModal" showFooter :title="getTitle" width="60%" @ok="handleSubmit" @cancel="handleCancel" :showOkBtn="!isDisable">
|
||||
<a-form ref="formRef" class="formViewStyle" :model="formState" :rules="rules" v-bind="{labelCol: { span: 8 },wrapperCol: { span: 16 },}">
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
@ -13,10 +13,10 @@
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="对方银行名称" name="cpBankName" :label-col="{ span: 8 }" :wrapper-col="{ span: 24 }">
|
||||
<a-select v-model:value="formState.cpBankName" placeholder="请选择银行名称" :disabled="isDisable" style="width: 100%" allow-clear>
|
||||
<a-select-option v-for="item in optionList" :key="item.code" :value="item.code">
|
||||
{{ item.fullName }}
|
||||
<a-form-item label="对方银行名称" name="cpBankCode" :label-col="{ span: 8 }" :wrapper-col="{ span: 24 }">
|
||||
<a-select v-model:value="formState.cpBankCode" placeholder="请选择银行名称" :disabled="isDisable" style="width: 100%" allow-clear @change="bankChange">
|
||||
<a-select-option v-for="item in optionList" :key="item.bankCode" :value="item.bankCode">
|
||||
{{ item.bankName }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
@ -33,27 +33,27 @@
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="对方联系人姓名" name="contactName" :label-col="{ span: 8 }" :wrapper-col="{ span: 24 }">
|
||||
<a-input v-model:value="formState.contactName" placeholder="请输入资质证书编号" />
|
||||
<a-input v-model:value="formState.contactName" placeholder="请输入对方联系人姓名" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="对方联系人电话" name="contactTel" :label-col="{ span: 8 }" :wrapper-col="{ span: 24 }">
|
||||
<a-input v-model:value="formState.contactTel" placeholder="请输入资质证书编号" />
|
||||
<a-input v-model:value="formState.contactTel" placeholder="请输入对方联系人电话" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="对方联系人邮箱" name="contactEmail" :label-col="{ span: 8 }" :wrapper-col="{ span: 24 }">
|
||||
<a-input v-model:value="formState.contactEmail" placeholder="请输入资质证书编号" />
|
||||
<a-input v-model:value="formState.contactEmail" placeholder="请输入对方联系人邮箱" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="对方通讯地址" name="contactAddress" :label-col="{ span: 4 }" :wrapper-col="{ span: 24 }">
|
||||
<a-input v-model:value="formState.contactAddress" placeholder="请输入资质证书编号" />
|
||||
<a-input v-model:value="formState.contactAddress" placeholder="请输入对方通讯地址" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="备注" name="note" :label-col="{ span: 4 }" :wrapper-col="{ span: 24 }">
|
||||
<a-textarea v-model:value="formState.note" placeholder="请输入备注，最多50字" :disabled="isDisable" :maxlength="50" :auto-size="{ minRows: 2, maxRows: 5 }"/>
|
||||
<a-textarea v-model:value="formState.note" placeholder="请输入备注" :disabled="isDisable" :auto-size="{ minRows: 2, maxRows: 5 }"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
@ -64,86 +64,83 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, computed, unref,reactive } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
|
||||
import { Form, message } from 'ant-design-vue';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { getDocCpList } from '/@/api/sales/Customer';
|
||||
import type { FormInstance } from 'ant-design-vue';
|
||||
import customerSupplierListModal from '/@/components/common/customerSupplierListModal.vue';
|
||||
|
||||
|
||||
import { getLngCustomer } from '/@/api/sales/Customer';
|
||||
import { getLngSupplier } from '/@/api/supplier/Supplier';
|
||||
import { getBankBList } from '/@/api/contract/ContractFact';
|
||||
|
||||
const { t } = useI18n();
|
||||
const isUpdate = ref(true);
|
||||
const isDisable = ref(false);
|
||||
let optionList = reactive([])
|
||||
let optionList = ref([])
|
||||
const formRef = ref()
|
||||
const { notification } = useMessage();
|
||||
const emit = defineEmits(['success','register']);
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? t('新增证书') : t('编辑证书')));
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? t('新增相对方') : t('编辑相对方')));
|
||||
let formState = reactive({
|
||||
docTypeCode: '',
|
||||
fileList: [],
|
||||
filePath: ''
|
||||
});
|
||||
const list = ref()
|
||||
const rules = {
|
||||
docTypeCode: [{ required: true, message: "该项为必填项", trigger: 'change' }],
|
||||
cpName: [{ required: true, message: "该项为必填项", trigger: 'change' }],
|
||||
cpBankCode: [{ required: true, message: "该项为必填项", trigger: 'change' }],
|
||||
contactEmail: [{ required: false, message: "该项为必填项", trigger: 'change' }, {type: 'email', message: '邮箱格式错误\n'} ],
|
||||
};
|
||||
|
||||
const props = defineProps({
|
||||
type: String
|
||||
})
|
||||
const [register, { openModal:openModal}] = useModal();
|
||||
const onSearchUser = (val)=> {
|
||||
openModal(true,{isUpdate: false})
|
||||
}
|
||||
const handleSuccess = (val) => {
|
||||
formState.cpTableName = val[0].cpTableName
|
||||
formState.cpCode = val[0].cpTableName == '客户' ? val[0].cuCode : val[0].suCode
|
||||
formState.cpName = val[0].cpTableName == '客户' ? val[0].cuName : val[0].suName
|
||||
// getLngCustomer(val[0].id)
|
||||
getBankInfo(formState.cpCode, val[0].cpTableName)
|
||||
}
|
||||
const getBankInfo = async (code, type) => {
|
||||
const res = await getBankBList(code, type=='客户'? 'C' : 'S')
|
||||
optionList.value = res|| []
|
||||
formState.cpBankCode = (optionList.value.find(v => v.defaultSign == 'Y') || {}).bankCode
|
||||
formState.cpBankName = (optionList.value.find(v => v.defaultSign == 'Y') || {}).bankName
|
||||
formState.cpBankAccountName = (optionList.value.find(v => v.defaultSign == 'Y') || {}).accountName
|
||||
formState.cpBankAccount = (optionList.value.find(v => v.defaultSign == 'Y') || {}).account
|
||||
}
|
||||
const bankChange = (val) => {
|
||||
formState.cpBankName = (optionList.value.find(v => v.bankCode == val) || {}).bankName
|
||||
formState.cpBankAccountName = (optionList.value.find(v => v.bankCode == val) || {}).accountName
|
||||
formState.cpBankAccount = (optionList.value.find(v => v.bankCode == val) || {}).account
|
||||
}
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
curData.value = ''
|
||||
formState.filePath = ''
|
||||
getOption()
|
||||
setModalProps({ confirmLoading: false });
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
isDisable.value = data?.btnType == 'view' ? true : false
|
||||
list.value = data.list
|
||||
if (unref(isUpdate)) {
|
||||
Object.assign(formState, {...data.record})
|
||||
|
||||
getBankInfo(formState.cpCode, formState.cpTableName, 'code')
|
||||
}
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
getOption()
|
||||
|
||||
});
|
||||
|
||||
|
||||
async function getOption() {
|
||||
let obj = {}
|
||||
if (props.type == 'cuSign') {
|
||||
obj = {'cuSign': 'Y'}
|
||||
} else {
|
||||
obj = {'suSign': 'Y'}
|
||||
tableName = 'supplier'
|
||||
}
|
||||
optionList = await getDocCpList({'valid': 'Y',...obj })
|
||||
}
|
||||
const handleCancel = () => {
|
||||
formRef.value.resetFields();
|
||||
}
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
await formRef.value.validate();
|
||||
// 验证通过，提交表单
|
||||
let obj = {
|
||||
...formState,
|
||||
|
||||
}
|
||||
let idx =list.value.findIndex(v => v.docTypeCode == obj.docTypeCode)
|
||||
if (idx > -1 && formState.docTypeCode !=curData.value) {
|
||||
message.warn('证书已存在')
|
||||
formRef.value.resetFields();
|
||||
closeModal();
|
||||
return
|
||||
}
|
||||
emit('success', obj);
|
||||
emit('success', formState);
|
||||
notification.success({
|
||||
message: t('操作'),
|
||||
description:!unref(isUpdate)? t('新增成功') : t('编辑成功')
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div class="customerSupplierList">
|
||||
<BasicModal v-bind="$attrs" :zIndex="1001 @register="registerModal" width="60%" :title="getTitle" @ok="handleSubmit"
|
||||
<BasicModal v-bind="$attrs" :zIndex="1001" @register="registerModal" width="60%" :title="getTitle" @ok="handleSubmit"
|
||||
@visible-change="handleVisibleChange" >
|
||||
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange" :class="{ 'h-full': ['1', '2'].includes(activeKey) }">
|
||||
<a-tab-pane key="1" tab="客户">
|
||||
<BasicTable @register="registerTable" class="customerSupplierListModal"></BasicTable>
|
||||
<BasicTable @register="registerTable" class="customerListModal"></BasicTable>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="供应商" force-render>
|
||||
<BasicTable @register="registerTableSupplier" class="customerSupplierListModal"></BasicTable>
|
||||
<BasicTable @register="registerTableSupplier" class="supplierListModal"></BasicTable>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</BasicModal>
|
||||
@ -38,7 +38,7 @@
|
||||
];
|
||||
|
||||
const codeFormSchemaSupplier: FormSchema[] = [
|
||||
{ field: 'suName', label: '供应商名称', component: 'Input' },
|
||||
{ field: 'suName', label: '供应商名称', component: 'Input' }
|
||||
];
|
||||
|
||||
const columnsSupplier: BasicColumn[] = [
|
||||
@ -56,7 +56,7 @@
|
||||
const selectedKeys = ref<string[]>([]);
|
||||
const selectedValues = ref([]);
|
||||
const props = defineProps({
|
||||
selectType: { type: String, default: 'checkbox' },
|
||||
selectType: { type: String, default: 'radio' },
|
||||
|
||||
});
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
@ -75,7 +75,7 @@
|
||||
pagination: true,
|
||||
canResize: false,
|
||||
formConfig: {
|
||||
labelCol:{span: 9, offSet:10},
|
||||
labelCol:{span: 9},
|
||||
schemas: codeFormSchema,
|
||||
showResetButton: true,
|
||||
},
|
||||
@ -88,7 +88,7 @@
|
||||
onChange: onSelectChange
|
||||
},
|
||||
});
|
||||
const [registerTableSupplier, { getDataSource, setTableData, updateTableDataRecord, reload:reloadSupplier }] = useTable({
|
||||
const [registerTableSupplier, { reload:reloadSupplier }] = useTable({
|
||||
title: t('供应商列表'),
|
||||
api: getLngSupplierPage,
|
||||
columns:columnsSupplier,
|
||||
@ -97,9 +97,10 @@
|
||||
pagination: true,
|
||||
canResize: false,
|
||||
formConfig: {
|
||||
labelCol:{span: 9, offSet:10},
|
||||
labelCol:{span: 9},
|
||||
schemas: codeFormSchemaSupplier,
|
||||
showResetButton: true,
|
||||
showAdvancedButton: false
|
||||
},
|
||||
immediate: false, // 设置为不立即调用
|
||||
beforeFetch: (params) => {
|
||||
@ -119,10 +120,11 @@
|
||||
}
|
||||
};
|
||||
const handleTabChange = (key) => {
|
||||
activeKey.value = key
|
||||
};
|
||||
function onSelectChange(rowKeys: string[], e) {
|
||||
selectedKeys.value = rowKeys;
|
||||
selectedValues.value = e
|
||||
selectedValues.value = [{...e[0], cpTableName: activeKey.value=='1' ? '客户': '供应商'}]
|
||||
}
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? t('客户列表') : t('')));
|
||||
|
||||
@ -130,7 +132,7 @@
|
||||
if (!selectedValues.value.length) {
|
||||
notification.warning({
|
||||
message: t('提示'),
|
||||
description: t('请选择数据')
|
||||
description: t('请选择' + activeKey.value=='1' ? '客户': '供应商')
|
||||
});
|
||||
return
|
||||
}
|
||||
@ -146,7 +148,7 @@
|
||||
|
||||
</script>
|
||||
<style >
|
||||
.customerSupplierListModal .basicCol{
|
||||
.customerListModal .basicCol, .supplierListModal .basicCol{
|
||||
position: inherit !important;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<div style="display: flex;">
|
||||
|
||||
<div class="w-1/3 xl:w-1/3 overflow-hidden bg-white" :style="{ 'border-right': '1px solid #e5e7eb' }">
|
||||
<BasicTree :title="t('组织列表')" ref="asyncTreeRef" search toolbar :clickRowToExpand="true" expandOnSearch :treeData="treeData" :fieldNames="{ key: 'id', title: 'name' }" @select="handleSelect" />
|
||||
<BasicTree :title="t('组织列表')" style="height: 250px" ref="asyncTreeRef" search toolbar :clickRowToExpand="true" expandOnSearch :treeData="treeData" :fieldNames="{ key: 'id', title: 'name' }" @select="handleSelect" />
|
||||
</div>
|
||||
<BasicTable @register="registerTable" class="deptUserModal w-2/3 xl:w-2/3"></BasicTable>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user