Compare commits
2 Commits
5c46a17b05
...
197073ab4c
| Author | SHA1 | Date |
|---|---|---|
|
|
197073ab4c | |
|
|
3155c09dc9 |
|
|
@ -60,11 +60,12 @@
|
|||
<right-toolbar :showSearch.sync="showSearch" @queryTable="handleQuery"></right-toolbar>
|
||||
</el-row>
|
||||
<el-table :data="realDate.data">
|
||||
<el-table-column v-for="item in realDate.header"
|
||||
:label="item"
|
||||
<el-table-column v-for="(item,index) in realDate.header"
|
||||
:label="item.label"
|
||||
align="center"
|
||||
:key="item"
|
||||
:prop="item"/>
|
||||
:key="index"
|
||||
:prop="item.prop"
|
||||
/>
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
|
|
@ -111,7 +112,9 @@ export default {
|
|||
created() {
|
||||
this.dataId = this.$route.fullPath.split("/")[3]
|
||||
RealInfo(this.dataId).then(res => {
|
||||
this.uconList = listInit(res.data)
|
||||
let data = res.data
|
||||
this.uconList = listInit(data.uniCons)
|
||||
this.realDate.header = data.infoList
|
||||
})
|
||||
this.handleQuery()
|
||||
},
|
||||
|
|
@ -140,10 +143,10 @@ export default {
|
|||
RealData(data).then(res => {
|
||||
this.realDate.data = res.rows
|
||||
this.total = res.total
|
||||
this.realDate.header = []
|
||||
for (var key in this.realDate.data[0]) {
|
||||
this.realDate.header.push(key)
|
||||
}
|
||||
// this.realDate.header = []
|
||||
// for (var key in this.realDate.data[0]) {
|
||||
// this.realDate.header.push(key)
|
||||
// }
|
||||
})
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -131,10 +131,10 @@
|
|||
</div>
|
||||
<div class="el-table">
|
||||
<el-table v-show="previewDate.open" :data="previewDate.data">
|
||||
<el-table-column v-for="item in previewDate.header"
|
||||
<el-table-column v-for="(item,index) in previewDate.header"
|
||||
:label="item.label"
|
||||
align="center"
|
||||
:key="item.key"
|
||||
:key="index"
|
||||
:prop="item.prop"
|
||||
/>
|
||||
</el-table>
|
||||
|
|
@ -295,9 +295,11 @@ export default {
|
|||
created() {
|
||||
this.queryId = this.$route.params && this.$route.params.queryId
|
||||
getQueryInfo(this.queryId).then(res => {
|
||||
let data = res.data
|
||||
this.columns = []
|
||||
this.info = res.data.info
|
||||
this.columns = JSONparse(res.data.list)
|
||||
this.info = data.info
|
||||
this.columnInfo.list = data.infoList
|
||||
this.columns = JSONparse(data.list)
|
||||
this.sqlConfig.coder.setValue(this.info.uqSql)
|
||||
})
|
||||
this.$nextTick(function() {
|
||||
|
|
@ -545,6 +547,7 @@ export default {
|
|||
})
|
||||
return
|
||||
}
|
||||
data.infoList = this.columnInfo.list
|
||||
editQueryInfo(data).then(res => {
|
||||
this.columns = JSONparse(list)
|
||||
Message({
|
||||
|
|
|
|||
|
|
@ -14,12 +14,14 @@
|
|||
@doPreview="doPreview"
|
||||
@doOnLine="doOnLine"
|
||||
>
|
||||
|
||||
</topology>
|
||||
<el-dialog :title="previewDate.title" width="1400px" :visible.sync="previewDate.open">
|
||||
<el-form ref="ucon" :inline="true" v-show="previewDate.showSearch" label-width="68px">
|
||||
<el-form-item v-for="item in previewDate.uconList"
|
||||
:key="item.id"
|
||||
:label="item.ucName">
|
||||
:label="item.ucName"
|
||||
>
|
||||
|
||||
<el-input v-if="item.type == 1" v-model="item.ucReal"
|
||||
clearable
|
||||
|
|
@ -43,7 +45,8 @@
|
|||
type="date"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="选择日期时间">
|
||||
placeholder="选择日期时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
<el-date-picker v-else-if="item.type ==4"
|
||||
v-model="item.ucReal"
|
||||
|
|
@ -76,11 +79,12 @@
|
|||
<right-toolbar :showSearch.sync="previewDate.showSearch" @queryTable="handleQuery"></right-toolbar>
|
||||
</el-row>
|
||||
<el-table :data="previewDate.data">
|
||||
<el-table-column v-for="item in previewDate.header"
|
||||
:label="item"
|
||||
<el-table-column v-for="(item,index) in previewDate.header"
|
||||
:label="item.label"
|
||||
align="center"
|
||||
:key="item"
|
||||
:prop="item"/>
|
||||
:key="index"
|
||||
:prop="item.prop"
|
||||
/>
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="previewDate.total>0"
|
||||
|
|
@ -99,8 +103,9 @@
|
|||
import Topology from './packages/topology/src/topology'
|
||||
import { deepClone } from './utils/index'
|
||||
import { getQuery, getTables, updateQuery, preview } from '@/api/tool/top'
|
||||
import {RealData} from "@/api/system/data"
|
||||
import { RealData } from '@/api/system/data'
|
||||
import { exportReal } from '../../../api/system/data'
|
||||
|
||||
export default {
|
||||
name: 'DemoTopology',
|
||||
components: {
|
||||
|
|
@ -110,17 +115,17 @@ export default {
|
|||
return {
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
pageSize: 10
|
||||
},
|
||||
baseData: null,
|
||||
previewDate: {
|
||||
open: false,
|
||||
title:"预览",
|
||||
title: '预览',
|
||||
data: [],
|
||||
header: [],
|
||||
total: 0,
|
||||
uconList: [],
|
||||
showSearch:false,
|
||||
showSearch: false
|
||||
},
|
||||
graphData: {
|
||||
// "nodes":[{"id":"305bfbdd-31cc-4028-b2b1-2f504968356d","x":304.8223042174235,"y":131.0267312661499,"label":"客户端","table":"test_table","type":"dice-er-box","attrs":[{"key":"id","type":"number(6)","comment":"主键id","isUse":0},{"key":"key","type":"varchar(255)","comment":"关键字","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"生日","isUse":0},{"key":"hometown","type":"varchar(255)","comment":"家乡","isUse":0},{"key":"country","type":"varchar(255)","comment":"国家","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"工作id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"电话","isUse":1}],"size":[55,55],"width":250,"height":316,"anchorPoints":[[0.5,0],[1,0.5],[0.5,1],[0,0.5]],"appState":{"alert":false},"labelCfg":{"position":"bottom"},"style":{"default":{"stroke":"#CED4D9","fill":"transparent","shadowBlur":10,"shadowColor":"rgba(13, 26, 38, 0.08)","lineWidth":1,"radius":4,"strokeOpacity":0.7},"selected":{"shadowColor":"#ff240b","shadowBlur":2},"unselected":{"shadowColor":""}},"selectedIndex":null,"appConfig":{},"depth":0},{"id":"be9b52e5-9c2f-4e5c-990a-afbf19dcfeed","x":-94.51187075489108,"y":127.35469287559994,"label":"防火墙","table":"test_table","type":"dice-er-box","attrs":[{"key":"id","type":"number(6)","comment":"主键id","isUse":0},{"key":"key","type":"varchar(255)","comment":"关键字","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":0},{"key":"birthday","type":"date","comment":"生日","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"家乡","isUse":1},{"key":"country","type":"varchar(255)","comment":"国家","isUse":0},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"工作id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"电话","isUse":1}],"size":[55,55],"width":250,"height":316,"anchorPoints":[[0.5,0],[1,0.5],[0.5,1],[0,0.5]],"appState":{"alert":false},"labelCfg":{"position":"bottom"},"style":{"default":{"stroke":"#CED4D9","fill":"transparent","shadowBlur":10,"shadowColor":"rgba(13, 26, 38, 0.08)","lineWidth":1,"radius":4,"strokeOpacity":0.7},"selected":{"shadowColor":"#ff240b","shadowBlur":2},"unselected":{"shadowColor":""}},"selectedIndex":null,"appConfig":{},"startIndex":0,"startX":0,"depth":0}],"edges":[{"id":"8bc0249e-ee5d-4dd7-84e0-e4e32c217f2a","source":"be9b52e5-9c2f-4e5c-990a-afbf19dcfeed","sourceColumn":[{"key":"id","type":"number(6)","comment":"主键id","isUse":1},{"key":"key","type":"varchar(255)","comment":"关键字","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"生日","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"家乡","isUse":1},{"key":"country","type":"varchar(255)","comment":"国家","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"工作id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"电话","isUse":1}],"sourceAnchor":1,"target":"305bfbdd-31cc-4028-b2b1-2f504968356d","type":"top-cubic","style":{"active":{"stroke":"rgb(95, 149, 255)","lineWidth":1},"selected":{"stroke":"rgb(95, 149, 255)","lineWidth":2,"shadowColor":"rgb(95, 149, 255)","shadowBlur":10,"text-shape":{"fontWeight":500}},"highlight":{"stroke":"rgb(95, 149, 255)","lineWidth":2,"text-shape":{"fontWeight":500}},"inactive":{"stroke":"rgb(234, 234, 234)","lineWidth":1},"disable":{"stroke":"rgb(245, 245, 245)","lineWidth":1},"edgeStyle":{"default":{"stroke":"#e2e2e2","lineWidth":3,"lineAppendWidth":10},"selected":{"shadowColor":"#626262","shadowBlur":3}},"stroke":"#A3B1BF","lineWidth":2,"strokeOpacity":0.92,"lineAppendWidth":10},"labelCfg":{"position":"center","autoRotate":false},"startPoint":{"x":155.98812924510892,"y":285.35469287559994,"anchorIndex":1},"endPoint":{"x":304.3223042174235,"y":289.0267312661499,"anchorIndex":3},"curveOffset":[-20,20],"curvePosition":[0.5,0.5],"targetAnchor":3,"targetColumn":[{"key":"id","type":"number(6)","comment":"主键id","isUse":1},{"key":"key","type":"varchar(255)","comment":"关键字","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"生日","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"家乡","isUse":1},{"key":"country","type":"varchar(255)","comment":"国家","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"工作id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"电话","isUse":1}],"depth":0}],"combos":[]},
|
||||
|
|
@ -147,7 +152,7 @@ export default {
|
|||
}
|
||||
},
|
||||
mounted() {
|
||||
this.topId = this.$route.params && this.$route.params.topId;
|
||||
this.topId = this.$route.params && this.$route.params.topId
|
||||
getQuery(this.topId).then(res => {
|
||||
this.baseData = res.data
|
||||
if (res.data.topJson) {
|
||||
|
|
@ -179,38 +184,35 @@ export default {
|
|||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
var that = this
|
||||
this.$confirm('是否确认导出查询数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
this.$confirm('是否确认导出查询数据项?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(function() {
|
||||
let data = {
|
||||
id: that.topId,
|
||||
uniCons:that.previewDate.uconList,
|
||||
uniCons: that.previewDate.uconList
|
||||
}
|
||||
return exportReal(data)
|
||||
}).then(response => {
|
||||
this.download(response.msg);
|
||||
this.download(response.msg)
|
||||
})
|
||||
},
|
||||
handleQuery() {
|
||||
let data = {
|
||||
id: this.topId,
|
||||
pageNum: this.queryParams.pageNum,
|
||||
pageSize: this.queryParams.pageSize,
|
||||
pageSize: this.queryParams.pageSize
|
||||
}
|
||||
data.uniCons = this.previewDate.uconList
|
||||
//todo 需要修改
|
||||
RealData(data).then(res => {
|
||||
this.previewDate.data = res.rows
|
||||
this.total = res.total
|
||||
this.previewDate.header = []
|
||||
for (const key in this.previewDate.data[0]) {
|
||||
this.previewDate.header.push(key)
|
||||
}
|
||||
})
|
||||
},
|
||||
outPlaceholder(item) {
|
||||
return "请输入" + item.ucName
|
||||
return '请输入' + item.ucName
|
||||
},
|
||||
doAutoRefresh(interval) {
|
||||
if (interval === -1) {
|
||||
|
|
@ -244,10 +246,10 @@ export default {
|
|||
})
|
||||
},
|
||||
doOnLine() {
|
||||
this.$confirm('请确认top图结构无误并预览结果无误后上线?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
this.$confirm('请确认top图结构无误并预览结果无误后上线?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(function() {
|
||||
|
||||
})
|
||||
|
|
@ -255,10 +257,39 @@ export default {
|
|||
//预览
|
||||
doPreview(graphData) {
|
||||
if (graphData.nodes && graphData.nodes.length > 0) {
|
||||
let nodeList = graphData.nodes
|
||||
let edgeList = graphData.edges
|
||||
let nodes = []
|
||||
nodeList.forEach(node => {
|
||||
nodes.push({
|
||||
id: node.id,
|
||||
label: node.label,
|
||||
table: node.table,
|
||||
columns: node.columns
|
||||
})
|
||||
})
|
||||
let edges = []
|
||||
edgeList.forEach(edge => {
|
||||
edges.push({
|
||||
id:edge.id,
|
||||
label: edge.label,
|
||||
source: edge.source,
|
||||
target: edge.target,
|
||||
appConfig: edge.appConfig
|
||||
})
|
||||
})
|
||||
|
||||
let data = {
|
||||
jsonData:JSON.stringify(graphData),
|
||||
jsonData: JSON.stringify({
|
||||
nodes: nodes,
|
||||
edges: edges
|
||||
}),
|
||||
id: this.topId
|
||||
}
|
||||
console.log({
|
||||
nodes: nodes,
|
||||
edges: edges
|
||||
})
|
||||
preview(data).then(res => {
|
||||
this.previewDate.data = res.rows
|
||||
this.previewDate.total = res.total
|
||||
|
|
@ -267,14 +298,20 @@ export default {
|
|||
this.previewDate.showSearch = true
|
||||
}
|
||||
this.previewDate.header = []
|
||||
for (const key in this.previewDate.data[0]) {
|
||||
this.previewDate.header.push(key)
|
||||
}
|
||||
this.previewDate.title = this.baseData.uqName + "数据预览"
|
||||
let infoList = res.infoList
|
||||
infoList.forEach( info=>{
|
||||
this.previewDate.header.push({
|
||||
key: info.prop,
|
||||
label: info.label,
|
||||
prop: info.prop
|
||||
})
|
||||
})
|
||||
|
||||
this.previewDate.title = this.baseData.uqName + '数据预览'
|
||||
this.previewDate.open = true
|
||||
})
|
||||
} else {
|
||||
this.msgError("top数据有误,请再次检查")
|
||||
this.msgError('top数据有误,请再次检查')
|
||||
}
|
||||
},
|
||||
randomChange() {
|
||||
|
|
|
|||
Loading…
Reference in New Issue