Commit 69ef3c03 authored by tyyin lan's avatar tyyin lan

chore(积分充值): 英语语言页面布局适配

parent b639055e
......@@ -144,12 +144,13 @@ function handleNavigateToEquity() {
<i class="iconfont icon-gift text-[14px] text-[#000dff]"></i>
<n-ellipsis>
<n-number-animation
<!-- <n-number-animation
v-if="userStore.equityInfo.points"
:from="0"
:to="userStore.equityInfo.points"
:precision="2"
/>
/> -->
<span v-if="userStore.equityInfo.points">{{ userStore.equityInfo.points }}</span>
<span v-else class="ml-[5px]">-</span>
</n-ellipsis>
</span>
......
......@@ -5,14 +5,16 @@ import {
fetchGetPayStatus,
fetchGetPointsGiftPackageList,
} from '@/apis/equity'
import { useSystemLanguageStore } from '@/store/modules/system-language'
import { useUserStore } from '@/store/modules/user'
import { ref, watch } from 'vue'
import { computed, ref, watch } from 'vue'
import { useI18n } from 'vue-i18n'
const isShowPointRechargeModal = defineModel<boolean>('isShowPointRechargeModal', { default: false })
const { t } = useI18n()
const userStore = useUserStore()
const systemLanguageStore = useSystemLanguageStore()
const currentSelectPackage = ref<0 | 1 | 2>(0) // 1:100积分 2:350积分 3:600积分
const currentPaymentMethod = ref<'alipay' | 'wechatpay'>('alipay')
......@@ -45,6 +47,8 @@ const currentPayPrice = ref(0)
let payStatusTimer: NodeJS.Timeout | null = null
let controller: AbortController | null = null
const isEnglishLanguage = computed(() => systemLanguageStore.currentLanguageInfo.key === 'en')
watch(isShowPointRechargeModal, (newVal) => {
if (newVal) {
getPointsGiftPackageList()
......@@ -230,7 +234,7 @@ function handlePayQrCodeRefresh() {
:on-after-leave="onModalAfterLeave"
>
<div v-if="!pointsGiftPackageListLoading">
<ul class="mt-[10px] flex h-[255px]">
<ul class="mt-[10px] flex" :class="isEnglishLanguage ? 'h-[285px]' : 'h-[255px]'">
<li
v-for="(packageItem, packageIndex) in pointsGiftPackageList"
:key="packageItem.id"
......@@ -261,13 +265,15 @@ function handlePayQrCodeRefresh() {
{{ t('common_module.buy_now') }}
</button>
<ul class="ml-[20px] mt-[26px]">
<li class="mb-[8px] flex items-center text-[14px] text-[#482801]">
<ul class="ml-[20px] mt-[26px] pr-[8px]">
<li class="mb-[8px] flex text-[14px] text-[#482801]">
<span
class="mr-[5px] inline-block h-[6px] w-[6px] rounded-full"
class="mr-[5px] mt-[8px] inline-block h-[6px] w-[6px] shrink-0 rounded-full"
:class="currentSelectPackage === packageIndex ? 'bg-[#FFEAC8]' : 'bg-[#EBD8BE]'"
></span>
{{ t('equity_module.get_points_for_interacting_with_the_ai', { points: packageItem.points }) }}
<div class="text-start">
{{ t('equity_module.get_points_for_interacting_with_the_ai', { points: packageItem.points }) }}
</div>
</li>
<li class="mb-[8px] flex items-center text-[14px] text-[#482801]">
<span
......@@ -339,19 +345,19 @@ function handlePayQrCodeRefresh() {
<div class="mt-[10px] flex items-center justify-center">
<template v-if="currentPaymentMethod === 'alipay'">
<img class="mr-[5px] mt-[6px] h-[16px] w-[16px]" src="@/assets/images/equity/alipay-icon.png" alt="alipay" />
<span class="font-600 text-[16px]"
>{{ t('common_module.alipay') }} {{ t('equity_module.scan_code_payment')
}}<span class="text-[24px] text-[#F25744]">{{ currentPayPrice }}</span
></span
>
<span class="font-600 text-[16px]">
{{ t('common_module.alipay') }} {{ t('equity_module.scan_code_payment') }}
<span class="text-[24px] text-[#F25744]">{{ currentPayPrice }}</span>
</span>
</template>
<template v-else-if="currentPaymentMethod === 'wechatpay'">
<img class="mr-[5px] mt-[6px] h-[16px] w-[16px]" src="@/assets/images/equity/wechat-icon.png" alt="alipay" />
<span class="font-600 text-[16px]"
>{{ t('common_module.wechat') }} {{ t('equity_module.scan_code_payment')
}}<span class="text-[24px] text-[#F25744]">{{ currentPayPrice }}</span
></span
>
<span class="font-600 text-[16px]">
{{ t('common_module.wechat') }} {{ t('equity_module.scan_code_payment') }}
<span class="text-[24px] text-[#F25744]"> {{ currentPayPrice }}</span>
</span>
</template>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment