From e1a3c04432d808ca27e1158095d2564cd81ea379 Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期三, 15 十一月 2023 19:22:16 +0800 Subject: [PATCH] 表格公共组件修改合并 --- src/views/warehouseManage/listingRules/index.vue | 83 ++++++++++---------- src/components/makepager/CommonFormTableView.vue | 153 ++++++++++++++++++++++++++------------ 2 files changed, 144 insertions(+), 92 deletions(-) diff --git a/src/components/makepager/CommonFormTableView.vue b/src/components/makepager/CommonFormTableView.vue index 11126c9..84d708e 100644 --- a/src/components/makepager/CommonFormTableView.vue +++ b/src/components/makepager/CommonFormTableView.vue @@ -163,14 +163,47 @@ v-for="(item, index) in selLocationOptions" :key="index" :label="item.jointName" - :value="{ value: item.id, label: item.jointName}" + :value="{ value: item.id, label: item.jointName }" + > + </el-option> + </el-select> + </div> + </el-form-item> + <!-- 浜у搧鍒拌揪浣嶇疆 --> + <el-form-item v-else-if="item.toLocation" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop"> + <div class="custom-name"> + <span v-if="scope.row.isEdit || scope.row.editable">{{ + scope.row[item.prop]?.label ?? scope.row[item.prop] + }}</span> + <el-select + v-else + v-model="scope.row[item.prop]" + placeholder="璇烽�夋嫨" + size="mini" + filterable + style="width: 80%" + @change=" + (val) => { + selLocationClick(val, item.prop) + } + " + > + <el-option + v-for="(item, index) in selToLocationOptions" + :key="index" + :label="item.jointName" + :value="{ value: item.id, label: item.jointName }" > </el-option> </el-select> </div> </el-form-item> <!-- 瀛愪綅缃� --> - <el-form-item v-else-if="item.sonLocation" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop"> + <el-form-item + v-else-if="item.sonLocation" + label=" " + :prop="'tableData.' + scope.$index + '.' + item.prop" + > <div class="custom-name"> <span v-if="scope.row.isEdit || scope.row.editable">{{ scope.row[item.prop]?.label ?? scope.row[item.prop] @@ -191,7 +224,7 @@ v-for="(item, index) in selSonLocationOptions" :key="index" :label="item.jointName" - :value="{ value: item.id, label: item.jointName}" + :value="{ value: item.id, label: item.jointName }" > </el-option> </el-select> @@ -233,7 +266,7 @@ <!-- 浜у搧 --> <el-form-item v-else-if="item.product" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop"> <div class="custom-name"> - <span v-if="scope.row.isEdit || scope.row.editable">{{ scope.row.productName}}</span> + <span v-if="scope.row.isEdit || scope.row.editable">{{ scope.row.productName }}</span> <!-- <el-select v-else v-model="scope.row[item.prop]" @@ -285,8 +318,8 @@ :prop="'tableData.' + scope.$index + '.' + item.prop" > <div class="custom-name"> - <span v-if="scope.row.isEdit || scope.row.editable">{{scope.row.productCategory }}</span> - + <span v-if="scope.row.isEdit || scope.row.editable">{{ scope.row.productCategory }}</span> + <!-- <el-select v-else v-model="scope.row[item.prop]" @@ -430,7 +463,7 @@ tableData: [], // 鎺ュ彛杩斿洖鏁版嵁 tableColumn: [ // table琛ㄥ崟 - { label: "", prop: "", min: 200, tooltip: true} + { label: "", prop: "", min: 200, tooltip: true } ] } } @@ -467,14 +500,15 @@ { id: 2, name: "鎵�" } ], selLocationOptions: [], // 浣嶇疆 - selSonLocationOptions:[], //瀛愪綅缃� + selSonLocationOptions: [], //瀛愪綅缃� + selToLocationOptions: [], // 浜у搧鍒拌揪浣嶇疆 companyOptions: [], // 鍏徃 selRouteOptions: [{ id: 1, name: "鍒堕��" }], // 璺嚎 locacionName: "", locacionId: 0, productName: "", productId: "", - initialPosition:"" + initialPosition: "" } }, created() { @@ -488,7 +522,7 @@ this.getProductCategoryList() } if (this.islistingrules) { - this.getLocationList() + this.getToLocationList() // this.getCompanyList() } this.tableList = this.productTableList @@ -517,10 +551,10 @@ async handleSelectClient(value, item) { this.$emit("selProductClick",value,item) if (value === "product") { - if(item.categoryId===0||item.categoryName===""){ - this.productTypeNameOptions =[] - this.tableList.tableData[this.tableList.rowClickIndex].productCategory='' - }else{ + if (item.categoryId === 0 || item.categoryName === "") { + this.productTypeNameOptions = [] + this.tableList.tableData[this.tableList.rowClickIndex].productCategory = "" + } else { await getProductCategoryList({ categoryId: item.categoryId, keyWord: item.categoryName, @@ -530,37 +564,37 @@ if (res.code === 200) { const list = res.data ? res.data : [] this.productTypeNameOptions = list - this.tableList.tableData[this.tableList.rowClickIndex].productCategory=list[0].name + this.tableList.tableData[this.tableList.rowClickIndex].productCategory = list[0].name } }) } - }else if(value==="productType"){ + } else if (value === "productType") { console.log("浜у搧绫诲瀷閫変腑") } }, querySearchAsync(queryString, cb, value) { - let restaurants='' - if(value==="product"){ - restaurants = this.productNameOptions - }else if(value==="productType"){ - restaurants = this.productTypeNameOptions + let restaurants = "" + if (value === "product") { + restaurants = this.productNameOptions + } else if (value === "productType") { + restaurants = this.productTypeNameOptions } var results = queryString ? restaurants.filter(this.createStateFilter(queryString, value)) : restaurants cb(results) - if(results.length===0){ - this.productTypeNameOptions=[] + if (results.length === 0) { + this.productTypeNameOptions = [] } - console.log(results,"results",value) - this.$emit("querySearchData",queryString,results,value) + console.log(results, "results", value) + this.$emit("querySearchData", queryString, results, value) }, createStateFilter(queryString) { return (state) => { - return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 + return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 } }, // 娓呴櫎閫変腑浜у搧 setValueNull(val) { - console.log(val,"鐪嬬湅val") + console.log(val, "鐪嬬湅val") }, // 搴撳瓨璋冩暣鑾峰彇浣嶇疆鍜屼骇鍝� @@ -573,7 +607,7 @@ if (res.code === 200) { const list = res.data ? res.data : [] this.selLocationOptions = list.locationList - this.selSonLocationOptions=list.locationList + this.selSonLocationOptions = list.locationList this.productNameOptions = list.productList } }) @@ -602,12 +636,34 @@ page: 1, pageSize: 100 }).then((res) => { - console.log(res,"newlocal") + console.log(res, "newlocal") if (res.code === 200) { const list = res.data ? res.data : [] this.selLocationOptions = list - this.selSonLocationOptions=list - console.log(list,"999") + this.selSonLocationOptions = list + console.log(list, "999") + if (this.isReorder) { + this.locacionName = list[0]?.name + this.locacionId = list[0]?.id + this.$emit("selLocationClick", list[0], "locacionName") + } + } + }) + }, + // 浜у搧鍒拌揪浣嶇疆 + async getToLocationList() { + await getLocationList({ + // keyword: "", + type: 3, + page: 1, + pageSize: 100 + }).then((res) => { + console.log(res, "newlocal") + if (res.code === 200) { + const list = res.data ? res.data : [] + this.selToLocationOptions = list + this.selSonLocationOptions = list + console.log(list, "999") if (this.isReorder) { this.locacionName = list[0]?.name this.locacionId = list[0]?.id @@ -617,17 +673,17 @@ }) }, // 璁剧疆瀛愪綅缃� - async setLocationList(jointName){ + async setLocationList(jointName) { await getLocationList({ // keyword: "", jointName: jointName, page: 1, pageSize: 100 }).then((res) => { - console.log(res,"newlocal") + console.log(res, "newlocal") if (res.code === 200) { const list = res.data ? res.data : [] - this.selSonLocationOptions=list + this.selSonLocationOptions = list // if (this.isReorder) { // this.locacionName = list[0]?.name // this.locacionId = list[0]?.id @@ -685,7 +741,7 @@ if (res.code === 200) { const list = res.data ? res.data : [] this.selLocationOptions = list.locationList - this.selSonLocationOptions=list.locationList + this.selSonLocationOptions = list.locationList } }) } @@ -706,10 +762,10 @@ // this.$emit("selProductTypeClick", item) }, // 浜у搧绫诲瀷鑾峰彇鐒︾偣 - productTypeFocus(){ + productTypeFocus() { getProductCategoryList({ categoryId: 0, - keyWord:"", + keyWord: "", page: 1, pageSize: 15 }).then((res) => { @@ -721,8 +777,8 @@ }, // 閫夋嫨浣嶇疆 selLocationClick(item, prop, row) { - console.log(item,prop,row,"璧峰浣嶇疆") - if(prop==="areaName"){ + console.log(item, prop, row, "璧峰浣嶇疆") + if (prop === "areaName") { // this.initialPosition=item.label getLocationList({ jointName: item.label, @@ -731,7 +787,7 @@ }).then((res) => { if (res.code === 200) { const list = res.data ? res.data : [] - this.selSonLocationOptions=list + this.selSonLocationOptions = list if (this.isReorder) { this.locacionName = list[0]?.name this.locacionId = list[0]?.id @@ -760,8 +816,8 @@ this.$emit("selLocationClick", item, prop) }, // 閫夋嫨瀛愪綅缃� - selSonLocationClick(item){ - this.$emit("selSonLocationClick",item) + selSonLocationClick(item) { + this.$emit("selSonLocationClick", item) }, // 鑾峰彇鍦ㄥ簱涓庨娴嬫暟閲� getAmountAndPrediction(item, val, ite) { @@ -913,16 +969,15 @@ font-size: 13px; cursor: pointer; } - } } } ::v-deep { - .el-autocomplete{ - height:28px; - .el-input{ - height:28px ; - .el-input__inner{ + .el-autocomplete { + height: 28px; + .el-input { + height: 28px; + .el-input__inner { height: 28px; } } @@ -964,7 +1019,7 @@ height: 35px; text-align: center; } -::v-deep .el-table__body-wrapper{ +::v-deep .el-table__body-wrapper { height: unset !important; } </style> diff --git a/src/views/warehouseManage/listingRules/index.vue b/src/views/warehouseManage/listingRules/index.vue index 22a6742..bd4fda5 100644 --- a/src/views/warehouseManage/listingRules/index.vue +++ b/src/views/warehouseManage/listingRules/index.vue @@ -27,7 +27,7 @@ @querySearchData="querySearchData" @selProductClick="selProductClick" > - <!-- + <!-- @selProductTypeClick="selProductTypeClick" --> <template slot="tableButton"> @@ -82,8 +82,8 @@ queryProductId: null, categoryId: null, searchTaskMap: [], - isCreate:false, - thatRow:{}, + isCreate: false, + thatRow: {} } }, created() { @@ -111,13 +111,13 @@ selectBox: false, selectIndex: true, tableColumn: [ - { label: "褰撲骇鍝佸埌杈�", prop: "areaName", location: true }, + { label: "褰撲骇鍝佸埌杈�", prop: "areaName", toLocation: true }, { label: "浜у搧", prop: "productName", product: true }, { label: "浜у搧绫诲埆", prop: "productCategory", productType: true }, { label: "瀛樺偍鍒板瓙浣嶇疆", prop: "subLocation", sonLocation: true } // { label: "鍏徃", prop: "companyName", company: true } ], - rowClickIndex:-1 + rowClickIndex: -1 } }, // 璇锋眰鏁版嵁 @@ -157,7 +157,7 @@ }, // 鏂板 addProductClick() { - this.isCreate=true + this.isCreate = true this.tableList.tableColumn[1].product = true this.tableList.tableColumn[2].productType = true console.log(this.tableData) @@ -177,7 +177,7 @@ subLocation: "", productName: "", companyName: "", - productCategory:"", + productCategory: "", isSet: true, isEdit: false, isOrder: true @@ -213,14 +213,14 @@ areaId: this.areaId, locationId: this.subLocationId, productCategoryId: this.productCategoryId, - productId: this.productId + productId: this.productId }).then((res) => { console.log(res) if (res.code === 200) { this.getData() let tipStr = this.currentRowId === 0 ? "娣诲姞鎴愬姛" : "淇敼鎴愬姛" this.$message.success(tipStr) - this.isCreate=false + this.isCreate = false } }) } @@ -240,7 +240,7 @@ // 鍙栨秷 discardBtnClick() { this.getData() - this.isCreate=false + this.isCreate = false this.tableList.tableColumn[1].product = true this.tableList.tableColumn[2].productType = true this.addTitle = "鏂板缓" @@ -279,21 +279,20 @@ }, // 琛岀偣鍑� tableRowClick(row, rowIndex) { - - this.thatRow=row - this.tableList.rowClickIndex=rowIndex + this.thatRow = row + this.tableList.rowClickIndex = rowIndex this.rowIndex = rowIndex this.isSel() if (!this.isNoProduct && this.currentRowId === 0) { this.$message.error("璇峰畬鎴愬綋鍓嶆柊寤烘垨鍙栨秷鏂板缓") - }else { - this.currentRowId = row.id||0 + } else { + this.currentRowId = row.id || 0 this.addTitle = "淇濆瓨" this.showDiscard = true this.isRowClick = true if (this.isNoProduct) { // this.tableData.splice(this.tableData.length - 1, 1) - this.tableData.map((item, index) => { + this.tableData.map((item, index) => { if (index === rowIndex) { item.isEdit = false item.isOrder = true @@ -308,25 +307,25 @@ } } }, - querySearchData(queryString,results,value){ - if(this.isCreate){ - if(queryString===''){ + querySearchData(queryString, results, value) { + if (this.isCreate) { + if (queryString === "") { this.tableList.tableColumn[1].product = true this.tableList.tableColumn[2].productType = true - }else{ - if(value==="product"){ + } else { + if (value === "product") { this.tableList.tableColumn[2].productType = false - if(results.length!==0){ - this.productId=results[0].id - }else{ - this.productId=0 + if (results.length !== 0) { + this.productId = results[0].id + } else { + this.productId = 0 } - }else if(value==="productType"){ + } else if (value === "productType") { this.tableList.tableColumn[1].product = false - if(results.length!==0){ - this.productCategoryId=results[0].id - }else{ - this.productCategoryId=0 + if (results.length !== 0) { + this.productCategoryId = results[0].id + } else { + this.productCategoryId = 0 } } } @@ -368,14 +367,14 @@ this.subLocationId = item.value }, // 閫変腑浜у搧鏂规硶 - selProductClick(value,item){ - if(value==="product"){ + selProductClick(value, item) { + if (value === "product") { this.RuleType = 1 this.tableList.tableColumn[2].productType = false - this.productId=item.id - this.productCategoryId=item.categoryId - }else if(value==="productType"){ - this.productCategoryId=item.id + this.productId = item.id + this.productCategoryId = item.categoryId + } else if (value === "productType") { + this.productCategoryId = item.id this.RuleType = 2 this.tableList.tableColumn[1].product = false } @@ -399,19 +398,17 @@ }, watch: { rowIndex(newVal) { - if(this.isCreate){ - if(newVal===0){ + if (this.isCreate) { + if (newVal === 0) { this.tableList.tableColumn[1].product = true this.tableList.tableColumn[2].productType = true - }else{ + } else { this.$message.error("璇峰畬鎴愬綋鍓嶆柊寤烘垨鍙栨秷鏂板缓") this.tableList.tableColumn[1].product = false this.tableList.tableColumn[2].productType = false } - }else{ - if ( - this.tableList.tableData[newVal].productName === "" - ) { + } else { + if (this.tableList.tableData[newVal].productName === "") { this.tableList.tableColumn[1].product = false this.tableList.tableColumn[2].productType = true } else { -- Gitblit v1.8.0