diff --git a/src/assets/img/icon/components/gray-close-full3.png b/src/assets/img/icon/components/gray-close-full3.png
new file mode 100644
index 0000000..1f0f785
Binary files /dev/null and b/src/assets/img/icon/components/gray-close-full3.png differ
diff --git a/src/assets/img/icon/components/share/bizhi.webp b/src/assets/img/icon/components/share/bizhi.webp
new file mode 100644
index 0000000..bc328f7
Binary files /dev/null and b/src/assets/img/icon/components/share/bizhi.webp differ
diff --git a/src/assets/img/icon/components/share/code.png b/src/assets/img/icon/components/share/code.png
new file mode 100644
index 0000000..7f762a5
Binary files /dev/null and b/src/assets/img/icon/components/share/code.png differ
diff --git a/src/assets/img/icon/components/share/collect-yellow.png b/src/assets/img/icon/components/share/collect-yellow.png
new file mode 100644
index 0000000..aa6641f
Binary files /dev/null and b/src/assets/img/icon/components/share/collect-yellow.png differ
diff --git a/src/assets/img/icon/components/share/collect.png b/src/assets/img/icon/components/share/collect.png
new file mode 100644
index 0000000..65ea425
Binary files /dev/null and b/src/assets/img/icon/components/share/collect.png differ
diff --git a/src/assets/img/icon/components/share/comeon.webp b/src/assets/img/icon/components/share/comeon.webp
new file mode 100644
index 0000000..55cb4a5
Binary files /dev/null and b/src/assets/img/icon/components/share/comeon.webp differ
diff --git a/src/assets/img/icon/components/share/comeonlook.webp b/src/assets/img/icon/components/share/comeonlook.webp
new file mode 100644
index 0000000..878c2d3
Binary files /dev/null and b/src/assets/img/icon/components/share/comeonlook.webp differ
diff --git a/src/assets/img/icon/components/share/copy.png b/src/assets/img/icon/components/share/copy.png
new file mode 100644
index 0000000..f8b51bb
Binary files /dev/null and b/src/assets/img/icon/components/share/copy.png differ
diff --git a/src/assets/img/icon/components/share/dislike.png b/src/assets/img/icon/components/share/dislike.png
new file mode 100644
index 0000000..cd13511
Binary files /dev/null and b/src/assets/img/icon/components/share/dislike.png differ
diff --git a/src/assets/img/icon/components/share/dou.webp b/src/assets/img/icon/components/share/dou.webp
new file mode 100644
index 0000000..6d2aab1
Binary files /dev/null and b/src/assets/img/icon/components/share/dou.webp differ
diff --git a/src/assets/img/icon/components/share/download.png b/src/assets/img/icon/components/share/download.png
new file mode 100644
index 0000000..f7ff3a4
Binary files /dev/null and b/src/assets/img/icon/components/share/download.png differ
diff --git a/src/assets/img/icon/components/share/duoshan-logo2.png b/src/assets/img/icon/components/share/duoshan-logo2.png
new file mode 100644
index 0000000..9bd46fb
Binary files /dev/null and b/src/assets/img/icon/components/share/duoshan-logo2.png differ
diff --git a/src/assets/img/icon/components/share/link.png b/src/assets/img/icon/components/share/link.png
new file mode 100644
index 0000000..575a512
Binary files /dev/null and b/src/assets/img/icon/components/share/link.png differ
diff --git a/src/assets/img/icon/components/share/qq.webp b/src/assets/img/icon/components/share/qq.webp
new file mode 100644
index 0000000..c8e5bf3
Binary files /dev/null and b/src/assets/img/icon/components/share/qq.webp differ
diff --git a/src/assets/img/icon/components/share/share.png b/src/assets/img/icon/components/share/share.png
new file mode 100644
index 0000000..f9ef807
Binary files /dev/null and b/src/assets/img/icon/components/share/share.png differ
diff --git a/src/assets/img/icon/components/share/warning.png b/src/assets/img/icon/components/share/warning.png
new file mode 100644
index 0000000..cc18b63
Binary files /dev/null and b/src/assets/img/icon/components/share/warning.png differ
diff --git a/src/assets/img/icon/components/share/wechat.webp b/src/assets/img/icon/components/share/wechat.webp
new file mode 100644
index 0000000..8869dd7
Binary files /dev/null and b/src/assets/img/icon/components/share/wechat.webp differ
diff --git a/src/assets/img/icon/components/share/wechatquan.png b/src/assets/img/icon/components/share/wechatquan.png
new file mode 100644
index 0000000..66fa31e
Binary files /dev/null and b/src/assets/img/icon/components/share/wechatquan.png differ
diff --git a/src/components/dialog/FromBottomDialog.vue b/src/components/dialog/FromBottomDialog.vue
index ed9b87f..49f9157 100644
--- a/src/components/dialog/FromBottomDialog.vue
+++ b/src/components/dialog/FromBottomDialog.vue
@@ -133,7 +133,6 @@ export default {
     afterLeave() {
     },
 
-
     hide(val = false) {
       this.$emit('update:modelValue', val)
       this.$emit('cancel')
diff --git a/src/pages/home/components/VideoShare.vue b/src/pages/home/components/VideoShare.vue
index d6820fc..c93dc1e 100644
--- a/src/pages/home/components/VideoShare.vue
+++ b/src/pages/home/components/VideoShare.vue
@@ -2,108 +2,119 @@
   <from-bottom-dialog
       :page-id="pageId"
       v-model="modelValue"
-      @cancel="closeShare"
+      @cancel="closeShare1"
       :touch-moved="false"
       maskMode="light"
       height="60vh"
       mode="light">
     <div class="video-share">
+
+      <svg width="200" height="200" viewBox="0 0 200 200">
+        <circle
+            :r="10"
+            :cx="100"
+            :cy="100"
+            :stroke-width="3"
+            :stroke="'darkgrey'"
+            fill="none"
+        />
+        <circle
+            :r="10"
+            :cx="100"
+            :cy="100"
+            :stroke-width="3"
+            :stroke="'#514F56'"
+            :stroke-dasharray="`30,100000`"
+            fill="none"
+            stroke-linecap="round"
+        />
+
+      </svg>
       <div class="shares">
+        <div class="to">
+          <div class="wrapper">
+            <!--            <div class="loading">-->
+            <!--              <div class="quan1"></div>-->
+            <!--              <div class="quan2"></div>-->
+            <!--            </div>-->
+
+
+          </div>
+        </div>
         <div class="to" @click="closeShare($emit('share2WeChat'))">
-          <img src="@/assets/img/icon/components/share/wechat.webp" alt="">
+          <div class="wrapper">
+            <img src="@/assets/img/icon/components/share/wechat.webp" alt="">
+          </div>
           <span>微信</span>
         </div>
         <div class="to" @click="closeShare($emit('showShare2WeChatZone'))">
-          <img src="@/assets/img/icon/components/share/wechatquan.png" alt="">
+          <div class="wrapper">
+            <img src="@/assets/img/icon/components/share/wechatquan.png" alt="">
+          </div>
           <span>朋友圈</span>
         </div>
-        <div class="to" @click="closeShare($emit('share2QQZone'))">
-          <img src="@/assets/img/icon/components/share/qq.webp" alt="">
-          <span>QQ</span>
-        </div>
-        <div class="to" @click="canDownload && closeShare($emit('download'))"
-             :style="{ opacity : canDownload ? '1' : '0.5' }">
-          <img src="@/assets/img/icon/components/share/download.png" alt="">
-          <span>保存本地</span>
-        </div>
-        <div class="to" @click="$nav('/home/report',{mode:this.mode})">
-          <img src="@/assets/img/icon/components/share/warning.png" alt="">
-          <span>举报</span>
-        </div>
-        <div class="to" @click="copyLink">
-          <img src="@/assets/img/icon/components/share/copy.png" alt="">
-          <span>复制口令</span>
-        </div>
-        <div class="to" @click="toggleCollect">
-          <img v-if="isCollect" src="@/assets/img/icon/components/share/collect-yellow.png" alt="">
-          <img v-else src="@/assets/img/icon/components/share/collect.png" alt="">
-          <span>收藏</span>
-        </div>
-        <div class="to" @click="$no">
-          <img src="@/assets/img/icon/components/video/comeonlook.webp" alt="">
-          <span>一起看</span>
-        </div>
-        <div class="to" @click="copyLink">
-          <img src="@/assets/img/icon/components/share/link.png" alt="">
-          <span>复制链接</span>
-        </div>
-        <div class="to" @click="$no">
-          <img src="@/assets/img/icon/components/video/dou.webp" alt="">
-          <span>帮上热门</span>
-        </div>
-        <template v-if="isShowMore">
-          <div class="to" @click="closeShare($emit('showShareDuoshan'))">
-            <img src="@/assets/img/icon/components/video/duoshan.png" alt="">
-            <span>多闪</span>
-          </div>
-          <div class="to" @click="$no">
-            <img src="@/assets/img/icon/components/video/totoutiao.webp" alt="">
-            <span>今日头条</span>
-          </div>
-        </template>
-        <template v-else>
-          <div class="to" @click="$no">
-            <img src="@/assets/img/icon/components/share/share.png" alt="">
-            <span>更多分享</span>
-          </div>
-        </template>
-        <!--        todo-->
-        <div class="to" @click="closeShare($emit('dislike'))">
-          <img src="@/assets/img/icon/components/share/dislike.png" alt="">
-          <span>不感兴趣</span>
-        </div>
-        <div class="to" @click="$no">
-          <img src="@/assets/img/icon/components/video/bizhi.webp" alt="">
-          <span>动态壁纸</span>
-        </div>
-
-        <div class="to" @click="closeShare($emit('showDouyinCode'))">
-          <img src="@/assets/img/icon/components/video/qrcode.png" alt="">
-          <span>抖音码</span>
-        </div>
-
-
         <template v-if="false">
-          <div class="to" @click="$no">
-            <img src="@/assets/img/icon/components/video/torichang.png" alt="">
-            <span>分享日常</span>
+          <div class="to" @click="closeShare($emit('share2QQZone'))">
+            <img src="@/assets/img/icon/components/share/qq.webp" alt="">
+            <span>QQ</span>
           </div>
-          <div class="to" @click="closeShare($emit('ShareToFriend'))">
-            <img src="@/assets/img/icon/components/video/tofriend.webp" alt="">
-            <span>私信朋友</span>
+          <div class="to" @click="canDownload && closeShare($emit('download'))"
+               :style="{ opacity : canDownload ? '1' : '0.5' }">
+            <img src="@/assets/img/icon/components/share/download.png" alt="">
+            <span>保存本地</span>
           </div>
-
-          <div class="to" @click="closeShare($emit('share2Webo'))">
-            <img src="@/assets/img/icon/components/video/toweibo.webp" alt="">
-            <span>微博</span>
+          <div class="to" @click="$nav('/home/report',{mode:this.mode})">
+            <img src="@/assets/img/icon/components/share/warning.png" alt="">
+            <span>举报</span>
+          </div>
+          <div class="to" @click="copyLink">
+            <img src="@/assets/img/icon/components/share/copy.png" alt="">
+            <span>复制口令</span>
+          </div>
+          <div class="to" @click="toggleCollect">
+            <img v-if="isCollect" src="@/assets/img/icon/components/share/collect-yellow.png" alt="">
+            <img v-else src="@/assets/img/icon/components/share/collect.png" alt="">
+            <span>收藏</span>
           </div>
           <div class="to" @click="$no">
-            <img src="@/assets/img/icon/components/video/comeonplay.png" alt="">
-            <span>合拍</span>
+            <img src="@/assets/img/icon/components/share/comeon.webp" alt="">
+            <span>一起看</span>
           </div>
-          <div class="to" @click="closeShare($emit('play-feedback'))">
-            <img src="@/assets/img/icon/components/video/feedback.webp" alt="">
-            <span>播放反馈</span>
+          <div class="to" @click="copyLink">
+            <img src="@/assets/img/icon/components/share/link.png" alt="">
+            <span>复制链接</span>
+          </div>
+          <div class="to" @click="$no">
+            <img src="@/assets/img/icon/components/share/dou.webp" alt="">
+            <span>帮上热门</span>
+          </div>
+          <template v-if="isShowMore">
+            <div class="to" @click="closeShare($emit('showShareDuoshan'))">
+              <img src="@/assets/img/icon/components/video/duoshan.png" alt="">
+              <span>多闪</span>
+            </div>
+            <div class="to" @click="$no">
+              <img src="@/assets/img/icon/components/video/totoutiao.webp" alt="">
+              <span>今日头条</span>
+            </div>
+          </template>
+          <template v-else>
+            <div class="to" @click="$no">
+              <img src="@/assets/img/icon/components/share/share.png" alt="">
+              <span>更多分享</span>
+            </div>
+          </template>
+          <div class="to" @click="closeShare($emit('dislike'))">
+            <img src="@/assets/img/icon/components/share/dislike.png" alt="">
+            <span>不感兴趣</span>
+          </div>
+          <div class="to" @click="$no">
+            <img src="@/assets/img/icon/components/share/bizhi.webp" alt="">
+            <span>动态壁纸</span>
+          </div>
+          <div class="to" @click="closeShare($emit('showDouyinCode'))">
+            <img src="@/assets/img/icon/components/share/code.png" alt="">
+            <span>抖音码</span>
           </div>
         </template>
       </div>
@@ -153,13 +164,14 @@ export default {
       default: true
     },
   },
+
   computed: {
     ...mapState(['friends']),
   },
   data() {
     return {
       isCollect: false,
-      isShowMore: false,
+      isShowMore: true,
     }
   },
   methods: {
@@ -184,6 +196,9 @@ export default {
     },
     closeShare() {
       // this.$emit("update:modelValue", false)
+    },
+    closeShare1() {
+      this.$emit("update:modelValue", false)
     }
   }
 }
@@ -254,9 +269,10 @@ export default {
     }
   }
 
+  @icon-width: 5.8rem;
+
   .shares {
     @space-width: 1.5rem;
-    @icon-width: 3.8rem;
 
     overflow-x: scroll;
     display: flex;
@@ -266,16 +282,25 @@ export default {
       margin-left: @space-width;
       margin-bottom: @space-width;
 
-      img {
+      .wrapper {
+        box-sizing: border-box;
         background: white;
-        padding: 1rem;
         width: @icon-width;
         height: @icon-width;
+        padding: 1.2rem;
         border-radius: 1.5rem;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        img {
+          width: 100%;
+          //height: 100%;
+        }
       }
 
       span {
-        margin-top: .2rem;
+        margin-top: .7rem;
         color: black;
         font-size: 1rem;
         display: block;
@@ -283,6 +308,36 @@ export default {
       }
     }
   }
+
+
+  .loading {
+    width: 60%;
+    height: 60%;
+    position: relative;
+
+    @border-width: 3.1px;
+
+    .quan1 {
+      position: absolute;
+      box-sizing: border-box;
+      width: 100%;
+      height: 100%;
+      border: @border-width solid darkgrey;
+      border-radius: 50%;
+    }
+
+    .quan2 {
+      position: absolute;
+      box-sizing: border-box;
+      width: 100%;
+      height: 100%;
+      border: @border-width solid #514F56;
+      border-radius: 50%;
+    }
+
+  }
+
+
 }
 
 </style>