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/sales/salesOpportunity/AddSalesOpportunityDialog.vue | 244 ++++++++++++++++++++++++++++++++++++------------ 1 files changed, 182 insertions(+), 62 deletions(-) diff --git a/src/views/sales/salesOpportunity/AddSalesOpportunityDialog.vue b/src/views/sales/salesOpportunity/AddSalesOpportunityDialog.vue index 91d50da..61fd54a 100644 --- a/src/views/sales/salesOpportunity/AddSalesOpportunityDialog.vue +++ b/src/views/sales/salesOpportunity/AddSalesOpportunityDialog.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" @@ -22,11 +24,24 @@ <div class="basic-info-view"> <el-row> <el-col :span="12"> - <el-form-item label="瀹㈡埛鍚嶇О" prop="client_id"> + <el-form-item label="瀹㈡埛鍚嶇О" prop="client_name"> <div class="custom-name"> - <el-input v-model="editConfig.infomation.client_id"></el-input> - <div class="common-select-btn"><i class="el-icon-circle-plus-outline" title="閫夋嫨"></i></div> - <div class="common-select-btn"><i class="el-icon-edit" title="缂栬緫"></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> @@ -45,8 +60,25 @@ </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="鑱旂郴浜哄鍚�" prop="contact_id"> - <el-input v-model="editConfig.infomation.contact_id"></el-input> + <el-form-item label="鑱旂郴浜哄鍚�" prop="contact_name"> + <div class="custom-name"> + <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> <el-col :span="12"> @@ -113,7 +145,7 @@ size="mini" style="width: 63%" > - <el-option v-for="item in memberOptions" :key="item.id" :label="item.name" :value="item.id"> + <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id"> </el-option> </el-select> </el-form-item> @@ -465,8 +497,20 @@ <div slot="footer" class="dialog-footer"> <el-button type="primary" size="small" @click="saveClick('form')">淇濆瓨</el-button> - <el-button size="small" @click="editConfig.visible = false">鍙栨秷</el-button> + <el-button size="small" @click="handleClose">鍙栨秷</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" + /> </el-dialog> </div> </template> @@ -474,6 +518,8 @@ <script> import { getAllData } from "@/api/client/client" import { getAddSaleChance, getUpdateSaleChance } from "@/api/sales/salesOpportunity" +import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog" +import SelectContactDialog from "@/views/other/commonDialog/SelectContactDialog" export default { name: "AddSalesOpportunityDialog", props: { @@ -488,10 +534,16 @@ } } }, - components: {}, + components: { SelectClientDialog, SelectContactDialog }, computed: { searchCommonHeight() { return this.$refs.searchCommonView.offsetHeight + }, + clientList() { + return this.$store.state.getClientName.clientList + }, + contactNamelist() { + return this.$store.state.getClientName.contactNamelist } }, data() { @@ -513,20 +565,30 @@ saleStageOptions: [], // 閿�鍞樁娈� oldCustomerMarketOptions: [], // 鑰佸鎴疯惀閿� possibleOptions: [], // 鍙兘鎬� - currencyOptions: [ - { - id: 1, - name: "浜烘皯甯�" - } - ], // 甯佺 + currencyOptions: [], // 甯佺 currentStateOptions: [], // 褰撳墠鐘舵�� countryOptions: [], // 鍥藉 provinceOptions: [], // 鐪佷唤 cityOptions: [], // 鍩庡競 - regionOptions: [] // 鍖哄煙 + regionOptions: [], // 鍖哄煙 + editSelectClientConfig: { + editVisible: false, + title: "", + infomation: {} + }, + editSelectContactConfig: { + editVisible: false, + title: "", + infomation: {} + }, + restaurants: [], + clientId: this.editCommonConfig.infomation.client_id, + contactId: this.editCommonConfig.infomation.contact_id } }, created() { + this.$store.dispatch("geClient") + this.$store.dispatch("geContact") this.getCommonData() }, methods: { @@ -543,6 +605,9 @@ this.provinceOptions = res.data.province this.cityOptions = res.data.city this.regionOptions = res.data.region + this.possibleOptions = res.data.possibility + this.currencyOptions = res.data.currency + this.currentStateOptions = res.data.status }) .catch((err) => { console.log(err) @@ -550,6 +615,10 @@ }, handleClose() { this.editConfig.visible = false + console.log(this.editConfig.infomation.client_name) + if (this.editConfig.title === "鏂板缓" && this.editConfig.infomation.client_name) { + this.$parent.handleClose() + } }, // 淇濆瓨 saveClick(formName) { @@ -568,7 +637,11 @@ message: "娣诲姞鎴愬姛", type: "success" }) - this.$parent.getData() + if (this.editConfig.title === "鏂板缓" && this.editConfig.infomation.client_name) { + this.$parent.handleClose() + } else { + this.$parent.getData() + } } }) .catch((err) => { @@ -605,9 +678,9 @@ budget: data.budget || 0, capital_budget: data.capital_budget || "", city_id: data.city_id || 0, - client_id: data.client_id || 0, + client_id: parseInt(this.clientId), competitors: data.competitors || "", - contact_id: data.contact_id || 0, + contact_id: parseInt(this.contactId), country_id: data.country_id || 0, currency: data.currency || 0, disadvantages: data.disadvantages || "", @@ -638,6 +711,55 @@ } return params }, + // 閫夋嫨鐢ㄦ埛鐩稿叧鏂规硶 + querySearchAsync(queryString, cb, value) { + var restaurants = [] + if (value === "client") { + restaurants = this.clientList + } else if (value === "contact") { + restaurants = this.contactNamelist + } + 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 + } + }, + selClientClick(value) { + if (value === "client") { + this.editSelectClientConfig.editVisible = true + } else if (value === "contact") { + this.editSelectContactConfig.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 + } + }, + // 娓呴櫎宸查�夋嫨鐢ㄦ埛 + 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 + } + }, // 娣诲姞闄勪欢 addAnnexClick() {}, // 璁剧疆鍏佽涓婁紶鏂囦欢鏍煎紡 @@ -648,58 +770,56 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.add-sales-opportunity { - .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: 18px; +::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; } } } - .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