From 1888b426ff2b6a529f5fdef0f0453dadef71824b Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期三, 17 四月 2024 10:17:38 +0800 Subject: [PATCH] 隐藏多单位的问题 --- src/views/productManage/product/index.vue | 240 ++++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 169 insertions(+), 71 deletions(-) diff --git a/src/views/productManage/product/index.vue b/src/views/productManage/product/index.vue index 113929a..dc395f6 100644 --- a/src/views/productManage/product/index.vue +++ b/src/views/productManage/product/index.vue @@ -5,8 +5,10 @@ :add-title="'鏂板缓'" :placeholder="'璇疯緭鍏ヤ骇鍝佸悕绉�'" :amount-view="false" + :search-task-map="searchTaskMap" @addCommonClick="addBtnClick" @searchClick="searchClick" + @delSelectClick="delSelectClick" /> </div> <div class="list-view"> @@ -14,55 +16,70 @@ <div class="icon-view"> <span class="icon-label" - @click="selIconSwitchClick('1')" - :class="{ blueBackgroud: isIconIndex === '1', whiteBackgroud: isIconIndex === '2' }" - ><i class="el-icon-menu"></i - ></span> - <span - class="icon-label" @click="selIconSwitchClick('2')" :class="{ whiteBackgroud: isIconIndex === '1', blueBackgroud: isIconIndex === '2' }" style="margin-left: 5px" ><i class="el-icon-s-unfold"></i ></span> + <span + class="icon-label" + @click="selIconSwitchClick('1')" + :class="{ blueBackgroud: isIconIndex === '1', whiteBackgroud: isIconIndex === '2' }" + ><i class="el-icon-menu"></i + ></span> </div> </div> <!-- 鍥捐〃褰㈠紡 --> <div v-if="isIconIndex === '1'" class="product-view"> - <div class="product-box" v-for="item in tableList.tableInfomation" :key="item.id"> + <div class="product-box" v-for="item in tableList.tableInfomation" :key="item.id" @click="showDetail(item)"> <div class="left"> - <el-image style="width: 60px; height: 80px" :src="url"></el-image> + <el-image + v-if="item.attachmentList?.length > 0" + style="width: 60px; height: 80px" + :src="item.attachmentList[0].FileUrl" + :preview-src-list="item.srcList" + :z-index="9999" + @click.stop="imgClick" + ></el-image> + <div v-else class="img-view"> + <i class="el-icon-picture-outline"></i> + </div> </div> <div class="right"> <div class="label"> - <span>鍗楁柟涓濆发SOUTHSILK 19濮嗙背鐪熶笣鐫¤。濂� 100%妗戣殨涓� 闀跨増濂楄瀹� </span> + {{ item.name }} </div> <div class="price"> <span>浠锋牸:锟�</span> - <span>{{ item.name }}</span> + <span>{{ item.salePrice }}</span> </div> <div class="library"> <span>鍦ㄥ簱锛�</span> - <span>{{ item.name }}</span> + <span>{{ item.amount }}</span> + <span style="margin-left: 5px">{{ item.unit }}</span> </div> </div> </div> </div> <!-- 鍒楄〃褰㈠紡 --> <div v-if="isIconIndex === '2'" class="product-list"> - <TableCommonView - ref="tableListRef" - :table-list="tableList" - @selTableCol="selTableCol" - @tableRowClick="tableRowClick" - > + <TableCommonView ref="tableListRef" :table-list="tableList" @selTableCol="selTableCol"> + <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="90" align="center"> + <template slot-scope="scope"> + <span @click.stop="showDetail(scope.row)" class="cursor_pointer" style="margin-right: 10px"> + <span style="color: #2a78fb">鏌ョ湅</span> + </span> + <span @click.stop="editRow(scope.row)" class="cursor_pointer"> + <span style="color: #2a78fb">缂栬緫</span> + </span> + </template> + </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" v-on="pagerEvents" /> + <PagerView class="page" :pager-options="pagerOptions" :page-size="pageSizes" v-on="pagerEvents" /> </div> </div> <!-- 鏂板缓/缂栬緫 --> @@ -85,7 +102,7 @@ data() { return { tableList: {}, - showcol: ["鍐呴儴鍙傝��", "璐熻矗浜�", "浜у搧鏍囩", "閿�鍞环鏍�", "鎴愭湰", "鍦ㄥ簱鏁伴噺", "棰勬祴鏁伴噺", "璁¢噺鍗曚綅"], + showcol: ["鍐呴儴缂栫爜",'浜у搧瑙勬牸', "璐熻矗浜�", "浜у搧鏍囩", "鎴愭湰", "鍦ㄥ簱鏁伴噺", "棰勬祴鏁伴噺", "璁¢噺鍗曚綅"], searchOptions: [], commonDetail: { visible: false, @@ -95,21 +112,38 @@ editConfig: { visible: false, title: "鏂板缓", - infomation: {} + infomation: {}, + autoEdit: false }, - isIconIndex: "1", // 1 鍥炬爣 2 鍒楄〃 - url: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" + isIconIndex: "2", // 1 鍥炬爣 2 鍒楄〃 + url: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg", + pageSizes: [15, 30], + keyWord: "", + categoryId: null, + searchTaskMap: [] } }, created() { this.setTable() + let query = this.$route.query + if (query) { + console.log("ssssss") + this.categoryId = query.id ? Number(query.id) : null + this.pagerOptions.currPage = 1 + this.searchTaskMap = query.id ? [{ categoryId: this.categoryId, title: query.categoryName }] : [] + } this.getData() }, methods: { 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, allcol: [], tableColumn: this.setTableColumn(this.showcol) @@ -126,82 +160,87 @@ setTableColumn(showcol) { let tableColumn = [ { - label: "浜у搧鍚嶇О", + label: "浜у搧缂栫爜", prop: "id", isShowColumn: true, default: true }, { - label: "鍐呴儴鍙傝��", - prop: "deviceName", - isShowColumn: showcol.includes("鍐呴儴鍙傝��"), + label: "浜у搧鍚嶇О", + prop: "name", + isShowColumn: true, + default: true + }, + { + label: "浜у搧瑙勬牸", + prop: "specs", + isShowColumn: showcol.includes("浜у搧瑙勬牸"), + default: false + }, + { + label: "鍐呴儴缂栫爜", + prop: "internalReference", + isShowColumn: showcol.includes("鍐呴儴缂栫爜"), default: false }, { label: "璐熻矗浜�", - prop: "id", + prop: "principal", isShowColumn: true, default: true }, { label: "浜у搧鏍囩", - prop: "deviceId", + prop: "productTagName", isShowColumn: showcol.includes("浜у搧鏍囩"), default: false }, { label: "鏉$爜", - prop: "shopName", + prop: "barcode", isShowColumn: showcol.includes("鏉$爜"), default: false }, { - label: "鍏徃", - prop: "shopName", - isShowColumn: showcol.includes("鍏徃"), - default: false - }, - { label: "閿�鍞环鏍�", - prop: "faultLevel", + prop: "salePrice", isShowColumn: showcol.includes("閿�鍞环鏍�"), default: false }, { label: "鎴愭湰", - prop: "status", + prop: "cost", isShowColumn: showcol.includes("鎴愭湰"), - default: false, - status: true + default: false }, { label: "浜у搧绫诲埆", - prop: "faultTime", + prop: "categoryName", isShowColumn: showcol.includes("浜у搧绫诲埆"), default: false }, { label: "浜у搧绫诲瀷", - prop: "shopName", + prop: "model", isShowColumn: showcol.includes("浜у搧绫诲瀷"), default: false }, { label: "鍦ㄥ簱鏁伴噺", - prop: "faultLevel", + prop: "amount", isShowColumn: showcol.includes("鍦ㄥ簱鏁伴噺"), default: false }, - { - label: "棰勬祴鏁伴噺", - prop: "status", - isShowColumn: showcol.includes("棰勬祴鏁伴噺"), - default: false, - status: true - }, + // { + // label: "棰勬祴鏁伴噺", + // prop: "status", + // isShowColumn: showcol.includes("棰勬祴鏁伴噺"), + // default: false, + // status: true + // }, { label: "璁¢噺鍗曚綅", - prop: "faultTime", + prop: "unit", isShowColumn: showcol.includes("璁¢噺鍗曚綅"), default: false } @@ -213,45 +252,87 @@ this.tableList.tableColumn = this.setTableColumn(val) }, // 璇锋眰鏁版嵁 - async getData(val, content) { + async getData() { await getProductList({ - [val]: content, + keyWord: this.keyWord, + categoryId: this.categoryId ? this.categoryId : null, page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize }).then((res) => { - if (res.data.code === 200) { - const list = res.data.data.list.map((item) => { + if (res.code === 200) { + const list = res.data.map((item) => { + let srcList = [] + if (item.attachmentList?.length > 0) { + item.attachmentList.forEach((ele) => { + if (ele.fileType === "picture") { + srcList.push(ele.FileUrl) + } + }) + } else { + srcList = [] + } + return { ...item, - supplierNumber: item.supplier.number + srcList } }) this.tableList.tableInfomation = list || [] - this.pagerOptions.totalCount = res.data.data.total + this.pagerOptions.totalCount = res.total } }) }, // 鎼滅储 searchClick(val) { console.log(val) + this.keyWord = val + this.pagerOptions.currPage = 1 this.getData() }, // 鏂板缓 addBtnClick() { - this.editConfig.visible = true this.editConfig.title = "鏂板缓" - }, - // 琛岀偣鍑� - tableRowClick(row) { - console.log(row) + this.editConfig.infomation = { + purchaseTypeList:[] + } this.editConfig.visible = true + }, + // 璇︽儏 + showDetail(row) { + console.log(row) + this.editConfig.autoEdit = false this.editConfig.title = "缂栬緫" - this.editConfig.infomation = { ...row } + let imageSrc = row.attachmentList?.length > 0 ? row.attachmentList[0].FileUrl : "" + this.editConfig.infomation = { ...row, imageSrc: imageSrc } + this.editConfig.visible = true + }, + // 缂栬緫 + editRow(row) { + this.editConfig.autoEdit = true + this.editConfig.title = "缂栬緫" + let imageSrc = row.attachmentList?.length > 0 ? row.attachmentList[0].FileUrl : "" + this.editConfig.infomation = { ...row, imageSrc: imageSrc } + this.editConfig.visible = true }, // 鍒囨崲鍒楄〃灞曠幇褰㈠紡 selIconSwitchClick(value) { + this.pagerOptions.currPage = 1 this.isIconIndex = value - } + if (value === "1") { + this.pageSizes = [30, 60] + this.pagerOptions.pageSize = 30 + } else { + this.pageSizes = [15, 30] + this.pagerOptions.pageSize = 15 + } + this.getData() + }, + // 鍒犻櫎浜у搧绫诲瀷 + delSelectClick() { + this.categoryId = 0 + this.getData() + }, + imgClick() {} } } </script> @@ -294,8 +375,8 @@ justify-content: flex-start; align-content: flex-start; .product-box { - width: 295px; - height: 84px; + width: 294px; + height: 94px; margin-bottom: 10px; margin-right: 20px; border: 1px solid #dee2e6; @@ -304,30 +385,47 @@ -webkit-box-shadow: inset 0 0 2px #dee2e6; padding: 8px; display: flex; + align-items: center; + cursor: pointer; .left { width: 60px; text-align: center; + .img-view { + width: 60px; + height: 80px; + line-height: 80px; + border: 1px solid #dee2e6; + font-size: 22px; + color: #b8babb; + } } .right { flex: 1; font-size: 13px; margin-left: 10px; .label { + // max-height: 30px; color: #212529; + // margin-top: -5px; margin-right: 15px; word-break: break-all; word-wrap: break-word; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; } .price, .library { color: #495057; - margin-top: 3px; + margin-top: 10px; } } } } .product-list { - height: calc(100% - 65px); + height: calc(100% - 70px); } ::v-deep { .el-table { -- Gitblit v1.8.0