From 5f00696dfb25bc90034448ceb634ed1ef256681a Mon Sep 17 00:00:00 2001
From: qiyunfeng-create <1940665526@qq.com>
Date: 星期四, 21 八月 2025 21:13:35 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/xiehe_website
---
src/views/classManage/components/questionDom.vue | 420 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 420 insertions(+), 0 deletions(-)
diff --git a/src/views/classManage/components/questionDom.vue b/src/views/classManage/components/questionDom.vue
new file mode 100644
index 0000000..a5dde61
--- /dev/null
+++ b/src/views/classManage/components/questionDom.vue
@@ -0,0 +1,420 @@
+<template>
+ <div class="questionDom">
+ <div class="list-item" v-for="(pitem, pindex) in questionList" :key="pindex">
+ <div class="list-item-title">
+ {{ pitem.name }}
+ <span v-if="isPreview">(鍏� {{ pitem.data.length }} 棰�)</span>
+ </div>
+ <div class="list-item-box" v-for="(item, index) in pitem.data" :key="index">
+ <div class="list-item-box-title-box">
+ <el-checkbox
+ v-if="noCheckbox"
+ v-model="item.isCheck"
+ @change="checkItems($event, item)"
+ size="large"
+ >
+ <template #default>
+ <i class="el-icon-check"></i>
+ <span
+ class="custom-checkbox"
+ v-html="index + 1 + '銆�' + item.questionStem?.stemTxt"
+ ></span>
+ </template>
+ </el-checkbox>
+ <div class="list-item-box-title" v-else>
+ <span>{{ index + 1 }}</span
+ >銆�
+ <span class="questionT" v-html="item.questionStem?.stemTxt"></span>
+ <span v-if="item.score > 0 && isPreview">锛坽{ item.score }} 鍒嗭級</span>
+ <el-icon v-if="isDelete" @click="deleteItem(item)" class="deletIcon">
+ <Delete />
+ </el-icon>
+ </div>
+ </div>
+ <div>
+ <div class="shortAnswer" v-if="item.questionType == 'shortAnswer' && !isJudge">
+ <div class="anSwer" v-if="!isPreview">
+ <div class="anSwerText" v-if="item.questionAnswer" style="margin: 15px 0">
+ <span style="min-width: 40px">绛旀锛�</span
+ ><span v-html="item.questionAnswer"></span>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ <div v-else>
+ <!-- <el-input type="textarea" disabled :placeholder="item.userAnswer"></el-input> -->
+ <div v-html="item.userAnswer"></div>
+ </div>
+ </div>
+ <div class="discuss" v-else-if="item.questionType == 'discuss' && !isJudge">
+ <div class="anSwer" v-if="!isPreview">
+ <div class="anSwerText" v-if="item.questionAnswer" style="margin: 15px 0">
+ <span style="min-width: 40px">绛旀锛�</span
+ ><span v-html="item.questionAnswer"></span>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ <div v-else>
+ <!-- <el-input type="textarea" disabled :placeholder="item.userAnswer"></el-input> -->
+ <div v-html="item.userAnswer"></div>
+ </div>
+ </div>
+ <div v-if="isJudge">
+ <div class="shortAnswer anSwerText" v-if="item.answer" style="margin: 15px 0">
+ <span v-html="item.answer"></span>
+ </div>
+ <div class="scoreData">
+ <span>寰楀垎锛�</span>
+ <el-input-number v-model="item.score" style="width: 100px" />
+ </div>
+ </div>
+ </div>
+ <div class="completion" v-if="item.questionType == 'completion'">
+ <div class="anSwer" v-if="!isPreview">
+ <div class="anSwerText" v-if="item.questionAnswer" style="margin: 15px 0">
+ <span style="min-width: 40px">绛旀锛�</span><span v-html="item.questionAnswer"></span>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ <div v-else>
+ <el-input
+ style="width: 200px"
+ v-model="item.userAnswer"
+ disabled
+ placeholder="璇峰～鍐欑瓟妗�"
+ ></el-input>
+ </div>
+ </div>
+ <div class="classification" v-if="item.questionType == 'classification'">
+ <div class="class-item-box">
+ <span
+ class="class-item-box-span"
+ v-for="citem in item.questionOption"
+ :key="citem.index"
+ >
+ {{ citem.txt }}
+ </span>
+ </div>
+ <div class="anSwer" v-if="!isPreview">
+ <div class="anSwerText" v-if="item.questionAnswer" style="margin: 15px 0">
+ <span>绛旀锛�</span>
+ <div class="class-anSwer-box">
+ <div
+ class="class-anSwer-box-item"
+ v-for="aitem in item.questionAnswer"
+ :key="aitem.key"
+ >
+ <span>{{ aitem.name }}锛�</span>
+ <div
+ class="class-anSwer-box-item-box"
+ v-for="citem in aitem.option"
+ :key="citem.key"
+ >
+ <span>{{ citem.txt }}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ </div>
+ <div class="judge" v-if="item.questionType == 'judge'">
+ <el-radio-group v-model="item.customAnswer">
+ <el-radio
+ v-for="ritem in item.questionOption"
+ :key="ritem.index"
+ :value="ritem.value"
+ :label="ritem.value"
+ size="large"
+ :disabled="!isPreview"
+ >
+ {{ ritem.value + '. ' + ritem.txt }}
+ </el-radio>
+ </el-radio-group>
+ <div class="anSwer" v-if="!isPreview">
+ <div v-if="item.questionAnswer" style="margin: 15px 0">
+ 绛旀锛�<span v-html="item.questionAnswer"></span>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ </div>
+ <div class="singleChoice" v-if="item.questionType == 'singleChoice'">
+ <el-radio-group v-if="!isInteraction" v-model="item.customAnswer">
+ <el-radio
+ v-for="ritem in item.questionOption"
+ :key="ritem.index"
+ :value="ritem.value"
+ :label="ritem.value"
+ size="large"
+ :disabled="!isPreview"
+ >
+ {{ ritem.value + '. ' + ritem.txt }}
+ </el-radio>
+ </el-radio-group>
+ <el-radio-group v-else v-model="item.userAnswer">
+ <el-radio
+ v-for="ritem in item.questionOption"
+ :key="ritem.index"
+ :value="ritem.value"
+ :label="ritem.value"
+ size="large"
+ :disabled="isInteraction"
+ >
+ {{ ritem.value + '. ' + ritem.txt }}
+ </el-radio>
+ </el-radio-group>
+ <div class="anSwer" v-if="!isPreview">
+ <div v-if="item.questionAnswer" style="margin: 15px 0">
+ 绛旀锛�<span v-html="item.questionAnswer"></span>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ </div>
+ <div class="multipleChoice" v-if="item.questionType == 'multipleChoice'">
+ <el-checkbox-group v-if="!isInteraction" v-model="item.customAnswer">
+ <el-checkbox
+ v-for="mitem in item.questionOption"
+ :key="mitem.index"
+ :value="mitem.value"
+ :label="mitem.value"
+ size="large"
+ :disabled="!isPreview"
+ >
+ {{ mitem.value + '. ' + mitem.txt }}
+ </el-checkbox>
+ </el-checkbox-group>
+ <el-checkbox-group v-else v-model="item.userAnswer">
+ <el-checkbox
+ v-for="mitem in item.questionOption"
+ :key="mitem.index"
+ :value="mitem.value"
+ :label="mitem.value"
+ size="large"
+ :disabled="isInteraction"
+ >
+ {{ mitem.value + '. ' + mitem.txt }}
+ </el-checkbox>
+ </el-checkbox-group>
+ <div class="anSwer" v-if="!isPreview">
+ <div v-if="item.questionAnswer" style="margin: 15px 0">
+ 绛旀锛�<span v-html="item.questionAnswer"></span>
+ </div>
+ <div :class="isPreview ? 'questionAnalysisCon' : ''" v-if="item.questionAnalysisCon">
+ 鍒嗘瀽锛�<span v-html="item.questionAnalysisCon"></span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="jugdeBtn" v-if="isJudge">
+ <el-button type="primary" @click="submitScore">鎻愪氦鍒嗘暟</el-button>
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+import { defineProps, onMounted } from 'vue'
+
+const props = defineProps<{
+ questionList?: any
+ noCheckbox?: boolean
+ isDelete?: boolean
+ isPreview?: boolean
+ isJudge?: boolean
+ isInteraction?: boolean
+}>()
+
+const emit = defineEmits(['selectQuestion', 'deleteItem', 'judgeUpdate'])
+
+onMounted(() => {})
+
+const checkItems = (e: Event, item: any) => {
+ emit('selectQuestion', item)
+}
+
+const deleteItem = (item: any) => {
+ emit('deleteItem', item)
+}
+
+const submitScore = () => {
+ const list = [...props.questionList]
+ let data: any = []
+ list.forEach((item) => {
+ data.push(...item.data)
+ })
+ emit('judgeUpdate', JSON.stringify(data))
+}
+</script>
+<style lang="less" scoped>
+.questionDom {
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ padding: 10px;
+ box-sizing: border-box;
+ font-family: PingFang SC;
+ .questionT {
+ // display: flex;
+ flex-wrap: wrap;
+ align-items: baseline;
+ }
+ .jugdeBtn {
+ position: absolute;
+ bottom: -40px;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ }
+
+ .list-item {
+ width: 100%;
+ margin-bottom: 20px;
+ .list-item-title {
+ padding: 4px 0;
+ padding-left: 10px;
+ border-left: 4px solid #ff6c00;
+ color: #000;
+ margin: 15px 0;
+ }
+ }
+
+ .list-item-box {
+ margin-bottom: 20px;
+ }
+
+ ::v-deep(.list-item-box-title-box) {
+ margin-bottom: 10px;
+ .el-checkbox {
+ display: flex;
+ align-items: flex-start;
+ }
+ .el-checkbox__label {
+ line-height: 22px;
+ color: #000;
+ }
+ .el-checkbox__input {
+ margin-top: 3px;
+ }
+ .el-checkbox__input.is-checked + .el-checkbox__label {
+ color: #ff6c00;
+ }
+ }
+
+ .list-item-box-title {
+ font-weight: 400;
+ font-size: 13px;
+ color: #000000;
+ display: flex;
+ width: 100%;
+ align-items: baseline;
+ justify-content: flex-start;
+ line-height: 25px;
+ .deletIcon {
+ color: red;
+ margin-left: 10px;
+ font-size: 15px;
+ cursor: pointer;
+ }
+ }
+
+ .anSwer {
+ font-family: PingFang SC;
+ font-weight: 400;
+ font-size: 13px;
+ color: #000000;
+ line-height: 22px;
+ padding-left: 20px;
+ box-sizing: border-box;
+ .anSwerText {
+ display: flex;
+ justify-content: flex-start;
+
+ .class-anSwer-box {
+ margin-left: 10px;
+ .class-anSwer-box-item {
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ .class-anSwer-box-item-box span {
+ margin-left: 10px;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .questionAnalysisCon {
+ min-height: 40px;
+ padding: 10px;
+ background-color: #ff6a00a8;
+ }
+ }
+ .shortAnswer {
+ padding: 20px;
+ line-height: 22px;
+ border: 1px solid #eee;
+ border-radius: 5px;
+ margin: 10px 0;
+ }
+ ::v-deep(.judge),
+ ::v-deep(.singleChoice) {
+ width: 100%;
+ margin-bottom: 20px;
+ .el-radio-group {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: flex-start;
+ padding-left: 20px;
+ box-sizing: border-box;
+ }
+ }
+ ::v-deep(.multipleChoice) {
+ width: 100%;
+ margin-bottom: 20px;
+ .el-checkbox-group {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: flex-start;
+ padding-left: 20px;
+ box-sizing: border-box;
+ }
+ }
+ .class-item-box {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+ flex-wrap: wrap;
+ .class-item-box-span {
+ margin-left: 50px;
+ }
+ }
+ .scoreData {
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ span {
+ white-space: nowrap;
+ }
+ }
+ ::v-deep(.custom-checkbox) {
+ display: inline-flex;
+ justify-content: flex-start;
+ p {
+ white-space: pre-line !important;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.1