src/renderer/src/views/classTask/newClassTaskAssign/experimentQuestion/components/experimentList.vue

@@ -51,7 +51,8 @@ onMounted(() => {
 })
 
 defineExpose({
-  updateLabel
+  updateLabel,
+  onSelectOption
 })
 
 

src/renderer/src/views/classTask/newClassTaskAssign/experimentQuestion/components/selectClass.vue

@@ -1,6 +1,9 @@
 <template>
     <div style="display: flex;">
         <div style="margin-left: 15px">
+            <el-cascader v-model="bindSubject" :options="subjectList" @change="handleChange" />
+        </div>
+        <!-- <div style="margin-left: 15px">
             <el-dropdown @command="handleUserEduStage">
             <span class="el-dropdown-link">
                 <el-button class="custom-button" type="default" round >{{ useClassTaskStore().experimentObj.edustage }}
@@ -9,7 +12,6 @@
             </span>
             <template #dropdown>
                 <el-dropdown-menu>
-                <!-- <el-dropdown-item command="幼儿园">幼儿园</el-dropdown-item> -->
                 <el-dropdown-item command="小学">小学</el-dropdown-item>
                 <el-dropdown-item command="初中">初中</el-dropdown-item>
                 <el-dropdown-item command="高中">高中</el-dropdown-item>
@@ -33,7 +35,7 @@
                 </el-dropdown-menu>
             </template>
             </el-dropdown>
-        </div>
+        </div> -->
     </div>
 </template>
   
@@ -47,17 +49,119 @@ import useClassTaskStore from '@/store/modules/classTask'
 const userStore = useUserStore().user
 
 // 定义要发送的emit事件
-// let emit = defineEmits(['experlist'])
+let emit = defineEmits(['experlist'])
 // const expObj = ref({
 //     edustage: useClassTaskStore().experimentObj.edustage,
 //     edusubject: useClassTaskStore().experimentObj.edusubject,
 // })
-const subjectList = ref([])
+
+//const subjectList = ref([])
 const chooseGrade= ref({})
 const expList = ref([]) // 当前年级的所有课程
 const checkList = ref([])// 当前年级对应学科的课程，
 const isLoaded = ref(false);
 
+
+const bindSubject = ref([useClassTaskStore().experimentObj.edustage, useClassTaskStore().experimentObj.edusubject]);      // 默认为小学数学
+const subjectList = [
+    {
+        value: '小学',
+        label: '小学',
+        children: [
+        {
+            value: '数学',
+            label: '数学',
+
+        },
+        {
+            value: '物理',
+            label: '物理',
+
+        },
+        {
+            value: '化学',
+            label: '化学',
+
+        },
+        {
+            value: '生物',
+            label: '生物',
+
+        },
+        {
+            value: '科学',
+            label: '科学',
+
+        }]
+    },
+    {
+        value: '初中',
+        label: '初中',
+        children: [
+        {
+            value: '数学',
+            label: '数学',
+
+        },
+        {
+            value: '物理',
+            label: '物理',
+
+        },
+        {
+            value: '化学',
+            label: '化学',
+
+        },
+        {
+            value: '生物',
+            label: '生物',
+
+        },
+        {
+            value: '科学',
+            label: '科学',
+
+        }]
+    },
+    {
+        value: '高中',
+        label: '高中',
+        children: [
+        {
+            value: '数学',
+            label: '数学',
+
+        },
+        {
+            value: '物理',
+            label: '物理',
+
+        },
+        {
+            value: '化学',
+            label: '化学',
+
+        },
+        {
+            value: '生物',
+            label: '生物',
+
+        },
+        {
+            value: '科学',
+            label: '科学',
+
+        }]
+    }
+]
+const handleChange = (val) => {
+    useClassTaskStore().experimentObj.edustage = val[0];
+    useClassTaskStore().experimentObj.edusubject = val[1];
+    handleUserEduStage(useClassTaskStore().experimentObj.edustage);
+}
+
+
 // 获取基础的学科
 const getSubject = () => {
   //没有学科则不进行下面的步骤
@@ -67,19 +171,20 @@ const getSubject = () => {
 //     subjectList.value = res.rows.filter(item => arr.includes(String(item.id))).map(items => items)
 //     console.log(subjectList,'subjectList');
 //   })
+
     //这里获取死数据 学科list
-    const edustageList = ['小学','初中','高中'];
+    // const edustageList = ['小学','初中','高中'];
-    const subList = ['数学','物理','化学','生物','科学'];
+    // const subList = ['数学','物理','化学','生物','科学'];
-    edustageList.forEach((item) => {
+    // edustageList.forEach((item) => {
-        subList.forEach((subItems) => {
+    //     subList.forEach((subItems) => {
-            subjectList.value.push({
+    //         subjectList.value.push({
-                edustage: item,
+    //             edustage: item,
-                edusubject: subItems,
+    //             edusubject: subItems,
-                itemtitle: subItems
+    //             itemtitle: subItems
-            })
+    //         })
-        })
+    //     })
-    })
+    // })
-    console.log(subjectList,'subjectList');
+    // console.log(subjectList,'subjectList');
     
     // 默认读取一个学科
     const edusubject = useClassTaskStore().experimentObj.edusubject;
@@ -90,6 +195,8 @@ const getSubject = () => {
     isLoaded.value = true;
     //console.log('初始化执行完毕----');
 }
+
+
 // 展示有 实验科目的学科
 const isExpList = (edusubject) => {
     let list = [];
@@ -101,7 +208,7 @@ const isExpList = (edusubject) => {
             list = expList.value.filter(item => item.subject === 'physics')
             break;
         case '化学':
-            checkList.value = expList.value.filter(item => item.subject === 'chemistry')
+            list = expList.value.filter(item => item.subject === 'chemistry')
             break;
         case '生物':
             list = expList.value.filter(item => item.subject === 'biology')
@@ -112,19 +219,19 @@ const isExpList = (edusubject) => {
     } 
     return list.length > 0
 }
+
 // 选择学段
 const handleUserEduStage = (item) => {
     // userStore.edustage = item
     useClassTaskStore().experimentObj.edustage = item;
-    
     //清空操作
     expList.value = []
     if(item === '小学'){
         chooseGrade.value = jsonData.data.primary
         expList.value = chooseGrade.value
-        const newSubjectList = subjectList.value.filter(item => item.edustage === '小学');
+        const newSubjectList = subjectList.filter(item => item.value === '小学');
-        for(let i in newSubjectList){
+        for(let i of newSubjectList[0].children){
-            const name = newSubjectList[i].itemtitle
+            const name = i.value
             if(isExpList(name) && useClassTaskStore().experimentObj.edusubject===name){
                 //useClassTaskStore().experimentObj.edusubject = name;
                 // 更改学科默认与学科下的实验科目
@@ -135,9 +242,9 @@ const handleUserEduStage = (item) => {
     }else if(item === '初中'){
         chooseGrade.value = jsonData.data.junior
         expList.value = chooseGrade.value
-        const newSubjectList = subjectList.value.filter(item => item.edustage === '初中');
+        const newSubjectList = subjectList.filter(item => item.value === '初中');
-        for(let i in newSubjectList){
+        for(let i of newSubjectList[0].children){
-            const name = newSubjectList[i].itemtitle
+            const name = i.value
             if(isExpList(name) && useClassTaskStore().experimentObj.edusubject===name){
                 //useClassTaskStore().experimentObj.edusubject = name;
                 // 更改学科默认与学科下的实验科目
@@ -148,9 +255,9 @@ const handleUserEduStage = (item) => {
     }else if(item === '高中'){
         chooseGrade.value = jsonData.data.senior
         expList.value = chooseGrade.value
-        const newSubjectList = subjectList.value.filter(item => item.edustage === '高中');
+        const newSubjectList = subjectList.filter(item => item.value === '高中');
-        for(let i in newSubjectList){
+        for(let i of newSubjectList[0].children){
-            const name = newSubjectList[i].itemtitle
+            const name = i.value
             if(isExpList(name) && useClassTaskStore().experimentObj.edusubject===name){
                 //useClassTaskStore().experimentObj.edusubject = name;
                 // 更改学科默认与学科下的实验科目
@@ -161,7 +268,7 @@ const handleUserEduStage = (item) => {
     }
 }
 // 选择学科
-const handleUserEduSubject = (item) => {
+const handleUserEduSubject = (item, isEmit=true) => {
     // userStore.edusubject = item;
     useClassTaskStore().experimentObj.edusubject = item;
     console.log(item,'选择的学科-------')
@@ -185,7 +292,9 @@ const handleUserEduSubject = (item) => {
     }
     console.log(checkList.value,'checkList')
     useClassTaskStore().experimentObj.experimentList = checkList.value;
-    // emit('experlist',checkList.value)
+    if (isEmit) {
+        emit('experlist',checkList.value)
+    }
 }
 
 const updateCheckList = async () => {
@@ -205,7 +314,8 @@ const updateCheckList = async () => {
         }
         expList.value = chooseGrade.value
         const edusubject = useClassTaskStore().experimentObj.edusubject;
-        handleUserEduSubject(edusubject);
+        bindSubject.value = [edustage, edusubject];
+        handleUserEduSubject(edusubject, false);
     } catch (error) {
         console.error(error);
     }

src/renderer/src/views/classTask/newClassTaskAssign/experimentQuestion/index.vue

@@ -3,7 +3,7 @@
     <div class="activeExp-header"> 
       <div class="infomation" v-if="isStadium() !== true" >
         <!-- <selectClass v-if="!isSubject" @experlist="getExperimentList" /> -->
-        <selectClass ref="selectClassRef"/>
+        <selectClass ref="selectClassRef" @experlist="initExperimentFirst"/>
       </div>
       <div> 
         <selectExperiment ref="selectExperimentRef" @selectItem="getExperimentListItem" />
@@ -69,20 +69,28 @@ onMounted(() => {
 //   // mainDiv 为需控制高度自适应盒子，通过 ref="mainDiv" 绑定
 // }
 
-// 选择的学科 获取实验课程信息
+// 根据选择的学科 自动选中实验课程的第一个
-// const getExperimentList = (val) => {
+/**
-//   console.log(val,'选择的学科，获取实验课程list信息')
+ * warn: 这部分后续需优化(handleUserEduSubject存在多次调用):
-//   // experimentList.value = val;
+ * 目前会因为初始化时而watch到props的fileurl变化而额外总共执行2次. 而初始化时直接选择任务时, 会额外总共执行3次
-// }
+ */
+const initExperimentFirst = (val) => {
+  // 默认选中第一个实验
+  if (val[0].label && val[0].label !='') {
+    selectExperimentRef.value.onSelectOption(val[0].label);
+  }
+}
+
 // 选择的实验课
 const getExperimentListItem = (val) => {
   console.log(val,'选择的实验课程信息')
   activeExp.value = val;
   emit('clickExpObj', val)
 }
+
 // 监听实验课程信息
 watch(() => props.expObj.fileurl, (newVal, oldVal) => {
-  console.log(props.expObj,'科学实验科目')
+  console.log(props.expObj,'监听-科学实验科目')
   activeExp.value = props.expObj;
 
   //