From 2fb4239e828bcfa9711ce4cecc4b942767621d62 Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期一, 06 十一月 2023 17:20:20 +0800 Subject: [PATCH] Merge branch 'dev' of ssh://192.168.5.5:29418/web/crm-web into dev --- src/views/sales/salesDetails/index.vue | 580 +++++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 471 insertions(+), 109 deletions(-) diff --git a/src/views/sales/salesDetails/index.vue b/src/views/sales/salesDetails/index.vue index b318dad..ba89cdc 100644 --- a/src/views/sales/salesDetails/index.vue +++ b/src/views/sales/salesDetails/index.vue @@ -1,43 +1,119 @@ <template> <div class="sales-details"> <div v-if="isDetail" class="detail-top"> - <DetailListCommonBtn :query-class-options="queryClassOptions" /> - <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> + <DetailListCommonBtn /> </div> - <div v-else class="top"> - <SearchCommonView - ref="searchCommonView" - :query-class-options="queryClassOptions" - :search-options="searchOptions" - /> - <div class="btn-pager"> - <PublicFunctionBtnView :submit-approval="true" :operates-list="operatesList" /> - <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> + + <div v-else class="filter"> + <div class="filter-card"> + <CommonSearch + :show-add="false" + :show-download="false" + :amount-view="false" + :show-action-btn="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> + </CommonSearch> </div> </div> - <TableCommonView - ref="tableListRef" - :show-summary="showSummary" - :table-list="tableList" - :select-box="!isDetail" - @selClientClick="selClientClick" - @selCommonClick="selCommonClick" - > - <template slot="tableButton"> - <el-table-column label="鎿嶄綔" width="90"> - <template slot-scope="scope"> - <el-button @click="handleClick(scope.row)" 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> + + <div class="body"> + <!-- <div class="body-card"> --> + <div class="content-top"> + <div class="list-view"> + <TableCommonView + ref="tableListRef" + :show-summary="showSummary" + :table-list="tableList" + @selClientClick="selClientClick" + @selCommonClick="selCommonClick" + @getSelectArray="getSelectArray" + @selTableCol="selTableCol" + @tableRowClick="tableRowClick" + :selectClassRow="selectRow" + > + <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="180"> + <template slot-scope="scope"> + <el-button @click="handleClick(scope.row, '鏌ョ湅')" type="text" size="small">鏌ョ湅</el-button> + <template v-if="scope.row.status === 1"> + <el-button @click="handleClick(scope.row, '缂栬緫')" type="text" size="small">缂栬緫</el-button> + <el-button @click="submitClick(scope.row)" type="text" size="small">纭鎻愪氦</el-button> + <!-- <el-button @click="delClick(scope.row.id)" type="text" size="small">鍒犻櫎</el-button> --> + <el-button @click="closeClick(scope.row.id)" type="text" size="small">鍏抽棴</el-button> + </template> + </template> + </el-table-column> + </template> + </TableCommonView> + </div> + <div class="btn-pager"> + <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> + </div> + </div> + <div class="content-bottom"> + <div class="bottom-tabs" :class="!isDetail ? 'bgcGrey' : 'bgcWhite'"> + <div + class="tab-pane" + @click="getTab(0)" + :style="{ + background: isClickProduct ? '#2a78fb' : '#F1F3F8', + color: isClickProduct ? '#fff' : '#666' + }" + > + 浜у搧淇℃伅 + </div> + <div + class="tab-pane" + @click="getTab(1)" + :style="{ + background: isClickInventory ? '#2a78fb' : '#F1F3F8', + color: isClickInventory ? '#fff' : '#666' + }" + > + 搴撳瓨淇℃伅 + </div> + <div + class="tab-pane" + @click="getTab(2)" + :style="{ + background: isClickMake ? '#2a78fb' : '#F1F3F8', + color: isClickMake ? '#fff' : '#666' + }" + > + 鍒堕�犱俊鎭� + </div> + </div> + <div class="list-view"> + <TableCommonView :loading="loading" :table-list="productTableList" @selTableCol="selBottomTableCol"> + <!-- <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="160" fixed="right"> + <template slot-scope="scope"> + <el-button @click="viewClick(scope.row)" type="text" size="small">鏌ョ湅</el-button> + </template> + </el-table-column> + </template> --> + </TableCommonView> + </div> + </div> + </div> <!-- 鏂板缓/缂栬緫 --> - <AddSalesDetailsDialog v-if="editConfig.visible" :edit-common-config="editConfig" /> + <AddSalesDetailsDialog + v-if="editConfig.visible" + :edit-common-config="editConfig" + @addCollectionPlanClick="addCollectionPlanClick" + /> <!-- 閿�鍞槑缁嗚鎯� --> <DetailSpecification v-if="specificationDetail.visible" :specification-detail="specificationDetail" /> <!-- 瀹㈡埛璇︽儏 --> <DetailClientManage v-if="clientDeail.visible" :client-manage-detail="clientDeail" /> + <!-- 鏂板缓 鏀舵璁″垝 --> + <AddCollectionPlan v-if="addCollectionConfig.visible" :edit-common-config="addCollectionConfig" /> </div> </template> @@ -46,6 +122,7 @@ import { getSalesDetailsList, getDelSalesDetails } from "@/api/sales/salesDetails" import pageMixin from "@/components/makepager/pager/mixin/pageMixin" import DetailSpecification from "@/views/sales/salesDetails/DetailSpecification" +import AddCollectionPlan from "@/views/other/payment/collectionPlan/AddCollectionPlan" export default { name: "SalesDetails", @@ -53,13 +130,20 @@ isDetail: { type: Boolean, default: false + }, + addConfig: { + type: Object, + default: () => { + return {} + } } }, mixins: [pageMixin], components: { AddSalesDetailsDialog, DetailSpecification, - DetailClientManage: () => import("@/views/client/client/DetailClientManage") + DetailClientManage: () => import("@/views/client/client/DetailClientManage"), + AddCollectionPlan }, computed: { searchCommonHeight() { @@ -67,33 +151,48 @@ } }, data() { + // 浜у搧淇℃伅 + const productColumn = [ + { label: "浜у搧缂栧彿", prop: "number", default: true }, + { label: "浜у搧鍚嶇О", prop: "client_name" }, + { label: "鏁伴噺", prop: "signTime" }, + { label: "鍗曚綅", prop: "member_name" }, + { label: "鍙戣揣鍗�", prop: "outboundStatus" }, + { label: "鎵胯繍鍟�", prop: "receiveTotalAmount", price: true }, + { label: "杩愬崟鍙�", prop: "total", price: true }, + { label: "閿�鍞崟浠�", prop: "taxUnitPrice", isProductPrice: true }, + { label: "浠风◣鍚堣", prop: "priceTax", isProductTotal: true } + ] + // 搴撳瓨淇℃伅 + const inventoryColumn = [ + { label: "浜у搧缂栧彿", prop: "number", default: true }, + { label: "浜у搧鍚嶇О", prop: "client_name" }, + { label: "璁㈠崟鏁伴噺", prop: "signTime" }, + { label: "浠撳簱", prop: "member_name" }, + { label: "鍦ㄥ簱鏁伴噺", prop: "outboundStatus" }, + { label: "鍙敤搴撳瓨", prop: "receiveTotalAmount", price: true }, + { label: "鍗曚綅", prop: "total", price: true } + ] + // 鍒堕�犱俊鎭� + const makeColumn = [ + { label: "鐢熶骇璁㈠崟", prop: "number", default: true }, + { label: "浜у搧鍚嶇О", prop: "client_name" }, + { label: "璁㈠崟鐘舵��", prop: "signTime" }, + { label: "宸ュ崟缂栧彿", prop: "member_name" }, + { label: "宸ュ崟鐘舵��", prop: "outboundStatus" }, + { label: "璁″垝寮�濮嬫椂闂�", prop: "receiveTotalAmount", price: true }, + { label: "璁″垝缁撴潫鏃堕棿", prop: "total", price: true } + ] return { tableList: {}, - queryClassOptions: [ - { value: "1", label: "鍏ㄩ儴" }, - { value: "2", label: "宸插彂璐�" }, - { value: "3", label: "寰呴噰璐�" }, - { value: "4", label: "鏈湀浜や粯" }, - { value: "5", label: "宸蹭綔搴�" } - ], searchOptions: [], - operatesList: [ - { id: "1", name: "鍏变韩" }, - { id: "2", name: "鎵归噺缂栬緫" }, - { id: "3", name: "瀵煎嚭" }, - { id: "4", name: "涓嬭浇鍏ㄩ儴闄勪欢" }, - { id: "5", name: "鏇存敼鍒涘缓浜�" }, - { id: "6", name: "鏍戠粨鏋勮缃�" }, - { id: "7", name: "瀹℃壒璁剧疆" }, - { id: "8", name: "鎭㈠棰勮鍒楀" } - ], editConfig: { visible: false, title: "鏂板缓", infomation: {} }, showSummary: { - show: true, + show: false, sumProp: [ "receiveTotalAmount", "total", @@ -102,6 +201,7 @@ "uninvoicedAmount", "number", "unOutoundNo", + "taxUnitPrice", "priceTax" ], mergeNumber: 6 @@ -113,49 +213,144 @@ clientDeail: { visible: false, infomation: {} - } + }, + selValueList: [], + search_map: {}, + searchSel: { + value: "number", + label: "璁㈠崟缂栧彿" + }, + keyword: "", + keywordType: "", + addCollectionConfig: { + visible: false, + title: "鏂板缓", + infomation: {} + }, + tableColumn: [ + { label: "璁㈠崟缂栧彿", prop: "number", isCommonClick: true, default: true }, + { label: "閿�鍞礋璐d汉", prop: "member_name" }, + { label: "绛剧害鏃ユ湡", prop: "signTime" }, + { label: "浜や粯鏃ユ湡", prop: "deliveryDate" }, + { label: "璁㈠崟鏉ユ簮", prop: "source" }, + { label: "鍚堣", prop: "total", price: true }, + { label: "鐘舵��", prop: "status", isCallMethod: true, getCallMethod: this.getStatus } + ], + showCol: ["璁㈠崟缂栧彿", "閿�鍞礋璐d汉", "绛剧害鏃ユ湡", "浜や粯鏃ユ湡", "璁㈠崟鏉ユ簮", "鍚堣", "鐘舵��"], + tableBottomColumn: [], + showBottomCol: [], + isClickProduct: true, // 浜у搧淇℃伅 + isClickInventory: false, // 搴撳瓨淇℃伅 + isClickMake: false, // 鍒堕�犱俊鎭� + TabsIndex: "0", + productTableList: {}, + productColumn: productColumn, + showProductCol: ["浜у搧缂栧彿", "浜у搧鍚嶇О", "鏁伴噺", "鍗曚綅", "鍙戣揣鍗�", "鎵胯繍鍟�", "杩愬崟鍙�", "閿�鍞崟浠�", "浠风◣鍚堣"], + inventoryColumn: inventoryColumn, + showInventoryCol: ["浜у搧缂栧彿", "浜у搧鍚嶇О", "璁㈠崟鏁伴噺", "浠撳簱", "鍦ㄥ簱鏁伴噺", "鍙敤搴撳瓨", "鍗曚綅"], + makeColumn: makeColumn, + showMakeCol: ["鐢熶骇璁㈠崟", "浜у搧鍚嶇О", "璁㈠崟鐘舵��", "宸ュ崟缂栧彿", "宸ュ崟鐘舵��", "璁″垝寮�濮嬫椂闂�", "璁″垝缁撴潫鏃堕棿"], + selectRow: {} } }, created() { this.setTable() + if (!this.isDetail) { + this.keyword = "" + this.keywordType = "" + } else { + this.keyword = this.addConfig.keyword + this.keywordType = this.addConfig.keywordType + } this.getData() }, methods: { setTable() { + // top 鏄庣粏鍗曞垪琛� this.tableList = { + selectIndex: true, tableInfomation: [], - tableColumn: [ - { label: "璁㈠崟缂栧彿", prop: "number", isCommonClick: true }, - { label: "瀹㈡埛鍚嶇О", prop: "client_name", isClientClick: true }, - { label: "绛剧害鏃ユ湡", prop: "signTime", isTime: true, width: 150 }, - { label: "閿�鍞礋璐d汉", prop: "memberId" }, - { label: "鍑哄簱鐘舵��", prop: "outboundStatus" }, - { label: "宸叉敹鎬婚", prop: "receiveTotalAmount", price: true }, - { label: "鍚堣", prop: "total", price: true }, - { label: "搴旀敹浣欓", prop: "amountReceivable", price: true }, - { label: "宸插紑绁ㄩ噾棰�", prop: "invoicedAmount", price: true }, - { label: "鏈紑绁ㄩ噾棰�", prop: "uninvoicedAmount", price: true }, - { label: "浜у搧鍚嶇О", prop: "productName" }, - { label: "鏁伴噺", prop: "number1" }, - { label: "鍚◣鍗曚环", prop: "taxUnitPrice", price: true }, - { label: "鏈嚭搴撴暟閲�", prop: "unOutoundNo" }, - { label: "浠风◣鍚堣", prop: "priceTax", price: true } - ] + allcol: [], + showcol: this.showCol, + tableColumn: this.setColumnVisible(this.showCol, this.tableColumn) } + this.setTableList(this.tableList) + + // bottom 浜у搧淇℃伅/搴撳瓨淇℃伅/鍒堕�犱俊鎭垪琛� + this.tableBottomColumn = this.productColumn + this.showBottomCol = this.showProductCol + this.setBottomList() + }, + // bom 鍒楄〃 + setBottomList() { + this.productTableList = { + selectIndex: true, + tableInfomation: [], + allcol: [], + showcol: this.showBottomCol, + tableColumn: this.setColumnVisible(this.showBottomCol, this.tableBottomColumn) + } + this.setTableList(this.productTableList) + }, + setTableList(tableList) { + tableList.allcol = 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 }) + for (let i = 0; i < tableList.tableColumn.length; i++) { + const label = tableList.tableColumn[i].label + const value = tableList.tableColumn[i].prop + this.searchOptions.push({ value: value, label: label }) } + }, + setColumnVisible(showCol, tableColumn) { + return tableColumn.map((ele) => { + return { + ...ele, + isShowColumn: showCol.includes(ele.label) + } + }) + }, + // top 鏄庣粏鍗� + selTableCol(val) { + this.showcol = val + this.tableList.tableColumn = this.setColumnVisible(val, this.tableColumn) + }, + // bottom 浜у搧淇℃伅 + selBottomTableCol(val) { + this.showcol = val + this.productTableList.tableColumn = this.setColumnVisible(val, this.tableBottomColumn) }, // 璇锋眰鏁版嵁 async getData() { this.loading = true - await getSalesDetailsList({ - keyword: "", - page: this.pagerOptions.currPage, - pageSize: this.pagerOptions.pageSize - }) + let params = {} + console.log(this.addConfig) + if (this.addConfig.keywordType === "瀹㈡埛鍚嶇О") { + params = { + clientId: this.addConfig.client_id, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + } + } else if (this.addConfig.keywordType === "閿�鍞満浼�") { + params = { + saleChanceId: this.addConfig.sale_chance_id, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + } + } else if (this.addConfig.keywordType === "閿�鍞瓙鍗�") { + params = { + number: this.addConfig.subbill_name, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + } + } else { + params = { + keyword: this.keyword, + keywordType: this.keywordType, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + } + } + await getSalesDetailsList(params) .then((res) => { console.log(res) if (res.code === 200) { @@ -163,11 +358,19 @@ const list = res.data.list.map((item) => { return { ...item, - client_name: item.client.name + client_name: item.client.name, + member_name: item.Member.username, + source: "CRM鍚屾", + status: 2 } }) this.tableList.tableInfomation = list || [] this.pagerOptions.totalCount = res.data.count + if (res.data.count > 0) { + this.selectRow = this.tableList.tableInfomation.length > 0 ? this.tableList.tableInfomation[0] : {} + // let row = this.tableList.tableInfomation[0]; + // this.getPointinspectionRecord(row.id); + } } else { this.tableList.tableInfomation = [] } @@ -182,53 +385,141 @@ this.loading = false }) }, + // 鎼滅储 + onFilterSearch(searchText) { + this.keyword = searchText ?? "" + this.keywordType = "璁㈠崟缂栧彿" + this.pagerOptions.currPage = 1 + this.getData() + }, // 鏂板缓 addBtnClick() { this.editConfig.visible = true this.editConfig.title = "鏂板缓" - this.editConfig.infomation = {} + console.log(this.addConfig) + this.editConfig.infomation = { + ...this.addConfig, + currency: "浜烘皯甯�", + sale_chance_name: "", + subbill_name: "", + client_name: this.addConfig?.client_name ?? "", + quotation_number: "" + } }, - // 缂栬緫 - handleClick(row) { - console.log(row) + // 鏌ョ湅 缂栬緫 + handleClick(row, title) { + console.log(row, title) this.editConfig.visible = true - this.editConfig.title = "缂栬緫" - this.editConfig.infomation = { ...row, sale_chance_name: "" } + this.editConfig.title = title + this.editConfig.infomation = { + ...row, + currency: "浜烘皯甯�", + sale_chance_name: row.saleChance.name, + deliverType: row.deliverType === 0 ? "" : row.deliverType, + quotation_number: row.quotation.number + } + }, + // 纭鎻愪氦 + submitClick(row) { + console.log(row, "纭鎻愪氦") + }, + // 鍏抽棴 + closeClick(row) { + console.log(row, "鍏抽棴") }, // 鍒犻櫎 - delClick(id) { + delClick(rowID) { + console.log(rowID, "xxxxshanchu") + // if (this.selValueList && this.selValueList.length > 0) { this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", { confirmButtonText: "纭畾", cancelButtonText: "鍙栨秷", type: "warning" }) - .then(function () { - return getDelSalesDetails({ id: id }) + .then(() => { + getDelSalesDetails({ ids: [rowID] }).then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) }) - .then((response) => { - if (response.code === 200) { - this.$message.success("鍒犻櫎鎴愬姛") - this.getData() - } else { - this.$message.warning("鍒犻櫎澶辫触") - } - }) - .catch(function () {}) + .catch(() => {}) + // } else { + // 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_name: row.name } + this.clientDeail.infomation = { + ...row.client, + member: row.Member, + client_name: row.client.name, + client_level: row.client.client_level.name, + client_status: row.client.client_status.name + } }, // 鑱旂郴浜鸿鎯� selCommonClick(row) { - console.log(row) - this.specificationDetail.visible = true this.specificationDetail.infomation = { ...row } + this.specificationDetail.visible = true + }, + addCollectionPlanClick(row) { + this.addCollectionConfig.visible = true + this.addCollectionConfig.title = "鏂板缓" + this.addCollectionConfig.sourceType = 1 + this.addCollectionConfig.infomation = { ...row } + }, + //鑾峰彇褰撳墠閫変腑璧勬簮鐨刬d + getTab(tab) { + this.TabsIndex = tab + if (this.TabsIndex == 0) { + this.isClickProduct = true + this.isClickInventory = false + this.isClickMake = false + // 浜у搧淇℃伅鍒楄〃 + this.tableBottomColumn = this.productColumn + this.showBottomCol = this.showProductCol + this.setBottomList() + } else if (this.TabsIndex == 1) { + this.isClickProduct = false + this.isClickInventory = true + this.isClickMake = false + // 搴撳瓨淇℃伅鍒楄〃 + this.tableBottomColumn = this.inventoryColumn + this.showBottomCol = this.showInventoryCol + this.setBottomList() + } else if (this.TabsIndex == 2) { + this.isClickProduct = false + this.isClickInventory = false + this.isClickMake = true + // 鍒堕�犱俊鎭垪琛� + this.tableBottomColumn = this.makeColumn + this.showBottomCol = this.showMakeCol + this.setBottomList() + } + }, + // 鐘舵�� + getStatus(val) { + return val === 1 ? "寰呯‘璁�" : val === 2 ? "寰呭嚭搴�" : val === 3 ? "鍑哄簱瀹屾垚" : val === 4 ? "宸插叧闂�" : "--" + }, + // top 琛岀偣鍑� + tableRowClick(row, column, event) { + console.log(row, column, event) + this.selectRow = row + // this.getPointinspectionRecord(row.id); } } } @@ -236,27 +527,98 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> +::v-deep { + .el-table .el-table__cell { + padding: 0; + } + .el-table__footer-wrapper tbody td.el-table__cell { + height: 48px; + } +} + .sales-details { - .top { - margin-bottom: 20px; + height: 100%; + overflow: hidden; + .filter { + height: 80px; + display: flex; + 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% - 70px); + .content-top { + background-color: #fff; + border-radius: 12px; + min-height: 70px; + height: 48%; + position: relative; + .list-view { + height: calc(100% - 60px); + } + } + .content-bottom { + .bottom-tabs { + height: 40px; + line-height: 40px; + background: #e6ecf2; + display: flex; + .tab-pane { + width: 100px; + margin-right: 20px; + font-size: 14px !important; + text-align: center; + background: #2a78fb; + border-top-left-radius: 20px; + border-top-right-radius: 20px; + } + } + .lable-view { + background: #e6ecf2; + height: 40px; + line-height: 40px; + .name { + border-left: 4px solid #2a78fb; + padding-left: 10px; + } + } + background-color: #fff; + border-radius: 12px; + min-height: 70px; + height: calc(52% - 60px); + margin-top: 10px; + // padding: 10px 20px; + .list-view { + height: calc(100% - 10px); + } + } .btn-pager { display: flex; + margin-top: 10px; .page { margin-left: auto; } } } - .detail-top { - display: flex; - .page { - margin-left: auto; - } - } } -::v-deep { - .el-table .cell, - .el-table th.el-table__cell > .cell { - padding: 0 2px; - } + +.bgcGrey { + background: #e6ecf2; +} +.bgcWhite { + background: #fff !important; } </style> -- Gitblit v1.8.0