代码优化

This commit is contained in:
BianLzhaoMin 2024-09-20 17:39:26 +08:00
parent 5801485f1b
commit 5dd2e64dc1
9 changed files with 341 additions and 206 deletions

View File

@ -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",

View File

@ -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

View File

@ -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()
}) })

View File

@ -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,
}) })

View File

@ -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()

View File

@ -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>

View File

@ -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>