From 4eec87aecfa3c7aa9a1ef8d268aeecda037b98d0 Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期六, 23 三月 2024 15:32:42 +0800 Subject: [PATCH] 采购订单,修改top行点击 --- src/views/supplierManage/supplier/index.vue | 269 +++++++++++++++++++++++++++++++++++------------------ 1 files changed, 176 insertions(+), 93 deletions(-) diff --git a/src/views/supplierManage/supplier/index.vue b/src/views/supplierManage/supplier/index.vue index cbfb597..5a2ed24 100644 --- a/src/views/supplierManage/supplier/index.vue +++ b/src/views/supplierManage/supplier/index.vue @@ -4,14 +4,14 @@ <div class="filter"> <div class="filter-card"> <CommonSearch - :show-add="true" - add-title="鏂板缓" - @addCommonClick="addBtnClick" - :show-download="false" - :amount-view="false" - :show-action-btn="false" - :placeholder="'璇疯緭鍏ヤ緵搴斿晢鍚嶇О'" - @searchClick="onFilterSearch" + :show-add="true" + add-title="鏂板缓" + @addCommonClick="addBtnClick" + :show-download="true" + :amount-view="false" + :show-action-btn="false" + :placeholder="'璇疯緭鍏ヤ緵搴斿晢鍚嶇О'" + @searchClick="onFilterSearch" /> </div> </div> @@ -19,20 +19,22 @@ <div class="body-card"> <div class="list-view"> <TableCommonView - ref="tableSupplier" - :table-list="tableList" - @selCommonClick="selCommonClick" - @tableRowClick="tableRowClick" + ref="tableSupplier" + :table-list="tableList" + @selCommonClick="selCommonClick" + @selTableCol="selTableCol" + @tableRowClick="tableRowClick" + :selectClassRow="selectRow" > <template slot="tableButton"> <el-table-column label="鎿嶄綔" width="100"> <template slot-scope="scope"> <el-button - v-if="scope.row.status === 0" - @click="enableClick(scope.row, '鍚敤')" - type="text" - size="small" - >鍚敤</el-button + v-if="scope.row.status === 0" + @click="enableClick(scope.row, '鍚敤')" + type="text" + size="small" + >鍚敤</el-button > <el-button v-else @click="enableClick(scope.row, '鍋滅敤')" type="text" size="small">鍋滅敤</el-button> <el-button @click="modifyClick(scope.row)" type="text" size="small">淇敼</el-button> @@ -46,22 +48,22 @@ </div> </div> </div> - </div> <div class="bottom"> <div class="simple-filter"> <div class="simple-filter-card"> <CommonSearch - :show-add="false" - :show-download="false" - :amount-view="false" - :show-action-btn="false" - :placeholder="'璇疯緭鍏ヤ骇鍝佸悕绉�'" - @searchClick="onProductFilterSearch" + :show-add="false" + :show-download="false" + :amount-view="false" + :show-screen="false" + :show-action-btn="false" + :placeholder="'璇疯緭鍏ヤ骇鍝佸悕绉�'" + @searchClick="onProductFilterSearch" > <template slot="leftButton"> <div class="sub-title"><span class="sub-title-decorator"></span>鍙彁渚涚殑浜у搧</div> - <el-button type="primary" size="mini">鍒涘缓閲囪喘鍗�</el-button> + <el-button type="primary" size="mini" @click="creatPurchase">鍒涘缓閲囪喘鍗�</el-button> </template> <template slot="rightButton"> <el-button type="primary" size="mini" @click="addNewProductClick">娣诲姞鏂颁骇鍝�</el-button> @@ -73,10 +75,11 @@ <div class="body-card"> <div class="list-view"> <TableCommonView - ref="tableListProduct" - :table-list="productTableList" - @selCommonClick="selCommonClick" - @getSelectArray="getSelectArray" + ref="tableListProduct" + :table-list="productTableList" + @selCommonClick="selCommonClick" + @getSelectArray="getSelectArray" + @selTableCol="selProductTableCol" > <template slot="tableButton"> <el-table-column label="鎿嶄綔" width="170"> @@ -91,10 +94,10 @@ </div> <div class="btn-pager"> <PagerView - class="page" - :pager-options="productPagerOptions" - @size-change="productChangeHandler" - @current-change="currentProductHandler" + class="page" + :pager-options="productPagerOptions" + @size-change="productChangeHandler" + @current-change="currentProductHandler" /> </div> </div> @@ -108,27 +111,31 @@ <RaleteSupplierList v-if="raleteSupplierConfig.visible" :common-config="raleteSupplierConfig" /> <!-- 娣诲姞鏂颁骇鍝� --> <AddNewProduct v-if="newProductConfig.visible" :add-common-config="newProductConfig" /> + <!-- 鏂板缓/缂栬緫 --> + <AddPurchase v-if="editPurchaseConfig.visible" :edit-common-config="editPurchaseConfig" /> </div> </template> <script> import pageMixin from "@/components/makepager/pager/mixin/pageMixin" import { getSupplierList, changeSupplierStatus } from "@/api/supplierManage/supplier" +import { getPurchaseList } from "@/api/purchaseManage/purchase" import DetailSupplier from "@/views/supplierManage/supplier/DetailSupplier" import AddSupplier from "@/views/supplierManage/supplier/AddSupplier" import RaleteSupplierList from "@/views/supplierManage/supplier/RaleteSupplierList" import AddNewProduct from "@/views/supplierManage/supplier/AddNewProduct" import { getProductList, deleteProduct } from "@/api/productManage/product" +import AddPurchase from "@/views/purchaseManage/purchase/components/AddPurchase" export default { name: "SupplierManage", props: {}, - components: { DetailSupplier, AddSupplier, RaleteSupplierList, AddNewProduct }, + components: { DetailSupplier, AddSupplier, RaleteSupplierList, AddNewProduct, AddPurchase }, mixins: [pageMixin], computed: {}, data() { return { - searchSupplierName: '', + searchSupplierName: "", tableList: {}, // 渚涘簲鍟嗗垪琛� productTableList: {}, // 浜у搧鍒楄〃 selValueList: [], @@ -136,7 +143,8 @@ searchProductOptions: [], // 浜у搧鏌ヨ commonDetail: { visible: false, - infomation: {} + infomation: {}, + productListInfo: [] }, editConfig: { visible: false, @@ -157,7 +165,37 @@ pageSize: 10, totalCount: 0 }, - supplierId: 0 + supplierId: 0, + showCol: ["渚涘簲鍟嗙紪鍙�", "渚涘簲鍟嗗悕绉�", "渚涘簲鍟嗙被鍨�", "鎵�灞炶涓�", "鑱旂郴浜�", "鑱旂郴鐢佃瘽", "鐘舵��"], + tableColumn: [ + { label: "渚涘簲鍟嗙紪鍙�", prop: "number", min: 190, isCommonClick: true }, + { label: "渚涘簲鍟嗗悕绉�", prop: "name", min: 130, default: true }, + { label: "渚涘簲鍟嗙被鍨�", prop: "supplierType", min: 130 }, + { label: "鎵�灞炶涓�", prop: "industry", min: 130 }, + { label: "鑱旂郴浜�", prop: "contact", min: 130 }, + { label: "鑱旂郴鐢佃瘽", prop: "phone", min: 130 }, + { label: "鐘舵��", prop: "status_name", min: 130 }, + { label: "鍒涘缓鏃堕棿", prop: "created_at", min: 130 } + ], + showProductCol: ["浜у搧缂栫爜", "浜у搧鍚嶇О", "浜у搧瑙勬牸", "鍗曚綅", "閲囪喘浠锋牸", "渚涜揣鏃堕暱(澶�)", "鐗╂祦鏃堕暱(澶�)"], + productColumn: [ + { label: "浜у搧缂栫爜", prop: "number", min: 190 }, + { label: "浜у搧鍚嶇О", prop: "name", min: 130, default: true }, + { label: "浜у搧瑙勬牸", prop: "specifications", min: 130 }, + { label: "鍗曚綅", prop: "unit", min: 130 }, + { label: "閲囪喘浠锋牸", prop: "purchasePrice", min: 130 }, + { label: "渚涜揣鏃堕暱(澶�)", prop: "deliveryTime", min: 130 }, + { label: "鐗╂祦鏃堕暱(澶�)", prop: "shippingDuration", min: 130 } + ], + editPurchaseConfig: { + // 鍒涘缓閲囪喘 + visible: false, + title: "鍒涘缓", + infomation: { + supplierName: "" + } + }, + selectRow: {} } }, created() { @@ -166,23 +204,34 @@ this.getData() }, methods: { + setColumnVisible(showCol) { + return this.tableColumn.map((ele) => { + return { + ...ele, + isShowColumn: showCol.includes(ele.label) + } + }) + }, + setProductColumnVisible(showCol) { + return this.productColumn.map((ele) => { + return { + ...ele, + isShowColumn: showCol.includes(ele.label) + } + }) + }, setTable() { this.tableList = { tableInfomation: [], selectIndex: true, highlight: true, ref: "tableListRef", - tableColumn: [ - { label: "渚涘簲鍟嗙紪鍙�", prop: "number", min: 190, isCommonClick: true }, - { label: "渚涘簲鍟嗗悕绉�", prop: "name", min: 130 }, - { label: "渚涘簲鍟嗙被鍨�", prop: "supplierType", min: 130 }, - { label: "鎵�灞炶涓�", prop: "industry", min: 130 }, - { label: "鑱旂郴浜�", prop: "contact", min: 130 }, - { label: "鑱旂郴鐢佃瘽", prop: "phone", min: 130 }, - { label: "鐘舵��", prop: "status_name", min: 130 }, - { label: "鍒涘缓鏃堕棿", prop: "created_at", min: 130 } - ] + showcol: this.showCol, + allcol: [], + 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 @@ -190,20 +239,18 @@ this.searchOptions.push({ value: value, label: label }) } }, + selTableCol(val) { + this.showcol = val + this.tableList.tableColumn = this.setColumnVisible(val) + }, setProductTable() { this.productTableList = { tableInfomation: [], selectBox: true, selectIndex: true, - tableColumn: [ - { label: "浜у搧缂栫爜", prop: "number", min: 190 }, - { label: "浜у搧鍚嶇О", prop: "name", min: 130 }, - { label: "浜у搧瑙勬牸", prop: "specifications", min: 130 }, - { label: "鍗曚綅", prop: "unit", min: 130 }, - { label: "閲囪喘浠锋牸", prop: "purchasePrice", min: 130 }, - { label: "渚涜揣鏃堕暱(澶�)", prop: "deliveryTime", min: 130 }, - { label: "鐗╂祦鏃堕暱(澶�)", prop: "shippingDuration", min: 130 } - ] + showcol: this.showProductCol, + allcol: [], + tableColumn: this.setProductColumnVisible(this.showProductCol) } this.searchProductOptions = [] for (let i = 0; i < this.productTableList.tableColumn.length; i++) { @@ -211,6 +258,15 @@ const value = this.productTableList.tableColumn[i].prop this.searchProductOptions.push({ value: value, label: label }) } + + this.productTableList.allcol = this.productTableList.tableColumn + .filter((ele) => !ele.default) + .map((ele) => ele.label) + console.log("this.productTableList", this.productTableList) + }, + selProductTableCol(val) { + this.showProductCol = val + this.productTableList.tableColumn = this.setProductColumnVisible(val) }, // 璇锋眰鏁版嵁 getData() { @@ -223,25 +279,38 @@ page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize }).then((res) => { - console.log(res.data) - if (res.data.code === 200) { - const list = res.data.data.list.map((item) => { + console.log(res) + if (res.code === 200) { + const list = res.data.list.map((item) => { return { ...item, + id: item.id, status_name: item.status === 0 ? "鏈惎鐢�" : "鍚敤" } }) + console.log(list) this.tableList.tableInfomation = list || [] - this.pagerOptions.totalCount = res.data.data.total + this.pagerOptions.totalCount = res.data.total if (list && list.length > 0) { - this.supplierId = this.tableList.tableInfomation[0].ID + this.supplierId = this.tableList.tableInfomation[0].id + this.selectRow = this.tableList.tableInfomation.length > 0 ? this.tableList.tableInfomation[0] : {} } else { this.supplierId = 0 } - this.$nextTick(() => { - this.$refs.tableSupplier.$refs.table.setCurrentRow(this.tableList.tableInfomation[0]) - }) - this.getProductList() + // this.$nextTick(() => { + // this.$refs.tableSupplier.$refs.table.setCurrentRow(this.tableList.tableInfomation[0]) + // }) + + // 閲嶆柊鑾峰彇渚涘簲鍟嗗垪琛ㄥ悗搴旇閲嶇疆浜у搧鍒楄〃椤电爜 + this.productPagerOptions.currPage = 1 + // 濡傛灉渚涘簲鍟嗗垪琛ㄤ负绌�,鍒欏彲鎻愪緵浜у搧鍒楄〃涔熷簲涓虹┖ + if (list.length) { + this.getProductList() + } else { + this.productTableList.tableInfomation = [] + this.productPagerOptions.currPage = 1 + this.productPagerOptions.totalCount = 0 + } } }) }, @@ -254,36 +323,40 @@ page: this.productPagerOptions.currPage, pageSize: this.productPagerOptions.pageSize }).then((res) => { - console.log(res.data) - const list = res.data.data.list.map((item) => { + let list = res.data.list.map((item) => { return { ...item } }) this.productTableList.tableInfomation = list || [] - this.productPagerOptions.totalCount = res.data.data.total + this.productPagerOptions.totalCount = res.data.total }) }, // 鎼滅储渚涘簲鍟� - onFilterSearch(searchText){ - this.searchSupplierName = searchText ??'' + onFilterSearch(searchText) { + this.searchSupplierName = searchText ?? "" + this.pagerOptions.currPage = 1 this.getSupplierList() }, // 鎼滅储浜у搧 - onProductFilterSearch(searchText){ - this.getProductList('name', searchText) + onProductFilterSearch(searchText) { + this.productPagerOptions.currPage = 1 + this.getProductList("name", searchText) }, // 鏂板缓渚涘簲鍟� addBtnClick() { this.editConfig.visible = true this.editConfig.title = "鏂板缓" - this.editConfig.infomation = { fileId: 0 } + this.editConfig.infomation = { + fileId: 0, + responsiblePersonName: document.cookie.replace(/(?:(?:^|.*;\s*)username\s*=\s*([^;]*).*$)|^.*$/, "$1") + } }, // 鍚敤渚涘簲鍟� async enableClick(row, value) { let status = value === "鍚敤" ? 1 : 0 await changeSupplierStatus({ - id: row.ID, + id:Number(row.id), status: status }).then((res) => { if (res.code === 200) { @@ -312,7 +385,6 @@ }, // 淇敼浜у搧 editClick(row) { - console.log(row) this.newProductConfig.visible = true this.newProductConfig.title = "淇敼" this.newProductConfig.infomation = { ...row } @@ -325,7 +397,7 @@ type: "warning" }) .then(() => { - deleteProduct({ id: row.ID }).then((response) => { + deleteProduct({ id: row.id }).then((response) => { if (response.code === 200) { this.$message.success("鍒犻櫎鎴愬姛") this.getProductList() @@ -345,14 +417,16 @@ this.selValueList = list }, tableRowClick(row) { - console.log(row) this.productPagerOptions.currPage = 1 - this.supplierId = row.ID + this.selectRow = row + this.supplierId = row.id this.getProductList() }, // 璇︽儏 - selCommonClick(row) { - console.log(row) + async selCommonClick(row) { + await getPurchaseList({ pageSize: 10, page: 1, supplierId: Number(row.id) }).then((res) => { + this.commonDetail.productListInfo = res.data.list + }) this.commonDetail.visible = true this.commonDetail.infomation = { ...row } }, @@ -365,6 +439,16 @@ currentProductHandler(val) { this.productPagerOptions.currPage = val this.getProductList() + }, + // 鍒涘缓閲囪喘鍗� + creatPurchase() { + this.editPurchaseConfig.visible = true + this.editPurchaseConfig.title = "鏂板缓" + this.editPurchaseConfig.infomation = { + supplierId: this.selectRow.id, + purchaseTypeId:"2", + supplierName: this.selectRow.name + } } } } @@ -372,32 +456,32 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.supplier{ +.supplier { height: 100%; overflow: hidden; - .top{ + .top { position: relative; height: 55%; - .body{ + .body { position: relative; height: calc(100% - 92px); } } - .bottom{ + .bottom { position: relative; height: 45%; - .body{ + .body { position: relative; height: calc(100% - 40px); padding-top: 0; } } - .filter{ + .filter { height: 80px; display: flex; align-items: center; padding: 12px 20px 0 20px; - &-card{ + &-card { height: 80px; display: flex; align-items: center; @@ -408,13 +492,13 @@ background-color: #fff; } } - .simple-filter{ + .simple-filter { height: 40px; box-sizing: border-box; display: flex; align-items: center; padding: 0 20px; - &-card{ + &-card { height: 80px; display: flex; align-items: center; @@ -422,7 +506,7 @@ flex: 1; } } - .body{ + .body { box-sizing: border-box; padding: 10px 20px; border-radius: 12px; @@ -453,7 +537,7 @@ } } } -.sub-title{ +.sub-title { flex-shrink: 0; margin-right: 20px; font-size: 16px; @@ -462,7 +546,7 @@ line-height: 28px; position: relative; padding-left: 12px; - &-decorator{ + &-decorator { position: absolute; height: 100%; width: 4px; @@ -471,5 +555,4 @@ left: 0; } } - </style> -- Gitblit v1.8.0