From 1888b426ff2b6a529f5fdef0f0453dadef71824b Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期三, 17 四月 2024 10:17:38 +0800 Subject: [PATCH] 隐藏多单位的问题 --- src/views/reportForm/inventoryReport/index.vue | 422 +++++++++++++++++++++++++++++++++------------------- 1 files changed, 267 insertions(+), 155 deletions(-) diff --git a/src/views/reportForm/inventoryReport/index.vue b/src/views/reportForm/inventoryReport/index.vue index be0d63d..52fa318 100644 --- a/src/views/reportForm/inventoryReport/index.vue +++ b/src/views/reportForm/inventoryReport/index.vue @@ -3,61 +3,65 @@ <div class="rightContent"> <div class="top"> <SearchCommonView + :showAdd="false" :add-title="'鏂板缓'" - :placeholder="'璇疯緭鍏ュ弬鑰�'" + :placeholder="'璇疯緭鍏ヤ骇鍝佸悕绉版垨浜у搧绫诲埆'" :amount-view="false" @addCommonClick="addBtnClick" @searchClick="getList" + :isDisabled="true" /> </div> <div class="content_wrap"> <div class="con_left"> - <p>绫诲埆</p> - <el-checkbox-group v-model="checkList"> - <el-checkbox label="涓濈桓鍒跺搧"></el-checkbox> - <el-checkbox label="涓濈桓鍒跺搧/瀹跺叿鏈�"></el-checkbox> - <el-checkbox label="涓濈桓鍒跺搧/鐪熶笣鍚婂甫"></el-checkbox> - <el-checkbox label="涓濈桓鍒跺搧/鐪熶笣濂楄"></el-checkbox> - <el-checkbox label="涓濈桓鍒跺搧/鐪熶笣鐫¤"></el-checkbox> - <el-checkbox label="涓濈桓鍒跺搧/铓曚笣琚�"></el-checkbox> + <p>浠撳簱</p> + <div class="stash"> + <template> + <el-radio + v-for="(item, index) in warehouseList" + :key="index" + v-model="stashRadio" + :label="item.code" + @change="radioHandleChange" + >{{ item.name }}</el-radio + > + <!-- @click.prevent.native="checkRadio(item.code)" 鍙栨秷鍗曢�夐」 --> + </template> + </div> + <p style="margin-top: 30px">绫诲埆</p> + <el-checkbox-group v-model="checkList" @change="checkListHandler"> + <el-checkbox v-for="item in categoryList" :key="item.id" :label="item.id"> + {{ item.name }} + </el-checkbox> </el-checkbox-group> </div> - <div class="con_right"> - <div class="list-view"> + <div class="list-view"> + <div class="table"> <TableCommonView ref="tableListRef" :table-list="tableList" @selTableCol="selTableCol" @tableRowClick="tableRowClick" + :showSummary="true" > <template slot="tableButton"> - <el-table-column - label="鎿嶄綔" - width="220" - align="center" - > + <el-table-column label="鎿嶄綔" width="220" align="center"> <template slot-scope="scope"> - <span @click="handleHistoryClick(scope.row)"> + <span @click="handleHistoryClick(scope.row)" class="yes-cursor"> <i class="el-icon-refresh-left"></i> <span>鍘嗗彶</span> </span> - <span @click="handleAddGoods(scope)" class="margin_left_5px"> + <span @click="handleAddGoods(scope.row)" class="margin_left_5px;" style="cursor: pointer"> <i class="el-icon-refresh"></i> <span>琛ヨ揣</span> </span> <template> - <span - @click="handleLocation(scope)" - class="margin_left_5px" - > + <span @click="handleLocation(scope)" class="margin_left_5px yes-cursor"> <i class="el-icon-menu"></i> <span>浣嶇疆</span> </span> - <span - @click="handleForecast(scope)" - class="margin_left_5px" - > + <span @click="handleForecast(scope)" class="margin_left_5px no-cursor"> <i class="el-icon-s-data"></i> <span>棰勬祴</span> </span> @@ -66,269 +70,377 @@ </el-table-column> </template> </TableCommonView> - <div class="btn-pager"> - <PagerView - class="page" - :pager-options="pagerOptions" - v-on="pagerEvents" - /> - </div> + </div> + <div class="btn-pager"> + <PagerView class="page" :pager-options="pagerOptions" :page-size="pageSizes" v-on="pagerEvents" /> </div> </div> </div> <!-- 缂栬緫 dialog--> - <AddOverviewDialog - v-if="editConfig.visible" - :edit-common-config="editConfig" - :add-name="this.$route.params.name" - /> + <AddOverviewDialog v-if="editConfig.visible" :edit-common-config="editConfig" :add-name="this.$route.params.name" /> </div> </template> <script> -import pageMixin from "@/components/makepager/pager/mixin/pageMixin"; -import { getProductOperatonList } from "@/api/product/product"; -import AddOverviewDialog from "@/views/overview/AddOverviewDialog"; +import pageMixin from "@/components/makepager/pager/mixin/pageMixin" +import AddOverviewDialog from "@/views/overview/AddOverviewDialog" +import { getInventoryData, getProductCategoryList, getWarehouseList } from "@/api/reportForm/inventoryRwport" export default { - name: "InboundOutboundDetail", + name: "inventoryReport", props: {}, components: { AddOverviewDialog }, mixins: [pageMixin], computed: {}, data() { return { + keyword: "", checkList: [], - - testArr: [ + testArr: [], + testArr2: [ { - product: "鍗楁柟涓濆发xxx", - category: "涓濈桓鍒跺搧/鐪熶笣鐫¤", - cost: "800.00", - totalPrices: "0.00", - inStore: "0.00", - availableStore: "0.00", - inStorage: "0.00", - toStore: "0.00", - forecast: "0.00", - unit: "浠�", + product: "鍗楁柟涓濆发xxx", //浜у搧 + category: "涓濈桓鍒跺搧/鐪熶笣鐫¤", // 浜у搧绫诲埆 + cost: "100.00", //鍗曚綅鎴愭湰 + inStore: "12.00", // 鍦ㄥ簱 + totalPrices: 10, // 鎬讳环鍊� + availableStore: "0.00", //鍙敤搴撳瓨 + inStorage: "100.00", // 鍏ュ簱 + toStore: "20.00", // 鍑哄簱 + forecast: "0.00", //棰勬祴 + unit: "浠�" //鍗曚綅 }, { product: "鍗楁柟涓濆发12306xxx", category: "涓濈桓鍒跺搧/鐪熶笣鐫¤", cost: "9980.00", totalPrices: "0.00", - inStore: "0.00", + inStore: "10.00", availableStore: "0.00", inStorage: "0.00", toStore: "0.00", forecast: "0.00", - unit: "浠�", - }, + unit: "浠�" + } ], tableList: {}, showcol: ["浜у搧绫诲埆", "鍗曚綅鎴愭湰", "鎬讳环鍊�", "鍏ュ簱", "鍑哄簱"], + countcol: ["鎬讳环鍊�", "鍦ㄥ簱", "鍙敤搴撳瓨", "鍏ュ簱", "鍑哄簱", "棰勬祴"], searchOptions: [], commonDetail: { visible: false, title: "鏂板缓", - infomation: {}, + infomation: {} }, editConfig: { visible: false, title: "鏂板缓", - infomation: {}, + infomation: {} }, productId: this.$route.params.id, productName: this.$route.params.name, - }; + categoryList: [], // 绫诲埆 + categoryListId: [], //绫诲埆id + warehouseList: [], // 浠撳簱 + warehouseListName: "", // 浠撳簱鍚嶇О + stashRadio: "1", + pageSizes: [15, 30], + oldRadioBtn: "", + metaTitle: this.$route.meta.title, + searchStr: this.$route.params.name ?? "" + } }, created() { - this.setTable(); - // this.getData(); + this.setTable() + this.getData() //搴撳瓨鎶ヨ〃 + this.getStashData() // 浠撳簱鍒楄〃鏁版嵁 + this.getProductCategoryList() + }, + mounted() { + this.countSums() }, methods: { + checkListHandler(e) { + this.categoryListId = e + this.getData() + }, + radioHandleChange(e) { + this.warehouseListName = e + this.getData() + }, + // checkRadio(val){ + // console.log(val) + // val == this.stashRadio ? this.stashRadio = '' : this.stashRadio = val + // this.warehouseListName = val + // this.getData() + // }, setTable() { + if (this.isIconIndex === "1") { + this.pageSizes = [30, 60] + this.pagerOptions.pageSize = 30 + } this.tableList = { tableInfomation: [], - selectBox: true, + selectBox: false, + selectIndex: true, showcol: this.showcol, + countcol: this.countcol, allcol: [], - tableColumn: this.setTableColumn(this.showcol), - }; - this.tableList.tableInfomation = this.testArr; - let allcol = []; + tableColumn: this.setTableColumn(this.showcol) + } + // this.tableList.tableInfomation = this.testArr; + let allcol = [] for (let i = 0; i < this.tableList.tableColumn.length; i++) { if (!this.tableList.tableColumn[i].default) { - const label = this.tableList.tableColumn[i].label; - allcol.push(label); + const label = this.tableList.tableColumn[i].label + allcol.push(label) } } - this.tableList.allcol = allcol; + this.tableList.allcol = allcol }, setTableColumn(showcol) { let tableColumn = [ { label: "浜у搧", - prop: "product", - isShowColumn: true, + prop: "productName", default: true, - width:300, - + width: 300, + isShowColumn: true // date: true, // 鏄惁涓烘棩鏈熸牸寮� }, { label: "浜у搧绫诲埆", - prop: "category", - isShowColumn: true, + prop: "productType", default: true, - isShowColumn: showcol.includes("浜у搧绫诲埆"), + isShowColumn: showcol.includes("浜у搧绫诲埆") }, { label: "鍗曚綅鎴愭湰", prop: "cost", - isShowColumn: true, default: false, isShowColumn: showcol.includes("鍗曚綅鎴愭湰"), + textAlign: "right" }, { label: "鎬讳环鍊�", - prop: "totalPrices", - isShowColumn: true, + prop: "value", default: false, isShowColumn: showcol.includes("鎬讳环鍊�"), + unit: "锟�", + textAlign: "right" }, { label: "鍦ㄥ簱", - prop: "inStore", - isShowColumn: true, + prop: "amount", default: true, + isShowColumn: true, + unit: "", + textAlign: "right" }, { label: "鍙敤搴撳瓨", - prop: "availableStore", - isShowColumn: true, + prop: "availableNumber", default: true, + isShowColumn: true, + unit: "", + textAlign: "right" }, { label: "鍏ュ簱", - prop: "inStorage", - isShowColumn: true, + prop: "in", default: false, isShowColumn: showcol.includes("鍏ュ簱"), + unit: "", + textAlign: "right" }, { label: "鍑哄簱", - prop: "toStore", - isShowColumn: true, + prop: "out", isShowColumn: showcol.includes("鍑哄簱"), default: false, + unit: "", + textAlign: "right" }, { label: "棰勬祴", prop: "forecast", - isShowColumn: false, isShowColumn: showcol.includes("棰勬祴"), default: false, + unit: "" }, { label: "鍗曚綅", prop: "unit", - isShowColumn: true, default: true, - // price:true - // status: true, - // propType: "mulitple", - // conversion: true, - }, - ]; - return tableColumn; + isShowColumn: true + } + ] + return tableColumn }, selTableCol(val) { - this.showcol = val; - this.tableList.tableColumn = this.setTableColumn(val); + this.showcol = val + this.tableList.tableColumn = this.setTableColumn(val) }, - // 璇锋眰鏁版嵁 - // async getData() { - // await getProductOperatonList({ - // productId: this.productId, - // page: this.pagerOptions.currPage, - // pageSize: this.pagerOptions.pageSize, - // }).then((res) => { - // if (res.code === 200) { - // const list = res.data.map((item) => { - // return { - // ...item, - // from: item.fromLocation.name, - // to: item.toLocation.name, - // productName: this.productName, - // }; - // }); - // this.tableList.tableInfomation = list || []; - // this.pagerOptions.totalCount = res.total; - // } - // }); - // }, - // 鎼滅储 getList(val) { - console.log(val); + this.searchStr = val + this.getData() }, // 琛岀偣鍑� tableRowClick(row) { - console.log(row); + console.log(row) // this.editConfig.visible = true; - this.editConfig.title = "鏌ョ湅"; - this.editConfig.infomation = { ...row }; + this.editConfig.title = "鏌ョ湅" + this.editConfig.infomation = { ...row } }, // 鏂板缓 addBtnClick() { - this.editConfig.visible = true; - this.editConfig.title = "鏂板缓"; + // this.editConfig.visible = true; + // this.editConfig.title = "鏂板缓" + // this.getData() }, // 鐘舵�� getStatus(val) { - return val === 1 ? "鑽夌" : val === 3 ? "灏辩华" : "瀹屾垚"; + return val === 1 ? "鑽夌" : val === 3 ? "灏辩华" : "瀹屾垚" }, // 鍘嗗彶 handleHistoryClick(row) { - console.log(row, "two"); + this.$router.push({ + name: "inboundOutboundDetail", + params: { + keyWord: row.productName, + produceId: row.produceId, + unit: row.unit, + productName: row.productName, + name: "鎶ヨ〃" + } + }) }, + // 琛ヨ揣 - handleAddGoods(row) {}, + handleAddGoods(row) { + this.$router.push({ + name: "orderPoint", + params: { + productId: row.produceId + } + }) + }, // 浣嶇疆 - handleLocation() {}, + handleLocation(row) { + this.$router.push({ + name: "locationReport", + params: { + // keyWord:row.row.productName, + wareHouseCode: this.warehouseListName, + productId: row.row.produceId, + name: "搴撳瓨鎶ヨ〃" + } + }) + }, // 棰勬祴 handleForecast() {}, - }, -}; + //鎬讳环璁$畻 + countSums() { + this.testArr2.map((item) => { + let obj = { + product: item.product, //浜у搧 + category: item.category, // 浜у搧绫诲埆 + cost: item.cost, //鍗曚綅鎴愭湰 + inStore: item.inStore, // 鍦ㄥ簱 + totalPrices: item.cost * item.inStore, // 鎬讳环鍊� + availableStore: item.availableStore, //鍙敤搴撳瓨 + inStorage: item.inStorage, // 鍏ュ簱 + toStore: item.toStore, // 鍑哄簱 + forecast: item.forecast, //棰勬祴 + unit: item.unit //鍗曚綅 + } + this.testArr.push(obj) + }) + }, + + //鎺ュ彛璇锋眰----------------------------------------------------------------------------------------------- + // 鑾峰彇搴撳瓨鎶ヨ〃鏁版嵁 + async getInventoryData(params) { + await getInventoryData(params).then((res) => { + if (res.code === 200) { + const list = res.data + this.tableList.tableInfomation = list || [] + this.pagerOptions.totalCount = res.total + } + }) + }, + getData() { + let params = { + keyWord: this.searchStr, + categoryIds: this.categoryListId, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize, + warehouseCode: this.warehouseListName + } + this.getInventoryData(params) + }, + // 鑾峰彇浜у搧绫诲瀷鍒楄〃鏁版嵁 + async getProductCategoryList() { + await getProductCategoryList({ + keyWord: "", + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + }).then((res) => { + if (res.code === 200) { + this.categoryList = res.data + } + }) + }, + // 璇锋眰浠撳簱鍒楄〃鏁版嵁 + async getStashData() { + await getWarehouseList({ + keyword: "", + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + }).then((res) => { + if (res.code === 200) { + this.warehouseList = res.data + } + }) + } + } +} </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.rightContent { - height: 100%; - background: #e6ecf2; - // width: 100%; - padding: 10px; - .top { - margin-bottom: 20px; - height: 60px; - background: #fff; - border-radius: 8px; +.content_wrap { + height: calc(100% - 0px); + display: flex; + justify-content: space-between; + .con_left { + width: 200px; + .el-checkbox-group { + width: 100%; + display: flex; + flex-direction: column; + } + .stash { + display: flex; + flex-direction: column; + } } - .content_wrap { - height: calc(100% - 50px); - display: flex; - justify-content: space-between; - .con_left { - width: 200px; - } - .con_right { - width: calc(100% - 200px); - } + .list-view { + flex: 1; } } - -// } +::v-deep { + .el-checkbox { + padding: 5px; + } + .el-checkbox__label { + width: 95%; + box-sizing: border-box; + padding-right: 5px; + word-break: break-all; + word-wrap: break-word; + white-space: pre-wrap !important; + } +} </style> -- Gitblit v1.8.0