import { useReducer } from 'react' type State = { dataArr: any[],//数据存储 actionId: number,//左侧当前选中 actionIdold?: number,//记录上一次的选中 mediaTagIds?: number[],//标签 groupId?: number,//类型 actionData?: any,//当前选中数据 tags?: any[],//重写标签 ueditorRef?: any,//编辑器实例 delIds: any[], sort?: number, // 排序 } export type Action = { type: 'addDataArr' | 'delDataArr' | 'action' | 'mobile' | 'get' | 'setSort' | 'pushData' | 'addTag' | 'addClass' | 'initData' | 'actionData' | 'setRef' | 'importNews', params?: { up: boolean, eq: number } | { menuId: number } | any } export function reducer(state: State, action: Action) { let { dataArr } = state let { type, params } = action switch (type) { case 'addDataArr': //左侧添加 if (dataArr.length < 8) { let id = dataArr.length + 1 let newDelIds = [...state.delIds] if (newDelIds.length > 0) { id = state.delIds[0] newDelIds.splice(0, 1) } console.log('state', { ...state, dataArr: [...dataArr, { menuId: id, content: '
' }], delIds: newDelIds }) return { ...state, dataArr: [...dataArr, { menuId: id, content: '' }], delIds: newDelIds } } return state case 'delDataArr': //左侧删除 if (dataArr.length > 1) { return { ...state, dataArr: dataArr.filter((item: any) => item.menuId !== params.menuId), delIds: [...state.delIds, params.menuId] } } return { ...state, ... { dataArr: [{ menuId: 1, content: '' }], actionId: 1, mediaTagIds: [], groupId: '', actionData: null } } case 'action': //左侧选中 console.log({ ...state, actionIdold: state.actionId, actionId: params.menuId }) return { ...state, actionIdold: state.actionId, actionId: params.menuId } case 'actionData': console.log(params.data) return { ...state, actionData: params.data } case 'mobile'://左侧移动 let arr: any[] = [] dataArr.forEach((item: any, index: number) => { if (index === (params.up ? params.eq - 1 : params.eq + 1)) { arr[index] = dataArr[params.eq] arr[params.eq] = dataArr[index] } else if (index !== params.eq) { arr[index] = dataArr[index] } }) return { ...state, dataArr: arr } case 'pushData'://插入数据 dataArr = dataArr.map((item: any, index: number) => { if (item.menuId === params.menuId) { item = { ...item, ...params } } return item }) return { ...state, dataArr } case 'setSort': // 排序 return { ...state, sort: params.sort } case 'addTag': return { ...state, mediaTagIds: params.mediaTagIds } case 'addClass': return { ...state, groupId: params.groupId } case 'initData': let data = params?.data || { dataArr: [{ menuId: 1, content: '' }], actionId: 1, mediaTagIds: [], groupId: '', actionData: null, delIds: [], actionIdold: undefined, ueditorRef: null, sort: 0 } console.log('initData', { ...state, ...data }) return { ...state, ...data } case 'importNews'://批量导入图文 let { actionId, dataArrs } = params.data let newsarr: any[] = [...dataArr] if (newsarr.length > 0) { newsarr.splice(actionId - 1, dataArrs.length) } return { ...state, dataArr: [...newsarr, ...dataArrs] } case 'setRef': return { ...state, ueditorRef: params.ueditorRef } default: return state; } } export default function useMaterialDrawer() { const [state, dispatch] = useReducer(reducer, { dataArr: [{ menuId: 1, content: undefined }], actionId: 1, delIds: [], actionIdold: undefined, sort: 0 }) return { state, dispatch } }