From 019b6cf4ccaa06fc5ca8f5dc5663975eb027d360 Mon Sep 17 00:00:00 2001 From: zhangwei <1504152376@qq.com> Date: 星期三, 04 六月 2025 15:15:16 +0800 Subject: [PATCH] 前端-政府采购投诉数据处理管理 --- Web/src/views/fb_p_complaints/procurementComplaint/component/editDialog.vue | 198 +++++++++++++++++++++++++++++-------------------- 1 files changed, 118 insertions(+), 80 deletions(-) diff --git a/Web/src/views/fb_p_complaints/procurementComplaint/component/editDialog.vue b/Web/src/views/fb_p_complaints/procurementComplaint/component/editDialog.vue index 3bad527..dbc3eae 100644 --- a/Web/src/views/fb_p_complaints/procurementComplaint/component/editDialog.vue +++ b/Web/src/views/fb_p_complaints/procurementComplaint/component/editDialog.vue @@ -1,12 +1,13 @@ 锘�<script lang="ts" name="procurementComplaint" setup> -import { ref, reactive, onMounted } from "vue"; -import { ElMessage } from "element-plus"; -import type { FormRules } from "element-plus"; +import { ref, reactive, onMounted } from 'vue'; +import { ElMessage } from 'element-plus'; +import type { FormRules } from 'element-plus'; import { formatDate } from '/@/utils/formatTime'; import { useProcurementComplaintApi } from '/@/api/fb_p_complaints/procurementComplaint'; +import { log } from 'console'; //鐖剁骇浼犻�掓潵鐨勫嚱鏁帮紝鐢ㄤ簬鍥炶皟 -const emit = defineEmits(["reloadTable"]); +const emit = defineEmits(['reloadTable']); const procurementComplaintApi = useProcurementComplaintApi(); const ruleFormRef = ref(); @@ -14,35 +15,37 @@ title: '', loading: false, showDialog: false, - ruleForm: {} as any, + ruleForm: { + complaints: [{ itemDescription: '' }], + } as any, stores: {}, dropdownData: {} as any, }); // 鑷娣诲姞鍏朵粬瑙勫垯 const rules = ref<FormRules>({ - projectCode: [{required: true, message: '璇烽�夋嫨椤圭洰缂栧彿锛�', trigger: 'blur',},], - projectName: [{required: true, message: '璇烽�夋嫨椤圭洰鍚嶇О锛�', trigger: 'blur',},], - decisionDate: [{required: true, message: '璇烽�夋嫨鍐冲畾鏃ユ湡锛�', trigger: 'change',},], - purchaser: [{required: true, message: '璇烽�夋嫨閲囪喘浜猴紒', trigger: 'blur',},], - procurementAgency: [{required: true, message: '璇烽�夋嫨閲囪喘浠g悊鏈烘瀯锛�', trigger: 'blur',},], + projectCode: [{ required: true, message: '璇烽�夋嫨椤圭洰缂栧彿锛�', trigger: 'blur' }], + projectName: [{ required: true, message: '璇烽�夋嫨椤圭洰鍚嶇О锛�', trigger: 'blur' }], + decisionDate: [{ required: true, message: '璇烽�夋嫨鍐冲畾鏃ユ湡锛�', trigger: 'change' }], + purchaser: [{ required: true, message: '璇烽�夋嫨閲囪喘浜猴紒', trigger: 'blur' }], + procurementAgency: [{ required: true, message: '璇烽�夋嫨閲囪喘浠g悊鏈烘瀯锛�', trigger: 'blur' }], }); // 椤甸潰鍔犺浇鏃� -onMounted(async () => { -}); +onMounted(async () => {}); // 鎵撳紑寮圭獥 const openDialog = async (row: any, title: string) => { state.title = title; - row = row ?? { }; - state.ruleForm = row.id ? await procurementComplaintApi.detail(row.id).then(res => res.data.result) : JSON.parse(JSON.stringify(row)); + row = row ?? { complaints: [{ itemDescription: '' }] }; + state.ruleForm = row.id ? await procurementComplaintApi.detail(row.id).then((res) => res.data.result) : JSON.parse(JSON.stringify(row)); state.showDialog = true; + console.log(state.ruleForm.complaints, state.ruleForm.complaints.length); }; // 鍏抽棴寮圭獥 const closeDialog = () => { - emit("reloadTable"); + emit('reloadTable'); state.showDialog = false; }; @@ -56,81 +59,116 @@ } else { ElMessage({ message: `琛ㄥ崟鏈�${Object.keys(fields).length}澶勯獙璇佸け璐ワ紝璇蜂慨鏀瑰悗鍐嶆彁浜, - type: "error", + type: 'error', }); } }); +}; + +const changeComplaints = (txt:String) => { + if (txt=='add') { + state.ruleForm.complaints.push({ + itemDescription: '', + }); + } else { + state.ruleForm.complaints.pop(); + console.log(state.ruleForm.complaints); + + } }; //灏嗗睘鎬ф垨鑰呭嚱鏁版毚闇茬粰鐖剁粍浠� defineExpose({ openDialog }); </script> <template> - <div class="procurementComplaint-container"> - <el-dialog v-model="state.showDialog" :width="800" draggable :close-on-click-modal="false"> - <template #header> - <div style="color: #fff"> - <span>{{ state.title }}</span> - </div> - </template> - <el-form :model="state.ruleForm" ref="ruleFormRef" label-width="auto" :rules="rules"> - <el-row :gutter="35"> - <el-form-item v-show="false"> - <el-input v-model="state.ruleForm.id" /> - </el-form-item> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="椤圭洰缂栧彿" prop="projectCode"> - <el-input v-model="state.ruleForm.projectCode" placeholder="璇疯緭鍏ラ」鐩紪鍙�" maxlength="50" show-word-limit clearable /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="椤圭洰鍚嶇О" prop="projectName"> - <el-input v-model="state.ruleForm.projectName" placeholder="璇疯緭鍏ラ」鐩悕绉�" maxlength="200" show-word-limit clearable /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="鍐冲畾鏃ユ湡" prop="decisionDate"> - <el-date-picker v-model="state.ruleForm.decisionDate" type="date" placeholder="鍐冲畾鏃ユ湡" /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="閲囪喘浜�" prop="purchaser"> - <el-input v-model="state.ruleForm.purchaser" placeholder="璇疯緭鍏ラ噰璐汉" maxlength="100" show-word-limit clearable /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="閲囪喘浠g悊鏈烘瀯" prop="procurementAgency"> - <el-input v-model="state.ruleForm.procurementAgency" placeholder="璇疯緭鍏ラ噰璐唬鐞嗘満鏋�" maxlength="100" show-word-limit clearable /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="鎶曡瘔浜�" prop="complainant"> - <el-input v-model="state.ruleForm.complainant" placeholder="璇疯緭鍏ユ姇璇変汉" maxlength="100" show-word-limit clearable /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="閲囪喘鐩戠潱閮ㄩ棬" prop="procurementSupervisionDepartment"> - <el-input v-model="state.ruleForm.procurementSupervisionDepartment" placeholder="璇疯緭鍏ラ噰璐洃鐫i儴闂�" maxlength="100" show-word-limit clearable /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" > - <el-form-item label="绾夸笂鍦板潃" prop="url"> - <el-input v-model="state.ruleForm.url" placeholder="璇疯緭鍏ョ嚎涓婂湴鍧�" maxlength="255" show-word-limit clearable /> - </el-form-item> - </el-col> - </el-row> - </el-form> - <template #footer> - <span class="dialog-footer"> - <el-button @click="() => state.showDialog = false">鍙� 娑�</el-button> - <el-button @click="submit" type="primary" v-reclick="1000">纭� 瀹�</el-button> - </span> - </template> - </el-dialog> - </div> + <div class="procurementComplaint-container"> + <el-dialog v-model="state.showDialog" :width="800" draggable :close-on-click-modal="false"> + <template #header> + <div style="color: #fff"> + <span>{{ state.title }}</span> + </div> + </template> + <el-form :model="state.ruleForm" ref="ruleFormRef" label-width="auto" :rules="rules"> + <el-row :gutter="35"> + <el-form-item v-show="false"> + <el-input v-model="state.ruleForm.id" /> + </el-form-item> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="鍐冲畾鏃ユ湡" prop="decisionDate"> + <el-date-picker v-model="state.ruleForm.decisionDate" type="date" placeholder="璇烽�夋嫨鍐冲畾鏃ユ湡" /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="椤圭洰鍚嶇О" prop="projectName"> + <el-input v-model="state.ruleForm.projectName" placeholder="璇疯緭鍏ラ」鐩悕绉�" maxlength="200" show-word-limit + clearable /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="椤圭洰缂栧彿" prop="projectCode"> + <el-input v-model="state.ruleForm.projectCode" placeholder="璇疯緭鍏ラ」鐩紪鍙�" maxlength="50" show-word-limit + clearable /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="閲囪喘浜�" prop="purchaser"> + <el-input v-model="state.ruleForm.purchaser" placeholder="璇疯緭鍏ラ噰璐汉" maxlength="100" show-word-limit + clearable /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="閲囪喘浠g悊鏈烘瀯" prop="procurementAgency"> + <el-input v-model="state.ruleForm.procurementAgency" placeholder="璇疯緭鍏ラ噰璐唬鐞嗘満鏋�" maxlength="100" + show-word-limit clearable /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="閲囪喘鐩戠潱閮ㄩ棬" prop="procurementSupervisionDepartment"> + <el-input v-model="state.ruleForm.procurementSupervisionDepartment" placeholder="璇疯緭鍏ラ噰璐洃鐫i儴闂�" + maxlength="100" show-word-limit clearable /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="鎶曡瘔浜�" prop="complainant"> + <el-input v-model="state.ruleForm.complainant" placeholder="璇疯緭鍏ユ姇璇変汉" maxlength="100" show-word-limit + clearable /> + </el-form-item> + </el-col> + <template v-for="(item,index) in state.ruleForm.complaints" :key="index"> + <el-col :xs="24" :sm="12" :md="12" :lg="21" :xl="12" class="mb20"> + <el-form-item :label="`鎶曡瘔浜嬮」${index==0?'':index}`" prop="complaints"> + <el-input v-model="item.itemDescription" :placeholder="`璇疯緭鍏ユ姇璇変簨椤�${index==0?'':index}`" maxlength="255" + show-word-limit clearable /> + </el-form-item> + </el-col> + </template> + <el-col :xs="24" :sm="12" :md="12" :lg="1" :xl="12" class="mb20"> + <el-button type="primary" @click="changeComplaints('add')">+</el-button> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="1" :xl="12" class="mb20" + v-if="state.ruleForm.complaints&&state.ruleForm.complaints.length>1"> + <el-button type="primary" @click="changeComplaints">-</el-button> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="绾夸笂鍦板潃" prop="url"> + <el-input v-model="state.ruleForm.url" placeholder="璇疯緭鍏ョ嚎涓婂湴鍧�" maxlength="255" show-word-limit clearable /> + </el-form-item> + </el-col> + + </el-row> + </el-form> + <template #footer> + <span class="dialog-footer"> + <el-button @click="() => state.showDialog = false">鍙� 娑�</el-button> + <el-button @click="submit" type="primary" v-reclick="1000">纭� 瀹�</el-button> + </span> + </template> + </el-dialog> + </div> </template> <style lang="scss" scoped> -:deep(.el-select), :deep(.el-input-number) { - width: 100%; +:deep(.el-select), +:deep(.el-input-number) { + width: 100%; } </style> \ No newline at end of file -- Gitblit v1.9.1