wenliming 3 anos atrás
pai
commit
4ee701eb52

+ 3 - 7
src/logic/twitter.js

@@ -180,12 +180,7 @@ function _publishTweetEvent(contentStr, cb) {
         publishTweetBtn.addEventListener('click', function () {
             bindTwitterArt.needBind = true;
             bindTwitterArt.postId = contentStr;
-            isSetContent = false;
-            // setTimeout(() => {
-            //     _getTwitterArtId(contentStr, (twitterArtId) => {
             cb && cb()
-            //     });
-            // }, 1500)
         });
     }, 800)
 }
@@ -356,11 +351,12 @@ function _deNetBtnClick(port) {
 let isSetContent = false;
 function _setPublishContent(content) {
     setTimeout(() => {
-        // document.execCommand('selectAll')
-        // document.execCommand("Delete","false",null);
         if (!isSetContent) {
             isSetContent = true;
             document.execCommand("insertText", false, content);
+            setTimeout(() => {
+                isSetContent = false;
+            }, 2000)
         }
 
     }, 1000);

+ 43 - 7
src/view/components/currency-list.vue

@@ -11,8 +11,12 @@
             v-if="keywords"
             @click="clearIpt" >
         </div>
-        <div class="list-wrapper">
-            <div class="page-list" v-if="!showSearch">
+        <div class="list-wrapper" 
+            ref="listWrapperDom" 
+            @scroll="listScroll">
+            <div class="page-list" 
+                ref="listContentDom"
+                v-if="!showSearch">
                 <div class="list-item" v-for="(item, index) in currencyInfoList" :key="index">
 
                     <template v-if="props.page != 'top-up' || item.type != 1">
@@ -80,6 +84,15 @@ let showSearch = ref(false);
 let currencyInfoList = ref([]);
 let searchList = ref([]);
 let refreshRotate = ref(false);
+let listWrapperDom = ref(null);
+let listContentDom = ref(null);
+let listReqParams = {
+    params: {
+        pageNum: 1,
+        pageSize: 100,
+    },
+    loadMore: false,
+};
 
 const emits = defineEmits(["selectCurrency", "setCurrencyList"]);
 
@@ -149,16 +162,25 @@ const searchCurrency = debounce(function (searchWords) {
 const getCurrencyInfoList = () => {
     let params = {
         params: {
-            pageNum: 1,
-            pageSize: 100,
+            pageNum: listReqParams.params.pageNum,
+            pageSize: listReqParams.params.pageSize,
             filterFiatCurrency: props.page == 'top-up'
         }
     };
     getCurrencyInfo(params).then(res => {
         if (res.code == 0) {
-            currencyInfoList.value = res.data.currencyCategories;
-            if (params.params.pageNum < 2) {
-                emits('setCurrencyList', { list: currencyInfoList.value })
+            let resData = res.data;
+            if (resData && resData.currencyCategories.length) {
+                if (listReqParams.params.pageNum < 2) {
+                    currencyInfoList.value = res.data.currencyCategories;
+                    emits('setCurrencyList', { list: currencyInfoList.value })
+                } else {
+                    let data = currencyInfoList.value;
+                    let currencyCategories = resData.currencyCategories;
+                    data = data.concat(currencyCategories);
+                    currencyInfoList.value = data;
+                }
+                listReqParams.loadMore = false;
             }
         }
     })
@@ -180,6 +202,20 @@ const asyncTokenRechRecord = (cb) => {
     })
 }
 
+const listScroll = () => {
+    let wrapperHeight = listWrapperDom.value.offsetHeight;
+    let listContentHeight = listContentDom.value.offsetHeight;
+    let scrollTop = e.target.scrollTop || 0;
+    if (
+        listReqParams.loadMore === false &&
+        wrapperHeight + scrollTop >= listContentHeight
+    ) {
+        listReqParams.loadMore = true;
+        listReqParams.params.pageNum++;
+        getCurrencyInfoList();
+    }
+}
+
 onMounted(() => {
     getCurrencyInfoList();
 })

+ 18 - 6
src/view/components/custom-card-cover.vue

@@ -19,7 +19,10 @@
             <div class="txt">{{data.currencyCode == 'USD' ? 'USD' : data.tokenSymbol}} GIVEAWAY</div>
             <div class="coin">
                 <img :src="data.currencyIconUrl" />
-                <span>{{ data.amountValue }}</span>
+                <span id="preview-after-amount"
+                    :style="{
+                        fontSize: amountFontSize + 'px'
+                    }">{{ data.amountValue }}</span>
             </div>
             <div class="people">
                 {{ data.totalCount }} WINNERS TO SHARE
@@ -29,9 +32,9 @@
 </template>
 
 <script setup>
-import { defineProps, defineEmits } from "vue";
+import { defineProps, defineEmits, watch, ref } from "vue";
 
-defineProps({
+const props = defineProps({
     data: {
         type: Object,
         default: () => {
@@ -48,6 +51,15 @@ defineProps({
     },
 });
 
+let amountFontSize = ref(60);
+
+watch(() => props.data, () => {
+    let lenstr = document.querySelector('#preview-after-amount').innerHTML.length;
+    let num = parseInt(360/lenstr);
+    amountFontSize.value = num < 56 ? num : 56;
+})
+
+
 const emits = defineEmits(["clickOpenRedPacket"]);
 
 const open = () => {
@@ -182,13 +194,13 @@ const open = () => {
     }
 
     .open-gif {
-        width: 164px;
-        height: 194px;
+        width: 200px;
+        height: 200px;
         text-align: center;
         position: absolute;
         bottom: 90px;
         left: 50%;
-        margin-left: -82px;
+        margin-left: -100px;
         z-index: 3;
     }
 }

+ 91 - 63
src/view/components/give-dialog.vue

@@ -1,28 +1,21 @@
 <template>
     <div class="overlay" v-if="visible">
-        <div
-            class="content"
+        <div class="content"
             :style="{
                 height: dialogHeight + 'px',
-                width: showComType != 'preview' ? '600px' : 'auto',
-            }"
-        >   
+                width: showComType != 'preview' ? '600px' : 'auto'}">   
             <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"
-                            v-if="showComType == 'default'"
+                        <img  class="icon-close"
                             :src="require('../../assets/svg/icon-close.svg')"
-                        />
-                        <img
-                            class="icon-close"
-                            v-else
+                            v-if="showComType == 'default'"/>
+                        <img class="icon-close"
                             :src="require('../../assets/svg/icon-back.svg')"
-                        />
+                            v-else/>
                     </div>
                     <div class="title">
                         {{ currentComData[showComType]["title"] }}
@@ -47,7 +40,7 @@
             <div class="body">
                 <!-- 充值组件 -->
                 <top-up v-if="showComType == 'topUp'" 
-                    :currentCurrencyInfo="currentCurrencyInfo"
+                    :currentCurrencyInfo="tempCurrentCurrencyInfo"
                     @topUpDone="topUpDone"></top-up>
                 <!-- 表单填写容器 -->
                 <div class="body-content" v-if="showComType != 'topUp'">
@@ -61,12 +54,8 @@
 
                     <div class="left">
                         <div class="gift-pack-wrapper">
-                            <img
-                                class="icon"
-                                :src="
-                                    require('../../assets/svg/icon-gift-pack.svg')
-                                "
-                            />
+                            <img class="icon"
+                                :src="require('../../assets/svg/icon-gift-pack.svg')"/>
                         </div>
                         <div class="bottom">
                         </div>
@@ -126,7 +115,7 @@
                                 </div>
                             </div>
                             <!-- 刷新按钮、充值 -->
-                            <div class="form-base-help">
+                            <div class="form-base-help" v-show="currentCurrencyInfo.currencyCode">
                                 <div class="currency-operation">
                                     <div class="balance">
                                         <img
@@ -260,6 +249,7 @@
                                 :currentCurrencyInfo="currentCurrencyInfo"
                                 :postData="publishRes"
                                 :baseFormData="baseFormData"
+                                :amountFontSize="previewFontSize"
                             ></preview-card>
                         </template>
                         <!-- paypal支付按钮 -->
@@ -293,11 +283,11 @@
 </template>
 
 <script setup>
-import { ref, watch, reactive, defineProps, defineEmits, onMounted } from "vue";
-import { postPublish, verifyPaypalResult, syncChainTokenRechargeRecord } from "../../http/publishApi";
-import { payCalcFee, getPayConfig } from "../../http/pay";
-import { getFrontConfig } from "../../http/account";
-import { scaleNumber } from "../../uilts/help"
+import { ref, watch, reactive, defineProps, defineEmits, onMounted, nextTick } from "vue";
+import { postPublish, verifyPaypalResult, syncChainTokenRechargeRecord } from "@/http/publishApi";
+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";
 
@@ -315,7 +305,7 @@ const config = {
 }
 const math = create(all, config);
 
-let tempCurrentCurrencyInfo = {};
+let tempCurrentCurrencyInfo = ref({});
 
 let paypalClientId = ref("");
 let payConfig = ref({})
@@ -344,7 +334,7 @@ let submitIng = ref(false);
 // 艾特关注人列表
 let atUserList = ref([]);
 
-let iptErrMsgTxt = ref("Please enter the ‘reward’ amount");
+let iptErrMsgTxt = ref("Please select a currency");
 
 // 是否返回
 let isBack = ref(false);
@@ -359,6 +349,8 @@ let currencyListDom = ref(null);
 
 let refreshRotate = ref(false);
 
+let previewFontSize = ref(56);
+
 let postId = ref('');
 
 let messageBoxData = ref({
@@ -460,6 +452,8 @@ const setDialogHeight = () => {
 
     if (dialogHeight.value > clientHeight - gapSafe) {
         dialogHeight.value = clientHeight - gapSafe;
+    } else {
+        dialogHeight.value = 680;
     }
 };
 
@@ -496,7 +490,7 @@ const confirm = () => {
 };
 
 const selectCurrency = (params) => {
-    tempCurrentCurrencyInfo = params;
+    tempCurrentCurrencyInfo.value = params;
     if(params.currencyCode != "USD" && params.balance < params.minAmount) {
         let tokenSymbol = params.currencyCode == 'USD' ? 'USD' : params.tokenSymbol;
         messageBoxBlock({
@@ -507,9 +501,25 @@ const selectCurrency = (params) => {
         currentCurrencyInfo.value = params;
         showCurrencyPop.value = false;
         finalAmountData.value.currencyCode = currentCurrencyInfo.value.currencyCode;
+        calcDomZoom();
+        resetFormIpt();
+        onIptSetErrorTxt();
     }
 };
 
+const calcDomZoom = () => {
+    nextTick(() => {
+        var textWidth = document.querySelector('.text').offsetWidth;
+        var scale = 68 / textWidth;
+        document.querySelector('.text').style.zoom = scale;
+    }) 
+}
+
+const resetFormIpt = () => {
+    baseFormData.amountValue = "";
+    baseFormData.totalCount = "";
+}
+
 /**
  * 设置默认使用货币
  */
@@ -517,8 +527,8 @@ const selectCurrency = (params) => {
 const setCurrentCurrencyInfo = (params) => {
     let {list} = params;
     if(list && list.length && list[0].data && list[0].data.length) {
-        currentCurrencyInfo.value = list[0].data[0];
-        finalAmountData.value.currencyCode = currentCurrencyInfo.value.currencyCode;
+        // currentCurrencyInfo.value = list[0].data[0];
+        // finalAmountData.value.currencyCode = currentCurrencyInfo.value.currencyCode;
     }
 }
 
@@ -529,9 +539,12 @@ const messageBoxBlock = ({ title = "", content = "" }) => {
 };
 
 const messageBoxCancel = () => {
-    currentCurrencyInfo.value = tempCurrentCurrencyInfo;
+    currentCurrencyInfo.value = tempCurrentCurrencyInfo.value;
     showMessageBox.value = false;
     showCurrencyPop.value = false;
+    calcDomZoom();
+    resetFormIpt();
+    onIptSetErrorTxt();
 };
 
 const messageBoxConfirm = () => {
@@ -548,15 +561,14 @@ const goTopUp = () => {
 
 /**
  * 充值done事件
- * 更新货币列表
  */
 const topUpDone = () => {
-    currentCurrencyInfo.value = tempCurrentCurrencyInfo;
-    asyncTokenRechRecord((data) => {
+    currentCurrencyInfo.value = tempCurrentCurrencyInfo.value;
+    asyncTokenRechRecord((res) => {
         showCurrencyPop.value = false;
         showComType.value = 'default';
-        if(data && data.length) {
-            let currencyInfo = data[0];
+        if(res.code == 0 && res.data && res.data.length) {
+            let currencyInfo = res.data[0];
             if(currencyInfo.currencyCode == currentCurrencyInfo.value.currencyCode) {
                 currentCurrencyInfo.value.balance = currencyInfo.balance;
             }
@@ -571,9 +583,9 @@ const updateCurrencyBanlce = () => {
             refreshRotate.value = false;
         }, 1000)
     }
-    asyncTokenRechRecord((data) => {
-        if(data && data.length) {
-            let currencyInfo = data[0];
+    asyncTokenRechRecord((res) => {
+        if(res.code == 0 && res.data && res.data.length) {
+            let currencyInfo = res.data[0];
             if(currencyInfo.currencyCode == currentCurrencyInfo.value.currencyCode) {
                 currentCurrencyInfo.value.balance = currencyInfo.balance;
             }
@@ -590,9 +602,7 @@ const asyncTokenRechRecord = (cb) => {
             currencyCode: currentCurrencyInfo.value.currencyCode
         }
     }).then(res => {
-        if(res.code == 0) {
-            cb && cb(res.data)
-        }
+        cb && cb(res)
     })
 }
 
@@ -649,6 +659,7 @@ const submitRequest = async () => {
             publishRes = res.data;
             postId.value = res.data.postId;
             showComType.value = "preview";
+            previewFontSize.value = calcFontSize(baseFormData.amountValue, 238, 56);
             isBack.value = false;
         } else {
             console.log(res);
@@ -659,17 +670,24 @@ const submitRequest = async () => {
     });
 };
 
+const calcFontSize = (str, domWidth, maxSize) => {
+    let lenstr = str.length;
+    let num = parseInt(domWidth / lenstr);
+    let fontSize = num < maxSize ? num : maxSize
+    return fontSize;
+}
+
 /**
  * 初始化提交参数
  */
 const initParams = () => {
-    baseFormData.amountValue = "";
-    baseFormData.totalCount = "";
+    resetFormIpt();
     formList[0].text = [];
     atUserList.value = [];
     submitIng.value = false;
     isBack.value = false;
     showCurrencyPop.value = false;
+    openAntiBot.value = false;
 };
 
 /**
@@ -754,6 +772,10 @@ const onAmountInput = () => {
     let val = baseFormData.amountValue;
     // val = val.replace(/[^\d^\.]+/g, "");
     val = val.replace(/^\D*(\d*(?:\.\d{0,18})?).*$/g, '$1');
+
+    if(val == '00') {
+        val = '0'
+    }
     baseFormData.amountValue = val;
     setInputErrorMsg({from: 'amount', type:'input'});
 
@@ -832,8 +854,7 @@ const calcIptValue = (cb) => {
 /**
  * 设置输入提示语
  */
-const setInputErrorMsg = (params, cb) => {
-    let {from, type} = params;
+const setInputErrorMsg = (params) => {
 
     // let amountValue = baseFormData.amountValue;
     // let num = amountValue, scale = 1;
@@ -844,11 +865,11 @@ const setInputErrorMsg = (params, cb) => {
     //     scale = obj.scale;
     // }
 
-    if(type == 'input') {
-        onIptSetErrorTxt({...params});
-    } else if(type == 'blur') {
-        setIsEmptyTxt();
-    }
+    // if(type == 'input') {
+        onIptSetErrorTxt(params);
+    // } else if(type == 'blur') {
+    //     setIsEmptyTxt();
+    // }
 };
 
 /**
@@ -875,13 +896,18 @@ const setIsEmptyTxt = () => {
  * 输入时 检测设置错误信息
  */
 const onIptSetErrorTxt = (params) => {
-    let {from, type,} = params;
-    if(+baseFormData.amountValue < +currentCurrencyInfo.value.balance) {
+    if(!currentCurrencyInfo.value.currencyCode) {
+        iptErrMsgTxt.value = "Please select a currency"
+    } else if (!baseFormData.amountValue) {
+        iptErrMsgTxt.value = "Please enter the ‘reward’ amount";
+    } else if (!baseFormData.totalCount) {
+            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 reduce the ‘winners’ amount to ${res.count}`;
         } else {
-            setIsEmptyTxt();
+            iptErrMsgTxt.value = "";
         }
     } else if(currentCurrencyInfo.value.currencyCode != 'USD') {
         iptErrMsgTxt.value = `Insufficient ${currentCurrencyInfo.value.currencyName} balance, please recharge`;
@@ -931,6 +957,9 @@ onMounted(() => {
             }
         }
     };
+    window.onresize = throttle(function () {
+        setDialogHeight()
+    }, 300)
 });
 </script>
 
@@ -1228,20 +1257,19 @@ onMounted(() => {
                             }
                             .currency-select {
                                 max-width: 124px;
-                                box-shadow: 5px 0 10px -5px #0000001A;
-                                padding: 16px 0 16px 14px;
-                                border-bottom-left-radius: 12px;
-                                border-top-left-radius: 12px;
                                 cursor: pointer;
+                                background: #F4F4F4;
+                                margin-left: 6px;
+                                padding: 10px;
+                                border-radius: 12px;
                                 .text {
-                                    max-width: 68px;
-                                    overflow: hidden;
+                                    // max-width: 68px;
+                                    // overflow: hidden;
                                     white-space: nowrap;
                                     text-overflow: ellipsis;
                                 }
                                 .arrow {
                                     margin-left: 5px;
-                                    margin-right: 10px;
                                 }
                             }
                         }

+ 17 - 4
src/view/components/preview-card.vue

@@ -80,9 +80,14 @@
                         <div class="title">
                             {{currentCurrencyInfo.tokenSymbol}} GIVEAWAY
                         </div>
-                        <div class="center">
+                        <div class="center"
+                            :style="{
+                                fontSize: amountFontSize + 'px'
+                            }">
                             <img :src="currentCurrencyInfo.iconPath" class="icon">
-                            {{baseFormData.amountValue}}
+                            <span id="preview-before-amount">
+                                {{baseFormData.amountValue}}
+                            </span>
                         </div>
                         <div class="desc">
                             {{baseFormData.totalCount}} WINNERS TO SHARE
@@ -95,7 +100,7 @@
 </template>
 
 <script setup>
-import { ref, defineProps, onMounted, nextTick } from "vue";
+import { ref, defineProps, onMounted, nextTick, watch } from "vue";
 
 import customCardCover from './custom-card-cover.vue'
 
@@ -128,6 +133,10 @@ defineProps({
 
             }
         }
+    },
+    amountFontSize: {
+        type: Number,
+        default: '56'
     }
 })
 
@@ -220,13 +229,17 @@ onMounted(() => {
         }
         .left {
             width: 430px;
+            .tips {
+                right: 15px !important;
+            }
         }
 
         .after-cover-wrapper {
             position:relative;
             width:375px;
-            margin-left: 53px;
+            margin-left: 58px;
             margin-top: -10px;
+            margin-bottom: 20px;
 
             .icon-gif {
                 position: absolute;