<template>
  <div class="app-warp">
    <div class="detail-structure">
      <el-page-header :content="dialogType=='add'?'新增页面':'编辑页面'" @back="goBack"/>
      <div class="detail-container">
        <div class="level-title">
          <h1>基本信息</h1>
        </div>
        <el-form ref="form" :rules="rules" :model="form" label-width="120px" class="detail_form" >
          <el-row>
            <el-col :span="18">
              <el-form-item label="教师姓名" prop="NAME">
                <el-input id="NAME" ref="NAME" v-model="form.NAME" maxlength="255" placeholder="这里输入教师姓名..." title="教师姓名"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="18">
              <el-form-item label="身份证号" prop="IDENTITY_NUMBER">
                <el-input id="IDENTITY_NUMBER" ref="IDENTITY_NUMBER" v-model="form.IDENTITY_NUMBER" maxlength="255" placeholder="这里输入身份证号..." title="身份证号"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="文化程度" prop="EDUCATION_LEVEL">
                <el-select ref="EDUCATION_LEVEL" v-model="form.EDUCATION_LEVEL" clearable>
                  <el-option v-for="item in educationLevelList" :key="item.BIANMA" :label="item.NAME" :value="item.BIANMA" />
                </el-select>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="专业" prop="PROFESSION">
                <el-input id="PROFESSION" ref="PROFESSION" v-model="form.PROFESSION" maxlength="255" placeholder="这里输入专业..." title="专业"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="18">
              <el-form-item label="工作年限" prop="WORKYEAR">

                <el-input id="WORKYEAR" ref="WORKYEAR" v-model="form.WORKYEAR" type="number" maxlength="255" placeholder="这里输入工作年限..." title="工作年限" @input="form.WORKYEAR=form.WORKYEAR.replace(/^(0+)|[^\d]+/g,'')"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="18">
              <el-form-item label="考核部门" prop="ASSESSMENTDEPARTMENT">
                <el-input id="ASSESSMENTDEPARTMENT" ref="ASSESSMENTDEPARTMENT" v-model="form.ASSESSMENTDEPARTMENT" maxlength="255" placeholder="这里输入考核部门..." title="考核部门"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="18">
              <el-form-item label="考核时间" prop="ASSESSMENTTIME">
                <el-date-picker
                  id="ASSESSMENTTIME"
                  ref="ASSESSMENTTIME"
                  v-model="form.ASSESSMENTTIME"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="这里输入考核时间..."/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="18">
              <el-form-item label="考核结果" prop="ASSESSMENTRESULT">
                <el-input id="ASSESSMENTRESULT" ref="ASSESSMENTRESULT" v-model="form.ASSESSMENTRESULT" maxlength="255" placeholder="这里输入考核结果..." title="考核结果"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div class="detail_foot">
          <el-button type="primary" @click="confirm">保存</el-button>
          <el-button icon="el-icon-arrow-left" @click="goBack">返回</el-button>
        </div>
      </div>
      <el-dialog :visible.sync="dialogVisible">
        <img :src="dialogImageUrl" width="100%" alt="">
      </el-dialog>
    </div>
  </div>
</template>
<script>
import { requestFN } from '@/utils/request'
import waves from '@/directive/waves' // waves directive
// import { upload } from '@/utils/upload'
export default {
  components: { },
  directives: { waves },
  data() {
    var validateIdentity = (rule, value, callback) => {
      requestFN(
        '/user/validateIdentity',
        {
          IDENTITY_NUMBER: value
        }
      ).then((data) => {
        if (data.result == 'success') {
          if (!data.pd.ISVALIDATE) {
            callback(new Error('身份证号无效，请输入正确的身份证号码(15-18位)'))
          }
          callback()
        }
      }).catch((e) => {
        callback()
      })
    }
    return {
      imgzmUrl: require('@/assets/images/sfz-zm.png'),
      imgbmUrl: require('@/assets/images/sfz-bm.png'),
      listLoading: true,
      config: config,
      varList: [],
      pd: [],
      educationLevelList: [], // 文化程度列表
      // professionList: [], // 专业列表
      form: {
        NAME: '', // 教师姓名
        IDENTITY_NUMBER: '', // 身份证号
        EDUCATION_LEVEL: '', // 文化程度
        PROFESSION: '', // 专业
        ASSESSMENTDEPARTMENT: '',
        ASSESSMENTTIME: '',
        ASSESSMENTRESULT: '',
        WORKYEAR: ''
      },
      dialogType: 'add',
      rules: {
        NAME: [{ required: true, message: '教师姓名不能为空', trigger: 'blur' }],
        IDENTITY_NUMBER: [
          { required: true, message: '请输入身份证号', trigger: 'blur' },
          { min: 15, max: 18, message: '请输入正确的身份证号码(15-18位)', trigger: 'blur' },
          {
            pattern: /(?:^\d{15}$)|(?:^\d{18}$)|^\d{17}[\dXx]$/,
            message: '请输入正确的身份证号码(15-18位)'
          },
          { validator: validateIdentity, trigger: 'blur' }
        ],
        EDUCATION_LEVEL: [{ required: true, message: '文化程度不能为空', trigger: 'blur' }],
        PROFESSION: [{ required: true, message: '专业不能为空', trigger: 'blur' }],
        WORKYEAR: [{ required: true, message: '工作年限不能为空', trigger: 'blur' }],
        ASSESSMENTDEPARTMENT: [{ required: true, message: '考核部门不能为空', trigger: 'blur' }],
        ASSESSMENTTIME: [{ required: true, message: '考核时间不能为空', trigger: 'blur' }],
        ASSESSMENTRESULT: [{ required: true, message: '考核结果不能为空', trigger: 'blur' }]

      },
      dialogImageUrl: '',
      dialogVisible: false
    }
  },
  created() {
    this.resetForm()
    this.getDict()
    if (this.$parent.TEACHER_ID == '') {
      this.handleAdd()
    } else {
      this.handleEdit(this.$parent.TEACHER_ID)
    }
  },
  methods: {
    // 添加
    handleAdd() {
      this.dialogType = 'add'
      // this.initRuls()
    },
    // 修改
    handleEdit(ID) {
      this.dialogType = 'edit'
      requestFN(
        '/teacher/goEdit',
        {
          TEACHER_ID: ID
        }
      ).then((data) => {
        this.form = data.pd// copy obj
        // this.initRuls()
      }).catch((e) => {
      })
    },
    // 保存
    confirm() {
      this.$refs.form.validate(valid => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '数据保存中...',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          })
          requestFN(
            '/teacher/' + this.dialogType,
            this.form
          ).then((data) => {
            loading.close()
            this.$message({
              message: '教师信息保存成功。',
              type: 'success'
            })
            this.goBack()
          }).catch((e) => {
            loading.close()
          })
        } else {
          return false
        }
      })
    },
    initRuls() {
      if (this.form.IDENTITY_FILEPATH_FRONT == '' && this.form.frontFile == '') {
        this.rules.frontFile = [{ required: true, message: '请上传身份证照片（正面）' }]
      } else {
        this.rules.frontFile = [{ required: false, message: '请上传身份证照片（正面）' }]
      }
      if (this.form.IDENTITY_FILEPATH_REVERSE == '' && this.form.reverseFile == '') {
        this.rules.reverseFile = [{ required: true, message: '请上传身份证照片（反面）' }]
      } else {
        this.rules.reverseFile = [{ required: false, message: '请上传身份证照片（反面）' }]
      }
      if (this.form.DIPLOMA_FILEPATH == '' && this.form.diplomaFile == '') {
        this.rules.diplomaFile = [{ required: true, message: '请上传毕业证照片' }]
      } else {
        this.rules.diplomaFile = [{ required: false, message: '请上传毕业证照片' }]
      }
      if (this.form.CERTIFICATE_FILEPATH == '' && this.form.certificateFile == '') {
        this.rules.certificateFile = [{ required: true, message: '请上传资格证照片' }]
      } else {
        this.rules.certificateFile = [{ required: false, message: '请上传资格证照片' }]
      }
    },

    // 获取数据字典数据
    getDict: function() {
      requestFN(
        '/dictionaries/getLevels',
        {
          DICTIONARIES_ID: 'd7d80f08d73a4accbccf4fd3d8d1d867' // 文化程度PARENT_ID
        }
      ).then((data) => {
        this.educationLevelList = data.list
        // .map(function(obj) {
        //   return obj.NAME
        // })
      })
    },
    resetForm() {
      this.form = {
        NAME: '', // 教师姓名
        IDENTITY_NUMBER: '', // 身份证号
        EDUCATION_LEVEL: '', // 文化程度
        PROFESSION: '' // 专业
      }
    },
    goBack() {
      this.$parent.TEACHER_ID = ''
      this.$parent.activeName = 'TeacherList'
    }
  }
}

</script>
<style lang="scss">
  html{
    touch-action:none;
  }
  .hide .el-upload--picture-card {
    display: none;
  }
</style>
