import React from 'react' ; import { Radio , Tooltip } from 'antd' ; import { useTranslation } from 'react-i18next' ; import { DesktopOutlined , TabletOutlined , MobileOutlined , } from '@ant-design/icons' ; import styles from './ChartViewSwitcher.module.less' ; interface Prop { updateView : ( val : string ) => void ; view : string ; } const ChartViewSwitcher = ( { updateView , view } ) => { const { t } = useTranslation ( ) ; const onChange = ( e ) => { updateView ( e . target . value ) ; const resize = new Event ( 'resize' ) ; window . dispatchEvent ( resize ) ; } ; return ( < Radio . Group className = { styles . btnBar } value = { view } buttonStyle = "solid" onChange = { onChange } > < Tooltip title = { t ( '切换至电脑视图' ) } > < Radio . Button value = "desktop" > < DesktopOutlined /> < /Radio.Button> < /Tooltip> < Tooltip title = { t ( '切换至平板视图' ) } > < Radio . Button value = "tablet" > < TabletOutlined /> < /Radio.Button> < /Tooltip> < Tooltip title = { t ( '切换至移动端视图' ) } > < Radio . Button value = "mobile" > < MobileOutlined /> < /Radio.Button> < /Tooltip> < /Radio.Group>); } ; export default ChartViewSwitcher ;