<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" :model="form" :form="form" :rules="rules" label-width="150px" class="detail_form">
          <el-form-item label="试卷名称" prop="EXAMNAME">
            <el-input id="EXAMNAME" ref="EXAMNAME" v-model="form.EXAMNAME" maxlength="255" placeholder="这里输入试卷名称..." title="试卷名称"/>
          </el-form-item>
          <el-form-item label="总分数" prop="EXAMSCORE">
            <el-input id="EXAMSCORE" ref="EXAMSCORE" v-model="form.EXAMSCORE" oninput="if(value<0)value=0" type="number" maxlength="255" placeholder="这里输入总分数..." title="总分数"/>
          </el-form-item>
          <el-form-item label="合格分数" prop="PASSSCORE">
            <el-input id="PASSSCORE" ref="PASSSCORE" :min="0" v-model="form.PASSSCORE" oninput="if(value<0)value=0" type="number" maxlength="255" placeholder="这里输入合格分数..." title="合格分数"/>
          </el-form-item>
          <el-form-item label="是否上架" prop="ISSELL">
            <el-radio-group v-model="form.ISSELL">
              <el-radio :label="'1'">上架</el-radio>
              <el-radio :label="'0'">下架</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="试卷属性" prop="COLLECTIVE">
            <el-radio-group v-model="form.COLLECTIVE">
              <el-radio :label="0">平台通用</el-radio>
              <el-radio :label="1">机构专用</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="dialogType=='add'" label="下载模板">
            <el-button size="medium " @click="getExcelModel">
              下载
            </el-button>
          </el-form-item>
          <el-form-item v-if="dialogType=='add'" label="上传试题">
            <div class="flex-layout">
              <el-input v-model="excelFrom.FFILENAME" :disabled="true" style="width:240px"/>
              <el-upload :before-upload="beforeFileUpload" accept=".xls,.xlsx" class="avatar-uploader ml5" action="">
                <el-button type="primary">上传附件</el-button>
              </el-upload>
            </div>
            <div class="tip_text color-gray">
              只能上传.XLS 和 .XLSX格式的单个文件，且文件大小不超过1MB！
            </div>
          </el-form-item>
        </el-form>

        <div v-if="dialogType=='edit'" class="study-papg">
          <div class="level-title">
            <h1>试卷题目信息</h1>
          </div>
          <div class="flex-layout space-between" style="padding:10px 22px 0">
            <div>
              <el-form inline="true" >
                <el-form-item label="题目内容：">
                  <el-input v-model="KEYWORDS" placeholder="题目内容..."/>
                </el-form-item>
                <el-form-item label="题目类型：">
                  <el-select v-model="QUESTIONTYPE" placeholder="请选择" @change="clearAnswer">
                    <el-option v-for="item in questiontypeOptions" :key="item.value" :label="item.label" :value="item.value"/>
                  </el-select>
                </el-form-item>
                <el-form-item>
                  <el-button type="primary" @click="getQueList">查询</el-button>
                  <el-button icon="el-icon-refresh" @click="reset">重置</el-button>
                </el-form-item>
              </el-form>
            </div>
            <el-button v-show="add" type="primary" style="margin-bottom:18px" @click = "goAddQue">新增试题</el-button>
          </div>
          <dl v-for="(row,i) in inputQue" :key="row.QUESTION_ID">
            <dt>
              <span v-if="row.QUESTIONTYPE === '1'" class="mark mark-green">(单选题) </span>
              <span v-if="row.QUESTIONTYPE === '2'" class="mark mark-blue">(多选题)</span>
              <span v-if="row.QUESTIONTYPE === '3'" class="mark mark-orange">(判断题)</span>
              {{ i + 1 }}.{{ row.QUESTIONDRY }}
              <span class="ml-10">(题目分值：{{ row.SCORE }})</span>
            </dt>
            <el-radio-group v-if="row.QUESTIONTYPE === '1'" :disabled="true" v-model="row.ANSWER">
              <dd>
                <el-radio label="A">A.{{ row.OPTIONA }}</el-radio>
              </dd>
              <dd>
                <el-radio label="B">B.{{ row.OPTIONB }}</el-radio>
              </dd>
              <dd>
                <el-radio label="C">C.{{ row.OPTIONC }}</el-radio>
              </dd>
              <dd>
                <el-radio label="D">D.{{ row.OPTIOND }}</el-radio>
              </dd>
            </el-radio-group>
            <el-checkbox-group v-if="row.QUESTIONTYPE === '2'" :disabled="true" v-model="row.checkList" >
              <dd>
                <el-checkbox label="A">A.{{ row.OPTIONA }}</el-checkbox>
              </dd>
              <dd>
                <el-checkbox label="B">B.{{ row.OPTIONB }}</el-checkbox>
              </dd>
              <dd>
                <el-checkbox label="C">C.{{ row.OPTIONC }}</el-checkbox>
              </dd>
              <dd>
                <el-checkbox label="D">D.{{ row.OPTIOND }}</el-checkbox>
              </dd>
            </el-checkbox-group>
            <el-radio-group v-if="row.QUESTIONTYPE === '3'" :disabled="true" v-model="row.ANSWER">
              <dd>
                <el-radio label="A">A.{{ row.OPTIONA }}</el-radio>
              </dd>
              <dd>
                <el-radio label="B">B.{{ row.OPTIONB }}</el-radio>
              </dd>
            </el-radio-group>
            <div class="flex-layout space-between">
              <div>
                <div class="mb-10">
                  正确答案：{{ row.ANSWER }}
                </div>
                <div class="mb-10">
                  答案解析：{{ row.DESCR }}
                </div>
                <div>
                  关联课件名称：{{ row.COURSEWARENAME }}
                </div>
              </div>
              <div>
                <el-button @click="goEditQue(row)">编辑</el-button>
                <el-button @click="goDeleteQue(row.PAPER_QUESTION_ID)">删除</el-button>
              </div>
            </div>
          </dl>
          <div class="page-btn-group" style="padding-bottom:20px">
            <div/>
            <pagination v-if="inputQue && inputQue.length" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getQueList" />
          </div>
        </div>

        <div class="detail_foot">
          <el-button type="primary" @click="confirm">
            <template v-if="dialogType=='add'">立即创建</template>
            <template v-else-if="dialogType=='edit'">保存修改</template>
          </el-button>
          <el-button icon="el-icon-arrow-left" @click="goBack">返回</el-button>
        </div>
      </div>

    </div>
    <el-dialog v-if="dialogFormEdit" :visible.sync="dialogFormEdit" :title="queDialogType==='edit'?'修改':'新增'" width="600px">
      <el-form ref="queForm" :rules="queRules" :model="queForm" label-width="110px" style="width: 500px;">
        <!--          <el-form-item label="题号" prop="QUESTIONNUMBER">-->
        <!--            <el-input id="QUESTIONNUMBER" ref="QUESTIONNUMBER" v-model.number="form.QUESTIONNUMBER" maxlength="11" placeholder="这里输入题号..." title="题号"/>-->
        <!--          </el-form-item>-->
        <el-form-item label="试题类型" prop="QUESTIONTYPE">
          <el-select v-model="queForm.QUESTIONTYPE" placeholder="请选择" @change="clearAnswer">
            <el-option v-for="item in questiontypeOptions" :key="item.value" :label="item.label" :value="item.value"/>
          </el-select>
        </el-form-item>
        <el-form-item label="题干" prop="QUESTIONDRY">
          <el-input id="QUESTIONDRY" ref="QUESTIONDRY" v-model="queForm.QUESTIONDRY" type="textarea" maxlength="255" placeholder="这里输入题干..." title="题干"/>
        </el-form-item>
        <el-form-item v-if="queForm.QUESTIONTYPE !== '3' && queForm.QUESTIONTYPE !== '4'" label="选项A" prop="OPTIONA">
          <el-input id="OPTIONA" ref="OPTIONA" v-model="queForm.OPTIONA" maxlength="255" placeholder="这里输入选项A..." title="选项A"/>
        </el-form-item>
        <el-form-item v-if="queForm.QUESTIONTYPE !== '3' && queForm.QUESTIONTYPE !== '4'" label="选项B" prop="OPTIONB">
          <el-input id="OPTIONB" ref="OPTIONB" v-model="queForm.OPTIONB" maxlength="255" placeholder="这里输入选项B..." title="选项B"/>
        </el-form-item>
        <el-form-item v-if="queForm.QUESTIONTYPE !== '3' && queForm.QUESTIONTYPE !== '4'" label="选项C" prop="OPTIONC">
          <el-input id="OPTIONC" ref="OPTIONC" v-model="queForm.OPTIONC" maxlength="255" placeholder="这里输入选项C..." title="选项C"/>
        </el-form-item>
        <el-form-item v-if="queForm.QUESTIONTYPE !== '3' && queForm.QUESTIONTYPE !== '4'" label="选项D" prop="OPTIOND">
          <el-input id="OPTIOND" ref="OPTIOND" v-model="queForm.OPTIOND" maxlength="255" placeholder="这里输入选项D..." title="选项D"/>
        </el-form-item>
        <el-form-item label="答案" prop="ANSWER">
          <el-select v-model="queForm.ANSWER" placeholder="请选择">
            <el-option v-for="item in answerOptions" :key="item.value" :label="item.label" :value="item.value"/>
          </el-select>
        </el-form-item>
        <el-form-item label="分值" prop="SCORE">
          <el-input id="SCORE" ref="SCORE" v-model="queForm.SCORE" type="number" maxlength="255" placeholder="这里输入分值" title="分值"/>
        </el-form-item>

        <el-form-item label="试题标签" prop="LABEL_TYPE">
          <el-select v-model="queForm.LABEL_TYPE" placeholder="请选择">
            <el-option v-for="item in labelTypeList" :key="item.DICTIONARIES_ID" :label="item.NAME" :value="item.DICTIONARIES_ID"/>
          </el-select>
        </el-form-item>
        <el-form-item label="关联课件名称" prop="VIDEOCOURSEWARE_ID">
          <el-select v-model="queForm.VIDEOCOURSEWARE_ID" filterable placeholder="请选择">
            <el-option v-for="item in CourseWareNameList" :key="item.VIDEOCOURSEWARE_ID" :label="item.COURSEWARENAME" :value="item.VIDEOCOURSEWARE_ID"/>
          </el-select>
        </el-form-item>
        <el-form-item label="答案解析" prop="DESCR">
          <el-input id="DESCR" ref="DESCR" v-model="queForm.DESCR" type="textarea" maxlength="255" placeholder="这里输入答案解析..." title="答案解析"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormEdit = false">取 消</el-button>
        <el-button type="primary" @click="queConfirm">确 定</el-button>
      </div>
    </el-dialog>

    <trainingTypeDialog :dialog-form-visible.sync="dialogFormVisible" @confirm="trainingTypeDialogConfirm"/>
  </div>
</template>

<script>
import trainingTypeDialog from '@/components/trainingTypeDialog'
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
import { requestFN } from '@/utils/request'
import SelectTree from '@/components/SelectTree'
import { upload } from '@/utils/upload'
export default {
  components: { Pagination, SelectTree, trainingTypeDialog },
  data() {
    const validateExamname = (rule, value, callback) => {
      if (this.form.EXAMNAME == '') {
        callback(new Error('试卷名称不能为空'))
      }
      var flag = new RegExp('[\\\\/:*?"<>|]')
      if (flag.test(value)) {
        callback(new Error('内容不能包含\\/:*?"<>|字符'))
      } else {
        callback()
      }
    }
    return {
      config: config,
      filterText: '',
      dialogType: 'add',
      queDialogType: 'add',
      add: false,
      del: false,
      edit: false,
      form: {
        STAGEEXAMPAPERINPUT_ID: '',
        EXAMNAME: '',
        TRAINTYPE: '',
        POSTTYPE: '',
        EXAMSCORE: '',
        PASSSCORE: '',
        STATE: '',
        ISSELL: '1',
        COLLECTIVE: 0,
        INDUSTRY1: '',
        INDUSTRY2: '',
        INDUSTRY_END_ID: '',
        INDUSTRY_ALL_NAME: '',
        POSTTYPE_NAME: '',
        TRAININGTYPE_NAME: '',
        trainAllName: ''
      },
      rules: {
        EXAMNAME: [{ required: true, validator: validateExamname, trigger: 'blur' }],
        EXAMSCORE: [{ required: true, message: '试卷分数不能为空', trigger: 'blur' }],
        PASSSCORE: [{ required: true, message: '通过分数不能为空', trigger: 'blur' }],
        ISSELL: [{ required: true, message: '请选择是否上架', trigger: 'blur' }],
        COLLECTIVE: [{ required: true, message: '请选择试卷属性', trigger: 'blur' }]
      },

      listQuery: {
        page: 1,
        limit: 10
      },
      TRAINTYPE: '',
      POSTTYPE: '',
      POSTTYPE_NAME: '',
      TRAININGTYPE_NAME: '',
      INDUSTRY1: '',
      INDUSTRY2: '',
      INDUSTRY_END_ID: '',
      INDUSTRY_END_ID_NAME: '',
      dialogFormVisible: false,
      dialogFormEdit: false,
      postList: [],
      trainingList: [],
      labelTypeList: [],
      CourseWareNameList: [],
      // 行业类型树
      treeLoading: false,
      industryTreeData: [],
      industryProps: {
        children: 'nodes',
        label: 'NAME'
      },
      excelFrom: {
        FFILE: '',
        FFILENAME: ''
      },

      questiontypeOptions: [
        {
          value: '1',
          label: '单选题'
        },
        {
          value: '2',
          label: '多选题'
        },
        {
          value: '3',
          label: '判断题'
        }
      ],
      answerOptions: [],

      queForm: {
        QUESTIONNUMBER: '', // 题号
        LABEL_TYPE: '',
        QUESTIONTYPE: '', // 试题类型（单选题、多选题、判断题）
        QUESTIONDRY: '', // 题干
        OPTIONA: '', // 选项A
        OPTIONB: '', // 选项B
        OPTIONC: '', // 选项C
        OPTIOND: '', // 选项D
        ANSWER: '', // 答案
        STAGEEXAMPAPERINPUT_ID: this.$parent.STAGEEXAMPAPERINPUT_ID, // 试卷ID
        VIDEOCOURSEWARE_ID: '' // 关联课件ID
      },
      queRules: {
        QUESTIONTYPE: [{ required: true, message: '试题类型（单选题、多选题、判断题）不能为空', trigger: 'blur' }],
        QUESTIONDRY: [{ required: true, message: '题干不能为空', trigger: 'blur' }],
        OPTIONA: [{ required: true, message: '选项A不能为空', trigger: 'blur' }],
        OPTIONB: [{ required: true, message: '选项B不能为空', trigger: 'blur' }],
        OPTIONC: [{ required: true, message: '选项C不能为空', trigger: 'blur' }],
        OPTIOND: [{ required: true, message: '选项D不能为空', trigger: 'blur' }],
        ANSWER: [{ required: true, message: '答案不能为空', trigger: 'blur' }],
        SCORE: [
          { required: true, message: '分值不能为空', trigger: 'blur' },
          { pattern: /^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/,
            message:
              '分值请设定为正数' }
        ],
        LABEL_TYPE: [{ required: true, message: '试题标签不能为空', trigger: 'blur' }],
        VIDEOCOURSEWARE_ID: [{ required: true, message: '关联课件名称不能为空', trigger: 'blur' }],
        STAGEEXAMPAPERINPUT_ID: [{ required: true, message: '试卷ID不能为空', trigger: 'blur' }]
      },
      inputQue: [],
      total: 0,
      queAllScore: '',
      KEYWORDS: '',
      QUESTIONTYPE: ''
    }
  },
  watch: {
    'TRAINTYPE': {
      handler(newVal, oldVal) {
        this.POSTTYPE = ''
        this.POSTTYPE_NAME = ''
        this.getPostList()
        this.INDUSTRY1 = ''
        this.INDUSTRY2 = ''
        this.INDUSTRY_END_ID = ''
        this.INDUSTRY_END_ID_NAME = ''
        this.industryTreeData = []
        // }
      },
      immediate: false
    },
    'POSTTYPE': {
      handler() {
        // if (!this.initFlag) {
        //   this.initFlag = true
        // }
        this.INDUSTRY1 = ''
        this.INDUSTRY2 = ''
        this.INDUSTRY_END_ID = ''
        this.INDUSTRY_END_ID_NAME = ''
        this.getTreeList()
      }
    },
    filterText(val) {
      this.$refs.tree.filter(val)
    },

    'queForm.QUESTIONTYPE': {
      handler() {
        if (this.queForm.QUESTIONTYPE === '3') {
          this.queRules.OPTIONC = [{ required: false, message: '选项C不能为空', trigger: 'blur' }]
          this.queRules.OPTIOND = [{ required: false, message: '选项D不能为空', trigger: 'blur' }]
        } else {
          this.queRules.OPTIONC = [{ required: true, message: '选项C不能为空', trigger: 'blur' }]
          this.queRules.OPTIOND = [{ required: true, message: '选项D不能为空', trigger: 'blur' }]
        }
        this.getAnswerList()
      }
    }

  },
  created() {
    this.getTrainingList()
    if (this.$parent.STAGEEXAMPAPERINPUT_ID) {
      this.getQueList()
      this.getData()
      this.getDict('a60ebc858e2c46108bf82bbd8acc8f50', 'labelTypeList')
      this.dialogType = 'edit'
    }
    this.getCourseWareName()
  },
  methods: {
    // 保存
    confirm() {
      if (this.dialogType == 'add' && !this.excelFrom.FFILE) {
        this.$message.warning('课件习题附件不能为空，请上传')
        return false
      }
      if (this.dialogType == 'edit') {
        if (this.form.EXAMSCORE != this.queAllScore) {
          this.$message.warning('试卷总分与试题分数不同，请修改')
          return false
        }
      }
      const formData = new FormData()
      Object.keys(this.excelFrom).map(key => {
        formData.append(key, this.excelFrom[key])
      })
      Object.keys(this.form).map(key => {
        formData.append(key, this.form[key])
      })
      this.$refs.form.validate(valid => {
        if (valid) {
          this.listLoading = true
          upload(
            '/stageexampaperCache/' + this.dialogType,
            formData
          ).then((data) => {
            if (data.result == 'success') {
              this.$message({
                dangerouslyUseHTMLString: true,
                message: '保存成功',
                type: data.result,
                showClose: true,
                duration: 10 * 1000
              })
              this.listLoading = false
              this.$parent.activeName = 'refreshList'
            } else {
              this.$message({
                dangerouslyUseHTMLString: true,
                message: '系统错误，请联系管理员',
                type: 'error',
                showClose: true,
                duration: 10 * 1000
              })
              this.listLoading = false
            }
          }).catch((e) => {
            this.listLoading = false
          })
        } else {
          return false
        }
      })
    },
    trainingTypeDialogConfirm(e) {
      console.log(e)
      Object.keys(e).forEach(key => {
        this.$set(this.form, key, e[key])
      })
    },
    // 获取列表
    getQueList() {
      this.listLoading = true
      requestFN(
        '/paperQuestionCache/list?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page,
        {
          KEYWORDS: this.KEYWORDS,
          QUESTIONTYPE: this.QUESTIONTYPE,
          STAGEEXAMPAPERINPUT_ID: this.$parent.STAGEEXAMPAPERINPUT_ID
        }
      ).then((data) => {
        this.listLoading = false
        data.varList.forEach((item, index, arr) => {
          if (item.QUESTIONTYPE === '2') {
            data.varList[index].checkList = item.ANSWER.split('')
          }
        })
        this.inputQue = data.varList
        this.total = data.page.totalResult

        this.hasButton()
      }).catch((e) => {
        this.listLoading = false
      })
    },
    getData() {
      this.listLoading = true
      requestFN(
        '/stageexampaperCache/goEdit',
        {
          STAGEEXAMPAPERINPUT_ID: this.$parent.STAGEEXAMPAPERINPUT_ID
        }
      ).then((data) => {
        this.listLoading = false
        this.form = Object.assign({}, data.pd)
        this.form.trainAllName = data.pd.TRAININGTYPE_NAME + '-' + data.pd.POSTTYPE_NAME + '-' + data.pd.INDUSTRY_END_ID_NAME + '-' + data.pd.TRAINLEVEL_NAME
        this.queAllScore = this.form.QUESCORE ? this.form.QUESCORE : 0
      }).catch((e) => {
        this.listLoading = false
      })
    },
    goEditQue(row) {
      this.queDialogType = 'edit'
      this.resetQueForm()
      this.queForm = Object.assign({}, row)
      this.getAnswerList()
      this.dialogFormEdit = true
    },
    // 获取数据字典数据
    getDict(DICTIONARIES_ID, list) {
      requestFN('/dictionaries/getLevels', {
        DICTIONARIES_ID
      }).then((data) => {
        this[list] = data.list
      })
    },
    goDeleteQue(queId) {
      this.$confirm('确定要删除吗?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.listLoading = true
        requestFN(
          '/paperQuestionCache/delete',
          {
            PAPER_QUESTION_ID: queId,
            STAGEEXAMPAPERINPUT_ID: this.$parent.STAGEEXAMPAPERINPUT_ID
          }
        ).then(() => {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
          this.listLoading = false
          this.getData()
          this.getQueList()
          this.getList()
        }).catch((e) => {
          this.listLoading = false
        })
      }).catch(() => {
      })
    },
    queConfirm() {
      this.$refs.queForm.validate(valid => {
        if (valid) {
          if (this.queForm.QUESTIONTYPE == '3') {
            this.queForm.OPTIONA = '对'
            this.queForm.OPTIONB = '错'
            this.queForm.OPTIONC = ''
            this.queForm.OPTIOND = ''
          }
          var arr = []
          if (this.queForm.QUESTIONTYPE == '3') {
            arr = ['#' + this.queForm.OPTIONA + '#', '#' + this.queForm.OPTIONB + '#']
          } else if (this.queForm.QUESTIONTYPE != '4') {
            arr = ['#' + this.queForm.OPTIONA + '#', '#' + this.queForm.OPTIONB + '#', '#' + this.queForm.OPTIONC + '#', '#' + this.queForm.OPTIOND + '#']
          }
          // 将数组中的元素放在一个字符串中，用逗号分隔
          var s = arr.join(',') + ','
          for (var i = 0; i < arr.length - 1; i++) {
            if (s.replace(arr[i] + ',', '').indexOf(arr[i]) > -1) {
              this.$message.warning('试题答案重复:' + arr[i].split('#').join(''))
              return false
            }
          }
          this.listLoading = true
          requestFN(
            '/paperQuestionCache/' + this.queDialogType,
            this.queForm
          ).then((data) => {
            this.listLoading = false
            this.dialogFormEdit = false
            this.$message({
              message: '操作成功',
              type: 'success'
            })
            this.getData()
            this.getQueList()
            // this.getList()
          }).catch((e) => {
            this.listLoading = false
          })
        } else {
          return false
        }
      })
    },

    // 添加试题
    goAddQue() {
      this.queDialogType = 'add'
      this.resetQueForm()
      // this.getDict()
      this.getAnswerList()
      this.dialogFormEdit = true
    },

    getAnswerList() {
      if (this.queForm.QUESTIONTYPE === '1') { // 单选题
        this.answerOptions = [
          { value: 'A', label: 'A' },
          { value: 'B', label: 'B' },
          { value: 'C', label: 'C' },
          { value: 'D', label: 'D' }]
      } else if (this.queForm.QUESTIONTYPE === '2') { // 多选题、
        this.answerOptions = [
          { value: 'AB', label: 'AB' },
          { value: 'AC', label: 'AC' },
          { value: 'AD', label: 'AD' },
          { value: 'BC', label: 'BC' },
          { value: 'BD', label: 'BD' },
          { value: 'CD', label: 'CD' },
          { value: 'ABC', label: 'ABC' },
          { value: 'ABD', label: 'ABD' },
          { value: 'ACD', label: 'ACD' },
          { value: 'BCD', label: 'BCD' },
          { value: 'ABCD', label: 'ABCD' }]
      } else if (this.queForm.QUESTIONTYPE === '3') { // 判断题
        this.answerOptions = [
          { value: 'A', label: '对' },
          { value: 'B', label: '错' }]
      } else {
        this.answerOptions = []
      }
    },
    reset() {
      this.KEYWORDS = ''
      this.QUESTIONTYPE = ''
      this.listQuery = {
        page: 1,
        limit: 10
      }
      this.total = 0
      this.getQueList()
    },
    resetQueForm() {
      this.queForm = {
        QUESTIONNUMBER: '', // 题号
        QUESTIONTYPE: '', // 试题类型（单选题、多选题、判断题）
        QUESTIONDRY: '', // 题干
        OPTIONA: '', // 选项A
        OPTIONB: '', // 选项B
        OPTIONC: '', // 选项C
        OPTIOND: '', // 选项D
        ANSWER: '', // 答案
        STAGEEXAMPAPERINPUT_ID: this.$parent.STAGEEXAMPAPERINPUT_ID// 试卷ID
      }
    },
    clearAnswer() {
      this.queForm.ANSWER = ''
    },
    beforeFileUpload(file) {
      this.$set(this.excelFrom, 'FFILE', file)
      this.$set(this.excelFrom, 'FFILENAME', file.name)
      // this.$forceUpdate()
      return false
    },
    getExcelModel() {
      this.$confirm('确定要下载excel模板吗?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.listLoading = false
        window.location.href = config.httpurl + '/paperQuestion/downExcel'
      }).catch(() => {
        this.listLoading = false
      })
      this.listLoading = false
    },
    selectIndustry() {
      this.form.TRAINTYPE = this.TRAINTYPE
      this.form.POSTTYPE = this.POSTTYPE
      this.form.POSTTYPE_NAME = this.POSTTYPE_NAME
      this.form.TRAININGTYPE_NAME = this.TRAININGTYPE_NAME
      this.form.INDUSTRY1 = this.INDUSTRY1
      this.form.INDUSTRY2 = this.INDUSTRY2
      this.form.INDUSTRY_END_ID = this.INDUSTRY_END_ID
      this.form.INDUSTRY_END_ID_NAME = this.INDUSTRY_END_ID_NAME
      var pn = this.form.POSTTYPE_NAME ? '-' + this.form.POSTTYPE_NAME : ''
      var iname = this.form.INDUSTRY_END_ID_NAME ? '-' + this.form.INDUSTRY_END_ID_NAME : ''
      this.trainAllName = this.form.TRAININGTYPE_NAME + pn + iname
      this.dialogFormVisible = false
    },
    handleNodeClick(node, data, value) {
      if (data.isLeaf) { // 判断是否根节点
        this.INDUSTRY_END_ID = node.INDUSTRYTYPE_ID
        this.INDUSTRY_END_ID_NAME = node.NAME
      }
    },
    filterNode(value, data) {
      if (!value) return true
      return data.NAME.indexOf(value) !== -1
    },
    checkPost(item) {
      this.$set(this, 'POSTTYPE', item.POSTTYPE_ID)
      this.$set(this, 'POSTTYPE_NAME', item.NAME)
    },
    checkTrain(item) {
      console.info(1)
      this.$set(this, 'TRAINTYPE', item.TRAININGTYPE_ID)
      this.$set(this, 'TRAININGTYPE_NAME', item.NAME)
    },
    // 培训类型
    getTrainingList() {
      requestFN(
        '/trainingtype/listAll',
        { }
      ).then((data) => {
        this.trainingList = data.varList
      }).catch((e) => {
      })
    },
    // 岗位类型
    getPostList() {
      requestFN(
        '/posttype/listAll',
        { TRAININGTYPE_ID: this.TRAINTYPE }
      ).then((data) => {
        this.postList = data.varList
      }).catch((e) => {
      })
    },
    // 行业类型树
    getTreeList() {
      if (this.POSTTYPE) {
        this.treeLoading = true
        requestFN(
          '/industrytype/getIndustryTree',
          { POSTTYPE_ID: this.POSTTYPE }
        ).then((data) => {
          this.treeLoading = false
          this.industryTreeData = data.zTreeNodes
        }).catch((e) => {
          this.treeLoading = false
        })
      }
    },
    getCourseWareName() {
      this.listLoading = true
      requestFN(
        '/videocourseware/getCourseWareName',
        {}
      ).then((data) => {
        this.listLoading = false
        this.CourseWareNameList = data.CourseWareNameList
      }).catch((e) => {
        this.listLoading = false
      })
    },
    goBack() {
      this.$parent.activeName = 'List'
    },
    // 判断按钮权限，用于是否显示按钮
    hasButton: function() {
      var keys = 'stageexampaper:add,stageexampaper:del,stageexampaper:edit,toExcel'
      requestFN(
        '/head/hasButton',
        {
          keys: keys
        }
      ).then((data) => {
        this.add = data.stageexampaperfhadminadd		// 新增权限
        this.del = data.stageexampaperfhadmindel		// 删除权限
        this.edit = data.stageexampaperfhadminedit	// 修改权限
      }).catch((e) => {
        this.listLoading = false
      })
    }
  }
}
</script>

<style lang="sass" scoped>
.avatar-uploader
  ul
    margin: 0
    li
      padding: 0
.el-dialog__body
  padding: 0
.map-flex
  display: flex
  width: 500px
  align-items: center

.ud-flex
  display: flex
.form-group
  display: flex
  align-items: center
  .form-label
    padding: 0px 15px
    font-size: 14px
    width: 240px
    font-weight: 400
    text-align: right
    margin-bottom: 18px
    .star
      color: red
      padding-right: 4px
  .input-block
    display: flex

.disContent
  display: flex
  align-items: center
  flex-wrap: wrap
  .img-div
    position: relative
    margin: 0 10px 0px 0
    width: 108px
    height: 108px
    border-radius: 4px
    overflow: hidden
    &>img
      width: 100%
      height: 100%

.disContent-hide
  position: absolute
  width: 100%
  height: 100%
  border-radius: 4px
  background-color: rgba(48, 48, 48, 0.59)
  display: none
  top: 0
  left: 0
  line-height: 32px

  .Delete
    position: absolute
    bottom: 14px
    right: 10px
    font-size: 16px
    color: white
    cursor: pointer
  .yuLan
    position: absolute
    bottom: 23px
    right: 50px
    font-size: 16px
    color: white
    cursor: pointer
    .yuLanImg
      position: absolute
      bottom: 0
      right: 0
      width: 100%
      height: 100%
      opacity: 0

.img-div:hover .disContent-hide
  display: block

  .pitchCss
    border: 1px solid #202e78
    transition: all linear 0.1s
    width: 116px
    height: 116px

</style>

