This is an automated email from the ASF dual-hosted git repository.
menghaoran pushed a commit to branch master
in repository
https://gitbox.apache.org/repos/asf/shardingsphere-elasticjob-ui.git
The following commit(s) were added to refs/heads/master by this push:
new 1d16b51 Format the code in a good style
new f5ba75e Merge pull request #19 from cncounter/master
1d16b51 is described below
commit 1d16b51cb57171059e9391e1b6f63da80857a407
Author: renfufei <[email protected]>
AuthorDate: Mon Jul 27 19:44:16 2020 +0800
Format the code in a good style
---
.../src/lang/en-US.js | 4 +-
.../src/lang/zh-CN.js | 2 +-
.../src/views/app-config/module/appConfig.vue | 56 +--
.../src/views/job-config/module/jobConfig.vue | 528 ++++++++++-----------
.../src/views/job-detail/module/jobDetail.vue | 474 +++++++++---------
.../src/views/job-status/module/jobStatus.vue | 339 ++++++-------
6 files changed, 714 insertions(+), 689 deletions(-)
diff --git
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/en-US.js
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/en-US.js
index b9555f6..4fc521f 100644
---
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/en-US.js
+++
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/en-US.js
@@ -162,7 +162,7 @@ export default {
operateModify: 'Update',
operateDisable: 'Disable',
operateEnable: 'Enable',
- operateDel: 'Del',
+ operateDel: 'Del'
},
rules: {
appName: 'Please input app name',
@@ -235,7 +235,7 @@ export default {
tab: {
running: 'Running tasks',
ready: 'Ready jobs',
- failover: 'Failover tasks',
+ failover: 'Failover tasks'
},
labelInfo: {
id: 'Task ID',
diff --git
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/zh-CN.js
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/zh-CN.js
index c37a945..98b56e1 100644
---
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/zh-CN.js
+++
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/lang/zh-CN.js
@@ -235,7 +235,7 @@ export default {
tab: {
running: '运行任务',
ready: '待运行任务',
- failover: '待失效转移任务',
+ failover: '待失效转移任务'
},
labelInfo: {
id: '任务主键',
diff --git
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/app-config/module/appConfig.vue
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/app-config/module/appConfig.vue
index 2f236dd..f2b0daa 100644
---
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/app-config/module/appConfig.vue
+++
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/app-config/module/appConfig.vue
@@ -38,30 +38,30 @@
<el-table-column :label="$t('appConfig.table.operate')" fixed="right"
width="300">
<template slot-scope="scope">
<el-button-group>
- <el-button
- size="mini"
- type="primary"
- :disabled="isGuest"
- @click="handleDetail(scope.row)"
- plain>{{ $t("appConfig.table.operateDetail") }}</el-button>
- <el-button
- size="mini"
- type="primary"
- :disabled="isGuest"
- @click="handleModify(scope.row)"
- plain>{{ $t("appConfig.table.operateModify") }}</el-button>
- <el-button
- size="mini"
- type="primary"
- :disabled="isGuest"
- @click="handleDelete(scope.row)"
- plain>{{ $t("appConfig.table.operateDel") }}</el-button>
- <el-button
- size="mini"
- type="primary"
- :disabled="isGuest"
- @click="handleDisable(scope.row)"
- plain>{{ scope.row.disabled ?
$t("appConfig.table.operateEnable") :
$t("appConfig.table.operateDisable")}}</el-button>
+ <el-button
+ :disabled="isGuest"
+ size="mini"
+ type="primary"
+ plain
+ @click="handleDetail(scope.row)">{{
$t("appConfig.table.operateDetail") }}</el-button>
+ <el-button
+ :disabled="isGuest"
+ size="mini"
+ type="primary"
+ plain
+ @click="handleModify(scope.row)">{{
$t("appConfig.table.operateModify") }}</el-button>
+ <el-button
+ :disabled="isGuest"
+ size="mini"
+ type="primary"
+ plain
+ @click="handleDelete(scope.row)">{{
$t("appConfig.table.operateDel") }}</el-button>
+ <el-button
+ :disabled="isGuest"
+ size="mini"
+ type="primary"
+ plain
+ @click="handleDisable(scope.row)">{{ scope.row.disabled ?
$t("appConfig.table.operateEnable") : $t("appConfig.table.operateDisable")
}}</el-button>
</el-button-group>
</template>
</el-table-column>
@@ -169,8 +169,8 @@
<el-input
:placeholder="$t('appConfig.rules.eventTraceSamplingCount')"
v-model="editForm.eventTraceSamplingCount"
- autocomplete="off"
:disabled="!isEdit"
+ autocomplete="off"
/>
</el-form-item>
<el-form-item :label="$t('appConfig.addDialog.appURL')" prop="appURL">
@@ -390,7 +390,7 @@ export default {
})
},
handleDelete(row) {
- API.delete({'appName': row.appName}).then(res => {
+ API.delete({ 'appName': row.appName }).then(res => {
this.$notify({
title: this.$t('common').notify.title,
message: this.$t('common').notify.delSucMessage,
@@ -401,7 +401,7 @@ export default {
},
handleDisable(row) {
if (row.disabled) {
- API.enable({'appName': row.appName}).then(res => {
+ API.enable({ 'appName': row.appName }).then(res => {
this.$notify({
title: this.$t('common').notify.title,
message: this.$t('appConfig').tips.enableSuccess,
@@ -410,7 +410,7 @@ export default {
this.getApp()
})
} else {
- API.disable({'appName': row.appName}).then(res => {
+ API.disable({ 'appName': row.appName }).then(res => {
this.$notify({
title: this.$t('common').notify.title,
message: this.$t('appConfig').tips.disableSuccess,
diff --git
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-config/module/jobConfig.vue
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-config/module/jobConfig.vue
index b5c310e..0971b3d 100644
---
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-config/module/jobConfig.vue
+++
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-config/module/jobConfig.vue
@@ -19,36 +19,34 @@
<el-row class="box-card">
<el-form :model="searchForm" class="demo-form-inline">
<el-form-item>
- <el-col :span="4">
+ <el-col :span="4">
+ <el-button
+ :disabled="isGuest"
+ class="btn-plus"
+ type="primary"
+ icon="el-icon-plus"
+ @click="handleAdd">{{ $t("jobConfig.labelInfo.addBtnText")
}}</el-button>
+ </el-col>
+ <el-col :span="14">
+
+ </el-col>
+ <el-col :span="6">
+ <el-input
+ v-model="searchForm.jobName"
+ placeholder="Search"
+ clearable
+ autocomplete="off"
+ @clear="search"
+ @change="search">
+ <i slot="prefix" class="el-input__icon el-icon-search"></i>
<el-button
- :disabled="isGuest"
- class="btn-plus"
- type="primary"
- icon="el-icon-plus"
- @click="handleAdd"
- >{{ $t("jobConfig.labelInfo.addBtnText") }}</el-button>
- </el-col>
- <el-col :span="14">
-
- </el-col>
- <el-col :span="6">
- <el-input
- v-model="searchForm.jobName"
- 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>
- </el-col>
- </el-form-item>
+ slot="append"
+ icon="el-icon-search"
+ @click="search"></el-button>
+ </el-input>
+ </el-col>
+ </el-form-item>
</el-form>
- <div class="btn-group pull-right" style="float: right;">
-
- </div>
<div class="table-wrap">
<el-table
:data="tableData"
@@ -60,49 +58,49 @@
:key="index"
:prop="item.prop"
:label="item.label"
- :width="item.width"
- >
- <template slot-scope="scope">
- <span>{{ scope.row[item.prop] }}</span>
- </template>
+ :width="item.width">
+ <template slot-scope="scope">
+ <span>{{ scope.row[item.prop] }}</span>
+ </template>
</el-table-column>
<el-table-column
:label="$t('jobConfig.labelInfo.operate')"
- fixed="right" width="300">
+ fixed="right"
+ width="300">
<template slot-scope="scope">
<el-button-group>
<el-button
size="mini"
type="info"
- @click="handleDetail(scope.row)"
- plain>{{ $t("jobConfig.actionText.detail") }}</el-button>
+ plain
+ @click="handleDetail(scope.row)">{{
$t("jobConfig.actionText.detail") }}</el-button>
<el-button
+ :disabled="isGuest"
size="mini"
type="primary"
- :disabled="isGuest"
- @click="handleModify(scope.row)"
- plain>{{ $t("jobConfig.actionText.modify") }}</el-button>
+ plain
+ @click="handleModify(scope.row)">{{
$t("jobConfig.actionText.modify") }}</el-button>
<el-button
+ :disabled="isGuest"
size="mini"
type="danger"
icon="el-icon-delete"
- :disabled="isGuest"
- @click="handlerRemove(scope.row)"
- plain>{{ $t("jobConfig.actionText.remove") }}</el-button>
+ plain
+ @click="handlerRemove(scope.row)">{{
$t("jobConfig.actionText.remove") }}</el-button>
<el-button
+ v-if="scope.row.disabled"
+ :disabled="isGuest"
size="mini"
type="success"
- :disabled="isGuest"
- v-if="scope.row.disabled"
- @click="handleEnable(scope.row)"
- plain>{{ $t("jobConfig.actionText.enable") }}</el-button>
+ plain
+ @click="handleEnable(scope.row)">{{
$t("jobConfig.actionText.enable") }}</el-button>
<el-button
+ v-if="!scope.row.disabled"
+ :disabled="isGuest"
size="mini"
type="warning"
- :disabled="isGuest"
- v-if="!scope.row.disabled"
- @click="handleDisable(scope.row)"
- plain>{{ $t("jobConfig.actionText.disable") }}</el-button>
+ plain
+ @click="handleDisable(scope.row)">{{
$t("jobConfig.actionText.disable") }}</el-button>
</el-button-group>
</template>
</el-table-column>
@@ -120,188 +118,185 @@
<el-dialog
:title="editTitle"
:visible.sync="modifyDialogVisible"
- width="1010px"
- >
+ width="1010px">
<el-form ref="editForm" :model="editForm" :rules="rules"
label-width="40px">
<el-form-item prop="jobName">
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.jobName') }}
- </el-col>
- <el-col :span="7">
- <el-input
- v-model="editForm.jobName"
- :disabled="editForm.editMode"
- :placeholder="$t('jobConfig.rules.jobName')"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.cron') }}
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="7">
- <el-input
- v-model="editForm.cron"
- :placeholder="$t('jobConfig.rules.cron')"
- autocomplete="off"
- />
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.jobName') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="editForm.jobName"
+ :disabled="editForm.editMode"
+ :placeholder="$t('jobConfig.rules.jobName')"
+ autocomplete="off"/>
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.cron') }}
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="editForm.cron"
+ :placeholder="$t('jobConfig.rules.cron')"
+ autocomplete="off"/>
+ </el-col>
</el-form-item>
<el-form-item prop="appName">
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.appName') }}
- </el-col>
- <el-col :span="7">
- <el-input
- v-model="editForm.appName"
- :disabled="editForm.editMode"
- :placeholder="$t('jobConfig.rules.appName')"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.jobExecutionType') }}
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="7">
- <el-select v-model="editForm.jobExecutionType"
- :placeholder="$t('jobConfig.rules.jobExecutionType')">
- <el-option
- v-for="item in jobExecutionTypeOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value">
- </el-option>
- </el-select>
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.appName') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="editForm.appName"
+ :disabled="editForm.editMode"
+ :placeholder="$t('jobConfig.rules.appName')"
+ autocomplete="off"/>
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.jobExecutionType') }}
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="7">
+ <el-select
+ v-model="editForm.jobExecutionType"
+ :placeholder="$t('jobConfig.rules.jobExecutionType')">
+ <el-option
+ v-for="item in jobExecutionTypeOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ </el-col>
</el-form-item>
<el-form-item prop="shardingTotalCount">
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.shardingTotalCount') }}
- </el-col>
- <el-col :span="8">
- <el-input-number
- :placeholder="$t('jobConfig.labelInfo.shardingTotalCount')"
- v-model="editForm.shardingTotalCount"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.jobParameter') }}
- </el-col>
- <el-col :span="8">
- <el-input
- :placeholder="$t('jobConfig.labelInfo.jobParameter')"
- v-model="editForm.jobParameter"
- autocomplete="off"
- />
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.shardingTotalCount') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input-number
+ :placeholder="$t('jobConfig.labelInfo.shardingTotalCount')"
+ v-model="editForm.shardingTotalCount"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.jobParameter') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ :placeholder="$t('jobConfig.labelInfo.jobParameter')"
+ v-model="editForm.jobParameter"
+ autocomplete="off"
+ />
+ </el-col>
</el-form-item>
<el-form-item prop="cpuCount">
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.cpuCount') }}
- </el-col>
- <el-col :span="8">
- <el-input-number
- :placeholder="$t('jobConfig.labelInfo.cpuCount')"
- :precision="3"
- :step="0.001"
- v-model="editForm.cpuCount"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.memoryMB') }}
- </el-col>
- <el-col :span="8">
- <el-input-number
- :placeholder="$t('jobConfig.labelInfo.memoryMB')"
- :min="1"
- v-model="editForm.memoryMB"
- autocomplete="off"
- />
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.cpuCount') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input-number
+ :placeholder="$t('jobConfig.labelInfo.cpuCount')"
+ :precision="3"
+ :step="0.001"
+ v-model="editForm.cpuCount"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.memoryMB') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input-number
+ :placeholder="$t('jobConfig.labelInfo.memoryMB')"
+ :min="1"
+ v-model="editForm.memoryMB"
+ autocomplete="off"
+ />
+ </el-col>
</el-form-item>
<el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.failover') }}
- </el-col>
- <el-col :span="8">
- <el-checkbox v-model="editForm.failover">{{
$t('jobConfig.labelInfo.failover')}} </el-checkbox>
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.misfire') }}
- </el-col>
- <el-col :span="8">
- <el-checkbox v-model="editForm.misfire">{{
$t('jobConfig.labelInfo.misfire')}} </el-checkbox>
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.failover') }}
+ </el-col>
+ <el-col :span="8">
+ <el-checkbox v-model="editForm.failover">{{
$t('jobConfig.labelInfo.failover') }} </el-checkbox>
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.misfire') }}
+ </el-col>
+ <el-col :span="8">
+ <el-checkbox v-model="editForm.misfire">{{
$t('jobConfig.labelInfo.misfire') }} </el-checkbox>
+ </el-col>
</el-form-item>
<el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.applicationContext') }}
- </el-col>
- <el-col :span="8">
- <el-input
- type="textarea"
- :placeholder="$t('jobConfig.rules.applicationContext')"
- v-model="editForm.applicationContext"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.shardingItemParameters') }}
- </el-col>
- <el-col :span="8">
- <el-input
- type="textarea"
- :placeholder="$t('jobConfig.rules.shardingItemParameters')"
- v-model="editForm.shardingItemParameters"
- autocomplete="off"
- />
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.applicationContext') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ v-model="editForm.applicationContext"
+ :placeholder="$t('jobConfig.rules.applicationContext')"
+ type="textarea"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.shardingItemParameters') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ v-model="editForm.shardingItemParameters"
+ :placeholder="$t('jobConfig.rules.shardingItemParameters')"
+ type="textarea"
+ autocomplete="off"
+ />
+ </el-col>
</el-form-item>
<el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.beanName') }}
- </el-col>
- <el-col :span="7">
- <el-input
- :placeholder="$t('jobConfig.labelInfo.beanName')"
- v-model="editForm.beanName"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.description') }}
- </el-col>
- <el-col :span="8">
- <el-input
- type="textarea"
- :placeholder="$t('jobConfig.rules.description')"
- v-model="editForm.description"
- autocomplete="off"
- />
- </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.beanName') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ :placeholder="$t('jobConfig.labelInfo.beanName')"
+ v-model="editForm.beanName"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.description') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ v-model="editForm.description"
+ :placeholder="$t('jobConfig.rules.description')"
+ type="textarea"
+ autocomplete="off"
+ />
+ </el-col>
</el-form-item>
</el-form>
@@ -320,31 +315,31 @@ import { mapActions } from 'vuex'
import clone from 'lodash/clone'
import API from '../api'
export default {
- name: 'jobConfig',
+ name: 'JobConfig',
data() {
return {
modifyDialogVisible: false,
- isGuest: window.localStorage.getItem('isGuest') == 'true',
+ isGuest: window.localStorage.getItem('isGuest') === 'true',
column: [
{
label: this.$t('jobConfig').labelInfo.jobName,
prop: 'jobName',
- width : 280
+ width: 280
},
{
label: this.$t('jobConfig').labelInfo.appName,
prop: 'appName',
- width : 160
+ width: 160
},
{
label: this.$t('jobConfig').labelInfo.shardingTotalCount,
prop: 'shardingTotalCount',
- width : 140
+ width: 140
},
{
label: this.$t('jobConfig').labelInfo.cron,
prop: 'cron',
- width : 120
+ width: 120
}
],
jobExecutionTypeOptions: [{
@@ -375,7 +370,7 @@ export default {
memoryMB: 1,
beanName: '',
description: '',
- props : {},
+ props: {},
failover: false,
misfire: false,
streamingProcess2: false,
@@ -423,7 +418,7 @@ export default {
message: this.$t('jobConfig').rules.memoryMB,
trigger: 'change'
}
- ],
+ ]
},
editTitle: this.$t('jobConfig').labelInfo.editTitle,
tableData: [],
@@ -441,7 +436,7 @@ export default {
handleCurrentChange(val) {
const data = clone(this.cloneTableData)
this.currentPage = val
- this.tableData = data.splice(this.pageSize*(val - 1), this.pageSize)
+ this.tableData = data.splice(this.pageSize * (val - 1), this.pageSize)
},
getJobConfig() {
var params = {
@@ -450,14 +445,14 @@ export default {
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)
+ this.tableData = data.splice(this.pageSize * (this.currentPage - 1),
this.pageSize)
})
},
filterSearchData(model) {
- if(!this.searchForm.jobName){
+ if (!this.searchForm.jobName) {
return true
}
- if(!model){
+ if (!model) {
return true
}
return model.jobName &&
model.jobName.toLowerCase().includes(this.searchForm.jobName.toLowerCase())
@@ -475,7 +470,7 @@ export default {
memoryMB: 1,
beanName: '',
description: '',
- props : {},
+ props: {},
failover: false,
misfire: false,
streamingProcess2: false,
@@ -493,15 +488,15 @@ export default {
API.getJobDetail(params).then(res => {
const data = res.model
data.props = data.props || {}
- if("true" === data.props['streaming.process']){
+ if (data.props['streaming.process'] === 'true') {
data.streamingProcess2 = true
- } else if(!data.props['streaming.process'] || "false" ===
data.props['streaming.process']){
+ } else if (!data.props['streaming.process'] ||
data.props['streaming.process'] === 'false') {
data.streamingProcess2 = false
} else {
data.streamingProcess2 = true
}
- this.editTitle = this.$t('jobConfig').labelInfo.editTitle
- data.editMode= true
+ this.editTitle = this.$t('jobConfig').labelInfo.editTitle
+ data.editMode = true
this.editForm = data
this.modifyDialogVisible = true
})
@@ -510,8 +505,8 @@ export default {
const params = {
jobName: row.jobName
}
- localStorage.setItem("/job-config/job-detail/jobName", params.jobName)
- this.$router.push({path: '/job-config/job-detail', params: params })
+ localStorage.setItem('/job-config/job-detail/jobName', params.jobName)
+ this.$router.push({ path: '/job-config/job-detail', params: params })
},
handleEnable(row) {
const params = {
@@ -553,45 +548,44 @@ export default {
})
},
onEditConfirm(formName) {
- const params = {
- appName: this.editForm.appName
- }
- if(!this.editForm.cron){
- this.$notify({
- title: this.$t('common').notify.title,
- message: this.$t('jobConfig').rules.cron,
- type: 'error'
- })
- return
- }
+ const params = {
+ appName: this.editForm.appName
+ }
+ if (!this.editForm.cron) {
+ this.$notify({
+ title: this.$t('common').notify.title,
+ message: this.$t('jobConfig').rules.cron,
+ type: 'error'
+ })
+ return
+ }
- this.$refs[formName].validate(valid => {
- if (valid) {
- API.getAppDetail(params).then(res => {
- const data = res.model
- if(!data){
- this.$notify({
- title: this.$t('common').notify.title,
- message: this.$t('common').notify.appNotRegisterMessage +
':' + params.appName,
- type: 'error'
- })
- return false
- } else {
- this.onEditConfirmReal(formName)
- }
- })
- } else {
- if(!params.appName){
+ this.$refs[formName].validate(valid => {
+ if (valid) {
+ API.getAppDetail(params).then(res => {
+ const data = res.model
+ if (!data) {
this.$notify({
title: this.$t('common').notify.title,
- message: this.$t('jobConfig').rules.appName,
+ message: this.$t('common').notify.appNotRegisterMessage + ':'
+ params.appName,
type: 'error'
})
+ return false
+ } else {
+ this.onEditConfirmReal(formName)
}
- return false
+ })
+ } else {
+ if (!params.appName) {
+ this.$notify({
+ title: this.$t('common').notify.title,
+ message: this.$t('jobConfig').rules.appName,
+ type: 'error'
+ })
}
- })
-
+ return false
+ }
+ })
},
onEditConfirmReal(formName) {
this.$refs[formName].validate(valid => {
@@ -599,13 +593,13 @@ export default {
// fixData
const data = clone(this.editForm)
data.props = data.props || {}
- if(data.streamingProcess2){
- data.props['streaming.process'] = "true"
+ if (data.streamingProcess2) {
+ data.props['streaming.process'] = 'true'
} else {
- data.props['streaming.process'] = "false"
+ data.props['streaming.process'] = 'false'
}
//
- if(data.editMode){
+ if (data.editMode) {
API.updateJobConfig(data).then(res => {
this.modifyDialogVisible = false
this.$notify({
@@ -633,7 +627,7 @@ export default {
})
},
search() {
- this.getJobConfig()
+ this.getJobConfig()
}
}
}
diff --git
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-detail/module/jobDetail.vue
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-detail/module/jobDetail.vue
index f76b947..2e473bd 100644
---
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-detail/module/jobDetail.vue
+++
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-detail/module/jobDetail.vue
@@ -19,240 +19,254 @@
<el-row class="box-card">
<el-form :model="searchForm" class="demo-form-inline">
<el-form-item>
+ <el-col :span="4">
+ <el-button
+ type="info"
+ icon="el-icon-arrow-left"
+ @click="goBack">Back</el-button>
+ </el-col>
+ <el-col :span="14">
+
+ </el-col>
+ <el-col :span="6">
+ <el-input
+ v-model="searchForm.jobName"
+ placeholder="Reload"
+ clearable
+ autocomplete="off"
+ @clear="search"
+ @change="search">
+ <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>
+ </el-col>
+ </el-form-item>
+ </el-form>
+ <div class="table-wrap">
+ <el-form
+ ref="detailModel"
+ :model="detailModel"
+ label-width="40px">
+
+ <el-form-item>
<el-col :span="4">
- <el-button @click="goBack" type="info"
icon="el-icon-arrow-left">Back</el-button>
+ {{ $t('jobConfig.labelInfo.jobName') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="detailModel.jobName"
+ :disabled="viewMode"
+ autocomplete="off"
+ />
</el-col>
- <el-col :span="14">
-
+ <el-col :span="1">
+
</el-col>
- <el-col :span="6">
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.cron') }}
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="7">
<el-input
- v-model="searchForm.jobName"
- placeholder="Reload"
- 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>
+ :disabled="viewMode"
+ v-model="detailModel.cron"
+ autocomplete="off"
+ />
</el-col>
</el-form-item>
- </el-form>
- <div class="table-wrap">
- <el-form ref="detailModel" :model="detailModel" label-width="40px">
-
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.jobName') }}
- </el-col>
- <el-col :span="7">
- <el-input
- :disabled="viewMode"
- v-model="detailModel.jobName"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.cron') }}
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="7">
- <el-input
- :disabled="viewMode"
- v-model="detailModel.cron"
- autocomplete="off"
- />
- </el-col>
- </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.appName') }}
- </el-col>
- <el-col :span="7">
- <el-input
- :disabled="viewMode"
- v-model="detailModel.appName"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.jobExecutionType') }}
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="7">
- <el-select v-model="detailModel.jobExecutionType"
- :disabled="viewMode"
- >
- <el-option
- v-for="item in jobExecutionTypeOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value">
- </el-option>
- </el-select>
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.appName') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="detailModel.appName"
+ :disabled="viewMode"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.jobExecutionType') }}
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="7">
+ <el-select
+ v-model="detailModel.jobExecutionType"
+ :disabled="viewMode">
+ <el-option
+ v-for="item in jobExecutionTypeOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ </el-col>
+ </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.shardingTotalCount') }}
- </el-col>
- <el-col :span="8">
- <el-input-number
- :disabled="viewMode"
- v-model="detailModel.shardingTotalCount"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.jobParameter') }}
- </el-col>
- <el-col :span="8">
- <el-input
- :disabled="viewMode"
- v-model="detailModel.jobParameter"
- autocomplete="off"
- />
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.shardingTotalCount') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input-number
+ :disabled="viewMode"
+ v-model="detailModel.shardingTotalCount"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.jobParameter') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ :disabled="viewMode"
+ v-model="detailModel.jobParameter"
+ autocomplete="off"
+ />
+ </el-col>
+ </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.cpuCount') }}
- </el-col>
- <el-col :span="8">
- <el-input-number
- :disabled="viewMode"
- :precision="3"
- :step="0.001"
- v-model="detailModel.cpuCount"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.memoryMB') }}
- </el-col>
- <el-col :span="8">
- <el-input-number
- :disabled="viewMode"
- :min="1"
- v-model="detailModel.memoryMB"
- autocomplete="off"
- />
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.cpuCount') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input-number
+ v-model="detailModel.cpuCount"
+ :disabled="viewMode"
+ :precision="3"
+ :step="0.001"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.memoryMB') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input-number
+ v-model="detailModel.memoryMB"
+ :disabled="viewMode"
+ :min="1"
+ autocomplete="off"
+ />
+ </el-col>
+ </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.failover') }}
- </el-col>
- <el-col :span="8">
- <el-checkbox v-model="detailModel.failover"
- :disabled="viewMode">{{
$t('jobConfig.labelInfo.failover')}} </el-checkbox>
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.misfire') }}
- </el-col>
- <el-col :span="8">
- <el-checkbox v-model="detailModel.misfire"
- :disabled="viewMode">{{
$t('jobConfig.labelInfo.misfire')}} </el-checkbox>
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.failover') }}
+ </el-col>
+ <el-col :span="8">
+ <el-checkbox
+ v-model="detailModel.failover"
+ :disabled="viewMode">{{ $t('jobConfig.labelInfo.failover')
}}</el-checkbox>
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.misfire') }}
+ </el-col>
+ <el-col :span="8">
+ <el-checkbox
+ v-model="detailModel.misfire"
+ :disabled="viewMode">{{ $t('jobConfig.labelInfo.misfire')
}}</el-checkbox>
+ </el-col>
+ </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.applicationContext') }}
- </el-col>
- <el-col :span="8">
- <el-input
- type="textarea"
- :disabled="viewMode"
- v-model="detailModel.applicationContext"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.shardingItemParameters') }}
- </el-col>
- <el-col :span="8">
- <el-input
- type="textarea"
- :disabled="viewMode"
- v-model="detailModel.shardingItemParameters"
-
title="分片序列号和参数用等号分隔，多个键值对用逗号分隔，类似map。分片序列号从0开始，不可大于或等于作业分片总数。如：0=a,1=b,2=c"
- autocomplete="off"
- />
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.applicationContext') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ v-model="detailModel.applicationContext"
+ :disabled="viewMode"
+ type="textarea"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.shardingItemParameters') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ v-model="detailModel.shardingItemParameters"
+ :disabled="viewMode"
+ type="textarea"
+
title="分片序列号和参数用等号分隔，多个键值对用逗号分隔，类似map。分片序列号从0开始，不可大于或等于作业分片总数。如：0=a,1=b,2=c"
+ autocomplete="off"
+ />
+ </el-col>
+ </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.beanName') }}
- </el-col>
- <el-col :span="7">
- <el-input
- :disabled="viewMode"
- v-model="detailModel.beanName"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.streamingProcess') }}
- </el-col>
- <el-col :span="8">
- <el-checkbox v-model="detailModel.streamingProcess"
- title="DATAFLOW类型作业，是否流式处理数据如果流式处理数据,
则fetchData不返回空结果将持续执行作业，如果非流式处理数据, 则处理数据完成后作业结束。"
- :disabled="viewMode">
- {{ $t('jobConfig.labelInfo.streamingProcess')}}
- </el-checkbox>
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.beanName') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="detailModel.beanName"
+ :disabled="viewMode"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.streamingProcess') }}
+ </el-col>
+ <el-col :span="8">
+ <el-checkbox
+ v-model="detailModel.streamingProcess"
+ :disabled="viewMode"
+ title="DATAFLOW类型作业，是否流式处理数据如果流式处理数据,
则fetchData不返回空结果将持续执行作业，如果非流式处理数据, 则处理数据完成后作业结束。"
+ >
+ {{ $t('jobConfig.labelInfo.streamingProcess') }}
+ </el-checkbox>
+ </el-col>
+ </el-form-item>
- <el-form-item>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.scriptCommandLine') }}
- </el-col>
- <el-col :span="7">
- <el-input
- :disabled="viewMode"
- v-model="detailModel.scriptCommandLine"
- title="SCRIPT类型作业命令行执行脚本"
- autocomplete="off"
- />
- </el-col>
- <el-col :span="1">
-
- </el-col>
- <el-col :span="4">
- {{ $t('jobConfig.labelInfo.description') }}
- </el-col>
- <el-col :span="8">
- <el-input
- type="textarea"
- :disabled="viewMode"
- v-model="detailModel.description"
- autocomplete="off"
- />
- </el-col>
- </el-form-item>
+ <el-form-item>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.scriptCommandLine') }}
+ </el-col>
+ <el-col :span="7">
+ <el-input
+ v-model="detailModel.scriptCommandLine"
+ :disabled="viewMode"
+ title="SCRIPT类型作业命令行执行脚本"
+ autocomplete="off"
+ />
+ </el-col>
+ <el-col :span="1">
+
+ </el-col>
+ <el-col :span="4">
+ {{ $t('jobConfig.labelInfo.description') }}
+ </el-col>
+ <el-col :span="8">
+ <el-input
+ v-model="detailModel.description"
+ :disabled="viewMode"
+ type="textarea"
+ autocomplete="off"
+ />
+ </el-col>
+ </el-form-item>
- </el-form>
+ </el-form>
</div>
</el-row>
</template>
@@ -264,9 +278,9 @@ export default {
name: 'OperationJobs',
data() {
return {
- isGuest: window.localStorage.getItem('isGuest') == 'true',
+ isGuest: window.localStorage.getItem('isGuest') === 'true',
viewMode: true,
- jobName: "",
+ jobName: '',
searchForm: {
jobName: ''
},
@@ -277,13 +291,13 @@ export default {
}, {
value: 'TRANSIENT',
label: 'TRANSIENT'
- }],
+ }]
}
},
created() {
this.jobName = this.$route.params.jobName ||
- localStorage.getItem("/job-config/job-detail/jobName")
- if(!this.jobName){
+ localStorage.getItem('/job-config/job-detail/jobName')
+ if (!this.jobName) {
this.goBack()
return
}
@@ -292,8 +306,8 @@ export default {
methods: {
...mapActions(['setRegCenterActivated']),
goBack() {
- localStorage.removeItem("/job-config/job-detail/jobName")
- this.$router.replace({path: '/job-config'})
+ localStorage.removeItem('/job-config/job-detail/jobName')
+ this.$router.replace({ path: '/job-config' })
},
getJobDetail() {
var params = {
@@ -302,9 +316,9 @@ export default {
API.getJobDetail(params).then(res => {
const data = clone(res.model)
data.props = data.props || {}
- if("true" === data.props['streaming.process']){
+ if (data.props['streaming.process'] === 'true') {
data.streamingProcess = true
- } else if(!data.props['streaming.process'] || "false" ===
data.props['streaming.process']){
+ } else if (!data.props['streaming.process'] ||
data.props['streaming.process'] === 'false') {
data.streamingProcess = false
} else {
data.streamingProcess = true
@@ -314,7 +328,7 @@ export default {
})
},
search() {
- this.getJobDetail()
+ this.getJobDetail()
}
}
}
diff --git
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-status/module/jobStatus.vue
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-status/module/jobStatus.vue
index 65c0f0a..3760bc4 100644
---
a/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-status/module/jobStatus.vue
+++
b/shardingsphere-elasticjob-cloud-ui/shardingsphere-elasticjob-cloud-ui-frontend/src/views/job-status/module/jobStatus.vue
@@ -16,144 +16,162 @@
-->
<template>
- <el-tabs v-model="activeTabName"
+ <el-tabs
+ v-model="activeTabName"
type="card"
class="box-card"
@tab-click="handleTabSwitch">
- <el-tab-pane name="running"
- :label="$t('jobStatus.tab.running')" >
- <div class="btn-group pull-right" style="float: right;">
- <el-input
- v-model="searchFormRunning.jobName"
- placeholder="Search"
- clearable
- @clear="searchRunning"
- @change="searchRunning"
- autocomplete="off" >
- <i slot="prefix" class="el-input__icon el-icon-search"></i>
- <el-button slot="append" icon="el-icon-search"
- @click="searchRunning"></el-button>
- </el-input>
- </div>
- <div class="table-wrap">
- <el-table
- :data="tableDataRunning"
- stripe
- border
- style="width: 100%">
- <el-table-column
- v-for="(item, index) in columnRunning"
- :key="index"
- :prop="item.prop"
- :label="item.label"
- :width="item.width"
- >
+ <el-tab-pane
+ :label="$t('jobStatus.tab.running')"
+ name="running">
+ <div
+ class="btn-group pull-right"
+ style="float: right;">
+ <el-input
+ v-model="searchFormRunning.jobName"
+ placeholder="Search"
+ clearable
+ autocomplete="off"
+ @clear="searchRunning"
+ @change="searchRunning">
+ <i
+ slot="prefix"
+ class="el-input__icon el-icon-search"></i>
+ <el-button
+ slot="append"
+ icon="el-icon-search"
+ @click="searchRunning"></el-button>
+ </el-input>
+ </div>
+ <div class="table-wrap">
+ <el-table
+ :data="tableDataRunning"
+ stripe
+ border
+ style="width: 100%">
+ <el-table-column
+ v-for="(item, index) in columnRunning"
+ :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>
- <div class="pagination">
- <el-pagination
- :total="totalRunning"
- :current-page="currentPageRunning"
- background
- layout="prev, pager, next"
- @current-change="handleCurrentChangeRunning"
- />
- </div>
+ </el-table-column>
+ </el-table>
+ <div class="pagination">
+ <el-pagination
+ :total="totalRunning"
+ :current-page="currentPageRunning"
+ background
+ layout="prev, pager, next"
+ @current-change="handleCurrentChangeRunning"
+ />
</div>
+ </div>
</el-tab-pane>
- <el-tab-pane name="ready"
+ <el-tab-pane
:lazy="lazyInit"
- :label="$t('jobStatus.tab.ready')">
- <div class="btn-group pull-right" style="float: right;">
- <el-input
- v-model="searchFormReady.jobName"
- placeholder="Search"
- clearable
- @clear="searchReady"
- @change="searchReady"
- autocomplete="off" >
- <i slot="prefix" class="el-input__icon el-icon-search"></i>
- <el-button slot="append" icon="el-icon-search"
- @click="searchReady"></el-button>
- </el-input>
- </div>
- <div class="table-wrap">
- <el-table
- :data="tableDataReady"
- stripe
- border
- style="width: 100%">
- <el-table-column
- v-for="(item, index) in columnReady"
- :key="index"
- :prop="item.prop"
- :label="item.label"
- :width="item.width"
- >
+ :label="$t('jobStatus.tab.ready')"
+ name="ready">
+ <div class="btn-group pull-right" style="float: right;">
+ <el-input
+ v-model="searchFormReady.jobName"
+ placeholder="Search"
+ clearable
+ autocomplete="off"
+ @clear="searchReady"
+ @change="searchReady">
+ <i
+ slot="prefix"
+ class="el-input__icon el-icon-search"></i>
+ <el-button
+ slot="append"
+ icon="el-icon-search"
+ @click="searchReady"></el-button>
+ </el-input>
+ </div>
+ <div class="table-wrap">
+ <el-table
+ :data="tableDataReady"
+ stripe
+ border
+ style="width: 100%">
+ <el-table-column
+ v-for="(item, index) in columnReady"
+ :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>
- <div class="pagination">
- <el-pagination
- :total="totalReady"
- :current-page="currentPageReady"
- background
- layout="prev, pager, next"
- @current-change="handleCurrentChangeReady"
- />
- </div>
+ </el-table-column>
+ </el-table>
+ <div class="pagination">
+ <el-pagination
+ :total="totalReady"
+ :current-page="currentPageReady"
+ background
+ layout="prev, pager, next"
+ @current-change="handleCurrentChangeReady"
+ />
</div>
- </el-tab-pane>
- <el-tab-pane name="failover"
+ </div>
+ </el-tab-pane>
+ <el-tab-pane
:lazy="lazyInit"
- :label="$t('jobStatus.tab.failover')">
- <div class="btn-group pull-right" style="float: right;">
- <el-input
- v-model="searchFormFailover.jobName"
- placeholder="Search"
- clearable
- @clear="searchFailover"
- @change="searchFailover"
- autocomplete="off" >
- <i slot="prefix" class="el-input__icon el-icon-search"></i>
- <el-button slot="append" icon="el-icon-search"
- @click="searchFailover"></el-button>
- </el-input>
- </div>
- <div class="table-wrap">
- <el-table
- :data="tableDataFailover"
- stripe
- border
- style="width: 100%">
- <el-table-column
- v-for="(item, index) in columnFailover"
- :key="index"
- :prop="item.prop"
- :label="item.label"
- :width="item.width"
- >
+ :label="$t('jobStatus.tab.failover')"
+ name="failover">
+ <div class="btn-group pull-right" style="float: right;">
+ <el-input
+ v-model="searchFormFailover.jobName"
+ placeholder="Search"
+ clearable
+ autocomplete="off"
+ @clear="searchFailover"
+ @change="searchFailover">
+ <i
+ slot="prefix"
+ class="el-input__icon el-icon-search"></i>
+ <el-button
+ slot="append"
+ icon="el-icon-search"
+ @click="searchFailover"></el-button>
+ </el-input>
+ </div>
+ <div class="table-wrap">
+ <el-table
+ :data="tableDataFailover"
+ stripe
+ border
+ style="width: 100%">
+ <el-table-column
+ v-for="(item, index) in columnFailover"
+ :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>
- <div class="pagination">
- <el-pagination
- :total="totalFailover"
- :current-page="currentPageFailover"
- background
- layout="prev, pager, next"
- @current-change="handleCurrentChangeFailover"
- />
- </div>
+ </el-table-column>
+ </el-table>
+ <div class="pagination">
+ <el-pagination
+ :total="totalFailover"
+ :current-page="currentPageFailover"
+ background
+ layout="prev, pager, next"
+ @current-change="handleCurrentChangeFailover"
+ />
</div>
- </el-tab-pane>
+ </div>
+ </el-tab-pane>
</el-tabs>
</template>
<script>
@@ -164,63 +182,63 @@ export default {
name: 'JobStatus',
data() {
return {
- isGuest: window.localStorage.getItem('isGuest') == 'true',
+ isGuest: window.localStorage.getItem('isGuest') === 'true',
activeTabName: 'running',
lazyInit: true,
columnRunning: [
{
label: this.$t('jobStatus').labelInfo.id,
prop: 'id',
- width : 380
+ width: 380
},
{
label: this.$t('jobStatus').labelInfo.taskName,
prop: 'jobName',
- width : 200
+ width: 200
},
{
label: this.$t('jobStatus').labelInfo.severIp,
prop: 'slaveId',
- width : 160
+ width: 160
},
{
label: this.$t('jobStatus').labelInfo.type,
prop: 'type',
- width : 150
+ width: 150
},
{
label: this.$t('jobStatus').labelInfo.shardingItems,
prop: 'shardingItemsTitle',
- width : 180
+ width: 180
}
],
columnReady: [
{
label: this.$t('jobStatus').labelInfo.jobName,
prop: 'jobName',
- width : 800
+ width: 800
},
{
label: this.$t('jobStatus').labelInfo.times,
prop: 'times',
- width : 300
+ width: 300
}
],
columnFailover: [
{
label: this.$t('jobStatus').labelInfo.jobName,
prop: 'jobName',
- width : 400
+ width: 400
},
{
label: this.$t('jobStatus').labelInfo.originalTaskId,
prop: 'originalTaskId',
- width : 440
+ width: 440
},
{
label: this.$t('jobStatus').labelInfo.shardingItems,
prop: 'shardingItemsTitle',
- width : 300
+ width: 300
}
],
searchFormRunning: {
@@ -246,7 +264,7 @@ export default {
cloneTableDataFailover: [],
currentPageFailover: 1,
pageSizeFailover: 10,
- totalFailover: 0,
+ totalFailover: 0
}
},
created() {
@@ -255,30 +273,29 @@ export default {
methods: {
...mapActions(['setRegCenterActivated']),
handleTabSwitch(tab, event) {
- //
- const tabName = tab.name;
- if(tabName === 'running'){
+ const tabName = tab.name
+ if (tabName === 'running') {
this.searchRunning()
- } else if(tabName === 'ready'){
+ } else if (tabName === 'ready') {
this.searchReady()
- } else if(tabName === 'failover'){
+ } else if (tabName === 'failover') {
this.searchFailover()
}
},
handleCurrentChangeRunning(val) {
const data = clone(this.cloneTableDataRunning)
this.currentPageRunning = val
- this.tableDataRunning = data.splice(this.pageSizeRunning*(val - 1),
this.pageSizeRunning)
+ this.tableDataRunning = data.splice(this.pageSizeRunning * (val - 1),
this.pageSizeRunning)
},
handleCurrentChangeReady(val) {
const data = clone(this.cloneTableDataReady)
this.currentPageReady = val
- this.tableDataReady = data.splice(this.pageSizeReady*(val - 1),
this.pageSizeReady)
+ this.tableDataReady = data.splice(this.pageSizeReady * (val - 1),
this.pageSizeReady)
},
handleCurrentChangeFailover(val) {
const data = clone(this.cloneTableDataFailover)
this.currentPageFailover = val
- this.tableDataFailover = data.splice(this.pageSizeFailover*(val - 1),
this.pageSizeFailover)
+ this.tableDataFailover = data.splice(this.pageSizeFailover * (val - 1),
this.pageSizeFailover)
},
findAllRunningTasks() {
var params = {
@@ -287,7 +304,7 @@ export default {
const data = Array.prototype.filter.call(res.model,
this.filterSearchDataRunning)
this.totalRunning = data.length
this.cloneTableDataRunning = clone(data)
- this.tableDataRunning =
data.splice(this.pageSizeRunning*(this.currentPageRunning - 1),
this.pageSizeRunning)
+ this.tableDataRunning = data.splice(this.pageSizeRunning *
(this.currentPageRunning - 1), this.pageSizeRunning)
})
},
findAllReadyTasks() {
@@ -297,7 +314,7 @@ export default {
const data = Array.prototype.filter.call(res.model,
this.filterSearchDataReady)
this.totalReady = data.length
this.cloneTableDataReady = clone(data)
- this.tableDataReady =
data.splice(this.pageSizeReady*(this.currentPageReady - 1), this.pageSizeReady)
+ this.tableDataReady = data.splice(this.pageSizeReady *
(this.currentPageReady - 1), this.pageSizeReady)
})
},
findAllFailoverTasks() {
@@ -307,7 +324,7 @@ export default {
const data = Array.prototype.filter.call(res.model,
this.filterSearchDataFailover)
this.totalFailover = data.length
this.cloneTableDataFailover = clone(data)
- this.tableDataFailover =
data.splice(this.pageSizeFailover*(this.currentPageFailover - 1),
this.pageSizeFailover)
+ this.tableDataFailover = data.splice(this.pageSizeFailover *
(this.currentPageFailover - 1), this.pageSizeFailover)
})
},
filterSearchDataRunning(model) {
@@ -315,44 +332,44 @@ export default {
model.jobName = metaInfo.jobName
const shardingItems = metaInfo.shardingItems || []
model.shardingItemsTitle = shardingItems.join(',')
- if(!this.searchFormRunning.jobName){
- return true;
+ if (!this.searchFormRunning.jobName) {
+ return true
}
- if(!model){
- return true;
+ if (!model) {
+ return true
}
- return model.jobName &&
model.jobName.toLowerCase().includes(this.searchFormRunning.jobName.toLowerCase());
+ return model.jobName &&
model.jobName.toLowerCase().includes(this.searchFormRunning.jobName.toLowerCase())
},
filterSearchDataReady(model) {
- if(!this.searchFormReady.jobName){
- return true;
+ if (!this.searchFormReady.jobName) {
+ return true
}
- if(!model){
- return true;
+ if (!model) {
+ return true
}
- return model.jobName &&
model.jobName.toLowerCase().includes(this.searchFormReady.jobName.toLowerCase());
+ return model.jobName &&
model.jobName.toLowerCase().includes(this.searchFormReady.jobName.toLowerCase())
},
filterSearchDataFailover(model) {
const taskInfo = model.taskInfo || {}
model.jobName = taskInfo.jobName
const shardingItems = taskInfo.shardingItems || []
model.shardingItemsTitle = shardingItems.join(',')
- if(!this.searchFormFailover.jobName){
- return true;
+ if (!this.searchFormFailover.jobName) {
+ return true
}
- if(!model){
- return true;
+ if (!model) {
+ return true
}
- return model.jobName &&
model.jobName.toLowerCase().includes(this.searchFormFailover.jobName.toLowerCase());
+ return model.jobName &&
model.jobName.toLowerCase().includes(this.searchFormFailover.jobName.toLowerCase())
},
searchRunning() {
- this.findAllRunningTasks()
+ this.findAllRunningTasks()
},
searchReady() {
- this.findAllReadyTasks()
+ this.findAllReadyTasks()
},
searchFailover() {
- this.findAllFailoverTasks()
+ this.findAllFailoverTasks()
}
}
}
