src/renderer/src/components/choose-textbook/index.vue

@@ -5,7 +5,7 @@
       <i class="iconfont icon-xiangyou"></i>
     </div>
     <div class="book-list">
-      <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
+      <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick" />
     </div>
   </div>
   <!--弹窗 选择教材-->
@@ -33,25 +33,32 @@
 import { onMounted, ref } from 'vue';
 import useUserStore from '@/store/modules/user'
 import { listEvaluation } from '@/api/subject'
-import { handleTree } from '@/utils/ruoyi.js'
 
+// 定义要发送的emit事件
+const emit = defineEmits(['nodeClick'])
+// store
 const userStore = useUserStore()
 const { edustage, edusubject, userId } = userStore.user
 //
 const subjectList = ref([])
+const evaluationList = ref([])
 const dialogVisible = ref(false)
+// 当前教材下面单元内容数据
+const treeData = ref([])
+const defaultProps = {
+  children: 'children',
+  label: 'label',
+  class: 'textbook-tree'
+}
 //当前教材ID
 const curBookId = ref(-1)
 //当前教材名称
 const curBookName = ref('')
+// 上册
+const volumeOne = ref([])
+// 下册
+const volumeTwo = ref([])
 
-//获取教材
-const getSubject = async () => {
-  const { rows } = await listEvaluation({ itemkey: "version", pageSize: 500 })
-  subjectList.value = rows.filter(item => item.edustage == edustage && item.edusubject == edusubject)
-  curBookName.value = subjectList.value[0].itemtitle
-  curBookId.value = subjectList.value[0].id
-}
 
 //获取教材下面的单元内容
 const getSubjectContent = async () => {
@@ -62,119 +69,100 @@ const getSubjectContent = async () => {
     pageSize: 500
   }
   const { rows } = await listEvaluation(params)
+  evaluationList.value = rows
+  //获取教材版本
+  await getSubject()
   //上册
-  const beforAry = []
+  volumeOne.value = rows.filter(item => item.level == 1 && item.semester == '上册')
   //下册
-  const nextAry = []
-  rows.map(item => {
-    if (item.level == 1) {
-      if (item.semester == '上册') {
-        beforAry.push(item)
-      }
-      if (item.semester == '下册') {
-        nextAry.push(item)
-      }
-    }
-  })
+  volumeTwo.value = rows.filter(item => item.level == 1 && item.semester == '下册')
 
-  console.log(beforAry)
-  beforAry.forEach( item =>{
-    let obj = {}
-    if(item.rootid == curBookId){
-      obj.itemtitle = item.itemtitle
-      
-    }
-  })
-
-  console.log(nextAry)
+  getTreeData()
 }
 
 //选择教材
 const changeBook = ({ id, itemtitle }) => {
   curBookId.value = id
   curBookName.value = itemtitle
+  getTreeData()
   setTimeout(() => {
     dialogVisible.value = false
   }, 100);
+
 }
 
-// 图片地址
-const getImageUrl = (url) => {
-  const path = new URL(`${url}`, import.meta.url)
-  return path.href
+const getTreeData = () => {
+  //数据过滤
+  let upData = transData(volumeOne.value)
+  let downData = transData(volumeTwo.value)
+  treeData.value = [
+    {
+      label: "上册",
+      children: [...upData]
+    },
+    {
+      label: "下册",
+      children: [...downData]
+    }
+  ]
+}
+
+
+const transData = (data) => {
+  let ary = []
+
+  data.forEach(item => {
+    let obj = {}
+
+    if (item.rootid == curBookId.value) {
+      obj.label = item.itemtitle
+      obj.id = item.id
+      let ary2 = []
+      evaluationList.value.forEach(el => {
+        let obj2 = {}
+        if (item.id == el.parentid) {
+          obj2 = {
+            label: el.itemtitle,
+            id: el.id
+          }
+          ary2.push(obj2)
+        }
+        obj.children = ary2
+      })
+      ary.push(obj)
+    }
+  })
+  return ary
+}
+
+//获取教材
+const getSubject = async () => {
+  const { rows } = await listEvaluation({ itemkey: "version", pageSize: 500 })
+  subjectList.value = rows.filter(item => item.edustage == edustage && item.edusubject == edusubject && isHaveUnit(item.id))
+  curBookName.value = subjectList.value[0].itemtitle
+  curBookId.value = subjectList.value[0].id
+}
+
+
+const isHaveUnit = (id) => {
+  return evaluationList.value.some(item => {
+    return item.rootid == id
+  })
+}
+
+const handleNodeClick = (data) => {
+  emit('nodeClick', data)
 }
 
 onMounted(() => {
-  getSubject(),
   getSubjectContent()
 })
 
-const data = [{
-  label: 'Level one 1',
-  children: [
-    {
-      label: 'Level two 1-1',
-      children: [
-        {
-          label: 'Level three 1-1-1',
-        },
-      ],
-    },
-  ],
-},
-{
-  label: 'Level one 2',
-  children: [
-    {
-      label: 'Level two 2-1',
-      children: [
-        {
-          label: 'Level three 2-1-1',
-        },
-      ],
-    },
-    {
-      label: 'Level two 2-2',
-      children: [
-        {
-          label: 'Level three 2-2-1',
-        },
-      ],
-    },
-  ],
-},
-{
-  label: 'Level one 3',
-  children: [
-    {
-      label: 'Level two 3-1',
-      children: [
-        {
-          label: 'Level three 3-1-1',
-        },
-      ],
-    },
-    {
-      label: 'Level two 3-2',
-      children: [
-        {
-          label: 'Level three 3-2-1',
-        },
-      ],
-    },
-  ],
-},]
-const handleNodeClick = () => { }
-const defaultProps = {
-  children: 'children',
-  label: 'label',
-}
-
 </script>
 
 <style lang="scss" scoped>
 .book-wrap {
-  width: 260px;
+  width: 300px;
   height: 100%;
   background: #ffffff;
   border-radius: 10px;
@@ -191,7 +179,7 @@ const defaultProps = {
   }
 
   .book-list {
-    padding: 0 20px;
+    padding-left: 10px;
   }
 }
 
@@ -240,4 +228,15 @@ const defaultProps = {
     height: 70px;
   }
 }
+
+:deep(.el-tree-node) {
+  .el-tree-node__content {
+    height: 40px;
+    &:hover {
+      background-color: #eaf3ff;
+    }
+  }
+
+}
+
 </style>

src/renderer/src/views/login/index.vue

@@ -145,13 +145,6 @@ const closeWindow = () => {
       padding: 34px 42px;
       position: relative;
     }
-    .login-qr {
-      position: absolute;
-      top: 0;
-      right: 0;
-      width: 66px;
-      height: 66px;
-    }
     .welcome {
       padding-top: 35px;
       p {
@@ -162,18 +155,6 @@ const closeWindow = () => {
         font-weight: 700;
         font-size: 26px;
       }
-      .sub-welcome {
-        padding: 10px;
-        font-size: 18px;
-        font-weight: 700;
-        text-align: center;
-        color: #ffffff;
-        line-height: 25px;
-        letter-spacing: 0.26px;
-        opacity: 0.96;
-        background: #1748fd;
-        border-radius: 22px 22px 2px 22px;
-      }
     }
     .welcome-img {
       margin-top: 20px;
@@ -210,40 +191,6 @@ const closeWindow = () => {
       cursor: pointer;
     }
   }
-
-  .more {
-    margin-top: 30px;
-    .title-box {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      > p {
-        margin-bottom: 0;
-      }
-    }
-    .line {
-      width: 114px;
-      height: 1px;
-      background: #e6e6e6;
-    }
-    .title {
-      font-size: 14px;
-      font-weight: 500;
-      color: #a1aebe;
-      margin: 0 19px;
-    }
-    .login-type {
-      padding: 0 5px;
-      margin-top: 25px;
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      > img {
-        width: 30px;
-        height: 30px;
-      }
-    }
-  }
 }
 .header-tool {
   position: absolute;

src/renderer/src/views/resource/index.vue

@@ -1,6 +1,10 @@
 <template>
-  <div class="page-resource">
+  <div class="page-resource flex">
+    
     <ChooseTextbook />
+    <div class="page-right">
+
+    </div>
   </div>
 </template>
 
@@ -21,5 +25,14 @@ const userStore = useUserStore()
 .page-resource {
   padding-top: 20px;
   height: 100%;
+
+  .page-right {
+    flex: 1;
+    margin-left: 20px;
+    height: 100%;
+    background: #ffffff;
+    border-radius: 10px;
+    box-shadow: 0px 0px 20px 0px rgba(99, 99, 99, 0.06);
+  }
 }
 </style>