Skip to content

E
ETL-admin
Commit 4d80872f by 莫晓莉
Options

资源库导入和画布图标回显，转换可以回显，作业不能实现回显

parent 250e8065
Showing with 202 additions and 25 deletions
src/assets/default-style.xml 0 → 100644
<mxStylesheet>
<add as="defaultVertex">
<add as="strokeColor" value="#3d6380"/>
<add as="fontSize" value="12"/>
<add as="fontColor" value="#000000"/>
<add as="fontFamily" value="宋体"/>
</add>
<add as="defaultEdge">
<add as="shape" value="connector"/>
<add as="labelBackgroundColor" value="white"/>
<add as="endArrow" value="classic"/>
<add as="fontSize" value="11"/>
<add as="fontFamily" value="宋体"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="labelBackgroundColor" value="#ffffff"/>
<add as="rounded" value="1"/>
<add as="strokeColor" value="#3d6380"/>
</add>
<add as="error">
<add as="shape" value="connector"/>
<add as="labelBackgroundColor" value="white"/>
<add as="endArrow" value="classic"/>
<add as="fontSize" value="11"/>
<add as="fontFamily" value="宋体"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="labelBackgroundColor" value="#ffffff"/>
<add as="dashed" value="1"/>
<add as="strokeColor" value="#ff0000"/>
</add>
<add as="label">
<add as="shape" value="label"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontStyle" value="1"/>
<add as="align" value="left"/>
<add as="verticalAlign" value="middle"/>
<add as="imageWidth" value="32"/>
<add as="imageHeight" value="32"/>
<add as="rounded" value="1"/>
<add as="glass" value="1"/>
</add>
<add as="icon" extend="label">
<add as="align" value="center"/>
<add as="imageAlign" value="center"/>
<add as="verticalLabelPosition" value="bottom"/>
<add as="verticalAlign" value="top"/>
<add as="labelBackgroundColor" value="#FFFFFF"/>
<add as="fontStyle" value="0"/>
<add as="imageWidth" value="32"/>
<add as="imageHeight" value="32"/>
</add>
<add as="entity">
<add as="edgeStyle" value="entityRelationEdgeStyle"/>
</add>
<add as="vertical">
<add as="elbow" value="vertical"/>
</add>
<add as="straight">
<add as="shape" value="connector"/>
<add as="endArrow" value="classic"/>
<add as="edgeStyle" value="none"/>
</add>
<add as="arrow">
<add as="shape" value="arrow"/>
</add>
<add as="swimlane">
<add as="shape" value="swimlane"/>
<add as="fontSize" value="12"/>
<add as="fontStyle" value="1"/>
<add as="startSize" value="23"/>
</add>
<add as="group">
<add as="verticalAlign" value="top"/>
<add as="dashed" value="1"/>
<add as="opacity" value="50"/>
</add>
<add as="ellipse">
<add as="shape" value="ellipse"/>
<add as="perimeter" value="ellipsePerimeter"/>
</add>
<add as="rhombus">
<add as="shape" value="rhombus"/>
<add as="perimeter" value="rhombusPerimeter"/>
</add>
<add as="triangle">
<add as="shape" value="triangle"/>
<add as="perimeter" value="trianglePerimeter"/>
</add>
<add as="line">
<add as="shape" value="line"/>
<add as="strokeWidth" value="4"/>
<add as="labelBackgroundColor" value="white"/>
<add as="verticalAlign" value="top"/>
<add as="spacingTop" value="8"/>
</add>
<add as="image">
<add as="shape" value="image"/>
<add as="labelBackgroundColor" value="white"/>
<add as="verticalLabelPosition" value="bottom"/>
<add as="verticalAlign" value="top"/>
</add>
<add as="roundImage" extend="image">
<add as="perimeter" value="ellipsePerimeter"/>
</add>
<add as="rhombusImage" extend="image">
<add as="perimeter" value="rhombusPerimeter"/>
</add>
</mxStylesheet>
\ No newline at end of file
src/views/dashboard-kettle/components/designer/mxgraphDesigner.vue
...@@ -994,6 +994,7 @@ import homeworkDialog from "../../../job-dialog/homework"; ...@@ -994,6 +994,7 @@ import homeworkDialog from "../../../job-dialog/homework";
// 作业弹窗组件结束--------------------------------------- // 作业弹窗组件结束---------------------------------------
import mxgraph from "@/utils/mxgraph"; import mxgraph from "@/utils/mxgraph";
const { const {
mxGraph, mxGraph,
mxUtils, mxUtils,
...@@ -1623,6 +1624,15 @@ previousField(){ ...@@ -1623,6 +1624,15 @@ previousField(){
// var dec = new mxCodec(node.ownerDocument); // var dec = new mxCodec(node.ownerDocument);
// dec.decode(node, this.graph.getStylesheet()); // dec.decode(node, this.graph.getStylesheet());
// new mxRubberband(this.graph); // new mxRubberband(this.graph);
// 图标回显----------------------------
var node = mxUtils.load('./mxgraph/default-style.xml').getDocumentElement();
var dec = new mxCodec(node.ownerDocument);
dec.decode(node, this.graph.getStylesheet());
new mxRubberband(this.graph);
// 图标回显----------------------------
this.graph.setConnectable(true); // 允许连线 this.graph.setConnectable(true); // 允许连线
...@@ -1638,6 +1648,8 @@ previousField(){ ...@@ -1638,6 +1648,8 @@ previousField(){
this.graph.convertValueToString = (cell) => { this.graph.convertValueToString = (cell) => {
var label = cell.getAttribute("label"); var label = cell.getAttribute("label");
if(label) { if(label) {
...@@ -1646,10 +1658,13 @@ previousField(){ ...@@ -1646,10 +1658,13 @@ previousField(){
} else if(cell.isEdge() && cell.value.nodeName == 'JobHop') { } else if(cell.isEdge() && cell.value.nodeName == 'JobHop') {
console.log(label,'label'); console.log(label,'label');
// var jsonArray = JSON.parse(label), label = '';
console.log(JSON.parse(label),'mylabel');
var jsonArray = JSON.parse(label), label = ''; var jsonArray = JSON.parse(label), label = '';
console.log(jsonArray,'jsonArray');
jsonArray.forEach(img=>{ jsonArray.forEach(img=>{
label += '<img src="' + img + '" width="16" height="16" />'; label += '<img src="'+this.etlWeb + img + '" width="16" height="16" />';
}) })
return label; return label;
...@@ -1704,6 +1719,14 @@ previousField(){ ...@@ -1704,6 +1719,14 @@ previousField(){
// console.log(this.R.prop("title", cell),132132); // console.log(this.R.prop("title", cell),132132);
// return this.R.prop("title", cell); // return this.R.prop("title", cell);
}; };
// var cellLabelChanged = this.graph.cellLabelChanged;
// this.graph.cellLabelChanged = function(cell, newValue, autoSize){
// var tmp = cell.value.cloneNode(true);
// tmp.setAttribute('label', value);
// value = tmp;
// cellLabelChanged.apply(this, arguments);
// };
//监听连线 //监听连线
this.graph.addListener(mxEvent.CELLS_ADDED,(graph,evt)=>{ this.graph.addListener(mxEvent.CELLS_ADDED,(graph,evt)=>{
...@@ -1759,7 +1782,7 @@ previousField(){ ...@@ -1759,7 +1782,7 @@ previousField(){
}); });
if ( if (
cell.ids == "step1" || (this.curFileType=="transformation" && cell.ids == "step1") ||
cell.value.attributes.ctype.value == "ExcelInput" cell.value.attributes.ctype.value == "ExcelInput"
) { ) {
this.excelLnput = !this.excelLnput; this.excelLnput = !this.excelLnput;
......
src/views/dialogs-components/global/in-repository/main.vue
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
:before-close="handleClose"> :before-close="handleClose">
<!-- <span>请输入{{title}}名称：</span> --> <!-- <span>请输入{{title}}名称：</span> -->
<!-- <el-input style="margin-top:15px;" v-model="inputValue" :placeholder="'请输入'+title+'名称'"></el-input> --> <!-- <el-input style="margin-top:15px;" v-model="inputValue" :placeholder="'请输入'+title+'名称'"></el-input> -->
<el-upload <!-- <el-upload
ref="upload" ref="upload"
:limit="1" :limit="1"
class="input-length" class="input-length"
...@@ -16,6 +16,16 @@ ...@@ -16,6 +16,16 @@
:auto-upload="false" :auto-upload="false"
:on-change="handleChange"> :on-change="handleChange">
<el-button size="small" type="primary">点击上传</el-button> <el-button size="small" type="primary">点击上传</el-button>
</el-upload> -->
<el-upload
ref="upload"
:limit="1"
class="input-length"
action="/etlweb/attachment/upload"
:file-list="fileList"
:headers="headers"
:on-success="uplodSuccess">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload> </el-upload>
...@@ -60,11 +70,13 @@ ...@@ -60,11 +70,13 @@
<script> <script>
import {Imptree,imp } from "@/api/kettle/file"; import {Imptree,imp } from "@/api/kettle/file";
import { getToken } from "@/utils/auth";
export default { export default {
name: "in-repository", name: "in-repository",
data() { data() {
return { return {
headers: {}, // 头部信息
impFileList:[],//导入的文件列表 impFileList:[],//导入的文件列表
fileList:[], fileList:[],
defaultProps: { defaultProps: {
...@@ -83,22 +95,29 @@ export default { ...@@ -83,22 +95,29 @@ export default {
}, },
created() { created() {
// this.exptree(); // this.exptree();
this.setHeaders();
}, },
methods: { methods: {
//获取导出资源库树 setHeaders() {
exptree() { this.headers = {
let data = new FormData(); contentType: "application/x-www-form-urlencoded",
data.append("loadElement", 3); Authorization: getToken(),
data.append("node", "root"); };
exptree(data).then((res) => {
if (res) {
console.log("导出资源库树列表：", res);
this.exTreeList = res;
} else {
this.$message.error(res.errMsg);
}
});
}, },
//获取导出资源库树
// exptree() {
// let data = new FormData();
// data.append("loadElement", 3);
// data.append("node", "root");
// exptree(data).then((res) => {
// if (res) {
// console.log("导出资源库树列表：", res);
// this.exTreeList = res;
// } else {
// this.$message.error(res.errMsg);
// }
// });
// },
getCheckedNodes() { getCheckedNodes() {
console.log('当前勾选的所有数据',this.$refs.tree.getCheckedNodes()); console.log('当前勾选的所有数据',this.$refs.tree.getCheckedNodes());
var allCheckedsNodes=this.$refs.tree.getCheckedNodes(); var allCheckedsNodes=this.$refs.tree.getCheckedNodes();
...@@ -171,16 +190,33 @@ export default { ...@@ -171,16 +190,33 @@ export default {
handleClose() { handleClose() {
this.$emit("update:inputVisibility", false); this.$emit("update:inputVisibility", false);
}, },
handleChange(file, fileList) { // handleChange(file, fileList) {
console.log('已经上传的文件==',file); // console.log('已经上传的文件==',file);
var path=file.name; // console.log('已经上传的文件夹==',fileList);
// path='H:\\小曾发来的新项目\\kettle\\kettle-webapp\\file_trans1.zip'; // var path=file.name;
path="D:\\file\\111.zip"; // // path='H:\\小曾发来的新项目\\kettle\\kettle-webapp\\file_trans1.zip';
this.uploadPath=path; // // path="D:\\file\\111.zip";
// this.uploadPath=path;
// this.Imptree(path);
// },
// 上传资源文件成功
uplodSuccess(response, file, fileList) {
console.log(response, file, fileList);
if (response.success !== true) {
this.$message.error("上传失败！");
return;
}
this.Imptree(path); console.log('上传资源文件成功返回数据================',response);
this.uploadPath = response.message;//添加作业
this.Imptree(this.uploadPath);
this.$message.success("上传成功！");
}, },
// 导入资源库 // 导入资源库
Imptree(path){ Imptree(path){
var formData = new FormData(); var formData = new FormData();
......
src/views/kettle/home2.vue
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
<el-dropdown-item >管理资源库</el-dropdown-item> <el-dropdown-item >管理资源库</el-dropdown-item>
<el-dropdown-item @click.native="disconnect()" >断开资源库</el-dropdown-item> <el-dropdown-item @click.native="disconnect()" >断开资源库</el-dropdown-item>
<el-dropdown-item @click.native="exportTreeDialog()">导出资源库</el-dropdown-item> <el-dropdown-item @click.native="exportTreeDialog()">导出资源库</el-dropdown-item>
<el-dropdown-item>导入资源库</el-dropdown-item> <el-dropdown-item @click.native="importTreeDialog()">导入资源库</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
<el-dropdown <el-dropdown
...@@ -320,7 +320,8 @@ ...@@ -320,7 +320,8 @@
<scanDialog ref="scanDialog" :scanDialogVisible.sync="scanDialogVisible" :createModel="createModel"></scanDialog> <scanDialog ref="scanDialog" :scanDialogVisible.sync="scanDialogVisible" :createModel="createModel"></scanDialog>
<feature ref="feature" :featureDialogVisible.sync="featureDialogVisible"></feature> <feature ref="feature" :featureDialogVisible.sync="featureDialogVisible"></feature>
<establishDialog ref="establishDialog" :estabDialogVisible.sync="estabDialogVisible" :title="estabTitle" :nodePath="nodePath" :explorer="explorer"></establishDialog> <establishDialog ref="establishDialog" :estabDialogVisible.sync="estabDialogVisible" :title="estabTitle" :nodePath="nodePath" :explorer="explorer"></establishDialog>
<export-tree ref="exDialog" :exportDialogVisible.sync="exportDialogVisible"></export-tree> <export-tree ref="exDialog" :exportDialogVisible.sync="exportDialogVisible" :explorer="explorer"></export-tree>
<in-repository ref="importDialog" :inputVisibility.sync="inputVisibility" :explorer="explorer"></in-repository>
</div> </div>
</template> </template>
...@@ -384,6 +385,7 @@ export default { ...@@ -384,6 +385,7 @@ export default {
props: ["dragItem"], props: ["dragItem"],
data() { data() {
return { return {
inputVisibility:false,//导入资源库
noneRespository:0, noneRespository:0,
curNodeText:'数据库名称',//当前点击选中的资源库节点 curNodeText:'数据库名称',//当前点击选中的资源库节点
blankCanvas:"",//空白画布xml blankCanvas:"",//空白画布xml
...@@ -1337,6 +1339,12 @@ props: ["dragItem"], ...@@ -1337,6 +1339,12 @@ props: ["dragItem"],
exportTreeDialog(){ exportTreeDialog(){
console.log('导出资源库===='); console.log('导出资源库====');
this.exportDialogVisible=true; this.exportDialogVisible=true;
},
// 导入资源库弹窗
importTreeDialog(){
console.log('导入资源库====');
this.inputVisibility=true;
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment