fix: 111

src/components/Toast/Confirm.vue

@@ -30,7 +30,7 @@
       </div>
       <div class="footer">
         <!-- <button @click="cancelCallback" size="mini" type="gray">取消</button> -->
-        <button @click="confirmCallback" size="mini" type="primary">确认</button>
+        <button @click="confirmCallback" size="mini" type="primary">{{t('confirm')}}</button>
       </div>
     </div>
   </div>
@@ -39,6 +39,7 @@
   <script lang="ts">
 // 注意：当前组件不是在 #app 下进行渲染，无法使用 #app 下的环境（全局组件，全局指令，原型属性函数）
 import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
 // import { onClickOutside } from '@vueuse/core'
 export default {
   name: 'showConfirm',
@@ -71,6 +72,7 @@ export default {
   },
   setup(props) {
     // 点击 target 目标元素外部相当于点击了取消
+    const { t } = useI18n()
     const target = ref(null)
     // onClickOutside(target, () => {
     //   props.cancelCallback()
@@ -82,7 +84,7 @@ export default {
       props.options.callback()
       props.close()
     }
-    return { options:props.options,target,confirmCallback,cancelCallback }
+    return { options:props.options,target,confirmCallback,cancelCallback, t }
   }
 }
 </script>

src/components/mobile/header.vue

@@ -1,14 +1,16 @@
 <script setup lang="ts">
 import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
 import logoCn from '@/assets/images/whietlogo.png'
 import logoEn from '@/assets/images/whietlogoEn.png'
-const language = ref('zh')
+
+const {locale } = useI18n();
 </script>
 
 <template>
   <div class="header">
     <div class="logo">
-      <img :src="language === 'zh' ? logoCn : logoEn" alt="logo">
+      <img :src="locale === 'zh' ? logoCn : logoEn" alt="logo">
     </div>
   </div>
 </template>

src/i18n/en.js

@@ -1,4 +1,5 @@
 export default {
+    confirm: 'confirm',
     payInfo: {
       payErr: 'Payment Error',
       payfail: 'Payment Failed',

src/i18n/zh.js

@@ -1,4 +1,5 @@
 export default {
+    confirm: '确认',
     payInfo: {
         payErr: '支付异常',
         payfail: '支付失败',

src/views/mobile/index.vue

@@ -281,7 +281,7 @@ async function handleOpenPay() {
         font-weight: 400;
         color: #ff0000;
         line-height: 19px;
-        letter-spacing: 4px;
+        // letter-spacing: 4px;
       }
     }
     .payBut {

src/views/pc/index.vue

@@ -101,9 +101,9 @@ async function getCode() {
     <div class="mall-pay">
       <div class="container">
         <div class="pay-header">
-          <div class="logo">
+          <!-- <div class="logo">
             <img :src="language === 'zh' ? logoCn : logoEn" alt="" />
-          </div>
+          </div> -->
           <p>{{ $t('mall.payCenter') }}</p>
         </div>
         <div class="pay-content">
@@ -115,10 +115,8 @@ async function getCode() {
             <span class="label"
               >{{ $t(`mall.${orderDetal.orderType == 'incrementOrder'?'vip':orderDetal.orderType == 'downOrder'?'downdesc':'goqy'}`) }}：
               <span v-for="(item,index) in orderDetal.goodsInfo" :key="index" style="margin-right:10px">
-                <span v-if="item"><span style="margin-right:5px">{{item.name}}</span> {{
-                  item.count
-                }}</span>
-                <span v-else>1</span>
+                <span v-if="item"><span v-if="index != 0">、</span><span style="margin-right:5px">{{item.name}}</span> <span v-if="orderDetal.orderType != 'downOrder'">× {{item.count}}</span></span> 
+                <!-- <span v-else>1</span> -->
                 <span v-if="orderDetal.orderType == 'incrementOrder'">，{{ $t(`payInfo.expiration`,{num:1}) }}</span>
                 </span
               ></span
@@ -133,7 +131,7 @@ async function getCode() {
             >
               <img :src="`${$cdn}images/ali-pay.png`" class="t-icon" alt />
               <h-icon type="vip_true" class="select-icon"></h-icon>
-              <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt />
+              <img src="@/assets/images/vip_true.svg" class="t-click" alt />
               {{ $t('mall.aliPay') }}
             </div>
             <div
@@ -143,7 +141,7 @@ async function getCode() {
             >
               <img :src="`${$cdn}images/wechat-pay.png`" class="t-icon" alt />
               <h-icon type="vip_true" class="select-icon"></h-icon>
-              <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt />
+              <img src="@/assets/images/vip_true.svg" class="t-click" alt />
               {{ $t('mall.wechatPay') }}
             </div>
             <div
@@ -154,7 +152,7 @@ async function getCode() {
             >
               <img :src="`${$cdn}images/paypal.png`" class="t-icon" alt />
               <h-icon type="vip_true" class="select-icon"></h-icon>
-              <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt />
+              <img src="@/assets/images/vip_true.svg" class="t-click" alt />
               paypal
             </div>
           </div>
@@ -166,7 +164,7 @@ async function getCode() {
                 v-if="qrCodeUrl"
                 :value="qrCodeUrl"
                 class="enter-x flex justify-center xl:justify-start"
-                :size="190"
+                :size="185"
               />
               <p>
                 {{
@@ -260,6 +258,7 @@ async function getCode() {
         }
         .t-click {
           display: block;
+          z-index: 1;
         }
       }
       .select-icon {