398 lines
12 KiB
JavaScript
398 lines
12 KiB
JavaScript
"use strict";
|
||
const common_vendor = require("../../../common/vendor.js");
|
||
const request_api = require("../../../request/api.js");
|
||
const utils_util = require("../../../utils/util.js");
|
||
const common_assets = require("../../../common/assets.js");
|
||
const echarts = require("../../../uni_modules/lime-echart/static/echarts.min.js");
|
||
const _sfc_main = {
|
||
data() {
|
||
return {
|
||
navH: common_vendor.inject("navHeight"),
|
||
contentTop: "",
|
||
navTitle: "",
|
||
type: "",
|
||
//1事件详情2投资详情
|
||
eventId: "",
|
||
//事件id
|
||
stockCode: "",
|
||
//股票code
|
||
categoryList: ["分时图", "日K线"],
|
||
selectCategory: 0,
|
||
tradeData: null,
|
||
//成交数据
|
||
option: {
|
||
title: {
|
||
show: false
|
||
},
|
||
tooltip: {
|
||
position: function(pos, params, dom, rect, size) {
|
||
var obj = { top: "10%" };
|
||
obj[["left", "right"][+(pos[0] < size.viewSize[0] / 2)]] = 5;
|
||
return obj;
|
||
},
|
||
trigger: "axis",
|
||
axisPointer: {
|
||
type: "cross"
|
||
},
|
||
formatter: function(params) {
|
||
common_vendor.index.__f__("log", "at pages/index/stockDetails/stockDetails.vue:89", params);
|
||
let res = "日期：" + params[0].name + "\n开盘价：" + params[0].data[1] + "\n收盘价：" + params[0].data[2] + "\n最低价：" + params[0].data[3] + "\n最高价：" + params[0].data[4];
|
||
return res;
|
||
}
|
||
},
|
||
legend: {
|
||
show: false
|
||
},
|
||
grid: {
|
||
top: "10%",
|
||
left: "10%",
|
||
right: "10%",
|
||
bottom: "15%"
|
||
},
|
||
xAxis: {
|
||
type: "category",
|
||
data: [],
|
||
boundaryGap: false,
|
||
axisLine: { onZero: false },
|
||
splitLine: { show: false }
|
||
},
|
||
yAxis: {
|
||
scale: true,
|
||
splitArea: {
|
||
show: true
|
||
}
|
||
},
|
||
series: [
|
||
{
|
||
name: "日K",
|
||
type: "candlestick",
|
||
data: [],
|
||
itemStyle: {
|
||
color: "#ffffff",
|
||
color0: "#355422",
|
||
borderColor: "#c00000",
|
||
borderColor0: "#355422"
|
||
}
|
||
}
|
||
]
|
||
},
|
||
option1: {
|
||
title: {
|
||
show: false
|
||
},
|
||
tooltip: {
|
||
position: function(pos, params, dom, rect, size) {
|
||
var obj = { top: "3%" };
|
||
obj[["left", "right"][+(pos[0] < size.viewSize[0] / 2)]] = 5;
|
||
return obj;
|
||
},
|
||
trigger: "axis",
|
||
formatter: function(params) {
|
||
let res = "时间：" + params[0].name + "\n高：" + params[0].data[2] + "\n开：" + params[0].data[3] + "\n低：" + params[0].data[4] + "\n收：" + params[0].data[1] + "\n涨幅：" + params[0].data[5] + "%";
|
||
return res;
|
||
}
|
||
},
|
||
grid: {
|
||
top: "10%",
|
||
left: "12%",
|
||
right: "14%",
|
||
bottom: "10%"
|
||
},
|
||
xAxis: {
|
||
type: "category",
|
||
scale: true,
|
||
axisLabel: {
|
||
customValues: ["09:30", "10:00", "10:30", "11:00", "11:30", "13:00", "13:30", "14:00", "14:30", "15:00"],
|
||
fontSize: 9
|
||
}
|
||
},
|
||
yAxis: {
|
||
show: false,
|
||
scale: true
|
||
},
|
||
dataZoom: [
|
||
{
|
||
type: "inside"
|
||
}
|
||
],
|
||
series: {
|
||
name: "分时图",
|
||
type: "line",
|
||
symbol: "none",
|
||
markLine: {
|
||
silent: true,
|
||
symbol: ["none", "none"],
|
||
lineStyle: {
|
||
type: "solid",
|
||
width: 1,
|
||
color: "#dedede"
|
||
},
|
||
z: 1
|
||
},
|
||
data: []
|
||
},
|
||
animation: false
|
||
},
|
||
relatedDesc: "",
|
||
//关联描述
|
||
sourceList: [],
|
||
//来源列表
|
||
getLocalDate: utils_util.getLocalDate
|
||
};
|
||
},
|
||
onLoad(e) {
|
||
if (e.code) {
|
||
this.type = e.type;
|
||
if (e.type == 1) {
|
||
this.contentTop = this.navH + 20 / 750 * common_vendor.inject("windowWidth");
|
||
this.eventId = e.id;
|
||
this.stockCode = e.code;
|
||
this.getStockDetailsData();
|
||
} else {
|
||
this.contentTop = this.navH;
|
||
this.navTitle = e.name + "(" + e.code + ")";
|
||
this.relatedDesc = e.des;
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
async init() {
|
||
const chart = await this.$refs.chartRef.init(echarts);
|
||
common_vendor.index.__f__("log", "at pages/index/stockDetails/stockDetails.vue:223", chart);
|
||
if (this.selectCategory == 0) {
|
||
chart.setOption(this.option1);
|
||
} else
|
||
chart.setOption(this.option);
|
||
},
|
||
/**
|
||
* 点击切换分类
|
||
* @param {Object} index
|
||
*/
|
||
clickCategoryItem(index) {
|
||
if (this.selectCategory != index) {
|
||
this.selectCategory = index;
|
||
if (index == 1) {
|
||
this.getStockCandlestickChartData();
|
||
} else
|
||
this.init();
|
||
}
|
||
},
|
||
/**
|
||
* 获取股票详情数据
|
||
*/
|
||
getStockDetailsData() {
|
||
let stockCode = this.stockCode;
|
||
let eventId = this.eventId;
|
||
request_api.stockDetails(eventId, stockCode).then((res) => {
|
||
if (res.code == 200) {
|
||
this.navTitle = res.data.basic_info.stock_name + "(" + res.data.basic_info.stock_code + ")";
|
||
let data = res.data.minute_chart_data;
|
||
this.tradeData = res.data.latest_trade;
|
||
let categoryData = [];
|
||
let valueData = [];
|
||
let open = data[0].open;
|
||
if (data.length > 0) {
|
||
if (data[0].time != "09:30") {
|
||
data.splice(0, 1);
|
||
}
|
||
}
|
||
for (let item of data) {
|
||
categoryData.push(item.time);
|
||
let rate = utils_util.accMul(utils_util.accDiv(utils_util.accSub(item.close, open), open).toFixed(4), 100);
|
||
let volume = item.volume;
|
||
if (volume > 1e4) {
|
||
volume = (volume / 1e4).toFixed(0) + "万";
|
||
}
|
||
let amount = item.amount;
|
||
if (amount > 1e4) {
|
||
amount = (amount / 1e4).toFixed(0) + "万";
|
||
}
|
||
valueData.push([item.time, item.close, item.high, item.open, item.low, rate, volume, amount]);
|
||
}
|
||
let min = open;
|
||
let max = 0;
|
||
for (let item of valueData) {
|
||
let value = item[1];
|
||
if (parseFloat(value) < min) {
|
||
min = parseFloat(value);
|
||
}
|
||
if (parseFloat(value) > max) {
|
||
max = parseFloat(value);
|
||
}
|
||
}
|
||
let minInterval = (open - min) / 3;
|
||
let maxInterval = (max - open) / 3;
|
||
let intervalList = [];
|
||
if (minInterval > maxInterval) {
|
||
for (var i = 3; i > 0; i--) {
|
||
intervalList.push(open - i * minInterval);
|
||
}
|
||
for (var i = 0; i < 4; i++) {
|
||
intervalList.push(open + i * minInterval);
|
||
}
|
||
} else {
|
||
for (var i = 3; i > 0; i--) {
|
||
intervalList.push(open - i * maxInterval);
|
||
}
|
||
for (var i = 0; i < 4; i++) {
|
||
intervalList.push(open + i * maxInterval);
|
||
}
|
||
}
|
||
this.option1.xAxis.data = categoryData;
|
||
this.option1.yAxis.min = intervalList[0].toFixed(2);
|
||
this.option1.yAxis.max = intervalList[intervalList.length - 1].toFixed(2);
|
||
this.option1.series.data = valueData;
|
||
let markData = [];
|
||
let time = res.data.event_info.event_start_time.split("T")[1];
|
||
time = time.substring(0, 5);
|
||
for (let item of intervalList) {
|
||
markData.push(
|
||
{
|
||
xAxis: time,
|
||
lineStyle: {
|
||
type: "solid",
|
||
width: 1,
|
||
color: "#ffd700"
|
||
},
|
||
label: {
|
||
position: "middle",
|
||
formatter: "事件发生",
|
||
color: "#ffd700"
|
||
}
|
||
},
|
||
{
|
||
yAxis: item,
|
||
label: {
|
||
show: true,
|
||
position: "start",
|
||
color: "#333"
|
||
}
|
||
},
|
||
{
|
||
yAxis: item,
|
||
label: {
|
||
show: true,
|
||
position: "end",
|
||
formatter: utils_util.accMul(utils_util.accDiv(utils_util.accSub(item, open), open).toFixed(4), 100) + "%",
|
||
color: "#333"
|
||
}
|
||
}
|
||
);
|
||
}
|
||
this.option1.series.markLine.data = markData;
|
||
let relatedDesc = res.data.related_desc;
|
||
if (relatedDesc) {
|
||
this.relatedDesc = relatedDesc.relation_desc;
|
||
if (relatedDesc.retrieved_sources) {
|
||
this.sourceList = relatedDesc.retrieved_sources;
|
||
}
|
||
}
|
||
this.init();
|
||
} else
|
||
common_vendor.index.showToast({
|
||
title: res.message,
|
||
icon: "none"
|
||
});
|
||
}).catch((error) => {
|
||
});
|
||
},
|
||
/**
|
||
* 获取股票K线数据
|
||
*/
|
||
getStockCandlestickChartData() {
|
||
let stockCode = this.stockCode;
|
||
let param = { chart_type: "minute" };
|
||
if (this.selectCategory == 1) {
|
||
param.chart_type = "daily";
|
||
}
|
||
request_api.stockCandlestickChartData(stockCode, param).then((res) => {
|
||
let data = res.data;
|
||
let categoryData = [];
|
||
let valueData = [];
|
||
for (let item of data) {
|
||
categoryData.push(item.time);
|
||
valueData.push([item.open, item.close, item.low, item.high]);
|
||
}
|
||
this.option.xAxis.data = categoryData;
|
||
this.option.series[0].data = valueData;
|
||
this.init();
|
||
}).catch((error) => {
|
||
});
|
||
}
|
||
}
|
||
};
|
||
if (!Array) {
|
||
const _easycom_navBar2 = common_vendor.resolveComponent("navBar");
|
||
const _easycom_l_echart2 = common_vendor.resolveComponent("l-echart");
|
||
(_easycom_navBar2 + _easycom_l_echart2)();
|
||
}
|
||
const _easycom_navBar = () => "../../../components/navBar/navBar.js";
|
||
const _easycom_l_echart = () => "../../../uni_modules/lime-echart/components/l-echart/l-echart.js";
|
||
if (!Math) {
|
||
(_easycom_navBar + _easycom_l_echart)();
|
||
}
|
||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||
return common_vendor.e({
|
||
a: common_vendor.p({
|
||
leftText: $data.navTitle,
|
||
hideNavBg: true
|
||
}),
|
||
b: common_assets._imports_0,
|
||
c: $data.type == 1
|
||
}, $data.type == 1 ? {
|
||
d: common_vendor.f($data.categoryList, (item, index, i0) => {
|
||
return common_vendor.e({
|
||
a: common_vendor.t(item),
|
||
b: $data.selectCategory == index
|
||
}, $data.selectCategory == index ? {} : {}, {
|
||
c: common_vendor.n("item relative " + ($data.selectCategory == index ? "select" : "")),
|
||
d: index,
|
||
e: common_vendor.o(($event) => $options.clickCategoryItem(index), index)
|
||
});
|
||
})
|
||
} : {}, {
|
||
e: $data.type == 1 && $data.tradeData
|
||
}, $data.type == 1 && $data.tradeData ? common_vendor.e({
|
||
f: $data.tradeData.volume > 1e8
|
||
}, $data.tradeData.volume > 1e8 ? {
|
||
g: common_vendor.t(($data.tradeData.volume / 1e8).toFixed(2))
|
||
} : common_vendor.e({
|
||
h: $data.tradeData.volume > 1e4
|
||
}, $data.tradeData.volume > 1e4 ? {
|
||
i: common_vendor.t(($data.tradeData.volume / 1e4).toFixed(2))
|
||
} : {
|
||
j: common_vendor.t($data.tradeData.volume)
|
||
}), {
|
||
k: $data.tradeData.amount > 1e8
|
||
}, $data.tradeData.amount > 1e8 ? {
|
||
l: common_vendor.t(($data.tradeData.amount / 1e8).toFixed(2))
|
||
} : common_vendor.e({
|
||
m: $data.tradeData.amount > 1e4
|
||
}, $data.tradeData.amount > 1e4 ? {
|
||
n: common_vendor.t(($data.tradeData.amount / 1e4).toFixed(2))
|
||
} : {
|
||
o: common_vendor.t($data.tradeData.amount)
|
||
})) : {}, {
|
||
p: $data.type == 1
|
||
}, $data.type == 1 ? {
|
||
q: common_vendor.sr("chartRef", "42054871-1")
|
||
} : {}, {
|
||
r: common_vendor.t($data.relatedDesc),
|
||
s: common_vendor.s("margin-top:" + $data.contentTop + "px;"),
|
||
t: $data.type == 1 && $data.sourceList.length > 0
|
||
}, $data.type == 1 && $data.sourceList.length > 0 ? {
|
||
v: common_vendor.f($data.sourceList, (item, index, i0) => {
|
||
return {
|
||
a: common_vendor.t(item.sentences),
|
||
b: common_vendor.t(item.report_title),
|
||
c: common_vendor.t(item.author),
|
||
d: common_vendor.t($data.getLocalDate(item.declare_date)),
|
||
e: index
|
||
};
|
||
})
|
||
} : {});
|
||
}
|
||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render]]);
|
||
wx.createPage(MiniProgramPage);
|
||
//# sourceMappingURL=../../../../.sourcemap/mp-weixin/pages/index/stockDetails/stockDetails.js.map
|