This commit is contained in:
Jane
2023-12-28 11:12:04 +08:00
parent 7e763d9ba2
commit 46259b98cc
57 changed files with 1324 additions and 875 deletions

View File

@@ -7,9 +7,9 @@
</div>
<div class="card-panel-description">
<div class="card-panel-text">
New Visits
接入数据源数量
</div>
<count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" />
<count-to :start-val="0" :end-val="5" :duration="2600" class="card-panel-num" />
</div>
</div>
</el-col>
@@ -20,7 +20,7 @@
</div>
<div class="card-panel-description">
<div class="card-panel-text">
Messages
数据模型总数
</div>
<count-to :start-val="0" :end-val="81212" :duration="3000" class="card-panel-num" />
</div>

View File

@@ -1,5 +1,5 @@
<template>
<div class="login" :style="'background-image:url('+ Background +');'">
<!--<div class="login" :style="'background-image:url('+ Background +');'">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left" label-width="0px" class="login-form">
<div style="text-align: center;"> <img :src="allDataIcon" alt=""></div>
<h3 class="title">
@@ -33,12 +33,37 @@
</el-button>
</el-form-item>
</el-form>
<!-- 底部 -->
&lt;!&ndash; 底部 &ndash;&gt;
<div v-if="$store.state.settings.showFooter" id="el-login-footer">
<span v-html="$store.state.settings.footerTxt" />
<span v-if="$store.state.settings.caseNumber"> </span>
<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">{{ $store.state.settings.caseNumber }}</a>
</div>
</div>-->
<div id="app">
<div class="login-page">
<div class="loleft"></div>
<div class="loright">
<div class="locont">
<div class="title">数据标准符合性检测工具</div>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left" label-width="0px" class="login-form">
<el-form-item prop="username">
<el-input v-model="loginForm.username" prefix-icon="el-icon-user" type="text" auto-complete="off" placeholder="请输入账号"></el-input>
</el-form-item>
<el-form-item prop="password">
<el-input v-model="loginForm.password" prefix-icon="el-icon-view" type="password" auto-complete="off" placeholder="请输入密码" @keyup.enter.native="handleLogin"></el-input>
</el-form-item>
<el-form-item>
<el-button :loading="loading" type="primary" style="width:100%;" @click.native.prevent="handleLogin">
<span v-if="!loading"> </span>
<span v-else> 中...</span>
</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div><!--login-page-->
</div>
</template>

View File

@@ -25,7 +25,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -36,7 +36,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -50,7 +50,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -33,7 +33,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -44,7 +44,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -58,7 +58,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -33,7 +33,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -44,7 +44,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -58,7 +58,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -33,7 +33,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -44,7 +44,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -58,7 +58,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -25,7 +25,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -36,7 +36,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -50,7 +50,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -33,7 +33,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -44,7 +44,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -58,7 +58,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -1,18 +1,6 @@
<template>
<div class="app-container">
<iframe src="http://192.168.1.217:8001/model/modelChildren" width="100%" height="850px" frameborder="0" />
<!--<transition name="el-zoom-in-center">
<data-model-list v-if="options.showList" @showCard="showCard" />
</transition>
<transition name="el-zoom-in-top">
<data-model-add v-if="options.showAdd" :data="options.data" @showCard="showCard" />
</transition>
<transition name="el-zoom-in-top">
<data-model-edit v-if="options.showEdit" :data="options.data" @showCard="showCard" />
</transition>
<transition name="el-zoom-in-bottom">
<data-model-detail v-if="options.showDetail" :data="options.data" @showCard="showCard" />
</transition>-->
</div>
</template>
@@ -21,19 +9,9 @@ export default {
name: 'DataModel',
data() {
return {
options: {
data: {},
showList: true,
showAdd: false,
showEdit: false,
showDetail: false
}
}
},
methods: {
showCard(data) {
Object.assign(this.options, data)
}
}
}
</script>

View File

@@ -25,7 +25,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -36,7 +36,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -50,7 +50,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -1,197 +1,22 @@
<template>
<div class="app-container">
<el-row :gutter="20">
<el-col :span="6">
<el-card class="box-card tree-wrapper" shadow="always">
<el-tree
ref="leftTree"
:data="leftTreeOptions"
node-key="id"
empty-text="加载中请稍后"
:props="leftTreeDefaultProps"
default-expand-all
highlight-current
:expand-on-click-node="false"
@node-click="handleNodeClick"
>
<span slot-scope="{ node, data }" class="custom-tree-node">
<span><i v-if="node.level === 1" class="iconfont icon-zuzhi tree-folder" />{{ node.label }}</span>
</span>
</el-tree>
</el-card>
</el-col>
<el-col :span="18">
<el-card class="box-card tree-wrapper" shadow="always">
<el-row type="flex" justify="space-between">
<el-col :span="12">
<el-button-group>
<el-button
v-hasPerm="['metadata:dataauthorize:refresh']"
type="warning"
icon="el-icon-refresh"
size="mini"
@click="handleCacheRefresh"
>刷新缓存</el-button>
</el-button-group>
</el-col>
<el-col :span="12">
<el-button-group style="float: right;">
<template v-if="showBtns">
<el-button v-if="disabled" v-hasPerm="['metadata:dataauthorize:edit']" size="mini" round @click="disabled = false">修改</el-button>
<el-button v-else v-hasPerm="['metadata:dataauthorize:edit']" size="mini" round @click="handSubmit">保存</el-button>
</template>
</el-button-group>
</el-col>
</el-row>
<el-divider />
<el-form ref="form" :model="form" :disabled="disabled">
<el-tree
ref="rightTree"
:data="rightTreeOptions"
show-checkbox
accordion
node-key="id"
empty-text="加载中请稍后"
:props="rightTreeDefaultProps"
highlight-current
:expand-on-click-node="false"
:check-strictly="checkStrictly"
>
<span slot-scope="{ node, data }" class="custom-tree-node">
<span>
<i v-if="node.level === 1" class="iconfont icon-shujuku tree-folder" />
<i v-else-if="node.level === 2" class="iconfont icon-shujubiao tree-folder" />
<i v-else-if="node.level === 3" class="iconfont icon-shujuziduan tree-folder" />
{{ data.code ? (data.name ? data.code + '(' + data.name + ')' : data.code) : data.name }}
</span>
</span>
</el-tree>
</el-form>
</el-card>
</el-col>
</el-row>
<iframe src="http://192.168.1.217:8001/modelMonitor/dataextension" width="100%" height="850px" frameborder="0" />
</div>
</template>
<script>
import { listRole } from '@/api/systemMarket/role'
import { getDataMetadataTree } from '@/api/metadata/datacolumn'
import { getAuthorizedMetadata, metadataAuthorize, refreshAuthorize } from '@/api/metadata/dataauthorize'
export default {
name: 'DataAuthorize',
data() {
return {
tableHeight: document.body.offsetHeight - 310 + 'px',
// 左侧树
leftTreeOptions: [],
leftTreeDefaultProps: {
children: 'children',
label: 'roleName'
},
// 右侧树
rightTreeOptions: [],
rightTreeDefaultProps: {
children: 'children',
label: 'label'
},
checkStrictly: false,
form: {},
disabled: true,
showBtns: false,
btnSubmitEnable: false
}
},
created() {
this.getLeftTree()
this.getRightTree()
},
methods: {
getLeftTree() {
listRole().then(response => {
if (response.success) {
const { data } = response
const tree = {}
tree.roleName = '角色组'
tree.children = data
this.leftTreeOptions = []
this.leftTreeOptions.push(tree)
}
})
},
handleNodeClick(data) {
if (data.id) {
this.form.roleId = data.id
getAuthorizedMetadata(data.id).then(response => {
if (response.success) {
this.$refs.rightTree.setCheckedKeys([])
const checkedKeys = response.data || []
if (checkedKeys && checkedKeys.length > 0) {
this.checkStrictly = true
this.$nextTick(() => {
this.$refs.rightTree.setCheckedKeys(checkedKeys)
this.checkStrictly = false
})
}
this.showBtns = true
}
})
}
},
getRightTree() {
getDataMetadataTree('column').then(response => {
if (response.success) {
const { data } = response
this.rightTreeOptions = data
}
})
},
handSubmit() {
const data = []
const checkedNodes = this.$refs.rightTree.getCheckedNodes(false, true)
checkedNodes.forEach((item, index, arr) => {
const obj = {}
obj.objectId = item.id
obj.roleId = this.form.roleId
obj.objectType = item.type
data.push(obj)
})
metadataAuthorize({ roleId: this.form.roleId, authorizeDataList: data }).then(response => {
if (response.success) {
this.$message.success('保存成功')
this.disabled = true
}
})
},
handleCacheRefresh() {
refreshAuthorize().then(response => {
if (response.success) {
this.$message.success('刷新缓存成功')
} else {
this.$message.error('刷新缓存失败')
}
})
}
}
}
</script>
<style lang="scss" scoped>
.el-card ::v-deep .el-card__body {
height: calc(100vh - 170px);
}
.tree-wrapper {
overflow-y: auto;
::v-deep .custom-tree-node {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
.tree-folder {
margin-right: 5px;
color: #f6cf07;
}
}
}
</style>

View File

@@ -48,7 +48,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -59,7 +59,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -76,7 +76,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -3,66 +3,146 @@
<div slot="header" class="clearfix">
<span>{{ title }}</span>
<el-button-group style="float: right;">
<el-button v-if="active == 2" v-hasPerm="['metadata:datasource:add']" type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
<el-button v-if="active == 1" size="mini" type="primary" @click="handleNextStep">下一步</el-button>
<el-button v-if="active == 2" size="mini" type="primary" @click="handleLastStep">上一步</el-button>
<el-button v-if="active == 3" type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
<el-button v-if="active != 3" size="mini" type="primary" @click="handleNextStep">下一步</el-button>
<el-button v-if="active != 1" size="mini" type="primary" @click="handleLastStep">上一步</el-button>
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
</el-button-group>
</div>
<div class="body-wrapper">
<el-steps :active="active" finish-status="success" align-center>
<el-step title="数据源信息" />
<el-step title="连接信息" />
<el-step title="填写数据源信息" />
<el-step title="选择数据库类型" />
<el-step title="填写连接信息" />
</el-steps>
<el-form v-if="active == 1" ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="数据源类型" prop="dbType">
<el-select v-model="form.dbType">
<el-option
v-for="item in dbTypeOptions"
:key="item.id"
:label="item.itemValue"
:value="item.itemText"
/>
</el-select>
</el-form-item>
<el-form-item label="数据源名称" prop="sourceName">
<el-input v-model="form.sourceName" placeholder="请输入数据源名称" />
</el-form-item>
<el-form-item label="状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio
v-for="dict in statusOptions"
:key="dict.id"
:label="dict.itemText"
>{{ dict.itemValue }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
</el-form-item>
<div style="padding: 20px 200px">
<el-form-item label="数据源名称" prop="sourceName">
<el-input v-model="form.sourceName" placeholder="请输入数据源名称" />
</el-form-item>
<el-form-item label="状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio
v-for="dict in statusOptions"
:key="dict.id"
:label="dict.itemText"
>{{ dict.itemValue }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
</el-form-item>
</div>
</el-form>
<el-form v-if="active == 2" ref="form2" :model="form2" :rules="rules2" label-width="80px">
<el-form-item label="主机" prop="host">
<el-input v-model="form2.host" placeholder="请输入主机" />
</el-form-item>
<el-form-item label="端口" prop="port">
<el-input v-model="form2.port" placeholder="请输入端口" />
</el-form-item>
<el-form-item v-if="form.dbType === '3' || form.dbType === '4'" label="服务名" prop="sid">
<el-input v-model="form2.sid" placeholder="请输入服务名" />
</el-form-item>
<el-form-item v-if="form.dbType !== '3' && form.dbType !== '4'" label="数据库" prop="dbName">
<el-input v-model="form2.dbName" placeholder="请输入数据库" />
</el-form-item>
<el-form-item label="用户名" prop="username">
<el-input v-model="form2.username" placeholder="请输入用户名" />
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input v-model="form2.password" placeholder="请输入密码" />
</el-form-item>
<el-form-item>
<el-button v-hasPerm="['metadata:datasource:connect']" size="mini" type="primary" @click="handleCheckConnection">连通性检测</el-button>
</el-form-item>
<el-form v-if="active == 2" ref="form" :model="form" :rules="rules" label-width="120px">
<div class="modellist" style="padding: 20px 200px">
<div :class="[form.dbType =='1' ? 'choosedDbType' : '','list']" @click="chooseDbType('1')">
<div class="limg"><img :src="databaseImg.imgMySQL"></div>
<div class="ltitle">
<el-tooltip content="mysql数据库" placement="bottom" effect="light">
<p class="title">mysql</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='2' ? 'choosedDbType' : '','list']" @click="chooseDbType('2')">
<div class="limg"><img :src="databaseImg.imgMariaDB"></div>
<div class="ltitle">
<el-tooltip content="mariadb-3.0.3数据库" placement="bottom" effect="light">
<p class="title">mariadb-3.0.3</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='3' ? 'choosedDbType' : '','list']" @click="chooseDbType('3')">
<div class="limg"><img :src="databaseImg.imgOracle"></div>
<div class="ltitle">
<el-tooltip content="oracle数据库" placement="bottom" effect="light">
<p class="title">oracle</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='9' ? 'choosedDbType' : '','list']" @click="chooseDbType('9')">
<div class="limg"><img :src="databaseImg.imgdm8"></div>
<div class="ltitle">
<el-tooltip content="dm数据库" placement="bottom" effect="light">
<p class="title">dm</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='8' ? 'choosedDbType' : '','list']" @click="chooseDbType('8')">
<div class="limg"><img :src="databaseImg.imgibmdb2"></div>
<div class="ltitle">
<el-tooltip content="db2数据库" placement="bottom" effect="light">
<p class="title">db2</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='5' ? 'choosedDbType' : '','list']" @click="chooseDbType('5')">
<div class="limg"><img :src="databaseImg.imgPostgreSQL"></div>
<div class="ltitle">
<el-tooltip content="PostgreSQ数据库" placement="bottom" effect="light">
<p class="title">PostgreSQ</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='6' ? 'choosedDbType' : '','list']" @click="chooseDbType('6')">
<div class="limg"><img :src="databaseImg.imgSqlserver"></div>
<div class="ltitle">
<el-tooltip content="Sqlserver数据库" placement="bottom" effect="light">
<p class="title">Sqlserver</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='7' ? 'choosedDbType' : '','list']" @click="chooseDbType('7')">
<div class="limg"><img :src="databaseImg.imgkingbase"></div>
<div class="ltitle">
<el-tooltip content="kingbase数据库" placement="bottom" effect="light">
<p class="title">kingbase</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='10' ? 'choosedDbType' : '','list']" @click="chooseDbType('10')">
<div class="limg"><img :src="databaseImg.imggaussdb"></div>
<div class="ltitle">
<el-tooltip content="GaussDB数据库" placement="bottom" effect="light">
<p class="title">GaussDB</p>
</el-tooltip>
</div>
</div>
<div :class="[form.dbType =='4' ? 'choosedDbType' : '','list']" @click="chooseDbType('4')">
<div class="limg"><img :src="databaseImg.imgdefault"></div>
<div class="ltitle">
<el-tooltip content="MaxCompute数据库" placement="bottom" effect="light">
<p class="title">MaxCompute</p>
</el-tooltip>
</div>
</div>
</div><!--modellist 模型监控列表-->
</el-form>
<el-form v-if="active == 3" ref="form2" :model="form2" :rules="rules2" label-width="80px">
<div style="padding: 20px 200px">
<el-form-item label="主机" prop="host">
<el-input v-model="form2.host" placeholder="请输入主机" />
</el-form-item>
<el-form-item label="端口" prop="port">
<el-input v-model="form2.port" placeholder="请输入端口" />
</el-form-item>
<el-form-item v-if="form.dbType === '3' || form.dbType === '4'" label="服务名" prop="sid">
<el-input v-model="form2.sid" placeholder="请输入服务名" />
</el-form-item>
<el-form-item v-if="form.dbType !== '3' && form.dbType !== '4'" label="数据库" prop="dbName">
<el-input v-model="form2.dbName" placeholder="请输入数据库" />
</el-form-item>
<el-form-item label="用户名" prop="username">
<el-input v-model="form2.username" placeholder="请输入用户名" />
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input v-model="form2.password" placeholder="请输入密码" />
</el-form-item>
<el-form-item>
<el-button v-hasPerm="['metadata:datasource:connect']" size="mini" type="primary" @click="handleCheckConnection">连通性检测</el-button>
</el-form-item>
</div>
</el-form>
</div>
</el-card>
@@ -70,6 +150,17 @@
<script>
import { addDataSource, checkConnection } from '@/api/metadata/datasource'
import { createDataSource } from '@/api/datamodel/model'
import imgMySQL from '@/assets/database/MySQL.svg'
import imgMariaDB from '@/assets/database/MariaDB.svg'
import imgOracle from '@/assets/database/Oracle.svg'
import imgdm8 from '@/assets/database/dm8.png'
import imgibmdb2 from '@/assets/database/ibmdb2.png'
import imgPostgreSQL from '@/assets/database/PostgreSQL.svg'
import imgSqlserver from '@/assets/database/Sqlserver.svg'
import imgdefault from '@/assets/database/default.svg'
import imgkingbase from '@/assets/database/kingbase.png'
import imggaussdb from '@/assets/database/gaussdb.png'
export default {
name: 'DataSourceAdd',
@@ -84,6 +175,19 @@ export default {
data() {
return {
title: '数据源新增',
databaseImg: {
isActive: true,
imgMySQL: imgMySQL,
imgMariaDB: imgMariaDB,
imgOracle: imgOracle,
imgdm8: imgdm8,
imgibmdb2: imgibmdb2,
imgPostgreSQL: imgPostgreSQL,
imgSqlserver: imgSqlserver,
imgdefault: imgdefault,
imgkingbase: imgkingbase,
imggaussdb: imggaussdb
},
// 展示切换
showOptions: {
data: {},
@@ -124,7 +228,8 @@ export default {
dbName: undefined,
username: undefined,
password: undefined,
sid: undefined
sid: undefined,
schema: ''
},
rules2: {
host: [
@@ -180,6 +285,9 @@ export default {
handleLastStep() {
this.active--
},
chooseDbType(type) {
this.form.dbType = type
},
/** 检测数据库连通性 */
handleCheckConnection() {
this.$refs['form2'].validate(valid => {
@@ -204,6 +312,7 @@ export default {
addDataSource(this.form).then(response => {
if (response.success) {
this.$message.success('保存成功')
this.saveModelDataSource()
setTimeout(() => {
// 2秒后跳转列表页
this.$emit('showCard', this.showOptions)
@@ -221,6 +330,21 @@ export default {
})
}
})
},
saveModelDataSource() {
const dbType = this.form.dbType
const dataSource = {
projectId: '11111',
databaseName: this.form2.dbName,
schemaName: this.form2.schema === '' ? this.form2.dbName : this.form2.schema,
databaseType: dbType,
url: this.form2.host + this.form2.port,
username: this.form2.username,
password: this.form2.password
}
createDataSource(dataSource).then(() => {
}).catch(() => {
})
}
}
}
@@ -231,4 +355,7 @@ export default {
height: calc(100vh - 230px);
overflow-y: auto;
}
.choosedDbType{
border: 1px solid #165DFF;
}
</style>

View File

@@ -40,7 +40,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -51,7 +51,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -65,7 +65,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -1,189 +1,23 @@
<template>
<div class="app-container">
<el-card class="box-card" shadow="always">
<el-row>
<el-col :span="24">
<el-form :inline="true" class="demo-form-inline">
<el-form-item label="数据源">
<el-select v-model="sqlDataSource" placeholder="请选择数据源">
<el-option
v-for="source in sourceOptions"
:key="source.id"
:label="source.sourceName"
:value="source.id"
:disabled="source.status === '0'"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="mini" round :disabled="sqlExecuting" @click="runData">运行</el-button>
<el-button size="mini" round :disabled="!sqlExecuting" @click="stopData">停止</el-button>
<el-button size="mini" round :disabled="sqlExecuting" @click="formaterSql">格式化</el-button>
<el-button size="mini" round :disabled="sqlExecuting" @click="refreshData">重置</el-button>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<sql-editor
ref="sqleditor"
:value="sqlText"
style="height: 300px; margin: 20px 0;"
@changeTextarea="changeTextarea($event)"
/>
</el-col>
</el-row>
<el-row>
<el-col>
<div v-if="sqlExecuting" v-loading="sqlExecuting">数据加载中...</div>
<div v-else>
<div v-if="sqlConsole.length > 0">
<el-tabs v-model="activeTabName" type="border-card">
<el-tab-pane label="信息" name="table0">
<pre>{{ executeResultInfo }}</pre>
</el-tab-pane>
<el-tab-pane v-for="(item,index) in sqlConsole" :key="(index+1)" :name="'table'+(index+1)" :label="'结果'+(index+1)">
<el-table
:data="item.dataList"
stripe
border
:max-height="300"
style="width: 100%; margin: 15px 0;"
>
<el-table-column label="序号" width="55" align="center">
<template slot-scope="scope">
<span>{{ scope.$index + 1 }}</span>
</template>
</el-table-column>
<template v-for="(column, index) in item.columnList">
<el-table-column
:key="index"
:prop="column"
:label="column"
align="center"
show-overflow-tooltip
/>
</template>
</el-table>
</el-tab-pane>
</el-tabs>
</div>
</div>
</el-col>
</el-row>
</el-card>
<iframe src="http://192.168.1.217:8001/OnlinInquiry/OnlinInquiryChildren" width="100%" height="850px" frameborder="0" />
</div>
</template>
<script>
import sqlFormatter from 'sql-formatter'
import SqlEditor from '@/components/SqlEditor'
import { listDataSource } from '@/api/metadata/datasource'
import { runSql, stopSql } from '@/api/metadata/sqlconsole'
export default {
name: 'SqlConsole',
components: {
SqlEditor
},
data() {
return {
// 数据源数据字典
sourceOptions: [],
sqlDataSource: undefined,
sqlText: undefined,
sqlExecuting: false,
activeTabName: 'table0',
sqlExecutorId: undefined,
sqlConsole: [],
executeResultInfo: undefined
}
},
created() {
this.getDataSourceList()
},
methods: {
getDataSourceList() {
listDataSource().then(response => {
if (response.success) {
this.sourceOptions = response.data
}
})
},
runData() {
if (!this.sqlDataSource) {
this.$message.error('数据源不能为空')
return
}
if (!this.sqlText) {
this.$message.error('查询SQL不能为空')
return
}
this.sqlExecuting = true
this.sqlExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000)
this.sqlConsole = []
const data = {}
data.sqlKey = this.sqlExecutorId
data.sourceId = this.sqlDataSource
data.sqlText = this.sqlText
runSql(data).then(response => {
if (response.success) {
const { data } = response
let resultStr = ''
for (let i = 0; i < data.length; i++) {
const item = data[i]
resultStr += item.sql
resultStr += '\n> 状态:' + ((item.success) ? '成功' : '失败')
if (item.count && item.count >= 0) {
resultStr += '\n> 影响行数:' + item.count
}
resultStr += '\n> 耗时:' + (item.time || 0) / 1000 + 's'
resultStr += '\n\n'
}
this.executeResultInfo = resultStr
this.sqlConsole = data
}
this.sqlExecuting = false
})
},
stopData() {
const data = {}
data.sqlKey = this.sqlExecutorId
stopSql(data).then(response => {
if (response.success) {
this.$message.success('停止成功')
}
this.sqlExecuting = false
})
},
changeTextarea(val) {
this.sqlText = val
},
formaterSql() {
if (!this.sqlText) {
return
}
this.$refs.sqleditor.editor.setValue(sqlFormatter.format(this.$refs.sqleditor.editor.getValue()))
},
refreshData() {
if (!this.sqlText) {
return
}
this.sqlExecuting = false
this.activeTabName = 'table0'
this.sqlExecutorId = undefined
this.sqlText = undefined
this.$refs.sqleditor.editor.setValue('')
this.sqlConsole = []
this.executeResultInfo = undefined
}
}
}
</script>
<style lang="scss" scoped>
.el-card ::v-deep .el-card__body {
height: calc(100vh - 170px);
}
</style>

View File

@@ -58,7 +58,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -69,7 +69,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -83,7 +83,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>
@@ -167,7 +167,7 @@ export default {
name: 'CheckContentRuleList',
data() {
return {
tableHeight: document.body.offsetHeight - 310 + 'px',
tableHeight: document.body.offsetHeight - 330 + 'px',
// 展示切换
showOptions: {
data: {},

View File

@@ -32,7 +32,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -43,7 +43,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -57,7 +57,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>
@@ -71,6 +71,7 @@
:data="tableDataList"
border
tooltip-effect="dark"
:size="tableSize"
:height="tableHeight"
style="width: 100%;margin: 15px 0;"
>
@@ -120,12 +121,12 @@
icon="el-icon-edit-outline"
@click="handleEdit(scope.row)"
>修改</el-button>
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- icon="el-icon-view"-->
<!-- @click="handleRun(scope.row)"-->
<!-- >查看</el-button>-->
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- icon="el-icon-view"-->
<!-- @click="handleRun(scope.row)"-->
<!-- >查看</el-button>-->
</template>
</el-table-column>
</el-table>
@@ -175,6 +176,7 @@ export default {
formatter: this.statusFormatter
}
],
tableSize: 'medium',
// 默认选择中表格头
checkedTableColumns: [],
// 状态数据字典

View File

@@ -0,0 +1,259 @@
<template>
<el-card class="box-card" shadow="always">
<el-form ref="queryForm" :model="queryParams" :inline="true">
<el-form-item label="时间">
<el-date-picker
v-model="queryParams.checkDate"
type="date"
:clearable="false"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:picker-options="pickerOption"
placeholder="选择日期"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row type="flex" justify="space-between">
<el-col :span="12">
</el-col>
<el-col :span="12">
<div class="right-toolbar">
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
<el-dropdown-item command="small">中等</el-dropdown-item>
<el-dropdown-item command="mini">紧凑</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
<el-popover placement="bottom" width="100" trigger="click">
<el-checkbox-group v-model="checkedTableColumns" @change="handleCheckedColsChange">
<el-checkbox
v-for="(item, index) in tableColumns"
:key="index"
:label="item.prop"
>{{ item.label }}</el-checkbox>
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>
</el-tooltip>
</div>
</el-col>
</el-row>
<el-table
v-loading="loading"
:data="tableDataList"
border
tooltip-effect="dark"
:height="tableHeight"
:size="tableSize"
style="width: 100%;margin: 15px 0;"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" width="55" align="center">
<template slot-scope="scope">
<span>{{ scope.$index +1 }}</span>
</template>
</el-table-column>
<template v-for="(item, index) in tableColumns">
<el-table-column
v-if="item.show"
:key="index"
:prop="item.prop"
:label="item.label"
:formatter="item.formatter"
align="center"
show-overflow-tooltip
/>
</template>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleReport(scope.row)"
>查看报告</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
style="margin-bottom: 50px"
:page-sizes="[10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="queryParams.pageNum"
:page-size.sync="queryParams.pageSize"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</el-card>
</template>
<script>
import { pageCheckReport } from '@/api/quality/checkreport'
import moment from 'moment'
export default {
name: 'CheckReportList',
data() {
return {
tableHeight: document.body.offsetHeight - 330 + 'px',
// 展示切换
showOptions: {
data: {},
showList: true
},
// 遮罩层
loading: true,
// 表格头
tableColumns: [
{
prop: 'checkReportType',
label: '报告类型',
show: true,
formatter: this.checkReportTypeFormatter
},
{ prop: 'checkDate', label: '检测时间', show: true },
{
prop: 'checkResult',
label: '检测结果',
show: true,
formatter: this.checkResultFormatter
},
{ prop: 'checkTotalCount', label: '检测数量', show: true },
{ prop: 'checkErrorCount', label: '不合规数量', show: true }
],
// 默认选择中表格头
checkedTableColumns: [],
tableSize: 'medium',
// 状态数据字典
statusOptions: [],
// 数据集表格数据
tableDataList: [],
// 总数据条数
total: 0,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
checkDate: moment(moment().add(0, 'days').startOf('day').valueOf()).format('YYYY-MM-DD')
},
pickerOption: {
disabledDate(date) {
return date.getTime() > Date.now()
}
}
}
},
created() {
this.getList()
},
methods: {
initCols() {
this.checkedTableColumns = this.tableColumns.map(col => col.prop)
},
handleCheckedColsChange(val) {
this.tableColumns.forEach(col => {
if (!this.checkedTableColumns.includes(col.prop)) {
col.show = false
} else {
col.show = true
}
})
},
handleCommand(command) {
this.tableSize = command
},
getList() {
this.loading = true
pageCheckReport(this.queryParams).then(response => {
this.loading = false
if (response.success) {
const { data } = response
this.tableDataList = data.data
this.total = data.total
}
})
},
handleReport(row) {
this.showOptions.data = row
this.showOptions.showList = false
this.showOptions.showDetail = true
this.$emit('showCard', this.showOptions)
},
handleSizeChange(val) {
console.log(`每页 ${val}`)
this.queryParams.pageNum = 1
this.queryParams.pageSize = val
this.getList()
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`)
this.queryParams.pageNum = val
this.getList()
},
checkReportTypeFormatter(row, column, cellValue, index) {
if (cellValue === 'structure') {
return '结构符合性检测报告'
} else {
return '内容符合性检测报告'
}
},
checkResultFormatter(row, column, cellValue, index) {
if (cellValue === '1') {
return <el-tag type='success'> 成功</el-tag>
} else {
return <el-tag type='warning'> 失败</el-tag>
}
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams = {
pageNum: 1,
pageSize: 20,
sourceName: ''
}
this.handleQuery()
},
/** 刷新列表 */
handleRefresh() {
this.getList()
}
}
}
</script>
<style lang="scss" scoped>
.right-toolbar {
float: right;
}
.el-card ::v-deep .el-card__body {
height: calc(100vh - 170px);
}
</style>

View File

@@ -0,0 +1,435 @@
<template>
<div class="app-container">
<el-card class="box-card" shadow="always">
<div slot="header" class="clearfix">
<el-button-group style="float: right;">
<el-button type="primary" size="mini" icon="el-icon-download">导出</el-button>
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
</el-button-group>
</div>
<div class="body-wrapper">
<h4 style="text-align: center;">{{ date }}{{ data.checkReportType === 'structure' ? '结构符合性' : '内容符合性' }}检测结果报告</h4>
<el-divider content-position="left"><h3>检测指标统计分析</h3></el-divider>
<el-row :gutter="20">
<div>
<el-row :gutter="20">
<el-col :span="6">
<div>
<el-statistic
group-separator=","
:precision="0"
:value="data.checkTotalCount"
title="检测表总数"
></el-statistic>
</div>
</el-col>
<el-col :span="6">
<div>
<el-statistic title="检测总耗时(毫秒)">
<template slot="formatter">
{{ data.checkTimeConsuming }}
</template>
</el-statistic>
</div>
</el-col>
<el-col :span="6">
<div>
<el-statistic
group-separator=","
:precision="0"
decimal-separator="."
:value="data.checkErrorCount"
title="不合规总数"
>
<template slot="prefix">
<i class="el-icon-s-flag" style="color: red"></i>
</template>
</el-statistic>
</div>
</el-col>
<el-col :span="6">
<div>
<el-statistic title="不合规率">
<template slot="prefix">
<span class="like">
<i class="el-icon-star-on" style="color:red"></i>
</span>
</template>
<template slot="formatter">
{{ (data.checkErrorCount / data.checkTotalCount * 100) + '%' }}
</template>
</el-statistic>
</div>
</el-col>
</el-row>
</div>
</el-row>
<el-divider content-position="left"><h3>不合规统计分析</h3></el-divider>
<el-row :gutter="20">
<el-col :span="10">
<h5>按数据源统计不合规数量</h5>
<el-table
:data="reportTableData1"
:span-method="objectSpanMethod1"
border
default-expand-all
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleLevelName" label="规则级别" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center">
<template slot-scope="scope">
<el-progress :percentage="scope.row.checkErrorCount" :stroke-width="20" :text-inside="true" :color="colorFormat(scope.row.ruleLevelName)" :format="cellFormat" />
</template>
</el-table-column>
</el-table>
</el-col>
<el-col :span="10" :offset="4">
<h5>按规则类型统计不合规数量</h5>
<el-table
:data="reportTableData2"
:span-method="objectSpanMethod2"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleTypeName" label="规则类型" align="center" />
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center">
<template slot-scope="scope">
<el-badge :value="scope.row.ruleLevelName" :type="typeFormat(scope.row.ruleLevelName)">
{{ scope.row.checkErrorCount }}
</el-badge>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<el-divider content-position="left"><h3>规则类型统计分析</h3></el-divider>
<el-row>
<el-col :span="24">
<h5>唯一性分析</h5>
<el-table
:data="uniqueTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>完整性分析</h5>
<el-table
:data="integrityTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>一致性分析</h5>
<el-table
:data="consistentTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>关联性分析</h5>
<el-table
:data="relevanceTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>及时性分析</h5>
<el-table
:data="timelinessTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>准确性分析</h5>
<el-table
:data="accuracyTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
</div>
</el-card>
</div>
</template>
<script>
import { getReportBySource, getReportByType, getReportDetail } from '@/api/quality/checkreport'
import moment from 'moment'
export default {
name: 'CheckReportStructure',
props: {
data: {
type: Object,
default: function() {
return {}
}
}
},
data() {
return {
queryParams: {
checkDate: ''
},
pickerOption: {
disabledDate(date) {
return date.getTime() > Date.now()
}
},
date: '',
// 展示切换
showOptions: {
data: {},
showList: true,
showDetail: false
},
spanArr1: [],
position1: 0,
reportTableData1: [],
spanArr2: [],
position2: 0,
reportTableData2: [],
// 唯一性核查数据
uniqueTableData: [],
// 完整性核查数据
integrityTableData: [],
// 准确性核查数据
accuracyTableData: [],
// 一致性核查数据
consistentTableData: [],
// 关联性核查数据
relevanceTableData: [],
// 及时性核查数据
timelinessTableData: [],
like: true,
value1: 4154.564,
totalTables: 1314,
title: '增长人数'
}
},
created() {
this.queryParams.checkDate = moment(this.data.checkDate).format('YYYY-MM-DD')
this.handleQuery()
},
methods: {
showCard() {
this.$emit('showCard', this.showOptions)
},
handleQuery() {
this.spanArr1 = []
this.spanArr2 = []
this.getReportData1()
this.getReportData2()
this.getReportData3()
this.date = moment(this.queryParams.checkDate).format('YYYY年MM月DD日')
},
getReportData1() {
getReportBySource({ checkDate: this.queryParams.checkDate }).then(response => {
if (response.success) {
this.reportTableData1 = response.data
this.rowspan1()
}
})
},
getReportData2() {
getReportByType({ checkDate: this.queryParams.checkDate }).then(response => {
if (response.success) {
this.reportTableData2 = response.data
this.rowspan2()
}
})
},
rowspan1() {
this.reportTableData1.forEach((item, index) => {
if (index === 0) {
this.spanArr1.push(1)
this.position1 = 0
} else {
if (this.reportTableData1[index].ruleSourceId === this.reportTableData1[index - 1].ruleSourceId) {
this.spanArr1[this.position1] += 1
this.spanArr1.push(0)
} else {
this.spanArr1.push(1)
this.position1 = index
}
}
})
},
objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
const _row = this.spanArr1[rowIndex]
const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
colspan: _col
}
}
},
rowspan2() {
this.reportTableData2.forEach((item, index) => {
if (index === 0) {
this.spanArr2.push(1)
this.position2 = 0
} else {
if (this.reportTableData2[index].ruleTypeId === this.reportTableData2[index - 1].ruleTypeId) {
this.spanArr2[this.position2] += 1
this.spanArr2.push(0)
} else {
this.spanArr2.push(1)
this.position2 = index
}
}
})
},
objectSpanMethod2({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
const _row = this.spanArr2[rowIndex]
const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
colspan: _col
}
}
},
colorFormat(level) {
if (level === '低') {
return '#409eff'
} else if (level === '中') {
return '#e6a23c'
} else {
return '#f56c6c'
}
},
cellFormat(percentage) {
return `${percentage}`
},
typeFormat(level) {
if (level === '低') {
return 'primary'
} else if (level === '中') {
return 'warning'
} else {
return 'danger'
}
},
getReportData3() {
getReportDetail({ checkDate: this.queryParams.checkDate }).then(response => {
if (response.success) {
this.uniqueTableData = response.data.unique
this.integrityTableData = response.data.integrity
this.accuracyTableData = response.data.accuracy
this.consistentTableData = response.data.consistent
this.relevanceTableData = response.data.relevance
this.timelinessTableData = response.data.timeliness
}
})
}
}
}
</script>
<style lang="scss" scoped>
.el-card ::v-deep .el-card__body {
height: calc(100vh - 230px);
overflow-y: auto;
}
.form-inline {
::v-deep .el-form-item {
margin-bottom: 0px;
}
}
::v-deep .el-badge__content {
margin-top: 10px;
right: 0px;
}
::v-deep .el-table__header th {
background-color: #f5f5f5 !important;
}
</style>

View File

@@ -1,374 +1,38 @@
<template>
<div class="app-container">
<el-card class="box-card" shadow="always">
<div slot="header" class="clearfix">
<el-form ref="queryForm" :model="queryParams" :inline="true" class="form-inline">
<el-form-item label="时间">
<el-date-picker
v-model="queryParams.checkDate"
type="date"
:clearable="false"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:picker-options="pickerOption"
placeholder="选择日期"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
</el-form-item>
</el-form>
</div>
<div class="body-wrapper">
<h4 style="text-align: center;">{{ date }}质量分析报告</h4>
<el-divider content-position="left"><h3>错误量统计分析</h3></el-divider>
<el-row :gutter="20">
<el-col :span="10">
<h5>按数据源统计错误数量</h5>
<el-table
:data="reportTableData1"
:span-method="objectSpanMethod1"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleLevelName" label="规则级别" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center">
<template slot-scope="scope">
<el-progress :percentage="scope.row.checkErrorCount" :stroke-width="20" :text-inside="true" :color="colorFormat(scope.row.ruleLevelName)" :format="cellFormat" />
</template>
</el-table-column>
</el-table>
</el-col>
<el-col :span="10" :offset="4">
<h5>按规则类型统计错误数量</h5>
<el-table
:data="reportTableData2"
:span-method="objectSpanMethod2"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleTypeName" label="规则类型" align="center" />
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center">
<template slot-scope="scope">
<el-badge :value="scope.row.ruleLevelName" :type="typeFormat(scope.row.ruleLevelName)">
{{ scope.row.checkErrorCount }}
</el-badge>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<el-divider content-position="left"><h3>规则类型统计分析</h3></el-divider>
<el-row>
<el-col :span="24">
<h5>唯一性分析</h5>
<el-table
:data="uniqueTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>完整性分析</h5>
<el-table
:data="integrityTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>一致性分析</h5>
<el-table
:data="consistentTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>关联性分析</h5>
<el-table
:data="relevanceTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>及时性分析</h5>
<el-table
:data="timelinessTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<h5>准确性分析</h5>
<el-table
:data="accuracyTableData"
border
tooltip-effect="dark"
:max-height="250"
style="width: 100%; margin: 15px 0;"
>
<el-table-column prop="ruleName" label="规则名称" align="center" />
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
<el-table-column prop="ruleTableName" label="数据表(英文)" align="center" />
<el-table-column prop="ruleTableComment" label="数据表(中文)" align="center" />
<el-table-column prop="ruleColumnName" label="核查字段(英文)" align="center" />
<el-table-column prop="ruleColumnComment" label="核查字段(中文)" align="center" />
<el-table-column prop="checkTotalCount" label="核查数" align="center" />
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
</el-table>
</el-col>
</el-row>
</div>
</el-card>
<transition name="el-zoom-in-center">
<check-report-list v-if="options.showList" @showCard="showCard" />
</transition>
<transition name="el-zoom-in-bottom">
<check-report-structure v-if="options.showDetail" :data="options.data" @showCard="showCard" />
</transition>
</div>
</template>
<script>
import { getReportBySource, getReportByType, getReportDetail } from '@/api/quality/checkreport'
import moment from 'moment'
import CheckReportList from './CheckReportList'
import CheckReportStructure from './CheckReportStructure'
export default {
name: 'CheckReport',
data() {
return {
queryParams: {
checkDate: moment(moment().add(0, 'days').startOf('day').valueOf()).format('YYYY-MM-DD')
},
pickerOption: {
disabledDate(date) {
return date.getTime() > Date.now()
}
},
date: moment().subtract('days', 1).format('YYYY年MM月DD日'),
spanArr1: [],
position1: 0,
reportTableData1: [],
spanArr2: [],
position2: 0,
reportTableData2: [],
// 唯一性核查数据
uniqueTableData: [],
// 完整性核查数据
integrityTableData: [],
// 准确性核查数据
accuracyTableData: [],
// 一致性核查数据
consistentTableData: [],
// 关联性核查数据
relevanceTableData: [],
// 及时性核查数据
timelinessTableData: []
}
},
created() {
/* this.getReportData1()
this.getReportData2()
this.getReportData3()*/
this.handleQuery()
},
methods: {
handleQuery() {
this.spanArr1 = []
this.spanArr2 = []
this.getReportData1()
this.getReportData2()
this.getReportData3()
this.date = moment(this.queryParams.checkDate).format('YYYY年MM月DD日')
},
getReportData1() {
getReportBySource({ checkDate: this.queryParams.checkDate }).then(response => {
if (response.success) {
this.reportTableData1 = response.data
this.rowspan1()
}
})
},
getReportData2() {
getReportByType({ checkDate: this.queryParams.checkDate }).then(response => {
if (response.success) {
this.reportTableData2 = response.data
this.rowspan2()
}
})
},
rowspan1() {
this.reportTableData1.forEach((item, index) => {
if (index === 0) {
this.spanArr1.push(1)
this.position1 = 0
} else {
if (this.reportTableData1[index].ruleSourceId === this.reportTableData1[index - 1].ruleSourceId) {
this.spanArr1[this.position1] += 1
this.spanArr1.push(0)
} else {
this.spanArr1.push(1)
this.position1 = index
}
}
})
},
objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
const _row = this.spanArr1[rowIndex]
const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
colspan: _col
export default {
name: 'CheckReport',
components: { CheckReportList, CheckReportStructure },
data() {
return {
options: {
data: {},
showList: true
}
}
},
rowspan2() {
this.reportTableData2.forEach((item, index) => {
if (index === 0) {
this.spanArr2.push(1)
this.position2 = 0
} else {
if (this.reportTableData2[index].ruleTypeId === this.reportTableData2[index - 1].ruleTypeId) {
this.spanArr2[this.position2] += 1
this.spanArr2.push(0)
} else {
this.spanArr2.push(1)
this.position2 = index
}
}
})
},
objectSpanMethod2({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
const _row = this.spanArr2[rowIndex]
const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
colspan: _col
}
methods: {
showCard(data) {
console.log('ffffffffff', data)
Object.assign(this.options, data)
}
},
colorFormat(level) {
if (level === '低') {
return '#409eff'
} else if (level === '中') {
return '#e6a23c'
} else {
return '#f56c6c'
}
},
cellFormat(percentage) {
return `${percentage}`
},
typeFormat(level) {
if (level === '低') {
return 'primary'
} else if (level === '中') {
return 'warning'
} else {
return 'danger'
}
},
getReportData3() {
getReportDetail({ checkDate: this.queryParams.checkDate }).then(response => {
if (response.success) {
this.uniqueTableData = response.data.unique
this.integrityTableData = response.data.integrity
this.accuracyTableData = response.data.accuracy
this.consistentTableData = response.data.consistent
this.relevanceTableData = response.data.relevance
this.timelinessTableData = response.data.timeliness
}
})
}
}
}
</script>
<style lang="scss" scoped>
.el-card ::v-deep .el-card__body {
height: calc(100vh - 230px);
overflow-y: auto;
}
.form-inline {
::v-deep .el-form-item {
margin-bottom: 0px;
}
}
::v-deep .el-badge__content {
margin-top: 10px;
right: 0px;
}
::v-deep .el-table__header th {
background-color: #f5f5f5 !important;
}
</style>

View File

@@ -78,7 +78,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -89,7 +89,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -103,7 +103,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>
@@ -187,7 +187,7 @@ export default {
name: 'CheckRuleList',
data() {
return {
tableHeight: document.body.offsetHeight - 310 + 'px',
tableHeight: document.body.offsetHeight - 330 + 'px',
// 展示切换
showOptions: {
data: {},

View File

@@ -43,7 +43,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -54,7 +54,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -68,7 +68,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -79,7 +79,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -90,7 +90,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -104,7 +104,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -72,7 +72,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -83,7 +83,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -97,7 +97,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -33,7 +33,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -44,7 +44,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -58,7 +58,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -40,7 +40,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -51,7 +51,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -65,7 +65,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>

View File

@@ -63,7 +63,7 @@
<el-tooltip content="密度" effect="dark" placement="top">
<el-dropdown trigger="click" @command="handleCommand">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="colum-height" />
<i class="el-icon-s-grid"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="medium">正常</el-dropdown-item>
@@ -74,7 +74,7 @@
</el-tooltip>
<el-tooltip content="刷新" effect="dark" placement="top">
<el-button circle size="mini" @click="handleRefresh">
<svg-icon class-name="size-icon" icon-class="shuaxin" />
<i class="el-icon-refresh"></i>
</el-button>
</el-tooltip>
<el-tooltip content="列设置" effect="dark" placement="top">
@@ -88,7 +88,7 @@
</el-checkbox-group>
<span slot="reference">
<el-button circle size="mini">
<svg-icon class-name="size-icon" icon-class="shezhi" />
<i class="el-icon-setting"></i>
</el-button>
</span>
</el-popover>