first commit
This commit is contained in:
@@ -0,0 +1,11 @@
|
||||
<el-row class="el-pagination-container" style="margin-bottom: 0px">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[5,10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
@@ -0,0 +1,694 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="${lang,escape}">
|
||||
<head>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
|
||||
<meta name="description" content="${AppName!}">
|
||||
<title>${AppName!}</title>
|
||||
<meta charset="UTF-8">
|
||||
<!-- import CSS -->
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/myframe/css/myframe.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/element-ui/lib/theme-chalk/index.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/fonts/themify-icons.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/fonts/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/common.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/main.css?v=1.0.0">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/elmain.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/panel.css">
|
||||
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/common.css?v=1.0.3">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/wangeditor/wangEditor.css">
|
||||
<link rel="stylesheet" type="text/css" href="${base!}/assets/platform/plugins/viewer/viewer.min.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/wp-upload-vue/css/wpupload.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/wp-upload-vue/font/iconfont.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/video/css/video-js.min.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/vivify.min.css">
|
||||
|
||||
<script>
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: '4fa1e1aeabba7eb9518129cf57ab17c1'
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- import Vue before Element -->
|
||||
<script src="${base!}/assets/platform/plugins/vue/vue.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/vuex/vuex.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/vuex-persistedstate/vuex-persistedstate.umd.js"></script>
|
||||
|
||||
<!-- vue-count-to -->
|
||||
<script src="${base!}/assets/platform/plugins/vue-count-to/vue-count-to.min.js"></script>
|
||||
|
||||
<!-- wpupload -->
|
||||
<script type="text/javascript" src="${base!}/assets/platform/plugins/wp-upload-vue/js/axios.min.js"></script>
|
||||
<script type="text/javascript" src="${base!}/assets/platform/plugins/wp-upload-vue/font/iconfont.js"></script>
|
||||
<script type="text/javascript" src="${base!}/assets/platform/plugins/wp-upload-vue/js/wpupload.js"></script>
|
||||
|
||||
<!-- import JavaScript -->
|
||||
<script src="${base!}/assets/platform/plugins/element-ui/lib/index.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/element-ui/lib/i18n/${lang,escape}.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/jquery/jquery-1.11.1.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/slimscroll/jquery.slimscroll.min.js"></script>
|
||||
|
||||
|
||||
<!--后面就改这一段吧-->
|
||||
<script src="${base!}/assets/platform/js/utils.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/dd3s/dd3s.js"></script>
|
||||
<script src="${base!}/assets/platform/js/jsz.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/video/js/video.min.js"></script>
|
||||
|
||||
<!--g2-->
|
||||
<script src="/assets/platform/plugins/g2/g2.min.js?v=4.1.9"></script>
|
||||
<script src="/assets/platform/plugins/g2/data-set.js"></script>
|
||||
<script src="/assets/platform/plugins/g2/g2plot.js?v=1.0.0"></script>
|
||||
|
||||
<!--echars-->
|
||||
<script src="${base!}/assets/platform/plugins/echarts/echarts.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/echarts/infographic.js"></script><!--主题-->
|
||||
<script src="${base!}/assets/platform/plugins/echarts/westeros.js"></script><!--主题-->
|
||||
<script src="${base!}/assets/platform/plugins/echarts/walden.js"></script><!--主题-->
|
||||
<script src="${base!}/assets/platform/plugins/echarts/macarons.js"></script><!--主题-->
|
||||
<script src="${base!}/assets/platform/plugins/echarts/echarts.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/echarts/langZH.js"></script>
|
||||
<!-- <script src="https://cdn.staticfile.org/echarts/5.2.2/echarts.js"></script>-->
|
||||
<!-- <script src="https://cdn.staticfile.org/echarts/5.2.2/i18n/langZH.js"></script>-->
|
||||
|
||||
|
||||
<script src="${base!}/assets/platform/module/mixins/initTableMixins.js?v=1.0.3"></script>
|
||||
<script src="${base!}/assets/platform/module/mixins/styleMixin.js"></script>
|
||||
<script src="${base!}/assets/platform/js/includeModel.js?v=1.0.5"></script>
|
||||
<script src="${base!}/assets/platform/js/component.js?v=1.0.2"></script>
|
||||
<script src="${base!}/assets/platform/js/v.js?v=1.0.5"></script>
|
||||
<script src="${base!}/assets/platform/plugins/wangeditor/wangEditor.js"></script>
|
||||
<!-- <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/wangeditor@4.6.15/dist/wangEditor.min.js"></script>-->
|
||||
<script type="text/javascript"
|
||||
src="https://webapi.amap.com/maps?v=1.4.15&key=57f0d098ba1b881ecc436c4cfd23bbbf&plugin=AMap.PolyEditor,AMap.PlaceSearch"></script>
|
||||
|
||||
<!--viewer-->
|
||||
<script src="${base!}/assets/platform/plugins/viewer/viewer.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/viewer/jquery-viewer.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/vue-loader/httpVueLoader.js"></script>
|
||||
<script src="${base!}/assets/platform/js/gh.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/vue-qrcode/vue-qrcode.min.js"></script>
|
||||
|
||||
|
||||
<!-- pjax是异步加载html片段的工具,模拟前端路由机制 -->
|
||||
<script src="${base!}/assets/platform/plugins/pjax/jquery.pjax.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/myframe/js/myframe.js"></script>
|
||||
<!-- Array数组增加findIndex等方法,TreeTable用得到,兼容IE8 -->
|
||||
<script src="${base!}/assets/platform/plugins/polyfill/polyfill.js"></script>
|
||||
<!-- 时间日期处理工具类 -->
|
||||
<script src="${base!}/assets/platform/plugins/moment/moment.min.js"></script>
|
||||
<!-- 浏览器通知 -->
|
||||
<script src="${base!}/assets/platform/plugins/push/push.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/xlsx/xlsx.full.min.js"></script>
|
||||
<script src="${base!}/assets/platform/js/main.js?v=1.0.1"></script>
|
||||
<script src="${base!}/assets/platform/js/offscreen.js"></script>
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/vue-echarts@4.0.2"></script>-->
|
||||
<script src="${base!}/assets/platform/plugins/vue-charts/echartTheme.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/css/skins/palette.3.css" id="skin">
|
||||
|
||||
<!--拖拽js-->
|
||||
<script src="${base!}/assets/platform/js/directive/v-sticky.js"></script>
|
||||
|
||||
<script src="${base!}/assets/platform/js/jquery.qrcode.min.js"></script>
|
||||
|
||||
<script src="${base!}/assets/platform/js/jr-qrcode.js"></script>
|
||||
|
||||
|
||||
<!-- <link rel="stylesheet" href="https://cdn.staticfile.org/element-ui/2.15.6/theme-chalk/index.min.css">-->
|
||||
<!-- <script src="https://cdn.staticfile.org/element-ui/2.15.6/index.min.js"></script>-->
|
||||
|
||||
<!--#
|
||||
var isLeftMenu = false;
|
||||
if(@shiro.getPrincipalProperty('menuTheme') == "top"){
|
||||
isLeftMenu = false;
|
||||
}else if(@shiro.getPrincipalProperty('menuTheme') == "left"){
|
||||
isLeftMenu = true;
|
||||
}
|
||||
#-->
|
||||
<script type="text/javascript">
|
||||
var base = "${base!}";
|
||||
var loginPjax = "${@shiro.getPrincipalProperty('loginPjax')}";
|
||||
const AppMapCenterPointX = "${config.AppMapCenterPointX!}";
|
||||
const AppMapCenterPointY = "${config.AppMapCenterPointY!}";
|
||||
var isLeftMenu = "${isLeftMenu!}";
|
||||
var isDisPlayCode = "${config.isDisPlayCode!}" === 'true'
|
||||
ELEMENT.locale(ELEMENT.lang['${lang,escape}']);
|
||||
// Vue.component('v-chart', VueECharts)
|
||||
// VueECharts.registerTheme('mine', echartsTheme)
|
||||
const APP_DOMAIN = "${AppDomain!}"
|
||||
const FILE_DOMAIN = "${AppFileDomain!}"
|
||||
Vue.component('vuedraggable', window.vuedraggable)
|
||||
Vue.component('guava', httpVueLoader('/components/plugins/Guava.vue'))
|
||||
Vue.component('sign', httpVueLoader('/components/sign/sign.vue?v=2.0.0'))
|
||||
Vue.component('file-upload', httpVueLoader('/components/plugins/FileUpload.vue'))
|
||||
Vue.component('text-editor', httpVueLoader('/components/plugins/textEditor.vue'))
|
||||
Vue.component('border-table', httpVueLoader('/components/plugins/BorderTable.vue'))
|
||||
Vue.component('image-upload', httpVueLoader('/components/plugins/ImageUpload.vue'))
|
||||
Vue.component('custom-message', httpVueLoader('/components/plugins/CustomMessage.vue'))
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
const viewImage = function (filepath) {
|
||||
let image = new Image();
|
||||
image.src = APP_DOMAIN + FILE_STREAM_PREVIEW_ADDRESS + '?id=' + filepath;
|
||||
let viewer = new Viewer(image);
|
||||
viewer.show();
|
||||
};
|
||||
window.viewImage = viewImage;
|
||||
Vue.prototype.$viewImage = viewImage
|
||||
</script>
|
||||
<script>
|
||||
Vue.use(httpVueLoader)
|
||||
Vue.component(VueQrcode.name, VueQrcode)
|
||||
</script>
|
||||
<script>
|
||||
//防止用户快速重复点击造成数据混乱 提供vue指令和js节流函数两种方式
|
||||
//控制此元素在一定时间内是否可成为鼠标的点击目标对象
|
||||
Vue.directive('throttle', {
|
||||
inserted(el, binding) {
|
||||
el.addEventListener('click', () => {
|
||||
if (el.style.pointerEvents !== 'none') {
|
||||
el.style.pointerEvents = 'none'
|
||||
window.setTimeout(() => {
|
||||
el.style.pointerEvents = ''
|
||||
}, 1200)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
function getQueryVariable(variable) {
|
||||
let query = window.location.search.substring(1);
|
||||
let vars = query.split("&");
|
||||
for (let i = 0; i < vars.length; i++) {
|
||||
let pair = vars[i].split("=");
|
||||
if (pair[0] == variable) {
|
||||
return pair[1];
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
//函数在一定时间内只会触发一次 FN.ABC
|
||||
function throttle(func, wait) {
|
||||
let previous = 0;
|
||||
return function () {
|
||||
let now = Date.now();
|
||||
let context = this;
|
||||
let args = arguments;
|
||||
if (now - previous > wait) {
|
||||
func.apply(context, args);
|
||||
previous = now;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
const hasProposalAdminRole = "${@shiro.hasAnyRoles('sysadmin','jdh10')}" === 'true'
|
||||
</script>
|
||||
|
||||
<script>
|
||||
window.sessionStorage.setItem('moduleMenus', JSON.stringify(${json(@shiro.userModuleMenus())}))
|
||||
window.sessionStorage.setItem('menus', JSON.stringify(${json(@shiro.getPrincipalProperty('menus'))}))
|
||||
window.store = new Vuex.Store({
|
||||
plugins: [
|
||||
createPersistedState({
|
||||
key: "zhgh-vuex",
|
||||
paths: ["openedMenus", "activeMenuIndex", "activeMenuModuleId"],
|
||||
storage: window.sessionStorage
|
||||
})
|
||||
],
|
||||
state: {
|
||||
//当前激活的菜单
|
||||
activeMenuIndex: null,
|
||||
//激活的菜单模块
|
||||
activeMenuModuleId: null,
|
||||
moduleMenus: JSON.parse(window.sessionStorage.getItem("moduleMenus")),
|
||||
menus: JSON.parse(window.sessionStorage.getItem("menus"))
|
||||
},
|
||||
mutations: {
|
||||
//设置激活的菜单
|
||||
setActiveMenuIndex(state, payload) {
|
||||
state.activeMenuIndex = payload
|
||||
},
|
||||
//设置激活的菜单模块
|
||||
setActiveMenuModuleId(state, payload) {
|
||||
state.activeMenuModuleId = payload
|
||||
},
|
||||
//设置打开的菜单
|
||||
setOpenedMenus(state, payload) {
|
||||
state.openedMenus = payload
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
pjaxRoute({commit, dispatch, state, getters}, href) {
|
||||
const {pathname, search} = new URL(href, window.location.origin)
|
||||
const matchMenu = state.menus.find(v => v.href === pathname)
|
||||
if (!matchMenu) {
|
||||
commit("setActiveMenuIndex", null)
|
||||
commit("setOpenedMenus", [])
|
||||
if (!state.activeModuleId && state.moduleMenus) {
|
||||
commit("setActiveMenuModuleId", state.moduleMenus[0].id)
|
||||
}
|
||||
pjaxReplace(pathname === "/platform/home" ? pathname : pathname)
|
||||
return
|
||||
}
|
||||
|
||||
//拷贝一份
|
||||
let cloneMenu = JSON.parse(JSON.stringify(matchMenu))
|
||||
//找出所有父菜单包括自己
|
||||
let parentMenus = []
|
||||
while (cloneMenu && cloneMenu.parentId) {
|
||||
cloneMenu = state.menus.find((m) => m.id === cloneMenu.parentId)
|
||||
if (cloneMenu) {
|
||||
parentMenus.unshift(cloneMenu)
|
||||
}
|
||||
}
|
||||
parentMenus.push(matchMenu)
|
||||
|
||||
//获取到该菜单所属的模块
|
||||
const moduleId = state.moduleMenus.find(v => v.containsMenu.includes(parentMenus[0].id))?.id
|
||||
|
||||
//判断下是否跨模块跳转
|
||||
if (moduleId !== state.activeMenuModuleId) {
|
||||
commit("setActiveMenuModuleId", moduleId)
|
||||
}
|
||||
Vue.nextTick(() => {
|
||||
//重新设置展开菜单
|
||||
commit("setOpenedMenus", parentMenus.map((menu) => menu.id))
|
||||
//设置当前激活菜单
|
||||
commit("setActiveMenuIndex", matchMenu.id)
|
||||
//跳转
|
||||
pjaxReplace(matchMenu.href ? matchMenu.href + (search || "") : "/platform/home")
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<style>
|
||||
#app {
|
||||
background-color: rgb(240, 242, 245);
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.w-e-toolbar {
|
||||
z-index: 1 !important;
|
||||
}
|
||||
|
||||
.w-e-text-container {
|
||||
z-index: 0 !important;
|
||||
}
|
||||
|
||||
.viewer-container {
|
||||
z-index: 9999999999;
|
||||
}
|
||||
|
||||
.header {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.app .header-fixed + .layout {
|
||||
/*padding-top: 0;*/
|
||||
}
|
||||
|
||||
.el-table-container {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.layout {
|
||||
max-height: calc(100vh - 50px);
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
.small-menu .brand {
|
||||
width: 70px !important;
|
||||
}
|
||||
|
||||
input[type="file"] {
|
||||
display: none
|
||||
}
|
||||
|
||||
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.space-around {
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.space-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
|
||||
#app > .transition-row {
|
||||
min-height: calc(100vh - 50px);
|
||||
}
|
||||
|
||||
#app > .transition-row > .transition-item {
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="gallery-loader" style="background-color:transparent;">
|
||||
<div class="loader"></div>
|
||||
</div>
|
||||
<div id="mainApp" class="app">
|
||||
<header class="header header-fixed navbar" id="headerNavbar">
|
||||
<div class="brand">
|
||||
<a href="javascript:;" data-pjax class="navbar-brand" @click="goHome">
|
||||
<img src="${base!}/assets/platform/img/logo.png" alt=""
|
||||
style="width: 60%;height: 80%"
|
||||
class="o_img <!--#if(!@shiro.getPrincipalProperty('loginSidebar')){#-->o_hide<!--#}#-->">
|
||||
<span class="heading-font o_img <!--#if(@shiro.getPrincipalProperty('loginSidebar')){#-->o_hide<!--#}#-->">
|
||||
<img src="${base!}/assets/platform/img/logoa.png">
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<ul class="nav navbar-nav">
|
||||
<li style="padding:0 10px" class="vivify popIn duration-1500">
|
||||
<el-popover
|
||||
width="450"
|
||||
popper-class="appCenterPopover"
|
||||
placement="top-start"
|
||||
v-model="menuPopover"
|
||||
trigger="hover">
|
||||
<el-card shadow="never" class="appCenterCard">
|
||||
<template #header>
|
||||
<el-row type="flex" justify="space-between">
|
||||
<div>
|
||||
<el-link :underline="false">应用中心</el-link>
|
||||
<i class="el-icon-edit" style="cursor: pointer;color: #1867b0"
|
||||
@click="goSetAppCenter"></i>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<el-link @click="goHome" type="primary" :underline="false">工作台</el-link>
|
||||
<el-link @click="setUserDefaultEntranceModuleId" type="primary" :underline="false">
|
||||
设置为默认模块
|
||||
</el-link>
|
||||
</div>
|
||||
</el-row>
|
||||
</template>
|
||||
<el-row gutter="20">
|
||||
<el-col v-for="item in entranceModules" :span="8">
|
||||
<div class="entranceDetail"
|
||||
:class="item.id==selectEntranceModuleId?'entranceDetail-selected':''"
|
||||
@click="enterEntranceModules(item)">
|
||||
<div class="entranceIcon">
|
||||
<el-image :src="APP_DOMAIN+FILE_STREAM_PREVIEW_ADDRESS+'?id='+item.icon[0].id"
|
||||
style="height: 50px;width: 50px;border-radius: 50%"></el-image>
|
||||
</div>
|
||||
{{item.moduleName}}
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" @click="menuPopover=!menuPopover">关闭</el-button>
|
||||
</el-row>
|
||||
</el-card>
|
||||
<a href="javascript:" slot="reference" style="color: #FFFFFF;" @click="toggleMenuPopover">
|
||||
<i class="fa fa-th-large" aria-hidden="true"></i>
|
||||
{{selectEntranceModule ? selectEntranceModule.moduleName : '应用中心'}}
|
||||
</a>
|
||||
</el-popover>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="off-right">
|
||||
<a href="javascript:;" data-toggle="dropdown">
|
||||
<span class="hidden-xs ml10">${@shiro.getPrincipalProperty('username')}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="off-right">
|
||||
<a href="${base!}/platform/login/logout">
|
||||
<i class="ti-power-off"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</header>
|
||||
<section class="layout" style="display: flex;">
|
||||
<!-- sidebar menu -->
|
||||
<div id="asideMenu" class="sidebar">
|
||||
<el-menu unique-opened :default-active="activeMenuIndex" :default-openeds="openedMenus" @select="menuSelect"
|
||||
style="width: 250px;">
|
||||
<menu-list :menus="leftMenus" :depth="0"></menu-list>
|
||||
</el-menu>
|
||||
</div>
|
||||
<!-- main content -->
|
||||
<section class="main-content" id="container">
|
||||
${layoutContent}
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const leftMenuApp = new Vue({
|
||||
el: '#asideMenu',
|
||||
components: {
|
||||
"menu-list": {
|
||||
name: "menu-list",
|
||||
template:
|
||||
/*language=HTML*/
|
||||
`
|
||||
<div>
|
||||
<template v-for="(item, index) in menus">
|
||||
<el-submenu :index="item.id" v-if="item.children && item.children.length > 0">
|
||||
<template #title>
|
||||
<i class="fa fa-tags"></i>
|
||||
<span>{{ item.name }}</span>
|
||||
</template>
|
||||
<menu-list :menus="item.children" :depth="depth + 1"/>
|
||||
</el-submenu>
|
||||
<el-menu-item :index="item.id" v-else>
|
||||
<a :href="item.href" data-pjax>
|
||||
<i :class="item.icon ? item.icon : 'fa fa-link'"></i>
|
||||
<span style="white-space: normal;
|
||||
word-break: break-all;
|
||||
line-height: 1.4;
|
||||
margin-right: 60px;
|
||||
display: inline-block;">{{ item.name }}</span>
|
||||
</a>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
</div>
|
||||
`,
|
||||
props: ["menus", "depth"]
|
||||
}
|
||||
},
|
||||
store,
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
leftMenus() {
|
||||
if (this.selectEntranceModuleId) {
|
||||
return this.moduleMenus.find(v => v.id === this.selectEntranceModuleId)?.menus
|
||||
}
|
||||
return []
|
||||
},
|
||||
|
||||
moduleMenus() {
|
||||
return this.$store.state.moduleMenus
|
||||
},
|
||||
selectEntranceModuleId() {
|
||||
return this.$store.state.activeMenuModuleId || null
|
||||
},
|
||||
selectEntranceModule() {
|
||||
if (this.selectEntranceModuleId && this.moduleMenus && this.moduleMenus.length > 0) {
|
||||
return this.moduleMenus.find(v => v.id === this.selectEntranceModuleId)
|
||||
}
|
||||
return {}
|
||||
},
|
||||
//当前选中菜单
|
||||
activeMenuIndex() {
|
||||
return this.$store.state.activeMenuIndex
|
||||
},
|
||||
//当前打开的菜单 数组 包含所有父菜单
|
||||
openedMenus() {
|
||||
return this.$store.state.openedMenus
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
menuSelect(index, indexPath) {
|
||||
this.$store.commit("setActiveMenuIndex", index)
|
||||
this.$store.commit("setOpenedMenus", indexPath)
|
||||
},
|
||||
|
||||
goHome() {
|
||||
|
||||
},
|
||||
assignmentMenu() {
|
||||
const menuIndexPath = window.sessionStorage.getItem('menuIndexPath')
|
||||
if (menuIndexPath) {
|
||||
this.openedMenus = JSON.parse(menuIndexPath)
|
||||
} else {
|
||||
this.openedMenus = []
|
||||
}
|
||||
const menuIndex = window.sessionStorage.getItem('menuIndex')
|
||||
if (menuIndex) {
|
||||
this.activeMenuIndex = menuIndex
|
||||
} else {
|
||||
this.activeMenuIndex = ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.assignmentMenu()
|
||||
}
|
||||
})
|
||||
|
||||
const headerNavBarVueApp = new Vue({
|
||||
el: '#headerNavbar',
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
userDefaultModuleId: null,
|
||||
menuPopover: false,
|
||||
appModuleId: ""
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
entranceModules() {
|
||||
return this.$store.state.moduleMenus
|
||||
},
|
||||
selectEntranceModuleId() {
|
||||
return this.$store.state.activeMenuModuleId || null
|
||||
},
|
||||
selectEntranceModule() {
|
||||
if (this.selectEntranceModuleId && this.entranceModules) {
|
||||
return this.entranceModules.find(v => v.id === this.selectEntranceModuleId)
|
||||
}
|
||||
return {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async enterEntranceModules(item) {
|
||||
this.$store.commit('setActiveMenuModuleId', item.id)
|
||||
},
|
||||
goHome() {
|
||||
$.pjax({
|
||||
url: '/platform/home',
|
||||
container: '#container',
|
||||
fragment: '#container',
|
||||
timeout: 8000
|
||||
});
|
||||
this.$store.commit('setActiveMenuIndex', null)
|
||||
this.$store.commit("setOpenedMenus", [])
|
||||
|
||||
|
||||
},
|
||||
goSetAppCenter() {
|
||||
$.pjax({
|
||||
url: '/platform/sys/entranceModule',
|
||||
container: '#container',
|
||||
fragment: '#container',
|
||||
timeout: 8000
|
||||
});
|
||||
},
|
||||
async getUserDefaultEntranceModuleId() {
|
||||
const resp = await $.get('/platform/sys/entranceModule/getUserDefaultEntranceModuleId')
|
||||
if (resp.code === 0) {
|
||||
this.userDefaultModuleId = resp.data
|
||||
}
|
||||
},
|
||||
async setUserDefaultEntranceModuleId() {
|
||||
const {id: moduleId, moduleName} = this.selectEntranceModule
|
||||
const msg = '您确定要将' + moduleName + '设置为默认模块吗?'
|
||||
const confirm = await this.$confirm(msg, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if ('confirm' !== confirm) return
|
||||
const resp = await $.get('/platform/sys/entranceModule/setUserDefaultEntranceModuleId', {moduleId})
|
||||
if (resp.code === 0) {
|
||||
this.$notify.success(resp.msg)
|
||||
} else {
|
||||
this.$notify.warning(resp.msg)
|
||||
}
|
||||
},
|
||||
toggleMenuPopover() {
|
||||
setTimeout(() => {
|
||||
this.menuPopover = !this.menuPopover
|
||||
}, 300)
|
||||
},
|
||||
async init() {
|
||||
await this.getUserDefaultEntranceModuleId()
|
||||
const selectEntranceModuleStr = window.sessionStorage.getItem('selectEntranceModule')
|
||||
if (selectEntranceModuleStr) {
|
||||
this.selectEntranceModule = JSON.parse(selectEntranceModuleStr)
|
||||
this.appModuleId = this.selectEntranceModule.id
|
||||
}
|
||||
this.setAttr()
|
||||
},
|
||||
|
||||
findParentNodes(data, targetHref, parents = []) {
|
||||
for (const node of data) {
|
||||
if (node && node.href === targetHref) {
|
||||
return parents.concat(node);
|
||||
}
|
||||
if (node && node.children) {
|
||||
const found = this.findParentNodes(node.children, targetHref, parents.concat(node));
|
||||
if (found) {
|
||||
return found;
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
matchMenu(path = window.location.pathname) {
|
||||
const parentNodes = this.findParentNodes(JSON.parse(window.sessionStorage.getItem('moduleMenus')).flatMap(v => v.menus), path)
|
||||
if (parentNodes) {
|
||||
const menuIndexPath = parentNodes.map(v => v.id)
|
||||
const menuIndex = menuIndexPath[menuIndexPath.length - 1]
|
||||
const menuParentIndex = menuIndexPath[0]
|
||||
const module = JSON.parse(window.sessionStorage.getItem('moduleMenus')).find(v => v.containsMenu.includes(menuParentIndex))
|
||||
this.enterEntranceModules(module)
|
||||
this.$store.commit('setActiveMenuIndex', menuIndex)
|
||||
this.$store.commit("setOpenedMenus", menuIndexPath)
|
||||
leftMenuApp.assignmentMenu()
|
||||
} else {
|
||||
this.enterEntranceModules(JSON.parse(window.sessionStorage.getItem('moduleMenus'))[0])
|
||||
this.$store.commit('setActiveMenuIndex', null)
|
||||
this.$store.commit("setOpenedMenus", [])
|
||||
leftMenuApp.assignmentMenu()
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
created() {
|
||||
// this.matchMenu()
|
||||
this.$store.dispatch('pjaxRoute', window.location)
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user