1.28 更换echarts文件
This commit is contained in:
407
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.js
vendored
Normal file
407
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.js
vendored
Normal file
@@ -0,0 +1,407 @@
|
||||
"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 },
|
||||
min: "dataMin",
|
||||
max: ""
|
||||
},
|
||||
yAxis: {
|
||||
scale: true,
|
||||
splitArea: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
dataZoom: [
|
||||
{
|
||||
type: "inside",
|
||||
start: 50,
|
||||
end: 100
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
type: "slider",
|
||||
top: "90%",
|
||||
start: 50,
|
||||
end: 100
|
||||
}
|
||||
],
|
||||
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"]
|
||||
}
|
||||
},
|
||||
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:238", 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;
|
||||
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
|
||||
7
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.json
vendored
Normal file
7
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.json
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"usingComponents": {
|
||||
"nav-bar": "../../../components/navBar/navBar",
|
||||
"l-echart": "../../../uni_modules/lime-echart/components/l-echart/l-echart"
|
||||
}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.wxml
vendored
Normal file
@@ -0,0 +1 @@
|
||||
<view><nav-bar wx:if="{{a}}" u-i="42054871-0" bind:__l="__l" u-p="{{a}}"></nav-bar><image class="topBg absolute" src="{{b}}" mode="widthFix"></image><view class="chartDesC relative" style="{{s}}"><view wx:if="{{c}}" class="tabC"><view wx:for="{{d}}" wx:for-item="item" wx:key="d" class="{{item.c}}" bindtap="{{item.e}}">{{item.a}} <view wx:if="{{item.b}}" class="line absolute"></view></view></view><view wx:if="{{e}}" class="volumeAmountC flex"><block wx:if="{{f}}"><text class="volume">成交量:{{g}}亿</text></block><block wx:else><text wx:if="{{h}}" class="volume">成交量:{{i}}万</text><text wx:else class="volume">成交量:{{j}}</text></block><block wx:if="{{k}}"><text class="amount">成交金额:{{l}}亿元</text></block><block wx:else><text wx:if="{{m}}" class="amount">成交金额:{{n}}万元</text><text wx:else class="amount">成交金额:{{o}}元</text></block></view><view wx:if="{{p}}" style="width:700rpx;height:400rpx"><l-echart class="r" u-r="chartRef" u-i="42054871-1" bind:__l="__l"></l-echart></view><view class="section">关联描述</view><view class="des">{{r}}<text class="ai">(AI合成)</text></view><view class="riskTips"> 【风险提示:解析内容由价值前沿人工采集整理自新闻、公告、研报等公开信息,团队辛苦编写,未经许可严禁转载。本产品内容内容均不构成投资建议,请投资者注意风险,独立审慎决策。】 </view></view><view wx:if="{{t}}" class="infoSourceC"><view class="section">信息来源</view><view class="list"><view wx:for="{{v}}" wx:for-item="item" wx:key="e" class="item"><view class="content">{{item.a}}</view><view class="article">——《{{item.b}}》</view><view class="authorDateC flex"><view class="author flex1">{{item.c}}</view><view class="date">{{item.d}}</view></view></view></view></view></view>
|
||||
108
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.wxss
vendored
Normal file
108
unpackage/dist/dev/mp-weixin/pages/index/stockDetails/stockDetails.wxss
vendored
Normal file
@@ -0,0 +1,108 @@
|
||||
page {
|
||||
background-color: #070707;
|
||||
}
|
||||
.topBg {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.chartDesC {
|
||||
background: linear-gradient(-30deg, #FFF6F0 0%, #FEFEFE 100%);
|
||||
margin: 0 25rpx;
|
||||
padding-top: 10rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.chartDesC .tabC .item {
|
||||
display: inline-block;
|
||||
padding: 0 25rpx;
|
||||
line-height: 60rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #42485B;
|
||||
}
|
||||
.chartDesC .tabC .item.select {
|
||||
font-weight: bold;
|
||||
color: #F3C368;
|
||||
}
|
||||
.chartDesC .tabC .item.select .line {
|
||||
background-color: #F3C368;
|
||||
left: calc((100% - 50rpx)/2);
|
||||
bottom: 0;
|
||||
width: 50rpx;
|
||||
height: 2rpx;
|
||||
}
|
||||
.chartDesC .volumeAmountC {
|
||||
padding: 25rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
}
|
||||
.chartDesC .volumeAmountC .volume {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.chartDesC .section {
|
||||
padding: 0 25rpx;
|
||||
line-height: 80rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #222;
|
||||
}
|
||||
.chartDesC .des {
|
||||
margin: 0 25rpx;
|
||||
line-height: 1.4rem;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #666;
|
||||
}
|
||||
.chartDesC .des .ai {
|
||||
color: #EC3440;
|
||||
}
|
||||
.chartDesC .riskTips {
|
||||
margin: 20rpx 25rpx 0;
|
||||
padding-bottom: 30rpx;
|
||||
line-height: 1.2rem;
|
||||
font-size: 22rpx;
|
||||
color: #A2A2A1;
|
||||
}
|
||||
.infoSourceC .section {
|
||||
padding: 0 25rpx;
|
||||
line-height: 80rpx;
|
||||
font-size: 27rpx;
|
||||
font-weight: bold;
|
||||
color: #F3C368;
|
||||
}
|
||||
.infoSourceC .list {
|
||||
padding: 0 25rpx;
|
||||
}
|
||||
.infoSourceC .list .item {
|
||||
background: linear-gradient(-30deg, #FFF6F0 0%, #FEFEFE 100%);
|
||||
margin-bottom: 20rpx;
|
||||
padding: 30rpx 26rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.infoSourceC .list .item .content {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #222;
|
||||
}
|
||||
.infoSourceC .list .item .article {
|
||||
margin-top: 10rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #666;
|
||||
text-align: right;
|
||||
}
|
||||
.infoSourceC .list .item .authorDateC {
|
||||
margin-top: 30rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #AAA;
|
||||
}
|
||||
.infoSourceC .list .item .authorDateC .author {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.contentC.radius {
|
||||
margin-top: 10rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
Reference in New Issue
Block a user