Selaa lähdekoodia

[edit] invited list

wenliming 2 vuotta sitten
vanhempi
commit
e7fcc71bb7

+ 4 - 0
src/assets/svg/icon-loading-channel.svg

@@ -0,0 +1,4 @@
+<svg width="66" height="66" viewBox="0 0 66 66" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="33" cy="33" r="30" stroke="#424242" stroke-width="5"/>
+<path d="M63 33C63 16.4315 49.5685 3 33 3" stroke="#1D9BF0" stroke-width="5"/>
+</svg>

+ 1 - 1
src/http/treasure.js

@@ -27,7 +27,7 @@ export function inviteDetail(params) {
 
 export function inviteList(params) {
     return service({
-        url: `/post/treasure/invite/list/v3`,
+        url: `/post/treasure/invite/list/v2`,
         method: "post",
         data: params,
     });

+ 14 - 4
src/view/iframe/treasure-hunt/components/invite-friends.vue

@@ -31,7 +31,7 @@
             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-tweet-loading.svg')" />
+          <img class="icon-loading" :src="require('@/assets/svg/icon-loading-channel.svg')" />
           <div class="text">
             Link copied to clipboard
              <br/>
@@ -340,7 +340,7 @@ const clickCopy = () => {
           }
 
           .share-item:hover {
-            background: #E3E3E4;
+            animation: fade-in-gray 0.25s linear forwards;
           }
 
         }
@@ -365,7 +365,7 @@ const clickCopy = () => {
       .icon-loading {
         width: 60px;
         height: 60px;
-        animation: loading 1.5 1s linear;
+        animation: loading 1 1s linear forwards;
         margin-bottom: 30px;
       }
 
@@ -383,8 +383,18 @@ const clickCopy = () => {
       }
 
       100% {
-          transform: rotate(360deg);
+          transform: rotate(280deg);
       }
   }
+
+  @keyframes fade-in-gray {
+    from {
+      background: none;
+    }
+
+    to {
+      background: #E3E3E4;
+    }
+  }
 }
 </style>

+ 28 - 23
src/view/iframe/treasure-hunt/components/invite-list.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="content">
     <div class="horizontal-invited-wrapper" v-if="state.invited_list.length">
-      invited({{ state.detail.inviteCount }})
+      invited({{ state.inviteCount }})
       <div class="horizontal-invited-list" v-show-log="state.log_invite_list_show " @mouseleave="invitedListMouseleave($event)">
         <template v-for="(item, index) in state.invited_list" :key="index">
           <div class="invited-item" v-if="index < 5" @mouseenter="invitedItemMouseenter(item)">
@@ -91,15 +91,13 @@ state.log_invite_list_show = {
 
 watch(global_refresh, () => {
     if (global_refresh.value) {
-        inviteListScroll({isRefresh: true});
+      list()
     }
 })
 
 onMounted(() => {
   state.btn_loading = false;
-  inviteListScroll({isRefresh: true})
-  console.log('state-->', state)
-  // list()
+  list()
 })
 
 const invitedItemMouseenter = (params) => {
@@ -131,13 +129,13 @@ const clickItem = (item) => {
 }
 
 function handleScroll(e) {
+  if (list_end) {
+    return
+  }
   e = e.target
   if ((e.clientHeight + e.scrollTop) / e.scrollHeight > .8) {
-    if(!listLoadMore) {
-      listLoadMore = true;
-      page_num++;
-      inviteListScroll()
-    }
+    list_end = true
+    inviteListScroll()
   }
 }
 
@@ -165,29 +163,36 @@ state.inviteListRefresh = () => {
 }
 
 const handleCommon = (data) => {
-  if(data && data.length) {
-    if(page_num < 2) {
-      state.invited_list = data;
-    } else {
-      let dataList = state.invited_list;
-      dataList = dataList.concat(data);
-      state.invited_list = dataList;
-    }
-    listLoadMore = false;
+  state.inviteCount = data.inviteCount
+   if (data.inviteUsers.length > 0) {
+    data.inviteUsers.forEach(item => {
+      if (state.invited_list.filter((item2) => { return item2.userInfo.uid == item.userInfo.uid }).length == 0) {
+        state.invited_list.push(item)
+      }
+    })
+    state.invited_list = state.invited_list.sort((a, b) => {
+      return b.timestamp - a.timestamp
+    })
+
+    list_end = false
+  } else {
+    list_end = false
   }
 }
 
 // 滚动
-let inviteListScroll = ({isRefresh = false}) => {
-  if(isRefresh) {
-    page_num = 1
+let inviteListScroll = () => {
+  let last_timestamp = 0
+  let len = state.invited_list.length
+  if (len > 0) {
+    last_timestamp = state.invited_list[len - 1].timestamp
   }
 
   inviteList({
     params: {
       inviteCode: state.invite_code,
       postId: state.postId,
-      pageNum: page_num,
+      lastTimestamp: last_timestamp,
       pageSize: page_size
     }
   }).then((res) => {