From 2eef7e881d02d05bd0e1237a8456466f0c9afbce Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Tue, 08 Jul 2025 19:07:15 +0800
Subject: [PATCH] style
---
src/components/Transform/contract-header/index.vue | 68 +++++++++++++++++++++------------
1 files changed, 43 insertions(+), 25 deletions(-)
diff --git a/src/components/Transform/contract-header/index.vue b/src/components/Transform/contract-header/index.vue
index 7051af4..f66a27f 100644
--- a/src/components/Transform/contract-header/index.vue
+++ b/src/components/Transform/contract-header/index.vue
@@ -5,14 +5,14 @@
<div class="pl-30 pr-30">
<div class="flex justify-start pt-45 before">
<div class="flex items-center ">
- <img src="@/assets/image/icon_back_1.png" class="w-35 h-35 back" alt="" @click="jump()">
+ <img src="@/assets/image/icon_back.png" class="w-35 h-35 back" alt="" @click="jump()">
<img src="@/assets/theme/dark/image/black-convert.png" alt="convert-img" class="w-35 h-35" @click="onSidebar">
<div class="flex pl-21 textColor" @click="onSidebar">
<div class="font-35">{{ symbolName.toUpperCase() || '--' }}</div>
<div class="ml-15 font-28">{{ title }}</div>
</div>
- <div class="pl-10 w-160 font-28" :class="{ 'text-green': range > 0, 'text-red': range <= 0 }">{{ range > 0 ?
- '+' : '' }}{{ range || '--' }}%</div>
+ <div class="pl-10 w-160 font-28" :class="{ 'text-green': range > 0, 'text-red': range <= 0 }">{{ range || '--' }}%</div>
+ <!-- 右上角小图标 -->
<img src="@/assets/image/kline.png" class="w-44 h-44 right" alt="" @click="klineJump()">
</div>
<!-- <div class="flex items-center">
@@ -20,13 +20,14 @@
@click="jump" />
</div> -->
</div>
- <div class="flex justify-between pt-34">
- <button class="tabBtn w-368 h-74 lh-74 border-none rounded"
+ <!-- v-if="!selectIndex==2" -->
+ <div class="flex justify-between pt-34" >
+ <!-- <button class="tabBtn w-368 h-74 lh-74 border-none rounded"
:class="selectIndex == 1 ? 'select-active' : 'no-select'" @click="changeTab(1)">
- {{ $t('永续合约') }}</button>
- <button class="tabBtn w-368 h-74 lh-74 border-none rounded"
+ {{ $t('永续合约') }}</button> -->
+ <!-- <button class="tabBtn w-368 h-74 lh-74 border-none rounded"
:class="selectIndex == 2 ? 'select-one-active' : 'no-select'" @click="changeTab(2)">
- {{ queryType == 'cryptos' ? $t('交割合约') : $t('期货交易') }}</button>
+ {{ queryType == 'cryptos' ? $t('交割合约') : $t('期货交易') }}</button> -->
</div>
</div>
</div>
@@ -35,7 +36,7 @@
<div class="pl-42 border-b-color pt-48 pb-48">
<div class="textColor">
<span class="font-bold font-45 mr-12">{{ title }} {{ $t('合约') }}</span>
- <span class="font-30">/{{ queryType == 'cryptos' ? 'USDT' : 'USD'}} </span>
+ <span class="font-30">/{{ 'USD'}} </span>
</div>
</div>
<div class="pl-42 pr-40 font-28">
@@ -55,7 +56,7 @@
<div class="flex justify-between mb-50" v-for="item in list" :key="item.name" @click="onRoute(item)">
<div>
<div class="textColor font-28">{{ item.name }}</div>
- <div class="text-grey mt-10 font-28">{{ selectIndex == 1 ? $t('永续') : $t('交割') }}</div>
+ <!-- <div class="text-grey mt-10 font-28">{{ selectIndex == 1 ? $t('永续') : $t('交割') }}</div> -->
</div>
<div class="text-right">
<div class="textColor font-28">{{ item.close }}</div>
@@ -72,6 +73,7 @@
import { Popup } from "vant";
import { mapGetters } from "vuex";
import { _getHomeList } from "@/service/home.api";
+import { useQuotesStore } from '@/store/quotes.store';
import { THEME } from '@/config/theme'
import { setStorage } from '@/utils/utis'
export default {
@@ -111,6 +113,9 @@
},
computed: {
...mapGetters({ coinList: 'home/coinList' }),
+ ...mapGetters({
+ myCoinList: 'qoutes/coinList'
+ }),
title() {
return [this.$t('永续'), this.$t('交割')][this.selectIndex - 1]
}
@@ -140,7 +145,8 @@
methods: {
onRoute(item) {
if (this.$route.params.symbol !== item.symbol) {
- this.$router.push(`/cryptos/perpetualContract/${item.symbol}?type=${this.queryType}`)
+ this.$router.push(`/cryptos/perpetualContract/${item.symbol}?selectIndex=${this.selectIndex}`)
+ // debugger
this.$emit('update-coin', item.symbol)
setStorage('symbol', item.symbol)
this.$forceUpdate()
@@ -148,7 +154,17 @@
this.show = false
},
onSidebar() { // 侧边栏打开
- this.coins = this.coinList.map(item => item.symbol)
+ // console.log('侧边栏打开: ', this.selectIndex)
+ if (this.selectIndex == 2) {
+ const quotesData = JSON.parse(localStorage.getItem('qoutes'));
+ this.coins = quotesData.coins || [];
+ this.coins = quotesData.coins.map(item => item.symbol)
+ } else {
+ this.coins = this.coinList.map(item => item.symbol);
+ }
+
+ // quotesStore.coins
+
console.log(this.coins, 11111)
this.show = true
this.fetchList()
@@ -165,6 +181,7 @@
this.fetchList()
}, 1000)
})
+
},
onClose() {
if (this.timeout) {
@@ -173,20 +190,21 @@
}
},
jump() {
- if (this.$route.query?.from === 'trade') {
- this.$router.push('/trade/index?tabActive=1')
- return
- }
- if (this.$route.query.type == 'indices') {
- this.$router.push('/quotes/index')
- } else if (this.$route.query.type == 'US-stocks') {
- this.$router.push('/quotes/index?tabActive=3')
- } else {
- this.$router.push('/quotes/index?tabActive=1')
- }
+ this.$router.go(-1)
+ // if (this.$route.query?.from === 'trade') {
+ // this.$router.push('/trade/index?tabActive=1')
+ // return
+ // }
+ // if (this.$route.query.type == 'indices') {
+ // this.$router.push('/quotes/index')
+ // } else if (this.$route.query.type == 'US-stocks') {
+ // this.$router.push('/quotes/index?tabActive=3')
+ // } else {
+ // this.$router.push('/quotes/index?tabActive=1')
+ // }
},
klineJump() {
- this.$router.push(`/cryptos/trendDetails/${this.symbol}?type=${this.queryType}`)
+ this.$router.push(`/cryptos/trendDetails/${this.symbol}?type=${this.queryType}&selectIndex=${this.selectIndex}`)
},
changeTab(index) {
this.$emit('tab', index)
@@ -237,7 +255,7 @@
.select-one-active {
background-color: $red;
- color: $text_color;
+ color: #fff;
border: none;
}
--
Gitblit v1.9.3