All Downloads are FREE. Search and download functionalities are using the official Maven repository.

public.index.js Maven / Gradle / Ivy

There is a newer version: 1.3.0
Show newest version
/**
 * Created by PLC on 2017/8/6.
 */
String.prototype.startWith = function (str) {
    var reg = new RegExp('^' + str);
    return reg.test(this);
}

String.prototype.endWith = function (str) {
    var reg = new RegExp(str + "$");
    return reg.test(this);
}

String.prototype.replaceAll = function (str, value) {
    var regExp = new RegExp(str, 'gm');
    return this.replace(regExp, value);
}

// 菜单栏
Vue.component('menuItem', {
    name: 'menu-item',
    props: {item: {}},
    template: [
        '',
        '',
        '',
        '{{child.name}}',
        '',
        '',
        '',
    ].join(''),
    methods: {
        loadInFrame: function (child) {
        },
        loadInTab: function (child) {

        },
        loadPage: function (child) {
            openTab(child);
            loadComponent(child.url);
            // if(window.pageloadInTab) {
            //     this.loadInTab(child);
            // } else {
            //     this.loadInFrame(child);
            // }
        }
    }
})

// 定义路由
var _routes = [];
var seedRouter = new VueRouter({
    routes: _routes
});

/**
 * 打开tab页
 * @param child 菜单项
 */
function openTab(child) {
    var newTab = true;
    //查找要打开的页面是否已经打开
    for (var i = 0; i < seedMainPanel.pageTables.length; i++) {
        if (seedMainPanel.pageTables[i].id == child.id) {
            newTab = false;
            break;
        }
    }
    //如果页面未打开,则打开
    if (newTab) {
        seedMainPanel.pageTables.push({
            id: child.id,
            label: child.name,
            name: 'view' + child.id
        });
    }
    //激活对应的tab
    seedMainPanel.activeName = 'view' + child.id;//tab选中
}

/**
 * 加载组件并设置路由
 * @param url 请求url
 */
function loadComponent(url) {
    //进入首页时不执行动作
    if (url == '' || url == '/') {
        return;
    }
    var componentRoute = {};    //定义路由组件
    var jsPath = url.replace('.html', '');
    var router_path = '/' + jsPath;         //路由名称
    require([jsPath], function (o) {
        componentRoute[seedMainPanel.activeName] = o.component
        seedRouter.addRoutes([{
            path: router_path,
            components: componentRoute,
            children: o.subRoute
        }]);
        seedMainPanel.tabRouterPath[seedMainPanel.activeName] = router_path;
    });
    seedMainPanel.transition = getRandomTransition();
    seedRouter.push(router_path);
}

/**
 * 根据window.location.hash计算应该加载的url
 * @param locationHash
 * @returns {*}
 */
function buildUrlByWindowLocationHash(locationHash) {
    if ('#/' == locationHash) {
        return locationHash;
    }
    locationHash = locationHash.replace('#', '')
    if (locationHash.startWith('/')) {
        locationHash = locationHash.replace('/', '')
    }
    var url = locationHash + '.html';
    return url;
}

seedMainPanel = new Vue({
    el: '#main-panel',
    router: seedRouter,
    data: {
        menuList: {},
        collapse: false,
        // logo:'test',
        defaultActive: '1',
        pageTables: [],
        activeName: '0',
        transition: '',  //加载动画
        tabRouterPath: {}  //tab页对应的路由
    },
    computed: {
        logo: function () {
            if(this.collapse) {
                return appName_simple;
            } else {
                return appName_full;
            }
        }
    },
    methods: {
        //退出登录
        logout: function () {
            var _this = this;
            this.$confirm('确认退出吗?', '提示', {
                type: 'warning'
            }).then(
                function () {
                    // sessionStorage.removeItem('user');
                    $.get("logout", function (data,status) {
                        if(status) {
                            window.location.href = "login";
                        }
                    });
                });
        },
        getMenu: function () {
            $.get("sys/resource/findResourceTreeForLoginUser?_" + $.now(), function (o) {
                seedMainPanel.menuList = o.data[0].children;
                seedMainPanel.initPage();
            });
        },
        /**
         * 尝试根据url加载对应功能页
         */
        initPage: function () {
            //根据url加载对应页面
            var url = buildUrlByWindowLocationHash(window.location.hash);
            if (url != '/' && url != '#/') {
                var menu = this.findMenuByUrl(url);
                if (menu) {
                    openTab(menu);
                    loadComponent(url);
                    this.defaultActive = menu.id + '';   //让指定菜单置为激活状态 TODO
                } else {
                    alert("无法对输入地址进行功能定位");
                }
            }
        },
        collapseMenu: function () {
            this.collapse = !this.collapse;
        },
        /**
         * 关闭tab页
         * @param targetName
         */
        removeTab: function (targetName) {
            var active = this.activeName;
            var tabs = this.pageTables;
            if (this.activeName == targetName) {
                tabs.forEach(function (tab, index) {
                    if (tab.name == targetName) {
                        var nextTab = tabs[index + 1] || tabs[index - 1];
                        if (nextTab) {
                            active = nextTab.name;
                        }
                    }
                })
            }
            this.activeName = active;
            this.pageTables = tabs.filter(function (tab) {
                return tab.name !== targetName
            });
            if (tabs.length > 1) {
                seedRouter.push(this.tabRouterPath[this.activeName]);   //跳转页面
            } else {
                seedRouter.push('/');       //tab页面全部关闭时,路由重置
            }
        },
        findMenuByUrl: function (url) {
            var _this = this;
            var menu;
            menu = this.findMenu(_this.menuList, url);
            return menu;
        },
        findMenu: function (item, url) {
            var _this = this;
            for (var i = 0; i < item.length; i++) {
                if (item[i].types == 2) {
                    return _this.findMenu(item[i].children, url)
                } else if (item[i].types == 1 && item[i].url == url) {
                    return item[i];
                }
            }
        },
        /**
         * 点击tab时,设置动画效果,并切换路由
         * @param tab
         */
        tabClick: function (tab) {
            this.transition = getRandomTransition();
            seedRouter.push(this.tabRouterPath[this.activeName]);
        }

    },
    created: function () {
        this.getMenu();
    }

});

// 取随机动画
function getRandomTransition() {
    var all = ['el-zoom-in-top', 'el-zoom-in-center', 'el-zoom-in-bottom'];
    var i = getRandomNum(0, 2);
    return all[i];
}

/**
 * 取随机数
 * @param Min 最小值
 * @param Max 最大值
 * @returns {*}
 * @constructor
 */
function getRandomNum(Min, Max) {
    var range = Max - Min + 1;
    var rand = Math.random();
    var num = rand * range + Min;
    var randInt = parseInt(num, 10);
    return randInt;
}




© 2015 - 2024 Weber Informatics LLC | Privacy Policy