Bladeren bron

1、优化查询课程新增页面:类型筛选拆分成实操课和通识课两个筛选条件

liyanbo 7 maanden geleden
bovenliggende
commit
d2804a0731
2 gewijzigde bestanden met toevoegingen van 28 en 8 verwijderingen
  1. 28 7
      src/views/bjdx/course/CourseForm.vue
  2. 0 1
      src/views/bjdx/course/index.vue

+ 28 - 7
src/views/bjdx/course/CourseForm.vue

@@ -7,18 +7,27 @@
       label-width="120px"
       v-loading="formLoading"
     >
-      <el-form-item label="课程类型" prop="courseType">
+      <el-form-item label="课程类型">
+        <el-select
+          v-model="formData.ctTypeNode"
+          placeholder="请选择课程类型"
+          @change="handleCtTypeNodeChange"
+        >
+          <el-option label="ai通识课" value="1" />
+          <el-option label="ai实操课" value="2" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="大纲课程" prop="courseType">
         <el-tree-select
           v-model="formData.courseType"
           :data="courseTypeTree"
-          :props="{
-            ...defaultProps,
-            label: (node) => `${node.ctType}${node.ctTypeNode === '0' ? '(年级)' :  node.ctTypeNode === '1' ? '(ai通识课)' : '(ai实操课)'}`,
+          :props="{...defaultProps,
+            label: (node) => `${node.ctTypeNode === '0' || node.ctTypeNode === undefined ? node.ctType : node.ctTypeSort + '、' + node.ctType}`,
             // 根据 ctTypeNode 字段判断是否禁用选项
             disabled: (node) => node.ctTypeNode === '0',
             // 明确指定 value 字段为 id
             value: 'id'
-          }"
+            }"
           placeholder="请选择课程类型"
           :default-expand-all="true"
         />
@@ -286,6 +295,7 @@ const formLoading = ref(false) // 表单的加载中:1)修改时的数据加
 const formType = ref('') // 表单的类型:create - 新增;update - 修改
 const formData = ref({
   id: undefined,
+  ctTypeNode: "1",
   courseName: undefined,
   courseContentType: undefined,
   courseImagePath: undefined,
@@ -404,10 +414,17 @@ const handleUploadComplete = () => {
   uploadProgress.value = 100
 }
 
+/** 处理课程类型节点变更 */
+const handleCtTypeNodeChange = (ctTypeNode) => {
+  formData.value.courseType = undefined
+  getCourseTypeTree(ctTypeNode)
+}
+
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {
     id: undefined,
+    ctTypeNode: "1",
     courseName: undefined,
     courseContentType: undefined,
     courseImagePath: undefined,
@@ -441,11 +458,15 @@ const resetForm = () => {
   formRef.value?.resetFields()
 }
 /** 获得课程-类型树 */
-const getCourseTypeTree = async () => {
+const getCourseTypeTree = async (filterCtTypeNode = "1") => {
   courseTypeTree.value = []
   const data = await CourseTypeApi.getCourseTypeSimpleList()
+  let filteredData = data
+  if (filterCtTypeNode !== undefined) {
+    filteredData = data.filter(item => item.ctTypeNode === '0' || item.ctTypeNode === filterCtTypeNode)
+  }
   const root: Tree = { id: 0, ctType: '课程类型', ctTypeNode: '0', children: [] }
-  root.children = handleTree(data, 'id', 'ctParentId')
+  root.children = handleTree(filteredData, 'id', 'ctParentId')
   courseTypeTree.value.push(root)
 }
 </script>

+ 0 - 1
src/views/bjdx/course/index.vue

@@ -368,7 +368,6 @@ const getCourseTypeTree = async (filterCtTypeNode = "1") => {
   if (filterCtTypeNode !== undefined) {
     filteredData = data.filter(item => item.ctTypeNode === '0' || item.ctTypeNode === filterCtTypeNode)
   }
-  console.log(filteredData)
   const root: Tree = { id: 0, ctType: '课程类型' + (filterCtTypeNode === "1" ? '(ai通识课)' : '(ai实操课)'), children: [] }
   root.children = handleTree(filteredData, 'id', 'ctParentId')
   courseTypeTree.value.push(root)