import * as React from 'react';
import { Tabs } from 'kts-components-antd-x4';
import Icon from '@ant-design/icons';
import { ReactComponent as Back } from './icon/backIcon.svg';
import { PageHeaderTop, Button, PageHeaderFoot } from 'kts-xui';
import { InfoCircleOutlined, NotificationOutlined, PayCircleOutlined, WarningOutlined, ExceptionOutlined, FormOutlined, CopyOutlined } from '@ant-design/icons';
import { withRouter, RouteChildrenProps } from 'react-router-dom';
import InfoGS from './UI.InfoGS/index';
import TaxCreditRate from './UI.TaxCreditRate/index'
import AbnormalManage from './UI.AbnormalManage/index'
import Punishmentinfo from './UI.Punishmentinfo/index'
import Lawsuit from './UI.Lawsuit/index';
import Taxcontravention from './UI.Taxcontravention/index'
import OwnTax from './UI.OwnTax/index'
import { Switch, Route, MemoryRouter } from 'react-router-dom';
import './index.less';

class UIComponents extends React.Component<RouteChildrenProps, any> {
    constructor(props) {
        super(props);
        this.state = {
            tab: '1',
            companyName: (this.props.match?.params as any)?.company
        };
    }
    onChange = (key) => {
        const { id = 0, company } = this.props.match?.params as any;
        this.props.history.push(`/task/risk/company/detail/${id}/${company}/${key}`)
    }
    goBack = () => {
        this.props.history.push('/task/list/echart')
    }
    render() {
        const { tab = '1', id = 0 } = this.props.match?.params as any;
        const { companyName } = this.state;
        return (
            <div className='risk' style={{ display: 'flex', flexDirection: 'column', overflow: 'auto', height: '100vh' }}>
                {/* <div style={{display: 'flex', flexDirection: 'row', flexWrap: 'wrap', alignItems: 'center',justifyContent: 'space-between'}}> */}
                <PageHeaderTop
                    title={`客商详情 - ${companyName}`}
                    help=""
                    activeKey={tab}
                    onChange={this.onChange}
                    tabBarExtraContent={<Button key='2' style={{ marginRight: 20 }} icon={<Icon component={Back} />} onClick={this.goBack}></Button>}
                    tabs={[
                        {
                            tab: <div style={{ paddingLeft: 0, }}>
                                <span><InfoCircleOutlined />工商信息</span>
                            </div>, tabKey: '1', children: <InfoGS {...{ id }} />
                        },
                        {
                            tab: <div style={{ paddingLeft: 0, }}>
                                <span><FormOutlined />税务评级</span>
                            </div>, tabKey: '2', children: <TaxCreditRate {...{ id }} />
                        },
                        {
                            tab: <div style={{ paddingLeft: 0, }}>
                                <span><WarningOutlined />经营异常</span>
                            </div>, tabKey: '3', children: <AbnormalManage {...{ id }} />
                        },
                        {
                            tab: <div style={{ paddingLeft: 0, }}>
                                <span><CopyOutlined />行政处罚</span>
                            </div>, tabKey: '4', children: <Punishmentinfo {...{ id }} />
                        },
                        {
                            tab: <div style={{ paddingLeft: 0 }}>
                                <span><ExceptionOutlined />法律诉讼</span>
                            </div>, tabKey: '5', children: <Lawsuit {...{ id }} />
                        },
                        {
                            tab: <div style={{}}>
                                <span><PayCircleOutlined />税收违法</span>
                            </div>, tabKey: '6', children: <Taxcontravention  {...{ id }} />
                        },
                        {
                            tab: <div style={{}}>
                                <span><NotificationOutlined />欠税公告</span>
                            </div>, tabKey: '7', children: <OwnTax  {...{ id }} />
                        },
                    ]}
                />
                {/* <Tabs  defaultActiveKey={tab || '1'} destroyInactiveTabPane={true}>
                    <TabPane tab={<span><InfoCircleOutlined />工商信息</span>} key="1">
                        <InfoGS {...{ id }} />
                    </TabPane>
                    <TabPane tab={<span><FormOutlined />税务评级</span>} key="2">
                        <TaxCreditRate {...{ id }} />
                    </TabPane>
                    <TabPane tab={<span><WarningOutlined />经营异常</span>} key="3">
                        <AbnormalManage {...{ id }} />
                    </TabPane>
                    <TabPane tab={<span><CopyOutlined />行政处罚</span>} key="4">
                        <Punishmentinfo {...{ id }} />
                    </TabPane>
                    <TabPane tab={<span><ExceptionOutlined />法律诉讼</span>} key="5">
                        <Lawsuit {...{ id }} />
                    </TabPane>
                    <TabPane tab={<span><PayCircleOutlined />税收违法</span>} key="6">
                        <Taxcontravention  {...{ id }} />
                    </TabPane>
                    <TabPane tab={<span><NotificationOutlined />欠税公告</span>} key="7">
                        <OwnTax  {...{ id }} />
                    </TabPane>
                </Tabs> */}
            </div>
        )
    }
}
export default withRouter(UIComponents as any)