From f66eee1d038afc05f1a727db256ba5c6818f6fb4 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 27 Jan 2026 15:35:51 +0800
Subject: [PATCH] 1
---
src/views/quotes/List.vue | 144 ++++++++++++++++++++++++++++++++---------------
1 files changed, 98 insertions(+), 46 deletions(-)
diff --git a/src/views/quotes/List.vue b/src/views/quotes/List.vue
index 7c203da..deaf664 100644
--- a/src/views/quotes/List.vue
+++ b/src/views/quotes/List.vue
@@ -13,7 +13,7 @@
</header>
<section class="quotes-tab-container">
<van-tabs v-model:active="tabActive" shrink @click-tab="onClickTab">
- <van-tab v-for="(item, index) in listTab" :key="item.tabIndex" :name="item.tabIndex" :title="item.title">
+ <van-tab v-for="item in listTab" :key="item.tabIndex" :name="item.tabIndex" :title="item.title">
<component @changeLetMego="handleChangeLetMego" :index="item.tabIndex" :tabActive="tabActive"
:is="components.get(item.type)" :key="item.tabIndex" ref="tabRefs" />
</van-tab>
@@ -60,7 +60,7 @@
const router = useRouter()
const route = useRoute()
-const tabActive = ref(0)
+const tabActive = ref(1)
const TITLE = import.meta.env.VITE_APP__TITLE
const showSave = ref(false)
const searchSrc = new URL(`../../assets/theme/${thStore.theme}/image/search.png`, import.meta.url)
@@ -124,18 +124,18 @@
)
const listTab = ref([
{
- title: 'ETF',
- type: 'Etf',
- urlMatch: 'etf',
- symbolType: 'indices',
- tabIndex: 8
- },
- {
title: t('加密货币'),
type: 'Cryptos',
urlMatch: 'crypto',
symbolType: 'cryptos',
tabIndex: 1
+ },
+ {
+ title: 'ETF',
+ type: 'Etf',
+ urlMatch: 'etf',
+ symbolType: 'indices',
+ tabIndex: 8
},
// {
// title: t('印度股'),
@@ -144,20 +144,20 @@
// symbolType: 'INDIA-stocks',
// tabIndex: 0
// },
- {
- title: t('UsStocks'),
- type: 'UsStock',
- urlMatch: 'stock',
- symbolType: 'US-stocks',
- tabIndex: 3
- },
- {
- title: t('港股'),
- type: 'HkStock',
- urlMatch: 'HK-stocks',
- symbolType: 'HK-stocks',
- tabIndex: 4
- },
+ // {
+ // title: t('UsStocks'),
+ // type: 'UsStock',
+ // urlMatch: 'stock',
+ // symbolType: 'US-stocks',
+ // tabIndex: 3
+ // },
+ // {
+ // title: t('港股'),
+ // type: 'HkStock',
+ // urlMatch: 'HK-stocks',
+ // symbolType: 'HK-stocks',
+ // tabIndex: 4
+ // },
// {
// title: t('台股'),
// type: 'TWStock',
@@ -378,13 +378,17 @@
.header {
display: flex;
- height: 34px;
- padding: 0 12px;
+ height: 56px;
+ padding: 0 20px;
justify-content: space-between;
+ align-items: center;
+ background: $main_background;
+ border-bottom: 1px solid rgba(118, 128, 143, 0.1);
.flex-l {
flex: 1;
display: inline-flex;
+ align-items: center;
.icon {
display: inline-block;
@@ -401,9 +405,10 @@
.title {
font-weight: 700;
- font-size: 20px;
- line-height: 28px;
+ font-size: 24px;
+ line-height: 32px;
color: $mainTextColor;
+ letter-spacing: -0.5px;
}
.icon-group {
@@ -411,11 +416,20 @@
.icon {
display: flex;
- width: 28px;
- height: 28px;
- margin-left: 16px;
+ width: 40px;
+ height: 40px;
+ margin-left: 12px;
justify-content: center;
align-items: center;
+ background: rgba(146, 209, 255, 0.08);
+ border-radius: 12px;
+ cursor: pointer;
+ transition: all 0.2s ease;
+
+ &:hover {
+ background: rgba(146, 209, 255, 0.12);
+ transform: scale(1.05);
+ }
}
}
@@ -423,26 +437,55 @@
}
.quotes-tab-container {
- margin-top: 18px;
+ margin-top: 0;
+ background: $main_background;
+
+ :deep(.van-tabs__nav) {
+ padding: 0 20px;
+ background: $main_background;
+ }
+
+ :deep(.van-tab) {
+ font-size: 15px;
+ font-weight: 500;
+ padding: 16px 20px;
+ color: $text_color1;
+ transition: all 0.2s ease;
+ }
+
+ :deep(.van-tab.van-tab--active) {
+ font-weight: 700;
+ color: $text_color;
+ }
+
+ :deep(.van-tabs__line) {
+ background: $color_main;
+ height: 3px;
+ border-radius: 2px;
+ width: 24px !important;
+ bottom: 7px;
+ }
}
}
.addBox {
- border-radius: 10px;
- width: 300px;
- height: 100px;
- font-size: 12px;
- background: $fina-border;
+ border-radius: 16px;
+ width: 320px;
+ min-height: 100px;
+ font-size: 13px;
+ background: $main_background;
position: fixed;
bottom: 70px;
left: 50%;
- margin-left: -150px;
+ margin-left: -160px;
z-index: 1000;
+ box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
+ border: 1px solid rgba(118, 128, 143, 0.1);
.add {
- padding: 16px;
+ padding: 20px;
box-sizing: border-box;
height: 100%;
position: relative;
@@ -450,20 +493,29 @@
.closeAdd {
position: absolute;
- right: 10px;
- top: 10px;
- width: 10px;
- height: 10px;
+ right: 12px;
+ top: 12px;
+ width: 24px;
+ height: 24px;
+ cursor: pointer;
+ opacity: 0.6;
+ transition: opacity 0.2s ease;
+
+ &:hover {
+ opacity: 1;
+ }
}
.angle {
position: absolute;
- bottom: -37px;
+ bottom: -12px;
width: 0;
height: 0;
- left: 131px;
- border: 20px solid transparent;
- border-top: 24px solid $fina-border;
+ left: 50%;
+ transform: translateX(-50%);
+ border: 12px solid transparent;
+ border-top: 12px solid $main_background;
+ filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}
}
}
--
Gitblit v1.9.3