bmfe-vue2-base/src/js/store/common/modules/navbar.js

BM 后台系统基础框架

/**
* @Author: songqi
* @Date:   2017-01-16
* @Last modified by:   songqi
* @Last modified time: 2017-02-21
*/

import _isString from 'lodash/isString';

import {
    get as storageGet,
    set as storageSet
} from 'Utils/globalContext';

import {
    HREFTAG,
    PATH
} from 'Config/config';

const state = {
    navTree: [],
    navBarList: [],
    breadcrumb: [],
    navbarShowed: true
}

const getters = {
    COMMON_NAVBAR_navTree: state => state.navTree,
    COMMON_NAVBAR_breadcrumb: state => state.breadcrumb,
    COMMON_NAVBAR_navbarShowed: state => state.navbarShowed
}


const getDefaultBreadcrumb = (navBarList, path) => {
    var _breadcrumb = [];
    navBarList.map(function(item){
        if(item.href === path.slice(0, item.href.length)){
            _breadcrumb.push({
                name: item.name,
                href: item.routeHref
            });
        }
    });
    return _breadcrumb;
}

const mutations = {
    COMMON_SET_navbar(state, datas){
        var dataMap = {},
            navTree = [];
        state.navBarList = datas;
        datas.map(function(item){
            if(!dataMap[item.id]){
                dataMap[item.id] = item;
            }
            if(!item.parentId){
                navTree.push(item);
            }
        });
        datas.map(function(item){
            if(item.parentId && dataMap[item.parentId]){
                if(!dataMap[item.parentId]['children']){
                    dataMap[item.parentId]['children'] = [];
                }

                if (item['showType'] === 'MENU') {
                    dataMap[item.parentId]['children'].push(item);
                }

                if(dataMap[item.parentId]['children'] && !dataMap[item.parentId]['children'].length) {
                    dataMap[item.parentId]['children'] = undefined;
                }
            }
        });

        for(var i in dataMap){
            var item = dataMap[i];
            if(item.children){
                item.routeHref = 'javascript:;'
            }else{
                if(item.path === PATH){
                    item.routeHref = HREFTAG + item.href;
                }else{
                    item.routeHref = item.path + HREFTAG + item.href;
                }
            }
        }
        state.navTree = navTree;
    },

    COMMON_SET_breadcrumb(state, { type, data, route }){
        // 如果 navBarList 不存在则直接返回
        if(!state.navBarList.length){
            return;
        }
        var path = route.path,
            _breadcrumb = storageGet('breadcrumb') || [];
        // 初始化进入，一般认为是刷新，或者从 url 里输入
        if(type === 'init'){
            let lastBreadcrumb = _breadcrumb[_breadcrumb.length - 1];
            // 判断是否为刷新，刷新则直接从页面 localstorage 中取出来
            if(lastBreadcrumb && HREFTAG + path === lastBreadcrumb.href){
                state.breadcrumb = _breadcrumb;
            // 其他的全部从path匹配菜单
            }else{
                state.breadcrumb = getDefaultBreadcrumb(state.navBarList, path);
            }
        }else if(type === 'pathChange'){
            let backBreadcrumb = _breadcrumb[_breadcrumb.length - 2];
            // 判断是否为返回
            if(backBreadcrumb && HREFTAG + path === backBreadcrumb.href){
                state.breadcrumb = _breadcrumb.slice(0, _breadcrumb.length - 1);
            // 其他的全部从path匹配菜单
            }else{
                state.breadcrumb = getDefaultBreadcrumb(state.navBarList, path);
            }
        // 额外手工 push 数据
        }else if(type === 'push'){
            if(_isString(data)){
                data = {
                    name: data,
                    href: HREFTAG + path
                }
            }
            state.breadcrumb.push(data);
        }
        storageSet('breadcrumb', state.breadcrumb);
    },

    COMMON_TOGGLE_navbarShowed(state){
        state.navbarShowed = !state.navbarShowed;
    }
}

export default {
    state,
    getters,
    mutations
}