Merge branch 'master' of http://111.30.93.211:10101/r/supipe

叶松

2023-09-27 95caf74f05712c6556128eca180d555f427e289e

 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>