Merge branch 'edit-1.01-bug-4.27' into test

src/iframe/red-packet.js

@@ -1,4 +1,15 @@
 import { createApp } from 'vue'
 import App from '@/view/red-packet.vue'
+const app = createApp(App)
 
-createApp(App).mount('#app')
+// 引入路由对象实例
+import "ant-design-vue/dist/antd.css"; // or 'ant-design-vue/dist/antd.less'
+
+import { message } from "ant-design-vue";
+message.config({
+    top: `10px`,
+    duration: 3,
+    maxCount: 1,
+});
+app.use(message)
+app.mount('#app')

src/logic/twitter.js

@@ -504,7 +504,7 @@ function parseDOMRedPacket() {
         if (arr[i].innerText == '#DeNet') {
             let _tweetId = ''
             let _article = arr[i].closest('article')
-            let _txt_area = _article.querySelector('[lang]')
+            let _txt_area = _article.querySelector('[lang][dir=auto]')
             let _postId = _txt_area.innerText
             _postId = _postId.match(/###([\s\S]*?)###/)[1]
             _dom = _article.querySelector('[aria-labelledby]')
@@ -512,7 +512,7 @@ function parseDOMRedPacket() {
                 _type = 'card'
             } else {
                 _type = 'parnet'
-                _dom = _txt_area.parentNode.parentNode
+                _dom = _txt_area
             }
             let _a_area = _article.querySelector('a[aria-label]')
             if (_a_area && _a_area.getAttribute('href')) {
@@ -537,12 +537,13 @@ function replaceDOMRedPacket(_type, _dom, postId, tweetId) {
     if (!_dom || !_dom.parentElement) {
         return
     }
-    
-    if(_dom.parentElement.querySelector('iframe')){
+
+    if (_dom.parentElement.querySelector('iframe')) {
         return
     }
-    let _len
+
     if (_type == 'card') {
+        let _len
         _len = _dom.childNodes.length
         for (let i = 0; i < _len; i++) {
             _dom.children[i].style.display = 'none'
@@ -550,7 +551,12 @@ function replaceDOMRedPacket(_type, _dom, postId, tweetId) {
         _dom.style = 'height:500px'
         _dom.appendChild(createIframe(postId, tweetId))
     } else {
-        _dom.insertBefore(createIframe(postId, tweetId), _dom.children[1])
+        let _parent = _dom.parentNode
+        for (let i = 0; i < _parent.length; i++) {
+            _parent.children[i].style.display = 'none'
+        }
+        _dom.style.display='block'
+        _dom.appendChild(createIframe(postId, tweetId))
     }
 }
 

src/view/red-packet.vue

@@ -7,7 +7,7 @@
         <div class="title">Awesome! You Will Get</div>
         <div class="money">
           <img :src="data.detail.currencyIconPath" alt />
-          <span class="big">{{ data.money  }}</span>
+          <span class="big">{{ data.money }}</span>
           <!-- <span class="small">{{ data.detail.amountCurrencyCode || '' }}</span> -->
         </div>
       </div>
@@ -19,6 +19,8 @@
               <div class="item-follow-title">
                 <img :src="require('@/assets/svg/icon-follow.svg')" alt />
                 <div class="item-title">Follow</div>
+                <img :src="require('@/assets/gif/red-right.gif')" alt class="red-right"
+                  v-show="!data.done.follow && data.done.follow_red" />
                 <img v-if="data.done.follow" :src="require('@/assets/svg/icon-true.svg')" alt />
                 <div v-else class="btn" @click="clickFollowAll(item.relatedUsers)">Follow All</div>
               </div>
@@ -41,6 +43,8 @@
             <div class="item-content">
               <div class="item-title">Like</div>
             </div>
+            <img :src="require('@/assets/gif/red-right.gif')" alt class="red-right"
+              v-show="!data.done.like && data.done.like_red" />
             <img v-if="data.done.like" :src="require('@/assets/svg/icon-true.svg')" alt />
             <div v-else class="btn" @click="clickLickBtn">Like</div>
           </template>
@@ -49,6 +53,8 @@
             <div class="item-content">
               <div class="item-title">Retweet</div>
             </div>
+            <img :src="require('@/assets/gif/red-right.gif')" alt class="red-right"
+              v-show="!data.done.retweet && data.done.retweet_red" />
             <img v-if="data.done.retweet" :src="require('@/assets/svg/icon-true.svg')" alt />
             <div v-else class="btn" @click="clickRetweetBtn">Retweet</div>
           </template>
@@ -57,8 +63,8 @@
       <div class="people" @click="clickRoad">
         <div class="txt">
           {{ data.detail.receiveCount || 0 }}/{{ data.detail.totalCount || 0 }} Got，{{
-            data.detail.receiveAmountValue 
-          }}/{{ data.detail.amountValue  }} {{ data.detail.amountCurrencyCode }}</div>
+              data.detail.receiveAmountValue
+          }}/{{ data.detail.amountValue }} {{ data.detail.amountCurrencyCode }}</div>
         <div class="right" v-if="data.detail.allReceived">
           <template v-for="item, i in data.detail.allReceived.slice(0, 3)" v-bind:key="i">
             <img :src="item.simpleUserInfoVO.avatarUrl" alt :style="{ right: `${i * 16 + 14}px` }"
@@ -83,7 +89,7 @@
       <div class="header" :style="{ 'backgroundImage': `url(${require('@/assets/subject/001-back-head-top.svg')})` }">
         <div class="money">
           <img :src="data.detail.currencyIconPath" alt />
-          <span class="big">{{ data.money  }}</span>
+          <span class="big">{{ data.money }}</span>
           <!-- <span class="small">{{ data.detail.amountCurrencyCode }}</span> -->
         </div>
         <div class="done" @click="clickDone">
@@ -94,8 +100,8 @@
       </div>
       <div class="luck-list-title">
         <div>{{ data.detail.receiveCount || 0 }}/{{ data.detail.totalCount || 0 }} Got</div>
-        <div> {{ data.detail.receiveAmountValue  }} / {{ data.detail.amountValue  || '' }} {{
-          data.detail.amountCurrencyCode || ''
+        <div> {{ data.detail.receiveAmountValue }} / {{ data.detail.amountValue || '' }} {{
+            data.detail.amountCurrencyCode || ''
         }}</div>
       </div>
       <div class="luck-list" @scroll="handleScroll($event)">
@@ -135,7 +141,7 @@
         <div class="txt">{{ data.detail.amountCurrencyCode }} GIVEAWAY</div>
         <div class="coin">
           <img :src="data.detail.currencyIconPath" alt />
-          <span>{{ data.detail.amountValue  }}</span>
+          <span>{{ data.detail.amountValue }}</span>
         </div>
         <div class="people">{{ data.detail.totalCount }} WINNERS TO SHARE</div>
       </div>
@@ -148,9 +154,9 @@
         <img :src="require('@/assets/svg/icon-back.svg')" alt @click="clickBack" />
       </div>
       <div class="luck-list-title">
-        <div>{{ data.detail.receiveCount || 0 }}/{{ data.detail.totalCount || 0 }} People Got</div>
-        <div> {{ data.detail.receiveAmountValue  }} / {{ data.detail.amountValue  || '' }} {{
-          data.detail.amountCurrencyCode || ''
+        <div>{{ data.detail.receiveCount || 0 }}/{{ data.detail.totalCount || 0 }} Got</div>
+        <div> {{ data.detail.receiveAmountValue }} / {{ data.detail.amountValue || '' }} {{
+            data.detail.amountCurrencyCode || ''
         }}</div>
       </div>
       <div class="luck-list" @scroll="handleScroll">
@@ -183,8 +189,8 @@
       </div>
       <div class="luck-list-title">
         <div>{{ data.detail.receiveCount || 0 }}/{{ data.detail.totalCount || 0 }} People Got</div>
-        <div> {{ data.detail.receiveAmountValue  }} / {{ data.detail.amountValue  || '' }} {{
-          data.detail.amountCurrencyCode || ''
+        <div> {{ data.detail.receiveAmountValue }} / {{ data.detail.amountValue || '' }} {{
+            data.detail.amountCurrencyCode || ''
         }}</div>
       </div>
       <div class="luck-list" @scroll="handleScroll">
@@ -237,6 +243,7 @@ export default {
 import { onMounted, reactive } from "vue";
 import { getPostDetail, getRedPacket, finishRedPacket, oneKeyLike, oneKeyReTweet, oneKeyFollow, getTaskDetail, getReceivedList } from '@/http/redPacket.js'
 import { getQueryString } from '@/uilts/help.js'
+import { message } from 'ant-design-vue';
 import { getChromeStorage } from '@/uilts/chromeExtension.js'
 var moment = require('moment');
 
@@ -450,7 +457,7 @@ function myReceivedState() {
 }
 
 function showLastTwoPlace(n) {
-  return n 
+  return n
 }
 
 function init() {
@@ -545,7 +552,6 @@ onMounted(() => {
   data.postId = getQueryString('postId')
   data.tweetId = getQueryString('tweetId')
   init()
-  // data.status = 'error'
   // data.loading_show = true
 })
 
@@ -571,6 +577,11 @@ function handleRedPacket() {
         data.money = res.data.receiveAmount
         init()
         break
+      case "2003":
+        data.status = 'close'
+        data.close_title = `This Giveaways`
+        data.close_text = `expired on ${moment(data.detail.endTimestamp).format('MM-DD')}`
+        break
       case "2008":
         data.status = 'close'
         data.close_title = 'Better luck next time!'
@@ -580,7 +591,11 @@ function handleRedPacket() {
         data.status = 'error'
         data.retry = true
         break
+      case "2023":
+        message.error('推文未发布')
+        break
       default:
+        message.error(res.msg)
     }
   })
 }
@@ -644,21 +659,25 @@ function handleFinishRedPacket() {
                 if (_data[i].finished) {
                   data.done.follow = true
                 } else {
-                  alert('Please complete the task: follow')
+                  // alert('Please complete the task: follow')
+                  data.done.follow_red = true
                 }
                 break
               case '2':
                 if (_data[i].finished) {
                   data.done.like = true
                 } else {
-                  alert('Please complete the task: like tweet')
+                  // alert('Please complete the task: like tweet')
+                  data.done.like_red = true
                 }
                 break
               case '3':
                 if (_data[i].finished) {
                   data.done.retweet = true
                 } else {
-                  alert('Please complete the task: Retweet')
+                  // alert('Please complete the task: Retweet')
+                  data.done.retweet_red = true
+
                 }
                 break
             }
@@ -675,7 +694,7 @@ function handleFinishRedPacket() {
         data.retry = true
         break
       case "-106":
-        alert('Clicking too often, wait a moment and click again')
+        message.error('Clicking too often, wait a moment and click again')
         break
       default:
         console(res)
@@ -860,6 +879,7 @@ body {
       .money {
         margin-bottom: 30px;
         width: 100%;
+
         img {
           width: 40px;
           height: 40px;
@@ -1021,7 +1041,7 @@ body {
       background-size: 100% 100%;
       display: flex;
       flex-wrap: wrap;
-      align-content:center;
+      align-content: center;
 
       .title {
         color: #fff7e4;
@@ -1035,6 +1055,7 @@ body {
 
       .money {
         width: 100%;
+
         img {
           margin-right: 9px;
           width: 40px;
@@ -1082,10 +1103,16 @@ body {
           height: 24px;
         }
 
+        .red-right {
+          width: 35px;
+          height: 24px;
+        }
+
         .item-content {
           width: 100%;
           flex: 1;
 
+
           .item-follow-title {
             display: flex;
             align-items: center;
@@ -1094,8 +1121,8 @@ body {
             position: relative;
 
             .btn {
-              position: absolute;
-              right: 0;
+              // position: absolute;
+              // right: 0;
             }
           }
 
@@ -1155,7 +1182,7 @@ body {
         }
 
         .btn {
-          width: 72px;
+          width: 90px;
           height: 29px;
           line-height: 29px;
           background: rgba(56, 154, 255, 0.1);
@@ -1328,7 +1355,7 @@ body {
         font-weight: 600;
         font-size: 16px;
         letter-spacing: 0.3px;
-        color: #FFF2D3;
+        color: #fff;
       }
     }