From fd34c3c56e2d40c312fcbbf7330d40ceafcd421e Mon Sep 17 00:00:00 2001 From: songshankun <songshankun@foxmail.com> Date: 星期四, 28 九月 2023 09:34:46 +0800 Subject: [PATCH] feat: 表格组件添加列显隐控制组件;销售线索页表格适配列显隐 --- src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue | 292 +++++++++++++++++++++++++++++++++------------------------ 1 files changed, 168 insertions(+), 124 deletions(-) diff --git a/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue b/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue index 6483d54..60a616d 100644 --- a/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue +++ b/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue @@ -39,8 +39,12 @@ <div class="common-select-btn" @click="selClientClick('client')"> <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> - <div class="common-select-btn" @click="clearupClient('client')"> - <i class="el-icon-edit-outline" title="娓呴櫎"></i> + <div + v-if="editConfig.infomation.client_name && editConfig.infomation.client_name.length > 0" + class="common-select-btn" + @click="clearupClient('client')" + > + <i class="el-icon-remove-outline" title="娓呴櫎"></i> </div> </div> </el-form-item> @@ -54,7 +58,7 @@ <el-form-item label="鏈嶅姟鍚堝悓"> <div class="custom-name"> <el-autocomplete - v-model="editConfig.infomation.service_number" + v-model="editConfig.infomation.serviceContract_Number" :fetch-suggestions=" (queryString, callback) => { querySearchAsync(queryString, callback, 'serviceContract') @@ -66,8 +70,15 @@ <div class="common-select-btn" @click="selClientClick('serviceContract')"> <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> - <div class="common-select-btn" @click="clearupClient('serviceContract')"> - <i class="el-icon-edit-outline" title="娓呴櫎"></i> + <div + v-if=" + editConfig.infomation.serviceContract_Number && + editConfig.infomation.serviceContract_Number.length > 0 + " + class="common-select-btn" + @click="clearupClient('serviceContract')" + > + <i class="el-icon-remove-outline" title="娓呴櫎"></i> </div> </div> </el-form-item> @@ -85,7 +96,7 @@ <el-option v-for="item in faultTypeOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -110,13 +121,17 @@ <div class="common-select-btn" @click="selClientClick('contract')"> <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> - <div class="common-select-btn" @click="clearupClient('contract')"> - <i class="el-icon-edit-outline" title="娓呴櫎"></i> + <div + v-if="editConfig.infomation.number && editConfig.infomation.number.length > 0" + class="common-select-btn" + @click="clearupClient('contract')" + > + <i class="el-icon-remove-outline" title="娓呴櫎"></i> </div> </div> </el-form-item> </el-col> - <el-col :span="12"> + <!-- <el-col :span="12"> <el-form-item label="浜у搧绫诲埆" prop="productCategory"> <div class="common-select"> <el-select @@ -136,7 +151,7 @@ <div class="common-select-btn"><i class="el-icon-setting"></i></div> </div> </el-form-item> - </el-col> + </el-col> --> <el-col :span="12"> <el-form-item label="浜у搧鍚嶇О" prop="product_name"> <div class="custom-name"> @@ -147,14 +162,18 @@ querySearchAsync(queryString, callback, 'productName') } " - value-key="name" + value-key="Name" @select="handleSelectClient('productName', $event)" ></el-autocomplete> <div class="common-select-btn" @click="selClientClick('productName')"> <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> - <div class="common-select-btn" @click="clearupClient('productName')"> - <i class="el-icon-edit-outline" title="娓呴櫎"></i> + <div + v-if="editConfig.infomation.product_name && editConfig.infomation.product_name.length > 0" + class="common-select-btn" + @click="clearupClient('productName')" + > + <i class="el-icon-remove-outline" title="娓呴櫎"></i> </div> </div> </el-form-item> @@ -167,12 +186,11 @@ placeholder="璇烽�夋嫨" class="common-select-sel" size="mini" - @focus="getServiceTypeList" > <el-option v-for="item in serviceTypeOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -197,7 +215,7 @@ </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="鑱旂郴浜哄鍚�" prop="client_name"> + <el-form-item label="鑱旂郴浜哄鍚�" prop="contact_name"> <div class="custom-name"> <el-autocomplete v-model="editConfig.infomation.contact_name" @@ -212,8 +230,12 @@ <div class="common-select-btn" @click="selClientClick('contact')"> <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> - <div class="common-select-btn" @click="clearupClient('contact')"> - <i class="el-icon-edit-outline" title="娓呴櫎"></i> + <div + v-if="editConfig.infomation.contact_name && editConfig.infomation.contact_name.length > 0" + class="common-select-btn" + @click="clearupClient('contact')" + > + <i class="el-icon-remove-outline" title="娓呴櫎"></i> </div> </div> </el-form-item> @@ -226,12 +248,11 @@ placeholder="璇烽�夋嫨" class="common-select-sel" size="mini" - @focus="getSeverityList" > <el-option v-for="item in severityOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -253,7 +274,6 @@ placeholder="璇烽�夋嫨" class="common-select-sel" size="mini" - @focus="getPriorityLevelList" > <el-option v-for="item in priorityLevelOptions" @@ -263,7 +283,7 @@ > </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -278,7 +298,7 @@ </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="閿�鍞満浼�" prop="client_name"> + <el-form-item label="閿�鍞満浼�" prop="sale_chance_name"> <div class="custom-name"> <el-autocomplete v-model="editConfig.infomation.sale_chance_name" @@ -293,8 +313,12 @@ <div class="common-select-btn" @click="selClientClick('chance')"> <i class="el-icon-circle-plus-outline"></i> </div> - <div class="common-select-btn" @click="clearupClient('chance')"> - <i class="el-icon-edit-outline"></i> + <div + v-if="editConfig.infomation.sale_chance_name && editConfig.infomation.sale_chance_name.length > 0" + class="common-select-btn" + @click="clearupClient('chance')" + > + <i class="el-icon-remove-outline"></i> </div> </div> </el-form-item> @@ -317,7 +341,7 @@ <el-option v-for="item in statusOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -329,24 +353,46 @@ <el-row> <el-col :span="12"> <el-form-item label="甯屾湜澶勭悊鏃堕棿" prop="expectTime"> - <el-date-picker v-model="editConfig.infomation.expectTime" type="datetime" placeholder="閫夋嫨鏃堕棿"> + <el-date-picker + v-model="editConfig.infomation.expectTime" + value-format="yyyy-MM-dd HH:mm:ss" + type="datetime" + placeholder="閫夋嫨鏃堕棿" + > </el-date-picker> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="瀹為檯澶勭悊鏃堕棿" prop="realTime"> - <el-date-picker v-model="editConfig.infomation.startTime" type="realTime" placeholder="閫夋嫨鏃堕棿"> + <el-date-picker + v-model="editConfig.infomation.realTime" + value-format="yyyy-MM-dd HH:mm:ss" + type="datetime" + placeholder="閫夋嫨鏃堕棿" + > </el-date-picker> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="浜ら�氳垂" prop="carFare"> - <el-input v-model="editConfig.infomation.carFare"></el-input> + <el-input-number + v-model="editConfig.infomation.carFare" + placeholder="璇疯緭鍏�" + :min="0" + :controls="false" + style="width: 100%; margin-right: 5px" + ></el-input-number> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="鏀惰垂閲戦" prop="chargeAmount"> - <el-input v-model="editConfig.infomation.chargeAmount"></el-input> + <el-input-number + v-model="editConfig.infomation.chargeAmount" + placeholder="璇疯緭鍏�" + :min="0" + :controls="false" + style="width: 100%; margin-right: 5px" + ></el-input-number> </el-form-item> </el-col> <el-col :span="12"> @@ -357,12 +403,11 @@ placeholder="璇烽�夋嫨" class="common-select-sel" size="mini" - @focus="getTimeSpentList" > <el-option v-for="item in timeSpentOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -390,7 +435,16 @@ <el-row> <el-col :span="12"> <el-form-item label="甯歌闂" prop="faqId"> - <el-input v-model="editConfig.infomation.faqId"></el-input> + <!-- <el-input v-model="editConfig.infomation.faqId"></el-input> --> + <el-select + v-model="editConfig.infomation.faqId" + placeholder="璇烽�夋嫨" + class="common-select-sel" + size="mini" + > + <el-option v-for="item in faqOptions" :key="item.id" :label="item.name" :value="item.id"> + </el-option> + </el-select> </el-form-item> </el-col> <el-col :span="24"> @@ -551,6 +605,7 @@ import SelectCommonDialog from "@/views/other/commonDialog/SelectCommonDialog" import SelectContactDialog from "@/views/other/commonDialog/SelectContactDialog" import SelectChanceDialog from "@/views/other/commonDialog/SelectChanceDialog" +import { getFaqList } from "@/api/common/other" import { getFaultTypeList, getServiceTypeList, @@ -591,6 +646,9 @@ }, saleChancelist() { return this.$store.state.getClientName.saleChancelist + }, + productList() { + return this.$store.state.getClientName.productList } }, data() { @@ -599,9 +657,9 @@ editConfig: this.editCommonConfig, rules: { serviceNumber: [{ required: true, message: "璇疯緭鍏ユ湇鍔″崟缂栧彿", trigger: "blur" }], - faultTypeId: [{ required: true, message: "璇烽�夋嫨鏁呴殰绫诲埆", trigger: "change" }], + // faultTypeId: [{ required: true, message: "璇烽�夋嫨鏁呴殰绫诲埆", trigger: "change" }], subject: [{ required: true, message: "璇疯緭鍏ヤ富棰�", trigger: "blur" }], - productCategory: [{ required: true, message: "璇烽�夋嫨浜у搧绫诲埆", trigger: "change" }], + // productCategory: [{ required: true, message: "璇烽�夋嫨浜у搧绫诲埆", trigger: "change" }], serviceManId: [{ required: true, message: "璇烽�夋嫨浜у搧绫诲埆", trigger: "change" }], serviceOrderStatusId: [{ required: true, message: "璇烽�夋嫨鏁呴殰绫诲埆", trigger: "change" }], problemDesc: [{ required: true, message: "璇疯緭鍏ラ棶棰樻弿杩�", trigger: "blur" }] @@ -618,6 +676,7 @@ priorityLevelOptions: [], // 浼樺厛绾у埆 statusOptions: Status.processStatus, // 澶勭悊鐘舵�� timeSpentOptions: [], // 鑺辫垂鏃堕棿 + faqOptions: [], // 甯歌闂 editSelectClientConfig: { editVisible: false, title: "", @@ -654,9 +713,9 @@ }, clientId: this.editCommonConfig.infomation.clientId, contactId: this.editCommonConfig.infomation.contactId, - serviceContractId: this.editCommonConfig.infomation.contractId, - contractId: this.editCommonConfig.infomation.orderId, - productNameId: this.editCommonConfig.infomation.productId, + serviceContractId: this.editCommonConfig.infomation.serviceContractId, + SalesDetailsId: this.editCommonConfig.infomation.SalesDetailsId, + productName: this.editCommonConfig.infomation.productName, saleChanceId: this.editCommonConfig.infomation.saleChanceId } }, @@ -664,6 +723,17 @@ this.$store.dispatch("geClient") this.getCommonData() this.setTable() + }, + mounted() { + this.$store.dispatch("geServiceContract") + this.$store.dispatch("geSalesDetails") + this.$store.dispatch("geContact") + this.$store.dispatch("geChance") + this.$store.dispatch("geProductList") + this.getFaultTypeList() + this.getSeverityList() + this.getPriorityLevelList() + this.getTimeSpentList() }, methods: { setTable() { @@ -687,6 +757,16 @@ this.reportSourceOptions = res.data.reportSource }) this.getServiceTypeList() + this.getFaqList() + }, + // 鑾峰彇甯歌闂鍒楄〃 + async getFaqList() { + await getFaqList().then((res) => { + console.log(res) + if (res.data.code === 200) { + this.faqOptions = res.data.data.data + } + }) }, // 淇濆瓨 saveClick(formName) { @@ -696,37 +776,23 @@ const params = this.saveParams() console.log(params) if (this.editConfig.title === "鏂板缓") { - getAddServiceOrder(params) - .then((res) => { - console.log(res) - this.editConfig.visible = false - if (res.code === 200) { - this.$message({ - message: "娣诲姞鎴愬姛", - type: "success" - }) - this.$parent.getData() - } - }) - .catch((err) => { - console.log(err) - }) + getAddServiceOrder(params).then((res) => { + console.log(res) + this.editConfig.visible = false + if (res.code === 200) { + this.$message.success("娣诲姞鎴愬姛") + this.$parent.getData() + } + }) } else { - getUpdateServiceOrder(params) - .then((res) => { - console.log(res) - this.editConfig.visible = false - if (res.code === 200) { - this.$message({ - message: "缂栬緫鎴愬姛", - type: "success" - }) - this.$parent.getData() - } - }) - .catch((err) => { - console.log(err) - }) + getUpdateServiceOrder(params).then((res) => { + console.log(res) + this.editConfig.visible = false + if (res.code === 200) { + this.$message.success("缂栬緫鎴愬姛") + this.$parent.getData() + } + }) } } else { console.log("error submit") @@ -741,20 +807,21 @@ appointmentTime: data.appointmentTime || "", carFare: data.carFare || 0, chargeAmount: data.chargeAmount || 0, - clientId: this.clientId, - contactId: this.contactId, - contractId: this.serviceContractId, + clientId: this.clientId || 0, + contactId: this.contactId || 0, + serviceContractId: this.serviceContractId || 0, expectTime: data.expectTime || "", faqId: data.faqId || 0, faultTypeId: data.faultTypeId || 0, id: data.id || 0, - orderId: this.contractId, + SalesDetailsId: this.SalesDetailsId || 0, priorityLevelId: data.priorityLevelId || 0, problemDesc: data.problemDesc || "", - productId: this.productNameId, + productName: this.productName, + productTypeName: "", realTime: data.realTime || "", remark: data.remark || "", - saleChanceId: this.saleChanceId, + saleChanceId: this.saleChanceId || 0, serviceManId: data.serviceManId || 0, serviceNumber: data.serviceNumber || "", serviceTypeId: data.serviceTypeId || 0, @@ -772,10 +839,6 @@ }, // 閫夋嫨鐢ㄦ埛鐩稿叧鏂规硶 querySearchAsync(queryString, cb, value) { - this.$store.dispatch("geServiceContract") - this.$store.dispatch("geSalesDetails") - this.$store.dispatch("geContact") - this.$store.dispatch("geChance") var restaurants = [] if (value === "client") { restaurants = this.clientList @@ -784,7 +847,7 @@ } else if (value === "contract") { restaurants = this.salesDetailsList } else if (value === "productName") { - restaurants = this.productNameList + restaurants = this.productList } else if (value === "contact") { restaurants = this.contactNamelist } else if (value === "chance") { @@ -797,6 +860,8 @@ return (state) => { if (value === "serviceContract" || value === "contract") { return state.number.toLowerCase().indexOf(queryString.toLowerCase()) === 0 + } else if (value === "productName") { + return state.Name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 } else { return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 } @@ -808,9 +873,9 @@ } else if (value === "serviceContract") { this.serviceContractId = item.id } else if (value === "contract") { - this.contractId = item.id + this.SalesDetailsId = item.id } else if (value === "productName") { - this.productCategoryId = item.id + this.productName = item.Name } else if (value === "contact") { this.contactId = item.id } else if (value === "chance") { @@ -824,15 +889,12 @@ } else if (value === "serviceContract") { this.editSelCommonConfig.title = "鏈嶅姟鍚堝悓" this.editSelCommonConfig.editVisible = true - this.editSelCommonConfig.tableInfomation = [...this.serviceContractList] } else if (value === "contract") { this.editSelCommonConfig.title = "閿�鍞槑缁嗗崟" this.editSelCommonConfig.editVisible = true - this.editSelCommonConfig.tableInfomation = [...this.salesDetailsList] } else if (value === "productName") { this.editSelCommonConfig.title = "浜у搧鍚嶇О" this.editSelCommonConfig.editVisible = true - this.editSelCommonConfig.tableInfomation = [...this.productNameList] } else if (value === "contact") { this.editSelectContactConfig.editVisible = true } else if (value === "chance") { @@ -848,14 +910,14 @@ this.editConfig.infomation.client_name = row.name this.clientId = row.id } else if (value === "serviceContract") { - this.editConfig.infomation.service_number = row.number + this.editConfig.infomation.serviceContract_Number = row.number this.serviceContractId = row.id } else if (value === "contract") { this.editConfig.infomation.number = row.number - this.contractId = row.id + this.SalesDetailsId = row.id } else if (value === "productName") { - this.editConfig.infomation.product_name = row.name - this.productNameId = row.id + this.editConfig.infomation.product_name = row.Name + this.productName = row.Name } else if (value === "chance") { this.editConfig.infomation.sale_chance_name = row.name this.saleChanceId = row.id @@ -867,14 +929,14 @@ this.editConfig.infomation.client_name = "" this.clientId = 0 } else if (value === "serviceContract") { - this.editConfig.infomation.service_number = "" + this.editConfig.infomation.serviceContract_Number = "" this.serviceContractId = 0 } else if (value === "contract") { this.editConfig.infomation.number = "" - this.contractId = 0 + this.SalesDetailsId = 0 } else if (value === "productName") { this.editConfig.infomation.product_name = "" - this.productNameId = 0 + this.productName = "" } else if (value === "contact") { this.editConfig.infomation.contact_name = "" this.contactId = 0 @@ -899,53 +961,32 @@ // 鏁呴殰绫诲埆 async getFaultTypeList() { await getFaultTypeList().then((res) => { - console.log(res) this.faultTypeOptions = res.data.data }) }, // 鏈嶅姟鏂瑰紡 async getServiceTypeList() { - await getServiceTypeList() - .then((res) => { - console.log(res) - this.serviceTypeOptions = res.data.data - }) - .catch((err) => { - console.log(err) - }) + await getServiceTypeList().then((res) => { + this.serviceTypeOptions = res.data.data + }) }, // 涓ラ噸绋嬪害 async getSeverityList() { - await getSeverityList() - .then((res) => { - console.log(res) - this.severityOptions = res.data.data - }) - .catch((err) => { - console.log(err) - }) + await getSeverityList().then((res) => { + this.severityOptions = res.data.data + }) }, // 浼樺厛绾у埆 async getPriorityLevelList() { - await getPriorityLevelList() - .then((res) => { - console.log(res) - this.priorityLevelOptions = res.data.data - }) - .catch((err) => { - console.log(err) - }) + await getPriorityLevelList().then((res) => { + this.priorityLevelOptions = res.data.data + }) }, // 鑺辫垂鏃堕棿 async getTimeSpentList() { - await getTimeSpentList() - .then((res) => { - console.log(res) - this.timeSpentOptions = res.data.data - }) - .catch((err) => { - console.log(err) - }) + await getTimeSpentList().then((res) => { + this.timeSpentOptions = res.data.data + }) } } } @@ -1017,6 +1058,9 @@ height: 55px; line-height: 55px; } + .el-input__inner { + text-align: left; + } } } </style> -- Gitblit v1.8.0