You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
459 lines
26 KiB
459 lines
26 KiB
<template>
|
|
<div class="wrapper">
|
|
<nav class="main-header navbar navbar-expand navbar-white navbar-light">
|
|
<ul class="navbar-nav">
|
|
<li class="nav-item">
|
|
<a class="nav-link" data-widget="pushmenu" href="#"><i class="fas fa-bars"></i></a>
|
|
</li>
|
|
<li class="nav-item d-none d-sm-inline-block">
|
|
<router-link to="/" :class="'nav-link'+(area==='default'?' active':'')">首页</router-link>
|
|
</li>
|
|
<li class="nav-item d-none d-sm-inline-block">
|
|
<router-link to="/routes/admin/index.html?area=admin" :class="'nav-link'+(area==='admin'?' active':'')">管理</router-link>
|
|
</li>
|
|
</ul>
|
|
<ul class="navbar-nav ml-auto" v-if="data.username">
|
|
<li class="nav-item">
|
|
<router-link class="nav-link" to="/routes/user.html">{{data.username}}</router-link>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="javascript:;" @click="logout">退出</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="navbar-nav ml-auto" v-else>
|
|
<!--<li class="nav-item">
|
|
<a class="nav-link" href="/routes/register.html">注册</a>
|
|
</li>-->
|
|
<li class="nav-item">
|
|
<router-link class="nav-link" to="/routes/login.html">登录</router-link>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<aside class="main-sidebar sidebar-dark-primary elevation-4">
|
|
<a class="brand-link" href="/">
|
|
<img class="brand-image img-circle elevation-3" :src="data.logo" />
|
|
<span class="brand-text font-weight-light">{{data.name}}</span>
|
|
</a>
|
|
<div class="sidebar" v-if="data.username">
|
|
<nav class="mt-2">
|
|
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false" v-if="area==='default'">
|
|
<li class="nav-item">
|
|
<router-link to="/" :class="getPageClass('/','/routes/iot/product.html','/routes/iot/device.html')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
首页
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item">
|
|
<router-link to="/routes/iot/nodes.html" :class="getPageClass('/routes/iot/nodes.html','/routes/iot/node.html')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
节点
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false" v-if="area==='admin'">
|
|
<li class="nav-item">
|
|
<router-link :key="$route.fullPath" to="/routes/admin/index.html?area=admin" :class="getPageClass('/routes/admin/index.html')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
首页
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Setting')">
|
|
<router-link :key="$route.fullPath" to="/routes/admin/setting/index.html?area=admin&entity=Setting" :class="getLinkClass('Setting')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
配置管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-User')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=User" :class="getLinkClass('User')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
用户管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<!--角色权限-->
|
|
<li :class="getGroupLiClass('Role','Permission')" v-if="hasPermission('Read-Role')||hasPermission('Read-Permission')">
|
|
<a href="javascript:;" :class="getGroupLinkClass('Role','Permission')" @click.stop="toggle($event)">
|
|
<i class="fa fa-folder nav-icon"></i>
|
|
<p>角色权限<i class="right fas fa-angle-left"></i></p>
|
|
</a>
|
|
<ul class="nav nav-treeview">
|
|
<li class="nav-item" v-if="hasPermission('Read-Role')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Role" :class="getLinkClass('Role')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
角色管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Permission')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Permission" :class="getLinkClass('Permission')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
权限管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<!--产品-->
|
|
<li :class="getGroupLiClass('Product','Api','Parameter')" v-if="hasPermission('Read-Product')||hasPermission('Read-Api')||hasPermission('Read-Parameter')">
|
|
<a href="javascript:;" :class="getGroupLinkClass('Product','Api','Parameter')" @click.stop="toggle($event)">
|
|
<i class="fa fa-folder nav-icon"></i>
|
|
<p>产品管理<i class="right fas fa-angle-left"></i></p>
|
|
</a>
|
|
<ul class="nav nav-treeview">
|
|
<li class="nav-item" v-if="hasPermission('Read-Product')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Product" :class="getLinkClass('Product')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
产品管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Api')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Api" :class="getLinkClass('Api')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
接口管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Parameter')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Parameter" :class="getLinkClass('Parameter')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
参数管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-NodeCategory')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=NodeCategory" :class="getLinkClass('NodeCategory')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
节点分类
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<!--节点-->
|
|
<li :class="getGroupLiClass('Node','Device','Data','Command')" v-if="hasPermission('Read-Node')||hasPermission('Read-Device')||hasPermission('Read-Data')||hasPermission('Read-Command')">
|
|
<a href="javascript:;" :class="getGroupLinkClass('Node','Device','Data','Command')" @click.stop="toggle($event)">
|
|
<i class="fa fa-folder nav-icon"></i>
|
|
<p>节点管理<i class="right fas fa-angle-left"></i></p>
|
|
</a>
|
|
<ul class="nav nav-treeview">
|
|
<li class="nav-item" v-if="hasPermission('Read-Node')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Node" :class="getLinkClass('Node')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
节点管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Device')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Device" :class="getLinkClass('Device')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
设备管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Data')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Data" :class="getLinkClass('Data')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
数据管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Command')">
|
|
<router-link :key="$route.fullPath" to="/routes/admin/command/index.html?area=admin&entity=Command" :class="getLinkClass('Command')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
命令管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<!--节点场景-->
|
|
<li :class="getGroupLiClass('Scene','SceneCommand','SceneTimer','SceneTigger')" v-if="hasPermission('Read-Scene')||hasPermission('Read-SceneCommand')||hasPermission('Read-SceneTimer')||hasPermission('Read-SceneTigger')">
|
|
<a href="javascript:;" :class="getGroupLinkClass('Scene','SceneCommand','SceneTimer','SceneTigger')" @click.stop="toggle($event)">
|
|
<i class="fa fa-folder nav-icon"></i>
|
|
<p>节点场景<i class="right fas fa-angle-left"></i></p>
|
|
</a>
|
|
<ul class="nav nav-treeview">
|
|
<li class="nav-item" v-if="hasPermission('Read-Scene')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Scene" :class="getLinkClass('Scene')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
场景管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-SceneCommand')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=SceneCommand" :class="getLinkClass('SceneCommand')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
场景命令管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-SceneTimer')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=SceneTimer" :class="getLinkClass('SceneTimer')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
定时器管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-SceneTigger')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=SceneTigger" :class="getLinkClass('SceneTigger')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
触发器管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-Organ')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=Organ" :class="getLinkClass('Organ')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
机构管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<!--机构场景-->
|
|
<li :class="getGroupLiClass('OrganScene','OrganSceneCommand','OrganSceneTimer','OrganSceneTigger')" v-if="hasPermission('Read-OrganScene')||hasPermission('Read-OrganSceneCommand')||hasPermission('Read-OrganSceneTimer')||hasPermission('Read-OrganSceneTigger')">
|
|
<a href="javascript:;" :class="getGroupLinkClass('OrganScene','OrganSceneCommand','OrganSceneTimer','OrganSceneTigger')" @click.stop="toggle($event)">
|
|
<i class="fa fa-folder nav-icon"></i>
|
|
<p>机构场景<i class="right fas fa-angle-left"></i></p>
|
|
</a>
|
|
<ul class="nav nav-treeview">
|
|
<li class="nav-item" v-if="hasPermission('Read-OrganScene')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=OrganScene" :class="getLinkClass('OrganScene')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
场景管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-SceneCommand')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=OrganSceneCommand" :class="getLinkClass('OrganSceneCommand')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
场景命令管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-SceneTimer')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=OrganSceneTimer" :class="getLinkClass('OrganSceneTimer')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
定时器管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-SceneTigger')">
|
|
<router-link :key="$route.fullPath" to="/routes/shared/index.html?area=admin&entity=OrganSceneTigger" :class="getLinkClass('OrganSceneTigger')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
触发器管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item" v-if="hasPermission('Read-LiveRecord')">
|
|
<router-link :key="$route.fullPath" to="/routes/admin/record/index.html?area=admin&entity=LiveRecord" :class="getLinkClass('LiveRecord')">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
回放管理
|
|
</p>
|
|
</router-link>
|
|
</li>
|
|
<template v-if="data.roles.indexOf('超级管理员')===0">
|
|
<li class="nav-header">运维</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/JobServer/job">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
JobServer
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/portainer/">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
Portainer
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/minio/">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
MinIO
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/mysqlui/">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
phpmyadmin
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/influxui/">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
influxdb
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/phpredisadmin/">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
phpredisadmin
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" target="_blank" href="/srs/console/">
|
|
<i class="far fa-circle nav-icon"></i>
|
|
<p>
|
|
srs
|
|
</p>
|
|
</a>
|
|
</li>
|
|
</template>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</aside>
|
|
<div class="content-wrapper">
|
|
<div class="content-header" v-if="data.bread">
|
|
<div class="container-fluid">
|
|
<div class="row mb-2">
|
|
<div class="col-sm-6">
|
|
<h1>{{data.name}}</h1>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<ol class="breadcrumb float-sm-right">
|
|
<li class="breadcrumb-item"><a href="@Url.Action(" Index","Home")">首页</a></li>
|
|
@RenderSection("bread", false)
|
|
<li class="breadcrumb-item active">@HtmlTitle</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<section class="content">
|
|
<div class="container-fluid">
|
|
<slot></slot>
|
|
</div>
|
|
</section>
|
|
<!--<a id="back-to-top" href="#" class="btn btn-primary back-to-top" role="button" aria-label="Scroll to top">
|
|
<i class="fas fa-chevron-up"></i>
|
|
</a>-->
|
|
</div>
|
|
<footer class="main-footer">
|
|
<strong>
|
|
{{data.copyright.replace('{0}',new Date().getFullYear())}}
|
|
</strong>
|
|
<div class="float-right d-none d-sm-inline-block">
|
|
<b>version: {{data.version}}</b>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data: function () {
|
|
return {
|
|
area: this.$route.query.area || 'default',
|
|
activeIndex: 1,
|
|
openKeys: ['sub1'],
|
|
url: config.baseUrl + '/IoTCenter/api/v1/site/getSite',
|
|
data: {
|
|
logo: '/images/logo.png',
|
|
copyright: '',
|
|
version: '',
|
|
username: '',
|
|
permissions: [],
|
|
roles: []
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
model: function () {
|
|
return this.$route.query.model || this.$route.query.entity;
|
|
}
|
|
},
|
|
mounted: function () {
|
|
document.querySelector('title').innerText = this.$attrs.title;
|
|
var vm = this;
|
|
axios.post(this.url).then(function (response) {
|
|
vm.data = response.data;
|
|
store.commit('setState', { key: 'permissions', value: response.data.permissions });
|
|
}).catch(function (error) {
|
|
console.log(error);
|
|
});
|
|
},
|
|
methods: {
|
|
logout() {
|
|
store.commit('logout');
|
|
setTimeout(function () {
|
|
router.push('/routes/login.html');
|
|
}, 1000);
|
|
},
|
|
toggle: function (e) {
|
|
$(e.currentTarget).parent('li').toggleClass('menu-open');
|
|
},
|
|
hasPermission(permission) {
|
|
return Enumerable.from(this.data.permissions).any(o => o == permission);
|
|
},
|
|
getPageClass() {
|
|
var cls = 'nav-link';
|
|
for (var i = 0; i < arguments.length; i++) {
|
|
if (this.$route.path == arguments[i]) {
|
|
return cls + ' active';
|
|
}
|
|
}
|
|
return cls;
|
|
},
|
|
getLinkClass(model) {
|
|
var cls = 'nav-link';
|
|
if (this.model === model) {
|
|
return cls + ' active';
|
|
}
|
|
return cls;
|
|
},
|
|
getGroupLiClass() {
|
|
return 'nav-item has-treeview' + (Enumerable.from(arguments).any(o => o === this.model) ? ' menu-open' : '');
|
|
},
|
|
getGroupLinkClass() {
|
|
return 'nav-link' + (Enumerable.from(arguments).any(o => o === this.model) ? ' active' : '');
|
|
},
|
|
getHref(port) {
|
|
return window.location.protocol + "//" + window.location.hostname + ":" + port;
|
|
}
|
|
}
|
|
}
|
|
</script> |