focus-admin-ui

admin-ui

管理后台 ui 框架

npm i --save focus-admin-ui

引入

import VueRouter from "vue-router";
import AdminUI from "focus-admin-ui";
import Config from "./ui.config";

Vue.use(VueRouter).use(AdminUI);
const router = new VueRouter(Config.nav);

<template lang="pug">
div.app
	admin-ui(
		:config="config"
		)
		router-view
</template>
<script>
import uiConfig from './ui.config';
export default {
  data() {
     return {
       config: uiConfig
    };
  }
};
</script>

ui.config.js: 导航菜单配置

module.exports = {
    header: {
        mainUrl: "",
        siteUrl: "",
        siteName: "管理后台",
        platformUrl: ``,
        logoutUrl: ``,
        userName: ``,
        showCityUI: true // 是否展示城市
    },
    nav: [
        {
            path: "/a",
            name: "菜单",
            iconfont: "",
            component: demo1,
            meta: {
                permission: [1, 2, 8]
            },

            redirect: "/a/b",

            children: [
                {
                    path: "b",
                    name: "子菜单",
                    txt: true,
                    component: demo1
                }
            ]
        },
        {
            path: "/d",
            name: "菜单2",
            iconfont: "",
            component: demo2
        }
    ]
};