jonhon-mes-web/src/views/processManagement/components/addBasicProcessesDialog.vue

<template>
  <el-dialog
    :title="title"
    append-to-body
    :modelValue="openShow"
    width="40%"
    @close="closeDialog"
  >
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="90px"
      class="demo-ruleForm"
    >
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="编码:" prop="code">
            <el-input
              v-model="ruleForm.code"
              placeholder="请输入"
              :disabled="disableFrom"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="名称:" prop="name">
            <el-input
              v-model="ruleForm.name"
              placeholder="请输入"
              :disabled="disableFrom"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="标准周期:" prop="cycle">
            <el-input
              v-model="ruleForm.cycle"
              placeholder="请输入"
              :disabled="disableFrom"
            ></el-input>
            <!-- <el-input-number v-model="ruleForm.cycle" controls-position="right"  :min="1" :disabled="disableFrom"></el-input-number> -->
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.isDispatch"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >不分派</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.isSpecial"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >特殊</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.isMain"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >主工序</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.eleStream"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >电流(A)</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.eleRate"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >电导率</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.phValue"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >PH</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.niValue"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >Ni+</el-checkbox
            >
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.vSpeed"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >转速/振频</el-checkbox
            >
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="" label-width="0">
            <el-checkbox
              v-model="ruleForm.cyropactorControl"
              :true-label="'1'"
              :false-label="'2'"
              :disabled="disableFrom"
              >整流机控制模式</el-checkbox
            >
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <template #footer v-if="!disableFrom">
      <span class="dialog-footer">
        <el-button @click="closeDialog">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </span>
    </template>
  </el-dialog>
</template>
<script>
import { add, getDetail } from "@/api/processManagement/basicProcesses";
export default {
  props: {
    showDialog: {
      type: Boolean,
      default: false,
    },
    moldAddMore: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: "",
    },
    id: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      openShow: false,
      disableFrom: false,
      tableData: [],
      ruleForm: {
        cycle: 0,
      },
      rules: {
        code: [{ required: true, message: "请输入", trigger: "blur" }],
        name: [{ required: true, message: "请输入", trigger: "blur" }],
        cycle: [{ required: true, message: "请输入", trigger: "blur" }],
      },
    };
  },
  mounted() {
    this.openShow = this.showDialog;
    this.disableFrom = this.title == "新增" ? false : true;
    if (this.title == "详情") {
      getDetail(this.id).then((res) => {
        this.ruleForm = res.data.data;
      });
    }
  },
  methods: {
    closeDialog() {
      this.openShow = false;
      this.$emit("closeDialog");
    },
    detailsInfo() {},

    submit() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          console.log(9999, this.ruleForm);
          add(this.ruleForm).then(
            (res) => {
              // 获取新增数据的相关字段
              this.$message({
                type: "success",
                message: "操作成功!",
              });
              // 数据回调进行刷新
              this.$emit("closeDialog", true);
            },
            (error) => {
              // loading();
            }
          );
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped></style>