完成所有页面路由 #4

Merged
zwq merged 1 commits from zwq into master 2021-11-19 11:16:37 +08:00
18 changed files with 434 additions and 78 deletions

View File

@ -44,7 +44,23 @@ const mainRoutes = {
{ path: '/basic-cache-location', component: _import('basic/components/location'), name: 'basic-cache-location', meta: { title: '库位信息' } }, { path: '/basic-cache-location', component: _import('basic/components/location'), name: 'basic-cache-location', meta: { title: '库位信息' } },
{ path: '/basic-equipmentInfo', component: _import('basic/equipmentInfo'), name: 'basic-equipmentInfo', meta: { title: '设备基础信息' } }, { path: '/basic-equipmentInfo', component: _import('basic/equipmentInfo'), name: 'basic-equipmentInfo', meta: { title: '设备基础信息' } },
{ path: '/basic-carInfo', component: _import('basic/carInfo'), name: 'basic-carInfo', meta: { title: '车辆信息' } }, { path: '/basic-carInfo', component: _import('basic/carInfo'), name: 'basic-carInfo', meta: { title: '车辆信息' } },
{ path: '/basic-alarmInfo', component: _import('basic/alarmInfo'), name: 'basic-alarmInfo', meta: { title: '报警基础信息' } } { path: '/basic-alarmInfo', component: _import('basic/alarmInfo'), name: 'basic-alarmInfo', meta: { title: '报警基础信息' } },
{ path: '/order-current-order', component: _import('order/current-order'), name: 'order-current-order', meta: { title: '当前订单列表' } },
{ path: '/order-current-task', component: _import('order/current-task'), name: 'order-current-task', meta: { title: '当前执行任务' } },
{ path: '/report-kiln-alarm', component: _import('report/kiln-alarm'), name: 'report-kiln-alarm', meta: { title: '窑炉报警' } },
{ path: '/report-car-alarm', component: _import('report/car-alarm'), name: 'report-car-alarm', meta: { title: '车辆运行报警' } },
{ path: '/report-order-history', component: _import('report/order-history'), name: 'report-order-history', meta: { title: '订单历史列表' } },
{ path: '/report-task-history', component: _import('report/task-history'), name: 'report-task-history', meta: { title: '执行任务历史列表' } },
{ path: '/energy-sulfur-dioxide', component: _import('energy/sulfur-dioxide'), name: 'energy-sulfur-dioxide', meta: { title: '二氧化硫流量分析' } },
{ path: '/energy-electric', component: _import('energy/electric'), name: 'energy-electric', meta: { title: '用电能源分析' } },
{ path: '/energy-kiln-electric', component: _import('energy/kiln-electric'), name: 'energy-kiln-electric', meta: { title: '窑炉用电分析' } },
{ path: '/energy-ammonia', component: _import('energy/ammonia'), name: 'energy-ammonia', meta: { title: '氨气流量分析' } },
{ path: '/energy-nitrogen', component: _import('energy/nitrogen'), name: 'energy-nitrogen', meta: { title: '氮气流量分析' } },
{ path: '/energy-electric-acquisition', component: _import('energy/electric-acquisition'), name: 'energy-electric-acquisition', meta: { title: '电能采集数据' } },
{ path: '/energy-process-temperature', component: _import('energy/process-temperature'), name: 'energy-process-temperature', meta: { title: '窑炉加工温度' } },
{ path: '/energy-sump-temperature', component: _import('energy/sump-temperature'), name: 'energy-sump-temperature', meta: { title: '油槽温度' } },
{ path: '/energy-ammonia-analysis', component: _import('energy/ammonia-analysis'), name: 'energy-ammonia-analysis', meta: { title: '使用氮气分析' } },
{ path: '/energy-kiln-speed', component: _import('energy/kiln-speed'), name: 'energy-kiln-speed', meta: { title: '窑炉速度参数' } }
], ],
beforeEnter (to, from, next) { beforeEnter (to, from, next) {
let token = Vue.cookie.get('token') let token = Vue.cookie.get('token')

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:58:23
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:58:23
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:57:00
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:57:00
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:57:29
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:57:30
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:55:33
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:55:33
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:56:01
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:56:02
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:59:04
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:59:05
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:57:17
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:57:18
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:58:02
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:58:03
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:56:37
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:56:38
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:57:55
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:57:56
* @Description:
-->

View File

@ -5,35 +5,56 @@
:default-active="menuActiveName || 'home'" :default-active="menuActiveName || 'home'"
:collapse="sidebarFold" :collapse="sidebarFold"
:collapseTransition="false" :collapseTransition="false"
class="site-sidebar__menu"> class="site-sidebar__menu"
>
<el-submenu index="home"> <el-submenu index="home">
<template slot="title"> <template slot="title">
<icon-svg name="shouye" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="shouye" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title" @click="$router.push({ name: 'home' })">首页</span> <span slot="title" @click="$router.push({ name: 'home' })"
>首页</span
>
</template> </template>
<el-menu-item index="orderProcess" @click="$router.push({ name: 'orderProcess' })"> <el-menu-item
index="orderProcess"
@click="$router.push({ name: 'orderProcess' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">订单加工</span> <span slot="title">订单加工</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="exWarehouse" @click="$router.push({ name: 'exWarehouse' })"> <el-menu-item
index="exWarehouse"
@click="$router.push({ name: 'exWarehouse' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">货物出库</span> <span slot="title">货物出库</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="addProcess" @click="$router.push({ name: 'addProcess' })"> <el-menu-item
index="addProcess"
@click="$router.push({ name: 'addProcess' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">追加加工</span> <span slot="title">追加加工</span>
</el-menu-item> </el-menu-item>
</el-submenu> </el-submenu>
<el-submenu index="demo"> <el-submenu index="demo">
<template slot="title"> <template slot="title">
<icon-svg name="shoucang" class="site-sidebar__menu-icon"></icon-svg> <icon-svg
name="shoucang"
class="site-sidebar__menu-icon"
></icon-svg>
<span>demo</span> <span>demo</span>
</template> </template>
<el-menu-item index="demo-echarts" @click="$router.push({ name: 'demo-echarts' })"> <el-menu-item
index="demo-echarts"
@click="$router.push({ name: 'demo-echarts' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">echarts</span> <span slot="title">echarts</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="demo-ueditor" @click="$router.push({ name: 'demo-ueditor' })"> <el-menu-item
index="demo-ueditor"
@click="$router.push({ name: 'demo-ueditor' })"
>
<icon-svg name="editor" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="editor" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">ueditor</span> <span slot="title">ueditor</span>
</el-menu-item> </el-menu-item>
@ -43,19 +64,31 @@
<icon-svg name="bianji" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="bianji" class="site-sidebar__menu-icon"></icon-svg>
<span>基础信息</span> <span>基础信息</span>
</template> </template>
<el-menu-item index="cache" @click="$router.push({ name: 'basic-cache' })"> <el-menu-item
index="cache"
@click="$router.push({ name: 'basic-cache' })"
>
<icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">缓存区信息</span> <span slot="title">缓存区信息</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="equipmentInfo" @click="$router.push({ name: 'basic-equipmentInfo' })"> <el-menu-item
index="equipmentInfo"
@click="$router.push({ name: 'basic-equipmentInfo' })"
>
<icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">设备基础信息</span> <span slot="title">设备基础信息</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="carInfo" @click="$router.push({ name: 'basic-carInfo' })"> <el-menu-item
index="carInfo"
@click="$router.push({ name: 'basic-carInfo' })"
>
<icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">车辆信息</span> <span slot="title">车辆信息</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="alarmInfo" @click="$router.push({ name: 'basic-alarmInfo' })"> <el-menu-item
index="alarmInfo"
@click="$router.push({ name: 'basic-alarmInfo' })"
>
<icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="log" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">报警基础信息</span> <span slot="title">报警基础信息</span>
</el-menu-item> </el-menu-item>
@ -65,20 +98,191 @@
<icon-svg name="config" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="config" class="site-sidebar__menu-icon"></icon-svg>
<span>订单加工管理</span> <span>订单加工管理</span>
</template> </template>
<el-menu-item index="cache" @click="$router.push({ name: 'demo-echarts' })"> <el-menu-item
index="current-order"
@click="$router.push({ name: 'order-current-order' })"
>
<icon-svg name="job" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="job" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">当前订单列表</span> <span slot="title">当前订单列表</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="cache" @click="$router.push({ name: 'demo-echarts' })"> <el-menu-item
index="current-task"
@click="$router.push({ name: 'order-current-task' })"
>
<icon-svg name="editor" class="site-sidebar__menu-icon"></icon-svg> <icon-svg name="editor" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">当前执行任务</span> <span slot="title">当前执行任务</span>
</el-menu-item> </el-menu-item>
</el-submenu> </el-submenu>
<el-submenu index="energy">
<template slot="title">
<icon-svg name="config" class="site-sidebar__menu-icon"></icon-svg>
<span>能源管理</span>
</template>
<el-menu-item
index="electric"
@click="$router.push({ name: 'energy-electric' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">用电能源分析</span>
</el-menu-item>
<el-menu-item
index="kiln-electric"
@click="$router.push({ name: 'energy-kiln-electric' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">窑炉用电分析</span>
</el-menu-item>
<el-submenu index="kiln-gas">
<template slot="title">
<icon-svg
name="config"
class="site-sidebar__menu-icon"
></icon-svg>
<span>窑炉用气分析</span>
</template>
<el-menu-item
index="sulfur-dioxide"
@click="$router.push({ name: 'energy-sulfur-dioxide' })"
>
<icon-svg
name="tubiao"
class="site-sidebar__menu-icon"
></icon-svg>
<span slot="title">二氧化硫流量分析</span>
</el-menu-item>
<el-menu-item
index="ammonia"
@click="$router.push({ name: 'energy-ammonia' })"
>
<icon-svg
name="tubiao"
class="site-sidebar__menu-icon"
></icon-svg>
<span slot="title">氨气流量分析</span>
</el-menu-item>
<el-menu-item
index="nitrogen"
@click="$router.push({ name: 'energy-nitrogen' })"
>
<icon-svg
name="tubiao"
class="site-sidebar__menu-icon"
></icon-svg>
<span slot="title">氮气流量分析</span>
</el-menu-item>
</el-submenu>
<el-menu-item
index="electric-acquisition"
@click="$router.push({ name: 'energy-electric-acquisition' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">电能采集数据</span>
</el-menu-item>
<el-submenu index="temperature">
<template slot="title">
<icon-svg
name="config"
class="site-sidebar__menu-icon"
></icon-svg>
<span>温度分析</span>
</template>
<el-menu-item
index="process-temperature"
@click="$router.push({ name: 'energy-process-temperature' })"
>
<icon-svg
name="tubiao"
class="site-sidebar__menu-icon"
></icon-svg>
<span slot="title">窑炉加工温度</span>
</el-menu-item>
<el-menu-item
index="sump-temperature"
@click="$router.push({ name: 'energy-sump-temperature' })"
>
<icon-svg
name="tubiao"
class="site-sidebar__menu-icon"
></icon-svg>
<span slot="title">油槽温度</span>
</el-menu-item>
</el-submenu>
<el-submenu index="gas">
<template slot="title">
<icon-svg
name="config"
class="site-sidebar__menu-icon"
></icon-svg>
<span>用气分析</span>
</template>
<el-menu-item
index="ammonia-analysis"
@click="$router.push({ name: 'energy-ammonia-analysis' })"
>
<icon-svg
name="tubiao"
class="site-sidebar__menu-icon"
></icon-svg>
<span slot="title">使用氮气分析</span>
</el-menu-item>
</el-submenu>
<el-menu-item
index="kiln-speed"
@click="$router.push({ name: 'energy-kiln-speed' })"
>
<icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">窑炉速度参数</span>
</el-menu-item>
</el-submenu>
<el-submenu index="report">
<template slot="title">
<icon-svg name="config" class="site-sidebar__menu-icon"></icon-svg>
<span>报表统计</span>
</template>
<el-submenu index="alarm">
<template slot="title">
<icon-svg
name="config"
class="site-sidebar__menu-icon"
></icon-svg>
<span>报警信息</span>
</template>
<el-menu-item
index="kiln-alarm"
@click="$router.push({ name: 'report-kiln-alarm' })"
>
<icon-svg name="job" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">窑炉报警</span>
</el-menu-item>
<el-menu-item
index="car-alarm"
@click="$router.push({ name: 'report-car-alarm' })"
>
<icon-svg name="job" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">车辆运行报警</span>
</el-menu-item>
</el-submenu>
<el-menu-item
index="order-history"
@click="$router.push({ name: 'report-order-history' })"
>
<icon-svg name="job" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">订单历史列表</span>
</el-menu-item>
<el-menu-item
index="task-history"
@click="$router.push({ name: 'report-task-history' })"
>
<icon-svg name="job" class="site-sidebar__menu-icon"></icon-svg>
<span slot="title">执行任务历史列表</span>
</el-menu-item>
</el-submenu>
<sub-menu <sub-menu
v-for="menu in menuList" v-for="menu in menuList"
:key="menu.menuId" :key="menu.menuId"
:menu="menu" :menu="menu"
:dynamicMenuRoutes="dynamicMenuRoutes"> :dynamicMenuRoutes="dynamicMenuRoutes"
>
</sub-menu> </sub-menu>
</el-menu> </el-menu>
</div> </div>
@ -86,77 +290,101 @@
</template> </template>
<script> <script>
import SubMenu from './main-sidebar-sub-menu' import SubMenu from './main-sidebar-sub-menu'
import { isURL } from '@/utils/validate' import { isURL } from '@/utils/validate'
export default { export default {
data () { data () {
return { return {
dynamicMenuRoutes: [] dynamicMenuRoutes: []
}
},
components: {
SubMenu
},
computed: {
sidebarLayoutSkin: {
get () {
return this.$store.state.common.sidebarLayoutSkin
} }
}, },
components: { sidebarFold: {
SubMenu get () {
}, return this.$store.state.common.sidebarFold
computed: {
sidebarLayoutSkin: {
get () { return this.$store.state.common.sidebarLayoutSkin }
},
sidebarFold: {
get () { return this.$store.state.common.sidebarFold }
},
menuList: {
get () { return this.$store.state.common.menuList },
set (val) { this.$store.commit('common/updateMenuList', val) }
},
menuActiveName: {
get () { return this.$store.state.common.menuActiveName },
set (val) { this.$store.commit('common/updateMenuActiveName', val) }
},
mainTabs: {
get () { return this.$store.state.common.mainTabs },
set (val) { this.$store.commit('common/updateMainTabs', val) }
},
mainTabsActiveName: {
get () { return this.$store.state.common.mainTabsActiveName },
set (val) { this.$store.commit('common/updateMainTabsActiveName', val) }
} }
}, },
watch: { menuList: {
$route: 'routeHandle' get () {
return this.$store.state.common.menuList
},
set (val) {
this.$store.commit('common/updateMenuList', val)
}
}, },
created () { menuActiveName: {
this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]') get () {
this.dynamicMenuRoutes = JSON.parse(sessionStorage.getItem('dynamicMenuRoutes') || '[]') return this.$store.state.common.menuActiveName
this.routeHandle(this.$route) },
set (val) {
this.$store.commit('common/updateMenuActiveName', val)
}
}, },
methods: { mainTabs: {
// get () {
routeHandle (route) { return this.$store.state.common.mainTabs
if (route.meta.isTab) { },
// tab, set (val) {
var tab = this.mainTabs.filter(item => item.name === route.name)[0] this.$store.commit('common/updateMainTabs', val)
if (!tab) { }
if (route.meta.isDynamic) { },
route = this.dynamicMenuRoutes.filter(item => item.name === route.name)[0] mainTabsActiveName: {
if (!route) { get () {
return console.error('未能找到可用标签页!') return this.$store.state.common.mainTabsActiveName
} },
set (val) {
this.$store.commit('common/updateMainTabsActiveName', val)
}
}
},
watch: {
$route: 'routeHandle'
},
created () {
this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
this.dynamicMenuRoutes = JSON.parse(
sessionStorage.getItem('dynamicMenuRoutes') || '[]'
)
this.routeHandle(this.$route)
},
methods: {
//
routeHandle (route) {
if (route.meta.isTab) {
// tab,
var tab = this.mainTabs.filter(item => item.name === route.name)[0]
if (!tab) {
if (route.meta.isDynamic) {
route = this.dynamicMenuRoutes.filter(
item => item.name === route.name
)[0]
if (!route) {
return console.error('未能找到可用标签页!')
} }
tab = {
menuId: route.meta.menuId || route.name,
name: route.name,
title: route.meta.title,
type: isURL(route.meta.iframeUrl) ? 'iframe' : 'module',
iframeUrl: route.meta.iframeUrl || '',
params: route.params,
query: route.query
}
this.mainTabs = this.mainTabs.concat(tab)
} }
this.menuActiveName = tab.menuId + '' tab = {
this.mainTabsActiveName = tab.name menuId: route.meta.menuId || route.name,
name: route.name,
title: route.meta.title,
type: isURL(route.meta.iframeUrl) ? 'iframe' : 'module',
iframeUrl: route.meta.iframeUrl || '',
params: route.params,
query: route.query
}
this.mainTabs = this.mainTabs.concat(tab)
} }
this.menuActiveName = tab.menuId + ''
this.mainTabsActiveName = tab.name
} }
} }
} }
}
</script> </script>

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:59:57
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:59:57
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 11:00:26
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 11:00:26
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:51:05
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:51:05
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:50:45
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:50:46
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:52:29
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:52:29
* @Description:
-->

View File

@ -0,0 +1,7 @@
<!--
* @Author: zwq
* @Date: 2021-11-19 10:52:19
* @LastEditors: zwq
* @LastEditTime: 2021-11-19 10:52:20
* @Description:
-->