You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
127 lines
2.9 KiB
127 lines
2.9 KiB
<template>
|
|
|
|
<div>
|
|
<div style='background-color:#101010;'>
|
|
<HQChartControl ref="HQChartCtrl" DefaultChart="{Type:'KLine'}" DefaultSymbol="000001.sz"> </HQChartControl>
|
|
</div>
|
|
|
|
<!-- 控制图1 !-->
|
|
<div class="button-sp-area">
|
|
<button class="mini-btn" type="default" size="mini" @click="ChangeKLinePeriod(0,0)">D</button>
|
|
<button class="mini-btn" type="default" size="mini" @click="ChangeKLinePeriod(0,1)">W</button>
|
|
<button class="mini-btn" type="default" size="mini" @click="ChangeKLinePeriod(0,4)">1M</button>
|
|
<button class="mini-btn" type="default" size="mini" @click="ChangeKLinePeriod(0,5)">15M</button>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
|
|
data() {
|
|
let data = {
|
|
Symbol: '600000.sh',
|
|
ChartWidth: 350,
|
|
ChartHeight: 500,
|
|
};
|
|
|
|
return data;
|
|
},
|
|
|
|
onLoad() {
|
|
uni.connectSocket({
|
|
url: 'wss://api.huobi.pro/ws'
|
|
});
|
|
uni.onSocketOpen(function(res) {
|
|
console.log('WebSocket连接已打开！');
|
|
});
|
|
uni.onSocketError(function(res) {
|
|
console.log('WebSocket连接打开失败，请检查！');
|
|
});
|
|
uni.onSocketMessage(function(res) {
|
|
console.log('收到服务器内容：' + res.data);
|
|
});
|
|
uni.onSocketClose(function(res) {
|
|
console.log('WebSocket 已关闭！');
|
|
});
|
|
},
|
|
beforeDestroy() {
|
|
uni.closeSocket();
|
|
|
|
},
|
|
onShow() {
|
|
uni.getSystemInfo({
|
|
success: (res) => {
|
|
var width = res.windowWidth;
|
|
var height = res.windowHeight;
|
|
this.ChartWidth = width;
|
|
this.ChartHeight = height - 130;
|
|
this.$nextTick(() => {
|
|
this.CreateHQChart();
|
|
})
|
|
}
|
|
});
|
|
},
|
|
|
|
onHide() {
|
|
this.ClearHQChart();
|
|
},
|
|
|
|
onUnload() {
|
|
this.ClearHQChart();
|
|
},
|
|
|
|
methods: {
|
|
checkOpenSocket() {
|
|
let self = this;
|
|
uni.sendSocketMessage({
|
|
data: 'ping',
|
|
success: (res) => {
|
|
return;
|
|
},
|
|
fail: (err) => { // 未连接打开websocket连接
|
|
self.openConnection();
|
|
}
|
|
});
|
|
},
|
|
CreateHQChart() {
|
|
var chartHeight = this.ChartHeight / 2;
|
|
let hqchartCtrl = this.$refs.HQChartCtrl;
|
|
hqchartCtrl.NetworkFilter = this.NetworkFilter;
|
|
hqchartCtrl.SetSize(this.ChartWidth, chartHeight);
|
|
hqchartCtrl.OnSize();
|
|
hqchartCtrl.CreateHQChart();
|
|
|
|
},
|
|
|
|
ClearHQChart() {
|
|
let hqchartCtrl = this.$refs.HQChartCtrl;
|
|
if (hqchartCtrl) hqchartCtrl.ClearChart();
|
|
},
|
|
|
|
ChangeMinutePeriod(id, days) {
|
|
let hqchartCtrl = this.$refs.HQChartCtrl;
|
|
|
|
hqchartCtrl.ChangeMinutePeriod(days);
|
|
},
|
|
|
|
ChangeKLinePeriod(id, period) {
|
|
let hqchartCtrl = this.$refs.HQChartCtrl;
|
|
// https://blog.csdn.net/jones2000/article/details/90272733
|
|
hqchartCtrl.ChangeKLinePeriod(period);
|
|
},
|
|
|
|
NetworkFilter(data, callback) {
|
|
// https://github.com/jones2000/HQChart/blob/master/webhqchart.demo/demo/ws_minute_demo.html
|
|
console.log(`[App:NetworkFilter] Name=${data.Name} Explain=${data.Explain}`);
|
|
console.log("=====================================");
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|
|
|