From 2eb4dd6f50b75c9ec844d08eded5365cd79e4207 Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Wed, 09 Jul 2025 15:59:00 +0800
Subject: [PATCH] style
---
src/views/news/index.vue | 67 ++++++++++++++++++++++++++++-----
1 files changed, 57 insertions(+), 10 deletions(-)
diff --git a/src/views/news/index.vue b/src/views/news/index.vue
index 07bdf6c..b6ca307 100644
--- a/src/views/news/index.vue
+++ b/src/views/news/index.vue
@@ -39,14 +39,16 @@
<div class="font-bold block text-18">{{ item.name }}</div>
<div class="font-bold block text-20">{{ item.ask }}</div>
<div class="w-full h-50">
- <div id="DOGEUSDT" class="w-full h-full"
- style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
- <!-- 图表容器保持不变 -->
+ <div id="DOGEUSDT" class="w-full h-full relative overflow-hidden"
+ style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);margin: 0 10px;">
+ <!-- 添加进度条动画 -->
+ <div class="absolute top-10 left-0 h-1 bg-blue-500 progress-bar-animation"
+ :style="{width: '80%'}"></div>
</div>
</div>
<div class="flex justify-between">
<div class="py-2 px-8 rounded-full text-13 font-medium bg-white">{{item.change_ratio_str}}</div>
- <span class="text-18">→</span>
+ <span class="text-18" :class="index % 2 === 1 ? 'c2c_color' : ''">→</span>
</div>
</div>
</div>
@@ -67,7 +69,7 @@
<div class="w-40 h-40 rounded-full flex items-center justify-center">
<img class="w-33 h-33" src="@/assets/c.jpg" draggable="false">
</div>
- <div class="text-center">{{t('币币交易')}}</div>
+ <div class="text-center">{{t('外汇交易')}}</div>
</div>
<div class="flex-1 flex flex-col items-center" @click="goToPage('/cryptos/perpetualContract/USDSGD?selectIndex=2')">
<div class="w-40 h-40 rounded-full flex items-center justify-center">
@@ -86,7 +88,7 @@
<!-- 新手指南部分 -->
<div class="mt-20 mx-17 h-50 rounded-5 bg-#d8f0dd font-500 flex items-center justify-between text-16 px-15" @click="goToExplanation">
<span>{{t('新手')}}</span>
- <div class="i-material-symbols:arrow-right-alt-rounded text-20"></div>
+ <div class="text-20">→</div>
</div>
@@ -121,7 +123,7 @@
</template>
<script setup>
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, onUnmounted } from 'vue';
import { _getInformationList } from '@/service/etf.api'
import {_getHomeList} from '@/service/cryptos.api'
import { showToast } from 'vant'
@@ -169,11 +171,38 @@
})
}
+
const getHomeList = () => {
- _getHomeList().then(data => {
- hotItems.value = data.slice(0, 3) // 取前3条数据
+ const intervalId = ref(null)
+ if (intervalId.value) {
+ clearInterval(intervalId.value)
+ }
+
+ const fetchData = () => {
+ _getHomeList().then(data => {
+ hotItems.value = data.slice(0, 3) // 取前3条数据
+ })
+ }
+
+ // 立即执行一次
+ fetchData()
+
+ intervalId.value = setInterval(fetchData, 1000)
+
+ onUnmounted(() => {
+ if (intervalId.value) {
+ clearInterval(intervalId.value)
+ }
+ })
+
+ router.beforeEach((to, from, next) => {
+ if (from.path === '/news/index') {
+ clearInterval(intervalId.value)
+ }
+ next()
})
}
+
// 添加跳转方法
const openOriginUrl = (url) => {
@@ -181,7 +210,7 @@
}
const copyInviteLink = () => {
- const inviteLink = 'https://www.thinkmarketga.com/#/pages/register?c=' + usercode.value // 替换为你的实际邀请链接
+ const inviteLink = 'https://www.thinkmarketga.com/#/pages/register?c=' + usercode.value // 邀请链接
navigator.clipboard.writeText(inviteLink)
.then(() => {
// 可以添加提示，比如使用Toast组件
@@ -203,4 +232,22 @@
overflow: hidden;
text-overflow: ellipsis;
}
+
+.progress-bar-animation {
+ animation: progress 1.5s ease-in-out forwards;
+ transform-origin: left;
+}
+
+@keyframes progress {
+ // 0% {
+ // transform: scaleX(0);
+ // }
+ // 100% {
+ // transform: scaleX(1);
+ // }
+}
+
+.c2c_color{
+ color: #fff;
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.3