From 6665e9f2c8676b812bf7579e4201ba37b0fdb5fc Mon Sep 17 00:00:00 2001 From: XiaoRuby <3114200645@qq.com> Date: 星期二, 22 八月 2023 18:03:20 +0800 Subject: [PATCH] 8-22标准库修改完成 --- src/views/standardLibrary/index.vue | 308 ++++++++++++++++++++++----------------------------- 1 files changed, 134 insertions(+), 174 deletions(-) diff --git a/src/views/standardLibrary/index.vue b/src/views/standardLibrary/index.vue index b5d5c68..f6eeba1 100644 --- a/src/views/standardLibrary/index.vue +++ b/src/views/standardLibrary/index.vue @@ -20,37 +20,8 @@ </div> <div class="library-table" style="width: 80%"> <div class="table-header"> - <div class="search-bar"> - <el-form ref="form" :inline="true" :model="searchData"> - <el-form-item> - <span>鍘熸潗鏂欑紪鐮侊細</span> - <el-input - v-model="searchData.keyword" - placeholder="璇疯緭鍏ヤ汉鍛樺悕绉�/鍘熸潗鏂欏悕绉�" - > - <i slot="prefix" class="el-input__icon el-icon-search" /> - </el-input> - </el-form-item> - <el-form-item> - <span>鍘熸潗鏂欏悕绉帮細</span> - <el-input - v-model="searchData.keyword" - placeholder="璇疯緭鍏ュ師鏉愭枡鍚嶇О" - > - <i slot="prefix" class="el-input__icon el-icon-search" /> - </el-input> - </el-form-item> - <el-form-item> - <el-button type="primary" @click="filteredTableData" - >鏌ヨ</el-button - > - <el-button type="primary" plain @click="resetBtn" - >閲嶇疆</el-button - > - </el-form-item> - </el-form> - </div> <div class="serve-btn"> + <span class="tipMsg">{{ msg !== "" ? msg : "" }}</span> <el-button type="primary" icon="el-icon-plus" @@ -60,7 +31,6 @@ <el-button class="top_div_button" icon="el-icon-delete-solid" - size="small" style="color: #00a5ff" @click="deleteListClick" >鍒犻櫎</el-button @@ -68,42 +38,6 @@ </div> </div> <div class="table-box"> - <!-- <el-table - ref="tableData" - row-key="id" - max-height="680" - :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" - :cell-style="{ textAlign: 'left' }" - :header-cell-style="{ - border: '0px', - background: '#f5f7fa', - color: '#606266', - boxShadow: 'inset 0 1px 0 #ebeef5', - textAlign: 'left', - }" - :data="tableData" - style="width: 100%" - > - <el-table-column type="index" label="搴忓彿" width="100px"> - <template v-if="scope.row.index + 1" slot-scope="scope"> - {{ scope.row.index + 1 }} - </template> - </el-table-column> - <el-table-column prop="father" label="鍚嶇О" width="320px"> - <template slot-scope="scope"> - <el-tag - size="mini" - :type="scope.row.father ? '' : 'success'" - :style="{ borderRadius: '40%', marginRight: '12px' }" - >{{ scope.row.father ? "01" : "02" }}</el-tag - > - {{ scope.row.father || scope.row.name }} - </template> - </el-table-column> - <el-table-column prop="unit" label="鍗曚綅" width="300px" /> - <el-table-column prop="required" label="鏍囧噯" width="300px" /> - <el-table-column prop="internal" label="鍐呮帶鍒�" width="300px" /> - </el-table> --> <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" @@ -142,22 +76,30 @@ label="鍗曚綅" sortable ></el-table-column> + <el-table-column label="鏍囧噯鍊�" sortable> + <template scope="scope"> + <el-input + v-if="scope.row.edit === true || scope.row.code === '[2]'" + @blur="requiredOnfocus(scope)" + v-model="scope.row.required" + placeholder="璇疯緭鍏ユ爣鍑嗗��" + ></el-input> + </template> + </el-table-column> + <el-table-column prop="internal" label="鍐呮帶鍊�" sortable> + <template scope="scope"> + <el-input + v-if="scope.row.edit === true || scope.row.code === '[2]'" + @blur="requiredOnfocus(scope)" + v-model="scope.row.internal" + placeholder="璇疯緭鍏ュ唴鎺у��" + ></el-input> + </template> + </el-table-column> </el-table> <!-- 寮瑰嚭琛ㄥ崟椤� --> <div> <!-- --> - </div> - <div> - <!-- 鍒嗛〉鍣� --> - <!-- <el-pagination - :current-page="pageParams.pageNo" - :page-sizes="[10, 15, 20, 25]" - :page-size="pageParams.pageSize" - layout="total, sizes, prev, pager, next, jumper" - :total="pageParams.total" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - /> --> </div> </div> </div> @@ -210,11 +152,11 @@ import { getMaterialList, getProductList, - getProductSonList, addMaterial, addStandards, addSpecifications, deleteListApi, + blurUpdateApi, } from "@/api/standardLibrary"; import { selectproductModelApi } from "@/api/basicData/index"; @@ -222,6 +164,8 @@ data() { return { deleteList: [], + msg: "", + isAllSelect: false, addTreeFormVisible: false, filterText: "", // 鏍囧噯搴揵om鏍� @@ -232,18 +176,8 @@ label: "name", value: "id", }, - // 鏌ヨ鏉′欢 - searchData: { - keyword: "", - }, tableData: [], oldtableData: [], - // 鍒嗛〉鍙傛暟 - pageParams: { - pageNo: 1, - pageSize: 12, - total: 0, - }, tablespecifications: [], // 閫変腑鐨勮妭鐐规暟鎹� selectData: {}, @@ -269,17 +203,13 @@ // 鑾峰彇bom鏍戠殑鏍囧噯鏁版嵁 async getStandardTree() { const { data } = await getMaterialList(); - console.log(data); this.standardTree = data.map((item) => { let name = null; switch (item.type) { - case 1: + case 0: name = "鍘熸潗鏂�"; break; - case 2: - name = "鍗婃垚鍝�"; - break; - case 3: + case 1: name = "鎴愬搧"; break; } @@ -289,19 +219,17 @@ name, }; }); - console.log(this.standardTree); // formTypeOptions // 榛樿绗竴涓洓绾ц妭鐐规悳绱紝鏂板閰嶇疆椤� const treeOptions = JSON.parse(JSON.stringify(this.standardTree)); this.getDefault(treeOptions, 0); - console.log(treeOptions); this.formTypeOptions = treeOptions; this.$nextTick().then(() => { const firstNode = document.querySelector( ".el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node" ); firstNode.click(); - // console.log(firstNode) + // console.log(firstNode); }); }, getDefault(arr, index) { @@ -313,22 +241,13 @@ item.children = null; } } - // else { - // // if ('children' in item) { - // // // - // // } else { - // // // console.log(index, item) - // // } - // } } }, // 鐐瑰嚮bom鏍戣妭鐐规柟娉� async nodeClick(data, node, element) { - // console.log('data', data) - // console.log('children' in data) // 鏄瓙鑺傜偣 if (node.level === 4) { - console.log(data, node); + this.getParentData(node.parent, node.data.name); // 瀛樹笅閫変腑鑺傜偣 this.selectData = data; // eslint-disable-next-line prefer-const @@ -338,55 +257,38 @@ return; } }, - async getTableByClick(data) { - // eslint-disable-next-line prefer-const - let { - data: { row, total }, - } = await getProductList({ - pageNo: this.pageParams.pageNo, - pageSize: this.pageParams.pageSize, - specificationsId: data.id, - }); - // console.log(row) - this.pageParams.total = total; - row = row.map((item, index) => ({ ...item, index })); - for (const item of row) { - if (item.children) { - const res = await getProductSonList({ fatherName: item.father }); - item.children = res.data; - item.id = item.father; + // 鑾峰彇鏍戣矾寰� + getParentData(node, name) { + if (node !== null) { + if (node.data.name !== undefined) { + this.msg = node.data.name + " > " + name; } + this.getParentData(node.parent, this.msg); } - this.tableData = row; + }, + async getTableByClick(data) { + await getProductList({ + specificationsId: data.id, + }).then((res) => { + res.data.forEach((i) => { + if (i.name === undefined) { + i.name = i.children[0].name; + i.unit = i.children[0].unit; + i.id = i.children[0].id; + i.required = i.children[0].required; + i.internal = i.children[0].internal; + i.edit = true; + delete i.children; + } + }); + this.tableData = res.data; + console.log(`output->this.tableData`, this.tableData); + this.selectDataList(); + }); }, specificationDetails(row) { // 璺宠浆浜у搧瑙勬牸璇︽儏椤� this.$router.push(`/standardLibrary/SpecificationDetails/${row.id}`); - }, - handleSizeChange(val) { - console.log(`姣忛〉 ${val} 鏉); - this.pageParams.pageSize = val; - this.getTableByClick(this.selectData); - }, - handleCurrentChange(val) { - console.log(`褰撳墠椤�: ${val}`); - this.pageParams.pageNo = val; - this.getTableByClick(this.selectData); - }, - // 鏌ヨ鎸夐挳 - filteredTableData() { - this.oldtableData = this.tableData; - // 鏍规嵁杈撳叆鐨勫叧閿瓧寰楀埌杩囨护鍚庣殑鏁版嵁锛屽鏋滄湁灏辨妸杩囨护鍚庣殑鏁版嵁灞曠ず鍦ㄩ〉闈笂 - const filteredtabledata = this.tableData.filter((item) => { - return item.name.includes(this.searchData.keyword); - }); - // console.log('filteredtabledata', filteredtabledata) - this.tableData = filteredtabledata; - }, - // 閲嶇疆鎸夐挳 - resetBtn() { - this.searchData.keyword = ""; - this.tableData = this.oldtableData; }, renderContent(h, { node, data, store }) { // console.log('data', data) @@ -501,20 +403,18 @@ // 鑷畾涔� if (this.isAllSelect) { val.forEach((i) => { - let isExist = false; - this.deleteList.findIndex((c) => { - if (c === i.id) { - isExist = true; - } - }); - if (!isExist && i.id !== undefined) { + if (i.id !== undefined) { this.deleteList.push(i.id); + } else { + i.children.forEach((c) => { + this.deleteList.push(c.id); + }); } }); } else { this.deleteList.splice(0, this.deleteList.length); } - // 鑷畾涔夌粨鏉� + console.log(`output->this.`, this.deleteList); }, //閫夋嫨鏌愯 selectTr(selection, row) { @@ -523,9 +423,26 @@ this.isAllSelect = row.isChecked; this.toggleSelect(row, row.isChecked, "tr"); }); + if (row.isChecked === true) { - this.deleteList.push(row.id); + if (row.children !== undefined) { + row.children.forEach((i) => { + this.deleteList.push(i.id); + }); + } else { + this.deleteList.push(row.id); + } } else if (row.isChecked === false) { + if (row.children !== undefined) { + row.children.forEach((i) => { + this.deleteList.findIndex((c, index) => { + if (c === i.id) { + this.deleteList.splice(index, 1); + return; + } + }); + }); + } this.deleteList.findIndex((c, index) => { if (c === row.id) { this.deleteList.splice(index, 1); @@ -574,6 +491,22 @@ message: res.message, type: "success", }); + this.getTableByClick(this.selectData); + }); + }, + async requiredOnfocus(scope) { + let obj = { + id: scope.row.id, + required: scope.row.required, + internal: scope.row.internal, + }; + + await blurUpdateApi(obj).then((res) => { + this.$message({ + message: res.message, + type: "success", + }); + this.getTableByClick(this.selectData); }); }, }, @@ -587,13 +520,6 @@ padding-left: 23px !important; } } -// .dialogform { -// transform: translate(-50%, -50%); -// top: 50% !important; -// left: 50% !important; -// width: 1000px; -// height: 800px; -// } .standard-library-main { width: 100vh; height: 100%; @@ -654,6 +580,7 @@ .table-header { display: flex; justify-content: space-between; + width: 100%; .el-form-item { margin-bottom: 30px !important; } @@ -665,12 +592,6 @@ display: flex; flex-direction: column; justify-content: space-between; - - .el-table { - // flex: 1; - // max-height: 680px; - // overflow-y: scroll; - } > div:nth-child(3) { // height: 20px; display: flex; @@ -689,4 +610,43 @@ } } } +.search-bar { + .el-input { + position: relative; + font-size: 0.07292rem; + display: inline-block; + width: 70%; + } +} +.firstDiv { + float: left; + width: 20px; + height: 20px; + border-radius: 50%; + background-color: #eff5ff; + margin-top: 5px; + justify-content: center; + display: flex; + align-items: center; + margin-right: 8px; +} +.el-tag.el-tag { + border-color: transparent; + background-color: transparent; +} +.el-tag.el-tag:hover { + border-color: transparent; + background-color: transparent; +} +.serve-btn { + width: 100%; + padding-bottom: 6px; + text-align: right; +} +.tipMsg { + float: left; + font-size: 16px; + font-weight: 500; + color: #999999; +} </style> -- Gitblit v1.9.3