soc_web/src/views/evaluationRule/addEvaluate.vue

<template>
  <div>
    <!-- :visible.sync="isShow" -->
    <DialogCom
    :visible.sync="isShow"
      :width="'500px'"
      :title="`${id ? '编辑' : '新增'}扣分规则`"
      @close="closeHandler"
      append-to-body
    >
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="计算项目" prop="indicatorNote">
          <el-input
            placeholder="请输入计算项目"
            v-model="ruleForm.indicatorNote"
            clearable
          >
          </el-input>
        </el-form-item>
        <el-form-item label="计算类型">
          <!-- 1累计数，2连续数，3 分类,4 固化值 -->
          <el-radio-group v-model="ruleForm.calculateType">
            <el-radio :label="1">累计数</el-radio>
            <el-radio :label="2">连续数</el-radio>
            <!-- <el-radio :label="3">分类</el-radio>
            <el-radio :label="4">固化值</el-radio> -->
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="连续数"
          v-if="ruleForm.calculateType == 2"
          prop="indicatorDays"
        >
          <el-input
            placeholder="请输入连续数"
            v-model.number="ruleForm.indicatorDays"
            clearable
          >
          </el-input>
        </el-form-item>
        <el-form-item label="系数" prop="itemValue">
          <el-input
            placeholder="请输入系数"
            v-model="ruleForm.itemValue"
            clearable
          >
          </el-input>
        </el-form-item>

        <el-form-item>
          <el-button @click="resetFormHandler('ruleForm')">取消</el-button>
          <el-button type="primary" @click="submitForm('ruleForm')"
            >确定</el-button
          >
        </el-form-item>
      </el-form>
    </DialogCom>
  </div>
</template>
<script>
import { guid } from "@/utils/index.js";

export default {
  name: "SocWebAddEvaluate",
  dicts: ["evaluate_type"],
  data() {
    var valiNumberPass1 = (rule, value, callback) => {
      //包含小数的数字
      let reg = /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g;
      if (value === "") {
        callback(new Error("请输入系数"));
      } else if (!reg.test(value)) {
        callback(new Error("系数只能为数字"));
      } else {
        callback();
      }
    };
    return {
      ruleForm: {
        calculateType: 1,
        indicatorDays: "",
        itemValue: "",
        indicatorNote: "",
      },
      rules: {
        indicatorNote: [{ required: true, message: "请输入计算项目" }],
        indicatorDays: [
          { type: "number", message: "连续数只能为数字" },
          { required: true, message: "请输入连续数" },
        ],
        itemValue: [{ validator: valiNumberPass1 }],
      },
      id: "", //编辑时候ID
      isShow: false,
    };
  },

  mounted() {},

  methods: {
    show() {
      this.isShow = true;
    },
    resetFormHandler() {
      this.isShow = false;
    },
    closeHandler() {
      if(this.$refs.ruleForm){


        this.$refs.ruleForm.resetFields()
      }
      this.ruleForm = {};
    },

    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.ruleForm.uid) {
            //当前是编辑
          } else {
            //当前是新增
            this.ruleForm.uid = guid();
          }
          let obj=JSON.parse(JSON.stringify(this.ruleForm))
          this.$emit("submitHandler", obj);
         
          this.isShow = false;
        } else {
          return false;
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.el-select {
  width: 100%;
}
</style>