parent
6c430e7835
commit
538b2711e8
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
@ -0,0 +1,15 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>${title?default("管理系统")}</title>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
|
||||||
|
<script src="${context}/static/dist/lib.min.js" type="text/javascript"></script>
|
||||||
|
<script src="${context}/static/dist/index.min.js" type="text/javascript"></script>
|
||||||
|
<link href="${context}/static/dist/index.min.css" rel="stylesheet"/>
|
||||||
|
<link href="${context}/static/css/base.css" rel="stylesheet"/>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<#include controlHolder("nav")/>
|
||||||
|
<#include screenHolder()/>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -0,0 +1,232 @@
|
|||||||
|
<div id="app" v-cloak>
|
||||||
|
<el-card class="box-card control">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="3">
|
||||||
|
<a>Nginx 控制中心</a>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="5">
|
||||||
|
<a @click="nginxStart">
|
||||||
|
<el-image v-if="run" :src="'${UrlUtil.getUrl('/static/img/start_.png')}'"
|
||||||
|
style="width: 50px; height: 50px"
|
||||||
|
fit="fill"></el-image>
|
||||||
|
<el-image v-if="!run" :src="'${UrlUtil.getUrl('/static/img/start.png')}'"
|
||||||
|
style="width: 50px; height: 50px"
|
||||||
|
fit="fill"></el-image>
|
||||||
|
</a>
|
||||||
|
<a @click="nginxStop">
|
||||||
|
<el-image v-if="run" :src="'${UrlUtil.getUrl('/static/img/stop.png')}'"
|
||||||
|
style="width: 50px; height: 50px"
|
||||||
|
fit="fill"></el-image>
|
||||||
|
<el-image v-if="!run" :src="'${UrlUtil.getUrl('/static/img/stop_.png')}'"
|
||||||
|
style="width: 50px; height: 50px"
|
||||||
|
fit="fill"></el-image>
|
||||||
|
</a>
|
||||||
|
<a @click="nginxReload">
|
||||||
|
<el-image v-if="run" :src="'${UrlUtil.getUrl('/static/img/reload.png')}'"
|
||||||
|
style="width: 50px; height: 50px"
|
||||||
|
fit="fill"></el-image>
|
||||||
|
<el-image v-if="!run" :src="'${UrlUtil.getUrl('/static/img/reload_.png')}'"
|
||||||
|
style="width: 50px; height: 50px"
|
||||||
|
fit="fill"></el-image>
|
||||||
|
</a>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<el-card class="box-card pane-list" style="width: 260px;height: 140px" v-for="item in services">
|
||||||
|
<div class="pane">
|
||||||
|
<div class="img">
|
||||||
|
<el-image style="width: 60px;height:60px" src="/static/img/http.png"></el-image>
|
||||||
|
|
||||||
|
<a>{{item.title}}</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info">
|
||||||
|
<el-switch
|
||||||
|
v-model="item.valid"
|
||||||
|
active-color="#13ce66"
|
||||||
|
active-text="启用"
|
||||||
|
inactive-text="暂停">
|
||||||
|
inactive-color="#ff4949">
|
||||||
|
</el-switch>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="more" @click="toSet(item)">
|
||||||
|
<el-button type="text" size="mini"><i class="el-icon-s-operation"></i></el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
<style>
|
||||||
|
#app {
|
||||||
|
padding: 10px;
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 1080px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box-card {
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control a:first-child {
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control a {
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 50px;
|
||||||
|
height: 50px;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control a:hover {
|
||||||
|
background: #e7e7e7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control a:first-child:hover {
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane-list {
|
||||||
|
box-shadow: 0 0 0 0 inset !important;
|
||||||
|
-webkit-box-shadow: 0 0 0 0 inset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane-list:hover {
|
||||||
|
box-shadow: 0 0 70px -40px inset !important;
|
||||||
|
-webkit-box-shadow: 0 0 70px -40px inset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane {
|
||||||
|
width: 240px;
|
||||||
|
height: 120px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 15px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane .img {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane a {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 28px;
|
||||||
|
font-family: "微软雅黑";
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane .info {
|
||||||
|
flex-grow: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pane .more {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script>
|
||||||
|
var app = new Vue({
|
||||||
|
mixins: [mixinBase, mixinForMgr],
|
||||||
|
el: "#app",
|
||||||
|
data: {
|
||||||
|
services: [],
|
||||||
|
run: ${run?default('false')}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onLoadService: function () {
|
||||||
|
var param = {
|
||||||
|
pageSize: 0
|
||||||
|
};
|
||||||
|
new Ajax("admin", "services", "find").post(param, function (response) {
|
||||||
|
if (response.errors.length > 0) {
|
||||||
|
nav.e(response.errors[0].message);
|
||||||
|
} else {
|
||||||
|
this.services = response.result;
|
||||||
|
}
|
||||||
|
}.bind(this))
|
||||||
|
},
|
||||||
|
toSet: function (item) {
|
||||||
|
nav.openTab({
|
||||||
|
title: '映射配置',
|
||||||
|
name: 'mapping' + item.id,
|
||||||
|
url: '/admin/locations.htm?servicesId=' + item.id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
startMonitor: function () {
|
||||||
|
if (window.EventSource) {
|
||||||
|
window.evtSource = new EventSource('${UrlUtil.getUrl("/sse/1")}');
|
||||||
|
window.evtSource.addEventListener('message', function (e) {
|
||||||
|
|
||||||
|
var msg = JSON.parse(e.data);
|
||||||
|
if (msg.type == 'NGINX_STATE') {//状态推送
|
||||||
|
if (this.run != msg.object.run) {
|
||||||
|
|
||||||
|
this.$notify.info({
|
||||||
|
title: '提示',
|
||||||
|
message: "Nginx 运行状态发生变化。",
|
||||||
|
duration: 5000
|
||||||
|
});
|
||||||
|
this.run = msg.object.run;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}.bind(this))
|
||||||
|
}
|
||||||
|
},
|
||||||
|
nginxStart: function () {
|
||||||
|
new Ajax("conf", "nginx", "start").post(function (response) {
|
||||||
|
if (response.errors.length > 0) {
|
||||||
|
nav.e(response.errors[0].message);
|
||||||
|
} else {
|
||||||
|
this.onFind();
|
||||||
|
this.form.dialog = false;
|
||||||
|
}
|
||||||
|
}.bind(this))
|
||||||
|
},
|
||||||
|
nginxStop: function () {
|
||||||
|
new Ajax("conf", "nginx", "stop").post(function (response) {
|
||||||
|
if (response.errors.length > 0) {
|
||||||
|
nav.e(response.errors[0].message);
|
||||||
|
} else {
|
||||||
|
this.onFind();
|
||||||
|
this.form.dialog = false;
|
||||||
|
}
|
||||||
|
}.bind(this))
|
||||||
|
},
|
||||||
|
configFlush: function () {
|
||||||
|
ajax.configFlush();
|
||||||
|
},
|
||||||
|
onRefresh: function () {
|
||||||
|
this.configFlush();
|
||||||
|
this.onFind();
|
||||||
|
},
|
||||||
|
nginxReload: function () {
|
||||||
|
new Ajax("conf", "nginx", "reload").post(function (response) {
|
||||||
|
if (response.errors.length > 0) {
|
||||||
|
nav.e(response.errors[0].message);
|
||||||
|
} else {
|
||||||
|
|
||||||
|
}
|
||||||
|
}.bind(this))
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted: function () {
|
||||||
|
this.onLoadService();
|
||||||
|
this.startMonitor();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
Loading…
Reference in new issue