Element ui简单的验证判断

<template>
<el-form class="padder" ref="form" :model="formData" :rules="rules" label-width="90px" size="small">
  <el-form-item label="审核状态" prop="signUpStatus">
    <el-radio-group v-model="formData.signUpStatus">
      <el-radio label="PASS">通过</el-radio>
      <el-radio label="REJECT">不通过</el-radio>
    </el-radio-group>
  </el-form-item>

  <el-form-item label="审核意见" prop="auditOpinion" :rules="formData.signUpStatus === 'REJECT' ? [{ required: true, message: '请输入审核意见' }] : []">
    <el-input
      type="textarea"
      v-model="formData.auditOpinion"
      maxlength="50"
      show-word-limit
      :autosize="{ minRows: 3, maxRows: 3 }">
    </el-input>
  </el-form-item>
</el-form>
</template>

<script>
import {
    
     submitEnrollCommit } from '@/api/adult/enroll-commit'
export default {
    
    
  name: 'audit-form',

  props: {
    
    
    source: {
    
    
      type: Object
    },

    action: {
    
    
      type: String
    }
  },

  data () {
    
    
    return {
    
    
      // 数据
      formData: {
    
    
        // 审核状态
        signUpStatus: '',
        // 审核意见
        auditOpinion: ''
      },
      // 验证
      rules: {
    
    
        signUpStatus: [{
    
     required: true, message: '请选择审核状态' }]
      }
    }
  },

  methods: {
    
    
    // 保存
    save () {
    
    
      return new Promise(resolve => {
    
    
        this.$refs.form.validate(valid => {
    
    
          if (valid) {
    
    
            this.$waiting.show()
            submitEnrollCommit({
    
     ...this.formData, id: this.source.id })
              .then(() => {
    
    
                this.successTip('审核成功')
                resolve(true)
              })
          } else {
    
    
            resolve(false)
          }
        })
      })
    }
  }
}
</script>

在这里插入图片描述
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/AnnyXSX/article/details/111299100