Merge branch 'feature-message-8.31' into dev_1.1.7.4

src/assets/subject/004-back-head-top.svg

@@ -0,0 +1,9 @@
+<svg width="375" height="150" viewBox="0 0 375 150" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 0H375V117.057C375 117.057 320.624 150 187.5 150C54.376 150 0 117.057 0 117.057V0Z" fill="url(#paint0_linear_27657_247702)"/>
+<defs>
+<linearGradient id="paint0_linear_27657_247702" x1="187" y1="-2.34963e-09" x2="187.045" y2="150" gradientUnits="userSpaceOnUse">
+<stop offset="0.367196" stop-color="#26180E"/>
+<stop offset="0.953767" stop-color="#51361D"/>
+</linearGradient>
+</defs>
+</svg>

src/denet/chrome/content.js

@@ -0,0 +1,25 @@
+import chromeMessageCenter from '@/uilts/messageCenter/chrome';
+import MESSAGE_ENUM from '@/uilts/messageCenter/chrome/messageEnum'
+
+export default {
+    // ---- 获取推文文案 ---- 
+    test({ tweetId }, overTime) {
+        return new Promise((res, rej) => {
+            chromeMessageCenter.sendToSW({
+                info: {
+                    actionType: MESSAGE_ENUM.CONTENT_TO_BACK_TEST,
+                },
+                data: {
+                    tweetId
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    }
+}

src/denet/chrome/index.js

@@ -0,0 +1,7 @@
+import content from '@/denet/chrome/content'
+import sw from '@/denet/chrome/sw'
+
+export default {
+    content,
+    sw
+}

src/denet/chrome/sw.js

@@ -0,0 +1,25 @@
+import chromeMessageCenter from '@/uilts/messageCenter/chrome';
+import MESSAGE_ENUM from '@/uilts/messageCenter/chrome/messageEnum'
+
+export default {
+    // ---- 获取推文文案 ---- 
+    test({ tweetId }, overTime) {
+        return new Promise((res, rej) => {
+            chromeMessageCenter.sendToContent({
+                info: {
+                    actionType: MESSAGE_ENUM.BACK_TO_CONTENT_TEST,
+                },
+                data: {
+                    tweetId
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    }
+}

src/denet/content/doTask.js

@@ -0,0 +1,93 @@
+import MESSAGE_ENUM from '@/uilts/messageCenter/iframe/messageEnum'
+import messageCenter from '@/uilts/messageCenter/iframe'
+import { getQueryString } from '@/uilts/help'
+const iframeId = getQueryString('iframeId')
+
+// 做任务
+const doTask = {
+    createTweet({ tweetId }, overTime) {
+        return new Promise((res, rej) => {
+            messageCenter.send({
+                info: {
+                    actionType: MESSAGE_ENUM.IFRAME_DO_TASK_CREATE_TWEET,
+                    iframeId //用于告诉父窗口会传消息给哪个iframe
+                },
+                data: {
+                    tweetId
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    },
+    like({ tweetId }, overTime) {
+        return new Promise((res, rej) => {
+            messageCenter.send({
+                info: {
+                    actionType: MESSAGE_ENUM.IFRAME_DO_TASK_LIKE,
+                    iframeId //用于告诉父窗口会传消息给哪个iframe
+                },
+                data: {
+                    tweetId,
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    },
+    follows({ follows }, overTime) {
+        return new Promise((res, rej) => {
+            messageCenter.send({
+                info: {
+                    actionType: MESSAGE_ENUM.IFRAME_DO_TASK_FOLLOWS,
+                    iframeId //用于告诉父窗口会传消息给哪个iframe
+                },
+                data: {
+                    follows
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    },
+    reTweet({ tweetId }, overTime) {
+        return new Promise((res, rej) => {
+            messageCenter.send({
+                info: {
+                    actionType: MESSAGE_ENUM.IFRAME_DO_TASK_RETWEET,
+                    iframeId //用于告诉父窗口会传消息给哪个iframe
+                },
+                data: {
+                    tweetId
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    }
+}
+
+export default doTask
+
+// iframe > dom id 
+// iframe > createTweet  dom id 

src/denet/content/dom.js

@@ -0,0 +1,30 @@
+import MESSAGE_ENUM from '@/uilts/messageCenter/iframe/messageEnum'
+import messageCenter from '@/uilts/messageCenter/iframe'
+import { getQueryString } from '@/uilts/help'
+const iframeId = getQueryString('iframeId')
+
+const dom = {
+    // ---- 获取推文文案 ---- 
+    getTweetText({ tweetId }, overTime) {
+        return new Promise((res, rej) => {
+            messageCenter.send({
+                info: {
+                    actionType: MESSAGE_ENUM.IFRAME_DOM_GET_TWEET_TEXT,
+                    iframeId //用于告诉父窗口会传消息给哪个iframe
+                },
+                data: {
+                    tweetId
+                },
+                overTime,
+                callback: (data) => {
+                    res(data);
+                },
+                failback: (e) => {
+                    rej(e)
+                }
+            })
+        })
+    }
+}
+
+export default dom

src/denet/content/index.js

@@ -0,0 +1,7 @@
+import doTask from '@/denet/content/doTask'
+import dom from '@/denet/content/dom'
+
+export default {
+    doTask,
+    dom
+}

src/denet/index.js

@@ -0,0 +1,9 @@
+import content from '@/denet/content'
+import chrome from '@/denet/chrome'
+
+const denet = {
+    content,
+    chrome
+}
+
+export default denet

src/entry/background.js

@@ -35,6 +35,7 @@ import {
 import {
     closeAchPayNoticeHandler
 } from "@/logic/background/denet";
+import chromeMessageCenter from '@/uilts/messageCenter/chrome';
 
 try {
     chrome.runtime.onMessage.addListener(onMessageMethod);
@@ -223,82 +224,15 @@ function onInstalledMethod({ id, previousVersion, reason }) {
 
 function onMessageMethod(req, sender, sendResponse) {
     try {
-        if (req) {
-            switch (req.actionType) {
-                case "POPUP_LOGIN":
-                    twitterPinLoginToken();
-                    sendResponse('ok');
-                    break;
-                case "POPUP_PUBLISH_TWITTER_RED_PACK":
-                    popupRePublish(req);
-                    sendResponse('ok');
-                    break;
-                case "POPUP_SHOW_DENET_PUBLISH_DIALOG":
-                    checkShowPublishDialog();
-                    break;
-                case 'CONTENT_GET_PINED':
-                    checkPined();
-                    break;
-                case 'CONTENT_SET_BADGE':
-                    setBadgeInfo(req);
-                    break;
-                case 'CONTENT_HIDE_BADGE':
-                    hideBadge();
-                    break
-                case 'CONTENT_SEND_CODE':
-                    twitterPinLoginCode(sender, req.code);
-                    break;
-                case 'CONTENT_TWITTER_LOGIN':
-                    if (req.data) {
-                        twitterPinLoginToken();
-                        sendResponse('ok');
-                    }
-                    break
-                case "CONTENT_SEND_DISCORD_AUTH_CODE":
-                    discordLoginCode(req, sender);
-                    break
-                case 'RED_PACKET_SAVE_DISCORD_AUTH_WINDOW_ID':
-                    saveDiscordAuthWindowId(req);
-                    sendResponse('ok');
-                    break;
-                case 'CONTENT_FACEBOOK_SHARE_SUCCESS':
-                    facebookShareSuccess(req, sender);
-                    break;
-                case 'CONTENT_PONG':
-                    sendResponse('CONTENT_PONG');
-                    break
-                case 'CONTENT_WINDOW_LOADED_SET_POPUP_PAGE':
-                    // windwoLoadSetPopupPage(req, sender);
-                    break;
-                case 'CONTENT_SET_POPUP_CONFIG':
-                    setActionPopup(req, sender);
-                    break;
-                case 'CONTENT_GET_TWITTER_NFT_POST_PRE':
-                    getTwitterNftPostPre(req.data, sender)
-                    break
-                case 'CONTENT_NFT_TXT_PUBLISH':
-                    nftTxtPublish(req.data, sender)
-                    break
-                case 'CONTENT_HTTP_NET_WORK':
-                    httpNetWork(req.funcName, req.data, sender)
-                    break
-                case 'HTTP_CONTENT_TO_BACK':
-                    httpContentToBack(req, sender)
-                    sendResponse('ok')
-                    break
-                case 'CONTENT_TWITTER_SHORT_LINK':
-                    sendResponse('ok')
-                    req.arr_url.forEach(item => {
-                        if (item) {
-                            twitterShortUrl(sender, item)
-                        }
-                    });
-                    break
-                case 'CONTENT_CLOSE_ACH_PAY_NOTICE':
-                    closeAchPayNoticeHandler();
-                    break;
-            }
+        if (!req) {
+            return
+        }
+        if (req.info) {
+            newOnMessageMethod(req, sender, sendResponse)
+        } else if (req.actionType) {
+            oldOnMessageMethod(req, sender, sendResponse)
         }
+        chromeMessageCenter.init(req)
     } catch (error) {
         Report.reportLog({
             objectType: Report.objectType.background_function_catch,
@@ -308,4 +242,93 @@ function onMessageMethod(req, sender, sendResponse) {
     }
 }
 //加载bg.js 执行
-setMessageCount();
+setMessageCount();
+
+const newOnMessageMethod = (req, sender, sendResponse) => {
+    let { info = {}, data = {} } = req
+    switch (info.actionType) {
+        case 'CONTENT_TO_BACK_TEST':
+            chromeMessageCenter.sendToContent(sender, { info, data: '123' })
+            break;
+
+        default:
+            break;
+    }
+}
+
+const oldOnMessageMethod = (req, sender, sendResponse) => {
+    switch (req.actionType) {
+        case "POPUP_LOGIN":
+            twitterPinLoginToken();
+            sendResponse('ok');
+            break;
+        case "POPUP_PUBLISH_TWITTER_RED_PACK":
+            popupRePublish(req);
+            sendResponse('ok');
+            break;
+        case "POPUP_SHOW_DENET_PUBLISH_DIALOG":
+            checkShowPublishDialog();
+            break;
+        case 'CONTENT_GET_PINED':
+            checkPined();
+            break;
+        case 'CONTENT_SET_BADGE':
+            setBadgeInfo(req);
+            break;
+        case 'CONTENT_HIDE_BADGE':
+            hideBadge();
+            break
+        case 'CONTENT_SEND_CODE':
+            twitterPinLoginCode(sender, req.code);
+            break;
+        case 'CONTENT_TWITTER_LOGIN':
+            if (req.data) {
+                twitterPinLoginToken();
+                sendResponse('ok');
+            }
+            break
+        case "CONTENT_SEND_DISCORD_AUTH_CODE":
+            discordLoginCode(req, sender);
+            break
+        case 'RED_PACKET_SAVE_DISCORD_AUTH_WINDOW_ID':
+            saveDiscordAuthWindowId(req);
+            sendResponse('ok');
+            break;
+        case 'CONTENT_FACEBOOK_SHARE_SUCCESS':
+            facebookShareSuccess(req, sender);
+            break;
+        case 'CONTENT_PONG':
+            sendResponse('CONTENT_PONG');
+            break
+        case 'CONTENT_WINDOW_LOADED_SET_POPUP_PAGE':
+            // windwoLoadSetPopupPage(req, sender);
+            break;
+        case 'CONTENT_SET_POPUP_CONFIG':
+            setActionPopup(req, sender);
+            break;
+        case 'CONTENT_GET_TWITTER_NFT_POST_PRE':
+            getTwitterNftPostPre(req.data, sender)
+            break
+        case 'CONTENT_NFT_TXT_PUBLISH':
+            nftTxtPublish(req.data, sender)
+            break
+        case 'CONTENT_HTTP_NET_WORK':
+            httpNetWork(req.funcName, req.data, sender)
+            break
+        case 'HTTP_CONTENT_TO_BACK':
+            httpContentToBack(req, sender)
+            sendResponse('ok')
+            break
+        case 'CONTENT_TWITTER_SHORT_LINK':
+            sendResponse('ok')
+            req.arr_url.forEach(item => {
+                if (item) {
+                    twitterShortUrl(sender, item)
+                }
+            });
+            break
+        case 'CONTENT_CLOSE_ACH_PAY_NOTICE':
+            closeAchPayNoticeHandler();
+            break;
+    }
+}

src/entry/content.js

@@ -43,7 +43,7 @@ import {
     getExtensionStorgeDataForIframe,
     doTaskIframeTwitterAPI
 } from "@/logic/content/twitter.js";
-
+import denet from '@/denet'
 import { httpBackToContentCallBack } from '@/uilts/chromeExtension.js'
 import {
     hideNFTGroupList,
@@ -60,6 +60,10 @@ import {
     injectDenet
 } from "@/logic/content/denet.js";
 
+import doTask from '@/logic/content/help/doTask'
+import chromeMessageCenter from '@/uilts/messageCenter/chrome';
+import { re } from "mathjs";
+
 chrome.storage.onChanged.addListener(changes => {
     initExecuteScript(changes)
 })
@@ -73,9 +77,15 @@ window.onload = () => {
         data: {}
     });
 };
+
+
 window.onmessage = (res) => {
-    if (res.data && res.data.actionType) {
-        switch (res.data.actionType) {
+    if (!res.data) {
+        return
+    }
+    let { info = {}, data = {} } = res.data
+    if ((res.data.actionType) || (info && info.actionType)) {
+        switch (info.actionType || res.data.actionType) {
             case "IFRAME_SHOW_IFREME":
                 showIframeHandler();
                 break;
@@ -122,9 +132,13 @@ window.onmessage = (res) => {
                 getExtensionStorgeDataForIframe(res.data.data);
                 break;
             case 'IFRAME_DO_TASK_CREATE_TWEET':
-                // 做任务
-                // 接受数据，sendmessage
-                console.log('IFRAME_DO_TASK_CREATE_TWEET', res)
+                doTask.TwitterApiCreateTweet({ info, data })
+                break
+            case 'IFRAME_DO_TASK_LIKE':
+                doTask.TwitterLikeAPI({ info, data })
+                break
+            case 'IFRAME_DO_TASK_RETWEET':
+                doTask.TwitterRetweetAPI({ info, data })
                 break
             case 'IFRAME_API_GET_TWEET_USER_FOLLOW_STATUS':
                 getTweetUserFollowStatus(res.data);
@@ -148,8 +162,7 @@ window.onmessage = (res) => {
     }
 };
 
-
-chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
+const oldOnMessageMethod = (req, sender, sendResponse) => {
     switch (req.actionType) {
         case 'BG_SHOW_PIN_TIPS':
             showPinTips()
@@ -258,6 +271,31 @@ chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
         case 'GET_CONTENT_BY_TWITTER_ID':
             sendContentByTwitterID(req.data.tweet_Id)
             break
+        case 'TEST':
+            console.log('TEST')
+            break
+    }
+}
+
+const newOnMessageMethod = (req, sender, sendResponse) => {
+
+}
+chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
+    if (req.actionType) {
+        oldOnMessageMethod(req, sender, sendResponse)
+    } else if (req.info) {
+        newOnMessageMethod(req, sender, sendResponse)
+        chromeMessageCenter.init(req)
     }
     sendResponse && sendResponse('ok');
+
 })
+
+// --- test ---
+// async function funcTest() {
+//     let res = await denet.chrome.content.test({ tweetId: 22 })
+//     console.log('test sendmessage', res)
+// }
+// setTimeout(() => {
+//     funcTest()
+// }, 3000);

src/logic/content/ParseCard.js

@@ -1,5 +1,3 @@
-import { iframeHost } from '@/http/configAPI'
-import { getChromeStorage, setChromeStorage } from '@/uilts/chromeExtension.js'
 import ToolBox from '@/view/content/tool-box/index.vue'
 import { createApp } from 'vue'
 import { getStorage, setStorage, guid } from '@/uilts/help'
@@ -344,11 +342,11 @@ class ParseCard {
         return _iframe
     }
     createTreasureIframe(params = { page_type, tweet_Id, post_Id, invite_code, invite_channel }) {
+        let _iframeId = `denet-${guid()}`
         let _iframe = document.createElement('iframe')
-        console.log('post_Id',params.post_Id)
-        let rid = guid();
-        _iframe.id = rid;
-        _iframe.src = chromeExtensionUrl + ('iframe/treasure-hunt.html') + `?params=${JSON.stringify(params)}&iframeId=${rid}`;
+        _iframe.id = _iframeId
+        _iframe.dataset.card = 'denet'
+        _iframe.src = chromeExtensionUrl + ('iframe/treasure-hunt.html') + `?params=${JSON.stringify(params)}&iframeId=${_iframeId}`;
         _iframe.style.cssText = 'border:medium none; width:375px; min-height:580px; border: 1px solid #DCDCDC; border-radius: 20px;'
         return _iframe
     }

src/logic/content/help/doTask.js

@@ -0,0 +1,151 @@
+import messageCenter from '@/uilts/messageCenter/content';
+import { getCookie } from '@/uilts/help'
+
+
+const TwitterApiCreateTweet = ({ info, data }) => {
+    let params = {
+        queryId: "hC1nuE-2d1NX5LYBuuAvtQ",
+        features: {
+            "dont_mention_me_view_api_enabled": true,
+            "interactive_text_enabled": true,
+            "responsive_web_uc_gql_enabled": false,
+            "vibe_api_enabled": true,
+            "responsive_web_edit_tweet_api_enabled": false,
+            "standardized_nudges_misinfo": true,
+            "responsive_web_enhance_cards_enabled": false
+        },
+        variables: {
+            "tweet_text": data.txt,
+            "media": {
+                "media_entities": [],
+                "possibly_sensitive": false
+            },
+            "withDownvotePerspective": true,
+            "withReactionsMetadata": false,
+            "withReactionsPerspective": false,
+            "withSuperFollowsTweetFields": true,
+            "withSuperFollowsUserFields": true,
+            "semantic_annotation_ids": [],
+            "dark_request": false
+        }
+    };
+    axios.post(`https://twitter.com/i/api/graphql/hC1nuE-2d1NX5LYBuuAvtQ/CreateTweet`,
+        params, {
+        headers: {
+            "accept": "*/*",
+            "accept-language": "zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7",
+            "authorization": "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA",
+            "content-type": "application/json",
+            "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"101\", \"Google Chrome\";v=\"101\"",
+            "sec-ch-ua-mobile": "?0",
+            "sec-ch-ua-platform": "\"Windows\"",
+            "sec-fetch-dest": "empty",
+            "sec-fetch-mode": "cors",
+            "sec-fetch-site": "same-origin",
+            "x-csrf-token": getCookie('ct0'),
+            "x-twitter-active-user": "yes",
+            "x-twitter-auth-type": "OAuth2Session",
+            "x-twitter-client-language": "en"
+        },
+    }).then(function (response) {
+        messageCenter.send({ info, data: response })
+    }).catch(function (err) {
+        messageCenter.send({ info, data: err })
+    });
+}
+
+const TwitterLikeAPI = ({ info, data }) => {
+    fetch("https://twitter.com/i/api/graphql/lI07N6Otwv1PhnEgXILM7A/FavoriteTweet", {
+        "headers": {
+            "accept": "*/*",
+            "accept-language": "zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7",
+            "authorization": "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA",
+            "content-type": "application/json",
+            "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"101\", \"Google Chrome\";v=\"101\"",
+            "sec-ch-ua-mobile": "?0",
+            "sec-ch-ua-platform": "\"Windows\"",
+            "sec-fetch-dest": "empty",
+            "sec-fetch-mode": "cors",
+            "sec-fetch-site": "same-origin",
+            "x-csrf-token": getCookie('ct0'),
+            "x-twitter-active-user": "yes",
+            "x-twitter-auth-type": "OAuth2Session",
+            "x-twitter-client-language": "en"
+        },
+        "referrer": "https://twitter.com/home",
+        "referrerPolicy": "strict-origin-when-cross-origin",
+        "body": "{\"variables\":{\"tweet_id\":\"" + data.tweetId + "\"},\"queryId\":\"lI07N6Otwv1PhnEgXILM7A\"}",
+        "method": "POST",
+        "mode": "cors",
+        "credentials": "include"
+    }).then(() => {
+        // 返回信息
+        messageCenter.send({ info, data: { task_done: true } })
+    }).catch(() => {
+        messageCenter.send({ info, data: { task_done: false } })
+    })
+}
+
+// const TwitterFollowAPI = ({ info, data }) => {
+//     // 
+//     fetch("https://twitter.com/i/api/1.1/friendships/create.json", {
+//         "headers": {
+//             "authorization": "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA",
+//             "content-type": "application/x-www-form-urlencoded",
+//             "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"102\", \"Google Chrome\";v=\"102\"",
+//             "sec-ch-ua-mobile": "?0",
+//             "sec-ch-ua-platform": "\"macOS\"",
+//             "x-csrf-token": getCookie('ct0'),
+//             "x-twitter-active-user": "yes",
+//             "x-twitter-auth-type": "OAuth2Session",
+//             "x-twitter-client-language": "zh-cn"
+//         },
+//         "referrer": "https://twitter.com/home",
+//         "referrerPolicy": "strict-origin-when-cross-origin",
+//         "body": "include_profile_interstitial_type=1&include_blocking=1&include_blocked_by=1&include_followed_by=1&include_want_retweets=1&include_mute_edge=1&include_can_dm=1&include_can_media_tag=1&include_ext_has_nft_avatar=1&skip_status=1&user_id=" + data.follow_name + "",
+//         "method": "POST",
+//         "mode": "cors",
+//         "credentials": "include"
+//     }).then(() => {
+//         messageCenter.send({ info, data: { task_done: true, follow_name: data.follow_name } })
+//     }).catch(() => {
+//         messageCenter.send({ info, data: { task_done: false, follow_name: data.follow_name } })
+//     })
+// }
+
+const TwitterRetweetAPI = ({ info, data }) => {
+    fetch("https://twitter.com/i/api/graphql/ojPdsZsimiJrUGLR1sjUtA/CreateRetweet", {
+        "headers": {
+            "accept": "*/*",
+            "accept-language": "zh,en;q=0.9,zh-CN;q=0.8",
+            "authorization": "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA",
+            "content-type": "application/json",
+            "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"102\", \"Google Chrome\";v=\"102\"",
+            "sec-ch-ua-mobile": "?0",
+            "sec-ch-ua-platform": "\"macOS\"",
+            "sec-fetch-dest": "empty",
+            "sec-fetch-mode": "cors",
+            "sec-fetch-site": "same-origin",
+            "x-csrf-token": getCookie('ct0'),
+            "x-twitter-active-user": "yes",
+            "x-twitter-auth-type": "OAuth2Session",
+            "x-twitter-client-language": "zh-cn"
+        },
+        "referrer": "https://twitter.com/home",
+        "referrerPolicy": "strict-origin-when-cross-origin",
+        "body": "{\"variables\":{\"tweet_id\":\"" + data.tweetId + "\",\"dark_request\":false},\"queryId\":\"ojPdsZsimiJrUGLR1sjUtA\"}",
+        "method": "POST",
+        "mode": "cors",
+        "credentials": "include"
+    }).then(() => {
+        messageCenter.send({ info, data: { task_done: true } })
+    }).catch(() => {
+        messageCenter.send({ info, data: { task_done: false } })
+    })
+}
+
+export default {
+    TwitterApiCreateTweet,
+    TwitterLikeAPI,
+    TwitterRetweetAPI
+}

src/logic/content/help/twitter.js

@@ -3,45 +3,45 @@ import { getChromeStorage, setChromeStorage } from '@/uilts/chromeExtension.js'
 
 // 根据提示dom 跳转到推文详情页面
 export const jumpTwitterDetailByAlert = () => {
-    let num = 10
-    let timer = setInterval(() => {
-        if (num <= 0) {
-            clearInterval(timer)
-            return
-        }
-        let alert = document.querySelector('div[role=alert]')
-        if (alert) {
-            let a = alert.querySelector('a')
-            if (a) {
-                clearInterval(timer)
-                a.click()
-            }
-        }
-        num--
-    }, 500)
+  let num = 10
+  let timer = setInterval(() => {
+    if (num <= 0) {
+      clearInterval(timer)
+      return
+    }
+    let alert = document.querySelector('div[role=alert]')
+    if (alert) {
+      let a = alert.querySelector('a')
+      if (a) {
+        clearInterval(timer)
+        a.click()
+      }
+    }
+    num--
+  }, 500)
 }
 
 export const showEditTweet = (callback) => {
-    let bigBtn = document.querySelector('a[data-testid="SideNav_NewTweet_Button"]');
-    if (bigBtn) {
-        bigBtn.click();
-    } else {
-        let smallBtn = document.querySelector('a[href="/compose/tweet"]')
-        smallBtn && smallBtn.click();
+  let bigBtn = document.querySelector('a[data-testid="SideNav_NewTweet_Button"]');
+  if (bigBtn) {
+    bigBtn.click();
+  } else {
+    let smallBtn = document.querySelector('a[href="/compose/tweet"]')
+    smallBtn && smallBtn.click();
+  }
+  let num = 10
+  let timer = setInterval(() => {
+    if (num <= 0) {
+      clearInterval(timer)
+      return
+    }
+    let inputEle = document.querySelector('div[contenteditable="true"]');
+    if (inputEle) {
+      clearInterval(timer)
+      callback && callback()
     }
-    let num = 10
-    let timer = setInterval(() => {
-        if(num <= 0){
-            clearInterval(timer)
-            return
-        }
-        let inputEle = document.querySelector('div[contenteditable="true"]');
-        if(inputEle){
-            clearInterval(timer)
-            callback && callback()
-        }
-        num--
-    }, 500);
+    num--
+  }, 500);
 }
 
 export const setDeviceInfo = async () => {
@@ -60,9 +60,9 @@ export const setDeviceInfo = async () => {
   }
 
   let storageDeviceInfo = getStorage(deviceStorageParams.name);
-  if(!storageDeviceInfo) {
+  if (!storageDeviceInfo) {
     let res = await getVisitorId();
-    let id =  res && res.visitorId || '';
+    let id = res && res.visitorId || '';
     setStorage(deviceStorageParams.name, id);
     deviceInfo.deviceId1 = id;
   } else {
@@ -70,7 +70,7 @@ export const setDeviceInfo = async () => {
   }
 
   let cookieDeviceInfo = getCookie(deviceCookieParams.name);
-  if(!cookieDeviceInfo) {
+  if (!cookieDeviceInfo) {
     let rid = guid();
     setCookie(deviceCookieParams.name, rid, 600);
     deviceInfo.deviceId2 = rid;
@@ -78,5 +78,5 @@ export const setDeviceInfo = async () => {
     deviceInfo.deviceId2 = cookieDeviceInfo;
   }
 
-  setChromeStorage({'deviceInfo': JSON.stringify(deviceInfo)});
-}
+  setChromeStorage({ 'deviceInfo': JSON.stringify(deviceInfo) });
+}

src/logic/content/twitter.js

@@ -10,7 +10,7 @@ import { jumpTwitterDetailByAlert, showEditTweet } from '@/logic/content/help/tw
 import { clearPostContent, setGroupIconStatus } from '@/logic/content/nft.js'
 import { toolBox } from '@/logic/content/ToolBox'
 import axios from 'axios';
-import messageCenter from '@/uilts/messageCenter';
+import messageCenter from '@/uilts/messageCenter/content';
 import { PlayType } from '@/types';
 import { reSetBindPostContent } from '@/http/help.js';
 import { setDeviceInfo } from '@/logic/content/help/twitter';
@@ -882,10 +882,10 @@ function setIframeCard(type = 'twitter') {
                             index = Number(i) + 1
                             if (arr[i] == 'invite' && arr.length >= index) {
                                 item.invite_code = arr[index];
-                                if(arr.length > index + 1) {
-                                  item.invite_channel = arr[index+1];
+                                if (arr.length > index + 1) {
+                                    item.invite_channel = arr[index + 1];
                                 } else {
-                                  item.invite_channel = '';
+                                    item.invite_channel = '';
                                 }
                                 break
                             }
@@ -1079,13 +1079,13 @@ export const getTweetUserFollowStatus = (params) => {
     Promise.allSettled(promiseList).then((res) => {
         let list = [];
         if (res && res.length) {
-          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)
-              }
-          }
+            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)
+                }
+            }
         }
         messageCenter.send(params.iframeId, 'CONTENT_GET_TWEET_USER_FOLLOW_STATUS_RES', {
           list, tweetId, type, iframeId: params.iframeId, iframeGUId
@@ -1498,45 +1498,45 @@ export function showJoinDialog(data) {
 }
 
 const TwitterFriendshipsUpdate = (params) => {
-  let {id = '', device = true, name} = params || {};
-  let data = {
-    include_profile_interstitial_type: 1,
-    include_blocking: 1,
-    include_blocked_by: 1,
-    include_followed_by: 1,
-    include_want_retweets: 1,
-    include_mute_edge: 1,
-    include_can_dm: 1,
-    include_can_media_tag: 1,
-    include_ext_has_nft_avatar: 1,
-    skip_status: 1,
-    cursor: -1,
-    id,
-    device
-  }
-  if(!id) {
-    return;
-  }
-  return fetch("https://twitter.com/i/api/1.1/friendships/update.json", {
-      "headers": {
-          "authorization": "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA",
-          "content-type": "application/x-www-form-urlencoded",
-          "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"102\", \"Google Chrome\";v=\"102\"",
-          "sec-ch-ua-mobile": "?0",
-          "sec-ch-ua-platform": "\"macOS\"",
-          "x-csrf-token": getCookie('ct0'),
-          "x-twitter-active-user": "yes",
-          "x-twitter-auth-type": "OAuth2Session",
-          "x-twitter-client-language": "en",
-          "referer": `https://twitter.com/${name}`
-      },
-      "referrer": `https://twitter.com/${name}`,
-      "referrerPolicy": "strict-origin-when-cross-origin",
-      "body": `include_profile_interstitial_type=1&include_blocking=1&include_blocked_by=1&include_followed_by=1&include_want_retweets=1&include_mute_edge=1&include_can_dm=1&include_can_media_tag=1&include_ext_has_nft_avatar=1&skip_status=1&cursor=-1&id=${id}&device=true`,
-      "method": "POST",
-      "mode": "cors",
-      "credentials": "include"
-  })
+    let { id = '', device = true, name } = params || {};
+    let data = {
+        include_profile_interstitial_type: 1,
+        include_blocking: 1,
+        include_blocked_by: 1,
+        include_followed_by: 1,
+        include_want_retweets: 1,
+        include_mute_edge: 1,
+        include_can_dm: 1,
+        include_can_media_tag: 1,
+        include_ext_has_nft_avatar: 1,
+        skip_status: 1,
+        cursor: -1,
+        id,
+        device
+    }
+    if (!id) {
+        return;
+    }
+    return fetch("https://twitter.com/i/api/1.1/friendships/update.json", {
+        "headers": {
+            "authorization": "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA",
+            "content-type": "application/x-www-form-urlencoded",
+            "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"102\", \"Google Chrome\";v=\"102\"",
+            "sec-ch-ua-mobile": "?0",
+            "sec-ch-ua-platform": "\"macOS\"",
+            "x-csrf-token": getCookie('ct0'),
+            "x-twitter-active-user": "yes",
+            "x-twitter-auth-type": "OAuth2Session",
+            "x-twitter-client-language": "en",
+            "referer": `https://twitter.com/${name}`
+        },
+        "referrer": `https://twitter.com/${name}`,
+        "referrerPolicy": "strict-origin-when-cross-origin",
+        "body": `include_profile_interstitial_type=1&include_blocking=1&include_blocked_by=1&include_followed_by=1&include_want_retweets=1&include_mute_edge=1&include_can_dm=1&include_can_media_tag=1&include_ext_has_nft_avatar=1&skip_status=1&cursor=-1&id=${id}&device=true`,
+        "method": "POST",
+        "mode": "cors",
+        "credentials": "include"
+    })
 }
 
 const TwitterFollowAPI = (item, tweet_Id) => {
@@ -1562,7 +1562,7 @@ const TwitterFollowAPI = (item, tweet_Id) => {
         let task_data = {
             follow_name: item.name
         }
-        TwitterFriendshipsUpdate({id: item.twitterUserId, name: item.name})
+        TwitterFriendshipsUpdate({ id: item.twitterUserId, name: item.name })
 
         chrome.runtime.sendMessage({ actionType: "DO_TASK", do_type: 'api', tweet_Id, task_type: 'follow', task_data, task_done: true }, () => { })
     }).catch(() => {
@@ -2403,7 +2403,12 @@ const addPageScrollEvent = () => {
         contentHeight: contentDom.offsetHeight
     }
 
-    messageCenter.send('de-tab-group-content', 'CONTENT_GROUP_LIST_SCROLL', data)
+    messageCenter.send({
+        info: {
+            iframeId: 'de-tab-group-content', actionType: 'CONTENT_GROUP_LIST_SCROLL'
+        },
+        data
+    })
 
     // chrome.runtime.sendMessage({
     //     actionType: "CONTENT_GROUP_LIST_SCROLL",
@@ -2489,7 +2494,11 @@ const setGroupTabSelfStyle = (params = {}) => {
  * 切换到 Group tab时 刷新列表
  */
 export const refreshTabGroup = () => {
-    messageCenter.send('de-tab-group-content', 'CONTENT_REFRESH_TAB_GROUP_LIST', {})
+    messageCenter.send({
+        info: {
+            iframeId: 'de-tab-group-content', actionType: 'CONTENT_REFRESH_TAB_GROUP_LIST'
+        }
+    })
     //     chrome.runtime.sendMessage({
     //         actionType: "CONTENT_REFRESH_TAB_GROUP_LIST",
     //         data: {}
@@ -2570,7 +2579,7 @@ const addTabGroupContent = (cb) => {
     }
     let iframe = document.createElement('iframe');
     iframe.id = 'de-tab-group-content';
-    iframe.src = getInnerIframeURL(`${iframeHost}/tab-group` + `?params=${JSON.stringify(params)}&iframeID=${iframe.id}`);
+    iframe.src = getInnerIframeURL(`${iframeHost}/tab-group` + `?params=${JSON.stringify(params)}&iframeId=${iframe.id}`);
     iframe.style.cssText = `border: medium none; height: 500px;display: none`
 
     let iframeContent = getGroupTabContentNode();
@@ -2672,7 +2681,9 @@ export const getTweetProfileNavTop = (params) => {
     let top = document.querySelector('div[role="tablist"]').closest('nav').getBoundingClientRect().top;
 
     messageCenter.send({
-        actionType: "CONTENT_SEND_GROUP_NAV_TOP",
+        info: {
+            actionType: "CONTENT_SEND_GROUP_NAV_TOP"
+        },
         data: {
             top,
             scrollTop: params.scrollTop
@@ -2718,7 +2729,13 @@ export const setGroupInfo = (params = {}) => {
 
 export const getExtensionStorgeDataForIframe = (data) => {
     getChromeStorage(data.key).then((res) => {
-        messageCenter.send(data.iframeID, `IFRAME_GET_EXTENSION_STORGE_DATA-${data.messageID}`, res)
+        messageCenter.send({
+            info: {
+                iframeId: data.iframeId,
+                actionType: `IFRAME_GET_EXTENSION_STORGE_DATA-${data.messageId}`
+            },
+            data: res
+        })
     });
 }
 
@@ -2745,7 +2762,9 @@ const sysThemeChange = () => {
     setTimeout(() => {
         let bgColor = document.querySelector('body').style.backgroundColor;
         messageCenter.send({
-            actionType: "CONTENT_SYS_THEME_CHANGE",
+            info: {
+                actionType: "CONTENT_SYS_THEME_CHANGE"
+            },
             data: {
                 theme: systemInfo.theme,
                 twitterTheme: bgColor == 'rgb(0, 0, 0)' ? 'dark' : 'light'

src/uilts/denet.js

@@ -1,6 +0,0 @@
-import Content from '@/uilts/messageCenter/messageContent'
-
-let denet = {}
-denet.content = Content
-
-export default denet

src/uilts/help.js

@@ -320,4 +320,4 @@ export const getBeforeTimeFormat = (timestamp) => {
   }
   let _s = moment.duration(_d1.diff(_d2)).seconds()
   return plural(_s, 'sec')
-}
+}

src/uilts/messageCenter/chrome/index.js

@@ -0,0 +1,129 @@
+import { guid } from '@/uilts/help'
+//  iframe 通信中心
+class ChromeMessageCenter {
+    constructor() {
+        //  缓存事件队列
+        this.messageCallbackMap = new Map();
+        this.messageFailbackMap = new Map();
+        this.timer = null
+    }
+
+    sendToContent(sender, { info = {}, data = {}, callback, overTime, failback }) {
+        if (!info.messageId) {
+            info.messageId = `${info.actionType}-${guid()}` // 唯一的ID，用于标记回调函数
+        }
+        try {
+            chrome.tabs.sendMessage(sender.tab.id, {
+                info,
+                data
+            })
+
+            if (info.messageId && callback) {
+                // 带回调callback 的message， 要求携带messageId，callback，failback等
+                this.listen(info.messageId, callback)
+            }
+            if (failback) {
+                this.addFailback(info.messageId, overTime, failback)
+            }
+
+        } catch (error) {
+            failback({
+                error: 2,
+                msg: String(error)
+            })
+        }
+    }
+
+    sendToSW({ info = {}, data = {}, callback, overTime, failback }) {
+        if (!info.messageId) {
+            info.messageId = `${info.actionType}-${guid()}` // 唯一的ID，用于标记回调函数
+        }
+        try {
+            chrome.runtime.sendMessage({
+                info,
+                data
+            })
+
+            if (info.messageId && callback) {
+                // 带回调callback 的message， 要求携带messageId，callback，failback等
+                this.listen(info.messageId, callback)
+            }
+            if (failback) {
+                this.addFailback(info.messageId, overTime, failback)
+            }
+
+        } catch (error) {
+            failback({
+                error: 2,
+                msg: String(error)
+            })
+        }
+    }
+
+    listen(messageId, callback) {
+        // 序列添加失败回调
+        this.messageCallbackMap.set(messageId, { callback })
+    }
+
+    addFailback(messageId, overTime = 2000, failback) {
+        // 序列添加失败回调
+        this.messageFailbackMap.set(messageId, {
+            time: new Date().getTime(),
+            overTime,
+            failback
+        })
+        this.checkTimer()
+    }
+
+    init(req = {}) {
+        const { info, data } = req;
+        if (!info || !data) {
+            return
+        }
+        // 序列删除 失败回调
+        this.messageFailbackMap.delete(info.messageId);
+
+        // 执行成功回调
+        const _item = this.messageCallbackMap.get(info.messageId);
+        if (_item) {
+            const callback = _item.callback
+            callback(data)
+            // 序列删除 成功回调
+            this.messageCallbackMap.delete(info.messageId)
+        }
+        this.checkTimer()
+    }
+    checkTimer() {
+        if (this.timer) {
+            return
+        }
+        let key, value, now_time
+        this.timer = setInterval(() => {
+            if (this.messageFailbackMap.size == 0) {
+                clearInterval(this.timer)
+                this.timer = null
+            }
+
+            // 轮询查看有无超期的message信息
+            now_time = new Date().getTime();
+            for (let item of this.messageFailbackMap.entries()) {
+                key = item[0] || ''
+                value = item[1] || {}
+
+                if (now_time - value.time > value.overTime) {
+                    const callback = value.failback
+                    callback && callback({
+                        error: 1,
+                        msg: "message 超时错误"
+                    })
+                    this.messageFailbackMap.delete(key)
+                }
+            }
+        }, 1000)
+    }
+}
+
+// messageCenter在页面内实例化一次
+const chromeMessageCenter = new ChromeMessageCenter();
+
+export default chromeMessageCenter;

src/uilts/messageCenter/chrome/messageEnum.js

@@ -0,0 +1,13 @@
+/** 向ServiceWorker发送的事件定义 */
+const CONTENT_TO_BACK_ENUM = {
+    CONTENT_TO_BACK_TEST: 'CONTENT_TO_BACK_TEST'
+}
+
+
+/** 接收ServiceWorker的事件定义 */
+const BACK_TO_CONTENT_ENUM = {
+    /** 切换到group tab */
+    BACK_TO_CONTENT_TEST: 'BACK_TO_CONTENT_TEST'
+}
+
+export default { ...CONTENT_TO_BACK_ENUM, ...BACK_TO_CONTENT_ENUM }

src/uilts/messageCenter/content/index.js

@@ -0,0 +1,60 @@
+class ContentMessageCenter {
+    constructor() {
+        this.iframeMap = new Map();
+        this.messageCallbackMap = new Map();
+        // this.listen()
+    }
+
+    findIframeById(id) {
+        let target = this.iframeMap.get(id);
+        if (!target) {
+            target = document.getElementById(id)
+            this.iframeMap.set('id', target)
+        }
+        return target
+    }
+
+    send({ info, data }) {
+        const target = this.findIframeById(info.iframeId);
+        target && target.contentWindow.postMessage({
+            info,
+            data
+        }, '*')
+    }
+
+    sendAll({ info, data }) {
+        const targets = document.querySelectorAll('iframe[data-card=denet]') || []
+        targets.forEach((item) => {
+            item.contentWindow.postMessage({
+                info,
+                data
+            }, '*')
+        })
+    }
+
+    // ---- don't use ---- 
+    // add(actionType, callback) {
+    //     let activeQuene = this.messageCallbackMap.get(actionType);
+    //     if (activeQuene?.length > 0) {
+    //         activeQuene.push(callback)
+    //     } else {
+    //         this.messageCallbackMap.set(actionType, [callback])
+    //     }
+    // }
+    // ---- don't use ---- 
+    // listen() {
+    //     window.addEventListener('message', (e) => {
+    //         const { actionType, data } = e.data;
+    //         console.log('get message in content ...', actionType, data)
+    //         const quene = this.messageCallbackMap.get(actionType) || [];
+    //         while (quene.length > 0) {
+    //             let callback = quene.pop();
+    //             callback(data)
+    //         }
+    //     })
+    // }
+}
+
+const contentMessageCenter = new ContentMessageCenter();
+
+export default contentMessageCenter;

src/uilts/messageCenter/messageEnum.js → src/uilts/messageCenter/content/messageEnum.js

@@ -7,9 +7,6 @@ const SEND_MESSAGE_ENUM = {
     /** 获取content的localstorge数据 */
     IFRAME_GET_EXTENSION_STORGE_DATA: 'IFRAME_GET_EXTENSION_STORGE_DATA',
 
-    // ---- 做任务 ----
-    IFRAME_DO_TASK_CREATE_TWEET: 'IFRAME_DO_TASK_CREATE_TWEET'
-
 }
 
 /** 接收父窗口的事件定义 */

src/uilts/messageCenter/iframe/index.js

@@ -0,0 +1,106 @@
+import { guid } from '@/uilts/help'
+//  iframe 通信中心
+class IframeMessageCenter {
+    constructor() {
+        //  缓存事件队列
+        this.messageCallbackMap = new Map();
+        this.messageFailbackMap = new Map();
+        this.timer = null
+        this.init()
+    }
+
+    send({ info = {}, data = {}, callback, overTime, failback }) {
+        if (callback) {
+            info.messageId = `${info.actionType}-${guid()}` // 唯一的ID，用于标记回调函数
+        }
+        window.parent.postMessage({
+            info,
+            data
+        }, '*');
+        if (info.messageId && callback) {
+            // 带回调callback 的message， 要求携带messageId，callback，failback等
+            this.listen(info.messageId, callback)
+            if (failback) {
+                this.addFailback(info.messageId, overTime, failback)
+            }
+        }
+    }
+
+    listen(key, callback) {
+        // 序列添加失败回调
+        this.messageCallbackMap.set(key, { callback })
+    }
+
+    addFailback(key, overTime = 2000, failback) {
+        // 序列添加失败回调
+        this.messageFailbackMap.set(key, {
+            time: new Date().getTime(),
+            overTime,
+            failback
+        })
+        this.checkTimer()
+    }
+
+    init() {
+        window.addEventListener('message', (e) => {
+            let { info = {}, data = {} } = e.data;
+            let key, item
+
+            // 如果有messageId && 是自己发送的
+            if (info.messageId) {
+                key = info.messageId
+                item = this.messageCallbackMap.get(key)
+            }
+
+            if (info.actionType && !item) {
+                key = info.actionType
+                item = this.messageCallbackMap.get(key)
+            }
+
+            // 执行成功回调
+            if (item) {
+                // 序列删除 失败回调      
+                this.messageFailbackMap.delete(key)
+                const callback = item.callback
+                callback(data)
+                // 序列删除 成功回调
+                this.messageCallbackMap.delete(key)
+            }
+        })
+
+        this.checkTimer()
+    }
+    checkTimer() {
+        if (this.timer) {
+            return
+        }
+        let key, value, now_time
+        this.timer = setInterval(() => {
+            if (this.messageFailbackMap.size == 0) {
+                clearInterval(this.timer)
+                this.timer = null
+            }
+
+            // 轮询查看有无超期的message信息
+            now_time = new Date().getTime();
+            for (let item of this.messageFailbackMap.entries()) {
+                key = item[0] || ''
+                value = item[1] || {}
+
+                if (now_time - value.time > value.overTime) {
+                    const callback = value.failback
+                    callback && callback({
+                        error: 1,
+                        msg: "message 超时错误"
+                    })
+                    this.messageFailbackMap.delete(key)
+                }
+            }
+        }, 1000)
+    }
+}
+
+// messageCenter在每个iframe内实例化一次
+const iframeMessageCenter = new IframeMessageCenter();
+
+export default iframeMessageCenter;

src/uilts/messageCenter/iframe/messageEnum.js

@@ -0,0 +1,31 @@
+/** 向父窗口发送的事件定义 */
+const SEND_MESSAGE_ENUM = {
+    IFREME_TAB_GROUP_SET_IFRAME_HEIGHT: 'IFREME_TAB_GROUP_SET_IFRAME_HEIGHT',
+    /** group tab 内的列表项点击 */
+    IFRAME_PAGE_JUMP: 'IFRAME_PAGE_JUMP',
+    IFREME_TAB_GROUP_CONTENT_GET_NAV_TOP: 'IFREME_TAB_GROUP_CONTENT_GET_NAV_TOP',
+    /** 获取content的localstorge数据 */
+    IFRAME_GET_EXTENSION_STORGE_DATA: 'IFRAME_GET_EXTENSION_STORGE_DATA',
+    // ---- 做任务 ----
+    IFRAME_DO_TASK_CREATE_TWEET: 'IFRAME_DO_TASK_CREATE_TWEET',
+    IFRAME_DO_TASK_LIKE: 'IFRAME_DO_TASK_LIKE',
+    IFRAME_DO_TASK_FOLLOWS: 'IFRAME_DO_TASK_FOLLOWS',
+    IFRAME_DO_TASK_RETWEET: 'IFRAME_DO_TASK_RETWEET',
+
+    // ---- 获取推文内容 ----
+    IFRAME_DOM_GET_TWEET_TEXT: 'IFRAME_DOM_GET_TWEET_TEXT',
+
+
+}
+
+/** 接收父窗口的事件定义 */
+const RECEIVE_MESSAGE_ENUM = {
+    /** 切换到group tab */
+    CONTENT_REFRESH_TAB_GROUP_LIST: 'CONTENT_REFRESH_TAB_GROUP_LIST',
+    /** group打开时，页面发生滚动 */
+    CONTENT_GROUP_LIST_SCROLL: 'CONTENT_GROUP_LIST_SCROLL',
+    CONTENT_SEND_GROUP_NAV_TOP: 'CONTENT_SEND_GROUP_NAV_TOP',
+    CONTENT_SYS_THEME_CHANGE: 'CONTENT_SYS_THEME_CHANGE'
+}
+
+export default { ...SEND_MESSAGE_ENUM, ...RECEIVE_MESSAGE_ENUM }

src/uilts/messageCenter/index.js

@@ -1,50 +0,0 @@
-class MessageCenter {
-    constructor() {
-        this.iframeMap = new Map();
-        this.messageCallbackMap = new Map();
-        // this.listen()
-    }
-
-    findIframeById(id) {
-        let target = this.iframeMap.get(id);
-        if (!target) {
-            target = document.getElementById(id)
-            this.iframeMap.set('id', target)
-        }
-        return target
-    }
-
-    send(id, actionType, data) {
-        const target = this.findIframeById(id);
-        target && target.contentWindow.postMessage({
-            actionType,
-            data
-        }, '*')
-    }
-
-    // don't use
-    add(actionType, callback) {
-        let activeQuene = this.messageCallbackMap.get(actionType);
-        if (activeQuene?.length > 0) {
-            activeQuene.push(callback)
-        } else {
-            this.messageCallbackMap.set(actionType, [callback])
-        }
-    }
-    // don't use
-    listen() {
-        window.addEventListener('message', (e) => {
-            const { actionType, data } = e.data;
-            console.log('get message in content ...', actionType, data)
-            const quene = this.messageCallbackMap.get(actionType) || [];
-            while (quene.length > 0) {
-                let callback = quene.pop();
-                callback(data)
-            }
-        })
-    }
-}
-
-const messageCenter = new MessageCenter();
-
-export default messageCenter;

src/uilts/messageCenter/messageContent.js

@@ -1,39 +0,0 @@
-// class message  
-import messageCenter from '@/uilts/messageCenter';
-import MESSAGE_ENUM from "@/uilts/messageCenter/messageEnum";
-import { guid, iframeID } from '@/uilts/help.js'
-
-// content.createTweets('iframe') 
-
-// 做任务
-class doTask {
-    createTweet({ txt = '' }) {
-        return new Promise((res, rej) => {
-            messageCenter.send({
-                actionType: MESSAGE_ENUM.IFRAME_DO_TASK_CREATE_TWEET,
-                data: {
-                    iframeID,//用于告诉父窗口会传消息给哪个iframe 
-                    messageID: guid()// 唯一的ID，用于标记回调函数
-                },
-                info: {
-                    txt
-                },
-                callback: (data) => {
-                    res(data)
-                },
-                failback: (e) => {
-                    rej(e)
-                }
-            })
-        })
-        // console.log(window.parent.window.atest)
-        // window.postMessage({actionType: 'iframe_test', data: key})
-    }
-}
-
-
-export default {
-    doTask() {
-        return new doTask()
-    }
-}

src/view/iframe/publish/components/get-more.vue

@@ -1,23 +1,26 @@
 <template>
-    <div class="get-more-btns"  v-if="props.style_type == 3">
+    <div class="get-more-btns" v-if="props.style_type == 3">
         <div class="get-more-btn" @click="jumpMore">
             <img width="22" :src="require('@/assets/svg/icon-wallet-success.svg')" />
-            <font>View wallet</font>
+            <span>View wallet</span>
         </div>
         <div class="get-more-btn" @click="jumpMore">
             <img width="22" :src="require('@/assets/svg/icon-big-give.svg')" />
-            <font>Get More Giveaway</font>
+            <span>Get More Giveaway</span>
         </div>
     </div>
     <div class="getMore" @click="jumpMore" v-if="props.style_type == 1">
         <img width="20" :src="require('@/assets/svg/icon-big-give.svg')" />
-        <font>Get More Giveaway</font>
+        <span>Get More Giveaway</span>
         <img height="20" :src="require('@/assets/svg/icon-cell-arrow-right.svg')" />
     </div>
     <div class="get_more" v-if="props.style_type == 2" @click="jumpMore">
         <img width="18" :src="require('@/assets/svg/icon-big-give.svg')" />
         <span>Get More Giveaway</span>
     </div>
+    <div v-if="style_type == 4" @click="jumpMore">
+        <slot></slot>
+    </div>
 </template>
 
 <script setup>
@@ -48,13 +51,16 @@ onBeforeMount(() => {
 })
 
 const jumpMore = () => {
-    Report.reportLog({
-      pageSource: props.reportData.pageSource,
-      businessType: Report.businessType.buttonClick,
-      objectType: Report.objectType.getMoreGiveaway,
-      postId: props.reportData.postId,
-      redPacketType: props.reportData.redPacketType
-    });
+    if (props.reportData) {
+        Report.reportLog({
+            pageSource: props.reportData.pageSource,
+            businessType: Report.businessType.buttonClick,
+            objectType: Report.objectType.getMoreGiveaway,
+            postId: props.reportData.postId,
+            redPacketType: props.reportData.redPacketType
+        });
+    }
+
     if (moreUrl.value) {
         window.open(moreUrl.value)
     }
@@ -76,7 +82,7 @@ const jumpMore = () => {
         margin: 0 5px;
     }
 
-    font {
+    span {
         color: #000;
         font-size: 15px;
         font-weight: 500;
@@ -100,7 +106,8 @@ const jumpMore = () => {
         margin-right: 8px;
     }
 }
-.get-more-btns  {
+
+.get-more-btns {
     display: flex;
     cursor: pointer;
     user-select: none;
@@ -109,6 +116,7 @@ const jumpMore = () => {
     padding: 13px 0;
     box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.06);
     position: relative;
+
     .get-more-btn {
         flex: 1;
         display: flex;
@@ -118,6 +126,7 @@ const jumpMore = () => {
         align-items: center;
         justify-content: center;
         height: 44px;
+
         font {
             font-weight: 600;
             font-size: 14px;
@@ -127,6 +136,7 @@ const jumpMore = () => {
             color: #000000;
         }
     }
+
     &::after {
         content: "";
         width: 1px;
@@ -134,7 +144,7 @@ const jumpMore = () => {
         position: absolute;
         left: 50%;
         top: 13px;
-        background-color: rgba(0,0,0,.2);
+        background-color: rgba(0, 0, 0, .2);
         transform: scale(0.5);
         transform-origin: 0 0;
     }

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

@@ -2,79 +2,45 @@
     <div class="invite-list">
         <div class="head">
             <div class="left">
-              <img height="20" :src="require('@/assets/svg/icon-back-2.svg')" @click="clickBack" />
-              <span>{{ state.detail.receiveCountWithAmount }} People Get Money</span>
+                <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="">
+                <img @click="clickOption" :src="sortTypeIcon" alt="">
             </div>
         </div>
-        <div class="content">
-            <img v-show="state.receive.loading && state.receive.list.length == 0"
-                :src="require('@/assets/svg/icon-loading-gray.svg')" alt="" class="loading" />
-            <img v-if="state.receive.list.length == 0 && state.receive.end"
-                :src="require('@/assets/svg/icon-empty-list.svg')" alt="" class="empty" />
-            <div class="list" v-else @scroll="handleScroll($event)">
-                <div class="item" v-for="item in state.receive.list" :key="item.userInfo.uid">
-                    <div class="left">
-                        <img :src="item.userInfo.avatarUrl" alt="" @click="clickItem(item)" />
-                    </div>
-                    <div class="right">
-                        <div>
-                            <div class="name" @click="clickItem(item)">{{ item.userInfo.nickName }}</div>
-                            <div class="time">{{ getBeforeTimeFormat(item.timestamp) }}</div>
-                        </div>
-                        <div class="money">${{ item.amountUsdValue }}</div>
-                    </div>
-                </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>
+        <receive-list :sortType="sortType"></receive-list>
     </div>
 </template>
 <script setup>
 import { receiveListV2 } from '@/http/treasure'
 import { inject, onMounted, ref } from 'vue'
-import { getBeforeTimeFormat } from "@/uilts/help"
-import Report from "@/log-center/log"
+import ReceiveList from '@/view/iframe/treasure-hunt/components/receive-list.vue'
 
 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
-  }
+    {
+        icon: amountIcon,
+        label: 'Amount',
+        type: 2
+    },
+    {
+        icon: timeIcon,
+        label: 'Time',
+        type: 1
+    }
 ])
 
 
 let page_num = 1
 let page_size = 10
-let sortType = 2;
+let sortType = ref(2);
 let list_end = false
 
 let showOptionSheet = ref(false);
@@ -83,58 +49,19 @@ const clickBack = () => {
     state.page_show = ''
 }
 
-onMounted(() => {
-    list()
-})
 
-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
-    }
-    e = e.target
-    if ((e.clientHeight + e.scrollTop) / e.scrollHeight > .8) {
-        if (page_num * page_size == state.receive.list.length) {
-            page_num++
-            list()
-        }
-        list_end = true
+const clickOption = () => {
+    if (sortType.value == 1) {
+        sortType.value = 2
+    } else if (sortType.value == 2) {
+        sortType.value = 1
     }
+    // 切换图标
+    sortTypeIcon.value = optionList.value.filter((item) => { return item.type == sortType.value })[0].icon;
+    page_num = 1;
 }
 
-const list = () => {
-    state.receive.loading = true
-    receiveListV2({
-        params: {
-            postId: state.postId,
-            pageNum: page_num,
-            pageSize: page_size,
-            sortType
-        }
-    }).then((res) => {
-        if (res.code == 0) {
-            state.receive.loading = false
-            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
-        }
-    })
-}
 </script>
 <style lang="scss" scoped>
 .invite-list {
@@ -154,8 +81,8 @@ const list = () => {
         box-shadow: inset 0px -1px 0px #F2F2F2;
 
         .left {
-          display: flex;
-          align-items: center;
+            display: flex;
+            align-items: center;
         }
 
         img {
@@ -254,49 +181,50 @@ 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;
+        height: 100%;
+        position: absolute;
+        top: 0;
+        left: 0;
+        z-index: 800;
+    }
 
-        img {
-          width: 24px;
-          margin: 0 12px;
-        }
+    .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;
+            .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;
-          }
+        .item:first-child {
+            .label {
+                box-shadow: inset 0px -1px 0px #F2F2F2;
+            }
         }
     }
 }

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

@@ -3,7 +3,7 @@
       <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 class="info">Invitees Need to be <span>Real New follower</span> 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')" />
@@ -16,7 +16,7 @@
                 {{item.name}}
               </div>
             </div>
-            <div class="share-item copy-btn" @click="clickCopy" v-click-log="state.log_invite_copy_btn_click"
+            <div v-show="state.share_list_end" 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">
@@ -151,6 +151,7 @@ const initInviteChannel = () => {
             }).then((res) => {
                 if (res.code == 0) {
                     state.share_list = res.data
+                    state.share_list_end = true
                 }
             })
         })
@@ -288,12 +289,23 @@ const clickCopy = () => {
           font-size: 12px;
           color: #7A7A7A;
           line-height: 15px;
+          span{
+            font-family: 'SF Pro Display';
+            font-style: normal;
+            font-weight: 800;
+            font-size: 12px;
+            line-height: 15px;
+            /* identical to box height, or 125% */
+            letter-spacing: 0.3px;
+            color: #000000;
+          }
         }
 
       }
 
       .invite-friends-content-body {
         position: relative;
+        height: 159px;
 
         .tips {
           position: absolute;

src/view/iframe/treasure-hunt/components/receive-list.vue

@@ -0,0 +1,210 @@
+<!-- 领取人列表组件 -->
+<template>
+    <div class="content">
+        <img v-show="receive.loading && receive.list.length == 0" :src="require('@/assets/svg/icon-loading-gray.svg')"
+            alt="" class="loading" />
+        <img v-if="receive.list.length == 0 && receive.end" :src="require('@/assets/svg/icon-empty-list.svg')" alt=""
+            class="empty" />
+        <div class="list" v-else @scroll="handleScroll($event)">
+            <div class="item" v-for="item in receive.list" :key="item.userInfo.uid">
+                <div class="left">
+                    <img :src="item.userInfo.avatarUrl" alt="" @click="clickItem(item)" />
+                </div>
+                <div class="right">
+                    <div>
+                        <div class="name" @click="clickItem(item)">{{ item.userInfo.nickName }}</div>
+                        <div class="time">{{ getBeforeTimeFormat(item.timestamp) }}</div>
+                    </div>
+                    <div>
+                        <div class="money">${{ item.amountUsdValue }}</div>
+                        <div class="count">invited:{{ item.inviteNewFansCount }}</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script setup>
+import { receiveListV2 } from '@/http/treasure'
+import { onMounted, reactive, inject, defineProps } from 'vue'
+import { getBeforeTimeFormat } from "@/uilts/help"
+let state = inject('state')
+let receive = reactive({
+    end: false,
+    list: []
+})
+let props = defineProps({
+    sortType: {
+        type: Number,
+        default: 2,
+    }
+})
+
+let page_num = 1
+let page_size = 10
+let sortType = 2;
+let list_end = false
+onMounted(() => {
+    list()
+})
+
+const clickItem = (item) => {
+    window.open(`https://twitter.com/${item.userInfo.nickName}`)
+}
+
+function handleScroll(e) {
+    if (list_end) {
+        return
+    }
+    e = e.target
+    if ((e.clientHeight + e.scrollTop) / e.scrollHeight > .8) {
+        if (page_num * page_size == receive.list.length) {
+            page_num++
+            list()
+        }
+        list_end = true
+    }
+}
+
+const list = () => {
+    receive.loading = true
+    receiveListV2({
+        params: {
+            postId: state.postId,
+            pageNum: page_num,
+            pageSize: page_size,
+            sortType
+        }
+    }).then((res) => {
+        if (res.code == 0) {
+            receive.loading = false
+            if (page_num < 2) {
+                receive.list = res.data || [];
+            } else {
+                receive.list = receive.list.concat(res.data)
+            }
+            receive.end = true
+            list_end = false
+        }
+    })
+}
+</script>
+<style lang="scss" scoped>
+.content {
+    position: relative;
+    height: 100%;
+    overflow-y: auto;
+
+    .footer {
+        background: #fff;
+        padding: 10px 16px 25px 16px;
+    }
+
+    .error {
+        height: 204px;
+        color: #BABABA;
+        background-color: #fff;
+        font-weight: 500;
+        font-size: 15px;
+        line-height: 204px;
+        text-align: center;
+
+    }
+
+    .list {
+        background: #fff;
+        overflow-y: auto;
+
+        .item {
+            height: 60px;
+            display: flex;
+            align-items: center;
+
+            .left {
+                width: 58px;
+                text-align: center;
+
+                img {
+                    cursor: pointer;
+                    border-radius: 50px;
+                    width: 30px;
+                    height: 30px;
+                }
+            }
+
+            .right {
+                flex: 1;
+                box-shadow: inset 0px -1px 0px #F2F2F2;
+
+                display: flex;
+                align-items: center;
+                height: 100%;
+                justify-content: space-between;
+
+                .name {
+                    color: #000000;
+                    font-weight: 500;
+                    font-size: 15px;
+                    cursor: pointer;
+                }
+
+                .time {
+                    color: #A6A6A6;
+                    font-weight: 400;
+                    font-size: 12px;
+                    margin-right: 17px;
+                }
+
+                .money {
+                    color: #FCB936;
+                    font-weight: 500;
+                    font-size: 13px;
+                    margin-right: 16px;
+                    text-align: right;
+
+                }
+
+                .count {
+                    margin-right: 16px;
+                    color: #A9A9A9;
+                    font-weight: 400;
+                    font-size: 12px;
+                    text-align: right;
+                    margin-top: 5px;
+                }
+            }
+        }
+    }
+}
+
+.loading {
+    width: 100px;
+    height: 100px;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    margin-left: -50px;
+    margin-top: -50px;
+    animation: rotation 1s linear infinite;
+}
+
+.empty {
+    width: 100px;
+    height: 100px;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    margin-left: -50px;
+    margin-top: -50px;
+}
+
+@keyframes rotation {
+    from {
+        -webkit-transform: rotate(0deg);
+    }
+
+    to {
+        -webkit-transform: rotate(360deg);
+    }
+}
+</style>

src/view/iframe/treasure-hunt/index.vue

@@ -1,7 +1,7 @@
 <template>
     <v-cover v-if="state.page == '封面页'"></v-cover>
     <v-invite v-if="state.page == '邀请页'"></v-invite>
-    <v-result v-if="state.page == '开奖页'"></v-result>
+    <v-result v-if="state.page == '结果页'"></v-result>
 
     <open-box v-show="state.open_box.show"></open-box>
     <v-toast :show="state.toast.show" :txt="state.toast.txt" :has_icon="state.toast.has_icon"></v-toast>
@@ -22,6 +22,7 @@ import { getChromeStorage, sendCurrentTabMessage } from '@/uilts/chromeExtension
 import VToast from '@/view/iframe/treasure-hunt/components/toast.vue'
 import OpenBox from '@/view/iframe/treasure-hunt/components/open-box.vue'
 import Report from "@/log-center/log"
+import denet from '@/denet'
 
 let state = reactive({
     loading_redbag: true,
@@ -65,6 +66,16 @@ onMounted(() => {
     // onRuntimeMsg();
     onWindowMessage();
 })
+// denet
+// chrome
+
+async function doLike() {
+    let task = await denet.content.doTask.like({ tweetId: '1564877034756534272' })
+    console.log('task', task)
+    if (tgas) {
+
+    }
+}
 
 const onWindowMessage = () => {
   window.onmessage = (res) => {
@@ -354,8 +365,8 @@ const handleStatus = (callback) => {
     // 如果 夺宝状态 = 已结束
     else {
         state.open_btn.txt = 'Look for more treasures'
-        state.page = '封面页'
-        state.cover_status = '奖励已被领光'
+        state.page = '结果页'
+        // state.cover_status = '奖励已被领光'
         state.btn_loading = false
         Report.reportLog({
           pageSource: Report.pageSource.expiredPage,

src/view/iframe/treasure-hunt/result.vue

@@ -1,168 +1,214 @@
 <template>
-    <!-- 开奖页 -->
-    <div class="content" v-show-log="state.log_result_show">
-        <img :src="require('@/assets/img/icon-silver-open-box-big.png')" alt="" />
-        <div class="mark">
-
-            <!-- 新粉 -->
-            <template v-if="Number(state.start_task.amountValue) > 0">
-                <p>You are now following
-                    <template v-for="item, i in state.follows">
-                        <span v-if="i == 0">@{{ item.name }}</span>
-                        <span v-else>, @{{ item.name }}</span>
-                    </template>
-                </p>
-                <p>You Win</p>
-                <component-zoom width="335" fontSize="34" style="margin:0 auto;">
-                    <div class="money">${{ state.start_task.usdAmountValue }}</div>
-                </component-zoom>
-                <div class="mark2">
-                    <img :src="state.start_task.currencyIcon" alt="" />
-                    <div>{{ state.start_task.amountValue }} {{ state.start_task.currencySymbol }} stored in your DeNet
-                        account</div>
+    <div class="content">
+        <!-- 结果页 -->
+        <div class="header">
+            <img :src="require('@/assets/subject/004-back-head-top.svg')" alt class="back" />
+            <!-- 领到钱了 -->
+            <template v-if="Number(state.detail.amountUsdValue) > 0">
+                <div class="tip1">This Giveaway Expired on {{ moment(state.detail.endTimestamp).format('MM-DD') }}</div>
+                <div class="tip2">🎉 Awesome! You are the Winner!</div>
+                <div class="tip3">+${{ state.detail.amountUsdValue }}</div>
+                <div class="tip3-back"></div>
+            </template>
+            <!-- 没有领到钱 -->
+            <template v-else>
+                <div class="rabbit">
+                    <img :src="require('@/assets/subject/001-icon-rabbit.svg')" alt />
+                    <p>Sorry, you missed this treasure</p>
+                </div>
+            </template>
+
+        </div>
+        <div class="list">
+            <receive-list></receive-list>
+        </div>
+        <div class="footer">
+            <!-- 领取到钱了 -->
+            <template v-if="Number(state.detail.amountUsdValue) > 0">
+                <div class="btn btn1" @click="clickDone">
+                    <img :src="require('@/assets/svg/icon-wallet-success.svg')" alt />
+                    <span>Wallet</span>
                 </div>
+                <get-more :style_type="4">
+                    <div class="btn btn2">
+                        <img :src="require('@/assets/svg/icon-gold-box-close.svg')" alt />
+                        <span>Get More</span>
+                    </div>
+                </get-more>
             </template>
-            <!-- 老粉不给钱 -->
+            <!-- 没有领到钱 -->
             <template v-else>
-                <p>You already followed
-                    <template v-for="item, i in state.follows">
-                        <span v-if="i == 0">@{{ item.name }}</span>
-                        <span v-else>, @{{ item.name }}</span>
-                    </template>
-                </p>
-                <p>Only new followers open silver chest</p>
-                <p class="txt">Invite people to</p>
-                <p class="txt">open golden chest！</p>
+                <div class="btn btn2 btn3" @click="clickBtn">
+                    <img :src="require('@/assets/svg/icon-gold-box-close.svg')" alt />
+                    <span>Look for more treasures</span>
+                </div>
             </template>
         </div>
-        <v-btn :txt="'Invite friends for more treasures'" :font-size="'16px'" class="btn"
-            v-if="Number(state.start_task.amountValue) > 0" v-click-log="state.log_result_click" @onClick="clickBtn"
-            :disabled="false"></v-btn>
-        <v-btn :txt="'Invite'" :font-size="'16px'" class="btn" v-else @onClick="clickBtn" :disabled="false"
-            v-click-log="state.log_result_click"></v-btn>
     </div>
 </template>
 <script setup>
 import { inject, onMounted } from 'vue'
-import VBtn from '@/view/iframe/treasure-hunt/components/btn.vue'
+import ReceiveList from '@/view/iframe/treasure-hunt/components/receive-list.vue'
+import { chromeExtensionUrl } from '@/uilts/chromeExtension.js'
+import GetMore from '@/view/iframe/publish/components/get-more.vue'
 import Report from "@/log-center/log"
 
 let state = inject('state')
+var moment = require('moment')
 
-state.log_result_show = {
-    businessType: Report.businessType.pageView,
-    pageSource: Report.pageSource.newFansRewardPage,
-    redPacketType: Report.redPacketType.treasure,
-    shareLinkId: state.invite_code,
-    postId: state.postId,
-    extParams: {
-        isNewFans: Number(state.start_task.amountValue) > 0 ? true : false
-    }
-}
-
-state.log_result_click = {
-    businessType: Report.businessType.buttonClick,
-    pageSource: Report.pageSource.newFansRewardPage,
-    objectType: Report.objectType.nextButton,
-    redPacketType: Report.redPacketType.treasure,
-    shareLinkId: state.invite_code,
-    postId: state.postId,
-    extParams: {
-        isNewFans: Number(state.start_task.amountValue) > 0 ? true : false
-    }
+function clickDone() {
+    window.open(`${chromeExtensionUrl + ('iframe/home.html')}`)
 }
 
-async function clickBtn() {
-    let _userInfo = await state.checkIsLogin()
-    if (!_userInfo) {
-        return
-    }
-    state.init(() => {
-        state.page = '邀请页'
-    })
+const clickBtn = () => {
+    // Report.reportLog({
+    //     pageSource: Report.pageSource.pending_page,
+    //     businessType: Report.businessType.buttonClick,
+    //     objectType: Report.objectType.getMoreGiveaway,
+    //     postId: state.postId
+    // });
+    window.open('https://twitter.com/search?q=%23denet');
 }
-JSON.parse('[{\"type\":2},{\"type\":10},{\"relatedUsers\":[{\"name\":\"Ice17619765\",\"twitterUserId\":\"1502254505236525056\"},{\"name\":\"IanDuddyUK\",\"twitterUserId\":\"556285604\"},{\"name\":\"ffvc\",\"twitterUserId\":\"285917234\"}],\"type\":1}]')
-
 </script>
 <style lang="scss" scoped>
 .content {
     width: 375px;
-    height: 500px;
-    background: linear-gradient(179.96deg, #876635 20.15%, #31251A 44.61%, #24180C 78.18%);
-    text-align: center;
-    position: relative;
-
-    img {
-        margin-top: 15px;
-        width: 250px;
-        height: 250px;
-    }
-
-    .mark {
-        position: absolute;
-        top: 246px;
-        width: 375px;
 
-        p {
-            margin: 0;
-            padding: 0 16px;
-            text-align: center;
+    .header {
+        width: 100%;
+        min-height: 150px;
+        position: relative;
 
+        .back {
+            position: absolute;
+            top: 0;
+            left: 0;
+            z-index: -1;
         }
 
-        p:nth-child(1) {
-            color: #A9A49F;
-            font-weight: 400;
-            font-size: 12px;
-            margin-bottom: 10px;
+        .tip1 {
+            color: #FFFFFF;
+            opacity: 0.5;
+            text-align: center;
+            padding-top: 16px;
+            font-weight: 700;
+            font-size: 13px;
+            width: 100%;
         }
 
-        p:nth-child(2) {
-            margin-bottom: 10px;
+        .tip2 {
             color: #FFFFFF;
+            text-align: center;
             font-weight: 800;
-            font-size: 18px;
-        }
+            font-size: 16px;
+            margin-top: 11px;
 
-        .txt {
-            color: #FFC83A;
-            font-weight: 800;
-            font-size: 24px;
+        }
 
+        .tip3-back {
+            width: 100%;
+            height: 43px;
+            position: absolute;
+            top: 74px;
+            left: 0;
+            background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.826667) 26.4%, #FFFFFF 71.47%, rgba(255, 255, 255, 0) 100%);
+            opacity: 0.15;
+            z-index: 1;
         }
 
-        .money {
-            color: #FFC83A;
+        .tip3 {
+            position: absolute;
+            top: 74px;
+            z-index: 2;
+            left: 0;
+            width: 100%;
+            line-height: 43px;
+            height: 43px;
+            color: #F5C03F;
+            text-align: center;
+            font-size: 26px;
             font-weight: 800;
-            font-size: 34px;
         }
 
-        .mark2 {
-            margin-top: 10px;
+
+        .rabbit {
+            width: 100%;
+            height: 100%;
             display: flex;
-            justify-content: center;
             align-items: center;
+            align-content: center;
+            flex-wrap: wrap;
+            justify-content: center;
 
             img {
-                width: 17px;
-                height: 17px;
-                margin: 0;
-                margin-right: 5px;
+                width: 150px;
+                height: 80px;
+                margin-top: 14px;
+                margin-bottom: 4px;
             }
 
-            div {
-                color: #A9A49F;
-                font-weight: 400;
-                font-size: 12px;
+            .flower {
+                width: 62px;
+                height: 62px;
+            }
 
+            p {
+                width: 100%;
+                margin: 0;
+                padding: 0;
+                font-weight: 800;
+                font-size: 16px;
+                color: #fff;
+                text-align: center;
+                letter-spacing: 0.3px;
             }
         }
     }
 
-    .btn {
-        position: absolute;
-        bottom: 25px;
-        left: 15px;
+    .list {
+        height: 336px;
+        margin-top: 10px;
+    }
+
+    .footer {
+        height: 84px;
+        display: flex;
+        padding: 16px;
+        justify-content: space-between;
+
+        .btn {
+            width: 166.5px;
+            height: 52px;
+            border-radius: 100px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-weight: 800;
+            font-size: 18px;
+            user-select: none;
+            cursor: pointer;
+
+            img {
+                width: 24px;
+                height: 24px;
+                margin-right: 7px;
+            }
+        }
+
+        .btn1 {
+            background: #FFFFFF;
+            border: 1px solid #DEDEDE;
+            color: #585858;
+        }
+
+        .btn2 {
+            color: #FFFFFF;
+            background: #1D9BF0;
+        }
+
+        .btn3 {
+            width: 100%;
+        }
     }
 }
 </style>