

import React, { useEffect,useRef,useState } from 'react'
import PropTypes from 'prop-types'

import {Modal, Divider } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import type { ProFormInstance } from '@ant-design/pro-form';
import ProForm, {
    ProFormText,
} from '@ant-design/pro-form';
import { useModel,history } from 'umi';
import './index.less';

import type {menuDataItemType} from '@/app';

import IframePage from '@/components/iframePage/index';


type MccsPageContainerType = Record<string, any>

const getCurrentRoutesData = (data: menuDataItemType[], path: string) => {
    let result;
    function looper (arr: menuDataItemType[]){
        for (const element of arr) {
            if (element.path == path) {
                result =  element
            } else if (element.children && element.children.length > 0) {
                    looper(element.children);
                }
        }
    }
    looper(data);
    return result;
}

const MccsPageContainer: React.FC<MccsPageContainerType> = (props)=>{
    /**
     * @param {*} children 
     * @param {Object} config  //组件配置信息，参考ProComponent ProContainer
     * @returns 
     */
    const { children, config } = props;
    const formRef = useRef<ProFormInstance>();
    const { goSetting, update,currentUser,resetPasswordHandle,menu} = useModel('@@initialState', (model) => ({ 
         goSetting: model.initialState?.goSetting,
         update: model.setInitialState,
         currentUser:model.initialState?.currentUser,
         menu:model.initialState?.menu,
         resetPasswordHandle:model.initialState?.resetPasswordHandle,
    }));
    const [iframeUrl,setIframeUrl] = useState<string>();

    useEffect(() => {
      
        if (goSetting) {
            // 设置触发
            Modal.confirm({
                title: '密码设置',
                icon: null,
                width: 600,
                content: (
                    <ProForm initialValues={{...currentUser}} submitter={false} formRef={formRef}>
                        <Divider />
                        <ProFormText
                            width="md"
                            name="name"
                            label="姓名"
                            disabled
                        />
                        <ProFormText
                            width="md"
                            name="userId"
                            label="userId"
                            disabled
                        />
                        <ProFormText
                            width="md"
                            name="rePassword"
                            label="密码"
                            placeholder='密码不修改时留空'
                        />
                        <ProFormText
                            width="md"
                            name="password"
                            label="再输入一次密码"
                            placeholder='密码不修改时留空'
                        />
                    </ProForm>
                ),
                onOk: () => {
                    if(formRef.current){
                        const {password,userId,rePassword} = formRef.current.getFieldsValue();
                        const params = {
                            userId,
                            password,
                            rePassword
                        }
                        resetPasswordHandle?.(params).then((bool: boolean)=>{
                                if(bool){
                                    update((t: any) => ({ ...t, goSetting: false }))
                                }
                        })
                    }
                },
                closable: false,
                onCancel: () => update((t: any) => ({ ...t, goSetting: false }))
            })
        }
    }, [goSetting]);

    useEffect(()=>{
        const { location: { pathname } } = history;
        if (menu) {
            const currentRouteData: any = getCurrentRoutesData(menu, pathname);
            if(currentRouteData){
                setIframeUrl(currentRouteData.softUrl);
            }else{
                setIframeUrl('');
            }
        }
    },[]);

    return (
        <PageContainer
            {
            ...config
            }
            style={{ padding: '16px' }}
        >
            {
                iframeUrl?<IframePage url={`${iframeUrl}`} />:children
            }
        </PageContainer>
    )
}

MccsPageContainer.propTypes = {
    config: PropTypes.object,
    children: PropTypes.node
}

export default MccsPageContainer

