收藏文件宫格视图切换

src/layout/indexCommon.vue

@@ -191,6 +191,8 @@ const toSearch = async () => {
     keyword: searchText.value,
     isAsc: "asc",
     orderByColumn: "createTime",
+    pageSize:3,
+    pageNum:1
   };
   const res = await flieSearch(query);
   // console.log("res", res);

src/views/collect/index.vue

@@ -1,5 +1,36 @@
 <template>
   <div class="container">
+    <div class="statistics">
+      <div class="left_box">
+        <div class="dataNum">共查询到个相关结果</div>
+      </div>
+      <div class="right_box">
+        <img
+          src="@/assets/images/sort.png"
+          @click="changeSort"
+          v-if="isAsc == 'asc'"
+          alt=""
+        />
+        <img
+          src="@/assets/images/Frame_188.png"
+          @click="changeSort"
+          v-else
+          alt=""
+        />
+        <img
+          v-if="isList"
+          src="@/assets/images/squre.png"
+          alt=""
+          @click="changeShow"
+        />
+        <img
+          v-else
+          src="@/assets/images/Frame_187.png"
+          alt=""
+          @click="changeShow"
+        />
+      </div>
+    </div>
     <!-- 标签 -->
     <div class="tags">
       <!-- TODO 标签可以拖动位置 -->
@@ -237,6 +268,7 @@ const isAddCollect = ref(false); //是否在添加标签
 const tabName = ref(""); //新增的标签名
 const changeTabName = ref(""); //修改的标签名
 const tabList = ref([]);
+const isAsc = ref("asc");
 const tableData = [
   {
     date: "2016-05-03",
@@ -454,6 +486,11 @@ const rowDrop = () => {
 
 const tabchange = async (labelId) => {
   console.log("labelId", toRaw(labelId));
+  const query = {
+    labelId,
+    isAsc: isAsc.value,
+    orderByColumn: "createTime",
+  }; 
   // 获取当前标签下的数据
   const res = await listFavoriteById(labelId);
   // console.log("res", res);
@@ -462,6 +499,13 @@ const tabchange = async (labelId) => {
   console.log("folderArr", folderArr.value);
   console.log("fileArr", fileArr.value);
 };
+const changeShow = () => {
+  isList.value = !isList.value;
+};
+const changeSort = async () => {
+  isAsc.value == "asc" ? (isAsc.value = "desc") : (isAsc.value = "asc");
+  // console.log("res", res);
+};
 
 // 工具函数
 //获取新增标签时要赋予的ordername
@@ -487,6 +531,34 @@ const sortArr = (field) => {
   height: 100%;
   background-color: #fff;
   border-radius: 4px;
+  .statistics {
+    width: 100%;
+    height: 40px;
+    background-color: #D9E0F0;
+    padding-left: 16px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    color: #6F85B5;
+    .left_box {
+      display: flex;
+      align-items: center;
+      .dataNum {
+        margin-left: 4px;
+        font-size: 14px;
+        font-weight: 400;
+      }
+    }
+    .right_box {
+      width: 50px;
+      display: flex;
+      justify-content: space-between;
+      margin-right: 30px;
+      img {
+        cursor: pointer;
+      }
+    }
+  }
   .tags {
     display: flex;
     width: 100%;

src/views/myfile/MyFile.vue

@@ -141,7 +141,7 @@
                                             <el-icon v-if="scope.row.isFavorite == 'N'">
                                                 <Star />
                                             </el-icon>
-                                            <img v-else src="../../assets/images/yellowstar.png" alt="">
+                                            <img v-else @click.stop="delCollect(scope.row,$event)" src="../../assets/images/yellowstar.png" alt="">
                                             <img src="../../assets/images/fileBox.png" style="width: 20px;height: 24px;"
                                                 alt="">
                                             {{ scope.row.dirName }}
@@ -199,7 +199,7 @@
                                             <el-icon v-if="scope.row.isFavorite == 'N'">
                                                 <Star />
                                             </el-icon>
-                                            <img v-else src="../../assets/images/yellowstar.png" alt="">
+                                            <img v-else @click.stop="delCollect(scope.row,$event)" src="../../assets/images/yellowstar.png" alt="">
                                             <img :src="getImage(scope.row.fileType)" alt="">
                                             {{ scope.row.fileName }}
                                         </span>
@@ -331,6 +331,7 @@
 <script>
 import { ref, toRaw, onMounted } from 'vue'
 import myfile from '../../api/myfile/myfile'
+import { delFavorite } from '@/api/biz/favorite.js'
 import documents from '../../api/document/document'
 import fileCount from '../../api/fileCount/fileCount'
 import FileTree from './components/FileTree.vue'
@@ -1207,6 +1208,18 @@ export default {
                 getAllTop()
             }
         }
+        // 取消文件收藏
+        const delCollect = async (row,e)=>{
+            const thisRow = toRaw(row)
+            console.log('thisRow',thisRow);
+            // console.log('e',e);
+            if(thisRow.dirType){
+                const res = await delFavorite(thisRow.dirId)
+            }else{
+                const res = await delFavorite(thisRow.docId)
+            }
+            console.log('res',res);
+        }
         onMounted(() => {
             getAllTop()
             getSpaceList()
@@ -1359,7 +1372,8 @@ export default {
             lastBB,
             shareBack,
             folderBack,
-            refreshFile
+            refreshFile,
+            delCollect
         }
     },
     watch: {

vite.config.js

@@ -40,8 +40,8 @@ export default defineConfig(({
 				// https://cn.vitejs.dev/config/#server-proxy
 				'/dev-api': {
 					// target: 'http://192.168.1.28:8080/',
-					// target: 'http://8.142.173.95:19527/',
-					target:'http://192.168.1.28:8080/',
+					target: 'http://8.142.173.95:19527/',
+					// target:'http://192.168.1.28:8080/',
 					changeOrigin: true,
 					rewrite: (p) => p.replace(/^\/dev-api/, '')
 				},