Merge branch 'feature_220509_new' into add-empty-red-packet-5.14

# Conflicts:
#	src/view/iframe/red-packet/red-packet.vue

src/assets/svg/icon-loading-gray.svg

@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.3302 6.49995C14.7109 8.89141 13.8915 11.9494 11.5 13.3301C9.10859 14.7108 6.05063 13.8914 4.66992 11.5C3.28921 9.10849 4.10859 6.05054 6.50005 4.66982C7.59822 4.03579 8.83693 3.8657 9.98924 4.09872" stroke="#B5B5B5" stroke-width="1.8"/>
+</svg>

src/entry/background.js

@@ -75,7 +75,7 @@ function onMessageMethod(req, sender, sendResponse) {
                 });
                 break
             case "CONTENT_SEND_DISCORD_AUTH_CODE":
-                discordLoginCode(req);
+                discordLoginCode(req, sender);
                 break
             case 'RED_PACKET_SAVE_DISCORD_AUTH_WINDOW_ID':
                 saveDiscordAuthWindowId(req);

src/http/discordApi.js

@@ -8,11 +8,15 @@ export function discordAuthUrl(params) {
     });
 }
 
+/**
+ * 请求 discord Api 获取邀请服务器信息
+ * @param {} params 
+ * @returns 
+ */
 export function getInviteGuildInfo(params) {
     return service({
-        url: `/openapi/discord/getInviteGuildInfo`,
-        method: "post",
-        data: params,
+        url: `https://discord.com/api/invites/${params.inviteCode}`,
+        method: "get",
     });
 }
 
@@ -23,3 +27,11 @@ export function checkGuildJoined(params) {
         data: params,
     });
 }
+
+export function saveInviteGuildInfo(params) {
+    return service({
+        url: `/openapi/discord/saveInviteGuildInfo`,
+        method: "post",
+        data: params,
+    });
+}

src/logic/background/twitter.js

@@ -69,12 +69,15 @@ export function saveDiscordAuthWindowId (params) {
     discordAuthWindowId = windowId;
 }
 
-export function discordLoginCode({code}) {
-    if(discordAuthWindowId) {
+export function discordLoginCode({code}, sender) {
+    console.log('sender', sender)
+    let {windowId, id} = sender.tab || {};
+    // chrome.tabs.remove(sender.tab.id)
+    if(windowId) {
         chrome.windows.remove(
-            discordAuthWindowId,
+            windowId,
             function () {
-                 // 发送请求
+                // 发送请求
                 getDiscordUserInfo({
                     authCode: code,
                     redirectUrl: discordAuthRedirectUri
@@ -82,7 +85,7 @@ export function discordLoginCode({code}) {
                     if (res.code == 0) {
                         setTimeout(() => {
                             sendActivetabMessage({
-                                actionType: 'BACK_DISCORD_LOGIN_SUCCESS'
+                                actionType: 'BACK_DISCORD_LOGIN_SUCCESS'    
                             });
                         })
                     }

src/view/iframe/publish/give-dialog.vue

@@ -262,12 +262,9 @@
                                 <div class="submit-btn"
                                     :class="{ 'disabled-submit': iptErrMsgTxt != '' && !depositGuide }"
                                     @click="confirm">
-                                    <img
-                                        class="icon-loading"
+                                    <img  class="icon-loading"
                                         v-if="submitIng"
-                                        :src="
-                                            require('@/assets/svg/icon-btn-loading.svg')
-                                        "
+                                        :src="require('@/assets/svg/icon-btn-loading.svg')"
                                     />
                                     {{iptErrMsgTxt ? iptErrMsgTxt : 'NEXT'}}
                                 </div>
@@ -318,7 +315,7 @@
 <script setup>
 import { ref, watch, reactive, defineProps, defineEmits, onMounted, nextTick } from "vue";
 import { postPublish, verifyPaypalResult, syncChainTokenRechargeRecord, getCurrencyInfoByCode } from "@/http/publishApi";
-import { getInviteGuildInfo } from "@/http/discordApi";
+import { getInviteGuildInfo, saveInviteGuildInfo } from "@/http/discordApi";
 import { payCalcFee, getPayConfig } from "@/http/pay";
 import { getFrontConfig } from "@/http/account";
 import {setChromeStorage, getChromeStorage} from "@/uilts/chromeExtension"
@@ -448,6 +445,7 @@ let currentCurrencyInfo = ref({
 
 const discordIptErrTxt = 'Discord invite link is wrong';
 const discordIptEmptyErrTxt = 'Enter discord invite link';
+const discordIptNerverExpiresErrTxt = 'Make sure the Discord link never expires'
 let iptErrType = ''; //discord
 
 let formList = reactive([
@@ -577,6 +575,19 @@ const getPayAmount = async (amountValue) => {
     return res.data;
 };
 
+const saveDiscordGuildInfo = () => {
+    let {guildId, inviteCode, inviteUrl} = discordInviteInfo.value;
+    if(guildId && inviteCode && inviteUrl) {
+        saveInviteGuildInfo({
+            params: {
+                guildId,
+                inviteCode,
+                inviteUrl
+            }
+        })
+    }
+}
+
 
 const confirm = () => {
     if(depositGuide.value) { //余额不够去充值
@@ -590,6 +601,7 @@ const confirm = () => {
     if (!totalCount) {
         return;
     }
+    saveDiscordGuildInfo();
     submitRequest();
 };
 
@@ -839,6 +851,8 @@ const initParams = () => {
 
     // clear discord value
     formList[3].text = '';
+
+    discordInviteInfo.value = {};
 };
 
 /**
@@ -1074,15 +1088,23 @@ const setDiscordErrTxt = (params = {showPop: false}) => {
             let validata = checkInviteUrl(discordData.text);
             if(validata) {
                 getDiscordInviteInfo(discordData.text, (res) => {
-                    if(res.code != 0) {
+                    console.log('discordData',res)
+                    // 未知的邀请链接
+                    if(res.inviteCode != res.data.code || !res.data.guildId) {
                         iptErrMsgTxt.value = discordIptErrTxt;
                         iptErrType = 'discord';
                     } else {
-                        if(iptErrMsgTxt.value) {
-                            iptErrMsgTxt.value = '';
+                        if(res.data.expires == null) {
+                            // 不是永久邀请链接
+                            iptErrMsgTxt.value = discordIptNerverExpiresErrTxt;
                             iptErrType = '';
+                        } else {
+                            if(iptErrMsgTxt.value) {
+                                iptErrMsgTxt.value = '';
+                                iptErrType = '';
+                            }
                         }
-                        if(params.showPop) {
+                        if(params.showPop && res.data) {
                             showDiscordInvitePop.value = true;
                             setTimeout(() => {
                                 showDiscordInvitePop.value = false;
@@ -1149,15 +1171,37 @@ const checkInviteUrl = (inviteUrl) => {
 /**获取discord 邀请信息 */
 const getDiscordInviteInfo = (inviteUrl, cb) => {
     if(!inviteUrl) return;
+    let inviteCode = '';
+    let arr = inviteUrl.split('/');
+    if(arr.length > 0) {
+        inviteCode = arr[arr.length - 1];
+    }
+    if(discordInviteInfo.value.guildId && discordInviteInfo.value.inviteCode == inviteCode) {
+        return;
+    }
     getInviteGuildInfo({
-        params: {
-            inviteUrl
-        }
+        inviteCode
     }).then(res => {
-        cb && cb(res)
-        if(res.code == 0) {
-            discordInviteInfo.value = res.data;
+        if(!res) {
+            res = {};
+        }
+        let {name, icon, id} = res.guild || {};
+
+        icon = icon && id ? `https://cdn.discordapp.com/icons/${id}/${icon}.png` : '';
+        let resData = {
+            inviteCode,
+            data: {
+                code: res.code,
+                guildId: id,
+                inviteUrl,
+                inviteCode,
+                expires: res.expires_at,
+                name,
+                icon,
+            }
         }
+        discordInviteInfo.value = resData.data;
+        cb && cb(resData);
     }).catch((err) => {
         if(iptErrMsgTxt.value && iptErrType == 'discord') {
             iptErrMsgTxt.value = '';

src/view/iframe/red-packet/red-packet.vue

@@ -72,11 +72,17 @@
               <div class="item-title">Join Discord</div>
             </div>
             <img :src="require('@/assets/gif/red-right.gif')" alt class="red-right"
-              v-show="!state.done.join_discord && state.done.join_discord_red" />
-            <img v-if="state.done.join_discord" :src="require('@/assets/svg/icon-true.svg')" alt />
-            <div v-else class="btn" @click="joinDiscord">
-              Join
-            </div>
+              v-show="!data.done.join_discord && data.done.join_discord_red" />
+            <img v-if="data.done.join_discord" :src="require('@/assets/svg/icon-true.svg')" alt />
+            <template v-else>
+              <div v-if="joinDiscordIng" class="loading-wrapper">
+                <img class="icon-loading"
+                  :src="require('@/assets/svg/icon-loading-gray.svg')"/>
+              </div>
+              <div v-else class="btn" @click="joinDiscord">
+                Join
+              </div>
+            </template>
           </template>
         </div>
       </div>
@@ -288,7 +294,7 @@ export default {
 }
 </script>
 <script setup>
-import { onMounted, reactive } from "vue";
+import { onMounted, reactive, ref } from "vue";
 import { getPostDetail, getRedPacket, finishRedPacket, oneKeyLike, oneKeyReTweet, oneKeyFollow, getTaskDetail, getReceivedList } from '@/http/redPacket.js'
 import { getQueryString, guid } from '@/uilts/help.js'
 import { message } from 'ant-design-vue';
@@ -304,6 +310,7 @@ var moment = require('moment');
 
 let discordAuthorizeRequired = false;
 let joinDiscordActionState = 'default'; //authAndJoinIng  joinIng  reAuth
+let joinDiscordIng = ref(false);
 
 let state = reactive({
   status: '',
@@ -732,6 +739,7 @@ function initTaskDetail() {
             state.done.retweet = res.data[i].finished
             break
           case 7:
+            data.done.join_discord = res.data[i].finished
             discordAuthorizeRequired = res.data[i].discordAuthorizeRequired
             break
         }
@@ -1093,13 +1101,11 @@ function checkJoinDiscord() {
   if (joinDiscordActionState == 'joinIng') {
     joinDiscordActionState = 'default';
     let url = getInviteUrl();
-    if (url) {
-      checkGuildJoined({
-        params: {
-          inviteUrl: url
-        }
-      }).then(res => {
-        if (res.code == 0) {
+    if(url) {
+      joinDiscordIng.value = true;
+      checkGuildJoinedStatus({url}, (res = {}) => {
+        joinDiscordIng.value = false;
+        if(res.code == 0) {
           let { joined } = res.data || {};
           if (joined) {
             state.done.join_discord = true;
@@ -1112,15 +1118,56 @@ function checkJoinDiscord() {
   }
 }
 
+
+const checkGuildJoinedStatus = ({url}, cb) => {
+  checkGuildJoined({
+        params: {
+          inviteUrl: url
+        }
+  }).then(res => {
+    cb && cb(res);
+  }).catch(err => {
+    cb && cb({catch:true})
+  })
+}
+
 /**
  * 加入discord 事件
  */
-function joinDiscord() {
-  //判断是否需要授权
-  if (discordAuthorizeRequired) {
-    discordAuth('authAndJoinIng');
-  } else {
-    openInviteUrl();
+async function joinDiscord() {
+  let _userInfo = await checkIsLogin();
+  if (!_userInfo) {
+    return
+  }
+  if(joinDiscordIng.value) {
+    return;
+  } 
+  joinDiscordIng.value = true;
+  let url = getInviteUrl(); 
+  if(url) {
+    checkGuildJoinedStatus({url}, (res) => {
+      setTimeout(() => {
+        joinDiscordIng.value = false;
+      }, 1500);
+      if(res.code == 0) {
+          let { joined } = res.data || {};
+          if(joined) {
+            data.done.join_discord = true;
+          } else {
+            openInviteUrl();
+          }
+      } else if(res.code == 1010){
+        discordAuth('authAndJoinIng');
+      }
+      if(res.catch) {
+        //判断是否需要授权
+        if(discordAuthorizeRequired) {
+          discordAuth('authAndJoinIng');
+        } else {
+          openInviteUrl();
+        }
+      }
+    })
   }
 }
 
@@ -1128,35 +1175,31 @@ function joinDiscord() {
  * discord授权
  */
 function discordAuth(actionState = 'default') {
-  let state = guid();
-  discordAuthUrl({
-    params: {
-      redirectUrl: discordAuthRedirectUri,
-      state
-    }
-  }).then(res => {
-    if (res.code == 0) {
-      let { authorizeUrl = '' } = res.data || {};
-      if (authorizeUrl) {
-        joinDiscordActionState = actionState;
-        const width = 500, height = 800;
-        chrome.windows.create({
-          width,
-          height,
-          left: 0,
-          top: 0,
-          type: 'popup',
-          url: authorizeUrl
-        }, function (window) {
-          let windowId = window.id;
-          callEventPageMethod("RED_PACKET_SAVE_DISCORD_AUTH_WINDOW_ID", {
-            windowId: windowId
-          }, function (response) {
-          });
-        })
-      }
-    }
-  })
+    let state = guid();
+    discordAuthUrl({
+        params : {
+            redirectUrl: discordAuthRedirectUri,
+            state
+        }
+    }).then(res => {
+        if(res.code == 0) {
+            let {authorizeUrl = ''} = res.data || {};
+            if(authorizeUrl) {
+              joinDiscordActionState = actionState; 
+              const width = 500;
+              chrome.windows.create({
+                width, 
+                type:'normal', 
+                url: authorizeUrl}, function(window) {
+                  let windowId = window.id;
+                  callEventPageMethod("RED_PACKET_SAVE_DISCORD_AUTH_WINDOW_ID", {
+                    windowId: windowId
+                  }, function (response) {
+                  });
+              })
+            }
+        }
+    })
 }
 
 /**
@@ -1732,6 +1775,14 @@ body {
           color: #1D9BF0;
           cursor: pointer;
         }
+
+        .loading-wrapper {
+          width: 90px;
+          text-align:center;
+          .icon-loading {
+            animation:loading 1s infinite linear;
+          }
+        }
       }
     }
 
@@ -1952,6 +2003,14 @@ body {
       z-index: 3;
     }
   }
+  @keyframes loading{
+    from{ 
+      transform: rotate(0deg);
+    } 
+    to{
+      transform: rotate(360deg);
+    }
+  }
 }
 .none {
     display: flex;