根据文件名 查找对应图标

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

@@ -1,11 +1,11 @@
 <template>
   <svg class="icon file-icon" aria-hidden="true" :style="{'font-size': size + 'px'}">
-    <use :xlink:href="getFileTypeIcon"></use>
+    <use :xlink:href="getFileTypeIcon()"></use>
   </svg>
 </template>
 
 <script setup>
-import { watch, defineProps } from 'vue'
+import { defineProps } from 'vue'
 
 const props = defineProps({
   fileName: {
@@ -17,17 +17,10 @@ const props = defineProps({
     default: '30'
   }
 })
-console.log(1000)
 
-watch (() => props.fileName, (newVal, oldVal) => {
-  console.log(newVal,oldVal)
-  getFileTypeIcon(newVal)
- 
-})
 
-const getFileTypeIcon = (fileName) => {
+const getFileTypeIcon = () => {
-  console.log(props.fileName)
+  const name = props.fileName.substr(props.fileName.lastIndexOf('.') + 1);
-  const name = fileName.substr(fileName.lastIndexOf('.') + 1);
   const iconObj = {
     pdf: 'icon-pdf',
     ppt: 'icon-ppt',

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

@@ -16,7 +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>
-                <!-- <FileImage fileName="item.name" /> -->
+                <FileImage :fileName="item.name" />
                 <span class="text">{{ item.name }}</span>
               </div>
               <div class="flex-type flex">
@@ -64,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: '教案'
   }
 ])
 
@@ -112,7 +114,7 @@ const hanleFileChange = (file) => {
   if (file.status === 'ready') {
     // 给一个默认的fileData
     file.fileData = {
-      fileFlag: 1
+      fileFlag: '课件'
     }
     fileList.value.push(file)
   }

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

@@ -5,9 +5,7 @@
       <ul>
         <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">{{ item.fileName }}</div>
               <div class="item-tags flex">
@@ -48,18 +46,21 @@
           </div>
         </li>
       </ul>
-      <div class="pagination-box">
+     
+    </el-scrollbar>
+    <div class="pagination-box">
         <el-pagination v-model:current-page="sourceStore.query.pageNum" v-model:page-size="sourceStore.query.pageSize"
-          hide-on-single-page :page-sizes="[10, 20, 30, 50]" background layout="total, sizes, prev, pager, next, jumper"
+         :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>
-    </el-scrollbar>
   </div>
 </template>
 
 <script setup>
 
 import useResoureStore from '../store'
+import FileImage from '@/components/file-image/index.vue'
+
 const sourceStore = useResoureStore()
 
 
@@ -98,6 +99,7 @@ const handleCurrentChange = () => { }
 
 .resource-list {
   .list-item {
+    flex: 1;
     padding: 10px 20px;
     border-bottom: solid #f1f1f1 1px;
     display: flex;

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

@@ -15,7 +15,7 @@ const tabs = [
 const typeList = [
   {
     text: '全部',
-    value: '全部'
+    value: ''
   },
   {
     text: '素材',
@@ -36,7 +36,7 @@ const typeList = [
 const formatList = [
   {
     label: '资源格式',
-    value: '全部'
+    value: ''
   },
   {
     label: 'word',
@@ -75,8 +75,8 @@ export default defineStore('resource', {
     //查询条件
     query: {
       fileSource: '平台',
-      fileSuffix: '全部',
+      fileSuffix: '',
-      fileFlag: '全部',
+      fileFlag: '',
       fileRoot: '资源',
       orderByColumn: 'uploadTime',
       isAsc: 'desc',