Merge branch 'master' of http://git.izouma.com/xiongzhu/paimaide

index.html

@@ -6,7 +6,6 @@
     <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
     <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
     <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
-    <link rel="manifest" href="/site.webmanifest">
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="viewport"
         content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
@@ -18,6 +17,7 @@
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-title" content="Ionic App" />
     <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+    <meta name="theme-color" content="#161616">
     <title>FirstCash</title>
 </head>
 

package.json

@@ -32,6 +32,7 @@
     "@ionic/vue": "^6.3.8",
     "@ionic/vue-router": "^6.3.8",
     "@vant/area-data": "^1.3.2",
+    "@vueuse/components": "^9.10.0",
     "@vueuse/core": "^9.6.0",
     "axios": "^1.2.0",
     "capacitor-openinstall": "https://github.com/x1ongzhu/capacitor-openinstall.git",
@@ -61,7 +62,8 @@
     "eslint-plugin-vue": "^9.3.0",
     "prettier": "^2.7.1",
     "vite": "^3.2.4",
-    "vite-plugin-imagemin": "^0.6.1"
+    "vite-plugin-imagemin": "^0.6.1",
+    "vite-plugin-pwa": "^0.14.1"
   },
   "overrides": {
     "@capacitor-community/media": {

public/site.webmanifest

@@ -1 +0,0 @@
-{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

src/assets/logo.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"  xmlns:v="https://vecta.io/nano"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>

src/components/CommissionItem.vue

@@ -1,9 +1,6 @@
 <template>
     <div class="commission-item">
         <div class="head">
-            <ion-thumbnail class="avatar">
-                <img :src="detail.junior.avatar" />
-            </ion-thumbnail>
             <div class="name">{{ detail.junior.nickname }}</div>
             <div class="num">{{ $t('distribution.commission') }}: +{{ detail.amount }}</div>
         </div>
@@ -12,15 +9,21 @@
                 <img :src="detail.order.pic[0]" />
             </ion-thumbnail>
             <div class="info">
-                <div class="name">{{ getLocaleString(detail.order.name) }}</div>
+                <div class="name">
+                    {{ getLocaleString(detail.order.name) }}
+                </div>
                 <div class="price">
                     <div class="value">{{ $t('balance.symbol') }}100</div>
-                    <div class="num">×1</div>
                 </div>
             </div>
         </div>
-        <div class="prop">{{ $t('order.id') }}: {{ detail.orderId }}</div>
-        <div class="prop">{{ $t('order.createdAt') }}: {{ detail.createdAt }}</div>
+        <div class="bottom">
+            <div class="num">×1</div>
+            <div class="props">
+                <div class="prop">{{ $t('order.id') }}: {{ detail.orderId }}</div>
+                <div class="prop">{{ $t('order.createdAt') }}: {{ detail.createdAt }}</div>
+            </div>
+        </div>
     </div>
 </template>
 <script setup>
@@ -39,13 +42,16 @@ const props = defineProps({
 </script>
 <style lang="less" scoped>
 .commission-item {
-    margin: 0 16px 10px 16px;
-    background: var(--ion-color-step-0);
-    border-radius: 2px;
-    padding: 0 15px 12px 15px;
+    margin: 0 16px 15px 16px;
+    background: #2c302f;
+    border-radius: 8px;
+    padding-bottom: 12px;
     .head {
         height: 44px;
-        border-bottom: 1px solid var(--ion-color-step-50);
+        background: #3d403f;
+        padding: 0 15px;
+        color: #c7f2df;
+        border-radius: 8px 8px 0 0;
         .f();
         .avatar {
             width: 24px;
@@ -54,12 +60,11 @@ const props = defineProps({
         }
         .name {
             flex-grow: 1;
-            font-size: 14px;
-            margin-left: 6px;
+            font-size: 16px;
+            font-weight: bold;
         }
         .num {
-            font-size: 13px;
-            color: #ff7f1f;
+            font-size: 14px;
             font-weight: bold;
         }
     }
@@ -67,43 +72,70 @@ const props = defineProps({
         .f();
         margin-top: 14px;
         margin-bottom: 10px;
+        padding: 0 15px;
         .cover {
             width: 50px;
             height: 50px;
+            min-width: 50px;
             --border-radius: 4px;
         }
         .info {
+            height: 50px;
             margin-left: 10px;
+            flex-basis: 0;
             flex-grow: 1;
+            min-width: 0;
             .name {
+                max-width: 100%;
                 font-size: 14px;
+                color: #c7f2df;
+                font-weight: bold;
                 line-height: 20px;
+                .ellipsis();
             }
             .price {
                 .f();
                 margin-top: 5px;
                 line-height: 17px;
-                font-size: 12px;
+                font-size: 14px;
                 width: 100%;
+                color: #c7f2df;
+                font-weight: bold;
                 .value {
                     flex-grow: 1;
                 }
-                .num {
-                    color: var(--ion-color-step-350);
-                }
             }
         }
     }
     .prop {
-        font-size: 12px;
-        line-height: 17px;
-        color: var(--ion-color-step-600);
-        margin-top: 5px;
+        font-size: 10px;
+        line-height: 14px;
+        color: #9fbfb1;
+        margin-top: 4px;
     }
 }
-.dark {
-    .commission-item {
-        background: var(--ion-color-step-50);
+.commission-item.darker {
+    background: #1c1c1c;
+    .head {
+        background: #202020;
+    }
+}
+.bottom {
+    padding: 0 15px;
+    .f();
+    align-items: stretch;
+    .num {
+        width: 50px;
+        .f;
+        justify-content: center;
+        font-size: 14px;
+        color: #c7f2df;
+        font-weight: bold;
+    }
+    .props {
+        margin-left: 10px;
+        border-top: 0.5px solid #a6a6a6;
+        flex-grow: 1;
     }
 }
 </style>

src/components/CommissionItem1.vue

@@ -1,133 +0,0 @@
-<template>
-    <div class="commission-item">
-        <div class="head">
-            <div class="name">{{ detail.junior.nickname }}</div>
-            <div class="num">{{ $t('distribution.commission') }}: +{{ detail.amount }}</div>
-        </div>
-        <div class="order">
-            <ion-thumbnail class="cover">
-                <img :src="detail.order.pic[0]" />
-            </ion-thumbnail>
-            <div class="info">
-                <div class="name">{{ getLocaleString(detail.order.name) }}</div>
-                <div class="price">
-                    <div class="value">{{ $t('balance.symbol') }}100</div>
-                </div>
-            </div>
-        </div>
-        <div class="bottom">
-            <div class="num">×1</div>
-            <div class="props">
-                <div class="prop">{{ $t('order.id') }}: {{ detail.orderId }}</div>
-                <div class="prop">{{ $t('order.createdAt') }}: {{ detail.createdAt }}</div>
-            </div>
-        </div>
-    </div>
-</template>
-<script setup>
-import { ref, computed, onMounted } from 'vue'
-const props = defineProps({
-    detail: {
-        type: Object,
-        default: () => {
-            return {
-                junior: {},
-                order: { pic: [] }
-            }
-        }
-    }
-})
-</script>
-<style lang="less" scoped>
-.commission-item {
-    margin: 0 16px 10px 16px;
-    background: var(--ion-color-step-0);
-    border-radius: 2px;
-    padding: 0 15px 12px 15px;
-    .head {
-        height: 44px;
-        border-bottom: 1px solid var(--ion-color-step-50);
-        .f();
-        .avatar {
-            width: 24px;
-            height: 24px;
-            --border-radius: 2px;
-        }
-        .name {
-            flex-grow: 1;
-            font-size: 16px;
-            color: #c7f2df;
-            font-weight: bold;
-        }
-        .num {
-            font-size: 14px;
-            color: #c7f2df;
-            font-weight: bold;
-        }
-    }
-    .order {
-        .f();
-        margin-top: 14px;
-        margin-bottom: 10px;
-        .cover {
-            width: 50px;
-            height: 50px;
-            --border-radius: 4px;
-        }
-        .info {
-            margin-left: 10px;
-            flex-grow: 1;
-            .name {
-                font-size: 14px;
-                color: #c7f2df;
-                font-weight: bold;
-                line-height: 20px;
-            }
-            .price {
-                .f();
-                margin-top: 5px;
-                line-height: 17px;
-                font-size: 14px;
-                width: 100%;
-                color: #c7f2df;
-                font-weight: bold;
-                .value {
-                    flex-grow: 1;
-                }
-                .num {
-                    color: var(--ion-color-step-350);
-                }
-            }
-        }
-    }
-    .prop {
-        font-size: 10px;
-        line-height: 14px;
-        color: #9fbfb1;
-        margin-top: 4px;
-    }
-}
-.dark {
-    .commission-item {
-        background: var(--ion-color-step-50);
-    }
-}
-
-.bottom {
-    .f;
-    align-items: stretch;
-    .num {
-        width: 50px;
-        .f;
-        justify-content: center;
-        font-size: 14px;
-        color: #c7f2df;
-        font-weight: bold;
-    }
-    .props {
-        margin-left: 10px;
-        border-top: 0.5px solid #a6a6a6;
-        flex-grow: 1;
-    }
-}
-</style>

src/components/OrderItem.vue

@@ -12,7 +12,7 @@
         </div>
 
         <div class="order-content" @click="goDetail">
-            <van-image class="suk-img" width="80" height="80" fit="fill" :src="pic" />
+            <van-image class="suk-img" width="80" height="80" fit="cover" :src="pic" />
 
             <div class="order-text">
                 <div class="van-ellipsis text1">{{ getLocaleString(productInfo.name) }}</div>
@@ -63,9 +63,9 @@
             </template>
 
             <template v-else-if="info.status == 'CONFIRMED'">
-                <van-button color="#AAACAD" plain size="small" @click="applyShip">
+                <!-- <van-button color="#AAACAD" plain size="small" @click="applyShip">
                     {{ $t('order.applyShip') }}
-                </van-button>
+                </van-button> -->
                 <van-button type="primary" size="small" @click="show = true" v-if="delegationActive">
                     {{ $t('delegate.title') }}
                 </van-button>

src/components/Record.vue

@@ -1,156 +0,0 @@
-<template>
-    <div class="record">
-        <div class="top">
-            <span>申请时间：{{ info.createdAt }}</span>
-            <span>{{ withdrawStatus[info.status] }}</span>
-        </div>
-        <div class="money">
-            <span>+{{ info.amount }}</span>
-            <span>元</span>
-        </div>
-        <div class="moeny-list">
-            <div class="money-item">
-                <div class="val">{{ info.amount }}</div>
-                <div class="name">申请佣金</div>
-            </div>
-            <div class="money-item">
-                <div class="val">{{ info.auditAmount || info.amount }}</div>
-                <div class="name">实际金额</div>
-            </div>
-            <div class="money-item">
-                <div class="val">0</div>
-                <div class="name">提现手续费</div>
-            </div>
-        </div>
-        <van-button
-            class="button"
-            color="#FF8F00"
-            block
-            plain
-            hairline
-            @click="goNext('commissionRecordList', { id: info.id })"
-        >
-            <div class="button-content">
-                <span>查看提现详情</span>
-                <img src="../assets/icon_inter_pre.png" class="next" alt="" />
-            </div>
-        </van-button>
-    </div>
-</template>
-<script>
-import { mapState } from 'pinia'
-import { useUserStore } from '@/stores/user'
-import { withdrawStatus } from '../status'
-export default {
-    props: {
-        info: {
-            type: Object,
-            default: () => {
-                return {}
-            }
-        }
-    },
-    data() {
-        return {
-            withdrawStatus
-        }
-    },
-    computed: {
-        ...mapState(useUserStore, ['user'])
-    }
-}
-</script>
-<style lang="less" scoped>
-.record {
-    margin: 0 0 10px;
-    background: rgba(var(--ion-text-color-rgb), 1);
-    border-radius: 2px;
-    padding: 0 15px;
-}
-
-.button {
-    height: 36px;
-    border-color: var(--ion-color-step-0) !important;
-    font-size: 12px;
-    line-height: 36px;
-
-    .next {
-        width: 24px;
-        height: 24px;
-    }
-
-    .button-content {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-top: 1px solid #f2f4f5;
-    }
-}
-
-.top {
-    height: 44px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    font-size: 13px;
-    color: rgba(102, 102, 102, 1);
-    line-height: 18px;
-    span {
-        &:last-child {
-            font-size: 13px;
-            font-weight: bold;
-            color: rgba(255, 143, 0, 1);
-            line-height: 18px;
-        }
-    }
-}
-
-.money {
-    height: 64px;
-    background: rgba(255, 143, 0, 0.12);
-    border-radius: 2px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    span {
-        &:first-child {
-            font-size: 24px;
-            font-weight: bold;
-            color: rgba(var(--ion-color-light-contrast-rgb), 1);
-            line-height: 28px;
-        }
-        &:last-child {
-            font-size: 12px;
-            font-weight: bold;
-            color: rgba(var(--ion-color-light-contrast-rgb), 1);
-            line-height: 17px;
-            margin-left: 4px;
-        }
-    }
-}
-.moeny-list {
-    display: flex;
-    align-items: center;
-    height: 81px;
-
-    .money-item {
-        width: 33%;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        .val {
-            font-size: 14px;
-            font-weight: bold;
-            color: rgba(var(--ion-color-light-contrast-rgb), 1);
-            line-height: 20px;
-        }
-
-        .name {
-            font-size: 12px;
-            color: rgba(102, 102, 102, 1);
-            line-height: 17px;
-            margin-top: 4px;
-        }
-    }
-}
-</style>

src/components/RecordOrder.vue

@@ -1,140 +0,0 @@
-<template>
-    <div class="orderInfo">
-        <div class="top">
-            <!-- <div class="label">一级分销</div> -->
-            <div class="value">{{ commissionStatus[status] }}</div>
-        </div>
-        <div class="center">
-            <van-image class="suk-img" width="50" height="50" fit="fill" :src="info.pic" />
-
-            <div class="right">
-                <div class="text1">{{ info.name }}</div>
-                <div class="text2">{{ $t('balance.symbol') }}{{ info.price }}</div>
-            </div>
-            <div class="num">×1</div>
-        </div>
-
-        <div class="order-info">
-            <div class="order-item">订单编号：{{ info.orderId }}</div>
-            <div class="order-item">下单时间：{{ info.createdAt }}</div>
-        </div>
-
-        <div class="money">
-            <span>申请佣金: {{ info.commission }} 元</span>
-            <span>审核佣金：{{ info.commission }} 元</span>
-        </div>
-    </div>
-</template>
-<script>
-import { mapState } from 'pinia'
-import { useUserStore } from '@/stores/user'
-import { commissionStatus } from '../status'
-export default {
-    name: 'orderInfo',
-    props: {
-        info: {
-            type: Object,
-            default: () => {
-                return {}
-            }
-        },
-        status: {
-            type: String,
-            default: ''
-        }
-    },
-    data() {
-        return {
-            commissionStatus
-        }
-    },
-    computed: {
-        ...mapState(useUserStore, ['user'])
-    }
-}
-</script>
-<style lang="less" scoped>
-.orderInfo {
-    background: rgba(var(--ion-text-color-rgb), 1);
-    border-radius: 2px;
-    padding: 0 15px 15px;
-    margin-bottom: 10px;
-}
-
-.top {
-    position: relative;
-    height: 44px;
-    text-align: right;
-    border-bottom: 1px solid #f2f4f5;
-    .label {
-        width: 70px;
-        height: 24px;
-        background: rgba(255, 143, 0, 1);
-        border-radius: 0px 100px 100px 0px;
-        font-size: 12px;
-        color: rgba(var(--ion-text-color-rgb), 1);
-        line-height: 24px;
-        text-align: center;
-        position: absolute;
-        left: 0;
-        top: 10px;
-    }
-
-    .value {
-        font-size: 13px;
-        font-weight: bold;
-        color: rgba(255, 143, 0, 1);
-        line-height: 44px;
-    }
-}
-.center {
-    display: flex;
-    // align-items: center;
-    padding: 15px 0 0;
-    .right {
-        flex-grow: 1;
-        margin-left: 10px;
-        .text1 {
-            font-size: 14px;
-            color: rgba(var(--ion-color-light-contrast-rgb), 1);
-            line-height: 20px;
-        }
-        .text2 {
-            font-size: 12px;
-            color: rgba(var(--ion-color-light-contrast-rgb), 1);
-            line-height: 17px;
-            margin-top: 5px;
-        }
-    }
-
-    .num {
-        font-size: 14px;
-        color: rgba(170, 172, 173, 1);
-        line-height: 20px;
-        align-self: flex-end;
-    }
-}
-
-.order-info {
-    margin-top: 10px;
-    .order-item {
-        font-size: 12px;
-        color: rgba(102, 102, 102, 1);
-        line-height: 17px;
-        &:not(:last-child) {
-            margin-bottom: 5px;
-        }
-    }
-}
-
-.money {
-    padding: 15px 0 0;
-    font-size: 14px;
-    font-weight: bold;
-    color: rgba(var(--ion-color-light-contrast-rgb), 1);
-    line-height: 20px;
-    span {
-        margin-right: 20px;
-    }
-}
-</style>

src/locales/en.json

@@ -1,243 +1,254 @@
 {
-  "balance": {
-    "availableWidthdrawAmount": "Amount that can be withdrawn",
-    "balance": "Account Balance",
-    "chooseAmount": "select amount",
-    "confirmWithdraw": "Confirm withdrawal",
-    "inputCustomAmount": "Please enter a custom amount",
-    "realReceipt": "Actual account",
-    "recharge": "recharge",
-    "record": {
-      "commission": "commission",
-      "pay": "to pay",
-      "receipt": "collect money",
-      "recharge": "recharge",
-      "withdraw": "withdraw"
-    },
-    "symbol": "$",
-    "totalWithdraw": "Cumulative withdrawal",
-    "unit": "Yuan",
-    "withdraw": "withdraw",
-    "withdrawAmount": "Withdrawal Amount",
-    "withdrawAmountError": "Please enter the correct withdrawal amount",
-    "withdrawFee": "Withdrawal fee",
-    "withdrawFeeTip0": "Note: 1/3 of the total transaction fee for the purchase is",
-    "withdrawFeeTip1": ", the excess handling fee",
-    "withdrawInputTip": "Please enter the withdrawal amount",
-    "withdrawModalTitle": "Apply for withdrawal",
-    "withdrawSuccess": "Successful withdrawal",
-    "withdrawing": "Withdrawing",
-    "rechargeMax": "The maximum recharge amount is {value}",
-    "rechargeMin": "The minimum recharge amount is {value}"
-  },
-  "cancel": "Cancel",
-  "common": {
-    "alert": "hint",
+    "balance": {
+        "availableWidthdrawAmount": "Amount that can be withdrawn",
+        "balance": "Account Balance",
+        "chooseAmount": "select amount",
+        "confirmWithdraw": "Confirm withdrawal",
+        "inputCustomAmount": "Please enter a custom amount",
+        "realReceipt": "Actual account",
+        "recharge": "recharge",
+        "record": {
+            "commission": "commission",
+            "pay": "to pay",
+            "receipt": "collect money",
+            "recharge": "recharge",
+            "withdraw": "withdraw"
+        },
+        "symbol": "$",
+        "totalWithdraw": "Cumulative withdrawal",
+        "unit": "Yuan",
+        "withdraw": "withdraw",
+        "withdrawAmount": "Withdrawal Amount",
+        "withdrawAmountError": "Please enter the correct withdrawal amount",
+        "withdrawFee": "Withdrawal fee",
+        "withdrawFeeTip0": "Note: 1/3 of the total transaction fee for the purchase is",
+        "withdrawFeeTip1": ", the excess handling fee",
+        "withdrawInputTip": "Please enter the withdrawal amount",
+        "withdrawModalTitle": "Apply for withdrawal",
+        "withdrawSuccess": "Successful withdrawal",
+        "withdrawing": "Withdrawing",
+        "rechargeMax": "The maximum recharge amount is {value}",
+        "rechargeMin": "The minimum recharge amount is {value}"
+    },
     "cancel": "Cancel",
-    "confirm": "Sure",
-    "eula": "Platform",
-    "guide": "Tutorial",
-    "home": "Home",
-    "loadFinish": "download finished",
-    "loading": "Loading",
-    "mine": "Mine",
-    "more": "More",
-    "news": "News",
-    "pullRefresh": "Pull down to refresh",
-    "rank": "leaderboard",
-    "register": "register",
-    "updateSuccess": "update completed",
-    "profit": "Commission",
-    "noRecords": "No records",
-    "notAvailable": "Not available",
-    "wait": "stay tuned"
-  },
-  "delegate": {
-    "tip": "The consignment sale has not started yet, it will start today at ${time}",
-    "title": "Consignment",
-    "increase": "mark up",
-    "originalPrice": "original price",
-    "payServiceCharge": "pay processing fees",
-    "sellPrice": "selling price",
-    "tip1": "Note: entrusting the platform to sell services, the maximum price of the product can be increased by {riseRatePercent}% each time, and the platform will charge {serviceCharge}% of the custody service fee"
-  },
-  "distribution": {
-    "commission": "commission",
-    "joinTeamAt": "time to join the team",
-    "myInvitor": "my recommender",
-    "myProfit": "Income",
-    "orderNum": "number of order",
-    "profitDetails": "Revenue Details",
-    "qrCode": "my promo code",
-    "teamNum": "Team size",
-    "totalProfit": "Total revenue",
-    "viewDetail": "view details",
-    "viewTeam": "view team",
-    "saveImg": "save Picture",
-    "empty": "no yet",
-    "invite": "To invite"
-  },
-  "home": {
-    "all": "All"
-  },
-  "login": "Log in",
-  "loginPage": {
-    "agreement": "User Agreement",
-    "codePla": "please enter verification code",
-    "goRegister": "Sign up now",
-    "invitorPla": "Invitation code (optional)",
-    "isRead": "have read and agreed",
-    "loginByCode": "Verification code login",
-    "loginNow": "Already have an account, log in now",
-    "loginPwd": "password login",
-    "loginSuceess": "login successful",
-    "noAcount": "No account yet?",
-    "noAgree": "Please read and agree to the registration agreement",
-    "phone": "phone number",
-    "phoneError": "Wrong format of phone number",
-    "phonePla": "Please enter phone number",
-    "username": "Username",
-    "enterUsername": "Enter your username",
-    "psd": "password",
-    "psdAgainError": "The two passwords entered are inconsistent",
-    "psdAgainPla": "please enter password again",
-    "psdPla": "please enter password",
-    "register": "Register an account",
-    "registerSuccess": "registration success",
-    "sendCode": "Send code",
-    "sended": "Sented",
-    "psdEorror": "Wrong format of password",
-    "nameError": "Account length 6-20, can only contain numbers, letters and underscores, not pure numbers"
-  },
-  "mine": {
-    "address": "Address",
-    "avatar": "Avatar",
-    "bankCard": "Bank Card",
-    "bindPhone": "Bind Phone",
-    "female": "Female",
-    "logout": "sign out",
-    "male": "male",
-    "newProfit": "new income",
-    "nickname": "Nick Name",
-    "noBind": "unbound",
-    "noLogin": "not logged in",
-    "noSetting": "not set",
-    "setting": "Setting",
-    "sex": "Gender",
-    "user": "User",
-    "common": "Common Functions",
-    "nickPlac": "Please enter a nickname",
-    "sure": "Confirm the changes"
-  },
-  "news": {
-    "newsNull": "There is no news~"
-  },
-  "order": {
-    "buyNow": "Buy Now",
-    "createSuccess": "Order successfully created",
-    "createdAt": "order time",
-    "detail": "order details",
-    "id": "order number",
-    "my": "My Order",
-    "payInfo": "Payment Information",
-    "payMethod": "payment method",
-    "payMethodName": {
-      "balance": "balance payment"
-    },
-    "payNow": "pay immediately",
-    "processing": "Processing",
-    "status": {
-      "ALL": "all",
-      "CANCELED": "Cancelled",
-      "CONFIRMED": "For Sale",
-      "NOT_CONFIRMED": "Waiting for the seller to confirm receipt",
-      "NOT_PAID": "Pending",
-      "NOT_SHIPPED": "to be delivered",
-      "RECEIVED": "received",
-      "SELLING": "Selling",
-      "SHIPPED": "Shipped",
-      "SOLD": "Sold",
-      "SOLD_NOT_CONFIRMED": "To be confirmed receipt",
-      "SOLD_NOT_PAID": "pending buyer payment"
-    },
-    "statusDesc": {
-      "CANCELED": "The order has been cancelled, if you have any questions, please contact customer service",
-      "CONFIRMED": "To be entrusted, it will be put on the shelves within 24 hours after entrusting",
-      "NOT_CONFIRMED": "Waiting for the seller to confirm receipt",
-      "NOT_PAID": "Please pay as soon as possible, overtime unpaid orders will be automatically canceled",
-      "NOT_SHIPPED": "to be delivered",
-      "RECEIVED": "received",
-      "SELLING": "In entrustment, if you have any questions, please contact customer service",
-      "SHIPPED": "Shipped",
-      "SOLD": "Sold, please contact customer service if you have any questions",
-      "SOLD_NOT_CONFIRMED": "To be confirmed receipt",
-      "SOLD_NOT_PAID": "pending buyer payment"
-    },
-    "total": "total",
-    "totalPayment": "actual payment",
-    "walletPay": "wallet payment",
-    "applyShip": "Apply for delivery",
-    "confirmReceipt": "confirm the receipt of goods",
-    "countDown": "Automatically cancel the order when the payment countdown expires",
-    "hasProblem": "Encounter problems?",
-    "payAt": "Payment time",
-    "viewOrder": "check order",
-    "mint": "Minute",
-    "second": "Second",
-    "stopSale": "Suspension of sale"
-  },
-  "product": {
-    "dailyEarning": "Daily Income",
-    "detail": "Product Details",
-    "hot": "Hot snapping up…",
-    "nowPrice": "Current",
-    "owner": "Product Holder",
-    "search": "search",
-    "searchNo": "No products were found~",
-    "searchPla": "Enter search keywords",
-    "start": "back grab",
-    "tomorrowBuy": "Available",
-    "priceNow": "Current",
-    "riseDesc": "Daily Income",
-    "tag": "Digital Artwork"
-  },
-  "rank": {
-    "inviteNum": "New recruits",
-    "profitInfo": "Earnings information",
-    "rank": "Ranking",
-    "rankByInvite": "Invite Ranking",
-    "rankByProfit": "Revenue Ranking",
-    "userInfo": "User Info",
-    "withdrawRechargeRate": "Recharge revenue ratio"
-  },
-  "settings": {
-    "darkMode": "Dark Mode"
-  },
-  "title": {
-    "balanceRecord": "Transaction details",
-    "distribution": "revenue center",
-    "myTeam": "my team"
-  },
-  "user": {
-    "notLogin": "User is not logged in, do you want to log in now?",
-    "profile": "Edit Information",
-    "wallet": "My purse"
-  },
-  "blf": {
-    "has": "Remaining places",
-    "pic": "illustrate",
-    "tips": "Pledge your balance, and enjoy today's dividends through the platform's overall pledge balance ratio, and the highest daily chemical income can get 1%",
-    "buy": "snap up now"
-  },
-  "tutorial": {
-    "step1": "Step 1: Scan the QR code of the recommender, fill in the registration information, and click register to complete the registration",
-    "step2": "Step 2: After registration, save the QR code and share it with more users to register",
-    "step3": "Step 3: Log in to the app, click on the wallet recharge amount",
-    "step4": "Step 4: Select or enter the amount to be recharged for recharge",
-    "step5": "Step 5: Select the session, click home, and select the initial session. Each user of the primary session is limited to two collections per day, the intermediate session is open from 4:00 pm to 5:00 pm every day, and the advanced session is open from 3:00 pm to 4:00 pm every day.",
-    "step6": "Step 6: Purchase collections, if the wallet balance is insufficient, you need to recharge the wallet balance",
-    "step7": "Step 7: When entrusting the collection to be put on the shelves in the order, you need to pay the platform a commission fee of 4%, and the collection range corresponding to the collection is 6% of the time of purchase.",
-    "step8": "Step 8: If the amount is sufficient, you can directly purchase the collection and then entrust it to be put on the shelf",
-    "step9": "Note: After purchasing 2 pieces, the primary field cannot purchase collections next time, and each user is limited to purchase 2 pieces per day"
-  }
+    "common": {
+        "alert": "hint",
+        "cancel": "Cancel",
+        "confirm": "Sure",
+        "eula": "Platform",
+        "guide": "Tutorial",
+        "home": "Home",
+        "loadFinish": "download finished",
+        "loading": "Loading",
+        "mine": "Mine",
+        "more": "More",
+        "news": "News",
+        "pullRefresh": "Pull down to refresh",
+        "rank": "leaderboard",
+        "register": "register",
+        "updateSuccess": "update completed",
+        "profit": "Commission",
+        "noRecords": "No records",
+        "notAvailable": "Not available",
+        "wait": "stay tuned",
+        "save": "Save"
+    },
+    "delegate": {
+        "tip": "The consignment sale has not started yet, it will start today at ${time}",
+        "title": "Consignment",
+        "increase": "mark up",
+        "originalPrice": "original price",
+        "payServiceCharge": "pay processing fees",
+        "sellPrice": "selling price",
+        "tip1": "Note: entrusting the platform to sell services, the maximum price of the product can be increased by {riseRatePercent}% each time, and the platform will charge {serviceCharge}% of the custody service fee"
+    },
+    "distribution": {
+        "commission": "commission",
+        "joinTeamAt": "time to join the team",
+        "myInvitor": "my recommender",
+        "myProfit": "Income",
+        "orderNum": "number of order",
+        "profitDetails": "Revenue Details",
+        "qrCode": "my promo code",
+        "teamNum": "Team size",
+        "totalProfit": "Total revenue",
+        "viewDetail": "view details",
+        "viewTeam": "view team",
+        "saveImg": "save Picture",
+        "empty": "no yet",
+        "invite": "To invite"
+    },
+    "home": {
+        "all": "All"
+    },
+    "login": "Log in",
+    "loginPage": {
+        "agreement": "User Agreement",
+        "codePla": "please enter verification code",
+        "goRegister": "Sign up now",
+        "invitorPla": "Invitation code (optional)",
+        "isRead": "have read and agreed",
+        "loginByCode": "Verification code login",
+        "loginNow": "Already have an account, log in now",
+        "loginPwd": "password login",
+        "loginSuceess": "login successful",
+        "noAcount": "No account yet?",
+        "noAgree": "Please read and agree to the registration agreement",
+        "phone": "phone number",
+        "phoneError": "Wrong format of phone number",
+        "phonePla": "Please enter phone number",
+        "username": "Username",
+        "enterUsername": "Enter your username",
+        "psd": "password",
+        "psdAgainError": "The two passwords entered are inconsistent",
+        "psdAgainPla": "please enter password again",
+        "psdPla": "please enter password",
+        "register": "Register an account",
+        "registerSuccess": "registration success",
+        "sendCode": "Send code",
+        "sended": "Sented",
+        "psdEorror": "Wrong format of password",
+        "nameError": "Account length 6-20, can only contain numbers, letters and underscores, not pure numbers"
+    },
+    "mine": {
+        "address": "Address",
+        "avatar": "Avatar",
+        "bankCard": "Bank Account",
+        "bindPhone": "Bind Phone",
+        "female": "Female",
+        "logout": "sign out",
+        "male": "male",
+        "newProfit": "new income",
+        "nickname": "Nick Name",
+        "noBind": "Not added",
+        "noLogin": "not logged in",
+        "noSetting": "not set",
+        "setting": "Setting",
+        "sex": "Gender",
+        "user": "User",
+        "common": "Common Functions",
+        "nickPlac": "Please enter a nickname",
+        "sure": "Confirm the changes"
+    },
+    "news": {
+        "newsNull": "There is no news~"
+    },
+    "order": {
+        "buyNow": "Buy Now",
+        "createSuccess": "Order successfully created",
+        "createdAt": "order time",
+        "detail": "order details",
+        "id": "order number",
+        "my": "My Order",
+        "payInfo": "Payment Information",
+        "payMethod": "payment method",
+        "payMethodName": {
+            "balance": "balance payment"
+        },
+        "payNow": "pay immediately",
+        "processing": "Processing",
+        "status": {
+            "ALL": "all",
+            "CANCELED": "Cancelled",
+            "CONFIRMED": "For Sale",
+            "NOT_CONFIRMED": "Waiting for the seller to confirm receipt",
+            "NOT_PAID": "Pending",
+            "NOT_SHIPPED": "to be delivered",
+            "RECEIVED": "received",
+            "SELLING": "Selling",
+            "SHIPPED": "Shipped",
+            "SOLD": "Sold",
+            "SOLD_NOT_CONFIRMED": "To be confirmed receipt",
+            "SOLD_NOT_PAID": "pending buyer payment"
+        },
+        "statusDesc": {
+            "CANCELED": "The order has been cancelled, if you have any questions, please contact customer service",
+            "CONFIRMED": "To be entrusted, it will be put on the shelves within 24 hours after entrusting",
+            "NOT_CONFIRMED": "Waiting for the seller to confirm receipt",
+            "NOT_PAID": "Please pay as soon as possible, overtime unpaid orders will be automatically canceled",
+            "NOT_SHIPPED": "to be delivered",
+            "RECEIVED": "received",
+            "SELLING": "In entrustment, if you have any questions, please contact customer service",
+            "SHIPPED": "Shipped",
+            "SOLD": "Sold, please contact customer service if you have any questions",
+            "SOLD_NOT_CONFIRMED": "To be confirmed receipt",
+            "SOLD_NOT_PAID": "pending buyer payment"
+        },
+        "total": "total",
+        "totalPayment": "actual payment",
+        "walletPay": "wallet payment",
+        "applyShip": "Apply for delivery",
+        "confirmReceipt": "confirm the receipt of goods",
+        "countDown": "Automatically cancel the order when the payment countdown expires",
+        "hasProblem": "Encounter problems?",
+        "payAt": "Payment time",
+        "viewOrder": "check order",
+        "mint": "Minute",
+        "second": "Second",
+        "stopSale": "Suspension of sale"
+    },
+    "product": {
+        "dailyEarning": "Daily Income",
+        "detail": "Product Details",
+        "hot": "Hot snapping up…",
+        "nowPrice": "Current",
+        "owner": "Product Holder",
+        "search": "search",
+        "searchNo": "No products were found~",
+        "searchPla": "Enter search keywords",
+        "start": "back grab",
+        "tomorrowBuy": "Available",
+        "priceNow": "Current",
+        "riseDesc": "Daily Income",
+        "tag": "Digital Artwork"
+    },
+    "rank": {
+        "inviteNum": "New recruits",
+        "profitInfo": "Earnings information",
+        "rank": "Ranking",
+        "rankByInvite": "Invite Ranking",
+        "rankByProfit": "Revenue Ranking",
+        "userInfo": "User Info",
+        "withdrawRechargeRate": "Recharge revenue ratio"
+    },
+    "settings": {
+        "darkMode": "Dark Mode"
+    },
+    "title": {
+        "balanceRecord": "Transaction details",
+        "distribution": "revenue center",
+        "myTeam": "my team"
+    },
+    "user": {
+        "notLogin": "User is not logged in, do you want to log in now?",
+        "profile": "Edit Information",
+        "wallet": "My purse"
+    },
+    "blf": {
+        "has": "Remaining places",
+        "pic": "illustrate",
+        "tips": "Pledge your balance, and enjoy today's dividends through the platform's overall pledge balance ratio, and the highest daily chemical income can get 1%",
+        "buy": "snap up now"
+    },
+    "tutorial": {
+        "step1": "Step 1: Scan the QR code of the recommender, fill in the registration information, and click register to complete the registration",
+        "step2": "Step 2: After registration, save the QR code and share it with more users to register",
+        "step3": "Step 3: Log in to the app, click on the wallet recharge amount",
+        "step4": "Step 4: Select or enter the amount to be recharged for recharge",
+        "step5": "Step 5: Select the session, click home, and select the initial session. Each user of the primary session is limited to two collections per day, the intermediate session is open from 4:00 pm to 5:00 pm every day, and the advanced session is open from 3:00 pm to 4:00 pm every day.",
+        "step6": "Step 6: Purchase collections, if the wallet balance is insufficient, you need to recharge the wallet balance",
+        "step7": "Step 7: When entrusting the collection to be put on the shelves in the order, you need to pay the platform a commission fee of 4%, and the collection range corresponding to the collection is 6% of the time of purchase.",
+        "step8": "Step 8: If the amount is sufficient, you can directly purchase the collection and then entrust it to be put on the shelf",
+        "step9": "Note: After purchasing 2 pieces, the primary field cannot purchase collections next time, and each user is limited to purchase 2 pieces per day"
+    },
+    "bank": {
+        "bank": "Bank",
+        "addBankCard": "Add Bank Account",
+        "cardNumber": "Card Number",
+        "cardName": "Name on Card",
+        "phone": "Phone Number",
+        "mail": "Mail",
+        "saveBankCard": "Save Bank Account",
+        "selectBank": "Select Bank"
+    }
 }

src/locales/zh.json

@@ -25,7 +25,8 @@
         "updateSuccess": "更新成功",
         "noRecords": "暂无记录",
         "notAvailable": "暂未开放",
-        "wait": "敬请期待"
+        "wait": "敬请期待",
+        "save": "保存"
     },
     "order": {
         "id": "订单编号",
@@ -230,13 +231,23 @@
     },
     "tutorial": {
         "step1": "第一步：扫一扫推荐人二维码，填写注册信息，点击register完成注册",
-        "step2":"第二步：注册完保存二维码分享给更多用户来注册",
-        "step3":"第三步：登陆app，点击钱包充值金额",
-        "step4":"第四步：选择或者输入需要充值的金额进行充值",
-        "step5":"第五步：选择场次，点击home，选择初场次，初级场每个用户每天限购二个藏品，中级场每天下午四点到五点限时开放，高级场每天下午三点到四点开放。",
-        "step6":"第六步：购买藏品，钱包余额不足需要充值钱包余额",
-        "step7":"第七步：在订单中藏品委托上架，需要支付给平台4%的委托手续费，藏品对应的藏品幅度为购买时候的6%。",
-        "step8":"第八步：金额充足的情况下可以直接购买藏品然后委托上架",
-        "step9":"注：购买2个过后初级场就不可以在次进行购买藏品，每个用户每天限购2个"
+        "step2": "第二步：注册完保存二维码分享给更多用户来注册",
+        "step3": "第三步：登陆app，点击钱包充值金额",
+        "step4": "第四步：选择或者输入需要充值的金额进行充值",
+        "step5": "第五步：选择场次，点击home，选择初场次，初级场每个用户每天限购二个藏品，中级场每天下午四点到五点限时开放，高级场每天下午三点到四点开放。",
+        "step6": "第六步：购买藏品，钱包余额不足需要充值钱包余额",
+        "step7": "第七步：在订单中藏品委托上架，需要支付给平台4%的委托手续费，藏品对应的藏品幅度为购买时候的6%。",
+        "step8": "第八步：金额充足的情况下可以直接购买藏品然后委托上架",
+        "step9": "注：购买2个过后初级场就不可以在次进行购买藏品，每个用户每天限购2个"
+    },
+    "bank": {
+        "bank": "银行",
+        "addBankCard": "添加银行卡",
+        "cardNumber": "银行卡号",
+        "cardName": "持卡人姓名",
+        "phone": "手机号",
+        "mail": "邮箱",
+        "saveBankCard": "保存银行卡",
+        "selectBank": "选择银行"
     }
 }

src/plugins/http.js

@@ -34,6 +34,14 @@ axiosInstance.interceptors.response.use(
 
 const http = {
     token,
+    baseURL,
+    resolve(path) {
+        let base = baseURL
+        if (!baseURL.startsWith('http')) {
+            base = new URL(baseURL, window.location.origin).href
+        }
+        return new URL(path, base).href
+    },
     setToken(_token) {
         token.value = _token
         if (_token) {

src/router/index.js

@@ -45,11 +45,6 @@ const router = createRouter({
                         allowGuest: true
                     }
                 },
-                {
-                    path: '/distribution',
-                    name: 'distribution',
-                    component: () => import('@/views/DistributionPage.vue')
-                },
                 {
                     path: 'rank',
                     name: 'rank',
@@ -67,7 +62,7 @@ const router = createRouter({
                     }
                 },
                 {
-                    path: '/distribution1',
+                    path: 'distribution1',
                     name: 'distribution1',
                     component: () => import('@/views/DistributionPage.vue')
                 }
@@ -203,6 +198,24 @@ const router = createRouter({
             meta: {
                 allowGuest: true
             }
+        },
+        {
+            path: '/webView',
+            name: 'webView',
+            component: () => import('@/views/WebViewPage.vue'),
+            meta: {
+                allowGuest: true
+            }
+        },
+        {
+            path: '/userBank',
+            name: 'userBank',
+            component: () => import('@/views/UserBankPage.vue')
+        },
+        {
+            path: '/editBank',
+            name: 'editBank',
+            component: () => import('@/views/EditBankPage.vue')
         }
     ]
 })

src/styles/common.less

@@ -9,8 +9,20 @@
 }
 
 .gt() {
-    background: linear-gradient(135deg, #d700ff 0%, #3e22ff 100%);
+    background: linear-gradient(90deg, #dfffcd 0%, #90f9c4 48%, #39f3bb 100%);
     background-clip: text;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }
+.ellipsis() {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+.ellipsisLn(@line) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: @line;
+    -webkit-box-orient: vertical;
+}

src/styles/main.less

@@ -1,17 +1,26 @@
 :root {
     --van-primary-color: #2d2d2d;
     --van-tabbar-item-icon-margin-bottom: 2px;
-    --van-dialog-confirm-button-text-color: #a108ff;
+    --van-dialog-confirm-button-text-color: #42f4bc;
     --van-button-default-color: #aaacad;
     --van-gray-6: #c8c9cc;
-    --yellow: #FFF43E;
+    --yellow: #fff43e;
     --red: #ff0000;
-    --green: #1AFF47;
+    --green: #1aff47;
     --van-empty-padding: 100px 10px;
     --van-empty-image-size: 200px;
     --van-empty-description-font-size: 14px;
     --van-empty-description-color: #737373;
     --van-empty-description-margin-top: 16px;
+    --van-cell-line-height: 28px;
+    --van-cell-text-color: #9fbfb1;
+    --van-cell-value-color: #668577;
+    --van-cell-font-size: 14px;
+    --van-cell-vertical-padding: 9px;
+    --van-cell-horizontal-padding: 15px;
+    --van-cell-background: #2c302f;
+    --van-cell-group-background: #2c302f;
+    --van-cell-active-color: shade(#2c302f, 10%);
 }
 .van-theme-dark .van-empty {
     opacity: 1;
@@ -43,12 +52,12 @@ ion-toast.error-toast {
 
 ion-toolbar {
     --border-style: none;
-    --background: var(--ion-color-step-0);
+    --background: #161616;
     ion-back-button {
-        --color: var(--ion-color-step-900);
+        --color: #ffffff;
     }
     ion-button {
-        --color: var(--ion-color-step-900);
+        --color: #ffffff;
     }
 }
 ion-refresher {
@@ -73,8 +82,9 @@ ion-modal.dialog {
     color: var(--ion-color-step-400) !important;
 }
 .van-button--primary {
-    background: linear-gradient(135deg, #d700ff 0%, #3e22ff 100%);
-    border-width: 0;
+    background: linear-gradient(90deg, #dfffcd 0%, #91fac5 48%, #39f3bb 100%);
+    color: #000000;
+    border: none;
 }
 .van-button--plain {
     background: transparent;
@@ -84,7 +94,7 @@ ion-modal.dialog {
     --van-button-normal-font-size: 14px;
 }
 .gt {
-    background: linear-gradient(135deg, #d700ff 0%, #3e22ff 100%);
+    background: linear-gradient(90deg, #dfffcd 0%, #90f9c4 48%, #39f3bb 100%);
     background-clip: text;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;

src/styles/theme/variables.less

@@ -3,265 +3,97 @@ http://ionicframework.com/docs/theming/ */
 
 /** Ionic CSS Variables **/
 :root {
-    --ion-background-color: #f5f7fa;
-    --ion-background-color-rgb: 245, 247, 250;
-    --ion-login-icon: #689dff;
-
-    --ion-text-color: #000000;
-    --ion-text-color-rgb: 0, 0, 0;
-
-    --ion-color-step-0: #ffffff;
-    --ion-color-step-50: #f5f7fa;
-    --ion-color-step-100: #e6e6e6;
-    --ion-color-step-150: #d9d9d9;
-    --ion-color-step-200: #cccccc;
-    --ion-color-step-250: #bfbfbf;
-    --ion-color-step-300: #b3b3b3;
-    --ion-color-step-350: #a6a6a6;
-    --ion-color-step-400: #999999;
-    --ion-color-step-450: #8c8c8c;
-    --ion-color-step-500: #808080;
-    --ion-color-step-550: #737373;
-    --ion-color-step-600: #666666;
-    --ion-color-step-650: #595959;
-    --ion-color-step-700: #4d4d4d;
-    --ion-color-step-750: #404040;
-    --ion-color-step-800: #333333;
-    --ion-color-step-850: #262626;
-    --ion-color-step-900: #191919;
-    --ion-color-step-950: #0d0d0d;
-
-    /** primary **/
-    --ion-color-primary: #4078de;
-    --ion-color-primary-rgb: 56, 128, 255;
+    --ion-background-color: #1C1C1C;
+    --ion-background-color-rgb: 18, 19, 37;
+
+    --ion-text-color: #ffffff;
+    --ion-text-color-rgb: 255, 255, 255;
+
+    --ion-color-step-0: #1C1C1C;
+	--ion-color-step-50: #272727;
+	--ion-color-step-100: #333333;
+	--ion-color-step-150: #3e3e3e;
+	--ion-color-step-200: #494949;
+	--ion-color-step-250: #555555;
+	--ion-color-step-300: #606060;
+	--ion-color-step-350: #6b6b6b;
+	--ion-color-step-400: #777777;
+	--ion-color-step-450: #828282;
+	--ion-color-step-500: #8e8e8e;
+	--ion-color-step-550: #999999;
+	--ion-color-step-600: #a4a4a4;
+	--ion-color-step-650: #b0b0b0;
+	--ion-color-step-700: #bbbbbb;
+	--ion-color-step-750: #c6c6c6;
+	--ion-color-step-800: #d2d2d2;
+	--ion-color-step-850: #dddddd;
+	--ion-color-step-900: #e8e8e8;
+	--ion-color-step-950: #f4f4f4;
+
+    --ion-item-background: #1C1C1C;
+
+    --ion-card-background: #1C1C1C;
+
+    --ion-color-primary: #428cff;
+    --ion-color-primary-rgb: 66, 140, 255;
     --ion-color-primary-contrast: #ffffff;
     --ion-color-primary-contrast-rgb: 255, 255, 255;
-    --ion-color-primary-shade: #3171e0;
-    --ion-color-primary-tint: #4c8dff;
+    --ion-color-primary-shade: #3a7be0;
+    --ion-color-primary-tint: #5598ff;
 
-    /** secondary **/
-    --ion-color-secondary: #3dc2ff;
-    --ion-color-secondary-rgb: 61, 194, 255;
+    --ion-color-secondary: #50c8ff;
+    --ion-color-secondary-rgb: 80, 200, 255;
     --ion-color-secondary-contrast: #ffffff;
     --ion-color-secondary-contrast-rgb: 255, 255, 255;
-    --ion-color-secondary-shade: #36abe0;
-    --ion-color-secondary-tint: #50c8ff;
+    --ion-color-secondary-shade: #46b0e0;
+    --ion-color-secondary-tint: #62ceff;
 
-    /** tertiary **/
-    --ion-color-tertiary: #5260ff;
-    --ion-color-tertiary-rgb: 82, 96, 255;
+    --ion-color-tertiary: #6a64ff;
+    --ion-color-tertiary-rgb: 106, 100, 255;
     --ion-color-tertiary-contrast: #ffffff;
     --ion-color-tertiary-contrast-rgb: 255, 255, 255;
-    --ion-color-tertiary-shade: #4854e0;
-    --ion-color-tertiary-tint: #6370ff;
-
-    /** success **/
-    --ion-color-success: #2dd36f;
-    --ion-color-success-rgb: 45, 211, 111;
-    --ion-color-success-contrast: #ffffff;
-    --ion-color-success-contrast-rgb: 255, 255, 255;
-    --ion-color-success-shade: #28ba62;
-    --ion-color-success-tint: #42d77d;
-
-    /** warning **/
-    --ion-color-warning: #ffc409;
-    --ion-color-warning-rgb: 255, 196, 9;
+    --ion-color-tertiary-shade: #5d58e0;
+    --ion-color-tertiary-tint: #7974ff;
+
+    --ion-color-success: #2fdf75;
+    --ion-color-success-rgb: 47, 223, 117;
+    --ion-color-success-contrast: #000000;
+    --ion-color-success-contrast-rgb: 0, 0, 0;
+    --ion-color-success-shade: #29c467;
+    --ion-color-success-tint: #44e283;
+
+    --ion-color-warning: #ffd534;
+    --ion-color-warning-rgb: 255, 213, 52;
     --ion-color-warning-contrast: #000000;
     --ion-color-warning-contrast-rgb: 0, 0, 0;
-    --ion-color-warning-shade: #e0ac08;
-    --ion-color-warning-tint: #ffca22;
+    --ion-color-warning-shade: #e0bb2e;
+    --ion-color-warning-tint: #ffd948;
 
-    /** danger **/
-    --ion-color-danger: #eb445a;
-    --ion-color-danger-rgb: 235, 68, 90;
+    --ion-color-danger: #ff4961;
+    --ion-color-danger-rgb: 255, 73, 97;
     --ion-color-danger-contrast: #ffffff;
     --ion-color-danger-contrast-rgb: 255, 255, 255;
-    --ion-color-danger-shade: #cf3c4f;
-    --ion-color-danger-tint: #ed576b;
-
-    /** dark **/
-    --ion-color-dark: #222428;
-    --ion-color-dark-rgb: 34, 36, 40;
-    --ion-color-dark-contrast: #ffffff;
-    --ion-color-dark-contrast-rgb: 255, 255, 255;
-    --ion-color-dark-shade: #1e2023;
-    --ion-color-dark-tint: #383a3e;
-
-    /** medium **/
-    --ion-color-medium: #92949c;
-    --ion-color-medium-rgb: 146, 148, 156;
-    --ion-color-medium-contrast: #ffffff;
-    --ion-color-medium-contrast-rgb: 255, 255, 255;
-    --ion-color-medium-shade: #808289;
-    --ion-color-medium-tint: #9d9fa6;
-
-    /** light **/
-    --ion-color-light: #f4f5f8;
-    --ion-color-light-rgb: 244, 245, 248;
-    --ion-color-light-contrast: #000000;
-    --ion-color-light-contrast-rgb: 0, 0, 0;
-    --ion-color-light-shade: #d7d8da;
-    --ion-color-light-tint: #f5f6f9;
-}
-
-/*
-* Dark Colors
-* -------------------------------------------
-*/
-//全部dark
-.dark {
-    body {
-        --ion-color-primary: #428cff;
-        --ion-color-primary-rgb: 66, 140, 255;
-        --ion-color-primary-contrast: #ffffff;
-        --ion-color-primary-contrast-rgb: 255, 255, 255;
-        --ion-color-primary-shade: #3a7be0;
-        --ion-color-primary-tint: #5598ff;
-
-        --ion-color-secondary: #50c8ff;
-        --ion-color-secondary-rgb: 80, 200, 255;
-        --ion-color-secondary-contrast: #ffffff;
-        --ion-color-secondary-contrast-rgb: 255, 255, 255;
-        --ion-color-secondary-shade: #46b0e0;
-        --ion-color-secondary-tint: #62ceff;
-
-        --ion-color-tertiary: #6a64ff;
-        --ion-color-tertiary-rgb: 106, 100, 255;
-        --ion-color-tertiary-contrast: #ffffff;
-        --ion-color-tertiary-contrast-rgb: 255, 255, 255;
-        --ion-color-tertiary-shade: #5d58e0;
-        --ion-color-tertiary-tint: #7974ff;
-
-        --ion-color-success: #2fdf75;
-        --ion-color-success-rgb: 47, 223, 117;
-        --ion-color-success-contrast: #000000;
-        --ion-color-success-contrast-rgb: 0, 0, 0;
-        --ion-color-success-shade: #29c467;
-        --ion-color-success-tint: #44e283;
-
-        --ion-color-warning: #ffd534;
-        --ion-color-warning-rgb: 255, 213, 52;
-        --ion-color-warning-contrast: #000000;
-        --ion-color-warning-contrast-rgb: 0, 0, 0;
-        --ion-color-warning-shade: #e0bb2e;
-        --ion-color-warning-tint: #ffd948;
-
-        --ion-color-danger: #ff4961;
-        --ion-color-danger-rgb: 255, 73, 97;
-        --ion-color-danger-contrast: #ffffff;
-        --ion-color-danger-contrast-rgb: 255, 255, 255;
-        --ion-color-danger-shade: #e04055;
-        --ion-color-danger-tint: #ff5b71;
-
-        --ion-color-dark: #f4f5f8;
-        --ion-color-dark-rgb: 244, 245, 248;
-        --ion-color-dark-contrast: #000000;
-        --ion-color-dark-contrast-rgb: 0, 0, 0;
-        --ion-color-dark-shade: #d7d8da;
-        --ion-color-dark-tint: #f5f6f9;
-
-        --ion-color-medium: #989aa2;
-        --ion-color-medium-rgb: 152, 154, 162;
-        --ion-color-medium-contrast: #000000;
-        --ion-color-medium-contrast-rgb: 0, 0, 0;
-        --ion-color-medium-shade: #86888f;
-        --ion-color-medium-tint: #a2a4ab;
-
-        --ion-color-light: #222428;
-        --ion-color-light-rgb: 34, 36, 40;
-        --ion-color-light-contrast: #ffffff;
-        --ion-color-light-contrast-rgb: 255, 255, 255;
-        --ion-color-light-shade: #1e2023;
-        --ion-color-light-tint: #383a3e;
-
-        --van-cell-background: var(--ion-color-step-50);
-    }
-
-    /*
-   * iOS Dark Theme
-   * -------------------------------------------
-   */
-
-    &.ios body {
-        --ion-background-color: #121325;
-        --ion-background-color-rgb: 18, 19, 37;
-
-        --ion-text-color: #ffffff;
-        --ion-text-color-rgb: 255, 255, 255;
-
-        --ion-color-step-0: #121325;
-        --ion-color-step-50: #1e1f30;
-        --ion-color-step-100: #2a2b3b;
-        --ion-color-step-150: #363646;
-        --ion-color-step-200: #414251;
-        --ion-color-step-250: #4d4e5c;
-        --ion-color-step-300: #595a66;
-        --ion-color-step-350: #60616d;
-        --ion-color-step-400: #71717c;
-        --ion-color-step-450: #7d7d87;
-        --ion-color-step-500: #898992;
-        --ion-color-step-550: #94959d;
-        --ion-color-step-600: #a0a1a8;
-        --ion-color-step-650: #acacb3;
-        --ion-color-step-700: #b8b8be;
-        --ion-color-step-750: #c4c4c9;
-        --ion-color-step-800: #d4d4d4;
-        --ion-color-step-850: #dbdcde;
-        --ion-color-step-900: #e7e7e9;
-        --ion-color-step-950: #f3f3f4;
-
-        --ion-item-background: #121325;
-
-        --ion-card-background: #121325;
-
-
-        --ion-login-icon: #fff;
-    }
-
-    &.ios ion-modal {
-        --ion-background-color: var(--ion-color-step-100);
-        --ion-toolbar-background: var(--ion-color-step-150);
-        --ion-toolbar-border-color: var(--ion-color-step-250);
-    }
-
-    /*
-   * Material Design Dark Theme
-   * -------------------------------------------
-   */
-
-    &.md body {
-        --ion-background-color: #121325;
-        --ion-background-color-rgb: 18, 19, 37;
-
-        --ion-text-color: #ffffff;
-        --ion-text-color-rgb: 255, 255, 255;
-
-        --ion-color-step-0: #000000;
-        --ion-color-step-50: #1e1f30;
-        --ion-color-step-100: #2a2b3b;
-        --ion-color-step-150: #363646;
-        --ion-color-step-200: #414251;
-        --ion-color-step-250: #4d4e5c;
-        --ion-color-step-300: #595a66;
-        --ion-color-step-350: #656671;
-        --ion-color-step-400: #71717c;
-        --ion-color-step-450: #7d7d87;
-        --ion-color-step-500: #898992;
-        --ion-color-step-550: #94959d;
-        --ion-color-step-600: #a0a1a8;
-        --ion-color-step-650: #acacb3;
-        --ion-color-step-700: #b8b8be;
-        --ion-color-step-750: #c4c4c9;
-        --ion-color-step-800: #d0d0d3;
-        --ion-color-step-850: #dbdcde;
-        --ion-color-step-900: #e7e7e9;
-        --ion-color-step-950: #f3f3f4;
-
-        --ion-item-background: #121325;
-
-        --ion-card-background: #121325;
-
-
-        --ion-login-icon: #fff;
-    }
+    --ion-color-danger-shade: #e04055;
+    --ion-color-danger-tint: #ff5b71;
+
+    --ion-color-dark: #f4f5f8;
+    --ion-color-dark-rgb: 244, 245, 248;
+    --ion-color-dark-contrast: #000000;
+    --ion-color-dark-contrast-rgb: 0, 0, 0;
+    --ion-color-dark-shade: #d7d8da;
+    --ion-color-dark-tint: #f5f6f9;
+
+    --ion-color-medium: #989aa2;
+    --ion-color-medium-rgb: 152, 154, 162;
+    --ion-color-medium-contrast: #000000;
+    --ion-color-medium-contrast-rgb: 0, 0, 0;
+    --ion-color-medium-shade: #86888f;
+    --ion-color-medium-tint: #a2a4ab;
+
+    --ion-color-light: #222428;
+    --ion-color-light-rgb: 34, 36, 40;
+    --ion-color-light-contrast: #ffffff;
+    --ion-color-light-contrast-rgb: 255, 255, 255;
+    --ion-color-light-shade: #1e2023;
+    --ion-color-light-tint: #383a3e;
 }

src/views/BLFPage.vue

@@ -1,7 +1,7 @@
 <template>
     <ion-page>
         <ion-content>
-            <img class="top-img" src="@/assets/blfBg.png" alt="" />
+            <img class="top-img" src="@/assets/blfBg.jpg" alt="" />
 
             <div class="box">
                 <img src="@/assets/blfimg3.png" alt="" class="box-img" />
@@ -50,6 +50,9 @@ const buy = () => {
 </script>
 
 <style lang="less" scoped>
+ion-content {
+    --background: no-repeat center/cover url('@/assets/home_bg.jpg');
+}
 .top-img {
     width: 100%;
     display: block;

src/views/CommissionListPage.vue

@@ -133,47 +133,8 @@ export default {
         padding-right: 6px;
     }
 }
-.dark {
-    .date {
-        background: var(--ion-color-step-50);
-    }
-}
-.record-item {
-    --background: var(--ion-color-step-0);
-    --border-color: var(--ion-color-step-100);
-    ion-icon {
-        width: 32px;
-        height: 32px;
-    }
-    ion-label {
-        margin-left: 10px;
-    }
-    .amount {
-        font-weight: bold;
-    }
-    ion-icon {
-        fill: #59b12c;
-    }
-    &.recharge,
-    &.receipt {
-        ion-icon {
-            fill: #477bff;
-        }
-        .amount {
-            color: #477bff;
-        }
-    }
-    &.withdraw {
-        h3 {
-            color: #ff7f1f;
-        }
-        ion-icon {
-            fill: #ff7f1f;
-        }
-        .amount {
-            color: #ff7f1f;
-        }
-    }
+.date {
+    background: #2c302f;
 }
 ion-modal#picker {
     --min-width: calc(100vw - 100px);

src/views/CommissionRecord.vue

@@ -1,162 +0,0 @@
-<template>
-    <div class="list">
-        <div class="top">
-            <van-tabs
-                v-model="chooseTab"
-                title-active-color="#FF7900"
-                :line-height="2"
-                title-inactive-color="#000000"
-                @click="tabClick"
-            >
-                <van-tab :title="item" v-for="(item, index) in tabList" :key="index"></van-tab>
-            </van-tabs>
-        </div>
-        <van-pull-refresh v-model="refreshing" @refresh="onRefresh" success-text="刷新成功">
-            <div class="content">
-                <van-list v-model="loading" :finished="finished" :finished-text="$t('common.loadFinish')" @load="onLoad">
-                    <div class="order-list">
-                        <record v-for="(item, index) in list" :info="item" :key="index"></record>
-                        <!-- <record></record>
-             <record></record> -->
-                    </div>
-                </van-list>
-            </div>
-        </van-pull-refresh>
-    </div>
-</template>
-<script>
-import { mapState } from 'pinia'
-import { useUserStore } from '@/stores/user'
-import record from '@/components/Record.vue'
-export default {
-    name: 'CommissionRecord',
-    data() {
-        return {
-            chooseTab: 0,
-            priceDirection: 0,
-            list: [],
-            refreshing: false,
-            loading: false,
-            finished: false,
-            tabList: ['全部', '待审核', '待打款', '已打款', '无效'],
-            status: ['', 'PENDING', 'WAIT_TRANSFER', 'TRANSFERRED', 'CANCELED'],
-            page: 0,
-            size: 20
-        }
-    },
-    computed: {
-        ...mapState(useUserStore, ['user'])
-    },
-    created() {
-        this.onLoad()
-    },
-    methods: {
-        onRefresh() {
-            this.page = 0
-            this.refreshing = true
-            this.loading = false
-            this.finished = false
-            this.getData().then(_ => {
-                this.refreshing = false
-            })
-        },
-        onLoad() {
-            this.refreshing = false
-            this.loading = true
-            this.finished = false
-            this.getData().then(_ => {
-                this.refreshing = false
-            })
-        },
-        tabClick(name, title) {
-            this.page = 0
-            this.list = []
-            this.loading = false
-            this.isLoading = false
-            this.finished = false
-        },
-        getData() {
-            var data = {
-                page: this.page,
-                size: 20
-            }
-            if (this.status[this.chooseTab]) {
-                data.query = {
-                    status: this.status[this.chooseTab],
-                    userId: this.user.id
-                }
-            } else {
-                data.query = {
-                    userId: this.user.id
-                }
-            }
-            return this.$http
-                .post('/withdrawApply/all', data)
-                .then(res => {
-                    if (res.first) {
-                        this.list = []
-                    }
-                    this.list = this.list.concat(res.content)
-                    this.loading = false
-                    if (res.last) {
-                        this.finished = true
-                    } else {
-                        this.page++
-                    }
-                })
-                .catch(e => {})
-        }
-    },
-    components: {
-        record
-    }
-}
-</script>
-<style lang="less" scoped>
-.list {
-    background-color: #f2f4f5;
-}
-.top {
-    position: sticky;
-    top: 0;
-    z-index: 20;
-}
-.content {
-    min-height: 100vh;
-    position: relative;
-}
-.tab-title {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    img {
-        width: 24px;
-        height: 24px;
-    }
-
-    .img-list {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        margin-left: 4px;
-
-        img {
-            width: 8px;
-            height: 5px;
-
-            &:last-child {
-                margin-top: 2px;
-            }
-        }
-    }
-}
-.order-list {
-    padding: 15px 14px;
-
-    .order-info {
-        margin-bottom: 15px;
-    }
-}
-</style>

src/views/CommissionRecordList.vue

@@ -1,52 +0,0 @@
-<template>
-    <div class="list">
-        <record-order
-            v-for="(item, index) in list"
-            :key="index"
-            :info="item"
-            :status="status"
-            :auditAmount="auditAmount"
-            :amount="amount"
-        ></record-order>
-        <!-- <record-order></record-order> -->
-    </div>
-</template>
-<script>
-import { mapState } from 'pinia'
-import { useUserStore } from '@/stores/user'
-import recordOrder from '@/components/RecordOrder.vue'
-export default {
-    name: 'commissionRecordListPage',
-    data() {
-        return {
-            list: [],
-            status: '',
-            amount: 0,
-            auditAmount: 0
-        }
-    },
-    computed: {
-        ...mapState(useUserStore, ['user'])
-    },
-    mounted() {
-        this.$http.post('/withdrawApply/detail/' + this.$route.query.id).then(res => {
-            this.list = res.commissionOrders
-            this.status = res.status
-            if (res.amount) {
-                this.amount = res.amount
-            }
-            if (res.auditAmount) {
-                this.auditAmount = res.auditAmount
-            }
-        })
-    },
-    components: {
-        recordOrder
-    }
-}
-</script>
-<style lang="less" scoped>
-.list {
-    padding: 15px;
-}
-</style>

src/views/DistributionPage.vue

@@ -8,7 +8,7 @@
                 <ion-title>{{ $t('title.distribution') }}</ion-title>
             </ion-toolbar>
         </ion-header>
-        <ion-content>
+        <ion-content fullscreen>
             <div class="head">
                 <!-- <div class="title">{{ $t('title.distribution') }}</div>
                 <div class="desc" v-if="superior">{{ $t('distribution.myInvitor') }}: {{ superior.nickname }}</div>
@@ -62,7 +62,7 @@
                         <ion-icon :icon="chevronForwardOutline"></ion-icon>
                     </div>
                 </div>
-                <CommissionItem class="light" v-for="item in records" :key="item.id" :detail="item"></CommissionItem>
+                <CommissionItem class="darker" v-for="item in records" :key="item.id" :detail="item"></CommissionItem>
                 <van-empty v-if="empty" :description="$t('common.noRecords')" :image="emptyImg"></van-empty>
             </div>
             <ion-modal class="qr-modal dialog" :is-open="showQR" @didDismiss="showQR = false">
@@ -82,7 +82,7 @@
 import { mapState } from 'pinia'
 import { useUserStore } from '@/stores/user'
 import { caretForwardCircleOutline, chevronForwardOutline } from 'ionicons/icons'
-import CommissionItem from '@/components/CommissionItem1.vue'
+import CommissionItem from '@/components/CommissionItem.vue'
 import VueQrcode from '@chenfengyuan/vue-qrcode'
 import { useRoute } from 'vue-router'
 import { computed } from 'vue'
@@ -91,7 +91,7 @@ import shareImg from '@/assets/share_img.png'
 import { Capacitor } from '@capacitor/core'
 import { Filesystem, Directory, Encoding } from '@capacitor/filesystem'
 import { Media } from '@capacitor-community/media'
-import emptyImg from '@/assets/img_empty_1.png'
+import emptyImg from '@/assets/img_empty.png'
 import '@/styles/animate.css'
 
 export default {
@@ -236,7 +236,7 @@ ion-content {
     --background: #57f5be;
 }
 .head {
-    background: url(../assets/bg_distribution.png) no-repeat center;
+    background: url(../assets/bg_distribution.jpg) no-repeat center;
     background-size: cover;
     height: 228px;
     padding: 41px 16px 0 16px;
@@ -296,8 +296,6 @@ ion-content {
     border-radius: 4px;
     overflow: hidden;
     .bg {
-        // background: url(../assets/bg_distribution_stat.png) no-repeat center;
-        // background-size: cover;
         height: 138px;
         .f();
         align-items: stretch;
@@ -397,9 +395,7 @@ ion-content {
     .title {
         flex-grow: 1;
         font-size: 24px;
-        color: transparent;
-        background: linear-gradient(90deg, #dfffcd 0%, #90f9c4 48%, #39f3bb 100%);
-        -webkit-background-clip: text;
+        .gt();
         position: relative;
         .title-bg {
             width: 64px;
@@ -420,15 +416,6 @@ ion-content {
         color: #9fbfb1;
     }
 }
-:deep(.commission-item.light) {
-    background: #1c1c1c;
-    .head {
-        border-bottom: 1px solid #202020;
-    }
-    .prop {
-        color: rgba(255, 255, 255, 0.6);
-    }
-}
 .qr-modal {
     --width: 250px;
     --height: 250px;

src/views/EditBankPage.vue

@@ -0,0 +1,102 @@
+<template>
+    <ion-page>
+        <ion-header>
+            <ion-toolbar>
+                <ion-buttons slot="start">
+                    <ion-back-button text="" default-href="#" @click="$router.back()"></ion-back-button>
+                </ion-buttons>
+                <ion-title>{{ $t('mine.bankCard') }}</ion-title>
+            </ion-toolbar>
+        </ion-header>
+        <ion-content>
+            <div class="input-sec">
+                <div class="title">{{ $t('bank.bank') }}</div>
+                <div class="input-wrapper">
+                    <div class="placeholder">{{ $t('bank.selectBank') }}</div>
+                    <ion-icon :icon="chevronForwardOutline"></ion-icon>
+                </div>
+            </div>
+
+            <div class="input-sec">
+                <div class="title">{{ $t('bank.cardNumber') }}</div>
+                <div class="input-wrapper">
+                    <ion-input
+                        typeof="number"
+                        :placeholder="$t('bank.cardNumber')"
+                        clear-input
+                        type="number"
+                        inputmode="decimal"
+                    ></ion-input>
+                </div>
+            </div>
+
+            <div class="input-sec">
+                <div class="title">{{ $t('bank.cardName') }}</div>
+                <div class="input-wrapper">
+                    <ion-input :placeholder="$t('bank.cardName')" clear-input></ion-input>
+                </div>
+            </div>
+
+            <div class="input-sec">
+                <div class="title">{{ $t('bank.phone') }}</div>
+                <div class="input-wrapper">
+                    <ion-input
+                        typeof="number"
+                        :placeholder="$t('bank.phone')"
+                        clear-input
+                        type="number"
+                        inputmode="decimal"
+                    ></ion-input>
+                </div>
+            </div>
+
+            <div class="input-sec">
+                <div class="title">{{ $t('bank.mail') }}</div>
+                <div class="input-wrapper">
+                    <ion-input :placeholder="$t('bank.mail')" clear-input></ion-input>
+                </div>
+            </div>
+            <div style="padding: 28px">
+                <van-button type="primary" block>{{ $t('bank.saveBankCard') }}</van-button>
+            </div>
+        </ion-content>
+    </ion-page>
+</template>
+<script>
+import { chevronForwardOutline } from 'ionicons/icons'
+export default {
+    setup() {
+        return {
+            chevronForwardOutline
+        }
+    },
+    data() {
+        return {}
+    }
+}
+</script>
+<style lang="less" scoped>
+.input-sec {
+    margin: 20px 28px 0 28px;
+    .title {
+        color: rgba(255, 255, 255, 0.8);
+        margin-bottom: 8px;
+        font-size: 12px;
+    }
+    .input-wrapper {
+        background-color: var(--ion-color-step-50);
+        height: 48px;
+        border-radius: 8px;
+        .f();
+        padding: 0 16px;
+        margin-top: 8px;
+        .placeholder {
+            opacity: 0.5;
+            flex: 1;
+        }
+        .input {
+            flex: 1;
+        }
+    }
+}
+</style>

src/views/HomePage.vue

@@ -1,6 +1,6 @@
 <template>
     <ion-page>
-        <ion-content :fullscreen="true" class="home">
+        <ion-content fullscreen class="home">
             <!-- 轮播图模块 -->
             <div class="swiper-content">
                 <swiper
@@ -177,7 +177,8 @@ import 'swiper/swiper.min.css'
 import 'swiper/swiper-bundle.min.css'
 import SwiperCore, { Pagination, Autoplay, Parallax, Controller } from 'swiper'
 import { useRouter, useRoute } from 'vue-router'
-import { ref, getCurrentInstance, onMounted, watch } from 'vue'
+import { ref, watch } from 'vue'
+import { onIonViewWillEnter } from '@ionic/vue'
 
 import intoIcon from '@/assets/svgs/icon_inter.svg'
 
@@ -268,7 +269,7 @@ function goNews() {
     })
 }
 
-onMounted(() => {
+onIonViewWillEnter(() => {
     // toast.loading({
     //     message: '加载中...',
     //     forbidClick: true
@@ -346,6 +347,9 @@ function tutorial() {
 </script>
 
 <style lang="less" scoped>
+ion-content {
+    --background: no-repeat center/cover url('@/assets/home_bg.jpg');
+}
 .mySwiper {
     height: 65vw;
     :deep(.swiper-pagination-bullet) {
@@ -431,11 +435,10 @@ function tutorial() {
 }
 
 :deep(.van-cell) {
-    --van-cell-background: var(--ion-background-color);
+    --van-cell-background: transparent;
+    --van-cell-active-color: transparent;
     --van-cell-horizontal-padding: 20px;
-    --van-cell-text-color: var(--ion-color-step-800);
     --van-cell-value-color: #9fbfb1;
-    --van-cell-text-color: var(--ion-text-color) .f();
     .van-cell__title {
         font-size: 16px;
         font-family: TsangerYuMo;
@@ -446,9 +449,7 @@ function tutorial() {
             span {
                 position: relative;
                 z-index: 1;
-                color: transparent;
-                background: linear-gradient(90deg, #dfffcd 0%, #90f9c4 48%, #39f3bb 100%);
-                -webkit-background-clip: text;
+                .gt();
                 text-align: left;
             }
             .title-bg {

src/views/MinePage.vue

@@ -138,6 +138,7 @@
                     :value="$t('mine.newProfit')"
                     is-link
                     :to="{ name: 'distribution' }"
+                    :border="false"
                 >
                     <template #icon>
                         <img class="menu-icon" src="../assets/info_icon_shoyi.png" alt="" />
@@ -145,33 +146,39 @@
                     <template #right-icon> <ion-icon class="right-icon" :icon="intoIcon"></ion-icon> </template>
                 </van-cell>
 
-                <van-cell :title="$t('mine.bankCard')" :value="$t('mine.noBind')" is-link @click="wait">
+                <van-cell
+                    :title="$t('mine.bankCard')"
+                    :value="$t('mine.noBind')"
+                    is-link
+                    :to="{ name: 'userBank' }"
+                    :border="false"
+                >
                     <template #icon>
                         <img class="menu-icon" src="../assets/info_icon_ka.png" alt="" />
                     </template>
                     <template #right-icon> <ion-icon class="right-icon" :icon="intoIcon"></ion-icon> </template>
                 </van-cell>
-                <van-cell :title="$t('mine.address')" is-link @click="wait">
+                <van-cell :title="$t('mine.address')" is-link @click="wait" :border="false">
                     <template #icon>
                         <img class="menu-icon" src="../assets/info_icon_dizhi.png" alt="" />
                     </template>
                     <template #right-icon> <ion-icon class="right-icon" :icon="intoIcon"></ion-icon> </template>
                 </van-cell>
 
-                <van-cell :title="$t('mine.setting')" is-link :to="{ name: 'setting' }">
+                <van-cell :title="$t('mine.setting')" is-link :to="{ name: 'setting' }" :border="false">
                     <template #icon>
                         <img class="menu-icon" src="../assets/info_icon_shezhi.png" alt="" />
                     </template>
                     <template #right-icon> <ion-icon class="right-icon" :icon="intoIcon"></ion-icon> </template>
                 </van-cell>
-                <van-cell :title="$t('common.eula')" :to="{ name: 'rule' }" is-link>
+                <van-cell :title="$t('common.eula')" :to="{ name: 'rule' }" is-link :border="false">
                     <template #icon>
                         <img class="menu-icon" src="../assets/info_icon_pingtaixieyi.png" alt="" />
                     </template>
                     <template #right-icon> <ion-icon class="right-icon" :icon="intoIcon"></ion-icon> </template>
                 </van-cell>
 
-                <van-cell :title="$t('common.guide')" :to="{ name: 'turtorial' }" is-link>
+                <van-cell :title="$t('common.guide')" :to="{ name: 'turtorial' }" is-link :border="false">
                     <template #icon>
                         <img class="menu-icon" src="../assets/info_icon_liucheng.png" alt="" />
                     </template>
@@ -238,6 +245,9 @@ const balanceText = computed(() => {
 </script>
 
 <style lang="less" scoped>
+ion-content {
+    --background: no-repeat center/cover url('@/assets/home_bg.jpg');
+}
 .mine {
     --ion-background-color: var(--ion-color-step-0);
 }
@@ -453,7 +463,7 @@ const balanceText = computed(() => {
     margin-top: 14px;
 }
 
-:deep(.menu) {
+.menu {
     --van-cell-line-height: 28px;
     --van-cell-text-color: #9fbfb1;
     --van-cell-value-color: #668577;
@@ -463,7 +473,7 @@ const balanceText = computed(() => {
     --van-cell-background: #2c302f;
     --van-cell-group-background: #2c302f;
     border-radius: 8px;
-    margin: 0 20px;
+    margin: 0 20px 20px 20px;
     overflow: hidden;
     padding: 12px 0;
 
@@ -487,14 +497,4 @@ const balanceText = computed(() => {
     height: 24px;
     color: #9fbfb1;
 }
-.menu + .menu {
-    border-top: 10px solid var(--ion-background-color);
-}
-.dark .mine {
-    --van-cell-background: var(--ion-color-step-0);
-    --van-cell-active-color: var(--ion-color-step-50);
-    .menu + .menu {
-        border-top: 10px solid var(--ion-color-step-50);
-    }
-}
 </style>

src/views/NewsPage.vue

@@ -30,7 +30,7 @@
 </template>
 
 <script setup>
-import emptyIcon from '../assets/img_empty_order.png'
+import emptyIcon from '../assets/img_empty.png'
 import { ref, getCurrentInstance, onMounted, computed } from 'vue'
 import { useRouter } from 'vue-router'
 import useList from '../plugins/list'

src/views/OrderPage.vue

@@ -45,7 +45,7 @@ import { useSystemStore } from '@/stores/system'
 import OrderItem from '@/components/OrderItem.vue'
 import { parse } from 'date-fns'
 import { useWindowSize } from '@vueuse/core'
-import emptyImg from '@/assets/img_empty_order.png'
+import emptyImg from '@/assets/img_empty.png'
 export default {
     name: 'OrderPage',
     components: { OrderItem },

src/views/ProductSearchPage.vue

@@ -42,7 +42,7 @@ import { ref, getCurrentInstance, onMounted, computed } from 'vue'
 import { useRoute } from 'vue-router'
 import useSearch from '../plugins/search'
 import { isAfter, isBefore, parse, getYear, getMonth, getDate } from 'date-fns'
-import emptyIcon from '../assets/img_empty_order.png'
+import emptyIcon from '../assets/img_empty.png'
 
 const route = useRoute()
 const {

src/views/RankPage.vue

@@ -2,7 +2,7 @@
     <ion-page>
         <ion-content class="rank-page">
             <div class="top">
-                <img src="../assets/png-bg-paihang.png" alt="" class="bg" />
+                <img src="../assets/png-bg-paihang.jpg" alt="" class="bg" />
 
                 <img
                     src="../assets/png-shuzi.png"
@@ -77,7 +77,6 @@
 </template>
 
 <script setup>
-import img1 from '../assets/c1.png'
 import { ref } from 'vue'
 import { http } from '@/plugins/http'
 import { onIonViewWillEnter } from '@ionic/vue'
@@ -87,8 +86,7 @@ import rank3 from '@/assets/rank_3.png'
 import { Vue3Lottie } from 'vue3-lottie'
 import prizeJSON from '@/assets/lottie/prize.json'
 import '@/styles/animate.css'
-import topBg from '@/assets/png-bg-paihang.png'
-import rankBg from '@/assets/png-bg-paihang-xiahua.png'
+import rankBg from '@/assets/png-bg-paihang-xiahua.jpg'
 import { useRouter } from 'vue-router'
 
 const rankImg = [rank1, rank2, rank3]

src/views/SettingPage.vue

@@ -10,7 +10,7 @@
         </ion-header>
         <ion-content>
             <div class="setting">
-                <van-cell-group :border="false">
+                <van-cell-group inset>
                     <van-cell :title="$t('mine.avatar')" is-link>
                         <template #value>
                             <van-image
@@ -63,7 +63,7 @@
                         </template>
                     </van-cell>
                 </van-cell-group> -->
-                <van-cell-group :border="false">
+                <van-cell-group inset>
                     <van-cell :title="$t('mine.bindPhone')" class="not" :value="(user || {}).phone"> </van-cell>
                     <!-- <van-cell title="修改密码" is-link></van-cell> -->
                     <van-cell
@@ -92,9 +92,9 @@
                 />
 
                 <!-- <van-area title="选择地址" :area-list="areaList" :columns-num="2" /> -->
-                <van-button style="margin-top: 20px" type="primary" block @click="onLogout">{{
-                    $t('mine.logout')
-                }}</van-button>
+                <div style="padding: 16px">
+                    <van-button type="primary" block @click="onLogout">{{ $t('mine.logout') }}</van-button>
+                </div>
             </div>
         </ion-content>
     </ion-page>
@@ -248,7 +248,7 @@ export default {
 
 <style lang="less" scoped>
 .setting {
-    padding: 16px;
+    padding-top: 16px;
 }
 
 .van-cell-group {

src/views/TabsPage.vue

@@ -88,6 +88,7 @@ function goRank() {
 <style lang="less" scoped>
 ion-tab-bar {
     --border: none;
+    --background: rgba(28, 28, 28, 0.6);
 }
 ion-tab-button {
     --color: var(--ion-color-step-400);
@@ -125,7 +126,7 @@ ion-icon {
     margin: auto;
     left: 0;
     right: 0;
-    bottom: 15px;
+    bottom: calc(env(safe-area-inset-bottom, 0px) + 15px);
     width: 56px;
     display: block;
     z-index: 100;

src/views/UserBankPage.vue

@@ -0,0 +1,59 @@
+<template>
+    <ion-page>
+        <ion-header>
+            <ion-toolbar>
+                <ion-buttons slot="start">
+                    <ion-back-button text="" default-href="#" @click="$router.back()"></ion-back-button>
+                </ion-buttons>
+                <ion-title>{{ $t('mine.bankCard') }}</ion-title>
+            </ion-toolbar>
+        </ion-header>
+        <ion-content>
+            <div class="btn-add" @click="$router.push({ name: 'editBank' })">
+                <div class="icon-box">
+                    <ion-icon :icon="addOutline"></ion-icon>
+                </div>
+                {{ $t('bank.addBankCard') }}
+            </div>
+        </ion-content>
+    </ion-page>
+</template>
+<script>
+import { addOutline } from 'ionicons/icons'
+import { IonIcon } from '@ionic/vue'
+export default {
+    setup() {
+        return {
+            addOutline,
+            IonIcon
+        }
+    },
+    data() {
+        return {}
+    }
+}
+</script>
+<style lang="less" scoped>
+.btn-add {
+    .f();
+    height: 56px;
+    background: var(--ion-color-step-50);
+    border-radius: 8px;
+    color: rgba(255, 255, 255, 0.6);
+    justify-content: center;
+    margin: 16px;
+    &:active {
+        background: var(--ion-color-step-100);
+    }
+    .icon-box {
+        width: 24px;
+        height: 24px;
+        border-radius: 12px;
+        background: var(--ion-color-step-200);
+        .f();
+        justify-content: center;
+        color: rgba(255, 255, 255, 0.6);
+        margin-right: 10px;
+    }
+}
+</style>

src/views/WebViewPage.vue

@@ -0,0 +1,39 @@
+<template>
+    <ion-page>
+        <ion-header>
+            <ion-toolbar>
+                <ion-buttons slot="start">
+                    <ion-back-button text="" default-href="#" @click="$router.back()"></ion-back-button>
+                </ion-buttons>
+                <ion-title> </ion-title>
+            </ion-toolbar>
+        </ion-header>
+        <ion-content>
+            <UseElementBounding class="iframe-wrapper" v-slot="{ width, height }">
+                <iframe src="https://www.baidu.com" :width="width" :height="height"></iframe>
+            </UseElementBounding>
+        </ion-content>
+    </ion-page>
+</template>
+<script>
+import {} from '@vueuse/core'
+import { UseElementBounding } from '@vueuse/components'
+export default {
+    name: 'WebPage',
+    components: { UseElementBounding },
+    data() {
+        return {
+            url: 'https://www.google.com'
+        }
+    }
+}
+</script>
+<style lang="less" scoped>
+.iframe-wrapper {
+    height: 100%;
+    overflow: hidden;
+}
+iframe {
+    border: none;
+}
+</style>

vite.config.js

@@ -2,6 +2,7 @@ import { fileURLToPath, URL } from 'node:url'
 import { defineConfig, loadEnv } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import viteImagemin from 'vite-plugin-imagemin'
+import { VitePWA } from 'vite-plugin-pwa'
 
 // https://vitejs.dev/config/
 export default defineConfig(({ command, mode }) => {
@@ -37,6 +38,38 @@ export default defineConfig(({ command, mode }) => {
                     ]
                 },
                 webp: false
+            }),
+            VitePWA({
+                registerType: 'autoUpdate',
+                manifest: {
+                    name: 'FirstCash',
+                    short_name: 'FirstCash',
+                    theme_color: '#161616',
+                    background_color: '#161616',
+                    display: 'fullscreen',
+                    icons: [
+                        {
+                            src: '/icon-192x192.png',
+                            sizes: '192x192',
+                            type: 'image/png'
+                        },
+                        {
+                            src: '/icon-256x256.png',
+                            sizes: '256x256',
+                            type: 'image/png'
+                        },
+                        {
+                            src: '/icon-384x384.png',
+                            sizes: '384x384',
+                            type: 'image/png'
+                        },
+                        {
+                            src: '/icon-512x512.png',
+                            sizes: '512x512',
+                            type: 'image/png'
+                        }
+                    ]
+                }
             })
         ],
         resolve: {