factory_web/src/views/enm_mill/other_form.vue

<template>
    <el-dialog
      :title="titleMap[mode]"
      v-model="visible"
      :size="1000"
      destroy-on-close
      @closed="$emit('closed')"
    >
      <el-container v-loading="loading">
        <el-main style="padding: 0 20px 20px 20px">
          <el-form
            ref="dialogForm"
            :model="form"
            label-width="100px"
            label-position="right"
            :rules="rules"
          >
            <el-row>
              <el-col :md="12" :sm="24">
                <el-form-item label="关联工段" prop="mgroup">
                  <el-input v-model="form.mgroup_name" placeholder="关联工段" disabled/>
                </el-form-item>
              </el-col>
              <el-col :md="12" :sm="24">
                <el-form-item label="当班班次">
                  <el-input v-model="form.shift_name" placeholder="当班班次" disabled/>
                </el-form-item>
              </el-col>
              <el-col :md="12" :sm="24">
                <el-form-item label="开始时间" prop="start_time">
                  <el-input v-model="form.start_time" placeholder="结束时间" disabled/>
                </el-form-item>
              </el-col>
              <el-col :md="12" :sm="24">
                <el-form-item label="结束时间" prop="end_time">
                  <el-input v-model="form.end_time" placeholder="结束时间" disabled/>
                </el-form-item>
              </el-col>
              <el-col :md="12" :sm="24">
                <el-form-item label="当班班组" prop="team">
                  <el-input v-model="form.team_name" placeholder="班组班长" disabled/>
                </el-form-item>
              </el-col>
              <el-col :md="12" :sm="24">
                <el-form-item label="班组班长" prop="leader_name">
                  <el-input v-model="form.leader_name" placeholder="班组班长" disabled/>
                </el-form-item>
              </el-col>
              <el-col :md="12" :sm="24">
                <el-form-item label="检测时间" prop="time">
                  <el-date-picker
                    v-model="form.time"
                    type="datetime"
                    value-format="YYYY-MM-DD HH:mm"
                    format="YYYY-MM-DD HH:mm"
                    placeholder="检测时间"
                />
                </el-form-item>
              </el-col>
              <el-col  :md="12" :sm="24" class="formUnitWrap">
                <el-form-item label="水耗统计" prop="val">
                    <el-input-number v-model="form.val" :precision="2" controls-position="right" placeholder="水耗统计" style="width: 100%;"></el-input-number>
                  </el-form-item>
                  <span class="formUnit">(t)</span>
              </el-col>
            </el-row>
          </el-form>
        </el-main>
        <el-footer>
          <el-button type="primary" :loading="isSaveing" @click="submit">保存</el-button>
          <el-button @click="visible = false">取消</el-button>
        </el-footer>
      </el-container>
    </el-dialog>
  </template>
  <script>
  export default {
    emits: ["success", "closed"],
    data() {
      return {
        loading: false,
        mode: "add",
        titleMap: {
          add: "其他能源录入",
          edit: "其他能源录入",
          show: "其他能源录入",
        },
        form: {
          type:10,
        },
        rules: {
            val: [{required: true, message: "请输入检测值", trigger: "blur"}],
            time: [{required: true, message: "请选择检测时间", trigger: "blur"}]
          },
        visible: false,
        isSaveing: false,
        keeperOptions: [],
        depOptions: [],
        selectionFilters: [],
        setFiltersVisible: false,
        teamOptions:[],
        shiftOptions:[],
      };
    },
    mounted() {
      //获取班组
      this.getTeam();
      this.getShfit();
    },
    methods: {
      getTeam(){
        this.$API.mtm.team.list.req({page:0}).then(res=>{
          this.teamOptions = res;
        })
      },
      getShfit(){
        this.$API.mtm.shift.req({page:0}).then(res=>{
          this.shiftOptions = res;
        })
      },
      //显示
      open(mode = "add") {
        this.mode = mode;
        this.visible = true;
        return this;
      },
      teamChange(data){
        let that = this;
        that.teamOptions.forEach(item=>{
          if(item.id==data){
            that.form.leader_name = item.leader_name;
            that.form.leader= item.leader;
          }
        })
      },
      //表单提交方法
      submit() {
        this.$refs.dialogForm.validate(async (valid) => {
          if (valid) {
            this.isSaveing = true;
            try {
              let obj={};
              debugger;
              obj.year_s = this.form.time.slice(0,4);
              obj.month_s = this.form.time.slice(5,7);
              obj.day_s = this.form.time.slice(8,10);
              obj.hour = this.form.time.slice(11,13);
              obj.val = this.form.val;
              obj.sflog = this.form.id;
              obj.material = '3349350755361792000';
              obj.mpoint = '3349214860667219968';
              this.$API.enm.mpoint.statCreate.req(obj).then(res=>{
                this.isSaveing = false;
                this.$emit("success", this.form, this.mode);
                this.visible = false;
                this.$message.success("操作成功");
                return res;
              })
            } catch (err) {
              //可以处理校验错误
              this.isSaveing = false;
              return err;
            }
          }
        });
      },
      //表单注入数据
      setData(data) {
        Object.assign(this.form,data);
      },
      //设置过滤项
      setFilters(filters) {
        this.selectionFilters = filters;
        this.setFiltersVisible = true;
      },
    },
  };
  </script>
  <style>
  .formUnit{
    position: absolute;
    right: -17px;
    top: 7px;
  }
  .formUnitWrap{
    position: relative;
  }
  </style>