feat: 新增KWL表格教学工具及多语言配置

1. 新增cn/hk/en三种语言的KWL工具相关翻译文案
2. 在添加课程页面新增KWL工具的添加逻辑
3. 完成KWL表格页面的国际化适配与功能完善

src/components/pages/pptEasy/addCourse3.vue

@@ -2747,6 +2747,23 @@ export default {
         // this.$message.info("添加H5页面");
       }
     },
+    //添加工具
+    addTool2(tool, data) {
+      let tile = ""
+      if (tool == 831){
+        title = "kwl"
+      }
+      this.dialogVisibleChoice = false;
+      let _data = { id: new Date().getTime(), tool: 15, title: title, json: data, url: "" }
+      this.pptCourseJson.toolsList.push(_data);
+      this.getWorkPageId(_data.id, tool, data).then(res => {
+        let baseUrl = this.setUrl()
+        let url = `${baseUrl}/pbl-teacher-table/dist/workPage.html#/setWorkPage?id=${res}&type=${tool}`
+        this.pptCourseJson.toolsList.find(i => i.id === _data.id).url = url;
+        this.setPPtToolList();
+        this.addContent(_data, 2)
+      });
+    },
     // 打开视频上传弹窗
     openVideoUploadDialog() {
       this.$refs.VideoUploadDialogRef.open();
@@ -3705,6 +3722,7 @@ export default {
 
     }
     window.addTool = (tool) => this.addTool(tool); // 添加工具
+    window.addTool2 = (tool, data) => this.addTool2(tool, data); // 添加工具
     window.openVideoUploadDialog = () => this.openVideoUploadDialog(); // 打开视频上传弹窗
     window.openApplicationCenter = () => this.openApplicationCenter(); // 打开应用中心弹窗
     window.toolBtn = (type, id) => this.toolBtn(type, id); // 工具按钮点击事件

src/components/pages/workPage/components/kwlPage.vue

@@ -4,11 +4,11 @@
       <!-- 头部卡片 -->
       <div class="kwlHeader">
         <div class="kwlHeaderLeft">
-          <div class="kwlTitle">KWL表格</div>
-          <div class="kwlSubtitle">写下你已经知道的、还想知道的，学完后再回来看看自己学到了什么</div>
+          <div class="kwlTitle">{{ lang.ssKWLTitle }}</div>
+          <div class="kwlSubtitle">{{ lang.ssKWLSubtitle }}</div>
         </div>
         <div class="kwlHeaderRight" @click="showHowTo = !showHowTo">
-          <span>怎么做</span>
+          <span>{{ lang.ssKWLHowTo }}</span>
           <i :class="['kwlArrow', { 'kwlArrowUp': showHowTo }]">
             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-4 h-4 transition-transform "><polyline points="6 9 12 15 18 9"></polyline></svg>
           </i>
@@ -28,7 +28,7 @@
     <div class="kwlCard kwlTaskDesc" v-show="work.taskDescription || (work.taskUrl && work.taskUrl.length > 0)">
       <div class="kwlTaskHeader">
         <span class="kwlStar">✦</span>
-        <span class="kwlTaskTitle">任务说明</span>
+        <span class="kwlTaskTitle">{{ lang.ssKWLTaskDesc }}</span>
       </div>
       <div class="kwlTaskContent" v-show="showTaskDesc" v-if="work.taskDescription">{{ work.taskDescription }}</div>
       <!-- 任务附件：图片/视频预览 -->
@@ -67,10 +67,10 @@
     <div class="kwlColumns">
       <!-- K - 已知 -->
       <div class="kwlColumn kwlColKnow">
-        <div class="kwlColTitle kwlColTitleKnow">K - 已知</div>
+        <div class="kwlColTitle kwlColTitleKnow">{{ lang.ssKWLColKnow }}</div>
         <div class="kwlColBody">
           <div class="kwlEmptyTip" v-if="!work.know || work.know.length === 0">
-            点击下方添加内容
+            {{ lang.ssKWLAddContent }}
           </div>
           <div class="kwlItem" v-for="(item, idx) in work.know" :key="'k-' + idx">
             <span class="kwlItemText">{{ item }}</span>
@@ -81,7 +81,7 @@
           <input
             v-model="newKnow"
             class="kwlInput"
-            placeholder="添加..."
+            :placeholder="work.kplaceholder ? work.kplaceholder : lang.ssKWLAddPlaceholder"
             @keyup.enter="addItem('know')"
           />
           <button class="kwlAddBtn kwlAddBtnKnow" @click="addItem('know')">+</button>
@@ -90,10 +90,10 @@
 
       <!-- W - 想知 -->
       <div class="kwlColumn kwlColWant">
-        <div class="kwlColTitle kwlColTitleWant">W - 想知</div>
+        <div class="kwlColTitle kwlColTitleWant">{{ lang.ssKWLColWant }}</div>
         <div class="kwlColBody">
           <div class="kwlEmptyTip" v-if="!work.want || work.want.length === 0">
-            点击下方添加内容
+            {{ lang.ssKWLAddContent }}
           </div>
           <div class="kwlItem" v-for="(item, idx) in work.want" :key="'w-' + idx">
             <span class="kwlItemText">{{ item }}</span>
@@ -104,7 +104,7 @@
           <input
             v-model="newWant"
             class="kwlInput"
-            placeholder="添加..."
+            :placeholder="work.wplaceholder ? work.wplaceholder : lang.ssKWLAddPlaceholder"
             @keyup.enter="addItem('want')"
           />
           <button class="kwlAddBtn kwlAddBtnWant" @click="addItem('want')">+</button>
@@ -113,10 +113,10 @@
 
       <!-- L - 已学 -->
       <div class="kwlColumn kwlColLearn">
-        <div class="kwlColTitle kwlColTitleLearn">L - 已学</div>
+        <div class="kwlColTitle kwlColTitleLearn">{{ lang.ssKWLColLearn }}</div>
         <div class="kwlColBody">
           <div class="kwlEmptyTip" v-if="!work.learned || work.learned.length === 0">
-            点击下方添加内容
+            {{ lang.ssKWLAddContent }}
           </div>
           <div class="kwlItem" v-for="(item, idx) in work.learned" :key="'l-' + idx">
             <span class="kwlItemText">{{ item }}</span>
@@ -127,7 +127,7 @@
           <input
             v-model="newLearned"
             class="kwlInput"
-            placeholder="添加..."
+            :placeholder="work.lplaceholder ? work.lplaceholder : lang.ssKWLAddPlaceholder"
             @keyup.enter="addItem('learned')"
           />
           <button class="kwlAddBtn kwlAddBtnLearn" @click="addItem('learned')">+</button>
@@ -136,19 +136,19 @@
     </div>
 
     <!-- 学习反思 -->
-    <div class="kwlCard kwlReflection">
-      <div class="kwlRefTitle">学习反思</div>
+    <div class="kwlCard kwlReflection" v-if="isShowReflection">
+      <div class="kwlRefTitle">{{ lang.ssKWLReflection }}</div>
       <div class="kwlRefAreaWrap">
         <textarea
           v-model="work.reflection"
           class="kwlRefTextarea"
-          placeholder="回顾整个学习过程，你有什么新的发现或感想？"
+          :placeholder="lang.ssKWLReflectionPH"
         ></textarea>
         <!-- 右下角麦克风按钮：点击开始/停止录音 -->
         <div
           class="kwlMicBtn"
           :class="{ kwlMicBtnActive: recordObj.status == '1' }"
-          :title="recordObj.status == '1' ? '停止录音' : '语音输入'"
+          :title="recordObj.status == '1' ? lang.ssKWLStopRec : lang.ssKWLVoiceInput"
           @click="recordObj.status == '1' ? stopRecord() : startRecord()"
         >
           <!-- 录音中：声波动画 -->
@@ -221,6 +221,7 @@ export default {
       newLearned: "",
       showHowTo: false,
       showTaskDesc: true,
+      isShowReflection: true,
       recordObj: {
         status: "0", // 0：默认  1：录音中
         loading: false,
@@ -229,10 +230,10 @@ export default {
       videoDialogVisible: false,
       currentVideoUrl: "",
       howToSteps: [
-        "在K栏填写：我已经知道什么（Know）",
-        "在W栏填写：我想知道什么（Want to know）",
-        "学习后在L栏填写：我学到了什么（Learned）",
-        "反思：对比K和L栏，总结学习收获"
+        this.lang.ssKWLStep1,
+        this.lang.ssKWLStep2,
+        this.lang.ssKWLStep3,
+        this.lang.ssKWLStep4
       ]
     };
   },
@@ -261,18 +262,21 @@ export default {
         let _data = JSON.parse(JSON.stringify(this.workData.json || {}));
         if (JSON.stringify(newValue) != JSON.stringify(oldValue) || JSON.stringify(this.work) != JSON.stringify(_data)) {
           this.work = Object.assign({
-        know: [],
-        want: [],
-        learned: [],
-        reflection: "",
-        taskDescription: "",
-        taskUrl: [],
-        showHowTo: false,
-        kplaceholder:"",
-        wplaceholder:"",
-        lplaceholder:"",
-        isShowReflection: true
+            know: [],
+            want: [],
+            learned: [],
+            reflection: "",
+            taskDescription: "",
+            taskUrl: [],
+            showHowTo: false,
+            kplaceholder:"",
+            wplaceholder:"",
+            lplaceholder:"",
+            isShowReflection: true
           }, _data);
+
+          this.showHowTo = this.work.showHowTo;
+          this.isShowReflection = this.work.isShowReflection;
         }
       },
       deep: true,
@@ -318,7 +322,7 @@ export default {
     startRecord() {
       let iframe = this.$refs["iframeRef"];
       if (!iframe || !iframe.contentWindow) {
-        this.$message.error("录音服务未就绪");
+        this.$message.error(this.lang.ssKWLRecServiceNotReady);
         return;
       }
       try {
@@ -349,21 +353,21 @@ export default {
               this.recordObj.loading = false;
               iframe.contentWindow.onSessionStopped = null;
               iframe.contentWindow.window.onRecognizedResult = null;
-              this.$message.warning("未获得麦克风权限，录音已停止");
+              this.$message.warning(this.lang.ssKWLNoPermStop);
               return;
             }
           }).catch(() => {});
         }, 2000);
       } catch (err) {
         console.error("startRecord error:", err);
-        this.$message.error("启动录音失败");
+        this.$message.error(this.lang.ssKWLRecStartFail);
         this.recordObj.status = "0";
       }
     },
     // 停止录音
     stopRecord() {
       if (new Date().getTime() - this.recordObj.startTime < 2000) {
-        this.$message.info("录音时间过短");
+        this.$message.info(this.lang.ssKWLRecordShort);
         return;
       }
       navigator.permissions && navigator.permissions.query({ name: 'microphone' }).then(permissionStatus => {
@@ -375,7 +379,7 @@ export default {
             iframe.contentWindow.onSessionStopped = null;
             iframe.contentWindow.window.onRecognizedResult = null;
           }
-          this.$message.warning("未获得麦克风权限");
+          this.$message.warning(this.lang.ssKWLNoMicPerm);
           return;
         }
         if (this.recordObj.status == '1' && !this.recordObj.loading) {
@@ -399,7 +403,7 @@ export default {
           iframe.contentWindow.onSessionStopped = () => {
             this.recordObj.status = "0";
             this.recordObj.loading = false;
-            this.$message.success("录音已停止");
+            this.$message.success(this.lang.ssKWLRecStopped);
             iframe.contentWindow.onSessionStopped = null;
             iframe.contentWindow.window.onRecognizedResult = null;
           };
@@ -420,7 +424,7 @@ export default {
           iframe.contentWindow.onSessionStopped = null;
           iframe.contentWindow.window.onRecognizedResult = null;
         }
-        this.$message.success("录音已停止");
+        this.$message.success(this.lang.ssKWLRecStopped);
       });
     }
   },

src/lang/cn.json

@@ -2067,5 +2067,29 @@
   "ssPleaseWait": "请稍后再试",
   "ssFileTooBig":"上传文件大小不能超过20MB, 请重新上传",
   "ssAIAssistantTip":"开启后，学生提交作业将弹出 AI 助手，并基于题目引导学生检查与反思。",
-  "ssCreateCourseLimit":"创建课程每学期仅创建5次"
+  "ssCreateCourseLimit":"创建课程每学期仅创建5次",
+  "ssKWLTitle":"KWL表格",
+  "ssKWLSubtitle":"写下你已经知道的、还想知道的，学完后再回来看看自己学到了什么",
+  "ssKWLHowTo":"怎么做",
+  "ssKWLStep1":"在K栏填写：我已经知道什么（Know）",
+  "ssKWLStep2":"在W栏填写：我想知道什么（Want to know）",
+  "ssKWLStep3":"学习后在L栏填写：我学到了什么（Learned）",
+  "ssKWLStep4":"反思：对比K和L栏，总结学习收获",
+  "ssKWLTaskDesc":"任务说明",
+  "ssKWLColKnow":"K - 已知",
+  "ssKWLColWant":"W - 想知",
+  "ssKWLColLearn":"L - 已学",
+  "ssKWLAddContent":"点击下方添加内容",
+  "ssKWLAddPlaceholder":"添加...",
+  "ssKWLReflection":"学习反思",
+  "ssKWLReflectionPH":"回顾整个学习过程，你有什么新的发现或感想？",
+  "ssKWLVoiceInput":"语音输入",
+  "ssKWLStartRec":"开始录音",
+  "ssKWLStopRec":"停止录音",
+  "ssKWLRecordShort":"录音时间过短",
+  "ssKWLNoPermStop":"未获得麦克风权限，录音已停止",
+  "ssKWLNoMicPerm":"未获得麦克风权限",
+  "ssKWLRecServiceNotReady":"录音服务未就绪",
+  "ssKWLRecStartFail":"启动录音失败",
+  "ssKWLRecStopped":"录音已停止"
 }

src/lang/en.json

@@ -2066,5 +2066,29 @@
   "ssPleaseWait": "Please wait, try again later.",
   "ssFileTooBig":"The uploaded file size cannot exceed 20MB, please re-upload.",
   "ssAIAssistantTip":"After enabling, students will be able to use the AI assistant and check with the help of the questions.",
-  "ssCreateCourseLimit":"Create course limit semester 5 times"
+  "ssCreateCourseLimit":"Create course limit semester 5 times",
+  "ssKWLTitle":"KWL Chart",
+  "ssKWLSubtitle":"Write down what you already know, what you want to know, and come back after learning to see what you have learned",
+  "ssKWLHowTo":"How to do",
+  "ssKWLStep1":"Fill in column K: What I already know (Know)",
+  "ssKWLStep2":"Fill in column W: What I want to know (Want to know)",
+  "ssKWLStep3":"After learning, fill in column L: What I learned (Learned)",
+  "ssKWLStep4":"Reflection: Compare columns K and L, summarize learning gains",
+  "ssKWLTaskDesc":"Task Description",
+  "ssKWLColKnow":"K - Know",
+  "ssKWLColWant":"W - Want",
+  "ssKWLColLearn":"L - Learned",
+  "ssKWLAddContent":"Click below to add content",
+  "ssKWLAddPlaceholder":"Add...",
+  "ssKWLReflection":"Learning Reflection",
+  "ssKWLReflectionPH":"Looking back on the whole learning process, what new discoveries or thoughts do you have?",
+  "ssKWLVoiceInput":"Voice Input",
+  "ssKWLStartRec":"Start Recording",
+  "ssKWLStopRec":"Stop Recording",
+  "ssKWLRecordShort":"Recording time is too short",
+  "ssKWLNoPermStop":"Microphone permission not granted, recording stopped",
+  "ssKWLNoMicPerm":"Microphone permission not granted",
+  "ssKWLRecServiceNotReady":"Recording service is not ready",
+  "ssKWLRecStartFail":"Failed to start recording",
+  "ssKWLRecStopped":"Recording stopped"
 }

src/lang/hk.json

@@ -2067,6 +2067,30 @@
   "ssPleaseWait": "請稍後再試",
   "ssFileTooBig":"上傳文件大小不能超過20MB, 請重新上傳",
   "ssAIAssistantTip":"開啟後，學生提交作業將彈出 AI 助手，並根據題目引導學生檢查與反思。",
-  "ssCreateCourseLimit":"創建課程每学期僅創建5次"
+  "ssCreateCourseLimit":"創建課程每学期僅創建5次",
+  "ssKWLTitle":"KWL表格",
+  "ssKWLSubtitle":"寫下你已經知道的、還想知道的，學完後再回來看看自己學到了什麼",
+  "ssKWLHowTo":"怎麼做",
+  "ssKWLStep1":"在K欄填寫：我已經知道什麼（Know）",
+  "ssKWLStep2":"在W欄填寫：我想知道什麼（Want to know）",
+  "ssKWLStep3":"學習後在L欄填寫：我學到了什麼（Learned）",
+  "ssKWLStep4":"反思：對比K和L欄，總結學習收穫",
+  "ssKWLTaskDesc":"任務說明",
+  "ssKWLColKnow":"K - 已知",
+  "ssKWLColWant":"W - 想知",
+  "ssKWLColLearn":"L - 已學",
+  "ssKWLAddContent":"點擊下方添加內容",
+  "ssKWLAddPlaceholder":"添加...",
+  "ssKWLReflection":"學習反思",
+  "ssKWLReflectionPH":"回顧整個學習過程，你有什麼新的發現或感想？",
+  "ssKWLVoiceInput":"語音輸入",
+  "ssKWLStartRec":"開始錄音",
+  "ssKWLStopRec":"停止錄音",
+  "ssKWLRecordShort":"錄音時間過短",
+  "ssKWLNoPermStop":"未獲得麥克風權限，錄音已停止",
+  "ssKWLNoMicPerm":"未獲得麥克風權限",
+  "ssKWLRecServiceNotReady":"錄音服務未就緒",
+  "ssKWLRecStartFail":"啟動錄音失敗",
+  "ssKWLRecStopped":"錄音已停止"
 }