From 631dc512b226b346fefaebbedf1ddd79c06cab71 Mon Sep 17 00:00:00 2001
From: 李凌 <344137771@qq.com>
Date: Thu, 09 Oct 2025 11:06:15 +0800
Subject: [PATCH] 二三给的
---
src/views/quotes/List.vue | 35 ++++++++++++++++++++++++++++++-----
1 files changed, 30 insertions(+), 5 deletions(-)
diff --git a/src/views/quotes/List.vue b/src/views/quotes/List.vue
index de6ba7b..e46622e 100644
--- a/src/views/quotes/List.vue
+++ b/src/views/quotes/List.vue
@@ -1,8 +1,15 @@
<template>
- <div class="quotes-list pt-5 pb-60 pl-5 pr-5" id="cryptos">
+ <div class="quotes-list pt-5 pb-40 pl-5 pr-5" id="cryptos">
<Head></Head>
- <list-quatation :listData="qList" />
+
+ <div class="tabs flex justify-start items-center textColor1">
+ <div v-for="i in tabList" :key="i" :class="i.key == tab ? 'textColor' : ''" @click="tab = i.key">
+ {{ i.name }}
+ </div>
+ </div>
+
+ <list-quatation :listData="qList" :tabActive="tab" />
</div>
</template>
@@ -11,11 +18,12 @@
import { useStore } from "vuex";
import { _getHomeList } from '@/service/cryptos.api'
import { TIME_OUT } from "@/config";
+import { useI18n } from "vue-i18n";
import ListQuatation from "@/components/Transform/list-quotation/index.vue";
import Head from './components/head.vue'
const store = useStore();
-console.log("aaaaaaaaaaa");
+const { t } = useI18n()
//#region 行情数据----------------------------------------
let qList = ref([])
@@ -46,15 +54,32 @@
}
})
//#endregion----------------------------------------------
+
+// tab切换
+const tab = ref(1)
+const tabList = [
+ { name: t('永续合约'), key: 1 },
+ { name: t('现货'), key: 2 },
+]
</script>
<style lang="scss" scoped>
.quotes-list {
- background: $mainbgWhiteColor;
+ // background: $mainbgWhiteColor;
min-height: 100vh;
:deep(.active) {
background-color: $bg_yellow;
- border-radius: 3rem;
+ // border-radius: 3rem;
+ }
+
+ .tabs {
+ font-size: 1.8rem;
+ margin-bottom: -2rem;
+ margin-top: 2rem;
+
+ &>div {
+ margin-right: 2rem;
+ }
}
}
</style>
\ No newline at end of file
--
Gitblit v1.9.3