import React, { useEffect  } from 'react';
import { Modal , Button , Input  } from 'antd';
import * as commonFunc from "@/components/Common/commonFunc";
import * as commonUtils from "@/utils/utils";
import * as commonBusiness from "@/components/Common/commonBusiness";
import StaticEditTable from "@/components/Common/CommonTable";
import useCommonBase from "@/components/Common/CommonHooks/useCommonBase";
import styles from './index.less'


const teamInfoSid = "12710101117087385123610";
// 业务层
const useTeamInfoEvent = (props) => {

    const { formData } = props;
    useEffect(async () => {
        if (commonUtils.isNotEmptyArr(formData)) {
            const colunmData = handleGetColumnData(formData, true);
            const result = await handleGetData(formData, true);
            const addState = {
                ...colunmData,
                ...result
            };
            props.onSaveState(addState)
        }
    }, [formData])

    // 获取表头数据
    const handleGetColumnData = (formData = [], isWait) => {
        let addState = {};
        for (let i = 0; i < formData.length; i++) {
            const config = formData[i];
            const column = commonFunc.getHeaderConfig(config);
            addState = {
                ...addState,
                [`slave${i}Column`]: column,
                [`slave${i}Config`]: config
            };
        }
        if (isWait) {
            return addState;
        } else {
            props.onSaveState(addState);
        }
    };

    // 获取数据集
    const handleGetData = async (formData = [], isWait) => {
        let addState = {};
        for (let i = 0; i < formData.length; i++) {
            const config = formData[i];
            const { sGrd } = config;
            const conditonValues = props.onGetSqlConditionValues(config);
            const result =
                (await props.onGetDataSet({
                    name: sGrd,
                    configData: config,
                    condition: { sSqlCondition: { ...conditonValues } },
                    isWait: true
                })) || {};
            props.setTempRef(result);
            addState = { ...addState, ...result };
        }
        props.setTempRef({}, true);
        if (isWait) {
            return addState;
        } else {
            props.onSaveState(addState);
        }
    };

    return {
        ...props,
        //  其他对象
    }
}


const firstNoticeModal = _props =>{
    if (!_props.modalValue) return "";

    const props = useTeamInfoEvent(useCommonBase({..._props, sModelsId: teamInfoSid}));
    
    // 人员
    const tablePropsCrew = {
        ...commonBusiness.getTableTypes('slave0', props),
        tableProps: {
            onChange: () => {},
            tableHeight: '100%',
        },
        fixedHeight : '100.5px',
    };

    // 收信人
    const tablePropsCollect = {
        ...commonBusiness.getTableTypes('slave1', props),
        tableProps: {
            onChange: () => {},
            tableHeight: '100%',
        },
        fixedHeight : '100.5px',
    };


    // 岗位
    const tablePropsPost = {
        ...commonBusiness.getTableTypes('slave3', props),
        tableProps: {
            onChange: () => {},
            tableHeight: '100%',
        },
        fixedHeight : '100.5px',
    };


    // 通知列表
    const tableProps = {
        ...commonBusiness.getTableTypes('slave2', props),
        tableProps: {
            onChange: () => {},
            tableHeight: '100%',
        },
        fixedHeight : '100.5px',
    };





    return (
        <Modal title="扫码上料" footer={null} open={props.modalValue}  width="80%" onCancel={()=>props.setModalShow(false)} wrapClassName={styles.modalRef}>
            <div className={styles.firstNoticeBox}>
                <div className="noticeInfo">
                    <div className="post">
                        <h2>签样岗位</h2>
                        <div>
                            <StaticEditTable {...tablePropsPost} /> 
                        </div>
                    </div>
                    <div className="postUser">
                        <div className="postUser_box">
                            <div className="postTable">
                                <StaticEditTable {...tablePropsCrew} />
                            </div>
                            <div className="userTable">
                                <StaticEditTable {...tablePropsCollect} />
                            </div>
                        </div>
                        <div className='postUser-foot'>
                            <Input size="large" placeholder="人员名称" />
                            <Button size="large" type="primary">查 询</Button>
                            <Button size="large" type="primary">全 部</Button>
                        </div>
                    </div>
                    <div className="postFrom">
                        <div class="postFrom_box">表单</div>
                        <div className='postFrom-foot'>
                            <Button size="large" type="primary" onClick={()=>props.setModalShow(false) }  style={{"background":'#ff7800' , 'border-color': '#ff7800'}}>取 消</Button>
                            <Button size="large" type="primary">发 送</Button>
                        </div>
                    </div>
                </div>
                <div class="noticeList">
                    <h2>首签样通知列表</h2>
                    <div>
                        <StaticEditTable {...tableProps} />
                    </div>
                </div>
            </div>
        </Modal> 
    )
}



export default firstNoticeModal;