From 3f27fa724a2704c4bb01db6b5932265f505cfc11 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期四, 28 九月 2023 09:55:45 +0800 Subject: [PATCH] 报表样式修改 --- src/views/reportForm/inventoryReport/index.vue | 221 ++++++++++++++++++++++-------------------------------- 1 files changed, 91 insertions(+), 130 deletions(-) diff --git a/src/views/reportForm/inventoryReport/index.vue b/src/views/reportForm/inventoryReport/index.vue index 8c4d60f..6bd8e38 100644 --- a/src/views/reportForm/inventoryReport/index.vue +++ b/src/views/reportForm/inventoryReport/index.vue @@ -30,16 +30,11 @@ </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 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" @@ -59,17 +54,11 @@ <span>琛ヨ揣</span> </span> <template> - <span - @click="handleLocation(scope)" - class="margin_left_5px" - > + <span @click="handleLocation(scope)" class="margin_left_5px"> <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"> <i class="el-icon-s-data"></i> <span>棰勬祴</span> </span> @@ -78,35 +67,22 @@ </el-table-column> </template> </TableCommonView> - <div class="btn-pager"> - <PagerView - class="page" - :pager-options="pagerOptions" - :page-size="pageSizes" - 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 AddOverviewDialog from "@/views/overview/AddOverviewDialog"; -import { - getInventoryData, - getProductCategoryList, - getWarehouseList, -} from "@/api/reportForm/inventoryRwport"; +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", @@ -130,7 +106,7 @@ inStorage: "100.00", // 鍏ュ簱 toStore: "20.00", // 鍑哄簱 forecast: "0.00", //棰勬祴 - unit: "浠�", //鍗曚綅 + unit: "浠�" //鍗曚綅 }, { product: "鍗楁柟涓濆发12306xxx", @@ -142,8 +118,8 @@ inStorage: "0.00", toStore: "0.00", forecast: "0.00", - unit: "浠�", - }, + unit: "浠�" + } ], tableList: {}, showcol: ["浜у搧绫诲埆", "鍗曚綅鎴愭湰", "鎬讳环鍊�", "鍏ュ簱", "鍑哄簱"], @@ -152,12 +128,12 @@ commonDetail: { visible: false, title: "鏂板缓", - infomation: {}, + infomation: {} }, editConfig: { visible: false, title: "鏂板缓", - infomation: {}, + infomation: {} }, productId: this.$route.params.id, productName: this.$route.params.name, @@ -167,28 +143,28 @@ warehouseListName: "", // 浠撳簱鍚嶇О stashRadio: "1", pageSizes: [15, 30], - oldRadioBtn:"", - }; + oldRadioBtn: "" + } }, created() { - this.setTable(); - this.getData(); //搴撳瓨鎶ヨ〃 - this.getStashData(); // 浠撳簱鍒楄〃鏁版嵁 - this.getProductCategoryList(); + this.setTable() + this.getData() //搴撳瓨鎶ヨ〃 + this.getStashData() // 浠撳簱鍒楄〃鏁版嵁 + this.getProductCategoryList() }, mounted() { - this.countSums(); + this.countSums() }, methods: { checkListHandler(e) { - this.categoryListId = e; + this.categoryListId = e this.getData() - console.log(this.categoryListId, e, " 閫変腑鐨勪骇鍝乮d"); + console.log(this.categoryListId, e, " 閫変腑鐨勪骇鍝乮d") }, radioHandleChange(e) { - this.warehouseListName=e + this.warehouseListName = e this.getData() - console.log(e, "鍗曢��"); + console.log(e, "鍗曢��") }, setTable() { if (this.isIconIndex === "1") { @@ -201,17 +177,17 @@ showcol: this.showcol, countcol: this.countcol, allcol: [], - tableColumn: this.setTableColumn(this.showcol), - }; + tableColumn: this.setTableColumn(this.showcol) + } // this.tableList.tableInfomation = this.testArr; - let allcol = []; + 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 = [ @@ -220,109 +196,108 @@ prop: "productName", default: true, width: 300, - isShowColumn: true, + isShowColumn: true // date: true, // 鏄惁涓烘棩鏈熸牸寮� }, { label: "浜у搧绫诲埆", prop: "productType", default: true, - isShowColumn: showcol.includes("浜у搧绫诲埆"), + isShowColumn: showcol.includes("浜у搧绫诲埆") }, { label: "鍗曚綅鎴愭湰", prop: "cost", default: false, - isShowColumn: showcol.includes("鍗曚綅鎴愭湰"), + isShowColumn: showcol.includes("鍗曚綅鎴愭湰") }, { label: "鎬讳环鍊�", prop: "value", default: false, isShowColumn: showcol.includes("鎬讳环鍊�"), - unit: "锟�", + unit: "锟�" }, { label: "鍦ㄥ簱", prop: "amount", default: true, isShowColumn: true, - unit: "", + unit: "" }, { label: "鍙敤搴撳瓨", prop: "availableNumber", default: true, isShowColumn: true, - unit: "", + unit: "" }, { label: "鍏ュ簱", prop: "in", default: false, isShowColumn: showcol.includes("鍏ュ簱"), - unit: "", + unit: "" }, { label: "鍑哄簱", prop: "out", isShowColumn: showcol.includes("鍑哄簱"), default: false, - unit: "", + unit: "" }, { label: "棰勬祴", prop: "forecast", isShowColumn: showcol.includes("棰勬祴"), default: false, - unit: "", + unit: "" }, { label: "鍗曚綅", prop: "unit", default: true, - isShowColumn: 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) }, getList(val) { - console.log(val); + console.log(val) }, // 琛岀偣鍑� 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.getData(); + this.editConfig.title = "鏂板缓" + this.getData() }, // 鐘舵�� getStatus(val) { - return val === 1 ? "鑽夌" : val === 3 ? "灏辩华" : "瀹屾垚"; + return val === 1 ? "鑽夌" : val === 3 ? "灏辩华" : "瀹屾垚" }, // 鍘嗗彶 handleHistoryClick(row) { console.log(row) - this.$router.push("/operate/allot"); + this.$router.push("/operate/allot") }, // 琛ヨ揣 handleAddGoods(row) { console.log(row) - }, // 浣嶇疆 handleLocation() { - this.$router.push("/reportForm/locationReport"); + this.$router.push("/reportForm/locationReport") }, // 棰勬祴 handleForecast() {}, @@ -339,11 +314,11 @@ inStorage: item.inStorage, // 鍏ュ簱 toStore: item.toStore, // 鍑哄簱 forecast: item.forecast, //棰勬祴 - unit: item.unit, //鍗曚綅 - }; - this.testArr.push(obj); - console.log(this.testArr, "this"); - }); + unit: item.unit //鍗曚綅 + } + this.testArr.push(obj) + console.log(this.testArr, "this") + }) }, //鎺ュ彛璇锋眰----------------------------------------------------------------------------------------------- @@ -353,16 +328,16 @@ categoryIds: this.categoryListId, page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize, - warehouseCode: this.warehouseListName, - }; + warehouseCode: this.warehouseListName + } await getInventoryData(params).then((res) => { if (res.code === 200) { - console.log(res.data, "鎺ュ彛璇锋眰鎴愬姛"); + console.log(res.data, "鎺ュ彛璇锋眰鎴愬姛") const list = res.data this.tableList.tableInfomation = list || [] this.pagerOptions.totalCount = res.total } - }); + }) }, // 鑾峰彇浜у搧绫诲瀷鍒楄〃鏁版嵁 async getProductCategoryList() { @@ -372,9 +347,9 @@ pageSize: this.pagerOptions.pageSize }).then((res) => { if (res.code === 200) { - this.categoryList = res.data; + this.categoryList = res.data } - }); + }) }, // 璇锋眰浠撳簱鍒楄〃鏁版嵁 async getStashData() { @@ -384,48 +359,34 @@ pageSize: this.pagerOptions.pageSize }).then((res) => { if (res.data.code === 200) { - this.warehouseList = res.data.data; - console.log(this.warehouseList, "warehouseList"); + this.warehouseList = res.data.data + console.log(this.warehouseList, "warehouseList") } - }); - }, - }, -}; + }) + } + } +} </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 { + 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; - .el-checkbox-group { - display: flex; - flex-direction: column; - } - .stash { - display: flex; - flex-direction: column; - } - } - .con_right { - width: calc(100% - 200px); - } + .list-view { + flex: 1; } } - -// } </style> -- Gitblit v1.8.0