Merge branch 'dev_220318_test' into test

src/iframe/publish.js

@@ -3,6 +3,20 @@ import App from '@/view/publish.vue'
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 
+import "ant-design-vue/dist/antd.css"; // or 'ant-design-vue/dist/antd.less'
+
+import {Button,message} from "ant-design-vue";
+
+
+message.config({
+    top: `10px`,
+    duration: 3,
+    maxCount: 1,
+});
+
 const app = createApp(App);
+
+app.use(Button);
+app.use(message);
 app.use(ElementPlus);
-app.mount('#app')
+app.mount('#app');

src/logic/twitter.js

@@ -138,7 +138,7 @@ export function addPinedPop() {
     img.src = require("@/assets/img/img-pined-guide.png");
 
     let contentDom = document.createElement('div');
-    contentDom.innerHTML = "<div style='font-weight: 500;font-size: 18px;margin-top: 20px;margin-bottom: 20px'>📌 Pin an Extension is more convenient to open😄</div><div style='display: flex; align-items: center; justify-content: space-between;'><div style='display: flex; align-items: center; font-size: 14px; color: #899099; cursor: pointer;'><input id='de-check' type='checkbox'/> Don't remind</div><div class='de-pin-skip' style='font-weight: 500; font-size: 16px; color: #389AFF;cursor: pointer;'>Skip</div></div>"
+    contentDom.innerHTML = "<div style='font-weight: 500;font-size: 18px;margin-top: 20px;margin-bottom: 20px'>📌 Pin an Extension is more convenient to open😄</div><div style='display: flex; align-items: center; justify-content: space-between;'><div style='display: flex; align-items: center; font-size: 14px; color: #899099; cursor: pointer;' id='de-remind'><input id='de-check' type='checkbox'/> Don't remind</div><div class='de-pin-skip' style='font-weight: 500; font-size: 16px; color: #389AFF;cursor: pointer;'>Skip</div></div>"
 
     let arrow = document.createElement('div');
     arrow.style.cssText = 'position: absolute;height: 15px;width: 15px;top: -8px;right: 80px;border-left: 0.5px solid rgb(145, 145, 145);border-top: 0.5px solid rgb(145, 145, 145);background: rgb(255, 255, 255);transform: rotate(45deg);';
@@ -149,10 +149,19 @@ export function addPinedPop() {
 
     document.querySelector('body').appendChild(popWrapper);
 
-    document.querySelector('#de-check').onclick = function () {
+    let deCheck = document.querySelector('#de-check');
+    let deRemind = document.querySelector('#de-remind');
+
+    deCheck.onclick = function (e) {
+        e && e.stopPropagation && e.stopPropagation();
         setChromeStorage({ pinData: JSON.stringify({ show: !this.checked }) })
     }
 
+    deRemind.onclick = function () {
+        deCheck.checked = !deCheck.checked;
+        setChromeStorage({ pinData: JSON.stringify({ show: !deCheck.checked }) })
+    }
+
     document.querySelector('.de-pin-skip').onclick = function () {
         document.querySelector('#de-pin-pop').style.display = 'none';
     }

src/view/components/currency-list.vue

@@ -2,7 +2,7 @@
 <template>
     <div class="currency-list-wrapper">
         <div class="search-input-wrapper">
-            <input class="input" v-model="keywords" @input="onInput" placeholder="Search name or paste address" />
+            <input class="input" v-model="keywords" @input="onInput" placeholder="Search name" />
             <img :src="require('../../assets/svg/icon-form-refresh.svg')" 
                 class="icon"
                 :class="{ 'icon-refresh-rotate': refreshRotate }"

src/view/components/follow-input.vue

@@ -1,4 +1,5 @@
 <template>
+<!-- 发布器-@关注人 输入组件 -->
     <div class="follow-input-wrapper">
         <div class="at-user-item" v-for="(item, index) in pageAtUserList" :key="index">
             <img :src="require('@/assets/svg/icon-del-follows-user.svg')" 

src/view/components/give-dialog.vue

@@ -7,8 +7,10 @@
             <div class="pop-mask"  
                 v-show="showCurrencyPop" 
                 @click.stop="showCurrencyPop = false"></div>
+            <!-- 头部 -->
             <div class="head">
                 <div class="left">
+                    <!-- 关闭按钮 -->
                     <div class="close-btn" @click="close">
                         <img  class="icon-close"
                             :src="require('../../assets/svg/icon-close.svg')"
@@ -17,11 +19,13 @@
                             :src="require('../../assets/svg/icon-back.svg')"
                             v-else/>
                     </div>
+                    <!-- 标题 -->
                     <div class="title">
                         {{ currentComData[showComType]["title"] }}
                     </div>
                 </div>
                 <div class="right">
+                    <!-- 更多按钮 -->
                     <img :src="require('@/assets/svg/icon-more-l.svg')"
                         class="more"
                         @click="showMoreOption = true">
@@ -37,9 +41,14 @@
                     </div>
                 </div>
             </div>
+            <!-- 内容 -->
             <div class="body">
+                <img src="@/assets/gif/icon-guide-select.gif"
+                    class="icon-guide-select"
+                    v-if="!currentCurrencyInfo.currencyCode && showComType == 'default'">
                 <!-- 充值组件 -->
                 <top-up v-if="showComType == 'topUp'" 
+                    :asyncIng="asyncIng"
                     :currentCurrencyInfo="tempCurrentCurrencyInfo"
                     @topUpDone="topUpDone"></top-up>
                 <!-- 表单填写容器 -->
@@ -65,26 +74,27 @@
                         <div class="form-wrapper"  v-if="showComType == 'default'">
                             <img
                                 class="img-mode"
-                                src="../../assets/img/img-mode.png"
+                                :src="require('@/assets/svg/img-mode.svg')"
                             />
                             <!-- 金额、数量 -->
                             <div class="form-base">
                                 <div class="item currency-select-wrapper">
                                     <div
                                         class="label currency-select"
+                                        :class="{'selected': currentCurrencyInfo.currencyCode}"
                                         @click="showCurrencyPop = true"
                                     >
-                                        <img
+                                        <img v-if="currentCurrencyInfo.iconPath"
                                             class="icon"
-                                            :src="currentCurrencyInfo.iconPath || require('../../assets/svg/icon-currency.svg')"
+                                            :src="currentCurrencyInfo.iconPath"
                                         />
                                         <div class="text">
-                                            {{currentCurrencyInfo.currencyCode == 'USD' ? 'USD' : currentCurrencyInfo.tokenSymbol || 'Currency'}}
+                                            {{currentCurrencyInfo.currencyCode == 'USD' ? 'USD' : currentCurrencyInfo.tokenSymbol || 'Select a Reward'}}
                                         </div>
                                         <img
                                             class="arrow"
-                                            :src="
-                                                require('../../assets/svg/icon-form-arrow-down.svg')
+                                            :src="currentCurrencyInfo.currencyCode ?
+                                                require('../../assets/svg/icon-form-arrow-down.svg') :  require('../../assets/svg/icon-form-white-arrow-down.svg') 
                                             "
                                         />
                                     </div>
@@ -206,27 +216,17 @@
                                 <el-switch v-model="openAntiBot" />
                             </div>
                             <!-- 提示 -->
-                            <div class="tips-wrapper">
-                                <div class="title">TIPS</div>
-                                <div class="row">
-                                    1. Only after the user completes the
-                                    tasks you set, they can claim your red
-                                    envelopes
-                                </div>
-                                <div class="row">
-                                    2. Each user can only receive one red
-                                    envelope
-                                </div>
-                                <div class="row">
-                                    3. The red envelope issued is valid for
-                                    7 days. Please promote your red envelope
-                                    as much as possible within the validity
-                                    period. After the red envelope expires,
-                                    the red envelope will be returned to
-                                    your DeNet wallet.
-                                </div>
-                                <div class="more">More</div>
-                            </div>
+                            <ul class="tips-wrapper">
+                                <li class="row">
+                                    Rewards can only be claimed after the target user completes all tasks you set.
+                                </li>
+                                <li class="row">
+                                    Each user can only receive a reward once per task
+                                </li>
+                                <li class="row">
+                                    The reward will expire in 7 days once issued. Please promote it as much as possible within this period. After experiment, remaining rewards will be returned to your DeNet Wallet.
+                                </li>
+                            </ul>
 
                             <div class="submit-btn-wrapper">
                                 <div class="submit-btn"
@@ -288,8 +288,8 @@ import { postPublish, verifyPaypalResult, syncChainTokenRechargeRecord } from "@
 import { payCalcFee, getPayConfig } from "@/http/pay";
 import { getFrontConfig } from "@/http/account";
 import { throttle } from "@/uilts/help"
-import { ElMessage, ElLoading } from "element-plus";
-import "element-plus/es/components/message/style/css";
+import { ElLoading } from "element-plus";
+import { message } from 'ant-design-vue';
 
 import {create, all} from "mathjs";
 
@@ -353,6 +353,8 @@ let previewFontSize = ref(56);
 
 let postId = ref('');
 
+let asyncIng = ref(false);
+
 let messageBoxData = ref({
     title: "",
     content: "",
@@ -541,6 +543,17 @@ const messageBoxBlock = ({ title = "", content = "" }) => {
     messageBoxData.value.content = content;
 };
 
+/**
+ * 确定
+ */
+const messageBoxConfirm = () => {
+    showMessageBox.value = false;
+    showComType.value = "topUp";
+};
+
+/**
+ * 取消
+ */
 const messageBoxCancel = () => {
     currentCurrencyInfo.value = tempCurrentCurrencyInfo.value;
     showMessageBox.value = false;
@@ -550,11 +563,6 @@ const messageBoxCancel = () => {
     onIptSetErrorTxt();
 };
 
-const messageBoxConfirm = () => {
-    showMessageBox.value = false;
-    showComType.value = "topUp";
-};
-
 /**
  * 去充值
  */
@@ -567,7 +575,9 @@ const goTopUp = () => {
  */
 const topUpDone = () => {
     currentCurrencyInfo.value = tempCurrentCurrencyInfo.value;
+    asyncIng.value = true;
     asyncTokenRechRecord((res) => {
+        asyncIng.value = false;
         showCurrencyPop.value = false;
         showComType.value = 'default';
         if(res.code == 0 && res.data && res.data.length) {
@@ -579,6 +589,9 @@ const topUpDone = () => {
     })
 }
 
+/**
+ * 更新货币余额
+ */
 const updateCurrencyBanlce = () => {
     if(!refreshRotate.value) {
         refreshRotate.value = true;
@@ -736,22 +749,13 @@ const payStatusHandle = (payStatus) => {
             initParams();
             break;
         case 2:
-            ElMessage({
-                message: "Pay Fail",
-                type: "warning",
-            });
+            message.error('Pay Fail');
             break;
         case 3:
-            ElMessage({
-                message: "Pay Exceptions",
-                type: "warning",
-            });
+            message.error('Pay Exceptions');
             break;
         case 4:
-            ElMessage({
-                message: "Pay Exceptions",
-                type: "warning",
-            });
+            message.error('Pay Exceptions');
             break;
     }
 }
@@ -901,19 +905,19 @@ const setIsEmptyTxt = () => {
 const onIptSetErrorTxt = (params) => {
     if(!currentCurrencyInfo.value.currencyCode) {
         iptErrMsgTxt.value = "Please select a currency"
-    } else if (!baseFormData.amountValue) {
+    } else if (!baseFormData.amountValue || baseFormData.amountValue == '0') {
         iptErrMsgTxt.value = "Please enter the ‘reward’ amount";
-    } else if (!baseFormData.totalCount) {
+    } else if (!baseFormData.totalCount || baseFormData.totalCount == '0') {
             iptErrMsgTxt.value = "Please enter the ‘winners’ amount";
     } else if(+baseFormData.amountValue < +currentCurrencyInfo.value.balance) {
         let res = calcIptValue();
         if (!res.flag) {
-            iptErrMsgTxt.value = `Please reduce the ‘winners’ amount to ${res.count}`;
+            iptErrMsgTxt.value = `Please enter at least ${baseFormData.amountValue} ${currentCurrencyInfo.value.tokenSymbol} for ${res.count} winners`;
         } else {
             iptErrMsgTxt.value = "";
         }
     } else if(currentCurrencyInfo.value.currencyCode != 'USD') {
-        iptErrMsgTxt.value = `Insufficient ${currentCurrencyInfo.value.currencyName} balance, please recharge`;
+        iptErrMsgTxt.value = `Insufficient ${currentCurrencyInfo.value.tokenSymbol} balance, please recharge`;
     } 
 }
 
@@ -1087,6 +1091,14 @@ onMounted(() => {
             display: flex;
             position: relative;
 
+            .icon-guide-select {
+                width: 40px;
+                position: absolute;
+                top: 78px;
+                left: 25px;
+                z-index: 1000;
+            }
+
             .body-content {
                 display:flex;
                 width:100%;
@@ -1119,7 +1131,7 @@ onMounted(() => {
 
                 .gift-pack-wrapper {
                     width: 100%;
-                    height: 54px;
+                    height: 55px;
                     background: #f5f5f5;
                     display: flex;
                     align-items: center;
@@ -1148,8 +1160,7 @@ onMounted(() => {
                     box-sizing: border-box;
 
                     .img-mode {
-                        width: 553px;
-                        margin-left: -20px;
+                        margin-left: -18px;
                     }
 
                     .form-base-help {
@@ -1191,13 +1202,12 @@ onMounted(() => {
                         }
                         .currency-operation {
                             position: relative;
-                            height: 45px;
+                            height: 36px;
                             border: 1px solid #EAEAEA;
                             box-sizing: border-box;
                             padding: 10px;
                             display: flex;
                             align-items: center;
-                            justify-content: space-around;
                             border-radius: 100px;
 
                             .balance,
@@ -1220,6 +1230,7 @@ onMounted(() => {
                                 font-weight: 500;
                                 font-size: 13px;
                                 color: #4e4e4e;
+                                margin-left: 5px;
                                 img {
                                     margin-left: 5px;
                                     cursor: pointer;
@@ -1256,12 +1267,12 @@ onMounted(() => {
                             width: 250px;
                             height: 50px;
                             box-sizing: border-box;
-                            border-radius: 12px;
+                            border-radius: 14px;
+                            border: 1px solid #D1D9DD;
                             display: flex;
                             align-items: center;
                             justify-content: space-between;
                             padding: 16px 14px;
-                            box-shadow: 0px 2px 10px 0px #0000001A;
 
                             input {
                                 width: 102px;
@@ -1292,22 +1303,25 @@ onMounted(() => {
                                 padding-right: 14px;
                             }
                             .currency-select {
-                                max-width: 124px;
+                                max-width: 136px;
                                 cursor: pointer;
-                                background: #F4F4F4;
+                                background: #389AFF;
                                 margin-left: 6px;
-                                padding: 10px;
+                                padding: 6px 10px;
                                 border-radius: 12px;
+                                color: #fff;
                                 .text {
-                                    // max-width: 68px;
-                                    // overflow: hidden;
                                     white-space: nowrap;
-                                    text-overflow: ellipsis;
+                                    zoom: 0.85;
                                 }
                                 .arrow {
                                     margin-left: 5px;
                                 }
                             }
+                            .selected {
+                                background: #F4F4F4 !important;
+                                color: #000 !important;
+                            }
                         }
                     }
 
@@ -1322,7 +1336,7 @@ onMounted(() => {
                         box-sizing: border-box;
                         border-radius: 15px;
                         margin-top: 12px;
-                        box-shadow: 0px 3px 27px 0px #0000001a;
+                        border: 1px solid #D1D9DD;
 
                         .form-item {
                             min-height: 50px;
@@ -1351,6 +1365,9 @@ onMounted(() => {
                                 box-sizing: border-box;
                             }
                         }
+                        .form-item:last-child {
+                            border-bottom: none !important;
+                        }
                     }
                 }
 
@@ -1364,7 +1381,7 @@ onMounted(() => {
                     border-radius: 15px;
                     padding: 0 18px;
                     margin-top: 14px;
-                    box-shadow: 0px 3px 27px 0px #0000001a;
+                    border: 1px solid #D1D9DD;
 
                     .label {
                         display: flex;
@@ -1388,17 +1405,17 @@ onMounted(() => {
                 }
 
                 .tips-wrapper {
-                    margin-top: 23px;
+                    margin: 16px 0 0 12px !important;
+                    padding: 0px !important;
                     .title,
                     .row {
                         font-weight: 400;
-                        font-size: 13px;
-                        color: rgba(0, 0, 0, 0.3);
+                        font-size: 12px;
+                        color: #A39F9F;
                     }
 
                     .row {
                         box-sizing: border-box;
-                        padding-left: 4px;
                     }
 
                     .more {

src/view/components/option-withdraw.vue

@@ -95,7 +95,6 @@
 <script setup>
 /* eslint-disable */
 import { defineProps, defineEmits, ref, onMounted, watch, computed, inject } from "vue";
-import 'element-plus/es/components/message/style/css'
 import { withdrawRequest, getWithdrawConfig } from "@/http/account";
 import { withdrawCalcFee } from "@/http/pay";
 import { debounce } from "@/uilts/help"
@@ -214,10 +213,6 @@ const withdraw = () => {
     params.withdrawReceiveAccount = params.withdrawReceiveAccount.replace(/\s*/g, "");
     params.amountValue = params.amountValue;
     if (parseInt(params.amountValue) > parseInt(canWithdrawBalance.value)) {
-        // ElMessage({
-        //     message: '大于可提现金额',
-        //     type: 'warning',
-        // })
         return;
     }
     withdrawIng.value = true;

src/view/components/options-transactions.vue

@@ -69,7 +69,7 @@
                                     Deposit
                                 </template>
                                 <template v-else-if="item.bizType == -1">
-                                    Withdrawal to PayPal
+                                    Withdrawal
                                 </template>
                                 <template v-else-if="item.bizType == -2">
                                     Giveaways
@@ -82,7 +82,7 @@
                                 <!-- 支出--提现 -->
                                 <template v-if="item.bizType == -1">
                                     <!-- 提现状态（0：已申请，1：支付中，2：提现成功，3：提现失败） -->
-                                    <template v-if="item.bizData.withdrawStatus == 1">
+                                    <template v-if="item.bizData.withdrawStatus == 0 || item.bizData.withdrawStatus == 1">
                                         <div class="balance">
                                             -{{ item.trxAmountValue || 0 }}
                                             <span>{{ item.trxAmountCurrencyInfo.currencyName }}</span>

src/view/components/paypal-button.vue

@@ -1,4 +1,5 @@
 <template>
+<!-- paypal 支付按钮 -->
     <div class="pay-wrapper">
         <div class="pay-msg">
             <div class="row">

src/view/components/top-up.vue

@@ -39,9 +39,13 @@
                 <div>3、同一个地址可多次充值，不影响到账。最小充值金额 0.0001。</div>
             </div>
         </div>
-        <div class="btn-done" @click="doneHandle">
+        <a-button class="btn-done" 
+            type="primary" 
+            shape="circle" 
+            :loading="asyncIng" 
+            @click="doneHandle">
             DONE
-        </div>
+        </a-button>
     </div>
 </template>
 
@@ -49,7 +53,7 @@
 /* eslint-disable */
 import { defineProps, defineEmits, onMounted, ref } from "vue";
 import { getTokenRechargeAddress } from "@/http/pay";
-import { ElMessage } from 'element-plus'
+import { message } from 'ant-design-vue';
 
 let QRCode = require('qrcode')
 let ClipboardJS = require('clipboard')
@@ -62,6 +66,10 @@ const props = defineProps({
         default: () => {
 
         }
+    },
+    asyncIng: {
+        type: Boolean,
+        default: false
     }
 })
 
@@ -86,14 +94,7 @@ const createQRCode = (str) => {
 const copyToken = () => {
     var clipboard = new ClipboardJS('.copy-btn');
     clipboard.on('success', function (e) {
-        ElMessage({
-            message: 'copy success',
-            grouping: true,
-            type: 'success',
-            offset: -16,
-            appendTo: document.body
-
-        })
+        message.success('copy success');
         console.info('Action:', e.action);
         console.info('Text:', e.text);
         console.info('Trigger:', e.trigger);
@@ -102,12 +103,7 @@ const copyToken = () => {
     });
 
     clipboard.on('error', function (e) {
-        ElMessage({
-            message: 'copy error',
-            grouping: true,
-            type: 'error',
-            offset: -16
-        })
+        message.error('copy error');
         console.error('Action:', e.action);
         console.error('Trigger:', e.trigger);
     });
@@ -151,10 +147,12 @@ onMounted(() => {
         height: calc(100% - 60px);
         overflow-y: scroll;
         .top {
+            width: 100%;
             display: flex;
 
             .item {
                 margin-right: 24px;
+                width: 48%;
 
                 .label {
                     color: #A0A0A0;
@@ -163,7 +161,7 @@ onMounted(() => {
 
                 .content {
                     height: 44px;
-                    width: 165px;
+                    width: 100%;
                     border-radius: 8px;
                     display: flex;
                     align-items: center;
@@ -231,7 +229,6 @@ onMounted(() => {
         background: #389AFF;
         width: 100%;
         height: 46px;
-        line-height: 46px;
         text-align: center;
         border-radius: 1000px;
         font-weight: 600;

src/view/popup/transactions.vue

@@ -1,7 +1,7 @@
 <template>
     <!-- 公共组件 -->
     <div class="info">
-        <v-head :title="'Transactions'" :show_more="false" @onBack="clickBack" ></v-head>
+        <v-head :title="'Transactions'" :show_more="false" :back_url="'/'" @onBack="clickBack" ></v-head>
         <options-transactions style="height: calc(100% - 48px);"></options-transactions>
     </div>