Selaa lähdekoodia

Merge branch 'dev_1.1.7.2' of https://git.yishihui.com/DeNet/de-net into dev_1.1.7.2

zhangwei 2 vuotta sitten
vanhempi
commit
835e0c0fa7

+ 10 - 7
src/logic/content/twitter.js

@@ -1076,18 +1076,21 @@ export const getTweetUserFollowStatus = (params) => {
         promiseList[i] = TwitterApiUserByScreenNameReq({ screen_name: userList[i]['name'] });
     }
 
-    Promise.all(promiseList).then((res) => {
+    Promise.allSettled(promiseList).then((res) => {
         let list = [];
         if (res && res.length) {
-            for (let i = 0; i < res.length; i++) {
-                let item = res[i];
-                if (item && item.data && item.data.data) {
-                    list.push(item.data.data)
-                }
-            }
+          let resList = res.filter(item => item.status == 'fulfilled');
+          for (let i = 0; i < resList.length; i++) {
+              let item = resList[i];
+              if (item && item.value && item.value.data && item.value.data.data) {
+                  list.push(item.value.data.data)
+              }
+          }
         }
 
         chrome.runtime.sendMessage({ actionType: 'CONTENT_GET_TWEET_USER_FOLLOW_STATUS_RES', data: list, tweetId, type: params.type, iframeId: params.iframeId }, () => { })
+    }).catch(err => {
+      chrome.runtime.sendMessage({ actionType: 'CONTENT_GET_TWEET_USER_FOLLOW_STATUS_RES', data: [], tweetId, type: params.type, iframeId: params.iframeId }, () => { })
     })
 }
 

+ 2 - 1
src/view/components/custom-card-cover.vue

@@ -92,7 +92,7 @@
             <img class="img-treasure-big" :src="require('@/assets/img/icon-treasure-box.png')">
 
             <div class="treasure-row-4">
-               <img class="img" :src="require('@/assets/svg/icon-card-cover-treasure-tasks.svg')"> to Hunt Treasure
+               <img class="img" :src="require('@/assets/svg/icon-three-line.svg')"> to Hunt Treasure
             </div>
 
             <div class="open-btn" @click="open">
@@ -377,6 +377,7 @@ onMounted(() => {
 
             .img {
                 width: 76px;
+                margin-right: 10px;
             }
         }
 

+ 109 - 5
src/view/iframe/treasure-hunt/all-receive-list.vue

@@ -1,8 +1,13 @@
 <template>
     <div class="invite-list">
         <div class="head">
-            <img height="20" :src="require('@/assets/svg/icon-back-2.svg')" @click="clickBack" />
-            <span>{{ state.detail.receiveCountWithAmount }} People Get Money</span>
+            <div class="left">
+              <img height="20" :src="require('@/assets/svg/icon-back-2.svg')" @click="clickBack" />
+              <span>{{ state.detail.receiveCountWithAmount }} People Get Money</span>
+            </div>
+            <div class="right">
+              <img @click="showOptionSheet = true" :src="sortTypeIcon" alt="">
+            </div>
         </div>
         <div class="content">
             <img v-show="state.receive.loading && state.receive.list.length == 0"
@@ -24,23 +29,56 @@
                 </div>
             </div>
         </div>
+        <div class="option-sheet" v-if="showOptionSheet">
+          <div class="item" v-for="(item, index) in optionList" :key="index" @click="clickOption(item)">
+            <img :src="item.icon" >
+            <div class="label">
+              {{item.label}}
+            </div>
+          </div>
+        </div>
+        <div class="option-mask" v-if="showOptionSheet" @click="showOptionSheet = false"></div>
     </div>
 </template>
 <script setup>
 import { receiveListV2 } from '@/http/treasure'
-import { inject, onMounted } from 'vue'
+import { inject, onMounted, ref } from 'vue'
 import { getBeforeTimeFormat } from "@/uilts/help"
 import Report from "@/log-center/log"
 
+let amountIcon = require('@/assets/svg/icon-sort-amount.svg');
+let timeIcon = require('@/assets/svg/icon-sort-time.svg');
+
+
+let sortTypeIcon = ref(amountIcon);
+
 let state = inject('state')
 state.receive = {
     end: false,
     list: []
 }
+
+let optionList = ref([
+  {
+    icon: amountIcon,
+    label: 'Amount',
+    type: 2
+  },
+  {
+    icon: timeIcon,
+    label: 'Time',
+    type: 1
+  }
+])
+
+
 let page_num = 1
 let page_size = 10
+let sortType = 2;
 let list_end = false
 
+let showOptionSheet = ref(false);
+
 const clickBack = () => {
     state.page_show = ''
 }
@@ -53,6 +91,14 @@ const clickItem = (item) => {
     window.open(`https://twitter.com/${item.userInfo.nickName}`)
 }
 
+const clickOption = (params) => {
+  showOptionSheet.value = false;
+  sortTypeIcon.value = params.icon;
+  page_num = 1;
+  sortType = params.type;
+  list()
+}
+
 function handleScroll(e) {
     if (list_end) {
         return
@@ -74,12 +120,16 @@ const list = () => {
             postId: state.postId,
             pageNum: page_num,
             pageSize: page_size,
-            sortType: 0
+            sortType
         }
     }).then((res) => {
         if (res.code == 0) {
             state.receive.loading = false
-            state.receive.list = state.receive.list.concat(res.data)
+            if(page_num < 2) {
+              state.receive.list = res.data || [];
+            } else {
+              state.receive.list = state.receive.list.concat(res.data)
+            }
             state.receive.end = true
             list_end = false
         }
@@ -90,6 +140,7 @@ const list = () => {
 .invite-list {
     width: 375px;
     height: 580px;
+    position: relative;
 
     .head {
         width: 100%;
@@ -97,10 +148,16 @@ const list = () => {
         box-sizing: border-box;
         display: flex;
         align-items: center;
+        justify-content: space-between;
 
         background: #FFFFFF;
         box-shadow: inset 0px -1px 0px #F2F2F2;
 
+        .left {
+          display: flex;
+          align-items: center;
+        }
+
         img {
             width: 24px;
             height: 24px;
@@ -194,6 +251,53 @@ const list = () => {
             }
         }
     }
+
+    .option-mask {
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 800;
+    }
+    .option-sheet {
+      width: 200px;
+      background: #FFFFFF;
+      box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.2);
+      border-radius: 14px;
+      position: absolute;
+      top: 40px;
+      right: 8px;
+      z-index: 1000;
+      cursor: pointer;
+
+      .item {
+        width: 100%;
+        height: 40px;
+        display: flex;
+        align-items: center;
+
+        img {
+          width: 24px;
+          margin: 0 12px;
+        }
+
+        .label {
+          font-weight: 500;
+          font-size: 15px;
+          width: calc(100% - 52px);
+          height: 100%;
+          display: flex;
+          align-items: center;
+        }
+      }
+
+       .item:first-child {
+          .label {
+            box-shadow: inset 0px -1px 0px #F2F2F2;
+          }
+        }
+    }
 }
 
 .loading {

+ 281 - 287
src/view/iframe/treasure-hunt/components/invite-friends.vue

@@ -1,45 +1,45 @@
 <template>
-  <div class="invite-friends">
-    <div class="invite-friends-content">
-      <div class="invite-friends-content-head">
-        <div class="title">Invite Friends to Open the Chest!</div>
-        <div class="info">Invitees Need to be Real New follower of {{ followUserStr }} to receive rewards</div>
-      </div>
-      <div class="invite-friends-content-body">
-        <img class="tips" v-if="state.active_share_channel" :src="require('@/assets/svg/icon-channel-tips.svg')" />
-
-        <div class="share-list" :class="{ 'share-list-active': state.active_share_channel }">
-          <div v-for="(item, index) in state.share_list" :key="index" :data-clipboard-text="item.inviteContent"
-            @click="clickShare(item)" class="share-item">
-            <img :src="item.iconPath" />
-            <div class="name">
-              {{ item.name }}
+    <div class="invite-friends">
+      <div class="invite-friends-content">
+        <div class="invite-friends-content-head">
+          <div class="title">Invite Friends to Open the Chest!</div>
+          <div class="info">Invitees Need to be Real New follower of {{followUserStr}} to receive rewards</div>
+        </div>
+        <div class="invite-friends-content-body">
+          <img class="tips" v-if="state.active_share_channel" :src="require('@/assets/svg/icon-channel-tips.svg')" />
+
+          <div class="share-list" :class="{'share-list-active': state.active_share_channel}">
+            <div v-for="(item, index) in state.share_list" :key="index" :data-clipboard-text="item.inviteContent"
+                @click="clickShare(item)" class="share-item">
+              <img :src="item.iconPath"  />
+              <div class="name">
+                {{item.name}}
+              </div>
             </div>
-          </div>
-          <div class="share-item copy-btn" @click="clickCopy" v-click-log="state.log_invite_copy_btn_click"
-            :data-clipboard-text="state.detail.inviteCopyUrl">
-            <img :src="require('@/assets/svg/icon-copy-url-teasure.svg')" alt="">
-            <div class="name">
-              Copy URL
+            <div class="share-item copy-btn" @click="clickCopy" v-click-log="state.log_invite_copy_btn_click"
+                :data-clipboard-text="state.detail.inviteCopyUrl">
+              <img :src="require('@/assets/svg/icon-copy-url-teasure.svg')" alt="">
+              <div class="name">
+                Copy URL
+              </div>
             </div>
-          </div>
+        </div>
         </div>
       </div>
-    </div>
-    <v-btn :txt="state.open_btn.txt" :font-size="'17px'" class="btn" :icon="false" :disabled="state.open_btn.disabled"
-      v-show-log="state.log_invite_btn_show" :loading="state.btn_loading" v-click-log="state.log_invite_btn_click"
-      @onClick="clickBtn" font-weight="600"></v-btn>
-    <div class="mask" v-show="showShareTips">
-      <div class="content">
-        <img class="icon-loading" :src="require('@/assets/svg/icon-loading-channel.svg')" />
-        <div class="text">
-          Link copied to clipboard
-          <br />
-          Opening {{ selectShareApp.name }}
+      <v-btn :txt="state.open_btn.txt" :font-size="'17px'" class="btn" :icon="false"
+            :disabled="state.open_btn.disabled" v-show-log="state.log_invite_btn_show" :loading="state.btn_loading"
+            v-click-log="state.log_invite_btn_click" @onClick="clickBtn" font-weight="600"></v-btn>
+      <div class="mask" v-show="showShareTips">
+        <div class="content">
+          <img class="icon-loading" :src="require('@/assets/svg/icon-loading-channel.svg')" />
+          <div class="text">
+            Link copied to clipboard
+             <br/>
+            Opening {{selectShareApp.name }}
+          </div>
         </div>
       </div>
     </div>
-  </div>
 </template>
 <script setup>
 import VBtn from '@/view/iframe/treasure-hunt/components/btn.vue'
@@ -55,40 +55,40 @@ let ClipboardJS = require('clipboard');
 let state = inject('state')
 
 state.log_invite_btn_show = {
-  businessType: Report.businessType.buttonView,
-  pageSource: Report.pageSource.inviteFriendsPage,
-  objectType: Report.objectType.openChestButton,
-  redPacketType: Report.redPacketType.treasure,
-  shareLinkId: state.invite_code,
-  myShareLinkId: state.detail.inviteCopyUrl,
-  currentInvitedNum: state.inviteCount,
-  postId: state.postId
+    businessType: Report.businessType.buttonView,
+    pageSource: Report.pageSource.inviteFriendsPage,
+    objectType: Report.objectType.openChestButton,
+    redPacketType: Report.redPacketType.treasure,
+    shareLinkId: state.invite_code,
+    myShareLinkId: state.detail.inviteCopyUrl,
+    currentInvitedNum: state.inviteCount,
+    postId: state.postId
 }
 
 state.log_invite_btn_click = {
-  businessType: Report.businessType.buttonClick,
-  pageSource: Report.pageSource.inviteFriendsPage,
-  objectType: Report.objectType.openChestButton,
-  redPacketType: Report.redPacketType.treasure,
-  shareLinkId: state.invite_code,
-  myShareLinkId: state.detail.inviteCopyUrl,
-  currentInvitedNum: state.inviteCount,
-  postId: state.postId
+    businessType: Report.businessType.buttonClick,
+    pageSource: Report.pageSource.inviteFriendsPage,
+    objectType: Report.objectType.openChestButton,
+    redPacketType: Report.redPacketType.treasure,
+    shareLinkId: state.invite_code,
+    myShareLinkId: state.detail.inviteCopyUrl,
+    currentInvitedNum: state.inviteCount,
+    postId: state.postId
 }
 state.log_invite_copy_btn_click = {
-  businessType: Report.businessType.buttonClick,
-  pageSource: Report.pageSource.inviteFriendsPage,
-  objectType: Report.objectType.copyButton,
-  redPacketType: Report.redPacketType.treasure,
-  shareLinkId: state.invite_code,
-  myShareLinkId: state.detail.inviteCopyUrl,
-  currentInvitedNum: state.inviteCount,
-  postId: state.postId
+    businessType: Report.businessType.buttonClick,
+    pageSource: Report.pageSource.inviteFriendsPage,
+    objectType: Report.objectType.copyButton,
+    redPacketType: Report.redPacketType.treasure,
+    shareLinkId: state.invite_code,
+    myShareLinkId: state.detail.inviteCopyUrl,
+    currentInvitedNum: state.inviteCount,
+    postId: state.postId
 }
 
 let facebookAppConfig = {
-  facebookAppId: "",
-  faceShareRedirectUrl
+    facebookAppId: "",
+    faceShareRedirectUrl
 };
 
 let selectShareApp = ref({});
@@ -96,301 +96,295 @@ let showShareTips = ref(false);
 let followUserStr = ref('');
 
 onMounted(() => {
-  state.btn_loading = false
-  setFrontConfig();
-  initInviteChannel();
-  getFollowUserStr();
+    state.btn_loading = false
+    setFrontConfig();
+    initInviteChannel();
+    getFollowUserStr();
 })
 
 const getFollowUserStr = () => {
   let arr = [];
-  if (state.follows && state.follows.length) {
-    for (let i = 0; i < state.follows.length; i++) {
+  if(state.follows && state.follows.length) {
+    for(let i = 0; i < state.follows.length; i++) {
       let item = state.follows[i];
-      arr.push('@' + item.name);
+      arr.push('@'+item.name);
     }
   }
   followUserStr.value = arr.join(" or ");
 }
 
 chrome.management.onDisabled.addListener(() => {
-  initInviteChannel()
+    initInviteChannel()
 })
 chrome.management.onEnabled.addListener(() => {
-  initInviteChannel()
+    initInviteChannel()
 })
 
 chrome.management.onInstalled.addListener(() => {
-  initInviteChannel()
+    initInviteChannel()
 })
 chrome.management.onUninstalled.addListener(() => {
-  initInviteChannel()
+    initInviteChannel()
 })
 
 let linePluginInstalled
 const initInviteChannel = () => {
-  try {
-    chrome.management.get('ophjlpahpchlmihnnnihgmmeilfjmjjc', (res) => {
-      if ((res && linePluginInstalled == 1) || (!res && linePluginInstalled == 0)) {
-        return
-      }
-      if (res) {
-        linePluginInstalled = 1
-      } else {
-        linePluginInstalled = 0
-      }
-
-      inviteChannel({
-        params: {
-          linePluginInstalled,
-          postId: state.postId
-        }
-      }).then((res) => {
-        if (res.code == 0) {
-          state.share_list = res.data
-        }
-      })
-    })
-  } catch (error) {
-    console.error(error)
-  }
+    try {
+        chrome.management.get('ophjlpahpchlmihnnnihgmmeilfjmjjc', (res) => {
+            if ((res && linePluginInstalled == 1) || (!res && linePluginInstalled == 0)) {
+                return
+            }
+            if (res) {
+                linePluginInstalled = 1
+            } else {
+                linePluginInstalled = 0
+            }
+
+            inviteChannel({
+                params: {
+                    linePluginInstalled,
+                    postId: state.postId
+                }
+            }).then((res) => {
+                if (res.code == 0) {
+                    state.share_list = res.data
+                }
+            })
+        })
+    } catch (error) {
+        console.error(error)
+    }
 }
 
 async function clickBtn() {
-  let _userInfo = await state.checkIsLogin()
-  if (!_userInfo) {
-    return
-  }
-  state.btn_loading = true
-  state.treasureOpen()
+    let _userInfo = await state.checkIsLogin()
+    if (!_userInfo) {
+        return
+    }
+    state.btn_loading = true
+    state.treasureOpen()
 }
 
 const clickShare = (item) => {
-  var clipboard = new ClipboardJS('.share-item');
-  clipboard.on('success', function (e) {
-    // state.toast.txt = 'Copy Successfully'
-    // state.toast.has_icon = true
-    // state.toast.show = true
-    // setTimeout(() => {
-    //     state.toast.show = false
-    // }, 2000)
-    e.clearSelection();
-  })
-  showShareTips.value = true;
-  selectShareApp.value = item;
-
-  if (item.name == 'facebook') {
-    setChromeStorage({
-      shareFacebookData: JSON.stringify({
-        contentStr: item.inviteContent
-      })
+    var clipboard = new ClipboardJS('.share-item');
+    clipboard.on('success', function (e) {
+        // state.toast.txt = 'Copy Successfully'
+        // state.toast.has_icon = true
+        // state.toast.show = true
+        // setTimeout(() => {
+        //     state.toast.show = false
+        // }, 2000)
+        e.clearSelection();
     })
-    let cbParams = {
-      bizType: 'TEASURE_INVITE'
+    showShareTips.value = true;
+    selectShareApp.value = item;
+
+    if (item.name == 'facebook') {
+        setChromeStorage({
+            shareFacebookData: JSON.stringify({
+                contentStr: item.inviteContent
+            })
+        })
+        let cbParams = {
+            bizType: 'TEASURE_INVITE'
+        }
+        let url = `https://www.facebook.com/dialog/share?app_id=${facebookAppConfig.facebookAppId}&display=popup&href=${item.treasureInviteUrl}&redirect_uri=${facebookAppConfig.faceShareRedirectUrl}?params=${JSON.stringify(cbParams)}`;
+
+        setTimeout(() => {
+          showShareTips.value = false;
+          chrome.windows.create({
+            width: 800,
+              type: 'normal',
+              url
+          }, function (window) {
+          })
+        }, 1000)
+
+    } else {
+        setTimeout(() => {
+          showShareTips.value = false;
+          chrome.tabs.create({
+              url: item.redirectPath
+          });
+        }, 1000)
     }
-    let url = `https://www.facebook.com/dialog/share?app_id=${facebookAppConfig.facebookAppId}&display=popup&href=${item.treasureInviteUrl}&redirect_uri=${facebookAppConfig.faceShareRedirectUrl}?params=${JSON.stringify(cbParams)}`;
-
-    setTimeout(() => {
-      showShareTips.value = false;
-      chrome.windows.create({
-        width: 800,
-        type: 'normal',
-        url
-      }, function (window) {
-      })
-    }, 1000)
-
-  } else {
-    setTimeout(() => {
-      showShareTips.value = false;
-      chrome.tabs.create({
-        url: item.redirectPath
-      });
-    }, 1000)
-  }
-  Report.reportLog({
-    businessType: Report.businessType.buttonClick,
-    pageSource: Report.pageSource.inviteFriendsPage,
-    objectType: Report.objectType.channelButton,
-    shareLinkId: state.invite_code,
-    myShareLinkId: state.detail.inviteCopyUrl,
-    currentInvitedNum: state.inviteCount,
-    postId: state.postId
-  }, {
-    'channel-name': item.name
-  });
+    Report.reportLog({
+        businessType: Report.businessType.buttonClick,
+        pageSource: Report.pageSource.inviteFriendsPage,
+        objectType: Report.objectType.channelButton,
+        shareLinkId: state.invite_code,
+        myShareLinkId: state.detail.inviteCopyUrl,
+        currentInvitedNum: state.inviteCount,
+        postId: state.postId
+    }, {
+        'channel-name': item.name
+    });
 }
 
 const setFrontConfig = () => {
-  getFrontConfig({
-    params: {},
-  }).then((res) => {
-    if (res.code == 0) {
-      facebookAppConfig.facebookAppId = res.data.fbClientId;
-    }
-  });
+    getFrontConfig({
+        params: {},
+    }).then((res) => {
+        if (res.code == 0) {
+            facebookAppConfig.facebookAppId = res.data.fbClientId;
+        }
+    });
 };
 
 
 
 const clickCopy = () => {
-  var clipboard = new ClipboardJS('.copy-btn');
-  clipboard.on('success', function (e) {
-    state.toast.txt = 'Copy Successfully'
-    state.toast.has_icon = true
-    state.toast.show = true
-    setTimeout(() => {
-      state.toast.show = false
-    }, 2000)
-    e.clearSelection();
-  })
-
-  clipboard.on('error', function (e) {
-    state.toast.txt = 'Copy Error'
-    state.toast.has_icon = false
-    state.toast.show = true
-    setTimeout(() => {
-      state.toast.show = false
-    }, 2000)
-  })
+    var clipboard = new ClipboardJS('.copy-btn');
+    clipboard.on('success', function (e) {
+        state.toast.txt = 'Copy Successfully'
+        state.toast.has_icon = true
+        state.toast.show = true
+        setTimeout(() => {
+            state.toast.show = false
+        }, 2000)
+        e.clearSelection();
+    })
+
+    clipboard.on('error', function (e) {
+        state.toast.txt = 'Copy Error'
+        state.toast.has_icon = false
+        state.toast.show = true
+        setTimeout(() => {
+            state.toast.show = false
+        }, 2000)
+    })
 }
 </script>
 <style lang="scss" scoped>
 .invite-friends {
-  padding: 9px 14px 14px 14px;
-  background: #fff;
-  box-sizing: border-box;
-
-  .invite-friends-content {
-    max-height: 242px;
-    overflow-y: auto;
-    margin-bottom: 10px;
+    padding: 9px 14px 14px 14px;
+    background: #fff;
     box-sizing: border-box;
 
-    .invite-friends-content-head {
-      margin-bottom: 18px;
-      padding: 0 6px;
+    .invite-friends-content {
+      max-height: 242px;
+      overflow-y: auto;
+      margin-bottom: 10px;
       box-sizing: border-box;
 
-      .title {
-        font-weight: 900;
-        font-size: 18px;
-        margin-bottom: 7px;
-      }
-
-      .info {
-        font-weight: 400;
-        font-size: 12px;
-        color: #7A7A7A;
-        line-height: 15px;
-      }
-
-    }
+      .invite-friends-content-head {
+        margin-bottom: 16px;
+        padding: 0 6px;
+        box-sizing: border-box;
 
-    .invite-friends-content-body {
-      position: relative;
+        .title {
+          font-weight: 900;
+          font-size: 18px;
+          margin-bottom: 7px;
+        }
+        .info {
+          font-weight: 400;
+          font-size: 12px;
+          color: #7A7A7A;
+          line-height: 15px;
+        }
 
-      .tips {
-        position: absolute;
-        top: -42px;
-        left: 0;
-        width: 146px;
       }
 
-      .share-list-active {
-        background: rgba(29, 155, 240, 0.1);
-        border: 1.5px solid #1D9BF0 !important;
-        border-radius: 10px;
-      }
+      .invite-friends-content-body {
+        position: relative;
 
-      .share-list {
-        display: flex;
-        flex-wrap: wrap;
-        width: 100%;
-        box-sizing: border-box;
-        border: 1.5px solid #fff;
+        .tips {
+          position: absolute;
+          top: -42px;
+          left: 0;
+          width: 146px;
+        }
 
-        .share-item {
-          user-select: none;
-          width: 20%;
+        .share-list-active {
+          background: rgba(29, 155, 240, 0.1);
+          border: 1.5px solid #1D9BF0 !important;
+          border-radius: 10px;
+        }
+        .share-list {
           display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 8px 2px;
+          flex-wrap: wrap;
+          width: 100%;
           box-sizing: border-box;
-          border-radius: 12px;
-
-
-          cursor: pointer;
-
-          img {
-            width: 40px;
-            height: 40px;
-            border-radius: 100px;
-            margin-bottom: 8px;
+          border: 1.5px solid #fff;
+
+          .share-item {
+            user-select: none;
+            width: 20%;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            padding: 8px 2px;
+            box-sizing: border-box;
+            border-radius: 12px;
+
+
+            cursor: pointer;
+            img {
+                width: 40px;
+                height: 40px;
+                border-radius: 100px;
+                margin-bottom: 8px;
+            }
+            .name {
+              font-weight: 400;
+              font-size: 12px;
+              color: #898989;
+              width: 100%;
+              overflow: hidden;
+              text-overflow: ellipsis; //文本溢出显示省略号
+              white-space: nowrap;
+              text-align: center;
+            }
           }
 
-          .name {
-            font-weight: 400;
-            font-size: 12px;
-            color: #898989;
-            width: 100%;
-            overflow: hidden;
-            text-overflow: ellipsis; //文本溢出显示省略号
-            white-space: nowrap;
-            text-align: center;
+          .share-item:hover {
+            animation: fade-in-gray 0.25s linear forwards;
           }
-        }
 
-        .share-item:hover {
-          animation: fade-in-gray 0.25s linear forwards;
         }
-
       }
     }
-  }
-
-  .mask {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 375px;
-    height: 100%;
-    background: rgba($color: #000000, $alpha: 0.9);
-    z-index: 1000;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    .content {
-      text-align: center;
-    }
-
-    .icon-loading {
-      width: 60px;
-      height: 60px;
-      animation: loading 1 1s linear forwards;
-      margin-bottom: 30px;
-    }
+    .mask {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 375px;
+      height: 100%;
+      background: rgba($color: #000000, $alpha: 0.9);
+      z-index: 1000;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      .content {
+        text-align: center;
+      }
 
+      .icon-loading {
+        width: 60px;
+        height: 60px;
+        animation: loading 1 1s linear forwards;
+        margin-bottom: 30px;
+      }
 
-    .text {
-      font-weight: 600;
-      font-size: 17px;
-      color: #FFFFFF;
+      .text {
+        font-weight: 600;
+        font-size: 17px;
+        color: #FFFFFF;
+      }
     }
-  }
 
 
   @keyframes loading {
-    0% {
-      transform: rotate(0);
-    }
+      0% {
+          transform: rotate(0);
+      }
 
-    100% {
-      transform: rotate(280deg);
-    }
+      100% {
+          transform: rotate(280deg);
+      }
   }
 
   @keyframes fade-in-gray {