<template>
  <div>
    <div class="app-container">
      <div class="level-title">
        <h1>教师信息</h1>
      </div>
      <table class="table-ui">
        <tr>
          <td class="tbg">教师姓名</td>
          <td colspan="3">{{ pd.NAME }}</td>
        </tr>
        <tr>
          <td class="tbg">手机号</td>
          <td>{{ pd.PHONE }}</td>
          <td class="tbg">身份证号</td>
          <td>{{ pd.IDENTITY_NUMBER }}</td>
        </tr>
        <tr>
          <td class="tbg">文化程度</td>
          <td>{{ pd.EDUCATION_LEVEL_NAME }}</td>
          <td class="tbg">专业</td>
          <td>{{ pd.PROFESSION_NAME }}</td>
        </tr>
        <tr>
          <td class="tbg">身份证正面</td>
          <td>
            <div v-if="pd.IDENTITY_FILEPATH_FRONT" class="demo-image__preview">
              <el-image
                :src="config.fileUrl + pd.IDENTITY_FILEPATH_FRONT"
                :preview-src-list="new Array( config.fileUrl + pd.IDENTITY_FILEPATH_FRONT )"
                style="width: 100px; height: 100px"/>
            </div>
          </td>
          <td class="tbg">身份证反面</td>
          <td>
            <div v-if="pd.IDENTITY_FILEPATH_REVERSE" class="demo-image__preview">
              <el-image
                :src="config.fileUrl + pd.IDENTITY_FILEPATH_REVERSE"
                :preview-src-list="new Array( config.fileUrl + pd.IDENTITY_FILEPATH_REVERSE )"
                style="width: 100px; height: 100px"/>
            </div>
          </td>
        </tr>
        <tr>
          <td class="tbg">毕业证照片</td>
          <td>
            <div v-if="pd.DIPLOMA_FILEPATH" class="demo-image__preview">
              <el-image
                :src="config.fileUrl + pd.DIPLOMA_FILEPATH"
                :preview-src-list="new Array( config.fileUrl + pd.DIPLOMA_FILEPATH )"
                style="width: 100px; height: 100px"/>
            </div>
          </td>
          <td class="tbg">资格证照片</td>
          <td>
            <div v-if="pd.CERTIFICATE_FILEPATH" class="demo-image__preview">
              <el-image
                :src="config.fileUrl + pd.CERTIFICATE_FILEPATH"
                :preview-src-list="new Array( config.fileUrl + pd.CERTIFICATE_FILEPATH )"
                style="width: 100px; height: 100px"/>
            </div>
          </td>
        </tr>
      </table>
      <div class="level-title" style="margin-top: 10px">
        <h1>证书信息</h1>
      </div>
      <table v-for="item in pd.certificateList" :key="item.TEACHERCERTIFICATE_ID" class="table-ui">
        <tr>
          <td class="tbg">资质类型</td>
          <td>{{ item.QUALIFICATION_TYPE_NAME }}</td>
          <td class="tbg">职业证书编号</td>
          <td>{{ item.VOCATIONAL_CERTIFICATE_NUMBER }}</td>
        </tr>
        <tr>
          <td class="tbg">是否永久有效</td>
          <td>{{ item.IS_PERMANENT_VALID == '1' ? '是' : '否' }}</td>
          <td class="tbg">证书有效期</td>
          <td>{{ item.CERTIFICATE_DATE_BEGIN }} -- {{ item.IS_PERMANENT_VALID == '1' ? '永久' : item.CERTIFICATE_DATE_END }}</td>
        </tr>
        <tr>
          <td class="tbg">证书照片</td>
          <td colspan="3">
            <div class="demo-image__preview">
              <el-image
                :src="config.fileUrl + item.CERTIFICATE_FILEPATH"
                :preview-src-list="new Array( config.fileUrl + item.CERTIFICATE_FILEPATH )"
                style="width: 100px; height: 100px"/>
            </div>
          </td>
        </tr>
      </table>
    </div>
    <div class="ui-height" />
    <div class="ui-foot">
      <el-button plain type="info" @click="goBack">返 回</el-button>
    </div>
  </div>
</template>

<script>
import { requestFN } from '@/utils/request'
export default {
  data() {
    return {
      config: config,
      pd: {
        NAME: '', // 教师姓名
        PHONE: '', // 手机号
        IDENTITY_NUMBER: '', // 身份证号
        EDUCATION_LEVEL_NAME: '', // 文化程度
        PROFESSION_NAME: '', // 专业
        IDENTITY_FILEPATH_FRONT: '', // 身份证照片（正面）
        IDENTITY_FILEPATH_REVERSE: '', // 身份证照片（反面）
        DIPLOMA_FILEPATH: '', // 毕业证照片
        CERTIFICATE_FILEPATH: '', // 资格证照片
        certificateList: [] // 证书信息
      }
    }
  },
  created() {
    this.getData()
  },
  methods: {
    getData() {
      requestFN(
        '/teacher/info',
        {
          TEACHER_ID: this.$parent.TEACHER_ID
        }
      ).then((data) => {
        this.pd = Object.assign({}, data.pd) // copy obj
      }).catch((e) => {
      })
    },
    goBack() {
      this.$parent.TEACHER_ID = ''
      this.$parent.activeName = 'TeacherList'
    }
  }
}
</script>

<style scoped>
</style>
