Skip to content

E
ETL-admin
Commit 5a38e4c2 by 李耀琨
Options

Merge branch 'master' of http://139.159.239.83:9093/mxl/ETL-admin into master

parents 17e37a58 1f348f24
Showing with 773 additions and 11 deletions
src/api/kettle/file.js
......@@ -356,6 +356,35 @@ export function nextSteps(data) {
})
}
//获取脚本javascript代码的文件夹列表
export function getLeftTree(data) {
return request({
url: 'etlweb/script/tree',
data,
method: 'post'
})
}
//测试脚本
export function testData(data) {
return request({
url: 'etlweb/script/testData',
data,
method: 'post'
})
}
//测试
export function testScript(data) {
return request({
url: 'etlweb/script/test',
data,
method: 'post'
})
}
......
src/views/dashboard-kettle/components/designer/mxgraphDesigner.vue
......@@ -1132,9 +1132,27 @@
:doubleClickCell="doubleClickCell"
:scriptFormSend="outPutFormData16"
></sqlScriptDialog>
<!-- 转换-脚本-javascript -->
<javaScriptDialog ref="refJavaScript" :javaScriptVisible.sync="javaScriptVisible" :saveOutputDialog="saveOutputDialog" :doubleClickCell="doubleClickCell" :javaScriptFormSend="javaScriptFormData" ></javaScriptDialog>
<!-- 脚本弹窗组件end -->
<!-- 转换弹窗组件start -->
<!-- 值映射 -->
<valueDialog
ref="refValue"
:valueVisible.sync="valueVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
:formSend="valueFormData"
></valueDialog>
<cutStringDialog
ref="refCutString"
:cutStringVisible.sync="cutStringVisible"
:saveOutputDialog="saveOutputDialog"
:doubleClickCell="doubleClickCell"
:formSend="cutStringFormData"
></cutStringDialog>
<!-- 字段选择value -->
<!-- <columnChoose
ref="insertOrdate"
:columnVisible.sync="columnVisible"
......@@ -1263,9 +1281,13 @@ import switchDialog from "../../../stream-dialog/switch";
// 脚本弹窗组件start---------------------
import sqlScriptDialog from "../../../script-dialog/sql-script";
import javaScriptDialog from "../../../script-dialog/java-script";//转换-脚本-javaScript代码
// 脚本弹窗组件end-----------------------
// 转换弹窗组件start----------
import valueDialog from "../../../trans-dialog/value";//值映射
import cutStringDialog from "../../../trans-dialog/cut-string";//剪切字符串
// 转换弹窗组件end------------
import mxgraph from "@/utils/mxgraph";
......@@ -1321,6 +1343,9 @@ export default {
outPutFormData14: {}, //作业---成功
outPutFormData: {}, //输出弹窗组件的表单值
// 转换33start---------
javaScriptFormData:{},//转换--javascript代码
valueFormData:{},//值映射
cutStringFormData:{},//剪切字符串
// 转换3end------------
outPutFormData16: {}, //脚本--执行sql脚本
doubleClickCell: {},
......@@ -1379,9 +1404,11 @@ export default {
// 流程弹窗组件start----------
// 流程弹窗组件end------------
// 脚本组件start-----
javaScriptVisible:false,
scriptVisible: false,
// 脚本组件end-----
valueVisible:false,//值映射
cutStringVisible:false,//剪切字符串
// 输入模块
file: [],
sheets: [],
......@@ -1493,9 +1520,12 @@ export default {
// 脚本弹窗组件---
sqlScriptDialog,
javaScriptDialog,
// 脚本弹窗组件---
// 转换弹窗组件start---
valueDialog,//值映射
cutStringDialog,//剪切字符串
// 转换弹窗组件end-----
},
//自定义指令 https://www.jb51.net/article/108047.htm
......@@ -2575,6 +2605,32 @@ export default {
this.$refs.importXmlFile.clickFun(this.graph, this.form); //向子组件传递画布
}, 500);
return;
}else if((this.curFileType=="transformation" && cell.ids == "step106") || cell.value.attributes.ctype.value == "ScriptValueMod" ){
//脚本 --javaScript代码
this.javaScriptVisible = !this.javaScriptVisible;
this.javaScriptFormData = this.showDataFunc()
setTimeout(() => {
this.$refs.refJavaScript.clickFun(this.graph);//向子组件传递画布
}, 500);
return;
}else if((this.curFileType=="transformation" && cell.ids == "step52") || cell.value.attributes.ctype.value == "ValueMapper" ){
//转换 --值映射
this.valueVisible = !this.valueVisible;
this.valueFormData = this.showDataFunc()
setTimeout(() => {
// this.$refs.refJavaScript.clickFun(this.graph);//向子组件传递画布
this.$refs.refValue.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}else if((this.curFileType=="transformation" && cell.ids == "step55") || cell.value.attributes.ctype.value == "StringCut" ){
//转换 --剪切字符串
this.cutStringVisible = !this.cutStringVisible;
this.cutStringFormData = this.showDataFunc()
setTimeout(() => {
// this.$refs.refJavaScript.clickFun(this.graph);//向子组件传递画布
this.$refs.refCutString.clickFun(this.graph); //向子组件传递画布
}, 500);
return;
}
});
......@@ -3196,8 +3252,10 @@ export default {
<style lang="scss" type="text/scss" scoped>
.mxgraphClass,
#mxgraph {
height: 100vh;
// height: 100vh;
height: 82vh;
width: 100%;
overflow: auto;
}
.moveR-enter-active,
.moveR-leave-active {
......
src/views/dialogs-components/global/remind-dialog/index.js 0 → 100644
import main from './main.vue'
export default main
\ No newline at end of file
src/views/dialogs-components/global/remind-dialog/main.vue 0 → 100644
<template>
<div >
<!-- 浏览 -->
<el-dialog
title="问题"
:visible.sync="remindVisible"
width="650px"
top="15%"
:close-on-click-modal="false"
:before-close="handleClose"
>
<div class="remind_dialog">这是一段信息</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose">取 消</el-button>
<el-button type="primary" @click="expRespository()">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { exptree,expRespository,download } from "@/api/kettle/file";
export default {
name: "remind-dialog",
data() {
return {
exTreeList:[],
defaultProps: {
label: "text",
children: "children",
},
checkedArr:[]
}
},
props: ["remindVisible"],
created() {
// this.exptree();
},
methods: {
//获取导出资源库树
// exptree() {
// let data = new FormData();
// data.append("loadElement", 3);
// data.append("node", "root");
// exptree(data).then((res) => {
// if (res) {
// console.log("导出资源库树列表：", res);
// this.exTreeList = res;
// } else {
// this.$message.error(res.errMsg);
// }
// });
// },
// getCheckedNodes() {
// console.log('当前勾选的所有数据',this.$refs.tree.getCheckedNodes());
// var allCheckedsNodes=this.$refs.tree.getCheckedNodes();
// var checkedNodes=allCheckedsNodes.filter((item)=>{
// return item.children==null
// });
// var checkArr=[];
// checkedNodes.forEach(element => {
// var myObj={};
// myObj.path=element.path;
// myObj.type=element.type;
// checkArr.push(myObj);
// });
// this.checkedArr=checkArr;
// console.log('当前选择文件====',this.checkedArr);
// },
//导出资源库
// expRespository() {
// if(this.checkedArr.length==0){
// this.$message.error('请先选择要导出文件');
// }
// let data = new FormData();
// data.append("data",JSON.stringify(this.checkedArr) );
// expRespository(data).then((res) => {
// if (res) {
// console.log("导出资源库：", res);
// var url=this.etlWeb+`attachment/download?filePath=${res.message}&remove=true`
// window.open(url);
// } else {
// this.$message.error(res.errMsg);
// }
// });
// },
handleClose() {
this.$emit("update:remindVisible", false);
},
},
};
</script>
<style>
.type-checked {
background-color: #8888ff;
color: #fff;
}
.remind_dialog > .el-dialog__body{
height: 10vh !important;overflow: auto;
}
</style>
src/views/dialogs-components/global/table-list/main.vue
......@@ -67,14 +67,14 @@ export default {
}
},
props: {
tableHead:Array,
tableData:Array,
field:Boolean,
fieldClick:Function
// props: {
// tableHead:Array,
// tableData:Array,
// field:Boolean,
// fieldClick:Function
// },
props: ["tableHead","tableData","field","fieldClick"],
},
created() {
},
......
src/views/kettle/kettle.css
......@@ -26,7 +26,9 @@ border-bottom: 1px solid #dce3e8;
border-bottom: 1px solid #E4E7ED;
}
.sel-content{
min-height: 81vh;
/* min-height: 81vh; */
height: 81vh;
overflow: auto;
border: 1px solid #dce3e8;
}
.sel-menu-bar{
......
src/views/mykettle/main.vue
......@@ -869,7 +869,9 @@ export default {
border-bottom: 1px solid #E4E7ED;
}
.sel-content{
min-height: 81vh;
/* min-height: 81vh; */
height: 81vh;
overflow: auto;
border: 1px solid #dce3e8;
}
.sel-menu-bar{
......
src/views/trans-dialog/cut-string.vue 0 → 100644
<template>
<div>
<el-dialog
title="剪切字符串"
:visible.sync="cutStringVisible"
width="800px"
:before-close="handleClose"
top="10%"
>
<el-form ref="delForm" :model="myForm" label-width="200px">
<el-form-item label="步骤名称:">
<el-input v-model="myForm.label"></el-input>
</el-form-item>
<!-- <div style="border:1px solid #99BBE8;padding:15px 15px;margin-bottom:15px;">
<database-choose ref="databaseChoose" :form.sync="deleteForm" @fatherFun="fatherFun" :getXmlVal="getXmlVal" :graph="newGraph"></database-choose>
<el-form-item label="提交记录数量:">
<el-row :gutter="10">
<el-col :span="23">
<el-input v-model="deleteForm.commit"></el-input>
</el-col>
</el-row>
</el-form-item>
</div> -->
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>要剪切的字段</span>
<el-button style="padding: 3px 0;margin-left:50px;" type="text" @click="fieldClick(true)">新增字段</el-button>
<el-button style="padding: 3px 0" type="text" @click="inputOutputFields('get')">获取字段</el-button>
<!-- <el-button style="padding: 3px 0" type="text" @click="showRemindDia">获取字段</el-button> -->
<el-button style="padding: 3px 0" type="text" @click="deleteFields">删除全部</el-button>
</div>
<table-list ref="tableDia" :tableHead="tableHead" :tableData="tableData" :field.sync="editDia" :fieldClick="fieldClick"></table-list>
<!-- 编辑弹窗开始=========== -->
<el-dialog
title="新增/编辑"
:visible.sync="field"
width="550px"
:before-close="handleCloseEdit"
append-to-body>
<el-form ref="form1" :model="fieldForm" label-width="100px">
<el-form-item label="输入流字段:">
<el-select v-model="fieldForm.in_stream_name" style="width: 100%" @focus="inputOutputFields">
<el-option v-for="(item,index) in fieldsList2" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item label="输出流字段:">
<el-input v-model="fieldForm.out_stream_name"></el-input>
</el-form-item>
<el-form-item label="起始位置:">
<el-input v-model="fieldForm.cut_from"></el-input>
</el-form-item>
<el-form-item label="结束位置:">
<el-input v-model="fieldForm.cut_to"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="field = false">取 消</el-button>
<el-button type="primary" @click="addField">确 定</el-button>
</span>
</el-dialog>
<!-- 编辑弹窗结束============ -->
</el-card>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="cutStringVisible = false">取 消</el-button>
<el-button type="primary" @click="confirm">确 定</el-button>
</span>
</el-dialog>
<!-- 提醒弹窗start -->
<!-- <remind-dialog :remindVisible.sync="remindVisible"></remind-dialog> -->
<!-- 提醒弹窗end-- -->
</div>
</template>
<script>
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph
import {
tableFields,
inputOutputFields,//获取表输出
} from "@/api/kettle/file";
export default ({
data(){
return{
remindVisible:false,
myForm:{},//解决子组件改变父组件传递props属性报错
newGraph:{},
fieldsList1:[],
fieldsList2:[],
field:false,//编辑弹窗
editDia:false,//编辑表字段
fieldForm:{},//编辑弹窗
stepName:{name:'删除'},
activeName:'content',
// 查询字段--start------------
fieldsList:[],//字段获取
// 表头数据
tableHead:[
{
column_name: "in_stream_name",column_comment:"输入流字段"
},
{
column_name: "out_stream_name",column_comment:"输出流字段"
},
{
column_name: "cut_from",column_comment:"起始位置"
},
{
column_name: "cut_to",column_comment:"结束位置"
}
],
// 表格数据
tableData: [
],
// 查询字段--end------------
}
},
watch:{
// 解决子组件改变父组件传进来的变量的属性不报错start------
formSend(val){
console.log("回显的表单数据===",val);
this.myForm=val;
if(this.myForm.fields){
var ny=JSON.parse(this.myForm.fields);
this.tableData=ny;
}
},
// 解决子组件改变父组件传进来的变量的属性不报错start------
},
props:["cutStringVisible","doubleClickCell","saveOutputDialog","formSend"],
mounted(){
},
methods:{
clickFun(graph){
console.log(graph,'双击获取值')
this.newGraph = graph;
// setTimeout(() => {
// this.$refs.databaseChoose.clickFun(this.newGraph);
// }, 500);
},
handleClose(){
this.$emit("update:cutStringVisible", false);
},
confirm(){
this.myForm.fields=JSON.stringify(this.tableData);//字段复值
console.log('弹窗数据：===',this.myForm);
this.saveOutputDialog(this.myForm);
this.handleClose();//关闭弹窗
},
//新增或者编辑弹窗
fieldClick(state, val) {
this.field = !this.field;
this.dataState = state;
if (state) {
this.fieldForm = {};
} else {
this.fieldForm = val;
}
},
//关闭编辑的弹窗
handleCloseEdit(){
this.field = !this.field;
},
// 字段
addField() {
this.field = !this.field;
console.log('添加的字段===',this.fieldForm);
if (this.dataState) {
this.tableData.push(this.fieldForm);
}
},
tableFields(){
if(this.doubleClickCell){
var title=this.doubleClickCell.value.attributes.label.value
}
console.log('获取cell888888===',this.doubleClickCell);
let pamer = new FormData(); // 创建form对象
pamer.append("databaseName", this.deleteForm.connection);
// 画布xml转码
const codec = new mxCodec();
const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
console.log("获取字段的画布详情：", encodedModel);
var myXmlVal = mxUtils.getPrettyXml(encodedModel);//xml字符串
pamer.append("graphXml", myXmlVal);
pamer.append("schema", this.deleteForm.schema);
pamer.append("table", this.deleteForm.table);
pamer.append("query", '');
tableFields(pamer).then(res=>{
console.log('字段',res);
// this.blankCanvas = res
this.fieldsList1=res;
})
},
//获取表输出
inputOutputFields(par){
if(this.doubleClickCell){
var title=this.doubleClickCell.value.attributes.label.value
}
console.log('获取cell888888===',this.doubleClickCell);
let pamer = new FormData(); // 创建form对象
pamer.append("stepName", encodeURIComponent(title));
// 画布xml转码
const codec = new mxCodec();
const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
console.log("获取字段的画布详情：", encodedModel);
var myXmlVal = mxUtils.getXml(encodedModel);//xml字符串
pamer.append("graphXml", myXmlVal);
pamer.append("before", true);
pamer.append("query", '');
inputOutputFields(pamer).then(res=>{
console.log('字段',res);
if(par=="get"){
// var newArray=[];
var newArray=this.tableData;
res.forEach(item => {
var newObj={};
newObj.in_stream_name=item.name;
// newObj.condition="=";
// newObj.name=item.name;
// newObj.name2="";
newArray.push(newObj);
});
this.tableData=newArray;
// this.tableData.concat(newArray);
}else{
this.fieldsList2=res;
}
})
},
//删除全部
deleteFields(){
this.tableData=[];
},
//获取字段提示弹窗
showRemindDia(){
this.remindVisible=!this.remindVisible;
}
}
})
</script>
\ No newline at end of file
src/views/trans-dialog/value.vue 0 → 100644
<template>
<div>
<el-dialog
title="值映射"
:visible.sync="valueVisible"
width="800px"
:before-close="handleClose"
top="10%"
>
<el-form ref="delForm" :model="myForm" label-width="200px">
<el-form-item label="步骤名称:">
<el-input v-model="myForm.label"></el-input>
</el-form-item>
<div style="border:1px solid #99BBE8;padding:15px 15px;margin-bottom:15px;">
<el-form-item label="使用的字段名:">
<el-row :gutter="10">
<el-col :span="23">
<el-select v-model="myForm.field_to_use" style="width: 100%" @focus="inputOutputFields">
<el-option v-for="(item,index) in fieldsList2" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="目标字段名:">
<el-row :gutter="10">
<el-col :span="23">
<el-input v-model="myForm.target_field"></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="不匹配时的默认值:">
<el-row :gutter="10">
<el-col :span="23">
<el-input v-model="myForm.non_match_default"></el-input>
</el-col>
</el-row>
</el-form-item>
</div>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>字段值</span>
<el-button style="padding: 3px 0;margin-left:50px;" type="text" @click="fieldClick(true)">新增字段</el-button>
<el-button style="padding: 3px 0" type="text" @click="deleteFields">删除全部</el-button>
</div>
<table-list ref="tableDia" :tableHead="tableHead" :tableData="tableData" :field.sync="editDia" :fieldClick="fieldClick"></table-list>
<!-- 编辑弹窗开始=========== -->
<el-dialog
title="新增/编辑"
:visible.sync="field"
width="500px"
:before-close="handleCloseEdit"
append-to-body>
<el-form ref="form1" :model="fieldForm" label-width="80px">
<el-form-item label="源值:">
<el-input v-model="fieldForm.source_value"></el-input>
</el-form-item>
<el-form-item label="目标值:">
<el-input v-model="fieldForm.target_value"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="field = false">取 消</el-button>
<el-button type="primary" @click="addField">确 定</el-button>
</span>
</el-dialog>
<!-- 编辑弹窗结束============ -->
</el-card>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="valueVisible = false">取 消</el-button>
<el-button type="primary" @click="confirm">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph
import {
tableFields,
inputOutputFields,//获取表输出
} from "@/api/kettle/file";
export default ({
data(){
return{
myForm:{},//解决子组件改变父组件传递props属性报错
newGraph:{},
fieldsList1:[],
fieldsList2:[],
field:false,//编辑弹窗
editDia:false,//编辑表字段
fieldForm:{},//编辑弹窗
stepName:{name:'删除'},
activeName:'content',
// deleteForm:{
// commit: "100",
// connection: "",
// key:"[]",
// label:"删除",
// schema: "",
// table: "",
// },
// 查询字段--start------------
fieldsList:[],//字段获取
keyConditionList:[{value: '=', text: '='},
{value: '<>', text: '<>'},
{value: '<', text: '<'},
{value: '<=', text: '<='},
{value: '>', text: '>'},
{value: '>=', text: '>='},
{value: 'LIKE', text: 'LIKE'},
{value: 'BETWEEN', text: 'BETWEEN'},
{value: 'IS NULL', text: 'IS NULL'},
{value: 'IS NOT NULL', text: 'IS NOT NULL'}],
// 表头数据
tableHead:[
{
column_name: "source_value",column_comment:"源值"
},
{
column_name: "target_value",column_comment:"目标值"
},
],
// 表格数据
tableData: [
// {
// field: '3',
// condition: '鞠婧祎',
// name: '女',
// name2:'1',
// },
// {
// field: '31',
// condition: '鞠婧祎',
// name: '女',
// name2:'1',
// },
// {
// field: '32',
// condition: '鞠婧祎',
// name: '女',
// name2:'1',
// },
],
// 查询字段--end------------
}
},
// watch:{
// deleteForm(n,o){
// console.log("回显的表单数据===",n);
// if(n){
// var ny=JSON.parse(n.key);
// this.tableData=ny;
// }
// }
// },
watch:{
// 解决子组件改变父组件传进来的变量的属性不报错start------
formSend(val){
console.log("回显的表单数据===",val);
this.myForm=val;
if(this.myForm.key){
var ny=JSON.parse(this.myForm.key);
this.tableData=ny;
}
},
// 解决子组件改变父组件传进来的变量的属性不报错start------
},
props:["valueVisible","doubleClickCell","saveOutputDialog","formSend",],
mounted(){
},
methods:{
clickFun(graph){
console.log(graph,'双击获取值')
this.newGraph = graph;
},
handleClose(){
this.$emit("update:valueVisible", false);
},
confirm(){
this.myForm.fields=JSON.stringify(this.tableData);//字段复值
console.log('弹窗数据：===',this.myForm);
this.saveOutputDialog(this.myForm);
this.handleClose();//关闭弹窗
},
//新增或者编辑弹窗
fieldClick(state, val) {
this.field = !this.field;
this.dataState = state;
if (state) {
this.fieldForm = {};
} else {
this.fieldForm = val;
}
},
//关闭编辑的弹窗
handleCloseEdit(){
this.field = !this.field;
},
// 字段
addField() {
this.field = !this.field;
console.log('添加的字段===',this.fieldForm);
if (this.dataState) {
this.tableData.push(this.fieldForm);
}
},
//获取表输出
inputOutputFields(par){
if(this.doubleClickCell){
// var title=this.doubleClickCell.title;
var title=this.doubleClickCell.value.attributes.label.value
}
console.log('获取cell888888===',this.doubleClickCell);
let pamer = new FormData(); // 创建form对象
pamer.append("stepName", encodeURIComponent(title));
// pamer.append("graphXml", this.getXmlVal);
// 画布xml转码
const codec = new mxCodec();
const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
console.log("获取字段的画布详情：", encodedModel);
var myXmlVal = mxUtils.getXml(encodedModel);//xml字符串
pamer.append("graphXml", myXmlVal);
pamer.append("before", true);
pamer.append("query", '');
inputOutputFields(pamer).then(res=>{
console.log('字段',res);
// if(par=="get"){
// var newArray=[];
// res.forEach(item => {
// var newObj={};
// newObj.field=item.name;
// newObj.condition="=";
// newObj.name=item.name;
// newObj.name2="";
// newArray.push(newObj);
// });
// this.tableData=newArray;
// }else{
this.fieldsList2=res;
// }
})
},
//删除全部
deleteFields(){
this.tableData=[];
},
}
})
</script>
\ No newline at end of file
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