factory_web/src/views/rpm/remployee_form.vue

<template>
  <el-drawer
    :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"
          :rules="rules"
          :disabled="mode == 'show'"
          label-width="80px"
        >
          <el-row>
            <el-col :md="24" :sm="12" :xs="24">
              <el-form-item label="姓名">
                <el-input
                  v-model="form.name"
                  type="text"
                  clearable
                  :disabled="mode != 'add'"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :md="24" :sm="12" :xs="24">
              <el-form-item label="手机号">
                <el-input
                  v-model="form.phone"
                  type="text"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :md="24" :sm="12" :xs="24">
              <el-form-item label="身份证号">
                <el-input v-model="form.id_number" type="text" clearable :disabled="mode == 'show'"></el-input>
              </el-form-item>
            </el-col>
            <el-col :md="24" :sm="12" :xs="24" v-if="rparty_show">
              <el-form-item label="相关方">
                <el-select v-model="form.rparty" style="width: 100%" :disabled="mode != 'add'" filterable>
                  <el-option
                    v-for="item in rpartyOptions"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :md="24" :sm="12" :xs="24">
              <el-form-item label="人员照片">
								<sc-upload v-model="form.photo" :modelValue="form.photo" title="人员照片"></sc-upload>
              </el-form-item>
            </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-drawer>
</template>

<script>
import IdentityCodeValid from '@/utils/checkIdent'
import {genTree} from "@/utils/verificate";
export default {
  emits: ["success", "closed"],
  data() {
    return {
      loading: false,
      mode: "add",
      titleMap: {
        add: "新增",
        edit: "编辑",
        show: "查看",
      },
      form: {},
      rules: {},
      visible: false,
      isSaveing: false,
      selectionFilters: [],
      setFiltersVisible: false,
      rpartyOptions: [],
      rparty_show: false
    };
  },
  mounted() {
    this.rpartyShow()
  },
  methods: {
    rpartyShow(){
      var userInfo = this.$TOOL.data.get("USER_INFO");
      if(userInfo.type=='employee'){
        this.rparty_show = true
        this.getRpartyOptions();
      }
      
    },
    //显示
    open(mode = "add") {
      this.mode = mode;
      this.visible = true;
      return this;
    },
    //相关方
     getRpartyOptions() {
        this.$API.rpm.rparty.list.req({page:0}).then(res=>{
            this.rpartyOptions = res;
        })
    },
    //表单提交方法
    submit() {
      this.$refs.dialogForm.validate(async (valid) => {
        if (valid) {
          this.form.id_number=this.form.id_number.toUpperCase();
          let ide = IdentityCodeValid( this.form.id_number )//得到 true or false
          if(ide){
            this.isSaveing = true;
            try {
              var res;
              if (this.mode == "add") {
                res = await this.$API.rpm.remployee.create.req(this.form);
              } else if (this.mode == "edit") {
                res = await this.$API.rpm.remployee.update.req(
                  this.form.id,
                  this.form
                );
              }
              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;
            }
          }else{
            this.$message.warning("请输入正确的身份证号");
          }
        }
      });
    },
    //表单注入数据
    setData(data) {
      // this.loading = true
      // const params = {
      // 	id: data.id
      // }
      // setTimeout(async ()=>{
      // 	var res = await this.$API.system.table.info.get(params)
      // 	this.loading = false
      // 	this.form = res.data
      // },400)
      Object.assign(this.form, data);
    },
    //设置过滤项
    setFilters(filters) {
      this.selectionFilters = filters;
      this.setFiltersVisible = true;
    },
  },
};
</script>

<style>
</style>