1

lzhe

2024-03-24 16ac09ee67d196fef8f4bff6189e7f7ff1011b4b

1

 public/img/initiallong.b9495273.png

 src/layout/components/tags.vue

@@ -1,7 +1,8 @@
<template>
    <div class="adminui-tags">
        <ul ref="tags">
            <li v-for="tag in tagList" v-bind:key="tag" :class="[isActive(tag)?'active':'',tag.meta.affix?'affix':'' ]" @contextmenu.prevent="openContextMenu($event, tag)">
            <li v-for="tag in tagList" v-bind:key="tag" :class="[isActive(tag)?'active':'',tag.meta.affix?'affix':'' ]">
                <!-- 右键  @contextmenu.prevent="openContextMenu($event, tag)" -->
                <router-link :to="tag">
                <span>{{ tag.meta.title }}</span>
                <el-icon v-if="!tag.meta.affix" @click.prevent.stop='closeSelectedTag(tag)'><el-icon-close/></el-icon>

 src/layout/components/topbar.vue

@@ -1,6 +1,7 @@
<template>
    <div class="adminui-topbar">
        <div class="left-panel">
        <!-- 面包屑 -->
        <!-- <div class="left-panel">
            <el-breadcrumb separator-icon="el-icon-arrow-right" class="hidden-sm-and-down">
                <transition-group name="breadcrumb">
                    <template v-for="item in breadList" :key="item.title" >
@@ -8,7 +9,7 @@
                    </template>
                </transition-group>
            </el-breadcrumb>
        </div>
        </div> -->
        <div class="center-panel"></div>
        <div class="right-panel">
            <slot></slot>

 src/layout/components/userbar.vue

@@ -1,16 +1,16 @@
<template>
    <div class="user-bar">
        <div class="panel-item hidden-sm-and-down" @click="search">
        <!-- <div class="panel-item hidden-sm-and-down" @click="search">
            <el-icon><el-icon-search /></el-icon>
        </div>
        </div> -->
        <div class="screen panel-item hidden-sm-and-down" @click="screen">
            <el-icon><el-icon-full-screen /></el-icon>
        </div>
        <div class="tasks panel-item" @click="tasks">
        <!-- <div class="tasks panel-item" @click="tasks">
            <el-icon><el-icon-sort /></el-icon>
        </div>
        </div> -->
        <div class="msg panel-item" @click="showMsg">
            <el-badge :hidden="msgList.length==0" :value="msgList.length" class="badge" type="danger">
            <el-badge :hidden="msgList.length==0" :value="msgList.length" class="badge newbadge" type="danger">
                <el-icon><el-icon-chat-dot-round /></el-icon>
            </el-badge>
            <el-drawer title="新消息" v-model="msg" :size="400" append-to-body destroy-on-close>
@@ -21,7 +21,7 @@
                                <li v-for="item in msgList" v-bind:key="item.id">
                                    <a :href="item.link" target="_blank">
                                        <div class="msg-list__icon">
                                            <el-badge is-dot type="danger">
                                            <el-badge is-dot type="danger" calss="newbadge">
                                                <el-avatar :size="40" :src="item.avatar"></el-avatar>
                                            </el-badge>
                                        </div>
@@ -186,7 +186,7 @@

<style scoped>
    .user-bar {display: flex;align-items: center;height: 100%;}
    .user-bar .panel-item {padding: 0 10px;cursor: pointer;height: 100%;display: flex;align-items: center;}
    .user-bar .panel-item {padding: 0 0 0 10px;cursor: pointer;height: 100%;display: flex;align-items: center;}
    .user-bar .panel-item i {font-size: 16px;}
    .user-bar .panel-item:hover {background: rgba(0, 0, 0, 0.1);}
    .user-bar .user-avatar {height:49px;display: flex;align-items: center;}
@@ -204,4 +204,5 @@
    .dark .msg-list__main h2 {color: #d0d0d0;}
    .dark .msg-list li {border-top:1px solid #363636;}
    .dark .msg-list li a:hover {background: #383838;}
    .newbadge /deep/ .el-badge__content{top: 13px;}
</style>

 src/layout/index.vue

@@ -128,6 +128,21 @@

    <!-- 默认布局 -->
    <template v-else>
        <div class="adminui-top-header">
            <div class="adminui-topheader-left">
                <img src="/img/initiallong.b9495273.png" class="img" style="width: 180px; height: 40px;">
            </div>
            <div class="adminui-topheader-main">
                <div>
                    <Tags v-if="!ismobile && layoutTags"></Tags>
                </div>
            </div>
            <div class="adminui-topheader-right">
                <Topbar>
                    <userbar></userbar>
                </Topbar>
            </div>
        </div>
        <section class="aminui-wrapper">
            <div v-if="!ismobile" class="aminui-side-split">
                <div class="aminui-side-split-top">
@@ -153,21 +168,17 @@
                </div>
                <div class="adminui-side-scroll">
                    <el-scrollbar>
                        <el-menu :default-active="active" router :collapse="menuIsCollapse" :unique-opened="$CONFIG.MENU_UNIQUE_OPENED">
                        <el-menu :default-active="active" router :collapse="menuIsCollapse" :unique-opened="$CONFIG.MENU_UNIQUE_OPENED" class="adminui-side-scrolul">
                            <NavMenu :navMenus="nextMenu"></NavMenu>
                        </el-menu>
                    </el-scrollbar>
                </div>
                <div class="adminui-side-bottom" @click="$store.commit('TOGGLE_menuIsCollapse')">
                <!-- <div class="adminui-side-bottom" @click="$store.commit('TOGGLE_menuIsCollapse')">
                    <el-icon><el-icon-expand v-if="menuIsCollapse"/><el-icon-fold v-else /></el-icon>
                </div>
                </div> -->
            </div>
            <Side-m v-if="ismobile"></Side-m>
            <div class="aminui-body el-container">
                <Topbar>
                    <userbar></userbar>
                </Topbar>
                <Tags v-if="!ismobile && layoutTags"></Tags>
                <div class="adminui-main" id="adminui-main">
                    <router-view v-slot="{ Component }">
                        <keep-alive :include="this.$store.state.keepAlive.keepLiveRoute">

 src/style/app.scss

@@ -24,8 +24,14 @@
.layout-setting i {font-size: 18px;color: #fff;}

/* 头部 */
.adminui-top-header {height: 56px;width: 100%;background: #fff;display: flex;box-shadow: 0 1px 2px 0 rgba(0,0,0,.15);color: rgba(0,0,0,.65);font-size: 28px;justify-content: space-between;}
.adminui-topheader-left {width: 240px;min-width: 240px;display: flex;align-items: center;height:  100%;justify-content: center;display: flex;align-items: center;background-color:rgb(3, 48, 45);}
.adminui-topheader-main {width: calc(100% - 360px);background: #fff;height: 100%;display: flex;align-items: center;overflow: hidden;padding-right: 8px;border-bottom: 1px solid #e6e6e6;}
.adminui-topheader-main > div {box-shadow: inset 0 0 3px 2px hsla(0,0%,39.2%,.1);background: #f0f0f0;}
.adminui-topheader-right {width: 165px;}


.adminui-header {height: 58px;background: #222b45;color: #fff;display: flex;justify-content:space-between;}
.adminui-header-left {display: flex;align-items: center;padding-left:20px;}
.adminui-header-right {display: flex;align-items: center;}
.adminui-header .logo-bar {font-size: 20px;font-weight: bold;display: flex;align-items: center;}
.adminui-header .logo-bar .logo {margin-right: 10px;width: 35px;height: 35px;}
@@ -54,10 +60,13 @@
.adminui-side-split-scroll::-webkit-scrollbar-track {background-color: rgba(255, 255, 255, 0);}
.adminui-side-split-scroll::-webkit-scrollbar-track:hover {background-color: rgba(255, 255, 255, 0);}

.aminui-side {display: flex;flex-flow: column;flex-shrink:0;width:210px;background: #fff;box-shadow: 2px 0 8px 0 rgba(29,35,41,.05);border-right: 1px solid #e6e6e6;transition:width 0.3s;}
.aminui-side {display: flex;flex-flow: column;flex-shrink:0;width:176px;background: #316e6e;box-shadow: 2px 0 8px 0 rgba(29,35,41,.05);border-right: 1px solid #e6e6e6;transition:width 0.3s;}
.adminui-side-top {border-bottom: 1px solid #ebeef5;height:50px;line-height: 50px;}
.adminui-side-top h2 {padding:0 20px;font-size: 17px;color: #3c4a54;}
.adminui-side-scroll {overflow: auto;overflow-x:hidden;flex: 1;}
.adminui-side-top h2 {padding:0 20px;font-size: 17px;color: #fff;}
.adminui-side-scroll {overflow: auto;overflow-x:hidden;flex: 1;background-color: #315655;}
.adminui-side-scrolul {background-color: #315655;}
.adminui-side-scrolul .el-menu-item ,.adminui-side-scrolul .el-sub-menu__title{color: #fff;}
.adminui-side-scrolul .el-menu-item:hover,.adminui-side-scrolul .el-sub-menu__title:hover{background-color: #316e6e;}
.adminui-side-bottom {border-top: 1px solid #ebeef5;height:51px;cursor: pointer;display: flex;align-items: center;justify-content: center;}
.adminui-side-bottom i {font-size: 16px;}
.adminui-side-bottom:hover {color: var(--el-color-primary);}
@@ -69,23 +78,23 @@
/* 右侧内容 */
.aminui-body {flex: 1;display: flex;flex-flow: column;}

.adminui-topbar {height: 50px;border-bottom: 1px solid #ebeef5;background: #fff;box-shadow: 0 1px 4px rgba(0,21,41,.08);display: flex;justify-content:space-between;}
.adminui-topbar {height: 56px;border-bottom: 1px solid #ebeef5;background: #fff;box-shadow: 0 1px 4px rgba(0,21,41,.08);display: flex;justify-content:space-between;}
.adminui-topbar .left-panel {display: flex;align-items: center;}
.adminui-topbar .right-panel {display: flex;align-items: center;}

.right-panel-search {display: flex;align-items: center;}
.right-panel-search > * + * {margin-left:10px;}

.adminui-tags {height:35px;background: #fff;border-bottom: 1px solid #e6e6e6;}
.adminui-tags {height:56px;background: #fff;}
.adminui-tags ul {display: flex;overflow: hidden;}
.adminui-tags li {cursor: pointer;display: inline-block;float: left;height:34px;line-height: 34px;position: relative;flex-shrink: 0;}
.adminui-tags li {cursor: pointer;display: inline-block;float: left;height:56px;line-height: 56px;position: relative;flex-shrink: 0;font-size: 15px;font-weight: 400;color: rgb(50, 125, 125);}
.adminui-tags li::after {content: " ";width:1px;height:100%;position: absolute;right:0px;background-image: linear-gradient(#fff, #e6e6e6);}
.adminui-tags li a {display: inline-block;padding:0 10px;width:100%;height:100%;color: #999;text-decoration:none;display: flex;align-items: center;}
.adminui-tags li a {display: inline-block;padding:0 10px;width:100%;height:100%;color: rgb(102, 102, 102);text-decoration:none;display: flex;align-items: center;}
.adminui-tags li i {margin-left:10px;border-radius: 3px;width:18px;height:18px;display: flex;align-items: center;justify-content: center;}
.adminui-tags li i:hover {background: rgba(0,0,0,.2);color: #fff;}
.adminui-tags li:hover {background: #ecf5ff;}
.adminui-tags li.active {background: #409EFF;}
.adminui-tags li.active a {color: #fff;}
.adminui-tags li:hover {background: #f8f6f6;}
.adminui-tags li.active {background: rgb(248, 246, 246);}
.adminui-tags li.active a {color: rgb(50, 125, 125);font-weight: bold;}
.adminui-tags li.sortable-ghost {opacity: 0;}

.adminui-main {overflow: auto;background-color: #f6f8f9;flex: 1;}

 src/style/dark.scss

@@ -26,7 +26,7 @@
    .adminui-topbar, .adminui-tags {background: var(--el-bg-color-overlay);border-color: var(--el-border-color-light);}
    .adminui-main {background: var(--el-bg-color);}
    .drawerBG {background: var(--el-bg-color);}
    .adminui-header-menu .el-menu {--el-menu-bg-color:var(--el-bg-color-overlay) !important;--el-menu-hover-bg-color: #171819 !important;}
    .adminui-header-menu .el-menu {--el-menu-bg-color:#316e6e !important;--el-menu-hover-bg-color: #171819 !important;}
    .adminui-header-menu .el-menu .el-sub-menu__title {background-color:transparent !important;}

    //全局滚动条样式

 src/style/fix.scss

@@ -71,8 +71,8 @@
.el-sub-menu .el-sub-menu__icon-arrow {font-size: 12px;}

.aminui-side-split li.active {background-color: var(--el-color-primary);}
.adminui-tags li:hover {background-color: var(--el-color-primary-light-9);}
.adminui-tags li.active {background-color: var(--el-color-primary)!important;}
.adminui-tags li:hover {background: #f8f6f6;}
.adminui-tags li.active {background: rgb(248, 246, 246)!important;}
.contextmenu li:hover {background-color: var(--el-color-primary-light-9)!important;color: var(--el-color-primary-light-2)!important;}
.data-box .item-background {background-color: var(--el-color-primary)!important;}
.layout-setting,.diy-grid-setting {background-color: var(--el-color-primary)!important;}

 src/utils/request.js

@@ -140,6 +140,7 @@
     */
     postJ: function(url, data={}, config={}) {
        return new Promise((resolve, reject) => {
            console.log(qsStringify(data))
            axios({
                method: 'post',
                url: url,

 src/utils/tool.js

@@ -218,4 +218,15 @@
    }
}

tool.qsStringify = function(obj) {
    return Object.keys(obj).map(key => {
      if (Array.isArray(obj[key])) {
        return obj[key]
          .map(arrayValue => `${encodeURIComponent(key)}=${encodeURIComponent(arrayValue)}`)
          .join('&');
      }
      return `${encodeURIComponent(key)}=${encodeURIComponent(obj[key])}`;
      }).join('&');
}

export default tool

 src/views/home/widgets/index.vue

@@ -3,7 +3,7 @@
        <div class="widgets-content">
            <div class="widgets-top">
                <div class="widgets-top-title">
                    控制台
                    工作台
                </div>
                <div class="widgets-top-actions">
                    <el-button v-if="customizing" type="primary" icon="el-icon-check" round @click="save">完成</el-button>

 src/views/login/components/passwordForm.vue

@@ -49,6 +49,18 @@
            //this.$HTTP.get('/api/blade-sync/outer-app-config/appStatus')
        },
        methods: {
            // qsStringify(obj) {
            //   return Object.keys(obj)
            //     .map(key => {
            //       if (Array.isArray(obj[key])) {
            //         return obj[key]
            //           .map(arrayValue => `${encodeURIComponent(key)}=${encodeURIComponent(arrayValue)}`)
            //           .join('&');
            //       }
            //       return `${encodeURIComponent(key)}=${encodeURIComponent(obj[key])}`;
            //     })
            //     .join('&');
            // },
            async login(){
                var validate = await this.$refs.loginForm.validate().catch(()=>{})
                if(!validate){ return false }
@@ -61,40 +73,7 @@
                    grant_type: "password",
                    scope: "all"
                }
                //获取菜单
                // var menu = null
                // if(this.form.user == 'admin'){
                //     menu = await this.$API.system.menu.myMenus.get()
                // }else{
                //     menu = await this.$API.demo.menu.get()
                // }
                // if(menu.code == 200){
                //     if(menu.data.menu.length==0){
                //         this.islogin = false
                //         this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
                //             type: 'error',
                //             center: true
                //         })
                //         return false
                //     }
                //     this.$TOOL.data.set("MENU", menu.data.menu)
                //     this.$TOOL.data.set("PERMISSIONS", menu.data.permissions)
                //     this.$TOOL.data.set("DASHBOARDGRID", menu.data.dashboardGrid)
                // }else{
                //     this.islogin = false
                //     this.$message.warning(menu.message)
                //     return false
                // }

                // this.$router.replace({
                //     path: '/'
                // })
                // this.$message.success("Login Success 登录成功")
                // this.islogin = false



                await this.$HTTP.postJ("/api/blade-auth/oauth/token",data).then(res=> {
                await this.$HTTP.postJ("/api/blade-auth/oauth/token?" + this.$TOOL.qsStringify(data)).then(res=> {
                    if(res.user_id) {
                        //获取token
                        this.$TOOL.cookie.set("TOKEN", res.access_token, {
@@ -105,11 +84,8 @@
                        res.dashboard = "0";
                        res.userId =  "1";
                        this.$TOOL.data.set("USER_INFO", res);
                        //获取菜单
						
						
                    }else {
                        this.islogin = false;
                    }else {
                        this.$message({
                          showClose: true,
                          message: res.error_description,
@@ -117,27 +93,29 @@
                        });
                    }
                })
                await this.$HTTP.postJ("/api/blade-system/menu/routes?" + this.$TOOL.qsStringify({"appCode": "CPS"})).then(res=> {
                    console.log(res,1111)
                })
                await this.$API.system.menu.myMenus.get().then(resp=> {
                            console.log('>>>>>>')
                            if(resp.data.menu.length==0){
                                this.islogin = false
                                this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
                                    type: 'error',
                                    center: true
                                })
                                return false
                            }
                            this.$TOOL.data.set("MENU", resp.data.menu)
                            this.$TOOL.data.set("PERMISSIONS", resp.data.permissions)
                            this.$TOOL.data.set("DASHBOARDGRID", resp.data.dashboardGrid)

                        });
                        this.$router.replace({
                            path: '/'
                        })
                        this.$message.success("Login Success 登录成功")
                    if(resp.data.menu.length==0){
                        console.log(resp,2222)
                        this.islogin = false
            },
                        this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
                            type: 'error',
                            center: true
                        })
                        return false
                    }
                    this.$TOOL.data.set("MENU", resp.data.menu)
                    this.$TOOL.data.set("PERMISSIONS", resp.data.permissions)
                    this.$TOOL.data.set("DASHBOARDGRID", resp.data.dashboardGrid)
                });
                this.$router.replace({
                    path: '/'
                })
                this.$message.success("Login Success 登录成功")
                this.islogin = false;
            }
        }
    }
</script>