增加DNS同步任务状态显示

This commit is contained in:
刘祥超
2021-01-27 22:59:46 +08:00
parent 98dceb20db
commit 4c6bcc7c19
19 changed files with 353 additions and 29 deletions

View File

@@ -220,9 +220,20 @@ p.margin {
opacity: 0.8;
}
}
@keyframes rotation {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}
body .ui.menu .item .blink {
animation: blink 1s infinite;
}
body .ui.menu .item:not(:hover) span.rotate {
animation: rotation 3s infinite;
}
body.expanded .main-menu {
display: none;
}
@@ -239,9 +250,6 @@ body.expanded .main {
border: 0 !important;
background: #276ac6 !important;
}
.top-nav::-webkit-scrollbar {
height: 2px;
}
.top-nav img.avatar {
width: 1.6em !important;
height: 1.6em !important;
@@ -255,9 +263,18 @@ body.expanded .main {
font-size: 0.9em;
padding-left: 0.2em;
}
.top-nav .item .hover-span span {
display: none;
}
.top-nav .item:hover .hover-span span {
display: inline;
}
.top-nav .item.red {
color: red !important;
}
.top-nav::-webkit-scrollbar {
height: 2px;
}
/** 顶部菜单 **/
.top-secondary-menu {
position: fixed;

File diff suppressed because one or more lines are too long

View File

@@ -28,10 +28,17 @@
<div class="right menu">
<!-- 集群同步 -->
<a href="" class="item" v-if="teaCheckClusterTask && doingNodeTasks.isUpdated" @click.prevent="showNodeTasks()">
<span v-if="!doingNodeTasks.isDoing && !doingNodeTasks.hasError"><i class="icon sync"></i>已同步</span>
<span v-if="doingNodeTasks.isDoing && !doingNodeTasks.hasError"><i class="icon sync"></i>正在同步...</span>
<span v-if="doingNodeTasks.hasError" class="red"><i class="icon sync"></i>同步失败</span>
<a href="" class="item" v-if="teaCheckNodeTasks && doingNodeTasks.isUpdated" @click.prevent="showNodeTasks()">
<span v-if="!doingNodeTasks.isDoing && !doingNodeTasks.hasError" class="hover-span"><i class="icon cloud disabled"></i><span class="disabled">已同步节点</span></span>
<span v-if="doingNodeTasks.isDoing && !doingNodeTasks.hasError" class="hover-span rotate"><i class="icon cloud"></i><span>正在同步节点...</span></span>
<span v-if="doingNodeTasks.hasError" class="red"><i class="icon cloud"></i>节点同步失败</span>
</a>
<!-- DNS同步 -->
<a href="" class="item" v-if="teaCheckDNSTasks && doingDNSTasks.isUpdated" @click.prevent="showDNSTasks()">
<span v-if="!doingDNSTasks.isDoing && !doingDNSTasks.hasError" class="hover-span"><i class="icon globe disabled"></i><span class="disabled">已同步DNS</span></span>
<span v-if="doingDNSTasks.isDoing && !doingDNSTasks.hasError" class="hover-span rotate"><i class="icon globe"></i><span>正在同步DNS...</span></span>
<span v-if="doingDNSTasks.hasError" class="red"><i class="icon globe"></i>DNS同步失败</span>
</a>
<!-- 消息 -->
@@ -45,7 +52,7 @@
</a>
<!-- 退出登录 -->
<a :href="Tea.url('logout')" class="item" title="安全退出登录"><i class="icon sign out"></i>退出</a>
<a :href="Tea.url('logout')" class="item" title="安全退出登录"><i class="icon sign out"></i></a>
</div>
</div>

View File

@@ -16,6 +16,9 @@ Tea.context(function () {
// 检查集群节点同步
this.loadNodeTasks();
// 检查DNS同步
this.loadDNSTasks()
})
/**
@@ -83,6 +86,9 @@ Tea.context(function () {
}
this.loadNodeTasks = function () {
if (!Tea.Vue.teaCheckNodeTasks) {
return
}
this.$post("/clusters/tasks/check")
.success(function (resp) {
this.doingNodeTasks.isDoing = resp.data.isDoing
@@ -102,6 +108,39 @@ Tea.context(function () {
width: "50em"
})
}
/**
* DNS同步任务
*/
this.doingDNSTasks = {
isDoing: false,
hasError: false,
isUpdated: false
}
this.loadDNSTasks = function () {
if (!Tea.Vue.teaCheckDNSTasks) {
return
}
this.$post("/dns/tasks/check")
.success(function (resp) {
this.doingDNSTasks.isDoing = resp.data.isDoing
this.doingDNSTasks.hasError = resp.data.hasError
this.doingDNSTasks.isUpdated = true
})
.done(function () {
this.$delay(function () {
this.loadDNSTasks()
}, 3000)
})
}
this.showDNSTasks = function () {
teaweb.popup("/dns/tasks/listPopup", {
height: "24em",
width: "50em"
})
}
});
window.NotifySuccess = function (message, url, params) {

View File

@@ -176,10 +176,23 @@ div.margin, p.margin {
}
}
@keyframes rotation {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}
body .ui.menu .item .blink {
animation: blink 1s infinite;
}
body .ui.menu .item:not(:hover) span.rotate {
animation: rotation 3s infinite;
}
body.expanded .main-menu {
display: none;
}
@@ -197,30 +210,47 @@ body.expanded .main {
overflow-x: auto;
border: 0 !important;
background: #276ac6 !important;
img.avatar {
width: 1.6em !important;
height: 1.6em !important;
padding: 0.2em;
background: #fff;
border-radius: 0.9em;
margin-right: 0.5em !important;
}
em {
font-style: normal;
font-size: 0.9em;
padding-left: 0.2em;
}
.item {
.hover-span {
span {
display: none;
}
}
}
.item:hover {
.hover-span {
span {
display: inline;
}
}
}
.item.red {
color: red !important;
}
}
.top-nav::-webkit-scrollbar {
height: 2px;
}
.top-nav img.avatar {
width: 1.6em !important;
height: 1.6em !important;
padding: 0.2em;
background: #fff;
border-radius: 0.9em;
margin-right: 0.5em !important;
}
.top-nav em {
font-style: normal;
font-size: 0.9em;
padding-left: 0.2em;
}
.top-nav .item.red {
color: red !important;
}
/** 顶部菜单 **/
.top-secondary-menu {

View File

@@ -1,6 +1,6 @@
{$layout "layout_popup"}
<h3>正在同步的任务<span v-if="countTasks > 0">(共{{countTasks}}个)</span></h3>
<h3>正在同步的节点任务<span v-if="countTasks > 0">(共{{countTasks}}个)</span></h3>
<p class="comment" v-if="clusters.length == 0">暂时没有同步的集群。</p>
<div v-if="clusters.length > 0">
<table class="ui table selectable">

View File

@@ -0,0 +1,6 @@
h3 span {
margin-left: 0.5em;
color: grey;
font-size: 0.6em !important;
}
/*# sourceMappingURL=listPopup.css.map */

View File

@@ -0,0 +1 @@
{"version":3,"sources":["listPopup.less"],"names":[],"mappings":"AAAA,EAAG;EACF,kBAAA;EACA,WAAA;EACA,2BAAA","file":"listPopup.css"}

View File

@@ -0,0 +1,37 @@
{$layout "layout_popup"}
<h3>正在同步的DNS任务<span v-if="tasks.length > 0">(共{{tasks.length}}个)</span></h3>
<p class="comment" v-if="tasks.length == 0">暂时没有同步的集群。</p>
<div v-if="tasks.length > 0">
<table class="ui table selectable">
<thead>
<tr>
<th>对象</th>
<th>任务</th>
<th>状态</th>
<th>触发时间</th>
<th></th>
</tr>
</thead>
<tr v-for="task in tasks">
<td>
<span v-if="task.type == 'clusterChange'">{{task.cluster.name}}</span>
<span v-if="task.type == 'nodeChange'">{{task.node.name}}</span>
<span v-if="task.type == 'serverChange'">{{task.server.name}}</span>
</td>
<td>
<span v-if="task.type == 'clusterChange'">集群</span>
<span v-if="task.type == 'nodeChange'">节点</span>
<span v-if="task.type == 'serverChange'">服务</span>
</td>
<td>
<span v-if="task.isDone" class="red">{{task.error}}</span>
<span v-else>正在同步...</span>
</td>
<td>{{task.updatedTime}}</td>
<td>
<a href="" title="删除" class="remove-btn" @click.prevent="deleteTask(task.id)"><i class="icon remove small grey"></i></a>
</td>
</tr>
</table>
</div>

View File

@@ -0,0 +1,30 @@
Tea.context(function () {
this.$delay(function () {
this.reload()
})
this.reload = function () {
this.$post("$")
.success(function (resp) {
this.tasks = resp.data.tasks
})
.done(function () {
this.$delay(function () {
this.reload()
}, 3000)
})
}
this.deleteTask = function (taskId) {
let that = this
teaweb.confirm("确定要删除这个任务吗?", function () {
that.$post(".delete")
.params({
taskId: taskId
})
.success(function () {
teaweb.reload()
})
})
}
})

View File

@@ -0,0 +1,5 @@
h3 span {
margin-left: 0.5em;
color: grey;
font-size: 0.6em !important;
}