From ef52095f5e9f0a9fe2da779bb1573947d77d75b6 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Fri, 22 May 2026 10:53:01 +0800
Subject: [PATCH] 1
---
src/views/my/index.vue | 696 +++++++++++++++++++++++++++------------------------------
1 files changed, 330 insertions(+), 366 deletions(-)
diff --git a/src/views/my/index.vue b/src/views/my/index.vue
index 70a1fc3..ed10bf5 100644
--- a/src/views/my/index.vue
+++ b/src/views/my/index.vue
@@ -1,418 +1,382 @@
<template>
<section class="my-index">
- <!-- <fx-header :back="false" :title="$t('my')">
- <template v-slot:right>
- <van-icon name="service-o" size="24" @click="$router.push('/customerService')"></van-icon>
- </template>
-</fx-header> -->
- <assets-head title="">
- <!-- <img src="../../../assets/image/assets-center/exchange.png" alt="exchange-img" class="w-44 h-38"
- @click="goRouter('/customerService')" /> -->
- <template v-slot:right>
- <van-icon name="service-o" size="24" @click="$router.push('/customerService')"></van-icon>
+ <!-- 顶部：资产 + 设置图标，浅蓝灰渐变 -->
+ <assets-head :title="$t('资产')" :show-left="false">
+ <template #default>
+ <van-icon name="setting-o" size="22" class="my-header-icon" @click="onRoute('/safety')" />
</template>
</assets-head>
- <div class="px-8 mt-4">
- <h1 class="text-2xl font-bold title" v-if="!(userStore.userInfo && userStore.userInfo.token)">{{
- $t('welcome')
- }} {{ $title }}!
- </h1>
- <p class="sub-text" v-if="!(userStore.userInfo && userStore.userInfo.token)">{{ $t('全球最大的区块链资产平台') }}</p>
- <p class="w-full flex mt-4 gap-x-4" v-if="!(userStore.userInfo && userStore.userInfo.token)">
- <van-button class="flex-1" round @click="onRoute('/register')">{{ $t('register') }}</van-button>
- <van-button class="flex-1" type="primary" round color="#f7b600" @click="onRoute('/login')">{{ $t('login')
- }}</van-button>
- </p>
- <div class="mt-4 flex items-start" v-else>
- <img class="w-24 h-24" src="@/assets/image/avatar.png" alt="avatar" />
- <div class="ml-5 pt-1 flex flex-col justify-center">
- <div class="font-bold text-lg name" style="width: 200px;overflow-wrap: break-word;">{{ userStore.userInfo &&
- userStore.userInfo.username }}</div>
- <div class="text-sm text-gray-400 mt-5 flex items-center id-text">
- ID：{{ userStore.userInfo && userStore.userInfo.usercode }}<img class="w-8 h-8 ml-4"
- src="@/assets/image/idcopy.png" alt="id" @click="copy" /></div>
- <div class="flex items-center justify-start mt-5">
- <div class="label pl-2 pr-2"
- :class="{ 'red': status == 0 || status == 3, 'yellow': status == 1, 'green': status == 2 }">
- {{ status == 0 ? $t('notCertified') :
- status == 1 ? $t('reviewing') : status == 2 ? $t('verified') : status == 3 ?
- $t('noPassView') : '' }}
- </div>
- <!-- <div class="label pl-2 pr-2 ml-3" :class="{ 'green': kycHighStatus == 2 }">
- {{ kycHighStatus == 2 ? $t('高级用户') : $t('普通用户') }}
- </div> -->
- <div class="pl-2 pr-2 ml-3" style="font-size: 12px;">{{ $t('信用分') }} : {{ userdata.creditScore }}</div>
+ <div class="my-content">
+ <!-- 用户/账号信息区 -->
+ <div class="my-card my-user-row" @click="!(userStore.userInfo && userStore.userInfo.token) && onRoute('/login')">
+ <div class="my-user-left">
+ <div class="my-avatar">
+ <van-icon name="user-o" size="28" class="my-avatar-icon" />
</div>
+ <div class="my-user-text">
+ <div class="my-user-name">
+ {{ (userStore.userInfo && userStore.userInfo.token) ? (userStore.userInfo.username || '') : $t('请登录') }}
+ <span v-if="!(userStore.userInfo && userStore.userInfo.token)" class="my-user-red-bar"></span>
+ </div>
+ <div class="my-user-ref">
+ {{ $t('推荐码') }}: {{ (userStore.userInfo && userStore.userInfo.usercode) || '91872511' }}
+ <van-icon name="records-o" size="14" class="my-copy-icon" @click.stop="copyRefCode" />
+ </div>
+ </div>
+ </div>
+ <van-icon name="arrow" class="my-arrow" />
+ </div>
+
+ <!-- 总资产估值 -->
+ <div class="my-card my-asset-row" @click="(userStore.userInfo && userStore.userInfo.token) && onRoute('/my/assets')">
+ <div class="my-asset-left">
+ <div class="my-asset-label">{{ $t('总资产估值') }} {{ $t('美元') }}</div>
+ <div class="my-asset-value">{{ totalAsset }}</div>
+ </div>
+ <van-icon name="arrow" class="my-arrow" />
+ </div>
+
+ <!-- 订金 / 提取 / 划转：浅紫底容器，本地图标 index-function1 / quick-function2 / quick-function3 -->
+ <div class="my-actions-card">
+ <div style="padding: 10px 14px;display: flex;width: 100%;
+ background-color: rgb(236, 230, 255);
+ border-radius: 16px;">
+ <div class="my-action-btn" @click="onRoute('/cryptos/recharge/rechargeList')">
+ <div class="my-action-circle">
+ <img :src="actionIcon1" alt="" class="my-action-img" />
+ </div>
+ <span class="my-action-label">{{ $t('订金') }}</span>
+ </div>
+ <div class="my-action-btn" @click="onRoute('/cryptos/Withdraw/withdrawPage')">
+ <div class="my-action-circle">
+ <img :src="actionIcon2" alt="" class="my-action-img" />
+ </div>
+ <span class="my-action-label">{{ $t('提取') }}</span>
+ </div>
+ <div class="my-action-btn" @click="onRoute('/my/transfer')">
+ <div class="my-action-circle">
+ <img :src="actionIcon3" alt="" class="my-action-img" />
+ </div>
+ <span class="my-action-label">{{ $t('划转') }}</span>
+ </div>
+ </div>
+
+ </div>
+
+ <!-- 列表块1：人工智能交易、资金明细、空投 -->
+ <div class="my-list-card">
+ <div class="my-list-item" @click="onRoute('/my/aiDetail')">
+ <van-icon name="cluster-o" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('人工智能交易') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ <div class="my-list-item" @click="onRoute('/cryptos/accountChange')">
+ <van-icon name="chart-trending-o" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('资金明细') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ <div class="my-list-item" @click="onRoute('/my/airdrop')">
+ <van-icon name="gift-o" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('空投') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ </div>
+
+ <!-- 列表块2：加密货币交易、申请成为交易员、期货订单、现货订单 -->
+ <div class="my-list-card">
+ <div class="my-list-item" @click="onRoute('/cryptos/trade/btcusdt')">
+ <van-icon name="friends-o" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('加密货币交易') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ <div class="my-list-item my-list-item--na">
+ <van-icon name="chat-o" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('申请成为交易员') }}</span>
+ <span class="my-list-na">{{ $t('不适用') }}</span>
+ </div>
+ <div class="my-list-item" @click="onRoute('/trade/index')">
+ <van-icon name="completed" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('期货订单') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ <div class="my-list-item" @click="onRoute('/cryptos/trade/btcusdt')">
+ <van-icon name="description" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('现货订单') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ </div>
+
+ <!-- 列表块3：实名认证、客服 -->
+ <div class="my-list-card">
+ <div class="my-list-item" @click="onRoute('/certificationCenter')">
+ <van-icon name="idcard" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('实名认证') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
+ </div>
+ <div class="my-list-item" @click="onRoute('/customerService')">
+ <van-icon name="service-o" size="20" class="my-list-icon" />
+ <span class="my-list-title">{{ $t('客服') }}</span>
+ <van-icon name="arrow" size="16" class="my-list-arrow" />
</div>
</div>
</div>
-
- <template v-if="(userStore.userInfo && userStore.userInfo.token)">
- <van-divider :style="{ borderColor: '#ddd' }" hairline />
- <div class="mt-10 px-8" v-if="(userStore.userInfo && userStore.userInfo.token)">
- <div class="title_s font-bold">{{ t('快捷入口') }}</div>
- <div class="flex flex-start items-start">
- <div class="label_item flex flex-col items-center justify-center mt-8" @click="onRoute('/safety')">
- <img src="@/assets/imgs/my/安全.png" alt="">
- <div>{{ t('安全') }}</div>
- </div>
- <!-- <div class="label_item flex flex-col items-center justify-center mt-8" @click="onRoute('/changePassword')">
- <img src="@/assets/imgs/my/密码.png" alt="">
- <div>{{ t('修改密码') }}</div>
- </div> -->
- <div class="label_item flex flex-col items-center justify-center mt-8"
- @click="onRoute('/cryptos/accountChange')">
- <img src="@/assets/imgs/my/记录.png" alt="">
- <div>{{ t('账变记录') }}</div>
- </div>
- <!-- <div class="label_item flex flex-col items-center justify-center mt-8"
- @click="onRoute('/certificationCenter')">
- <img src="@/assets/imgs/my/身份认证.png" alt="">
- <div>{{ t('authVerify') }}</div>
- </div> -->
- </div>
- </div>
- </template>
-
- <template v-for="(item, index) in cellList" :key="index">
- <van-divider :style="{ borderColor: '#ddd' }" hairline />
- <div class="mt-10 px-8">
- <div class="title_s font-bold">{{ item.title }}</div>
- <div class="flex flex-start items-start flex-wrap">
- <div class="label_item flex flex-col items-center justify-center mt-8" v-for="(_item, _index) in item.list"
- :key="_index" @click="onRoute(_item.path)">
- <img :src="_item.icon" alt="">
- <div>{{ _item.title }}</div>
- </div>
- </div>
- </div>
- </template>
-
- <template v-if="userStore.userInfo && userStore.userInfo.token">
- <van-divider :style="{ borderColor: '#ddd' }" hairline />
- <van-cell-group :border="false">
- <van-cell is-link="is-link" center="center" :title="item.title" @click="onRoute(item.path)"
- v-for="(item, index) in tyList" :key="index">
- <template #icon>
- <img class="cell-img" :src="item.icon" />
- </template>
- </van-cell>
- </van-cell-group>
- </template>
-
- <template v-if="userStore.userInfo && userStore.userInfo.token">
- <van-divider :style="{ borderColor: '#ddd' }" hairline />
- <div class="px-4 mt-4">
- <p class="w-full flex mt-4 gap-x-4">
- <van-button type="primary" class="flex-1" round color="#f7b600" @click="loginOut">{{ $t('loginOut')
- }}</van-button>
- </p>
- </div>
- </template>
</section>
</template>
<script setup>
-import { reactive, onMounted, ref, computed } from 'vue';
+import { ref, computed, onMounted } from 'vue';
import { useRouter } from 'vue-router';
-import { _getIdentify, _getKycHighLevel, _logOut, _info, _customer } from "@/service/user.api.js";
+import { _getIdentify, _getKycHighLevel, _info } from "@/service/user.api.js";
+import { _getContractBySymbolType } from "@/service/etf.api.js";
import { useUserStore } from '@/store/user';
import { useI18n } from "vue-i18n";
import useClipboard from "vue-clipboard3";
import { showToast } from "vant";
-import addBankIcon from '@/assets/image/userCenter/addBank.png'
-import kycHighStatusIcon from '@/assets/image/userCenter/kycHighStatus.png'
-import store from '@/store/store'
-import { customerServiceUrl } from '@/config'
-const { t } = useI18n()
+import AssetsHead from '@/components/Transform/assets-head/index.vue';
+// 订金/提取/转移 三个图标（本地图片，用 import 保证打包后地址正确）
+import actionIcon1 from '@/assets/imgs/new/index-function1.png';
+import actionIcon2 from '@/assets/imgs/new/quick-function2.png';
+import actionIcon3 from '@/assets/imgs/new/quick-function3.png';
+
+const { t } = useI18n();
const { toClipboard } = useClipboard();
+const router = useRouter();
+const userStore = useUserStore();
-const router = useRouter()
-const userStore = useUserStore()
-const customer_service_url = ref(customerServiceUrl) // 客服链接,有值的话就会跳转到客服外链
-const status = ref(null)
-const kycHighStatus = ref(null)
-const userdata = ref({})
-// 通用列表
-const tyList = [
- { title: t('关于我们'), icon: new URL('@/assets/image/assets-center/aboutUs.png', import.meta.url), path: '/aboutUs?serviceTerm=20' },
- { title: t('用户协议'), icon: new URL('@/assets/image/assets-center/yhxy.png', import.meta.url), path: '/aboutUs?serviceTerm=23' },
- { title: t('隐私政策'), icon: new URL('@/assets/image/assets-center/yszc.png', import.meta.url), path: '/aboutUs?serviceTerm=24' },
- { title: t('安全规定'), icon: new URL('@/assets/image/assets-center/aqzc.png', import.meta.url), path: '/aboutUs?serviceTerm=21' },
- { title: t('反洗钱协议'), icon: new URL('@/assets/image/assets-center/yhxy.png', import.meta.url), path: '/aboutUs?serviceTerm=25' },
- { title: t('法律声明'), icon: new URL('@/assets/image/assets-center/aqzc.png', import.meta.url), path: '/aboutUs?serviceTerm=22' },
- { title: t('金融服务牌照'), icon: new URL('@/assets/image/assets-center/yhxy.png', import.meta.url), path: '/aboutUs?serviceTerm=26' },
-]
-const state = reactive({
- cellList: [
- {
- title: t('safe'), list: [
- { icon: 'shield-o', title: t('safe'), path: '/safety' },
- { icon: 'setting-o', title: t('changePassword'), path: '/changePassword' },
- { icon: addBankIcon, title: t('AddPaymentMethod'), path: '/payMentMethod/list' }
- ]
- },
- {
- title: t('universal'), list: [
- { icon: 'font-o', title: t('language'), path: '/language' },
- { icon: 'service-o', title: t('onLineService'), path: '/customerService' },
- { icon: 'idcard', title: t('authVerify'), path: '/certificationCenter', show: true },
- { icon: 'todo-list-o', title: t('账变记录'), path: '/cryptos/accountChange' },
- { icon: 'gold-coin-o', title: t('计价方式'), path: '/cryptos/exchangeRate' },
- ]
- }
- ]
-})
+const status = ref(null);
+const kycHighStatus = ref(null);
+const userdata = ref({});
+const moneyContract = ref(null); // assets!getContractBySymbolType.action 的 money_contract
+
+const totalAsset = computed(() => {
+ if (!(userStore.userInfo && userStore.userInfo.token)) return '0';
+ if (moneyContract.value != null && moneyContract.value !== '') {
+ return Number(moneyContract.value).toFixed(2);
+ }
+ const balance = userStore.userInfo.balance ?? userdata.value?.money ?? 0;
+ return Number(balance).toFixed(2);
+});
+
const onRoute = (path) => {
- if (path == '/customerService') {
- if (customer_service_url.value) {
- window.location.href = customer_service_url.value;
- } else {
- router.push(path)
- }
- } else {
- router.push(path)
- }
-}
-onMounted(() => {
- if (userStore.userInfo && userStore.userInfo.token) {
- getIdentify()
- getKycHighLevel()
- getinfo()
- // getcustomer()
- }
-})
-const cellList = computed(() => {
- if (userStore.userInfo && userStore.userInfo.token) {
- return [
- // {
- // title: t('safe'), list: [
- // // { icon: 'shield-o', title: t('safe'), path: '/safety' },
- // // { icon: 'setting-o', title: t('changePassword'), path: '/changePassword' },
- // { icon: addBankIcon, title: t('AddPaymentMethod'), path: '/payMentMethod/list' }
- // ]
- // },
- {
- title: t('universal'), list: [
- { icon: new URL('../../assets/image/assets-center/language.png', import.meta.url), title: t('language'), path: '/language' },
- { icon: new URL('../../assets/image/assets-center/onLineService.png', import.meta.url), title: t('onLineService'), path: '/customerService' },
- { icon: new URL('../../assets/image/assets-center/authVerify.png', import.meta.url), title: t('authVerify'), path: '/certificationCenter', show: true },
- // { icon: new URL('../../assets/image/assets-center/AdvancedCertification.png', import.meta.url), title: t('高级认证'), path: '/advancedCtf', show: true },
- // { icon: 'todo-list-o', title: t('账变记录'), path: '/cryptos/accountChange' },
- { icon: new URL('../../assets/image/assets-center/valuation.png', import.meta.url), title: t('计价方式'), path: '/cryptos/exchangeRate' },
- // { icon: new URL('../../assets/image/assets-center/AddPaymentMethod.png', import.meta.url), title: t('AddPaymentMethod'), path: '/payMentMethod/list' },
- // { icon: new URL('../../assets/image/assets-center/help.png', import.meta.url), title: t('帮助中心'), path: '/helpCenter' }, // 原帮助中心页面
- { icon: new URL('../../assets/image/assets-center/help.png', import.meta.url), title: t('帮助中心'), path: '/aboutUs?serviceTerm=27' }, // 现跳转关于我们通过后台编辑获取的页面
- ]
- }
- ]
- } else {
- return [
- {
- title: t('universal'), list: [
- { icon: new URL('../../assets/image/assets-center/language.png', import.meta.url), title: t('language'), path: '/language' },
- // { icon: 'gold-coin-o', title: t('计价方式'), path: '/cryptos/exchangeRate' },
- { icon: new URL('../../assets/image/assets-center/aboutUs.png', import.meta.url), title: t('onLineService'), path: '/customerService' },
-
- ]
- },
- // {
- // title: t('更多'), list: [
- // { icon: 'question-o', title: t('帮助中心'), path: '/helpCenter' },
- // { icon: 'user-o', title: t('关于我们'), path: '/aboutUs' }
- // ]
- // }
- ]
- }
-
-})
-const loginOut = () => {
- _logOut({
- token: userStore.userInfo.token
- }).then(res => {
- userStore.userInfo = {}
- store.state.user.userInfo = {}
- })
-}
-// 获取客服信息
-const getcustomer = () => {
- _customer().then((data) => {
- customer_service_url.value = data.customer_service_url
- console.log(customer_service_url);
- }).catch(error => {
- console.error('Error fetching data:', error);
- });
+ router.push(path);
};
-const getinfo = () => {
- _info().then((data) => {
- userdata.value = data; // 确保 userdata 被正确声明
- }).catch(error => {
- console.error('Error fetching data:', error);
- });
-};
-const getIdentify = () => {
- _getIdentify().then(data => {
- status.value = data.status
- })
-}
-const getKycHighLevel = () => {
- _getKycHighLevel().then((data) => {
- kycHighStatus.value = data.status
- })
-}
-const copy = async () => {
+
+const copyRefCode = async () => {
+ const code = (userStore.userInfo && userStore.userInfo.usercode) || '91872511';
try {
- await toClipboard(userStore.userInfo && userStore.userInfo.usercode);
+ await toClipboard(code);
showToast(t('copySuccess'));
} catch (e) {
console.error(e);
}
-}
+};
+
+onMounted(() => {
+ if (userStore.userInfo && userStore.userInfo.token) {
+ getIdentify();
+ getKycHighLevel();
+ getinfo();
+ getContractAsset();
+ }
+});
+
+const getinfo = () => {
+ _info().then((data) => {
+ userdata.value = data;
+ }).catch(() => {});
+};
+
+const getContractAsset = () => {
+ _getContractBySymbolType('cryptos').then((res) => {
+ moneyContract.value = res?.money_contract ?? null;
+ }).catch(() => {});
+};
+const getIdentify = () => {
+ _getIdentify().then(data => { status.value = data.status; });
+};
+const getKycHighLevel = () => {
+ _getKycHighLevel().then(data => { kycHighStatus.value = data.status; });
+};
</script>
<style lang="scss" scoped>
-:deep(.van-cell-group__title) {
- // background: $main2_background !important;
- background: $inp-b !important;
- padding: 12px 16px;
-}
+@import '@/assets/theme/index.scss';
-:deep(.van-cell-group) {
- .van-icon {
- display: flex;
- align-items: center;
+/* 一比一还原图片：扁平、浅紫容器、紫色圆图标+下方深色文字 */
+$my-bg: #f8f8f8;
+$my-card-bg: #ffffff;
+$my-text: #333333;
+$my-text-secondary: #666666;
+$my-text-light: #999999;
+$my-purple: #7b3be2;
+$my-actions-bg: #f9f5ff;
+/* 顶部渐变：蓝透明 → 页面底，--bgoppose 可在外层定义 */
+$my-header-bg: linear-gradient(-180deg, rgba(2, 149, 253, 0.1), var(--bgoppose, #fff));
+
+.my-index {
+ min-height: 100vh;
+ background: $my-bg;
+ padding-bottom: 80px;
+ position: relative;
+ /* 顶部渐变向下延伸一块区域 */
+ &::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ height: 130px;
+ background: $my-header-bg;
+ z-index: 0;
+ pointer-events: none;
}
}
-
-:deep(.van-cell) {
- // background: $mainBgColor;
- // border-bottom: 1px solid $border_color;
-
- &:hover {
- // background: $mainBgColor;
- }
+.my-content {
+ position: relative;
+ z-index: 1;
}
-:deep(.van-cell-group__title) {
- background: $mainBgColor;
+:deep(#assetsHead .van-nav-bar) {
+ background: transparent !important;
+ .van-nav-bar__content { height: 56px; }
+ .van-nav-bar__title { font-size: 22px; font-weight: 700; color: $my-text; }
+ .van-nav-bar__right { padding-right: 16px; }
}
+.my-header-icon { color: $my-text; }
-:deep(.van-nav-bar__content) {
- // background: $mainBgColor;
-}
-
-:deep(.van-icon) {
- color: $text_color;
-}
-
-:deep(.van-cell__title) {
- color: $text_color;
-}
-
-:deep(.van-cell:after) {
+.my-card {
+ // background: $my-card-bg;
+ border-radius: 12px;
+ padding: 10px 20px;
+ // margin-bottom: 12px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
border: none;
}
-:deep(.van-grid-item__content) {
- // background: $selectSymbol_background;
+// .my-user-row { margin-bottom: 12px; }
+.my-user-left {
+ display: flex;
+ align-items: center;
+ gap: 12px;
}
-
-:deep(.van-grid-item__text) {
- color: $text_color;
+.my-avatar {
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ background: $my-purple;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-shrink: 0;
+}
+.my-avatar-icon { color: #fff; }
+.my-user-text { min-width: 0; }
+.my-user-name {
+ font-size: 17px;
+ font-weight: 400;
+ color: $my-text;
+ display: flex;
+ align-items: center;
+ gap: 6px;
+}
+.my-user-red-bar {
+ width: 2px;
+ height: 12px;
+ background: #ee0a24;
+ border-radius: 1px;
+ flex-shrink: 0;
+}
+.my-user-ref {
font-size: 13px;
- height: 30px;
+ color: $my-text-light;
+ margin-top: 6px;
+ display: flex;
+ align-items: center;
+ gap: 4px;
}
+.my-copy-icon { color: $my-text-light; flex-shrink: 0; }
+.my-arrow { color: $my-text-secondary; font-size: 16px; }
-.my-index {
- padding-bottom: 60px;
- background: $mainbgWhiteColor;
-
- .title_s {
- font-size: 16px;
- }
-
- .label_item {
- width: 33%;
- font-size: 12px;
-
- div {
- text-align: center;
- }
-
- img {
- width: 32%;
- margin-bottom: 3px;
- }
- }
-
- .label {
- line-height: 18px;
- font-size: 12px;
- height: 18px;
- border: $icon-bg solid 1px;
- border-radius: 5px;
- }
-
- .yellow {
- border-color: #F5C421;
- }
-
- .red {
- border-color: $red;
- }
-
- .green {
- border-color: $green;
- }
+.my-asset-row { background-color: #fff; }
+.my-asset-left { min-width: 0; }
+.my-asset-label {
+ font-size: 13px;
+ color: $my-text-light;
+ margin-bottom: 4px;
}
-
-h1.title {
- font-size: 22px;
- line-height: 26px;
-}
-
-.sub-text {
- padding: 10px 0;
- color: $text_color1;
- font-size: 12px;
-}
-
-.name {
- font-size: 16px;
- line-height: 20px;
-}
-
-.yellow {
- color: #F5C421;
-}
-
-.red {
- color: $red;
-}
-
-.green {
- color: $green;
-}
-
-.id-text {
- font-size: 14px;
+.my-asset-value {
+ font-size: 30px;
font-weight: 700;
+ color: $my-text;
}
-.grid-item-img {
- width: 48px;
- height: 48px;
- margin-bottom: 5px;
+/* 三按钮：浅紫底容器无边框，紫色圆+白图标，下方深色文字 */
+.my-actions-card {
+ background-color: #fff;
+ border-radius: 14px;
+ padding: 14px 20px;
+ margin-bottom: 16px;
+ display: flex;
+ justify-content: space-between;
+ gap: 16px;
+ border: none;
+ box-shadow: none;
+}
+.my-action-btn {
+ flex: 1;
+ min-width: 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 10px;
+ cursor: pointer;
+}
+.my-action-circle {
+ width: 50px;
+ height: 50px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ .van-icon { color: #fff; }
+ .my-action-img {
+ width: 45px;
+ height: 45px;
+ object-fit: contain;
+ }
+}
+.my-action-label {
+ font-size: 13px;
+ font-weight: 400;
+ color: $my-text;
}
-.van-grid-main {
- padding: 5px 0;
+/* 列表块：白底、无边框、细分割线、扁平 */
+.my-list-card {
+ background: $my-card-bg;
+ border-radius: 12px;
+ margin-bottom: 12px;
+ overflow: hidden;
+ border: none;
+ box-shadow: none;
}
-
-.cell-img {
- width: 20px;
- height: 20px;
- margin-right: 10px;
+.my-list-item {
+ display: flex;
+ align-items: center;
+ padding: 16px 20px;
+ font-size: 15px;
+ color: $my-text;
}
-</style>
\ No newline at end of file
+.my-list-icon { color: $my-text-secondary; margin-right: 12px; flex-shrink: 0; }
+.my-list-title { flex: 1; }
+.my-list-arrow { color: $my-text-secondary; flex-shrink: 0; }
+.my-list-item--na { cursor: default; }
+.my-list-na {
+ font-size: 12px;
+ color: $my-text-secondary;
+ flex-shrink: 0;
+}
+</style>
--
Gitblit v1.9.3