Merge branch 'trade' of https://github.com/ping-pub/look into trade
This commit is contained in:
commit
d88cd046ce
@ -1,3 +1,10 @@
|
|||||||
|
/*
|
||||||
|
* @Description: file
|
||||||
|
* @Autor: dingyiming
|
||||||
|
* @Date: 2021-11-22 21:20:10
|
||||||
|
* @LastEditors: dingyiming
|
||||||
|
* @LastEditTime: 2021-11-23 11:19:51
|
||||||
|
*/
|
||||||
import fetch from 'node-fetch'
|
import fetch from 'node-fetch'
|
||||||
import { getLocalChains } from './data/data'
|
import { getLocalChains } from './data/data'
|
||||||
|
|
||||||
@ -15,20 +22,31 @@ export default class OsmosAPI {
|
|||||||
async getOHCL4Pairs(from, to) {
|
async getOHCL4Pairs(from, to) {
|
||||||
this.exe_time = ''
|
this.exe_time = ''
|
||||||
return Promise.all(
|
return Promise.all(
|
||||||
[fetch(`https://api.coingecko.com/api/v3/coins/${from}/ohlc?vs_currency=usd&days=7`).then(res => res.json()),
|
[fetch(`https://api.coingecko.com/api/v3/coins/${from}/ohlc?vs_currency=usd&days=1`).then(res => res.json()),
|
||||||
fetch(`https://api.coingecko.com/api/v3/coins/${to}/ohlc?vs_currency=usd&days=7`).then(res => res.json())],
|
fetch(`https://api.coingecko.com/api/v3/coins/${to}/ohlc?vs_currency=usd&days=1`).then(res => res.json())],
|
||||||
).then(ohlc => {
|
).then(ohlc => {
|
||||||
const output = []
|
|
||||||
console.log(ohlc)
|
console.log(ohlc)
|
||||||
|
const output = []
|
||||||
ohlc[0].forEach((e, i) => {
|
ohlc[0].forEach((e, i) => {
|
||||||
console.log(e, i, ohlc[1][i])
|
|
||||||
const price = [e[0]]
|
const price = [e[0]]
|
||||||
for (let j = 1; j <= 4; j += 1) {
|
for (let j = 1; j <= 4; j += 1) {
|
||||||
price.push(e[j] / ohlc[1][i][j])
|
price.push(e[j] / ohlc?.[1]?.[i]?.[j])
|
||||||
}
|
}
|
||||||
output.push(price)
|
output.push(price)
|
||||||
})
|
})
|
||||||
return output
|
const result = []
|
||||||
|
for (let i = 0; i < output.length; i += 1) {
|
||||||
|
const itemArr = output[i]
|
||||||
|
result.push({
|
||||||
|
time: itemArr[0],
|
||||||
|
volume: 0,
|
||||||
|
open: itemArr[1],
|
||||||
|
high: itemArr[2],
|
||||||
|
low: itemArr[3],
|
||||||
|
close: itemArr[4],
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return result
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -61,7 +61,7 @@
|
|||||||
<div>-</div>
|
<div>-</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Kline />
|
<Kline :list="klineData" />
|
||||||
</b-card>
|
</b-card>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col
|
<b-col
|
||||||
@ -109,6 +109,7 @@ export default {
|
|||||||
{ pair: 'ATOM/OSMO' },
|
{ pair: 'ATOM/OSMO' },
|
||||||
{ pair: 'ATOM/OSMO' },
|
{ pair: 'ATOM/OSMO' },
|
||||||
],
|
],
|
||||||
|
klineData: [],
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -127,8 +128,12 @@ export default {
|
|||||||
const { base, target } = this.$route.params
|
const { base, target } = this.$route.params
|
||||||
this.init(base, target)
|
this.init(base, target)
|
||||||
// 所有方法添加到 $http.osmosis
|
// 所有方法添加到 $http.osmosis
|
||||||
this.$http.osmosis.getOHCL4Pairs(this.$http.osmosis.getCoinGeckoId(this.base), this.$http.osmosis.getCoinGeckoId(this.target)).then(data => {
|
this.$http.osmosis.getOHCL4Pairs(
|
||||||
console.log(data)
|
this.$http.osmosis.getCoinGeckoId(base),
|
||||||
|
this.$http.osmosis.getCoinGeckoId(target),
|
||||||
|
)
|
||||||
|
.then(data => {
|
||||||
|
this.klineData = data
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
beforeRouteUpdate(to, from, next) {
|
beforeRouteUpdate(to, from, next) {
|
||||||
|
42
src/views/components/kline/KlineTheme.js
Normal file
42
src/views/components/kline/KlineTheme.js
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
// 白色主题
|
||||||
|
export const TRADINGVIEW_THEME_LIGHT = {
|
||||||
|
bg: '#fff',
|
||||||
|
crosshair: '#888888',
|
||||||
|
short: '#ea0070',
|
||||||
|
shortFill: '#ea0070',
|
||||||
|
long: '#70a800',
|
||||||
|
longFill: '#70a800',
|
||||||
|
cta: '#FBFBFB',
|
||||||
|
ctaHighlight: '#F5F5F5',
|
||||||
|
alert: '#FFD506',
|
||||||
|
category: 'light',
|
||||||
|
grid: '#EFF3F6',
|
||||||
|
lineColor: '#555',
|
||||||
|
textColor: '#999',
|
||||||
|
maLine: '#f0b90b',
|
||||||
|
ma1: '#ffc200',
|
||||||
|
ma2: '#6600cc',
|
||||||
|
ma3: '#cc0066',
|
||||||
|
};
|
||||||
|
|
||||||
|
// 黑色主题
|
||||||
|
export const TRADINGVIEW_THEME_DARK = {
|
||||||
|
bg: '#283046',
|
||||||
|
grid: '#333',
|
||||||
|
lineColor: '#28343C',
|
||||||
|
short: '#ea5455',
|
||||||
|
shortFill: '#ea5455',
|
||||||
|
long: '#28c76f',
|
||||||
|
longFill: '#28c76f',
|
||||||
|
crosshair: '#626c73',
|
||||||
|
cta: '#363D52',
|
||||||
|
ctaHighlight: '#414A67',
|
||||||
|
alert: '#FFD506',
|
||||||
|
category: 'dark',
|
||||||
|
textColor: '#999',
|
||||||
|
maLine: '#f5bc00',
|
||||||
|
ma1: '#ffc200',
|
||||||
|
ma2: '#ff00ff',
|
||||||
|
ma3: '#cc0066',
|
||||||
|
};
|
@ -46,7 +46,7 @@ class DataFeeds {
|
|||||||
onReady(callback) {
|
onReady(callback) {
|
||||||
const defaultConfiguration = {
|
const defaultConfiguration = {
|
||||||
symbols_type: [],
|
symbols_type: [],
|
||||||
supported_resolutions: ['1', '5', '15', '30', '60', '240', '1D', '1M'],
|
supported_resolutions: ['30', '240', '1D'],
|
||||||
supports_marks: true,
|
supports_marks: true,
|
||||||
supports_timescale_marks: false,
|
supports_timescale_marks: false,
|
||||||
supports_time: false,
|
supports_time: false,
|
||||||
@ -121,7 +121,7 @@ class DataFeeds {
|
|||||||
has_empty_bars: true,
|
has_empty_bars: true,
|
||||||
description: '',
|
description: '',
|
||||||
has_intraday: true,
|
has_intraday: true,
|
||||||
supported_resolutions: ['1', '5', '15', '30', '60', '120', '240', '360', '1D'],
|
supported_resolutions: ['30','240', '1D'],
|
||||||
pricescale: 100000000, // 价格精度
|
pricescale: 100000000, // 价格精度
|
||||||
volume_precision: 3, // 数量精度
|
volume_precision: 3, // 数量精度
|
||||||
symbol: symbolName,
|
symbol: symbolName,
|
||||||
|
@ -10,6 +10,7 @@
|
|||||||
import pako from 'pako'
|
import pako from 'pako'
|
||||||
import { widget, version } from './charting_library/charting_library'
|
import { widget, version } from './charting_library/charting_library'
|
||||||
import DataFeeds from './datafeed'
|
import DataFeeds from './datafeed'
|
||||||
|
import { TRADINGVIEW_THEME_LIGHT, TRADINGVIEW_THEME_DARK } from './KlineTheme';
|
||||||
|
|
||||||
const toDouble = time => {
|
const toDouble = time => {
|
||||||
if (String(time).length < 2) return `0${time}`
|
if (String(time).length < 2) return `0${time}`
|
||||||
@ -17,8 +18,15 @@ const toDouble = time => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
props: {
|
||||||
|
list: [],
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
themeLocal: 'dark'
|
||||||
|
}
|
||||||
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
console.log(version())
|
|
||||||
|
|
||||||
const store = {
|
const store = {
|
||||||
ws: new WebSocket('wss://api.huobipro.com/ws'),
|
ws: new WebSocket('wss://api.huobipro.com/ws'),
|
||||||
@ -49,26 +57,27 @@ export default {
|
|||||||
volume: data.amount,
|
volume: data.amount,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
console.log(this.list);
|
||||||
store.onDataCallback(datas, { noData: !datas.length })
|
store.onDataCallback(this.list, { noData: !this.list.length })
|
||||||
}
|
}
|
||||||
|
|
||||||
if (res.tick) {
|
// if (res.tick) {
|
||||||
const data = res.tick
|
// const data = res.tick
|
||||||
|
|
||||||
store.onRealTimeCallback({
|
// store.onRealTimeCallback({
|
||||||
time: data.id * 1000,
|
// time: data.id * 1000,
|
||||||
volume: data.amount,
|
// volume: data.amount,
|
||||||
close: data.close,
|
// close: data.close,
|
||||||
open: data.open,
|
// open: data.open,
|
||||||
high: data.high,
|
// high: data.high,
|
||||||
low: data.low,
|
// low: data.low,
|
||||||
})
|
// })
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
reader.readAsArrayBuffer(e.data)
|
reader.readAsArrayBuffer(e.data)
|
||||||
}
|
}
|
||||||
|
const tradingViewStyle = (this.themeLocal === 'dark' ? TRADINGVIEW_THEME_DARK : TRADINGVIEW_THEME_LIGHT);
|
||||||
|
|
||||||
const tv = new widget({
|
const tv = new widget({
|
||||||
debug: false,
|
debug: false,
|
||||||
@ -85,34 +94,79 @@ export default {
|
|||||||
datafeed: new DataFeeds(store),
|
datafeed: new DataFeeds(store),
|
||||||
theme: 'Dark',
|
theme: 'Dark',
|
||||||
favorites: {
|
favorites: {
|
||||||
intervals: ['1', '5', '15', '30', '60', '240', '1D'],
|
intervals: ['30', '240', '1D'],
|
||||||
},
|
|
||||||
customFormatters: {
|
|
||||||
timeFormatter: {
|
|
||||||
format: date => {
|
|
||||||
const _format_str = '%h:%m'
|
|
||||||
return _format_str.replace('%h', toDouble(date.getUTCHours()), 2).replace('%m', toDouble(date.getUTCMinutes()), 2).replace('%s', date.getUTCSeconds(), 2)
|
|
||||||
},
|
|
||||||
},
|
|
||||||
dateFormatter: {
|
|
||||||
format: date => `${date.getUTCFullYear()}-${toDouble(date.getUTCMonth() + 1)}-${toDouble(date.getUTCDate())}`,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
disabled_features: [ // 禁用功能
|
disabled_features: [ // 禁用功能
|
||||||
'header_symbol_search',
|
|
||||||
'symbol_search_hot_key',
|
|
||||||
'header_compare',
|
|
||||||
'header_undo_redo',
|
|
||||||
'header_screenshot',
|
|
||||||
'volume_force_overlay',
|
'volume_force_overlay',
|
||||||
|
'left_toolbar',
|
||||||
|
'timeframes_toolbar',
|
||||||
|
'header_symbol_search',
|
||||||
|
'header_compare',
|
||||||
|
// 'header_fullscreen_button',
|
||||||
|
'header_widget',
|
||||||
|
// 'use_localstorage_for_settings',
|
||||||
|
'save_chart_properties_to_local_storage',
|
||||||
|
// 'header_chart_type',
|
||||||
|
// 'display_market_status',
|
||||||
|
'symbol_search_hot_key',
|
||||||
|
'compare_symbol',
|
||||||
|
'border_around_the_chart',
|
||||||
|
'remove_library_container_border',
|
||||||
|
'symbol_info',
|
||||||
|
// 'header_interval_dialog_button',
|
||||||
|
// 'show_interval_dialog_on_key_press',
|
||||||
|
'volume_force_overlay',
|
||||||
|
// 'header_resolutions',
|
||||||
|
// 'legend_context_menu',
|
||||||
|
// new
|
||||||
|
'symbol_info',
|
||||||
|
'pane_context_menu',
|
||||||
],
|
],
|
||||||
enabled_features: [ // 启用的功能
|
enabled_features: [ // 启用的功能
|
||||||
'dont_show_boolean_study_arguments', // 是否隐藏指标参数
|
'hide_left_toolbar_by_default',
|
||||||
'hide_last_na_study_output', // 隐藏最后一次指标输出
|
'pane_context_menu',
|
||||||
'same_data_requery',
|
'hide_last_na_study_output',
|
||||||
'side_toolbar_in_fullscreen_mode',
|
'dont_show_boolean_study_arguments',
|
||||||
'adaptive_logo',
|
|
||||||
],
|
],
|
||||||
|
|
||||||
|
overrides: {
|
||||||
|
'paneProperties.background': tradingViewStyle.bg,
|
||||||
|
'symbolWatermarkProperties.transparency': 85,
|
||||||
|
'scalesProperties.backgroundColor': '#151a1e',
|
||||||
|
'scalesProperties.textColor': '#888',
|
||||||
|
|
||||||
|
'paneProperties.vertGridProperties.color': tradingViewStyle.grid,
|
||||||
|
'paneProperties.horzGridProperties.color': tradingViewStyle.grid,
|
||||||
|
'paneProperties.crossHairProperties.color':
|
||||||
|
tradingViewStyle.crosshair,
|
||||||
|
'scalesProperties.lineColor': tradingViewStyle.lineColor,
|
||||||
|
'symbolWatermarkProperties.color': 'rgba(0, 0, 0, 0)',
|
||||||
|
|
||||||
|
'mainSeriesProperties.style': 1,
|
||||||
|
|
||||||
|
// Candles styles
|
||||||
|
'mainSeriesProperties.candleStyle.upColor': tradingViewStyle.long,
|
||||||
|
'mainSeriesProperties.candleStyle.downColor': tradingViewStyle.short,
|
||||||
|
'mainSeriesProperties.candleStyle.drawWick': true,
|
||||||
|
'mainSeriesProperties.candleStyle.drawBorder': true,
|
||||||
|
'mainSeriesProperties.candleStyle.borderColor': '#C400CB',
|
||||||
|
'mainSeriesProperties.candleStyle.borderUpColor':
|
||||||
|
tradingViewStyle.long,
|
||||||
|
'mainSeriesProperties.candleStyle.borderDownColor':
|
||||||
|
tradingViewStyle.short,
|
||||||
|
'mainSeriesProperties.candleStyle.wickUpColor': tradingViewStyle.long,
|
||||||
|
'mainSeriesProperties.candleStyle.wickDownColor':
|
||||||
|
tradingViewStyle.short,
|
||||||
|
|
||||||
|
'study_Overlay@tv-basicstudies.barStyle.upColor': 'blue',
|
||||||
|
'study_Overlay@tv-basicstudies.barStyle.downColor': 'blue',
|
||||||
|
|
||||||
|
'study_Overlay@tv-basicstudies.lineStyle.color': 'blue',
|
||||||
|
|
||||||
|
'study_Overlay@tv-basicstudies.areaStyle.color1': 'blue',
|
||||||
|
'study_Overlay@tv-basicstudies.areaStyle.color2': 'blue',
|
||||||
|
'study_Overlay@tv-basicstudies.areaStyle.linecolor': 'blue',
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
tv.onChartReady(() => {
|
tv.onChartReady(() => {
|
||||||
@ -134,5 +188,4 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
||||||
</style>
|
</style>
|
Loading…
Reference in New Issue
Block a user