[edit] input

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

@@ -141,7 +141,10 @@
                                                         prefix="=$"
                                                         suffix="USD">
                                                         <template v-slot:content>
-                                                            <input style="width: 60px"
+                                                            <input style="width: 85px"
+                                                                v-model="treasureFormData.usdEstimateOrderAmount"
+                                                                @input="onUsdEstimateOrderAmountInput"
+                                                                @blur="onUsdEstimateOrderAmountInput"
                                                                 placeholder="0"/>
                                                         </template>
                                                     </form-input>
@@ -197,7 +200,10 @@
                                                     <form-input :suffix="baseFormData.rewardType === RewardType.custom || currentCurrencyInfo.currencyCode ? currentPrizeCpd : ''">
                                                         <template v-slot:content>
                                                             <input style="width: 120px"
-                                                                placeholder="0"/>
+                                                                v-model="baseFormData.fansUnitAmountValue"
+                                                                placeholder="0"
+                                                                @input="onFansUnitAmountInput"
+                                                                @blur="onFansUnitAmountInput"/>
                                                         </template>
                                                     </form-input>
                                                     <form-input class="margin-left-10" 
@@ -205,7 +211,10 @@
                                                         suffix="USD">
                                                         <template v-slot:content>
                                                             <input style="width: 80px"
-                                                                placeholder="0"/>
+                                                                v-model="treasureFormData.usdEstimateFansUnitAmount"
+                                                                placeholder="0"
+                                                                @input="onUsdEstimateFansUnitAmountInput"
+                                                                @blur="onUsdEstimateFansUnitAmountInput"/>
                                                         </template>
                                                     </form-input>
                                                 </div>
@@ -625,7 +634,8 @@ let baseFormData = reactive({
     validityDuration: "",
     type: selectModeInfo.type,
     rewardType: RewardType.money,
-    customizedReward: ""
+    customizedReward: "",
+    fansUnitAmountValue: ""
 });
 
 const defaultCurrentCurrencyInfo = {
@@ -747,6 +757,11 @@ let toolBoxPageData = reactive({
     postEditorDefaultLinkTitle: ''
 })
 
+let treasureFormData = reactive({
+    usdEstimateOrderAmount: '',
+    usdEstimateFansUnitAmount: '',
+})
+
 
 const props = defineProps({
     dialogData: {
@@ -1334,6 +1349,98 @@ const delFollowUser = (params) => {
     atUserList.value.splice(params.index, 1);
 };
 
+const calcUsdEstimate = (params) => {
+    if(!currentCurrencyInfo.value.currencyCode) {
+        return;
+    }
+    let {type} = params;
+
+    let calcData = {amount: 0, usdPrice: currentCurrencyInfo.value.usdPrice};
+
+    switch (type) {
+        case 'ORDER_AMOUNT':
+            calcData.amount = baseFormData.amountValue;
+            treasureFormData.usdEstimateOrderAmount = calcToken2UsdEstimate(calcData);
+            break;
+        case 'FANS_AMOUNT':
+            calcData.amount = baseFormData.fansUnitAmountValue;
+            treasureFormData.usdEstimateFansUnitAmount = calcToken2UsdEstimate(calcData);
+            break;
+    }
+}
+
+const calcTokenEstimate = (params) => {
+    if(!currentCurrencyInfo.value.currencyCode) {
+        return;
+    }
+    let {type} = params;
+
+    let calcData = {amount: 0, usdPrice: currentCurrencyInfo.value.usdPrice};
+    
+    switch (type) {
+        case 'ORDER_AMOUNT':
+            calcData.amount = treasureFormData.usdEstimateOrderAmount;
+            baseFormData.amountValue = calcUsd2TokenEstimate(calcData);
+            break;
+        case 'FANS_AMOUNT':
+            calcData.amount = treasureFormData.usdEstimateFansUnitAmount;
+            baseFormData.fansUnitAmountValue = calcUsd2TokenEstimate(calcData);
+            break;
+    }
+}
+
+const calcToken2UsdEstimate = (params) => {
+    if(!params.amount) {
+        return '';
+    }
+    let val = +math.format(math.evaluate(`${params.amount} * ${params.usdPrice}`));
+    return val.toFixed(2);
+};
+
+const calcUsd2TokenEstimate = (params) => {
+    if(!params.amount) {
+        return '';
+    }
+    let val = +math.format(math.evaluate(`${params.amount} / ${params.usdPrice}`)) ;
+    return val;
+};
+
+const onUsdEstimateOrderAmountInput = () => {
+    let val = treasureFormData.usdEstimateOrderAmount;
+    val = val.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1');
+    if(val == '00') {
+        val = '0'
+    }
+    treasureFormData.usdEstimateOrderAmount = val;
+    calcTokenEstimate({type: 'ORDER_AMOUNT'});
+    onIptSetErrorTxt();
+    return val;
+};
+
+const onUsdEstimateFansUnitAmountInput = () => {
+    let val = treasureFormData.usdEstimateFansUnitAmount;
+    val = val.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1');
+    if(val == '00') {
+        val = '0'
+    }
+    treasureFormData.usdEstimateFansUnitAmount = val;
+    calcTokenEstimate({type: 'FANS_AMOUNT'});
+    onIptSetErrorTxt();
+    return val;
+}
+
+const onFansUnitAmountInput = () => {
+    let val = baseFormData.fansUnitAmountValue;
+    val = val.replace(/^\D*(\d*(?:\.\d{0,18})?).*$/g, '$1');
+    if(val == '00') {
+        val = '0'
+    }
+    baseFormData.fansUnitAmountValue = val;
+    calcUsdEstimate({type: 'FANS_AMOUNT'});
+    onIptSetErrorTxt();
+    return val;
+};
+
 const onAmountInput = () => {
     let val = baseFormData.amountValue;
     // val = val.replace(/[^\d^\.]+/g, "");
@@ -1353,7 +1460,6 @@ const onAmountInput = () => {
     }
 
     if (baseFormData.rewardType === RewardType.custom) {
-        const maxCount = 100000000;
         val = val.replace(/^(0)*/, '').replace(/\./, ''); // 通用奖品类型 过滤掉起始位的0和小数点符号
         if (val > maxCount) { 
             val = maxCount
@@ -1362,7 +1468,9 @@ const onAmountInput = () => {
     }
 
     baseFormData.amountValue = val;
-    setInputErrorMsg({from: 'amount', type:'input'});
+
+    calcUsdEstimate({type: 'ORDER_AMOUNT'});
+    onIptSetErrorTxt();
 
     return val;
 };
@@ -1381,19 +1489,19 @@ const onCountInput = () => {
     } 
 
     baseFormData.totalCount = val;
-    setInputErrorMsg({from: 'count', type:'input'});
+    onIptSetErrorTxt();
     return val;
 };
 
 const onValidityDurationInput = () => {
     validityDurationHandler()
-    let val = setInputErrorMsg();
+    let val = onIptSetErrorTxt();
     return val;
 }
 
 const onValidityDurationBlur = () => {
     validityDurationHandler();
-    let val = setInputErrorMsg();
+    let val = onIptSetErrorTxt();
     return val;
 }
 
@@ -1415,14 +1523,14 @@ const validityDurationHandler = () => {
  * 金额输入失焦
  */
 const onAmountBlur = () => {
-    setInputErrorMsg({from: 'amount', type:'blur'});
+    onIptSetErrorTxt();
 };
 
 /**
  * count失焦，校验输入结果
  */
 const onCountBlur = () => {
-    setInputErrorMsg({from: 'count', type:'blur'});
+    onIptSetErrorTxt();
 };
 
 /**
@@ -1476,28 +1584,35 @@ const checkUsdMinNumber = (isInTemplate) => {
     return forbiddenText;
 };
 
-/**
- * 设置输入提示语
- */
-const setInputErrorMsg = () => {
-    onIptSetErrorTxt();
+const treasureFormValidata = () => {
+    if(!currentCurrencyInfo.value.currencyCode) {
+        iptErrMsgTxt.value = "Select a reward"
+    } else if (!baseFormData.amountValue || baseFormData.amountValue == '0') {
+        iptErrMsgTxt.value = "Enter an amount";
+    } else {
+        iptErrMsgTxt.value = "";
+    }
 };
 
 /**
  * 输入时 检测设置错误信息
  */
 const onIptSetErrorTxt = (params = {}) => {
+    if(baseFormData.type == PlayType.treasure) {
+        treasureFormValidata();
+        return;
+    }
     if((baseFormData.rewardType === RewardType.money && !currentCurrencyInfo.value.currencyCode)
     || (baseFormData.rewardType === RewardType.custom && !baseFormData.customizedReward)) {
         iptErrMsgTxt.value = "Select a reward"
     } else if (!baseFormData.amountValue || baseFormData.amountValue == '0') {
         iptErrMsgTxt.value = "Enter an amount";
-    } else if (baseFormData.rewardType != PlayType.treasure && (!baseFormData.totalCount || baseFormData.totalCount == '0')) {
+    } else if (baseFormData.type != PlayType.treasure && (!baseFormData.totalCount || baseFormData.totalCount == '0')) {
         iptErrMsgTxt.value = "Enter the number of winners";
     } else if (iptErrMsgTxt.value = checkUsdMinNumber()) {
         // 最小法币金额限制
         return isShowUsdMinMessage.value = true;
-    } else if(baseFormData.rewardType === RewardType.money && baseFormData.rewardType != PlayType.treasure && +baseFormData.amountValue <= +currentCurrencyInfo.value.balance) {
+    } else if(baseFormData.rewardType === RewardType.money && baseFormData.type != PlayType.treasure && +baseFormData.amountValue <= +currentCurrencyInfo.value.balance) {
         // 输入金额 小于 余额
         let res = calcIptValue();
         if (!res.flag) {
@@ -1517,7 +1632,7 @@ const onIptSetErrorTxt = (params = {}) => {
         // 抽奖模式 没有输入时长
         iptErrMsgTxt.value = "Enter Automatically Draw";
     } else {
-        if(baseFormData.rewardType != PlayType.treasure) {
+        if(baseFormData.type != PlayType.treasure) {
             setDiscordErrTxt({getDuildId: true}, () => {
                 iptErrMsgTxt.value = '';
             });
@@ -1871,7 +1986,7 @@ const selectPublishMode = (params, index) => {
     selectModeInfo.type = params.type;
     baseFormData.type = params.type;
 
-    setInputErrorMsg();
+    onIptSetErrorTxt();
 }
 
 const clickLeftTab = (params, index) => {

src/view/iframe/publish/tool-box/child/preview.vue

@@ -198,7 +198,7 @@ const publishHandler = () => {
         return;
     }
 
-    if ((!appId || appId && !props.previewData.linkImagePath) && !props.screenshotWebsiteData.url) {
+    if ((!appId || appId && !props.previewData.linkImagePath) && (!props.screenshotWebsiteData.url || props.screenshotWebsiteData.status)) {
         loadingHide = message.loading('loading...', 0);
         return;
     }