@ -1,8 +1,26 @@
< template >
< view >
< view >
< view class = "tab" >
< view class = "item" : class = "{ select: type === '1min' }" @click ="onChangeType('1min')" > 1min
< / view >
< view class = "item" : class = "{ select: type === '5min' }" @click ="onChangeType('5min')" > 5min
< / view >
< view class = "item" : class = "{ select: type === '15min' }" @click ="onChangeType('15min')" > 15min
< / view >
< view class = "item" : class = "{ select: type === '30min' }" @click ="onChangeType('30min')" > 30min
< / view >
< view class = "item" : class = "{ select: type === '60min' }" @click ="onChangeType('60min')" > 60min
< / view >
< view class = "item" : class = "{ select: type === '1day' }" @click ="onChangeType('1day')" > 1day
< / view >
< view class = "item" : class = "{ select: type === '1week' }" @click ="onChangeType('1week')" > 1week
< / view >
< view class = "item" : class = "{ select: type === '1mon' }" @click ="onChangeType('1mon')" > 1mon
< / view >
< / view >
< view id = "kline" :windowWidth ="width" :change:windowWidth ="KlineJs.setWidth" :windowHeight ="height"
: change : windowHeight = "KlineJs.setHeight" : symbol = "symbol"
: change : symbol = "KlineJs.setSymbol" > < / view >
: change : symbol = "KlineJs.setSymbol" : index_activeCycle = "index_activeCycle" : change : index_activeCycle = "KlineJs.changindex_activeCycle" > < / view >
< / view >
< / template >
@ -13,11 +31,59 @@
mixins : [ props ] ,
data ( ) {
return {
type : '1min' ,
index_activeCycle : 1
} ;
} ,
created ( ) {
}
, methods : {
onChangeType ( type ) {
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 1 m i n ' ) " > 1 m i n
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 5 m i n ' ) " > 5 m i n
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 1 5 m i n ' ) " > 1 5 m i n
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 3 0 m i n ' ) " > 3 0 m i n
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 6 0 m i n ' ) " > 6 0 m i n
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 1 d a y ' ) " > 1 d a y
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 1 w e e k ' ) " > 1 w e e k
/ / < / v i e w >
/ / < v i e w c l a s s = " i t e m " : c l a s s = " { s e l e c t : t y p e = = = ' ' } " @ c l i c k = " o n C h a n g e T y p e ( ' 1 m o n ' ) " > 1 m o n
/ / < / v i e w >
this . type = type
switch ( type ) {
case '1min' :
this . index_activeCycle = 1 ;
break ;
case '5min' :
this . index_activeCycle = 5 ;
break ;
case '15min' :
this . index_activeCycle = 15 ;
break ;
case '30min' :
this . index_activeCycle = 30 ;
break ;
case '60min' :
this . index_activeCycle = 60 ;
break ;
case '1day' :
this . index_activeCycle = '1D' ;
break ;
case '1week' :
this . index_activeCycle = '1W' ;
break ;
case '1mon' :
this . index_activeCycle = '1M' ;
break ;
}
} ,
}
}
< / script >
@ -34,8 +100,6 @@
var widgetObj = null
/ / 进 入 页 面 默 认 展 示 的 产 品
var index_market = 'btcusdt'
/ / 进 入 页 面 默 认 展 示 的 产 品 周 期
var index_activeCycle = '1'
export default {
data ( ) {
@ -48,7 +112,7 @@
/ / 该 生 命 周 期 慢 于 不 是 r e n d e r j s 的 生 命 周 期
mounted ( ) {
/ / 初 始 化 图 表
this . initChart ( )
this . initChart ( "1" )
} ,
methods : {
setSymbol ( symbol ) {
@ -62,17 +126,21 @@
setHeight ( height ) {
console . log ( "可用窗口高度:" , height )
this . chartHeight = 300
} ,
initChart ( ) {
} ,
changindex_activeCycle ( index_activeCycle ) {
this . initChart ( index_activeCycle )
}
,
initChart ( index_activeCycle ) {
/ / c h a r t C o n f i g 在 c h a r t C o n f i g . j s 里 面
/ / 给 c h a r t C o n f i g 添 加 展 示 周 期
chartConfig . interval = index_activeCycle
chartConfig . intervals = [ '1' , '5' ]
chartConfig . interval = index_activeCycle
/ / 给 c h a r t C o n f i g 添 加 展 示 产 品
chartConfig . symbol = this . symbol
/ / 设 置 图 表 宽 高
chartConfig . width = this . chartWidth
chartConfig . height = this . chartHeight
chartConfig . height = this . chartHeight
chartConfig . time_frames = [ ]
/ / 初 始 化 T r a d i n g V i e w
console . log ( window . TradingView . version ( ) )
const language = uni . getStorageSync ( "language" ) || 'en_US' ;
@ -84,7 +152,8 @@
widgetObj = new widget ( chartConfig )
console . log ( widgetObj )
console . log ( 11111 , widgetObj )
widgetObj . _options . interval = 5
widgetObj . onChartReady ( ( ) => {
/ / 这 是 k 线 图 展 示 的 7 日 均 线 和 3 0 日 均 线 。
widgetObj . chart ( ) . createStudy ( 'Moving Average' , false , false , [ 5 ] , null , {
@ -100,5 +169,27 @@
}
}
< / script >
< / script >
< style lang = "scss" scoped >
. tab {
display : flex ;
background : # 000000 ;
. item {
height : 64 rpx ;
line - height : 64 rpx ;
flex : 1 ;
font - size : 24 rpx ;
text - align : center ;
& . select {
background : rgba ( 0 , 232 , 162 , 0.3 ) ;
border - radius : 19 px ;
}
}
}
< / style >
