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/index.vue | 275 ++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 183 insertions(+), 92 deletions(-) diff --git a/src/views/sales/salesOpportunity/index.vue b/src/views/sales/salesOpportunity/index.vue index 794f88f..b9071f5 100644 --- a/src/views/sales/salesOpportunity/index.vue +++ b/src/views/sales/salesOpportunity/index.vue @@ -1,47 +1,73 @@ <template> <div class="sales-opportunity"> - <SearchCommonView ref="searchCommonView" :query-class-options="queryClassOptions" :search-options="searchOptions" /> - <div class="btn-pager"> - <PublicFunctionBtnView - :duplicate-check="true" - :list-button="true" - :map-button="true" - :statistics="true" - :operates-list="operatesList" - /> - <PagerView class="page" /> + <div v-if="isDetail" class="detail-top"> + <DetailListCommonBtn :query-class-options="queryClassOptions" /> + <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> </div> - <TableCommonView ref="tableListRef" :table-list="tableList"> + <div v-else class="top"> + <SearchCommonView + ref="searchCommonView" + :query-class-options="queryClassOptions" + :search-options="searchOptions" + /> + <div class="btn-pager"> + <PublicFunctionBtnView + :duplicate-check="true" + :statistics="true" + :custom-funnel="true" + :operates-list="operatesList" + /> + <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> + </div> + </div> + <TableCommonView + ref="tableListRef" + :table-list="tableList" + @selClientClick="selClientClick" + @selContactsClick="selContactsClick" + @selCommonClick="selCommonClick" + > <template slot="tableButton"> - <el-table-column label="鎿嶄綔" width="100"> + <el-table-column label="鎿嶄綔" width="120"> <template slot-scope="scope"> <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button> <el-button type="text" size="small">璺熻繘</el-button> + <el-button @click="delClick(scope.row.id)" type="text" size="small">鍒犻櫎</el-button> </template> </el-table-column> </template> </TableCommonView> <!-- 鏂板缓/缂栬緫 --> - <AddSalesLeadDialog v-if="editSalesLeadConfig.visible" :edit-sales-lead-config="editSalesLeadConfig" /> + <AddSalesOpportunityDialog v-if="editConfig.visible" :edit-common-config="editConfig" /> + <!-- 鏈轰細璇︽儏 --> + <DetailOpportunity v-if="opportunityDeail.visible" :opportunity-detail="opportunityDeail" /> + <!-- 瀹㈡埛璇︽儏 --> + <DetailClientManage v-if="clientDeail.visible" :client-manage-detail="clientDeail" /> + <!-- 鑱旂郴浜鸿鎯� --> + <DetailContacts v-if="contactsDeail.visible" :contacts-detail="contactsDeail" /> </div> </template> <script> -import SearchCommonView from "@/components/makepager/SearchCommonView" -import PublicFunctionBtnView from "@/components/makepager/PublicFunctionBtnView" -import PagerView from "@/components/makepager/PagerView" -import TableCommonView from "@/components/makepager/TableCommonView" -import AddSalesLeadDialog from "@/views/custom/salesLead/AddSalesLeadDialog" +import AddSalesOpportunityDialog from "@/views/sales/salesOpportunity/AddSalesOpportunityDialog" +import { getSaleChanceList, getDelSaleChance } from "@/api/sales/salesOpportunity" +import pageMixin from "@/components/makepager/pager/mixin/pageMixin" +import DetailOpportunity from "@/views/sales/salesOpportunity/DetailOpportunity" export default { name: "SalesOpportunity", - props: {}, + props: { + isDetail: { + type: Boolean, + default: false + } + }, + mixins: [pageMixin], components: { - SearchCommonView, - PublicFunctionBtnView, - PagerView, - TableCommonView, - AddSalesLeadDialog + AddSalesOpportunityDialog, + DetailOpportunity, + DetailContacts: () => import("@/views/client/contacts/DetailContacts"), + DetailClientManage: () => import("@/views/client/client/DetailClientManage") }, computed: { searchCommonHeight() { @@ -51,7 +77,21 @@ data() { return { tableList: {}, - queryClassOptions: [{ value: "1", label: "鍏ㄩ儴" }], + queryClassOptions: [ + { value: "1", label: "鍏ㄩ儴" }, + { value: "2", label: "鍒濇湡娌熼��" }, + { value: "3", label: "鍟嗗姟璋堝垽" }, + { value: "4", label: "鎴愬姛缁撴" }, + { value: "5", label: "澶辫触缁撴" }, + { value: "6", label: "鏈懆鍒涘缓" }, + { value: "7", label: "鏈湀鍒涘缓" }, + { value: "8", label: "鏈懆棰勮鎴愪氦" }, + { value: "9", label: "鏈湀棰勮鎴愪氦" }, + { value: "10", label: "鍦ㄨ皥鍟嗘満" }, + { value: "11", label: "椤圭洰鏆傚仠" }, + { value: "12", label: "15澶╂湭鑱旂郴鍟嗘満" }, + { value: "13", label: "棰勮閲戦1W浠ヤ笂" } + ], searchOptions: [], operatesList: [ { id: "1", name: "鍏变韩" }, @@ -61,48 +101,46 @@ { id: "5", name: "鏇存敼鍒涘缓浜�" }, { id: "6", name: "鏍戠粨鏋勮缃�" }, { id: "7", name: "瀹℃壒璁剧疆" }, - { id: "8", name: "鎭㈠京" } + { id: "8", name: "鎭㈠棰勮鍒楀" } ], - editSalesLeadConfig: { + editConfig: { visible: false, title: "鏂板缓", + infomation: {} + }, + opportunityDeail: { + visible: false, + infomation: {} + }, + contactsDeail: { + visible: false, + infomation: {} + }, + clientDeail: { + visible: false, infomation: {} } } }, created() { this.setTable() + this.getData() }, methods: { setTable() { this.tableList = { - tableInfomation: [ - { - customName: "123123", - customType: "鏅�氬鎴�", - salesHead: "绯荤粺绠$悊鍛�", - modifyTime: "2023-0703 11:22:12", - customerSize: "499浠ヤ笂", - importantLevel: "A绫诲鎴�", - customNumber: "AC651", - customStatus: "娼滃湪瀹㈡埛", - productName: "鑷姩鎵撳嵃鏈�", - startDate: "2023-06-27", - endDate: "2024-07-15" - } - ], + tableInfomation: [], tableColumn: [ - { label: "瀹㈡埛鍚嶇О", prop: "customName", min: 120 }, // 瀹㈡埛鍚嶇О - { label: "瀹㈡埛绫诲瀷", prop: "customType", min: 90 }, // 瀹㈡埛绫诲瀷 - { label: "閿�鍞礋璐d汉", prop: "salesHead" }, // 閿�鍞礋璐d汉 - { label: "淇敼鏃堕棿", prop: "modifyTime", min: 100 }, // 淇敼鏃堕棿 - { label: "瀹㈡埛瑙勬ā", prop: "customerSize" }, // 瀹㈡埛瑙勬ā - { label: "閲嶈绾у埆", prop: "importantLevel" }, // 閲嶈绾у埆 - { label: "瀹㈡埛缂栧彿", prop: "customNumber" }, // 瀹㈡埛缂栧彿 - { label: "瀹㈡埛鐘舵��", prop: "customStatus" }, // 瀹㈡埛鐘舵�� - { label: "浜у搧鍚嶇О", prop: "productName" }, // 浜у搧鍚嶇О - { label: "鏈嶅姟寮�濮嬫棩鏈�", prop: "startDate" }, // 鏈嶅姟寮�濮嬫棩鏈� - { label: "鏈嶅姟鍒版湡鏃�", prop: "endDate" } // 鏈嶅姟鍒版湡鏃� + { label: "鏈轰細鍚嶇О", prop: "name", min: 120, isCommonClick: true }, // 鏈轰細鍚嶇О + { label: "瀹㈡埛鍚嶇О", prop: "client_name", min: 90, isClientClick: true }, // 瀹㈡埛鍚嶇О + { label: "閿�鍞満浼氱紪鍙�", prop: "number" }, // 閿�鍞満浼氱紪鍙� + { label: "鑱旂郴浜哄鍚�", prop: "contact_name", min: 100, isContactClick: true }, // 鑱旂郴浜哄鍚� + { label: "閿�鍞樁娈�", prop: "sale_stage_id" }, // 閿�鍞樁娈� + { label: "鍙兘鎬�(%)", prop: "possibilities_id" }, // 鍙兘鎬� + { label: "棰勮鎴愪氦鏃ユ湡", prop: "expected_time", isTime: true, min: 130 }, // 棰勮鎴愪氦鏃ユ湡 + { label: "棰勮鍚堝悓閲戦", prop: "projected_amount" }, // 棰勮鍚堝悓閲戦 + { label: "棰勭畻缁濆鍊�", prop: "capital_budget" }, // 棰勭畻缁濆鍊� + { label: "閿�鍞礋璐d汉", prop: "member_id" } // 閿�鍞礋璐d汉 ] } this.searchOptions = [] @@ -111,50 +149,94 @@ this.searchOptions.push({ value: (i + 1).toString(), label: label }) } }, + // 璇锋眰鏁版嵁 + async getData() { + this.loading = true + await getSaleChanceList({ + keyword: "", + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + }) + .then((res) => { + console.log(res) + if (res.code === 200) { + if (res.data.list && res.data.list.length > 0) { + const list = res.data.list.map((item) => { + return { + ...item, + client_name: item.client.name, + contact_name: item.contact.name + } + }) + this.tableList.tableInfomation = list || [] + this.pagerOptions.totalCount = res.data.count + } else { + this.tableList.tableInfomation = [] + } + } else { + this.tableList.tableInfomation = [] + } + this.loading = false + }) + .catch((err) => { + console.log(err) + this.tableList.tableInfomation = [] + this.loading = false + }) + }, // 鏂板缓 addBtnClick() { - this.editSalesLeadConfig.visible = true - this.editSalesLeadConfig.title = "鏂板缓" - this.editSalesLeadConfig.infomation = { - customName: "", - saleLeadNumber: "LEA50", - contactName: "", - contactDuties: "", - phoneNumber: "", - businessStatus: "鏂板缓", - businessSource: "1", - owner: "", - position: "", - map: "", - country: "1", - province: "1", - city: "1", - region: "1", - address: "" - } + this.editConfig.visible = true + this.editConfig.title = "鏂板缓" + this.editConfig.infomation = {} }, // 缂栬緫 handleClick(row) { console.log(row) - this.editSalesLeadConfig.visible = true - this.editSalesLeadConfig.title = "缂栬緫" - this.editSalesLeadConfig.infomation = { - customName: row.customName, - saleLeadNumber: row.saleLeadNumber, - contactName: row.contactName, - contactDuties: row.contactDuties, - phoneNumber: row.phoneNumber, - businessStatus: "鏂板缓", - businessSource: row.businessSource, - owner: row.owner, - position: "", - map: "", - country: "1", - province: "1", - city: "1", - region: "1", - address: "" - } + this.editConfig.visible = true + this.editConfig.title = "缂栬緫" + this.editConfig.infomation = { ...row } + }, + // 鍒犻櫎 + delClick(id) { + this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(function () { + return getDelSaleChance({ id: id }) + }) + .then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) + .catch(function () {}) + }, + getSelectArray(val) { + console.log(val) + }, + // 瀹㈡埛鍚嶇О璇︽儏 + selClientClick(row) { + console.log(row) + this.clientDeail.visible = true + this.clientDeail.infomation = { ...row, client_name: row.name } + }, + // 鑱旂郴浜鸿鎯� + selContactsClick(row) { + console.log(row) + this.contactsDeail.visible = true + this.contactsDeail.infomation = { ...row } + }, + // 鏈轰細鍚嶇О璇︽儏 + selCommonClick(row) { + console.log(row) + this.opportunityDeail.visible = true + this.opportunityDeail.infomation = { ...row } } } } @@ -163,7 +245,16 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> .sales-opportunity { - .btn-pager { + .top { + margin-bottom: 20px; + .btn-pager { + display: flex; + .page { + margin-left: auto; + } + } + } + .detail-top { display: flex; .page { margin-left: auto; -- Gitblit v1.8.0