import { getMenuAll } from '@/api/common/menu';
import { setStore, getStore } from '@/utils/store';
import { toCamelCase, upperFirst } from '@/utils/string';

export default {
    state: {
        parentMenus: getStore({ name: 'parent_menus' }) || [],
        childMenus: getStore({ name: 'child_menus' }) || [],
    },
    mutations: {
        setParentMenus(state, parentMenus) {
            state.parentMenus = parentMenus;
            setStore({
                name: "parent_menus",
                content: state.parentMenus,
                type: "session"
            });
        },
        setChildMenus(state, childMenus) {
            state.childMenus = childMenus;
            setStore({
                name: "child_menus",
                content: state.childMenus,
                type: "session"
            });
        }
    },
    actions: {
        async getMenu({ commit }) {
            const res = await getMenuAll();
            if (res) {
                const sortBy = (a, b) => {
                    if (a.showorder > b.showorder) {
                        return -1;
                    } else if (a.showorder < b.showorder) {
                        return 1;
                    } else {
                        return a.name.localeCompare(b.name);
                    }
                };
                if (res.parents && res.parents.length > 0) {
                    const parents = res.parents.sort(sortBy);
                    commit('setParentMenus', parents);
                }
                if (res.childs && res.childs.length > 0) {
                    const childs = res.childs.sort(sortBy);
                    commit('setChildMenus', childs);
                }
            }
            return res;
        },
        getViewComponent(context, path) {
            let component = path;
            console.log(component)
            if (path && path.endsWith('.html')) {
                const pathArray = path.split('/');
                const routeName = toCamelCase(pathArray[pathArray.length - 1].replace('.html', ''));
                component = upperFirst(routeName) + 'View';
            }
            return component;
        }
    },
};