src/renderer/src/components/file-image/index.vue

@@ -0,0 +1,40 @@
+<template>
+  <svg class="icon file-icon" aria-hidden="true" :style="{'font-size': size + 'px'}">
+    <use :xlink:href="getFileTypeIcon()"></use>
+  </svg>
+</template>
+
+<script setup>
+import { defineProps } from 'vue'
+
+const props = defineProps({
+  fileName: {
+    type: String,
+    default: ''
+  },
+  size: {
+    type: Number,
+    default: 30
+  }
+})
+
+
+const getFileTypeIcon = () => {
+  const name = props.fileName.substr(props.fileName.lastIndexOf('.') + 1);
+  const iconObj = {
+    pdf: 'icon-pdf',
+    ppt: 'icon-ppt',
+    pptx: 'icon-pptx',
+    doc: 'icon-word',
+    docx: 'icon-word',
+    mp4: 'icon-video',
+    mov: 'icon-mov',
+
+  }
+  return '#' + iconObj[name]
+}
+
+</script>
+
+<style lang="scss" scoped>
+</style>

src/renderer/src/components/upload-dialog/index.vue

@@ -16,9 +16,7 @@
             <div class="file-list-item flex" v-for="(item, index) in fileList" :key="item.uid">
               <div class="file-name">
                 <span class="name">标题：</span>
-                <svg class="icon icon-ppt" aria-hidden="true">
+                <FileImage :fileName="item.name" />
-                  <use :xlink:href="getFileTypeIcon(item.name)"></use>
-                </svg>
                 <span class="text">{{ item.name }}</span>
               </div>
               <div class="flex-type flex">
@@ -47,6 +45,7 @@
 
 <script setup>
 import { ref, defineProps, defineEmits, watch } from 'vue'
+import FileImage from '@/components/file-image/index.vue'
 import { ElMessage } from 'element-plus'
 
 const props = defineProps({
@@ -65,16 +64,18 @@ const fileType = ref(1)
 // 资源类型
 const resourceType = ref([
   {
-    label: '课件',
+    text: '素材',
-    value: 1
+    value: '素材'
   },
+
   {
-    label: '教案',
+    text: '课件',
-    value: 2
+    value: '课件'
   },
+
   {
-    label: '素材',
+    text: '教案',
-    value: 3
+    value: '教案'
   }
 ])
 
@@ -111,27 +112,15 @@ const hanleFileChange = (file) => {
     return false
   }
   if (file.status === 'ready') {
+    // 给一个默认的fileData
     file.fileData = {
-      fileFlag: 1
+      fileFlag: '课件'
     }
-    file.callback = successFile
     fileList.value.push(file)
   }
-  return false
 }
 
-let fileSuccessAry = []
+
-let fileNums = 0;
-const successFile = (res) => {
-  fileSuccessAry.push(res)
-  if(fileSuccessAry.length == fileNums){
-    let flag = fileSuccessAry.every(item => item.code == 200)
-    if(flag){
-      ElMessage.success('上传成功!')
-      fileNums = 0
-    }
-  }
-}
 
 const getFileTypeIcon = (fileName) => {
   const name = fileName.substr(fileName.lastIndexOf('.') + 1);
@@ -152,14 +141,12 @@ const delFile = (index) => {
 
 // 关闭弹窗前
 const beforeClose = (done) => {
-  fileNums = fileList.value.length
   fileList.value = []
   emit('update:modelValue', false)
   done()
 }
 // 关闭弹窗
 const closeDialog = () => {
-  fileNums = fileList.value.length
   fileList.value = []
   emit('update:modelValue', false)
 }

src/renderer/src/views/resource/container/resoure-list.vue

@@ -1,28 +1,28 @@
 <template>
-  <div class="resource-list">
+  <div class="resource-list" v-loading="sourceStore.loading">
     <el-scrollbar height="400px">
+      <el-empty description="暂无数据" v-if="!sourceStore.result.list.length" />
       <ul>
-        <li class="list-item">
+        <li class="list-item" v-for="item in sourceStore.result.list" :key="item.id">
-
           <div class="item-left flex">
-            <svg class="icon icon-ppt" aria-hidden="true">
+            <FileImage :fileName="item.fileName" :size="50" />
-              <use xlink:href="#icon-ppt"></use>
-            </svg>
             <div class="flex item-left-content">
-              <div class="name flex">第1课《春》课后巩固练习 2022-2023学年部编版语文七年级上册</div>
+              <div class="name flex">{{ item.fileName }}</div>
               <div class="item-tags flex">
                 <el-tag type="info" class="mr-10">教案</el-tag>
                 <el-tag type="info" class="mr-10">PPT</el-tag>
-                <span class="gray-text mr-10">2024-07-13上传</span>
+                <span class="gray-text mr-10">{{ item.uploadTime }}上传</span>
                 <span class="line mr-10"></span>
                 <span class="gray-text mr-10">下载3次</span>
               </div>
             </div>
           </div>
           <div class="item-btns" @click.stop>
-            <el-popover placement="bottom-end" trigger="click" popper-class="custom-popover">
+            <el-popover placement="bottom-end"  trigger="hover" popper-class="custom-popover"
+              :visible="item.showPopover">
               <template #reference>
-                <el-button link type="primary"> <i class="iconfont icon-shenglvehao"></i></el-button>
+                <el-button link type="primary" > <i
+                    class="iconfont icon-shenglvehao"></i></el-button>
               </template>
               <template #default>
                 <div class="item-popover">
@@ -30,7 +30,7 @@
                     <i class="iconfont icon-bianji"></i>
                     <span>编辑</span>
                   </div>
-                  <div class="item-popover-item">
+                  <div class="item-popover-item" @click="delRow(item)">
                     <i class="iconfont icon-shanchu"></i>
                     <span>删除</span>
                   </div>
@@ -48,24 +48,39 @@
           </div>
         </li>
       </ul>
-      <div class="pagination-box">
+
-        <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
-          :page-sizes="[100, 200, 300, 400]" background layout="total, sizes, prev, pager, next, jumper" :total="400"
-          @size-change="handleSizeChange" @current-change="handleCurrentChange" />
-      </div>
     </el-scrollbar>
+    <div class="pagination-box">
+      <el-pagination v-model:current-page="sourceStore.query.pageNum" v-model:page-size="sourceStore.query.pageSize"
+        :page-sizes="[10, 20, 30, 50]" background layout="total, sizes, prev, pager, next, jumper"
+        :total="sourceStore.result.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
+    </div>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { deleteSmarttalk } from '@/api/file'
+import useResoureStore from '../store'
+import FileImage from '@/components/file-image/index.vue'
+import { ElMessage } from 'element-plus'
 
-const currentPage = ref(1)
+const sourceStore = useResoureStore()
-const pageSize = ref(100)
 
 const handleSizeChange = () => { }
 const handleCurrentChange = () => { }
+// 删除
+const delRow = (item) => {
+  sourceStore.loading = true
+  try {
+    deleteSmarttalk(item.id).then(() => {
+      ElMessage.success('操作成功')
+      sourceStore.handleQuery()
+    })
+  } finally {
+    sourceStore.loading = false
+  }
 
+}
 
 </script>
 
@@ -82,6 +97,7 @@ const handleCurrentChange = () => { }
     justify-content: center;
     font-size: 12px;
     cursor: pointer;
+
     .iconfont {
       margin-right: 5px;
       color: #a2a2a2;
@@ -97,6 +113,7 @@ const handleCurrentChange = () => { }
 
 .resource-list {
   .list-item {
+    flex: 1;
     padding: 10px 20px;
     border-bottom: solid #f1f1f1 1px;
     display: flex;

src/renderer/src/views/resource/container/resoure-search.vue

@@ -3,7 +3,7 @@
     <el-row justify="space-between">
       <el-col :span="12" class="tab-btns flex">
         <el-button text v-for="item in sourceStore.tabs" :key="item.id"
-          :type="sourceStore.curTab == item.id ? 'primary' : ''" @click="sourceStore.changeTab(item.id)">{{ item.text
+          :type="sourceStore.query.fileSource == item.value ? 'primary' : ''" @click="sourceStore.changeTab(item.value)">{{ item.text
           }}</el-button>
       </el-col>
       <el-col :span="12" class="search-box flex">
@@ -12,14 +12,14 @@
     </el-row>
     <el-row class="resoure-btns">
       <el-col :span="24" class="query-row flex">
-        <div class="flex"> <el-select v-model="sourceStore.curFormat" placeholder="Select" size="small"
+        <div class="flex"> <el-select v-model="sourceStore.query.fileSuffix" placeholder="Select" size="small"
             style="width: 100px">
             <el-option v-for="item in sourceStore.formatList" :key="item.value" :label="item.label"
               :value="item.value" />
           </el-select>
           <div class="line"></div>
           <el-button size="small" v-for="item in sourceStore.typeList" :key="item.id"
-            :type="sourceStore.curType == item.id ? 'primary' : ''" round @click="sourceStore.changeType(item.id)">{{
+            :type="sourceStore.query.fileFlag == item.value ? 'primary' : ''" round @click="sourceStore.changeType(item.value)">{{
               item.text }}</el-button>
         </div>
         <div>
@@ -48,9 +48,26 @@ const openDialog = ()=>{
   isDialogOpen.value = true
 }
 
-const submitFile = (fileList)=>{
+const submitFile = (data)=>{
-  // console.log(toRaw(fileList))
+  let fileList = toRaw(data)
-  // uploaderState().pushFile(toRaw(fileList))
+  const { textBookId, levelFirstId, levelSecondId, fileSource, fileRoot} = sourceStore.query
+  console.log(textBookId)
+  let fileData = { textBookId, levelFirstId, levelSecondId, fileSource, fileRoot }
+  fileList.forEach(item => {
+    fileData.fileFlag = item.fileData.fileFlag
+    item.fileData = fileData
+    item.callback = fileCallBack
+  })
+  console.log(fileList)
+  uploaderState().pushFile(fileList)
+}
+
+
+const fileCallBack = (res)=>{
+  console.log(res)
+  if(res.code == 200){
+    sourceStore.handleQuery()
+  }
 }
 </script>
 <style lang="scss" scoped>

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

@@ -15,6 +15,7 @@
 </template>
 
 <script setup>
+import { onMounted } from 'vue'
 import useResoureStore from './store'
 import ChooseTextbook from '@/components/choose-textbook/index.vue'
 import ResoureSearch from './container/resoure-search.vue'
@@ -25,13 +26,30 @@ const sourceStore = useResoureStore()
 const { ipcRenderer } = window.electron || {}
 // ipcRenderer.send('set-winsize',{x:1100,y: 700})
 
+// 切换教材
+const changeBook = (data) => {
+  getData(data)
+}
+// 节点点击
 const nodeClick = (data) => {
-  console.log(data)
+  getData(data)
 }
 
-const changeBook = (data) => {
+// 查询
-  console.log(data)
+const getData = (data) => {
+  const { textBook, node } = data
+  let textBookId = textBook.curBookId
+  let levelFirstId = node.id
+  let levelSecondId = node.parentNode ? node.parentNode.id : ''
+  sourceStore.query = {
+    textBookId,
+    levelFirstId,
+    levelSecondId,
+    ...sourceStore.query
   }
+  sourceStore.handleQuery()
+}
+
 
 
 </script>

src/renderer/src/views/resource/store.js

@@ -1,76 +1,112 @@
 import { defineStore } from 'pinia'
+import { getSmarttalkPage } from '@/api/file/index'
 
 const tabs = [
   {
-    type: '',
     text: '平台资源',
-    id: 1
+    value: '平台'
   },
   {
-    type: '',
     text: '校本资源',
-    id: 2
+    value: '校本'
   }
 ]
 
 const typeList = [
   {
-    type: '',
     text: '全部',
-    id: 1
+    value: ''
   },
   {
-    type: '',
     text: '素材',
-    id: 2
+    value: '素材'
   },
 
   {
-    type: '',
     text: '课件',
-    id: 4
+    value: '课件'
   },
 
   {
-    type: '',
     text: '教案',
-    id: 6
+    value: '教案'
-  },
+  }
-  
 ]
 // 资源格式
 const formatList = [
   {
     label: '资源格式',
-    value: -1
+    value: ''
   },
   {
     label: 'word',
-    value: 1
+    value: 'word'
   },
   {
     label: 'ppt',
-    value: 2
+    value: 'ppt'
+  },
+  {
+    label: 'mp3',
+    value: 'mp3'
+  },
+  {
+    label: 'mp4',
+    value: 'mp4'
   }
 ]
+
+const structQuery = {
+  pageNum: 1,
+  pageSize: 10
+}
+
 export default defineStore('resource', {
   state: () => ({
     tabs,
     typeList,
     formatList,
-    curTab: 1,
+
-    curType: 1,
     curFormat: -1,
     searchKey: '',
     // 新建资源
     isCreate: false,
+    loading: false,
+    //查询条件
+    query: {
+      fileSource: '平台',
+      fileSuffix: '',
+      fileFlag: '',
+      fileRoot: '资源',
+      orderByColumn: 'uploadTime',
+      isAsc: 'desc',
+      ...structQuery
+    },
+    result: {
+      list: [],
+      total: 0
+    }
   }),
   actions: {
+    handleQuery() {
+      try {
+        this.loading = true
+        getSmarttalkPage(this.query).then((res) => {
+          this.result.total = res.total
+          this.result.list = res.rows
+
+        })
+      } finally {
+        this.loading = false
+      }
+    },
     changeTab(val) {
-      this.curTab = val
+      this.query.fileSource = val
+      this.handleQuery()
     },
     changeType(val) {
-      this.curType = val
+      this.query.fileFlag = val
+      this.handleQuery()
     }
   }
 })