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

<template>
  <el-dialog
    title="新增任务"
    append-to-body
    :modelValue="openShow"
    width="40%"
    @close="closeDialog"
  >
    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="auto">
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="零件号:" prop="partId">
            <el-select
              v-model="ruleForm.partId"
              placeholder="请输入"
              @change="partChange"
              clearable
              filterable
            >
              <el-option
                v-for="(item, index) in getPartOptions"
                :key="index"
                :label="item.partName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="任务类型:" prop="taskType"> 维护任务 </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="工艺版本号:" prop="version">
            <el-select v-model="ruleForm.version" placeholder="请输入" clearable filterable>
              <el-option
                v-for="(item, index) in versionOptions"
                :key="index"
                :label="item.partVersion"
                :value="item.partVersion"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="工艺员:" prop="craftMan">
            <el-select v-model="ruleForm.craftMan" placeholder="请输入" clearable filterable>
              <el-option
                v-for="(item, index) in craftManOptions"
                :key="index"
                :label="item.realName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="备注:" prop="remarks">
            <el-input v-model="ruleForm.remarks" :rows="3" type="textarea" placeholder="请输入" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template #footer>
      <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 { getPartList, getVersion, saveTask } from '@/api/processManagement/taskProcessing';
import { getRoleUserList } from '@/api/processManagement/taskDispatch';
export default {
  props: {
    showDialog: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      partList: [],
      openShow: false,
      ruleForm: {
        partId: null,
        taskType: '6',
      },
      rules: {
        partId: [{ required: true, message: '请选择', trigger: 'blur' }],
        version: [{ required: true, message: '请选择', trigger: 'blur' }],
        craftMan: [{ required: true, message: '请选择', trigger: 'blur' }],
      },
      getPartOptions: [], //零件号
      versionOptions: [], //版本号
      craftManOptions: [], //工艺员
    };
  },
  mounted() {
    this.openShow = this.showDialog;
    this.getPartList();
    this.getRoleUserList();
  },
  methods: {
    getRoleUserList() {
      getRoleUserList({ current: 1, size: 99999 }).then(res => {
        this.craftManOptions = res.data.data.records
;
      });
    },
    getPartList() {
      getPartList().then(response => {
        this.getPartOptions = response.data.data;
      });
    },
    partChange() {
      getVersion({ partId: this.ruleForm.partId }).then(res => {
        this.versionOptions = res.data.data;
      });
    },
    submit() {
      this.$refs.ruleFormRef.validate(valid => {
        if (valid) {
          // 获取零件code
          let part = this.getPartOptions.find(item => item.id === this.ruleForm.partId);
          console.log(8888, part);
          // this.ruleForm.partCode = part.partCode;
          saveTask({ ...this.ruleForm, partCode: part.partCode, partName: part.partName }).then(
            res => {
              this.$message.success('新增成功');
              this.closeDialog();
            }
          );
        }
      });
    },
    closeDialog() {
      this.openShow = false;
      this.$emit('closeDialog');
    },
  },
};
</script>
<style lang="scss" scoped></style>