You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@shardingsphere.apache.org by zh...@apache.org on 2020/07/21 06:44:14 UTC
[shardingsphere-elasticjob-ui] 18/26: Server dimension
operationServers Module
This is an automated email from the ASF dual-hosted git repository.
zhangliang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/shardingsphere-elasticjob-ui.git
commit b6345a91656b0c2d18222cad09ae064857f9d7ae
Author: renfufei <re...@huobi.com>
AuthorDate: Tue Jul 21 00:00:49 2020 +0800
Server dimension operationServers Module
---
.../src/lang/en-US.js | 27 ++-
.../src/lang/zh-CN.js | 27 ++-
.../src/router/index.js | 6 +
.../src/views/operation-servers/api.js | 35 +++
.../src/views/operation-servers/index.vue | 33 +++
.../operation-servers/module/operationServers.vue | 252 +++++++++++++++++++++
6 files changed, 378 insertions(+), 2 deletions(-)
diff --git a/shardingsphere-elasticjob-ui-frontend/src/lang/en-US.js b/shardingsphere-elasticjob-ui-frontend/src/lang/en-US.js
index 2a57981..6c88fa7 100644
--- a/shardingsphere-elasticjob-ui-frontend/src/lang/en-US.js
+++ b/shardingsphere-elasticjob-ui-frontend/src/lang/en-US.js
@@ -211,7 +211,32 @@ export default {
disable: 'Disable',
enable: 'Enable',
shutdown: 'Shutdown',
- remove: 'Remove',
+ remove: 'Remove'
+ }
+ },
+ operationServers: {
+ labelInfo: {
+ serverIp: 'Server IP',
+ instancesNum: 'Instance count',
+ jobsNum: 'Job num',
+ disabledJobsNum: 'Disabled jobs num',
+ jobName: 'Job name',
+ status: 'Status',
+ operate: 'Operation'
+ },
+ statusText: {
+ OK: 'Enabled',
+ DISABLED: 'Disabled',
+ CRASHED: 'Crashed',
+ PENDING: 'Staging',
+ SHARDING_FLAG: 'SHARDING_FLAG'
+ },
+ actionText: {
+ detail: 'Detail',
+ disable: 'Disable',
+ enable: 'Enable',
+ shutdown: 'Shutdown',
+ remove: 'Remove'
}
},
help: {
diff --git a/shardingsphere-elasticjob-ui-frontend/src/lang/zh-CN.js b/shardingsphere-elasticjob-ui-frontend/src/lang/zh-CN.js
index 03fa557..373e0a5 100644
--- a/shardingsphere-elasticjob-ui-frontend/src/lang/zh-CN.js
+++ b/shardingsphere-elasticjob-ui-frontend/src/lang/zh-CN.js
@@ -211,7 +211,32 @@ export default {
disable: '失效',
enable: '生效',
shutdown: '终止',
- remove: '删除',
+ remove: '删除'
+ }
+ },
+ operationServers: {
+ labelInfo: {
+ serverIp: '服务器IP',
+ instancesNum: '运行实例数',
+ jobsNum: '作业总数',
+ disabledJobsNum: '禁用作业数',
+ jobName: '作业名称',
+ status: '状态',
+ operate: '操作'
+ },
+ statusText: {
+ OK: '已启用',
+ DISABLED: '已失效',
+ CRASHED: '已下线',
+ PENDING: '等待运行',
+ SHARDING_FLAG: '分片待调整'
+ },
+ actionText: {
+ detail: '详情',
+ disable: '失效',
+ enable: '生效',
+ shutdown: '终止',
+ remove: '删除'
}
},
help: {
diff --git a/shardingsphere-elasticjob-ui-frontend/src/router/index.js b/shardingsphere-elasticjob-ui-frontend/src/router/index.js
index c0f3516..47a4cb5 100644
--- a/shardingsphere-elasticjob-ui-frontend/src/router/index.js
+++ b/shardingsphere-elasticjob-ui-frontend/src/router/index.js
@@ -51,6 +51,12 @@ export const constantRouterMap = [
name: 'Operation-jobs-detail'
},
{
+ path: '/operation-servers',
+ component: () => import('@/views/operation-servers'),
+ hidden: true,
+ name: 'Operation-servers'
+ },
+ {
path: '/job-help',
component: () => import('@/views/help'),
hidden: true,
diff --git a/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/api.js b/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/api.js
new file mode 100644
index 0000000..94cdf89
--- /dev/null
+++ b/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/api.js
@@ -0,0 +1,35 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import API from '@/utils/api'
+
+export default {
+ getAllServersBriefInfo: (params = {}) => API.get(`/api/servers`, params),
+ getServersTotalCount: (params = {}) => API.get(`/api/servers/count`, params),
+
+ disableServer: (params = {}) => API.post('/api/servers/' + params.serverIp + '/disable'),
+ enableServer: (params = {}) => API.post('/api/servers/' + params.serverIp + '/enable'),
+ shutdownServer: (params = {}) => API.post('/api/servers/' + params.serverIp + '/shutdown'),
+ removeServer: (params = {}) => API.delete('/api/servers/' + params.serverIp + ""),
+
+ getJobs: (params = {}) => API.get('/api/servers/' + params.serverIp + '/jobs'),
+ disableServerJob: (params) => API.post('/api/servers/' + params.serverIp + '/jobs/' + params.jobName + '/disable'),
+ enableServerJob: (params) => API.post('/api/servers/' + params.serverIp + '/jobs/' + params.jobName + '/enable'),
+ shutdownServerJob: (params) => API.post('/api/servers/' + params.serverIp + '/jobs/' + params.jobName + '/shutdown'),
+ removeServerJob: (params) => API.post('/api/servers/' + params.serverIp + '/jobs/' + params.jobName + '')
+
+}
diff --git a/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/index.vue b/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/index.vue
new file mode 100644
index 0000000..7e122a1
--- /dev/null
+++ b/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/index.vue
@@ -0,0 +1,33 @@
+<!--
+ - Licensed to the Apache Software Foundation (ASF) under one or more
+ - contributor license agreements. See the NOTICE file distributed with
+ - this work for additional information regarding copyright ownership.
+ - The ASF licenses this file to You under the Apache License, Version 2.0
+ - (the "License"); you may not use this file except in compliance with
+ - the License. You may obtain a copy of the License at
+ -
+ - http://www.apache.org/licenses/LICENSE-2.0
+ -
+ - Unless required by applicable law or agreed to in writing, software
+ - distributed under the License is distributed on an "AS IS" BASIS,
+ - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ - See the License for the specific language governing permissions and
+ - limitations under the License.
+ -->
+
+<template>
+ <s-operation-servers />
+</template>
+
+<script>
+import SOperationServers from './module/operationServers'
+export default {
+ name: 'OperationServers',
+ components: {
+ SOperationServers
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/module/operationServers.vue b/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/module/operationServers.vue
new file mode 100644
index 0000000..1d4dc8f
--- /dev/null
+++ b/shardingsphere-elasticjob-ui-frontend/src/views/operation-servers/module/operationServers.vue
@@ -0,0 +1,252 @@
+<!--
+ - Licensed to the Apache Software Foundation (ASF) under one or more
+ - contributor license agreements. See the NOTICE file distributed with
+ - this work for additional information regarding copyright ownership.
+ - The ASF licenses this file to You under the Apache License, Version 2.0
+ - (the "License"); you may not use this file except in compliance with
+ - the License. You may obtain a copy of the License at
+ -
+ - http://www.apache.org/licenses/LICENSE-2.0
+ -
+ - Unless required by applicable law or agreed to in writing, software
+ - distributed under the License is distributed on an "AS IS" BASIS,
+ - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ - See the License for the specific language governing permissions and
+ - limitations under the License.
+ -->
+
+<template>
+ <el-row class="box-card">
+ <div class="btn-group pull-right" style="float: right;">
+ <el-input
+ v-model="searchForm.serverIp"
+ placeholder="Search"
+ clearable
+ @clear="search"
+ @change="search"
+ autocomplete="off" >
+ <i slot="prefix" class="el-input__icon el-icon-search"></i>
+ <el-button slot="append" icon="el-icon-search"
+ @click="search"></el-button>
+ </el-input>
+ </div>
+ <div class="table-wrap">
+ <el-table
+ :data="tableData"
+ stripe
+ border
+ style="width: 100%">
+ <el-table-column
+ v-for="(item, index) in column"
+ :key="index"
+ :prop="item.prop"
+ :label="item.label"
+ :width="item.width"
+ >
+ <template slot-scope="scope">
+ <span v-if="'status'!==item.prop">{{ scope.row[item.prop] }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column
+ :label="$t('operationServers.labelInfo.operate')"
+ fixed="right" width="300">
+ <template slot-scope="scope">
+ <el-button-group>
+ <el-button
+ size="mini"
+ type="info"
+ v-if="scope.row.instancesNum"
+ @click="handleDetail(scope.row)"
+ plain>{{ $t("operationServers.actionText.detail") }}</el-button>
+ <el-button
+ size="mini"
+ type="success"
+ :disabled="isGuest"
+ v-if="scope.row.instancesNum && scope.row.disabledJobsNum"
+ @click="handleEnable(scope.row)"
+ plain>{{ $t("operationServers.actionText.enable") }}</el-button>
+ <el-button
+ size="mini"
+ type="warning"
+ :disabled="isGuest"
+ v-if="0===scope.row.disabledJobsNum && scope.row.instancesNum"
+ @click="handleDisable(scope.row)"
+ plain>{{ $t("operationServers.actionText.disable") }}</el-button>
+ <el-button
+ size="mini"
+ type="danger"
+ :disabled="isGuest"
+ v-if="scope.row.instancesNum"
+ @click="handleShutdown(scope.row)"
+ plain>{{ $t("operationServers.actionText.shutdown") }}</el-button>
+ <el-button
+ size="mini"
+ type="danger"
+ icon="el-icon-delete"
+ :disabled="isGuest"
+ v-if="0===scope.row.instancesNum"
+ @click="handlerRemove(scope.row)"
+ plain>{{ $t("operationServers.actionText.remove") }}</el-button>
+ </el-button-group>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pagination">
+ <el-pagination
+ :total="total"
+ :current-page="currentPage"
+ background
+ layout="prev, pager, next"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </el-row>
+</template>
+<script>
+import { mapActions } from 'vuex'
+import clone from 'lodash/clone'
+import API from '../api'
+export default {
+ name: 'OperationServers',
+ data() {
+ return {
+ isGuest: window.localStorage.getItem('isGuest') == 'true',
+ column: [
+ {
+ label: this.$t('operationServers').labelInfo.serverIp,
+ prop: 'serverIp',
+ width : 200
+ },
+ {
+ label: this.$t('operationServers').labelInfo.instancesNum,
+ prop: 'instancesNum',
+ width : 180
+ },
+ {
+ label: this.$t('operationServers').labelInfo.jobsNum,
+ prop: 'jobsNum',
+ width : 160
+ },
+ {
+ label: this.$t('operationServers').labelInfo.disabledJobsNum,
+ prop: 'disabledJobsNum',
+ width : 160
+ }
+ ],
+ searchForm: {
+ serverIp: ''
+ },
+ tableData: [],
+ cloneTableData: [],
+ currentPage: 1,
+ pageSize: 10,
+ total: 0
+ }
+ },
+ created() {
+ this.search()
+ },
+ methods: {
+ ...mapActions(['setRegCenterActivated']),
+ handleCurrentChange(val) {
+ const data = clone(this.cloneTableData)
+ this.currentPage = val
+ this.tableData = data.splice(this.pageSize*(val - 1), this.pageSize)
+ },
+ getAllServersBriefInfo() {
+ var params = {
+ }
+ API.getAllServersBriefInfo(params).then(res => {
+ const data = Array.prototype.filter.call(res.model, this.filterSearchData)
+ this.total = data.length
+ this.cloneTableData = clone(data)
+ this.tableData = data.splice(this.pageSize*(this.currentPage - 1), this.pageSize)
+ })
+ },
+ filterSearchData(model) {
+ if(!this.searchForm.serverIp){
+ return true;
+ }
+ if(!model){
+ return true;
+ }
+ return model.serverIp && model.serverIp.toLowerCase().includes(this.searchForm.serverIp.toLowerCase());
+ },
+ handleDetail(row) {
+ const params = {
+ serverIp: row.serverIp
+ }
+ localStorage.setItem("/operation-servers/status-detail/serverIp", params.serverIp);
+ this.$router.push({path: '/operation-servers/status-detail', params: params })
+ },
+ handleEnable(row) {
+ const params = {
+ serverIp: row.serverIp
+ }
+ API.enableServer(params).then(res => {
+ this.$notify({
+ title: this.$t('common').notify.title,
+ message: this.$t('common').notify.actionSucMessage,
+ type: 'success'
+ })
+ this.search()
+ })
+ },
+ handleDisable(row) {
+ const params = {
+ serverIp: row.serverIp
+ }
+ API.disableServer(params).then(res => {
+ this.$notify({
+ title: this.$t('common').notify.title,
+ message: this.$t('common').notify.actionSucMessage,
+ type: 'success'
+ })
+ this.search()
+ })
+ },
+ handleShutdown(row) {
+ const params = {
+ serverIp: row.serverIp
+ }
+ API.shutdownServer(params).then(res => {
+ this.$notify({
+ title: this.$t('common').notify.title,
+ message: this.$t('common').notify.actionSucMessage,
+ type: 'success'
+ })
+ this.search()
+ })
+ },
+ handlerRemove(row) {
+ const params = {
+ serverIp: row.serverIp
+ }
+ API.removeServer(params).then(res => {
+ this.$notify({
+ title: this.$t('common').notify.title,
+ message: this.$t('common').notify.delSucMessage,
+ type: 'success'
+ })
+ this.search()
+ })
+ },
+ search() {
+ this.getAllServersBriefInfo()
+ }
+ }
+}
+</script>
+<style lang='scss' scoped>
+.btn-group {
+ margin-bottom: 20px;
+}
+.pagination {
+ float: right;
+ margin: 10px -10px 10px 0;
+}
+.el-form .el-col{
+ padding-left: 4px;
+}
+</style>