From ebddc02611b0373c1d5bfa342bd781fb5eb82009 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期二, 01 八月 2023 14:23:31 +0800 Subject: [PATCH] 侧边栏样式机销售明细单增加销售机会选择弹窗 --- src/views/client/followupRecords/AddFollowupRecordsDialog.vue | 310 ++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 252 insertions(+), 58 deletions(-) diff --git a/src/views/client/followupRecords/AddFollowupRecordsDialog.vue b/src/views/client/followupRecords/AddFollowupRecordsDialog.vue index 3828cfd..007f860 100644 --- a/src/views/client/followupRecords/AddFollowupRecordsDialog.vue +++ b/src/views/client/followupRecords/AddFollowupRecordsDialog.vue @@ -23,9 +23,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 +64,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 +109,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 +239,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 +270,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 +283,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 +314,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 +369,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 +394,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 +413,6 @@ } else { getUpdateFollowRecord(params) .then((res) => { - console.log(res) this.editConfig.visible = false if (res.code === 200) { this.$message({ @@ -307,9 +436,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 +447,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 +459,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() {}, @@ -365,28 +567,20 @@ .basic-info-view { margin-top: 10px; padding-right: 40px; - .custom-name { - display: flex; - .common-select-btn { - margin-left: 5px; - font-size: 16px; - } - } + .custom-name, .common-select { display: flex; - .common-select-sel { - width: 270px; - } .common-select-btn { margin-left: 5px; - font-size: 16px; + font-size: 18px; cursor: pointer; } } - } - .address-view { - margin-top: 10px; - padding-right: 40px; + .common-select { + .common-select-sel { + width: 270px; + } + } } .annex-view { display: flex; -- Gitblit v1.8.0