|
|
@@ -1,1014 +0,0 @@
|
|
|
-<!-- 题目编辑组件 -->
|
|
|
-<template>
|
|
|
- <div id="questionBank">
|
|
|
- <el-col :span="24" style="display: flex; justify-content: center">
|
|
|
- <el-col
|
|
|
- :span="2"
|
|
|
- style="
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: flex-start;
|
|
|
- cursor: pointer;
|
|
|
- "
|
|
|
- >
|
|
|
- <el-button
|
|
|
- type="success"
|
|
|
- icon="el-icon-arrow-left"
|
|
|
- circle
|
|
|
- size="small"
|
|
|
- @click="back"
|
|
|
- v-if="statusPop === 2"
|
|
|
- ></el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="20" class="contentMore">
|
|
|
- <div class="marg_play">
|
|
|
- <span class="spans">题目类型:</span>
|
|
|
- <el-radio-group v-model="dingForm.type" @change="changeTypes">
|
|
|
- <el-radio
|
|
|
- v-for="(item, index) in radioArrays"
|
|
|
- :key="index"
|
|
|
- :disabled="computedDisabled(item)"
|
|
|
- :label="item.value"
|
|
|
- >{{ item.label }}</el-radio
|
|
|
- >
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play">
|
|
|
- <span class="spans"><span style="color: red">* </span>题目:</span>
|
|
|
- <div>
|
|
|
- <editor
|
|
|
- v-model="dingForm.content"
|
|
|
- :max-height="300"
|
|
|
- :uploadStatus="uploadStatus"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- <div class="marg_play">
|
|
|
- <span class="spans">图片:</span>
|
|
|
- <div>
|
|
|
- <div class="imgBoxTopic">
|
|
|
- <label class="imgLabel">
|
|
|
- <div class="msPhoto" v-if="dingForm.imgUrl">
|
|
|
- <img
|
|
|
- :src="$methodsTools.splitImgHost(dingForm.imgUrl)"
|
|
|
- alt="图片加载失败"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div class="imgbbx" v-else>
|
|
|
- <p>点击添加图片</p>
|
|
|
- <i class="el-icon-plus"></i>
|
|
|
- </div>
|
|
|
- <input
|
|
|
- :disabled="statusPop === 2"
|
|
|
- :id="'inputstopic' + nums"
|
|
|
- type="file"
|
|
|
- ref="filetopic"
|
|
|
- style="display: none"
|
|
|
- @change="getImgFiletopic(nums, $event)"
|
|
|
- />
|
|
|
- </label>
|
|
|
- </div>
|
|
|
- <p style="color: #999999; line-height: 22px">
|
|
|
- 支持扩展名:.jpeg .bmp .png .jpg...<br />为保证显示效果,请上传分辨率为100x100且大小小于2M图片
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
- <div
|
|
|
- class="marg_play"
|
|
|
- v-if="dingForm.type === 1 || dingForm.type === 2"
|
|
|
- >
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red" v-if="dingForm.type !== 5">* </span
|
|
|
- >选项:</span
|
|
|
- >
|
|
|
- <div style="flex: 1">
|
|
|
- <div
|
|
|
- style="display: flex; align-items: center; margin-bottom: 8px"
|
|
|
- v-for="(options, indexsop) in dingForm.optionsList"
|
|
|
- :key="indexsop"
|
|
|
- >
|
|
|
- <span>选项{{ indexsop + 1 }}:</span>
|
|
|
- <el-input
|
|
|
- style="flex: 1; margin: 0px 10px"
|
|
|
- type="textarea"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- v-model="options.content"
|
|
|
- placeholder="请输入内容"
|
|
|
- :autosize="{ minRows: 2, maxRows: 2 }"
|
|
|
- maxlength="500"
|
|
|
- ></el-input>
|
|
|
- <span>{{ options.content.length }}/500</span>
|
|
|
- <el-button
|
|
|
- v-if="statusPop === 1"
|
|
|
- @click="delList(indexsop)"
|
|
|
- style="border-radius: 50%; margin: 0px 6px"
|
|
|
- type="danger"
|
|
|
- icon="el-icon-delete"
|
|
|
- size="mini"
|
|
|
- circle
|
|
|
- ></el-button>
|
|
|
- <label class="btnSty" v-if="statusPop !== 2"
|
|
|
- ><input
|
|
|
- type="file"
|
|
|
- style="display: none"
|
|
|
- @change="uploadListImg(indexsop, $event)"
|
|
|
- />{{
|
|
|
- options.imgUrl !== null && options.imgUrl
|
|
|
- ? "更换图片"
|
|
|
- : "上传图片"
|
|
|
- }}</label
|
|
|
- >
|
|
|
- <el-image
|
|
|
- v-if="options.imgUrl !== null && options.imgUrl"
|
|
|
- style="
|
|
|
- width: 50px;
|
|
|
- height: 50px;
|
|
|
- border-radius: 4px;
|
|
|
- border: 1px dotted #a4a4a4;
|
|
|
- padding: 4px;
|
|
|
- "
|
|
|
- :src="$methodsTools.splitImgHost(options.imgUrl)"
|
|
|
- :preview-src-list="[$methodsTools.splitImgHost(options.imgUrl)]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- <!-- <img
|
|
|
- v-if="options.imgUrl !== null && options.imgUrl"
|
|
|
- style="
|
|
|
- width: 50px;
|
|
|
- height: 50px;
|
|
|
- border-radius: 4px;
|
|
|
- border: 1px dotted #a4a4a4;
|
|
|
- padding: 4px;
|
|
|
- "
|
|
|
- :src="$methodsTools.splitImgHost(options.imgUrl)"
|
|
|
- alt=""
|
|
|
- /> -->
|
|
|
- </div>
|
|
|
- <div
|
|
|
- style="display: flex; align-items: center"
|
|
|
- v-if="statusPop !== 2"
|
|
|
- >
|
|
|
- <i
|
|
|
- class="el-icon-circle-plus"
|
|
|
- style="margin-right: 5px; font-size: 30px; cursor: pointer"
|
|
|
- @click="addListcontent"
|
|
|
- ></i>
|
|
|
- <span
|
|
|
- style="color: #409eff; cursor: pointer"
|
|
|
- @click="addListcontent"
|
|
|
- >添加选项</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div style="margin-bottom: 15px" v-if="dingForm.type === 4">
|
|
|
- <div
|
|
|
- style="display: flex; align-items: center"
|
|
|
- v-if="statusPop !== 2"
|
|
|
- >
|
|
|
- <i
|
|
|
- class="el-icon-circle-plus"
|
|
|
- style="margin-right: 5px; font-size: 30px; cursor: pointer"
|
|
|
- @click="addListItem"
|
|
|
- ></i
|
|
|
- ><span style="color: #409eff; cursor: pointer" @click="addListItem"
|
|
|
- >添加问题</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- <!-- 案例题 -->
|
|
|
- <div style="padding-left: 50px">
|
|
|
- <div v-for="(ans, ain) in dingForm.optionsList" :key="ain">
|
|
|
- <div class="marg_play">
|
|
|
- <el-button
|
|
|
- v-if="statusPop !== 2"
|
|
|
- @click="delAnliChi(ain)"
|
|
|
- style="border-radius: 50%; margin: 0px 6px"
|
|
|
- type="danger"
|
|
|
- icon="el-icon-delete"
|
|
|
- size="mini"
|
|
|
- circle
|
|
|
- ></el-button>
|
|
|
- <span class="spans">题目类型:</span>
|
|
|
- <el-radio-group
|
|
|
- v-model="ans.type"
|
|
|
- @change="changeTypeChild(ain)"
|
|
|
- >
|
|
|
- <el-radio
|
|
|
- v-for="(tng, nindex) in radioArray"
|
|
|
- :key="nindex"
|
|
|
- :label="tng.value"
|
|
|
- :disabled="computedDisabled(tng)"
|
|
|
- >{{ tng.label }}</el-radio
|
|
|
- >
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>题目:</span
|
|
|
- >
|
|
|
- <div>
|
|
|
- <editor
|
|
|
- v-model="ans.content"
|
|
|
- :max-height="300"
|
|
|
- :uploadStatus="uploadStatus"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- <div class="marg_play">
|
|
|
- <span class="spans">图片:</span>
|
|
|
- <div>
|
|
|
- <div class="imgBoxTopic">
|
|
|
- <label class="imgLabel">
|
|
|
- <div class="msPhoto" v-if="ans.imgUrl">
|
|
|
- <img
|
|
|
- :src="$methodsTools.splitImgHost(ans.imgUrl)"
|
|
|
- alt="图片加载失败"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div class="imgbbx" v-else>
|
|
|
- <p>点击添加图片</p>
|
|
|
- <i class="el-icon-plus"></i>
|
|
|
- </div>
|
|
|
- <input
|
|
|
- :id="'inputstopi' + nums + ain"
|
|
|
- type="file"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- style="display: none"
|
|
|
- @change="getImgFiletopics(ain, $event)"
|
|
|
- />
|
|
|
- </label>
|
|
|
- </div>
|
|
|
- <p style="color: #999999; line-height: 22px">
|
|
|
- 支持扩展名:.jpeg .bmp .png .jpg...<br />为保证显示效果,请上传分辨率为100x100且大小小于2M图片
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
- <div class="marg_play" v-if="ans.type === 1 || ans.type === 2">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red" v-if="ans.type !== 5">* </span
|
|
|
- >选项:</span
|
|
|
- >
|
|
|
- <div style="flex: 1">
|
|
|
- <div
|
|
|
- style="
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 8px;
|
|
|
- "
|
|
|
- v-for="(answerItem, indexsops) in ans.optionsList"
|
|
|
- :key="indexsops"
|
|
|
- >
|
|
|
- <span>选项{{ indexsops + 1 }}:</span>
|
|
|
- <el-input
|
|
|
- style="flex: 1; margin: 0px 10px"
|
|
|
- type="textarea"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- v-model="answerItem.content"
|
|
|
- placeholder="请输入内容"
|
|
|
- :autosize="{ minRows: 2, maxRows: 2 }"
|
|
|
- maxlength="500"
|
|
|
- ></el-input>
|
|
|
- <span>{{ answerItem.content.length }}/500</span>
|
|
|
- <el-button
|
|
|
- v-if="statusPop === 1"
|
|
|
- @click="delListchi(ain, indexsops)"
|
|
|
- style="border-radius: 50%; margin: 0px 6px"
|
|
|
- type="danger"
|
|
|
- icon="el-icon-delete"
|
|
|
- size="mini"
|
|
|
- circle
|
|
|
- ></el-button>
|
|
|
- <label class="btnSty" v-if="statusPop !== 2"
|
|
|
- ><input
|
|
|
- type="file"
|
|
|
- style="display: none"
|
|
|
- @change="uploadListImgchi(ain, indexsops, $event)"
|
|
|
- />{{
|
|
|
- answerItem.imgUrl !== null && answerItem.imgUrl
|
|
|
- ? "更换图片"
|
|
|
- : "上传图片"
|
|
|
- }}</label
|
|
|
- >
|
|
|
- <el-image
|
|
|
- v-if="answerItem.imgUrl !== null && answerItem.imgUrl"
|
|
|
- style="
|
|
|
- width: 50px;
|
|
|
- height: 50px;
|
|
|
- border-radius: 4px;
|
|
|
- border: 1px dotted #a4a4a4;
|
|
|
- padding: 4px;
|
|
|
- "
|
|
|
- :src="$methodsTools.splitImgHost(answerItem.imgUrl)"
|
|
|
- :preview-src-list="[
|
|
|
- $methodsTools.splitImgHost(answerItem.imgUrl),
|
|
|
- ]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- <!-- <img
|
|
|
- v-if="answerItem.imgUrl !== null && answerItem.imgUrl"
|
|
|
- style="
|
|
|
- width: 50px;
|
|
|
- height: 50px;
|
|
|
- border-radius: 4px;
|
|
|
- border: 1px dotted #a4a4a4;
|
|
|
- padding: 4px;
|
|
|
- "
|
|
|
- :src="$methodsTools.splitImgHost(answerItem.imgUrl)"
|
|
|
- alt=""
|
|
|
- /> -->
|
|
|
- </div>
|
|
|
- <div
|
|
|
- style="display: flex; align-items: center"
|
|
|
- v-if="statusPop !== 2"
|
|
|
- >
|
|
|
- <i
|
|
|
- class="el-icon-circle-plus"
|
|
|
- style="
|
|
|
- margin-right: 5px;
|
|
|
- font-size: 30px;
|
|
|
- cursor: pointer;
|
|
|
- "
|
|
|
- @click="addListcontentchi(ain)"
|
|
|
- ></i>
|
|
|
- <span
|
|
|
- style="color: #409eff; cursor: pointer"
|
|
|
- @click="addListcontentchi(ain)"
|
|
|
- >添加选项</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-if="ans.type === 1">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>正确答案:</span
|
|
|
- >
|
|
|
- <el-radio-group
|
|
|
- v-for="(oAsz, oindexsz) in ans.optionsList"
|
|
|
- :key="oindexsz"
|
|
|
- v-model="ans.answerQuestion"
|
|
|
- >
|
|
|
- <el-radio
|
|
|
- style="margin-right: 12px"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- :label="oindexsz + 1 + ''"
|
|
|
- >选项{{ oindexsz + 1 }}</el-radio
|
|
|
- >
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-else-if="ans.type === 2">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>正确答案:</span
|
|
|
- >
|
|
|
- <el-checkbox-group v-model="ans.answerQuestionList">
|
|
|
- <el-checkbox
|
|
|
- style="margin-right: 12px"
|
|
|
- v-for="(oAsz, oindexsz) in ans.optionsList"
|
|
|
- :key="oindexsz"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- :label="oindexsz + 1"
|
|
|
- >选项{{ oindexsz + 1 }}</el-checkbox
|
|
|
- >
|
|
|
- </el-checkbox-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-if="ans.type === 3">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>正确答案:</span
|
|
|
- >
|
|
|
- <el-radio-group v-model="ans.answerQuestion">
|
|
|
- <el-radio :disabled="statusPop === 2" label="1"
|
|
|
- >正确</el-radio
|
|
|
- >
|
|
|
- <el-radio :disabled="statusPop === 2" label="0"
|
|
|
- >错误</el-radio
|
|
|
- >
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play">
|
|
|
- <span class="spans">答案解析:</span>
|
|
|
- <div>
|
|
|
- <editor
|
|
|
- v-model="ans.analysisContent"
|
|
|
- :max-height="300"
|
|
|
- :uploadStatus="uploadStatus"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 案例题 -->
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-if="dingForm.type === 1">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>正确答案:</span
|
|
|
- >
|
|
|
- <el-radio-group
|
|
|
- v-for="(oA, oindex) in dingForm.optionsList"
|
|
|
- :key="oindex"
|
|
|
- v-model="dingForm.answerQuestion"
|
|
|
- >
|
|
|
- <el-radio
|
|
|
- style="margin-right: 12px"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- :label="oindex + 1 + ''"
|
|
|
- >选项{{ oindex + 1 }}</el-radio
|
|
|
- >
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-else-if="dingForm.type === 2">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>正确答案:</span
|
|
|
- >
|
|
|
- <el-checkbox-group v-model="dingForm.answerQuestionList">
|
|
|
- <el-checkbox
|
|
|
- style="margin-right: 12px"
|
|
|
- v-for="(oA, oindex) in dingForm.optionsList"
|
|
|
- :key="oindex"
|
|
|
- :disabled="statusPop === 2"
|
|
|
- :label="oindex + 1"
|
|
|
- >选项{{ oindex + 1 }}</el-checkbox
|
|
|
- >
|
|
|
- </el-checkbox-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-if="dingForm.type === 3">
|
|
|
- <span class="spans"
|
|
|
- ><span style="color: red">* </span>正确答案:</span
|
|
|
- >
|
|
|
- <el-radio-group v-model="dingForm.answerQuestion">
|
|
|
- <el-radio :disabled="statusPop === 2" label="1">正确</el-radio>
|
|
|
- <el-radio :disabled="statusPop === 2" label="0">错误</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
- <div class="marg_play" v-if="dingForm.type !== 4">
|
|
|
- <span class="spans">答案解析:</span>
|
|
|
- <div>
|
|
|
- <editor
|
|
|
- v-model="dingForm.analysisContent"
|
|
|
- :max-height="300"
|
|
|
- :uploadStatus="uploadStatus"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- <div class="marg_play">
|
|
|
- <span class="spans">是否启用:</span>
|
|
|
- <el-radio-group v-model="dingForm.status">
|
|
|
- <el-radio :disabled="statusPop === 2" :label="1">启用</el-radio>
|
|
|
- <el-radio :disabled="statusPop === 2" :label="0">停用</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </div> -->
|
|
|
- </el-col>
|
|
|
- <el-col
|
|
|
- :span="2"
|
|
|
- style="
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: flex-end;
|
|
|
- cursor: pointer;
|
|
|
- "
|
|
|
- >
|
|
|
- <el-button
|
|
|
- type="success"
|
|
|
- icon="el-icon-arrow-right"
|
|
|
- circle
|
|
|
- @click="next"
|
|
|
- v-if="statusPop === 2"
|
|
|
- ></el-button>
|
|
|
- </el-col>
|
|
|
- </el-col>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import Editor from "@/components/Editor";
|
|
|
-export default {
|
|
|
- components: { Editor },
|
|
|
- name: "questionBank",
|
|
|
- props: ["nums", "dingFormInfo", "disableTypeStatus"],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- dingForm: {},
|
|
|
- uploadStatus: 2,
|
|
|
- statusPop: 1,
|
|
|
- innerVisiblePaperTopic: false,
|
|
|
- fullscreenChildPaperTopic: false, //当前打开窗数据
|
|
|
- radioArrays: [
|
|
|
- {
|
|
|
- label: "单选题",
|
|
|
- value: 1,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "多选题",
|
|
|
- value: 2,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "判断题",
|
|
|
- value: 3,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "简答题",
|
|
|
- value: 5,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "案例题",
|
|
|
- value: 4,
|
|
|
- },
|
|
|
- ],
|
|
|
- radioArray: [
|
|
|
- {
|
|
|
- label: "单选题",
|
|
|
- value: 1,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "多选题",
|
|
|
- value: 2,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "判断题",
|
|
|
- value: 3,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "简答题",
|
|
|
- value: 5,
|
|
|
- },
|
|
|
- ],
|
|
|
- queryData: 1,
|
|
|
- };
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- // this.$nextTick(function () {
|
|
|
- // this.$on("childmethods", function (v, int) {
|
|
|
- // this.addClick(v, int);
|
|
|
- // });
|
|
|
- // });
|
|
|
- },
|
|
|
- watch: {
|
|
|
- dingFormInfo: {
|
|
|
- handler(newVal, oldVal) {
|
|
|
- console.log(newVal);
|
|
|
- this.dingForm = newVal;
|
|
|
- },
|
|
|
- // 立即处理 进入页面就触发
|
|
|
- immediate: true,
|
|
|
- },
|
|
|
- },
|
|
|
- computed: {
|
|
|
- computedDisabled: function () {
|
|
|
- return function (item) {
|
|
|
- if (this.statusPop === 2 || this.statusPop === 0) {
|
|
|
- return true;
|
|
|
- } else if (this.disableTypeStatus && item.value === 5) {
|
|
|
- return true;
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- };
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- changeTypes(int) {
|
|
|
- var data = {
|
|
|
- questionId: this.dingForm.questionId ? this.dingForm.questionId : "",
|
|
|
- type: int,
|
|
|
- optionsList: [],
|
|
|
- answerQuestionList: [],
|
|
|
- answerQuestion: "",
|
|
|
- content: "",
|
|
|
- analysisContent: "",
|
|
|
- };
|
|
|
- switch (int) {
|
|
|
- case 1:
|
|
|
- for (let i = 0; i < 4; i++) {
|
|
|
- data.optionsList.push({
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: i + 1,
|
|
|
- });
|
|
|
- }
|
|
|
- break;
|
|
|
- case 2:
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
- data.optionsList.push({
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: i + 1,
|
|
|
- });
|
|
|
- }
|
|
|
- break;
|
|
|
- case 4:
|
|
|
- var datas = {
|
|
|
- analysisContent: "",
|
|
|
- answerQuestion: "",
|
|
|
- answerQuestionList: [],
|
|
|
- content: "",
|
|
|
- optionsList: [],
|
|
|
- type: 1,
|
|
|
- };
|
|
|
- for (let i = 0; i < 4; i++) {
|
|
|
- datas.optionsList.push({
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: i + 1,
|
|
|
- });
|
|
|
- }
|
|
|
- data.optionsList.push(datas);
|
|
|
- default:
|
|
|
- break;
|
|
|
- }
|
|
|
- this.dingForm = data;
|
|
|
- },
|
|
|
- changeTypeChild(index) {
|
|
|
- this.dingForm.optionsList[index].optionsList = [];
|
|
|
- this.dingForm.optionsList[index].answerQuestion = "";
|
|
|
- switch (this.dingForm.optionsList[index].type) {
|
|
|
- case 1:
|
|
|
- for (let i = 0; i < 4; i++) {
|
|
|
- this.dingForm.optionsList[index].optionsList.push({
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: i + 1,
|
|
|
- });
|
|
|
- }
|
|
|
- break;
|
|
|
- case 2:
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
- this.dingForm.optionsList[index].optionsList.push({
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: i + 1,
|
|
|
- });
|
|
|
- }
|
|
|
- break;
|
|
|
- default:
|
|
|
- break;
|
|
|
- }
|
|
|
- // this.dingForm.optionsList[index].optionsList = [];
|
|
|
- // this.dingForm.optionsList[index].answerQuestion = "";
|
|
|
- },
|
|
|
- getInfosPage() {
|
|
|
- return this.dingForm;
|
|
|
- },
|
|
|
- back() {
|
|
|
- this.tableData.forEach((item, index) => {
|
|
|
- if (item.questionId === this.dingForm.questionId) {
|
|
|
- if (index === 0) {
|
|
|
- this.$message.warning("这是当前页第一题了");
|
|
|
- } else {
|
|
|
- var datas = this.tableData[index - 1].questionId;
|
|
|
- this.$api.obtainbankquestion(datas).then((res) => {
|
|
|
- this.dingForm = res.data;
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- next() {
|
|
|
- this.tableData.forEach((item, index) => {
|
|
|
- if (item.questionId === this.dingForm.questionId) {
|
|
|
- if (this.tableData.length - 1 === index) {
|
|
|
- this.$message.warning("这是当前页最后一题了");
|
|
|
- } else {
|
|
|
- var datas = this.tableData[index + 1].questionId;
|
|
|
- this.$api.obtainbankquestion(datas).then((res) => {
|
|
|
- this.dingForm = res.data;
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- addClick(v, int) {
|
|
|
- if (v === undefined) {
|
|
|
- this.dingForm = {
|
|
|
- optionsList: [],
|
|
|
- status: 1,
|
|
|
- };
|
|
|
- this.statusPop = 1;
|
|
|
- } else {
|
|
|
- var datas = v.questionId;
|
|
|
- this.statusPop = int;
|
|
|
- this.$api.obtainbankquestion(datas).then((res) => {
|
|
|
- this.dingForm = res.data;
|
|
|
- });
|
|
|
- }
|
|
|
- this.innerVisiblePaperTopic = true;
|
|
|
- },
|
|
|
- delTopic() {
|
|
|
- this.$confirm("此操作将删除该题目, 是否继续?", "提示", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning",
|
|
|
- })
|
|
|
- .then(async () => {
|
|
|
- var data = JSON.parse(JSON.stringify(this.dingForm));
|
|
|
- data.parentType = Number(this.queryData.typeId);
|
|
|
- // data.status = -1;
|
|
|
- console.log(data);
|
|
|
- this.$message.success("删除成功");
|
|
|
- this.search();
|
|
|
- this.innerVisiblePaperTopic = false;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.$message({
|
|
|
- type: "info",
|
|
|
- message: "已取消删除",
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- //删除案例问题
|
|
|
- delAnliChi(int) {
|
|
|
- this.dingForm.optionsList.splice(int, 1);
|
|
|
- },
|
|
|
- //删除选项 非案例
|
|
|
- delList(index) {
|
|
|
- this.dingForm.optionsList.splice(index, 1);
|
|
|
- this.dingForm.optionsList.map((items, indexs) => {
|
|
|
- items.optionsId = indexs + 1;
|
|
|
- });
|
|
|
- if (this.dingForm.type === 1) {
|
|
|
- this.dingForm.answerQuestion = "";
|
|
|
- }
|
|
|
- if (this.dingForm.type === 2) {
|
|
|
- this.dingForm.answerQuestionList = [];
|
|
|
- }
|
|
|
- },
|
|
|
- //删除选项 案例
|
|
|
- delListchi(fatherIndex, childrenIndex) {
|
|
|
- this.dingForm.optionsList[fatherIndex].optionsList.splice(
|
|
|
- childrenIndex,
|
|
|
- 1
|
|
|
- );
|
|
|
- this.dingForm.optionsList[fatherIndex].optionsList.map(
|
|
|
- (items, indexs) => {
|
|
|
- items.optionsId = indexs + 1;
|
|
|
- }
|
|
|
- );
|
|
|
- if (this.dingForm.optionsList[fatherIndex].type === 1) {
|
|
|
- this.dingForm.optionsList[fatherIndex].answerQuestion = "";
|
|
|
- }
|
|
|
- if (this.dingForm.optionsList[fatherIndex].type === 2) {
|
|
|
- this.dingForm.optionsList[fatherIndex].answerQuestionList = [];
|
|
|
- }
|
|
|
- },
|
|
|
- //新增选项 非案例
|
|
|
- addListcontent() {
|
|
|
- var data = {
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: this.dingForm.optionsList.length + 1,
|
|
|
- };
|
|
|
- this.dingForm.optionsList.push(data);
|
|
|
- },
|
|
|
- //新增选项 案例
|
|
|
- addListcontentchi(int) {
|
|
|
- var data = {
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: this.dingForm.optionsList[int].optionsList.length + 1,
|
|
|
- };
|
|
|
- this.dingForm.optionsList[int].optionsList.push(data);
|
|
|
- },
|
|
|
- //新增问题 案例
|
|
|
- addListItem() {
|
|
|
- var data = {
|
|
|
- analysisContent: "",
|
|
|
- answerQuestion: "",
|
|
|
- answerQuestionList: [],
|
|
|
- content: "",
|
|
|
- optionsList: [],
|
|
|
- type: 1,
|
|
|
- };
|
|
|
- for (let i = 0; i < 4; i++) {
|
|
|
- data.optionsList.push({
|
|
|
- content: "",
|
|
|
- imgUrl: null,
|
|
|
- optionsId: i + 1,
|
|
|
- });
|
|
|
- }
|
|
|
- this.dingForm.optionsList.push(data);
|
|
|
- },
|
|
|
- // 上传图片
|
|
|
- async getImgFiletopic(nums, e) {
|
|
|
- var file = e.target.files[0];
|
|
|
- if (file === undefined) {
|
|
|
- return;
|
|
|
- }
|
|
|
- if (file.size > 2 * 1024 * 1024) {
|
|
|
- this.$message.error("图片不得大于2MB");
|
|
|
- return;
|
|
|
- }
|
|
|
- var type = e.target.value.toLowerCase().split(".").splice(-1);
|
|
|
- if (
|
|
|
- type[0] != "jpg" &&
|
|
|
- type[0] != "png" &&
|
|
|
- type[0] != "jpeg" &&
|
|
|
- type[0] != "bmp"
|
|
|
- ) {
|
|
|
- this.$message.error("上传格式需为:.jpg/.png/.jpeg/bmp");
|
|
|
- return;
|
|
|
- }
|
|
|
- const imgUrls = await this.imgUpload(file, 2);
|
|
|
- console.log(this.dingForm, nums);
|
|
|
- this.$set(this.dingForm, "imgUrl", imgUrls);
|
|
|
- },
|
|
|
- // 上传内容list图片
|
|
|
- async uploadListImg(k, e) {
|
|
|
- var file = e.target.files[0];
|
|
|
- if (file === undefined) {
|
|
|
- return;
|
|
|
- }
|
|
|
- if (file.size > 2 * 1024 * 1024) {
|
|
|
- this.$message.error("图片不得大于2MB");
|
|
|
- return;
|
|
|
- }
|
|
|
- var type = e.target.value.toLowerCase().split(".").splice(-1);
|
|
|
- if (
|
|
|
- type[0] != "jpg" &&
|
|
|
- type[0] != "png" &&
|
|
|
- type[0] != "jpeg" &&
|
|
|
- type[0] != "bmp"
|
|
|
- ) {
|
|
|
- this.$message.error("上传格式需为:.jpg/.png/.jpeg/bmp");
|
|
|
- return;
|
|
|
- }
|
|
|
- const imgUrls = await this.imgUpload(file, 2);
|
|
|
- this.$set(this.dingForm.optionsList[k], "imgUrl", imgUrls);
|
|
|
- },
|
|
|
- // 案例上传内容list图片
|
|
|
- async uploadListImgchi(fatherIndex, k, e) {
|
|
|
- var file = e.target.files[0];
|
|
|
- if (file === undefined) {
|
|
|
- return;
|
|
|
- }
|
|
|
- if (file.size > 2 * 1024 * 1024) {
|
|
|
- this.$message.error("图片不得大于2MB");
|
|
|
- return;
|
|
|
- }
|
|
|
- var type = e.target.value.toLowerCase().split(".").splice(-1);
|
|
|
- if (
|
|
|
- type[0] != "jpg" &&
|
|
|
- type[0] != "png" &&
|
|
|
- type[0] != "jpeg" &&
|
|
|
- type[0] != "bmp"
|
|
|
- ) {
|
|
|
- this.$message.error("上传格式需为:.jpg/.png/.jpeg/bmp");
|
|
|
- return;
|
|
|
- }
|
|
|
- const imgUrls = await this.imgUpload(file, 2);
|
|
|
- this.$set(
|
|
|
- this.dingForm.optionsList[fatherIndex].optionsList[k],
|
|
|
- "imgUrl",
|
|
|
- imgUrls
|
|
|
- );
|
|
|
- },
|
|
|
- //案例 子题目图片
|
|
|
- async getImgFiletopics(int, e) {
|
|
|
- var file = e.target.files[0];
|
|
|
- if (file === undefined) {
|
|
|
- return;
|
|
|
- }
|
|
|
- if (file.size > 2 * 1024 * 1024) {
|
|
|
- this.$message.error("图片不得大于2MB");
|
|
|
- return;
|
|
|
- }
|
|
|
- var type = e.target.value.toLowerCase().split(".").splice(-1);
|
|
|
- if (
|
|
|
- type[0] != "jpg" &&
|
|
|
- type[0] != "png" &&
|
|
|
- type[0] != "jpeg" &&
|
|
|
- type[0] != "bmp"
|
|
|
- ) {
|
|
|
- this.$message.error("上传格式需为:.jpg/.png/.jpeg/bmp");
|
|
|
- return;
|
|
|
- }
|
|
|
- const imgUrls = await this.imgUpload(file, 2);
|
|
|
- this.$set(this.dingForm.optionsList[int], "imgUrl", imgUrls);
|
|
|
- },
|
|
|
- imgUpload(file, int) {
|
|
|
- var self = this;
|
|
|
- return new Promise((resolve, reject) => {
|
|
|
- this.$upload
|
|
|
- .upload(file, int)
|
|
|
- .then((res) => {
|
|
|
- resolve(res);
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- self.$message.error("图片上传错误");
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-.contentMore {
|
|
|
- border: 1px solid #999;
|
|
|
- padding: 10px;
|
|
|
-}
|
|
|
-.marg_play {
|
|
|
- display: flex;
|
|
|
- margin-bottom: 15px;
|
|
|
- .spans {
|
|
|
- flex-shrink: 0;
|
|
|
- text-align: right;
|
|
|
- width: 80px;
|
|
|
- }
|
|
|
-}
|
|
|
-.imgBox {
|
|
|
- width: 100%;
|
|
|
- // height: 210px;
|
|
|
- border: 1px solid #e2e2e2;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 8px 8px 3px;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- .imgLabel {
|
|
|
- flex: 1;
|
|
|
- width: 100%;
|
|
|
- border: 1px dotted #e2e2e2;
|
|
|
- color: #999;
|
|
|
- font-size: 14px;
|
|
|
- cursor: pointer;
|
|
|
- border-radius: 8px;
|
|
|
- .msPhoto {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- max-width: 100%;
|
|
|
- max-height: 270px;
|
|
|
- img {
|
|
|
- max-width: 100%;
|
|
|
- max-height: 270px;
|
|
|
- }
|
|
|
- }
|
|
|
- .imgbbx {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- i {
|
|
|
- font-weight: bold;
|
|
|
- margin: 14px 0;
|
|
|
- font-size: 24px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- p {
|
|
|
- margin: 5px 0px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.imgBoxTopic {
|
|
|
- width: 150px;
|
|
|
- height: 150px;
|
|
|
- border: 1px solid #e2e2e2;
|
|
|
- border-radius: 8px;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- .imgLabel {
|
|
|
- flex: 1;
|
|
|
- width: 100%;
|
|
|
- background-color: #f9f9f9;
|
|
|
- color: #999;
|
|
|
- font-size: 14px;
|
|
|
- cursor: pointer;
|
|
|
- border-radius: 8px;
|
|
|
- .msPhoto {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- height: 100%;
|
|
|
- max-width: 100%;
|
|
|
- max-height: 150px;
|
|
|
- img {
|
|
|
- max-width: 100%;
|
|
|
- max-height: 150px;
|
|
|
- }
|
|
|
- }
|
|
|
- .imgbbx {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- i {
|
|
|
- font-weight: bold;
|
|
|
- margin: 8px 0;
|
|
|
- font-size: 20px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.btnSty {
|
|
|
- cursor: pointer;
|
|
|
- padding: 4px 10px;
|
|
|
- background-color: #409eff;
|
|
|
- color: #fff;
|
|
|
- text-align: center;
|
|
|
- border-radius: 8px;
|
|
|
- margin-right: 6px;
|
|
|
-}
|
|
|
-</style>
|