From b0e56ec12fb36e6f30418273d790d8c2b6ddb035 Mon Sep 17 00:00:00 2001
From: jmal <zhushilun084@gmail.com>
Date: Sat, 4 Mar 2023 20:52:52 +0800
Subject: [PATCH] =?UTF-8?q?:lipstick:=E6=96=87=E4=BB=B6=E5=9B=BE=E6=A0=87?=
 =?UTF-8?q?=E4=B8=8A=E6=B7=BB=E5=8A=A0=E5=88=86=E4=BA=AB=E5=9B=BE=E6=A0=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Breadcrumb/BreadcrumbFilePath.vue         |   6 +
 src/components/Icon/IconFile.vue              | 218 ++++++++++++------
 src/components/ShowFile/ShowFile.vue          |  13 +-
 3 files changed, 158 insertions(+), 79 deletions(-)

diff --git a/src/components/Breadcrumb/BreadcrumbFilePath.vue b/src/components/Breadcrumb/BreadcrumbFilePath.vue
index a431535..663aeeb 100644
--- a/src/components/Breadcrumb/BreadcrumbFilePath.vue
+++ b/src/components/Breadcrumb/BreadcrumbFilePath.vue
@@ -1,5 +1,6 @@
 <template>
   <span>
+    <svg-icon v-if="item.isShare" class="share-dir" icon-class="share"/>
     <a v-if="strLength(item.folder) > maxNameLength">
       <el-tooltip class="item" effect="dark" :content="item.folder" placement="top">
         <a v-if="pathList.length >= maxPathCount">
@@ -93,6 +94,11 @@
   }
 </script>
 <style lang="scss" scoped>
+  .share-dir {
+    color: #52c41a;
+    margin-right: -0.5rem;
+    font-size: 1.2rem !important;
+  }
   .redirect {
     color: #97a8be;
   }
diff --git a/src/components/Icon/IconFile.vue b/src/components/Icon/IconFile.vue
index 7ee2e51..a1bf702 100644
--- a/src/components/Icon/IconFile.vue
+++ b/src/components/Icon/IconFile.vue
@@ -1,30 +1,38 @@
 <template>
   <span>
-      <div v-if="item.isFavorite && !public">
-      <div v-if="pc">
-        <svg-icon v-if="!grid" class="favorite" icon-class="menu-favorite-hover"
-                  style="font-size: 1rem;float: right;margin-left: 1rem;position: absolute;"/>
-        <svg-icon v-if="grid" class="favorite" icon-class="menu-favorite-hover"
-                  style="font-size: 1.5rem;right: 0;top: -1rem;position: absolute;z-index: 1;"/>
-      </div>
-      <div v-else>
-        <svg-icon v-if="!grid" class="favorite" icon-class="menu-favorite-hover"
-                  style="font-size: 0.5rem;float: right;margin-left: 0.5rem;position: absolute;"/>
-        <svg-icon v-if="grid" class="favorite" icon-class="menu-favorite-hover"
-                  style="font-size: 1rem;right: 0;top: -1rem;position: absolute;z-index: 1;"/>
-      </div>
+    <div v-if="item.isFavorite && !public">
+        <div v-if="pc">
+          <svg-icon v-if="!grid" class="pc list icon-favorite" icon-class="Favoritestarrate"/>
+          <svg-icon v-if="grid" class="pc grid icon-favorite" icon-class="Favoritestarrate"/>
+        </div>
+        <div v-else>
+          <svg-icon v-if="!grid" class="mobile list icon-favorite" icon-class="Favoritestarrate"/>
+          <svg-icon v-if="grid" class="mobile grid icon-favorite" icon-class="Favoritestarrate"/>
+        </div>
+    </div>
+    <div v-if="item.isShare && item.shareId && !public">
+        <div v-if="pc">
+          <svg-icon v-if="!grid" class="pc list icon-share" icon-class="share"/>
+          <svg-icon v-if="grid" class="pc grid icon-share" icon-class="share"/>
+        </div>
+        <div v-else>
+          <svg-icon v-if="!grid" class="mobile list icon-share" icon-class="share"/>
+          <svg-icon v-if="grid" class="mobile grid icon-share" icon-class="share"/>
+        </div>
     </div>
     <svg-icon v-if="item.isFolder" icon-class="folder"/>
     <svg-icon v-else-if="item.contentType.indexOf('video') > -1" icon-class="video"/>
     <div v-else-if="item.contentType.indexOf('audio') > -1" v-on:mousedown="noDrag($event)">
       <div v-if="item.music !== undefined">
         <div v-if="item.music.name !== null">
-          <el-image v-if="grid" :style="{'height':details?'110px':(gridWidth-35) + 'px'}" fit="contain" :src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
+          <el-image v-if="grid" :style="{'height':details?'110px':(gridWidth-35) + 'px'}" fit="contain"
+                    :src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
           <div slot="error" class="image-slot">
             <svg-icon class="avatar-default-image" icon-class="audio"/>
           </div>
         </el-image>
-        <el-avatar v-if="!grid" shape="square" :src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
+        <el-avatar v-if="!grid" shape="square"
+                   :src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
           <div slot="default">
             <svg-icon class="avatar-default-image" icon-class="audio"/>
           </div>
@@ -35,13 +43,15 @@
     </div>
     <!--<svg-icon v-else-if="item.contentType.indexOf('text') > -1" icon-class="file-txt"/>-->
     <div v-else-if="item.contentType.startsWith('image')" v-on:mousedown="noDrag($event)">
-      <el-image v-if="grid || grid === 'details'" :style="{'height':details?'110px':(gridWidth-35) + 'px'}" fit="contain" :src="item.fileId ? (imageUrl+item.fileId) : (imageUrl+item.id)">
+      <el-image v-if="grid || grid === 'details'" :style="{'height':details?'110px':(gridWidth-35) + 'px'}"
+                fit="contain" :src="item.fileId ? (imageUrl+item.fileId) : (imageUrl+item.id)">
         <div slot="error" class="image-slot">
           <svg-icon icon-class="loading-image-error"/>
         </div>
       </el-image>
 
-      <el-avatar v-if="!grid" shape="square" :src="item.fileId ? (imageUrl+item.fileId) : (imageUrl+item.id)"></el-avatar>
+      <el-avatar v-if="!grid" shape="square"
+                 :src="item.fileId ? (imageUrl+item.fileId) : (imageUrl+item.id)"></el-avatar>
     </div>
     <!--<svg-icon v-else-if="item.contentType.indexOf('application/pdf') > -1" icon-class="file-pdf"/>-->
     <!--<svg-icon v-else-if="item.contentType.indexOf('word') > -1" icon-class="file-word"/>-->
@@ -51,72 +61,128 @@
   </span>
 </template>
 <script>
-  import { iconClass } from '@/utils/file-type'
-  export default {
-    name: 'IconFile',
-    props: {
-      imageUrl: {
-        type: String,
-        default: ''
-      },
-      audioCoverUrl: {
-        type: String,
-        default: ''
-      },
-      grid: {
-        type: Boolean,
-        default: false
-      },
-      gridWidth: {
-        type: Number,
-        default: 120
-      },
-      details: {
-        type: Boolean,
-        default: false
-      },
-      public: {
-        type: Boolean,
-        default: false
-      },
-      item: {
-        type: Object,
-        default: function () {
-          return {}
-        }
-      }
+import {iconClass} from '@/utils/file-type'
+
+export default {
+  name: 'IconFile',
+  props: {
+    imageUrl: {
+      type: String,
+      default: ''
     },
-    data() {
-      return {
-        pc: window.pc,
-      }
+    audioCoverUrl: {
+      type: String,
+      default: ''
     },
-    mounted() {
+    grid: {
+      type: Boolean,
+      default: false
     },
-    computed: {
-      findIconClass(){
-        let suffix = this.item.suffix;
-        if(!suffix && this.item.fileName){
-          suffix = this.item.fileName.substring(this.item.fileName.lastIndexOf('.') + 1);
-        }
-        if(iconClass.has(suffix)){
-          return iconClass.get(suffix)
-        }
-        return 'file'
-      },
+    gridWidth: {
+      type: Number,
+      default: 120
     },
-    methods: {
-      noDrag(e) {
-        // console.log('noDrag',e)
-        // e.preventDefault()
+    details: {
+      type: Boolean,
+      default: false
+    },
+    public: {
+      type: Boolean,
+      default: false
+    },
+    item: {
+      type: Object,
+      default: function () {
+        return {}
       }
     }
+  },
+  data() {
+    return {
+      pc: window.pc,
+    }
+  },
+  mounted() {
+  },
+  computed: {
+    findIconClass() {
+      let suffix = this.item.suffix;
+      if (!suffix && this.item.fileName) {
+        suffix = this.item.fileName.substring(this.item.fileName.lastIndexOf('.') + 1);
+      }
+      if (iconClass.has(suffix)) {
+        return iconClass.get(suffix)
+      }
+      return 'file'
+    },
+  },
+  methods: {
+    noDrag(e) {
+      // console.log('noDrag',e)
+      // e.preventDefault()
+    }
   }
+}
 </script>
 <style lang="scss" scoped>
-  .avatar-default-image{
-    height: 35px;
-    width: 35px;
-    line-height: 35px;
-  }
+.avatar-default-image {
+  height: 35px;
+  width: 35px;
+  line-height: 35px;
+}
+
+.icon-favorite {
+  position: absolute;
+  color: #f5222d;
+  z-index: 1;
+}
+
+.pc.grid.icon-favorite {
+  font-size: 1.5rem;
+  left: 0;
+  top: 0;
+}
+
+.mobile.grid.icon-favorite {
+  width: 1.3rem;
+  height: 1.3rem;
+}
+
+.pc.list.icon-favorite {
+  font-size: 1rem;
+  left: 1.5rem;
+}
+
+.mobile.list.icon-favorite {
+  font-size: 0.5rem;
+  margin-left: -1.5rem;
+}
+
+.icon-share {
+  color: #52c41a;
+  position: absolute;
+  z-index: 1;
+}
+
+.pc.grid.icon-share {
+  font-size: 1.5rem;
+  right: 0;
+  top: 0;
+}
+
+.mobile.grid.icon-share {
+  width: 1.3rem;
+  height: 1.3rem;
+  margin-left: 2.8rem;
+}
+
+.pc.list.icon-share {
+  font-size: 1rem;
+  right: 1.3rem;
+}
+
+.mobile.list.icon-share {
+  font-size: 0.5rem;
+  margin-left: 0.5rem;
+}
 </style>
diff --git a/src/components/ShowFile/ShowFile.vue b/src/components/ShowFile/ShowFile.vue
index e53985f..71e909c 100644
--- a/src/components/ShowFile/ShowFile.vue
+++ b/src/components/ShowFile/ShowFile.vue
@@ -2520,7 +2520,7 @@ export default {
     menuFavoriteLeave(index, isFavorite) {
       this.highlightFavorite(this.isCollectView ? true : isFavorite, false)
     },
-    // 是否高亮收图标
+    // 是否高亮收藏图标
     highlightFavorite(isFavorite, isHover) {
       const item_menu = this.menus.find(item => {
         if (item.operation === 'favorite' || item.operation === 'unFavorite') {
@@ -2901,10 +2901,17 @@ export default {
         isFolder: row.isFolder
       }).then(res => {
         this.shareDialog = true
+        // 这3行代码是为了让vue刷新数据
+        const isFavorite = this.rowContextData.isFavorite
+        this.rowContextData.isFavorite = !isFavorite
+        this.rowContextData.isFavorite = isFavorite
         if (res.data) {
-          this.shareLink = window.location.origin + '/s?s=' + res.data
+          let shareId = res.data
+          this.shareLink = window.location.origin + '/s?s=' + shareId
           this.generateShareLinkLoading = false
+          this.rowContextData.shareId = shareId
         }
+        this.rowContextData.isShare = true
       }).catch(() => {
         this.shareDialog = false
         this.generateShareLinkLoading = false
@@ -3137,7 +3144,7 @@ export default {
           } else {
             this.path = '/' + row.name
           }
-          const item = {'folder': row.name}
+          const item = {'folder': row.name, 'isShare': row.isShare}
           this.pathList.push(item)
           this.pagination.pageIndex = 1
           const path = encodeURI(this.path);