Browse Source

[edit] card cover UI

wenliming 2 years ago
parent
commit
ad0781b715

+ 13 - 3
src/view/components/custom-card-cover.vue

@@ -47,7 +47,10 @@
             }}</span>
         </div>
         <div class="money-area">
-            <div class="txt">{{data.currencyCode == 'USD' ? 'USD' : data.tokenSymbol}} GIVEAWAY</div>
+            <div class="txt">
+                <span>{{data.currencyCode == 'USD' ? 'US Dollar' : data.tokenSymbol}} </span>
+                &nbsp;GIVEAWAY
+            </div>
             <div class="coin">
                 <img :src="data.currencyIconUrl || imgHeaderCover" />
                 <span id="preview-after-amount"
@@ -115,7 +118,8 @@ const props = defineProps({
             return {
                 totalCount: 0,
                 amountValue: 0,
-                tokenSymbol: "",
+                tokenSymbol: '',
+                currencyCode: '',
                 type: 1,
                 validityDuration: '',
                 countDown: '',
@@ -180,9 +184,15 @@ onMounted(() => {
         .txt {
             font-weight: 800;
             font-size: 16px;
-            text-align: center;
             letter-spacing: 0.3px;
             color: #ffffff;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+
+            span {
+                color: #F9C545;
+            }
         }
 
         .coin {

+ 8 - 2
src/view/components/custom-card-horizontal-cover.vue

@@ -25,7 +25,8 @@
             </div>
             <div class="content-text">
                 <div class="title">
-                    {{data.tokenSymbol}} GIVEAWAY
+                    <span>{{data.currencyCode == 'USD' ? 'US Dollar' : data.tokenSymbol}} </span>
+                    &nbsp;GIVEAWAY
                 </div>
                 <div class="center"
                     :style="{
@@ -98,7 +99,8 @@ const props = defineProps({
             return {
                 totalCount: 0,
                 amountValue: 0,
-                tokenSymbol: "",
+                tokenSymbol: '',
+                currencyCode: '',
                 type: 1,
                 validityDuration: '',
                 customPosterUrl: '',
@@ -176,6 +178,10 @@ watch(() => props.data, () => {
             font-weight: 800;
             font-size: 16px;
             color: #ffffff;
+
+            span {
+                color: #F9C545;
+            }
         }
         .center {
             padding: 12px 0;

+ 4 - 1
src/view/iframe/publish/components/pay-button.vue

@@ -109,7 +109,10 @@ const balancePay = () => {
 }
 
 const clickPayUSD = () => {
-    if(finalAmountData.rechargeAmountValue > 0) {
+    if(props.finalAmountData.rechargeAmountValue > 0) {
+        setTimeout(() => {
+            emits("showDepositMask", {});
+        }, 1000)
         let guideUrl = chrome.runtime.getURL('/iframe/ach-cashier.html');
         setChromeStorage({ achPayInfo : JSON.stringify({'amountValue': props.finalAmountData.rechargeAmountValue})})    
         chrome.tabs.create({

+ 2 - 0
src/view/iframe/publish/components/preview-card.vue

@@ -22,6 +22,7 @@
                             totalCount: baseFormData.totalCount,
                             amountValue: baseFormData.amountValue,
                             tokenSymbol: currentCurrencyInfo.tokenSymbol,
+                            currencyCode: currentCurrencyInfo.currencyCode,
                             currencyIconUrl: currentCurrencyInfo.iconPath,
                             type: baseFormData.type,
                             validityDuration: baseFormData.validityDuration,
@@ -62,6 +63,7 @@
                             totalCount: baseFormData.totalCount,
                             amountValue: baseFormData.amountValue,
                             tokenSymbol: currentCurrencyInfo.tokenSymbol,
+                            currencyCode: currentCurrencyInfo.currencyCode,
                             currencyIconUrl: currentCurrencyInfo.iconPath,
                             type: baseFormData.type,
                             validityDuration: baseFormData.validityDuration,

+ 3 - 2
src/view/iframe/publish/give-dialog.vue

@@ -311,8 +311,8 @@
                                         ></preview-card>
                                     </div>
                                 </div>
-                                <!-- 需充值 && Number(baseFormData.amountValue) > Number(currentCurrencyInfo.balance) -->
-                                <div class="card-content" v-if="isMoneyRewardCpd">
+                                <!-- 需充值 -->
+                                <div class="card-content" v-if="isMoneyRewardCpd && Number(baseFormData.amountValue) > Number(currentCurrencyInfo.balance)">
                                     <template v-if="currentCurrencyInfo.currencyCode === 'USD'">
                                         <div class="card-title">
                                             <img class="img" :src=" require('@/assets/subject/top-02.svg') " />
@@ -381,6 +381,7 @@
                                     postId
                                 }"
                                 :currentCurrencyInfo="currentCurrencyInfo"
+                                @showDepositMask="showDepositMessageBox = true"
                                 @payFinish="payFinish">
                                 <template v-slot:balance>
                                     <div class="balance" v-if="Number(baseFormData.amountValue) <= Number(currentCurrencyInfo.balance)">

+ 1 - 0
src/view/iframe/red-packet/luck-draw.vue

@@ -239,6 +239,7 @@
                         totalCount: state.detail.totalCount,
                         amountValue: state.detail.amountValue,
                         tokenSymbol: state.detail.currencySymbol,
+                        currencyCode: state.detail.amountCurrencyCode,
                         currencyIconUrl: state.detail.currencyIconPath,
                         type: PlayType.lottery,
                         validityDuration: state.count_down_time,

+ 1 - 0
src/view/iframe/red-packet/red-packet.vue

@@ -240,6 +240,7 @@
               totalCount: state.detail.totalCount,
               amountValue: state.detail.amountValue,
               tokenSymbol: state.detail.currencySymbol,
+              currencyCode: state.detail.amountCurrencyCode,
               currencyIconUrl: state.detail.currencyIconPath,
               type: PlayType.common,
               validityDuration: state.detail.validityDuration,