import { useReducer } from "react"
import { TopImg, TopVideo, Text, Img as ImgProps, GhButton, TopSlider, WxAutoButton, Floatbutton, ImageText } from '../../req'

type Content = {
    seat: string,
    type: string | undefined,
    content: any,
    comptActive: boolean,
    title: string
}

type Props = {
    visible: boolean,
    hideModal: () => void,
    ajax?: any,
    id?: number
}

interface State {
    content: Array<TopImg | TopVideo | Content | Text | ImgProps | GhButton | WxAutoButton | TopSlider | ImageText>,    // 内容
    pageBackColor: string  // 背景色
}
interface Action {
    type: 'setCon' | 'setPageBackColor' | 'init',
    params?: any
}

function reducer(state: State, action: Action) {
    let { type, params } = action
    switch (type) {
        case 'setCon':
            return { ...state, content: params.content }
        case 'setPageBackColor':
            return { ...state, pageBackColor: params.pageBackColor }
        case 'init':
            return { ...state, content: [params] }
        default:
            return { ...state }
    }
}

const initState = {
    content: [
        {
            elementType: 'empty'
        }
    ],
    pageBackColor: '#FFFFFF'
}

interface StateGlobal {
    componentItem: Array<Floatbutton>,    // 悬浮组件 内容
}
interface ActionGlobal {
    type: 'setConItem' | 'init',
    params?: any
}

function reducerGlobal(state: StateGlobal, action: ActionGlobal) {
    let { type, params } = action
    switch (type) {
        case 'setConItem':
            return { ...state, componentItem: params.componentItem }
        case 'init':
            return { ...state, componentItem: [params] }
        default:
            return { ...state }
    }
}
const initStateGlobal = {
    componentItem: []
}

function landingPageReducer() {
    const [state, dispatch] = useReducer(reducer, initState)
    const [stateGlobal, dispatchGlobal] = useReducer(reducerGlobal, initStateGlobal)

    return {
        state,
        dispatch,
        stateGlobal,
        dispatchGlobal
    }
}

export {
    landingPageReducer,
    Content,
    Props,
    State
}