1

App.vue

@@ -46,8 +46,10 @@ function initTheme() {
 	}
 	// 设置 data-bs-theme 属性到 html 标签
 	document.documentElement.setAttribute('data-bs-theme', theme);
+	document.documentElement.setAttribute('data-color-theme', 'blue');
 	// 同时设置到 body 标签
 	document.body.setAttribute('data-bs-theme', theme);
+	document.body.setAttribute('data-color-theme', 'blue');
 	// #endif
 
 	// #ifdef APP-PLUS
@@ -178,7 +180,7 @@ span {
 html {
 	--bs-bg-opacity: 1;
 	background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
-	font-size: 32px !important;
+	font-size: 16px !important;
 }
 
 uni-page-body {

components/cwg-pc-header.vue

@@ -45,12 +45,13 @@ function openLeftDrawer() {
 </script>
 
 <style scoped lang="scss">
+@import "@/uni.scss";
 .cwg-pc-header {
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
 	width: 100vw;
-	height: 55px;
+	height: px2rpx(55);
 	background-color: rgba(255, 255, 255, 0.9);
 	border-bottom: 1px solid var(--bs-border-color);
 	padding: 0 px2rpx(16);

pages/customer/components/AccountCard.vue

@@ -1,31 +1,272 @@
 <template>
-    <AccountCardMobile v-if="isGridLayout" :account="account" />
-    <AccountCardDesktop v-else :account="account" />
+    <view class="col-lg-4 col-md-6">
+        <view class="card">
+            <view class="card-header d-flex align-items-center justify-content-between border-0 pb-0 p-3">
+                <text class="badge bg-success-subtle text-success">Active</text>
+                <view class="clearfix">
+                    <view class="btn-group">
+                        <cwg-dropdown ref="dropdownRef" @open="onOpen" @close="onClose" :menu-list="customMenuList"
+                            @menuClick="handleCustomClick">
+                            <button class="btn btn-white btn-sm btn-shadow btn-icon waves-effect dropdown-toggle"
+                                type="button">
+                                <cwg-icon name="crm-ellipsis-vertical" :size="18"
+                                    :color="!isDark ? '#6c8595' : '#fff'" />
+                            </button>
+                        </cwg-dropdown>
+                    </view>
+                </view>
+            </view>
+            <view class="card-body p-2 pt-0">
+                <view class="text-center mb-3">
+                    <h5 class="fw-bold mb-0 text-secondary cursor-pointer" @click="copy(account.accountNumber)"># {{
+                        account.accountNumber }}</h5>
+                    <h4 class="mb-2 cursor-pointer" @click="copy(account.fwq)">{{ account.fwq }}</h4>
+                    <template v-for="(label, index) in account.labels" :key="index">
+                        <text v-if="label" class="badge bg-danger-subtle text-danger mx-1">{{ label }}</text>
+                    </template>
+                    <h1 class="mt-2">${{ balanceInteger }}{{ balanceDecimal }}</h1>
+                    <button type="submit" value="Submit" class="btn btn-secondary btn-sm w-75 waves-effect waves-light"
+                        @click="handleAction('trade')">
+                        <cwg-icon name="crm-trade" :size="16" color="#fff" />
+                        Start Trading
+                    </button>
+                    <hr>
+                </view>
+                <view class="text-left">
+                    <view class="border-0 card-header p-2">
+                        <view class="row">
+                            <view class="col-6">
+                                <view class="mb-3">
+                                    <text class="mb-1">{{ t('Label.Leverage') }}</text>
+                                    <view class="d-flex fw-semibold mb-0 text-dark">{{ account.actualLeverage }}</view>
+                                </view>
+                                <view class="mb-3">
+                                    <text class="mb-1">{{ t('Label.FloatingPL') }}</text>
+                                    <view class="d-flex fw-semibold mb-0 text-dark">{{ account.floatingPL }}</view>
+                                </view>
+                                <view class="mb-3">
+                                    <text class="mb-1">{{ t('Label.Balance') }}</text>
+                                    <view class="text-dark fw-semibold mb-0">{{ account.balanceWithSymbol }}</view>
+                                </view>
+                            </view>
+                            <view class="col-6">
+                                <view class="mb-3">
+                                    <text class="mb-1">{{ t('Label.Equity') }}</text>
+                                    <view class="text-dark fw-semibold mb-0">{{ account.equityWithSymbol }}</view>
+                                </view>
+                                <view class="mb-3">
+                                    <text class="mb-1">{{ t('Label.Credit') }}</text>
+                                    <view class="text-dark fw-semibold mb-0">{{ account.creditWithSymbol }}</view>
+                                </view>
+                                <view class="mb-3">
+                                    <text class="mb-1">{{ t('Documentary.console.item3') }}</text>
+                                    <view class="text-dark fw-semibold mb-0">{{ account.platform }}</view>
+                                </view>
+                            </view>
+                        </view>
+                        <view class="d-flex flex-wrap gap-2" v-if="!isDemo">
+                            <button v-for="btn in actionButtons" :key="btn.key" type="submit" value="Submit"
+                                class="btn btn-dark btn-sm waves-effect waves-light"
+                                :class="{ 'disabled': btn.disabled.value }" @click="handleAction(btn.action)">
+                                <cwg-icon :name="btn.icon" :size="14" color="#fff" />
+                                {{ t(btn.label) }}
+                            </button>
+                        </view>
+                    </view>
+                </view>
+            </view>
+        </view>
+    </view>
+
+    <TerminalDialog v-model:visible="terminalDialogVisible" />
+    <TerminalChangePasswordDialog v-model:visible="terminalChangePasswordDialogVisible" :pwdType="pwdType"
+        :account="account" :accountLabel="t('Documentary.tradingCenter.item29') + ' # '" />
+    <TerminalInfoDialog v-model:visible="terminalInfoDialogVisible" :accountNumber="accountInfo.login"
+        :form="accountInfo" :fieldList="fieldList" :title="t('Documentary.TundManagement.item29')"
+        :accountLabel="t('Documentary.tradingCenter.item29') + ' # '" />
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
-import AccountCardMobile from './AccountCardMobile.vue';
-import AccountCardDesktop from './AccountCardDesktop.vue';
-
+import { ref, computed, onMounted, nextTick, onBeforeUnmount } from 'vue';
+import useRouter from "@/hooks/useRouter";
+const router = useRouter();
+import { useI18n } from 'vue-i18n';
+const { t } = useI18n();
+import TerminalDialog from './TerminalDialog.vue'
+import TerminalChangePasswordDialog from './TerminalChangePasswordDialog.vue'
+import TerminalInfoDialog from './TerminalInfoDialog.vue'
+import useGlobalStore from '@/stores/use-global-store'
+const globalStore = useGlobalStore()
+const isDark = computed(() => globalStore.theme === 'dark')
 const props = defineProps<{
-    account: any;
-    isGridLayout?: boolean;
+    account: Account;
 }>();
+const accountInfo = ref(props.account)
+export interface Account {
+    labels: string[];          // 标签数组，如 ['真实', 'MT4', 'Standard']
+    accountNumber: string;      // 账号，如 '85319215'
+    nickName: string;           // 昵称，如 '标准账户'
+    balance: number;            // 余额数字
+    currency: string;           // 货币，如 'USD'
+    actualLeverage: string;     // 实际杠杆，如 '1:2000'
+    maxLeverage: string;        // 调整杠杆，如 '1:2000'
+    floatingPL: string;         // 浮动盈亏，如 '0.00 USD'
+    creditWithSymbol: string;         // 可用保证金，如 '0.00 USD'
+    equityWithSymbol: string;             // 净值，如 '0.00 USD'
+    platform: string;           // 平台，如 'MT4'
+    server: string;             // 服务器，如 'Exness-Real28'
+    login: string;              // 登录名，如 '85319215'
+    balanceWithSymbol: string;              // 余额，如 '85319215'
+    fwq: string;                // 服务器名称
+    listType: string;           // 账户类型，如 'real' 或 'demo'
+    closeFunctions?: string;    // 关闭的功能
+}
+const isDemo = computed(() => accountInfo.value.listType == 'demo')
+const closeFunctionOpen = (code) => {
+    const closeFunctions = accountInfo.value.closeFunctions || ""
+    if (closeFunctions == null || closeFunctions === "") {
+        return true;
+    }
+    return String(closeFunctions).indexOf(String(code)) === -1;
+}
+const circleButtons = ref([
+    { key: 'deposit', label: 'Home.page_customer.item2', icon: 'crm-deposit', action: 'deposit', needDemo: isDemo.value, disabled: !closeFunctionOpen('1'), color: '#6c8595' },
+    { key: 'withdraw', label: 'Home.page_customer.item3', icon: 'crm-withdraw', action: 'withdraw', needDemo: isDemo.value, disabled: !closeFunctionOpen('2'), color: '#6c8595' },
+    { key: 'transfer', label: 'Custom.Index.Transfer', icon: 'crm-transfer', action: 'transfer', needDemo: isDemo.value, disabled: !(closeFunctionOpen('5') && closeFunctionOpen('6') && closeFunctionOpen('3')), color: '#6c8595' }
+])
+const fieldList = ref([
+    { label: t('Custom.PaymentHistory.AccountType'), key: 'nickname', copyable: false },
+    { label: t('Label.Leverage'), key: 'actualLeverage', copyable: false },
+    { label: t('Label.FloatingPL'), key: 'floatingPL', copyable: false },
+    { label: t('Label.Balance'), key: 'balanceWithSymbol', copyable: false },
+    { label: t('Label.Equity'), key: 'equityWithSymbol', copyable: false },
+    { label: t('Label.Credit'), key: 'creditWithSymbol', copyable: false },
+    { label: t('Documentary.console.item3'), key: 'platform', copyable: false },
+    { label: t('Documentary.console.item4'), key: 'login', copyable: true }
+])
+const nickName = ref(accountInfo.value.nickName);
+
+const actionButtons = ref([
+    { key: 'deposit', label: 'Home.page_customer.item2', icon: 'crm-upload', action: 'deposit', disabled: computed(() => !closeFunctionOpen('1')) },
+    { key: 'withdraw', label: 'Home.page_customer.item3', icon: 'crm-download', action: 'withdraw', disabled: computed(() => !closeFunctionOpen('2')) },
+    { key: 'transfer', label: 'Custom.Index.Transfer', icon: 'crm-exchange', action: 'transfer', disabled: computed(() => !(closeFunctionOpen('5') && closeFunctionOpen('6') && closeFunctionOpen('3'))) }
+])
 
-// 检测是否为移动端
-const isMobile = ref(false);
+const terminalDialogVisible = ref(false)
+const terminalChangePasswordDialogVisible = ref(false)
+const terminalInfoDialogVisible = ref(false)
+const pwdType = ref(1)
 
-const checkIsMobile = () => {
-    isMobile.value = window.innerWidth <= 1100;
+const dropdownRef = ref(null)
+
+const handleAction = (type: string) => {
+    if (dropdownRef.value) {
+        dropdownRef.value.close()
+    }
+    switch (type) {
+        case 'trade':
+            terminalDialogVisible.value = true
+            break;
+        case 'changePassword1':
+            pwdType.value = 1
+            terminalChangePasswordDialogVisible.value = true
+            break;
+        case 'changePassword2':
+            pwdType.value = 2
+            terminalChangePasswordDialogVisible.value = true
+            break;
+        case 'info':
+            terminalInfoDialogVisible.value = true
+            break;
+        case 'deposit':
+            toDeposit()
+            break;
+        case 'withdraw':
+            toWithdraw()
+            break;
+        case 'transfer':
+            toTransfer()
+            break;
+        case 'position':
+            toPosition()
+            break;
+        case 'history':
+            toHistory()
+            break;
+        case 'payment-history':
+            toPaymentHistory()
+            break;
+        default:
+            break;
+    }
 };
 
+const customMenuList = computed(() => !isDemo.value ? [
+    { label: t('Ib.Report.Tit1'), type: 'history' },
+    { label: t('Ib.Report.Tit4'), type: 'position' },
+    { label: t('Home.page_customer.item4'), type: 'payment-history' },
+    { label: t('Documentary.TundManagement.item29'), type: 'info' },
+    { label: t('vu.item3'), type: 'changePassword1' },
+    { label: t('vu.item4'), type: 'changePassword2' }
+] : [
+    { label: t('Documentary.TundManagement.item29'), type: 'info' }
+])
+const handleCustomClick = (item, index) => {
+    handleAction(item.value.type)
+}
+const copy = (text: string) => {
+    uni.setClipboardData({
+        data: text,
+        success: function () {
+            uni.showToast({
+                title: t('Btn.item8'),
+                icon: 'none',
+                duration: 2000
+            });
+        }
+    });
+};
+const toHistory = () => {
+    router.push(`/pages/customer/trade-history?login=${accountInfo.value.login}`)
+}
+const toPosition = () => {
+    router.push(`/pages/customer/trade-position?login=${accountInfo.value.login}`)
+}
+const toPaymentHistory = () => {
+    router.push(`/pages/customer/payment-history?login=${accountInfo.value.login}`)
+}
+const toDeposit = () => {
+    router.push(`/pages/customer/deposit-select?login=${accountInfo.value.login}&type=${accountInfo.value.type}&balance=${accountInfo.value.balance}&currency=${accountInfo.value.currency}`)
+}
+const toWithdraw = () => {
+    router.push(`/pages/customer/withdrawal-select?login=${accountInfo.value.login}&type=${accountInfo.value.type}&balance=${accountInfo.value.balance}&currency=${accountInfo.value.currency}`)
+}
+const toTransfer = () => {
+    router.push(`/pages/customer/transfer?login=${accountInfo.value.login}&type=${accountInfo.value.type}&balance=${accountInfo.value.balance}&currency=${accountInfo.value.currency}`)
+}
+const balanceInteger = computed(() => {
+    return Math.floor(accountInfo.value.balance).toString();
+});
+const balanceDecimal = computed(() => {
+    const parts = accountInfo.value.balance.toFixed(2).split('.');
+    return parts[1] ? '.' + parts[1] : '.00';
+});
 onMounted(() => {
-    checkIsMobile();
-    window.addEventListener('resize', checkIsMobile);
 });
-
 onBeforeUnmount(() => {
-    window.removeEventListener('resize', checkIsMobile);
 });
 </script>
+
+<style scoped lang="scss">
+@import '@/uni.scss';
+
+.btn.disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    
+}
+.btn{
+    margin-left: 0;
+    margin-right: 0;
+}
+</style>

pages/customer/components/AccountList.vue

@@ -1,40 +1,55 @@
 <template>
-    <view class="account-card">
-        <view class="content-title">
-            <view v-t="'Custom.Index.AccountList'"></view>
-            <view class="content-title-btns">
-                <view class="btn-primary btn-primary1" @click="createAccount()">
-                    <cwg-icon icon="crm-plus" :size="16" color="#fff" />
-                    <text v-t="'Custom.Index.AddAccount'" />
+
+    <view class="container">
+        <view class="row">
+            <view class="col-12">
+                <view class="border-0 card-header">
+                    <view class="d-flex flex-wrap gap-3 align-items-center justify-content-between mb-3">
+                        <h3 class="mb-0" v-t="'Custom.Index.AccountList'"></h3>
+                        <button type="button" class="btn  btn-secondary  btn-shadow waves-effect"><i
+                                class="fi fi-rr-plus"></i>
+                            <text v-t="'Custom.Index.AddAccount'" /></button>
+                    </view>
                 </view>
             </view>
-        </view>
-        <view class="tabs-container">
-            <view class="tabs-class">
-                <cwg-tabs v-model:cativeIndex="cativeIndex" :tabs="tabs" />
-            </view>
-            <view class="btn-class">
-                <view class="btn-primary" :class="{ 'btn-primary2': isGridLayout }"
-                    @click="isGridLayout || toggleLayout()">
-                    <cwg-icon icon="crm-card" :size="16" :color="!isDark ? '#6c8595' : '#fff'" />
-                </view>
-                <view class="btn-primary" :class="{ 'btn-primary2': !isGridLayout }"
-                    @click="!isGridLayout || toggleLayout()">
-                    <cwg-icon icon="crm-list" :size="16" :color="!isDark ? '#6c8595' : '#fff'" />
+            <view class="col-lg-12">
+                <view class="clearfix">
+                    <view class="card">
+                        <view class="card-header">
+                            <view class="nav nav-underline card-header-tabs" id="myTab" role="tablist">
+                                <view class="nav-item cwg-cursor" v-for="(tab, index) in tabs" :key="index"
+                                    @click="cativeIndex = index">
+                                    <view class="nav-link" :class="{ 'active': index === cativeIndex }">{{ tab.text }}
+                                    </view>
+                                </view>
+                            </view>
+                        </view>
+
+                        <view class="card-body">
+                            <view class="tab-content">
+                                <view class="tab-pane fade show active" id="home" role="tabpanel"
+                                    aria-labelledby="home-tab" tabindex="0">
+                                    <view class="row">
+                                        <AccountCard v-for="acc in accounts" :zhtype="cativeIndex"
+                                            :key="acc.accountNumber" :account="acc" :is-grid-layout="isGridLayout"
+                                            @action="handleAction" @copy="handleCopy"
+                                            @change-password="handleChangePassword" />
+                                        <view class="table-loading-mask">
+                                            <uni-loading v-if="loading" />
+                                        </view>
+                                        <cwg-empty-state v-if="!loading && accounts.length == 0" />
+                                        <DeleteAccountDialogs ref="deleteAccountDialogRef"
+                                            v-model:visible="deleteAccountDialogVisible" />
+                                        <cwg-improve-popup v-model:visible="dialogCheck" @confirm="confirm" />
+
+                                    </view>
+                                </view>
+                            </view>
+                        </view>
+                    </view>
                 </view>
             </view>
         </view>
-        <view v-if="accounts.length" :class="{ 'grid-layout': isGridLayout }">
-            <AccountCard v-for="acc in accounts" :zhtype="cativeIndex" :key="acc.accountNumber" :account="acc"
-                :is-grid-layout="isGridLayout" @action="handleAction" @copy="handleCopy"
-                @change-password="handleChangePassword" />
-        </view>
-        <view class="table-loading-mask">
-            <uni-loading v-if="loading" />
-        </view>
-        <cwg-empty-state v-if="!loading && accounts.length == 0" />
-        <DeleteAccountDialogs ref="deleteAccountDialogRef" v-model:visible="deleteAccountDialogVisible" />
-        <cwg-improve-popup v-model:visible="dialogCheck" @confirm="confirm" />
     </view>
 </template>
 
@@ -90,8 +105,8 @@ const typeMap = computed(() => ({
 const cativeIndex = ref(0)
 const isGridLayout = ref(true)
 const tabs = computed(() => ([
-    { id: 'real', name: t('vu.item1') },
-    { id: 'demo', name: t('vu.item2') }
+    { value: 'real', text: t('vu.item1') },
+    { value: 'demo', text: t('vu.item2') }
 ]))
 
 const toggleLayout = () => {
@@ -288,225 +303,7 @@ onMounted(async () => {
 <style scoped lang="scss">
 @import "@/uni.scss";
 
-.account-card {
-    width: 100%;
-    background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
-    box-sizing: border-box;
-}
-
-.tabs-container {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    gap: px2rpx(12);
-
-    .tabs-class {
-        width: px2rpx(200);
-        margin: px2rpx(20) 0;
-    }
-
-    .btn-primary {
-        width: px2rpx(26);
-        height: px2rpx(26);
-        border-radius: px2rpx(2);
-        border: none;
-        font-size: px2rpx(14);
-        text-align: center;
-        cursor: pointer;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: px2rpx(8);
-    }
-
-    .btn-primary2 {
-        background-color: rgba(108, 133, 149, 0.08);
-
-    }
-
-    .btn-class {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        border: 1px solid #f3f4f6;
-        font-size: px2rpx(14);
-        height: px2rpx(34);
-        text-align: center;
-        cursor: pointer;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: px2rpx(8);
-        padding: px2rpx(4) px2rpx(8);
-        box-sizing: border-box;
-    }
-
-    .btn-primary:active {}
-}
-
-
-
-.content-title {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    font-size: px2rpx(22);
-    font-weight: 500;
-    color: #fff;
-    background-color: rgba(255, 255, 255, 0);
-
-    .content-title-btns {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: px2rpx(12);
-
-
-        .btn-primary {
-            min-width: px2rpx(120);
-            background-color: var(--color-error);
-            color: #fff;
-            padding: 0 px2rpx(12);
-            border: none;
-            font-size: px2rpx(14);
-            text-align: center;
-            cursor: pointer;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            gap: px2rpx(8);
-        }
-
-        .btn-primary1 {
-            background-color: #cf1322;
-        }
-
-        .btn-primary2 {
-            background-color: var(--color-secondary-focus);
-        }
-    }
-}
-
-/* 网格布局样式 */
-.grid-layout {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(px2rpx(320), px2rpx(320)));
-    // justify-content: space-between;
-    gap: px2rpx(20);
-
-    @media (max-width: 1200px) {
-        grid-template-columns: repeat(auto-fill, minmax(px2rpx(320), px2rpx(320)));
-    }
-
-    @media (max-width: 768px) {
-        grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
-        gap: px2rpx(20);
-    }
-
-    .account-card {
-        margin-bottom: 0;
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-    }
-
-    .account-card .main-content {
-        flex: 1;
-    }
-}
-
-.operation-btn {
-    :deep(span) {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: px2rpx(4);
-        cursor: pointer;
-        background-color: var(--color-slate-150);
-        padding: px2rpx(8) 0;
-    }
-}
-
-.operation-btn.disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-}
-
-.search-bar {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    flex-wrap: wrap;
-    gap: px2rpx(16);
-    margin: px2rpx(16) 0;
-
-    .cwg-combox,
-    .uni-easyinput,
-    .uni-date {
-        width: px2rpx(240) !important;
-        flex: none;
-    }
-}
-
-.expand-btn {
-    display: flex;
-    align-items: center;
-    justify-self: center;
-    gap: 4px;
-    cursor: pointer;
-    width: px2rpx(32);
-    height: px2rpx(32);
-    justify-content: center;
-
-    .icon {
-        transition: transform 0.3s ease;
-    }
-
-    &:hover {
-        background-color:
-            color-mix(in oklab, var(--color-slate-300) 20%, transparent);
-    }
-
-    &.expanded {
-        background-color:
-            color-mix(in oklab, var(--color-slate-300) 20%, transparent);
-    }
-
-    &.expanded .icon {
-        transform: rotate(180deg);
-    }
-
-}
-
-.action-buttons {
-    display: flex;
-    flex-wrap: wrap;
-    gap: px2rpx(8);
-    justify-content: flex-end;
-    padding: px2rpx(16) px2rpx(20);
-    background-color: var(--color-slate-100);
-
-    .action-btn {
-        display: inline-flex;
-        align-items: center;
-        height: px2rpx(24);
-        padding: 0 px2rpx(16);
-        border: none;
-        background-color: var(--color-secondary-focus);
-        color: var(--color-white);
-        font-size: px2rpx(13);
-        font-weight: 500;
-        cursor: pointer;
-        transition: all 0.2s ease;
-
-        .icon {
-            margin-right: px2rpx(4);
-        }
-    }
-
-    .action-btn.disabled {
-        cursor: not-allowed;
-        opacity: 0.5;
-    }
+.btn {
+    margin: 0;
 }
 </style>

static/scss/global/global.scss

@@ -1,7 +1,7 @@
 @use 'sass:math';
 
 @function px2rpx($px) {
-    @return $px * 1rpx;
+    @return $px * 2rpx;
 }
 
 :root {
@@ -264,6 +264,30 @@
     --bs-form-valid-border-color: #22B07E;
     --bs-form-invalid-color: #FF401C;
     --bs-form-invalid-border-color: #FF401C;
+    --bs-link-color: #316AFF;
+    --bs-link-color-rgb: 49, 106, 255;
+    --bs-link-hover-color: #2a5ad9;
+    --bs-link-hover-color-rgb: 42, 90, 217;
+    --bs-secondary: #ef4223;
+    --bs-light: #ECF2FD;
+    --bs-primary-rgb: 253, 106, 3;
+    --bs-secondary-rgb: #ef4223;
+    --bs-light-rgb: 236, 242, 253;
+    --bs-secondary-text-emphasis: #142a66;
+
+    --bs-light-text-emphasis: #5e6165;
+    --bs-secondary-bg-subtle: #eaf0ff;
+    --bs-secondary-bg-subtle: #fff2e7;
+    --bs-light-bg-subtle: #f9fbfe;
+    --bs-secondary-border-subtle: #d6e1ff;
+    --bs-secondary-border-subtle: #fff2e7;
+    --bs-light-border-subtle: #f9fbfe;
+    --bs-btn-primary-hover: #2c5fe6;
+    --bs-btn-primary-border-hover: #2b5de0;
+    --bs-btn-primary-active: #2b5de0;
+    --bs-btn-secondary-hover: #e6740e;
+    --bs-btn-secondary-border-hover: #e0720e;
+    --bs-btn-secondary-active: #e0720e;
 }
 
 .dark {
@@ -576,7 +600,7 @@
 body {
     min-height: 100vh;
     margin: 0 auto !important;
-    font-size: px2rpx(12);
+    // font-size: px2rpx(12);
     line-height: 1;
     color: var(--bs-emphasis-color);
 }

uni.scss

@@ -12,7 +12,7 @@
  * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
  */
 @function px2rpx($px) {
-  @return $px * 1rpx;
+  @return $px * 2rpx;
 }
 
 @import '@/uni_modules/uni-scss/variables.scss';

windows/top-window.vue

@@ -40,6 +40,7 @@ const props = defineProps({
 </script>
 
 <style scoped lang="scss">
+@import "@/uni.scss";
 .cwg-pc-header {
   display: flex;
   align-items: center;