import FilmList from './film_list' import DeviceList from './device_list' import { ComponentClass } from 'react' import { AtTabs, AtTabsPane } from 'taro-ui' import Taro, { Component, Config } from '@tarojs/taro' import './index.scss' import { View } from '@tarojs/components' type PageStateProps = {} type PageDispatchProps = {} type PageOwnProps = {} type PageState = { current: number windowHeight: number } type IProps = PageStateProps & PageDispatchProps & PageOwnProps interface Device { props: IProps state: PageState } const tabList = [{ title: '我的视片' }, { title: '我的设备' }] class Device extends Component { config: Config = { navigationBarTitleText: '', navigationStyle: process.env.TARO_ENV === 'rn' ? 'custom' : 'default' } constructor(props) { super(props) const { windowHeight } = Taro.getSystemInfoSync() this.state = { current: 1, windowHeight: windowHeight - 43 } } changePage = value => { this.setState({ current: value }) } render() { const { current, windowHeight } = this.state return ( <AtTabs current={current} tabList={tabList} onClick={this.changePage} swipeable={false}> <AtTabsPane current={current} index={0}> <View style={{ height: `${windowHeight}px` }}> <FilmList height={windowHeight} /> </View> </AtTabsPane> <AtTabsPane className="at-tabs-page" current={current} index={1}> <View style={{ height: `${windowHeight}px` }}> <DeviceList height={windowHeight} /> </View> </AtTabsPane> </AtTabs> ) } } export default Device as ComponentClass<PageOwnProps, PageState>