mec-cloud_-intelligent-manufacturing_crm/zkqy-ui/src/views/bussiness/dialogCompments/GongYi/GY03.vue

<template>
  <div class="form-wrap">
    <el-form
      :model="form"
      ref="form"
      :rules="rules"
      label-width="100px"
      :inline="true"
      size="normal"
      class="form-body-wrap"
    >
      <el-form-item prop="material" label="材料:">
        <el-select
          v-model="form.material"
          placeholder="请选择材料"
          clearable
          filterable
        >
          <el-option
            v-for="item in myFormData.resultMap.caiLiao"
            :key="item.materialId"
            :label="item.materialName"
            :value="item.materialId"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="technology" label="工艺:">
        <!-- <el-input v-model="form.yield" type="number"></el-input> -->
        <el-select
          v-model="form.technology"
          placeholder="请选择工艺"
          clearable
          filterable
        >
          <el-option
            v-for="item in myFormData.resultMap.gongyi"
            :key="item.id"
            :label="item.stepName"
            :value="item.id"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="生产数量" prop="productionQuantity">
        <el-col :span="10">
          <!-- <el-input
            onkeypress="return( /[\d]/.test(String.fromCharCode(event.keyCode)))"
            v-model="form.productionQuantity"
            placeholder="请输入生产数量"
            size="normal"
            clearable
          ></el-input> -->
          <el-input-number
            v-model="form.productionQuantity"
            controls-position="right"
            :min="0"
          />
        </el-col>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" size="default" @click="submitHanfler"
          >确认提交</el-button
        >
      </el-form-item>

      <!-- <el-form-item prop="remark" label="备注信息:">
        <el-input v-model="form.remark"></el-input>
      </el-form-item> -->
    </el-form>
  </div>
</template>

<script>
import { submitNodeForm } from "@/api/bpmprocess/runDialogApi/index";
export default {
  name: "GY03",
  props: ["formData", "row"],
  components: {},
  data() {
    return {
      realFormData: {},
      form: {
        material: "",
        technology: "",
        productionQuantity: 0,
      },
      rules: {
        material: [
          { required: true, message: "请选择材料", trigger: "change" },
        ],
        technology: [
          { required: true, message: "请选择工艺", trigger: "change" },
        ],
        productionQuantity: [
          { required: true, message: "请输入生产数量", trigger: "change" },
        ],
      },
    };
  },
  watch: {
    myFormData: {
      handler(nval) {
        this.realFormData = nval;
      },
      deep: true,
      immediate: true,
    },
  },
  computed: {
    myFormData() {
      return this.formData;
    },
    isEdit() {
      return this.formData.resultMap?.id ? true : false;
    },
  },
  methods: {
    async getFormData() {
      let res = {
        flag: false,
        msg: "",
      };
      try {
        let valid = await this.$refs.form.validate();
        if (valid) {
          res.flag = true;
          res.data = this.form;
          return res;
        } else {
          res.msg = "表单校验异常,请规范填写表单数据";
          return res;
        }
      } catch (error) {
        // console.log(error);
        res.msg = "表单校验异常,请规范填写表单数据";
        return res;
      }
    },
    resetForm() {
      this.$refs.form.resetFields();
    },
    async submitHanfler() {
      let res = await this.$refs.form?.validate();
      if (res) {
        let payLoad = {};
        let { material, technology, productionQuantity } = this.form;
        if (this.isEdit) {
          payLoad.updateCommonEntityList = [
            {
              basicMap: {
                tableName: "productionrecords",
              },
              addListMap: [
                {
                  material_information: material,
                  process_information: technology,
                  actual_quantity: productionQuantity,
                  taskKey: this.row.benTaskProcessKey,
                  taskNodeKey: this.row.benTaskNodeKey,
                },
              ],
            },
          ];
        } else {
          payLoad.insertCommonEntityList = [
            {
              basicMap: {
                tableName: "productionrecords",
              },
              addListMap: [
                {
                  material_information: material,
                  process_information: technology,
                  actual_quantity: productionQuantity,
                  taskKey: this.row.benTaskProcessKey,
                  taskNodeKey: this.row.benTaskNodeKey,
                },
              ],
            },
          ];
        }
        submitNodeForm(payLoad).then((response) => {
          if (response.code == 200) {
            this.$modal.msgSuccess("保存成功");
          } else {
            this.$modal.msgSuccess("保存失败,请稍后再试");
          }
        });
      }
    },
  },
  mounted() {
    this.resetForm();
  },
};
</script>

<style scoped lang="scss">
.form-body-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
</style>