[add][- 金额文字 过长

- 多个关注任务完成文字
- 弹出动画]

src/manifest.json

@@ -2,8 +2,8 @@
     "manifest_version": 3,
     "name": "DeNet",
     "description": "Growing more twitter followers with Denet",
-    "version": "1.1.6.2",
-    "denet_app_version_code": "19",
+    "version": "1.1.7",
+    "denet_app_version_code": "20",
     "background": {
         "service_worker": "/js/background.js"
     },

src/view/components/component-zoom.vue

@@ -25,9 +25,9 @@ let props = defineProps({
 watch(() => props.txt, (newVal) => {
     setFontZoom(300)
 },
-{
-    deep: true
-})
+    {
+        deep: true
+    })
 
 let zoom = ref(1);
 let zoomDom = ref({});
@@ -52,5 +52,6 @@ onMounted(() => {
     align-items: center;
     justify-content: center;
     white-space: nowrap;
+    width: fit-content;
 }
 </style>

src/view/iframe/treasure-hunt/components/dialog.vue

@@ -19,7 +19,7 @@ defineProps({
     }
 })
 const clickBtn = () => {
-
+    state.dialog.show = false
 }
 </script>
 <style lang="scss" scoped>

src/view/iframe/treasure-hunt/components/open-box.vue

@@ -3,8 +3,7 @@
         <div class="background"></div>
         <!-- 开奖页 -->
         <div class="content">
-
-            <img :src="require('@/assets/img/icon-silver-open-box.png')" alt="" />
+            <img :src="require('@/assets/img/icon-silver-open-box.png')" alt="" class="popIn" />
             <div class="mark">
                 <p>You Win</p>
                 <div class="money">{{ state.open_box.data.usdAmountValue }}</div>
@@ -15,7 +14,6 @@
                         account
                     </div>
                 </div>
-
             </div>
             <v-btn :txt="'OK'" :font-size="'16px'" class="btn" :icon="false" @onClick="clickBtn"></v-btn>
         </div>
@@ -53,12 +51,18 @@ const clickBtn = () => {
         text-align: center;
         position: relative;
 
-
+        .popIn {
+            -webkit-animation: fadeleftIn .4s;
+            animation: fadeleftIn .4s;
+            -webkit-animation-name: popIn;
+            animation-name: popIn;
+        }
 
         img {
             margin-top: 15px;
             width: 250px;
             height: 250px;
+            animation: show 0.5s;
         }
 
         .mark {
@@ -122,4 +126,27 @@ const clickBtn = () => {
         }
     }
 }
+
+
+
+@keyframes popIn {
+    0% {
+        -webkit-transform: scale3d(0, 0, 0);
+        transform: scale3d(0.5, 0.5, 0.5);
+        opacity: 0;
+    }
+
+    50% {
+        -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
+        animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
+    }
+
+    100% {
+        -webkit-transform: scale3d(1, 1, 1);
+        transform: scale3d(1, 1, 1);
+        -webkit-animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
+        animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
+        opacity: 1;
+    }
+}
 </style>

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

@@ -14,13 +14,17 @@
             </div>
             <div class="in" v-else></div>
             <div class="treasure">
-                <span>Treasure</span>
-                <span>{{ state.detail.amountValue || '' }}</span>
+                <component-zoom width="335" fontSize="34" style="margin:0 auto;">
+                    <span>Treasure</span>
+                    <span>{{ state.detail.amountValue }}</span>
+                </component-zoom>
             </div>
             <div class="gain">
-                <span>Your Gain Up to</span>
-                <span>$</span>
-                <span>{{ state.detail.remainAmountValue }}</span>
+                <component-zoom width="335" fontSize="34" style="margin:0 auto;">
+                    <span>Your Gain Up to</span>
+                    <span>$</span>
+                    <span>{{ state.detail.remainAmountValue }}</span>
+                </component-zoom>
             </div>
             <div class="coin">
                 <img :src="state.detail.currencyIconPath" alt="" />
@@ -45,6 +49,7 @@
 import { inject } from 'vue'
 import VBtn from '@/view/iframe/treasure-hunt/components/btn.vue'
 import VHead from '@/view/iframe/treasure-hunt/components/head.vue'
+import ComponentZoom from "@/view/components/component-zoom.vue";
 
 import { prepareStart, treasureStart } from '@/http/treasure.js'
 
@@ -107,7 +112,7 @@ const clickBtn = () => {
                         tweet_text: text
                     },
                     task_type: 'tasks',
-                    tasks: JSON.parse(state.detail.startCondition),
+                    tasks: state.tasks,
                 }, (res) => { console.log(res) });
             })
         } else {
@@ -185,6 +190,9 @@ const clickBtn = () => {
 
     .treasure {
         text-align: center;
+        height: 37px;
+        display: flex;
+        align-items: center;
 
         span {
             font-size: 34px;

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

@@ -26,6 +26,9 @@ let state = reactive({
         txt: '',
         disabled: false
     },
+    dialog: {
+        show: false,
+    },
     start_task: {}
 })
 provide('state', state)
@@ -46,19 +49,9 @@ state.init = (callback) => {
             params: {
                 inviteCode: params.invite_code
             }
-
         }).then((res) => {
             if (res.code == 0) {
-                state.detail = res.data
-                state.postId = state.detail.postId
-                handleStatus()
-                if (!res.data.srcContentId) {
-                    reSetBindTwtterId({
-                        postId: state.postId || '',
-                        tweetId: state.tweetId || ''
-                    })
-                }
-                callback && callback()
+                handleCommon(res, callback)
             }
         })
 
@@ -70,20 +63,34 @@ state.init = (callback) => {
             }
         }).then((res) => {
             if (res.code == 0) {
-                state.detail = res.data
-                state.postId = state.detail.postId
-                handleStatus()
-                if (!res.data.srcContentId) {
-                    reSetBindTwtterId({
-                        postId: state.postId || '',
-                        tweetId: state.tweetId || ''
-                    })
-                }
-                callback && callback()
+                handleCommon(res, callback)
             }
         })
     }
 }
+const handleCommon = (res, callback) => {
+    state.detail = res.data
+    state.postId = state.detail.postId
+    try {
+        state.tasks = JSON.parse(state.detail.startCondition)
+        let follows = state.tasks.filter((item) => { return item.type == 1 })
+        if (follows.length) {
+            state.follows = follows[0].relatedUsers
+        }
+    }
+    catch (error) {
+        console.error('catch', error)
+    }
+
+    handleStatus()
+    if (!res.data.srcContentId) {
+        reSetBindTwtterId({
+            postId: state.postId || '',
+            tweetId: state.tweetId || ''
+        })
+    }
+    callback && callback()
+}
 
 state.treasureOpen = () => {
     treasureOpen({
@@ -98,6 +105,12 @@ state.treasureOpen = () => {
             state.init(() => {
                 state.inviteInit()
             })
+        } else {
+            switch (String(res.code)) {
+                case '2037':
+                    state.dialog.show = true
+                    break;
+            }
         }
     })
 }
@@ -115,6 +128,7 @@ const handleStatus = () => {
 
     let { status, joinStatus } = state.detail || {}
     state.open_btn.txt = 'Start'
+    state.open_box.show = true
     // 如果 夺宝状态 = 未开始
     if (status == 0) {
         state.page = '封面页'

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

@@ -34,7 +34,7 @@
         <invite-friends v-show="state.tab_index == 0"></invite-friends>
         <invite-list v-show="state.tab_index == 1"></invite-list>
     </div>
-
+    <v-dialog v-show="state.dialog.show"></v-dialog>
 </template>
 <script setup>
 import { ref, onMounted, watch, inject } from 'vue'
@@ -43,6 +43,7 @@ import VHead from '@/view/iframe/treasure-hunt/components/head.vue'
 import InviteList from '@/view/iframe/treasure-hunt/components/invite-list.vue'
 import HoverTip from '@/view/iframe/treasure-hunt/components/hover-tip.vue'
 import InviteFriends from '@/view/iframe/treasure-hunt/components/invite-friends.vue'
+import VDialog from '@/view/iframe/treasure-hunt/components/dialog.vue'
 
 let content_success_message = ref(null)
 let state = inject('state')

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

@@ -3,11 +3,18 @@
     <div class="content">
         <img :src="require('@/assets/img/icon-silver-open-box.png')" alt="" />
         <div class="mark">
-            <p>You already followed Younan111 </p>
+            <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>
             <!-- 新粉 -->
             <template v-if="Number(state.start_task.amountValue) > 0">
                 <p>You Win</p>
-                <div class="money">${{ state.start_task.usdAmountValue }}</div>
+                <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
@@ -27,7 +34,7 @@
     </div>
 </template>
 <script setup>
-import { inject } from 'vue'
+import { inject, onMounted } from 'vue'
 import VBtn from '@/view/iframe/treasure-hunt/components/btn.vue'
 let state = inject('state')
 
@@ -36,6 +43,7 @@ const clickBtn = () => {
         state.page = '邀请页'
     })
 }
+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>
@@ -59,7 +67,7 @@ const clickBtn = () => {
 
         p {
             margin: 0;
-            padding: 0;
+            padding: 0 16px;
             text-align: center;
 
         }