From ef52095f5e9f0a9fe2da779bb1573947d77d75b6 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Fri, 22 May 2026 10:53:01 +0800
Subject: [PATCH] 1
---
src/views/cryptos/TrendDetails/index.vue | 122 +++++++---------------------------------
1 files changed, 23 insertions(+), 99 deletions(-)
diff --git a/src/views/cryptos/TrendDetails/index.vue b/src/views/cryptos/TrendDetails/index.vue
index 81cc86b..c66ad13 100644
--- a/src/views/cryptos/TrendDetails/index.vue
+++ b/src/views/cryptos/TrendDetails/index.vue
@@ -1,17 +1,17 @@
<template>
- <div id="cryptos">
- <div class="trend-detail pb-90" :class="isNight ? 'bg-night' : 'bg-white'">
+ <div id="cryptos" :class="{ 'trend-detail-white': kineType === 'trade' }">
+ <div class="trend-detail pb-90" >
<trade-head :backFunc="() => $router.push('/')" :symbol="symbol" :islevel="true" @update-coin="onUpdate"
@data="quote = $event" :title="$t('永续')" @changeLine="onChangeLine" :isNight="isNight" :isChange="isChange"
:kineType="kineType" :tabIndex="tab" @changeNight="OnchangeNight" :symbolName="quote.name" />
- <div class="flex justify-between px-32 pt-40" v-if="!kineType">
+ <!-- <div class="flex justify-between px-32 pt-40" v-if="!kineType">
<div class="w-368 h-80 mr-32 font-28 flex justify-center items-center rounded-ban box-border tabBtn"
:class="tab === '1' ? 'activeBtn' : ''" @click="onTab('1')">{{ $t('永续合约') }}</div>
<div class="w-368 h-80 font-28 flex justify-center items-center rounded-ban box-border tabBtn"
:class="tab === '2' ? 'activeBtn' : ''" @click="onTab('2')">{{ queryType == 'cryptos' ? $t('交割合约') :
$t('期货交易')
}}</div>
- </div>
+ </div> -->
<!-- 数据区 -->
<div :class="{ slide2: animated1, slide1: animated2 }">
<div class="data-index">
@@ -53,13 +53,13 @@
<span>{{ quote.market.time_zone && $t(quote.market.time_zone) }}</span>
</p>
<!-- k line-->
- <div class="mt-35 h-482-px">
+ <div class="mt-35 h-482-px ">
<kline-charts :update-key="updateKey" :update-data="quote" :isChangeLine="isChangeLine" :symbol="symbol"
v-if="symbol" @updataLine="isChangeLine = false" :isNight="isNight" :isChange="isChange" />
</div>
- <div class="w-full h-20 " :class="isNight ? 'bg-black' : 'bg-grey'"></div>
+ <div class="w-full h-20 " ></div>
<!-- tab 区域-->
- <div class="pb-180 tabContent">
+ <div class="pb-180 tabContent" style="background-color: #fff !important;">
<van-tabs v-model:active="active">
<van-tab :title="$t('entrustOrder')" name="1">
<div class="flex px-32 justify-between px-32">
@@ -104,102 +104,12 @@
</ul>
</div>
</van-tab>
- <van-tab :title="$t('最新交易')" name="2">
- <ul class="px-32 font-28 text-grey">
- <li class="flex justify-between mt-30">
- <span class="flex-1">{{ $t('时间') }}</span>
- <span class="flex-1">{{ $t('方向') }}</span>
- <span class="flex-1">{{ $t('价格') }}{{ queryType == 'cryptos' ? '(USDT)' : '(USD)' }}</span>
- <span class="flex-1 flex justify-center buy-title">{{ $t('数量') }}({{ symbolData.toUpperCase()
- }})</span>
- </li>
- <li v-for="(item, index) in deals" :key="item.ts + item.price + item.amount || index"
- class="flex justify-between mt-30">
- <span class="flex-1">{{ item.current_time ? item.current_time : '--' }}</span>
- <span :class="item.direction === 'buy' ? 'text-green' : 'text-red'" class="flex-1">{{
- item.direction === 'buy' ? $t('买入') : $t('卖出') }}</span>
- <span :class="item.direction === 'buy' ? 'text-green' : 'text-red'"
- class="flex-1 flex-justify-center">{{ item.price || '--' }}</span>
- <span class="flex-1 flex justify-center">{{ item.amount || '--' }}</span>
- </li>
- </ul>
- </van-tab>
- <van-tab :title="$t('深度图')" name="3">
- <div class="buy-sell-box">
- <div class="buy-item font-28">
- <div class="bg-line"></div>
- {{ $t('买盘') }}
- </div>
- <div class="sell-item font-28">
- <div class="bg-line"></div>
- {{ $t('卖盘') }}
- </div>
- </div>
- <div class="deep-chart-box">
- <deep-chart :deepBuy="deepBuy" :deepSell="deepSell"></deep-chart>
- </div>
- </van-tab>
- <!-- <van-tab :title="$t('数据分析')" name="4">
- <div class="capital-box">
- <div class="capital-flows">
- <span class="title">资金流向分析</span><van-icon name="warning-o" />
- </div>
- <div class="tab-box">
- <div class="tab-item" v-for="(item, index) in 10">
- 15M
- </div>
- </div>
- <div class="pie-box">
- <pie-chart></pie-chart>
- </div>
- <div class="order-box">
- <div class="order-header">
- <div class="flex-item">订单类型</div>
- <div class="flex-item">买入</div>
- <div class="flex-item">卖出</div>
- <div class="flex-item">净流入</div>
- </div>
- <div class="order-main flex" v-for="(item, index) in 4" :key="index">
- <div class="flex-item">大单</div>
- <div class="flex-item text-red">9.3720</div>
- <div class="flex-item text-red">3.0200</div>
- <div class="flex-item text-green">6.3400</div>
- </div>
- </div>
-
- <div class="capital-title">
- <span class="title">5*24小时大单流入（{{ symbol.toUpperCase() }}）</span>
- <div class="text">5日主力净流入 -348.9411</div>
- </div>
- <div class="cylinder-kline">
- <cylinder-chart></cylinder-chart>
- </div>
- <div class="capital-title">
- <span class="title">24小时资金流入（{{ symbol.toUpperCase() }}）</span>
- </div>
- <div class="inflow-kline">
- <inflow-kline></inflow-kline>
- </div>
- </div>
- </van-tab> -->
- <!-- <van-tab :title="$t('币种简介')" name="3" class="border-t-color" v-if="this.$te(`${symbol}简介`)">-->
- <!-- <div class="px-20 py-20 font-40 text-grey">-->
- <!-- {{ $t('关于名称',{'symbol':symbol.toUpperCase() }) }}-->
- <!-- </div>-->
- <!-- <div class="px-20 py-20 font-32 text-grey">-->
- <!-- {{ $t(`${symbol}简介`,{'symbol':symbol.toUpperCase() }) }}-->
- <!-- </div>-->
- <!-- </van-tab>-->
</van-tabs>
</div>
<!-- 按钮区 -->
<div
class="flex pl-40 pt-20 pb-11 pr-32 text-white justify-between fixed w-full box-border h-90-px z-10 buttonSafe"
- v-if="!kineType" :class="isNight ? 'bg-night1' : 'bg-grey'">
- <!-- <div class="flex flex-col mx-30 items-center" @click="onRoute('/cryptos/exchangeRate')">
- <img src="@/assets/image/icon-rate.png" class="w-38 h-38" />
- <p class="font-25 text-grey mt-8 text-center">{{ $t('汇率') }}</p>
- </div> -->
+ v-if="!kineType" style="background-color: #fff !important;">
<div ref="toBuy" class="w-360 h-70 bg-green flex justify-center items-center rounded-ban font-28"
@click=" onSubmit('buy')">
{{ tab == 1 ? $t('开多') : $t('买多') }}
@@ -538,10 +448,23 @@
<style lang="scss" scoped>
@import "@/assets/init.scss";
+#cryptos.trend-detail-white {
+ background: #fff;
+ min-height: 100%;
+ :deep(.van-tabs__nav) {
+ background-color: #fff !important;
+ }
+ :deep(.van-tabs__content) {
+ background-color: #fff;
+ }
+}
#cryptos {
+ background-color: #fff !important;
:deep(.van-tabs__wrap) {
height: 60px !important;
+ background-color: #fff !important;
+
}
}
@@ -550,7 +473,7 @@
}
:deep(.van-tabs__nav) {
- background-color: $night !important;
+ // background-color: $night !important;
// background-color: $inp-b !important;
}
@@ -623,6 +546,7 @@
}
.pb-180 {
+ background-color: #fff !important;
:deep(.van-tab) {
flex: initial;
padding: 0 2rem !important;
--
Gitblit v1.9.3