Просмотр исходного кода

feat(i18n+student+component): add show result switch and locale text

1. 新增多语言文案ssShowResult到中、港、英三种语言包
2. 为选择题、投票、问答、拍照、AI应用、H5页面模块添加结果展示开关
3. 完善Switch组件样式,新增标题布局和开关样式
4. 新增结果数组同步和父窗口通信逻辑
lsc 1 неделя назад
Родитель
Сommit
f2daf3af36

+ 6 - 4
src/components/Switch.vue

@@ -31,14 +31,16 @@ const handleChange = () => {
 
 <style lang="scss" scoped>
 .switch {
-  height: 20px;
-  display: inline-block;
+  // height: 20px;
+  // display: inline-block;
+  display: flex;
+  align-items: center;
   cursor: pointer;
 
   &:not(.disabled).active {
     .switch-core {
-      border-color: $themeColor;
-      background-color: $themeColor;
+      border-color: #f6c82b;
+      background-color: #f6c82b;
 
       &::after {
         left: 100%;

+ 104 - 8
src/views/Student/components/choiceQuestionDetailDialog.vue

@@ -11,10 +11,18 @@
       <!-- 选择题 -->
       <div class="c_t45" v-if="workDetail && workDetail.type === '45' && props.showData">
         <div class="c_t45_title">
-          <div v-if="props.showData.choiceQuestionListData[props.showData.workIndex]">{{
+          <div class="c_title" v-if="props.showData.choiceQuestionListData[props.showData.workIndex]">
+            <span>{{
             props.showData.choiceQuestionListData[props.showData.workIndex]
               .teststitle
-          }}</div>
+          }}</span>
+            <div class="switch_btn" v-if="props.isCreator && props.roleType == 1">
+              <div class="switch">
+                <Switch :value="canValue" @update:value="handleCanChange" />
+                <span>{{ lang.ssShowResult }}</span>
+              </div>
+            </div>
+          </div>
           <div class="c_t45_msg" v-if="props.roleType == 1">
             <div>{{ lang.ssAnswerCount }} {{ props.showData.workArray.length }}<span
                 v-if="props.showData.unsubmittedStudents.length > 0">/{{ props.showData.workArray.length +
@@ -104,10 +112,18 @@
       <!-- 投票 -->
       <div class="c_t45" v-if="workDetail && workDetail.type === '78' && props.showData">
         <div class="c_t45_title">
-          <div v-if="props.showData.choiceQuestionListData[props.showData.workIndex]">{{
+          <div class="c_title" v-if="props.showData.choiceQuestionListData[props.showData.workIndex]">
+            <span>{{
             props.showData.choiceQuestionListData[props.showData.workIndex]
               .teststitle
-          }}</div>
+          }}</span>
+            <div class="switch_btn" v-if="props.isCreator && props.roleType == 1">
+              <div class="switch">
+                <Switch :value="canValue" @update:value="handleCanChange" />
+                <span>{{ lang.ssShowResult }}</span>
+              </div>
+            </div>
+          </div>
           <div class="c_t45_msg" v-if="props.roleType == 1">
             <div>{{ lang.ssAnswerCount }} {{ props.showData.workArray.length }}<span
                 v-if="props.showData.unsubmittedStudents.length > 0">/{{ props.showData.workArray.length +
@@ -197,7 +213,17 @@
 
       <!-- 问答题 -->
       <div class="c_t15" v-if="workDetail && workDetail.type === '15' && props.showData">
-        <div class="c_t15_title">{{ workDetail.json.answerQ }}</div>
+        <div class="c_t15_title">
+          <div class="c_title">
+            <span>{{ workDetail.json.answerQ }}</span>
+            <div class="switch_btn" v-if="props.isCreator && props.roleType == 1">
+              <div class="switch">
+                <Switch :value="canValue" @update:value="handleCanChange" />
+                <span>{{ lang.ssShowResult }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
         <span class="c_t15_type">{{ lang.ssQATest }}</span>
         <div class="c_t15_msg" v-if="props.roleType == 1">
           <div>{{ lang.ssAnswerCount }} {{ props.showData.workArray.length }}<span
@@ -277,7 +303,17 @@
 
       <!-- 拍照 -->
       <div class="c_t15" v-if="workDetail && workDetail.type === '79' && props.showData">
-        <div class="c_t15_title">{{ workDetail.json.answerQ }}</div>
+        <div class="c_t15_title">
+          <div class="c_title">
+            <span>{{ workDetail.json.answerQ }}</span>
+            <div class="switch_btn" v-if="props.isCreator && props.roleType == 1">
+              <div class="switch">
+                <Switch :value="canValue" @update:value="handleCanChange" />
+                <span>{{ lang.ssShowResult }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
         <span class="c_t15_type">{{ lang.ssPhoto }}</span>
         <div class="c_t15_msg" v-if="props.roleType == 1">
           <div>{{ lang.ssAnswerCount }} {{ props.showData.workArray.length }}<span
@@ -340,7 +376,17 @@
 
       <!-- AI应用 -->
       <div class="c_t72" v-if="props.showData && props.showData.toolType === 72">
-        <div class="c_t72_title">{{ lang.ssAiApp }}</div>
+        <div class="c_t72_title">
+          <div class="c_title">
+            <span>{{ lang.ssAiApp }}</span>
+            <div class="switch_btn" v-if="props.isCreator && props.roleType == 1">
+              <div class="switch">
+                <Switch :value="canValue" @update:value="handleCanChange" />
+                <span>{{ lang.ssShowResult }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
         <span class="c_t72_type">{{ lang.ssAiApp }}</span>
         <div class="c_t72_msg" v-if="props.roleType == 1">
           <div>{{ lang.ssAnswerCount }} {{ props.showData.workArray.length }}<span
@@ -440,7 +486,17 @@
 
       <!-- H5页面 -->
       <div class="c_t73" v-if="props.showData && props.showData.toolType === 73">
-        <div class="c_t73_title">{{ lang.ssPageImage }}</div>
+        <div class="c_t73_title">
+          <div class="c_title">
+            <span>{{ lang.ssPageImage }}</span>
+            <div class="switch_btn" v-if="props.isCreator && props.roleType == 1">
+              <div class="switch">
+                <Switch :value="canValue" @update:value="handleCanChange" />
+                <span>{{ lang.ssShowResult }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
         <span class="c_t73_type">{{ lang.ssHPage }}</span>
         <div class="c_t73_msg" v-if="props.roleType == 1">
           <div>{{ lang.ssAnswerCount }} {{ props.showData.workArray.length }}<span
@@ -491,6 +547,8 @@ import selectUserDialog from './selectUserDialog.vue'
 import echartsDialog from './echartsDialog.vue'
 import { chat_stream, chat_no_stream } from '@/tools/aiChat'
 import axios from '@/services/config'
+import Switch from '@/components/Switch.vue'
+
 const props = defineProps<{
   visible: number[];
   workIndex: number;
@@ -505,11 +563,14 @@ const props = defineProps<{
   cid: string;
   workUrl: string;
   roleType: number;
+  resultArray: { [key: string]: any };
+  isCreator: boolean;
 }>()
 
 const emit = defineEmits<{
   (e: 'update:visible', v: number[]): void;
   (e: 'changeWorkIndex', v: number): void;
+  (e: 'setIsResultArray', v: boolean, key: string): void;
 }>()
 
 const visible = computed({
@@ -524,6 +585,18 @@ const workDetail = computed(() => {
   return null
 })
 
+const canValue = ref(props.resultArray?.can ?? false)
+
+watch(() => props.resultArray?.can, (newVal) => {
+  canValue.value = newVal
+})
+
+const handleCanChange = (value: boolean) => {
+  console.log(value)
+  console.log(props.resultArray)
+  emit('setIsResultArray', value, 'can')
+}
+
 // 预览图片组件
 const previewImageToolRef = ref<any>(null)
 // 选择用户组件
@@ -3071,4 +3144,27 @@ onUnmounted(() => {
     pointer-events: none !important;
   }
 }
+
+.c_title{
+  display: flex;
+
+  &>span {
+    flex: 1;
+    word-break: break-all;
+  }
+}
+
+.switch_btn{
+  display: flex;
+  align-items: center;
+  gap: .5rem;
+
+  &>.switch{
+    display: flex;
+    align-items: center;
+    gap: .5rem;
+    font-size: .8rem;
+    color: #141517;
+  }
+}
 </style>

+ 16 - 1
src/views/Student/index.vue

@@ -106,7 +106,7 @@
           <ScreenSlideList :style="{ width: isFullscreen ? '100%' : slideWidth2 * canvasScale + 'px', height: isFullscreen ? '100%' : slideHeight2 * canvasScale + 'px', margin: '0 auto' }" :slideWidth="isFullscreen ? slideWidth * canvasScale : slideWidth2 * canvasScale" :slideHeight="isFullscreen ? slideHeight * canvasScale : slideHeight2 * canvasScale"
             :animationIndex="0" :turnSlideToId="() => { }" :manualExitFullscreen="() => { }"  :slideIndex="slideIndex" v-show="!choiceQuestionDetailDialogOpenList.includes(slideIndex)"/>
 
-          <choiceQuestionDetailDialog v-if="choiceQuestionDetailDialogOpenList.includes(slideIndex) && currentSlideToolType !== 77" :roleType="props.type" :cid="props.cid" :workId="workId" :workUrl="workUrl" :userId="props.userid" :courseDetail="courseDetail" :workArray="workArray" @changeWorkIndex="changeWorkIndex" v-model:visible="choiceQuestionDetailDialogOpenList" :showData="answerTheResultRef" :slideIndex="slideIndex" :workIndex="0" :style="{ width: isFullscreen ? '100%' : slideWidth2 * canvasScale + 'px', height: isFullscreen ? '100%' : slideHeight2 * canvasScale + 'px', margin: '0 auto' }" :slideWidth="isFullscreen ? slideWidth * canvasScale : slideWidth2 * canvasScale" :slideHeight="isFullscreen ? slideHeight * canvasScale : slideHeight2 * canvasScale"/>
+          <choiceQuestionDetailDialog v-if="choiceQuestionDetailDialogOpenList.includes(slideIndex) && currentSlideToolType !== 77" :roleType="props.type" :cid="props.cid" :workId="workId" :workUrl="workUrl" :userId="props.userid" :courseDetail="courseDetail" :workArray="workArray" @changeWorkIndex="changeWorkIndex" v-model:visible="choiceQuestionDetailDialogOpenList" :showData="answerTheResultRef" :slideIndex="slideIndex" :workIndex="0" :style="{ width: isFullscreen ? '100%' : slideWidth2 * canvasScale + 'px', height: isFullscreen ? '100%' : slideHeight2 * canvasScale + 'px', margin: '0 auto' }" :slideWidth="isFullscreen ? slideWidth * canvasScale : slideWidth2 * canvasScale" :slideHeight="isFullscreen ? slideHeight * canvasScale : slideHeight2 * canvasScale" :resultArray="currentIsResultArray" @setIsResultArray="setIsResultArray2" :isCreator="isCreator"/>
           <SpeakingClassPanel
             v-else-if="choiceQuestionDetailDialogOpenList.includes(slideIndex) && currentSlideToolType === 77"
             ref="speakingPanelRef"
@@ -3051,6 +3051,21 @@ const setIsResultArray = () => {
   }
 }
 
+const setIsResultArray2 = (value: boolean, key: string) => {
+  isResultArray.value[slideIndex.value][key] = value
+  console.log(isResultArray.value)
+  // @ts-ignore
+  if (window.parent && typeof window.parent.setIsResultArray2 === 'function') {
+    // @ts-ignore
+    window.parent.setIsResultArray2(isResultArray.value)
+  }
+  sendMessage({ 
+    type: 'isResultArray', 
+    isResultArray: isResultArray.value,
+    courseid: props.courseid 
+  })
+}
+
 const setCan = (Array: any[]) => {
   isResultArray.value = Array
   sendMessage({ 

+ 2 - 1
src/views/lang/cn.json

@@ -909,5 +909,6 @@
   "ssAddWebH5": "新建网页h5",
   "ssCreating": "创建中...",
   "ssWebEditor": "AI 网页编辑器",
-  "ssConfirmAdd": "确认添加"
+  "ssConfirmAdd": "确认添加",
+  "ssShowResult": "展示结果"
 }

+ 2 - 1
src/views/lang/en.json

@@ -909,5 +909,6 @@
   "ssAddWebH5": "Add Web H5",
   "ssCreating": "Creating...",
   "ssWebEditor": "AI Web Editor",
-  "ssConfirmAdd": "Confirm Add"
+  "ssConfirmAdd": "Confirm Add",
+  "ssShowResult": "Show Result"
 }

+ 2 - 1
src/views/lang/hk.json

@@ -909,5 +909,6 @@
   "ssAddWebH5": "新增網頁H5",
   "ssCreating": "創建中...",
   "ssWebEditor": "AI 網頁編輯器",
-  "ssConfirmAdd": "確認添加"
+  "ssConfirmAdd": "確認添加",
+  "ssShowResult": "展示結果"
 }