From ec77d5b6a4d6be3423b7723cf5e1333f599b0751 Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期一, 04 三月 2024 17:58:19 +0800 Subject: [PATCH] 销售机会模块 新建操作的时候,销售阶段默认为初期沟通+销售预测的币种默认人民币+产品管理部分币种隐藏 --- src/components/makepager/CommonFormTableView.vue | 287 +++++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 237 insertions(+), 50 deletions(-) diff --git a/src/components/makepager/CommonFormTableView.vue b/src/components/makepager/CommonFormTableView.vue index 3981921..1bf5fa7 100644 --- a/src/components/makepager/CommonFormTableView.vue +++ b/src/components/makepager/CommonFormTableView.vue @@ -2,12 +2,18 @@ <div class="page-view"> <el-form ref="form" :model="tableList" :show-message="false" label-position="right"> <el-table + ref="fromTable" :data="tableList.tableData" :show-summary="showSummary.show" :summary-method="getSummaries" :span-method="arraySpanMethod" style="width: 100%" + @selection-change="handleSelectionChange" + :row-key="(row) => row.productId" > + <el-table-column v-if="selectBox" type="selection" :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" @@ -35,9 +41,10 @@ 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> @@ -46,13 +53,13 @@ v-else-if="item.productName" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop" - :rules="[{ required: item.isRequird ? true : false, message: '浜у搧鍚嶇О涓嶈兘涓虹┖' }]" > <div class="custom-name"> <el-autocomplete v-model="scope.row[item.prop]" :fetch-suggestions="querySearchAsync" value-key="name" + :disabled="!isOperate" size="mini" @select=" (val) => { @@ -60,11 +67,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)"> - <i class="el-icon-edit-outline" title="娓呴櫎"></i> + <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> @@ -75,7 +94,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 @@ -89,11 +114,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> @@ -109,36 +135,70 @@ 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> </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" type="primary" @click="recalculate">閲嶇畻</el-button> + <el-button size="small" type="primary" :disabled="!isOperate" @click="empty">娓呯┖</el-button> + <el-button size="small" type="primary" @click="recalculate" :disabled="isRecalculate && !isOperate ? false : true" + >閲嶇畻</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> @@ -148,7 +208,10 @@ <SelectCommonDialog v-if="editSelCommonConfig.editVisible" :edit-common-config="editSelCommonConfig" + :selectBoxList="tableList.tableData" + :quotationNumber="quotationNumber" @selClient="selClient" + @getSelectArray="getSelectArray" /> </div> </template> @@ -164,11 +227,36 @@ type: Boolean, default: false }, + 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 } @@ -196,30 +284,50 @@ tableList: [], editSelCommonConfig: { editVisible: false, + isSelectBox: false, title: "", infomation: {} }, - productIndex: 0 + productIndex: 0, + isRecalculate: true } }, created() { - this.getProductList() - this.tableList = this.productTableList + if (!this.selectBox) { + this.getProductList() + } + this.getTableInfo() + }, + watch:{ + "productTableList": { + handler() { + this.getTableInfo() + }, + immediate: true + } }, computed: {}, methods: { + getTableInfo(){ + this.tableList = this.productTableList + if (this.tableList.tableData.length === 1 && this.tableList.tableData[0].name === "") { + this.isRecalculate = false + } else { + this.isRecalculate = true + } + }, // 浜у搧鍚嶇О async getProductList() { await getProductList({ productName: "", productNumber: "", page: 1, - pageSize: 5 + pageSize: 100 }).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 + console.log(res, "浜у搧鍚嶇О") + if (res.code === 200) { + if (res.data.data && res.data.data.length > 0) { + this.productList = res.data.data } } }) @@ -227,6 +335,7 @@ handleReserve(row) { return row._id ? row._id : row.id }, + // 澶氶�� handleSelectionChange(val) { this.$emit("getSelectArray", val) }, @@ -256,9 +365,13 @@ sums[index] = "灏忚:" return } - const title = ["#"] + const title = ["#", "浜у搧鍚嶇О", "浜у搧缂栧彿", "鍗曚綅", "閿�鍞崟浠�", "鎴愭湰鍗曚环"] // 鍘婚櫎鏌愪簺涓嶉渶瑕佽绠楃殑鏁版嵁 if (title.includes(column.label)) { + sums[index] = "" + return + } + if (this.pageName == "quotation" && column.label == "姣涘埄") { sums[index] = "" return } @@ -314,16 +427,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.price + } + }) + } + 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 == "price" || prop == "cost") { + if (scope.row.price && scope.row.cost) { + let profit = Number(scope.row.price) - Number(scope.row.cost) + scope.row.profit = profit + "" + let margin = (((Number(scope.row.price) - 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") + }, + // 鍒犻櫎 + deleteClick(scope) { + this.tableList.tableData.splice(scope.$index, 1) + this.$forceUpdate() + this.$message.success("鍒犻櫎鎴愬姛锛�") + this.$emit("deleteClick", scope) }, // 閲嶇畻 recalculate() { @@ -353,6 +507,7 @@ }, 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) { @@ -360,32 +515,51 @@ ite.number = item.number ite.price = item.price ite.total = item.amount ? item.amount * item.price : 1 * item.price + ite.unit = item.unit } }) }, - selClientClick(row, prop) { - console.log(row, prop) - this.productIndex = row.productId - 1 + // 鏂板 + selClientClick(scope, prop) { + console.log(scope, prop) + 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.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.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 + ite.unit = item.unit + } + }) + } else { + this.$message.error("涓嶈兘閫夋嫨閲嶅鐨勪骇鍝侊紝 璇烽噸鏂伴�夋嫨") + } + }, + getSelectArray(val) { + this.$emit("getSelectArray", val, 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.name = "" @@ -393,10 +567,22 @@ ite.number = "" ite.price = 0 ite.total = 0 + ite.unit = "" } }) 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> @@ -422,7 +608,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 { @@ -433,7 +619,8 @@ padding: 0 5px; } .el-input__inner { - text-align: left; + // text-align: left; + text-align: center !important; } } </style> -- Gitblit v1.8.0