codeTableModal.vue 4.36 KB
<template>
  <a-modal
    :title="title"
    :width="800"
    :centered='true'
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleSubmit"
    @cancel="handleCancel"
    cancelText="关闭"
    style="top:20px;"
  >
    <a-spin :spinning="confirmLoading">
      <a-form :form="form">
        <template>
        <a-form-item label="码表类型:" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input placeholder="请输入码表类型" v-decorator="['parentCode', validatorRules.parentCode]"/>
        </a-form-item>
        </template>
        <a-form-item label="码表键:" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback >
          <a-input  placeholder="请输入码表键" v-decorator="['code', validatorRules.code]" />
        </a-form-item>

        <a-form-item label="码表值:" :labelCol="labelCol" :wrapperCol="wrapperCol" >
          <a-input  placeholder="请输入码表值" v-decorator="['name', validatorRules.name]" />
        </a-form-item>
        <a-form-item label="状态:" :labelCol="labelCol" :wrapperCol="wrapperCol" >
          <a-radio-group v-decorator="['status', validatorRules.status]">
            <a-radio :value="1">生效</a-radio>
            <a-radio :value="0">不生效</a-radio>
          </a-radio-group>
        </a-form-item>
        <a-form-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" >
          <a-textarea
          rows="4"
          placeholder="备注"
          v-decorator="['remark']" />
        </a-form-item>
        <a-form-item label="序号:" :labelCol="labelCol" :wrapperCol="wrapperCol" >
          <a-input  placeholder="请输入序号" v-decorator="['sort', validatorRules.sort]" />
        </a-form-item>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
  import { modifySysDictionaryCode } from '@/api/configApi'
  export default {
    name: "PasswordModal",
    data () {
      return {
        visible: false,
        confirmLoading: false,
        confirmDirty: false,
        title: '',
        validatorRules:{
          parentCode: {
            rules:[{
              required: true,
              message: '请输入码表类型'
            }]
          },
          sort: {
            rules:[{
              required: true,
              message: '请输入序号'
            }]
          },
          code: {
            rules:[{
              required: true,
              message: '请输入码表键'
            }]
          },
          name: {
            rules:[{
              required: true,
              message: '请输入码表值'
            }]
          },
          status: {
            rules:[{
              required: true,
              message: '请输入费用编号'
            }]
          },
        },

        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        form:this.$form.createForm(this),
        model: {}
      }
    },
    created () {
    },

    methods: {
      edit (record) {
        this.model = record;
        this.form.resetFields();
        this.visible = true;
        this.$nextTick(() => {
          this.form.setFieldsValue(record);
        });
      },

      add () {
        this.model = {};
        this.form.resetFields();
        this.visible = true;
        this.$nextTick(() => {
          this.form.setFieldsValue();
        });
      },

      close () {
        this.$emit('close');
        this.visible = false;
        this.disableSubmit = false;
        this.selectedRole = [];
      },
      handleSubmit () {
        // 触发表单验证
        this.form.validateFields((err, values) => {
          if (!err) {
            this.confirmLoading = true;
            let formData = values, promiseFn;
            formData.id = this.model.id
            promiseFn = modifySysDictionaryCode(formData);
            promiseFn.then((res)=>{
              if(res.status.statusCode == 0){
                this.$message.success(res.status.statusReason);
                this.$emit('ok');
              }else{
                this.$message.warning(res.status.statusReason);
              }
            }).finally(() => {
              this.confirmLoading = false;
              this.close();
            });
          }
        })
      },
      handleCancel () {
        this.close()
      }
    }
  }
</script>