From 35ba5f69dc6f207e73c99af9c46e0820a7388852 Mon Sep 17 00:00:00 2001
From: PC-20250623MANY\Administrator <344137771@qq.com>
Date: Sat, 26 Jul 2025 17:49:17 +0800
Subject: [PATCH] 1
---
src/page/kline/index.vue | 174 +++++++++++++++++++++++++++------------------------------
1 files changed, 82 insertions(+), 92 deletions(-)
diff --git a/src/page/kline/index.vue b/src/page/kline/index.vue
index 407ea4d..546c178 100644
--- a/src/page/kline/index.vue
+++ b/src/page/kline/index.vue
@@ -8,12 +8,15 @@
<img src="../../assets/img/zuojiantou.png" alt />
</div>
<div class="right_title">
- <div class="t_t" style="white-space: nowrap">
+ <div class="t_t line-one" style="white-space: nowrap">
+ <span>{{ singDetails.name }}</span>
+ </div>
+ <!-- <div class="t_t" style="white-space: nowrap">
<span>{{ singDetails.name }}({{ singDetails.gid }})</span>
</div>
<div class="b_t">
<span>{{ singDetails.spell }}</span>
- </div>
+ </div> -->
</div>
</div>
<!-- 隐藏右侧金额显示 -->
@@ -74,16 +77,18 @@
</div>
</div> -->
</div>
+ <div class="flex-start" style="font-size: .4rem;">
+ <span class="i_icon">{{ bayType }}</span>
+ <span class="i_hint" style="color:#777">{{ singDetails.spell }}</span>
+ </div>
+ <div class="detail_title_a">{{ singDetails.name }}({{ singDetails.gid }})</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
- :class="singDetails.hcrate > 0 ? 'price green' : 'price red'"
- >{{ singDetails.nowPrice }}</span
- >
+ <span :class="singDetails.hcrate > 0 ? 'price green' : 'price red'">{{ singDetails.nowPrice }}</span>
</div>
<div class="bottom_now">
<div>
@@ -94,19 +99,14 @@
<span v-else>
{{
(singDetails.nowPrice - singDetails.preclose_px).toFixed(2)
- }}</span
- >
+ }}</span>
</div>
- <div
- class="tew"
- :class="singDetails.hcrate > 0 ? 'number green' : 'number red'"
- >
+ <div class="tew" :class="singDetails.hcrate > 0 ? 'number green' : 'number red'">
<span v-if="singDetails.nowPrice === 0">-</span>
<!-- <span v-else>({{ singDetails.nowPrice - singDetails.preclose_px > 0 ? '+' : '' }}
{{ singDetails.hcrate ? singDetails.hcrate : '0' }}%)</span> -->
<span v-else>
- ({{ singDetails.hcrate ? singDetails.hcrate : "0" }}%)</span
- >
+ ({{ singDetails.hcrate ? singDetails.hcrate : "0" }}%)</span>
</div>
</div>
</div>
@@ -117,24 +117,16 @@
<!-- <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 :class="singDetails.hcrate > 0 ? 'number green' : 'number red'
+ ">{{ singDetails.open_px }}</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.hcrate > 0 ? 'number green' : 'number red'
- "
- >{{ singDetails.today_max }}</span
- >
+ <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'
+ ">{{ singDetails.today_max }}</span>
</div>
</div>
<div class="bottoms">
@@ -143,24 +135,16 @@
<!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
singDetails.preclose_px
}}</span> -->
- <span
- :class="
- singDetails.hcrate > 0 ? 'number green' : 'number red'
- "
- >{{ singDetails.preclose_px }}</span
- >
+ <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'
+ ">{{ 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.hcrate > 0 ? 'number green' : 'number red'
- "
- >{{ singDetails.today_min }}</span
- >
+ <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'
+ ">{{ singDetails.today_min }}</span>
</div>
</div>
</div>
@@ -169,16 +153,12 @@
<div class="k_line_detail">
<Kline :key="key" :type="singDetails.type" />
</div>
- <div
- class="priect_top_bottom"
- style="display: none"
- v-if="
- kLineDetails.if_us != 1 &&
- kLineDetails.type != 'hk' &&
- kLineDetails.type != 'hk' &&
- kLineDetails.if_zhishu == 0
- "
- >
+ <div class="priect_top_bottom" style="display: none" v-if="
+ kLineDetails.if_us != 1 &&
+ kLineDetails.type != 'hk' &&
+ kLineDetails.type != 'hk' &&
+ kLineDetails.if_zhishu == 0
+ ">
<div class="t_title">
<span>{{ $t("hj76") }}</span>
</div>
@@ -284,11 +264,7 @@
<div class="t_ma">
<span>{{ $t("hj80") }}</span>
</div>
- <div
- class="ets"
- v-for="(item, i) in timedata.data.details"
- :key="i"
- >
+ <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
<div class="left_sell1">
<span>{{ item.split(",")[0] }}</span>
</div>
@@ -301,11 +277,7 @@
<div class="t_ma">
<span>{{ $t("hj81") }}</span>
</div>
- <div
- class="ets"
- v-for="(item, i) in timedata.data.details"
- :key="i"
- >
+ <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
<div class="left_sell1">
<span>{{ item.split(",")[1] }}</span>
</div>
@@ -318,11 +290,7 @@
<div class="t_ma">
<span>{{ $t("hj82") }}</span>
</div>
- <div
- class="ets"
- v-for="(item, i) in timedata.data.details"
- :key="i"
- >
+ <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
<div class="left_sell1">
<span>{{ item.split(",")[2] }}</span>
</div>
@@ -416,16 +384,12 @@
<div class="btns">
<div class="lefts">
<div class="left_ca" @click="option()">
- <img
- src="../../assets/img/meishoucang.png"
- alt
- v-if="isOptionOpt === false"
- />
+ <img src="../../assets/img/meishoucang.png" alt v-if="isOptionOpt === false" />
<img src="../../assets/img/shoucangle.png" alt v-else />
</div>
- <div class="right_xx" @click="handleJj()">
+ <!-- <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">
@@ -840,7 +804,7 @@
height: calc(100% - 1.7rem);
overflow: auto;
- > .content {
+ >.content {
width: 100%;
height: 100%;
position: relative;
@@ -861,8 +825,24 @@
padding: 0 0.3rem;
background: #fff;
+ .detail_title_a {
+ font-size: .45rem;
+ font-weight: 500;
+ margin-top: .2rem;
+ line-height: .45rem;
+ }
+
+ .i_icon {
+ border-radius: 0 26em 26em 0;
+ background: #07c160;
+ color: #fff;
+ padding: 0.1em 0.5em 0.1em 0.4em;
+ margin-right: 0.3em;
+ font-size: 0.8em;
+ }
+
.top_back {
- width: 50%;
+ width: 90%;
height: 1.2rem;
display: flex;
align-items: center;
@@ -872,22 +852,26 @@
height: 80%;
display: flex;
align-items: center;
+ margin-right: 10vw;
- > img {
- margin-top: 0.2rem;
+ >img {
+ // margin-top: 0.2rem;
width: 0.6rem;
height: 0.6rem;
}
}
.right_title {
- width: 3rem;
- height: 80%;
+ width: 70%;
+ // height: 80%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
.t_t {
width: 100%;
- height: 70%;
- display: flex;
+ height: 100%;
+ line-height: 1.2rem;
align-items: center;
font-size: 0.4615rem;
@@ -910,7 +894,7 @@
.k_line_detail {
width: 100%;
- height: calc(100vh - 300px);
+ height: 100vw;
background: #fff;
border-radius: 0 0 0.3rem 0.3rem;
}
@@ -935,6 +919,7 @@
display: flex;
align-items: center;
font-weight: bold;
+
span {
font-weight: 500;
}
@@ -957,19 +942,20 @@
max-width: 70%;
height: 100%;
- > div {
+ >div {
width: 100%;
padding: 0.15rem 0;
display: flex;
align-items: center;
- > div {
+ >div {
// width: 50%;
height: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 0.1rem;
+
.titles {
padding-right: 0.1rem;
}
@@ -1029,7 +1015,7 @@
justify-content: space-between;
margin-top: 0.6rem;
- > div {
+ >div {
width: 49%;
height: 100%;
}
@@ -1050,7 +1036,7 @@
display: flex;
margin-top: 0.08rem;
- > div {
+ >div {
width: 50%;
height: 100%;
display: flex;
@@ -1133,8 +1119,9 @@
height: 70%;
display: flex;
align-items: center;
+ padding-left: .3rem;
- > div {
+ >div {
width: 50%;
height: 100%;
display: flex;
@@ -1149,21 +1136,23 @@
}
.rights {
- width: 70%;
+ width: 80%;
height: 70%;
display: flex;
align-items: center;
- justify-content: space-around;
+ justify-content: center;
+ padding-right: .2rem;
- > div {
+ >div {
border-radius: 0.15rem;
}
.buy_btn {
- width: 45%;
- height: 100%;
+ width: 50%;
+ height: 80%;
background: rgb(225, 59, 69);
color: #fff;
+ border-radius: 3rem 0 0 3rem !important;
.top_buy {
width: 100%;
@@ -1186,10 +1175,11 @@
}
.sell_btn {
- width: 45%;
- height: 100%;
- background: rgb(68, 155, 84);
+ width: 50%;
+ height: 80%;
+ background: #c4d600;
color: #fff;
+ border-radius: 0 3rem 3rem 0 !important;
.top_sell {
width: 100%;
--
Gitblit v1.9.3