import React, { useEffect, useState, useRef, useMemo } from 'react';
import { Form, Input, Button, Table, Radio } from 'antd';
import { EyeOutlined } from '@ant-design/icons';
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
import ReactEcharts from 'echarts-for-react';
import drpOption from './drpOption';
import moment from 'moment';
import './index.less'


const Page = ({record}) => {
    const columns = useMemo(()=>{
        if(record.type==='产流计算'){
            return [
                { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
                { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
                { title: '面雨量P(mm)', key: 'drp', dataIndex: 'drp', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
                { title: '土壤含水量Pa(mm)', key: 'pa', dataIndex: 'pa', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
                { title: '径流深R(mm)', key: 'r', dataIndex: 'r', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
              ];
        }else if(record.type==='汇流计算'){
            return [
                { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
                { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
                { title: '预测入库流量', key: 'ycRkQValue', dataIndex: 'ycRkQValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
              ];
        }else{
            return [
                { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
                { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
                { title: '预测出库流量', key: 'ycCkQValue', dataIndex: 'ycCkQValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
              ];
        }
    },[record])
    

    return (
        <>
            <div className="colorTable" style={{padding:"0px 0px"}}>
                <Table rowKey="id"
                    sticky
                    columns={columns}
                    pagination={false}
                    dataSource={record.list}
                    scroll={{ y: "650px"}}
                />
            </div>
        </>
    );
}

export default Page;