From 46d46b7159c3f97e3e4cb0bf00e90e27b5367325 Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期五, 29 三月 2024 18:08:22 +0800 Subject: [PATCH] 采购管理产品名称列表绑定供应商列表 --- src/components/makepager/CommonFormTableView.vue | 411 ++++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 322 insertions(+), 89 deletions(-) diff --git a/src/components/makepager/CommonFormTableView.vue b/src/components/makepager/CommonFormTableView.vue index 035740b..b722ac6 100644 --- a/src/components/makepager/CommonFormTableView.vue +++ b/src/components/makepager/CommonFormTableView.vue @@ -2,12 +2,20 @@ <div class="page-view"> <el-form ref="form" :model="tableList" :show-message="false" label-position="right"> <el-table + ref="fromTable" + :border="isBoder" :data="tableList.tableData" :show-summary="showSummary.show" :summary-method="getSummaries" :span-method="arraySpanMethod" style="width: 100%" + @selection-change="handleSelectionChange" + :row-key="getRowKeys" > + <el-table-column v-if="selectBox" type="selection" :selectable="isDisabled" :reserve-selection="true" width="40" align="center"> + + </el-table-column> + <el-table-column v-if="tableList.isReturn" type="index" label="#" width="50" align="center"></el-table-column> <el-table-column v-for="(item, i) in tableList.tableColumn" :key="i" @@ -21,10 +29,13 @@ <template slot="header"> <span v-if="item.isRequird" style="color: #f56c6c">*</span> <span>{{ item.label }}</span> + <FilterPopover @toFiltering="toFiltering" class="margin_left_3px" v-if="item.isFilter" + :layout="item.prop" :isFilterList="item.isFilterList" + :selectedListDefault="item.selectedListDefault"></FilterPopover> </template> <!-- column鏍峰紡 --> <template slot-scope="scope"> - <template v-if="!detailEnter"> + <template v-if="!detailEnter || isOperate"> <el-form-item v-if="item.input" label=" " @@ -35,13 +46,21 @@ v-model.trim="scope.row[item.prop]" maxlength="50" size="mini" + :disabled="!isOperate" @change=" (val) => { - commonInputChange(val, item.prop, scope.row) + commonInputChange(val, item.prop, scope.row, scope) } " ></el-input> </el-form-item> + <span v-else-if="item.compute">{{ calculateDifference(scope.row) }}</span> + <!-- 璋冪敤鏂规硶鏄剧ず鏂囧瓧 --> + <div v-else-if="item.isCallMethod"> + <span :class="item.isClass ? item.getClassName(scope.row[item.prop], scope.row) : ''">{{ + item.getCallMethod(scope.row[item.prop], scope.row) + }}</span> + </div> <el-form-item v-else-if="item.productName" label=" " @@ -52,6 +71,7 @@ v-model="scope.row[item.prop]" :fetch-suggestions="querySearchAsync" value-key="name" + :disabled="!isOperate" size="mini" @select=" (val) => { @@ -59,11 +79,23 @@ } " ></el-autocomplete> - <div class="common-select-btn" @click="selClientClick(scope.row, item.prop)"> - <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> + + <div + v-if="scope.row[item.prop] && scope.row[item.prop].length > 0 && isOperate" + class="common-select-btn" + @click="handleEditClient(scope, item.prop)" + > + <i class="el-icon-edit" title="缂栬緫"></i> </div> - <div class="common-select-btn" @click="clearupClient(scope.row)"> + <div + v-if="scope.row[item.prop] && scope.row[item.prop].length > 0 && isOperate" + class="common-select-btn" + @click="clearupClient(scope)" + > <i class="el-icon-remove-outline" title="娓呴櫎"></i> + </div> + <div class="common-select-btn" v-else @click="selClientClick(scope, item.prop)"> + <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> </div> </el-form-item> @@ -74,7 +106,13 @@ :rules="[{ required: item.isRequird ? true : false, message: '杈撳叆涓嶈兘涓虹┖' }]" > <!-- <el-input v-model.trim="scope.row[item.prop]" maxlength="50" size="mini"></el-input> --> - <el-date-picker v-model="scope.row[item.prop]" type="date" size="mini" style="width: 110px"> + <el-date-picker + :disabled="!isOperate" + v-model="scope.row[item.prop]" + type="date" + size="mini" + style="width: 110px" + > </el-date-picker> </el-form-item> <el-form-item @@ -88,11 +126,12 @@ placeholder="" :min="0" :controls="false" + :disabled="!isOperate" size="mini" style="width: 100%; margin-right: 5px" @change=" (val) => { - commonInputChange(val, item.prop, scope.row) + commonInputChange(val, item.prop, scope.row, scope) } " ></el-input-number> @@ -108,38 +147,72 @@ placeholder="" :min="0" :precision="2" + :disabled="!isOperate" :controls="false" size="mini" style="width: 100%; margin-right: 5px" @change=" (val) => { - commonInputChange(val, item.prop, scope.row) + commonInputChange(val, item.prop, scope.row, scope) } " ></el-input-number> </el-form-item> - <span v-else>{{ scope.row[item.prop] }}</span> + <span v-else> + <template> + {{ scope.row[item.prop] }} + </template> + </span> </template> - <span v-else>{{ scope.row[item.prop] }}</span> + <el-form-item + v-else-if="item.inputNumber && selectBox" + label=" " + :prop="'tableData.' + scope.$index + '.' + item.prop" + :rules="[{ required: item.isRequird ? true : false, message: '杈撳叆涓嶈兘涓虹┖' }]" + > + <el-input-number + v-model="scope.row[item.prop]" + placeholder="" + :min="0" + :controls="false" + :disabled="!isOperate" + size="mini" + style="width: 100%; margin-right: 5px" + @change=" + (val) => { + commonInputChange(val, item.prop, scope.row, scope) + } + " + ></el-input-number> + </el-form-item> + <span v-else style="text-align: right">{{ scope.row[item.prop] }}</span> + + </template> + <!-- <template slot-scope="scope" v-if="item.compute"> + </template> --> + </el-table-column> + <!-- <el-table-column label="鍓╀綑鏀惰揣鏁伴噺"> + </el-table-column> --> + <el-table-column label="鎿嶄綔" width="40" v-if="!detailEnter" align="center"> + <template slot-scope="scope"> + <el-button type="text" size="small" :disabled="!isOperate" @click="deleteClick(scope)">鍒犻櫎</el-button> </template> </el-table-column> + <slot name="tableButton" /> </el-table> </el-form> <div v-if="!detailEnter" style="margin: 10px"> - <el-button size="small" type="primary" @click="add">鏂板</el-button> + <el-button size="small" type="primary" :disabled="!isOperate" @click="add">鏂板</el-button> <!-- <el-button size="small" type="primary" disabled>瀵煎叆鏄庣粏</el-button> --> - <el-button size="small" type="primary" @click="empty">娓呯┖</el-button> - <el-button size="small" v-if="recalculateShow" type="primary" @click="recalculate" :disabled="isRecalculate ? false : true" - >閲嶇畻</el-button - > + <el-button size="small" type="primary" :disabled="!isOperate" @click="empty">娓呯┖</el-button> </div> - <div v-if="showSummary.total || showSummary.refundable" style="height: 42px; line-height: 42px"> + <div v-if="false && (showSummary.total || showSummary.refundable)" style="height: 42px; line-height: 42px"> <el-row :gutter="10"> - <el-col v-if="showSummary.total" :span="2" :offset="22"> + <el-col v-if="showSummary.total" :span="3" :offset="21"> <span style="font-weight: bold">鍚堣</span> <span style="margin-left: 10px">{{ total }}</span> </el-col> - <el-col v-if="showSummary.refundable" :span="2" :offset="22"> + <el-col v-if="showSummary.refundable" :span="3" :offset="21"> <span style="font-weight: bold">搴旈��娆�</span> <span style="margin-left: 10px">0.00</span> </el-col> @@ -149,27 +222,70 @@ <SelectCommonDialog v-if="editSelCommonConfig.editVisible" :edit-common-config="editSelCommonConfig" + :sign="sign" + :selectBoxList="tableList.tableData" + :quotationNumber="quotationNumber" @selClient="selClient" + @getSelectArray="getSelectArray" /> </div> </template> <script> -import { getProductList } from "@/api/common/other" +import { getProductListFromGrpc, getProductList } from "@/api/productManage/product" import SelectCommonDialog from "@/views/other/commonDialog/SelectCommonDialog" +import FilterPopover from "@/components/makepager/FilterPopover"; export default { name: "CommmonFormTableView", - components: { SelectCommonDialog }, + components: { SelectCommonDialog ,FilterPopover}, props: { detailEnter: { type: Boolean, default: false + }, + // selection 閫夋嫨鐘舵�� 椤甸潰 + name: { + type: String, + default: "", + }, + isBoder:{ + type: Boolean, + default: false + }, + sign: { + type: String, + default: "" + }, + selectBox: { + type: Boolean, + default: false + }, + // 閭d釜椤甸潰 鐢ㄦ潵鍒ゆ柇璁$畻鏂瑰紡 + pageName: { + type: String, + default: "" + }, + // 鍒楄〃鏂板鏄惁澶氶�� + addTypeIdMultiple: { + type: Boolean, + default: false + }, + // 鏍规嵁鎶ヤ环鍗曟煡璇骇鍝� + quotationNumber: { + type: [String, Number], + default: "" + }, + // 鏄惁鍙互鎿嶄綔 娣诲姞绛� + isOperate: { + type: Boolean, + default: true }, productTableList: { type: Object, default: () => { return { tableData: [], // 鎺ュ彛杩斿洖鏁版嵁 + isReturn: false, tableColumn: [ // table琛ㄥ崟 { label: "", prop: "", min: 200, tooltip: true } @@ -185,16 +301,10 @@ total: false, refundable: false, sumProp: [], - titleProp:["#", "浜у搧鍚嶇О"], mergeNumber: 1 } } - }, - recalculateShow:{ - type:[Boolean], - defalut:true, - }, - + } }, data() { return { @@ -203,36 +313,77 @@ tableList: [], editSelCommonConfig: { editVisible: false, + isSelectBox: false, title: "", - infomation: {} + infomation: {}, + supplierId:null, }, productIndex: 0, - isRecalculate: true + supplierId:null, } }, created() { - this.getProductList() - this.tableList = this.productTableList - if (this.tableList.tableData.length === 1 && this.tableList.tableData[0].name === "") { - this.isRecalculate = false - } else { - this.isRecalculate = true + if (!this.selectBox) { + this.getProductList() } + this.getTableInfo() + }, + watch: { + productTableList: { + handler() { + this.getTableInfo() + }, + immediate: true + }, + supplierId(n,o) { + this.editSelCommonConfig.supplierId=n + console.log(n,o,"鐪嬬湅閭�") + } }, computed: {}, methods: { + // 鑾峰彇row鐨刱ey鍊� + getRowKeys(row) { + let string; + string = row[this.productTableList.key?this.productTableList.key:this.productTableList.productId]; + return string; + }, + isDisabled(row){ + if (this.name == "rework") { + if (row.status == 1) { + return true; + } else { + return false; + } + }else { + return true; + } + }, + calculateDifference(row) { + if (row.notReceiveAmount !== null && row.nowReceiveAmount !== null) { + row.surplusReceiveAmount=row.notReceiveAmount - row.nowReceiveAmount; + return row.surplusReceiveAmount + } else { + return 0; + } + }, + toFiltering(event){ + this.$emit("toFiltering", event); + }, + getTableInfo() { + this.tableList = this.productTableList + }, // 浜у搧鍚嶇О async getProductList() { - await getProductList({ - productName: "", - productNumber: "", - page: 1, - pageSize: 5 - }).then((res) => { - console.log(res.data) - if (res.data.code === 200) { - if (res.data.data.data && res.data.data.data.length > 0) { - this.productList = res.data.data.data + let fn = this.sign == "purchase" ? getProductList : getProductListFromGrpc + await fn({ + page: 1, + pageSize: 100, + }).then((res) => { + if (res.code === 200) { + if (res.data.list && res.data.list.length > 0) { + this.productList = res.data.list + this.tableProductLists = res.data.list } } }) @@ -240,6 +391,7 @@ handleReserve(row) { return row._id ? row._id : row.id }, + // 澶氶�� handleSelectionChange(val) { this.$emit("getSelectArray", val) }, @@ -269,9 +421,13 @@ sums[index] = "灏忚:" return } - const title = this.showSummary.titleProp + const title = ["#", "浜у搧鍚嶇О", "浜у搧缂栧彿", "鍗曚綅", "閿�鍞崟浠�", "鎴愭湰鍗曚环"] // 鍘婚櫎鏌愪簺涓嶉渶瑕佽绠楃殑鏁版嵁 if (title.includes(column.label)) { + sums[index] = "" + return + } + if (this.pageName == "quotation" && column.label == "姣涘埄") { sums[index] = "" return } @@ -293,6 +449,7 @@ } if (column.property === "total") { this.total = sums[index] + this.$emit("getSummaries", this.total) } }) return sums @@ -327,32 +484,57 @@ }, // 鏂板 add() { - this.$emit("addProductClick") + if (this.addTypeIdMultiple) { + this.productIndex = this.tableList.tableData.length + this.editSelCommonConfig.title = "浜у搧鍚嶇О" + this.editSelCommonConfig.isSelectBox = true + this.editSelCommonConfig.editVisible = true + } else { + this.$emit("addProductClick") + } }, - commonInputChange(val, prop, row) { - console.log(val, prop) - console.log(row) - this.$emit("inputContent", val, prop, row) + commonInputChange(val, prop, row, scope) { + if (prop === "amount") { + this.tableList.tableData.map((ite) => { + if (ite.name === row.name) { + ite.total = row.amount * row.purchasePrice + } + }) + } + if (this.pageName == "quotation" && prop == "cost" && scope.row.cost) { + let value = scope.row.cost + let reg2 = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/ + if (!reg2.test(value) || value == 0) { + this.$message.error("鎴愭湰鍗曚环闇�瑕佸~鍐欏ぇ浜�0鐨�2浣嶅皬鏁帮紒") + return true + } + this.$forceUpdate() + } + if (this.pageName == "quotation") { + if (prop == "purchasePrice" || prop == "cost") { + if (scope.row.purchasePrice && scope.row.cost) { + let profit = Number(scope.row.purchasePrice) - Number(scope.row.cost) + scope.row.profit = profit + "" + let margin = ( + ((Number(scope.row.purchasePrice) - Number(scope.row.cost)) * 100) / + Number(scope.row.cost) + ).toFixed(2) + scope.row.margin = margin + "" + } + } + } + this.$emit("inputContent", val, prop, row, scope) }, // 娓呯┖ empty() { - this.isRecalculate = false this.$emit("emptyProductClick") }, - // 閲嶇畻 - recalculate() { - this.$confirm("纭畾瑕侀噸绠楁槑缁嗘墍鏈夎?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning" - }) - .then(() => { - this.$emit("recalculateProductClick") - this.tableList.tableData.map((ite) => { - ite.total = ite.amount ? ite.amount * ite.price : 1 * ite.price - }) - }) - .catch(() => {}) + // 鍒犻櫎 + deleteClick(scope) { + this.tableList.tableData.splice(scope.$index, 1) + this.$forceUpdate() + this.$message.success("鍒犻櫎鎴愬姛锛�") + this.$emit("deleteClick", scope) }, // 閫夋嫨浜у搧鍚嶇О鐩稿叧鏂规硶 querySearchAsync(queryString, cb) { @@ -367,52 +549,102 @@ }, handleSelectClient(item, prop, row) { // this.clientId = item.id - this.isRecalculate = true console.log(item, prop, row) this.tableList.tableData.map((ite) => { if (ite.name === item.name) { ite.amount = item.amount || 1 ite.number = item.number - ite.price = item.price - ite.total = item.amount ? item.amount * item.price : 1 * item.price + ite.purchasePrice = item.purchasePrice + ite.price = item.purchasePrice + ite.total = item.amount ? item.amount * item.purchasePrice : 1 * item.purchasePrice + ite.unit = item.unit + ite.deliveryTime = item.deliveryTime + ite.shippingDuration = item.shippingDuration + ite.modelNumber = item.modelNumber } }) }, - selClientClick(row, prop) { - console.log(row, prop) - this.productIndex = row.productId - 1 + // 鏂板 + selClientClick(scope) { + this.productIndex = scope.$index this.editSelCommonConfig.title = "浜у搧鍚嶇О" + this.editSelCommonConfig.isSelectBox = true + this.editSelCommonConfig.editVisible = true + }, + // 缂栬緫 + handleEditClient(scope, prop) { + console.log(scope, prop) + this.productIndex = scope.$index + this.editSelCommonConfig.title = "浜у搧鍚嶇О" + this.editSelCommonConfig.isSelectBox = false this.editSelCommonConfig.editVisible = true }, selClient(item) { - console.log(item) - console.log(this.tableList.tableData) - this.isRecalculate = true - // this.editConfig.infomation.client_name = row.name - this.tableList.tableData.map((ite, index) => { - if (index === this.productIndex) { - ite.name = item.name - ite.amount = item.amount || 1 - ite.number = item.number - ite.price = item.price - ite.total = item.amount ? item.amount * item.price : 1 * item.price + let list = this.tableList.tableData.map((item) => item.number) + if (list.findIndex((v) => v == item.number) == -1) { + // this.editConfig.infomation.client_name = row.name + this.tableList.tableData.map((ite, index) => { + if (index === this.productIndex) { + ite.name = item.name + ite.productId = item.id + ite.amount = item.amount || 1 + ite.number = item.number + ite.purchasePrice = item.purchasePrice + ite.price = item.purchasePrice + ite.total = item.amount ? item.amount * item.purchasePrice : 1 * item.purchasePrice + ite.unit = item.unit + ite.deliveryTime = item.deliveryTime + ite.shippingDuration = item.shippingDuration + // this.$set(this.tableList.tableData, index, ite) + // this.$forceUpdate() + } + }) + } else { + this.$message.error("涓嶈兘閫夋嫨閲嶅鐨勪骇鍝侊紝 璇烽噸鏂伴�夋嫨") + } + }, + getSelectArray(val) { + let list = val.map((item) => { + let productId = item.id + this.$delete(item, "id") + return { + ...item, + productId: productId, + amount: 1, + price: item.purchasePrice, + total: 1 * item.purchasePrice } }) + this.$emit("getSelectArray", list, this.productIndex) }, // 娓呴櫎宸查�夋嫨鐢ㄦ埛 - clearupClient(row) { - this.productIndex = row.productId - 1 + clearupClient(scope) { + this.productIndex = scope.$index this.tableList.tableData.map((ite, index) => { if (index === this.productIndex) { + ite.productId = "" ite.name = "" ite.amount = 1 ite.number = "" - ite.price = 0 - ite.total = 0 + ite.purchasePrice = 0 + ite.unit = "" + ite.deliveryTime = 0 + ite.shippingDuration = 0 } }) this.$emit("clearupProduct", this.tableList.tableData) } + // 澶氶�夎缃凡閫変腑 + // toggleSelection(rows) { + // console.log("88888888888888888888888888888888888888888") + // console.log(rows) + // if (rows) { + // rows.forEach((row) => { + // this.$refs.fromTable.toggleRowSelection(row, true) + // console.log(row) + // }) + // } + // } } } </script> @@ -438,7 +670,7 @@ } .el-table__footer-wrapper tbody td.el-table__cell { background-color: #fff; - text-align: right; + // text-align: right; font-weight: bold; } .el-input--suffix .el-input__inner { @@ -449,7 +681,8 @@ padding: 0 5px; } .el-input__inner { - text-align: left; + // text-align: left; + text-align: center !important; } } </style> -- Gitblit v1.8.0