From ecc5079c63e86dd6caba6753b51ed480022bf89b Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期一, 05 二月 2024 19:19:01 +0800 Subject: [PATCH] 添加api拦截 --- src/views/sales/quotation/index.vue | 234 ++++++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 209 insertions(+), 25 deletions(-) diff --git a/src/views/sales/quotation/index.vue b/src/views/sales/quotation/index.vue index c07c880..e0ed813 100644 --- a/src/views/sales/quotation/index.vue +++ b/src/views/sales/quotation/index.vue @@ -6,7 +6,14 @@ <div class="filter" v-else> <div class="filter-card"> - <CommonSearch :show-add="false" :amount-view="false" placeholder="璇疯緭鍏ユ姤浠峰崟鍙�" @searchClick="onFilterSearch"> + <CommonSearch + :show-add="false" + :amount-view="true" + :totalObject="totalObject" + :otherOptions="otherOptions" + placeholder="璇疯緭鍏ユ姤浠峰崟鍙�" + @searchClick="onFilterSearch" + > <template slot="leftButton"> <el-button size="small" type="primary" @click="addBtnClick">鏂板缓</el-button> <!-- <el-button size="small" @click="delClick">鍒犻櫎</el-button>--> @@ -16,7 +23,7 @@ </div> <div class="body"> - <div class="body-card"> + <div class="content-top"> <div class="list-view"> <TableCommonView ref="tableListRef" @@ -26,6 +33,8 @@ @selCommonClick="selCommonClick" @getSelectArray="getSelectArray" @selTableCol="selTableCol" + @tableRowClick="tableRowClick" + :selectClassRow="selectRow" > <template slot="tableButton"> <el-table-column label="鎿嶄綔" width="90"> @@ -42,6 +51,24 @@ <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> </div> </div> + <div class="content-bottom"> + <div class="bottom-tabs bgcGrey"> + <div + class="tab-pane" + @click="getTab(0)" + :style="{ + background: TabsIndex == 0 ? '#2a78fb' : '#F1F3F8', + color: TabsIndex == 0 ? '#fff' : '#666' + }" + > + 浜у搧淇℃伅 + </div> + </div> + <div class="list-view"> + <TableCommonView :loading="loading" :table-list="productTableList" @selTableCol="selBottomTableCol"> + </TableCommonView> + </div> + </div> </div> <!-- 鏂板缓/缂栬緫 --> <AddQuotationDialog v-if="editConfig.visible" :edit-common-config="editConfig" /> @@ -56,10 +83,9 @@ <script> import AddQuotationDialog from "@/views/sales/quotation/AddQuotationDialog" -import { getQuotationList, getDelQuotation } from "@/api/sales/quotation" +import { getQuotationList, getDelQuotation, getQuotationStatistics } from "@/api/sales/quotation" import pageMixin from "@/components/makepager/pager/mixin/pageMixin" import DetailQuotation from "@/views/sales/quotation/DetailQuotation" - export default { name: "QuotationView", props: { @@ -83,6 +109,18 @@ }, computed: {}, data() { + // 浜у搧淇℃伅 + const productColumn = [ + { label: "浜у搧缂栧彿", prop: "number", default: true }, + { label: "浜у搧鍚嶇О", prop: "name" }, + { label: "鏁伴噺", prop: "amount" }, + { label: "鍗曚綅", prop: "unit" }, + { label: "閿�鍞崟浠�", prop: "price" }, + { label: "鎴愭湰鍗曚环", prop: "cost" }, + { label: "姣涘埄", prop: "profit" }, + { label: "姣涘埄鐜�(%)", prop: "margin" }, + { label: "浠风◣鍚堣", prop: "total", price: true } + ] return { tableList: {}, queryClassOptions: [ @@ -132,12 +170,41 @@ { label: "閿�鍞礋璐d汉", prop: "member_name" }, // 閿�鍞礋璐d汉 { label: "鏈夋晥鏈�", prop: "validity_date", min: 100 }, // 淇敼鏃堕棿 // { label: "灏忚", prop: "subTotal" }, // 灏忚 - // { label: "鍚堣", prop: "total" }, // 鍚堣 - { label: "浜у搧鍚嶇О", prop: "productName", isProductName: true }, - { label: "鏁伴噺", prop: "productNumber", isProductAmount: true }, - { label: "浠风◣鍚堣", prop: "priceTax", isProductTotal: true } + { label: "鍚堣", prop: "amountTotal", price: true }, // 鍚堣 + { label: "瀹㈡埗鍚嶇О", prop: "client_name", min: 120 }, + { label: "鐘舵��", prop: "quotationStatus" } ], - showCol: ["鎶ヤ环鍗曞彿", "鎶ヤ环鍗曞悕绉�", "鑱旂郴浜哄鍚�", "閿�鍞礋璐d汉", "鏈夋晥鏈�", "浜у搧鍚嶇О", "鏁伴噺", "浠风◣鍚堣"] + showCol: ["鎶ヤ环鍗曞彿", "鎶ヤ环鍗曞悕绉�", "閿�鍞礋璐d汉", "鏈夋晥鏈�", "瀹㈡埗鍚嶇О", "鍚堣", "鐘舵��"], + selectRow: {}, + loading: false, + // 澧炲姞 浜у搧淇℃伅鍒楄〃 + TabsIndex: 0, + tableBottomColumn: [], + showBottomCol: [], + productTableList: {}, + productColumn: productColumn, + showProductCol: ["浜у搧缂栧彿", "浜у搧鍚嶇О", "鏁伴噺", "鍗曚綅", "閿�鍞崟浠�", "鎴愭湰鍗曚环", "姣涘埄", "姣涘埄鐜�(%)", "浠风◣鍚堣"], + totalObject: { + value: 0, + label: "鎬绘姤浠峰崟" + }, + otherOptions: [ + { + value: 0, + label: "宸插垱寤�", + status: "success" + }, + { + value: 0, + label: "宸插鎵�", + status: "success" + }, + { + value: 0, + label: "宸叉帴鍙�", + status: "success" + } + ] } }, created() { @@ -150,26 +217,97 @@ } } this.getData(this.search_map) + this.getQuotationStatistics() }, methods: { + // 鑾峰彇鎶ヤ环鍗曠粺璁� + async getQuotationStatistics() { + await getQuotationStatistics().then((res) => { + if (res.code === 200) { + console.log(res) + this.totalObject.value = res.data.total + this.otherOptions.map((item) => { + if (item.label === "宸插垱寤�") { + item.value = res.data.created + } else if (item.label === "宸插鎵�") { + item.value = res.data.approved + } else if (item.label === "宸叉帴鍙�") { + item.value = res.data.accepted + } + }) + } + }) + }, + //鑾峰彇褰撳墠閫変腑璧勬簮鐨刬d + getTab(tab) { + this.TabsIndex = tab + if (this.TabsIndex == 0) { + // 浜у搧淇℃伅鍒楄〃 + this.tableBottomColumn = this.productColumn + this.showBottomCol = this.showProductCol + this.setBottomList() + this.getProductInventoryInfo(this.selectRow) + } + }, + // 鑾峰彇浜у搧/搴撳瓨淇℃伅 + async getProductInventoryInfo(row) { + this.productTableList.tableInfomation = row.products || [] + }, + // top 琛岀偣鍑� + tableRowClick(row) { + this.selectRow = row + if (this.TabsIndex == 0) { + this.getProductInventoryInfo(this.selectRow) + } + }, setTable() { this.tableList = { selectIndex: true, tableInfomation: [], allcol: [], showcol: this.showCol, - tableColumn: this.setColumnVisible(this.showCol) + tableColumn: this.setColumnVisible(this.showCol, this.tableColumn) } - this.tableList.allcol = this.tableList.tableColumn.filter((ele) => !ele.default).map((ele) => ele.label) + // 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 + // const value = this.tableList.tableColumn[i].prop + // this.searchOptions.push({ value: value, label: label }) + // } + 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 - const value = this.tableList.tableColumn[i].prop + 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) { - return this.tableColumn.map((ele) => { + // bottom 浜у搧淇℃伅 + selBottomTableCol(val) { + this.showcol = val + this.productTableList.tableColumn = this.setColumnVisible(val, this.tableBottomColumn) + }, + setColumnVisible(showCol, tableColumn) { + return tableColumn.map((ele) => { return { ...ele, isShowColumn: showCol.includes(ele.label) @@ -197,11 +335,16 @@ ...item, client_name: item.client.name, contact_name: item.contact.name, - member_name: item.member.username + member_name: item.member.username, + quotationStatus: item.quotation_status.name } }) 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] : {} + this.getProductInventoryInfo(this.selectRow) + } } else { this.tableList.tableInfomation = [] } @@ -230,12 +373,11 @@ }, // 缂栬緫 handleClick(row) { - console.log(row) - this.editConfig.visible = true this.editConfig.title = "缂栬緫" - console.log("dddddddd") - console.log(row) - this.editConfig.infomation = { ...row, currency: "浜烘皯甯�" } + let params = JSON.parse(JSON.stringify(row)) + this.editConfig.infomation = { ...params, currency: "浜烘皯甯�", sale_chance_name: params.sale_chance.name } + console.log(this.editConfig.infomation.products, "===products") + this.editConfig.visible = true }, // 鎵归噺鍒犻櫎 delClick() { @@ -354,9 +496,51 @@ height: 100%; overflow: hidden; } - .list-view { - height: calc(100% - 60px); - overflow: hidden; + .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; + cursor: pointer; + 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; -- Gitblit v1.8.0