From 95caf74f05712c6556128eca180d555f427e289e Mon Sep 17 00:00:00 2001 From: 叶松 <2217086471@qq.com> Date: 星期三, 27 九月 2023 09:56:31 +0800 Subject: [PATCH] Merge branch 'master' of http://111.30.93.211:10101/r/supipe --- web/src/views/ProductPlan/DuctPracticalRaw.vue | 236 ++++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 145 insertions(+), 91 deletions(-) diff --git a/web/src/views/ProductPlan/DuctPracticalRaw.vue b/web/src/views/ProductPlan/DuctPracticalRaw.vue index abfec61..0cd4233 100644 --- a/web/src/views/ProductPlan/DuctPracticalRaw.vue +++ b/web/src/views/ProductPlan/DuctPracticalRaw.vue @@ -6,11 +6,11 @@ <div class="header_item"> <span class="header_label">日期:</span> <el-date-picker v-model="datePicker" type="daterange" range-separator="至" start-placeholder="开始日期" - end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss" @change="dateChange"> + end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="dateChange"> </el-date-picker> </div> <div class="header_item"> - <el-button icon="el-icon-search" v-if="showButton('search')" @click="query">查询</el-button> + <el-button icon="el-icon-search" v-if="showButton('search')" @click="queryReset">查询</el-button> <el-button class="search_btn" icon="el-icon-plus" v-if="showButton('insert')" @click="addRow">新增</el-button> <el-button icon="el-icon-upload2" v-if="showButton('export')" @click="exportExcel">导出Excel</el-button> </div> @@ -25,13 +25,16 @@ </template> </el-table-column> <!-- --> - <el-table-column align="center" label="操作" width="74"> + <el-table-column align="center" label="操作" width="76"> <template #default="{ row }"> - <el-button size="mini" @click="copyRow(row)">复制</el-button> + <el-button class="copyBtn" size="mini" @click="copyRow(row)">复制</el-button> </template> </el-table-column> <!-- --> - <el-table-column prop="materialReleaseTime" align="center" label="时间"> + <el-table-column prop="materialReleaseTime" align="center" label="记录时间" width="136"> + </el-table-column> + <!-- --> + <el-table-column prop="dataTime" align="center" label="数据日期" width="86"> </el-table-column> <!-- --> <el-table-column prop="quantity" align="center" label="方量"> @@ -53,7 +56,7 @@ </el-table-column> </el-table-column> <!-- --> - <el-table-column label="操作" align="center" width="138"> + <el-table-column label="操作" align="center" width="140"> <template #default="{ row }"> <el-button class="table_btn" size="mini" v-if="showButton('update')" @click="updateRow(row)">修改</el-button> <el-button class="delete_btn" size="mini" v-if="showButton('delete')" @click="deleteRow(row)">删除</el-button> @@ -71,27 +74,33 @@ <!-- dialog--> <el-dialog class="prop_dialog" v-if="isRender" :title="dialogTitle" :visible.sync="asyncVisible" width="700px" @close="closeForm"> - <el-form :inline="true" size="mini" :model="form" label-width="auto" class="rule_form"> + <el-form :inline="true" size="mini" :model="form" :rules="rules" ref="ruleForm" label-width="auto" + class="rule_form"> <!-- 理论 --> - <div class="elFormTitle">理论配比(kg/m³)</div> + <div class="labelText">理论配比(kg/m³)</div> <!-- 理论配比 --> - <el-form-item v-for="item in form.materialTheory" :key="`${item.dictId}${item.releaseType}`" + <el-form-item style="width:282px" v-for="item in form.materialTheory" :key="`${item.dictId}${item.releaseType}`" :label="item.dictName"> <el-input placeholder="请输入" type="number" v-model="item.releaseData" @input="doCompute($event, item.dictId)" clearable></el-input> </el-form-item> <!-- 方量 --> - <el-form-item class="elFormTitle" type="number" label="方量(m³)" style="width:90%"> + <el-form-item class="labelText2" type="number" label="方量(m³)" style="width:574px"> <el-input placeholder="请输入" v-model="form.quantity" @input="doComputeMulti($event)"></el-input> </el-form-item> + <!-- 日期 --> + <el-form-item class="labelText2" type="number" label="数据日期" prop="dataTime" style="width:574px"> + <el-date-picker v-model="form.dataTime" placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker> + </el-form-item> <!-- 实际配比 --> - <el-form-item v-for="item in form.materialReal" :key="`${item.dictId}${item.releaseType}`" :label="item.dictName"> + <el-form-item style="width:282px" v-for="item in form.materialReal" :key="`${item.dictId}${item.releaseType}`" + :label="item.dictName"> <el-input type="number" v-model="item.releaseData" :disabled="true" clearable></el-input> </el-form-item> </el-form> <div slot="footer"> <el-button @click="asyncVisible = false">取 消</el-button> - <el-button class="submit_btn" @click="onSubmit">提 交</el-button> + <el-button class="submit_btn" @click="onSubmit('ruleForm')">提 交</el-button> </div> </el-dialog> </div> @@ -116,6 +125,9 @@ pageSize: 10, strTime: '', endTime: '' + }, + rules: { + dataTime: [{required: true, message: '请选择日期', trigger: 'change'}] }, form: null, // 表单数据 {} materialNames: [], // 原料名称 @@ -148,11 +160,9 @@ this.$api.Ducts.practicalRaw.getLists(params).then(res => { this.loading = false if (res.statusMsg === 'ok') { - this.total = res.data.total - this.dataLists = res.data.list - - this.dataLists.forEach(item => { - // 接口返回是混一起的数据,,需要清洗. + let lists = res.data.list + // 接口返回是混一起的数据,,需要清洗. + lists.forEach(item => { item.treleaseTheoryData = [] item.treleaseRealData = [] item.treleaseTheoryKeys = {} @@ -172,6 +182,8 @@ }) } }) + this.total = res.data.total + this.dataLists = lists } else { this.$message.warning(res.statusMsg) } @@ -198,13 +210,14 @@ return this.materialNameKeys[id] || '' }, setFormProps(options = {}) { - const {quantity = 1, materialTheory = [], materialReal = []} = options + const {quantity = 1, dataTime = null, materialTheory = [], materialReal = []} = options let _form = { quantity, // 方量 + dataTime, // 数据时间 materialTheory, // 原料理论信息 materialReal // 原料实际信息信息 } - if (materialTheory.length) { + if (Object.keys(options).length) { this.form = _form return } @@ -256,18 +269,22 @@ }, closeForm() { this.asyncVisible = false + this.resetForm('ruleForm') this.setFormProps() + }, + resetForm(formName) { + this.$refs[formName].resetFields() }, dateChange(dates) { dates = dates || [] - if (dates.length) { - dates[1] = dates[1].slice(0, -8) + '23:59:59' - } + // if (dates.length) { + // dates[1] = dates[1].slice(0, -8) + '23:59:59' + // } this.queryInfo.strTime = dates[0] || '' this.queryInfo.endTime = dates[1] || '' }, // 查询按钮列表信息 - query() { + queryReset() { this.queryInfo.pageNum = 1 this.queryInfo.pageSize = 10 this.getLists() @@ -276,46 +293,33 @@ this.submitMode = 'add' this.showForm() }, + // 根据 materialNameKeys 的顺序来进行数据排序. + getSortRow(row) { + const {quantity, dataTime, treleaseTheoryData, treleaseRealData} = row + const sorts = Object.keys(this.materialNameKeys) + treleaseTheoryData.sort(function (a, b) { + return (sorts.indexOf(a.dictId) - sorts.indexOf(b.dictId)) + }) + treleaseRealData.sort(function (a, b) { + return (sorts.indexOf(a.dictId) - sorts.indexOf(b.dictId)) + }) + return { + quantity, + dataTime, + materialTheory: treleaseTheoryData, + materialReal: treleaseRealData, + } + }, copyRow(row) { this.submitMode = 'copy' this.rowId = row.materialReleaseId - let _materialIds = [] - this.materialNames.forEach(item => { - _materialIds.push(item.dictId) - }) - row.treleaseTheoryData.sort(function (a, b) { - return (_materialIds.indexOf(a.dictId) - _materialIds.indexOf(b.dictId)) - }) - row.treleaseRealData.sort(function (a, b) { - return (_materialIds.indexOf(a.dictId) - _materialIds.indexOf(b.dictId)) - }) - let opts = { - quantity: row.quantity, - materialTheory: row.treleaseTheoryData, - materialReal: row.treleaseRealData, - } - this.setFormProps(opts) + this.setFormProps(this.getSortRow(row)) this.showForm() }, updateRow(row) { this.submitMode = 'update' this.rowId = row.materialReleaseId - let _materialIds = [] - this.materialNames.forEach(item => { - _materialIds.push(item.dictId) - }) - row.treleaseTheoryData.sort(function (a, b) { - return (_materialIds.indexOf(a.dictId) - _materialIds.indexOf(b.dictId)) - }) - row.treleaseRealData.sort(function (a, b) { - return (_materialIds.indexOf(a.dictId) - _materialIds.indexOf(b.dictId)) - }) - let opts = { - quantity: row.quantity, - materialTheory: row.treleaseTheoryData, - materialReal: row.treleaseRealData, - } - this.setFormProps(opts) + this.setFormProps(this.getSortRow(row)) this.showForm() }, deleteRow(row) { @@ -327,7 +331,7 @@ this.$api.Ducts.practicalRaw.delete({materialReleaseId: row.materialReleaseId}) .then(res => { if (res.statusMsg === 'ok') { - this.query() + this.queryReset() this.$message.success("删除成功!") } else { this.$message.warning(res.statusMsg) @@ -337,41 +341,44 @@ this.$message.warning("您已取消"); }) }, - onSubmit: throttle(function () { - const {quantity, materialTheory, materialReal} = this.form - let releaseData = [...materialTheory, ...materialReal] - // 为空数据,重置为0,否则接口报错 - releaseData.forEach(item => { - if (!item.releaseData) { - item.releaseData = 0 + onSubmit: throttle(function (formName) { + this.$refs[formName].validate((valid) => { + if (!valid) return false + const {quantity, dataTime, materialTheory, materialReal} = this.form + let releaseData = [...materialTheory, ...materialReal] + // releaseData是空数据需要重置为0,否则接口报错 + releaseData.forEach(item => { + if (!item.releaseData) { + item.releaseData = 0 + } + }) + let params = {quantity, dataTime, releaseData} + if (this.isUpdate) { + // 更新 + params.materialReleaseId = this.rowId + this.$api.Ducts.practicalRaw.update(params).then(res => { + if (res.statusMsg === 'ok') { + this.closeForm() + this.getLists() + this.$message.success('修改成功!') + } else { + this.$message.warning(res.statusMsg) + } + }) + } else { + // 添加 | 复制 + this.$api.Ducts.practicalRaw.insert(params).then(res => { + if (res.statusMsg === 'ok') { + this.closeForm() + this.getLists() + this.$message.success('添加成功!') + } else { + this.$message.warning(res.statusMsg) + } + }) } }) - let params = {quantity, releaseData} - if (this.isUpdate) { - // 更新 - params.materialReleaseId = this.rowId - this.$api.Ducts.practicalRaw.update(params).then(res => { - if (res.statusMsg === 'ok') { - this.closeForm() - this.getLists() - this.$message.success('修改成功!') - } else { - this.$message.warning(res.statusMsg) - } - }) - } else { - // 添加 复制 - this.$api.Ducts.practicalRaw.insert(params).then(res => { - if (res.statusMsg === 'ok') { - this.closeForm() - this.getLists() - this.$message.success('添加成功!') - } else { - this.$message.warning(res.statusMsg) - } - }) - } - }, 3000), + }, 1000), exportExcel() { let params = this.queryInfo this.$api.Ducts.practicalRaw.exportXls(params).then(res => { @@ -404,7 +411,30 @@ <style lang="scss" scoped> @import '../../style/layout-main.scss'; -.elFormTitle { +/deep/ { + &::-webkit-scrollbar { + width: 8px; + height: 8px; + } + + &::-webkit-scrollbar-corner { + background-color: transparent; + } + + &::-webkit-scrollbar-thumb { + border-radius: 10px; + box-shadow: inset 0 0 5px transparent; + background: #39B5FE; + } + + &::-webkit-scrollbar-track { + box-shadow: inset 0 0 5px transparent; + border-radius: 10px; + background: rgba(76, 188, 254, .3); + } +} + +.labelText { display: block; font-weight: bold; color: #39B5FE; @@ -428,8 +458,32 @@ } } -/deep/.prop_dialog .elFormTitle .el-form-item__label { +::v-deep .labelText2 .el-form-item__label-wrap .el-form-item__label { font-weight: bold; color: #39B5FE; } + +.el-table ::v-deep { + border: 1px solid #39B5FE; + + .copyBtn { + background-position: unset; + } + + th.el-table__cell { + border-bottom: 1px solid #39B5FE; + border-right: 1px solid #39B5FE; + background: rgba(76, 188, 254, .16) !important; + } + + tr { + background: none !important; + } + + th.el-table__cell.is-leaf, + td.el-table__cell { + border-bottom: 1px solid #39B5FE; + border-right: 1px solid #39B5FE; + } +} </style> \ No newline at end of file -- Gitblit v1.9.3