From 0d29d9a2bf0d893a67f1263bb9525131a50a2128 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Sat, 23 Mar 2024 11:12:55 +0800
Subject: [PATCH] 首次提交大宝wap
---
src/page/kline/index.vue | 374 ++++++++++++++++++++++++++++++----------------------
1 files changed, 214 insertions(+), 160 deletions(-)
diff --git a/src/page/kline/index.vue b/src/page/kline/index.vue
index 411f1bd..350ad70 100644
--- a/src/page/kline/index.vue
+++ b/src/page/kline/index.vue
@@ -4,12 +4,12 @@
<div class="detail_title">
<div class="ti_cont">
<div class="top_back">
- <div class="left_back" @click="handleBack()">
+ <div class="left_back" @click="handleBackaa()">
<img src="../../assets/img/zuojiantou.png" alt />
</div>
<div class="right_title">
<div class="t_t" style="white-space: nowrap;">
- <span>{{ kLineDetails.name | getName }}</span>
+ <span>{{ singDetails.spell }}</span>
</div>
<div class="b_t">
<span>{{ singDetails.code }}</span>
@@ -23,21 +23,23 @@
<span>{{ $t('hj47') }}</span>
</div>
<div class="right">
- <span v-if="$store.state.userInfo.userAmt == undefined">¥0.00</span>
+ <span v-if="$store.state.userInfo.userAmt == undefined">₹0.00</span>
<span v-if="$store.state.userInfo && kLineDetails.if_zhishu != '0'" style="white-space: nowarp;">
{{ kLineDetails.if_us == 1 ? '$' + Number(Number($store.state.userInfo.userIndexAmt) /
7.1).toFixed(2) :
kLineDetails.if_us == 2 ? 'HK$' + (Number($store.state.userInfo.userIndexAmt) / 0.9).toFixed(2) :
- '¥' +
+ '₹' +
$store.state.userInfo.userIndexAmt
}}
</span>
<span v-if="$store.state.userInfo.userAmt != undefined && kLineDetails.if_zhishu == '0'"
style="white-space: nowarp;">
- {{ kLineDetails.if_us == 1 ? '$' + Number(Number($store.state.userInfo.userAmt) / 7.1).toFixed(2) :
- kLineDetails.if_us == 2 ? 'HK$' + (Number($store.state.userInfo.userAmt) / 0.9).toFixed(2) : '¥ ' +
+ <!-- {{ kLineDetails.if_us == 1 ? '$' + Number(Number($store.state.userInfo.userAmt) / 7.1).toFixed(2) :
+ kLineDetails.if_us == 2 ? 'HK$' + (Number($store.state.userInfo.userAmt) / 0.9).toFixed(2) : '₹ ' +
$store.state.userInfo.userAmt
- }}
+ }} -->
+ {{ '₹ ' + parseFloat($store.state.userInfo.enableAmt.toFixed(2)).toLocaleString()
+ }}
</span>
</div>
<div class="sanjiao">
@@ -60,21 +62,28 @@
<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'">{{
+ <!-- <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>
</div>
<div class="bottom_now">
<div>
- <span v-if="singDetails.nowPrice == 0">-</span>
- <span v-else>{{ singDetails.nowPrice - singDetails.preclose_px > 0
+ <span v-if="singDetails.nowPrice === 0">-</span>
+ <!-- <span v-else>{{ singDetails.nowPrice - singDetails.preclose_px > 0
? '+' : ''
- }}{{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) }}</span>
+ }}{{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) }}</span> -->
+ <span v-else>
+ {{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) || 0 }}</span>
</div>
<div class="tew"
- :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">
- <span v-if="singDetails.nowPrice == 0">-</span>
- <span v-else>({{ singDetails.nowPrice - singDetails.preclose_px > 0 ? '+' : '' }}
+ :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 > 0 ? '+' : '' }}
{{ singDetails.hcrate ? singDetails.hcrate : '0' }}%)</span>
</div>
</div>
@@ -83,13 +92,19 @@
<div class="tops">
<div class="lefts topes">
<span class="titles">{{ $t('hj72') }}</span>
- <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ <!-- <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>
</div>
<div class="rights topes">
<span class="titles">{{ $t('hj73') }}</span>
- <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ <!-- <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>
</div>
@@ -97,13 +112,19 @@
<div class="bottoms">
<div class="lefts bots">
<span class="titles">{{ $t('hj74') }}</span>
- <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ <!-- <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>
</div>
<div class="rights bots">
<span class="titles">{{ $t('hj75') }}</span>
- <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+ <!-- <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>
</div>
@@ -114,7 +135,7 @@
<div class="k_line_detail">
<Kline :type="singDetails.type" />
</div>
- <div class="priect_top_bottom"
+ <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>
@@ -200,7 +221,6 @@
<div class="right_sell1">
<span>{{ singDetails.buy4_num }}</span>
-
</div>
</div>
<div class="ets">
@@ -223,12 +243,12 @@
<div class="t_ma">
<span>{{ $t('hj80') }}</span>
</div>
- <div class="ets" v-for="item in timedata.data.details">
+ <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
<div class="left_sell1">
<span>{{ item.split(',')[0] }}</span>
</div>
<div class="right_sell1">
- <span>{{ }}</span>
+ <!-- <span>{{ }}</span> -->
</div>
</div>
@@ -237,12 +257,12 @@
<div class="t_ma">
<span>{{ $t('hj81') }}</span>
</div>
- <div class="ets" v-for="item in timedata.data.details">
+ <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
<div class="left_sell1">
<span>{{ item.split(',')[1] }}</span>
</div>
<div class="right_sell1">
- <span>{{ }}</span>
+ <!-- <span>{{ }}</span> -->
</div>
</div>
@@ -251,12 +271,12 @@
<div class="t_ma">
<span>{{ $t('hj82') }}</span>
</div>
- <div class="ets" v-for="item in timedata.data.details">
+ <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
<div class="left_sell1">
<span>{{ item.split(',')[2] }}</span>
</div>
<div class="right_sell1">
- <span>{{ }}</span>
+ <!-- <span>{{ }}</span> -->
</div>
</div>
@@ -281,7 +301,7 @@
<mt-tab-container v-model="news" :swipeable="false" style="padding-top: 0.5rem;">
<mt-tab-container-item id="tab_2">
<div class="news-content">
- <div class="item-out" v-for="(item, inde) in newsdetailList" :key="inde">
+ <div class="item-out" v-for="(item, inde) in newsdetailList" :key="inde" >
<div class="item-times">{{ item.Art_ShowTime | utc2beijing }}</div>
<div class="titContent" style="-webkit-box-orient: vertical;">{{ item.Art_Title }}</div>
</div>
@@ -298,7 +318,7 @@
<mt-tab-container v-model="news" :swipeable="false" style="padding-top: 0.5rem;">
<mt-tab-container-item id="tab_2">
<div class="news-content">
- <div class="item-out" v-for="(item, inde) in newsdetailList" :key="inde">
+ <div class="item-out" v-for="(item, inde) in newsdetailList" :key="inde" @click="godetail(item)">
<div class="item-times">{{ item.addTime | gettime }}</div>
<div class="titContent" style="-webkit-box-orient: vertical;">{{ item.title }}</div>
</div>
@@ -307,7 +327,7 @@
</mt-tab-container>
</div>
</div>
- <div class="border_bottom"></div>
+ <!-- <div class="border_bottom"></div> -->
</div>
<div class="btns">
<div class="lefts">
@@ -342,116 +362,123 @@
</template>
<script>
-import Kline from "./components/kLine.vue";
-import * as api from "@/axios/api";
+import Kline from './components/kLine.vue'
+import * as api from '@/axios/api'
+import { Toast } from 'vant'
export default {
- name: "kline",
- data() {
+ name: 'kline',
+ data () {
return {
news: 'tab_2',
kLineDetails: {}, // K线图详情数据
singDetails: {},
scFlag: false,
acseFlag: false,
- jianjie: "",
+ jianjie: '',
optionBtn: false,
isOptionOpt: false,
dialogFlag: false,
timedata: [],
- newsdetailList: []
- };
+ newsdetailList: [],
+ bayType: '',
+ timer:null,
+ }
},
components: {
Kline
},
- created() {
- const { query } = this.$route;
- this.kLineDetails = query;
- if (query.if_us == '1') {
-
- this.getSingDetailUs();
+ created () {
+ const { query } = this.$route
+ this.kLineDetails = query
+ if (query.if_us === '1') {
+ this.getSingDetailUs()
} else {
- this.getSingDetails();
+ this.timer = setInterval(()=>{
+ this.getSingDetails()
+ },500)
}
- this.getOpation();
+ this.getOpation()
// this.$Lazyload();
- this.getUserInfo();
+ this.getUserInfo()
+ this.getNohknews()
},
-
+ beforeDestroy() {
+ this.clearInterval(this.timer); // 在组件销毁前清除定时器
+ },
// beforeDestroy() {
// this.Klinetype = false;
// window.clearInterval()
// },
methods: {
- async getHknews() {
+ async getHknews () {
await api.queryIndexNews().then(res => {
- if (res.status == 0) {
- this.newsdetailList = res.data.data;
+ if (res.status === 0) {
+ this.newsdetailList = res.data.data
}
- });
+ })
},
- async getNohknews() {
- let data = await api.queryNewsList(4);
+ async getNohknews () {
+ let data = await api.queryNewsList(4)
this.newsdetailList = data.data.list
},
- async option() {
+ async option () {
if (this.optionBtn) {
return
};
- this.optionBtn = true;
+ this.optionBtn = true
if (this.isOptionOpt) {
- let data = await api.delOption({ code: this.kLineDetails.code });
+ let data = await api.delOption({ code: this.kLineDetails.code })
if (data.status === 0) {
- this.getOpation();
- this.optionBtn = false;
+ this.getOpation()
+ this.optionBtn = false
this.$message({
message: this.$t('hj97'),
type: 'success'
- });
+ })
} else {
- this.optionBtn = false;
+ this.optionBtn = false
this.$message({
message: data.msg,
type: 'warning'
- });
+ })
}
} else {
- let data = await api.addOption({ code: this.kLineDetails.code });
+ let data = await api.addOption({ code: this.kLineDetails.code })
if (data.status === 0) {
- this.getOpation();
- this.optionBtn = false;
+ this.getOpation()
+ this.optionBtn = false
this.$message({
message: this.$t('hj96'),
type: 'success'
- });
+ })
} else {
this.$message({
message: data.msg,
type: 'warning'
- });
- this.optionBtn = false;
+ })
+ this.optionBtn = false
}
}
if (navigator.vibrate) {
// 支持
- navigator.vibrate([55]);
+ navigator.vibrate([55])
}
},
- async getUserInfo() {
+ async getUserInfo () {
// 获取用户信息
// let showcookie = this.getCookie('USER_TOKEN');
- let data = await api.getUserInfo();
+ let data = await api.getUserInfo()
if (data.status === 0) {
// this.getProductSetting()
- this.$store.state.userInfo = data.data;
+ this.$store.state.userInfo = data.data
} else {
- Toast(data.msg);
+ Toast(data.msg)
}
- this.$store.state.user = this.user;
+ this.$store.state.user = this.user
},
- async getOpation() {
+ async getOpation () {
let opts = {
code: this.$route.query.code
}
@@ -463,34 +490,43 @@
this.isOptionOpt = true
}
},
- async getSingDetails() {
+ async getSingDetails () {
let opts = {
code: this.kLineDetails.code,
stockType: this.kLineDetails.type
- };
+ }
await api.getSingleStock(opts).then(res => {
if (res.status === 0) {
- this.singDetails = res.data.stock;
+ this.singDetails = res.data.stock
+ this.bayType = res.data.stock.type
if (res.data.introduction) {
- this.jianjie = res.data.introduction;
+ this.jianjie = res.data.introduction
} else {
- this.jianjie = res.data.indexintroduction;
+ this.jianjie = res.data.indexintroduction
}
- console.log(this.singDetails);
- if (this.kLineDetails.if_zhishu != '0' && this.singDetails.gid.indexOf('hk') > -1) {
- this.getHknews();
- } else {
- this.getNohknews();
+ const obj = {
+ pid: res.data.stock.code,
+ type: res.data.stock.type
}
+ window.localStorage.setItem('kLine', JSON.stringify(obj))
+ // console.log(this.singDetails)
+ // if (this.kLineDetails.if_zhishu !== '0' && this.singDetails.gid.indexOf('hk') > -1) {
+ // this.getHknews()
+ // } else {
+ // this.getNohknews()
+ // }
+ // this.timer = setTimeout(() => {
+ // this.getSingDetails(); // 再次调用自身，形成递归效果
+ // }, 500);
}
- });
+ })
},
- async getSingDetailUs() {
+ async getSingDetailUs () {
let opts = {
code: this.kLineDetails.code,
stockType: this.kLineDetails.type
- };
+ }
await api.getUsDetail(opts).then(res => {
// console.log(res,1111123);
// var that = this
@@ -501,111 +537,126 @@
// }
if (res.status === 0) {
- this.singDetails = res.data.stock;
- this.timedata = res.data.timedata;
+ this.singDetails = res.data.stock
+ this.timedata = res.data.timedata
if (res.data.introduction) {
- this.jianjie = res.data.introduction;
+ this.jianjie = res.data.introduction
} else {
- this.jianjie = res.data.indexintroduction;
+ this.jianjie = res.data.indexintroduction
}
- this.getNohknews();
- console.log(this.singDetails);
+ this.getNohknews()
+ console.log(this.singDetails)
}
- });
+ })
},
- handleJj() {
- this.acseFlag = true;
+ handleJj () {
+ this.acseFlag = true
setTimeout(() => {
- this.acseFlag = false;
- }, 1000);
+ this.acseFlag = false
+ }, 1000)
if (navigator.vibrate) {
// 支持
- navigator.vibrate([55]);
+ navigator.vibrate([55])
}
},
- handleBack() {
- this.$router.go(-1);
+ handleBackaa () {
+
+ clearInterval(this.timer);
+ window.localStorage.removeItem('kLine')
+ this.$router.go(-1)
},
- handleSc() {
- this.scFlag = !this.scFlag;
+ handleSc () {
+ this.scFlag = !this.scFlag
},
- goBuy(index) {
+ godetail(item){
this.$router.push({
- path: "/TradingBuy",
+ path: '/newPage',
+ query: {
+ listid: item.id
+ }
+ })
+ },
+ goBuy (index) {
+ clearInterval(this.timer);
+ this.$router.push({
+ path: '/TradingBuy',
query: {
t: index,
code: this.kLineDetails.code,
m: this.singDetails.nowPrice,
type: this.kLineDetails.if_zhishu,
+ id: this.singDetails.id,
name: this.kLineDetails.name,
if_us: this.kLineDetails.if_us,
+ bayType: this.bayType
}
- });
+ })
if (navigator.vibrate) {
// 支持
- navigator.vibrate([55]);
+ navigator.vibrate([55])
}
}
},
filters: {
- getName(name) {
- if (name.length > 15) {
- return name.substring(0, 14);
- } else {
- return name;
- }
+ getName (spell) {
+ // if (name.length > 15) {
+ // return name.substring(0, 14)
+ // } else {
+ return spell
+ // }
},
- gettime(time) {
+ gettime (time) {
if (!time) {
- return "";
+ return ''
}
- var nd = new Date(time);
- var y = nd.getFullYear();
- var mm = nd.getMonth() + 1;
- var d = nd.getDate();
- var h = nd.getHours();
- var m = nd.getMinutes();
- var c = nd.getSeconds();
+ var nd = new Date(time)
+ var y = nd.getFullYear()
+ var mm = nd.getMonth() + 1
+ var d = nd.getDate()
+ var h = nd.getHours()
+ var m = nd.getMinutes()
+ var c = nd.getSeconds()
if (mm < 10) {
- mm = "0" + mm;
+ mm = '0' + mm
}
if (d < 10) {
- d = "0" + d;
+ d = '0' + d
}
if (h < 10) {
- h = "0" + h;
+ h = '0' + h
}
if (m < 10) {
- m = "0" + m;
+ m = '0' + m
}
if (c < 10) {
- c = "0" + c;
+ c = '0' + c
}
- //17:35:2922-06-2022
- return y + "-" + mm + "-" + d + " " + h + ":" + m + ":" + c;
+ // 17:35:2922-06-2022
+ return d + '/' + mm + '/' + y + ' ' + h + ':' + m + ':' + c //日月年时分秒
+ // return y + '-' + mm + '-' + d + ' ' + h + ':' + m + ':' + c
},
- utc2beijing(utc_datetime) {
+ utc2beijing (utcDatetime) {
// 转为正常的时间格式 年-月-日 时:分:秒
- var T_pos = utc_datetime.indexOf('T');
- var Z_pos = utc_datetime.indexOf('Z');
- var year_month_day = utc_datetime.substr(0, T_pos);
- var hour_minute_second = utc_datetime.substr(T_pos + 1, Z_pos - T_pos - 1);
- var new_datetime = year_month_day + " " + hour_minute_second; // 2017-03-31 08:02:06
+ var tPos = utcDatetime.indexOf('T')
+ // var Z_pos = utcDatetime.indexOf('Z')
+ var yearMonthDay = utcDatetime.substr(0, tPos)
+ var hourMinuteSecond = utcDatetime.substr(tPos + 1, tPos - tPos - 1)
+ var newDatetime = yearMonthDay + ' ' + hourMinuteSecond // 2017-03-31 08:02:06
// 处理成为时间戳
- timestamp = new Date(Date.parse(new_datetime));
- timestamp = timestamp.getTime();
- timestamp = timestamp / 1000;
+ var timestamp = new Date(Date.parse(newDatetime))
+ timestamp = timestamp.getTime()
+ timestamp = timestamp / 1000
// 增加8个小时，北京时间比utc时间多八个时区
- var timestamp = timestamp + 8 * 60 * 60;
+ var timestamp2 = timestamp + 8 * 60 * 60
// 时间戳转为时间
- var beijing_datetime = new Date(parseInt(timestamp) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
- return beijing_datetime; // 2017-03-31 16:02:06
+ var beijingDatetime = new Date(parseInt(timestamp2) * 1000).toLocaleString().replace(/年|月/g, '-').replace(/日/g, ' ')
+ return beijingDatetime // 2017-03-31 16:02:06
}
}
-};
+}
</script>
<style scoped lang="less">
@@ -686,11 +737,6 @@
display: -webkit-box;
}
-
-
-
-
-
.ti_cont {
width: 100%;
display: flex;
@@ -718,7 +764,7 @@
.detail_title {
width: 100%;
- height: 3.2rem;
+ // height: 3.2rem;
padding: 0 0.3rem;
background: #fff;
@@ -778,22 +824,23 @@
.real_time_detail {
width: 100%;
- height: 2rem;
+ // height: 2rem;
display: flex;
justify-content: space-between;
+ flex-wrap: wrap;
+ align-items: center;
+ padding: 0.3rem 0;
.left_now_price {
- width: 35%;
+ // width: 35%;
height: 100%;
.top_now {
width: 100%;
- height: 65%;
+ // height: 65%;
font-size: 0.741rem;
display: flex;
align-items: center;
- padding-left: 0.1rem;
- padding-top: 0.3rem;
span {
font-weight: 500;
@@ -802,9 +849,10 @@
.bottom_now {
width: 100%;
- height: 35%;
+ // height: 35%;
display: flex;
padding-left: 0.1rem;
+ padding-top: 0.1rem;
}
.tew {
@@ -813,20 +861,25 @@
}
.right_ets {
- width: 65%;
+ max-width: 60%;
height: 100%;
>div {
width: 100%;
- height: 50%;
+ padding: 0.15rem 0;
display: flex;
+ align-items: center;
>div {
- width: 50%;
+ // width: 50%;
height: 100%;
display: flex;
justify-content: space-between;
+ align-items: center;
padding: 0 0.1rem;
+ .titles{
+ padding-right: 0.1rem;
+ }
}
}
}
@@ -835,14 +888,14 @@
.topes {
span {
display: inline-block;
- padding-top: 0.6rem;
+ // padding-top: 0.6rem;
}
}
.bots {
span {
display: inline-block;
- padding-top: 0.2rem;
+ // padding-top: 0.2rem;
}
}
@@ -1155,7 +1208,7 @@
justify-content: flex-end;
.left {
- width: 0.8rem;
+ // width: 0.8rem;
height: 0.4103rem;
border-radius: 0.1rem;
background: #4d73b1;
@@ -1201,4 +1254,5 @@
margin-left: 0.2rem;
padding-right: 0.68rem;
}
-</style>
\ No newline at end of file
+
+</style>
--
Gitblit v1.9.3