From f341440c577806306332f1e55b3b4005b2a67e16 Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Sat, 14 Jun 2025 20:41:40 +0800
Subject: [PATCH] 修改交易页面样式
---
src/page/kline/index.vue | 91 ++++++++++++++++++++++++++-------------------
1 files changed, 53 insertions(+), 38 deletions(-)
diff --git a/src/page/kline/index.vue b/src/page/kline/index.vue
index 1d0ecc9..294b011 100644
--- a/src/page/kline/index.vue
+++ b/src/page/kline/index.vue
@@ -82,7 +82,7 @@
}}</span> -->
<span
:class="singDetails.hcrate > 0 ? 'price green' : 'price red'"
- >₹{{ singDetails.nowPrice }}</span
+ >₹{{ singDetails.nowPrice }}</span
>
</div>
<div class="bottom_now">
@@ -121,7 +121,7 @@
:class="
singDetails.hcrate > 0 ? 'number green' : 'number red'
"
- >₹{{ singDetails.open_px }}</span
+ >₹{{ singDetails.open_px }}</span
>
</div>
<div class="rights topes">
@@ -133,7 +133,7 @@
:class="
singDetails.hcrate > 0 ? 'number green' : 'number red'
"
- >₹{{ singDetails.today_max }}</span
+ >₹{{ singDetails.today_max }}</span
>
</div>
</div>
@@ -147,10 +147,10 @@
:class="
singDetails.hcrate > 0 ? 'number green' : 'number red'
"
- >₹{{ singDetails.preclose_px }}</span
+ >₹{{ singDetails.preclose_px }}</span
>
</div>
- <div class="rights bots">
+ <div class="rights bots">
<span class="titles">{{ $t("hj75") }}</span>
<!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
singDetails.today_min
@@ -159,7 +159,7 @@
:class="
singDetails.hcrate > 0 ? 'number green' : 'number red'
"
- >₹{{ singDetails.today_min }}</span
+ >₹{{ singDetails.today_min }}</span
>
</div>
</div>
@@ -174,9 +174,9 @@
style="display: none"
v-if="
kLineDetails.if_us != 1 &&
- kLineDetails.type != 'hk' &&
- kLineDetails.type != 'hk' &&
- kLineDetails.if_zhishu == 0
+ kLineDetails.type != 'hk' &&
+ kLineDetails.type != 'hk' &&
+ kLineDetails.if_zhishu == 0
"
>
<div class="t_title">
@@ -424,7 +424,7 @@
<img src="../../assets/img/shoucangle.png" alt v-else />
</div>
<div class="right_xx" @click="handleJj()">
- <a href="#"><img src="../../assets/img/xiaoxi.png" alt /></a>
+ <a href="#"><img src="../../assets/img/xiaoxi.png" alt/></a>
</div>
</div>
<div class="rights">
@@ -432,17 +432,17 @@
<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>
@@ -471,11 +471,11 @@
newsdetailList: [],
bayType: "",
timer: null,
- key:0,
+ key: 0
};
},
components: {
- Kline,
+ Kline
},
created() {
@@ -502,7 +502,7 @@
// },
methods: {
async getHknews() {
- await api.queryIndexNews().then((res) => {
+ await api.queryIndexNews().then(res => {
if (res.status === 0) {
this.newsdetailList = res.data.data;
}
@@ -524,13 +524,13 @@
this.optionBtn = false;
this.$message({
message: this.$t("hj97"),
- type: "success",
+ type: "success"
});
} else {
this.optionBtn = false;
this.$message({
message: data.msg,
- type: "warning",
+ type: "warning"
});
}
} else {
@@ -540,12 +540,12 @@
this.optionBtn = false;
this.$message({
message: this.$t("hj96"),
- type: "success",
+ type: "success"
});
} else {
this.$message({
message: data.msg,
- type: "warning",
+ type: "warning"
});
this.optionBtn = false;
}
@@ -569,7 +569,7 @@
},
async getOpation() {
let opts = {
- code: this.$route.query.code,
+ code: this.$route.query.code
};
let data = await api.isOption(opts);
if (data.status === 0) {
@@ -582,9 +582,9 @@
async getSingDetails() {
let opts = {
code: this.kLineDetails.code,
- stockType: this.kLineDetails.type,
+ stockType: this.kLineDetails.type
};
- await api.getSingleStock(opts).then((res) => {
+ await api.getSingleStock(opts).then(res => {
if (res.status === 0) {
this.singDetails = res.data.stock;
this.bayType = res.data.stock.type;
@@ -596,7 +596,7 @@
}
const obj = {
pid: res.data.stock.code,
- type: res.data.stock.type,
+ type: res.data.stock.type
};
window.localStorage.setItem("kLine", JSON.stringify(obj));
// console.log(this.singDetails)
@@ -614,9 +614,9 @@
async getSingDetailUs() {
let opts = {
code: this.kLineDetails.code,
- stockType: this.kLineDetails.type,
+ stockType: this.kLineDetails.type
};
- await api.getUsDetail(opts).then((res) => {
+ await api.getUsDetail(opts).then(res => {
// console.log(res,1111123);
// var that = this
// if(!res){
@@ -660,12 +660,17 @@
this.$router.push({
path: "/newPage",
query: {
- listid: item.id,
- },
+ listid: item.id
+ }
});
},
goBuy(index) {
clearInterval(this.timer);
+ // 最高价：singDetails.today_max
+ // 最低价：singDetails.today_min
+ // 名字：singDetails.name
+ // 当前涨幅：singDetails.nowPrice - singDetails.preclose_px
+ // 涨幅百分比：singDetails.hcrate
this.$router.push({
path: "/TradingBuy",
query: {
@@ -679,13 +684,21 @@
if_us: this.kLineDetails.if_us,
bayType: this.bayType,
gid: this.singDetails.gid,
- },
+
+ max: this.singDetails.today_max,
+ min: this.singDetails.today_min,
+ cname: this.singDetails.name,
+ up: (
+ this.singDetails.nowPrice - this.singDetails.preclose_px
+ ).toFixed(2),
+ upPercent: this.singDetails.hcrate
+ }
});
if (navigator.vibrate) {
// 支持
navigator.vibrate([55]);
}
- },
+ }
},
filters: {
getName(spell) {
@@ -747,8 +760,8 @@
.replace(/年|月/g, "-")
.replace(/日/g, " ");
return beijingDatetime; // 2017-03-31 16:02:06
- },
- },
+ }
+ }
};
</script>
@@ -934,7 +947,7 @@
font-size: 25px;
display: flex;
align-items: center;
- font-weight: bold;
+ font-weight: bold;
span {
font-weight: 500;
}
@@ -1162,12 +1175,13 @@
.buy_btn {
width: 45%;
height: 100%;
- background: rgb(225, 59, 69);
+ background: #0062ac;
color: #fff;
.top_buy {
width: 100%;
- height: 45%;
+ // height: 45%;
+ height: 64%;
display: flex;
justify-content: center;
align-items: flex-end;
@@ -1187,12 +1201,13 @@
.sell_btn {
width: 45%;
height: 100%;
- background: rgb(68, 155, 84);
+ background: #fc4f30;
color: #fff;
.top_sell {
width: 100%;
- height: 45%;
+ // height: 45%;
+ height: 64%;
display: flex;
justify-content: center;
align-items: flex-end;
--
Gitblit v1.9.3