From 24d786b273537a2763b1fb4c727304a7af6b25f0 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Sun, 20 Jul 2025 19:37:36 +0800
Subject: [PATCH] 1
---
src/page/kline/index.vue | 153 +++++++++++++++++++++++++++++++++++++--------------
1 files changed, 111 insertions(+), 42 deletions(-)
diff --git a/src/page/kline/index.vue b/src/page/kline/index.vue
index 0d4597e..f8ed82c 100644
--- a/src/page/kline/index.vue
+++ b/src/page/kline/index.vue
@@ -74,25 +74,98 @@
</div>
</div> -->
</div>
+ <div class="real_time_detail" style="border-bottom: 1px solid #dadada;">
+ <div style="display: flex;justify-content: center;align-items: center;">
+ <img style="width: 40px;border-radius: 50px;" src="../../assets/img/nologo.svg"/>
+ <div class="left_now_price" style="margin-left: 10px;">
+ <div class="top_now">
+ <!-- <span :class="singDetails.nowPrice - singDetails.preclose_px > 0 ? 'price green' : 'price red'">{{
+ singDetails.nowPrice
+ }}</span> -->
+ <span style="color: #0FAD60;font-size: 12px;"
+ :class="singDetails.hcrate > 0 ? 'price green' : 'price red'"
+ >{{ singDetails.name }}</span
+ >
+ </div>
+ <div class="bottom_now" style="margin-top: 5px;font-weight: bold;">
+ <div>
+ <span v-if="singDetails.nowPrice === 0">-</span>
+ <!-- <span v-else>{{ singDetails.nowPrice - singDetails.preclose_px > 0
+ ? '+' : ''
+ }}{{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) }}</span> -->
+ <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'" v-else>
+ {{ singDetails.spell }}</span
+ >
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="right_ets">
+ <div class="tops">
+ <div class="lefts topes">
+ <span class="titles">{{ $t("hj40") }}</span>
+ <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ singDetails.open_px
+ }}</span> -->
+ <!-- <span style="font-weight: bold;"
+
+ >{{ singDetails.nowPrice }}</span
+ > -->
+ </div>
+ <div class="rights topes">
+ <!-- <span class="titles">{{ $t("hj73") }}</span> -->
+ <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ singDetails.today_max
+ }}</span> -->
+ <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'"
+ style="font-weight: bold;"
+ >还米有</span
+ >
+ </div>
+ </div>
+ <div class="bottoms">
+ <div class="lefts bots">
+ <!-- <span class="titles">{{ $t("hj74") }}</span> -->
+ <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ singDetails.preclose_px
+ }}</span> -->
+ <span
+ style="font-weight: bold;font-size: 18px;"
+ >{{ singDetails.preclose_px }}</span
+ >
+ </div>
+ <div class="rights bots">
+ <!-- <span class="titles">{{ $t("hj75") }}</span> -->
+ <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ singDetails.today_min
+ }}</span> -->
+ <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'"
+ style="font-weight: bold;"
+ >{{ singDetails.hcrate ? singDetails.hcrate : "0" }}%</span
+ >
+ </div>
+ </div>
+ </div>
+ </div>
<div class="real_time_detail">
<div class="left_now_price">
<div class="top_now">
<!-- <span :class="singDetails.nowPrice - singDetails.preclose_px > 0 ? 'price green' : 'price red'">{{
singDetails.nowPrice
}}</span> -->
- <span
+ <span style="color: #0FAD60;"
:class="singDetails.hcrate > 0 ? 'price green' : 'price red'"
- >¥{{ singDetails.nowPrice }}</span
+ >{{ singDetails.nowPrice }}</span
>
</div>
- <div class="bottom_now">
+ <div class="bottom_now" style="margin-top: 5px;font-weight: bold;">
<div>
<span v-if="singDetails.nowPrice === 0">-</span>
<!-- <span v-else>{{ singDetails.nowPrice - singDetails.preclose_px > 0
? '+' : ''
}}{{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) }}</span> -->
- <span v-else>
- ¥{{
+ <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'" v-else>
+ {{
(singDetails.nowPrice - singDetails.preclose_px).toFixed(2)
}}</span
>
@@ -117,11 +190,9 @@
<!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
singDetails.open_px
}}</span> -->
- <span
- :class="
- singDetails.hcrate > 0 ? 'number green' : 'number red'
- "
- >¥{{ singDetails.open_px }}</span
+ <span style="font-weight: bold;"
+
+ >{{ singDetails.open_px }}</span
>
</div>
<div class="rights topes">
@@ -130,10 +201,8 @@
singDetails.today_max
}}</span> -->
<span
- :class="
- singDetails.hcrate > 0 ? 'number green' : 'number red'
- "
- >¥{{ singDetails.today_max }}</span
+ style="font-weight: bold;"
+ >{{ singDetails.today_max }}</span
>
</div>
</div>
@@ -144,10 +213,8 @@
singDetails.preclose_px
}}</span> -->
<span
- :class="
- singDetails.hcrate > 0 ? 'number green' : 'number red'
- "
- >¥{{ singDetails.preclose_px }}</span
+ style="font-weight: bold;"
+ >{{ singDetails.preclose_px }}</span
>
</div>
<div class="rights bots">
@@ -156,10 +223,8 @@
singDetails.today_min
}}</span> -->
<span
- :class="
- singDetails.hcrate > 0 ? 'number green' : 'number red'
- "
- >¥{{ singDetails.today_min }}</span
+ style="font-weight: bold;"
+ >{{ singDetails.today_min }}</span
>
</div>
</div>
@@ -414,7 +479,7 @@
<!-- <div class="border_bottom"></div> -->
</div>
<div class="btns">
- <div class="lefts">
+ <!-- <div class="lefts">
<div class="left_ca" @click="option()">
<img
src="../../assets/img/meishoucang.png"
@@ -426,23 +491,23 @@
<div class="right_xx" @click="handleJj()">
<a href="#"><img src="../../assets/img/xiaoxi.png" alt /></a>
</div>
- </div>
+ </div> -->
<div class="rights">
<div class="buy_btn">
<div class="top_buy" @click="goBuy(0)">
<span>{{ $t("hj84") }}</span>
</div>
- <div class="bottom_buy">
+ <!-- <div class="bottom_buy">
<span>¥{{ singDetails.nowPrice }}</span>
- </div>
+ </div> -->
</div>
<div class="sell_btn" @click="goBuy(1)">
<div class="top_sell">
<span>{{ $t("hj85") }}</span>
</div>
- <div class="bottom_sell">
+ <!-- <div class="bottom_sell">
<span>¥{{ singDetails.nowPrice }}</span>
- </div>
+ </div> -->
</div>
</div>
</div>
@@ -931,7 +996,7 @@
.top_now {
width: 100%;
// height: 65%;
- font-size: 25px;
+ font-size: 40px;
display: flex;
align-items: center;
font-weight: bold;
@@ -1149,7 +1214,7 @@
}
.rights {
- width: 70%;
+ width: 100%;
height: 70%;
display: flex;
align-items: center;
@@ -1162,23 +1227,25 @@
.buy_btn {
width: 45%;
height: 100%;
- background: rgb(225, 59, 69);
+ background: #185546;
color: #fff;
-
+ display: flex;
+ justify-content: center;
+ align-items: center;
.top_buy {
width: 100%;
- height: 45%;
+ // height: 45%;
display: flex;
justify-content: center;
- align-items: flex-end;
+ align-items: center;
}
.bottom_buy {
width: 100%;
- height: 55%;
+ // height: 55%;
display: flex;
justify-content: center;
- align-items: flex-start;
+ align-items: center;
font-size: 0.4015rem;
padding: 0.1rem 0 0 0;
}
@@ -1187,23 +1254,25 @@
.sell_btn {
width: 45%;
height: 100%;
- background: rgb(68, 155, 84);
+ background: #185546;
color: #fff;
-
+ display: flex;
+ justify-content: center;
+ align-items: center;
.top_sell {
width: 100%;
- height: 45%;
+ // height: 45%;
display: flex;
justify-content: center;
- align-items: flex-end;
+ // align-items: flex-end;
}
.bottom_sell {
width: 100%;
- height: 55%;
+ // height: 55%;
display: flex;
justify-content: center;
- align-items: flex-start;
+ // align-items: flex-start;
padding: 0.1rem 0 0 0;
font-size: 0.4015rem;
}
--
Gitblit v1.9.3