ccongli
1 year ago
parent
02988db332
commit
071ad70fe8
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<el-card class="build-contract">
|
||||
<template #header>
|
||||
<div class="header">
|
||||
<div>
|
||||
<span style="margin-right: 10px;">生成合同</span>
|
||||
<small> ( <span style="color: #f56c6c;">*</span> 为必填项 )</small>
|
||||
</div>
|
||||
<el-button type="primary" text @click="() => { }">预览合同</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<div class="content">
|
||||
<div class="lead">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">合同类型</span>
|
||||
</div>
|
||||
<div class="tips">
|
||||
<el-alert title="不同的合同类型可编辑的字段内容不同，合同类型一旦保存不可修改，请选择更匹配你需求的一个。" type="warning" />
|
||||
</div>
|
||||
<div class="types">
|
||||
<el-button-group>
|
||||
<template v-for="item in contract_types" :key="item.value">
|
||||
<el-button :type="item.value == activeType ? 'primary' : 'default'" class="type"
|
||||
:class="item.value == activeType ? 'active' : ''" @click="changeContractType(item.value)">{{ item.label
|
||||
}}</el-button>
|
||||
</template>
|
||||
|
||||
<!-- <el-button type="default" class="type">销售合同</el-button>
|
||||
<el-button type="default" class="type">仓储合同</el-button> -->
|
||||
</el-button-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-area">
|
||||
<ProcureContract />
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<el-divider />
|
||||
<div class="options">
|
||||
<el-button type="primary" style="width: 120px;" size="large">保存</el-button>
|
||||
<el-button type="default" style="width: 120px;" size="large" plain>返回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
<script setup lang="ts" name="BuildContract">
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
import * as ContractApi from '@/api/xxjj/contract'
|
||||
import ProcureContract from './components/types/procure/ProcureContract.vue'
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
|
||||
const contract_types = ref<any>([]);
|
||||
|
||||
const activeType = ref('1');
|
||||
|
||||
onMounted(() => {
|
||||
contract_types.value = getStrDictOptions(DICT_TYPE.CONTRACT_TYPE)
|
||||
console.log(contract_types);
|
||||
});
|
||||
|
||||
// 切换合同类型
|
||||
const changeContractType = (typeVal) => {
|
||||
activeType.value = typeVal
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.build-contract {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
|
||||
::v-deep {
|
||||
.el-card__header {
|
||||
background-color: rgba(249, 249, 249, 1);
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
max-height: 1500px;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
|
||||
.lead {
|
||||
width: 100%;
|
||||
padding: 0 20px;
|
||||
margin-bottom: 50px;
|
||||
|
||||
.title {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.lc {
|
||||
width: 8px;
|
||||
height: 16px;
|
||||
background-color: #409eff;
|
||||
margin-right: 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.lh {
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
width: 50%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
||||
.types {
|
||||
margin-top: 10px;
|
||||
|
||||
::v-deep(.el-button) {
|
||||
&:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background-color: #409eff;
|
||||
}
|
||||
}
|
||||
|
||||
.type {
|
||||
width: 120px;
|
||||
height: 60px;
|
||||
color: #999;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-area {
|
||||
padding: 0 20px;
|
||||
height: 1500px;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
height: 100px;
|
||||
|
||||
.options {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,37 @@
|
||||
<template>
|
||||
<div class="tree-and-table">
|
||||
左树右表弹框
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="TreeAndTable">
|
||||
const emits = defineEmits(['changeRange']);
|
||||
|
||||
const props = defineProps<{
|
||||
name: string
|
||||
}>();
|
||||
|
||||
const ranges = reactive([
|
||||
{
|
||||
day: 0,
|
||||
text: '今天'
|
||||
},
|
||||
{
|
||||
day: 1,
|
||||
text: '昨天'
|
||||
},
|
||||
{
|
||||
day: 7,
|
||||
text: '最近7天'
|
||||
},
|
||||
{
|
||||
day: 30,
|
||||
text: '最近30天'
|
||||
}
|
||||
]);
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.tree-and-table {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div class="annexinfo_a">
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large"
|
||||
label-position="top">
|
||||
<el-row justify="start" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同附件" prop="contractAppendices">
|
||||
<UploadFile v-model="formData.contractAppendices" :title="config.title" :limit="config.limit"
|
||||
:file-size="config.fileSize" :file-type="config.fileType" />
|
||||
<!-- <el-input v-model="formData.contractAppendices" placeholder="合同附件" v-show="false" /> -->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="附属文件" prop="ancillaryDocuments">
|
||||
<UploadFile v-model="formData.ancillaryDocuments" :title="config.title" :limit="config.limit"
|
||||
:file-size="config.fileSize" :file-type="config.fileType" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="8">
|
||||
<el-button @click="() => { console.log(formData) }">查看</el-button>
|
||||
</el-col> -->
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="AnnexInfo_A">
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
|
||||
const formData = ref<any>({ // 表单数据
|
||||
contractAppendices: [],
|
||||
ancillaryDocuments: [],
|
||||
})
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
contractAppendices: [{ required: false, message: '合同附件不能为空', trigger: 'blur' }],
|
||||
ancillaryDocuments: [{ required: false, message: '附属文件不能为空', trigger: 'blur' }],
|
||||
})
|
||||
|
||||
const config = reactive({
|
||||
title: "上传文件",
|
||||
fileType: ['rar', 'zip', 'doc', 'docx', 'pdf'],
|
||||
fileSize: 20,
|
||||
limit: 4,
|
||||
});
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.annexinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<div class="baseinfo_a">
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large" label-position="top">
|
||||
<el-row justify="start" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同模版" prop="contractTemplateId">
|
||||
<el-input v-model="formData.contractTemplateId" placeholder="请选择合同模版" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同编号" prop="contractNumber">
|
||||
<el-input v-model="formData.contractNumber" placeholder="点击后生成合同编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同名称" prop="contractName">
|
||||
<el-input v-model="formData.contractName" placeholder="请输入合同名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="对方合同编号" prop="contractNo">
|
||||
<el-input v-model="formData.contractNo" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="签订地点" prop="contractSigned">
|
||||
<el-input v-model="formData.contractSigned" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="签订时间" prop="contractSignedTime">
|
||||
<el-input v-model="formData.contractSignedTime" placeholder="选择日期" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="关联业务线" prop="businessId">
|
||||
<el-select v-model="formData.businessId" placeholder="请选择业务类型" style="width: 100%;">
|
||||
<el-option label="业务线" value="1">业务线1</el-option>
|
||||
<el-option label="业务线" value="2">业务线2</el-option>
|
||||
<el-option label="业务线" value="3">业务线3</el-option>
|
||||
<el-option label="业务线" value="4">业务线4</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="业务类型" prop="businessType">
|
||||
<el-select v-model="formData.businessType" placeholder="请选择业务类型" style="width: 100%;">
|
||||
<el-option v-for="dict in getStrDictOptions(DICT_TYPE.CONTRACT_BUSINESS_TYPE)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="申报时间" prop="declarationTime">
|
||||
<el-date-picker v-model="formData.declarationTime" type="date" value-format="x" placeholder="选择申报时间"
|
||||
style="width: 100%;" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="BaseInfo_A">
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const emits = defineEmits(["setContractId"]);
|
||||
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
|
||||
const formData = ref({ // 表单数据
|
||||
contractTemplateId: undefined,
|
||||
contractNumber: undefined,
|
||||
contractName: undefined,
|
||||
contractNo: undefined,
|
||||
contractSigned: undefined,
|
||||
contractSignedTime: undefined,
|
||||
businessId: undefined,
|
||||
businessType: undefined,
|
||||
declarationTime: undefined
|
||||
})
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
contractTemplateId: [{ required: true, message: '合同模板未选择', trigger: 'blur' }],
|
||||
contractNumber: [{ required: true, message: '合同编号不能为空', trigger: 'blur' }],
|
||||
contractName: [{ required: true, message: '合同名称不能为空', trigger: 'blur' }],
|
||||
contractNo: [{ required: false, message: '对方合同编号不能为空', trigger: 'blur' }],
|
||||
contractSigned: [{ required: true, message: '签订地点不能为空', trigger: 'blur' }],
|
||||
contractSignedTime: [{ required: true, message: '签订时间不能为空', trigger: 'blur' }],
|
||||
businessId: [{ required: true, message: '关联业务线不能为空', trigger: 'blur' }],
|
||||
businessType: [{ required: true, message: '业务类型不能为空', trigger: 'change' }],
|
||||
declarationTime: [{ required: true, message: '申报时间不能为空', trigger: 'blur' }]
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.baseinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<div class="deliveryinfo_a">
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large"
|
||||
label-position="top">
|
||||
<el-row justify="start" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="交货时间" prop="deliveryTime">
|
||||
<el-date-picker v-model="formData.deliveryTime" type="date" value-format="x" placeholder="选择日期范围"
|
||||
style="width: 100%;" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="交货方式" prop="deliveryModel">
|
||||
<el-select v-model="formData.deliveryModel" placeholder="交货方式" style="width: 100%;">
|
||||
<el-option v-for="dict in getStrDictOptions(DICT_TYPE.CONTRACT_DELIVERY_MODEL)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="交货地点" prop="deliveryLocation">
|
||||
<el-input v-model="formData.deliveryLocation" placeholder="输入内容" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="运输方式" prop="modeTransport">
|
||||
<el-select v-model="formData.modeTransport" placeholder="运输方式" style="width: 100%;">
|
||||
<el-option v-for="dict in getStrDictOptions(DICT_TYPE.CONTRACT_MODE_TRANSPORT)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="配送方式" prop="deliveryMethod">
|
||||
<el-select v-model="formData.deliveryMethod" placeholder="配送方式" style="width: 100%;">
|
||||
<el-option v-for="dict in getStrDictOptions(DICT_TYPE.CONTRACT_DELIVERY_METHOD)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="费用承担主体" prop="costBearingMian">
|
||||
<el-select v-model="formData.costBearingMian" placeholder="费用承担主体" style="width: 100%;">
|
||||
<el-option v-for="dict in getStrDictOptions(DICT_TYPE.CONTRACT_COST_MAIN)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="DeliveryInfo_A">
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
|
||||
const formData = ref({ // 表单数据
|
||||
deliveryTime: undefined,
|
||||
deliveryModel: undefined,
|
||||
deliveryLocation: undefined,
|
||||
modeTransport: undefined,
|
||||
deliveryMethod: undefined,
|
||||
costBearingMian: undefined,
|
||||
})
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
deliveryTime: [{ required: true, message: '交货时间不能为空', trigger: 'blur' }],
|
||||
deliveryModel: [{ required: true, message: '交货方式不能为空', trigger: 'blur' }],
|
||||
deliveryLocation: [{ required: true, message: '交货地点不能为空', trigger: 'blur' }],
|
||||
modeTransport: [{ required: true, message: '运输方式不能为空', trigger: 'blur' }],
|
||||
deliveryMethod: [{ required: true, message: '配送方式不能为空', trigger: 'blur' }],
|
||||
costBearingMian: [{ required: true, message: '费用承担主体不能为空', trigger: 'blur' }],
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.deliveryinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div class="extendinfo_a">
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large"
|
||||
label-position="top">
|
||||
<el-row justify="start" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="长协合同" prop="contractAgreement">
|
||||
<el-input v-model="formData.contractAgreement" placeholder="是否合同模版" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="安全协议" prop="securityProtocol">
|
||||
<el-input v-model="formData.securityProtocol" placeholder="输入内容" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="是否招投标" prop="bidding">
|
||||
<el-input v-model="formData.bidding" placeholder="是否招投标" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="扩展字段" prop="extendedField">
|
||||
<el-input v-model="formData.extendedField" placeholder="扩展信息" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="合同标签" prop="contractLabel">
|
||||
<!-- <el-input v-model="formData.contractLabel" placeholder="输入内容" /> -->
|
||||
<el-select v-model="formData.contractLabel" multiple filterable allow-create default-first-option
|
||||
:reserve-keyword="false" placeholder="合同标签" style="width: 100%;">
|
||||
<el-option v-for="item in labelList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="合同要求" prop="contractRequirement">
|
||||
<el-input v-model="formData.contractRequirement" type="textarea" placeholder="输入内容" :rows="10" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="备注一" prop="remark">
|
||||
<el-input v-model="formData.remark" type="textarea" placeholder="输入内容" :rows="10" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="备注二" prop="remark2">
|
||||
<el-input v-model="formData.remark2" type="textarea" placeholder="输入内容" :rows="10" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="() => console.log(formData)">提交</el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="ExtendInfo_A">
|
||||
import { Select } from '@element-plus/icons-vue'
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
// const props = defineProps({
|
||||
// contractId: {
|
||||
// type: Number,
|
||||
// require: false,
|
||||
// default: 10001
|
||||
// }
|
||||
// });
|
||||
|
||||
// const selectMainBodyInfo = (index) => {
|
||||
// console.log(index);
|
||||
// }
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
|
||||
const formData = ref({ // 表单数据
|
||||
contractAgreement: undefined,
|
||||
securityProtocol: undefined,
|
||||
extendedField: undefined,
|
||||
bidding: undefined,
|
||||
contractLabel: undefined,
|
||||
contractRequirement: undefined,
|
||||
remark: undefined,
|
||||
remark2: undefined,
|
||||
})
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
contractAgreement: [{ required: true, message: '长协合同未选择', trigger: 'blur' }],
|
||||
securityProtocol: [{ required: true, message: '安全协议不能为空', trigger: 'blur' }],
|
||||
bidding: [{ required: false, message: '是否招投标未选择', trigger: 'blur' }],
|
||||
extendedField: [{ required: false, message: '扩展信息不能为空', trigger: 'blur' }],
|
||||
contractLabel: [{ required: false, message: '合同标签不能为空', trigger: 'blur' }],
|
||||
contractRequirement: [{ required: true, message: '合同要求不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: false, message: '备注一不能为空', trigger: 'blur' }],
|
||||
remark2: [{ required: false, message: '备注一不能为空', trigger: 'change' }],
|
||||
})
|
||||
|
||||
|
||||
const labelList = reactive(
|
||||
[
|
||||
{
|
||||
value: '1',
|
||||
label: '标签1',
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '标签2',
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '标签1',
|
||||
},
|
||||
{
|
||||
value: '4',
|
||||
label: '标签4',
|
||||
},
|
||||
{
|
||||
value: '5',
|
||||
label: '标签5',
|
||||
},
|
||||
]
|
||||
);
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.extendinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<div class="financeinfo_a">
|
||||
<el-form ref="formRef2" :model="formData2" :rules="formRules2" v-loading="formLoading2"
|
||||
size="large">
|
||||
<el-row justify="center" :gutter="50">
|
||||
<el-col :span="24">
|
||||
<el-card class="box-card">
|
||||
<el-table :data="tableData" stripe style="width: 100%" size="large" fit :cell-style="{'padding': '24px 0 0 0'}">
|
||||
<el-table-column prop="mainName" label="主体">
|
||||
<template #default>
|
||||
<el-form-item prop="mainName">
|
||||
<el-tooltip class="box-item" effect="dark" :content="formData2.mainName"
|
||||
:visible="formData2.mainName.trim().length > 0" placement="top">
|
||||
<el-input v-model="formData2.mainName" placeholder="主体" />
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="paymentMethod" label="付款方式">
|
||||
<template #default>
|
||||
<el-form-item prop="paymentMethod">
|
||||
<el-input v-model="formData2.paymentMethod" placeholder="付款方式" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="cooperationMethod" label="合作方式">
|
||||
<template #default>
|
||||
<el-form-item prop="cooperationMethod">
|
||||
<el-input v-model="formData2.cooperationMethod" placeholder="合作方式" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="settlementMethod" label="结算方式">
|
||||
<template #default>
|
||||
<el-form-item prop="settlementMethod">
|
||||
<el-input v-model="formData2.settlementMethod" placeholder="结算方式" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="advanceRatio" label="预付比例">
|
||||
<template #default>
|
||||
<el-form-item prop="advanceRatio">
|
||||
<el-input v-model="formData2.advanceRatio" placeholder="预付比例" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="underpaymentMethod" label="压款方式">
|
||||
<template #default>
|
||||
<el-form-item prop="underpaymentMethod">
|
||||
<el-input v-model="formData2.underpaymentMethod" placeholder="压款方式" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="depositMethod" label="保证金方式">
|
||||
<template #default>
|
||||
<el-form-item prop="depositMethod">
|
||||
<el-input v-model="formData2.depositMethod" placeholder="保证金方式" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="overdueInterestRate" label="逾期利率">
|
||||
<template #default>
|
||||
<el-form-item prop="overdueInterestRate">
|
||||
<el-input v-model="formData2.overdueInterestRate" placeholder="逾期利率" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div style="height: 30px;" content="gap"></div>
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large"
|
||||
label-position="top">
|
||||
<el-row justify="start" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合计金额（人民币）" prop="totalAmount">
|
||||
<el-input v-model="formData.totalAmount" placeholder="自动计算" disabled>
|
||||
<template #append>元</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="大写金额（人民币) " prop="amountCapitalization">
|
||||
<el-input v-model="formData.amountCapitalization" placeholder="自动编写" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="FinanceInfo_A">
|
||||
import { Select } from '@element-plus/icons-vue'
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const props = defineProps({
|
||||
contractId: {
|
||||
type: Number,
|
||||
require: false,
|
||||
default: 10001
|
||||
}
|
||||
});
|
||||
|
||||
const tableData = reactive([
|
||||
{
|
||||
mainBody: '甲方',
|
||||
mainBodyType: 1, // 甲方
|
||||
contractId: props.contractId,
|
||||
mainName: "--",
|
||||
representativeName: "--",
|
||||
socialUnifiedInformationCode: "--",
|
||||
updateTime: "--"
|
||||
}
|
||||
]);
|
||||
|
||||
const formRef = ref() // 表单 Ref
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
const formData = ref({ // 表单数据
|
||||
totalAmount: undefined,
|
||||
amountCapitalization: undefined,
|
||||
});
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
totalAmount: [{ required: true, message: '合计金额不能为空', trigger: 'blur' }],
|
||||
amountCapitalization: [{ required: true, message: '大写金额不能为空', trigger: 'blur' }],
|
||||
})
|
||||
|
||||
const formRef2 = ref() // 表单 Ref
|
||||
const formLoading2 = ref(false) // 表单加载状态
|
||||
const formData2 = ref({ // 表单数据
|
||||
mainName: '',
|
||||
paymentMethod: undefined,
|
||||
cooperationMethod: undefined,
|
||||
settlementMethod: undefined,
|
||||
advanceRatio: undefined,
|
||||
accountPeriod: undefined,
|
||||
underpaymentMethod: undefined,
|
||||
depositMethod: undefined,
|
||||
overdueInterestRate: undefined,
|
||||
})
|
||||
const formRules2 = reactive({ // 验证规则
|
||||
mainName: [{ required: true, message: '主体名称不能为空', trigger: 'blur' }],
|
||||
paymentMethod: [{ required: true, message: '付款方式不能为空', trigger: 'blur' }],
|
||||
cooperationMethod: [{ required: true, message: '合作方式不能为空', trigger: 'blur' }],
|
||||
settlementMethod: [{ required: true, message: '结算方式不能为空', trigger: 'blur' }],
|
||||
advanceRatio: [{ required: true, message: '预付比例不能为空', trigger: 'blur' }],
|
||||
accountPeriod: [{ required: true, message: '账期不能为空', trigger: 'blur' }],
|
||||
underpaymentMethod: [{ required: true, message: '压款方式不能为空', trigger: 'blur' }],
|
||||
depositMethod: [{ required: true, message: '保证金方式不能为空', trigger: 'change' }],
|
||||
overdueInterestRate: [{ required: true, message: '逾期利率不能为空', trigger: 'blur' }]
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.financeinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<div class="paymentnodes_a">
|
||||
<el-card class="box-card">
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" v-loading="formLoading" size="large">
|
||||
<el-table :data="formData.dataList" stripe style="width: 100%" size="large" fit empty-text="暂无节点信息" @current-change="changeRowIndex">
|
||||
<el-table-column prop="paymentNode" label="收付款节点" width="180" class-name="cellstyle">
|
||||
<template #default="{ row, $index }">
|
||||
<!-- {{$index}} -->
|
||||
<el-form-item :prop="'dataList.'+ $index + '.paymentNode'" :rules="formRules.paymentNode">
|
||||
<el-input v-model="row.paymentNode" placeholder="主体" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="paymentMethod" label="收付款方式" width="180" class-name="cellstyle">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="'dataList.'+ $index + '.paymentMethod'" :rules="formRules.paymentMethod">
|
||||
<el-input v-model="row.paymentMethod" placeholder="收付款方式" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="paymentRatio" label="付款比例" width="180" class-name="cellstyle">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="'dataList.'+ $index + '.paymentRatio'" :rules="formRules.paymentRatio">
|
||||
<el-input v-model="row.paymentRatio" placeholder="付款比例" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="price" label="金额" width="180" class-name="cellstyle">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="'dataList.'+ $index + '.price'" :rules="formRules.price">
|
||||
<el-input v-model="row.price" placeholder="金额" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" label="备注" class-name="cellstyle">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="'dataList.'+ $index + '.remark'" :rules="formRules.remark">
|
||||
<el-input v-model="row.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150px" fixed="left">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="deletePaymentNote(scope.index)">
|
||||
<el-icon>
|
||||
<Delete />
|
||||
</el-icon> 删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<div class="add" @click="addPaymentNote">
|
||||
<el-button link type="primary">
|
||||
<el-icon>
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="margin-left: 5px;">添加节点</span>
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="PaymentNodes_A">
|
||||
import { Delete, CirclePlus } from '@element-plus/icons-vue'
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const props = defineProps({
|
||||
contractId: {
|
||||
type: Number,
|
||||
require: false,
|
||||
default: 10001
|
||||
}
|
||||
});
|
||||
|
||||
const formRef = ref() // 表单 Ref
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
const formData = ref({ // 表单数据
|
||||
dataList: [
|
||||
{
|
||||
contractId: props.contractId,
|
||||
paymentNode: '12345',
|
||||
paymentMethod: '',
|
||||
paymentRatio: '',
|
||||
price: '',
|
||||
remark: '',
|
||||
},
|
||||
{
|
||||
contractId: props.contractId,
|
||||
paymentNode: '',
|
||||
paymentMethod: '',
|
||||
paymentRatio: '',
|
||||
price: '',
|
||||
remark: '',
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
paymentNode: [{ required: true, message: '收付款节点不能为空', trigger: 'blur' }],
|
||||
paymentMethod: [{ required: true, message: '收付款方式不能为空', trigger: 'blur' }],
|
||||
paymentRatio: [{ required: false, message: '付款比例不能为空', trigger: 'blur' }],
|
||||
price: [{ required: true, message: '金额不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
|
||||
})
|
||||
|
||||
const deletePaymentNote = (index) => {
|
||||
console.log(index);
|
||||
}
|
||||
|
||||
const addPaymentNote = () => {
|
||||
console.log(123456);
|
||||
}
|
||||
|
||||
const changeRowIndex = (currentRow, oldCurrentRow) => {
|
||||
console.log(currentRow, oldCurrentRow);
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.paymentnodes_a {
|
||||
width: 100%;
|
||||
|
||||
.add {
|
||||
cursor: pointer;
|
||||
margin-top: 20px;
|
||||
border: 1px dashed #999;
|
||||
height: 40px;
|
||||
font-size: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
::v-deep(td.cellstyle) {
|
||||
padding: 24px 0 0 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,67 @@
|
||||
<template>
|
||||
<div class="primaryinfo_a">
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large" label-position="top">
|
||||
<el-row justify="start" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="币种" prop="currency">
|
||||
<el-input v-model="formData.currency" placeholder="请选择币种" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="采购模式" prop="procurementModel">
|
||||
<el-input v-model="formData.procurementModel" placeholder="请选择采购模式" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="8">
|
||||
<el-form-item label="关联销售合同" prop="contractName">
|
||||
<el-input v-model="formData.contractName" placeholder="点击关联销售合同" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="定价模式" prop="pricingModel">
|
||||
<el-input v-model="formData.pricingModel" placeholder="定价模式" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="关联供应商/客户" prop="subject">
|
||||
<el-input v-model="formData.subject" placeholder="点击关联供应商/客户" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同期限" prop="contractPeriodTime">
|
||||
<el-input v-model="formData.contractPeriodTime" placeholder="合同期限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="PrimaryInfo_A">
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
const formLoading = ref(false) // 表单加载状态
|
||||
|
||||
const formData = ref({ // 表单数据
|
||||
currency: undefined,
|
||||
procurementModel: undefined,
|
||||
pricingModel: undefined,
|
||||
subject: undefined,
|
||||
contractPeriodTime: undefined,
|
||||
})
|
||||
|
||||
const formRules = reactive({ // 验证规则
|
||||
currency: [{ required: true, message: '交易币种不能为空', trigger: 'blur' }],
|
||||
procurementModel: [{ required: true, message: '采购模式不能为空', trigger: 'blur' }],
|
||||
pricingModel: [{ required: true, message: '定价模式不能为空', trigger: 'blur' }],
|
||||
subject: [{ required: true, message: '关联供应商/客户不能为空', trigger: 'blur' }],
|
||||
contractPeriodTime: [{ required: true, message: '合同期限不能为空', trigger: 'blur' }],
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.primaryinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,149 @@
|
||||
<template>
|
||||
<div class="procure-contract">
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">基本信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<BaseInfo_A @setContractId="genContractId"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">主体信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<!-- <SubjectInfo_A :contract-id="contractId"/> -->
|
||||
<SubjectInfo_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">合同信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<PrimaryInfo_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">交货信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<DeliveryInfo_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">商品明细</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<CommodityList_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">财务信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<FinanceInfo_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">付款节点</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<PaymentNodes_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">附件信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<AnnexInfo_A />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-area">
|
||||
<div class="title">
|
||||
<span class="lc"></span>
|
||||
<span class="lh">其他信息</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<ExtendInfo_A />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="ProcureContract">
|
||||
import BaseInfo_A from './BaseInfo_A.vue'
|
||||
import SubjectInfo_A from './SubjectInfo_A.vue'
|
||||
import PrimaryInfo_A from './PrimaryInfo_A.vue'
|
||||
import DeliveryInfo_A from './DeliveryInfo_A.vue'
|
||||
import CommodityList_A from './CommodityList_A.vue'
|
||||
import FinanceInfo_A from './FinanceInfo_A.vue'
|
||||
import PaymentNodes_A from './PaymentNodes_A.vue'
|
||||
import AnnexInfo_A from './AnnexInfo_A.vue'
|
||||
import ExtendInfo_A from './ExtendInfo_A.vue'
|
||||
|
||||
// 合同编号
|
||||
const contractId = ref<number>(0);
|
||||
|
||||
const genContractId = (cid) => {
|
||||
contractId.value = cid;
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.procure-contract {
|
||||
width: 100%;
|
||||
|
||||
.item-area {
|
||||
width: 100%;
|
||||
margin-bottom: 50px;
|
||||
|
||||
.title {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.lc {
|
||||
width: 8px;
|
||||
height: 16px;
|
||||
background-color: #409eff;
|
||||
margin-right: 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.lh {
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,148 @@
|
||||
<template>
|
||||
<div class="subjectinfo_a">
|
||||
<!-- <el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading" size="large" label-position="top">
|
||||
<el-row justify="center" style="flex-wrap: wrap;" :gutter="50">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同模版" prop="contractTemplateId">
|
||||
<el-input v-model="formData.contractTemplateId" placeholder="请选择合同模版" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同编号" prop="contractNumber">
|
||||
<el-input v-model="formData.contractNumber" placeholder="点击后生成合同编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="合同名称" prop="contractName">
|
||||
<el-input v-model="formData.contractName" placeholder="请输入合同名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="对方合同编号" prop="contractNo">
|
||||
<el-input v-model="formData.contractNo" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="签订地点" prop="contractSigned">
|
||||
<el-input v-model="formData.contractSigned" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="签订时间" prop="contractSignedTime">
|
||||
<el-input v-model="formData.contractSignedTime" placeholder="选择日期" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="关联业务线" prop="businessId">
|
||||
<el-select v-model="formData.businessId" placeholder="请选择业务类型" style="width: 100%;">
|
||||
<el-option label="业务线" value="1">业务线1</el-option>
|
||||
<el-option label="业务线" value="2">业务线2</el-option>
|
||||
<el-option label="业务线" value="3">业务线3</el-option>
|
||||
<el-option label="业务线" value="4">业务线4</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="业务类型" prop="businessType">
|
||||
<el-select v-model="formData.businessType" placeholder="请选择业务类型" style="width: 100%;">
|
||||
<el-option v-for="dict in getStrDictOptions(DICT_TYPE.CONTRACT_BUSINESS_TYPE)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="申报时间" prop="declarationTime">
|
||||
<el-date-picker v-model="formData.declarationTime" type="date" value-format="x" placeholder="选择申报时间"
|
||||
style="width: 100%;" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form> -->
|
||||
<el-card class="box-card">
|
||||
<el-table :data="tableData" stripe style="width: 100%" size="large" fit>
|
||||
<el-table-column prop="mainBody" label="主体" width="180" />
|
||||
<el-table-column prop="mainName" label="主体名称" />
|
||||
<el-table-column prop="representativeName" label="法定代表人" />
|
||||
<el-table-column prop="socialUnifiedInformationCode" label="社会统一信息代码" />
|
||||
<el-table-column prop="updateTime" label="更新时间" width="180" />
|
||||
<el-table-column label="操作" align="center" width="150px" fixed="right">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="selectMainBodyInfo(scope.index)">
|
||||
<el-icon><Select /></el-icon> 选取
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="SubjectInfo_A">
|
||||
import { Select } from '@element-plus/icons-vue'
|
||||
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
||||
|
||||
const props = defineProps({
|
||||
contractId: {
|
||||
type: Number,
|
||||
require: false,
|
||||
default: 10001
|
||||
}
|
||||
});
|
||||
|
||||
const tableData = reactive([
|
||||
{
|
||||
mainBody: '甲方',
|
||||
mainBodyType: 1, // 甲方
|
||||
contractId: props.contractId,
|
||||
mainName: "--",
|
||||
representativeName: "--",
|
||||
socialUnifiedInformationCode: "--",
|
||||
updateTime: "--"
|
||||
},
|
||||
{
|
||||
mainBody: '乙方',
|
||||
mainBodyType: 2, // 乙方
|
||||
contractId: props.contractId,
|
||||
mainName: "--",
|
||||
representativeName: "--",
|
||||
socialUnifiedInformationCode: "--",
|
||||
updateTime: "--"
|
||||
}
|
||||
]);
|
||||
|
||||
const selectMainBodyInfo = (index) => {
|
||||
console.log(index);
|
||||
}
|
||||
// const formRef = ref() // 表单 Ref
|
||||
|
||||
// const formLoading = ref(false) // 表单加载状态
|
||||
|
||||
// const formData = ref({ // 表单数据
|
||||
// contractTemplateId: undefined,
|
||||
// contractNumber: undefined,
|
||||
// contractName: undefined,
|
||||
// contractNo: undefined,
|
||||
// contractSigned: undefined,
|
||||
// contractSignedTime: undefined,
|
||||
// businessId: undefined,
|
||||
// businessType: undefined,
|
||||
// declarationTime: undefined
|
||||
// })
|
||||
|
||||
// const formRules = reactive({ // 验证规则
|
||||
// contractTemplateId: [{ required: true, message: '合同模板未选择', trigger: 'blur' }],
|
||||
// contractNumber: [{ required: true, message: '合同编号不能为空', trigger: 'blur' }],
|
||||
// contractName: [{ required: true, message: '合同名称不能为空', trigger: 'blur' }],
|
||||
// contractNo: [{ required: false, message: '对方合同编号不能为空', trigger: 'blur' }],
|
||||
// contractSigned: [{ required: true, message: '签订地点不能为空', trigger: 'blur' }],
|
||||
// contractSignedTime: [{ required: true, message: '签订时间不能为空', trigger: 'blur' }],
|
||||
// businessId: [{ required: true, message: '关联业务线不能为空', trigger: 'blur' }],
|
||||
// businessType: [{ required: true, message: '业务类型不能为空', trigger: 'change' }],
|
||||
// declarationTime: [{ required: true, message: '申报时间不能为空', trigger: 'blur' }]
|
||||
// })
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.subjectinfo_a {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue