From fcb00a66b4053550b473a29d7299c7a4737eea75 Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Wed, 16 Jul 2025 14:41:04 +0800
Subject: [PATCH] 翻译
---
src/components/ex-tabs/index.vue | 214 +++++++++++++++++++++++++++--------------------------
1 files changed, 108 insertions(+), 106 deletions(-)
diff --git a/src/components/ex-tabs/index.vue b/src/components/ex-tabs/index.vue
index 46c450a..f54b223 100644
--- a/src/components/ex-tabs/index.vue
+++ b/src/components/ex-tabs/index.vue
@@ -1,124 +1,126 @@
<template>
- <div class="ex-tabs flex">
- <div class="ex-tab" v-for="(item, index) in listArr" :key="index" @click="changeTab(index)"
- :class="active == index ? 'active' : ''">
- {{ item.name }}
- <div class="hx"></div>
- </div>
+ <div class="ex-tabs flex">
+ <div
+ class="ex-tab"
+ v-for="(item, index) in listArr"
+ :key="index"
+ @click="changeTab(index)"
+ :class="active == index ? 'active' : ''"
+ >
+ {{ item.name }}
+ <!-- <div class="hx"></div> -->
</div>
+ </div>
</template>
<script>
export default {
- props: {
-
- },
- components: {
-
- },
- data() {
- return {
- active: 0,
- listArr: [
- // {
- // name: this.$t('热门')
- // },
- {
- name: this.$t('涨幅榜')
- },
- {
- name: this.$t('跌幅榜')
- },
- // {
- // name: this.$t('24h成交额')
- // }
- ],
- }
- },
- methods: {
- changeTab(index) {
- this.active = index;
- this.$emit('tabs', index)
+ props: {},
+ components: {},
+ data() {
+ return {
+ active: 0,
+ listArr: [
+ // {
+ // name: this.$t('热门')
+ // },
+ {
+ name: this.$t("涨幅榜"),
},
+ {
+ name: this.$t("跌幅榜"),
+ },
+ // {
+ // name: this.$t('24h成交额')
+ // }
+ ],
+ };
+ },
+ methods: {
+ changeTab(index) {
+ this.active = index;
+ this.$emit("tabs", index);
},
- activated() {
- this.listArr = [
- // {
- // name: this.$t('热门')
- // },
- {
- name: this.$t('涨幅榜')
- },
- {
- name: this.$t('跌幅榜')
- },
- // {
- // name: this.$t('24h成交额')
- // }
- ]
- },
-}
+ },
+ activated() {
+ this.listArr = [
+ // {
+ // name: this.$t('热门')
+ // },
+ {
+ name: this.$t("涨幅榜"),
+ },
+ {
+ name: this.$t("跌幅榜"),
+ },
+ // {
+ // name: this.$t('24h成交额')
+ // }
+ ];
+ },
+};
</script>
<style lang="scss" scoped>
-
.ex-tabs {
- font-size: 28px;
- display: flex;
- margin: 0 30px;
- border-bottom: 2px solid #F2F2F2 !important;
- padding-top: 22px;
- // justify-content: center;
- // align-items: center;
+ font-size: 28px;
+ display: flex;
+ margin: 0 30px;
+ // border-bottom: 2px solid #f2f2f2 !important;
+ padding-top: 22px;
+ // justify-content: center;
+ // align-items: center;
- .ex-tab {
- // flex: 1;
- min-width:150px;
- margin-right: 35px;
- text-align: center;
- padding: 18px 0px;
- border-radius: 4px;
- color: #787E8C;
- position: relative;
- @include themify() {
- border-bottom: 2px solid transparent !important;
- }
- // .hx{
- // width: 20px;
- // height: 2px;
- // position: absolute;
- // background-color: #2B64FB;
- // }
- }
-}
-
-.ex-tabs .active {
- min-width:150px;
- margin-right: 35px;
+ .ex-tab {
+ // flex: 1;
+ min-width: 150px;
+ // margin-right: 35px;
text-align: center;
padding: 18px 0px;
border-radius: 4px;
- color: #787E8C;
+ color: #787e8c;
position: relative;
- @include themify() {
- border-bottom: 2px solid transparent !important;
- color: themed("text_color") !important;
- }
- .hx{
- width: 45px;
- height: 2px;
- position: absolute;
- background-color: #2B64FB;
- left: 35%;
- bottom: -8px;
- }
- @include themify() {
- // width: 20px;
- // height: 2px;
- // position: absolute;
- // background-color: #2B64FB;
- // border-bottom: 2px solid themed("color_main") !important;
- }
-
+ // @include themify() {
+ // border-bottom: 2px solid transparent !important;
+ // }
+ // .hx{
+ // width: 20px;
+ // height: 2px;
+ // position: absolute;
+ // background-color: #2B64FB;
+ // }
+ }
}
-</style>
\ No newline at end of file
+
+.ex-tabs .active {
+ min-width: 150px;
+ // margin-right: 35px;
+ text-align: center;
+ padding: 18px 0px;
+ border-radius: 4px;
+ // color: #787e8c;
+ position: relative;
+ color: #f7b328 !important;
+ font-size: 38px;
+ font-weight: 700;
+ // @include themify() {
+ // border-bottom: 2px solid transparent !important;
+ // color: themed("text_color") !important;
+ // }
+ .hx {
+ width: 45px;
+ height: 2px;
+ position: absolute;
+ background-color: #2b64fb;
+ left: 35%;
+ bottom: -8px;
+ }
+ // @include themify() {
+ // width: 20px;
+ // height: 2px;
+ // position: absolute;
+ // background-color: #2B64FB;
+ // border-bottom: 2px solid themed("color_main") !important;
+ // }
+}
+</style>
--
Gitblit v1.9.3