Compare commits
25 Commits
7e763d9ba2
...
develop-20
| Author | SHA1 | Date | |
|---|---|---|---|
| 0e66e4765b | |||
| 83be612c27 | |||
| 604665cd71 | |||
| 105f15ae3c | |||
| 187c583291 | |||
| c196898fa2 | |||
| 676c93cc6b | |||
| bc2adcd8f2 | |||
|
|
9f9ed2dd73 | ||
|
|
2b10f1d563 | ||
|
|
0c4218ad93 | ||
| d5faa38c7e | |||
|
|
26ee0e00b0 | ||
|
|
64d9d6d1c3 | ||
|
|
f00ead8849 | ||
| 875f6713a7 | |||
| 7c4168a813 | |||
| e0660046c2 | |||
|
|
c3d47f90a1 | ||
|
|
45477138ff | ||
| bb8870d44e | |||
| bc0a854b57 | |||
| c1ea0180dd | |||
|
|
b635578cbe | ||
|
|
46259b98cc |
14
.eslintrc.js
@@ -53,7 +53,7 @@ module.exports = {
|
||||
'after': true
|
||||
}],
|
||||
'handle-callback-err': [2, '^(err|error)$'],
|
||||
'indent': [2, 2, {
|
||||
'indent': ['off', 2, 2, {
|
||||
'SwitchCase': 1
|
||||
}],
|
||||
'jsx-quotes': [2, 'prefer-single'],
|
||||
@@ -193,6 +193,16 @@ module.exports = {
|
||||
'object-curly-spacing': [2, 'always', {
|
||||
objectsInObjects: false
|
||||
}],
|
||||
'array-bracket-spacing': [2, 'never']
|
||||
'array-bracket-spacing': [2, 'never'],
|
||||
"vue/mustache-interpolation-spacing": ["error", "always" | "never"],
|
||||
"vue/html-self-closing": ["error",{
|
||||
"html": {
|
||||
"void": "never",
|
||||
"normal": "any",
|
||||
"component": "any"
|
||||
},
|
||||
"svg": "always",
|
||||
"math": "always"
|
||||
}],
|
||||
}
|
||||
}
|
||||
|
||||
@@ -67,6 +67,13 @@ server {
|
||||
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||
}
|
||||
|
||||
location /salpa/ {
|
||||
proxy_pass http://192.168.1.217:9080/;
|
||||
proxy_set_header Host $proxy_host;
|
||||
proxy_set_header X-Real-IP $remote_addr;
|
||||
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||
}
|
||||
|
||||
#error_page 404 /404.html;
|
||||
|
||||
# redirect server error pages to the static page /50x.html
|
||||
|
||||
BIN
public/static/your-word-document.docx
Normal file
18
src/api/datamodel/model.js
Normal file
@@ -0,0 +1,18 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function createDataSource(data) {
|
||||
return request({
|
||||
url: '/salpa/subject/project/createDataSource',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export function editDataSource(data) {
|
||||
return request({
|
||||
url: '/salpa/subject/project/updateDataSource',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
@@ -113,3 +113,21 @@ export function getMetadatablood(data) {
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export function uploadFile(data, type) {
|
||||
return request({
|
||||
url: '/data/metadata/sources/upload/' + type,
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export function pageOfflineData(data) {
|
||||
return request({
|
||||
url: '/data/metadata/offline/page',
|
||||
method: 'get',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
39
src/api/monitor/projectApi.js
Normal file
@@ -0,0 +1,39 @@
|
||||
import request from '@/utils/request'
|
||||
export function pageProjectList(data) {
|
||||
console.log('data==', data)
|
||||
return request({
|
||||
url: '/salpa/subject/project/pageList',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export function addProject(data) {
|
||||
return request({
|
||||
url: '/salpa/subject/project/addProject',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export function getProjectById(id) {
|
||||
return request({
|
||||
url: '/salpa/subject/project/getNewProjectById?id=' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
export function updateProject(data) {
|
||||
return request({
|
||||
url: '/salpa/subject/project/updateNewProject',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export function delNewProject(id) {
|
||||
return request({
|
||||
url: '/salpa/subject/project/deleteNewProject?id=' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
1
src/assets/database/Hive.svg
Normal file
|
After Width: | Height: | Size: 19 KiB |
15
src/assets/database/MariaDB.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 789.1 195.64" height="48">
|
||||
<defs>
|
||||
<style>.cls-1{fill:#003545;}</style>
|
||||
</defs>
|
||||
<title>MDB-HLogo_RGB</title>
|
||||
<path class="cls-1" d="M378.08,70l18.52,71.5h-14L370.26,90l-23.17,51.5H335.3l-23.07-51.2-12.68,51.2H285.89L304.21,70h12.08l24.95,55.36L366.1,70Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M449.27,97.64V89.32h13.47v52.19H449.27v-8.42c-3.56,6-10.89,9.51-19.8,9.51-18.62,0-29-13.08-29-28.23,0-14.55,9.9-26.24,27-26.24C437.29,88.13,445.41,91.5,449.27,97.64Zm-34.46,17.43c0,9.6,6,17.82,17.72,17.82,11.29,0,17.43-8,17.43-17.53s-6.33-17.62-18-17.62C420.65,97.74,414.81,105.86,414.81,115.07Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M493.13,141.51H479.66V89.32h13.47V101c3.56-8,10.79-12.87,18.81-12.87a24.2,24.2,0,0,1,8.42,1.39l-2.87,9.9a29.66,29.66,0,0,0-7.13-1c-9.71,0-17.23,7.33-17.23,18.12Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M527.09,75.55a6.86,6.86,0,0,1,7.23-7,7.1,7.1,0,0,1,7.33,7.23c0,3.47-2.38,6.93-7.33,6.93A6.93,6.93,0,0,1,527.09,75.55Zm.59,13.77h13.47v38.13c0,2.37.5,4.06,2.48,4.06a14.37,14.37,0,0,0,2.57-.3l2.08,9.8a23.72,23.72,0,0,1-8.91,1.59c-5.65,0-11.69-1.69-11.69-14.46Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M601.36,97.64V89.32h13.46v52.19H601.36v-8.42c-3.57,6-10.9,9.51-19.81,9.51-18.62,0-29-13.08-29-28.23,0-14.55,9.91-26.24,27-26.24C589.37,88.13,597.49,91.5,601.36,97.64Zm-34.47,17.43c0,9.6,6,17.82,17.73,17.82,11.29,0,17.43-8,17.43-17.53s-6.34-17.62-18-17.62C572.74,97.74,566.89,105.86,566.89,115.07Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M635.51,70H667.8c27.13,0,40.7,14.95,40.5,35.75.2,21.59-14.76,35.75-38.13,35.75H635.51Zm8.91,6.34v58.92H669c21.59,0,29.81-14.56,29.81-29.71,0-17.13-10.3-29.21-29.81-29.21Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M763.35,141.51h-41V70h36.94c14.16,0,27.63,2.67,27.43,18.52,0,11.19-6.93,14.26-14.26,15.45,10.4.89,16.64,7.52,16.64,18.22C789.19,138.24,775.13,141.51,763.35,141.51Zm-3.07-40.31c14.16,0,17.33-5.44,17.33-12.38,0-10.39-6.34-12.77-17.33-12.77H730.87V101.2Zm.39,6h-29.8v28.23H762c8.72,0,17.93-2.88,17.93-13.87C779.89,108.93,769.29,107.24,760.67,107.24Z" transform="translate(0 -3.38)"></path>
|
||||
<path class="cls-1" d="M299.2,4.34a4.35,4.35,0,0,0-2.92-1c-2.9,0-6.65,2-8.66,3-.35.19-.62.33-.81.41A27.32,27.32,0,0,1,276,9.53c-3.86.12-7.19.35-11.5.8C238.82,13,227.43,32.6,216.42,51.6c-6,10.32-12.18,21-20.67,29.28a54.92,54.92,0,0,1-5.59,4.74c-8.78,6.54-19.81,11.17-28.43,14.47-8.26,3.15-17.28,6-26,8.74-8,2.51-15.51,4.89-22.44,7.46-3.13,1.16-5.79,2-8.13,2.83-6.31,2.1-10.87,3.62-17.51,8.17-2.59,1.77-5.19,3.69-7,5.14A73.46,73.46,0,0,0,66.8,147.05a86.62,86.62,0,0,1-11.6,14c-1.4,1.37-3.89,2-7.62,2-4.37,0-9.67-.9-15.28-1.85-5.77-1-11.75-2-16.87-2-4.17,0-7.35.67-9.74,2.06,0,0-4,2.34-5.69,5.36l1.66.75a34.71,34.71,0,0,1,7.1,5.07,35.39,35.39,0,0,0,7.37,5.25,6.61,6.61,0,0,1,2.27,1.51c-.7,1-1.73,2.35-2.8,3.76-5.92,7.74-9.37,12.63-7.39,15.29a6.09,6.09,0,0,0,3,.71c12.9,0,19.82-3.36,28.59-7.6,2.54-1.23,5.16-2.5,8.16-3.8,5.12-2.22,10.64-5.76,16.48-9.52,7.74-5,15.74-10.11,23.49-12.6a64,64,0,0,1,19.71-2.77c8.23,0,16.83,1.1,25.15,2.17,6.21.79,12.63,1.61,18.93,2,2.45.15,4.72.22,6.92.22a77.2,77.2,0,0,0,8.83-.47l.7-.24c4.42-2.72,6.49-8.55,8.5-14.18,1.29-3.63,2.37-6.89,4.05-9a2.79,2.79,0,0,1,.34-.28.4.4,0,0,1,.5.09s0,.05,0,.15c-1.06,22.06-9.9,36.05-18.88,48.49l-6,6.43s8.39,0,13.16-1.84c17.42-5.21,30.58-16.69,40.15-35a149.42,149.42,0,0,0,6.32-14.44c.16-.41,1.68-1.17,1.53.95,0,.63-.09,1.32-.14,2h0c0,.43-.06.87-.08,1.31-.25,3-1,9.57-1,9.57l5.38-2.88c13-8.22,23-24.74,30.56-50.47,3.16-10.72,5.47-21.37,7.51-30.76,2.44-11.23,4.55-20.93,7-24.68,3.78-5.89,9.55-9.87,15.13-13.73l2.28-1.58c7-4.93,14-10.62,15.54-21.22l0-.24C301.22,7.29,300.27,5.27,299.2,4.34Z" transform="translate(0 -3.38)"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.9 KiB |
1
src/assets/database/MySQL.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1645770420428" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1363" width="48" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M1017.6 521.6c-3.2-3.2-6.4-6.4-6.4-9.6-6.4-12.8-16-22.4-28.8-32-9.6-6.4-28.8-16-32-25.6 6.4 0 12.8-3.2 19.2-3.2 9.6-3.2 16-3.2 25.6-3.2 3.2 0 9.6-3.2 12.8-3.2v-3.2c-3.2-6.4-9.6-12.8-12.8-19.2-12.8-12.8-28.8-25.6-44.8-38.4-9.6-6.4-19.2-9.6-28.8-16-3.2-3.2-9.6-3.2-9.6-6.4-3.2-6.4-6.4-16-9.6-22.4-6.4-16-16-35.2-22.4-54.4-3.2-12.8-6.4-25.6-12.8-35.2-28.8-51.2-57.6-83.2-102.4-115.2-9.6-6.4-22.4-9.6-35.2-12.8h-19.2c-3.2-3.2-9.6-6.4-12.8-9.6-16-9.6-54.4-35.2-67.2-3.2-6.4 19.2 9.6 38.4 16 48 3.2 6.4 9.6 16 12.8 22.4 3.2 6.4 3.2 9.6 3.2 16 6.4 12.8 9.6 28.8 16 41.6l9.6 19.2c3.2 3.2 6.4 6.4 6.4 9.6-3.2 6.4-3.2 16-6.4 22.4-9.6 35.2-6.4 76.8 6.4 102.4 3.2 6.4 16 25.6 28.8 19.2 12.8-6.4 9.6-22.4 12.8-38.4 0-3.2 0-6.4 3.2-9.6 3.2 9.6 6.4 16 9.6 25.6 9.6 16 22.4 32 35.2 41.6 6.4 6.4 12.8 16 19.2 19.2l-6.4-6.4c-6.4-6.4-9.6-12.8-12.8-19.2-12.8-19.2-22.4-35.2-28.8-54.4-3.2-9.6-9.6-19.2-12.8-28.8-3.2-3.2-3.2-9.6-3.2-9.6-3.2 6.4-9.6 12.8-12.8 19.2-6.4 12.8-6.4 28.8-6.4 44.8-9.6-3.2-12.8-12.8-16-22.4-6.4-22.4-9.6-57.6-3.2-83.2 3.2-6.4 9.6-25.6 6.4-32-3.2-6.4-6.4-9.6-9.6-12.8l-9.6-19.2c-6.4-16-9.6-35.2-16-54.4-3.2-6.4-9.6-16-12.8-22.4-6.4-9.6-9.6-12.8-16-22.4 0-3.2-3.2-9.6 0-12.8 0-3.2 3.2-3.2 3.2-3.2 3.2-3.2 12.8 0 16 3.2 9.6 3.2 19.2 9.6 25.6 16 3.2 3.2 6.4 9.6 12.8 9.6h6.4c9.6 3.2 19.2 0 25.6 3.2 12.8 6.4 25.6 12.8 38.4 22.4 35.2 25.6 64 60.8 83.2 105.6 3.2 6.4 3.2 12.8 6.4 22.4 6.4 16 12.8 28.8 19.2 44.8 6.4 12.8 9.6 28.8 19.2 41.6 3.2 6.4 19.2 9.6 28.8 12.8l19.2 9.6c9.6 6.4 19.2 12.8 25.6 19.2 3.2 3.2 19.2 9.6 19.2 16-22.4 0-38.4 3.2-51.2 9.6-6.4-3.2-12.8-3.2-12.8 3.2 3.2 3.2 3.2 6.4 3.2 9.6 3.2 6.4 9.6 12.8 12.8 19.2 6.4 6.4 12.8 9.6 16 12.8 9.6 6.4 22.4 12.8 32 19.2 6.4 3.2 12.8 9.6 19.2 12.8 3.2 3.2 3.2 6.4 9.6 6.4-3.2 0-3.2-3.2-3.2-6.4z" fill="#02608A" p-id="1364"></path><path d="M713.6 166.4c-3.2 0-6.4 0-9.6 3.2 3.2 0 12.8 25.6 16 25.6 3.2-3.2 6.4-9.6 6.4-12.8 0-6.4-3.2-9.6-9.6-12.8 0-3.2 0-3.2-3.2-3.2zM198.4 518.4l-57.6 201.6-57.6-201.6H32c-9.6 86.4-19.2 176-22.4 275.2h44.8c0-73.6 0-137.6 6.4-208l57.6 208h38.4l57.6-208c6.4 73.6 6.4 137.6 9.6 208h48c-3.2-83.2-12.8-172.8-22.4-275.2H198.4zM390.4 588.8c-6.4 60.8-9.6 112-28.8 163.2 0-12.8-3.2-19.2-9.6-44.8l-32-118.4H275.2l44.8 156.8c6.4 22.4 9.6 38.4 9.6 48 0 9.6 0 16-3.2 19.2-6.4 6.4-16 9.6-28.8 9.6h-16v35.2c6.4 3.2 16 6.4 22.4 6.4 25.6 0 48-16 67.2-54.4 25.6-44.8 48-118.4 64-220.8h-44.8z" fill="#02608A" p-id="1365"></path><path d="M953.6 748.8v-230.4h-48v272h115.2v-41.6zM832 771.2c3.2-3.2 6.4-6.4 9.6-12.8 19.2-25.6 28.8-60.8 28.8-112 0-89.6-32-134.4-92.8-134.4-32 0-54.4 12.8-70.4 35.2-19.2 25.6-28.8 60.8-28.8 112 0 48 9.6 83.2 25.6 105.6 16 19.2 38.4 28.8 67.2 28.8 12.8 0 22.4-3.2 32-3.2l57.6 38.4 16-32-44.8-25.6z m-54.4-25.6c-16 0-28.8-6.4-35.2-22.4-9.6-16-12.8-41.6-12.8-73.6 0-60.8 16-89.6 48-89.6 16 0 28.8 6.4 35.2 22.4 9.6 16 12.8 38.4 12.8 73.6 0 60.8-16 89.6-48 89.6zM633.6 656s-35.2-22.4-51.2-32c-19.2-12.8-32-25.6-32-41.6 0-9.6 6.4-16 12.8-25.6 6.4-6.4 16-9.6 28.8-9.6 16 0 32 6.4 44.8 16l9.6-35.2c-19.2-12.8-38.4-19.2-60.8-19.2s-38.4 6.4-54.4 19.2c-12.8 12.8-25.6 38.4-25.6 60.8 0 25.6 9.6 41.6 28.8 57.6 0 0 32 22.4 51.2 32 19.2 12.8 28.8 25.6 28.8 41.6 0 12.8-3.2 22.4-12.8 28.8-9.6 6.4-19.2 3.2-28.8 3.2-16 0-32-6.4-51.2-16l-9.6 32c22.4 16 44.8 25.6 67.2 25.6 25.6 0 44.8-6.4 60.8-22.4 16-16 22.4-35.2 22.4-57.6 0-25.6-9.6-41.6-28.8-57.6z" fill="#E58E01" p-id="1366"></path></svg>
|
||||
|
After Width: | Height: | Size: 3.7 KiB |
1
src/assets/database/Oracle.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1650692654847" class="icon" viewBox="0 0 8165 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="988" xmlns:xlink="http://www.w3.org/1999/xlink" width="255.15625" height="48"><defs><style type="text/css"></style></defs><path d="M3398.499037 666.115306h520.24153l-274.800972-442.904953-504.499351 800.60224-229.885787 0.187407 614.069914-961.397353A143.303803 143.303803 0 0 1 3643.564782 0.008746c48.350978 0 92.703942 22.801172 118.878438 60.907239l616.193859 963.084015-230.073194-0.187407-107.883901-178.973581h-527.175585l-114.942893-178.723706z m2386.751699 178.911113V10.00378h-195.090574v916.669574c0 25.362399 10.307379 49.600357 28.423379 67.716357 19.115503 18.928096 44.352964 29.360413 71.464494 29.360413h888.995824l114.693017-178.661236H5785.250736z m-3225.2726-149.425762a342.829673 342.829673 0 0 0 0-685.596877H1706.777029v1013.808813h194.903167V188.665016h644.867113a163.856092 163.856092 0 0 1 164.043499 164.105968 163.98103 163.98103 0 0 1-164.043499 164.168437l-549.414537-0.187407 581.77346 507.060579h283.234282l-391.430527-328.399343 89.268149 0.187407zM506.935641 1023.812593a506.873172 506.873172 0 1 1 0-1013.808813h589.269735a506.935641 506.935641 0 0 1 506.873173 506.935641 506.935641 506.935641 0 0 1-506.873173 507.060579l-589.269735-0.187407z m576.151253-178.661236a328.086998 328.086998 0 0 0 328.149467-328.211936 328.086998 328.086998 0 0 0-328.149467-328.211936H519.991655a328.274405 328.274405 0 0 0 0 656.423872h563.095239z m3702.285608 178.661236a506.935641 506.935641 0 1 1 0-1013.808813h700.277084l-114.755487 178.723705h-572.340646a328.274405 328.274405 0 1 0 0 656.423872h702.838312l-114.505611 178.661236h-601.576121z m2384.752692-178.661236a328.086998 328.086998 0 0 1-315.593205-238.506504h833.335977l114.755486-178.723705-948.341339-0.062469a328.211936 328.211936 0 0 1 315.843081-239.193663l572.028302 0.062469 114.942893-178.723705h-700.277084a506.935641 506.935641 0 0 0 0 1013.808813h601.576121l114.505611-178.661236h-702.775843zM7961.482027 117.950149a89.455556 89.455556 0 1 1 179.036051 0 89.455556 89.455556 0 1 1-179.036051 0z m89.580494 114.318204l0 0z m-10.744661-181.597278c17.553779 0 24.800179 0.187407 33.420895 3.435793 22.488827 7.558745 24.800179 28.235972 24.800179 35.794717a49.975171 49.975171 0 0 1-1.374317 10.494785 34.795213 34.795213 0 0 1-15.867117 21.926607c-1.311848 0.999503-2.061476 1.624193-5.747145 2.99851l29.672758 53.098619h-28.673254l-25.987089-48.850729h-17.303903v48.78826h-24.987586V50.671075h32.046579z m8.933061 57.721323c7.683683-0.124938 16.241931-0.687159 21.239448-7.996028a18.990565 18.990565 0 0 0 2.873572-10.932068 16.86662 16.86662 0 0 0-9.62022-15.492303c-5.747145-2.248883-11.619227-2.248883-23.425861-2.248883h-7.058993v36.669282h15.992054z" fill="#d81e06" p-id="989"></path></svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
1
src/assets/database/PostgreSQL.svg
Normal file
|
After Width: | Height: | Size: 14 KiB |
1
src/assets/database/Sqlserver.svg
Normal file
|
After Width: | Height: | Size: 24 KiB |
1
src/assets/database/clickhouse.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg height="2222" viewBox="0 0 9 8" width="2500" xmlns="http://www.w3.org/2000/svg"><path d="m0 7h1v1h-1z" fill="#f00"/><path d="m0 0h1v7h-1zm2 0h1v8h-1zm2 0h1v8h-1zm2 0h1v8h-1zm2 3.25h1v1.5h-1z" fill="#fc0"/></svg>
|
||||
|
After Width: | Height: | Size: 216 B |
1
src/assets/database/default.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1652175124881" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="42276" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M64 154.944a411.52 154.944 0 1 0 823.04 0 411.52 154.944 0 1 0-823.04 0Z" fill="#434343" p-id="42277"></path><path d="M477.632 709.12c-225.024 0-412.608-62.72-412.608-104.704v209.216c0 76.032 184.768 137.344 412.608 137.344s412.608-61.376 412.608-137.344V604.416c0 41.984-187.584 104.704-412.608 104.704z" fill="#434343" p-id="42278"></path><path d="M479.616 387.264C254.592 387.264 67.008 323.136 67.008 280.128v214.144c0 77.696 184.768 140.544 412.608 140.544s412.608-62.848 412.608-140.544V280.128c0 43.008-187.584 107.136-412.608 107.136z" fill="#434343" p-id="42279"></path></svg>
|
||||
|
After Width: | Height: | Size: 961 B |
BIN
src/assets/database/dm8.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
src/assets/database/druid.jpg
Normal file
|
After Width: | Height: | Size: 20 KiB |
1
src/assets/database/elasticsearch.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg width="2500" height="2500" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"><path d="M255.96 134.393c0-21.521-13.373-40.117-33.223-47.43a75.239 75.239 0 0 0 1.253-13.791c0-39.909-32.386-72.295-72.295-72.295-23.193 0-44.923 11.074-58.505 30.088-6.686-5.224-14.835-7.94-23.402-7.94-21.104 0-38.446 17.133-38.446 38.446 0 4.597.836 9.194 2.298 13.373C13.582 81.739 0 100.962 0 122.274c0 21.522 13.373 40.327 33.431 47.64-.835 4.388-1.253 8.985-1.253 13.79 0 39.7 32.386 72.087 72.086 72.087 23.402 0 44.924-11.283 58.505-30.088 6.686 5.223 15.044 8.149 23.611 8.149 21.104 0 38.446-17.134 38.446-38.446 0-4.597-.836-9.194-2.298-13.373 19.64-7.104 33.431-26.327 33.431-47.64z" fill="#FFF"/><path d="M100.085 110.364l57.043 26.119 57.669-50.565a64.312 64.312 0 0 0 1.253-12.746c0-35.52-28.834-64.355-64.355-64.355-21.313 0-41.162 10.447-53.072 27.998l-9.612 49.73 11.074 23.82z" fill="#F4BD19"/><path d="M40.953 170.75c-.835 4.179-1.253 8.567-1.253 12.955 0 35.52 29.043 64.564 64.564 64.564 21.522 0 41.372-10.656 53.49-28.208l9.403-49.729-12.746-24.238-57.251-26.118-56.207 50.774z" fill="#3CBEB1"/><path d="M40.536 71.918l39.073 9.194 8.775-44.506c-5.432-4.179-11.91-6.268-18.805-6.268-16.925 0-30.924 13.79-30.924 30.924 0 3.552.627 7.313 1.88 10.656z" fill="#E9478C"/><path d="M37.192 81.32c-17.551 5.642-29.67 22.567-29.67 40.954 0 17.97 11.074 34.059 27.79 40.327l54.953-49.73-10.03-21.52-43.043-10.03z" fill="#2C458F"/><path d="M167.784 219.852c5.432 4.18 11.91 6.478 18.596 6.478 16.925 0 30.924-13.79 30.924-30.924 0-3.761-.627-7.314-1.88-10.657l-39.073-9.193-8.567 44.296z" fill="#95C63D"/><path d="M175.724 165.317l43.043 10.03c17.551-5.85 29.67-22.566 29.67-40.954 0-17.97-11.074-33.849-27.79-40.326l-56.415 49.311 11.492 21.94z" fill="#176655"/></svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
BIN
src/assets/database/gaussdb.png
Normal file
|
After Width: | Height: | Size: 3.3 MiB |
BIN
src/assets/database/ibmdb2.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/database/ignite.png
Normal file
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/assets/database/kingbase.png
Normal file
|
After Width: | Height: | Size: 8.0 KiB |
BIN
src/assets/database/kylin.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/database/kyuubi.png
Normal file
|
After Width: | Height: | Size: 40 KiB |
1
src/assets/database/presto.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg width="2500" height="2500" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><rect width="256" height="256" rx="18"/><path d="M230.118 128.531c0 7.047-5.713 12.76-12.761 12.76-7.047 0-12.76-5.713-12.76-12.76 0-7.048 5.713-12.761 12.76-12.761 7.048 0 12.761 5.713 12.761 12.761" fill="#669CFE"/><path d="M203.806 154.531c0 7.047-5.713 12.76-12.761 12.76-7.048 0-12.761-5.713-12.761-12.76 0-7.048 5.713-12.761 12.761-12.761 7.048 0 12.761 5.713 12.761 12.761" fill="#3FE7FE"/><path d="M177.451 181.072c0 7.048-5.713 12.761-12.76 12.761-7.048 0-12.761-5.713-12.761-12.761 0-7.047 5.713-12.76 12.761-12.76 7.047 0 12.76 5.713 12.76 12.76" fill="#FFF"/><path d="M202.993 102.336c0 6.597-5.348 11.944-11.944 11.944-6.597 0-11.945-5.347-11.945-11.944s5.348-11.945 11.945-11.945c6.596 0 11.944 5.348 11.944 11.945" fill="#669CFE"/><path d="M176.738 128.298c0 6.597-5.348 11.945-11.944 11.945-6.597 0-11.945-5.348-11.945-11.945s5.348-11.945 11.945-11.945c6.596 0 11.944 5.348 11.944 11.945" fill="#3FE7FE"/><path d="M150.569 154.642c0 6.597-5.347 11.945-11.944 11.945s-11.945-5.348-11.945-11.945 5.348-11.944 11.945-11.944 11.944 5.347 11.944 11.944" fill="#FFF"/><path d="M175.743 76.235c0 5.991-4.857 10.849-10.849 10.849s-10.849-4.858-10.849-10.849c0-5.992 4.857-10.849 10.849-10.849s10.849 4.857 10.849 10.849" fill="#669CFE"/><path d="M149.522 102.191c0 5.991-4.858 10.849-10.85 10.849-5.991 0-10.849-4.858-10.849-10.849 0-5.992 4.858-10.85 10.849-10.85 5.992 0 10.85 4.858 10.85 10.85" fill="#3FE7FE"/><path d="M123.253 128.618c0 5.992-4.857 10.849-10.849 10.849s-10.849-4.857-10.849-10.849c0-5.991 4.857-10.849 10.849-10.849s10.849 4.858 10.849 10.849" fill="#FFF"/><path d="M148.618 50.008c0 5.386-4.366 9.752-9.752 9.752-5.386 0-9.752-4.366-9.752-9.752 0-5.387 4.366-9.753 9.752-9.753 5.386 0 9.752 4.366 9.752 9.753" fill="#669CFE"/><path d="M122.297 76.089c0 5.386-4.366 9.753-9.752 9.753-5.386 0-9.752-4.367-9.752-9.753s4.366-9.752 9.752-9.752c5.386 0 9.752 4.366 9.752 9.752" fill="#3FE7FE"/><path d="M96.06 102.471c0 5.386-4.367 9.752-9.753 9.752s-9.752-4.366-9.752-9.752c0-5.386 4.366-9.753 9.752-9.753 5.386 0 9.753 4.367 9.753 9.753" fill="#FFF"/><path d="M95.06 154.721a8.67 8.67 0 1 1-17.338-.002 8.67 8.67 0 0 1 17.338.002M121.185 180.846a8.67 8.67 0 1 1-17.338-.002 8.67 8.67 0 0 1 17.338.002M147.268 206.929a8.669 8.669 0 0 1-8.669 8.669 8.669 8.669 0 0 1-8.669-8.669 8.669 8.669 0 0 1 8.669-8.669 8.669 8.669 0 0 1 8.669 8.669M95.185 206.929a8.67 8.67 0 1 1-17.339 0 8.67 8.67 0 0 1 17.339 0M42.601 206.929a8.67 8.67 0 1 1-17.337 0 8.67 8.67 0 0 1 17.337 0M68.726 180.804a8.67 8.67 0 1 1-17.337 0 8.67 8.67 0 0 1 17.337 0" fill="#6A9EFE"/><path d="M95.172 50.032a9.06 9.06 0 0 1-18.118 0 9.06 9.06 0 1 1 18.118 0" fill="#3FE7FE"/><path d="M68.799 76.538a9.06 9.06 0 1 1-18.12 0 9.06 9.06 0 0 1 18.12 0M41.174 49.663a7.31 7.31 0 1 1-14.62 0 7.31 7.31 0 0 1 14.62 0" fill="#FFF"/></svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
1
src/assets/database/redis.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg width="2500" height="2148" viewBox="0 0 256 220" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"><path d="M245.97 168.943c-13.662 7.121-84.434 36.22-99.501 44.075-15.067 7.856-23.437 7.78-35.34 2.09-11.902-5.69-87.216-36.112-100.783-42.597C3.566 169.271 0 166.535 0 163.951v-25.876s98.05-21.345 113.879-27.024c15.828-5.679 21.32-5.884 34.79-.95 13.472 4.936 94.018 19.468 107.331 24.344l-.006 25.51c.002 2.558-3.07 5.364-10.024 8.988" fill="#912626"/><path d="M245.965 143.22c-13.661 7.118-84.431 36.218-99.498 44.072-15.066 7.857-23.436 7.78-35.338 2.09-11.903-5.686-87.214-36.113-100.78-42.594-13.566-6.485-13.85-10.948-.524-16.166 13.326-5.22 88.224-34.605 104.055-40.284 15.828-5.677 21.319-5.884 34.789-.948 13.471 4.934 83.819 32.935 97.13 37.81 13.316 4.881 13.827 8.9.166 16.02" fill="#C6302B"/><path d="M245.97 127.074c-13.662 7.122-84.434 36.22-99.501 44.078-15.067 7.853-23.437 7.777-35.34 2.087-11.903-5.687-87.216-36.112-100.783-42.597C3.566 127.402 0 124.67 0 122.085V96.206s98.05-21.344 113.879-27.023c15.828-5.679 21.32-5.885 34.79-.95C162.142 73.168 242.688 87.697 256 92.574l-.006 25.513c.002 2.557-3.07 5.363-10.024 8.987" fill="#912626"/><path d="M245.965 101.351c-13.661 7.12-84.431 36.218-99.498 44.075-15.066 7.854-23.436 7.777-35.338 2.087-11.903-5.686-87.214-36.112-100.78-42.594-13.566-6.483-13.85-10.947-.524-16.167C23.151 83.535 98.05 54.148 113.88 48.47c15.828-5.678 21.319-5.884 34.789-.949 13.471 4.934 83.819 32.933 97.13 37.81 13.316 4.88 13.827 8.9.166 16.02" fill="#C6302B"/><path d="M245.97 83.653c-13.662 7.12-84.434 36.22-99.501 44.078-15.067 7.854-23.437 7.777-35.34 2.087-11.903-5.687-87.216-36.113-100.783-42.595C3.566 83.98 0 81.247 0 78.665v-25.88s98.05-21.343 113.879-27.021c15.828-5.68 21.32-5.884 34.79-.95C162.142 29.749 242.688 44.278 256 49.155l-.006 25.512c.002 2.555-3.07 5.361-10.024 8.986" fill="#912626"/><path d="M245.965 57.93c-13.661 7.12-84.431 36.22-99.498 44.074-15.066 7.854-23.436 7.777-35.338 2.09C99.227 98.404 23.915 67.98 10.35 61.497-3.217 55.015-3.5 50.55 9.825 45.331 23.151 40.113 98.05 10.73 113.88 5.05c15.828-5.679 21.319-5.883 34.789-.948 13.471 4.935 83.819 32.934 97.13 37.811 13.316 4.876 13.827 8.897.166 16.017" fill="#C6302B"/><path d="M159.283 32.757l-22.01 2.285-4.927 11.856-7.958-13.23-25.415-2.284 18.964-6.839-5.69-10.498 17.755 6.944 16.738-5.48-4.524 10.855 17.067 6.391M131.032 90.275L89.955 73.238l58.86-9.035-17.783 26.072M74.082 39.347c17.375 0 31.46 5.46 31.46 12.194 0 6.736-14.085 12.195-31.46 12.195s-31.46-5.46-31.46-12.195c0-6.734 14.085-12.194 31.46-12.194" fill="#FFF"/><path d="M185.295 35.998l34.836 13.766-34.806 13.753-.03-27.52" fill="#621B1C"/><path d="M146.755 51.243l38.54-15.245.03 27.519-3.779 1.478-34.791-13.752" fill="#9A2928"/></svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
1
src/assets/database/trino.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42.1 62.45"><defs><style>.cls-1{fill:#fff;}.cls-2{fill:#dd00a1;}.cls-3{fill:#f9d8d2;}.cls-4{fill:#10110e;}.cls-5{fill:#e5e5e5;}.cls-6{fill:#8accce;opacity:0.2;isolation:isolate;}.cls-7{fill:#515151;}</style></defs><path class="cls-1" d="M14.24,55.36c.92-.61-1.49-.38-1.69-.79a15,15,0,0,1-2.82-.51C8,53.62,3.9,50.85,3.47,48.25s0-7.65,1.83-10.61A17,17,0,0,1,9.73,33S6.16,24.51,5.85,18.1,6,.21,10.24,0s3.49,10.48,2.82,17.43a89.47,89.47,0,0,0-.21,13.89,19.45,19.45,0,0,1,5.51-.92,21.2,21.2,0,0,1,4.9.46S24.58,21,29,14.86,38,2.4,41,4.19s-.81,8.19-3.46,11.52-7.25,8.33-8.78,11a47.26,47.26,0,0,0-2.65,5.51,15,15,0,0,1,6.4,6.32c2.07,4.28,2.27,9.59,1.15,11.83a8.1,8.1,0,0,1-5.61,4c-1.32.1-6.91,1.48-6.91,1.48Z" transform="translate(0 0)"/><path class="cls-2" d="M24,30.94s3.33-8.7,6.32-13.6,7-8.59,8.26-7.84S36,14.85,32.66,19.32a112.3,112.3,0,0,0-7.44,12.37Z" transform="translate(0 0)"/><path class="cls-2" d="M10.64,32.44l.95-.75s-.13-8.7,0-14S12,5.78,10.23,5.85,7.23,11,7.92,18.23A86.92,86.92,0,0,0,10.64,32.44Z" transform="translate(0 0)"/><circle class="cls-3" cx="7.65" cy="49.17" r="1.94"/><circle class="cls-3" cx="30.57" cy="49.17" r="1.94"/><path class="cls-4" d="M22.33,49a.19.19,0,0,0-.25,0h0s-.57,1-1.41,1.06a2.11,2.11,0,0,1-1.5-.7V48c.54-.29,1.41-1.19,1.41-1.5a1.4,1.4,0,0,0-1.5-1.09c-1,0-1.7.65-1.7,1.19s1.1,1.23,1.41,1.44v1.45a1.77,1.77,0,0,1-1.3.7c-.8,0-1.4-1.08-1.4-1.09a.19.19,0,0,0-.25-.08h0a.18.18,0,0,0-.08.23h0c0,.06.71,1.29,1.73,1.29a2.07,2.07,0,0,0,1.5-.72,2.46,2.46,0,0,0,1.59.73h.14a2.47,2.47,0,0,0,1.71-1.25.18.18,0,0,0,0-.25A.24.24,0,0,0,22.33,49Z" transform="translate(0 0)"/><path class="cls-5" d="M9.73,33S7,26,6.42,22.29s-1-9.78-.3-13.85A46.3,46.3,0,0,1,7.31,2.85S6,12.34,6.49,16.49,9.73,33,9.73,33Z" transform="translate(0 0)"/><path class="cls-5" d="M23.26,30.85s2-10.59,4.91-14.76S34.73,6.9,36.52,5.62l1.82-1.28S31,12,28.17,18.34,23.26,30.85,23.26,30.85Z" transform="translate(0 0)"/><path class="cls-4" d="M11.6,42.85a1.52,1.52,0,1,0,1.52,1.52h0a1.52,1.52,0,0,0-1.5-1.52Zm.4,1.41a.42.42,0,1,1,.42-.42h0a.42.42,0,0,1-.41.43h0Z" transform="translate(0 0)"/><path class="cls-4" d="M26.55,42.85a1.52,1.52,0,1,0,1.51,1.53h0a1.52,1.52,0,0,0-1.51-1.53ZM27,44.26a.42.42,0,0,1-.43-.41h0a.43.43,0,0,1,.41-.43.42.42,0,0,1,.43.41h0a.41.41,0,0,1-.4.42h0Z" transform="translate(0 0)"/><ellipse class="cls-6" cx="19.36" cy="44.95" rx="14.1" ry="10.16"/><path class="cls-1" d="M36.43,39.3V32.58a2.46,2.46,0,0,0,1.91-2.29,2.65,2.65,0,0,0-5.27,0A2.48,2.48,0,0,0,35,32.58v6.55h-.2c-2-6.94-7.91-11.28-15.63-11.28S5.51,32.15,3.55,39.13H2.88A2.76,2.76,0,0,0,0,41.71v5.14a2.75,2.75,0,0,0,2.88,2.59h.91a13,13,0,0,0,3.59,5.11L6.09,55.72A.78.78,0,0,0,6,56.82l0,0H6c2.93,3.53,7.72,5.6,13.13,5.6s10.21-2,13.14-5.6a.79.79,0,0,0-.09-1.11h0l-1.3-1.19a13,13,0,0,0,3.59-5.08h1a2.74,2.74,0,0,0,2.87-2.6V41.71A2.58,2.58,0,0,0,36.43,39.3Zm-17.26-4c7.14,0,12.94,4.7,12.94,10.47,0,6.25-6.51,9-12.94,9S6.23,52,6.23,45.72C6.23,40,12,35.25,19.17,35.25Z" transform="translate(0 0)"/><path class="cls-7" d="M36.91,45.16H35v-1a18.61,18.61,0,0,0-.39-3.79h.82a1.35,1.35,0,0,1,1.44,1.25h0Z" transform="translate(0 0)"/><path class="cls-7" d="M35.47,48.18h-1A16.13,16.13,0,0,0,34.89,46h2v.85a1.34,1.34,0,0,1-1.36,1.32h-.06Z" transform="translate(0 0)"/><path class="cls-7" d="M19.17,61.1c-4.79,0-9.06-1.72-11.74-4.78l1.3-1.21a17.87,17.87,0,0,0,10.4,3,17.73,17.73,0,0,0,10.4-3l1.35,1.21C28.23,59.38,24,61.1,19.17,61.1Z" transform="translate(0 0)"/><path class="cls-7" d="M2.88,40.42h.85a19.33,19.33,0,0,0-.38,3.79,8.34,8.34,0,0,0,0,1H1.49v-3.5a1.27,1.27,0,0,1,1.24-1.29Z" transform="translate(0 0)"/><path d="M19.17,34.39a17.66,17.66,0,0,0-4.79.69V29.85a17.23,17.23,0,0,1,4.79-.64,17.3,17.3,0,0,1,4.8.64v5.26A15.91,15.91,0,0,0,19.17,34.39Z" transform="translate(0 0)"/><path class="cls-7" d="M1.44,46h2a17.56,17.56,0,0,0,.43,2.16h-1a1.35,1.35,0,0,1-1.44-1.25h0V46Z" transform="translate(0 0)"/><ellipse class="cls-7" cx="35.71" cy="30.29" rx="1.2" ry="1.08"/></svg>
|
||||
|
After Width: | Height: | Size: 3.9 KiB |
BIN
src/assets/fonts/element-icons.ttf
Normal file
BIN
src/assets/fonts/element-icons.woff
Normal file
3
src/assets/images/icon-unlock.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.79171 4.37499C3.79171 2.60308 5.22813 1.16666 7.00004 1.16666C8.77196 1.16666 10.2084 2.60308 10.2084 4.37499H9.04171C9.04171 3.24741 8.12762 2.33332 7.00004 2.33332C5.87246 2.33332 4.95837 3.24741 4.95837 4.37499V5.54166H11.6667C12.15 5.54166 12.5417 5.93341 12.5417 6.41666V11.6667C12.5417 12.1499 12.15 12.5417 11.6667 12.5417H2.33337C1.85013 12.5417 1.45837 12.1499 1.45837 11.6667V6.41666C1.45837 5.93341 1.85012 5.54166 2.33337 5.54166H3.79171V4.37499ZM2.62504 6.70832V11.375H11.375V6.70832H2.62504ZM7.58337 10.5V7.58332H6.41671V10.5H7.58337Z" fill="#4E5969"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 722 B |
3
src/assets/images/icon-user.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.25004 4.375C5.25004 3.4085 6.03354 2.62499 7.00004 2.62499C7.96654 2.62499 8.75004 3.4085 8.75004 4.375C8.75004 5.34149 7.96654 6.125 7.00004 6.125C6.03354 6.125 5.25004 5.34149 5.25004 4.375ZM7.00004 1.45833C5.38921 1.45833 4.08337 2.76416 4.08337 4.375C4.08337 5.98583 5.38921 7.29166 7.00004 7.29166C8.61087 7.29166 9.91671 5.98583 9.91671 4.375C9.91671 2.76416 8.61087 1.45833 7.00004 1.45833ZM4.66671 7.875C3.82716 7.875 3.03057 8.13082 2.43366 8.63611C1.8275 9.14923 1.45837 9.8955 1.45837 10.7917V11.6667C1.45837 12.1499 1.85013 12.5417 2.33337 12.5417H11.6667C12.15 12.5417 12.5417 12.1499 12.5417 11.6667V10.7917C12.5417 9.8955 12.1726 9.14923 11.5664 8.63611C10.9695 8.13082 10.1729 7.875 9.33337 7.875H4.66671ZM2.62504 10.7917C2.62504 10.2381 2.84354 9.81768 3.18744 9.52657C3.54059 9.22763 4.0565 9.04166 4.66671 9.04166H9.33337C9.94358 9.04166 10.4595 9.22763 10.8126 9.52657C11.1565 9.81768 11.375 10.2381 11.375 10.7917V11.375H2.62504V10.7917Z" fill="#4E5969"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
5
src/assets/images/j-icon1.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1" y="1" width="14" height="14" rx="2" fill="#233A82"/>
|
||||
<path d="M10.6625 3.56079H5.26806C4.32646 3.56079 3.56006 4.32719 3.56006 5.26879V10.7288C3.56006 11.6704 4.32646 12.4368 5.26806 12.4368H10.6625C11.6041 12.4368 12.3705 11.6704 12.3705 10.7288V5.26879C12.3713 4.32719 11.6049 3.56079 10.6625 3.56079ZM6.07926 10.4432C5.42886 10.4432 4.89926 9.91359 4.89926 9.26319C4.89926 8.61279 5.42886 8.08319 6.07926 8.08319C6.72966 8.08319 7.25926 8.61279 7.25926 9.26319C7.25926 9.91439 6.72966 10.4432 6.07926 10.4432ZM7.43286 6.07519L6.25286 7.22159C6.17046 7.30159 6.06086 7.34639 5.94646 7.34639H5.93926C5.88126 7.34555 5.82401 7.33316 5.77085 7.30995C5.7177 7.28673 5.6697 7.25316 5.62966 7.21119L4.94006 6.49359C4.85925 6.4094 4.81513 6.29659 4.81738 6.17991C4.81963 6.06323 4.86806 5.95221 4.95206 5.87119C5.03625 5.79038 5.14906 5.74626 5.26574 5.74851C5.38242 5.75076 5.49344 5.79919 5.57446 5.88319L5.95766 6.28159L6.82006 5.44399C6.86149 5.40367 6.91046 5.37192 6.96417 5.35054C7.01788 5.32916 7.07528 5.31858 7.13308 5.31939C7.19089 5.32021 7.24796 5.33241 7.30105 5.3553C7.35413 5.37819 7.40218 5.41132 7.44246 5.45279C7.52325 5.53684 7.56757 5.6494 7.56577 5.76597C7.56397 5.88253 7.5162 5.99367 7.43286 6.07519ZM10.7977 9.78159H8.25446C7.98966 9.78159 7.77446 9.56639 7.77446 9.30159C7.77446 9.03679 7.98966 8.82159 8.25446 8.82159H10.7977C11.0625 8.82159 11.2777 9.03679 11.2777 9.30159C11.2777 9.56639 11.0625 9.78159 10.7977 9.78159ZM10.7977 6.90559H8.25446C7.98966 6.90559 7.77446 6.69039 7.77446 6.42559C7.77446 6.16079 7.98966 5.94559 8.25446 5.94559H10.7977C11.0625 5.94559 11.2777 6.16079 11.2777 6.42559C11.2777 6.69039 11.0625 6.90559 10.7977 6.90559Z" fill="white"/>
|
||||
<path d="M6.00159 8.87109C5.77919 8.87109 5.59839 9.05189 5.59839 9.27429C5.59839 9.49669 5.77919 9.67749 6.00159 9.67749C6.22399 9.67749 6.40479 9.49669 6.40479 9.27429C6.40479 9.05189 6.22399 8.87109 6.00159 8.87109Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
4
src/assets/images/j-icon2.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1" y="1" width="14" height="14" rx="2" fill="#3491FA"/>
|
||||
<path d="M7.99326 2.81006C5.13086 2.81006 2.81006 5.13086 2.81006 7.99326C2.81006 10.8557 5.13086 13.1765 7.99326 13.1765C10.8557 13.1765 13.1765 10.8557 13.1765 7.99326C13.1765 5.13086 10.8557 2.81006 7.99326 2.81006ZM10.0005 8.98046H7.54686C7.40873 8.98046 7.27627 8.92559 7.1786 8.82792C7.08093 8.73025 7.02606 8.59778 7.02606 8.45966V5.61166C7.02606 5.47353 7.08093 5.34107 7.1786 5.2434C7.27627 5.14573 7.40873 5.09086 7.54686 5.09086C7.68498 5.09086 7.81745 5.14573 7.91512 5.2434C8.01279 5.34107 8.06766 5.47353 8.06766 5.61166V7.93886H10.0005C10.1386 7.93886 10.2711 7.99373 10.3687 8.0914C10.4664 8.18907 10.5213 8.32153 10.5213 8.45966C10.5213 8.74766 10.2885 8.98046 10.0005 8.98046Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 879 B |
4
src/assets/images/j-icon3.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1" y="1" width="14" height="14" rx="2" fill="#F53F3F"/>
|
||||
<path d="M7.71483 3.27373C6.72523 2.95373 5.76843 3.31693 5.10843 3.70653C4.99243 3.32333 4.63323 3.05453 4.22363 3.10653C3.85483 3.15293 3.55403 3.46813 3.50683 3.85933C3.46603 4.20093 3.61163 4.50973 3.85003 4.68813V12.6521C3.85003 12.9273 4.05003 13.1673 4.31003 13.1761C4.57883 13.1849 4.79883 12.9561 4.79883 12.6737V9.94893C7.47963 8.18173 9.11003 9.41773 10.2492 9.69533C11.1788 9.92173 11.9716 9.55853 12.2732 9.38813C12.354 9.34253 12.4036 9.25293 12.4036 9.15613V4.21773C12.4036 4.02013 12.2076 3.89693 12.0412 3.98413C10.6996 4.69053 9.35963 3.80573 7.71483 3.27373ZM9.92043 6.09693C9.52043 6.00733 8.99403 5.81853 8.35083 5.43693C7.21963 4.76653 6.23403 5.39693 6.19323 5.42413C5.97643 5.56653 5.69003 5.49773 5.55403 5.26813C5.41803 5.03933 5.48123 4.73773 5.69643 4.59213C5.75643 4.55213 7.17803 3.61293 8.80443 4.57773C9.36923 4.91213 9.80763 5.06573 10.114 5.13453C10.3276 5.18253 10.4788 5.38413 10.4788 5.61533C10.478 5.92653 10.2084 6.16093 9.92043 6.09693Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
4
src/assets/images/j-icon4.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1" y="1" width="14" height="14" rx="2" fill="#F77234"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.3488 7.76984L12.036 6.45704C11.9757 6.39681 11.9417 6.31509 11.9416 6.22984V4.37224C11.9416 4.19464 11.7976 4.05144 11.6208 4.05144H9.76399C9.67919 4.05144 9.59679 4.01784 9.53679 3.95704L8.22399 2.64424C8.19417 2.61438 8.15875 2.59069 8.11977 2.57453C8.08078 2.55837 8.03899 2.55005 7.99679 2.55005C7.95459 2.55005 7.9128 2.55837 7.87382 2.57453C7.83483 2.59069 7.79942 2.61438 7.76959 2.64424L6.45599 3.95704C6.39576 4.01737 6.31404 4.05133 6.22879 4.05144H4.37199C4.32986 4.05144 4.28815 4.05973 4.24923 4.07586C4.21031 4.09198 4.17494 4.11561 4.14515 4.1454C4.11536 4.17519 4.09173 4.21055 4.07561 4.24947C4.05949 4.28839 4.05119 4.33011 4.05119 4.37224V6.22904C4.05119 6.31384 4.01759 6.39624 3.95679 6.45624L2.64399 7.76984C2.61413 7.79966 2.59045 7.83508 2.57428 7.87406C2.55812 7.91305 2.5498 7.95483 2.5498 7.99704C2.5498 8.03924 2.55812 8.08103 2.57428 8.12001C2.59045 8.159 2.61413 8.19441 2.64399 8.22424L3.95679 9.53704C4.01713 9.59726 4.05108 9.67898 4.05119 9.76424V11.621C4.05119 11.7986 4.19519 11.9418 4.37199 11.9418H6.22879C6.31359 11.9418 6.39599 11.9754 6.45599 12.0362L7.76879 13.349C7.79862 13.3789 7.83403 13.4026 7.87302 13.4187C7.912 13.4349 7.95379 13.4432 7.99599 13.4432C8.03819 13.4432 8.07998 13.4349 8.11897 13.4187C8.15795 13.4026 8.19337 13.3789 8.22319 13.349L9.53599 12.0362C9.59622 11.9759 9.67794 11.9419 9.76319 11.9418H11.62C11.7976 11.9418 11.9408 11.7978 11.9408 11.621V9.76424C11.9408 9.67944 11.9744 9.59704 12.0352 9.53704L13.348 8.22424C13.378 8.19451 13.4018 8.15915 13.4181 8.12019C13.4344 8.08123 13.4428 8.03943 13.4429 7.9972C13.443 7.95497 13.4347 7.91315 13.4185 7.87413C13.4024 7.83511 13.3787 7.79966 13.3488 7.76984ZM5.44559 6.59864C5.44559 5.83624 5.90959 5.23944 6.50239 5.23944C7.09519 5.23944 7.55919 5.83624 7.55919 6.59864C7.55919 7.36104 7.09519 7.95784 6.50239 7.95784C5.90959 7.95784 5.44559 7.36104 5.44559 6.59864ZM7.29919 10.6354C7.26265 10.7068 7.20706 10.7668 7.13859 10.8086C7.07011 10.8503 6.99141 10.8724 6.91119 10.8722C6.83657 10.8722 6.7632 10.8531 6.69812 10.8165C6.63305 10.78 6.57845 10.7274 6.53958 10.6637C6.5007 10.6 6.47885 10.5274 6.47612 10.4528C6.47339 10.3782 6.48988 10.3042 6.52399 10.2378L8.79679 5.80344C8.8228 5.75245 8.85863 5.7071 8.90221 5.66999C8.9458 5.63288 8.99628 5.60475 9.05077 5.58721C9.10525 5.56966 9.16267 5.56306 9.21972 5.56776C9.27676 5.57247 9.33232 5.5884 9.38319 5.61464C9.43412 5.64072 9.4794 5.67658 9.51645 5.72018C9.55351 5.76377 9.5816 5.81424 9.59914 5.8687C9.61667 5.92316 9.6233 5.98055 9.61864 6.03757C9.61399 6.0946 9.59813 6.15014 9.57199 6.20104L7.29919 10.6354ZM9.88399 10.6098C9.29119 10.6098 8.82719 10.013 8.82719 9.25064C8.82719 8.48824 9.29119 7.89144 9.88399 7.89144C10.4768 7.89144 10.9408 8.48824 10.9408 9.25064C10.9408 10.013 10.476 10.6098 9.88399 10.6098ZM9.83644 8.79917C9.77912 8.86492 9.69824 9.01737 9.69824 9.2507C9.69824 9.5603 9.84064 9.7283 9.88544 9.7387C9.9002 9.73464 9.92826 9.71018 9.95806 9.66594C10.0154 9.60092 10.0972 9.44762 10.0972 9.213C10.0972 8.9034 9.95481 8.7354 9.91001 8.725C9.89509 8.72909 9.86659 8.75404 9.83644 8.79917ZM6.49961 6.1106C6.54441 6.121 6.68681 6.289 6.68681 6.5986C6.68681 6.9082 6.54521 7.0754 6.50361 7.0866C6.45881 7.0762 6.31641 6.9082 6.31641 6.5986C6.31641 6.289 6.45881 6.1218 6.49961 6.1106Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
BIN
src/assets/images/login-bg.jpg
Normal file
|
After Width: | Height: | Size: 473 KiB |
@@ -12,13 +12,13 @@ body .sidebar-logo-container .sidebar-logo-link .sidebar-title{
|
||||
font-size: 16px !important;
|
||||
}
|
||||
body #app .sidebar-container .el-scrollbar__view>.el-menu{
|
||||
padding: 0 8px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
body #app .sidebar-container .el-scrollbar__view>.el-menu .menu-wrapper+.menu-wrapper{
|
||||
margin-top: 4px;
|
||||
}
|
||||
body #app .sidebar-container .el-menu{
|
||||
background: #f5f6fd !important;
|
||||
background: #f5f6fd !important;
|
||||
}
|
||||
body #app .sidebar-container .el-submenu .el-menu-item {
|
||||
height: 40px;
|
||||
@@ -40,7 +40,7 @@ body #app .sidebar-container .el-menu .el-menu .el-menu-item .svg-icon{
|
||||
body #app .sidebar-container .el-menu .el-menu .el-menu-item .svg-icon+span{
|
||||
margin-left: 10px;
|
||||
}
|
||||
body #app .sidebar-container .submenu-title-noDropdown:hover,
|
||||
body #app .sidebar-container .submenu-title-noDropdown:hover,
|
||||
body #app .sidebar-container .el-submenu__title:hover {
|
||||
background-color: #f5f6fd !important;
|
||||
}
|
||||
@@ -48,12 +48,12 @@ body #app .sidebar-container .el-submenu>.el-submenu__title{
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
background: #f5f6fd !important;
|
||||
color: #4E5969 !important;
|
||||
color: #4E5969 !important;
|
||||
}
|
||||
body #app .sidebar-container .is-active>.el-submenu__title{
|
||||
color: #233A82;
|
||||
}
|
||||
body #app .sidebar-container .nest-menu .el-submenu>.el-submenu__title:hover,
|
||||
body #app .sidebar-container .nest-menu .el-submenu>.el-submenu__title:hover,
|
||||
body #app .sidebar-container .el-submenu .el-menu-item:hover {
|
||||
background: #f5f6fd !important;
|
||||
color: #4E5969 !important;
|
||||
@@ -112,7 +112,7 @@ body .main-container .fixed-header .navbar{
|
||||
body .main-container .fixed-header .navbar .app-breadcrumb.el-breadcrumb{
|
||||
margin-left: 0;
|
||||
}
|
||||
body .main-container .fixed-header .navbar .app-breadcrumb.el-breadcrumb .el-breadcrumb__item .el-breadcrumb__inner.is-link,
|
||||
body .main-container .fixed-header .navbar .app-breadcrumb.el-breadcrumb .el-breadcrumb__item .el-breadcrumb__inner.is-link,
|
||||
body .main-container .fixed-header .navbar .app-breadcrumb.el-breadcrumb .el-breadcrumb__item .el-breadcrumb__inner a{
|
||||
color: #4E5969 !important;
|
||||
}
|
||||
@@ -171,13 +171,23 @@ body .hasTagsView .app-main .el-card{
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
body .el-card.box-card.is-always-shadow,
|
||||
body .hasTagsView .app-main .el-card.box-card.is-always-shadow{
|
||||
box-shadow: none;
|
||||
}
|
||||
body .el-card .el-card__header,
|
||||
body .hasTagsView .app-main .el-card .el-card__header{
|
||||
border-bottom: 1px solid #E5E6EB;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
body .el-card .el-card__header .clearfix::before,
|
||||
body .el-card .el-card__header .clearfix::after{
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
body .el-card .el-card__header .clearfix::after{
|
||||
clear: both;
|
||||
}
|
||||
body .hasTagsView .app-main .el-card .el-card__header>.clearfix>span{
|
||||
line-height: 29px;
|
||||
font-weight: bold;
|
||||
@@ -239,39 +249,96 @@ body .el-button:active{
|
||||
background-color:#fff;
|
||||
border-color:#86909C;
|
||||
}
|
||||
body .el-button.is-disabled,
|
||||
body .el-button.is-disabled:active,
|
||||
body .el-button.is-disabled:focus,
|
||||
body .el-button.is-disabled,
|
||||
body .el-button.is-disabled:active,
|
||||
body .el-button.is-disabled:focus,
|
||||
body .el-button.is-disabled:hover {
|
||||
color: #C9CDD4;
|
||||
background-color: #fff;
|
||||
border-color: #E5E6EB;
|
||||
}
|
||||
body .el-button--primary,
|
||||
body .el-button--primary:focus{
|
||||
body .el-button--primary:focus,
|
||||
body .el-button.ms-btn,
|
||||
body .el-button.ms-btn:focus{
|
||||
color:#fff;
|
||||
background-color:#233A82;
|
||||
border-color:#233A82;
|
||||
}
|
||||
body .el-button--primary:hover{
|
||||
body .el-button--primary:hover,
|
||||
body .el-button.ms-btn:hover{
|
||||
color:#fff;
|
||||
background:#2B50C4;
|
||||
border-color:#2B50C4;
|
||||
border-color:#2B50C4;
|
||||
}
|
||||
body .el-button--primary:active,
|
||||
body .el-button--primary.is-active{
|
||||
body .el-button--primary.is-active,
|
||||
body .el-button.ms-btn:active,
|
||||
body .el-button.ms-btn.is-active{
|
||||
color:#fff;
|
||||
background:#042281;
|
||||
border-color:#042281;
|
||||
border-color:#042281;
|
||||
}
|
||||
body .el-button--primary.is-disabled,
|
||||
body .el-button--primary.is-disabled:active,
|
||||
body .el-button--primary.is-disabled:focus,
|
||||
body .el-button--primary.is-disabled:hover {
|
||||
body .el-button--primary.is-disabled,
|
||||
body .el-button--primary.is-disabled:active,
|
||||
body .el-button--primary.is-disabled:focus,
|
||||
body .el-button--primary.is-disabled:hover ,
|
||||
body .el-button.ms-btn.is-disabled,
|
||||
body .el-button.ms-btn.is-disabled:active,
|
||||
body .el-button.ms-btn.is-disabled:focus,
|
||||
body .el-button.ms-btn.is-disabled:hover{
|
||||
color: #fff;
|
||||
background-color: #93A7E4;
|
||||
border-color: #93A7E4;
|
||||
}
|
||||
body .el-button.is-plain,
|
||||
body .el-button.is-plain:focus{
|
||||
color:#4E5969;
|
||||
background-color:#fff;
|
||||
border-color:#E5E6EB;
|
||||
}
|
||||
body .el-button.is-plain:hover{
|
||||
color:#4E5969;
|
||||
background-color:#fff;
|
||||
border-color:#C9CDD4;
|
||||
}
|
||||
body .el-button.is-plain:active{
|
||||
color:#4E5969;
|
||||
background-color:#fff;
|
||||
border-color:#86909C;
|
||||
}
|
||||
body .el-button.is-plain.is-disabled,
|
||||
body .el-button.is-plain.is-disabled:active,
|
||||
body .el-button.is-plain.is-disabled:focus,
|
||||
body .el-button.is-plain.is-disabled:hover {
|
||||
color: #C9CDD4;
|
||||
background-color: #fff;
|
||||
border-color: #E5E6EB;
|
||||
}
|
||||
body .el-button--primary.is-plain,
|
||||
body .el-button--primary.is-plain:focus{
|
||||
color: #4e5969;
|
||||
background: #f2f3f5;
|
||||
border-color: #f2f3f5;
|
||||
}
|
||||
body .el-button--primary.is-plain:hover{
|
||||
color: #4e5969;
|
||||
background: #e5e6eb;
|
||||
border-color: #e5e6eb;
|
||||
}
|
||||
body .el-button--primary.is-plain:active{
|
||||
color: #4e5969;
|
||||
background: #c9cdd4;
|
||||
border-color: #c9cdd4;
|
||||
}
|
||||
body .el-button--primary.is-plain.is-disabled,
|
||||
body .el-button--primary.is-plain.is-disabled:active,
|
||||
body .el-button--primary.is-plain.is-disabled:focus,
|
||||
body .el-button--primary.is-plain.is-disabled:hover {
|
||||
color: #c9cdd4;
|
||||
background-color: #f7f8fa;
|
||||
border-color: #f7f8fa;
|
||||
}
|
||||
body .el-button--text,
|
||||
body .el-button--text:focus{
|
||||
color: #233A82;
|
||||
@@ -288,9 +355,9 @@ body .el-button--text:active{
|
||||
color:#042281;
|
||||
background-color:transparent;
|
||||
}
|
||||
body .el-button--text.is-disabled,
|
||||
body .el-button--text.is-disabled:active,
|
||||
body .el-button--text.is-disabled:focus,
|
||||
body .el-button--text.is-disabled,
|
||||
body .el-button--text.is-disabled:active,
|
||||
body .el-button--text.is-disabled:focus,
|
||||
body .el-button--text.is-disabled:hover {
|
||||
color:#93A7E4;
|
||||
background-color:transparent;
|
||||
@@ -320,7 +387,7 @@ body .el-tag.el-tag--danger{
|
||||
|
||||
/*el-table*/
|
||||
body .el-table{
|
||||
color: #1d2129;
|
||||
color: #1d2129;
|
||||
}
|
||||
body .el-table::before{
|
||||
content: none;
|
||||
@@ -334,9 +401,9 @@ body .el-table .el-table__cell.is-center {
|
||||
}
|
||||
body .el-table th.el-table__cell{
|
||||
background: #f2f3f5;
|
||||
color: #1d2129;
|
||||
color: #1d2129;
|
||||
}
|
||||
body .el-table th.el-table__cell.is-leaf,
|
||||
body .el-table th.el-table__cell.is-leaf,
|
||||
body .el-table td.el-table__cell{
|
||||
border-color: #e5e6eb ;
|
||||
}
|
||||
@@ -346,9 +413,28 @@ body .el-table--medium .el-table__cell {
|
||||
body .el-table--border {
|
||||
border: 0;
|
||||
}
|
||||
body .el-table--border::after,
|
||||
body .el-table--group::after,
|
||||
body .el-table::before {
|
||||
background-color: #e5e6eb;
|
||||
}
|
||||
body .el-table--border::after {
|
||||
content: none;
|
||||
}
|
||||
body .el-table--border.btable::after {
|
||||
content: "";
|
||||
}
|
||||
body .el-table--border .el-table__cell {
|
||||
border-right: 0;
|
||||
}
|
||||
body .el-table.btable{
|
||||
border-top: 1px solid #e5e6eb !important;
|
||||
border-left: 1px solid #e5e6eb !important;
|
||||
}
|
||||
body .el-table.btable .el-table__cell {
|
||||
border-right: 1px solid #EBEEF5;
|
||||
}
|
||||
|
||||
|
||||
/*el-tree*/
|
||||
body .el-tree {
|
||||
@@ -360,12 +446,12 @@ body .el-tree-node+.el-tree-node{
|
||||
body .el-tree-node__content{
|
||||
height: 34px;
|
||||
}
|
||||
body .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
||||
body .el-tree-node.is-current>.el-tree-node__content {
|
||||
background-color: #f2f3f5;
|
||||
color: #233A82;
|
||||
font-weight: bold;
|
||||
}
|
||||
body .el-tree--highlight-current .el-tree-node .el-tree-node__content:hover{
|
||||
body .el-tree-node .el-tree-node__content:hover{
|
||||
background-color: #f2f3f5;
|
||||
}
|
||||
|
||||
@@ -381,6 +467,10 @@ body .el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
body .el-checkbox__input.is-checked+.el-checkbox__label {
|
||||
color: #233A82;
|
||||
}
|
||||
body .el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
||||
background-color: #233A82;
|
||||
border-color: #233A82;
|
||||
}
|
||||
|
||||
/*el-radio*/
|
||||
body .el-radio__inner:hover,
|
||||
@@ -397,7 +487,8 @@ body .el-radio__input.is-checked+.el-radio__label {
|
||||
|
||||
/*el-input*/
|
||||
body .el-textarea__inner:focus,
|
||||
body .el-input__inner:focus{
|
||||
body .el-input__inner:focus,
|
||||
body .el-select .el-input__inner:focus{
|
||||
border-color:#233A82
|
||||
}
|
||||
|
||||
@@ -406,7 +497,7 @@ body .el-select .el-input.is-focus .el-input__inner,
|
||||
body .el-pagination__sizes .el-input .el-input__inner:hover{
|
||||
border-color:#233A82
|
||||
}
|
||||
body .el-select-dropdown__item.hover,
|
||||
body .el-select-dropdown__item.hover,
|
||||
body .el-select-dropdown__item:hover {
|
||||
background-color: #f2f3f5;
|
||||
}
|
||||
@@ -423,4 +514,380 @@ body .el-pager li.active {
|
||||
/*el-main-footer*/
|
||||
body #el-main-footer{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/*el-switch*/
|
||||
body .el-switch.is-checked .el-switch__core {
|
||||
border-color: #233a82;
|
||||
background-color: #233a82;
|
||||
}
|
||||
|
||||
/*el-step*/
|
||||
body .el-step__title {
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
}
|
||||
body .el-step__line {
|
||||
background-color: #E5E6EB;
|
||||
}
|
||||
body .el-step__head.is-success {
|
||||
color: #00B42A;
|
||||
border-color: #00B42A;
|
||||
}
|
||||
body .el-step__title.is-success {
|
||||
color: #00B42A;
|
||||
}
|
||||
body .el-step__head.is-process {
|
||||
color: #4E5969;
|
||||
border-color: #4E5969;
|
||||
}
|
||||
body .el-step__title.is-process {
|
||||
color: #4E5969;
|
||||
}
|
||||
body .el-step__icon.is-text {
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
/*el-form*/
|
||||
body .el-form-item .el-form-item__label {
|
||||
font-size: 14px;
|
||||
color: #4E5969;
|
||||
padding: 0 6px 0 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/*el-progress*/
|
||||
body .el-progress-bar__inner {
|
||||
background-color: #233A82 !important;
|
||||
}
|
||||
body .pro1 .el-progress-bar__inner {
|
||||
background-color: #F53F3F !important;
|
||||
}
|
||||
body .el-progress-bar__inner .el-progress-bar__innerText{
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
/*modellist*/
|
||||
.modellist{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.modellist .list{
|
||||
display: block;
|
||||
position: relative;
|
||||
border: 1px solid #E5E6EB;
|
||||
padding: 20px;
|
||||
width: calc((100% - 60px) / 4);
|
||||
margin: 10px 20px 10px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
.modellist .list:nth-child(4n){
|
||||
margin-right: 0;
|
||||
}
|
||||
.modellist .list:hover {
|
||||
border-color: transparent;
|
||||
box-shadow: 0 1px 2px -2px rgb(0 0 0 / 16%), 0 3px 6px 0 rgb(0 0 0 / 12%), 0 5px 12px 4px rgb(0 0 0 / 9%);
|
||||
}
|
||||
.modellist .list .limg{
|
||||
display: block;
|
||||
}
|
||||
.modellist .list .limg img{
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.modellist .list .ltitle{
|
||||
display: block;
|
||||
margin: 12px 0 0 0;
|
||||
}
|
||||
.modellist .list .ltitle .title{
|
||||
display: inline-block;
|
||||
color: #4E5969 ;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.modellist .list:hover .ltitle .title,
|
||||
.modellist .list .ltitle .title:hover{
|
||||
color: #233A82;
|
||||
}
|
||||
.modellist .list .lbtn{
|
||||
display: none;
|
||||
position: absolute;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
padding: 20px 10px;
|
||||
right: 0;
|
||||
top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.modellist .list:hover .lbtn{
|
||||
display: flex;
|
||||
}
|
||||
.modellist .list .lbtn i{
|
||||
line-height: 24px;
|
||||
padding: 0 10px;
|
||||
font-size: 14px;
|
||||
color: #4E5969;
|
||||
}
|
||||
.modellist .list .lbtn i:hover{
|
||||
color: #165DFF;
|
||||
}
|
||||
|
||||
/*login-page*/
|
||||
body ,html{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.login-page{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
}
|
||||
.login-page .loleft{
|
||||
display: block;
|
||||
width: 66%;
|
||||
background: url("../assets/images/login-bg.jpg") no-repeat center;
|
||||
background-size: cover;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.login-page .loright{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 34%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.login-page .loright .locont{
|
||||
display: block;
|
||||
width: 100%;
|
||||
width: 300px;
|
||||
}
|
||||
.login-page .loright .locont .title{
|
||||
display: block;
|
||||
color: #1D2129;
|
||||
text-align: center;
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
line-height: 50px;
|
||||
letter-spacing:0;
|
||||
margin: 0 0 60px 0;
|
||||
}
|
||||
.login-page .loright .locont .el-form-item{
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.login-page .loright .locont .el-form-item:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.login-page .loright .locont .el-form-item .el-button{
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
.login-page .loright .locont .el-input__icon.el-icon-user{
|
||||
background: url("../assets/images/icon-user.svg") no-repeat center;
|
||||
box-sizing: 14px;
|
||||
color: transparent;
|
||||
}
|
||||
.login-page .loright .locont .el-input__icon.el-icon-view{
|
||||
background: url("../assets/images/icon-unlock.svg") no-repeat center;
|
||||
box-sizing: 14px;
|
||||
color: transparent;
|
||||
}
|
||||
.login-page .loright .locont .el-input__inner,
|
||||
.login-page .loright .locont .el-button{
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
* {
|
||||
--color: #233A82;
|
||||
--color_shallow: #233A82;
|
||||
--count_number: #233A82;
|
||||
--count_number_shallow: #233A82;
|
||||
--primary_color: #233A82;
|
||||
--aside_color: #233A82;
|
||||
}
|
||||
|
||||
|
||||
.ftitle{
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
font-weight: bold;
|
||||
color: #1D2129;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.stitle{
|
||||
display: block;
|
||||
text-align: left;
|
||||
color: #1D2129;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 24px;
|
||||
padding: 0 0 8px 0;
|
||||
margin: 30px 0 0 0;
|
||||
border-bottom: 1px solid #e5e6eb;
|
||||
}
|
||||
.ttitle{
|
||||
display: block;
|
||||
text-align: left;
|
||||
color: #1D2129;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: 22px;
|
||||
padding: 0 0 8px 0;
|
||||
margin: 24px 0 0 0;
|
||||
}
|
||||
|
||||
/*test-list*/
|
||||
.test-list{
|
||||
display: flex;
|
||||
}
|
||||
.test-list .list{
|
||||
display: block;
|
||||
flex: 1;
|
||||
padding: 24px 24px 0 24px;
|
||||
}
|
||||
.test-list .list+.list{
|
||||
margin-left: 24px;
|
||||
}
|
||||
.test-list .list .title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.test-list .list .title img{
|
||||
display: block;
|
||||
width: 16px;
|
||||
margin: 0 4px 0 0;
|
||||
}
|
||||
.test-list .list .title .tit{
|
||||
display: block;
|
||||
color: #86909C;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.test-list .list .figure{
|
||||
display: block;
|
||||
margin: 12px 0 0 0;
|
||||
padding: 0;
|
||||
color: #1D2129;
|
||||
font-size: 24px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/*badge*/
|
||||
body .el-badge.newbadge{
|
||||
display: inline-flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
}
|
||||
body .el-badge.newbadge+.el-badge.newbadge{
|
||||
margin-left: 20px;
|
||||
}
|
||||
body .el-badge.newbadge .sz{
|
||||
color: #1D2129;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
line-height: 22px;
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
body .el-badge.newbadge .el-badge__content.is-fixed{
|
||||
position: inherit;
|
||||
transform: inherit;
|
||||
right: 0;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
body .el-badge__content{
|
||||
background-color: #F53F3F;
|
||||
}
|
||||
body .el-badge__content--warning {
|
||||
background-color: #F7BA1E;
|
||||
}
|
||||
body .el-badge__content--primary {
|
||||
background-color: #0FC6C2;
|
||||
}
|
||||
|
||||
|
||||
/*ncoll*/
|
||||
body .ncoll{
|
||||
margin: 5px 0 0 0;
|
||||
}
|
||||
body .ncoll.el-collapse{
|
||||
border: 0;
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item>div:first-child{
|
||||
text-align: center;
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__header{
|
||||
border-bottom: 0;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
justify-content: center;
|
||||
display: inline-flex;
|
||||
color: #233A82;
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__header:hover{
|
||||
color: #2B50C4;
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__header .tit{
|
||||
display: block;
|
||||
margin: 0;
|
||||
display: block;
|
||||
text-align: left;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__header .el-collapse-item__arrow{
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
text-align: center;
|
||||
line-height: 18px;
|
||||
padding: 0;
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__arrow.is-active {
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__wrap{
|
||||
border-bottom: 0;
|
||||
}
|
||||
body .ncoll.el-collapse .el-collapse-item__wrap .el-collapse-item__content{
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.dbox{
|
||||
border: 1px dashed #e5e6eb;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
margin: 10px 0 0 0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.dbox .ttitle:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
1
src/styles/index.css
Normal 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>
|
||||
|
||||
@@ -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>
|
||||
<!-- 底部 -->
|
||||
<!– 底部 –>
|
||||
<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>
|
||||
|
||||
|
||||
@@ -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>
|
||||
@@ -92,14 +92,12 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:log:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:log:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:mask:add']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:mask:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,6 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['market:mask:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@@ -33,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>
|
||||
@@ -44,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">
|
||||
@@ -58,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>
|
||||
@@ -100,21 +99,18 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['market:mask:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:mask:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:mask:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:api:add']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,8 +3,8 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:api:word']" size="mini" icon="el-icon-coin" round @click="handleWord">接口文档</el-button>
|
||||
<el-button v-hasPerm="['market:api:example']" size="mini" icon="el-icon-s-data" round @click="handleExample">接口示例</el-button>
|
||||
<el-button size="mini" icon="el-icon-coin" round @click="handleWord">接口文档</el-button>
|
||||
<el-button size="mini" icon="el-icon-s-data" round @click="handleExample">接口示例</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:api:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:api:example']" size="mini" icon="el-icon-s-data" round @click="handleCall">接口调用</el-button>
|
||||
<el-button size="mini" icon="el-icon-s-data" round @click="handleCall">接口调用</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,6 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@@ -33,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>
|
||||
@@ -44,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">
|
||||
@@ -58,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>
|
||||
@@ -100,28 +99,24 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:api:copy']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-copy-document"
|
||||
@@ -129,7 +124,6 @@
|
||||
>拷贝</el-button>
|
||||
<el-button
|
||||
v-if="scope.row.status !== '2'"
|
||||
v-hasPerm="['market:api:release']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-upload2"
|
||||
@@ -137,7 +131,6 @@
|
||||
>发布</el-button>
|
||||
<el-button
|
||||
v-if="scope.row.status === '2'"
|
||||
v-hasPerm="['market:api:cancel']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-download"
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:service:add']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['market:service:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,6 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['market:service:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@@ -33,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>
|
||||
@@ -44,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">
|
||||
@@ -58,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>
|
||||
@@ -100,21 +99,18 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['market:service:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:service:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:service:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
||||
@@ -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>
|
||||
@@ -92,14 +92,12 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['market:service:log:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['market:service:log:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['masterdata:data:add']" type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['masterdata:data:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -208,7 +208,6 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:data:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@@ -248,21 +247,18 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:data:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:data:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:data:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['masterdata:model:add']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,8 +3,8 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-if="form.flowStatus === '1' || form.flowStatus === '6'" v-hasPerm="['masterdata:model:submit']" size="mini" icon="el-icon-s-data" round @click="submit">提交</el-button>
|
||||
<el-button v-if="form.flowStatus === '4'" v-hasPerm="['masterdata:model:create']" :disabled="form.isSync === '1'" size="mini" icon="el-icon-s-data" round @click="createTable">建模</el-button>
|
||||
<el-button v-if="form.flowStatus === '1' || form.flowStatus === '6'" size="mini" icon="el-icon-s-data" round @click="submit">提交</el-button>
|
||||
<el-button v-if="form.flowStatus === '4'" :disabled="form.isSync === '1'" size="mini" icon="el-icon-s-data" round @click="createTable">建模</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['masterdata:model:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,6 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:model:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@@ -33,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>
|
||||
@@ -44,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">
|
||||
@@ -58,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>
|
||||
@@ -100,7 +99,6 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:model:edit']"
|
||||
v-flow-edit="scope.row.flowStatus"
|
||||
size="mini"
|
||||
type="text"
|
||||
@@ -108,14 +106,12 @@
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:model:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['masterdata:model:remove']"
|
||||
v-flow-del="scope.row.flowStatus"
|
||||
size="mini"
|
||||
type="text"
|
||||
|
||||
@@ -1,18 +1,15 @@
|
||||
<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>-->
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<iframe src="http://192.168.1.217:8001/model/modelChildren?hideInMenu=true" width="100%" height="850px" frameborder="0" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -21,19 +18,19 @@ export default {
|
||||
name: 'DataModel',
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
projectsOptions: [
|
||||
{id: '1111', projectName: '演示项目'}
|
||||
],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
fileName: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCard(data) {
|
||||
Object.assign(this.options, data)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['metadata:changerecord:add']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['metadata:changerecord:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
@@ -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>
|
||||
@@ -92,21 +92,18 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:changerecord:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:changerecord:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:changerecord:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -12,21 +12,21 @@
|
||||
<el-col :span="8">
|
||||
<el-form-item label="字段名称" prop="columnName">
|
||||
<el-input v-model="form.columnName" disabled>
|
||||
<el-button slot="append" v-hasPerm="['metadata:changerecord:add']" icon="el-icon-edit-outline" @click="changeRecord('columnName')" />
|
||||
<el-button slot="append" icon="el-icon-edit-outline" @click="changeRecord('columnName')" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="字段注释" prop="columnComment">
|
||||
<el-input v-model="form.columnComment" disabled>
|
||||
<el-button slot="append" v-hasPerm="['metadata:changerecord:add']" icon="el-icon-edit-outline" @click="changeRecord('columnComment')" />
|
||||
<el-button slot="append" icon="el-icon-edit-outline" @click="changeRecord('columnComment')" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="数据默认值" prop="dataDefault">
|
||||
<el-input v-model="form.dataDefault" disabled>
|
||||
<el-button slot="append" v-hasPerm="['metadata:changerecord:add']" icon="el-icon-edit-outline" @click="changeRecord('dataDefault')" />
|
||||
<el-button slot="append" icon="el-icon-edit-outline" @click="changeRecord('dataDefault')" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
@@ -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>
|
||||
@@ -118,7 +118,6 @@
|
||||
trigger="click"
|
||||
>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:datacolumn:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
|
||||
@@ -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="连接信息" />
|
||||
<div class="body-wrapper" style="padding-left: 20%">
|
||||
<el-steps :active="active" finish-status="success" align-center style="width: 900px">
|
||||
<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>
|
||||
<el-form v-if="active == 1" ref="form" :model="form" :rules="rules" label-width="120px" style="width: 900px">
|
||||
<div style="padding: 20px 0px">
|
||||
<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" style="width: 900px">
|
||||
<div class="modellist" style="padding: 20px 0px">
|
||||
<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" style="width: 900px">
|
||||
<div style="padding: 20px 0px">
|
||||
<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 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: this.form2.dbName,
|
||||
databaseName: this.form2.dbName,
|
||||
schemaName: this.form2.schema === '' ? this.form2.dbName : this.form2.schema,
|
||||
databaseType: dbType,
|
||||
url: this.form2.host + ':' + this.form2.port + '/' + this.form2.dbName,
|
||||
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>
|
||||
|
||||
@@ -4,74 +4,191 @@
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<!-- zrx add-->
|
||||
<el-button v-if="form.isSync === '0'" v-hasPerm="['metadata:datasource:sync']" size="mini" icon="el-icon-coin" round @click="handleSync">元数据同步</el-button>
|
||||
<el-button v-if="form.isSync === '2'" v-hasPerm="['metadata:datasource:sync']" size="mini" icon="el-icon-coin" round @click="handleSync">元数据更新</el-button>
|
||||
<el-button v-if="form.isSync === '2'" v-hasPerm="['metadata:datasource:word']" size="mini" icon="el-icon-coin" round @click="handleWord">数据库文档</el-button>
|
||||
<el-button v-if="form.isSync === '3'" v-hasPerm="['metadata:datasource:sync']" size="mini" icon="el-icon-coin" round @click="handleSync">元数据再次同步</el-button>
|
||||
<el-button v-hasPerm="['metadata:datasource:connect']" size="mini" icon="el-icon-coin" round @click="handleCheckConnection">连通性检测</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" round @click="showCard">返回</el-button>
|
||||
<el-button v-if="form.isSync === '0'" type="primary" size="mini" icon="el-icon-coin" @click="handleSync">元数据同步</el-button>
|
||||
<el-button v-if="form.isSync === '2'" type="primary" size="mini" icon="el-icon-coin" @click="handleSync">元数据更新</el-button>
|
||||
<el-button v-if="form.isSync === '2'" type="primary" size="mini" icon="el-icon-coin" @click="handleWord">数据库文档</el-button>
|
||||
<el-button v-if="form.isSync === '3'" type="primary" size="mini" icon="el-icon-coin" @click="handleSync">元数据再次同步</el-button>
|
||||
<el-button type="primary" size="mini" icon="el-icon-coin" @click="handleCheckConnection">连通性检测</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-steps>
|
||||
<el-form v-if="active == 1" ref="form" :model="form" label-width="80px" disabled>
|
||||
<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>
|
||||
</el-form>
|
||||
<el-form v-if="active == 2" ref="form2" :model="form2" label-width="80px" disabled>
|
||||
<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>
|
||||
<el-button v-if="active == 1" style="margin-top: 12px;" @click="handleNextStep">下一步</el-button>
|
||||
<el-button v-if="active == 2" style="margin-top: 12px;" @click="handleLastStep">上一步</el-button>
|
||||
<el-descriptions style="margin-top: 20px" title="数据源信息" :column="2" border size="medium" >
|
||||
<el-descriptions-item :labelStyle="{width: '200px'}" :contentStyle="{width: '35%'}">
|
||||
<template slot="label">
|
||||
<i class="el-icon-tickets"></i>
|
||||
数据源名称
|
||||
</template>
|
||||
{{form.sourceName}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item :labelStyle="{width: '200px'}">
|
||||
<template slot="label">
|
||||
<i class="el-icon-star-off"></i>
|
||||
状态
|
||||
</template>
|
||||
<template v-for="dict in statusOptions">
|
||||
<el-tag v-if="form.status == dict.itemText && form.status == '1' " size="small" type="success">{{ dict.itemValue }}</el-tag>
|
||||
<el-tag v-if="form.status == dict.itemText && form.status != '1' " size="small" type="warning">{{ dict.itemValue }}</el-tag>
|
||||
</template>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item :labelStyle="{width: '200px'}">
|
||||
<template slot="label">
|
||||
<i class="el-icon-document"></i>
|
||||
备注
|
||||
</template>
|
||||
{{form.remark}}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions >
|
||||
<el-descriptions style="margin-top: 20px" title="数据库类型" :column="1" :colon="false" border size="medium">
|
||||
<el-descriptions-item :labelStyle="{width: '200px'}">
|
||||
<template slot="label">
|
||||
<i class="el-icon-menu"></i>
|
||||
数据库类型
|
||||
</template>
|
||||
<div class="modellist" style="width:100%">
|
||||
<div v-if="form.dbType =='1'" class="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 v-if="form.dbType =='2'" class="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 v-if="form.dbType =='3'" class="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 v-if="form.dbType =='9'" class="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 v-if="form.dbType =='8'" class="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 v-if="form.dbType =='5'" class="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 v-if="form.dbType =='6'" class="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 v-if="form.dbType =='7'" class="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 v-if="form.dbType =='10'" class="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 v-if="form.dbType =='4'" class="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-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-descriptions style="margin-top: 20px" title="连接信息" :column="2" border size="medium">
|
||||
<el-descriptions-item :labelStyle="{width: '200px'}" :contentStyle="{width: '35%'}">
|
||||
<template slot="label">
|
||||
<i class="el-icon-coin"></i>
|
||||
主机
|
||||
</template>
|
||||
{{form2.host}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item :labelStyle="{width: '200px'}">
|
||||
<template slot="label">
|
||||
<i class="el-icon-thumb"></i>
|
||||
端口
|
||||
</template>
|
||||
{{form2.port}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="form.dbType === '3' || form.dbType === '4'">
|
||||
<template slot="label">
|
||||
<i class="el-icon-user"></i>
|
||||
服务名
|
||||
</template>
|
||||
{{form2.sid}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item >
|
||||
<template slot="label">
|
||||
<i class="el-icon-coin"></i>
|
||||
数据库
|
||||
</template>
|
||||
{{form2.dbName}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<template slot="label">
|
||||
<i class="el-icon-user"></i>
|
||||
用户名
|
||||
</template>
|
||||
{{form2.username}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<template slot="label">
|
||||
<i class="el-icon-s-check"></i>
|
||||
密码
|
||||
</template>
|
||||
{{form2.password}}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDataSource, checkConnection, sync, word } from '@/api/metadata/datasource'
|
||||
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: 'DataSourceDetail',
|
||||
@@ -86,6 +203,18 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
title: '数据源详情',
|
||||
databaseImg: {
|
||||
imgMySQL: imgMySQL,
|
||||
imgMariaDB: imgMariaDB,
|
||||
imgOracle: imgOracle,
|
||||
imgdm8: imgdm8,
|
||||
imgibmdb2: imgibmdb2,
|
||||
imgPostgreSQL: imgPostgreSQL,
|
||||
imgSqlserver: imgSqlserver,
|
||||
imgdefault: imgdefault,
|
||||
imgkingbase: imgkingbase,
|
||||
imggaussdb: imggaussdb
|
||||
},
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
@@ -129,6 +258,7 @@ export default {
|
||||
getDataSource(id).then(response => {
|
||||
if (response.success) {
|
||||
this.form = response.data
|
||||
console.log('ddd', this.form)
|
||||
this.form2 = this.form.dbSchema
|
||||
}
|
||||
})
|
||||
|
||||
@@ -3,73 +3,164 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-if="active == 2" v-hasPerm="['metadata:datasource:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button v-if="active == 3" type="primary" size="mini" icon="el-icon-plus" :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 size="mini" type="primary" @click="handleCheckConnection">连通性检测</el-button>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<el-button v-if="active == 1" style="margin-top: 12px;" @click="handleNextStep">下一步</el-button>
|
||||
<el-button v-if="active == 2" style="margin-top: 12px;" @click="handleLastStep">上一步</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDataSource, updateDataSource, checkConnection } from '@/api/metadata/datasource'
|
||||
import { editDataSource } 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: 'DataSourceEdit',
|
||||
@@ -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: {},
|
||||
@@ -202,6 +306,7 @@ export default {
|
||||
updateDataSource(this.form).then(response => {
|
||||
if (response.success) {
|
||||
this.$message.success('保存成功')
|
||||
this.updateModelDataSource()
|
||||
setTimeout(() => {
|
||||
// 2秒后跳转列表页
|
||||
this.$emit('showCard', this.showOptions)
|
||||
@@ -219,6 +324,21 @@ export default {
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
updateModelDataSource() {
|
||||
const dbType = this.form.dbType
|
||||
const dataSource = {
|
||||
projectId: this.form2.dbName,
|
||||
databaseName: this.form2.dbName,
|
||||
schemaName: this.form2.schema === '' ? this.form2.dbName : this.form2.schema,
|
||||
databaseType: dbType,
|
||||
url: this.form2.host + ':' + this.form2.port + '/' + this.form2.dbName,
|
||||
username: this.form2.username,
|
||||
password: this.form2.password
|
||||
}
|
||||
editDataSource(dataSource).then(() => {
|
||||
}).catch(() => {
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -229,4 +349,7 @@ export default {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
.choosedDbType{
|
||||
border: 1px solid #165DFF;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,11 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item" @change="handleQuery">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据源名称" prop="sourceName">
|
||||
<el-input
|
||||
v-model="queryParams.sourceName"
|
||||
@@ -20,14 +25,12 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:datasource:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:datasource:refresh']"
|
||||
type="warning"
|
||||
icon="el-icon-refresh"
|
||||
size="mini"
|
||||
@@ -40,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>
|
||||
@@ -51,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">
|
||||
@@ -65,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>
|
||||
@@ -103,21 +106,18 @@
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-hasPerm="['metadata:datasource:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:datasource:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['metadata:datasource:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@@ -146,7 +146,7 @@ export default {
|
||||
name: 'DataSourceList',
|
||||
data() {
|
||||
return {
|
||||
tableHeight: document.body.offsetHeight - 310 + 'px',
|
||||
tableHeight: document.body.offsetHeight - 330 + 'px',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
@@ -160,6 +160,12 @@ export default {
|
||||
// 表格头
|
||||
tableColumns: [
|
||||
{ prop: 'sourceName', label: '数据源名称', show: true },
|
||||
{
|
||||
prop: 'dbType',
|
||||
label: '数据库类型',
|
||||
show: true,
|
||||
formatter: this.dbTypeFormatter
|
||||
},
|
||||
{
|
||||
prop: 'isSync',
|
||||
label: '同步状态',
|
||||
@@ -174,11 +180,15 @@ export default {
|
||||
},
|
||||
{ prop: 'createTime', label: '创建时间', show: true }
|
||||
],
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
tableSize: 'medium',
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
dbTypeOptions: [],
|
||||
// 数据源表格数据
|
||||
dataSourceList: [],
|
||||
// 总数据条数
|
||||
@@ -187,6 +197,7 @@ export default {
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
sourceName: ''
|
||||
}
|
||||
}
|
||||
@@ -197,6 +208,11 @@ export default {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getDicts('data_db_type').then(response => {
|
||||
if (response.success) {
|
||||
this.dbTypeOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
@@ -312,6 +328,10 @@ export default {
|
||||
this.queryParams.pageNum = val
|
||||
this.getList()
|
||||
},
|
||||
dbTypeFormatter(row, column, cellValue, index) {
|
||||
const dictLabel = this.selectDictLabel(this.dbTypeOptions, cellValue)
|
||||
return dictLabel
|
||||
},
|
||||
syncFormatter(row, column, cellValue, index) {
|
||||
if (cellValue === '0') {
|
||||
return <el-tag type='warning'>未同步</el-tag>
|
||||
|
||||
40
src/views/metadata/offlinedata/OfflineDataDetail.vue
Normal file
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<iframe src="http://192.168.1.217:8001/model/modelChildren?hideInMenu=true&projectId=1" width="100%" height="850px" frameborder="0" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'OfflineDataDetail',
|
||||
data() {
|
||||
return {
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
fileName: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
355
src/views/metadata/offlinedata/OfflineDataList.vue
Normal file
@@ -0,0 +1,355 @@
|
||||
<template>
|
||||
<el-card v-loading="boxCardLoading" class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item" @change="handleQuery">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="离线文件名称" prop="sourceName">
|
||||
<el-input
|
||||
v-model="queryParams.fileName"
|
||||
placeholder="请输入离线文件名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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-button-group>
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
action="#"
|
||||
:show-file-list="false"
|
||||
:http-request="uploadOfflineFile"
|
||||
>
|
||||
<el-button size="mini" type="primary" icon="el-icon-upload2">上传</el-button>
|
||||
</el-upload>
|
||||
</el-button-group>
|
||||
</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"
|
||||
:size="tableSize"
|
||||
:height="tableHeight"
|
||||
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" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="scope.row.isSwitch != 'jrcg'"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-sort"
|
||||
@click="handleSwitch(scope.row)"
|
||||
>执行接入</el-button>
|
||||
<el-button
|
||||
v-if="scope.row.isSwitch == 'jrcg'"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>查看接入数据</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-download"
|
||||
@click="handleDownload(scope.row)"
|
||||
>下载</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDetail(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
: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 { pageOfflineData, delDataSource, uploadFile } from '@/api/metadata/datasource'
|
||||
|
||||
export default {
|
||||
name: 'OfflineDataList',
|
||||
data() {
|
||||
return {
|
||||
tableHeight: document.body.offsetHeight - 330 + 'px',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
boxCardLoading: false,
|
||||
// 表格头
|
||||
tableColumns: [
|
||||
{ prop: 'fileName', label: '离线文件名称', show: true },
|
||||
{
|
||||
prop: 'offlineType',
|
||||
label: '离线文件类型',
|
||||
show: true,
|
||||
formatter: this.offlineTypeeFormatter
|
||||
},
|
||||
{
|
||||
prop: 'isSwitch',
|
||||
label: '接入状态',
|
||||
show: true,
|
||||
formatter: this.isSwitchFormatter
|
||||
},
|
||||
{ prop: 'createTime', label: '上传时间', show: true },
|
||||
{ prop: 'switchTime', label: '接入时间', show: true }
|
||||
],
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
tableSize: 'medium',
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
dbTypeOptions: [],
|
||||
// 数据源表格数据
|
||||
tableDataList: [],
|
||||
// 总数据条数
|
||||
total: 0,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
fileName: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDicts('sys_common_status').then(response => {
|
||||
if (response.success) {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getDicts('data_db_type').then(response => {
|
||||
if (response.success) {
|
||||
this.dbTypeOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
this.initCols()
|
||||
},
|
||||
methods: {
|
||||
/** 查询数据源列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
pageOfflineData(this.queryParams).then(response => {
|
||||
this.loading = false
|
||||
if (response.success) {
|
||||
const { data } = response
|
||||
this.tableDataList = data.data
|
||||
this.total = data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
initCols() {
|
||||
this.checkedTableColumns = this.tableColumns.map(col => col.prop)
|
||||
},
|
||||
handleSwitch(row) {
|
||||
this.boxCardLoading = true
|
||||
setTimeout(() => {
|
||||
row.isSwitch = 'jrcg'
|
||||
this.boxCardLoading = false
|
||||
this.$message.success('接入成功')
|
||||
}, 2000)
|
||||
},
|
||||
/** 详情按钮操作 */
|
||||
handleDetail(row) {
|
||||
this.showOptions.data.id = row.id
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showDetail = true
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
handleCheckedColsChange(val) {
|
||||
this.tableColumns.forEach(col => {
|
||||
if (!this.checkedTableColumns.includes(col.prop)) {
|
||||
col.show = false
|
||||
} else {
|
||||
col.show = true
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCommand(command) {
|
||||
this.tableSize = command
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.queryParams = {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
fileName: ''
|
||||
}
|
||||
this.handleQuery()
|
||||
},
|
||||
/** 刷新列表 */
|
||||
handleRefresh() {
|
||||
this.getList()
|
||||
},
|
||||
handleUpload() {
|
||||
|
||||
},
|
||||
handleDownload(row) {
|
||||
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$confirm('选中数据将被永久删除, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
delDataSource(row.id).then(response => {
|
||||
if (response.success) {
|
||||
this.$message.success('删除成功')
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
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()
|
||||
},
|
||||
offlineTypeeFormatter(row, column, cellValue, index) {
|
||||
if (cellValue === 'sjy') {
|
||||
return '数据源文件'
|
||||
} else if (cellValue === 'sj') {
|
||||
return '数据文件'
|
||||
}
|
||||
},
|
||||
isSwitchFormatter(row, column, cellValue, index) {
|
||||
if (cellValue === 'djr') {
|
||||
return <el-tag type='info'>待接入</el-tag>
|
||||
} else if (cellValue === 'jrcg') {
|
||||
return <el-tag type='success'>接入成功</el-tag>
|
||||
} else if (cellValue === 'jrsb') {
|
||||
return <el-tag type='error'>接入失败</el-tag>
|
||||
}
|
||||
},
|
||||
uploadOfflineFile(file) {
|
||||
this.formData = new FormData()
|
||||
this.formData.append('file', file.file)
|
||||
// 请求接口
|
||||
uploadFile(this.formData, 'sjy').then((response) => {
|
||||
if (response.success) {
|
||||
this.$message.success('上传成功')
|
||||
} else {
|
||||
this.$message.error('上传失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.right-toolbar {
|
||||
float: right;
|
||||
}
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 170px);
|
||||
}
|
||||
</style>
|
||||
|
||||
36
src/views/metadata/offlinedata/index.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<transition name="el-zoom-in-center">
|
||||
<offline-data-list v-if="options.showList" @showCard="showCard" />
|
||||
<offline-data-detail v-if="options.showDetail" @showCard="showCard" />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OfflineDataList from './OfflineDataList'
|
||||
import OfflineDataDetail from './OfflineDataDetail'
|
||||
|
||||
export default {
|
||||
name: 'OfflineData',
|
||||
components: { OfflineDataList, OfflineDataDetail },
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showDetail: true
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCard(data) {
|
||||
Object.assign(this.options, data)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
@@ -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>
|
||||
|
||||
48
src/views/monitor/project/index.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<transition name="el-zoom-in-center">
|
||||
<data-source-list v-if="options.showList" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-top">
|
||||
<data-source-add v-if="options.showAdd" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-top">
|
||||
<data-source-edit v-if="options.showEdit" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-bottom">
|
||||
<data-source-detail v-if="options.showDetail" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataSourceList from './projectList'
|
||||
import DataSourceAdd from './projectAdd'
|
||||
import DataSourceEdit from './projectEdit'
|
||||
import DataSourceDetail from './projectDetail'
|
||||
|
||||
export default {
|
||||
name: 'Project',
|
||||
components: { DataSourceList, DataSourceAdd, DataSourceEdit, DataSourceDetail },
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCard(data) {
|
||||
Object.assign(this.options, data)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
119
src/views/monitor/project/projectAdd.vue
Normal file
@@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<div style="padding: 20px 200px">
|
||||
<el-form-item label="项目名称" prop="projectName">
|
||||
<el-input v-model="form.projectName" placeholder="请输入项目名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="项目描述" prop="projectDescription">
|
||||
<el-input v-model="form.projectDescription" type="textarea" placeholder="请输入项目描述" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { addProject } from '@/api/monitor/projectApi'
|
||||
|
||||
export default {
|
||||
name: 'ProjectAdd',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: function() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '项目新增',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 保存按钮
|
||||
loadingOptions: {
|
||||
loading: false,
|
||||
loadingText: '保存',
|
||||
isDisabled: false
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
id: undefined,
|
||||
projectName: undefined,
|
||||
projectDescription: undefined,
|
||||
subjectId: undefined,
|
||||
deleted: undefined
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
projectName: [
|
||||
{ required: true, message: '项目名称不能为空', trigger: 'change' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.form.dbSchema = this.form2
|
||||
this.loadingOptions.loading = true
|
||||
this.loadingOptions.loadingText = '保存中...'
|
||||
this.loadingOptions.isDisabled = true
|
||||
addProject(this.form).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.$message.success('保存成功')
|
||||
setTimeout(() => {
|
||||
// 2秒后跳转列表页
|
||||
this.$emit('showCard', this.showOptions)
|
||||
}, 2000)
|
||||
} else {
|
||||
this.$message.error('保存失败')
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
.choosedDbType{
|
||||
border: 1px solid #165DFF;
|
||||
}
|
||||
</style>
|
||||
100
src/views/monitor/project/projectDetail.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px" disabled>
|
||||
<div style="padding: 20px 200px">
|
||||
<el-form-item label="项目名称" prop="projectName">
|
||||
<el-input v-model="form.projectName" placeholder="请输入项目名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="项目描述" prop="projectDescription">
|
||||
<el-input v-model="form.projectDescription" type="textarea" placeholder="请输入项目描述" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getProjectById } from '@/api/monitor/projectApi'
|
||||
|
||||
export default {
|
||||
name: 'ProjectDetail',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: function() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '项目新增',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 保存按钮
|
||||
loadingOptions: {
|
||||
loading: false,
|
||||
loadingText: '保存',
|
||||
isDisabled: false
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
id: undefined,
|
||||
projectName: undefined,
|
||||
projectDescription: undefined,
|
||||
subjectId: undefined,
|
||||
deleted: undefined
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
projectName: [
|
||||
{ required: true, message: '项目名称不能为空', trigger: 'change' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.getProjectById(this.data.id)
|
||||
},
|
||||
methods: {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 获取详情 */
|
||||
async getProjectById(id) {
|
||||
this.form = await getProjectById(id).then(response => {
|
||||
if (response.code === 200) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
.choosedDbType{
|
||||
border: 1px solid #165DFF;
|
||||
}
|
||||
</style>
|
||||
129
src/views/monitor/project/projectEdit.vue
Normal file
@@ -0,0 +1,129 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<div style="padding: 20px 200px">
|
||||
<el-form-item label="项目名称" prop="projectName">
|
||||
<el-input v-model="form.projectName" placeholder="请输入项目名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="项目描述" prop="projectDescription">
|
||||
<el-input v-model="form.projectDescription" type="textarea" placeholder="请输入项目描述" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getProjectById, updateProject } from '@/api/monitor/projectApi'
|
||||
|
||||
export default {
|
||||
name: 'ProjectEdit',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: function() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '项目修改',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 保存按钮
|
||||
loadingOptions: {
|
||||
loading: false,
|
||||
loadingText: '保存',
|
||||
isDisabled: false
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
id: undefined,
|
||||
projectName: undefined,
|
||||
projectDescription: undefined,
|
||||
subjectId: undefined,
|
||||
deleted: undefined
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
projectName: [
|
||||
{ required: true, message: '项目名称不能为空', trigger: 'change' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.getProjectById(this.data.id)
|
||||
},
|
||||
methods: {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 获取详情 */
|
||||
async getProjectById(id) {
|
||||
this.form = await getProjectById(id).then(response => {
|
||||
if (response.code === 200) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.loadingOptions.loading = true
|
||||
this.loadingOptions.loadingText = '保存中...'
|
||||
this.loadingOptions.isDisabled = true
|
||||
updateProject(this.form).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.$message.success('保存成功')
|
||||
setTimeout(() => {
|
||||
// 2秒后跳转列表页
|
||||
this.$emit('showCard', this.showOptions)
|
||||
}, 2000)
|
||||
} else {
|
||||
this.$message.error('保存失败')
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
.choosedDbType{
|
||||
border: 1px solid #165DFF;
|
||||
}
|
||||
</style>
|
||||
300
src/views/monitor/project/projectList.vue
Normal file
@@ -0,0 +1,300 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目名称" prop="sourceName">
|
||||
<el-input
|
||||
v-model="queryParams.projectName"
|
||||
placeholder="请输入项目名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-button-group>
|
||||
</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="dataSourceList"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:size="tableSize"
|
||||
:height="tableHeight"
|
||||
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-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
: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 { pageProjectList, delNewProject } from '@/api/monitor/projectApi'
|
||||
export default {
|
||||
name: 'ProjectList',
|
||||
data() {
|
||||
return {
|
||||
tableHeight: document.body.offsetHeight - 330 + 'px',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 表格头
|
||||
tableColumns: [
|
||||
{
|
||||
prop: 'projectName',
|
||||
label: '项目名称',
|
||||
show: true, width: '90px'
|
||||
},
|
||||
{ prop: 'projectDescription', label: '项目描述', show: true }
|
||||
],
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
tableSize: 'medium',
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
dbTypeOptions: [],
|
||||
// 数据源表格数据
|
||||
dataSourceList: [],
|
||||
// 总数据条数
|
||||
total: 0,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectName: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
this.initCols()
|
||||
},
|
||||
methods: {
|
||||
/** 查询数据源列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
// pageDataSource(this.queryParams).then(response => {
|
||||
// this.loading = false
|
||||
// if (response.success) {
|
||||
// const { data } = response
|
||||
// this.dataSourceList = data.data
|
||||
// this.total = data.total
|
||||
// }
|
||||
// })
|
||||
pageProjectList(this.queryParams).then(response => {
|
||||
this.loading = false
|
||||
if (response.code === 200) {
|
||||
this.dataSourceList = response.rows
|
||||
this.total = response.total
|
||||
}
|
||||
console.log('response==', response)
|
||||
})
|
||||
},
|
||||
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
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.queryParams = {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
sourceName: ''
|
||||
}
|
||||
this.handleQuery()
|
||||
},
|
||||
/** 刷新列表 */
|
||||
handleRefresh() {
|
||||
this.getList()
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.showOptions.data = {}
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showAdd = true
|
||||
this.showOptions.showEdit = false
|
||||
this.showOptions.showDetail = false
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleEdit(row) {
|
||||
this.showOptions.data.id = row.id
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showAdd = false
|
||||
this.showOptions.showEdit = true
|
||||
this.showOptions.showDetail = false
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 详情按钮操作 */
|
||||
handleDetail(row) {
|
||||
this.showOptions.data.id = row.id
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showAdd = false
|
||||
this.showOptions.showEdit = false
|
||||
this.showOptions.showDetail = true
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$confirm('选中数据将被永久删除, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
delNewProject(row.id).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.$message.success('删除成功')
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
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()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.right-toolbar {
|
||||
float: right;
|
||||
}
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 170px);
|
||||
}
|
||||
</style>
|
||||
@@ -3,35 +3,43 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['quality:rule: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 == 2" 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 size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="规则名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入规则名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="核查类型" prop="ruleItemId">
|
||||
<el-select v-model="form.ruleItemId" placeholder="请选择核查类型" @change="ruleItemSelectChanged">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则级别" prop="ruleLevelId">
|
||||
<el-select v-model="form.ruleLevelId" placeholder="请选择规则级别">
|
||||
<el-option
|
||||
v-for="item in ruleLevelOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div class="body-wrapper" style="padding-left: 20%">
|
||||
<el-steps :active="active" finish-status="success" align-center style="width: 900px">
|
||||
<el-step title="填写检测用例信息" />
|
||||
<el-step title="选择检测数据源" />
|
||||
</el-steps>
|
||||
<!--<el-form ref="form" :model="form" :rules="rules" label-width="80px" style="width: 800px">
|
||||
<div style="padding: 20px 100px">
|
||||
<el-form-item label="用例名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入用例名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="检测类型" prop="ruleItemId">
|
||||
<el-select v-model="form.ruleItemId" placeholder="请选择检测类型" @change="ruleItemSelectChanged">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用例级别" prop="ruleLevelId">
|
||||
<el-select v-model="form.ruleLevelId" placeholder="请选择用例级别">
|
||||
<el-option
|
||||
v-for="item in ruleLevelOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item label="数据源" prop="ruleSourceId">
|
||||
<el-select v-model="form.ruleSourceId" placeholder="请选择数据源" @change="sourceSelectChanged">
|
||||
<el-option
|
||||
@@ -54,8 +62,8 @@
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="核查字段" prop="ruleColumnId">
|
||||
<el-select v-model="form.ruleColumnId" placeholder="请选择核查字段" @change="columnSelectChanged">
|
||||
<el-form-item label="检测字段" prop="ruleColumnId">
|
||||
<el-select v-model="form.ruleColumnId" placeholder="请选择检测字段" @change="columnSelectChanged">
|
||||
<el-option
|
||||
v-for="column in columnOptions"
|
||||
:key="column.id"
|
||||
@@ -66,7 +74,7 @@
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-divider content-position="left">核查配置</el-divider>
|
||||
<el-divider content-position="left">检测配置</el-divider>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'timeliness_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="判定阀值">
|
||||
@@ -137,7 +145,7 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 正则表达式规则-->
|
||||
<!– 正则表达式规则–>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="正则表达">
|
||||
@@ -170,6 +178,81 @@
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>-->
|
||||
|
||||
<el-form v-if="active == 1" ref="form" :model="form" :rules="rules" label-width="120px" style="width: 800px">
|
||||
<div style="padding: 20px 100px">
|
||||
<el-form-item label="用例名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入用例名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="检测类型" prop="ruleItemId">
|
||||
<el-select v-model="form.ruleItemId" placeholder="请选择检测类型" style="width: 100%" @change="ruleItemSelectChanged">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="用例级别" prop="ruleLevelId">-->
|
||||
<!-- <el-select v-model="form.ruleLevelId" placeholder="请选择用例级别" style="width: 100%">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in ruleLevelOptions"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.name"-->
|
||||
<!-- :value="item.id"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
</div>
|
||||
</el-form>
|
||||
<el-form v-if="active == 2" ref="form" :model="form" :rules="rules" label-width="80px" style="width: 800px">
|
||||
<div style="padding: 20px 100px">
|
||||
<el-form-item label="数据源" prop="ruleSourceId">
|
||||
<el-select v-model="form.ruleSourceId" placeholder="请选择数据源" style="width: 100%" @change="sourceSelectChanged">
|
||||
<el-option
|
||||
v-for="source in sourceOptions"
|
||||
:key="source.id"
|
||||
:label="source.sourceName"
|
||||
:value="source.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="正则表达">
|
||||
<el-input v-model="form.ruleConfig.regular.regular" placeholder="请输入正则规则" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-form-item label="常用正则">
|
||||
<el-radio-group v-model="form.zzStatus" @change="handleZzStatusRadioChange">
|
||||
<el-radio label="1">手机号码</el-radio>
|
||||
<el-radio label="2">邮箱</el-radio>
|
||||
<el-radio label="3">整数</el-radio>
|
||||
<el-radio label="4">负数</el-radio>
|
||||
<el-radio label="5">身份证</el-radio>
|
||||
<el-radio label="6">日期格式yyyy-mm-dd</el-radio>
|
||||
<el-radio label="7">IP</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
<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>
|
||||
</div>
|
||||
</el-card>
|
||||
@@ -194,7 +277,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '核查规则新增',
|
||||
title: '检测用例新增',
|
||||
active: 1,
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
@@ -310,6 +394,18 @@ export default {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 步骤条下一步 */
|
||||
handleNextStep() {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.active++
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 步骤条上一步 */
|
||||
handleLastStep() {
|
||||
this.active--
|
||||
},
|
||||
getRuleLevelList() {
|
||||
listRuleLevel().then(response => {
|
||||
if (response.success) {
|
||||
@@ -415,6 +511,8 @@ export default {
|
||||
this.loadingOptions.loading = true
|
||||
this.loadingOptions.loadingText = '保存中...'
|
||||
this.loadingOptions.isDisabled = true
|
||||
this.form.ruleTableId = 'all'
|
||||
this.form.ruleTable = '全表'
|
||||
addCheckRule(this.form).then(response => {
|
||||
if (response.success) {
|
||||
this.$message.success('保存成功')
|
||||
@@ -442,6 +540,16 @@ export default {
|
||||
this.form.ruleConfig.regular.regular = '^[1-9][0-9]{10}$'
|
||||
} else if (value === '2') {
|
||||
this.form.ruleConfig.regular.regular = '^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+$'
|
||||
} else if (value === '3') {
|
||||
this.form.ruleConfig.regular.regular = '[0-9]*[1-9][0-9]*'
|
||||
} else if (value === '4') {
|
||||
this.form.ruleConfig.regular.regular = '-[0-9]*[1-9][0-9]*'
|
||||
} else if (value === '5') {
|
||||
this.form.ruleConfig.regular.regular = '\\d{15}(\\d\\d[0-9xX])?'
|
||||
} else if (value === '6') {
|
||||
this.form.ruleConfig.regular.regular = '(\\d{4}|\\d{2})-((1[0-2])|(0?[1-9]))-(([12][0-9])|(3[01])|(0?[1-9]))'
|
||||
} else if (value === '7') {
|
||||
this.form.ruleConfig.regular.regular = '((2[0-4]\\d|25[0-5]|[01]?\\d\\d?)\\.){3}(2[0-4]\\d|25[0-5]|[01]?\\d\\d?)'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -21,16 +21,16 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则级别">
|
||||
<el-select v-model="form.ruleLevelId">
|
||||
<el-option
|
||||
v-for="item in ruleLevelOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="规则级别">-->
|
||||
<!-- <el-select v-model="form.ruleLevelId">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in ruleLevelOptions"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.name"-->
|
||||
<!-- :value="item.id"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-form-item label="数据源">
|
||||
<el-select v-model="form.ruleSourceId">
|
||||
<el-option
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['quality:rule:edit']" type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
@@ -22,16 +22,16 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则级别" prop="ruleLevelId">
|
||||
<el-select v-model="form.ruleLevelId" placeholder="请选择规则级别">
|
||||
<el-option
|
||||
v-for="item in ruleLevelOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="规则级别" prop="ruleLevelId">-->
|
||||
<!-- <el-select v-model="form.ruleLevelId" placeholder="请选择规则级别">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in ruleLevelOptions"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.name"-->
|
||||
<!-- :value="item.id"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-form-item label="数据源" prop="ruleSourceId">
|
||||
<el-select v-model="form.ruleSourceId" placeholder="请选择数据源" @change="sourceSelectChanged">
|
||||
<el-option
|
||||
@@ -218,9 +218,6 @@ export default {
|
||||
ruleItemId: [
|
||||
{ required: true, message: '核查类型不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleLevelId: [
|
||||
{ required: true, message: '规则级别不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleSourceId: [
|
||||
{ required: true, message: '数据源不能为空', trigger: 'change' }
|
||||
],
|
||||
|
||||
@@ -26,10 +26,35 @@
|
||||
<el-col :span="18">
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="规则名称" prop="ruleName">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item" @change="handleQuery">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据源" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleSource"
|
||||
placeholder="请输入数据源"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="数据表" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleTable"
|
||||
placeholder="请输入数据表"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="用例名称" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleName"
|
||||
placeholder="请输入规则名称"
|
||||
placeholder="请输入用例名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
@@ -45,7 +70,6 @@
|
||||
<el-col :span="12">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
v-hasPerm="['quality:rule:add']"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@@ -58,7 +82,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 +93,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 +107,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>
|
||||
@@ -122,21 +146,18 @@
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-hasPerm="['quality:rule:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['quality:rule:detail']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
v-hasPerm="['quality:rule:remove']"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@@ -167,7 +188,7 @@ export default {
|
||||
name: 'CheckContentRuleList',
|
||||
data() {
|
||||
return {
|
||||
tableHeight: document.body.offsetHeight - 310 + 'px',
|
||||
tableHeight: document.body.offsetHeight - 330 + 'px',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
@@ -180,12 +201,12 @@ export default {
|
||||
loading: true,
|
||||
// 表格头
|
||||
tableColumns: [
|
||||
{ prop: 'ruleName', label: '规则名称', show: true },
|
||||
{ prop: 'ruleType', label: '规则类型', show: true },
|
||||
{ prop: 'ruleSource', label: '数据源', show: true },
|
||||
{ prop: 'ruleTable', label: '数据表', show: true, formatter: this.ruleTableFormatter },
|
||||
{ prop: 'ruleColumn', label: '核查字段', show: true, formatter: this.ruleColumnFormatter },
|
||||
{ prop: 'ruleLevel', label: '规则级别', width: 100, show: true },
|
||||
/* { prop: 'ruleTable', label: '数据表', show: true, formatter: this.ruleTableFormatter },*/
|
||||
/* { prop: 'ruleColumn', label: '检测字段', show: true, formatter: this.ruleColumnFormatter },*/
|
||||
{ prop: 'ruleName', label: '用例名称', show: true },
|
||||
{ prop: 'ruleType', label: '用例类型', show: true },
|
||||
// { prop: 'ruleLevel', label: '用例级别', width: 100, show: true },
|
||||
{
|
||||
prop: 'status',
|
||||
label: '状态',
|
||||
@@ -195,6 +216,9 @@ export default {
|
||||
},
|
||||
{ prop: 'createTime', label: '创建时间', show: true }
|
||||
],
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
tableSize: 'medium',
|
||||
@@ -208,6 +232,7 @@ export default {
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
ruleTypeId: '',
|
||||
ruleName: ''
|
||||
},
|
||||
@@ -237,11 +262,11 @@ export default {
|
||||
if (response.success) {
|
||||
const { data } = response
|
||||
const tree = {}
|
||||
tree.name = '规则类型'
|
||||
tree.name = '用例类型'
|
||||
const children = []
|
||||
data.forEach(e => {
|
||||
if (e.code === 'unique' || e.code === 'integrity' || e.code === 'accuracy' ||
|
||||
e.code === 'consistent' || e.code === 'relevance' || e.code === 'regular') {
|
||||
if (e.code === 'integrity' || e.code === 'accuracy' ||
|
||||
e.code === 'consistent' || e.code === 'regular') {
|
||||
children.push(e)
|
||||
}
|
||||
})
|
||||
@@ -308,7 +333,7 @@ export default {
|
||||
handleAdd() {
|
||||
this.showOptions.data = {}
|
||||
if (!this.queryParams.ruleTypeId) {
|
||||
this.$message.warning('请先选择核查规则类型')
|
||||
this.$message.warning('请先选择核查用例类型')
|
||||
return
|
||||
}
|
||||
this.showOptions.data.ruleTypeId = this.queryParams.ruleTypeId
|
||||
@@ -386,7 +411,7 @@ export default {
|
||||
float: right;
|
||||
}
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 170px);
|
||||
height: calc(100vh - 100px);
|
||||
}
|
||||
.tree-wrapper {
|
||||
overflow-y: auto;
|
||||
|
||||
379
src/views/quality/checkjob/CheckJobDetail.vue
Normal file
@@ -7,13 +7,13 @@
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
||||
<div class="body-wrapper" style="padding-left: 25%">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px" style="width: 700px">
|
||||
<el-form-item label="任务名称" prop="jobName">
|
||||
<el-input v-model="form.jobName" placeholder="任务名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="任务类型" prop="jobType">
|
||||
<el-select v-model="form.jobType" placeholder="请选择任务类型" @change="ruleItemSelectChanged">
|
||||
<el-select v-model="form.jobType" placeholder="请选择任务类型" @change="ruleItemSelectChanged" style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.typeId"
|
||||
@@ -22,7 +22,16 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-divider content-position="left">任务配置</el-divider>
|
||||
<el-form-item label="检测用例" prop="checkCase">
|
||||
<el-select v-model="form.checkCase" multiple placeholder="检测用例" style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in checkCaseOptions"
|
||||
:key="item.id"
|
||||
:label="item.ruleName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="cron表达式" prop="cronExpression">
|
||||
<el-input v-model="form.cronExpression" placeholder="cron表达式" />
|
||||
</el-form-item>
|
||||
@@ -37,7 +46,7 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="任务概述" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
<el-input v-model="form.remark" type="textarea" :rows="8" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
@@ -46,9 +55,10 @@
|
||||
|
||||
<script>
|
||||
import { updateCheckJob, getScheduleJobById } from '@/api/quality/checkjob'
|
||||
import { pageCheckRule } from '@/api/quality/checkrule'
|
||||
|
||||
export default {
|
||||
name: 'CheckJobAdd',
|
||||
name: 'CheckJobEdit',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
@@ -88,6 +98,7 @@ export default {
|
||||
{ required: true, message: 'cron表达式不能为空', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
checkCaseOptions: [],
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 规则级别数据字典
|
||||
@@ -95,7 +106,8 @@ export default {
|
||||
// 核查类型数据字典
|
||||
ruleItemOptions: [
|
||||
{ typeId: 'structure', typeName: '结构符合性' },
|
||||
{ typeId: 'content', typeName: '内容符合性' }
|
||||
{ typeId: 'content', typeName: '内容符合性' },
|
||||
{ typeId: 'relevance', typeName: '关联符合性' }
|
||||
],
|
||||
sourceOptions: [],
|
||||
tableOptions: [],
|
||||
@@ -111,6 +123,7 @@ export default {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getCheckRule()
|
||||
},
|
||||
mounted() {
|
||||
this.getCheckJob(this.data.id)
|
||||
@@ -134,6 +147,29 @@ export default {
|
||||
})
|
||||
this.form.jobType = item.typeId
|
||||
},
|
||||
getCheckRule() {
|
||||
let ruleType = 'nr'
|
||||
if(this.form.jobType == 'structure'){
|
||||
ruleType = 'jg'
|
||||
} else if(this.form.jobType == 'relevance'){
|
||||
ruleType = 'gl'
|
||||
}
|
||||
let params = {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
ruleTypeId: '',
|
||||
ruleName: '',
|
||||
ruleType: ruleType
|
||||
}
|
||||
this.checkCaseOptions = []
|
||||
pageCheckRule(params).then(response => {
|
||||
if (response.success) {
|
||||
const { data } = response
|
||||
this.checkCaseOptions = data.data
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function () {
|
||||
this.$refs['form'].validate(valid => {
|
||||
|
||||
@@ -1,6 +1,11 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item" @change="handleQuery">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="任务名称" prop="sourceName">
|
||||
<el-input
|
||||
v-model="queryParams.sourceName"
|
||||
@@ -32,7 +37,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 +48,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 +62,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 +76,7 @@
|
||||
:data="tableDataList"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:size="tableSize"
|
||||
:height="tableHeight"
|
||||
style="width: 100%;margin: 15px 0;"
|
||||
>
|
||||
@@ -91,8 +97,20 @@
|
||||
show-overflow-tooltip
|
||||
/>
|
||||
</template>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="400px">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
v-if="scope.row.status === '1'"
|
||||
size="mini"
|
||||
@@ -104,28 +122,21 @@
|
||||
v-if="scope.row.status === '0'"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
icon="el-icon-refresh-left"
|
||||
@click="handleResume(scope.row)"
|
||||
>任务恢复</el-button>
|
||||
<el-button
|
||||
<!--<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
icon="el-icon-s-promotion"
|
||||
@click="handleRun(scope.row)"
|
||||
>立即执行</el-button>
|
||||
>立即执行</el-button>-->
|
||||
<el-button
|
||||
v-hasPerm="['quality:rule:edit']"
|
||||
size="mini"
|
||||
type="text"
|
||||
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>-->
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -168,13 +179,24 @@ export default {
|
||||
// { prop: 'methodParams', label: '方法参数', show: true },
|
||||
{ prop: 'cronExpression', label: 'cron表达式', show: true },
|
||||
{ prop: 'afterDate', label: '最近完成时间', show: true },
|
||||
{
|
||||
prop: 'schedule',
|
||||
label: '任务进度',
|
||||
show: true,
|
||||
formatter: this.scheduleFormatter
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: '状态',
|
||||
label: '定时状态',
|
||||
show: true,
|
||||
formatter: this.statusFormatter
|
||||
}
|
||||
},
|
||||
{ prop: 'remark', label: '任务概述', show: true }
|
||||
],
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
tableSize: 'medium',
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
// 状态数据字典
|
||||
@@ -187,6 +209,7 @@ export default {
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
sourceName: ''
|
||||
}
|
||||
}
|
||||
@@ -293,6 +316,9 @@ export default {
|
||||
return <el-tag type='warning'>{dictLabel}</el-tag>
|
||||
}
|
||||
},
|
||||
scheduleFormatter(row, column, cellValue, index){
|
||||
return '100%'
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
|
||||
@@ -9,6 +9,9 @@
|
||||
<transition name="el-zoom-in-top">
|
||||
<check-job-edit v-if="options.showEdit" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-top">
|
||||
<check-job-detail v-if="options.showDetail" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -16,10 +19,11 @@
|
||||
import CheckJobList from './CheckJobList'
|
||||
import CheckJobAdd from './CheckJobAdd'
|
||||
import CheckJobEdit from './CheckJobEdit'
|
||||
import CheckJobDetail from './CheckJobDetail'
|
||||
|
||||
export default {
|
||||
name: 'CheckJob',
|
||||
components: { CheckJobList, CheckJobAdd, CheckJobEdit },
|
||||
components: { CheckJobList, CheckJobAdd, CheckJobEdit, CheckJobDetail },
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="规则类型" prop="ruleTypeId">
|
||||
<el-select v-model="queryParams.ruleTypeId" clearable placeholder="请选择规则类型">
|
||||
<el-form-item label="用例类型" prop="ruleTypeId">
|
||||
<el-select v-model="queryParams.ruleTypeId" clearable placeholder="请选择用例类型">
|
||||
<el-option
|
||||
v-for="item in ruleTypeOptions"
|
||||
:key="item.id"
|
||||
@@ -75,8 +75,8 @@ export default {
|
||||
// 表格头
|
||||
tableColumns: [
|
||||
{ prop: 'executeJobName', label: '任务名称', show: true },
|
||||
{ prop: 'executeRuleTypeName', label: '规则类型', show: true },
|
||||
{ prop: 'executeRuleName', label: '规则名称', show: true },
|
||||
{ prop: 'executeRuleTypeName', label: '用例类型', show: true },
|
||||
{ prop: 'executeRuleName', label: '用例名称', show: true },
|
||||
{ prop: 'executeBatch', label: '执行批次', show: true },
|
||||
{
|
||||
prop: 'status',
|
||||
|
||||
529
src/views/quality/checkrelevancerule/CheckRelevanceRuleAdd.vue
Normal file
@@ -0,0 +1,529 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-if="active == 2" 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 size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper" style="padding-left: 20%">
|
||||
<el-steps :active="active" finish-status="success" align-center style="width: 900px">
|
||||
<el-step title="填写检测用例信息" />
|
||||
<el-step title="选择检测数据源" />
|
||||
</el-steps>
|
||||
<!--<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="用例名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入用例名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="检测类型" prop="ruleItemId">
|
||||
<el-select v-model="form.ruleItemId" placeholder="请选择检测类型" @change="ruleItemSelectChanged">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用例级别" prop="ruleLevelId">
|
||||
<el-select v-model="form.ruleLevelId" placeholder="请选择用例级别">
|
||||
<el-option
|
||||
v-for="item in ruleLevelOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据源" prop="ruleSourceId">
|
||||
<el-select v-model="form.ruleSourceId" placeholder="请选择数据源" @change="sourceSelectChanged">
|
||||
<el-option
|
||||
v-for="source in sourceOptions"
|
||||
:key="source.id"
|
||||
:label="source.sourceName"
|
||||
:value="source.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据表" prop="ruleTableId">
|
||||
<el-select v-model="form.ruleTableId" placeholder="请选择数据表" @change="tableSelectChanged">
|
||||
<el-option
|
||||
v-for="table in tableOptions"
|
||||
:key="table.id"
|
||||
:label="table.tableName"
|
||||
:value="table.id"
|
||||
>
|
||||
<span style="float: left">{{ table.tableName + '(' + table.tableComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="检测字段" prop="ruleColumnId">
|
||||
<el-select v-model="form.ruleColumnId" placeholder="请选择检测字段" @change="columnSelectChanged">
|
||||
<el-option
|
||||
v-for="column in columnOptions"
|
||||
:key="column.id"
|
||||
:label="column.columnName"
|
||||
:value="column.id"
|
||||
>
|
||||
<span style="float: left">{{ column.columnName + '(' + column.columnComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-divider content-position="left">检测配置</el-divider>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'timeliness_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="判定阀值">
|
||||
<el-input-number v-model="form.ruleConfig.timeliness.threshold" :controls="false" :min="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'consistent_key'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标准字典类别">
|
||||
<el-select v-model="form.ruleConfig.consistent.gbTypeId" placeholder="请选择" @change="dictTypeSelectChanged">
|
||||
<el-option
|
||||
v-for="item in dictTypeOptions"
|
||||
:key="item.id"
|
||||
:label="item.gbTypeName"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标准字典字段">
|
||||
<el-select v-model="form.ruleConfig.consistent.bindGbColumn" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in gbColumnOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'relevance_key'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="关联表">
|
||||
<el-select v-model="form.ruleConfig.relevance.relatedTableId" placeholder="请选择" @change="relatedTableSelectChanged">
|
||||
<el-option
|
||||
v-for="table in tableOptions"
|
||||
:key="table.id"
|
||||
:label="table.tableName"
|
||||
:value="table.id"
|
||||
>
|
||||
<span style="float: left">{{ table.tableName + '(' + table.tableComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="关联字段">
|
||||
<el-select v-model="form.ruleConfig.relevance.relatedColumnId" placeholder="请选择" @change="relatedColumnSelectChanged">
|
||||
<el-option
|
||||
v-for="column in relatedColumnOptions"
|
||||
:key="column.id"
|
||||
:label="column.columnName"
|
||||
:value="column.id"
|
||||
>
|
||||
<span style="float: left">{{ column.columnName + '(' + column.columnComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'accuracy_key_length'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="最大长度">
|
||||
<el-input-number v-model="form.ruleConfig.accuracy.maxLength" :controls="false" :min="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!– 正则表达式规则–>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="正则表达">
|
||||
<el-input v-model="form.ruleConfig.regular.regular" placeholder="请输入正则规则" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-form-item label="常用正则">
|
||||
<el-radio-group v-model="form.zzStatus" @change="handleZzStatusRadioChange">
|
||||
<el-radio label="1">手机号码</el-radio>
|
||||
<el-radio label="2">邮箱</el-radio>
|
||||
<el-radio label="3">整数</el-radio>
|
||||
<el-radio label="4">负数</el-radio>
|
||||
<el-radio label="5">身份证</el-radio>
|
||||
<el-radio label="6">日期格式yyyy-mm-dd</el-radio>
|
||||
<el-radio label="7">IP</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
<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>
|
||||
</el-form>-->
|
||||
|
||||
<el-form v-if="active == 1" ref="form" :model="form" :rules="rules" label-width="120px" style="width: 800px">
|
||||
<div style="padding: 20px 100px">
|
||||
<el-form-item label="用例名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入用例名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="检测类型" prop="ruleItemId">
|
||||
<el-select v-model="form.ruleItemId" placeholder="请选择检测类型" style="width: 100%" @change="ruleItemSelectChanged">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="用例级别" prop="ruleLevelId">-->
|
||||
<!-- <el-select v-model="form.ruleLevelId" placeholder="请选择用例级别" style="width: 100%">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in ruleLevelOptions"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.name"-->
|
||||
<!-- :value="item.id"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
</div>
|
||||
</el-form>
|
||||
<el-form v-if="active == 2" ref="form" :model="form" :rules="rules" label-width="80px" style="width: 800px">
|
||||
<div style="padding: 20px 100px">
|
||||
<el-form-item label="数据源" prop="ruleSourceId">
|
||||
<el-select v-model="form.ruleSourceId" placeholder="请选择数据源" style="width: 100%" @change="sourceSelectChanged">
|
||||
<el-option
|
||||
v-for="source in sourceOptions"
|
||||
:key="source.id"
|
||||
:label="source.sourceName"
|
||||
:value="source.id"
|
||||
/>
|
||||
</el-select>
|
||||
</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>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listRuleLevel, listRuleItem, addCheckRule } from '@/api/quality/checkrule'
|
||||
import { listDataSource } from '@/api/metadata/datasource'
|
||||
import { listDataTable } from '@/api/metadata/datatable'
|
||||
import { listDataColumn } from '@/api/metadata/datacolumn'
|
||||
import { listDataDictType } from '@/api/standard/datadict'
|
||||
|
||||
export default {
|
||||
name: 'CheckRelevanceRuleAdd',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: function() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '检测用例新增',
|
||||
active: 1,
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 保存按钮
|
||||
loadingOptions: {
|
||||
loading: false,
|
||||
loadingText: '保存',
|
||||
isDisabled: false
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
ruleName: undefined,
|
||||
ruleTypeId: undefined,
|
||||
ruleItemId: undefined,
|
||||
ruleLevelId: undefined,
|
||||
ruleDbType: undefined,
|
||||
ruleSourceId: undefined,
|
||||
ruleSource: undefined,
|
||||
ruleTableId: undefined,
|
||||
ruleTable: undefined,
|
||||
ruleTableComment: undefined,
|
||||
ruleColumnId: undefined,
|
||||
ruleColumn: undefined,
|
||||
ruleColumnComment: undefined,
|
||||
ruleConfig: {
|
||||
ruleItemCode: undefined,
|
||||
consistent: {
|
||||
gbTypeId: undefined,
|
||||
bindGbColumn: undefined
|
||||
},
|
||||
relevance: {
|
||||
relatedTableId: undefined,
|
||||
relatedTable: undefined,
|
||||
relatedTableComment: undefined,
|
||||
relatedColumnId: undefined,
|
||||
relatedColumn: undefined,
|
||||
relatedColumnComment: undefined
|
||||
},
|
||||
timeliness: {
|
||||
threshold: undefined
|
||||
},
|
||||
accuracy: {
|
||||
maxLength: undefined
|
||||
},
|
||||
regular: {
|
||||
regular: undefined
|
||||
}
|
||||
},
|
||||
status: '1',
|
||||
zzStatus: '0' // 状态正则
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
ruleName: [
|
||||
{ required: true, message: '规则名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
ruleItemId: [
|
||||
{ required: true, message: '核查类型不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleSourceId: [
|
||||
{ required: true, message: '数据源不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleTableId: [
|
||||
{ required: true, message: '数据表不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleColumnId: [
|
||||
{ required: true, message: '核查字段不能为空', trigger: 'change' }
|
||||
]
|
||||
},
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 规则级别数据字典
|
||||
ruleLevelOptions: [],
|
||||
// 核查类型数据字典
|
||||
ruleItemOptions: [],
|
||||
sourceOptions: [],
|
||||
tableOptions: [],
|
||||
columnOptions: [],
|
||||
dictTypeOptions: [],
|
||||
gbColumnOptions: [
|
||||
{ value: 'gb_code', label: '标准编码' },
|
||||
{ value: 'gb_name', label: '标准名称' }
|
||||
],
|
||||
relatedColumnOptions: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
console.log('data:' + this.data)
|
||||
this.form.ruleTypeId = this.data.ruleTypeId
|
||||
this.getDicts('sys_common_status').then(response => {
|
||||
if (response.success) {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
listDataDictType().then(response => {
|
||||
if (response.success) {
|
||||
this.dictTypeOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getRuleLevelList()
|
||||
this.getRuleItemList()
|
||||
this.getDataSourceList()
|
||||
},
|
||||
methods: {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 步骤条下一步 */
|
||||
handleNextStep() {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.active++
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 步骤条上一步 */
|
||||
handleLastStep() {
|
||||
this.active--
|
||||
},
|
||||
getRuleLevelList() {
|
||||
listRuleLevel().then(response => {
|
||||
if (response.success) {
|
||||
this.ruleLevelOptions = response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
getRuleItemList() {
|
||||
listRuleItem({ ruleTypeId: this.data.ruleTypeId }).then(response => {
|
||||
if (response.success) {
|
||||
this.ruleItemOptions = response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
getDataSourceList() {
|
||||
listDataSource().then(response => {
|
||||
if (response.success) {
|
||||
this.sourceOptions = response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
ruleItemSelectChanged(val) {
|
||||
const item = this.ruleItemOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.ruleItemCode = item.itemCode
|
||||
},
|
||||
sourceSelectChanged(val) {
|
||||
listDataTable({ sourceId: val }).then(response => {
|
||||
if (response.success) {
|
||||
this.tableOptions = response.data
|
||||
this.columnOptions = []
|
||||
const source = this.sourceOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleSource = source.sourceName
|
||||
this.form.ruleDbType = source.dbType
|
||||
this.form.ruleTableId = ''
|
||||
this.form.ruleTable = ''
|
||||
this.form.ruleTableComment = ''
|
||||
this.form.ruleColumnId = ''
|
||||
this.form.ruleColumn = ''
|
||||
this.form.ruleColumnComment = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
tableSelectChanged(val) {
|
||||
listDataColumn({ sourceId: this.form.ruleSourceId, tableId: val }).then(response => {
|
||||
if (response.success) {
|
||||
this.columnOptions = response.data
|
||||
const table = this.tableOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleTable = table.tableName
|
||||
this.form.ruleTableComment = table.tableComment
|
||||
this.form.ruleColumnId = ''
|
||||
this.form.ruleColumn = ''
|
||||
this.form.ruleColumnComment = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
columnSelectChanged(val) {
|
||||
const column = this.columnOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleColumn = column.columnName
|
||||
this.form.ruleColumnComment = column.columnComment
|
||||
this.$forceUpdate()
|
||||
},
|
||||
dictTypeSelectChanged(val) {
|
||||
const item = this.dictTypeOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.consistent.gbTypeCode = item.gbTypeCode
|
||||
this.form.ruleConfig.consistent.gbTypeName = item.gbTypeName
|
||||
},
|
||||
relatedTableSelectChanged(val) {
|
||||
listDataColumn({ sourceId: this.form.ruleSourceId, tableId: val }).then(response => {
|
||||
if (response.success) {
|
||||
this.relatedColumnOptions = response.data
|
||||
const table = this.tableOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.relevance.relatedTable = table.tableName
|
||||
this.form.ruleConfig.relevance.relatedTableComment = table.tableComment
|
||||
this.form.ruleConfig.relevance.relatedColumnId = ''
|
||||
this.form.ruleConfig.relevance.relatedColumn = ''
|
||||
this.form.ruleConfig.relevance.relatedColumnComment = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
relatedColumnSelectChanged(val) {
|
||||
const column = this.relatedColumnOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.relevance.relatedColumn = column.columnName
|
||||
this.form.ruleConfig.relevance.relatedColumnComment = column.columnComment
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.loadingOptions.loading = true
|
||||
this.loadingOptions.loadingText = '保存中...'
|
||||
this.loadingOptions.isDisabled = true
|
||||
this.form.ruleTableId = 'all'
|
||||
this.form.ruleTable = '全表'
|
||||
addCheckRule(this.form).then(response => {
|
||||
if (response.success) {
|
||||
this.$message.success('保存成功')
|
||||
setTimeout(() => {
|
||||
// 2秒后跳转列表页
|
||||
this.$emit('showCard', this.showOptions)
|
||||
}, 2000)
|
||||
} else {
|
||||
this.$message.error('保存失败')
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleZzStatusRadioChange(value) {
|
||||
// 在这里执行其他需要的操作
|
||||
if (value === '1') {
|
||||
this.form.ruleConfig.regular.regular = '^[1-9][0-9]{10}$'
|
||||
} else if (value === '2') {
|
||||
this.form.ruleConfig.regular.regular = '^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+$'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,285 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" label-width="80px" disabled>
|
||||
<el-form-item label="规则名称">
|
||||
<el-input v-model="form.ruleName" />
|
||||
</el-form-item>
|
||||
<el-form-item label="核查类型">
|
||||
<el-select v-model="form.ruleItemId">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="规则级别">-->
|
||||
<!-- <el-select v-model="form.ruleLevelId">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in ruleLevelOptions"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.name"-->
|
||||
<!-- :value="item.id"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-form-item label="数据源">
|
||||
<el-select v-model="form.ruleSourceId">
|
||||
<el-option
|
||||
v-for="source in sourceOptions"
|
||||
:key="source.id"
|
||||
:label="source.sourceName"
|
||||
:value="source.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据表">
|
||||
<el-select v-model="form.ruleTableId">
|
||||
<el-option
|
||||
v-for="table in tableOptions"
|
||||
:key="table.id"
|
||||
:label="table.tableName"
|
||||
:value="table.id"
|
||||
>
|
||||
<span style="float: left">{{ table.tableName + '(' + table.tableComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="核查字段">
|
||||
<el-select v-model="form.ruleColumnId">
|
||||
<el-option
|
||||
v-for="column in columnOptions"
|
||||
:key="column.id"
|
||||
:label="column.columnName"
|
||||
:value="column.id"
|
||||
>
|
||||
<span style="float: left">{{ column.columnName + '(' + column.columnComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-divider content-position="left">核查配置</el-divider>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'timeliness_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="判定阀值">
|
||||
<el-input-number v-model="form.ruleConfig.timeliness.threshold" :controls="false" :min="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'consistent_key'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标准字典类别">
|
||||
<el-select v-model="form.ruleConfig.consistent.gbTypeId" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in dictTypeOptions"
|
||||
:key="item.id"
|
||||
:label="item.gbTypeName"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标准字典字段">
|
||||
<el-select v-model="form.ruleConfig.consistent.bindGbColumn" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in gbColumnOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'relevance_key'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="关联表">
|
||||
<el-select v-model="form.ruleConfig.relevance.relatedTableId" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="table in tableOptions"
|
||||
:key="table.id"
|
||||
:label="table.tableName"
|
||||
:value="table.id"
|
||||
>
|
||||
<span style="float: left">{{ table.tableName + '(' + table.tableComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="关联字段">
|
||||
<el-select v-model="form.ruleConfig.relevance.relatedColumnId" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="column in relatedColumnOptions"
|
||||
:key="column.id"
|
||||
:label="column.columnName"
|
||||
:value="column.id"
|
||||
>
|
||||
<span style="float: left">{{ column.columnName + '(' + column.columnComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'accuracy_key_length'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="最大长度">
|
||||
<el-input-number v-model="form.ruleConfig.accuracy.maxLength" :controls="false" :min="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="正则表达">
|
||||
<el-input v-model="form.ruleConfig.regular.regular" placeholder="请输入正则规则" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="状态">
|
||||
<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="备注">
|
||||
<el-input v-model="form.remark" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listRuleLevel, listRuleItem, getCheckRule } from '@/api/quality/checkrule'
|
||||
import { listDataSource } from '@/api/metadata/datasource'
|
||||
import { listDataTable } from '@/api/metadata/datatable'
|
||||
import { listDataColumn } from '@/api/metadata/datacolumn'
|
||||
import { listDataDictType } from '@/api/standard/datadict'
|
||||
|
||||
export default {
|
||||
name: 'CheckRelevanceRuleDetail',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: function() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '核查规则详情',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 规则级别数据字典
|
||||
ruleLevelOptions: [],
|
||||
// 核查类型数据字典
|
||||
ruleItemOptions: [],
|
||||
sourceOptions: [],
|
||||
tableOptions: [],
|
||||
columnOptions: [],
|
||||
dictTypeOptions: [],
|
||||
gbColumnOptions: [
|
||||
{ value: 'gb_code', label: '标准编码' },
|
||||
{ value: 'gb_name', label: '标准名称' }
|
||||
],
|
||||
relatedColumnOptions: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
console.log('id:' + this.data.id)
|
||||
this.getDicts('sys_common_status').then(response => {
|
||||
if (response.success) {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
listDataDictType().then(response => {
|
||||
if (response.success) {
|
||||
this.dictTypeOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getRuleLevelList()
|
||||
this.getDataSourceList()
|
||||
},
|
||||
mounted() {
|
||||
this.getCheckRule(this.data.id)
|
||||
},
|
||||
methods: {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 获取详情 */
|
||||
async getCheckRule(id) {
|
||||
this.form = await getCheckRule(id).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
this.ruleItemOptions = await listRuleItem({ ruleTypeId: this.form.ruleTypeId }).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
this.tableOptions = await listDataTable({ sourceId: this.form.ruleSourceId }).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
}) || []
|
||||
this.columnOptions = await listDataColumn({ sourceId: this.form.ruleSourceId, tableId: this.form.ruleTableId }).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
}) || []
|
||||
if (this.form.ruleConfig.ruleItemCode === 'relevance_key') {
|
||||
listDataColumn({ sourceId: this.form.ruleSourceId, tableId: this.form.ruleConfig.relevance.relatedTableId }).then(response => {
|
||||
if (response.success) {
|
||||
this.relatedColumnOptions = response.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
getRuleLevelList() {
|
||||
listRuleLevel().then(response => {
|
||||
if (response.success) {
|
||||
this.ruleLevelOptions = response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
getDataSourceList() {
|
||||
listDataSource().then(response => {
|
||||
if (response.success) {
|
||||
this.sourceOptions = response.data
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
436
src/views/quality/checkrelevancerule/CheckRelevanceRuleEdit.vue
Normal file
@@ -0,0 +1,436 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ title }}</span>
|
||||
<el-button-group style="float: right;">
|
||||
<el-button v-hasPerm="['quality:rule:edit']" type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="body-wrapper">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="规则名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入规则名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="核查类型" prop="ruleItemId">
|
||||
<el-select v-model="form.ruleItemId" placeholder="请选择核查类型" @change="ruleItemSelectChanged">
|
||||
<el-option
|
||||
v-for="item in ruleItemOptions"
|
||||
:key="item.id"
|
||||
:label="item.itemExplain"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="规则级别" prop="ruleLevelId">-->
|
||||
<!-- <el-select v-model="form.ruleLevelId" placeholder="请选择规则级别">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in ruleLevelOptions"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.name"-->
|
||||
<!-- :value="item.id"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-form-item label="数据源" prop="ruleSourceId">
|
||||
<el-select v-model="form.ruleSourceId" placeholder="请选择数据源" @change="sourceSelectChanged">
|
||||
<el-option
|
||||
v-for="source in sourceOptions"
|
||||
:key="source.id"
|
||||
:label="source.sourceName"
|
||||
:value="source.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据表" prop="ruleTableId">
|
||||
<el-select v-model="form.ruleTableId" placeholder="请选择数据表" @change="tableSelectChanged">
|
||||
<el-option
|
||||
v-for="table in tableOptions"
|
||||
:key="table.id"
|
||||
:label="table.tableName"
|
||||
:value="table.id"
|
||||
>
|
||||
<span style="float: left">{{ table.tableName + '(' + table.tableComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="核查字段" prop="ruleColumnId">
|
||||
<el-select v-model="form.ruleColumnId" placeholder="请选择核查字段" @change="columnSelectChanged">
|
||||
<el-option
|
||||
v-for="column in columnOptions"
|
||||
:key="column.id"
|
||||
:label="column.columnName"
|
||||
:value="column.id"
|
||||
>
|
||||
<span style="float: left">{{ column.columnName + '(' + column.columnComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-divider content-position="left">核查配置</el-divider>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'timeliness_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="判定阀值">
|
||||
<el-input-number v-model="form.ruleConfig.timeliness.threshold" :controls="false" :min="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'consistent_key'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标准字典类别">
|
||||
<el-select v-model="form.ruleConfig.consistent.gbTypeId" placeholder="请选择" @change="dictTypeSelectChanged">
|
||||
<el-option
|
||||
v-for="item in dictTypeOptions"
|
||||
:key="item.id"
|
||||
:label="item.gbTypeName"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标准字典字段">
|
||||
<el-select v-model="form.ruleConfig.consistent.bindGbColumn" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in gbColumnOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'relevance_key'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="关联表">
|
||||
<el-select v-model="form.ruleConfig.relevance.relatedTableId" placeholder="请选择" @change="relatedTableSelectChanged">
|
||||
<el-option
|
||||
v-for="table in tableOptions"
|
||||
:key="table.id"
|
||||
:label="table.tableName"
|
||||
:value="table.id"
|
||||
>
|
||||
<span style="float: left">{{ table.tableName + '(' + table.tableComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="关联字段">
|
||||
<el-select v-model="form.ruleConfig.relevance.relatedColumnId" placeholder="请选择" @change="relatedColumnSelectChanged">
|
||||
<el-option
|
||||
v-for="column in relatedColumnOptions"
|
||||
:key="column.id"
|
||||
:label="column.columnName"
|
||||
:value="column.id"
|
||||
>
|
||||
<span style="float: left">{{ column.columnName + '(' + column.columnComment + ')' }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'accuracy_key_length'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="最大长度">
|
||||
<el-input-number v-model="form.ruleConfig.accuracy.maxLength" :controls="false" :min="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="正则表达">
|
||||
<el-input v-model="form.ruleConfig.regular.regular" placeholder="请输入正则规则" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.ruleConfig.ruleItemCode === 'regular_key'">
|
||||
<el-form-item label="常用正则">
|
||||
<el-radio-group v-model="form.zzStatus" @change="handleZzStatusRadioChange">
|
||||
<el-radio label="1">手机号码</el-radio>
|
||||
<el-radio label="2">邮箱</el-radio>
|
||||
<el-radio label="3">整数</el-radio>
|
||||
<el-radio label="4">负数</el-radio>
|
||||
<el-radio label="5">身份证</el-radio>
|
||||
<el-radio label="6">日期格式yyyy-mm-dd</el-radio>
|
||||
<el-radio label="7">IP</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
<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>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listRuleLevel, listRuleItem, getCheckRule, updateCheckRule } from '@/api/quality/checkrule'
|
||||
import { listDataSource } from '@/api/metadata/datasource'
|
||||
import { listDataTable } from '@/api/metadata/datatable'
|
||||
import { listDataColumn } from '@/api/metadata/datacolumn'
|
||||
import { listDataDictType } from '@/api/standard/datadict'
|
||||
|
||||
export default {
|
||||
name: 'CheckRelevanceRuleEdit',
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: function() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '核查规则编辑',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 保存按钮
|
||||
loadingOptions: {
|
||||
loading: false,
|
||||
loadingText: '保存',
|
||||
isDisabled: false
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
ruleName: [
|
||||
{ required: true, message: '规则名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
ruleItemId: [
|
||||
{ required: true, message: '核查类型不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleSourceId: [
|
||||
{ required: true, message: '数据源不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleTableId: [
|
||||
{ required: true, message: '数据表不能为空', trigger: 'change' }
|
||||
],
|
||||
ruleColumnId: [
|
||||
{ required: true, message: '核查字段不能为空', trigger: 'change' }
|
||||
]
|
||||
},
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 规则级别数据字典
|
||||
ruleLevelOptions: [],
|
||||
// 核查类型数据字典
|
||||
ruleItemOptions: [],
|
||||
sourceOptions: [],
|
||||
tableOptions: [],
|
||||
columnOptions: [],
|
||||
dictTypeOptions: [],
|
||||
gbColumnOptions: [
|
||||
{ value: 'gb_code', label: '标准编码' },
|
||||
{ value: 'gb_name', label: '标准名称' }
|
||||
],
|
||||
relatedColumnOptions: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
console.log('id:' + this.data.id)
|
||||
this.getDicts('sys_common_status').then(response => {
|
||||
if (response.success) {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
listDataDictType().then(response => {
|
||||
if (response.success) {
|
||||
this.dictTypeOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getRuleLevelList()
|
||||
this.getDataSourceList()
|
||||
},
|
||||
mounted() {
|
||||
this.getCheckRule(this.data.id)
|
||||
},
|
||||
methods: {
|
||||
showCard() {
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 获取详情 */
|
||||
async getCheckRule(id) {
|
||||
this.form = await getCheckRule(id).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
this.ruleItemOptions = await listRuleItem({ ruleTypeId: this.form.ruleTypeId }).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
this.tableOptions = await listDataTable({ sourceId: this.form.ruleSourceId }).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
this.columnOptions = await listDataColumn({ sourceId: this.form.ruleSourceId, tableId: this.form.ruleTableId }).then(response => {
|
||||
if (response.success) {
|
||||
return response.data
|
||||
}
|
||||
})
|
||||
if (this.form.ruleConfig.ruleItemCode === 'relevance_key') {
|
||||
listDataColumn({ sourceId: this.form.ruleSourceId, tableId: this.form.ruleConfig.relevance.relatedTableId }).then(response => {
|
||||
if (response.success) {
|
||||
this.relatedColumnOptions = response.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
getRuleLevelList() {
|
||||
listRuleLevel().then(response => {
|
||||
if (response.success) {
|
||||
this.ruleLevelOptions = response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
getDataSourceList() {
|
||||
listDataSource().then(response => {
|
||||
if (response.success) {
|
||||
this.sourceOptions = response.data
|
||||
}
|
||||
})
|
||||
},
|
||||
ruleItemSelectChanged(val) {
|
||||
const item = this.ruleItemOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.ruleItemCode = item.itemCode
|
||||
},
|
||||
sourceSelectChanged(val) {
|
||||
listDataTable({ sourceId: val }).then(response => {
|
||||
if (response.success) {
|
||||
this.tableOptions = response.data
|
||||
this.columnOptions = []
|
||||
const source = this.sourceOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleSource = source.sourceName
|
||||
this.form.ruleDbType = source.dbType
|
||||
this.form.ruleTableId = ''
|
||||
this.form.ruleTable = ''
|
||||
this.form.ruleTableComment = ''
|
||||
this.form.ruleColumnId = ''
|
||||
this.form.ruleColumn = ''
|
||||
this.form.ruleColumnComment = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
tableSelectChanged(val) {
|
||||
listDataColumn({ sourceId: this.form.ruleSourceId, tableId: val }).then(response => {
|
||||
if (response.success) {
|
||||
this.columnOptions = response.data
|
||||
const table = this.tableOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleTable = table.tableName
|
||||
this.form.ruleTableComment = table.tableComment
|
||||
this.form.ruleColumnId = ''
|
||||
this.form.ruleColumn = ''
|
||||
this.form.ruleColumnComment = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
columnSelectChanged(val) {
|
||||
const column = this.columnOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleColumn = column.columnName
|
||||
this.form.ruleColumnComment = column.columnComment
|
||||
this.$forceUpdate()
|
||||
},
|
||||
dictTypeSelectChanged(val) {
|
||||
const item = this.dictTypeOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.consistent.gbTypeCode = item.gbTypeCode
|
||||
this.form.ruleConfig.consistent.gbTypeName = item.gbTypeName
|
||||
},
|
||||
relatedTableSelectChanged(val) {
|
||||
listDataColumn({ sourceId: this.form.ruleSourceId, tableId: val }).then(response => {
|
||||
if (response.success) {
|
||||
this.relatedColumnOptions = response.data
|
||||
const table = this.tableOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.relevance.relatedTable = table.tableName
|
||||
this.form.ruleConfig.relevance.relatedTableComment = table.tableComment
|
||||
this.form.ruleConfig.relevance.relatedColumnId = ''
|
||||
this.form.ruleConfig.relevance.relatedColumn = ''
|
||||
this.form.ruleConfig.relevance.relatedColumnComment = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
relatedColumnSelectChanged(val) {
|
||||
const column = this.relatedColumnOptions.find(function(item) {
|
||||
return item.id === val
|
||||
})
|
||||
this.form.ruleConfig.relevance.relatedColumn = column.columnName
|
||||
this.form.ruleConfig.relevance.relatedColumnComment = column.columnComment
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.loadingOptions.loading = true
|
||||
this.loadingOptions.loadingText = '保存中...'
|
||||
this.loadingOptions.isDisabled = true
|
||||
updateCheckRule(this.form).then(response => {
|
||||
if (response.success) {
|
||||
this.$message.success('保存成功')
|
||||
setTimeout(() => {
|
||||
// 2秒后跳转列表页
|
||||
this.$emit('showCard', this.showOptions)
|
||||
}, 2000)
|
||||
} else {
|
||||
this.$message.error('保存失败')
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loadingOptions.loading = false
|
||||
this.loadingOptions.loadingText = '保存'
|
||||
this.loadingOptions.isDisabled = false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleZzStatusRadioChange(value) {
|
||||
// 在这里执行其他需要的操作
|
||||
if (value === '1') {
|
||||
this.form.ruleConfig.regular.regular = '^[1-9][0-9]{10}$'
|
||||
} else if (value === '2') {
|
||||
this.form.ruleConfig.regular.regular = '^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+$'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 230px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
434
src/views/quality/checkrelevancerule/CheckRelevanceRuleList.vue
Normal file
@@ -0,0 +1,434 @@
|
||||
<template>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6">
|
||||
<el-card class="box-card tree-wrapper" shadow="always">
|
||||
<div class="body-wrapper">
|
||||
<el-tree
|
||||
ref="ruleType"
|
||||
:data="ruleTypeOptions"
|
||||
node-key="id"
|
||||
empty-text="加载中,请稍后"
|
||||
:props="defaultProps"
|
||||
default-expand-all
|
||||
highlight-current
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick"
|
||||
>
|
||||
<template slot-scope="{ node }">
|
||||
<span class="custom-tree-node">
|
||||
<span><i v-if="node.level === 1" class="iconfont icon-zuzhi tree-folder" />{{ node.label }}</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item" @change="handleQuery">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据源" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleSource"
|
||||
placeholder="请输入数据源"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="数据表" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleTable"
|
||||
placeholder="请输入数据表"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="用例名称" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleName"
|
||||
placeholder="请输入用例名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-button-group>
|
||||
</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">
|
||||
<svg-icon class-name="size-icon" icon-class="colum-height" />
|
||||
</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">
|
||||
<svg-icon class-name="size-icon" icon-class="shuaxin" />
|
||||
</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">
|
||||
<svg-icon class-name="size-icon" icon-class="shezhi" />
|
||||
</el-button>
|
||||
</span>
|
||||
</el-popover>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="tableDataList"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:size="tableSize"
|
||||
:height="tableHeight"
|
||||
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"
|
||||
:width="item.width"
|
||||
align="center"
|
||||
show-overflow-tooltip
|
||||
/>
|
||||
</template>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit-outline"
|
||||
@click="handleEdit(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
: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>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listRuleType, pageCheckRule, delCheckRule } from '@/api/quality/checkrule'
|
||||
|
||||
export default {
|
||||
name: 'CheckRelevanceRuleList',
|
||||
data() {
|
||||
return {
|
||||
tableHeight: document.body.offsetHeight - 310 + 'px',
|
||||
// 展示切换
|
||||
showOptions: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
},
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 表格头
|
||||
tableColumns: [
|
||||
{ prop: 'ruleSource', label: '数据源', show: true },
|
||||
/* { prop: 'ruleTable', label: '数据表', show: true, formatter: this.ruleTableFormatter },
|
||||
{ prop: 'ruleColumn', label: '检测字段', show: true, formatter: this.ruleColumnFormatter },*/
|
||||
{ prop: 'ruleName', label: '用例名称', show: true },
|
||||
{ prop: 'ruleType', label: '用例类型', show: true },
|
||||
// { prop: 'ruleLevel', label: '用例级别', width: 100, show: true },
|
||||
{
|
||||
prop: 'status',
|
||||
label: '状态',
|
||||
show: true,
|
||||
width: 80,
|
||||
formatter: this.statusFormatter
|
||||
},
|
||||
{ prop: 'createTime', label: '创建时间', show: true }
|
||||
],
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
tableSize: 'medium',
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 表格数据
|
||||
tableDataList: [],
|
||||
// 总数据条数
|
||||
total: 0,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
ruleTypeId: '',
|
||||
ruleName: '',
|
||||
ruleType: 'gl'
|
||||
},
|
||||
// 左侧树
|
||||
ruleTypeOptions: [],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'name'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDicts('sys_common_status').then(response => {
|
||||
if (response.success) {
|
||||
this.statusOptions = response.data
|
||||
}
|
||||
})
|
||||
this.getTree()
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
this.initCols()
|
||||
},
|
||||
methods: {
|
||||
getTree() {
|
||||
listRuleType().then(response => {
|
||||
if (response.success) {
|
||||
const { data } = response
|
||||
const tree = {}
|
||||
tree.name = '用例类型'
|
||||
const children = []
|
||||
data.forEach(e => {
|
||||
if (e.code === 'relevance') {
|
||||
children.push(e)
|
||||
}
|
||||
})
|
||||
tree.children = children
|
||||
this.ruleTypeOptions = []
|
||||
this.ruleTypeOptions.push(tree)
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 节点单击事件 */
|
||||
handleNodeClick(data) {
|
||||
if (data.id) {
|
||||
this.queryParams.ruleTypeId = data.id
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
/** 查询数据源列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
pageCheckRule(this.queryParams).then(response => {
|
||||
this.loading = false
|
||||
if (response.success) {
|
||||
const { data } = response
|
||||
this.tableDataList = data.data
|
||||
this.total = data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
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
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.queryParams = {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
ruleTypeId: '',
|
||||
ruleName: '',
|
||||
ruleType: 'gl'
|
||||
}
|
||||
this.handleQuery()
|
||||
},
|
||||
/** 刷新列表 */
|
||||
handleRefresh() {
|
||||
this.getList()
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.showOptions.data = {}
|
||||
if (!this.queryParams.ruleTypeId) {
|
||||
this.$message.warning('请先选择核查用例类型')
|
||||
return
|
||||
}
|
||||
this.showOptions.data.ruleTypeId = this.queryParams.ruleTypeId
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showAdd = true
|
||||
this.showOptions.showEdit = false
|
||||
this.showOptions.showDetail = false
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleEdit(row) {
|
||||
this.showOptions.data.id = row.id
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showAdd = false
|
||||
this.showOptions.showEdit = true
|
||||
this.showOptions.showDetail = false
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 详情按钮操作 */
|
||||
handleDetail(row) {
|
||||
this.showOptions.data.id = row.id
|
||||
this.showOptions.showList = false
|
||||
this.showOptions.showAdd = false
|
||||
this.showOptions.showEdit = false
|
||||
this.showOptions.showDetail = true
|
||||
this.$emit('showCard', this.showOptions)
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$confirm('选中数据将被永久删除, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
delCheckRule(row.id).then(response => {
|
||||
if (response.success) {
|
||||
this.$message.success('删除成功')
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
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()
|
||||
},
|
||||
statusFormatter(row, column, cellValue, index) {
|
||||
const dictLabel = this.selectDictLabel(this.statusOptions, cellValue)
|
||||
if (cellValue === '1') {
|
||||
return <el-tag type='success'>{dictLabel}</el-tag>
|
||||
} else {
|
||||
return <el-tag type='warning'>{dictLabel}</el-tag>
|
||||
}
|
||||
},
|
||||
ruleTableFormatter(row, column, cellValue, index) {
|
||||
return row.ruleTableComment ? row.ruleTable + '(' + row.ruleTableComment + ')' : row.ruleTable
|
||||
},
|
||||
ruleColumnFormatter(row, column, cellValue, index) {
|
||||
return row.ruleColumnComment ? row.ruleColumn + '(' + row.ruleColumnComment + ')' : row.ruleColumn
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.right-toolbar {
|
||||
float: right;
|
||||
}
|
||||
.el-card ::v-deep .el-card__body {
|
||||
height: calc(100vh - 100px);
|
||||
}
|
||||
.tree-wrapper {
|
||||
overflow-y: auto;
|
||||
.body-wrapper {
|
||||
margin: -10px;
|
||||
::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>
|
||||
48
src/views/quality/checkrelevancerule/index.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<transition name="el-zoom-in-center">
|
||||
<check-rule-list v-if="options.showList" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-top">
|
||||
<check-rule-add v-if="options.showAdd" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-top">
|
||||
<check-rule-edit v-if="options.showEdit" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
<transition name="el-zoom-in-bottom">
|
||||
<check-rule-detail v-if="options.showDetail" :data="options.data" @showCard="showCard" />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CheckRuleList from './CheckRelevanceRuleList'
|
||||
import CheckRuleAdd from './CheckRelevanceRuleAdd'
|
||||
import CheckRuleEdit from './CheckRelevanceRuleEdit'
|
||||
import CheckRuleDetail from './CheckRelevanceRuleDetail'
|
||||
|
||||
export default {
|
||||
name: 'CheckRelevanceRule',
|
||||
components: { CheckRuleList, CheckRuleAdd, CheckRuleEdit, CheckRuleDetail },
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
data: {},
|
||||
showList: true,
|
||||
showAdd: false,
|
||||
showEdit: false,
|
||||
showDetail: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCard(data) {
|
||||
Object.assign(this.options, data)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
281
src/views/quality/checkreport/CheckReportList.vue
Normal file
@@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="always">
|
||||
<el-form ref="queryForm" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目" prop="projectId">
|
||||
<el-select v-model="queryParams.projectId" clearable size="small" placeholder="项目" class="filter-item" @change="handleQuery">
|
||||
<el-option v-for="item in projectsOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<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 },
|
||||
{ prop: 'checkTimeConsuming', label: '耗时(毫秒)', show: true }
|
||||
],
|
||||
projectsOptions: [
|
||||
{ id: '1111', projectName: '演示项目' }
|
||||
],
|
||||
// 默认选择中表格头
|
||||
checkedTableColumns: [],
|
||||
tableSize: 'medium',
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 数据集表格数据
|
||||
tableDataList: [],
|
||||
// 总数据条数
|
||||
total: 0,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
projectId: '1111',
|
||||
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) {
|
||||
console.log('response',response)
|
||||
const { data } = response
|
||||
this.tableDataList = data.data
|
||||
this.total = data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
handleReport(row) {
|
||||
this.showOptions.data = row
|
||||
this.showOptions.showList = false
|
||||
if (row.checkReportType === 'relevance') {
|
||||
// 关联符合性
|
||||
this.showOptions.showDetail_relevance = true
|
||||
} else if (row.checkReportType === 'content') {
|
||||
// 内容符合性
|
||||
this.showOptions.showDetail_content = true
|
||||
} else {
|
||||
// 结构符合性
|
||||
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 if (cellValue === 'content') {
|
||||
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>
|
||||
500
src/views/quality/checkreport/CheckReportStructure.vue
Normal file
@@ -0,0 +1,500 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="hasTagsView">
|
||||
<div class="app-main">
|
||||
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<div style="float: right;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-download" @click="exportWord">导出</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</div>
|
||||
</div><!--header-->
|
||||
|
||||
|
||||
|
||||
<h4 class="ftitle">结构符合性检测结果报告</h4><!--ftitle 一级标题-->
|
||||
|
||||
<div class="stitle">检测指标统计分析</div><!--stitle 二级标题-->
|
||||
<div class="test-list">
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon1.svg"><span class="tit">检测表总数</span></div>
|
||||
<!-- <div class="figure">{{ data.checkTotalCount_new }}</div>-->
|
||||
<div class="figure" >{{ checkTotalCount_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon2.svg"><span class="tit">检测总耗时(毫秒)</span></div>
|
||||
<!-- <div class="figure">{{ data.checkTimeConsuming_new }}</div>-->
|
||||
<div class="figure">{{ checkTimeConsuming_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon3.svg"><span class="tit">不合规总数</span></div>
|
||||
<!-- <div class="figure">{{ data.checkErrorCount_new }}</div>-->
|
||||
<div class="figure">{{ checkErrorCount_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon4.svg"><span class="tit">不合规率</span></div>
|
||||
<div class="figure">{{ (checkErrorCount_new / checkTotalCount_new * 100).toFixed(2) + '%' }}</div>
|
||||
<!-- <div class="figure">{{ data.checkTotalCount_new }}</div>-->
|
||||
|
||||
</div>
|
||||
</div><!--test-list-->
|
||||
|
||||
<div class="stitle">不合规统计分析</div><!--stitle 二级标题-->
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<div class="ttitle">按数据源统计不合规数量</div><!--ttitle 三级标题-->
|
||||
<el-table :data="reportTableData1" border style="width: 100%" class="btable"><!--加上btable-->
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="ruleLevelName" label="数据源版本" align="center" />
|
||||
<el-table-column prop="tableSum" label="检测表数" align="center" />
|
||||
<el-table-column prop="tableTime" 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="12">
|
||||
<div class="ttitle">按用例类型统计不合规数量</div><!--ttitle 三级标题-->
|
||||
<el-table :data="reportTableData2" border style="width: 100%" class="btable"><!--加上btable-->
|
||||
<!-- <el-table-column prop="ta1" label="数据源">数据平台</el-table-column>-->
|
||||
<el-table-column prop="ruleName" label="用例类型"></el-table-column>
|
||||
<el-table-column prop="checkErrorCount" label="不合规数">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div class="stitle">用例类型统计分析</div><!--stitle 二级标题-->
|
||||
|
||||
<div class="dbox">
|
||||
<div class="ttitle">表字段标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="table_key" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_table_key" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueTableName" label="实际表名" align="center" />
|
||||
<el-table-column prop="standardTableName" label="标准表名" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
<div class="dbox">
|
||||
<div class="ttitle">长度标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="length_key" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_length_key" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardLength" label="标准长度" align="center" />
|
||||
<el-table-column prop="trueLength" label="实际长度" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
<div class="dbox">
|
||||
<div class="ttitle">空值标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="null_key" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_null_key" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardNull" label="标准字段是否空值" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="trueNull" label="实际字段是否空值" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
<div class="dbox">
|
||||
<div class="ttitle">主键标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="pk_key" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_pk_key" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardPk" label="标准字段是否主键" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="truePk" label="实际字段是否主键" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
|
||||
<div class="dbox">
|
||||
<div class="ttitle">外键标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="fk_key" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_fk_key" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardFk" label="标准字段是否外键" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="trueFk" label="实际字段是否外键" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
|
||||
</el-card><!--el-card-->
|
||||
|
||||
</div><!--app-main-->
|
||||
</div><!--hasTagsView-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getReportBySource, getReportByType, getReportDetail } from '@/api/quality/checkreport'
|
||||
import moment from 'moment'
|
||||
import dataJson from './Data.json'
|
||||
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: [],
|
||||
|
||||
// 表字段标准检测
|
||||
table_key: [],
|
||||
no_table_key: [],
|
||||
// 长度标准检测
|
||||
length_key: [],
|
||||
no_length_key: [],
|
||||
// 空值标准检测
|
||||
null_key: [],
|
||||
no_null_key: [],
|
||||
// 主键标准检测
|
||||
pk_key: [],
|
||||
no_pk_key: [],
|
||||
// 外键标准检测
|
||||
fk_key: [],
|
||||
no_fk_key: [],
|
||||
// 完整性标准检测
|
||||
integrity: [],
|
||||
no_integrity: [],
|
||||
// 准确性标准检测
|
||||
accuracy: [],
|
||||
no_accuracy: [],
|
||||
// 一致性标准检测
|
||||
consistent: [],
|
||||
no_consistent: [],
|
||||
// 正则表达式标准检测
|
||||
regular: [],
|
||||
no_regular: [],
|
||||
// 检测表总数
|
||||
checkTotalCount: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming: null,
|
||||
// 不合规总数
|
||||
checkErrorCount: null,
|
||||
|
||||
// 检测表总数
|
||||
checkTotalCount_new: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming_new: null,
|
||||
// 不合规总数
|
||||
checkErrorCount_new: null,
|
||||
|
||||
like: true,
|
||||
value1: 4154.564,
|
||||
totalTables: 1314,
|
||||
title: '增长人数'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.queryParams.checkDate = moment(this.data.checkDate).format('YYYY-MM-DD')
|
||||
this.handleQuery()
|
||||
},
|
||||
mounted () {
|
||||
// 表字段标准检测
|
||||
this.table_key = dataJson.caseType.table_key
|
||||
this.no_table_key = dataJson.caseType.no_table_key
|
||||
// 长度标准检测
|
||||
this.length_key = dataJson.caseType.length_key
|
||||
this.no_length_key = dataJson.caseType.no_length_key
|
||||
// 空值标准检测
|
||||
this.null_key = dataJson.caseType.null_key
|
||||
this.no_null_key = dataJson.caseType.no_null_key
|
||||
// 主键标准检测
|
||||
this.pk_key = dataJson.caseType.pk_key
|
||||
this.no_pk_key = dataJson.caseType.no_pk_key
|
||||
// 外键标准检测
|
||||
this.fk_key = dataJson.caseType.fk_key
|
||||
this.no_fk_key = dataJson.caseType.no_fk_key
|
||||
// 完整性标准检测
|
||||
this.integrity = dataJson.caseType.integrity
|
||||
this.no_integrity = dataJson.caseType.no_integrity
|
||||
// 准确性标准检测
|
||||
this.accuracy = dataJson.caseType.accuracy
|
||||
this.no_accuracy = dataJson.caseType.no_accuracy
|
||||
// 一致性标准检测
|
||||
this.consistent = dataJson.caseType.consistent
|
||||
this.no_consistent = dataJson.caseType.no_consistent
|
||||
// 正则表达式标准检测
|
||||
this.regular = dataJson.caseType.regular
|
||||
this.no_regular = dataJson.caseType.no_regular
|
||||
|
||||
// 初始化按数据源统计不合规数量
|
||||
this.spanArr1 = []
|
||||
this.spanArr2 = []
|
||||
this.reportTableData1 = dataJson.dataReport.reportTableData1
|
||||
this.reportTableData2 = dataJson.dataReport.reportTableData2
|
||||
this.rowspan1()
|
||||
this.rowspan2()
|
||||
|
||||
this.checkTotalCount_new = dataJson.checkTotalCount
|
||||
this.checkTimeConsuming_new = dataJson.checkTimeConsuming
|
||||
this.checkErrorCount_new = dataJson.checkErrorCount
|
||||
},
|
||||
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
|
||||
// console.log('reportTableData1==', this.reportTableData1)
|
||||
// this.rowspan1()
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// getReportData2() {
|
||||
// getReportByType({ checkDate: this.queryParams.checkDate }).then(response => {
|
||||
// if (response.success) {
|
||||
// this.reportTableData2 = response.data
|
||||
// console.log('this.reportTableData2===', this.reportTableData2)
|
||||
// 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
|
||||
}
|
||||
})
|
||||
},
|
||||
exportWord() {
|
||||
const filePath = './static/your-word-document.docx'
|
||||
const link = document.createElement('a')
|
||||
link.href = filePath
|
||||
link.download = '测结果报告.docx'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||
435
src/views/quality/checkreport/CheckReportStructure_bak.vue
Normal 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>
|
||||
750
src/views/quality/checkreport/CheckReportStructure_bak1.vue
Normal file
@@ -0,0 +1,750 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card class="box-card" shadow="always">
|
||||
<div slot="header" class="clearfix">
|
||||
<div style="float: right;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-download" @click="exportWord">导出</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</div>
|
||||
|
||||
</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="table_key"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_table_key"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueTableName" label="实际表名" align="center" />
|
||||
<el-table-column prop="standardTableName" label="标准表名" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>长度标准检测</h5>
|
||||
<el-table
|
||||
:data="length_key"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_length_key"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardLength" label="标准长度" align="center" />
|
||||
<el-table-column prop="trueLength" label="实际长度" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>空值标准检测</h5>
|
||||
<el-table
|
||||
:data="null_key"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_null_key"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardNull" label="标准字段是否空值" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="trueNull" label="实际字段是否空值" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>主键标准检测</h5>
|
||||
<el-table
|
||||
:data="pk_key"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_pk_key"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardPk" label="标准字段是否主键" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="truePk" label="实际字段是否主键" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>外键标准检测</h5>
|
||||
<el-table
|
||||
:data="fk_key"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_fk_key"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardFk" label="标准字段是否外键" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="trueFk" label="实际字段是否外键" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>完整性标准检测</h5>
|
||||
<el-table
|
||||
:data="integrity"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_integrity"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>准确性标准检测</h5>
|
||||
<el-table
|
||||
:data="accuracy"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_accuracy"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>一致性标准检测</h5>
|
||||
<el-table
|
||||
:data="consistent"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_consistent"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<h5>正则表达式标准检测</h5>
|
||||
<el-table
|
||||
:data="regular"
|
||||
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="version" label="版本" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse accordion>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
<i class="el-icon-document"></i> 不合规明细
|
||||
</template>
|
||||
<el-table
|
||||
:data="no_regular"
|
||||
border
|
||||
tooltip-effect="dark"
|
||||
:max-height="250"
|
||||
style="width: 100%; margin: 15px 0;"
|
||||
>
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="dataColumn" label="字段值" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getReportBySource, getReportByType, getReportDetail } from '@/api/quality/checkreport'
|
||||
import moment from 'moment'
|
||||
import dataJson from './Data.json'
|
||||
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: [],
|
||||
|
||||
// 表字段标准检测
|
||||
table_key: [],
|
||||
no_table_key: [],
|
||||
// 长度标准检测
|
||||
length_key: [],
|
||||
no_length_key: [],
|
||||
// 空值标准检测
|
||||
null_key: [],
|
||||
no_null_key: [],
|
||||
// 主键标准检测
|
||||
pk_key: [],
|
||||
no_pk_key: [],
|
||||
// 外键标准检测
|
||||
fk_key: [],
|
||||
no_fk_key: [],
|
||||
// 完整性标准检测
|
||||
integrity: [],
|
||||
no_integrity: [],
|
||||
// 准确性标准检测
|
||||
accuracy: [],
|
||||
no_accuracy: [],
|
||||
// 一致性标准检测
|
||||
consistent: [],
|
||||
no_consistent: [],
|
||||
// 正则表达式标准检测
|
||||
regular: [],
|
||||
no_regular: [],
|
||||
// 检测表总数
|
||||
checkTotalCount: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming: null,
|
||||
// 不合规总数
|
||||
checkErrorCount: null,
|
||||
|
||||
like: true,
|
||||
value1: 4154.564,
|
||||
totalTables: 1314,
|
||||
title: '增长人数'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.queryParams.checkDate = moment(this.data.checkDate).format('YYYY-MM-DD')
|
||||
this.handleQuery()
|
||||
},
|
||||
mounted () {
|
||||
// 表字段标准检测
|
||||
this.table_key = dataJson.caseType.table_key
|
||||
this.no_table_key = dataJson.caseType.no_table_key
|
||||
// 长度标准检测
|
||||
this.length_key = dataJson.caseType.length_key
|
||||
this.no_length_key = dataJson.caseType.no_length_key
|
||||
// 空值标准检测
|
||||
this.null_key = dataJson.caseType.null_key
|
||||
this.no_null_key = dataJson.caseType.no_null_key
|
||||
// 主键标准检测
|
||||
this.pk_key = dataJson.caseType.pk_key
|
||||
this.no_pk_key = dataJson.caseType.no_pk_key
|
||||
// 外键标准检测
|
||||
this.fk_key = dataJson.caseType.fk_key
|
||||
this.no_fk_key = dataJson.caseType.no_fk_key
|
||||
// 完整性标准检测
|
||||
this.integrity = dataJson.caseType.integrity
|
||||
this.no_integrity = dataJson.caseType.no_integrity
|
||||
// 准确性标准检测
|
||||
this.accuracy = dataJson.caseType.accuracy
|
||||
this.no_accuracy = dataJson.caseType.no_accuracy
|
||||
// 一致性标准检测
|
||||
this.consistent = dataJson.caseType.consistent
|
||||
this.no_consistent = dataJson.caseType.no_consistent
|
||||
// 正则表达式标准检测
|
||||
this.regular = dataJson.caseType.regular
|
||||
this.no_regular = dataJson.caseType.no_regular
|
||||
|
||||
// 初始化按数据源统计不合规数量
|
||||
this.spanArr1 = []
|
||||
this.spanArr2 = []
|
||||
this.reportTableData1 = dataJson.dataReport.reportTableData1
|
||||
this.reportTableData2 = dataJson.dataReport.reportTableData2
|
||||
this.rowspan1()
|
||||
this.rowspan2()
|
||||
},
|
||||
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
|
||||
// console.log('reportTableData1==', this.reportTableData1)
|
||||
// this.rowspan1()
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// getReportData2() {
|
||||
// getReportByType({ checkDate: this.queryParams.checkDate }).then(response => {
|
||||
// if (response.success) {
|
||||
// this.reportTableData2 = response.data
|
||||
// console.log('this.reportTableData2===', this.reportTableData2)
|
||||
// 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
|
||||
}
|
||||
})
|
||||
},
|
||||
exportWord() {
|
||||
const filePath = './static/your-word-document.docx'
|
||||
const link = document.createElement('a')
|
||||
link.href = filePath
|
||||
link.download = '测结果报告.docx'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||
465
src/views/quality/checkreport/CheckReportStructure_content.vue
Normal file
@@ -0,0 +1,465 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="hasTagsView">
|
||||
<div class="app-main">
|
||||
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<div style="float: right;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-download" @click="exportWord">导出</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</div>
|
||||
</div><!--header-->
|
||||
<h4 class="ftitle">内容符合性检测结果报告</h4><!--ftitle 一级标题-->
|
||||
|
||||
<div class="stitle">检测指标统计分析</div><!--stitle 二级标题-->
|
||||
<div class="test-list">
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon1.svg"><span class="tit">检测内容条数</span></div>
|
||||
<!-- <div class="figure">{{ data.checkTotalCount_new }}</div>-->
|
||||
<div class="figure" >{{ checkTotalCount_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon2.svg"><span class="tit">检测总耗时(毫秒)</span></div>
|
||||
<!-- <div class="figure">{{ data.checkTimeConsuming_new }}</div>-->
|
||||
<div class="figure">{{ checkTimeConsuming_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon3.svg"><span class="tit">不合规总数</span></div>
|
||||
<!-- <div class="figure">{{ data.checkErrorCount_new }}</div>-->
|
||||
<div class="figure">{{ checkErrorCount_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon4.svg"><span class="tit">不合规率</span></div>
|
||||
<div class="figure">{{ (checkErrorCount_new / checkTotalCount_new * 100).toFixed(2) + '%' }}</div>
|
||||
<!-- <div class="figure">{{ data.checkTotalCount_new }}</div>-->
|
||||
|
||||
</div>
|
||||
</div><!--test-list-->
|
||||
|
||||
<div class="stitle">不合规统计分析</div><!--stitle 二级标题-->
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<div class="ttitle">按数据源统计不合规数量</div><!--ttitle 三级标题-->
|
||||
<el-table :data="reportTableData1" border style="width: 100%" class="btable"><!--加上btable-->
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="ruleLevelName" label="数据源版本" align="center" />
|
||||
<el-table-column prop="tableSum" label="检测条数" align="center" />
|
||||
<el-table-column prop="tableTime" 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="12">
|
||||
<div class="ttitle">按用例类型统计不合规数量</div><!--ttitle 三级标题-->
|
||||
<el-table :data="reportTableData2" border style="width: 100%" class="btable"><!--加上btable-->
|
||||
<!-- <el-table-column prop="ta1" label="数据源">数据平台</el-table-column>-->
|
||||
<el-table-column prop="ruleName" label="用例类型"></el-table-column>
|
||||
<el-table-column prop="checkErrorCount" label="不合规数">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div class="stitle">用例类型统计分析</div><!--stitle 二级标题-->
|
||||
<div class="dbox" >
|
||||
<div class="ttitle">完整性标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="integrity" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalTime" label="耗时(毫秒)" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_integrity" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="tableErrorCount" label="不合规数" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
<div class="dbox" >
|
||||
<div class="ttitle">准确性标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="accuracy" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalTime" label="耗时(毫秒)" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_accuracy" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="tableErrorCount" label="不合规数" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
<div class="dbox" >
|
||||
<div class="ttitle">一致性标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="consistent" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalTime" label="耗时(毫秒)" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_consistent" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="tableErrorCount" label="不合规数" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
<div class="dbox" >
|
||||
<div class="ttitle">正则表达式标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="regular" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalTime" label="耗时(毫秒)" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_regular" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="trueColumn" label="字段名称" align="center" />
|
||||
<el-table-column prop="tableErrorCount" label="不合规数" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
|
||||
</el-card><!--el-card-->
|
||||
|
||||
</div><!--app-main-->
|
||||
</div><!--hasTagsView-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { getReportBySource, getReportByType, C } from '@/api/quality/checkreport'
|
||||
import moment from 'moment'
|
||||
import dataJson from './Data_content.json'
|
||||
export default {
|
||||
name: 'CheckReportStructureontent',
|
||||
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_content: false
|
||||
},
|
||||
spanArr1: [],
|
||||
position1: 0,
|
||||
reportTableData1: [],
|
||||
spanArr2: [],
|
||||
position2: 0,
|
||||
reportTableData2: [],
|
||||
// 唯一性核查数据
|
||||
uniqueTableData: [],
|
||||
// 完整性核查数据
|
||||
integrityTableData: [],
|
||||
// 准确性核查数据
|
||||
accuracyTableData: [],
|
||||
// 一致性核查数据
|
||||
consistentTableData: [],
|
||||
// 关联性核查数据
|
||||
relevanceTableData: [],
|
||||
// 及时性核查数据
|
||||
timelinessTableData: [],
|
||||
|
||||
// 表字段标准检测
|
||||
table_key: [],
|
||||
no_table_key: [],
|
||||
// 长度标准检测
|
||||
length_key: [],
|
||||
no_length_key: [],
|
||||
// 空值标准检测
|
||||
null_key: [],
|
||||
no_null_key: [],
|
||||
// 主键标准检测
|
||||
pk_key: [],
|
||||
no_pk_key: [],
|
||||
// 外键标准检测
|
||||
fk_key: [],
|
||||
no_fk_key: [],
|
||||
// 完整性标准检测
|
||||
integrity: [],
|
||||
no_integrity: [],
|
||||
// 准确性标准检测
|
||||
accuracy: [],
|
||||
no_accuracy: [],
|
||||
// 一致性标准检测
|
||||
consistent: [],
|
||||
no_consistent: [],
|
||||
// 正则表达式标准检测
|
||||
regular: [],
|
||||
no_regular: [],
|
||||
// 检测表总数
|
||||
checkTotalCount: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming: null,
|
||||
// 不合规总数
|
||||
checkErrorCount: null,
|
||||
|
||||
// 检测表总数
|
||||
checkTotalCount_new: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming_new: null,
|
||||
// 不合规总数
|
||||
checkErrorCount_new: null,
|
||||
|
||||
like: true,
|
||||
value1: 4154.564,
|
||||
totalTables: 1314,
|
||||
title: '增长人数'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.queryParams.checkDate = moment(this.data.checkDate).format('YYYY-MM-DD')
|
||||
this.handleQuery()
|
||||
},
|
||||
mounted () {
|
||||
// 表字段标准检测
|
||||
this.table_key = dataJson.caseType.table_key
|
||||
this.no_table_key = dataJson.caseType.no_table_key
|
||||
// 长度标准检测
|
||||
this.length_key = dataJson.caseType.length_key
|
||||
this.no_length_key = dataJson.caseType.no_length_key
|
||||
// 空值标准检测
|
||||
this.null_key = dataJson.caseType.null_key
|
||||
this.no_null_key = dataJson.caseType.no_null_key
|
||||
// 主键标准检测
|
||||
this.pk_key = dataJson.caseType.pk_key
|
||||
this.no_pk_key = dataJson.caseType.no_pk_key
|
||||
// 外键标准检测
|
||||
this.fk_key = dataJson.caseType.fk_key
|
||||
this.no_fk_key = dataJson.caseType.no_fk_key
|
||||
// 完整性标准检测
|
||||
this.integrity = dataJson.caseType.integrity
|
||||
this.no_integrity = dataJson.caseType.no_integrity
|
||||
// 准确性标准检测
|
||||
this.accuracy = dataJson.caseType.accuracy
|
||||
this.no_accuracy = dataJson.caseType.no_accuracy
|
||||
// 一致性标准检测
|
||||
this.consistent = dataJson.caseType.consistent
|
||||
this.no_consistent = dataJson.caseType.no_consistent
|
||||
// 正则表达式标准检测
|
||||
this.regular = dataJson.caseType.regular
|
||||
this.no_regular = dataJson.caseType.no_regular
|
||||
|
||||
// 初始化按数据源统计不合规数量
|
||||
this.spanArr1 = []
|
||||
this.spanArr2 = []
|
||||
this.reportTableData1 = dataJson.dataReport.reportTableData1
|
||||
this.reportTableData2 = dataJson.dataReport.reportTableData2
|
||||
this.rowspan1()
|
||||
this.rowspan2()
|
||||
|
||||
this.checkTotalCount_new = dataJson.checkTotalCount
|
||||
this.checkTimeConsuming_new = dataJson.checkTimeConsuming
|
||||
this.checkErrorCount_new = dataJson.checkErrorCount
|
||||
},
|
||||
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
|
||||
// console.log('reportTableData1==', this.reportTableData1)
|
||||
// this.rowspan1()
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// getReportData2() {
|
||||
// getReportByType({ checkDate: this.queryParams.checkDate }).then(response => {
|
||||
// if (response.success) {
|
||||
// this.reportTableData2 = response.data
|
||||
// console.log('this.reportTableData2===', this.reportTableData2)
|
||||
// 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
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
exportWord() {
|
||||
const filePath = './static/your-word-document.docx'
|
||||
const link = document.createElement('a')
|
||||
link.href = filePath
|
||||
link.download = '测结果报告.docx'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||
402
src/views/quality/checkreport/CheckReportStructure_relevance.vue
Normal file
@@ -0,0 +1,402 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="hasTagsView">
|
||||
<div class="app-main">
|
||||
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<div style="float: right;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-download" @click="exportWord">导出</el-button>
|
||||
<el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
|
||||
</div>
|
||||
</div><!--header-->
|
||||
|
||||
|
||||
|
||||
<h4 class="ftitle">关联符合性检测结果报告</h4><!--ftitle 一级标题-->
|
||||
|
||||
<div class="stitle">检测指标统计分析</div><!--stitle 二级标题-->
|
||||
<div class="test-list">
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon1.svg"><span class="tit">检测表总数</span></div>
|
||||
<!-- <div class="figure">{{ data.checkTotalCount_new }}</div>-->
|
||||
<div class="figure" >{{ checkTotalCount_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon2.svg"><span class="tit">检测总耗时(毫秒)</span></div>
|
||||
<!-- <div class="figure">{{ data.checkTimeConsuming_new }}</div>-->
|
||||
<div class="figure">{{ checkTimeConsuming_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon3.svg"><span class="tit">不合规总数</span></div>
|
||||
<!-- <div class="figure">{{ data.checkErrorCount_new }}</div>-->
|
||||
<div class="figure">{{ checkErrorCount_new }}</div>
|
||||
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title"><img src="../../../assets/images/j-icon4.svg"><span class="tit">不合规率</span></div>
|
||||
<div class="figure">{{ (checkErrorCount_new / checkTotalCount_new * 100).toFixed(2) + '%' }}</div>
|
||||
<!-- <div class="figure">{{ data.checkTotalCount_new }}</div>-->
|
||||
|
||||
</div>
|
||||
</div><!--test-list-->
|
||||
|
||||
<div class="stitle">不合规统计分析</div><!--stitle 二级标题-->
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<div class="ttitle">按数据源统计不合规数量</div><!--ttitle 三级标题-->
|
||||
<el-table :data="reportTableData1" border style="width: 100%" class="btable"><!--加上btable-->
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="ruleLevelName" label="数据源版本" align="center" />
|
||||
<el-table-column prop="tableSum" label="检测表数" align="center" />
|
||||
<el-table-column prop="tableTime" 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="12">
|
||||
<div class="ttitle">按用例类型统计不合规数量</div><!--ttitle 三级标题-->
|
||||
<el-table :data="reportTableData2" border style="width: 100%" class="btable"><!--加上btable-->
|
||||
<!-- <el-table-column prop="ta1" label="数据源">数据平台</el-table-column>-->
|
||||
<el-table-column prop="ruleName" label="用例类型"></el-table-column>
|
||||
<el-table-column prop="checkErrorCount" label="不合规数">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div class="stitle">用例类型统计分析</div><!--stitle 二级标题-->
|
||||
<div class="dbox">
|
||||
<div class="ttitle">关联性标准检测用例</div><!--ttitle 三级标题-->
|
||||
<el-table :data="relevancData" border style="width: 100%">
|
||||
<el-table-column prop="ruleName" label="用例名称" align="center" />
|
||||
<el-table-column prop="ruleSourceName" label="数据源" align="center" />
|
||||
<el-table-column prop="version" label="数据源版本" align="center" />
|
||||
<el-table-column prop="checkTotalTime" label="耗时(毫秒)" align="center" />
|
||||
<el-table-column prop="checkTotalCount" label="检测数" align="center" />
|
||||
<el-table-column prop="checkErrorCount" label="不合规数" align="center" />
|
||||
</el-table>
|
||||
<el-collapse @change="handleChange" class="ncoll"><!--加上ncoll-->
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title"><span class="tit">不合规明细</span></template>
|
||||
<el-table :data="no_relevancData" border style="width: 100%">
|
||||
<el-table-column prop="caseName" label="用例名称" align="center" />
|
||||
<el-table-column prop="source" label="数据源" align="center" />
|
||||
<el-table-column prop="tableName" label="数据表" align="center" />
|
||||
<el-table-column prop="standardColumn" label="标准字段" align="center" />
|
||||
<el-table-column prop="standardPk" label="标准字段是否主键" align="center" />
|
||||
<el-table-column prop="standardFk" label="标准字段是否外键" align="center" />
|
||||
<el-table-column prop="trueColumn" label="实际字段" align="center" />
|
||||
<el-table-column prop="truePk" label="实际字段是否主键" align="center" />
|
||||
<el-table-column prop="trueFk" label="实际字段是否外键" align="center" />
|
||||
<el-table-column prop="notDetail" label="不合规原因" align="center" width="200px" />
|
||||
</el-table>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div><!--dbox-->
|
||||
</el-card><!--el-card-->
|
||||
|
||||
</div><!--app-main-->
|
||||
</div><!--hasTagsView-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { getReportBySource, getReportByType, getReportDetail } from '@/api/quality/checkreport'
|
||||
import moment from 'moment'
|
||||
import dataJson from './Data_relevance.json'
|
||||
export default {
|
||||
name: 'CheckReportStructureRelevance',
|
||||
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_relevance: false
|
||||
},
|
||||
spanArr1: [],
|
||||
position1: 0,
|
||||
reportTableData1: [],
|
||||
spanArr2: [],
|
||||
position2: 0,
|
||||
reportTableData2: [],
|
||||
// 唯一性核查数据
|
||||
uniqueTableData: [],
|
||||
// 完整性核查数据
|
||||
integrityTableData: [],
|
||||
// 准确性核查数据
|
||||
accuracyTableData: [],
|
||||
// 一致性核查数据
|
||||
consistentTableData: [],
|
||||
// 关联性核查数据
|
||||
relevanceTableData: [],
|
||||
// 及时性核查数据
|
||||
timelinessTableData: [],
|
||||
|
||||
// 表字段标准检测
|
||||
table_key: [],
|
||||
no_table_key: [],
|
||||
// 长度标准检测
|
||||
length_key: [],
|
||||
no_length_key: [],
|
||||
// 空值标准检测
|
||||
null_key: [],
|
||||
no_null_key: [],
|
||||
// 主键标准检测
|
||||
pk_key: [],
|
||||
no_pk_key: [],
|
||||
// 外键标准检测
|
||||
fk_key: [],
|
||||
no_fk_key: [],
|
||||
// 完整性标准检测
|
||||
integrity: [],
|
||||
no_integrity: [],
|
||||
// 准确性标准检测
|
||||
accuracy: [],
|
||||
no_accuracy: [],
|
||||
// 一致性标准检测
|
||||
consistent: [],
|
||||
no_consistent: [],
|
||||
// 正则表达式标准检测
|
||||
regular: [],
|
||||
no_regular: [],
|
||||
// 关联符合性校验
|
||||
relevancData: [],
|
||||
no_relevanceData: [],
|
||||
// 检测表总数
|
||||
checkTotalCount: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming: null,
|
||||
// 不合规总数
|
||||
checkErrorCount: null,
|
||||
|
||||
// 检测表总数
|
||||
checkTotalCount_new: null,
|
||||
// 检测总耗时
|
||||
checkTimeConsuming_new: null,
|
||||
// 不合规总数
|
||||
checkErrorCount_new: null,
|
||||
|
||||
like: true,
|
||||
value1: 4154.564,
|
||||
totalTables: 1314,
|
||||
title: '增长人数'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.queryParams.checkDate = moment(this.data.checkDate).format('YYYY-MM-DD')
|
||||
this.handleQuery()
|
||||
},
|
||||
mounted () {
|
||||
// 表字段标准检测
|
||||
this.table_key = dataJson.caseType.table_key
|
||||
this.no_table_key = dataJson.caseType.no_table_key
|
||||
// 长度标准检测
|
||||
this.length_key = dataJson.caseType.length_key
|
||||
this.no_length_key = dataJson.caseType.no_length_key
|
||||
// 空值标准检测
|
||||
this.null_key = dataJson.caseType.null_key
|
||||
this.no_null_key = dataJson.caseType.no_null_key
|
||||
// 主键标准检测
|
||||
this.pk_key = dataJson.caseType.pk_key
|
||||
this.no_pk_key = dataJson.caseType.no_pk_key
|
||||
// 外键标准检测
|
||||
this.fk_key = dataJson.caseType.fk_key
|
||||
this.no_fk_key = dataJson.caseType.no_fk_key
|
||||
// 完整性标准检测
|
||||
this.integrity = dataJson.caseType.integrity
|
||||
this.no_integrity = dataJson.caseType.no_integrity
|
||||
// 准确性标准检测
|
||||
this.accuracy = dataJson.caseType.accuracy
|
||||
this.no_accuracy = dataJson.caseType.no_accuracy
|
||||
// 一致性标准检测
|
||||
this.consistent = dataJson.caseType.consistent
|
||||
this.no_consistent = dataJson.caseType.no_consistent
|
||||
// 正则表达式标准检测
|
||||
this.regular = dataJson.caseType.regular
|
||||
this.no_regular = dataJson.caseType.no_regular
|
||||
|
||||
this.relevancData = dataJson.caseType.relevancData
|
||||
this.no_relevancData = dataJson.caseType.no_relevancData
|
||||
|
||||
// 初始化按数据源统计不合规数量
|
||||
this.spanArr1 = []
|
||||
this.spanArr2 = []
|
||||
this.reportTableData1 = dataJson.dataReport.reportTableData1
|
||||
this.reportTableData2 = dataJson.dataReport.reportTableData2
|
||||
this.rowspan1()
|
||||
this.rowspan2()
|
||||
|
||||
this.checkTotalCount_new = dataJson.checkTotalCount
|
||||
this.checkTimeConsuming_new = dataJson.checkTimeConsuming
|
||||
this.checkErrorCount_new = dataJson.checkErrorCount
|
||||
},
|
||||
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
|
||||
// console.log('reportTableData1==', this.reportTableData1)
|
||||
// this.rowspan1()
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// getReportData2() {
|
||||
// getReportByType({ checkDate: this.queryParams.checkDate }).then(response => {
|
||||
// if (response.success) {
|
||||
// this.reportTableData2 = response.data
|
||||
// console.log('this.reportTableData2===', this.reportTableData2)
|
||||
// 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
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
exportWord() {
|
||||
const filePath = './static/your-word-document.docx'
|
||||
const link = document.createElement('a')
|
||||
link.href = filePath
|
||||
link.download = '测结果报告.docx'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||