Skip to content

E
ETL-admin
Commit f75d681c by 李耀琨
Options

完成排序记录、设置变量、合并记录、字段选择、改变开始复制数量

parent 4240b4ee
Showing with 2805 additions and 497 deletions
.env.development
ENV = 'development'
VUE_APP_BASE_API = 'http://147.1.3.180:9888/'
VUE_APP_WS_API = 'ws://147.1.3.180:9888/'
#VUE_APP_BASE_API = 'http://147.1.3.180:9888/'
#VUE_APP_WS_API = 'ws://147.1.3.180:9888/'
#VUE_APP_BASE_API = 'http://192.168.0.44:9888/'
#VUE_APP_WS_API = 'ws://192.168.0.44:9888/'
VUE_APP_BASE_API = 'http://192.168.0.44:9888/'
VUE_APP_WS_API = 'ws://192.168.0.44:9888/'
......
public/index.html
......@@ -7,6 +7,44 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= webpackConfig.name %></title>
<style>
body div.mxPopupMenu {
-webkit-box-shadow: 3px 3px 6px #C0C0C0;
-moz-box-shadow: 3px 3px 6px #C0C0C0;
box-shadow: 3px 3px 6px #C0C0C0;
background: white;
position: absolute;
border: 3px solid #e7e7e7;
padding: 3px;
}
body table.mxPopupMenu {
border-collapse: collapse;
margin: 0px;
}
body tr.mxPopupMenuItem {
color: black;
cursor: default;
}
body td.mxPopupMenuItem {
padding: 6px 60px 6px 30px;
font-family: Arial;
font-size: 10pt;
}
body td.mxPopupMenuIcon {
background-color: white;
padding: 0px;
}
body tr.mxPopupMenuItemHover {
background-color: #eeeeee;
color: black;
}
table.mxPopupMenu hr {
border-top: solid 1px #cccccc;
}
table.mxPopupMenu tr {
font-size: 4pt;
}
</style>
</head>
<body>
<div id="app"></div>
......
src/api/kettle/link.js
......@@ -380,3 +380,11 @@ export function previewData(data){
//
export function variableType(data){
return request({
url:'etlweb/system/variableType',
data,
method: 'post'
})
}
src/assets/styles/index.scss
......@@ -581,8 +581,8 @@ aside {
//
$svgUrl:'http://147.1.3.180:9888/ETLWEB-SERVER/etlweb';
// $svgUrl:'http://192.168.0.44:9888/ETLWEB-SERVER/etlweb';
// $svgUrl:'http://147.1.3.180:9888/ETLWEB-SERVER/etlweb';
$svgUrl:'http://192.168.0.44:9888/ETLWEB-SERVER/etlweb';
// $svgUrl:'http://192.168.0.44:9882/ETLWEB-SERVER/etlweb';
// .schema { background-image: url($svgUrl/ui/images/schema.svg?scale=16) !important;}
......
src/main.js
......@@ -33,6 +33,8 @@ import moment from 'moment'
import jsPlump from 'jsplumb'
Vue.use(jsPlump);
// 引入自定义指令
......@@ -76,8 +78,8 @@ Vue.prototype.R = R
Vue.config.productionTip = false
const baseUrl = process.env.VUE_APP_BASE_API === '/' ? '' : process.env.VUE_APP_BASE_API
Vue.prototype.etlWeb = "http://147.1.3.180:9888/ETLWEB-SERVER/etlweb/"
// Vue.prototype.etlWeb = "http://192.168.0.44:9888/ETLWEB-SERVER/etlweb/"
// Vue.prototype.etlWeb = "http://147.1.3.180:9888/ETLWEB-SERVER/etlweb/"
Vue.prototype.etlWeb = "http://192.168.0.44:9888/ETLWEB-SERVER/etlweb/"
new Vue({
router,
......
src/views/dashboard-kettle/components/appBulletFrame/getVariable.vue 0 → 100644
<template>
<div class="customConstant">
<el-form ref="from" :model="form" label-width="120px">
<el-form-item label="步骤名称:">
<el-input v-model="form.label"></el-input>
</el-form-item>
</el-form>
<el-button type="primary" @click="fieldClick(true)">添加字段</el-button>
<el-button type="primary" @click="getTheField">获取字段</el-button>
<el-table :data="fields" style="width: 100%">
<el-table-column prop="field_name" label="字段名称"> </el-table-column>g
<el-table-column prop="variable_name" label="变量名"> </el-table-column>
<el-table-column prop="variable_type" label="变量活动类型"> </el-table-column>
<el-table-column prop="default_value" label="默认值"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, fields)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<el-dialog
title="添加字段"
:visible.sync="fieldBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="metadataForm" label-width="160px">
<el-form-item label="字段名称:">
<el-select v-model="metadataForm.field_name" style="width: 100%" clearable>
<el-option
v-for="item in fieldsName"
:key="item.index"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
<el-form-item label="变量名:">
<el-input v-model="metadataForm.variable_name"></el-input>
</el-form-item>
<el-form-item label="变量活动类型:">
<el-select v-model="metadataForm.variable_type" style="width: 100%" clearable>
<el-option
v-for="item in activityType"
:key="item.id"
:label="item.desc"
:value="item.desc"
/>
</el-select>
</el-form-item>
<el-form-item label="默认值:">
<el-input v-model="metadataForm.default_value"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="fieldBox = false">取 消</el-button>
<el-button type="primary" @click="addFieldBox">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import browseFiles from "../appBulletFrame/browseFiles";
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph;
import {
valueFormat,
valueMeta,
formatMapperLineTerminator,
availableCharsets,
compressionProviderNames,
inputOutputFields,
variableType
} from "@/api/kettle/link";
export default {
props: ["connectionNode", "form", "nodeData"], //从父组件传过来的值
components: {
browseFiles,
},
data() {
return {
newGraph: [],
fieldBox: false,
fields: this.form.fields,
metadataForm: {},
fieldFormat: {},
fieldCompress: {},
fieldType: {},
dataState: false,
fileType: [],
codingType: [],
fileSelection: {},
activityType:[],
fieldsName:[],
};
},
created() {
this.valueFormatFun();
this.valueMetaFun();
this.formatMapperLineTerminatorFun();
this.availableCharsetsFun();
this.compressionProviderNamesFun();
},
methods: {
clickFun(graph) {
console.log(graph, 1);
this.newGraph = graph;
},
getTheField() {
console.log(this.nodeData);
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
// console.log( this.graphXml,"看着了");
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
console.log(res,"yuiyuiyui");
for (let i of res){
i.field_name = i.name
}
this.fields = res;
// this.fields.field_name = res.name
});
},
compressionProviderNamesFun() {
compressionProviderNames().then((res) => {
this.fieldCompress = res;
});
},
// 关闭弹框
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
formatMapperLineTerminatorFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
formatMapperLineTerminator(pamer).then((res) => {
this.fileType = res;
});
},
availableCharsetsFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
availableCharsets(pamer).then((res) => {
this.codingType = res;
});
},
deleteField(index, rows) {
rows.splice(index, 1);
},
fieldClick(state, val) {
this.fieldBox = !this.fieldBox;
this.dataState = state;
let type = new FormData(); // 创建form对象
type.append("query", "");
variableType(type).then(res=>{
this.activityType = res
})
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
console.log(res,"kanzzhelia ");
this.fieldsName = res;
});
if (state) {
this.metadataForm = {};
} else {
this.metadataForm = val;
}
},
addFieldBox() {
this.fieldBox = !this.fieldBox;
if (this.dataState) {
this.fields.push(this.metadataForm);
this.$emit("fields", this.fields);
} else {
}
},
valueFormatFun() {
let pamer2 = new FormData(); // 创建form对象
pamer2.append("valueType", "all");
valueFormat(pamer2).then((res) => {
this.fieldFormat = res;
});
},
valueMetaFun() {
valueMeta().then((res) => {
this.fieldType = res;
});
},
},
};
</script>
<style lang="scss" scoped>
* {
outline: none;
}
</style>
src/views/dashboard-kettle/components/appBulletFrame/mergeRecords.vue 0 → 100644
<template>
<div class="customConstant">
<el-form ref="from" :model="form" label-width="120px">
<el-form-item label="步骤名称:">
<el-input v-model="form.label"></el-input>
</el-form-item>
</el-form>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="旧数据源:">
<el-select v-model="form.reference" style="width: 100%" clearable @click.native="previousStepsFun">
<el-option
v-for="item in fieldCompress"
:key="item.index"
:label="item.name"
:value="item.name"
/></el-select>
</el-form-item>
<el-form-item label="新数据源:">
<el-select v-model="form.compare" style="width: 100%" clearable @click.native="previousStepsFun">
<el-option
v-for="item in fieldCompress"
:key="item.index"
:label="item.name"
:value="item.name"
/></el-select>
</el-form-item>
<el-form-item label="标志字段:">
<el-input v-model="form.flag_field"></el-input>
</el-form-item>
</el-form>
<el-row :gutter="10">
<el-col :span="12">
<el-card class="box-card">
{{"匹配的关键字："}}
<br>
<br>
<el-button type="primary" @click="matchingFieldClick(true)"
>添加字段</el-button
>
<el-table :data="keys" style="width: 100%">
<el-table-column prop="key" label="名称"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="matchingFieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, keys)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
<el-col :span="12">
<el-card class="box-card">
{{"数据字段:"}}
<br>
<br>
<el-button type="primary" @click="fieldClick(true)"
>添加字段</el-button
>
<el-table :data="values" style="width: 100%">
<el-table-column prop="value" label="名称"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, values)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</el-row>
<el-dialog
title="添加数据字段"
:visible.sync="fieldBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="metadataForm" label-width="160px">
<el-form-item label="名称:">
<el-input v-model="metadataForm.value"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="fieldBox = false">取 消</el-button>
<el-button type="primary" @click="addFieldBox">确 定</el-button>
</span>
</el-dialog>
<el-dialog
title="添加匹配的关键字"
:visible.sync="matchingFieldBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="matchingFieldForm" label-width="160px">
<el-form-item label="名称:">
<el-input v-model="matchingFieldForm.key"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="matchingFieldBox = false">取 消</el-button>
<el-button type="primary" @click="matchingFieldBoxFun">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import browseFiles from "../appBulletFrame/browseFiles";
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph;
import {
valueFormat,
valueMeta,
formatMapperLineTerminator,
availableCharsets,
compressionProviderNames,
previousSteps,
} from "@/api/kettle/link";
export default {
props: ["connectionNode", "form", "nodeData"], //从父组件传过来的值
components: {
browseFiles,
},
data() {
return {
newGraph: [],
fieldBox: false,
matchingFieldBox:false,
values:this.form.values,
keys:this.form.keys,
metadataForm: {},
matchingFieldForm:{},
filterForm: {},
fieldFormat: {},
fieldCompress: {},
fieldType: {},
dataState: false,
fileType: [],
codingType: [],
routeState: 0,
filePathSelection: false,
localPath: {},
fileSelection: {},
fielForm: {},
};
},
created() {
this.valueFormatFun();
this.valueMetaFun();
this.formatMapperLineTerminatorFun();
this.availableCharsetsFun();
},
methods: {
clickFun(graph) {
console.log(graph, 1);
this.newGraph = graph;
},
route(flowData) {
this.localPath.fileName = flowData.name;
console.log(this.localPath);
},
previousStepsFun() {
console.log(this.nodeData.value.attributes.label.value,8888888888888888);
console.log(this.newGraph,7777777777777777);
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerSteps = new FormData(); // 创建form对象
pamerSteps.append("stepName", this.nodeData.value.attributes.label.value);
pamerSteps.append("graphXml", this.graphXml);
pamerSteps.append("query", "");
previousSteps(pamerSteps).then((res) => {
this.fieldCompress = res;
});
},
// 关闭弹框
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
formatMapperLineTerminatorFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
formatMapperLineTerminator(pamer).then((res) => {
this.fileType = res;
});
},
availableCharsetsFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
availableCharsets(pamer).then((res) => {
this.codingType = res;
});
},
deleteField(index, rows) {
rows.splice(index, 1);
},
fieldClick(state, val) {
this.fieldBox = !this.fieldBox;
this.dataState = state;
if (state) {
this.metadataForm = {};
} else {
this.metadataForm = val;
}
},
matchingFieldClick(state, val) {
this.matchingFieldBox = !this.matchingFieldBox;
this.dataState = state;
if (state) {
this.matchingFieldForm = {};
} else {
this.matchingFieldForm = val;
}
},
matchingFieldBoxFun(){
this.matchingFieldBox = !this.matchingFieldBox;
if (this.dataState) {
this.keys.push(this.matchingFieldForm);
this.$emit("keys", this.keys);
} else {
}
},
addFieldBox() {
this.fieldBox = !this.fieldBox;
if (this.dataState) {
this.values.push(this.metadataForm);
this.$emit("values", this.values);
} else {
}
},
valueFormatFun() {
let pamer2 = new FormData(); // 创建form对象
pamer2.append("valueType", "all");
valueFormat(pamer2).then((res) => {
this.fieldFormat = res;
});
},
valueMetaFun() {
valueMeta().then((res) => {
this.fieldType = res;
});
},
},
};
</script>
<style lang="scss" scoped>
* {
outline: none;
}
</style>
src/views/dashboard-kettle/components/appBulletFrame/selectField.vue 0 → 100644
<template>
<div class="customConstant">
<el-form ref="from" :model="form" label-width="120px">
<el-form-item label="步骤名称:">
<el-input v-model="form.label"></el-input>
</el-form-item>
</el-form>
<el-tabs type="border-card">
<el-tab-pane label="选择和修改">
<el-button type="primary" @click="selectModify(true)">添加字段</el-button>
<el-button type="primary" @click="selectModifyGetTheField">获取字段</el-button>
<el-table :data="fields" style="width: 100%">
<el-table-column prop="name" label="字段名称"> </el-table-column>
<el-table-column prop="rename" label="改名成"> </el-table-column>
<el-table-column prop="length" label="长度"> </el-table-column>
<el-table-column prop="precision" label="精度"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="selectModify(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, fields)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="移除">
<el-button type="primary" @click="fieldClick(true)">添加字段</el-button>
<el-button type="primary" @click="getTheField">获取字段</el-button>
<el-table :data="remove" style="width: 100%">
<el-table-column prop="name" label="字段名称"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, remove)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="元数据">
<el-button type="primary" @click="metadata(true)">添加字段</el-button>
<el-button type="primary" @click="metadataGetTheField">获取字段</el-button>
<el-table :data="meta" style="width: 100%">
<el-table-column prop="name" label="字段名称"> </el-table-column>
<el-table-column prop="rename" label="改名成"> </el-table-column>
<el-table-column prop="type" label="类型"> </el-table-column>
<el-table-column prop="length" label="长度"> </el-table-column>
<el-table-column prop="precision" label="精度"> </el-table-column>
<el-table-column prop="storage_type" label="Binary to Normal?"> </el-table-column>
<el-table-column prop="conversion_mask" label="格式"> </el-table-column>
<el-table-column prop="date_format_lenient" label="Date Format Lenient?"> </el-table-column>
<el-table-column prop="date_format_locale" label="Date Locale"> </el-table-column>
<el-table-column prop="date_format_timezone" label="Date Time Zone"> </el-table-column>
<el-table-column prop="lenient_string_to_number" label="Lenient number conversion?"> </el-table-column>
<el-table-column prop="encoding" label="Encoding"> </el-table-column>
<el-table-column prop="decimal_symbol" label="十进制"> </el-table-column>
<el-table-column prop="grouping_symbol" label="分组"> </el-table-column>
<el-table-column prop="currency_symbol" label="货币"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="metadata(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, meta)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
<el-dialog
title="选择和修改"
:visible.sync="selectModifyBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="selectModifyForm" label-width="100px">
<el-form-item label="字段名称:">
<el-input v-model="selectModifyForm.name"></el-input>
</el-form-item>
<el-form-item label="改名成:">
<el-input v-model="selectModifyForm.rename"></el-input>
</el-form-item>
<el-form-item label="长度:">
<el-input v-model="selectModifyForm.length"></el-input>
</el-form-item>
<el-form-item label="精度:">
<el-input v-model="selectModifyForm.precision"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="selectModifyBox = false">取 消</el-button>
<el-button type="primary" @click="selectModifyBoxFun">确 定</el-button>
</span>
</el-dialog>
<el-dialog
title="移除"
:visible.sync="removeFieldBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="removeFieldForm" label-width="100px">
<el-form-item label="字段名称:">
<el-input v-model="removeFieldForm.name"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="removeFieldBox = false">取 消</el-button>
<el-button type="primary" @click="removeFieldBoxFun">确 定</el-button>
</span>
</el-dialog>
<el-dialog
title="添加元数据"
:visible.sync="metadataBox"
width="600px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="metadataForm" label-width="240px">
<el-form-item label="字段名称:">
<el-input v-model="metadataForm.name"></el-input>
</el-form-item>
<el-form-item label="改名成:">
<el-input v-model="metadataForm.rename"></el-input>
</el-form-item>
<el-form-item label="类型:">
<el-select v-model="metadataForm.type" style="width: 100%" clearable>
<el-option
v-for="item in fieldType"
:key="item.id"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
<el-form-item label="长度:">
<el-input v-model="metadataForm.length"></el-input>
</el-form-item>
<el-form-item label="精度:">
<el-input v-model="metadataForm.precision"></el-input>
</el-form-item>
<el-form-item label="Binary to Normal?:">
<el-select v-model="metadataForm.storage_type" style="width: 100%">
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
<el-form-item label="格式:">
<el-select
v-model="metadataForm.conversion_mask"
style="width: 100%"
clearable
>
<el-option
v-for="item in fieldFormat"
:key="item.index"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
<el-form-item label="Date Format Lenient?:">
<el-select v-model="metadataForm.date_format_lenient" style="width: 100%">
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
<el-form-item label="Date Locale:">
<el-select
v-model="metadataForm.date_format_locale"
style="width: 100%"
clearable
>
<el-option label="不去掉空格" value="none"></el-option>
<el-option label="去掉左空格" value="left"></el-option>
<el-option label="去掉右空格" value="right"></el-option>
<el-option label="去掉左右两端空格" value="both"></el-option>
</el-select>
</el-form-item>
<el-form-item label="Date Time Zone:">
<el-select
v-model="metadataForm.date_format_timezone"
style="width: 100%"
clearable
>
<el-option label="不去掉空格" value="none"></el-option>
<el-option label="去掉左空格" value="left"></el-option>
<el-option label="去掉右空格" value="right"></el-option>
<el-option label="去掉左右两端空格" value="both"></el-option>
</el-select>
</el-form-item>
<el-form-item label="Lenient number conversion?:">
<el-select v-model="metadataForm.lenient_string_to_number" style="width: 100%">
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
<el-form-item label="Encoding:">
<el-select
v-model="metadataForm.encoding"
style="width: 100%"
clearable
>
<el-option label="不去掉空格" value="none"></el-option>
<el-option label="去掉左空格" value="left"></el-option>
<el-option label="去掉右空格" value="right"></el-option>
<el-option label="去掉左右两端空格" value="both"></el-option>
</el-select>
</el-form-item>
<el-form-item label="十进制:">
<el-input v-model="metadataForm.decimal_symbol"></el-input>
</el-form-item>
<el-form-item label="分组:">
<el-input v-model="metadataForm.grouping_symbol"></el-input>
</el-form-item>
<el-form-item label="货币:">
<el-input v-model="metadataForm.currency_symbol"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="metadataBox = false">取 消</el-button>
<el-button type="primary" @click="metadataBoxFun">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import browseFiles from "../appBulletFrame/browseFiles";
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph;
import {
valueFormat,
valueMeta,
formatMapperLineTerminator,
availableCharsets,
compressionProviderNames,
inputOutputFields,
} from "@/api/kettle/link";
export default {
props: ["connectionNode", "form", "nodeData"], //从父组件传过来的值
components: {
browseFiles,
},
data() {
return {
newGraph: [],
fileBox: false,
filterBox: false,
metadataBox: false,
selectModifyBox:false,
removeFieldBox:false,
filter: this.form.filter,
inputFields: this.form.inputFields,
fields:this.form.fields,
remove:this.form.remove,
meta:this.form.meta,
metadataForm:{},
selectModifyForm:{},
removeFieldForm:{},
filterForm: {},
fieldFormat: {},
fieldCompress: {},
fieldType: {},
dataState: false,
fileType: [],
codingType: [],
routeState: 0,
filePathSelection: false,
localPath: {},
fileSelection: {},
fielForm: {},
};
},
created() {
this.valueFormatFun();
this.valueMetaFun();
this.formatMapperLineTerminatorFun();
this.availableCharsetsFun();
this.compressionProviderNamesFun();
},
methods: {
clickFun(graph) {
console.log(graph, 1);
this.newGraph = graph;
},
selectModifyGetTheField() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
inputOutputFields(pamerFields).then((res) => {
this.fields = res;
});
},
getTheField() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
inputOutputFields(pamerFields).then((res) => {
this.remove = res;
});
},
metadataGetTheField() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
inputOutputFields(pamerFields).then((res) => {
this.meta = res;
});
},
compressionProviderNamesFun() {
compressionProviderNames().then((res) => {
this.fieldCompress = res;
});
},
// 关闭弹框
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
formatMapperLineTerminatorFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
formatMapperLineTerminator(pamer).then((res) => {
this.fileType = res;
});
},
availableCharsetsFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
availableCharsets(pamer).then((res) => {
this.codingType = res;
});
},
addFilterBox() {
this.filterBox = !this.filterBox;
if (this.dataState) {
this.filter.push(this.filterForm);
this.$emit("filter", this.filter);
} else {
}
},
deleteField(index, rows) {
rows.splice(index, 1);
},
fieldClick(state, val) {
this.removeFieldBox = !this.removeFieldBox;
this.dataState = state;
if (state) {
this.removeFieldForm = {};
} else {
this.removeFieldForm = val;
}
},
selectModify(state, val) {
this.selectModifyBox = !this.selectModifyBox;
this.dataState = state;
if (state) {
this.selectModifyForm = {};
} else {
this.selectModifyForm = val;
}
},
metadata(state, val) {
this.metadataBox = !this.metadataBox;
this.dataState = state;
if (state) {
this.metadataForm = {};
} else {
this.metadataForm = val;
}
},
selectModifyBoxFun(){
this.selectModifyBox = !this.selectModifyBox
if (this.dataState) {
this.fields.push(this.selectModifyForm);
this.$emit("fields", this.fields);
} else {
}
},
removeFieldBoxFun(){
this.removeFieldBox = !this.removeFieldBox
if (this.dataState) {
this.remove.push(this.removeFieldForm);
this.$emit("fields", this.remove);
} else {
}
},
metadataBoxFun() {
this.metadataBox = !this.metadataBox;
if (this.dataState) {
this.meta.push(this.metadataForm);
this.$emit("meta", this.meta);
} else {
}
},
valueFormatFun() {
let pamer2 = new FormData(); // 创建form对象
pamer2.append("valueType", "all");
valueFormat(pamer2).then((res) => {
this.fieldFormat = res;
});
},
valueMetaFun() {
valueMeta().then((res) => {
this.fieldType = res;
});
},
},
};
</script>
<style lang="scss" scoped>
* {
outline: none;
}
</style>
src/views/dashboard-kettle/components/appBulletFrame/setVariable.vue 0 → 100644
<template>
<div class="customConstant">
<el-form ref="from" :model="form" label-width="120px">
<el-form-item label="步骤名称:">
<el-input v-model="form.label"></el-input>
</el-form-item>
</el-form>
<el-button type="primary" @click="fieldClick(true)">添加字段</el-button>
<el-button type="primary" @click="getTheField">获取字段</el-button>
<el-table :data="fields" style="width: 100%">
<el-table-column prop="field_name" label="字段名称"> </el-table-column>g
<el-table-column prop="variable_name" label="变量名"> </el-table-column>
<el-table-column prop="variable_type" label="变量活动类型"> </el-table-column>
<el-table-column prop="default_value" label="默认值"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, fields)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<el-dialog
title="添加字段"
:visible.sync="fieldBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="metadataForm" label-width="160px">
<el-form-item label="字段名称:">
<el-select v-model="metadataForm.field_name" style="width: 100%" clearable>
<el-option
v-for="item in fieldsName"
:key="item.index"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
<el-form-item label="变量名:">
<el-input v-model="metadataForm.variable_name"></el-input>
</el-form-item>
<el-form-item label="变量活动类型:">
<el-select v-model="metadataForm.variable_type" style="width: 100%" clearable>
<el-option
v-for="item in activityType"
:key="item.id"
:label="item.desc"
:value="item.desc"
/>
</el-select>
</el-form-item>
<el-form-item label="默认值:">
<el-input v-model="metadataForm.default_value"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="fieldBox = false">取 消</el-button>
<el-button type="primary" @click="addFieldBox">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import browseFiles from "../appBulletFrame/browseFiles";
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph;
import {
valueFormat,
valueMeta,
formatMapperLineTerminator,
availableCharsets,
compressionProviderNames,
inputOutputFields,
variableType
} from "@/api/kettle/link";
export default {
props: ["connectionNode", "form", "nodeData"], //从父组件传过来的值
components: {
browseFiles,
},
data() {
return {
newGraph: [],
fieldBox: false,
fields: this.form.fields,
metadataForm: {},
fieldFormat: {},
fieldCompress: {},
fieldType: {},
dataState: false,
fileType: [],
codingType: [],
fileSelection: {},
activityType:[],
fieldsName:[],
};
},
created() {
this.valueFormatFun();
this.valueMetaFun();
this.formatMapperLineTerminatorFun();
this.availableCharsetsFun();
this.compressionProviderNamesFun();
},
methods: {
clickFun(graph) {
console.log(graph, 1);
this.newGraph = graph;
},
getTheField() {
console.log(this.nodeData);
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
// console.log( this.graphXml,"看着了");
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
console.log(res,"yuiyuiyui");
for (let i of res){
i.field_name = i.name
}
this.fields = res;
// this.fields.field_name = res.name
});
},
compressionProviderNamesFun() {
compressionProviderNames().then((res) => {
this.fieldCompress = res;
});
},
// 关闭弹框
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
formatMapperLineTerminatorFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
formatMapperLineTerminator(pamer).then((res) => {
this.fileType = res;
});
},
availableCharsetsFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
availableCharsets(pamer).then((res) => {
this.codingType = res;
});
},
deleteField(index, rows) {
rows.splice(index, 1);
},
fieldClick(state, val) {
this.fieldBox = !this.fieldBox;
this.dataState = state;
let type = new FormData(); // 创建form对象
type.append("query", "");
variableType(type).then(res=>{
this.activityType = res
})
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
console.log(res,"kanzzhelia ");
this.fieldsName = res;
});
if (state) {
this.metadataForm = {};
} else {
this.metadataForm = val;
}
},
addFieldBox() {
this.fieldBox = !this.fieldBox;
if (this.dataState) {
this.fields.push(this.metadataForm);
this.$emit("fields", this.fields);
} else {
}
},
valueFormatFun() {
let pamer2 = new FormData(); // 创建form对象
pamer2.append("valueType", "all");
valueFormat(pamer2).then((res) => {
this.fieldFormat = res;
});
},
valueMetaFun() {
valueMeta().then((res) => {
this.fieldType = res;
});
},
},
};
</script>
<style lang="scss" scoped>
* {
outline: none;
}
</style>
src/views/dashboard-kettle/components/appBulletFrame/sortRecord.vue 0 → 100644
<template>
<div class="customConstant">
<el-form ref="from" :model="form" label-width="120px">
<el-form-item label="步骤名称:">
<el-input v-model="form.label"></el-input>
</el-form-item>
</el-form>
<el-form ref="form" :model="fileSelection" label-width="200px">
<el-form-item label="排序目录:">
<el-row :gutter="10">
<el-col :span="21">
<el-input v-model="fileSelection.directory"></el-input>
</el-col>
<el-col class="line" :span="2">
<el-button size="mini" @click="selectFilePath()"
>浏览</el-button
></el-col
>
</el-row>
</el-form-item>
<el-form-item label="临时文件前缀:">
<el-input v-model="fileSelection.prefix"></el-input>
</el-form-item>
<el-form-item label="排序缓存大小(内存里存放的记录数):">
<el-input v-model="fileSelection.sort_size"></el-input>
</el-form-item>
<el-form-item label="未使用内存限值 (%):">
<el-input v-model="fileSelection.excludeFileMask"></el-input>
</el-form-item>
<el-form-item label="压缩临时文件?:">
<el-checkbox
v-model="fileSelection.compress"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
<el-form-item label="仅仅传递非重复的记录?:">
<el-checkbox
v-model="fileSelection.unique_rows"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
</el-form>
<el-card class="box-card">
<el-button type="primary" @click="fieldClick(true)">添加字段</el-button>
<el-button type="primary" @click="getTheField">获取字段</el-button>
<el-table :data="fields" style="width: 100%">
<el-table-column prop="name" label="字段名称"> </el-table-column>g
<el-table-column prop="ascending" label="升降"> </el-table-column>
<el-table-column prop="case_sensitive" label="大小写敏感"> </el-table-column>
<el-table-column prop="presorted" label="Presorted"> </el-table-column>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, fields)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-card>
<el-dialog
title="添加字段"
:visible.sync="fieldBox"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="metadataForm" label-width="160px">
<el-form-item label="字段名称:">
<el-select v-model="metadataForm.name" style="width: 100%" clearable>
<el-option
v-for="item in fieldsName"
:key="item.index"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
<el-form-item label="升降:">
<el-select v-model="metadataForm.ascending" style="width: 100%" clearable>
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
<el-form-item label="大小写敏感:">
<el-select
v-model="metadataForm.case_sensitive"
style="width: 100%"
clearable
>
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
<el-form-item label="Presorted:">
<el-select
v-model="metadataForm.presorted"
style="width: 100%"
clearable
>
<el-option label="是" value="Y"></el-option>
<el-option label="否" value="N"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="fieldBox = false">取 消</el-button>
<el-button type="primary" @click="addFieldBox">确 定</el-button>
</span>
</el-dialog>
<!-- 文件浏览器-->
<el-dialog
title="文件浏览器"
:visible.sync="filePathSelection"
width="500px"
:before-close="handleClose"
:modal="false"
>
<browseFiles :disabed="true" v-on:route="route"></browseFiles>
<span slot="footer" class="dialog-footer">
<el-button @click="filePathSelection = false">取 消</el-button>
<el-button type="primary" @click="addFilePathSelection"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
import browseFiles from "../appBulletFrame/browseFiles";
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph;
import {
valueFormat,
valueMeta,
formatMapperLineTerminator,
availableCharsets,
compressionProviderNames,
inputOutputFields,
} from "@/api/kettle/link";
export default {
props: ["connectionNode", "form", "nodeData"], //从父组件传过来的值
components: {
browseFiles,
},
data() {
return {
newGraph: [],
fileBox: false,
filterBox: false,
fieldBox: false,
fields: this.form.fields,
metadataForm: {},
filterForm: {},
fieldFormat: {},
fieldCompress: {},
fieldType: {},
dataState: false,
fileType: [],
codingType: [],
routeState: 0,
filePathSelection: false,
localPath: {},
fileSelection: this.form,
fielForm: {},
fieldsName:[],
};
},
created() {
this.valueFormatFun();
this.valueMetaFun();
this.formatMapperLineTerminatorFun();
this.availableCharsetsFun();
this.compressionProviderNamesFun();
console.log(this.form,79879798798);
},
methods: {
selectFilePath() {
this.filePathSelection = !this.filePathSelection;
},
clickFun(graph) {
console.log(graph, 1);
this.newGraph = graph;
},
getTheField() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
this.fields = res;
});
},
addFilePathSelection() {
this.filePathSelection = !this.filePathSelection;
this.fileSelection.directory = this.localPath.directory;
},
route(flowData) {
this.localPath.fileName = flowData.name;
console.log(this.localPath);
},
selectFilePath(tsate) {
this.routeState = tsate;
this.filePathSelection = !this.filePathSelection;
},
compressionProviderNamesFun() {
compressionProviderNames().then((res) => {
this.fieldCompress = res;
});
},
// 关闭弹框
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
formatMapperLineTerminatorFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
formatMapperLineTerminator(pamer).then((res) => {
this.fileType = res;
});
},
availableCharsetsFun() {
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
availableCharsets(pamer).then((res) => {
this.codingType = res;
});
},
deleteField(index, rows) {
rows.splice(index, 1);
},
fieldClick(state, val) {
this.fieldBox = !this.fieldBox;
this.dataState = state;
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
console.log(res,"kanzzhelia ");
this.fieldsName = res;
});
if (state) {
this.metadataForm = {};
} else {
this.metadataForm = val;
}
},
addFieldBox() {
this.fieldBox = !this.fieldBox;
console.log(this.metadataForm, "看看看");
if (this.dataState) {
this.fields.push(this.metadataForm);
this.$emit("fields", this.fields);
} else {
}
},
valueFormatFun() {
let pamer2 = new FormData(); // 创建form对象
pamer2.append("valueType", "all");
valueFormat(pamer2).then((res) => {
this.fieldFormat = res;
});
},
valueMetaFun() {
valueMeta().then((res) => {
this.fieldType = res;
});
},
},
};
</script>
<style lang="scss" scoped>
* {
outline: none;
}
</style>
src/views/dashboard-kettle/components/designer/modules/node_menu.vue
......@@ -87,7 +87,8 @@ export default {
data() {
return {
// prefix:'http://192.168.0.2:9700/etlweb/',
prefix:`http://147.1.3.180:9888/ETLWEB-SERVER/etlweb/`,
// prefix:`http://147.1.3.180:9888/ETLWEB-SERVER/etlweb/`,
prefix:`http://192.168.0.44:9888/ETLWEB-SERVER/etlweb/`,
// 测试数据开始=====
jobTreeList: [
{
......
src/views/dashboard-kettle/components/designer/mxgraphDesigner.vue
......@@ -4,6 +4,8 @@
<el-row>
<!--顶部工具菜单-->
<el-col :span="24">
{{ this.$parent.nodeTypa }}
<div class="ef-tooltar">
<el-link type="primary" :underline="false">{{
flowData.name
......@@ -112,7 +114,11 @@
<el-tab-pane label="文件" name="file">
<el-form ref="form" :model="form" label-width="120px">
<el-form-item label="表格类(引擎):">
<el-select v-model="form.spreadsheet_type" style="width: 100%" clearable>
<el-select
v-model="form.spreadsheet_type"
style="width: 100%"
clearable
>
<el-option
v-for="item in engine"
:key="item.code"
......@@ -125,7 +131,6 @@
<el-button size="small" type="primary" @click="selectFilePath(1)"
>选择文件</el-button
>
<el-card class="box-card">
<el-table :data="file" style="width: 100%">
......@@ -171,7 +176,6 @@
v-model="form.accept_filenames"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
<el-form-item label="从哪个步骤读文件名:">
......@@ -179,11 +183,12 @@
v-model="form.accept_stepname"
style="width: 100%"
:disabled="
!form.accept_filenames || form.accept_filenames == 'N'"
@click.native="lastStep" clearable
!form.accept_filenames || form.accept_filenames == 'N'
"
@click.native="lastStep"
clearable
>
<el-option
v-for="item in connectionNode"
:key="item.id"
:label="item.name"
......@@ -199,12 +204,15 @@
:disabled="
!form.accept_filenames || form.accept_filenames == 'N'
"
@click.native="previousField" clearable
@click.native="previousField"
clearable
>
<el-option v-for="item in getField"
:key="item.id"
:label="item.name"
:value="item"></el-option>
<el-option
v-for="item in getField"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select>
</el-form-item>
</el-form>
......@@ -275,7 +283,12 @@
</el-form-item>
<el-form-item label="编码:">
<el-select v-model="form.encoding" filterable style="width: 100%" clearable>
<el-select
v-model="form.encoding"
filterable
style="width: 100%"
clearable
>
<el-option
v-for="item in codingType"
:key="item.index"
......@@ -448,7 +461,9 @@
</el-tab-pane>
<el-tab-pane label="字段" name="field">
<el-button type="primary" @click="fieldClick(true)">添加字段</el-button>
<el-button type="primary" @click="fieldClick(true)"
>添加字段</el-button
>
<el-button type="primary" @click="getTheField">获取字段</el-button>
<el-table :data="fields" style="width: 100%">
......@@ -701,20 +716,17 @@
>
<tableInput
:disabled="true"
:form="form"
:form="form"
:graphXml="graphXml"
:nodeData="nodeData"
ref="tableInputDialog"
>
</tableInput>
<span slot="footer" class="dialog-footer">
<el-button @click="TableInputDialog = false">取 消</el-button>
<el-button type="info" @click="dataFlowFun" >浏览</el-button>
<el-button type="primary" @click="TableInputDialogFun"
>确 定</el-button
>
<el-button type="info" @click="dataFlowFun">浏览</el-button>
<el-button type="primary" @click="TableInputDialogFun">确 定</el-button>
</span>
</el-dialog>
......@@ -725,33 +737,34 @@
width="800px"
:before-close="handleClose"
>
<getSystemInformation ref="SystemInfoDialog" :disabled="true" :form="form"> </getSystemInformation>
<getSystemInformation
ref="SystemInfoDialog"
:disabled="true"
:form="form"
>
</getSystemInformation>
<span slot="footer" class="dialog-footer">
<el-button @click="SystemInfoDialog = false">取 消</el-button>
<el-button type="primary" @click="SystemInfoDialogFun"
>确 定</el-button
>
<el-button type="primary" @click="SystemInfoDialogFun">确 定</el-button>
</span>
</el-dialog>
<!-- 自定义常量数据-->
<el-dialog
title="自定义常量数据"
:visible.sync="ConstantDialog"
width="800px"
:before-close="handleClose"
>
<customConstant ref="ConstantDialog" :disabled="true" :form="form"> </customConstant>
<customConstant ref="ConstantDialog" :disabled="true" :form="form">
</customConstant>
<span slot="footer" class="dialog-footer">
<el-button @click="ConstantDialog = false">取 消</el-button>
<el-button type="primary" @click="ConstantDialogFun"
>确 定</el-button
>
<el-button type="primary" @click="ConstantDialogFun">确 定</el-button>
</span>
</el-dialog>
<!-- 自定义常量数据弹窗 -->
......@@ -764,7 +777,8 @@
width="800px"
:before-close="handleClose"
>
<randomNumber ref="RandomValueDialog" :disabled="true" :form="form"> </randomNumber>
<randomNumber ref="RandomValueDialog" :disabled="true" :form="form">
</randomNumber>
<span slot="footer" class="dialog-footer">
<el-button @click="RandomValueDialog = false">取 消</el-button>
......@@ -781,7 +795,11 @@
width="800px"
:before-close="handleClose"
>
<generatingRecords ref="RowGeneratorDialog" :disabed="true" :form="form"></generatingRecords>
<generatingRecords
ref="RowGeneratorDialog"
:disabed="true"
:form="form"
></generatingRecords>
<span slot="footer" class="dialog-footer">
<el-button @click="RowGeneratorDialog = false">取 消</el-button>
......@@ -799,7 +817,7 @@
:before-close="handleClose"
>
<textFileInput
ref="TextFileInputDialog"
ref="TextFileInputDialog"
:disabed="true"
:connectionNode="connectionNode"
:form="form"
......@@ -815,6 +833,144 @@
</span>
</el-dialog>
<!-- 排序记录-->
<el-dialog
title="排序记录"
:visible.sync="sortRecordDialog"
width="800px"
:before-close="handleClose"
>
<sortRecord
ref="sortRecordDialog"
:disabed="true"
:form="form"
:nodeData="nodeData"
></sortRecord>
<span slot="footer" class="dialog-footer">
<el-button @click="sortRecordDialog = false">取 消</el-button>
<el-button type="primary" @click="sortRecordDialogFun">确 定</el-button>
</span>
</el-dialog>
<!-- 设置变量-->
<el-dialog
title="设置变量"
:visible.sync="setVariableDialog"
width="800px"
:before-close="handleClose"
>
<setVariable
ref="setVariableDialog"
:disabed="true"
:form="form"
:nodeData="nodeData"
></setVariable>
<span slot="footer" class="dialog-footer">
<el-button @click="setVariableDialog = false">取 消</el-button>
<el-button type="primary" @click="setVariableDialogFun"
>确 定</el-button
>
</span>
</el-dialog>
<!-- 获取变量-->
<el-dialog
title="获取变量"
:visible.sync="getVariableDialog"
width="800px"
:before-close="handleClose"
>
<setVariable
ref="getVariableDialog"
:disabed="true"
:form="form"
:nodeData="nodeData"
></setVariable>
<span slot="footer" class="dialog-footer">
<el-button @click="getVariableDialog = false">取 消</el-button>
<el-button type="primary" @click="getVariableDialogFun"
>确 定</el-button
>
</span>
</el-dialog>
<!-- 合并记录-->
<el-dialog
title="合并行（比较）"
:visible.sync="mergeRecordsDialog"
width="800px"
:before-close="handleClose"
>
<mergeRecords
ref="mergeRecordsDialog"
:disabed="true"
:form="form"
:nodeData="nodeData"
></mergeRecords>
<span slot="footer" class="dialog-footer">
<el-button @click="mergeRecordsDialog = false">取 消</el-button>
<el-button type="primary" @click="mergeRecordsDialogFun"
>确 定</el-button
>
</span>
</el-dialog>
<!-- 改变开始复制的数量 -->
<el-dialog
title="改变开始复制的数量"
:visible.sync="copyNumber"
width="300px"
:before-close="handleClose"
>
<el-form ref="form" :model="form" >
<el-form-item label="复制的数量（1或跟多）:">
<el-input v-model="form.copies"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="copyNumber = false">取 消</el-button>
<el-button type="primary" @click="copyNumberFun">确 定</el-button>
</span>
</el-dialog>
<!-- 字段选择-->
<el-dialog
title="选择/改名值"
:visible.sync="selectFieldDialog"
width="800px"
:before-close="handleClose"
>
<selectField
ref="selectFieldDialog"
:disabed="true"
:form="form"
:nodeData="nodeData"
></selectField>
<span slot="footer" class="dialog-footer">
<el-button @click="selectFieldDialog = false">取 消</el-button>
<el-button type="primary" @click="selectFieldDialogFun"
>确 定</el-button
>
</span>
</el-dialog>
<!-- 文件浏览器-->
<el-dialog
title="文件浏览器"
......@@ -826,10 +982,9 @@
<span slot="footer" class="dialog-footer">
<el-button @click="filePathSelection = false">取 消</el-button>
<el-button type="primary" @click="addFilePathSelection"
<el-button type="primary" @click="addFilePathSelection"
>确 定</el-button
>
</span>
</el-dialog>
......@@ -840,7 +995,7 @@
:graph.sync="graph"
:doubleClickCell="doubleClickCell"
:getXmlVal="getXmlVal"
@fathertrans="fathertrans"
@fathertrans="fathertrans"
:saveOutputDialog="saveOutputDialog"
:tableOutFormSend="outPutFormData1"
></outDialog>
......@@ -861,25 +1016,28 @@
></excelOutPutDialog>
<updateDialog
ref="update"
:updateVisible.sync="updateVisible"
:updateVisible.sync="updateVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
:updateFormSend="outPutFormData4"
:getXmlVal="getXmlVal"></updateDialog>
:getXmlVal="getXmlVal"
></updateDialog>
<synDialog
ref="syn"
:synVisible.sync="synVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
:synFormSend="outPutFormData5"
:getXmlVal="getXmlVal"></synDialog>
:getXmlVal="getXmlVal"
></synDialog>
<delDialog
ref="del"
:deleteVisible.sync="deleteVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
:deleteFormSend="outPutFormData6"
:getXmlVal="getXmlVal"></delDialog>
:getXmlVal="getXmlVal"
></delDialog>
<sqlDialog
ref="sql"
:sqlVisible.sync="sqlVisible"
......@@ -890,15 +1048,55 @@
<textFileDialog
ref="textFile"
:fileVisible.sync="fileVisible"
:getXmlVal="getXmlVal" :saveOutputDialog="saveOutputDialog" :textFileForm="outPutFormData8" :doubleClickCell="doubleClickCell"></textFileDialog>
<microDialog ref="mic" :microVisible.sync="microVisible" :saveOutputDialog="saveOutputDialog" :microForm="outPutFormData9" :doubleClickCell="doubleClickCell"></microDialog>
:getXmlVal="getXmlVal"
:saveOutputDialog="saveOutputDialog"
:textFileForm="outPutFormData8"
:doubleClickCell="doubleClickCell"
></textFileDialog>
<microDialog
ref="mic"
:microVisible.sync="microVisible"
:saveOutputDialog="saveOutputDialog"
:microForm="outPutFormData9"
:doubleClickCell="doubleClickCell"
></microDialog>
<!-- 输出弹窗end================== -->
<!-- 作业弹窗组件start----------------------------------->
<trans ref="mytrans" :jobTransVisible.sync="myjobTransVisible" :saveOutputDialog="saveOutputDialog" :jobTransFormSend="outPutFormData13" :doubleClickCell="doubleClickCell"></trans>
<homeworkDialog ref="myhomework" :jobHomeworkVisible.sync="jobHomeworkVisible" :saveOutputDialog="saveOutputDialog" :jobWorkFormSend="outPutFormData11" :doubleClickCell="doubleClickCell"></homeworkDialog>
<setvalue ref="mySet" :jobSetVisible.sync="jobSetVisible" :saveOutputDialog="saveOutputDialog" :setFormSend="outPutFormData12" :doubleClickCell="doubleClickCell"></setvalue>
<startDialog ref="myStart" :jobStartVisible.sync="jobStartVisible" :saveOutputDialog="saveOutputDialog" :startFormSend="outPutFormData10" :doubleClickCell="doubleClickCell"></startDialog>
<successDialog ref="mySuccess" :jobSuccessVisible.sync="jobSuccessVisible" :saveOutputDialog="saveOutputDialog" :successFormSend="outPutFormData14" :doubleClickCell="doubleClickCell"></successDialog>
<trans
ref="mytrans"
:jobTransVisible.sync="myjobTransVisible"
:saveOutputDialog="saveOutputDialog"
:jobTransFormSend="outPutFormData13"
:doubleClickCell="doubleClickCell"
></trans>
<homeworkDialog
ref="myhomework"
:jobHomeworkVisible.sync="jobHomeworkVisible"
:saveOutputDialog="saveOutputDialog"
:jobWorkFormSend="outPutFormData11"
:doubleClickCell="doubleClickCell"
></homeworkDialog>
<setvalue
ref="mySet"
:jobSetVisible.sync="jobSetVisible"
:saveOutputDialog="saveOutputDialog"
:setFormSend="outPutFormData12"
:doubleClickCell="doubleClickCell"
></setvalue>
<startDialog
ref="myStart"
:jobStartVisible.sync="jobStartVisible"
:saveOutputDialog="saveOutputDialog"
:startFormSend="outPutFormData10"
:doubleClickCell="doubleClickCell"
></startDialog>
<successDialog
ref="mySuccess"
:jobSuccessVisible.sync="jobSuccessVisible"
:saveOutputDialog="saveOutputDialog"
:successFormSend="outPutFormData14"
:doubleClickCell="doubleClickCell"
></successDialog>
<!-- 作业弹窗组件end------------------------------------->
<!-- 转换弹窗组件start333 ------------------------------>
......@@ -907,29 +1105,34 @@
:switchVisible.sync="switchVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
:switchFormSend="outPutFormData15"></switchDialog>
:switchFormSend="outPutFormData15"
></switchDialog>
<!-- 转换弹窗组件end33333------------------------------ -->
<!-- 执行转换开始 -->
<trans-graph
ref="transRef"
ref="transRef"
:transGraphVisible.sync="transGraphVisible"
:getXmlVal="getXmlVal"
></trans-graph>
<!-- 执行转换结束 -->
<!-- 子服务器开始 -->
<server-dialog ref="myServer" :serverDialogVisible.sync="serverDialogVisible" ></server-dialog>
<server-dialog
ref="myServer"
:serverDialogVisible.sync="serverDialogVisible"
></server-dialog>
<!-- 子服务器结束 -->
<!-- 执行作业开始 -->
<job-run ref="jobRun" :jobRunVisible.sync="jobRunVisible" :saveOutputDialog="saveOutputDialog" :doubleClickCell="doubleClickCell"></job-run>
<job-run
ref="jobRun"
:jobRunVisible.sync="jobRunVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
></job-run>
<!-- 执行作业结束 -->
<!-- 数据浏览-->
<el-dialog
title="数据浏览"
......@@ -937,21 +1140,15 @@
width="1000px"
:before-close="handleClose"
>
<el-table :data="dataBrowsing" border style="width: 100%" height="600">
<el-table-column
v-for="item in dataField"
:key="item.index"
:label="item.header"
:prop="item.header"
>
</el-table-column>
</el-table>
<el-table :data="dataBrowsing" border style="width: 100%" height="600">
<el-table-column
v-for="item in dataField"
:key="item.index"
:label="item.header"
:prop="item.header"
>
</el-table-column>
</el-table>
</el-dialog>
</div>
</template>
......@@ -967,11 +1164,11 @@ import {
availableCharsets,
valueFormat,
valueMeta,
save,//保存转换的流程图
saveJob,//保存作业的流程图
save, //保存转换的流程图
saveJob, //保存作业的流程图
newStep,
newJobEntry,
previewData
previewData,
} from "@/api/kettle/link";
// 输入弹窗
import tableInput from "../appBulletFrame/tableInput";
......@@ -994,6 +1191,13 @@ import textFileDialog from "../../../output-dialog/text-file-output";
import microDialog from "../../../output-dialog/micro-excel";
// 输出弹窗end********************************************
import sortRecord from "../appBulletFrame/sortRecord"; //排序记录
import setVariable from "../appBulletFrame/setVariable"; //设置变量
import getVariable from "../appBulletFrame/getVariable"; //获取变量
import mergeRecords from "../appBulletFrame/mergeRecords"; //合并记录
import selectField from "../appBulletFrame/selectField"; //选择字段
// 作业弹窗组件开始---------------------------------------
import trans from "../../../job-dialog/trans";
import setvalue from "../../../job-dialog/set-value";
......@@ -1031,40 +1235,39 @@ export default {
// },
// },
name: "mxgraphDesigner",
props: ["blankCanvas"], //从父组件传过来的值
data() {
return {
jobRunVisible:false,//作业转换弹窗
serverDialogVisible:false,//子服务器弹窗
curFileType:"transformation",//当前点击的文件的类型，默认是转换文件--mxl
nodeData:[],
dataBrowsing:[],
dataField:[],
dataFlow:false,
myoutPutFormData:{},
outPutFormData1:{},
outPutFormData2:{},
outPutFormData3:{},
outPutFormData4:{},
outPutFormData5:{},
outPutFormData6:{},
outPutFormData7:{},
outPutFormData8:{},
outPutFormData9:{},
outPutFormData10:{},//作业---start
outPutFormData11:{},//作业---作业
outPutFormData12:{},//作业---设置变量
outPutFormData13:{},//作业---转换
outPutFormData14:{},//作业---成功
outPutFormData:{},//输出弹窗组件的表单值
copyNumber:false,//复制数量
jobRunVisible: false, //作业转换弹窗
serverDialogVisible: false, //子服务器弹窗
curFileType: "transformation", //当前点击的文件的类型，默认是转换文件--mxl
nodeData: [],
dataBrowsing: [],
dataField: [],
dataFlow: false,
myoutPutFormData: {},
outPutFormData1: {},
outPutFormData2: {},
outPutFormData3: {},
outPutFormData4: {},
outPutFormData5: {},
outPutFormData6: {},
outPutFormData7: {},
outPutFormData8: {},
outPutFormData9: {},
outPutFormData10: {}, //作业---start
outPutFormData11: {}, //作业---作业
outPutFormData12: {}, //作业---设置变量
outPutFormData13: {}, //作业---转换
outPutFormData14: {}, //作业---成功
outPutFormData: {}, //输出弹窗组件的表单值
// 转换33start---------
outPutFormData15:{},//转换--字段选择
outPutFormData15: {}, //转换--字段选择
// 转换3end------------
doubleClickCell:{},
getField:[],
transGraphVisible:false,//执行转换弹窗
getField: [],
transGraphVisible: false, //执行转换弹窗
monitorCanvas: "", //监听画布
getXmlVal: "", //获取上一个xml
keyHandler: null,
......@@ -1073,9 +1276,8 @@ export default {
xmlDocuments: "", //获取解码的xml
boxInformation: "", //弹框信息
toolItemData: {}, //新增节点时的值
doubleClickCell: {}, //双击节点
filter:{},
doubleClickCell:{}, //双击节点
filter: {},
// mxl=================================
InsertOrUpdateVisible: false,
......@@ -1089,15 +1291,23 @@ export default {
microVisible: false,
// mxl=================================
// 作业弹窗组件数据start-------
jobStartVisible:false,
jobDummyVisible:false,
jobHomeworkVisible:false,
jobSetVisible:false,
myjobTransVisible:false,
jobSuccessVisible:false,
jobStartVisible: false,
jobDummyVisible: false,
jobHomeworkVisible: false,
jobSetVisible: false,
myjobTransVisible: false,
jobSuccessVisible: false,
// 作业弹窗组件数据end----------
//
sortRecordDialog: false, //排序记录
setVariableDialog: false, //设置变量
getVariableDialog: false, //获取变量
mergeRecordsDialog: false, //合并记录
selectFieldDialog:false,//选择字段
// 流程弹窗组件start----------
switchVisible:false,
switchVisible: false,
// 流程弹窗组件end------------
// 输入模块
......@@ -1125,9 +1335,7 @@ export default {
fieldType: [],
fieldFormat: [],
fields: [
],
fields: [],
engine: [],
// 画布模块
......@@ -1163,7 +1371,6 @@ export default {
components: {
tableInput,
draggable,
getSystemInformation,
generatingRecords,
customConstant,
......@@ -1188,6 +1395,12 @@ export default {
startDialog,
successDialog,
homeworkDialog,
//
sortRecord, //排序记录
setVariable, //设置变量
getVariable, //获取变量
mergeRecords, //合并记录
selectField,//选择字段
// 作业弹簧组件end----------------------
// 转换弹窗组件start---------
switchDialog,
......@@ -1254,8 +1467,8 @@ export default {
this.initToolbar();
this.initGraph();
console.log(this.blankCanvas, 7987987987);
this.$refs.container.style.background = 'url("./mxgraph/images/grid.gif")';
this.$parent.dtads();
},
// filters: {
......@@ -1266,33 +1479,32 @@ export default {
// },
methods: {
setShowXml() {
setShowXml() {
this.graph.getModel().beginUpdate();
try {
var doc = mxUtils.parseXml(decodeURIComponent(this.blankCanvas));
var codec = new mxCodec(doc);
var style = new Object();
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
style[mxConstants.STYLE_IMAGE] = 'editors/images/bigicon/start_event_empty.png';
style[mxConstants.STYLE_IMAGE_WIDTH] = '48';
style[mxConstants.STYLE_IMAGE_HEIGHT] = '48';
style[mxConstants.STYLE_FONTCOLOR] = '#000000';
style[mxConstants.STYLE_VERTICAL_LABEL_POSITION] = mxConstants.ALIGN_CENTER;
this.graph.getStylesheet().putCellStyle('start-s', style);
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
style[mxConstants.STYLE_IMAGE] =
"editors/images/bigicon/start_event_empty.png";
style[mxConstants.STYLE_IMAGE_WIDTH] = "48";
style[mxConstants.STYLE_IMAGE_HEIGHT] = "48";
style[mxConstants.STYLE_FONTCOLOR] = "#000000";
style[mxConstants.STYLE_VERTICAL_LABEL_POSITION] =
mxConstants.ALIGN_CENTER;
this.graph.getStylesheet().putCellStyle("start-s", style);
codec.decode(doc.documentElement, this.graph.getModel());
} finally {
this.graph.getModel().endUpdate();
}
},
getTheField(){
this.form.file = JSON.stringify(this.file)
for (let name in this.form) {
getTheField() {
this.form.file = JSON.stringify(this.file);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
......@@ -1300,26 +1512,28 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
);
this.graph.getModel().execute(edit);
}
var enc = new mxCodec(mxUtils.createXmlDocument());
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.graph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
console.log(this.graphXml,"获取字段");
let pamerFields = new FormData(); // 创建form对象
pamerFields.append("stepName", this.nodeData.value.attributes.label.value)
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", false);
inputOutputFields(pamerFields).then((res) => {
this.fields = res
});
},
console.log(this.graphXml, "获取字段");
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", false);
inputOutputFields(pamerFields).then((res) => {
this.fields = res;
});
},
dataFlowFun(){
this.dataFlow =!this.dataFlow
dataFlowFun() {
this.dataFlow = !this.dataFlow;
for (let name in this.form) {
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
......@@ -1337,12 +1551,12 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
pmer.append("stepName", this.nodeData.value.attributes.label.value);
pmer.append("rowLimit", this.$refs.tableInputDialog.form.limit);
previewData(pmer).then(res =>{
this.dataField = res.columns
this.dataBrowsing = res.firstRecords
})
previewData(pmer).then((res) => {
this.dataField = res.columns;
this.dataBrowsing = res.firstRecords;
});
},
setXml() {
this.graph.getModel().beginUpdate();
try {
......@@ -1353,11 +1567,26 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
} finally {
this.graph.getModel().endUpdate();
}
},
TableInputDialogFun() {
this.TableInputDialog = !this.TableInputDialog;
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
TableInputDialogFun(){
this.TableInputDialog = !this.TableInputDialog
ConstantDialogFun() {
this.ConstantDialog = !this.ConstantDialog;
console.log(this.$refs.ConstantDialog.data, "asghaksghk");
console.log(this.$refs.ConstantDialog.fields, "asghaksghk");
this.form.data = JSON.stringify(this.$refs.ConstantDialog.data);
this.form.fields = JSON.stringify(this.$refs.ConstantDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
......@@ -1368,12 +1597,10 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
}
},
ConstantDialogFun(){
this.ConstantDialog = !this.ConstantDialog
console.log(this.$refs.ConstantDialog.data,'asghaksghk');
console.log(this.$refs.ConstantDialog.fields,'asghaksghk');
this.form.data = JSON.stringify(this.$refs.ConstantDialog.data)
this.form.fields = JSON.stringify(this.$refs.ConstantDialog.fields)
SystemInfoDialogFun() {
this.SystemInfoDialog = !this.SystemInfoDialog;
console.log(this.$refs.SystemInfoDialog.fields, 456753275328);
this.form.fields = JSON.stringify(this.$refs.SystemInfoDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
......@@ -1384,10 +1611,11 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
}
},
SystemInfoDialogFun(){
this.SystemInfoDialog = !this.SystemInfoDialog
console.log(this.$refs.SystemInfoDialog.fields,456753275328);
this.form.fields = JSON.stringify(this.$refs.SystemInfoDialog.fields)
RandomValueDialogFun() {
this.RandomValueDialog = !this.RandomValueDialog;
console.log(this.$refs.RandomValueDialog.fields, 4564654654);
this.form.fields = JSON.stringify(this.$refs.RandomValueDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
......@@ -1398,11 +1626,39 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
}
},
RandomValueDialogFun(){
this.RandomValueDialog = !this.RandomValueDialog
RowGeneratorDialogFun() {
this.RowGeneratorDialog = !this.RowGeneratorDialog;
console.log(this.$refs.RowGeneratorDialog.fields, 4564654654);
this.form.fields = JSON.stringify(this.$refs.RowGeneratorDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
selectFieldDialogFun(){
this.selectFieldDialog = !this.selectFieldDialog
this.form.fields = JSON.stringify(this.$refs.selectFieldDialog.fields);
this.form.remove = JSON.stringify(this.$refs.selectFieldDialog.remove);
this.form.meta = JSON.stringify(this.$refs.selectFieldDialog.meta);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
console.log(this.$refs.RandomValueDialog.fields,4564654654);
this.form.fields = JSON.stringify(this.$refs.RandomValueDialog.fields)
mergeRecordsDialogFun() {
this.mergeRecordsDialog = !this.mergeRecordsDialog;
this.form.keys = JSON.stringify(this.$refs.mergeRecordsDialog.keys);
this.form.values = JSON.stringify(this.$refs.mergeRecordsDialog.values);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
......@@ -1413,26 +1669,25 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
}
},
RowGeneratorDialogFun(){
this.RowGeneratorDialog = !this.RowGeneratorDialog
console.log(this.$refs.RowGeneratorDialog.fields,4564654654);
this.form.fields = JSON.stringify(this.$refs.RowGeneratorDialog.fields)
copyNumberFun(){
console.log(this.form,"数据");
this.copyNumber = !this.copyNumber
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
this.form = []
},
TextFileInputDialogFun(){
this.TextFileInputDialog = !this.TextFileInputDialogFun
this.form.filter = JSON.stringify(this.$refs.TextFileInputDialog.filter)
this.form.inputFields = JSON.stringify(this.$refs.TextFileInputDialog.inputFields)
this.form.fileNameStore = JSON.stringify(this.$refs.TextFileInputDialog.fileNameStore)
for (let name in this.form) {
getVariableDialogFun() {
this.getVariableDialog = !this.getVariableDialog;
this.form.fields = JSON.stringify(this.$refs.getVariableDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
......@@ -1440,7 +1695,50 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
);
this.graph.getModel().execute(edit);
}
},
setVariableDialogFun() {
this.setVariableDialog = !this.setVariableDialog;
this.form.fields = JSON.stringify(this.$refs.setVariableDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
sortRecordDialogFun() {
this.sortRecordDialog = !this.sortRecordDialog;
this.form.fields = JSON.stringify(this.$refs.sortRecordDialog.fields);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
TextFileInputDialogFun() {
this.TextFileInputDialog = !this.TextFileInputDialog;
this.form.filter = JSON.stringify(this.$refs.TextFileInputDialog.filter);
this.form.inputFields = JSON.stringify(
this.$refs.TextFileInputDialog.inputFields
);
this.form.fileNameStore = JSON.stringify(
this.$refs.TextFileInputDialog.fileNameStore
);
for (let name in this.form) {
var edit = new mxCellAttributeChange(
this.nodeData,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
excelLnputDetermine() {
......@@ -1449,7 +1747,7 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
this.form.file = JSON.stringify(this.file);
this.form.sheets = JSON.stringify(this.sheets);
this.form.fields = JSON.stringify(this.fields);
console.log(this.form,456);
console.log(this.form, 456);
// this.fields()
for (let name in this.form) {
var edit = new mxCellAttributeChange(
......@@ -1536,10 +1834,8 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
addFilePathSelection() {
this.filePathSelection = !this.filePathSelection;
if (this.routeState == 1) {
this.localPath.include_subfolders = "N"
this.localPath.include_subfolders = "N";
this.file.push(this.localPath);
} else if (this.routeState == 2) {
this.form.bad_line_files_destination_directory = this.localPath.name;
} else if (this.routeState == 3) {
......@@ -1562,12 +1858,12 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
task() {
let domArr = document.querySelectorAll('[key-id="123"]');
this.createGraph();
this.initToolbar();
this.initToolbar();
},
// 回显重新实现拖拽左边工具栏到右边
initGraphClick(type){
initGraphClick(type) {
let domArr = document.querySelectorAll('[key-id="123"]');
this.curFileType=type;
this.curFileType = type;
// this.createGraph();
this.initToolbar();
// this.initGraph();
......@@ -1602,38 +1898,37 @@ this.graph.getStylesheet().putCellStyle('start-s', style);
return mxUtils.getPrettyXml(node);
},
lastStep(){
var enc = new mxCodec(mxUtils.createXmlDocument());
lastStep() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.graph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerSteps = new FormData(); // 创建form对象
pamerSteps.append("stepName", this.nodeData.value.attributes.label.value);
pamerSteps.append("graphXml", this.graphXml);
pamerSteps.append("query", "");
previousSteps(pamerSteps).then((res) => {
this.connectionNode = res
});
},
let pamerSteps = new FormData(); // 创建form对象
pamerSteps.append("stepName", this.nodeData.value.attributes.label.value);
pamerSteps.append("graphXml", this.graphXml);
pamerSteps.append("query", "");
previousSteps(pamerSteps).then((res) => {
this.connectionNode = res;
});
},
previousField(){
var enc = new mxCodec(mxUtils.createXmlDocument());
previousField() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.graph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFields = new FormData(); // 创建form对象
pamerFields.append("stepName", this.nodeData.value.attributes.label.value)
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
this.getField = res
});
},
let pamerFields = new FormData(); // 创建form对象
pamerFields.append(
"stepName",
this.nodeData.value.attributes.label.value
);
pamerFields.append("graphXml", this.graphXml);
pamerFields.append("before", true);
pamerFields.append("query", "");
inputOutputFields(pamerFields).then((res) => {
this.getField = res;
});
},
//初始化画布
initGraph() {
......@@ -1642,22 +1937,22 @@ previousField(){
}
// var node = mxUtils.load(this.etlWeb+'mxgraph2/style/default-style.xml?_dc='+new Date().getTime()).getDocumentElement();
// var dec = new mxCodec(node.ownerDocument);
// dec.decode(node, graph.getStylesheet());
// var node = mxUtils.load('http://localhost:8088/web/mxgraph2/style/default-style.xml?_dc=1618968809382').getDocumentElement();
// var dec = new mxCodec(node.ownerDocument);
// dec.decode(node, this.graph.getStylesheet());
// 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);
// 图标回显----------------------------
// var dec = new mxCodec(node.ownerDocument);
// dec.decode(node, graph.getStylesheet());
// var node = mxUtils.load('http://localhost:8088/web/mxgraph2/style/default-style.xml?_dc=1618968809382').getDocumentElement();
// var dec = new mxCodec(node.ownerDocument);
// dec.decode(node, this.graph.getStylesheet());
// 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); // 允许连线
......@@ -1670,38 +1965,32 @@ previousField(){
this.graph.setMultigraph(false);
this.graph.convertValueToString = (cell) => {
console.log(cell,"888888888888888888888888888888888");
var label = cell.getAttribute("label");
if(label) {
if(cell.isEdge() && cell.value.nodeName == 'TransHop') {
return '<img src="' + label + '" width="16" height="16" />';
} else if(cell.isEdge() && cell.value.nodeName == 'JobHop') {
console.log(label,'label');
// var jsonArray = JSON.parse(label), label = '';
console.log(JSON.parse(label),'mylabel');
var jsonArray = JSON.parse(label), label = '';
console.log(jsonArray,'jsonArray');
jsonArray.forEach(img=>{
label += '<img src="'+img + '" width="16" height="16" />';
})
return label;
} else {
return decodeURIComponent(label);
}
}
return label;
;
if (label) {
if (cell.isEdge() && cell.value.nodeName == "TransHop") {
return '<img src="' + label + '" width="16" height="16" />';
} else if (cell.isEdge() && cell.value.nodeName == "JobHop") {
console.log(label, "label");
// var jsonArray = JSON.parse(label), label = '';
console.log(JSON.parse(label), "mylabel");
var jsonArray = JSON.parse(label),
label = "";
console.log(jsonArray, "jsonArray");
jsonArray.forEach((img) => {
label += '<img src="' + img + '" width="16" height="16" />';
});
return label;
} else {
return decodeURIComponent(label) + " " + "X" + cell.value.attributes.copies.value;
}
}
return label ;
// console.log(cell.value.attributes,99999999999999);
// if (!cell.title && cell.value) {
......@@ -1743,37 +2032,34 @@ previousField(){
// console.log(this.R.prop("title", cell),132132);
// 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)=>{
var cells = evt.getProperty('cells');
console.log(cells,'cells');
cells.forEach(item=>{
if(item.isEdge() && !item.value) {
this.newHop(item);
}
})
})
// 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) => {
var cells = evt.getProperty("cells");
console.log(cells, "cells");
cells.forEach((item) => {
if (item.isEdge() && !item.value) {
this.newHop(item);
}
});
});
this.graph.addListener(mxEvent.DOUBLE_CLICK, (graph, evt) => {
console.log(evt);
console.log("当前点击的文件类型****************",this.curFileType);
console.log("当前点击的文件类型****************", this.curFileType);
// this.xmlDocuments = mxUtils.parseXml(decodeURIComponent(this.blankCanvas));
this.graphXml = this.encode(this.graph);
console.log(this.graphXml, 11111111111111111111111);
console.log(this.graphXml, 11111111111111111111111);
// 监听双击事件
const cell = this.R.pathOr([], ["properties", "cell"], evt);
......@@ -1783,7 +2069,6 @@ previousField(){
// this.setXml();
this.doubleClickCell = cell;
// 获取接口数据
availableCharsets(pamer).then((res) => {
this.codingType = res;
......@@ -1804,9 +2089,104 @@ previousField(){
valueFormat(pamer2).then((res) => {
this.fieldFormat = res;
});
if ( cell.dis == "step27" ||
cell.value.attributes.ctype.value == "SelectValues") {
this.selectFieldDialog = !this.selectFieldDialog
this.form = {};
let q = {};
let obj = cell.value.attributes;
for (let vel in obj) {
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields);
q.remove = JSON.parse(q.remove);
q.meta = JSON.parse(q.meta);
console.log(q, 45646546464);
this.form = q;
setTimeout(() => {
this.$refs.selectFieldDialog.clickFun(this.graph);
}, 500);
}else if (
cell.dis == "step50" ||
cell.value.attributes.ctype.value == "MergeRows"
) {
this.mergeRecordsDialog = !this.mergeRecordsDialog;
this.form = {};
let q = {};
let obj = cell.value.attributes;
for (let vel in obj) {
let key = obj[vel];
q[key.name] = key.value;
}
q.keys = JSON.parse(q.keys);
q.values = JSON.parse(q.values);
console.log(q, 45646546464);
this.form = q;
setTimeout(() => {
this.$refs.mergeRecordsDialog.clickFun(this.graph);
}, 500);
return;
} else if (
cell.dis == "step64" ||
cell.value.attributes.ctype.value == "GetVariable"
) {
this.getVariableDialog = !this.getVariableDialog;
this.form = {};
let q = {};
let obj = cell.value.attributes;
for (let vel in obj) {
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields);
console.log(q, 45646546464);
this.form = q;
setTimeout(() => {
this.$refs.setVariableDialog.clickFun(this.graph);
}, 500);
return;
} else if (
cell.dis == "step65" ||
cell.value.attributes.ctype.value == "SetVariable"
) {
this.setVariableDialog = !this.setVariableDialog;
this.form = {};
let q = {};
let obj = cell.value.attributes;
for (let vel in obj) {
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields);
console.log(q, 45646546464);
this.form = q;
setTimeout(() => {
this.$refs.setVariableDialog.clickFun(this.graph);
}, 500);
return;
}
if (
(this.curFileType=="transformation" && cell.ids == "step1") ||
cell.dis == "step29" ||
cell.value.attributes.ctype.value == "SortRows"
) {
this.sortRecordDialog = !this.sortRecordDialog;
this.form = {};
let q = {};
let obj = cell.value.attributes;
for (let vel in obj) {
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields);
console.log(q, 45646546464);
this.form = q;
setTimeout(() => {
this.$refs.sortRecordDialog.clickFun(this.graph);
}, 500);
return;
} else if (
(this.curFileType == "transformation" && cell.ids == "step1") ||
cell.value.attributes.ctype.value == "ExcelInput"
) {
this.excelLnput = !this.excelLnput;
......@@ -1817,27 +2197,25 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
q.file = JSON.parse(q.file)
q.sheets = JSON.parse(q.sheets)
q.fields = JSON.parse(q.fields)
console.log(q,45646546464);
q.file = JSON.parse(q.file);
q.sheets = JSON.parse(q.sheets);
q.fields = JSON.parse(q.fields);
console.log(q, 45646546464);
this.form = q;
this.sheets = q.sheets
this.fields = q.fields
this.file = q.file
this.sheets = q.sheets;
this.fields = q.fields;
this.file = q.file;
return;
} else if (
cell.ids == "step7" ||
cell.value.attributes.ctype.value == "TableInput"
) {
this.TableInputDialog = !this.TableInputDialog;
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.graph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.graph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
this.form = {};
let q = {};
let obj = cell.value.attributes;
......@@ -1845,14 +2223,13 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
this.form = q;
this.form.sql = decodeURIComponent( this.form.sql)
setTimeout(() => {
this.$refs.tableInputDialog.clickFun(this.graph);
this.form.sql = decodeURIComponent(this.form.sql);
setTimeout(() => {
this.$refs.tableInputDialog.clickFun(this.graph);
}, 500);
return;
} else if (
cell.ids == "step6" ||
......@@ -1866,12 +2243,12 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields)
q.fields = JSON.parse(q.fields);
this.form = q;
return;
} else if (
(this.curFileType=="transformation" && cell.ids == "step5") ||
(this.curFileType == "transformation" && cell.ids == "step5") ||
cell.value.attributes.ctype.value == "DataGrid"
) {
this.ConstantDialog = !this.ConstantDialog;
......@@ -1882,12 +2259,12 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
q.data = JSON.parse(q.data)
q.fields = JSON.parse(q.fields)
q.data = JSON.parse(q.data);
q.fields = JSON.parse(q.fields);
this.form = q;
return;
} else if (
(this.curFileType=="transformation" && cell.ids == "step4") ||
(this.curFileType == "transformation" && cell.ids == "step4") ||
cell.value.attributes.ctype.value == "RandomValue"
) {
this.RandomValueDialog = !this.RandomValueDialog;
......@@ -1898,11 +2275,11 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields)
q.fields = JSON.parse(q.fields);
this.form = q;
return;
} else if (
(this.curFileType=="transformation" && cell.ids == "step3") ||
(this.curFileType == "transformation" && cell.ids == "step3") ||
cell.value.attributes.ctype.value == "RowGenerator"
) {
this.RowGeneratorDialog = !this.RowGeneratorDialog;
......@@ -1913,12 +2290,11 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
q.fields = JSON.parse(q.fields)
q.fields = JSON.parse(q.fields);
this.form = q;
return;
} else if (
(this.curFileType=="transformation" &&
cell.ids == "step2") ||
(this.curFileType == "transformation" && cell.ids == "step2") ||
cell.value.attributes.ctype.value == "TextFileInput"
) {
this.TextFileInputDialog = !this.TextFileInputDialog;
......@@ -1929,15 +2305,15 @@ previousField(){
let key = obj[vel];
q[key.name] = key.value;
}
console.log(q.fileNameStore,"sghywkglaslkhygslu");
q.fileNameStore = JSON.parse(q.fileNameStore)
q.inputFields = JSON.parse(q.inputFields)
q.filter = JSON.parse(q.filter)
console.log(q.fileNameStore, "sghywkglaslkhygslu");
q.fileNameStore = JSON.parse(q.fileNameStore);
q.inputFields = JSON.parse(q.inputFields);
q.filter = JSON.parse(q.filter);
this.form = q;
setTimeout(() => {
this.$refs.TextFileInputDialog.clickFun(this.graph)
}, 500);
setTimeout(() => {
this.$refs.TextFileInputDialog.clickFun(this.graph);
}, 500);
return;
} else if (
cell.ids == "step17" ||
......@@ -1951,167 +2327,246 @@ previousField(){
}, 500);
// this.$refs.tableOutPut.clickFun(this.graph);
return;
} else if (cell.ids == "step16" || cell.value.attributes.ctype.value == "Update" ) {
} else if (
cell.ids == "step16" ||
cell.value.attributes.ctype.value == "Update"
) {
//更新
this.updateVisible = !this.updateVisible;
this.outPutFormData4 = this.showDataFunc();
// this.$refs.update.clickFun(this.graph);//向子组件传递画布
setTimeout(() => {
this.$refs.update.clickFun(this.graph);//向子组件传递画布
this.$refs.update.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
} else if (cell.ids == "step15" || cell.value.attributes.ctype.value == "TextFileOutput" ) {
} else if (
cell.ids == "step15" ||
cell.value.attributes.ctype.value == "TextFileOutput"
) {
//文本文件输出
this.fileVisible = !this.fileVisible;
this.outPutFormData8 = this.showDataFunc();
this.$refs.textFile.clickFun(this.graph);//向子组件传递画布
this.$refs.textFile.clickFun(this.graph); //向子组件传递画布
return;
} else if (cell.ids == "step14" || cell.value.attributes.ctype.value == "SynchronizeAfterMerge" ) {
} else if (
cell.ids == "step14" ||
cell.value.attributes.ctype.value == "SynchronizeAfterMerge"
) {
//数据同步
this.synVisible = !this.synVisible;
this.outPutFormData5 = this.showDataFunc();
this.$refs.syn.clickFun(this.graph);//向子组件传递画布
this.$refs.syn.clickFun(this.graph); //向子组件传递画布
return;
} else if (cell.ids == "step13" || cell.value.attributes.ctype.value == "InsertUpdate" ) {
} else if (
cell.ids == "step13" ||
cell.value.attributes.ctype.value == "InsertUpdate"
) {
//插入、更新
this.InsertOrUpdateVisible = !this.InsertOrUpdateVisible;
this.outPutFormData2 = this.showDataFunc();
this.$refs.insertOrdate.clickFun(this.graph);//向子组件传递画布
this.$refs.insertOrdate.clickFun(this.graph); //向子组件传递画布
return;
} else if (cell.ids == "step12" || cell.value.attributes.ctype.value == "Delete" ) {
} else if (
cell.ids == "step12" ||
cell.value.attributes.ctype.value == "Delete"
) {
//删除
this.deleteVisible = !this.deleteVisible;
this.outPutFormData6 = this.showDataFunc();
setTimeout(() => {
this.$refs.del.clickFun(this.graph);//向子组件传递画布
}, 500);
setTimeout(() => {
this.$refs.del.clickFun(this.graph); //向子组件传递画布
}, 500);
// this.$refs.del.clickFun(this.graph);//向子组件传递画布
return;
} else if (cell.ids == "step11" || cell.value.attributes.ctype.value == "SQLFileOutput" ) {
} else if (
cell.ids == "step11" ||
cell.value.attributes.ctype.value == "SQLFileOutput"
) {
//SQL文件输出
this.sqlVisible = !this.sqlVisible;
this.outPutFormData7 = this.showDataFunc();
this.$refs.sql.clickFun(this.graph);//向子组件传递画布
this.$refs.sql.clickFun(this.graph); //向子组件传递画布
return;
}else if (cell.ids == "step10" || cell.value.attributes.ctype.value == "TypeExitExcelWriterStep" ) {
} else if (
cell.ids == "step10" ||
cell.value.attributes.ctype.value == "TypeExitExcelWriterStep"
) {
//mico-Excel输出
this.microVisible = !this.microVisible;
this.outPutFormData9 = this.showDataFunc();
setTimeout(() => {
this.$refs.mic.clickFun(this.graph);//向子组件传递画布
}, 500);
setTimeout(() => {
this.$refs.mic.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
} else if (cell.ids == "step9" || cell.value.attributes.ctype.value == "ExcelOutput" ) {
} else if (
cell.ids == "step9" ||
cell.value.attributes.ctype.value == "ExcelOutput"
) {
//Excel输出
this.excelOutPutVisible = !this.excelOutPutVisible;
this.outPutFormData3 = this.showDataFunc();
setTimeout(() => {
this.$refs.excelOut.clickFun(this.graph);//向子组件传递画布
setTimeout(() => {
this.$refs.excelOut.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if(( this.curFileType=="job" && cell.ids == "SPECIAL" ) || cell.value.attributes.ctype.value == "SPECIAL"){
} else if (
(this.curFileType == "job" && cell.ids == "SPECIAL") ||
cell.value.attributes.ctype.value == "SPECIAL"
) {
// 通用--start
this.jobStartVisible = !this.jobStartVisible;
this.outPutFormData10 = this.showDataFunc();
setTimeout(() => {
this.$refs.myStart.clickFun(this.graph);//向子组件传递画布
this.$refs.myStart.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if(this.curFileType=="job" && cell.ids == "step1"){
} else if (this.curFileType == "job" && cell.ids == "step1") {
// cell.value.attributes.ctype.value == "SPECIAL"
// 通用--DUMMY
setTimeout(() => {
this.jobDummyVisible = !this.jobDummyVisible;
setTimeout(() => {
this.jobDummyVisible = !this.jobDummyVisible;
}, 500);
return;
}else if((this.curFileType=="job" && cell.ids == "step2") || cell.value.attributes.ctype.value == "JOB"){
} else if (
(this.curFileType == "job" && cell.ids == "step2") ||
cell.value.attributes.ctype.value == "JOB"
) {
// 通用--作业
this.jobHomeworkVisible = !this.jobHomeworkVisible;
this.outPutFormData11 = this.showDataFunc();
setTimeout(() => {
this.$refs.myhomework.clickFun(this.graph);//向子组件传递画布
this.$refs.myhomework.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if( (this.curFileType=="job" && cell.ids == "step3") || cell.value.attributes.ctype.value == "SUCCESSNPM"){
} else if (
(this.curFileType == "job" && cell.ids == "step3") ||
cell.value.attributes.ctype.value == "SUCCESSNPM"
) {
// 通用--成功
this.jobSuccessVisible = !this.jobSuccessVisible;
this.outPutFormData14 = this.showDataFunc();
setTimeout(() => {
this.$refs.mySuccess.clickFun(this.graph);//向子组件传递画布
this.$refs.mySuccess.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if( (this.curFileType=="job" && cell.ids == "step4") || cell.value.attributes.ctype.value == "SET_VARIABLES" ){
} else if (
(this.curFileType == "job" && cell.ids == "step4") ||
cell.value.attributes.ctype.value == "SET_VARIABLES"
) {
// 通用--设置变量
this.jobSetVisible = !this.jobSetVisible;
this.outPutFormData12 = this.showDataFunc();
setTimeout(() => {
this.$refs.mySet.clickFun(this.graph);//向子组件传递画布
this.$refs.mySet.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if( (this.curFileType=="job" && cell.ids == "step5") || cell.value.attributes.ctype.value == "TRANS" ){
} else if (
(this.curFileType == "job" && cell.ids == "step5") ||
cell.value.attributes.ctype.value == "TRANS"
) {
//作业--通用--转换
this.myjobTransVisible = !this.myjobTransVisible;
this.outPutFormData13 = this.showDataFunc();
setTimeout(() => {
this.$refs.mytrans.clickFun(this.graph);//向子组件传递画布
this.$refs.mytrans.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if((this.curFileType=="transformation" && cell.ids == "step36") || cell.value.attributes.ctype.value == "SwitchCase"){
//流程--Switch / Case
} else if (
(this.curFileType == "transformation" && cell.ids == "step36") ||
cell.value.attributes.ctype.value == "SwitchCase"
) {
//流程--Switch / Case
this.switchVisible = !this.switchVisible;
this.outPutFormData15 = this.showDataFunc();
setTimeout(() => {
this.$refs.switch.clickFun(this.graph);//向子组件传递画布
}, 500);
setTimeout(() => {
this.$refs.switch.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}
});
this.graph.addListener(mxEvent.CLICK, (graph, evt) => {
// console.log(evt);
// 监听单击事件
const cell = this.R.pathOr([], ["properties", "cell"], evt);
// console.info(cell); // 在控制台输出单击的cell
});
},
//添加自定义节点
newHop(cell) {
var doc = mxUtils.createXmlDocument();
var hop = doc.createElement('JobHop');
hop.setAttribute('from', cell.source.getAttribute('label'));
hop.setAttribute('to', cell.target.getAttribute('label'));
hop.setAttribute('from_nr', cell.source.getAttribute('nr'));
hop.setAttribute('to_nr', cell.target.getAttribute('nr'));
cell.setValue(hop);
console.log('cell',cell);
var graph = this.graph;
graph.getModel().beginUpdate();
try
{
var edit = new mxCellAttributeChange(cell, 'enabled', 'Y');
graph.getModel().execute(edit);
edit = new mxCellAttributeChange(cell, 'evaluation', 'Y');
graph.getModel().execute(edit);
if(cell.source.getAttribute('ctype') == 'SPECIAL' && cell.source.getAttribute('start') == 'Y') {
edit = new mxCellAttributeChange(cell, 'unconditional', 'Y');
graph.getModel().execute(edit);
} else {
edit = new mxCellAttributeChange(cell, 'unconditional', 'N');
graph.getModel().execute(edit);
}
} finally
{
graph.getModel().endUpdate();
mxEvent.disableContextMenu(document.body);
this.graph.popupMenuHandler.autoExpand = true;
this.graph.popupMenuHandler.factoryMethod = (menu, cell, evt) => {
if (!cell) {
if (this.curFileType == "transformation") {
//画布右键
menu.addItem("转换属性设置", null, () => {
console.log(cell, "当前节点");
alert("Item 1");
});
menu.addSeparator();
} else {
//画布右键
menu.addItem("作业属性设置", null, () => {
console.log(cell, "当前节点");
alert("Item 1");
});
menu.addSeparator();
}
} else {
//节点右键
menu.addItem("改变开始复制的数量", null, () => {
console.log(cell, "当前节点");
console.log(this.form,"当前数据");
if (this.form.label) {
this.copyNumber = !this.copyNumber
}else{
this.$message.error("请先双击打开节点")
}
});
menu.addSeparator();
}
},
};
},
//添加自定义节点
newHop(cell) {
var doc = mxUtils.createXmlDocument();
var hop = doc.createElement("JobHop");
hop.setAttribute("from", cell.source.getAttribute("label"));
hop.setAttribute("to", cell.target.getAttribute("label"));
hop.setAttribute("from_nr", cell.source.getAttribute("nr"));
hop.setAttribute("to_nr", cell.target.getAttribute("nr"));
cell.setValue(hop);
console.log("cell", cell);
var graph = this.graph;
graph.getModel().beginUpdate();
try {
var edit = new mxCellAttributeChange(cell, "enabled", "Y");
graph.getModel().execute(edit);
edit = new mxCellAttributeChange(cell, "evaluation", "Y");
graph.getModel().execute(edit);
if (
cell.source.getAttribute("ctype") == "SPECIAL" &&
cell.source.getAttribute("start") == "Y"
) {
edit = new mxCellAttributeChange(cell, "unconditional", "Y");
graph.getModel().execute(edit);
} else {
edit = new mxCellAttributeChange(cell, "unconditional", "N");
graph.getModel().execute(edit);
}
} finally {
graph.getModel().endUpdate();
}
},
// 回显数据封装的方法
showDataFunc() {
......@@ -2123,7 +2578,7 @@ previousField(){
q[key.name] = key.value;
}
return q;
return this.form = q;
},
addCell(toolItem, x, y) {
......@@ -2146,75 +2601,73 @@ previousField(){
.map((attr) => `${attr}=${styleObj[attr]}`)
.join(";");
this.toolItemData = toolItem;
console.log(toolItem,"yghgiiagsjfhasgaljgqhwygajhgiu");
console.log(toolItem, "yghgiiagsjfhasgaljgqhwygajhgiu");
try {
let pameStep = new FormData(); // 创建form对象
pameStep.append("graphXml", this.getXmlVal);
pameStep.append("pluginId", toolItem.pluginId);
pameStep.append("name", toolItem.title);
if(this.curFileType=="transformation"){
newStep(pameStep).then((res) => {
this.boxInformation = res;
var doc = mxUtils.parseXml(res);
this.graph.getModel().beginUpdate();
try {
var cell = this.graph.insertVertex(
this.graph.getDefaultParent(),
null,
doc.documentElement,
x,
y,
width,
height,
style
);
console.log(cell, 4564564564);
console.log(toolItem, 111111111111111111);
cell.title = toolItem["title"];
cell.ids = toolItem["id"];
// cell.pluginId = toolItem["pluginId"];
// cell.icon = toolItem["icon"];
this.graph.setSelectionCells([cell]);
} finally {
this.graph.getModel().endUpdate();
}
this.getXml();
});
}else if(this.curFileType=="job"){
if (this.curFileType == "transformation") {
newStep(pameStep).then((res) => {
this.boxInformation = res;
var doc = mxUtils.parseXml(res);
this.graph.getModel().beginUpdate();
try {
var cell = this.graph.insertVertex(
this.graph.getDefaultParent(),
null,
doc.documentElement,
x,
y,
width,
height,
style
);
console.log(cell, 4564564564);
console.log(toolItem, 111111111111111111);
cell.title = toolItem["title"];
cell.ids = toolItem["id"];
// cell.pluginId = toolItem["pluginId"];
// cell.icon = toolItem["icon"];
this.graph.setSelectionCells([cell]);
} finally {
this.graph.getModel().endUpdate();
}
this.getXml();
});
} else if (this.curFileType == "job") {
// pameStep.append("name", encodeURIComponent(toolItem.title));
newJobEntry(pameStep).then((res) => {
this.boxInformation = res;
var doc = mxUtils.parseXml(res);
this.graph.getModel().beginUpdate();
try {
var cell = this.graph.insertVertex(
this.graph.getDefaultParent(),
null,
doc.documentElement,
x,
y,
width,
height,
style
);
console.log(cell, 4564564564);
console.log(toolItem, 111111111111111111);
cell.title = toolItem["title"];
cell.ids = toolItem["id"];
// cell.pluginId = toolItem["pluginId"];
// cell.icon = toolItem["icon"];
this.graph.setSelectionCells([cell]);
} finally {
this.graph.getModel().endUpdate();
}
this.getXml();
});
newJobEntry(pameStep).then((res) => {
this.boxInformation = res;
var doc = mxUtils.parseXml(res);
this.graph.getModel().beginUpdate();
try {
var cell = this.graph.insertVertex(
this.graph.getDefaultParent(),
null,
doc.documentElement,
x,
y,
width,
height,
style
);
console.log(cell, 4564564564);
console.log(toolItem, 111111111111111111);
cell.title = toolItem["title"];
cell.ids = toolItem["id"];
// cell.pluginId = toolItem["pluginId"];
// cell.icon = toolItem["icon"];
this.graph.setSelectionCells([cell]);
} finally {
this.graph.getModel().endUpdate();
}
this.getXml();
});
}
} finally {
this.graph.getModel().endUpdate();
}
......@@ -2224,11 +2677,11 @@ previousField(){
getXml() {
const codec = new mxCodec();
const encodedModel = codec.encode(this.graph.getModel());
console.log(encodedModel,46546465456);
console.log(encodedModel, 46546465456);
this.getXmlVal = mxUtils.getXml(encodedModel);
let w = ""
w = JSON.stringify(this.getXmlVal)
console.log(w,46546465456);
let w = "";
w = JSON.stringify(this.getXmlVal);
console.log(w, 46546465456);
// console.log(this.getXmlVal, 8888888888888);
},
//选择
......@@ -2477,46 +2930,41 @@ previousField(){
let pamers = new FormData(); // 创建form对象
pamers.append("graphXml", encodeURIComponent(this.graphXml));
// 判断是报错作业的流程图还是保存转换的流程图
if(this.curFileType=="transformation"){
save(pamers).then((res) => {
console.log(res);
if (res.success) {
this.$message.success("保存流程成功！暂时请查先看控制台。");
} else {
}
});
}else if(this.curFileType=="job"){
saveJob(pamers).then((res) => {
console.log(res);
if (res.success) {
this.$message.success("保存流程成功！暂时请查先看控制台。");
} else {
}
});
if (this.curFileType == "transformation") {
save(pamers).then((res) => {
console.log(res);
if (res.success) {
this.$message.success("保存流程成功！暂时请查先看控制台。");
} else {
}
});
} else if (this.curFileType == "job") {
saveJob(pamers).then((res) => {
console.log(res);
if (res.success) {
this.$message.success("保存流程成功！暂时请查先看控制台。");
} else {
}
});
}
},
//子服务器信息
showServer(){
showServer() {
setTimeout(() => {
this.$refs.myServer.clickFun(this.graph);
}, 500);
this.serverDialogVisible=!this.serverDialogVisible;
this.serverDialogVisible = !this.serverDialogVisible;
},
// 执行转换
doTrans() {
if(this.curFileType=="transformation"){
if (this.curFileType == "transformation") {
this.transGraphVisible = !this.transGraphVisible;
this.$refs.transRef.clickFun(this.graph);
}else if(this.curFileType=="job"){
this.jobRunVisible=!this.jobRunVisible;
} else if (this.curFileType == "job") {
this.jobRunVisible = !this.jobRunVisible;
this.$refs.jobRun.clickFun(this.graph);
}
},
// //重绘流程图
......
src/views/kettle/home2.vue
......@@ -323,6 +323,7 @@
<export-tree ref="exDialog" :exportDialogVisible.sync="exportDialogVisible" :explorer="explorer"></export-tree>
<in-repository ref="importDialog" :inputVisibility.sync="inputVisibility" :explorer="explorer"></in-repository>
</div>
</template>
......@@ -1249,13 +1250,13 @@ props: ["dragItem"],
})
},
handleNodeClick(data,node){
console.log('点击当前节点===',node);
this.curNode=node;//当前选中节点
this.nodePath=data.path;//当前选择数
this.curNodeIconCls=node.data.iconCls;
console.log('当前节点的文件夹路径:',this.nodePath);
if(node.data.leaf){
this.curNodeText=node.data.text;//当前节点
......
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