test/DolphinScheduler
1
0
Fork 0
mirror of https://gitee.com/dolphinscheduler/DolphinScheduler.git synced 2024-12-04 13:17:50 +08:00
Code Issues Actions 10 Packages Projects Releases Wiki Activity

Modify MySQL page of monitoring center (#1138)

Browse Source 
* Dependency workflow add dependency correction value

* Download workflow instance map width adjustment and change "desc" field to "description"

* The third-party library that builds the dependency is recommended to be placed in 'devDependencies'

* Tree chart and Gantt chart style modification

* The workflow instance can be deleted only when its status is success, failure, stop and pause.

* change desc to description

* Maximum width of tooltip is set to 500px, note the copyright number of login page

* Delete copyright number

* No tenant in the list of selected tenants the default is default, and the status not shown in the repair page

* repair

* Repair security center module prompt

* Remove blank character during verification

* Remove blank character during verification

* Non admin users cannot create users, tenants, alarm groups, queues and worker groups

* Remove CI windows detection

* The value of loadaverage should be two decimal places

* Add license

* delete docs

* update package.json

* delete LICENSE

* Display icon when there is no data in process definition

* Worker group add IP format verification

* Modify MySQL page of monitoring center
This commit is contained in:
break60 2019-10-31 18:52:56 +08:00 committed by qiaozhanwei
parent 9545cb2008
commit e058b58e01
4 changed files with 152 additions and 143 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

146
dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/db.vue Normal file
View File

@ -0,0 +1,146 @@
/*
* 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>
<div>
<div class="servers-wrapper mysql-model" v-show="mysqlList.length">
<div class="row" v-for="(item,$index) in mysqlList">
<div class="col-md-12">
<div class="content-title">
<span>{{item.dbType}}</span>
</div>
</div>
<div class="col-md-3">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Health status')}}</span>
</div>
<div class="value-p">
<span class="state">
<i class="iconfont success" v-if="item.state">&#xe607;</i>
<i class="iconfont error" v-else>&#xe626;</i>
</span>
</div>
<div class="text-1">{{$t('Health status')}}</div>
</div>
</div>
<div class="col-md-3">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Max connections')}} - {{item.date | formatDate}}</span>
</div>
<div class="value-p">
<b :style="{color:color[0]}">{{item.maxConnections}}</b>
</div>
<div class="text-1">{{$t('Max connections')}}</div>
</div>
</div>
<div class="col-md-3">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Threads connections')}}</span>
</div>
<div class="value-p">
<b :style="{color:color[8]}">{{item.threadsConnections}}</b>
</div>
<div class="text-1">{{$t('Threads connections')}}</div>
</div>
</div>
<!-- <div class="col-md-2">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Max used connections')}}</span>
</div>
<div class="value-p">
<b :style="{color:color[2]}">{{item.maxUsedConnections}}</b>
</div>
<div class="text-1">
{{$t('Max used connections')}}
</div>
</div>
</div>-->
<div class="col-md-3">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Threads running connections')}}</span>
</div>
<div class="value-p">
<b :style="{color:color[4]}">{{item.threadsRunningConnections}}</b>
</div>
<div class="text-1">{{$t('Threads running connections')}}</div>
</div>
</div>
</div>
</div>
<div v-if="!mysqlList.length">
<m-no-data></m-no-data>
</div>
<m-spin :is-spin="isLoading"></m-spin>
</div>
</template>
<script>
import { mapActions } from "vuex";
import mList from "./_source/zookeeperList";
import mSpin from "@/module/components/spin/spin";
import mNoData from "@/module/components/noData/noData";
import themeData from "@/module/echarts/themeData.json";
import mListConstruction from "@/module/components/listConstruction/listConstruction";
export default {
name: "servers-mysql",
data() {
return {
isLoading: false,
mysqlList: [],
color: themeData.color
};
},
props: {},
methods: {
...mapActions("monitor", ["getDatabaseData"])
},
watch: {},
created() {
this.isLoading = true;
this.getDatabaseData()
.then(res => {
this.mysqlList = res;
this.isLoading = false;
})
.catch(() => {
this.isLoading = false;
});
},
mounted() {},
components: { mList, mListConstruction, mSpin, mNoData }
};
</script>
<style lang="scss" rel="stylesheet/scss">
@import "./servers";
.content-title {
height: 48px;
background: #f8fbfe;
border-radius: 3px 3px 0 0;
margin-bottom: 10px;
span {
font-size: 22px;
padding-left: 18px;
padding-top: 10px;
display: inline-block;
color: #2a455b;
}
}
</style>

137
dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/mysql.vue
View File

@ -1,137 +0,0 @@
/*
* 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>
<m-list-construction :title="'Mysql ' + $t('Manage')">
<template slot="content">
<div class="servers-wrapper mysql-model" v-show="mysqlList.length">
<div class="row" v-for="(item,$index) in mysqlList">
<div class="col-md-2">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Health status')}}</span>
</div>
<div class="value-p">
<span class="state">
<i class="iconfont success" v-if="item.state">&#xe607;</i>
<i class="iconfont error" v-else>&#xe626;</i>
</span>
</div>
<div class="text-1">
{{$t('Health status')}}
</div>
</div>
</div>
<div class="col-md-3">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Max connections')}} - {{item.date | formatDate}}</span>
</div>
<div class="value-p">
<b :style="{color:color[0]}">{{item.maxConnections}}</b>
</div>
<div class="text-1">
{{$t('Max connections')}}
</div>
</div>
</div>
<div class="col-md-3">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Threads connections')}}</span>
</div>
<div class="value-p">
<b :style="{color:color[8]}">{{item.threadsConnections}}</b>
</div>
<div class="text-1">
{{$t('Threads connections')}}
</div>
</div>
</div>
<div class="col-md-2">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Max used connections')}}</span>
</div>
<div class="value-p">
<b :style="{color:color[2]}">{{item.maxUsedConnections}}</b>
</div>
<div class="text-1">
{{$t('Max used connections')}}
</div>
</div>
</div>
<div class="col-md-2">
<div class="text-num-model text">
<div class="title">
<span>{{$t('Threads running connections')}}</span>
</div>
<div class="value-p">
<b :style="{color:color[4]}">{{item.threadsRunningConnections}}</b>
</div>
<div class="text-1">
{{$t('Threads running connections')}}
</div>
</div>
</div>
</div>
</div>
<div v-if="!mysqlList.length">
<m-no-data></m-no-data>
</div>
<m-spin :is-spin="isLoading" ></m-spin>
</template>
</m-list-construction>
</template>
<script>
import { mapActions } from 'vuex'
import mList from './_source/zookeeperList'
import mSpin from '@/module/components/spin/spin'
import mNoData from '@/module/components/noData/noData'
import themeData from '@/module/echarts/themeData.json'
import mListConstruction from '@/module/components/listConstruction/listConstruction'
export default {
name: 'servers-mysql',
data () {
return {
isLoading: false,
mysqlList: [],
color: themeData.color
}
},
props: {},
methods: {
...mapActions('monitor', ['getDatabaseData'])
},
watch: {},
created () {
this.isLoading = true
this.getDatabaseData().then(res => {
this.mysqlList = res
this.isLoading = false
}).catch(() => {
this.isLoading = false
})
},
mounted () {
},
components: { mList, mListConstruction, mSpin, mNoData }
}
</script>
<style lang="scss" rel="stylesheet/scss">
@import "./servers";
</style>

8
dolphinscheduler-ui/src/js/conf/home/router/index.js
View File

@ -433,11 +433,11 @@ const router = new Router({
} }
}, },
{ {
path: '/monitor/servers/mysql', path: '/monitor/servers/db',
name: 'servers-mysql', name: 'servers-db',
component: resolve => require(['../pages/monitor/pages/servers/mysql'], resolve), component: resolve => require(['../pages/monitor/pages/servers/db'], resolve),
meta: { meta: {
title: `Mysql` title: `DB`
} }
}, },
{ {

4
dolphinscheduler-ui/src/js/module/components/secondaryMenu/_source/menu.js
View File

@ -236,8 +236,8 @@ let menu = {
// disabled: true // disabled: true
// }, // },
{ {
name: 'Mysql', name: 'DB',
path: 'servers-mysql', path: 'servers-db',
id: 6, id: 6,
disabled: true disabled: true
} }