代码优化
This commit is contained in:
parent
5801485f1b
commit
5dd2e64dc1
|
|
@ -62,6 +62,7 @@
|
||||||
"vue-count-to": "1.0.13",
|
"vue-count-to": "1.0.13",
|
||||||
"vue-cropper": "0.5.5",
|
"vue-cropper": "0.5.5",
|
||||||
"vue-easy-print": "0.0.8",
|
"vue-easy-print": "0.0.8",
|
||||||
|
"vue-grid-layout": "^2.4.0",
|
||||||
"vue-json-excel": "^0.3.0",
|
"vue-json-excel": "^0.3.0",
|
||||||
"vue-meta": "2.4.0",
|
"vue-meta": "2.4.0",
|
||||||
"vue-router": "3.4.9",
|
"vue-router": "3.4.9",
|
||||||
|
|
|
||||||
|
|
@ -73,9 +73,8 @@ export default {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style scoped >
|
<style scoped>
|
||||||
#app .theme-picker {
|
#app .theme-picker {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1.7 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
|
|
@ -8,49 +8,59 @@ import { isRelogin } from '@/utils/request'
|
||||||
|
|
||||||
NProgress.configure({ showSpinner: false })
|
NProgress.configure({ showSpinner: false })
|
||||||
|
|
||||||
const whiteList = ['/login', '/register', '/auth/sendCode', '/qrCode/qrCodePage']
|
const whiteList = [
|
||||||
|
'/login',
|
||||||
|
'/register',
|
||||||
|
'/auth/sendCode',
|
||||||
|
'/qrCode/qrCodePage',
|
||||||
|
]
|
||||||
|
|
||||||
router.beforeEach((to, from, next) => {
|
router.beforeEach((to, from, next) => {
|
||||||
NProgress.start()
|
NProgress.start()
|
||||||
if (getToken()) {
|
if (getToken()) {
|
||||||
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
||||||
/* has token*/
|
/* has token*/
|
||||||
if (to.path === '/login') {
|
if (to.path === '/login') {
|
||||||
next({ path: '/' })
|
next({ path: '/' })
|
||||||
NProgress.done()
|
NProgress.done()
|
||||||
|
} else {
|
||||||
|
if (store.getters.roles.length === 0) {
|
||||||
|
isRelogin.show = true
|
||||||
|
// 判断当前用户是否已拉取完user_info信息
|
||||||
|
store
|
||||||
|
.dispatch('GetInfo')
|
||||||
|
.then(() => {
|
||||||
|
isRelogin.show = false
|
||||||
|
store
|
||||||
|
.dispatch('GenerateRoutes')
|
||||||
|
.then((accessRoutes) => {
|
||||||
|
// 根据roles权限生成可访问的路由表
|
||||||
|
router.addRoutes(accessRoutes) // 动态添加可访问路由表
|
||||||
|
next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
store.dispatch('LogOut').then(() => {
|
||||||
|
Message.error(err)
|
||||||
|
next({ path: '/login' })
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
next()
|
||||||
|
}
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
if (store.getters.roles.length === 0) {
|
// 没有token
|
||||||
isRelogin.show = true
|
if (whiteList.indexOf(to.path) !== -1) {
|
||||||
// 判断当前用户是否已拉取完user_info信息
|
// 在免登录白名单,直接进入
|
||||||
store.dispatch('GetInfo').then(() => {
|
next()
|
||||||
isRelogin.show = false
|
} else {
|
||||||
store.dispatch('GenerateRoutes').then(accessRoutes => {
|
next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
|
||||||
// 根据roles权限生成可访问的路由表
|
NProgress.done()
|
||||||
router.addRoutes(accessRoutes) // 动态添加可访问路由表
|
}
|
||||||
next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
|
|
||||||
})
|
|
||||||
}).catch(err => {
|
|
||||||
store.dispatch('LogOut').then(() => {
|
|
||||||
Message.error(err)
|
|
||||||
next({ path: '/login' })
|
|
||||||
})
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
next()
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
} else {
|
|
||||||
// 没有token
|
|
||||||
if (whiteList.indexOf(to.path) !== -1) {
|
|
||||||
// 在免登录白名单,直接进入
|
|
||||||
next()
|
|
||||||
} else {
|
|
||||||
next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
|
|
||||||
NProgress.done()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
router.afterEach(() => {
|
router.afterEach(() => {
|
||||||
NProgress.done()
|
NProgress.done()
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -30,184 +30,187 @@ import Layout from '@/layout'
|
||||||
|
|
||||||
// 公共路由
|
// 公共路由
|
||||||
export const constantRoutes = [
|
export const constantRoutes = [
|
||||||
{
|
{
|
||||||
path: '/redirect',
|
path: '/redirect',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
hidden: true,
|
hidden: true,
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: '/redirect/:path(.*)',
|
path: '/redirect/:path(.*)',
|
||||||
component: () => import('@/views/redirect')
|
component: () => import('@/views/redirect'),
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/login',
|
path: '/login',
|
||||||
component: () => import('@/views/newLogin.vue'),
|
component: () => import('@/views/newLogin.vue'),
|
||||||
hidden: true
|
hidden: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/register',
|
path: '/register',
|
||||||
component: () => import('@/views/register'),
|
component: () => import('@/views/register'),
|
||||||
hidden: true
|
hidden: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/404',
|
path: '/404',
|
||||||
component: () => import('@/views/error/404'),
|
component: () => import('@/views/error/404'),
|
||||||
hidden: true
|
hidden: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/401',
|
path: '/401',
|
||||||
component: () => import('@/views/error/401'),
|
component: () => import('@/views/error/401'),
|
||||||
hidden: true
|
hidden: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/demo',
|
path: '/screen',
|
||||||
component: () => import('@/views/demo.vue'),
|
component: () => import('@/views/screen'),
|
||||||
hidden: true
|
hidden: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
redirect: 'index',
|
redirect: 'index',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'index',
|
path: 'index',
|
||||||
component: () => import('@/views/index'),
|
component: () => import('@/views/index'),
|
||||||
name: 'Index',
|
name: 'Index',
|
||||||
meta: { title: '首页', icon: 'dashboard', affix: true }
|
meta: { title: '首页', icon: 'dashboard', affix: true },
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/dashboard',
|
path: '/dashboard',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
redirect: 'dashboard',
|
redirect: 'dashboard',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'dashboard',
|
path: 'dashboard',
|
||||||
component: () => import('@/views/dashboard'),
|
component: () => import('@/views/dashboard'),
|
||||||
name: 'Dashboard',
|
name: 'Dashboard',
|
||||||
meta: { title: '数据大屏', icon: 'dashboard', breadcrumb: false }
|
meta: {
|
||||||
}
|
title: '数据大屏',
|
||||||
]
|
icon: 'dashboard',
|
||||||
},
|
breadcrumb: false,
|
||||||
{
|
},
|
||||||
path: '/user',
|
},
|
||||||
component: Layout,
|
],
|
||||||
hidden: true,
|
},
|
||||||
redirect: 'noredirect',
|
{
|
||||||
children: [
|
path: '/user',
|
||||||
{
|
component: Layout,
|
||||||
path: 'profile',
|
hidden: true,
|
||||||
component: () => import('@/views/system/user/profile/index'),
|
redirect: 'noredirect',
|
||||||
name: 'Profile',
|
children: [
|
||||||
meta: { title: '个人中心', icon: 'user' }
|
{
|
||||||
}
|
path: 'profile',
|
||||||
]
|
component: () => import('@/views/system/user/profile/index'),
|
||||||
},
|
name: 'Profile',
|
||||||
{
|
meta: { title: '个人中心', icon: 'user' },
|
||||||
path: '/qrCode/qrCodePage',
|
},
|
||||||
component: () => import('@/views/qrCode/qrCode'),
|
],
|
||||||
hidden: true
|
},
|
||||||
},
|
{
|
||||||
{
|
path: '/qrCode/qrCodePage',
|
||||||
path: '/resetPassword',
|
component: () => import('@/views/qrCode/qrCode'),
|
||||||
component: () => import('@/views/resetPassword'),
|
hidden: true,
|
||||||
hidden: true
|
},
|
||||||
},
|
{
|
||||||
|
path: '/resetPassword',
|
||||||
|
component: () => import('@/views/resetPassword'),
|
||||||
|
hidden: true,
|
||||||
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
// 动态路由,基于用户权限动态去加载
|
// 动态路由,基于用户权限动态去加载
|
||||||
export const dynamicRoutes = [
|
export const dynamicRoutes = [
|
||||||
{
|
{
|
||||||
path: '/system/user-auth',
|
path: '/system/user-auth',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
hidden: true,
|
hidden: true,
|
||||||
permissions: ['system:user:edit'],
|
permissions: ['system:user:edit'],
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'role/:userId(\\d+)',
|
path: 'role/:userId(\\d+)',
|
||||||
component: () => import('@/views/system/user/authRole'),
|
component: () => import('@/views/system/user/authRole'),
|
||||||
name: 'AuthRole',
|
name: 'AuthRole',
|
||||||
meta: { title: '分配角色', activeMenu: '/system/user' }
|
meta: { title: '分配角色', activeMenu: '/system/user' },
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/system/role-auth',
|
path: '/system/role-auth',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
hidden: true,
|
hidden: true,
|
||||||
permissions: ['system:role:edit'],
|
permissions: ['system:role:edit'],
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'user/:roleId(\\d+)',
|
path: 'user/:roleId(\\d+)',
|
||||||
component: () => import('@/views/system/role/authUser'),
|
component: () => import('@/views/system/role/authUser'),
|
||||||
name: 'AuthUser',
|
name: 'AuthUser',
|
||||||
meta: { title: '分配用户', activeMenu: '/system/role' }
|
meta: { title: '分配用户', activeMenu: '/system/role' },
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/system/dict-data',
|
path: '/system/dict-data',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
hidden: true,
|
hidden: true,
|
||||||
permissions: ['system:dict:list'],
|
permissions: ['system:dict:list'],
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'index/:dictId(\\d+)',
|
path: 'index/:dictId(\\d+)',
|
||||||
component: () => import('@/views/system/dict/data'),
|
component: () => import('@/views/system/dict/data'),
|
||||||
name: 'Data',
|
name: 'Data',
|
||||||
meta: { title: '字典数据', activeMenu: '/system/dict' }
|
meta: { title: '字典数据', activeMenu: '/system/dict' },
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/monitor/job-log',
|
path: '/monitor/job-log',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
hidden: true,
|
hidden: true,
|
||||||
permissions: ['monitor:job:list'],
|
permissions: ['monitor:job:list'],
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'index/:jobId(\\d+)',
|
path: 'index/:jobId(\\d+)',
|
||||||
component: () => import('@/views/monitor/job/log'),
|
component: () => import('@/views/monitor/job/log'),
|
||||||
name: 'JobLog',
|
name: 'JobLog',
|
||||||
meta: { title: '调度日志', activeMenu: '/monitor/job' }
|
meta: { title: '调度日志', activeMenu: '/monitor/job' },
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/tool/gen-edit',
|
path: '/tool/gen-edit',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
hidden: true,
|
hidden: true,
|
||||||
permissions: ['tool:gen:edit'],
|
permissions: ['tool:gen:edit'],
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'index/:tableId(\\d+)',
|
path: 'index/:tableId(\\d+)',
|
||||||
component: () => import('@/views/tool/gen/editTable'),
|
component: () => import('@/views/tool/gen/editTable'),
|
||||||
name: 'GenEdit',
|
name: 'GenEdit',
|
||||||
meta: { title: '修改生成配置', activeMenu: '/tool/gen' }
|
meta: { title: '修改生成配置', activeMenu: '/tool/gen' },
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
}
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
// 防止连续点击多次路由报错
|
// 防止连续点击多次路由报错
|
||||||
let routerPush = Router.prototype.push;
|
let routerPush = Router.prototype.push
|
||||||
let routerReplace = Router.prototype.replace;
|
let routerReplace = Router.prototype.replace
|
||||||
// push
|
// push
|
||||||
Router.prototype.push = function push(location) {
|
Router.prototype.push = function push(location) {
|
||||||
return routerPush.call(this, location).catch(err => err)
|
return routerPush.call(this, location).catch((err) => err)
|
||||||
}
|
}
|
||||||
// replace
|
// replace
|
||||||
Router.prototype.replace = function push(location) {
|
Router.prototype.replace = function push(location) {
|
||||||
return routerReplace.call(this, location).catch(err => err)
|
return routerReplace.call(this, location).catch((err) => err)
|
||||||
}
|
}
|
||||||
|
|
||||||
export default new Router({
|
export default new Router({
|
||||||
// base:'/gl/',
|
// base:'/gl/',
|
||||||
mode: 'history', // 去掉url中的#
|
mode: 'history', // 去掉url中的#
|
||||||
scrollBehavior: () => ({ y: 0 }),
|
scrollBehavior: () => ({ y: 0 }),
|
||||||
routes: constantRoutes,
|
routes: constantRoutes,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -271,7 +271,7 @@ export default {
|
||||||
|
|
||||||
/* 确定或取消按钮触发的自定义事件 */
|
/* 确定或取消按钮触发的自定义事件 */
|
||||||
async closeDepartSel(val, list) {
|
async closeDepartSel(val, list) {
|
||||||
// val === 0 取消 ===1 为确定
|
// val === 0 取消 === 1 为确定
|
||||||
if (val === 0) {
|
if (val === 0) {
|
||||||
this.dialogConfig.outerVisible = false
|
this.dialogConfig.outerVisible = false
|
||||||
this.$refs.listingTbRef.getList()
|
this.$refs.listingTbRef.getList()
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,29 @@
|
||||||
|
<template>
|
||||||
|
<div class="item-one">
|
||||||
|
<div class="title"> 领料数据 </div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.item-one {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
// background-color: pink;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
background: url('../../../assets/images/title_left.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
height: 38px;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-left: 28px;
|
||||||
|
font-size: 20px;
|
||||||
|
font-family: Alibaba PuHuiTi, Alibaba PuHuiTi;
|
||||||
|
font-weight: blod;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,93 @@
|
||||||
|
<template>
|
||||||
|
<!-- 大屏 -->
|
||||||
|
<div class="screen-container">
|
||||||
|
<div class="screen-content" ref="screenContentRef">
|
||||||
|
<GridLayout
|
||||||
|
:layout.sync="layout"
|
||||||
|
:col-num="24"
|
||||||
|
:row-height="rowHeigh"
|
||||||
|
:is-draggable="false"
|
||||||
|
:is-resizable="false"
|
||||||
|
:is-mirrored="false"
|
||||||
|
:vertical-compact="true"
|
||||||
|
:margin="[5, 5]"
|
||||||
|
:use-css-transforms="true"
|
||||||
|
>
|
||||||
|
<GridItem
|
||||||
|
v-for="item in layout"
|
||||||
|
:x="item.x"
|
||||||
|
:y="item.y"
|
||||||
|
:w="item.w"
|
||||||
|
:h="item.h"
|
||||||
|
:i="item.i"
|
||||||
|
:key="item.i"
|
||||||
|
class="grid-item"
|
||||||
|
>
|
||||||
|
<component :is="item.componentsName" />
|
||||||
|
</GridItem>
|
||||||
|
</GridLayout>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import VueGridLayout from 'vue-grid-layout'
|
||||||
|
import ItemOne from './components/item-one'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
GridItem: VueGridLayout.GridItem,
|
||||||
|
GridLayout: VueGridLayout.GridLayout,
|
||||||
|
ItemOne,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
layout: [
|
||||||
|
// 第一行
|
||||||
|
{ x: 0, y: 0, w: 5, h: 8, i: 1, componentsName: 'ItemOne' },
|
||||||
|
{ x: 5, y: 0, w: 14, h: 14, i: 2 },
|
||||||
|
{ x: 19, y: 0, w: 5, h: 6, i: 3 },
|
||||||
|
|
||||||
|
// 第二行
|
||||||
|
{ x: 0, y: 1, w: 5, h: 8, i: 4 },
|
||||||
|
{ x: 5, y: 1, w: 14, h: 2, i: 5 },
|
||||||
|
{ x: 19, y: 1, w: 5, h: 5, i: 6 },
|
||||||
|
|
||||||
|
// 第三行
|
||||||
|
{ x: 0, y: 2, w: 5, h: 8, i: 7 },
|
||||||
|
{ x: 5, y: 2, w: 14, h: 8, i: 8 },
|
||||||
|
{ x: 19, y: 2, w: 5, h: 5, i: 9 },
|
||||||
|
|
||||||
|
// 第四行
|
||||||
|
{ x: 19, y: 3, w: 5, h: 8, i: 10 },
|
||||||
|
],
|
||||||
|
|
||||||
|
rowHeigh: 0,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
this.rowHeigh = (this.$refs['screenContentRef'].clientHeight - 125) / 24
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.screen-container {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
// background-color: #ccc;
|
||||||
|
background: url('../../assets/images/screenBg.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.screen-content {
|
||||||
|
width: calc(100% - 20px);
|
||||||
|
height: calc(100% - 65px);
|
||||||
|
margin: 65px auto 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-item {
|
||||||
|
border: 1px dashed #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue