Skip to content

Q
qa-platform-ui
Commit 38a62f3a authored by 王晓铜's avatar 王晓铜
Browse files
Options

更新监控显示

parent 06c7b874
Hide whitespace changes
Inline Side-by-side
Showing with 68 additions and 71 deletions
src/api/sqlMonitor.js
View file @ 38a62f3a
......@@ -71,3 +71,11 @@ export function isEnableSqlMonitor(data) {
data
})
}
// 获取sql监控详情
export function getDetailSqlMonitor(queryInfo) {
return holmesRequest({
url: '/sql/monitor/detail',
method: 'get',
params: queryInfo
})
}
src/views/monitor/AddSqlMonitor.vue
View file @ 38a62f3a
......@@ -3,7 +3,7 @@
<el-card>
<el-form ref="sqlMonitorFormRef" :rules="rules" :model="sqlMonitorForm" label-width="90px">
<el-form-item label="监控名称:" style="width:400px" prop="taskName">
<el-input v-model="sqlMonitorForm.taskName" placeholder="请输入监控名称"></el-input>
<el-input v-model.trim="sqlMonitorForm.taskName" placeholder="请输入监控名称"></el-input>
</el-form-item>
<el-form-item label="数据源:" prop="dsId">
<el-select v-model="sqlMonitorForm.dsId" placeholder="请选择数据源" style="width:310px" clearable>
......@@ -12,7 +12,7 @@
</el-form-item>
<el-form-item label="SQL脚本:" prop="sql">
<div style="border:1.5px solid #DCDCDC;width:90%;">
<codemirror ref="editQuerySQL" v-model="sqlMonitorForm.sql" :options="cmOptions" @focus="testFoucs">
<codemirror ref="editQuerySQL" v-model.trim="sqlMonitorForm.sql" :options="cmOptions" @focus="testFoucs">
</codemirror>
</div>
</el-form-item>
......@@ -24,7 +24,7 @@
<!-- 动态绑定表格数据 -->
<el-table id="tabId" :data="sqlList" border style="font-size:8px;"
:header-cell-style="{background:'#eee',color:'#606266'}" v-if="isShow" ref="tabRef">
<af-table-column v-for="(val, key) in columnArr" :label="val" :prop="val" :key="key" :fontRate='fontRate'>
<af-table-column v-for="(val, key) in columnArr" :label="val" :prop="val" :key="key">
</af-table-column>
</el-table>
</el-form-item>
......@@ -34,7 +34,7 @@
<el-dialog title="报警策略" :visible.sync="DialogVisible" width="50%">
<el-form ref="sqlMonitorFormRef" :rules="rules" :model="sqlMonitorForm" label-width="90px">
<el-form-item label="服务名称:" prop="serviceName">
<el-select v-model="sqlMonitorForm.serviceName" placeholder="请选择服务名称" style="width:310px" filterable
<el-select v-model.trim="sqlMonitorForm.serviceName" placeholder="请选择服务名称" style="width:310px" filterable
clearable>
<el-option v-for="item in serviceList" :key="item.name" :label="item.name" :value="item.name"></el-option>
</el-select>
......@@ -46,16 +46,19 @@
</el-select>
</el-form-item>
<el-form-item label="钉钉地址:" style="width:800px" prop="dingUrl">
<el-input v-model="sqlMonitorForm.dingUrl" placeholder="请输入钉钉通知地址" type="textarea" :rows="3">
<el-input v-model.trim="sqlMonitorForm.dingUrl" placeholder="请输入钉钉通知地址" type="textarea" :rows="3">
</el-input>
</el-form-item>
<el-form-item label="消息内容:" style="width:800px" prop="dingText">
<el-input v-model="sqlMonitorForm.dingText" placeholder="可以使用表达式{0},{1}...表示取结果集的第一行第N列值,使用{count}表示取数据总条数"
type="textarea" :rows="3">
<el-input v-model.trim="sqlMonitorForm.dingText"
placeholder="可以使用表达式{0},{1}...表示取结果集的第一行第N列值,使用{count}表示取数据总条数" type="textarea" :rows="3">
</el-input>
</el-form-item>
<el-form-item label="负责人:" style="width:300px" prop="owner">
<el-input v-model="sqlMonitorForm.owner" placeholder="请输入负责人"></el-input>
</el-form-item>
<el-form-item label="是否启用:">
<el-select v-model="sqlMonitorForm.status" placeholder="请选择是否启用" style="width:310px">
<el-select v-model="sqlMonitorForm.status" placeholder="请选择是否启用" style="width:210px">
<el-option v-for="item in enableList" :label="item.lable" :key="item.value" :value="item.value"></el-option>
</el-select>
</el-form-item>
......@@ -75,18 +78,17 @@ import {
getMonitorStrategy,
sendTestSqlMonitor,
addSqlMonitor,
editSqlMonitor
editSqlMonitor,
getDetailSqlMonitor
} from '@/api/sqlMonitor'
import { getGitProjectList } from '@/api/jira'
import { mapGetters } from 'vuex'
// 编辑器引用
import { codemirror } from 'vue-codemirror'
import 'codemirror/lib/codemirror.css'
import 'codemirror/theme/idea.css'
import 'codemirror/theme/panda-syntax.css'
import 'codemirror/addon/hint/show-hint.css'
require('codemirror/lib/codemirror')
require('codemirror/mode/sql/sql')
require('codemirror/addon/hint/show-hint')
......@@ -105,7 +107,6 @@ export default {
return this.$refs.editQuerySQL.codemirror
}
},
data() {
return {
cmOptions: {
......@@ -131,8 +132,8 @@ export default {
dingUrl: '',
dingText: '',
status: 1,
serviceName: ''
// owner: this.getUserName
serviceName: '',
owner: ''
},
dataSourceList: [],
sqlList: [],
......@@ -199,54 +200,50 @@ export default {
message: '消息内容不能为空！',
trigger: 'blur'
}
],
owner: [
{
required: true,
message: '负责人不能为空！',
trigger: 'blur'
}
]
}
}
},
// 接收列表页面传递的参数
// activated() {
// this.DialogVisible = false
// var data = this.$route.query.data
// console.log('rrr', data)
// if (data === 'add') {
// this.isShow = false
// this.sqlMonitorForm = {}
// this.sqlMonitorForm.status = 1
// this.sqlMonitorForm.sql = ''
// } else {
// this.isShow = false
// this.sqlMonitorForm.id = data.id
// this.sqlMonitorForm.dingText = data.dingText
// this.sqlMonitorForm.dingUrl = data.dingUrl
// this.sqlMonitorForm.dsId = data.dsId
// this.sqlMonitorForm.serviceName = data.serviceName
// this.sqlMonitorForm.sql = data.sql
// this.sqlMonitorForm.status = data.status
// this.sqlMonitorForm.taskCron = data.taskCron
// this.sqlMonitorForm.taskName = data.taskName
// }
// },
// 接收列表页面传递的参数，赋值到编辑页面中
activated() {
this.DialogVisible = false
var id = this.$route.query.id
getDetailSqlMonitor({ id: id }).then((resp) => {
if (resp.data.businessCode === '0000') {
var data = resp.data.data
this.isShow = false
this.sqlMonitorForm.id = data.id
this.sqlMonitorForm.dingText = data.dingText
this.sqlMonitorForm.dingUrl = data.dingUrl
this.sqlMonitorForm.dsId = data.dsId
this.sqlMonitorForm.serviceName = data.serviceName
this.sqlMonitorForm.sql = data.sql
this.sqlMonitorForm.status = data.status
this.sqlMonitorForm.taskCron = data.taskCron
this.sqlMonitorForm.taskName = data.taskName
this.sqlMonitorForm.owner = data.owner
}
})
},
created() {
this.getSqlMonitorDataSource()
this.$bus.$on('data', (row) => {
// console.log('rrr', row)
if (row !== null) {
if (row === 'add') {
// 整体页面刷新
// location.reload()
this.isShow = false
this.sqlMonitorForm = {}
this.sqlMonitorForm.owner = this.getUserName
this.sqlMonitorForm.status = 1
this.sqlMonitorForm.sql = ''
} else {
this.isShow = false
this.sqlMonitorForm.id = row.id
this.sqlMonitorForm.dingText = row.dingText
this.sqlMonitorForm.dingUrl = row.dingUrl
this.sqlMonitorForm.dsId = row.dsId
this.sqlMonitorForm.serviceName = row.serviceName
this.sqlMonitorForm.sql = row.sql
this.sqlMonitorForm.status = row.status
this.sqlMonitorForm.taskCron = row.taskCron
this.sqlMonitorForm.taskName = row.taskName
}
}
})
......@@ -254,7 +251,7 @@ export default {
methods: {
testFoucs() {
var editor = this.$refs.editQuerySQL.codemirror
editor.on('cursorActivity', function () {
editor.on('inputRead', function () {
editor.showHint()
})
},
......@@ -307,6 +304,7 @@ export default {
},
// 发送测试按钮
sendTest() {
this.sqlMonitorForm.dingUrl.replace('\\n', '')
sendTestSqlMonitor(this.sqlMonitorForm).then((resp) => {
if (resp.data.businessCode === '0000') {
return this.$message.success(resp.data.msg)
......@@ -329,8 +327,9 @@ export default {
},
// 保存按钮
saveSqlMonitorFrom() {
this.sqlMonitorForm.owner = this.getUserName
this.sqlMonitorForm.taskClass = 'SqlMonitorHandler'
// 将换行符转化为空
this.sqlMonitorForm.dingUrl.replace('\\n', '')
this.$refs.sqlMonitorFormRef.validate((valid) => {
if (!valid) {
return false
......
src/views/monitor/SqlMonitorList.vue
View file @ 38a62f3a
......@@ -21,6 +21,8 @@
<el-table-column label="监控名称" prop="taskName" width="180px"></el-table-column>
<el-table-column label="执行策略" prop="taskCron" width="180px">
<template slot-scope="scope">
<p v-if="scope.row.taskCron==='0 */1 * * * ?'">每1分钟执行一次</p>
<p v-if="scope.row.taskCron==='0 */5 * * * ?'">每5分钟执行一次</p>
<p v-if="scope.row.taskCron==='0 0 * * * ?'">每小时执行一次</p>
<p v-if="scope.row.taskCron==='0 0 10 * * ?'">每天10点执行一次</p>
<p v-if="scope.row.taskCron==='0 0 10 ? * 2'">每周一上午10点执行一次</p>
......@@ -38,8 +40,10 @@
<el-table-column label="负责人" prop="owner" width="80px"></el-table-column>
<el-table-column label="当前状态" width="80px">
<template slot-scope="scope">
<p v-if="scope.row.status===1">启用</p>
<p v-if="scope.row.status===0">禁用</p>
<!-- <p v-if="scope.row.status===1">启用</p>
<p v-if="scope.row.status===0">禁用</p> -->
<el-tag type="success" v-if="scope.row.status===1">启用</el-tag>
<el-tag type="info" v-if="scope.row.status===0">禁用</el-tag>
</template>
</el-table-column>
<el-table-column label="创建时间" prop="createTime" width="180px"></el-table-column>
......@@ -87,13 +91,6 @@ export default {
serviceList: []
}
},
// 接收参数
// activated() {
// var data = this.$route.query.data
// if (data === 'refresh') {
// this.getSqlMonitorList()
// }
// },
created() {
this.getSqlMonitorList()
this.getServiceList()
......@@ -118,9 +115,6 @@ export default {
addSqlMonitor() {
this.$router.push({
path: `/monitor/addSqlMonitor`
// query: {
// data: 'add'
// }
})
this.$nextTick(function () {
// DOM 现在更新了
......@@ -131,14 +125,10 @@ export default {
// 编辑按钮
openEditMonitorDialog(row) {
this.$router.push({
path: `/monitor/addSqlMonitor`
// query: {
// data: row
// }
})
this.$nextTick(function () {
// DOM 现在更新了
this.$bus.$emit('data', row)
path: `/monitor/addSqlMonitor`,
query: {
id: row.id
}
})
},
// 获取服务列表
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment