From 91b116baef5c74909a59c7f13438dd4a0ad12bed Mon Sep 17 00:00:00 2001
From: zhangwei <1504152376@qq.com>
Date: 星期三, 04 六月 2025 15:49:48 +0800
Subject: [PATCH] 前端-投诉事项增加投诉状态
---
Web/src/views/fb_p_complaints/procurementComplaint/component/editDialog.vue | 212 +++++++++++++++++++++++++++++++++--------------------
1 files changed, 132 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..be24063 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,44 @@
title: '',
loading: false,
showDialog: false,
- ruleForm: {} as any,
+ ruleForm: {
+ complaints: [{ itemDescription: '' }],
+ } as any,
stores: {},
dropdownData: {} as any,
});
+const handlingStatus = [
+ { value: 0, label: '鍏跺畠' },
+ { value: 1, label: '鎴愮珛' },
+ { value: 2, label: '椹冲洖' },
+ { value: 3, label: '閮ㄥ垎鎴愮珛' },
+];
+
// 鑷娣诲姞鍏朵粬瑙勫垯
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: '璇烽�夋嫨閲囪喘浠ｇ悊鏈烘瀯锛�', 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: '璇烽�夋嫨閲囪喘浠ｇ悊鏈烘瀯锛�', 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 +66,123 @@
} 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="閲囪喘浠ｇ悊鏈烘瀯" 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="璇疯緭鍏ラ噰璐洃鐫ｉ儴闂�" 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="900" 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="閲囪喘浠ｇ悊鏈烘瀯" 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="璇疯緭鍏ラ噰璐洃鐫ｉ儴闂�"
+ 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="url">
+ <el-input v-model="state.ruleForm.url" placeholder="璇疯緭鍏ョ嚎涓婂湴鍧�" maxlength="255" show-word-limit clearable />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <template v-for="(item,index) in state.ruleForm.complaints" :key="index">
+ <el-col :xs="24" :sm="12" :md="12" :lg="16" :xl="12" class="mb20">
+ <el-form-item :label="`鎶曡瘔浜嬮」${index==0?'':index}`" prop="complaints">
+ <el-input v-model="item.itemDescription" type="textarea" :placeholder="`璇疯緭鍏ユ姇璇変簨椤�${index==0?'':index}`"
+ maxlength="1000" show-word-limit clearable />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="12" class="mb20">
+ <el-form-item :label="`鎶曡瘔鐘舵��${index==0?'':index}`" prop="complaints">
+ <el-select v-model="item.handlingStatus">
+ <el-option v-for="item in handlingStatus" :key="item.value" :label="item.label" :value="item.value" />
+ </el-select>
+ </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-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