Skip to content

E
ETL-admin
Commit f75d681c by 李耀琨
Options

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

parent 4240b4ee
Showing with 1304 additions and 10 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/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/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