src/renderer/src/api/subject/index.js

@@ -1,10 +1,10 @@
 // 查询evaluation列表
 import request from '@/utils/request'
 
-export const listEvaluation = (query)=> {
+export const listEvaluation = (params)=> {
   return request({
     url: '/education/evaluation/list',
     method: 'get',
-    params: query
+    params
   })
 }

src/renderer/src/assets/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 2794390 */
-  src: url('iconfont.woff2?t=1720494614524') format('woff2'),
-       url('iconfont.woff?t=1720494614524') format('woff'),
-       url('iconfont.ttf?t=1720494614524') format('truetype');
+  src: url('iconfont.woff2?t=1720508953092') format('woff2'),
+       url('iconfont.woff?t=1720508953092') format('woff'),
+       url('iconfont.ttf?t=1720508953092') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-guanbi:before {
+  content: "\e60f";
+}
+
 .icon-xiangyou:before {
   content: "\e609";
 }

src/renderer/src/assets/iconfont/iconfont.json

@@ -5,6 +5,13 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "4736203",
+      "name": "关闭",
+      "font_class": "guanbi",
+      "unicode": "e60f",
+      "unicode_decimal": 58895
+    },
     {
       "icon_id": "22358026",
       "name": "向右",

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

@@ -1,108 +1,171 @@
 <template>
   <div class="book-wrap">
-    <div class="book-name flex">
-      <span>语文-人教版-七年级上</span>
+    <div class="book-name flex" @click="dialogVisible = true">
+      <span>{{ curBookName }}</span>
       <i class="iconfont icon-xiangyou"></i>
     </div>
     <div class="book-list">
-      <el-tree
-        :data="data"
-        :props="defaultProps"
-        @node-click="handleNodeClick"
-      />
+      <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
     </div>
   </div>
-  <el-dialog
-    v-model="dialogVisible"
-    title="切换教材"
-    width="30%"
-  >
-    <span>This is a message</span>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button @click="dialogVisible = false">Cancel</el-button>
-        <el-button type="primary" @click="dialogVisible = false">
-          Confirm
-        </el-button>
+  <!--弹窗 选择教材-->
+  <el-dialog v-model="dialogVisible" class="choose-dialog" append-to-body :show-close="false" width="550">
+    <template #header>
+      <div class="choose-book-header flex">
+        <span>切换教材</span>
+        <i class="iconfont icon-guanbi" @click="dialogVisible = false"></i>
       </div>
     </template>
+
+    <div class="textbook-container">
+      <el-scrollbar height="450px">
+        <div class="textbook-item flex" v-for="item in subjectList" :class="curBookId == item.id ? 'active-item' : ''"
+          :key="item.id" @click="changeBook(item)">
+          <img :src="item.avartar" class="textbook-img" alt="">
+          <span class="book-name">{{ item.itemtitle }}</span>
+        </div>
+      </el-scrollbar>
+    </div>
   </el-dialog>
 </template>
 
 <script setup>
-  import { onMounted, ref } from 'vue';
-  import useUserStore from '@/store/modules/user'
-  import { listEvaluation } from '@/api/subject'
-    
-  const userStore = useUserStore()
-  const { edustage, edusubject } = userStore.user
-  const dialogVisible = ref(true)
+import { onMounted, ref } from 'vue';
+import useUserStore from '@/store/modules/user'
+import { listEvaluation } from '@/api/subject'
+import { handleTree } from '@/utils/ruoyi.js'
 
-  const getSubject = async ()=>{
-    const { rows } = await listEvaluation({ itemkey: "version", pageSize: 500 })
-    const data = rows.filter( item => item.edustage == edustage && item.edusubject == edusubject)
-    console.log(data)
-    
+const userStore = useUserStore()
+const { edustage, edusubject, userId } = userStore.user
+//
+const subjectList = ref([])
+const dialogVisible = ref(false)
+//当前教材ID
+const curBookId = ref(-1)
+//当前教材名称
+const curBookName = 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 () => {
+  const params = {
+    edusubject,
+    edustage,
+    entpcourseedituserid: userId,
+    pageSize: 500
   }
+  const { rows } = await listEvaluation(params)
+  //上册
+  const beforAry = []
+  //下册
+  const nextAry = []
+  rows.map(item => {
+    if (item.level == 1) {
+      if (item.semester == '上册') {
+        beforAry.push(item)
+      }
+      if (item.semester == '下册') {
+        nextAry.push(item)
+      }
+    }
+  })
+  
+  console.log(beforAry)
+  beforAry.forEach( item =>{
+    let obj = {}
+    if(item.rootid == curBookId){
+      obj.itemtitle = item.itemtitle
+      
+    }
+  })
 
-  onMounted(getSubject)
-  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 = {
+  console.log(nextAry)
+}
+
+//选择教材
+const changeBook = ({ id, itemtitle }) => {
+  curBookId.value = id
+  curBookName.value = itemtitle
+  setTimeout(() => {
+    dialogVisible.value = false
+  }, 100);
+}
+
+// 图片地址
+const getImageUrl = (url) => {
+  const path = new URL(`${url}`, import.meta.url)
+  return path.href
+}
+
+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',
 }
@@ -110,24 +173,71 @@
 </script>
 
 <style lang="scss" scoped>
-  .book-wrap{
-    width: 260px;
-    height: 100%;
-    background: #ffffff;
-    border-radius: 10px;
-    box-shadow: 0px 0px 20px 0px rgba(99,99,99,0.06);
+.book-wrap {
+  width: 260px;
+  height: 100%;
+  background: #ffffff;
+  border-radius: 10px;
+  box-shadow: 0px 0px 20px 0px rgba(99, 99, 99, 0.06);
 
-    .book-name{
-      height: 45px;
-      padding: 0 15px;
-      justify-content: space-between;
-      align-items: center;
+  .book-name {
+    height: 45px;
+    padding: 0 15px;
+    justify-content: space-between;
+    align-items: center;
+    color: #3b3b3b;
+    cursor: pointer;
+    border-bottom: solid #f4f5f7 1px;
+  }
+
+  .book-list {
+    padding: 0 20px;
+  }
+}
+
+:deep(.choose-dialog) {
+  border-radius: 10px;
+}
+
+.choose-book-header {
+  justify-content: space-between;
+  font-size: 15px;
+
+  .icon-guanbi {
+    font-size: 20px;
+    cursor: pointer;
+  }
+}
+
+.textbook-container {
+  .textbook-item {
+    padding: 10px 20px;
+    align-items: center;
+    border-radius: 5px;
+    cursor: pointer;
+
+    .book-name {
+      margin-left: 20px;
       color: #3b3b3b;
-      cursor: pointer;
-      border-bottom: solid #f4f5f7 1px;
     }
-    .book-list{
-      padding: 0 20px;
+
+    &:hover {
+      background: #f4f7f9;
     }
   }
+
+  .active-item {
+    background-color: #f4f7f9;
+
+    .book-name {
+      color: #368fff;
+      font-weight: bold
+    }
+  }
+
+  .textbook-img {
+    width: 55px;
+    height: 70px;
+  }
+}
 </style>