<template>
  <div class="notice-editor-wrap" >
    <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>

    <div class="add-content screenSet" id="screenSet">
      <el-form
        ref="formData"
        :model="formData"
        :rules="rules"
        label-width="160px"
        class="basic-form"
      >
        <el-form-item label="所属职称：" prop="titleCode">
          <el-select size="small" v-model="formData.titleCode" placeholder="请选择职称">
            <el-option
              v-for="item in gradeList"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="学科名称：" prop="name">
          <el-col :span="13">
            <el-input
              size="small"
              v-model="formData.name"
              placeholder="请输入学科名称"
              style="width:70%;"
            ></el-input>
            <span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/20</span>
          </el-col>
        </el-form-item>
        <el-row>
          <el-col :span="13">
            <el-button type="primary" size="small" @click="addSecondList">添加二级分类</el-button>
          </el-col>
        </el-row>
        <template v-for="(item, index) in formData.titleTestSubjectSecondModelList">
          <h4 style="margin-top:10px;font-weight: 600">第{{ index+1 }}个二级分类：</h4>
          <div class="list-block" :key="index">
            <el-form-item
              label="二级分类名称："
              :prop="`titleTestSubjectSecondModelList.${index}.name`"
              :rules="secondNameRules">
              <el-col :span="13">
                <el-input
                  size="small"
                  v-model="item.name"
                  placeholder="请输入二级分类名称"
                  style="width:70%;"
                ></el-input>
                <span class="word-num">{{(item.name).replace(/\s+/g,"").length}}/20</span>
              </el-col>
            </el-form-item>
            <!-- <el-form-item label="二级分类代码："
              :prop="`titleTestSubjectSecondModelList.${index}.code`"
              :rules="secondCodeRules">             -->
            <el-form-item label="二级分类代码：">
              <el-col :span="13">
                <el-input
                  size="small"
                  v-model="item.code"
                  placeholder="请输入二级分类代码"
                  style="width:70%;"
                ></el-input>
                <span class="word-num">{{(item.code).replace(/\s+/g,"").length}}/8</span>
              </el-col>
            </el-form-item>
            <div class="checkbox-item">
              <el-checkbox
                v-model="item.checkedCourse"
                @change="changeCourse(item.checkedCourse, index)"
                style="margin-left: 15px;">配置课程</el-checkbox>
            </div>
            <div class="list-block-item" v-if="item.checkedCourse">
              <p class="item-title">配置课程</p>
              <el-form-item
                label="是否已在项目配置课程："
                :prop="`titleTestSubjectSecondModelList.${index}.openFlag`"
                :rules="{ required: true, message: '请选择是否已在项目配置课程', trigger: 'change'}">
                <el-col :span="13">
                  <el-radio-group v-model="item.openFlag">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                  </el-radio-group>
                </el-col>
              </el-form-item>
              <el-form-item
                v-if="item.openFlag"
                label="选择项目："
                :prop="`titleTestSubjectSecondModelList.${index}.projectId`"
                :rules="{ required: true, message: '请选择项目', trigger: 'change'}">
                <el-select size="small" v-model="item.projectId" filterable placeholder="请选择项目">
                  <el-option
                    v-for="item in projectList"
                    :key="item.projectId"
                    :label="item.projectName"
                    :value="item.projectId"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                v-else
                label="选择预计上线时间："
                :prop="`titleTestSubjectSecondModelList.${index}.predictTime`"
                :rules="{ required: true, message: '请选择预计上线时间', trigger: 'change'}">
                <el-date-picker
                  v-model="item.predictTime"
                  type="month"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  placeholder="选择月">
                </el-date-picker>
              </el-form-item>
              <i class="el-icon-delete icon-delete" @click="deleteCourseConfig(index)"></i>
            </div>
            <div class="checkbox-item">
              <el-checkbox
                v-model="item.checkedQue"
                @change="changeQue(item.checkedQue, index)"
                style="margin-left: 15px;"
              >配置题库</el-checkbox>
            </div>
            <div class="list-block-item" v-if="item.checkedQue">
              <p class="item-title">题库通用信息</p>
              <el-row>
                <el-col :span="11">
                  <el-form-item label="题库配图：">
                    <el-upload
                      v-model="item.directoryImageUrl"
                      class="bg-uploader"
                      action="#"
                      :show-file-list="false"
                      :before-upload="beforeUploadPic"
                    >
                      <img
                        v-if="item.directoryImageUrl"
                        @mouseover.stop="item.imgMouseOver=true"
                        :src="item.directoryImageUrl"
                        class="bg-img"
                      >
                      <img
                        v-if="!item.directoryImageUrl"
                        class="bg-img"
                        src="../../assets/image/small.png"
                        @click="getCurrentIndex(index)"
                      >
                      <div
                        class="img-delete"
                        v-show="item.imgMouseOver"
                        @click.stop="deleteImg(item.directoryImageUrl,index)"
                        @mouseout.stop="item.imgMouseOver=false">
                        <i class="el-icon-delete"></i>
                      </div>
                      <div class="limit-text">
                        <p>尺寸:686*160</p>
                        <p>限制大小: 500Kb</p>
                        <p>支持.jpg,.png格式</p>
                      </div>
                    </el-upload>
                  </el-form-item>
                </el-col>
                <el-col :span="13">
                  <el-form-item label="题库介绍：">
                    <el-input
                      size="small"
                      type="textarea"
                      :autosize="{ minRows: 5}"
                      placeholder="请输入入口简介"
                      v-model="item.directoryIntro"
                      maxlength="200"
                      style="width:83%;"
                    ></el-input>
                    <span class="word-num">{{(item.directoryIntro).replace(/\s+/g,"").length}}/200</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-form-item
                label="可解锁商品："
                :prop="`titleTestSubjectSecondModelList.${index}.nolockPro`"
                :rules="{ required: true, message: '请选择可解锁商品', trigger: 'change'}"
              >
                <el-cascader
                  v-model="item.nolockPro"
                  :options="options"
                  :props="{ value: 'goodsType', label: 'goodsTypeName', children: 'cardsList'}"
                  size="small"></el-cascader>
              </el-form-item>
              <i class="el-icon-delete icon-delete" @click="deleteQC(index)"></i>
              <el-row>
                <el-col :span="13">
                  <el-button type="primary" icon="el-icon-plus" size="small" @click="addQuestionS(index)" :disabled="item.directoryList.length>=4">新增子题库</el-button>
                </el-col>
              </el-row>
              <div v-for="(item2, index2) in item.directoryList" :key="index2">
                <div class="list-block-item set-bg">
                  <p class="item-title">配置子题库</p>
                  <el-row>
                    <el-col :span="11">
                      <el-form-item
                        label="选择题库："
                        :prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.resourceId`"
                        :rules="{ required: true, message: '请选择题库', trigger: 'change'}"
                      >
                        <el-select
                          v-model="item2.resourceId"
                          filterable
                          size="small"
                          clearable
                          placeholder="请选择题库"
                          :popper-append-to-body="false"
                          @change="changeQBValue(item2.resourceId,index2,index)"
                        >
                          <el-option
                            v-for="(directory, d) in secondDirectoryList"
                            :key="directory.id"
                            :label="directory.directoryName"
                            :value="directory.id">
                          </el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="13">
                      <el-form-item
                        label="前端题库名称："
                        :prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.content1`"
                        :rules="{ required: true, message: '请输入前端题库名称', trigger: 'change'}"
                      >
                        <el-input
                          v-model="item2.content1"
                          type="text"
                          placeholder="默认取关联题库的名称，可修改"
                          size="small"
                          style="width: 80%"
                          maxlength="25">
                        </el-input>
                        <span class="word-num">{{(item2.content1).replace(/\s+/g,"").length}}/25</span>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-form-item
                    label="收费："
                    :prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.freeFlag`"
                    :rules="{ required: true, message: '请选择收费项', trigger: 'change'}"
                  >
                    <el-radio-group v-model="item2.freeFlag">
                      <el-radio label="0">免费</el-radio>
                      <el-radio label="1">收费</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item
                    label="可免费体验题数："
                    v-if="item2.freeFlag == 1"
                    :prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.content2`"
                    :rules="freeContentRules"
                  >
                    <el-input
                      type="number"
                      v-model="item2.content2"
                      placeholder="请输入自然数"
                      style="width: 200px;">
                      <template slot="append">道</template>
                    </el-input>
                  </el-form-item>
                  <i v-show="index2 !== 0" class="el-icon-delete icon-delete" @click="deleteSecondQB(item2,index2,index)"></i>
                </div>
              </div>
            </div>
            <i v-show="index !== 0" class="el-icon-delete icon-delete" @click="deleteSecondList(index)"></i>
          </div>
        </template>
        <el-form-item style="margin-top: 30px">
          <el-button type="primary" @click="onSubmit">提交</el-button>
          <el-button @click="goBack">取消</el-button>
        </el-form-item>
      </el-form>
    </div>

  </div>
</template>

<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import { openLoading, closeLoading, deepCopy } from "@/utils/utils";
import * as commonUtil from "@/utils/utils";
import {doUpload, getFilePath} from "../../utils/qiniu-util";
// import { checkNormalInt } from '@/utils/followup/followupUtils/checkField';

let checkProjectStr = (rule, value, callback) => {
  if (value.indexOf("\\") != -1) {
    //存在
    callback(new Error("请勿输入字符“ \\ ”"));
  } else if (value.indexOf(".") != -1) {
    callback(new Error("请勿输入字符“ . ”"));
  } else {
    callback();
  }
};
let checkNormalInt = (rule, value, callback) => {
  const val = parseFloat(value);
  const isInteger = Number.isInteger(val);
  // if((isInteger && val > 0) || checkNeedRule(val)){
  if( !value || (isInteger && val >= 0) ){
    callback()
  }else{
    callback(new Error(`请输入大于等于0的正整数`))
  }
}
export default {
  components: {
    BreadCrumb
  },
  data() {
    return {
      curmbFirst: "教培项目",
      curmbSecond: "学科管理",
      jumPathThird: '/subject-manager',
      curmbThird: '新建学科',
      detailInfo: {}, // 接口返回
      formData: {
        // deleteFlag: 0,
        id: 0,
        name: '',
        seqNo: 0,
        status: 2,
        titleCode: '',
        titleTestSubjectSecondModelList: [
          {
            code: '',
            // deleteFlag: 0,
            id: 0,
            name: '',
            openFlag: 1,
            predictTime: '',
            seqNo: 1,
            subjectFirstId: '',
            projectId: '',
            checkedCourse: false,//新增字段-配置课程
            checkedQue: false,//新增字段-配置题库
            directoryImageUrl: '',//新增字段-题库配图
            directoryIntro: '',//新增字段-题库介绍
            nolockPro: [],//新增字段-可解锁商品
            goodsType: 0,//新增字段-商品类型
            cardType: 0,//新增字段-卡类型
            imgMouseOver: false,//新增字段
            titleTestSubjectSecondResourceModelList: [{
              // deleteFlag: 0,
              id: 0,
              resourceId: 0,
              seqNo: 1,
              subjectSecondId: 0,
              type: 1
            }],
            directoryList: [
              {
                type: 2,//关联资源类型，1项目，2题库
                subjectSecondId: 0,//二级分类id
                seqNo: 1,
                resourceId: '',//关联资源id
                id: 0,
                freeFlag: '1',//题库是否免费：0免费1收费
                content1: '',//题库分类名称
                content2: '',//表示免费体检题数
              }
            ],
          }
        ],
      },
      gradeList: [], // 职称列表
      projectList: [], // 项目列表
      copyLockList: [],
      options: [],
      secondDirectoryList: [],//题库列表
      activeIndexImg: null,
      rules: {
        titleCode: [
          { required: true, message: "请输入选择职称", trigger: "change" },
        ],
        name: [
          { required: true, message: "请输入学科名称", trigger: "blur" },
          { min: 1, max: 20, message: "输入长度为1-20的科学名称", trigger: "blur" },
          { validator: checkProjectStr, trigger: "blur" }
        ],
      },
      secondNameRules: [
        { required: true, message: "请输入二级分类名称", trigger: "blur" },
        { min: 1, max: 20, message: "输入长度为1-20的二级分类名称", trigger: "blur" },
        { validator: checkProjectStr, trigger: "blur" }
      ],
      freeContentRules: [
        { required: true, message: '请输入免费体验题数', trigger: ['blur','change']},
        { validator: checkNormalInt, trigger: ['blur','change'] }
      ],
      // secondCodeRules: [
      //   // { required: true, message: "请输入二级分类代码", trigger: "blur" },
      //   // { min: 1, max: 8, message: "输入长度为1-8的二级分类代码", trigger: "blur" },
      // ]
    }
  },
  created() {
    const { id } = this.$route.query;
    if (id) {
      this.getSubjectDetail(id);
    }
    this.getGradeList();
    this.getProjectList();
    this.getGoodsTypeList();
    this.getsecondDirectoryList();
  },
  mounted() {
    commonUtil.resizeHeight();
  },
  methods: {
    // 学科详情
    getSubjectDetail(id) {
      openLoading(this);
      this.GET(`portal/titleTest/info/${id}`).then(res => {
        closeLoading(this);
        if (res.code == "000000") {
          console.log('_______data_______', res.data);
          this.detailInfo = res.data;
          this.onReset();
        }
      });
    },
    // 获取职称列表
    getGradeList() {
      openLoading(this);
      this.GET("portal/titleTest/grade/list").then(res => {
        closeLoading(this);
        if (res.code == "000000") {
          const { titleGradeModelList = [] } = res.data;
          this.gradeList = titleGradeModelList;
        }
      });
    },
    // 获取项目列表
    getProjectList() {
      openLoading(this);
      this.GET("portal/titleTest/cme/list").then(res => {
        closeLoading(this);
        if (res.code == "000000") {
          this.projectList = res.data;
        }
      });
    },
    //获取商品分类
    getGoodsTypeList() {
      openLoading(this);
      this.GET("trade/goods/manager/queryGoodsType").then(res => {
        closeLoading(this);
        if (res.code == "000000") {
          this.copyLockList = deepCopy(res.data);
          let data = res.data;
          this.options = this.getProSelect(data);
        }
      });
    },
    getProSelect(data) {
      for (let i = 0; i < data.length; i++) {
        data[i].cardsList.map(item => {
          this.$set(item, "goodsType", item.cardType);
          this.$set(item, "goodsTypeName", item.cardTypeName);
          this.$set(item, "leaf", true);
        });
      }
      return data;
    },
    //获取题库列表
    getsecondDirectoryList() {
      openLoading(this);
      this.GET(`onlineexam/brushExamTitleDirectory?directoryType=1`).then(res => {
        closeLoading(this);
        if (res.code == "000000") {
         this.secondDirectoryList = res.data;
        }
      });
    },
    // 添加二级分类
    addSecondList() {
      let item = {
        code: '',
        // deleteFlag: 0,
        id: 0,
        name: '',
        openFlag: 1,
        predictTime: '',
        seqNo: 1,
        subjectFirstId: '',
        projectId: '',
        checkedCourse: false,//新增字段-配置课程
        checkedQue: false,//新增字段-配置题库
        directoryImageUrl: '',//新增字段-题库配图
        directoryIntro: '',//新增字段-题库介绍
        nolockPro: [],//新增字段-可解锁商品
        goodsType: 0,//新增字段-商品类型
        cardType: 0,//新增字段-卡类型
        imgMouseOver: false,//新增字段
        titleTestSubjectSecondResourceModelList: [{
          // deleteFlag: 0,
          id: 0,
          resourceId: 0,
          seqNo: 1,
          subjectSecondId: 0,
          type: 1
        }],
        directoryList: [
          {
            type: 2,//关联资源类型，1项目，2题库
            subjectSecondId: 0,//二级分类id
            seqNo: 1,
            resourceId: '',//关联资源id
            id: 0,
            freeFlag: '1',//题库是否免费：0免费1收费
            content1: '',//题库分类名称
            content2: '',//表示免费体检题数
          }
        ],
      }
      this.formData.titleTestSubjectSecondModelList.push(item);
    },
    // 删除二级分类
    deleteSecondList(index) {
      this.$confirm('确定删除此二级分类吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.formData.titleTestSubjectSecondModelList.splice(index, 1);
      }).catch(() => {
      });
    },
    //提交
    onSubmit() {
      this.$refs['formData'].validate((valid) => {
        if (!valid) {
          return false;
        }
        const params = deepCopy(this.formData);

        let item = {};
        for (let i = 0; i < params.titleTestSubjectSecondModelList.length; i ++) {
          item = params.titleTestSubjectSecondModelList[i];

          //新增处理-配置课程
          if (!item.checkedCourse) {
            item.openFlag = 0;
            item.projectId = '';
            item.predictTime = '';
            item.titleTestSubjectSecondResourceModelList = [];
          }else {
            let id = item.projectId;
            item.titleTestSubjectSecondResourceModelList[0]['resourceId'] = id || 0;
            delete item.projectId;
          }
          //新增处理-配置题库
          if (!item.checkedQue) {
            item.directoryImageUrl = '';
            item.directoryIntro = '';
            item.nolockPro = [];
            item.goodsType = 0;
            item.cardType = 0;
            item.directoryList =  [];
          }else {
            item.goodsType = item.nolockPro[0];
            item.cardType = item.nolockPro[1];
            for (let item2 of item.directoryList) {
              if (item2.freeFlag == 0) {
                item2.content2 = '';
              }
              if (!item2) {
                item2.resourceId = 0;
              }
            }
          }
          // 添加或重置排序字段
          item.seqNo = i + 1;
        }

        // params.createdName = this.$store.state.reservationManage.userName;
        openLoading(this);
        this.POST("portal/titleTest/insertOrUpdate", params).then(res => {
          closeLoading(this);
          if (res.code == "000000") {
            this.$message.success('提交成功')
            setTimeout(() => {
              this.goBack();
            }, 2000)
          }
        });
      });
    },
    goBack() {
      this.$router.back();
    },
    // 重置
    onReset() {
      if (this.detailInfo.id) {
        const result = deepCopy(this.detailInfo);
        const modelList = [];
        for (let item of result.secondSubjectModelList) {
          if (item.resourceModelList && item.resourceModelList[0]) {
            item.projectId = item.resourceModelList[0]['resourceId'];
            item.titleTestSubjectSecondResourceModelList = item.resourceModelList;
            delete item.resourceModelList;
          } else {
            item.projectId = '';
            item.titleTestSubjectSecondResourceModelList = [{
              // deleteFlag: 0,
              id: 0,
              resourceId: 0,
              seqNo: 1,
              subjectSecondId: 0,
              type: 1
            }]
          }
          //新增处理逻辑
          item.checkedCourse = false;
          item.checkedQue = false;
          item.nolockPro = [];
          if (item.projectId || item.predictTime) {
            item.checkedCourse = true;
          }else {
            item.openFlag = 1;
          }
          if (item.goodsType && item.cardType) {
            item.nolockPro = [Number(item.goodsType),Number(item.cardType)];
            item.checkedQue = true;
          }
          item.imgMouseOver = false;

          modelList.push(item);
        }
        result.titleTestSubjectSecondModelList = modelList;
        delete result.secondSubjectModelList;
        this.formData = result;
      } else {
        this.formData = {
          // deleteFlag: 0,
          id: 0,
          name: '',
          seqNo: 0,
          status: 2,
          titleCode: '',
          titleTestSubjectSecondModelList: [
            {
              code: '',
              // deleteFlag: 0,
              id: 0,
              name: '',
              openFlag: 1,
              predictTime: '',
              seqNo: 1,
              subjectFirstId: '',
              projectId: '',
              checkedCourse: false,//新增字段-配置课程
              checkedQue: false,//新增字段-配置题库
              directoryImageUrl: '',//新增字段-题库配图
              directoryIntro: '',//新增字段-题库介绍
              nolockPro: [],//新增字段-可解锁商品
              goodsType: 0,//新增字段-商品类型
              cardType: 0,//新增字段-卡类型
              imgMouseOver: false,//新增字段
              titleTestSubjectSecondResourceModelList: [{
                // deleteFlag: 0,
                id: 0,
                resourceId: 0,
                seqNo: 1,
                subjectSecondId: 0,
                type: 1
              }],
              directoryList: [
                {
                  type: 2,//关联资源类型，1项目，2题库
                  subjectSecondId: 0,//二级分类id
                  seqNo: 1,
                  resourceId: '',//关联资源id
                  id: 0,
                  freeFlag: '1',//题库是否免费：0免费1收费
                  content1: '',//题库分类名称
                  content2: '',//表示免费体检题数
                }
              ],
            }
          ],
        }
      }
    },
    changeCourse(value, indexL0) {
      if (!value) {
        this.deleteCourseConfig(indexL0);
      }
    },
    changeQue(value, indexL0) {
      if (!value) {
        this.deleteQC(indexL0);
      }
    },
    //课程配置的删除操作
    deleteCourseConfig(indexL0) {
      this.$confirm('确定删除当前二级分类的课程配置吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.formData.titleTestSubjectSecondModelList[indexL0].checkedCourse = false;
      }).catch(() => {
        this.formData.titleTestSubjectSecondModelList[indexL0].checkedCourse = true;
      });
    },
    //题库配置的删除操作
    deleteQC(indexL0) {
      this.$confirm('确定删除当前二级分类的题库配置吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.formData.titleTestSubjectSecondModelList[indexL0].checkedQue = false;
      }).catch(() => {
        this.formData.titleTestSubjectSecondModelList[indexL0].checkedQue = true;
      });
    },
    getCurrentIndex(indexL0) {
      this.activeIndexImg = indexL0;
    },
    beforeUploadPic(file) {
      let fileLimit = {
        width: 686,
        height: 160,
        size: 0.5,
        sizeText: "500Kb",
        key: "directoryImageUrl",
        more: "directoryImageUrl",
        show: "uploadImgMessage1"
      };
      this.beforeAvatarUpload(file, fileLimit);
    },
    //上传图片校验
    beforeAvatarUpload(file, fileLimit) {
      let vm = this;
      const isJPG = file.type === "image/jpeg";
      const isPNG = file.type === "image/png";
      const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
      if (!isJPG && !isPNG) {
        this.$message.error("图片不符合规范，请根据规范上传图片");
        // return;
      }
      if (!isLt2M) {
        this.$message.error("图片不符合规范，请根据规范上传图片 ");
        // return;
      }
      let _img = new FileReader();
      _img.readAsDataURL(file);
      _img.onload = function(theFile) {
        let image = new Image();
        image.src = theFile.target.result;
        image.onload = function() {
          let _this = this;
          if (
            // false
            _this.width != fileLimit.width ||
            _this.height != fileLimit.height
          ) {
            vm.$message.error("图片不符合规范，请根据规范上传图片");
          } else {
            openLoading(vm);
            doUpload(
              vm,
              file,
              getFilePath(file, null),
              "preview4",
              "progress1",
              1
            ).then(function(path) {
              closeLoading(vm);
              console.log(path);
              vm.formData.titleTestSubjectSecondModelList[vm.activeIndexImg][fileLimit.key] = path.fullPath;
              // vm.formData[fileLimit.more] = {
              //   attachmentName: path.name,
              //   attachmentExt: path.ext,
              //   attachmentSize: path.size
              // };
              vm.$message.success("上传成功");
            });
          }
        };
      };
      return isJPG && isLt2M;
    },
    //删除图片
    deleteImg(img, indexL0) {
      this.formData.titleTestSubjectSecondModelList[indexL0].directoryImageUrl = '';
      this.formData.titleTestSubjectSecondModelList[indexL0].imgMouseOver = false;
    },
    //新增子题库
    addQuestionS(activeIndex) {
      let seqLength = this.formData.titleTestSubjectSecondModelList[activeIndex].directoryList.length;
      let obj = {
        type: 2,//关联资源类型，1项目，2题库
        subjectSecondId: 0,//二级分类id
        seqNo: seqLength+1,
        resourceId: '',//关联资源id
        id: 0,
        freeFlag: '1',//题库是否免费：0免费，1收费
        content1: '',//题库分类名称
        content2: '',//表示免费体检题数
      }
      if (seqLength >=4) {
        this.$message.warning('最多只能增加4个子题库')
        return;
      }
      this.formData.titleTestSubjectSecondModelList[activeIndex].directoryList.push(obj)
    },
    formatDirectory(value) {
      let directoryName = '';
      for (let i=0; i<this.secondDirectoryList.length; i++) {
        if (this.secondDirectoryList[i].id == value) {
          directoryName = this.secondDirectoryList[i].directoryName;
        }
      }
      return directoryName;
    },
    changeQBValue(value,indexL1,indexL0) {
      let directoryName = this.formatDirectory(value);
      this.formData.titleTestSubjectSecondModelList[indexL0].directoryList[indexL1].content1 = directoryName;
    },
    //删除子题库
    deleteSecondQB(obj1,indexL1, indexL0) {
      this.$confirm('确定删除此子题库吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.formData.titleTestSubjectSecondModelList[indexL0].directoryList.splice(indexL1, 1);
      }).catch(() => {
      });
    },
  },
}
</script>

<style lang="scss" scoped>
  .notice-editor-wrap {
    background: #fff;
  }
  .prot-dialog-tips-1 {
    text-align: center !important;
  }
  .add-content{
    padding: 30px 0;
  }
  .list-block{
    position: relative;
    padding: 20px 10px 10px;
    border: 1px solid #cdcdcd;
    border-radius: 5px;
    margin-top: 25px;
    margin-bottom: 20px;
  }
  .checkbox-item{
    margin-bottom: 22px;
  }
  .list-block-item{
    position: relative;
    padding: 10px;
    border: 1px solid #cdcdcd;
    border-radius: 5px;
    margin-top: 15px;
    margin-bottom: 15px;
    .icon-delete{
      position: absolute;
      right: 20px;
      top: 10px;
      font-size: 30px;
      color: red;
      cursor: pointer;
    }
    .item-title{
      margin: 5px 0 15px;
    }
    &.set-bg{
      background-color: #f1f1f1;
    }
  }
  .icon-delete{
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 30px;
    color: red;
    cursor: pointer;
  }
  .bg-uploader {
    img {
      float: left;
    }
    .bg-img {
      width: 84px;
      height: 100px;
    }
    .bg-video {
      float: left;
      width: 84px;
      height: 100px;
    }
    .img-delete {
      position: absolute;
      left: 0px;
      top: 0px;
      width: 84px;
      height: 100px;
      background: #000;
      opacity: 0.7;
      z-index: 999;
      i {
        color: #fff;
        margin-top: 39px;
        margin-left: 0px;
      }
    }
    .limit-text {
      float: left;
      margin-left: 10px;
      margin-top: -10px;
      p {
        font-size: 12px;
        color: #999;
      }
    }
  }
</style>
<style>
  .el-checkbox__input.is-checked+.el-checkbox__label{
    color: #449284;
  }
  .el-checkbox__input.is-checked .el-checkbox__inner,
  .el-checkbox__input.is-indeterminate .el-checkbox__inner{
    background-color: #449284;
    border-color: #449284;
  }
  .required-label .el-form-item__label::before {
    content: "*";
    color: #f56c6c;
    margin-right: 4px;
  }
</style>
