From fc188397419e76da8e97c0782599f757fb34bd30 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期四, 14 十二月 2023 16:13:26 +0800 Subject: [PATCH] 增加编码规范功能及新建供应商和采购页面增加编码 --- src/components/makepager/CommonFormTableView.vue | 370 +++++++++++++++++++++++++++++----------------------- 1 files changed, 203 insertions(+), 167 deletions(-) diff --git a/src/components/makepager/CommonFormTableView.vue b/src/components/makepager/CommonFormTableView.vue index 951409e..aafa359 100644 --- a/src/components/makepager/CommonFormTableView.vue +++ b/src/components/makepager/CommonFormTableView.vue @@ -1,17 +1,18 @@ <template> <div class="page-view"> <el-form ref="form" :model="tableList" :show-message="false" label-position="right"> - <el-table :data="tableList.tableData" style="width: 100%"> - <el-table-column type="index" label="缂栧彿" width="50" align="center"></el-table-column> - <el-table-column - v-for="(item, i) in tableList.tableColumn" - :key="i" - :prop="item.prop" - :label="item.label" - :width="item.width" - :min-width="item.min" - align="center" - > + <el-table + :data="tableList.tableData" + style="width: 100%" + :show-summary="showSummary.show" + :summary-method="getSummaries" + :span-method="arraySpanMethod" + @row-click="rowClick" + > + <el-table-column type="index" v-if="tableList.tableColumn && tableList.tableColumn.length > 0" label="缂栧彿" + width="50" align="center"></el-table-column> + <el-table-column v-for="(item, i) in tableList.tableColumn" :key="i" :prop="item.prop" :label="item.label" + :width="item.width" :min-width="item.min" align="center"> <!-- 琛ㄥご鏍峰紡 --> <template slot="header"> <span v-if="item.isRequird" style="color: #f56c6c">*</span> @@ -19,126 +20,86 @@ </template> <!-- column鏍峰紡 --> <template slot-scope="scope"> - <template v-if="!detailEnter"> - <el-form-item - v-if="item.input" - label=" " - :prop="'tableData.' + scope.$index + '.' + item.prop" - :rules="[{ required: item.isRequird ? true : false, message: '杈撳叆涓嶈兘涓虹┖' }]" - > - <el-input - v-model.trim="scope.row[item.prop]" - maxlength="50" - size="mini" - @change=" - (val) => { - commonInputChange(val, item.prop, scope.row) - } - " - ></el-input> - </el-form-item> - <el-form-item - v-else-if="item.productName" - label=" " - :prop="'tableData.' + scope.$index + '.' + item.prop" - > - <div class="custom-name"> - <el-autocomplete - v-model="scope.row[item.prop]" - :fetch-suggestions="querySearchAsync" - value-key="name" - size="mini" - @select=" - (val) => { - handleSelectClient(val, item.prop, scope.row) - } - " - ></el-autocomplete> - <div class="common-select-btn" @click="selClientClick(scope.row, item.prop)"> - <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> - </div> - <div class="common-select-btn" @click="clearupClient(scope.row)"> - <i class="el-icon-remove-outline" title="娓呴櫎"></i> - </div> + <!-- <template v-if="!detailEnter"> --> + <el-form-item v-if="item.input" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop" + :rules="[{ required: item.isRequird ? true : false, message: '杈撳叆涓嶈兘涓虹┖' }]"> + <el-input :disabled="item.disabled" v-model.trim="scope.row[item.prop]" maxlength="50" size="mini" @change="(val) => { + commonInputChange(val, item.prop, scope.row) + } + "></el-input> + </el-form-item> + <el-form-item v-else-if="item.productName" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop"> + <div class="custom-name"> + <el-autocomplete :disabled="item.disabled" v-model="scope.row[item.prop]" + :fetch-suggestions="querySearchAsync" value-key="name" style="width: calc(100% - 70px)" size="mini" + @select="(val) => { + handleSelectClient(val, item.prop, scope.row) + } + "></el-autocomplete> + <div v-if="!item.disabled" class="common-select-btn" @click="selClientClick(scope.row, item.prop, scope)"> + <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> </div> - </el-form-item> - <el-form-item - v-else-if="item.date" - label=" " - :prop="'tableData.' + scope.$index + '.' + item.prop" - :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> - </el-form-item> - <el-form-item - v-else-if="item.inputNumber" - 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" - size="mini" - style="width: 100%; margin-right: 5px" - @change=" - (val) => { - commonInputChange(val, item.prop, scope.row) - } - " - ></el-input-number> - </el-form-item> - <el-form-item - v-else-if="item.inputFloat" - 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" - :precision="2" - :controls="false" - size="mini" - style="width: 100%; margin-right: 5px" - @change=" - (val) => { - commonInputChange(val, item.prop, scope.row) - } - " - ></el-input-number> - </el-form-item> - <span v-else>{{ scope.row[item.prop] }}</span> - </template> + <div v-if="!item.disabled" class="common-select-btn" @click="clearupClient(scope.row, scope)"> + <i class="el-icon-remove-outline" title="娓呴櫎"></i> + </div> + <div class="common-select-btn" v-if="scope.$index != 0 || !item.disabled" + @click="deleteClient(scope.row, scope)"> + <i class="el-icon-delete" title="鍒犻櫎"></i> + </div> + </div> + </el-form-item> + <el-form-item v-else-if="item.date" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop" + :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> + </el-form-item> + <el-form-item v-else-if="item.inputNumber" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop" + :rules="[{ required: item.isRequird ? true : false, message: '杈撳叆涓嶈兘涓虹┖' }]"> + <el-input-number :disabled="item.disabled" v-model="scope.row[item.prop]" placeholder="" :min="0" + :controls="false" size="mini" style="width: 100%; margin-right: 5px" @change="(val) => { + commonInputChange(val, item.prop, scope.row) + } + "></el-input-number> + </el-form-item> + <el-form-item v-else-if="item.inputFloat" label=" " :prop="'tableData.' + scope.$index + '.' + item.prop" + :rules="[{ required: item.isRequird ? true : false, message: '杈撳叆涓嶈兘涓虹┖' }]"> + <!-- 閲囪喘绠$悊 --> + <template v-if="item.multiply"> + <el-input-number :disabled="item.disabled" + :value="scope.row[showSummary.multiply[0]] * scope.row[showSummary.multiply[1]]" placeholder="" :min="0" + :precision="2" :controls="false" size="mini" style="width: 100%; margin-right: 5px" @input="(val) => { + commonInputChange(val, item.prop, scope.row) + } + "></el-input-number> + </template> + <template v-else> + <el-input-number :disabled="item.disabled" v-model="scope.row[item.prop]" placeholder="" :min="0" + :precision="2" :controls="false" size="mini" style="width: 100%; margin-right: 5px" @change="(val) => { + commonInputChange(val, item.prop, scope.row) + } + "></el-input-number> + </template> + </el-form-item> <span v-else>{{ scope.row[item.prop] }}</span> + <!-- </template> --> + <!-- <span v-else>{{ scope.row[item.prop] }}</span> --> </template> </el-table-column> </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" @click="empty">娓呯┖</el-button> - - <el-button size="small" v-if="recalculateShow" type="primary" @click="recalculate" :disabled="isRecalculate ? false : true" - >閲嶇畻</el-button - > + <el-button :disabled="tableList.disabled" size="small" type="primary" @click="add">鏂板</el-button> + <el-button :disabled="tableList.disabled" size="small" type="primary" @click="empty">娓呯┖</el-button> </div> <!-- 浜у搧鍚嶇О --> - <SelectCommonDialog - v-if="editSelCommonConfig.editVisible" - :edit-common-config="editSelCommonConfig" - @selClient="selClient" - /> + <SelectCommonDialog v-if="editSelCommonConfig.editVisible" :edit-common-config="editSelCommonConfig" :sign="sign" + @selClient="selClient" /> </div> </template> <script> -import { getProductList } from "@/api/common/other" +import { getProductListFromGrpc, getProductList } from "@/api/productManage/product" import SelectCommonDialog from "@/views/other/commonDialog/SelectCommonDialog" export default { name: "CommmonFormTableView", @@ -148,10 +109,16 @@ type: Boolean, default: false }, + sign: { + type: String, + default: "" + }, productTableList: { type: Object, default: () => { return { + tableProductList: [], + disabled: false, tableData: [], // 鎺ュ彛杩斿洖鏁版嵁 tableColumn: [ // table琛ㄥ崟 @@ -168,16 +135,16 @@ total: false, refundable: false, sumProp: [], - titleProp:["#", "浜у搧鍚嶇О"], + multiply: [], + titleProp: ["#", "浜у搧鍚嶇О"], mergeNumber: 1 } } }, - recalculateShow:{ - type:[Boolean], - defalut:true, - }, - + recalculateShow: { + type: [Boolean], + defalut: true + } }, data() { return { @@ -190,32 +157,35 @@ infomation: {} }, productIndex: 0, - isRecalculate: true + tableProductLists: [], } }, 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 - } }, computed: {}, + watch: { + productTableList() { + this.tableList = this.productTableList + }, + }, methods: { + // 閫夋嫨琛� + rowClick(row){ + this.$emit("rowClick",row) + }, // 浜у搧鍚嶇О async getProductList() { - await getProductList({ - productName: "", - productNumber: "", + let fn = this.sign == "purchase" ? getProductList : getProductListFromGrpc + await fn({ 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 + if (res.code === 200) { + if (res.data.list && res.data.list.length > 0) { + this.productList = res.data.list + this.tableProductLists = res.data.list } } }) @@ -276,6 +246,7 @@ } if (column.property === "total") { this.total = sums[index] + this.$emit("getSummaries", this.total) } }) return sums @@ -314,18 +285,15 @@ this.$emit("addProductClick") }, commonInputChange(val, prop, row) { - console.log(val, prop) - console.log(row) this.$emit("inputContent", val, prop, row) }, // 娓呯┖ empty() { - this.isRecalculate = false this.$emit("emptyProductClick") }, // 閫夋嫨浜у搧鍚嶇О鐩稿叧鏂规硶 querySearchAsync(queryString, cb) { - var restaurants = this.productList + var restaurants = this.tableProductLists var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants cb(results) }, @@ -335,56 +303,115 @@ } }, 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.ID = row.ID 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.unit = item.unit + ite.deliveryTime = item.deliveryTime + ite.shippingDuration = item.shippingDuration + ite.modelNumber = item.modelNumber } }) + if (this.detailEnter) { + this.setEditName(item, row.ID) + } + this.$emit("handleProduct",item) }, - selClientClick(row, prop) { + setEditName(item, ID) { + let selRow = { + ID: ID, + deliveryTime: item.deliveryTime, + maximumStock: item.maximumStock, + minimumStock: item.minimumStock, + modelNumber: item.modelNumber, + name: item.name, + number: item.number, + productType: item.productType, + purchasePrice: item.purchasePrice, + remark: item.remark, + shippingDuration: item.shippingDuration, + specifications: item.specifications, + supplierId: item.supplierId, + unit: item.unit + } + this.$emit("selCommonName", selRow) + }, + selClientClick(row, prop, scope) { console.log(row, prop) - this.productIndex = row.productId - 1 + this.productIndex = scope.$index this.editSelCommonConfig.title = "浜у搧鍚嶇О" 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) { + if (this.detailEnter) { + this.tableList.tableData.map((ite) => { + ite.ID 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.unit = item.unit + ite.deliveryTime = item.deliveryTime + ite.shippingDuration = item.shippingDuration + }) + this.setEditName(item, this.tableList.tableData[0].ID) + } else { + 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.unit = item.unit + ite.deliveryTime = item.deliveryTime + ite.shippingDuration = item.shippingDuration + this.$set(this.tableList.tableData, index, ite) + this.$forceUpdate() + } + }) + + console.log(this.tableList.tableData, "=====chanp") + } }, // 娓呴櫎宸查�夋嫨鐢ㄦ埛 - clearupClient(row) { - this.productIndex = row.productId - 1 + clearupClient(row, scope) { + this.productIndex = scope.$index this.tableList.tableData.map((ite, index) => { - if (index === this.productIndex) { + console.log(scope.$index) + if (scope.$index && scope.$index >= 0) { + if (index === this.productIndex) { + ite.name = "" + ite.amount = 1 + ite.number = "" + ite.purchasePrice = 0 + ite.unit = "" + ite.deliveryTime = 0 + ite.shippingDuration = 0 + } + } else { 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) }, - // 鍒犻櫎 - deleteClient(row) { - this.$emit("deleteProduct", row) + deleteClient(row, scope) { + if (this.tableList.tableData.length == 1) { + this.$message.error("鑷冲皯淇濈暀涓�鏉★紝涓嶈兘鍒櫎浜嗭紒") + return true + } + this.tableList.tableData.splice(scope.$index, 1) } } } @@ -393,10 +420,14 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> .page-view { + min-width: 100px; + .el-form-item { margin-bottom: 0; + .custom-name { display: flex; + .common-select-btn { margin-left: 5px; font-size: 18px; @@ -405,22 +436,27 @@ } } } + ::v-deep { .el-form-item__label { display: none; } + .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 { padding-right: 0px; } + .el-table .cell, - .el-table th.el-table__cell > .cell { + .el-table th.el-table__cell>.cell { padding: 0 5px; } + .el-input__inner { text-align: left; } -- Gitblit v1.8.0