From 76350343afce04acc849c4a51171641469fb36db Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期一, 23 十月 2023 17:59:39 +0800 Subject: [PATCH] 客户管理,跟进记录,线索,发票,合同管理,总单,报价单,退款单,明细单,机会,退货单,子单,客户服务单,服务合同,服务回访单 --- src/views/sales/salesOpportunity/index.vue | 416 ++++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 298 insertions(+), 118 deletions(-) diff --git a/src/views/sales/salesOpportunity/index.vue b/src/views/sales/salesOpportunity/index.vue index eba3e09..ef65de7 100644 --- a/src/views/sales/salesOpportunity/index.vue +++ b/src/views/sales/salesOpportunity/index.vue @@ -1,45 +1,98 @@ <template> <div class="sales-opportunity"> - <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" /> + <div v-if="isDetail" class="detail-top"> + <DetailListCommonBtn :query-class-options="queryClassOptions" /> </div> - <TableCommonView ref="tableListRef" :table-list="tableList"> - <template slot="tableButton"> - <el-table-column label="鎿嶄綔" width="100"> - <template slot-scope="scope"> - <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button> - <el-button type="text" size="small">璺熻繘</el-button> + + <div class="filter" v-else> + <div class="filter-card"> + <CommonSearch + :show-add="false" + :show-download="false" + :amount-view="false" + placeholder="璇疯緭鍏ユ満浼氬悕绉�" + @searchClick="onFilterSearch" + > + <template slot="leftButton"> + <el-button size="small" type="primary" @click="addBtnClick">鏂板缓</el-button> +<!-- <el-button size="small" @click="delClick">鍒犻櫎</el-button>--> </template> - </el-table-column> - </template> - </TableCommonView> + </CommonSearch> + </div> + </div> + + <div class="body"> + <div class="body-card"> + <div class="list-view"> + <TableCommonView + ref="tableListRef" + :table-list="tableList" + :select-box="false" + @selClientClick="selClientClick" + @selContactsClick="selContactsClick" + @selCommonClick="selCommonClick" + @getSelectArray="getSelectArray" + @selTableCol="selTableCol" + > + <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="120"> + <template slot-scope="scope"> + <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button> + <el-button @click="followupClick(scope.row)" type="text" size="small">璺熻繘</el-button> + <el-button @click="deleteItem(scope.row.id)" type="text" size="small">鍒犻櫎</el-button> + </template> + </el-table-column> + </template> + </TableCommonView> + </div> + <div class="btn-pager"> + <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> + </div> + </div> + </div> <!-- 鏂板缓/缂栬緫 --> <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" /> + <!-- 鏂板缓/缂栬緫璺熻繘璁板綍 --> + <AddFollowupRecordsDialog v-if="editFollowupConfig.visible" :edit-contacts-config="editFollowupConfig" /> </div> </template> <script> import AddSalesOpportunityDialog from "@/views/sales/salesOpportunity/AddSalesOpportunityDialog" -import { getSaleChanceList } from "@/api/sales/salesOpportunity" +import { getSaleChanceList, getDelSaleChance } from "@/api/sales/salesOpportunity" +import pageMixin from "@/components/makepager/pager/mixin/pageMixin" +import DetailOpportunity from "@/views/sales/salesOpportunity/DetailOpportunity" +import AddFollowupRecordsDialog from "@/views/client/followupRecords/AddFollowupRecordsDialog" export default { name: "SalesOpportunity", - props: {}, - components: { - AddSalesOpportunityDialog - }, - computed: { - searchCommonHeight() { - return this.$refs.searchCommonView.offsetHeight + props: { + isDetail: { + type: Boolean, + default: false + }, + addConfig: { + type: Object, + default: () => { + return {} + } } }, + mixins: [pageMixin], + components: { + AddSalesOpportunityDialog, + DetailOpportunity, + DetailContacts: () => import("@/views/client/contacts/DetailContacts"), + DetailClientManage: () => import("@/views/client/client/DetailClientManage"), + AddFollowupRecordsDialog + }, + computed: {}, data() { return { tableList: {}, @@ -73,50 +126,105 @@ visible: false, title: "鏂板缓", infomation: {} - } + }, + opportunityDeail: { + visible: false, + infomation: {} + }, + contactsDeail: { + visible: false, + infomation: {} + }, + clientDeail: { + visible: false, + infomation: {} + }, + search_map: {}, + selValueList: [], + editFollowupConfig: { + visible: false, + title: "鏂板缓", + infomation: {} + }, + tableColumn: [ + { label: "鏈轰細鍚嶇О", prop: "name", min: 120, isCommonClick: true ,default:true}, // 鏈轰細鍚嶇О + { label: "瀹㈡埛鍚嶇О", prop: "client_name", min: 90, isClientClick: true }, // 瀹㈡埛鍚嶇О + { label: "閿�鍞満浼氱紪鍙�", prop: "number" }, // 閿�鍞満浼氱紪鍙� + { label: "鑱旂郴浜哄鍚�", prop: "contact_name", min: 100, isContactClick: true }, // 鑱旂郴浜哄鍚� + { label: "閿�鍞樁娈�", prop: "sale_stage_name" }, // 閿�鍞樁娈� + { label: "鍙兘鎬�(%)", prop: "possibility_name" }, // 鍙兘鎬� + { label: "棰勮鎴愪氦鏃ユ湡", prop: "expected_time", min: 130 }, // 棰勮鎴愪氦鏃ユ湡 + { label: "棰勮鍚堝悓閲戦", prop: "projected_amount" }, // 棰勮鍚堝悓閲戦 + { label: "棰勭畻缁濆鍊�", prop: "budget" }, // 棰勭畻缁濆鍊� + { label: "閿�鍞礋璐d汉", prop: "member_name" } // 閿�鍞礋璐d汉 + ], + showCol:["鏈轰細鍚嶇О", "瀹㈡埛鍚嶇О", "閿�鍞満浼氱紪鍙�", "鑱旂郴浜哄鍚�", "閿�鍞樁娈�", "鍙兘鎬�(%)", "棰勮鎴愪氦鏃ユ湡", "棰勮鍚堝悓閲戦", "棰勭畻缁濆鍊�", "閿�鍞礋璐d汉"] } }, created() { this.setTable() - this.getData() + if (!this.isDetail) { + this.search_map = {} + } else { + this.search_map = { + [this.addConfig.id_name]: this.addConfig.client_name + } + } + this.getData(this.search_map) }, methods: { setTable() { this.tableList = { + selectIndex:true, tableInfomation: [], - tableColumn: [ - { label: "鏈轰細鍚嶇О", prop: "opportunityName", min: 120 }, // 鏈轰細鍚嶇О - { label: "瀹㈡埛鍚嶇О", prop: "customName", min: 90 }, // 瀹㈡埛鍚嶇О - { label: "閿�鍞満浼氱紪鍙�", prop: "salesOpportunityNo" }, // 閿�鍞満浼氱紪鍙� - { label: "鑱旂郴浜哄鍚�", prop: "contactName", min: 100 }, // 鑱旂郴浜哄鍚� - { label: "閿�鍞樁娈�", prop: "saleStage" }, // 閿�鍞樁娈� - { label: "鍙兘鎬�(%)", prop: "possible" }, // 鍙兘鎬� - { label: "棰勮鎴愪氦鏃ユ湡", prop: "expectDealDate" }, // 棰勮鎴愪氦鏃ユ湡 - { label: "棰勮鍚堝悓閲戦", prop: "expectContractAmount" }, // 棰勮鍚堝悓閲戦 - { label: "棰勭畻缁濆鍊�", prop: "budgetAbsoluteValue" }, // 棰勭畻缁濆鍊� - { label: "閿�鍞礋璐d汉", prop: "salesHead" } // 閿�鍞礋璐d汉 - ] + allcol: [], + showcol: this.showCol, + tableColumn:this.setColumnVisible(this.showCol) } + this.tableList.allcol = this.tableList.tableColumn.filter(ele=>!ele.default).map(ele=>ele.label); this.searchOptions = [] for (let i = 0; i < this.tableList.tableColumn.length; i++) { const label = this.tableList.tableColumn[i].label - this.searchOptions.push({ value: (i + 1).toString(), label: label }) + const value = this.tableList.tableColumn[i].prop + this.searchOptions.push({ value: value, label: label }) } + }, + setColumnVisible(showCol){ + return this.tableColumn.map(ele=>{ + return { + ...ele, + isShowColumn:showCol.includes(ele.label) + } + }) + }, + selTableCol(val) { + this.showcol = val; + this.tableList.tableColumn = this.setColumnVisible(val); }, // 璇锋眰鏁版嵁 async getData() { this.loading = true - await getSaleChanceList() + await getSaleChanceList({ + search_map: this.search_map, + 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 + ...item, + client_name: item.client.name, + contact_name: item.contact.name, + sale_stage_name: item.sale_stage.name, + member_name: item.member.username, + possibility_name: item.possibility.name } }) this.tableList.tableInfomation = list || [] + this.pagerOptions.totalCount = res.data.count } else { this.tableList.tableInfomation = [] } @@ -131,88 +239,125 @@ this.loading = false }) }, + // 鎼滅储 + onFilterSearch(searchText){ + this.search_map.name = searchText ?? '' + this.pagerOptions.currPage = 1 + this.getData() + }, // 鏂板缓 addBtnClick() { this.editConfig.visible = true this.editConfig.title = "鏂板缓" - this.editConfig.infomation = { - customName: "", - salesOpportunityNo: "POT521", - opportunityName: "", - contactName: "", - businessSource: "", - businessType: "", - saleStage: "", - salesHead: "", - oldCustomerMarket: "", - competitor: "", - possible: "", - currency: "", - budgetAbsoluteValue: "", - expectDealDate: "", - expectContractAmount: "", - currentState: "", - demandPainPoint: "", - projectApproval: "", - fundBudget: "", - decisionMaker: "", - decisionFactors: "", - decisionFlow: "", - programme: "", - advantage: "", - disadvantage: "", - opportunity: "", - threaten: "", - position: "", - map: "", - country: "1", - province: "1", - city: "1", - region: "1", - notes: "" - } + this.editConfig.infomation = { city_id: 0, ...this.addConfig } }, // 缂栬緫 handleClick(row) { console.log(row) this.editConfig.visible = true this.editConfig.title = "缂栬緫" - this.editConfig.infomation = { - customName: "", - salesOpportunityNo: "POT521", - opportunityName: "", - contactName: "", - businessSource: "", - businessType: "", - saleStage: "", - salesHead: "", - oldCustomerMarket: "", - competitor: "", - possible: "", - currency: "", - budgetAbsoluteValue: "", - expectDealDate: "", - expectContractAmount: "", - currentState: "", - demandPainPoint: "", - projectApproval: "", - fundBudget: "", - decisionMaker: "", - decisionFactors: "", - decisionFlow: "", - programme: "", - advantage: "", - disadvantage: "", - opportunity: "", - threaten: "", - position: "", - map: "", - country: "1", - province: "1", - city: "1", - region: "1", - notes: "" + this.editConfig.infomation = { ...row } + }, + // 鎵归噺鍒犻櫎 + delClick() { + if (this.selValueList && this.selValueList.length > 0) { + this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + console.log("dddd") + getDelSaleChance({ ids: this.selValueList }).then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) + }) + .catch(() => {}) + } else { + this.$message.warning("璇疯嚦灏戦�夋嫨涓�鏉¤褰�") } + }, + /** + * 鍗曚釜鍒犻櫎 + * @param id 閿�鍞満浼歩d + */ + deleteItem(id) { + this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + getDelSaleChance({ids: [id]}).then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) + }) + .catch((err) => { + if (err!== 'cancel'){ + console.error(err) + this.$message.warning("鍒犻櫎澶辫触") + } + }) + }, + getSelectArray(val) { + console.log(val) + this.selValueList = [] + const list = val.map((item) => { + return item.id + }) + this.selValueList = list + }, + // 瀹㈡埛鍚嶇О璇︽儏 + selClientClick(row) { + console.log(row) + this.clientDeail.visible = true + this.clientDeail.infomation = { + ...row.client, + client_name: row.client.name, + client_level: row.client.client_level.name, + client_status: row.client.client_status.name + } + }, + // 鑱旂郴浜鸿鎯� + selContactsClick(row) { + console.log(row) + this.contactsDeail.visible = true + this.contactsDeail.infomation = { + ...row.contact, + sale_chance_name: row.name, + sale_chance_id: row.id, + Client: { name: row.client.name, client_status_id: row.client.client_status_id }, + client_name: row.name + } + }, + // 鏈轰細鍚嶇О璇︽儏 + selCommonClick(row) { + console.log(row) + this.opportunityDeail.visible = true + this.opportunityDeail.infomation = { ...row } + }, + // 璺熻繘 + followupClick(row) { + console.log(row) + this.editFollowupConfig.title = "鏂板缓" + this.editFollowupConfig.infomation = { + ...row, + number: "", + sale_chance_name: row.name, + sale_chance_id: row.id + } + this.editFollowupConfig.infomation.codeStandID='' + this.editFollowupConfig.visible = true } } } @@ -220,11 +365,46 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.sales-opportunity { - .btn-pager { +.sales-opportunity{ + height: 100%; + overflow: hidden; + .filter{ + height: 80px; display: flex; - .page { - margin-left: auto; + align-items: center; + padding: 12px 20px 0 20px; + &-card{ + height: 80px; + display: flex; + align-items: center; + box-sizing: border-box; + padding: 10px 20px; + flex: 1; + border-radius: 12px; + background-color: #fff; + } + } + .body{ + box-sizing: border-box; + padding: 10px 20px; + border-radius: 12px; + height: calc(100% - 92px); + .body-card { + background-color: #fff; + border-radius: 12px; + height: 100%; + overflow: hidden; + } + .list-view { + height: calc(100% - 60px); + overflow: hidden; + } + .btn-pager { + display: flex; + margin-top: 10px; + .page { + margin-left: auto; + } } } } -- Gitblit v1.8.0