From acdff03246ce648082192dfb069c3a006a7fbee6 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期三, 09 八月 2023 18:46:06 +0800 Subject: [PATCH] 客户管理模块 批量删除、推进、跟进接口联调 --- src/views/client/followupRecords/AddFollowupRecordsDialog.vue | 378 +++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 288 insertions(+), 90 deletions(-) diff --git a/src/views/client/followupRecords/AddFollowupRecordsDialog.vue b/src/views/client/followupRecords/AddFollowupRecordsDialog.vue index 3828cfd..457eb0b 100644 --- a/src/views/client/followupRecords/AddFollowupRecordsDialog.vue +++ b/src/views/client/followupRecords/AddFollowupRecordsDialog.vue @@ -5,6 +5,8 @@ :visible.sync="editConfig.visible" :width="dialogWidth" :before-close="handleClose" + append-to-body + custom-class="iframe-dialog" > <el-form ref="form" @@ -23,9 +25,22 @@ <el-col :span="12"> <el-form-item label="瀹㈡埛鍚嶇О" prop="client_name"> <div class="custom-name"> - <el-input v-model="editConfig.infomation.client_name"></el-input> - <div class="common-select-btn"><i class="el-icon-circle-plus-outline"></i></div> - <div class="common-select-btn"><i class="el-icon-edit-outline"></i></div> + <el-autocomplete + v-model="editConfig.infomation.client_name" + :fetch-suggestions=" + (queryString, callback) => { + querySearchAsync(queryString, callback, 'client') + } + " + value-key="name" + @select="handleSelectClient('client', $event)" + ></el-autocomplete> + <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> </div> </el-form-item> </el-col> @@ -51,11 +66,24 @@ </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="鑱旂郴浜哄鍚�" prop="contact_id"> + <el-form-item label="鑱旂郴浜哄鍚�" prop="contact_name"> <div class="custom-name"> - <el-input v-model="editConfig.infomation.contact_id"></el-input> - <div class="common-select-btn"><i class="el-icon-circle-plus-outline"></i></div> - <div class="common-select-btn"><i class="el-icon-edit-outline"></i></div> + <el-autocomplete + v-model="editConfig.infomation.contact_name" + :fetch-suggestions=" + (queryString, callback) => { + querySearchAsync(queryString, callback, 'contact') + } + " + value-key="name" + @select="handleSelectClient('contact', $event)" + ></el-autocomplete> + <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> </div> </el-form-item> </el-col> @@ -83,24 +111,56 @@ </el-col> <el-col :span="12"> <el-form-item label="鑱旂郴鏂瑰紡" prop="phoneNumber"> - <el-input v-model="editConfig.infomation.phoneNumber"></el-input> + <el-input + v-model="editConfig.infomation.phoneNumber" + maxlength="11" + show-word-limit + oninput="value=value.replace(/[^\d]/g,'')" + ></el-input> </el-form-item> </el-col> <el-col v-if="isUnflod" :span="12"> - <el-form-item label="閿�鍞満浼�" prop="sale_chance_id"> + <el-form-item label="閿�鍞満浼�" prop="sale_chance_name"> <div class="custom-name"> - <el-input v-model="editConfig.infomation.sale_chance_id"></el-input> - <div class="common-select-btn"><i class="el-icon-circle-plus-outline"></i></div> - <div class="common-select-btn"><i class="el-icon-edit-outline"></i></div> + <el-autocomplete + v-model="editConfig.infomation.sale_chance_name" + :fetch-suggestions=" + (queryString, callback) => { + querySearchAsync(queryString, callback, 'chance') + } + " + value-key="name" + @select="handleSelectClient('chance', $event)" + ></el-autocomplete> + <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> </div> </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="閿�鍞嚎绱�" prop="sales_leads_id"> + <el-form-item label="閿�鍞嚎绱�" prop="sales_leads_name"> <div class="custom-name"> - <el-input v-model="editConfig.infomation.sales_leads_id"></el-input> - <div class="common-select-btn"><i class="el-icon-circle-plus-outline"></i></div> - <div class="common-select-btn"><i class="el-icon-edit-outline"></i></div> + <!-- <el-input v-model="editConfig.infomation.sales_leads_id"></el-input> --> + <el-autocomplete + v-model="editConfig.infomation.sales_leads_name" + :fetch-suggestions=" + (queryString, callback) => { + querySearchAsync(queryString, callback, 'lead') + } + " + value-key="name" + @select="handleSelectClient('lead', $event)" + ></el-autocomplete> + <div class="common-select-btn" @click="selClientClick('lead')"> + <i class="el-icon-circle-plus-outline"></i> + </div> + <div class="common-select-btn" @click="clearupClient('lead')"> + <i class="el-icon-edit-outline"></i> + </div> </div> </el-form-item> </el-col> @@ -181,6 +241,30 @@ <el-button type="primary" size="small" @click="saveClick('form')">淇� 瀛�</el-button> <el-button size="small" @click="editConfig.visible = false">鍙� 娑�</el-button> </div> + <!-- 閫夋嫨瀹㈡埛 --> + <SelectClientDialog + v-if="editSelectClientConfig.editVisible" + :edit-common-config="editSelectClientConfig" + @selClient="selClient" + /> + <!-- 閫夋嫨鑱旂郴浜� --> + <SelectContactDialog + v-if="editSelectContactConfig.editVisible" + :edit-common-config="editSelectContactConfig" + @selClient="selClient" + /> + <!-- 閫夋嫨閿�鍞満浼� --> + <SelectChanceDialog + v-if="editSelectChanceConfig.editVisible" + :edit-common-config="editSelectChanceConfig" + @selClient="selClient" + /> + <!-- 閫夋嫨閿�鍞嚎绱� --> + <SelectLeadDialog + v-if="editSelectLeadConfig.editVisible" + :edit-common-config="editSelectLeadConfig" + @selClient="selClient" + /> </el-dialog> </div> </template> @@ -188,6 +272,10 @@ <script> import { getAllData } from "@/api/client/client" import { getAddFollowRecord, getUpdateFollowRecord } from "@/api/client/followupRecords" +import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog" +import SelectContactDialog from "@/views/other/commonDialog/SelectContactDialog" +import SelectChanceDialog from "@/views/other/commonDialog/SelectChanceDialog" +import SelectLeadDialog from "@/views/other/commonDialog/SelectLeadDialog" export default { name: "AddFollowupRecordsDialog", props: { @@ -197,30 +285,27 @@ return { visible: false, title: "鏂板缓", - infomation: { - client_name: "", - number: "", - client_status_id: "", - contact_id: "", - member_id: "", - topic: "", - record: "", - phoneNumber: "", - sale_chance_id: "", - sales_leads_id: "", - follow_time: "", - next_follow_time: "", - purpose: "", - content: "" - } + infomation: {} } } } }, - components: {}, + components: { SelectClientDialog, SelectContactDialog, SelectChanceDialog, SelectLeadDialog }, computed: { searchCommonHeight() { return this.$refs.searchCommonView.offsetHeight + }, + clientList() { + return this.$store.state.getClientName.clientList + }, + contactNamelist() { + return this.$store.state.getClientName.contactNamelist + }, + saleChancelist() { + return this.$store.state.getClientName.saleChancelist + }, + saleLeadlist() { + return this.$store.state.getClientName.saleLeadlist } }, data() { @@ -231,15 +316,52 @@ number: [{ required: true, message: "璇疯緭鍏ヨ窡杩涜褰曠紪鍙�", trigger: "blur" }], member_id: [{ required: true, message: "璇烽�夋嫨璐熻矗浜�", trigger: "change" }], record: [{ required: true, message: "璇疯緭鍏ヨ窡杩涜褰�", trigger: "blur" }], - content: [{ required: true, message: "璇疯緭鍏ュ唴瀹�", trigger: "blur" }] + content: [{ required: true, message: "璇疯緭鍏ュ唴瀹�", trigger: "blur" }], + phoneNumber: [ + { required: false, message: "", trigger: "blur" }, + { len: 11, message: "闀垮害鍦�11涓瓧绗�", trigger: "blur" }, + { + pattern: /^1(3\d|4[5-9]|5[0-35-9]|6[2567]|7[0-8]|8\d|9[0-35-9])\d{8}$/, + message: "璇疯緭鍏ユ纭殑鎵嬫満鍙�", + trigger: "blur" + } + ] }, clientStatusOptions: [], // 瀹㈡埛鐘舵�� memberOptions: [], unflodCollapseStr: "鏀惰捣", - isUnflod: true + isUnflod: true, + editSelectClientConfig: { + editVisible: false, + title: "", + infomation: {} + }, + editSelectContactConfig: { + editVisible: false, + title: "", + infomation: {} + }, + editSelectChanceConfig: { + editVisible: false, + title: "", + infomation: {} + }, + editSelectLeadConfig: { + editVisible: false, + title: "", + infomation: {} + }, + clientId: this.editContactsConfig.infomation.client_id, + contactId: this.editContactsConfig.infomation.contact_id, + saleChanceId: this.editContactsConfig.infomation.sale_chance_id, + saleLeadId: this.editContactsConfig.infomation.sales_leads_id } }, created() { + this.$store.dispatch("geClient") + this.$store.dispatch("geContact") + this.$store.dispatch("geChance") + this.$store.dispatch("geLead") this.getCommonData() }, methods: { @@ -249,10 +371,23 @@ console.log(res) this.clientStatusOptions = res.data.client_status this.memberOptions = res.data.member + this.dataProcess() }) .catch((err) => { console.log(err) }) + }, + dataProcess() { + this.saleChancelist.map((item) => { + if (this.saleChanceId === item.id) { + this.editConfig.infomation.sale_chance_name = item.name + } + }) + this.saleLeadlist.map((item) => { + if (this.saleLeadId === item.id) { + this.editConfig.infomation.sales_leads_name = item.name + } + }) }, handleClose() { this.editConfig.visible = false @@ -261,13 +396,10 @@ saveClick(formName) { this.$refs[formName].validate((valid) => { if (valid) { - console.log(this.editConfig.infomation) const params = this.saveParams() - console.log(params) if (this.editConfig.title === "鏂板缓") { getAddFollowRecord(params) .then((res) => { - console.log(res) this.editConfig.visible = false if (res.code === 200) { this.$message({ @@ -283,7 +415,6 @@ } else { getUpdateFollowRecord(params) .then((res) => { - console.log(res) this.editConfig.visible = false if (res.code === 200) { this.$message({ @@ -307,9 +438,9 @@ let data = this.editConfig.infomation let follow_record = { follow_record: { - client_id: data.client_id || 0, + client_id: parseInt(this.clientId), client_status_id: data.client_status_id || 0, - contact_id: 0, // data.contact_id || + contact_id: parseInt(this.contactId), contact_information_id: data.contact_information_id || 0, content: data.content || "", follow_time: data.follow_time || "", @@ -318,8 +449,8 @@ number: data.number || "", purpose: data.purpose || "", record: data.record || "", - sale_chance_id: 0, //data.sale_chance_id || - sales_leads_id: 0, // data.sales_leads_id || + sale_chance_id: parseInt(this.saleChanceId), //data.sale_chance_id || + sales_leads_id: parseInt(this.saleLeadId), // data.sales_leads_id || topic: data.topic || "" } } @@ -330,6 +461,79 @@ params = { ...follow_record, id: data.id || 0 } } return params + }, + // 閫夋嫨瀹㈡埛鐩稿叧鏂规硶 + querySearchAsync(queryString, cb, value) { + var restaurants = [] + if (value === "client") { + restaurants = this.clientList + } else if (value === "contact") { + restaurants = this.contactNamelist + } else if (value === "chance") { + restaurants = this.saleChancelist + } else { + restaurants = this.saleLeadlist + } + var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants + cb(results) + }, + createStateFilter(queryString) { + return (state) => { + return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 + } + }, + handleSelectClient(value, item) { + if (value === "client") { + this.clientId = item.id + } else if (value === "contact") { + this.contactId = item.id + } else if (value === "chance") { + this.saleChanceId = item.id + } else { + this.saleLeadId = item.id + } + }, + selClientClick(value) { + if (value === "client") { + this.editSelectClientConfig.editVisible = true + } else if (value === "contact") { + this.editSelectContactConfig.editVisible = true + } else if (value === "chance") { + this.editSelectChanceConfig.editVisible = true + } else { + this.editSelectLeadConfig.editVisible = true + } + }, + selClient(row, value) { + if (value === "contact") { + this.editConfig.infomation.contact_name = row.name + this.contactId = row.id + } else if (value === "client") { + this.editConfig.infomation.client_name = row.name + this.clientId = row.id + } else if (value === "chance") { + this.editConfig.infomation.sale_chance_name = row.name + this.saleChanceId = row.id + } else { + this.editConfig.infomation.sales_leads_name = row.name + this.saleLeadId = row.id + } + }, + // 娓呴櫎宸查�夋嫨鐢ㄦ埛 + clearupClient(value) { + if (value === "client") { + this.editConfig.infomation.client_name = "" + this.clientId = 0 + } else if (value === "contact") { + this.editConfig.infomation.contact_name = "" + this.contactId = 0 + } else if (value === "chance") { + this.editConfig.infomation.sale_chance_name = "" + this.saleChanceId = 0 + } else { + this.editConfig.infomation.sales_leads_name = "" + this.saleLeadId = 0 + } }, // 娣诲姞闄勪欢 addAnnexClick() {}, @@ -351,62 +555,56 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.add-followup-records { - .basic-info { - .basic-info-title { - background-color: #f4f8fe; - padding-left: 10px; - font-size: 15px; - font-weight: bold; - color: #666; - height: 42px; - line-height: 42px; - } - .basic-info-view { - margin-top: 10px; - padding-right: 40px; - .custom-name { - display: flex; - .common-select-btn { - margin-left: 5px; - font-size: 16px; +::v-deep { + .iframe-dialog .el-dialog__body { + .basic-info { + .basic-info-title { + background-color: #f4f8fe; + padding-left: 10px; + font-size: 15px; + font-weight: bold; + color: #666; + height: 42px; + line-height: 42px; + } + .basic-info-view { + margin-top: 10px; + padding-right: 40px; + .custom-name, + .common-select { + display: flex; + .common-select-btn { + margin-left: 5px; + font-size: 18px; + cursor: pointer; + } + } + .common-select { + .common-select-sel { + width: 270px; + } } } - .common-select { + .annex-view { display: flex; - .common-select-sel { - width: 270px; - } - .common-select-btn { - margin-left: 5px; - font-size: 16px; - cursor: pointer; + color: #6166d3; + .setFormat { + margin-left: 10px; } } } - .address-view { - margin-top: 10px; - padding-right: 40px; - } - .annex-view { + .unflod-collapse { display: flex; + height: 30px; + justify-content: center; + align-items: center; color: #6166d3; - .setFormat { - margin-left: 10px; - } } - } - .unflod-collapse { - display: flex; - height: 30px; - justify-content: center; - align-items: center; - color: #6166d3; - } - .dialog-footer { - background-color: #f5f5f5; - height: 55px; - line-height: 55px; + .dialog-footer { + background-color: #f5f5f5; + height: 55px; + line-height: 55px; + } } } </style> -- Gitblit v1.8.0