import { Tabs, Select, Image } from 'antd';
import React from 'react';
import predict from './predict.png';

const durationSelect = () => {
    const options = [
        { value: '15', label: '15min' },
        { value: '30', label: '30min' },
        { value: '60', label: '60min' },
    ];
    return <Select defaultValue="15" style={{ width: 120 }} options={options} />;
};

const StationInfo = () => {
    return (
        <Tabs defaultActiveKey="1" tabBarExtraContent={durationSelect()}>
            <Tabs.TabPane tab="FS8" key="1">
                <Image style={{ maxWidth: '80%' }} src={predict} />
            </Tabs.TabPane>
            <Tabs.TabPane tab="FT10" key="2">
                <Image style={{ maxWidth: '80%' }} src={predict} />
            </Tabs.TabPane>
            <Tabs.TabPane tab="ST11" key="3">
                <Image style={{ maxWidth: '80%' }} src={predict} />
            </Tabs.TabPane>
        </Tabs>
    );
};

export default StationInfo;
