src/renderer/src/views/prepare/container/file-list-item.vue

@@ -6,53 +6,36 @@
     </div>
     <div class="prepare-body-main-item-info" @click="openFileWin(item)">
       <div class="prepare-item-info-title" :title="item.fileShowName">
-        <div></div>
+        {{ item.fileShowName }}
-        <div
-          style="
-            flex: 1;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            width: 200px;
-          "
-        >
-          {{ item.fileShowName }}
-        </div>
       </div>
       <div class="prepare-item-info-message">
         <div style="width: 60px">
           <template v-if="item.uniquekey">
-            {{ item.worktype }}
+           {{ item.worktype }}
           </template>
           <template v-else>
-            <el-icon
+          <el-icon
-              v-loading="item.async === 'on'"
+            v-loading="item.async === 'on'"
-              style="background-color: green; border-radius: 20px; color: white; top: 2px"
+            style="background-color: green; border-radius: 20px; color: white; top: 2px"
-            >
+          >
-              <Check v-if="item.async === true" />
+            <Check v-if="item.async === true" />
-              <UploadFilled v-if="!item.async" />
+            <UploadFilled v-if="!item.async" />
-            </el-icon>
+          </el-icon>
-            {{ item.async === true ? '已同步' : '' }}
+          {{ item.async === true ? '已同步' : '' }}
-            {{ !item.async ? '待同步' : '' }}
+          {{ !item.async ? '待同步' : '' }}
-            {{ item.async === 'on' ? '同步中' : '' }}
+          {{ item.async === 'on' ? '同步中' : '' }}
-          </template>
+        </template>
         </div>
         <template v-if="item.fileSize">|</template>
-        <div v-if="item.fileSize" style="width: 70px">{{ formatFileSize(item.fileSize) }}</div>
+        <div style="width: 70px" v-if="item.fileSize">{{ formatFileSize(item.fileSize) }}</div>
         <template v-if="item.uploadTime">|</template>
-        <div v-if="item.uploadTime" style="width: 70px">
+        <div style="width: 70px" v-if="item.uploadTime">{{ toTimeText(item.uploadTime, true) }}</div>
-          {{ toTimeText(item.uploadTime, true) }}
-        </div>
         <template v-if="item.levelFirstName">|&nbsp;</template>
         <div
-          v-if="item.levelFirstName"
+        v-if="item.levelFirstName"
           style="
             flex: 1;
             text-align: left;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            width: 200px;
           "
           :title="
             item.levelFirstName +
@@ -162,7 +145,7 @@ export default {
   emits: { 'on-move': null, 'on-delete': null, 'on-set': null },
   data() {
     return {
-      listenList: []
+      listenList: [],
     }
   },
   methods: {
@@ -246,7 +229,7 @@ export default {
       })
     },
     //布置
-    setHomeWork(item) {
+    setHomeWork(item){
       this.$emit('on-set', item)
     }
   }
@@ -276,9 +259,9 @@ export default {
     display: flex;
     justify-content: center;
     align-items: center;
-    .icon-zuoye {
+    .icon-zuoye{
       font-size: 40px;
-      color: #707070;
+      color: #707070
     }
   }
 
@@ -298,7 +281,9 @@ export default {
     .prepare-item-info-title {
       text-align: left;
       font-size: 16px;
-      display: flex;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
     }
 
     .prepare-item-info-message {

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

@@ -1,31 +1,13 @@
 <template>
-  <div v-loading="sourceStore.loading" class="resource-list">
+  <div class="resource-list" v-loading="sourceStore.loading">
-    <el-scrollbar>
+    <el-scrollbar height="400px">
-      <el-empty v-if="!sourceStore.result.list.length" description="暂无数据" />
+      <el-empty description="暂无数据" v-if="!sourceStore.result.list.length" />
       <ul>
-        <li
+        <li class="list-item" v-for="item in sourceStore.result.list" :key="item.id" @click="handleRow">
-          v-for="item in sourceStore.result.list"
-          :key="item.id"
-          class="list-item"
-          @click="handleRow"
-        >
           <div class="item-left flex">
-            <FileImage :file-name="item.fileShowName" :size="50" />
+            <FileImage :fileName="item.fileShowName" :size="50" />
             <div class="flex item-left-content">
-              <div class="name flex" :title="item.fileShowName">
+              <div class="name flex">{{ item.fileShowName }}</div>
-                <div></div>
-                <div
-                  style="
-                    flex: 1;
-                    overflow: hidden;
-                    text-overflow: ellipsis;
-                    white-space: nowrap;
-                    width: 200px;
-                  "
-                >
-                  {{ item.fileShowName }}
-                </div>
-              </div>
               <div class="item-tags flex">
                 <el-tag type="info" class="mr-10">{{ item.fileFlag }}</el-tag>
                 <el-tag type="info" class="mr-10">{{ getFileSuffix(item.fileShowName) }}</el-tag>
@@ -36,16 +18,10 @@
             </div>
           </div>
           <div class="item-btns" @click.stop>
-            <el-popover
+            <el-popover placement="bottom-end" trigger="hover" popper-class="custom-popover"
-              placement="bottom-end"
+              :visible="item.showPopover">
-              trigger="hover"
-              popper-class="custom-popover"
-              :visible="item.showPopover"
-            >
               <template #reference>
-                <el-button link type="primary">
+                <el-button link type="primary"> <i class="iconfont icon-shenglvehao"></i></el-button>
-                  <i class="iconfont icon-shenglvehao"></i
-                ></el-button>
               </template>
               <template #default>
                 <div class="item-popover">
@@ -53,11 +29,7 @@
                     <i class="iconfont icon-bianji"></i>
                     <span>编辑</span>
                   </div>
-                  <div
+                  <div class="item-popover-item" v-if="userInfo.userId == item.uploadUserId" @click="delRow(item)">
-                    v-if="userInfo.userId == item.uploadUserId"
-                    class="item-popover-item"
-                    @click="delRow(item)"
-                  >
                     <i class="iconfont icon-shanchu"></i>
                     <span>删除</span>
                   </div>
@@ -65,29 +37,24 @@
                     <i class="iconfont icon-xiazai"></i>
                     <span>下载</span>
                   </div>
+
                 </div>
               </template>
             </el-popover>
             <el-button size="small" plain round type="primary" @click="addLesson(item)">
               <i class="iconfont icon-jiahao"></i>
-              备课</el-button
+              备课</el-button>
-            >
           </div>
         </li>
       </ul>
+
     </el-scrollbar>
     <div class="pagination-box">
-      <el-pagination
+      <el-pagination v-model:current-page="sourceStore.query.pageNum" v-model:page-size="sourceStore.query.pageSize"
-        v-model:current-page="sourceStore.query.pageNum"
+        :page-sizes="[10, 20, 30, 50]" background layout="total, sizes, prev, pager, next, jumper"
-        v-model:page-size="sourceStore.query.pageSize"
+        :total="sourceStore.result.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
-        :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>
 
@@ -102,17 +69,17 @@ import useUserStore from '@/store/modules/user'
 import useResoureStore from '../store'
 
 const { ipcRenderer } = window.electron || {}
-const userstore = useUserStore()
+const userstore  = useUserStore()
 const sourceStore = useResoureStore()
 
 const userInfo = userstore.user
 
 // 分页change
-const handleSizeChange = (limit) => {
+const handleSizeChange = (limit) => { 
   sourceStore.query.pageSize = limit
   sourceStore.handleQuery()
 }
-const handleCurrentChange = (page) => {
+const handleCurrentChange = (page) => { 
   sourceStore.query.pageNum = page
   sourceStore.handleQuery()
 }
@@ -141,7 +108,7 @@ const editRow = (item) => {
         }
       })
     })
-    .catch(() => {})
+    .catch(() => { })
 }
 // 删除
 const delRow = (item) => {
@@ -161,7 +128,7 @@ const addLesson = ({ id }) => {
   let data = {
     id,
     fileRoot: '备课',
-    ...toRaw(sourceStore.nodeData)
+    ...(toRaw(sourceStore.nodeData)),
   }
   // 过滤空值
   for (let key in data) {
@@ -169,18 +136,19 @@ const addLesson = ({ id }) => {
       delete data[key]
     }
   }
-
+  
   try {
     sourceStore.loading = true
     addFileToPrepare(data).then(() => {
       ElMessage.success('操作成功')
     })
-  } finally {
+  }
+  finally {
     sourceStore.loading = false
   }
 }
-//
+// 
-const handleRow = () => {
+const handleRow = () =>{
   ElMessage.warning('请先加入备课，在备课里面进行预览！')
 }
 </script>
@@ -213,10 +181,6 @@ const handleRow = () => {
 }
 
 .resource-list {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow: auto;
   .list-item {
     flex: 1;
     padding: 10px 20px;
@@ -225,13 +189,10 @@ const handleRow = () => {
     justify-content: space-between;
     align-items: center;
     cursor: pointer;
-    &:hover {
+
-      background-color: rgba(144, 147, 153, 0.2);
-      cursor: pointer;
-    }
     .item-left {
       align-items: center;
-      flex: 1;
+
       .icon {
         font-size: 50px;
       }
@@ -239,14 +200,12 @@ const handleRow = () => {
       .item-left-content {
         margin-left: 10px;
         flex-direction: column;
-        flex: 1;
-        text-align: left;
       }
 
       .name {
         font-size: 14px;
         color: #3b3b3b;
-        margin-bottom: 10px;
+        margin-bottom: 10px
       }
 
       .line {
@@ -267,6 +226,7 @@ const handleRow = () => {
         color: #909399;
         font-size: 13px;
       }
+
     }
 
     &:last-child {
@@ -298,13 +258,15 @@ const handleRow = () => {
         margin-right: 3px;
         font-weight: bold;
       }
+
     }
+
   }
 
   .pagination-box {
+    margin-top: 20px;
     display: flex;
     justify-content: center;
-    height: 65px;
   }
 }
-</style>
+</style>

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

@@ -1,28 +1,21 @@
 <template>
   <div class="page-resource flex">
     <!--左侧 教材 目录-->
-    <ChooseTextbook @change-book="getData" @node-click="getData" />
+    <ChooseTextbook @changeBook="getData" @nodeClick="getData" />
 
     <div class="page-right">
       <!-- 搜索 -->
       <ResoureSearch #add>
-        <el-button
+        <el-button v-if="sourceStore.isCreate" type="primary" round @click="openDialog" class="create-btn">
-          v-if="sourceStore.isCreate"
-          type="primary"
-          round
-          class="create-btn"
-          @click="openDialog"
-        >
           <i class="iconfont icon-jiahao"></i>
-          新建资源</el-button
+          新建资源</el-button>
-        >
       </ResoureSearch>
       <!-- 列表 -->
       <ResoureList />
     </div>
   </div>
   <!-- 上传弹窗 -->
-  <uploadDialog v-model="isDialogOpen" @submit-file="submitFile" />
+  <uploadDialog v-model="isDialogOpen" @submitFile="submitFile" />
   <!-- <el-button @click="testClick">测试</el-button> -->
 </template>
 
@@ -47,7 +40,7 @@ onMounted(async () => {
   // const res = await ipcMsgSend('tool-sphere:create', params)
   // console.log('消息返回：', res)
 })
-const testClick = async () => {
+const testClick = async() => {
   const win = await createWindow('tool-sphere', { url: '/tool/sphere' })
   console.log('消息返回：', win)
 }
@@ -55,11 +48,12 @@ const testClick = async () => {
 const getData = (data) => {
   const { textBook, node } = data
   let textbookId = textBook.curBookId
-  let levelSecondId = node.id
+  let levelSecondId  = node.id
   let levelFirstId
-  if (node.parentNode) {
+  if(node.parentNode){
-    levelFirstId = node.parentNode.id
+    levelFirstId =  node.parentNode.id
-  } else {
+  }
+  else{
     levelFirstId = node.id
     levelSecondId = ''
   }
@@ -69,7 +63,7 @@ const getData = (data) => {
   sourceStore.nodeData = {
     textbookId,
     levelFirstId,
-    levelSecondId
+    levelSecondId,
   }
   sourceStore.handleQuery()
 }
@@ -79,7 +73,7 @@ const submitFile = (data) => {
   let fileList = toRaw(data)
   const { textbookId, levelFirstId, levelSecondId, fileSource, fileRoot } = sourceStore.query
   // 给每个文件添加属性
-  fileList.forEach((item) => {
+  fileList.forEach(item => {
     let fileData = { textbookId, levelFirstId, levelSecondId, fileSource, fileRoot }
     fileData.fileShowName = item.fileData.fileShowName
     fileData.fileFlag = item.fileData.fileFlag
@@ -89,15 +83,17 @@ const submitFile = (data) => {
   uploaderState().pushFile(fileList)
 }
 
+
 const fileCallBack = (res) => {
   if (res.code == 200) {
     sourceStore.handleQuery()
   }
 }
 
-onMounted(() => {
+onMounted(()=>{
   sourceStore.getCreate()
 })
+
 </script>
 
 <style lang="scss" scoped>
@@ -107,8 +103,6 @@ onMounted(() => {
 
   .page-right {
     min-width: 0;
-    display: flex;
-    flex-direction: column;
     flex: 1;
     margin-left: 20px;
     height: 100%;
@@ -117,12 +111,12 @@ onMounted(() => {
     box-shadow: 0px 0px 20px 0px rgba(99, 99, 99, 0.06);
   }
   .icon-jiahao {
-    font-size: 12px;
+      font-size: 12px;
-    margin-right: 3px;
+      margin-right: 3px;
-    font-weight: bold;
+      font-weight: bold;
-  }
+    }
 }
-.create-btn {
+.create-btn{
   font-size: 13px;
   padding: 5px 13px;
 }