import React from 'react';
import {Button, Tree} from 'antd';
import StandardTable from '@/components/StandardTable';
import styles from './step01.less';

const treeData = [
    {
        title: 'xxxx部',
        key: 'dept-1',
        children: [
            {
                title: 'xxxx车间',
                key: 'workshop-1',
                children: [
                    {title: '第一车间', key: 'workshop-1-1'},
                    {title: '第二车间', key: 'workshop-1-2'},
                ],
            },
        ],
    },
];

const columns = [
    {
        title: '部门名称',
        dataIndex: 'deptName',
        key: 'deptName',
    },
    {
        title: '车间名称',
        dataIndex: 'workshopName',
        key: 'workshopName',
    },
    {
        title: '车间类型',
        dataIndex: 'workshopType',
        key: 'workshopType',
    },
    {
        title: '负责人',
        dataIndex: 'leader',
        key: 'leader',
    },
    {
        title: '联系方式',
        dataIndex: 'phone',
        key: 'phone',
    },
    {
        title: '所属区域',
        dataIndex: 'area',
        key: 'area',
    },
    {
        title: '最近一次评估时间',
        dataIndex: 'lastEvaluateTime',
        key: 'lastEvaluateTime',
    },
];

const dataSource = {
    list: [
        {
            key: '1',
            deptName: 'xxxx部',
            workshopName: '第五车间',
            workshopType: '喷涂车间',
            leader: '李斌',
            phone: '0948-45149757',
            area: '生产A区',
            lastEvaluateTime: '2025-11-14 00:19:50',
        },
        {
            key: '2',
            deptName: 'xxxx部',
            workshopName: '第一车间',
            workshopType: '电镀车间',
            leader: '孙亚荣',
            phone: '061-5042637',
            area: '公用工程区',
            lastEvaluateTime: '2025-11-14 07:52:53',
        },
        {
            key: '3',
            deptName: 'xxxx部',
            workshopName: '第二车间',
            workshopType: '电镀车间',
            leader: '赵慧',
            phone: '0407-82176847',
            area: '生产A区',
            lastEvaluateTime: '2025-11-16 15:45:10',
        },
        {
            key: '4',
            deptName: 'xxxx部',
            workshopName: '第一车间',
            workshopType: '电镀车间',
            leader: '李昭',
            phone: '030-60442414',
            area: '生产B区',
            lastEvaluateTime: '2025-11-20 04:24:15',
        },
        {
            key: '5',
            deptName: 'xxxx部',
            workshopName: 'Tododo2029',
            workshopType: '电镀车间',
            leader: '李昭',
            phone: '030-60442414',
            area: '生产B区',
            lastEvaluateTime: '2025-11-20 04:24:15',
        },
        {
            key: '6',
            deptName: 'xxxx部',
            workshopName: '午利有限公司',
            workshopType: '电镀车间',
            leader: '周国晖',
            phone: '086-31653597',
            area: '生产B区',
            lastEvaluateTime: '2025-11-24 14:42:05',
        },
    ],
    pagination: {
        currentPage: 1,
        pageSize: 10,
        total: 6,
    },
};

const Step01 = () => {
    return (
        <div className={styles.step01Layout}>
            {/* A 区域 */}
            <div className={styles.leftPanel}>
                {/* a 块：两个按钮 */}
                <div className={styles.leftTop}>
                    <Button type="primary" className={styles.toggleBtn}>
                        车间
                    </Button>
                    <Button className={styles.toggleBtn}>设备</Button>
                </div>

                {/* b 块：树结构 */}
                <div className={styles.leftBottom}>
                    <Tree
                        treeData={treeData}
                        defaultExpandAll
                    />
                </div>
            </div>

            {/* B 区域 */}
            <div className={styles.rightPanel}>
                {/* c 块：已选 + 下一步按钮 */}
                <div className={styles.rightTop}>
                    <span className={styles.selectedText}>已选: 8</span>
                    <Button
                        type="primary"
                        className={styles.nextBtn}
                    >
                        下一步
                    </Button>
                </div>

                {/* d 块：表格区域 */}
                <div className={styles.rightBottom}>
                    <div className={styles.tableWrapper}>
                        <StandardTable
                            rowKey="key"
                            columns={columns}
                            data={dataSource}
                            selectionType="checkbox"
                            showAlert={false}
                        />
                    </div>
                </div>
            </div>
        </div>
    );
};

export default Step01;

