mirror of
https://github.com/TeaOSLab/EdgeAdmin.git
synced 2025-12-26 04:06:34 +08:00
实现监控节点管理
This commit is contained in:
刘祥超
49
web/views/@default/settings/monitor-nodes/index.html
Normal file
49
web/views/@default/settings/monitor-nodes/index.html
Normal file
@@ -0,0 +1,49 @@
|
||||
{$layout}
|
||||
|
||||
<first-menu>
|
||||
<a href="" class="item" @click.prevent="createNode()">[添加节点]</a>
|
||||
</first-menu>
|
||||
|
||||
<p class="comment" v-if="nodes.length == 0">暂时还没有节点。</p>
|
||||
|
||||
<table class="ui table selectable celled" v-if="nodes.length > 0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>节点名称</th>
|
||||
<th class="width6 center">版本号</th>
|
||||
<th class="width5 center">CPU</th>
|
||||
<th class="width5 center">内存</th>
|
||||
<th class="center width10">状态</th>
|
||||
<th class="two op">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr v-for="node in nodes">
|
||||
<td>{{node.name}}</td>
|
||||
<td class="center">
|
||||
<span v-if="node.status.buildVersion.length > 0">v{{node.status.buildVersion}}</span>
|
||||
<span v-else class="disabled">-</span>
|
||||
</td>
|
||||
<td class="center">
|
||||
<span v-if="node.status.isActive" :class="{red:node.status.cpuUsage > 0.80}">{{node.status.cpuUsageText}}</span>
|
||||
<span v-else class="disabled">-</span>
|
||||
</td>
|
||||
<td class="center">
|
||||
<span v-if="node.status.isActive" :class="{red:node.status.memUsage > 0.80}">{{node.status.memUsageText}}</span>
|
||||
<span v-else class="disabled">-</span>
|
||||
</td>
|
||||
<td class="center">
|
||||
<span v-if="!node.isOn"><label-on :v-is-on="node.isOn"></label-on></span>
|
||||
<div v-else-if="node.status.isActive">
|
||||
<span class="green">运行中</span>
|
||||
</div>
|
||||
<span v-else-if="node.status.updatedAt > 0" class="red">已断开</span>
|
||||
<span v-else-if="node.status.updatedAt == 0" class="red">未连接</span>
|
||||
</td>
|
||||
<td>
|
||||
<a :href="'/settings/monitorNodes/node?nodeId=' + node.id">详情</a>
|
||||
<a href="" @click.prevent="deleteNode(node.id)">删除</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="page" v-html="page"></div>
|
||||
26
web/views/@default/settings/monitor-nodes/index.js
Normal file
26
web/views/@default/settings/monitor-nodes/index.js
Normal file
@@ -0,0 +1,26 @@
|
||||
Tea.context(function () {
|
||||
// 创建节点
|
||||
this.createNode = function () {
|
||||
teaweb.popup("/settings/monitorNodes/node/createPopup", {
|
||||
width: "50em",
|
||||
height: "30em",
|
||||
callback: function () {
|
||||
teaweb.success("保存成功", function () {
|
||||
teaweb.reload()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 删除节点
|
||||
this.deleteNode = function (nodeId) {
|
||||
let that = this
|
||||
teaweb.confirm("确定要删除此节点吗？", function () {
|
||||
that.$post("/settings/monitorNodes/delete")
|
||||
.params({
|
||||
nodeId: nodeId
|
||||
})
|
||||
.refresh()
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,7 @@
|
||||
<first-menu>
|
||||
<menu-item href="/settings/monitorNodes">节点列表</menu-item>
|
||||
<span class="item">|</span>
|
||||
<menu-item :href="'/settings/monitorNodes/node?nodeId=' + node.id" code="index">"{{node.name}}"详情</menu-item>
|
||||
<menu-item :href="'/settings/monitorNodes/node/install?nodeId=' + node.id" code="install">安装节点</menu-item>
|
||||
<menu-item :href="'/settings/monitorNodes/node/update?nodeId=' + node.id" code="update">修改节点</menu-item>
|
||||
</first-menu>
|
||||
@@ -0,0 +1,34 @@
|
||||
{$layout "layout_popup"}
|
||||
|
||||
<h3>添加监控节点</h3>
|
||||
<form class="ui form" method="post" data-tea-action="$" data-tea-success="success">
|
||||
<table class="ui table selectable definition">
|
||||
<tr>
|
||||
<td class="title">节点名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="name" maxlength="100" ref="focus"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2"><more-options-indicator></more-options-indicator></td>
|
||||
</tr>
|
||||
<tbody v-show="moreOptionsVisible">
|
||||
<tr>
|
||||
<td>描述</td>
|
||||
<td>
|
||||
<textarea name="description" maxlength="200" rows="3"></textarea>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>是否启用</td>
|
||||
<td>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="isOn" value="1" checked="checked"/>
|
||||
<label></label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
@@ -0,0 +1,3 @@
|
||||
Tea.context(function () {
|
||||
|
||||
})
|
||||
24
web/views/@default/settings/monitor-nodes/node/index.html
Normal file
24
web/views/@default/settings/monitor-nodes/node/index.html
Normal file
@@ -0,0 +1,24 @@
|
||||
{$layout}
|
||||
{$template "menu"}
|
||||
|
||||
<table class="ui table selectable definition">
|
||||
<tr>
|
||||
<td class="title">节点名称</td>
|
||||
<td>
|
||||
{{node.name}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>状态</td>
|
||||
<td>
|
||||
<label-on :v-is-on="node.isOn"></label-on>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>描述</td>
|
||||
<td>
|
||||
<span v-if="node.description.length > 0">{{node.description}}</span>
|
||||
<span v-else class="disabled">暂时还没有描述。</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
23
web/views/@default/settings/monitor-nodes/node/install.html
Normal file
23
web/views/@default/settings/monitor-nodes/node/install.html
Normal file
@@ -0,0 +1,23 @@
|
||||
{$layout}
|
||||
{$template "menu"}
|
||||
|
||||
<h3>安装步骤</h3>
|
||||
<ol class="ui list">
|
||||
<li>按照下面的配置信息替换<code-label>configs/api.yaml</code-label>内容</li>
|
||||
<li>使用<code-label>bin/edge-monitor start</code-label>启动节点</li>
|
||||
<li>可以在<code-label>logs/run.log</code-label>中查看启动是否有异常</li>
|
||||
</ol>
|
||||
|
||||
<div class="ui divider"></div>
|
||||
<h3>配置信息</h3>
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">configs/api.yaml<em><br/><download-link :v-element="'api-code'" :v-file="'api.yaml'">[下载]</download-link></em></td>
|
||||
<td>
|
||||
<pre id="api-code">rpc:
|
||||
endpoints: [ {{apiEndpoints}} ]
|
||||
nodeId: "{{node.uniqueId}}"
|
||||
secret: "{{node.secret}}"</pre>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
37
web/views/@default/settings/monitor-nodes/node/update.html
Normal file
37
web/views/@default/settings/monitor-nodes/node/update.html
Normal file
@@ -0,0 +1,37 @@
|
||||
{$layout}
|
||||
|
||||
{$template "menu"}
|
||||
|
||||
<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
|
||||
<input type="hidden" name="nodeId" :value="node.id"/>
|
||||
<input type="hidden" name="sslPolicyId" :value="node.sslPolicyId"/>
|
||||
<table class="ui table selectable definition">
|
||||
<tr>
|
||||
<td class="title">节点名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="name" maxlength="100" ref="focus" v-model="node.name"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2"><more-options-indicator></more-options-indicator></td>
|
||||
</tr>
|
||||
<tbody v-show="moreOptionsVisible">
|
||||
<tr>
|
||||
<td>描述</td>
|
||||
<td>
|
||||
<textarea name="description" maxlength="200" rows="3" v-model="node.description"></textarea>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>是否启用</td>
|
||||
<td>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="isOn" value="1" v-model="node.isOn"/>
|
||||
<label></label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
3
web/views/@default/settings/monitor-nodes/node/update.js
Normal file
3
web/views/@default/settings/monitor-nodes/node/update.js
Normal file
@@ -0,0 +1,3 @@
|
||||
Tea.context(function () {
|
||||
this.success = NotifySuccess("保存成功", "/settings/monitorNodes/node?nodeId=" + this.node.id)
|
||||
})
|
||||
Reference in New Issue
Block a user