Skip to content

E
ETL-admin
Commit cb3ef275 by 李耀琨
Options

完成记录集连接、映射、映射输入、输出规范

parent 629a3b65
Showing with 935 additions and 319 deletions
.env.development
...@@ -7,11 +7,16 @@ ENV = 'development' ...@@ -7,11 +7,16 @@ ENV = 'development'
#VUE_APP_BASE_API = 'http://192.168.0.24:9888'
#VUE_APP_WS_API = 'ws://192.168.0.24:9888'
#VUE_APP_FILE_API = 'http://192.168.0.24:9888'
# 接口地址 # 接口地址
VUE_APP_BASE_API = 'http://192.168.0.44:9888' VUE_APP_BASE_API = 'http://192.168.0.25:9889'
VUE_APP_WS_API = 'ws://192.168.0.44:9888' VUE_APP_WS_API = 'ws://192.168.0.25:9889'
VUE_APP_FILE_API = 'http://192.168.0.44:9888' VUE_APP_FILE_API = 'http://192.168.0.25:9889'
......
package.json
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
"nprogress": "0.2.0", "nprogress": "0.2.0",
"path-to-regexp": "2.4.0", "path-to-regexp": "2.4.0",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"qs": "^6.9.1", "qs": "^6.10.1",
"ramda": "^0.27.1", "ramda": "^0.27.1",
"screenfull": "4.2.0", "screenfull": "4.2.0",
"scss": "^0.2.4", "scss": "^0.2.4",
......
src/api/kettle/link.js
import request from '@/utils/request' import request from '@/utils/request'
import qs from 'qs'
import { Dropdown } from 'element-ui' import { Dropdown } from 'element-ui'
//获取连接类型 //获取连接类型
...@@ -10,6 +11,16 @@ export function types(data) { ...@@ -10,6 +11,16 @@ export function types(data) {
}) })
} }
//记录集连接 连接类型
export function typesss(data) {
return request({
url: 'etlweb/mergejoin/types',
data,
method: 'post'
})
}
//获取历史连接的资源库列表 //获取历史连接的资源库列表
export function getLinkList(data) { export function getLinkList(data) {
return request({ return request({
...@@ -430,3 +441,31 @@ export function datetimeformat(data){ ...@@ -430,3 +441,31 @@ export function datetimeformat(data){
method: 'post' method: 'post'
}) })
} }
// 资源库导出
export function exp(data){
return request({
url:'etlweb/repository/exp',
data,
method: 'post'
})
}
// 获取子转换的步骤
export function getSubTranStep(data){
return request({
url:`etlweb/trans/getSubTranStep?${qs.stringify(data)}`,
data,
method: 'get'
})
}
// 获取下一步骤
export function nextSteps(data){
return request({
url:'etlweb/trans/nextSteps',
data,
method: 'post'
})
}
\ No newline at end of file
src/assets/styles/index.scss
...@@ -582,7 +582,9 @@ aside { ...@@ -582,7 +582,9 @@ aside {
// //
// $svgUrl:'http://147.1.3.180: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.24:9888/ETLWEB-SERVER/etlweb';
$svgUrl:'http://192.168.0.25:9889/ETLWEB-SERVER/etlweb';
// $svgUrl:'http://192.168.0.44:9882/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;} // .schema { background-image: url($svgUrl/ui/images/schema.svg?scale=16) !important;}
......
src/main.js
...@@ -79,7 +79,9 @@ Vue.prototype.R = R ...@@ -79,7 +79,9 @@ Vue.prototype.R = R
Vue.config.productionTip = false Vue.config.productionTip = false
const baseUrl = process.env.VUE_APP_BASE_API === '/' ? '' : process.env.VUE_APP_BASE_API 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://147.1.3.180:9888/ETLWEB-SERVER/etlweb/"
Vue.prototype.etlWeb = "http://192.168.0.44:9888/ETLWEB-SERVER/etlweb/" // Vue.prototype.etlWeb = "http://192.168.0.24:9888/ETLWEB-SERVER/etlweb/"
Vue.prototype.etlWeb = "http://192.168.0.25:9889/ETLWEB-SERVER/etlweb/"
new Vue({ new Vue({
router, router,
......
src/views/dashboard-kettle/components/appBulletFrame/conversionSettings.vue
...@@ -235,7 +235,7 @@ ...@@ -235,7 +235,7 @@
<el-tab-pane label="依赖"> <el-tab-pane label="依赖">
<el-button type="text" @click="relyOn(true)">添加字段</el-button> <el-button type="text" @click="relyOn(true)">添加字段</el-button>
<el-table :data=" dependencies" style="width: 100%"> <el-table :data="dependencies" style="width: 100%">
<el-table-column prop="connection" label="数据库连接"> <el-table-column prop="connection" label="数据库连接">
</el-table-column> </el-table-column>
...@@ -407,7 +407,7 @@ ...@@ -407,7 +407,7 @@
<el-form :model="relyOnFise" label-width="80px"> <el-form :model="relyOnFise" label-width="80px">
<el-form-item label="字段名称"> <el-form-item label="数据库连接">
<el-select <el-select
v-model="relyOnFise.connection" v-model="relyOnFise.connection"
style="width: 100%" style="width: 100%"
...@@ -423,11 +423,11 @@ ...@@ -423,11 +423,11 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="步骤名称"> <el-form-item label="表">
<el-input v-model="relyOnFise.table"></el-input> <el-input v-model="relyOnFise.table"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="字段描述"> <el-form-item label="字段">
<el-input v-model="relyOnFise.field"></el-input> <el-input v-model="relyOnFise.field"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -562,8 +562,12 @@ export default { ...@@ -562,8 +562,12 @@ export default {
); );
} }
console.log(this.form);
if (!this.form.dependencies == undefined) {
this.dependencies = JSON.parse(this.form.dependencies)
}
console.log(this.form, this.form.dependencies);
}, },
//删除 //删除
...@@ -729,7 +733,7 @@ export default { ...@@ -729,7 +733,7 @@ export default {
this.form.dependencies = JSON.stringify(this.dependencies)
this.form.transLogTable = JSON.stringify(this.form.transLogTable) this.form.transLogTable = JSON.stringify(this.form.transLogTable)
this.form.stepLogTable = JSON.stringify(this.form.stepLogTable) this.form.stepLogTable = JSON.stringify(this.form.stepLogTable)
this.form.performanceLogTable = JSON.stringify(this.form.performanceLogTable) this.form.performanceLogTable = JSON.stringify(this.form.performanceLogTable)
......
src/views/dashboard-kettle/components/appBulletFrame/importXmlFile.vue
...@@ -17,14 +17,22 @@ ...@@ -17,14 +17,22 @@
<el-card class="box-card"> <el-card class="box-card">
<el-form :model="form" label-width="160px"> <el-form :model="form" label-width="160px">
<el-form-item label="资源库"> </el-form-item> <el-form-item label="资源库"> </el-form-item>
<el-form-item label="资源库名称"> <el-form-item label="资源库名称">
<el-select <el-select
v-model="form.repositoryname" v-model="form.repositoryname"
style="width: 100%" style="width: 100%"
@focus="getGraphDataBases" @change="getField"
clearable clearable
> >
<!-- <el-form-item label="资源库名称">
<el-select
v-model="form.repositoryname"
style="width: 100%"
@change="getField"
@focus="getGraphDataBases"
clearable
> -->
<el-option <el-option
v-for="(item, index) in namesList" v-for="(item, index) in namesList"
:key="index" :key="index"
...@@ -43,7 +51,7 @@ ...@@ -43,7 +51,7 @@
</el-form-item> </el-form-item>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col class="line" :span="4" :offset="20"> <el-col class="line" :span="4" :offset="20">
<el-button type="primary" @click="metadata(true)" <el-button type="primary" @click="testDialogueOpen()"
>测试连接</el-button >测试连接</el-button
> >
</el-col> </el-col>
...@@ -89,7 +97,7 @@ ...@@ -89,7 +97,7 @@
></el-input> ></el-input>
</el-col> </el-col>
<el-col class="line" :span="2"> <el-col class="line" :span="2">
<el-button type="primary" @click="metadata(true)" <el-button type="primary" @click="expFun()"
:disabled=" :disabled="
form.export_type === 'export_by_folder' || form.export_type === 'export_by_folder' ||
form.export_type === 'export_all' || form.export_type === 'export_all' ||
...@@ -130,7 +138,7 @@ ...@@ -130,7 +138,7 @@
</el-col> </el-col>
<el-col class="line" :span="3"> <el-col class="line" :span="3">
<el-button type="primary" @click="selectFilePath()" <el-button type="primary" @click="selectFilePath()"
>文件</el-button >浏 览</el-button
> >
</el-col> </el-col>
</el-row> </el-row>
...@@ -269,6 +277,28 @@ ...@@ -269,6 +277,28 @@
</span> </span>
</el-dialog> </el-dialog>
<!--数据库连接start -->
<el-dialog
title="数据库连接测试"
encodeURIComponent
:visible.sync="testDialogueFlag"
width="650px"
top="15%"
append-to-body
:close-on-click-modal="false"
:before-close="handleCloseTest"
>
<!-- <div class="table-container table-container-repos" style="height: 42vh">
{{ linkInfo }}
</div> -->
<div style="height:50vh;overflow-y:auto;white-space:pre-line;" v-html="linkInfo"></div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="handleClose">取 消</el-button> -->
<el-button type="primary" @click="handleCloseTest">确 定</el-button>
</span>
</el-dialog>
<!-- 数据库连接测试end -->
</div> </div>
...@@ -277,7 +307,7 @@ ...@@ -277,7 +307,7 @@
<script> <script>
import main from "../../../mykettle/main"; import main from "../../../mykettle/main";
import browseFiles from "../appBulletFrame/browseFiles"; import browseFiles from "../appBulletFrame/browseFiles";
import { datetimeformat, listNames } from "@/api/kettle/link"; import { datetimeformat, getLinkList,exp,test } from "@/api/kettle/link";
export default { export default {
components: { components: {
main, main,
...@@ -300,12 +330,88 @@ export default { ...@@ -300,12 +330,88 @@ export default {
namesList: [], namesList: [],
filePathSelection:false, filePathSelection:false,
localPath:{}, localPath:{},
connectionName: "",
testDialogueFlag: false, //测试弹弹窗
linkInfo: "",
createModel: {
name: "",
type: "",
access: "",
hostname: "",
databaseName: "",
port: "",
username: "",
password: "",
stramingReasults: "",
supportBooleanDataType: "",
supportTimestampDataType: "",
preserveReservedCaseCheck: "",
extraOptions: [],
usingConnectionPool: "N",
initialPoolSize: "5",
maximumPoolSize: "10",
partitioned: "N",
partitionInfo: [],
}, //创建数据库
}; };
}, },
created() {}, created() {},
methods: { methods: {
listNames() { clickFun(graph, val) {
listNames().then((res) => { this.datetimeformatFun();
this.getLinkList();
this.newGraph = graph;
console.log(val);
},
testDialogueOpen() {
// JSON对象转成formData对象
var params = this.createModel;
// 由于高级选项连接池集群页面没有画完，保存默认参数
params.databaseName = this.library.name
params.type = this.library.type
params.username = this.form.username
params.password = this.form.password
params.supportBooleanDataType = true;
params.supportTimestampDataType = true;
params.preserveReservedCaseCheck = true;
params.extraOptions = [];
params.usingConnectionPool = "N";
params.initialPoolSize = "5";
params.maximumPoolSize = "10";
params.partitioned = "N";
params.partitionInfo = [];
var formData = new FormData();
formData.append("databaseInfo", JSON.stringify(params));
console.log("表单提交参数==", params);
this.test(formData);
this.testDialogueFlag = true;
},
// 测试连接
test(params) {
test(params).then((res) => {
if (res) {
console.log("测试：");
// this.linkInfo=res.message;
// var test2=decodeURI(res.message);
var test2 = decodeURIComponent(res.message);
console.log("解码====：", test2);
this.linkInfo = test2;
} else {
this.$message.error(res.errMsg);
}
});
},
handleCloseTest() {
this.testDialogueFlag = false;
},
getLinkList() {
getLinkList().then((res) => {
if (res) { if (res) {
console.log("获取所有已经创建的数据库列表：", res); console.log("获取所有已经创建的数据库列表：", res);
this.namesList = res; this.namesList = res;
...@@ -320,23 +426,36 @@ export default { ...@@ -320,23 +426,36 @@ export default {
this.dateFormat = res; this.dateFormat = res;
}); });
}, },
clickFun(graph, val) {
this.datetimeformatFun(); expFun(){
this.listNames(); let pamerSteps = new FormData(); // 创建form对象
this.newGraph = graph; pamerSteps.append("data", this.form.repositoryname);
console.log(val); exp(pamerSteps).then(res=>{
console.log(res);
})
}, },
getGraphDataBases() {
// var graph = this.getGraph(); getField(val) {
var root = this.newGraph.getDefaultParent(),
data = []; this.library = this.namesList.find((e) => {
if (root.getAttribute("databases") != null) return e.name == val;
data = JSON.parse(root.getAttribute("databases")); });
console.log("获取到画布上的databases====", data);
this.namesList = data; console.log(this.library, "////////////////////////");
this.connectionName = val;
}, },
// getGraphDataBases() {
// // var graph = this.getGraph();
// var root = this.newGraph.getDefaultParent(),
// data = [];
// if (root.getAttribute("databases") != null)
// data = JSON.parse(root.getAttribute("databases"));
// console.log("获取到画布上的databases====", data);
// // this.namesList = data;
// },
selectFilePath(){ selectFilePath(){
this.filePathSelection = !this.filePathSelection this.filePathSelection = !this.filePathSelection
}, },
......
src/views/dashboard-kettle/components/appBulletFrame/mapping.vue
...@@ -14,11 +14,13 @@ ...@@ -14,11 +14,13 @@
<el-form-item label="转换:"> <el-form-item label="转换:">
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :span="21"> <el-col :span="21">
<el-input v-model="form.directory"></el-input> <el-input v-model="form.filename"></el-input>
</el-col> </el-col>
<el-col class="line" :span="2"> <el-col class="line" :span="2">
<el-button size="mini" @click="filePathSelection = true">浏览</el-button> <el-button size="mini" @click="filePathSelection = true"
>浏览</el-button
>
</el-col> </el-col>
</el-row> </el-row>
</el-form-item> </el-form-item>
...@@ -118,7 +120,7 @@ ...@@ -118,7 +120,7 @@
label="输入原步骤名(如果只有一个步骤该项可以为空)" label="输入原步骤名(如果只有一个步骤该项可以为空)"
> >
<el-select <el-select
v-model="form.lookup" v-model="inputLies.input_step"
style="width: 100%" style="width: 100%"
clearable clearable
@click.native="lastStep" @click.native="lastStep"
...@@ -133,21 +135,20 @@ ...@@ -133,21 +135,20 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="子转换里的“映射输入接口”步骤名"> <el-form-item label="子转换里的“映射输入接口”步骤名">
<el-row :gutter="10"> <el-select
<el-col :span="20"> v-model="inputLies.output_step"
<el-input style="width: 100%"
v-model="inputLies.output_step" clearable
:disabled="inputLies.main_path == 'Y'" :disabled="inputLies.main_path == 'Y'"
></el-input> @click.native="getSubTranStep('MappingInput')"
</el-col> >
<el-col class="line" :span="2"> <el-option
<el-button v-for="(item, index) in steps"
size="mini" :key="index"
:disabled="inputLies.main_path == 'Y'" :label="item.name"
>选择</el-button :value="item.name"
> />
</el-col> </el-select>
</el-row>
</el-form-item> </el-form-item>
<el-form-item label="步骤映射描述:"> <el-form-item label="步骤映射描述:">
<el-input <el-input
...@@ -158,15 +159,14 @@ ...@@ -158,15 +159,14 @@
</el-form> </el-form>
</div> </div>
<div class="lowerRight"> <div class="lowerRight">
<el-button type="text" @click="addInputField(true)" <!-- <el-button type="text" @click="addInputField(true)"
>添加字段</el-button >添加字段</el-button
> > -->
<el-table <el-table
:data="inputLies.connector" :data="inputLies.connector"
height=" 250 " height="180"
border border
style="width: 100%" style="width: 100%"
> >
<el-table-column prop="parent" label="原字段名"> <el-table-column prop="parent" label="原字段名">
</el-table-column> </el-table-column>
...@@ -194,18 +194,16 @@ ...@@ -194,18 +194,16 @@
<el-form-item> <el-form-item>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :span="19"> <el-col :span="19">
<el-checkbox <el-checkbox
v-model="form.rename_on_output" v-model="form.rename_on_output"
true-label="Y" true-label="Y"
false-label="N" false-label="N"
></el-checkbox> ></el-checkbox>
输出时字段名再重新映射回原来输入时的名字? 输出时字段名再重新映射回原来输入时的名字?
</el-col> </el-col>
<el-col :span="4"> <el-col :span="4">
<el-button @click="fieldMapping">字段映射...</el-button> <el-button @click="fieldMapping">字段映射...</el-button>
</el-col> </el-col>
</el-row> </el-row>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -243,7 +241,7 @@ ...@@ -243,7 +241,7 @@
checked: outputIndex == index, checked: outputIndex == index,
}" }"
> >
{{ item.input_step || `输出${index + 1}` }} {{ `输出${index + 1}` }}
</li> </li>
</ul> </ul>
</div> </div>
...@@ -259,43 +257,40 @@ ...@@ -259,43 +257,40 @@
></el-checkbox> ></el-checkbox>
</el-form-item> </el-form-item>
<el-form-item label="子转换里的“映射输入接口”步骤名"> <el-form-item label="子转换里的“映射输出接口”步骤名">
<el-row :gutter="10"> <el-select
<el-col :span="20"> v-model="outputLies.input_step"
<el-input style="width: 100%"
v-model="outputLies.input_step" clearable
:disabled="outputLies.main_path == 'Y'" :disabled="outputLies.main_path == 'Y'"
></el-input> @click.native="getSubTranStep('MappingOutput')"
</el-col> >
<el-col class="line" :span="2"> <el-option
<el-button v-for="(item, index) in stepsWto"
size="mini" :key="index"
:disabled="outputLies.main_path == 'Y'" :label="item.name"
>选择</el-button :value="item.name"
> />
</el-col> </el-select>
</el-row>
</el-form-item> </el-form-item>
<el-form-item <el-form-item
label="输入原步骤名(如果只有一个步骤该项可以为空)" label="输入原步骤名(如果只有一个步骤该项可以为空)"
> >
<el-row :gutter="10"> <el-select
<el-col :span="20"> v-model="outputLies.output_step"
<el-input style="width: 100%"
v-model="outputLies.output_step" clearable
:disabled="outputLies.main_path == 'Y'" :disabled="outputLies.main_path == 'Y'"
></el-input> @click.native="nextStep"
</el-col> >
<el-option
<el-col class="line" :span="2"> v-for="(item, index) in nextStepFelt"
<el-button :key="index"
size="mini" :label="item.name"
:disabled="outputLies.main_path == 'Y'" :value="item.name"
>选择</el-button />
> </el-select>
</el-col>
</el-row>
</el-form-item> </el-form-item>
<el-form-item label="步骤映射描述:"> <el-form-item label="步骤映射描述:">
...@@ -312,7 +307,7 @@ ...@@ -312,7 +307,7 @@
> >
<el-table <el-table
:data="outputLies.connector" :data="outputLies.connector"
height=" 250 " height="180"
border border
style="width: 100%" style="width: 100%"
:row-style="{ height: '10px' }" :row-style="{ height: '10px' }"
...@@ -348,7 +343,6 @@ ...@@ -348,7 +343,6 @@
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="handleCloseFun">取 消</el-button> <el-button @click="handleCloseFun">取 消</el-button>
<el-button type="primary" @click="mappingDialogFun">确 定</el-button> <el-button type="primary" @click="mappingDialogFun">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
...@@ -410,14 +404,96 @@ ...@@ -410,14 +404,96 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="inputBox = false">取 消</el-button> <el-button @click="outputBox = false">取 消</el-button>
<el-button type="primary" @click="addoutputBoxFun">确 定</el-button> <el-button type="primary" @click="addoutputBoxFun">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 映射匹配 -->
<el-dialog
title="映射匹配"
:visible.sync="dialogVisible"
width="800px"
:before-close="handleClose"
>
<div>
<el-row :gutter="10">
<el-col :span="6">
<div class="sourceField">
<ul class="ulHeightS">
<li
class="list"
v-for="(item, index) in stepFields"
:key="item.id"
@click="switchJournalw(item, index)"
style="cursor: pointer"
:class="{
hover: outputIndexw == index,
checked: outputIndexw == index,
}"
>
{{ item.name }}
</li>
</ul>
</div>
<!-- <el-checkbox v-model="checked">自动选择目标</el-checkbox>
<el-checkbox v-model="checked">隐藏已经匹配的源字段</el-checkbox> -->
</el-col>
<el-col :span="6"
><div class="sourceField">
<ul class="ulHeightS">
<li
class="listw"
v-for="(item, index) in conversionField"
:key="item.id"
@click="switchJournalww(item, index)"
style="cursor: pointer"
:class="{
hover: outputIndexww == index,
checked: outputIndexww == index,
}"
>
{{ item.name }}
</li>
</ul>
</div>
<!-- <el-checkbox v-model="checked">自动选择源</el-checkbox>
<el-checkbox v-model="checked">隐藏已经匹配的目标字段</el-checkbox> -->
</el-col>
<el-col :span="4">
<div class="addSC">
<el-button @click="addMatchField">add</el-button>
<el-button @click="deleteFiel">删除</el-button>
</div></el-col
>
<el-col :span="8"
><div class="sourceField">
<ul class="ulHeightS">
<li
class="addList"
v-for="(item, index) in addSwitchFelt"
:key="item.id"
@click="addSwitchJournal(item, index)"
style="cursor: pointer"
:class="{
hover: addOutputIndex == index,
checked: addOutputIndex == index,
}"
>
{{ item.name }}
</li>
</ul>
</div></el-col
>
</el-row>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisibleFun">确 定</el-button>
</span>
</el-dialog>
<!-- 文件浏览器-->
<!-- 文件浏览器-->
<el-dialog <el-dialog
title="文件浏览器" title="文件浏览器"
:visible.sync="filePathSelection" :visible.sync="filePathSelection"
...@@ -425,8 +501,7 @@ ...@@ -425,8 +501,7 @@
:before-close="handleClose" :before-close="handleClose"
:modal="false" :modal="false"
> >
<browseFiles :disabed="true" v-on:route="route"></browseFiles>
<browseFiles :disabed="true" v-on:route="route"></browseFiles>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="filePathSelection = false">取 消</el-button> <el-button @click="filePathSelection = false">取 消</el-button>
...@@ -435,8 +510,6 @@ ...@@ -435,8 +510,6 @@
> >
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
...@@ -465,8 +538,11 @@ import { ...@@ -465,8 +538,11 @@ import {
availableCharsets, availableCharsets,
previousSteps, previousSteps,
inputOutputFields, inputOutputFields,
mappingFields mappingFields,
getSubTranStep,
nextSteps,
} from "@/api/kettle/link"; } from "@/api/kettle/link";
import loginVue from "../../../login.vue";
export default { export default {
props: ["form", "nodeData", "saveOutputDialog", "mappingDialog"], //从父组件传过来的值 props: ["form", "nodeData", "saveOutputDialog", "mappingDialog"], //从父组件传过来的值
...@@ -478,7 +554,8 @@ export default { ...@@ -478,7 +554,8 @@ export default {
connectionNode: [], connectionNode: [],
tableData: [], tableData: [],
newGraph: [], newGraph: [],
filePathSelection:false, filePathSelection: false,
dialogVisible: false,
metadataBox: false, metadataBox: false,
selectModifyBox: false, selectModifyBox: false,
inputBox: false, inputBox: false,
...@@ -493,19 +570,29 @@ export default { ...@@ -493,19 +570,29 @@ export default {
fileType: [], fileType: [],
codingType: [], codingType: [],
liList: [], liList: [],
inputIndex: 0, inputIndex: -1,
inputLies: { connector: [] }, inputLies: { connector: [] },
inputField: {}, inputField: {},
liListru: [], liListru: [],
outputIndex: 0, outputIndex: -1,
outputIndexw: -1,
outputIndexww: -1,
addOutputIndex: -1,
outputLies: { connector: [] }, outputLies: { connector: [] },
outputField: {}, outputField: {},
steps: [],
stepsWto: [],
switchState: 1, switchState: 1,
inputState: 1, inputState: 1,
mappings: {}, mappings: {},
inherit: "Y", inherit: "Y",
localPath:{}, localPath: {},
stepFields: [],
conversionField: [],
ontFelt: {},
twoFelt: {},
addSwitchFelt: [],
nextStepFelt: [],
}; };
}, },
...@@ -518,6 +605,7 @@ export default { ...@@ -518,6 +605,7 @@ export default {
methods: { methods: {
clickFun(graph, val) { clickFun(graph, val) {
console.log(val, "--------------------------");
this.mappings = []; this.mappings = [];
this.liList = []; this.liList = [];
this.liListru = []; this.liListru = [];
...@@ -526,17 +614,18 @@ export default { ...@@ -526,17 +614,18 @@ export default {
this.mappings = JSON.parse(val.mappings); this.mappings = JSON.parse(val.mappings);
// console.log(val.mappings); // console.log(val.mappings);
// console.log(this.mappings); // console.log(this.mappings);
this.inherit = this.mappings.parameters.inherit_all_vars; this.inherit = this.mappings.parameters.inherit_all_vars;
// console.log(this.mappings); // console.log(this.mappings);
console.log(this.mappings.input); // console.log(this.mappings.input);
// this.liList = this.mappings.input // this.liList = this.mappings.input
console.log(this.mappings);
this.mappings.input.forEach((item, index) => { this.mappings.input.forEach((item, index) => {
console.log(item, index); // console.log(item, index);
console.log(typeof item.connector == "string"); console.log(typeof item.connector == "string");
if (typeof item.connector === "string") { if (typeof item.connector === "string") {
item.connector = JSON.parse(item.connector); item.connector = JSON.parse(item.connector);
this.liList.push(item); this.liList.push(item);
console.log(this.liList);
} else { } else {
this.liList.push(item); this.liList.push(item);
} }
...@@ -567,41 +656,91 @@ export default { ...@@ -567,41 +656,91 @@ export default {
this.mappings.parameters.input.forEach((item, index) => { this.mappings.parameters.input.forEach((item, index) => {
console.log(item, index); console.log(item, index);
this.parameters.push({ this.parameters.push({
variable: this.mappings.parameters.variable[index], variable: JSON.parse(this.mappings.parameters.variable[index]),
input: item, input: JSON.parse(item) ,
}); });
}); });
console.log(this.parameters); console.log(this.parameters);
} }
}, },
fieldMapping(){ dialogVisibleFun() {
var enc = new mxCodec(mxUtils.createXmlDocument()); this.dialogVisible = !this.dialogVisible;
this.addSwitchFelt.forEach((item, index) => {
this.inputLies.connector.push({ parent: item.key1, child: item.key2 });
});
},
nextStep() {
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let steps = new FormData(); // 创建form对象
steps.append("stepName", this.nodeData.value.attributes.label.value);
steps.append("graphXml", this.graphXml);
steps.append("query", "");
nextSteps(steps).then((res) => {
this.nextStepFelt = res;
});
},
getSubTranStep(val) {
getSubTranStep({ path: this.form.filename, typeId: val }).then((res) => {
if (val == "MappingInput") {
this.steps = res;
} else {
this.stepsWto = res;
}
});
},
addMatchField() {
this.addSwitchFelt.push({
key1: this.ontFelt.name,
key2: this.twoFelt.name,
name: this.ontFelt.name + "-------->" + this.twoFelt.name,
});
console.log(this.addSwitchFelt);
},
deleteFiel() {
this.addSwitchFelt.splice(this.addOutputIndex, 1);
},
fieldMapping() {
this.dialogVisible = !this.dialogVisible;
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel()); var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node); this.graphXml = mxUtils.getPrettyXml(node);
let pamerFiel = new FormData(); // 创建form对象
pamerFiel.append("stepName", this.nodeData.value.attributes.label.value);
pamerFiel.append("graphXml", this.graphXml);
pamerFiel.append("before", true);
inputOutputFields(pamerFiel).then((res) => {
console.log(res);
this.stepFields = res;
});
let pamerFields = new FormData(); // 创建form对象 let pamerFields = new FormData(); // 创建form对象
pamerFields.append( pamerFields.append("stepName", this.inputLies.output_step);
"stepName",
this.nodeData.value.attributes.label.value // pamerFields.append("graphXml", this.graphXml);
); pamerFields.append("path", this.form.filename);
pamerFields.append("graphXml", this.graphXml); // pamerFields.append("before", false);
pamerFields.append("before", true); mappingFields(pamerFields).then((res) => {
mappingFields(pamerFields).then(res=>{
console.log(res); console.log(res);
}) this.conversionField = res;
});
}, },
route(flowData) {
route(flowData){ this.localPath.fileName = flowData.name;
this.localPath.fileName = flowData.name
console.log(this.localPath); console.log(this.localPath);
}, },
addFilePathSelection(){ addFilePathSelection() {
this.filePathSelection = !this.filePathSelection this.filePathSelection = !this.filePathSelection;
this.form.filename = this.localPath.fileName;
this.form.directory = this.localPath.fileName
}, },
inputSelection(val, index) { inputSelection(val, index) {
...@@ -611,15 +750,15 @@ export default { ...@@ -611,15 +750,15 @@ export default {
// console.log(this.mappings); // console.log(this.mappings);
// this.inputState = val.input_step; // this.inputState = val.input_step;
// // console.log(this.inputState); // console.log(this.inputState);
// var index = this.liList.find(e =>{ // var index = this.liList.find(e =>{
// return e.index == val.index // return e.index == val.index
// }) // })
// console.log(index); // console.log(index);
// // this.liList.splice(index, 1); // this.liList.splice(index, 1);
// // this.inputIndex = index // this.inputIndex = index
// // console.log(this.inputIndex.input_step); // console.log(this.inputIndex.input_step);
// // this.inputIndex = // this.inputIndex =
}, },
//修改数据 //修改数据
...@@ -637,12 +776,35 @@ export default { ...@@ -637,12 +776,35 @@ export default {
this.outputLies = val; this.outputLies = val;
}, },
switchJournalw(val, index) {
this.outputIndexw = index;
console.log(val);
// this.outputLies = val;
this.ontFelt = val;
},
switchJournalww(val, index) {
this.outputIndexww = index;
console.log(val);
// this.outputLies = val;
this.twoFelt = val;
},
addSwitchJournal(val, index) {
this.addOutputIndex = index;
console.log(val);
// this.outputLies = val;
// this.twoFelt = val
},
handleCloseFun() { handleCloseFun() {
this.$emit("update:mappingDialog", false); this.$emit("update:mappingDialog", false);
}, },
mappingDialogFun() { mappingDialogFun() {
this.form.mappings = JSON.parse(this.form.mappings); this.form.mappings = JSON.parse(this.form.mappings);
this.form.mappings.input = []
this.form.mappings.output = []
// this.form.meta = JSON.stringify(this.meta); // this.form.meta = JSON.stringify(this.meta);
// this.form.mappings.input = this.inputIndex // this.form.mappings.input = this.inputIndex
// this.form.mappings.parameters.inherit_all_vars = this.inherit // this.form.mappings.parameters.inherit_all_vars = this.inherit
...@@ -656,21 +818,33 @@ export default { ...@@ -656,21 +818,33 @@ export default {
w.push(item.input); w.push(item.input);
q.push(item.variable); q.push(item.variable);
}); });
this.form.mappings.parameters.input = w; this.form.mappings.parameters.input = JSON.stringify(w);
this.form.mappings.parameters.variable = q; this.form.mappings.parameters.variable = JSON.stringify(q);
console.log(this.form.mappings.parameters);
// console.log(this.form.mappings.parameters); // console.log(this.form.mappings.parameters);
this.form.mappings.parameters.inherit_all_vars = this.inherit; this.form.mappings.parameters.inherit_all_vars = this.inherit;
// var qinput = []
// this.liList.forEach(item => { console.log(this.liList,'++++++++++');
// // item.connector = JSON.stringify(item.connector) console.log(this.liListru,'---------');
// qinput.push(item)
// }) this.liList.forEach((item,index) => {
this.form.mappings.input = this.liList; console.log(item,index);
this.form.mappings.output = this.liListru; item.connector = JSON.stringify(item.connector)
this.form.mappings.input.push(item)
});
this.liListru.forEach((item,index) => {
console.log(item,index);
item.connector = JSON.stringify(item.connector)
this.form.mappings.output.push(item)
});
// this.form.mappings.input = this.liList;
// console.log(this.liList, "this.liList");
// this.form.mappings.output = this.liListru;
this.form.mappings = JSON.stringify(this.form.mappings); this.form.mappings = JSON.stringify(this.form.mappings);
// this.form = JSON.stringify(this.form)
console.log(this.form.mappings); console.log(this.form.mappings);
console.log(this.form);
this.saveOutputDialog(this.form); this.saveOutputDialog(this.form);
this.handleCloseFun(); this.handleCloseFun();
}, },
...@@ -688,12 +862,12 @@ export default { ...@@ -688,12 +862,12 @@ export default {
pamerFields.append("before", true); pamerFields.append("before", true);
inputOutputFields(pamerFields).then((res) => { inputOutputFields(pamerFields).then((res) => {
// this.parameters = res; // this.parameters = res;
res.forEach((item,index)=>{ res.forEach((item, index) => {
console.log(item,index); console.log(item, index);
this.parameters.push({ this.parameters.push({
variable:item.name variable: item.name,
}) });
}) });
console.log(res); console.log(res);
}); });
}, },
...@@ -866,6 +1040,18 @@ export default { ...@@ -866,6 +1040,18 @@ export default {
* { * {
outline: none; outline: none;
} }
.sourceField {
width: 100%;
height: 500px;
border: 1px solid #ccc;
}
.addSC {
width: 100%;
height: 500px;
padding-top: 250px;
// border: 1px solid #ccc;
}
.leftDiv { .leftDiv {
width: 150px; width: 150px;
...@@ -881,6 +1067,11 @@ export default { ...@@ -881,6 +1067,11 @@ export default {
width: 120px; width: 120px;
height: 400px; height: 400px;
} }
.ulHeightS {
border: 1px solid #d2e0f1;
width: 100%;
height: 500px;
}
.list.hover { .list.hover {
cursor: pointer; cursor: pointer;
...@@ -891,6 +1082,24 @@ export default { ...@@ -891,6 +1082,24 @@ export default {
background-color: #4e9df8; background-color: #4e9df8;
color: #fff; color: #fff;
} }
.addList.hover {
cursor: pointer;
background-color: #eeeeee;
}
.addList.checked {
background-color: #4e9df8;
color: #fff;
}
.listw.hover {
cursor: pointer;
background-color: #eeeeee;
}
.listw.checked {
background-color: #4e9df8;
color: #fff;
}
.rightDiv { .rightDiv {
width: 550px; width: 550px;
height: 400px; height: 400px;
......
src/views/dashboard-kettle/components/appBulletFrame/mappingInput.vue
...@@ -24,8 +24,8 @@ ...@@ -24,8 +24,8 @@
<el-table-column label="字段"> <el-table-column label="字段">
<el-table-column prop="name" label="名称"> </el-table-column> <el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="type" label="类型"> </el-table-column> <el-table-column prop="type" 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="type" label="精度"> </el-table-column> <el-table-column prop="precision" label="精度"> </el-table-column>
<el-table-column label="操作"> <el-table-column label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
</el-form-item > </el-form-item >
<el-form-item > <el-form-item >
<el-checkbox <el-checkbox
v-model="form.capture_step_performance" v-model="form.select_unspecified"
true-label="Y" true-label="Y"
false-label="N" false-label="N"
></el-checkbox> ></el-checkbox>
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
:before-close="handleClose" :before-close="handleClose"
:modal="false" :modal="false"
> >
<el-form ref="form" :model="fiel" label-width="160px"> <el-form ref="form" :model="fiel" label-width="120px">
<el-form-item label="名称:"> <el-form-item label="名称:">
<el-input v-model="fiel.name"></el-input> <el-input v-model="fiel.name"></el-input>
</el-form-item> </el-form-item>
...@@ -79,12 +79,20 @@ ...@@ -79,12 +79,20 @@
<el-select v-model="fiel.type" style="width: 100%" clearable> <el-select v-model="fiel.type" style="width: 100%" clearable>
<el-option <el-option
v-for="item in type" v-for="item in type"
:key="item.code" :key="item.id"
:label="item.descrp" :label="item.name"
:value="item.code" :value="item.name"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="长度:">
<el-input v-model="fiel.length"></el-input>
</el-form-item>
<el-form-item label="精度:">
<el-input v-model="fiel.precision"></el-input>
</el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
...@@ -96,7 +104,7 @@ ...@@ -96,7 +104,7 @@
</template> </template>
<script> <script>
import { systemDataTypes } from "@/api/kettle/link"; import { valueMeta } from "@/api/kettle/link";
export default { export default {
props: ["form", "mappingInputDialog", "saveOutputDialog", "nodeData"], props: ["form", "mappingInputDialog", "saveOutputDialog", "nodeData"],
data() { data() {
...@@ -110,7 +118,6 @@ export default { ...@@ -110,7 +118,6 @@ export default {
}, },
created() { created() {
this.systemDataTypesFun();
}, },
methods: { methods: {
...@@ -119,6 +126,8 @@ export default { ...@@ -119,6 +126,8 @@ export default {
this.newGraph = graph; this.newGraph = graph;
console.log(val, "拿到form"); console.log(val, "拿到form");
this.fields = JSON.parse(val.fields); this.fields = JSON.parse(val.fields);
this.valueMetaFun();
}, },
handleCloseFun() { handleCloseFun() {
...@@ -161,8 +170,8 @@ export default { ...@@ -161,8 +170,8 @@ export default {
} }
}, },
systemDataTypesFun() { valueMetaFun() {
systemDataTypes().then((res) => { valueMeta().then((res) => {
this.type = res; this.type = res;
}); });
}, },
......
src/views/dashboard-kettle/components/appBulletFrame/mappingOutput.vue
...@@ -11,9 +11,6 @@ ...@@ -11,9 +11,6 @@
<el-input v-model="form.label"></el-input> <el-input v-model="form.label"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="handleCloseFun">取 消</el-button> <el-button @click="handleCloseFun">取 消</el-button>
...@@ -23,35 +20,7 @@ ...@@ -23,35 +20,7 @@
</span> </span>
</el-dialog> </el-dialog>
<el-dialog
title="添加字段"
:visible.sync="addField"
width="500px"
:before-close="handleClose"
:modal="false"
>
<el-form ref="form" :model="fiel" label-width="160px">
<el-form-item label="名称:">
<el-input v-model="fiel.name"></el-input>
</el-form-item>
<el-form-item label="类型:">
<el-select v-model="fiel.type" style="width: 100%" clearable>
<el-option
v-for="item in type"
:key="item.code"
:label="item.descrp"
:value="item.code"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="addField = false">取 消</el-button>
<el-button type="primary" @click="addFieldDetermine">确 定</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -61,16 +30,11 @@ export default { ...@@ -61,16 +30,11 @@ export default {
props: ["form", "mappingOutputDialog", "saveOutputDialog", "nodeData"], props: ["form", "mappingOutputDialog", "saveOutputDialog", "nodeData"],
data() { data() {
return { return {
addField: false,
fields: [],
type: {},
dataStatus: false,
fiel: {},
}; };
}, },
created() { created() {
this.systemDataTypesFun();
}, },
methods: { methods: {
...@@ -78,7 +42,6 @@ export default { ...@@ -78,7 +42,6 @@ export default {
console.log(graph, "双击获取值"); console.log(graph, "双击获取值");
this.newGraph = graph; this.newGraph = graph;
console.log(val, "拿到form"); console.log(val, "拿到form");
this.fields = JSON.parse(val.fields);
}, },
handleCloseFun() { handleCloseFun() {
...@@ -87,17 +50,10 @@ export default { ...@@ -87,17 +50,10 @@ export default {
mappingOutputDialogFun() { mappingOutputDialogFun() {
this.handleCloseFun(); this.handleCloseFun();
this.form.fields = JSON.stringify(this.fields);
this.saveOutputDialog(this.form); this.saveOutputDialog(this.form);
}, },
addFieldDetermine() {
this.addField = !this.addField;
if (this.dataStatus) {
this.fields.push(this.fiel);
} else {
}
},
// 关闭弹框 // 关闭弹框
handleClose(done) { handleClose(done) {
this.$confirm("确认关闭？") this.$confirm("确认关闭？")
...@@ -111,21 +67,8 @@ export default { ...@@ -111,21 +67,8 @@ export default {
rows.splice(index, 1); rows.splice(index, 1);
}, },
addSheet(state, val) {
this.addField = !this.addField;
this.dataStatus = state;
if (state) {
this.fiel = {};
} else {
this.fiel = val;
}
},
systemDataTypesFun() {
systemDataTypes().then((res) => {
this.type = res;
});
},
}, },
}; };
</script> </script>
......
src/views/dashboard-kettle/components/appBulletFrame/nullOperation.vue
...@@ -13,11 +13,9 @@ ...@@ -13,11 +13,9 @@
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="cd">取 消</el-button> <el-button @click="nullOperationDialog = false">取 消</el-button>
<el-button type="primary" @click="fetch" <el-button type="primary" @click="nullOperationDialogFun"
>确 定</el-button >确 定</el-button
> >
</span> </span>
...@@ -75,69 +73,10 @@ export default { ...@@ -75,69 +73,10 @@ export default {
methods: { methods: {
cd(){
var arr = [0, 1, 1, 6, 0, 3, 1, 2, 5, 2, 8, 0]
var q = []
for (let i = 0; i < arr.length; i++) {
if(q.indexOf(arr[i]) == -1){
q.push(arr[i]);
}
}
return console.log(q);;
},
fetch(){
var list = [{
typeId: 10,
typeName: '大菜',
foodId: 1,
foodName: '鱼香肉丝'
},
{
typeId: 9,
typeName: '小菜',
foodId: 2,
foodName: '手拍黄瓜'
},
{
typeId: 10,
typeName: '大菜',
foodId: 3,
foodName: '红烧排骨'
}
]
var newListq = []
var newList = []
for (let i = 0; i < list.length; i++) {
let newLists = []
if (list[i].typeId== 10 || list[i].typeName=='大菜') {
newLists.typeId = 10
newLists.typeName = "大菜"
newLists.foodList = [{foodId:list[i].foodId,foodName:list[i].foodName}]
newListq.push(newLists)
}else if (list[i].typeId== 9 || list[i].typeName=='小菜') {
newLists.typeId = 9
newLists.typeName = "小菜"
newLists.foodList = [{foodId:list[i].foodId,foodName:list[i].foodName}]
newListq.push(newLists)
}
}
return console.log([]==[]);
},
clickFun(graph, val) { clickFun(graph, val) {
console.log(graph, "双击获取值"); console.log(graph, "双击获取值");
this.newGraph = graph; this.newGraph = graph;
console.log(val, "拿到form"); console.log(val, "拿到form");
this.fields = JSON.parse(val.fields);
}, },
handleCloseFun() { handleCloseFun() {
......
src/views/dashboard-kettle/components/appBulletFrame/recordConnection.vue 0 → 100644
<template>
<div class="customConstant">
<el-dialog
title="记录集连接"
:visible.sync="recordConnectionDialog"
width="800px"
:before-close="handleCloseFun"
>
<el-form ref="form" :model="form" label-width="120px">
<el-form-item label="步骤名称:">
<el-input v-model="form.label"></el-input>
</el-form-item>
<el-form-item label="第一个步骤:">
<el-select v-model="form.step1" style="width: 100%" @click.native="lastStep">
<el-option
v-for="(item, index) in allSteps"
:key="index"
:value="item.name"
:label="item.name"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="第二个步骤:">
<el-select v-model="form.step2" style="width: 100%" @click.native="lastStep">
<el-option
v-for="(item, index) in allSteps"
:key="index"
:value="item.name"
:label="item.name"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="连接类型:">
<el-select v-model="form.join_type" style="width: 100%">
<el-option
v-for="(item, index) in type"
:key="index"
:value="item.name"
:label="item.name"
></el-option>
</el-select>
</el-form-item>
</el-form>
<br />
<el-row :gutter="20">
<el-col :span="12">
第一个步骤的连接字段
<br />
<el-button type="text" @click="oneStep(true)">添加字段</el-button>
<el-button type="text" @click="stepFields(true)">获取字段</el-button>
<el-table :data="key1" border style="width: 100%">
<el-table-column prop="key" label="连接字段"> </el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button
@click="oneStep(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, key1)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-col>
<el-col :span="12">
第二个步骤的连接字段
<br />
<el-button type="text" @click="twoStep(true)">添加字段</el-button>
<el-button type="text" @click="stepFields(false)">获取字段</el-button>
<el-table :data="key2" border style="width: 100%">
<el-table-column prop="key" label="连接字段"> </el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button
@click="twoStep(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deleteField(scope.$index, key2)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCloseFun">取 消</el-button>
<el-button type="primary" @click="SystemInfoDialogFun">确 定</el-button>
</span>
</el-dialog>
<el-dialog
:title="this.addstate ? '第一个步骤添加字段' : '第一个步骤修改字段'"
:visible.sync="oneStepDialog"
width="500px"
:before-close="handleClose"
>
<el-form :model="keyOne" label-width="120px">
<el-form-item label="连接字段:">
<el-input v-model="keyOne.key"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="oneStepDialog = false">取 消</el-button>
<el-button type="primary" @click="oneStepDialogFun">确 定</el-button>
</span>
</el-dialog>
<el-dialog
:title="this.addstate ? '第二个步骤添加字段' : '第二个步骤修改字段'"
:visible.sync="twoStepsDialog"
width="500px"
:before-close="handleClose"
>
<el-form :model="keyTwo" label-width="120px">
<el-form-item label="连接字段:">
<el-input v-model="keyTwo.key"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="twoStepsDialog = false">取 消</el-button>
<el-button type="primary" @click="twoStepsDialogFun">确 定</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 { typesss, previousSteps, inputOutputFields } from "@/api/kettle/link";
import loginVue from "../../../login.vue";
export default {
props: ["form", "recordConnectionDialog", "saveOutputDialog", "nodeData"], //从父组件传过来的值
data() {
return {
allSteps: [],
type: [],
newGraph: [],
key1: [],
key2: [],
addstate: false,
oneStepDialog: false,
twoStepsDialog:false,
keyOne:{},
keyTwo:{},
};
},
created() {},
methods: {
clickFun(graph, val) {
// console.log(val);
// console.log(graph, "双击获取值");
this.newGraph = graph;
this.key1 = JSON.parse(val.key1);
this.key2 = JSON.parse(val.key2);
// this.fields = JSON.parse(val.fields)
console.log(val, "拿到form");
this.types();
},
lastStep() {
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.allSteps = res;
});
},
stepFields(state) {
if (state) {
this.key1 = [];
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFiel = new FormData(); // 创建form对象
pamerFiel.append("stepName", this.form.step1);
pamerFiel.append("graphXml", this.graphXml);
pamerFiel.append("before", false);
inputOutputFields(pamerFiel).then((res) => {
res.forEach((itme) => {
this.key1.push({
key: itme.name,
});
});
});
} else {
this.key2 = [];
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(this.newGraph.getModel());
this.graphXml = mxUtils.getPrettyXml(node);
let pamerFiel = new FormData(); // 创建form对象
pamerFiel.append("stepName", this.form.step2);
pamerFiel.append("graphXml", this.graphXml);
pamerFiel.append("before", false);
inputOutputFields(pamerFiel).then((res) => {
res.forEach((itme) => {
this.key2.push({
key: itme.name,
});
});
});
}
},
oneStep(state,val) {
this.oneStepDialog = !this.oneStepDialog;
this.addstate = state;
if (state) {
this.keyOne = {}
}else{
this.keyOne = val
}
},
oneStepDialogFun() {
this.oneStepDialog = !this.oneStepDialog;
if (this.addstate) {
this.key1.push(this.keyOne)
}
},
twoStep(state,val) {
this.twoStepsDialog = !this.twoStepsDialog;
this.addstate = state;
if (state) {
this.keyTwo = {}
}else{
this.keyTwo = val
}
},
twoStepsDialogFun() {
this.twoStepsDialog = !this.twoStepsDialog;
if (this.addstate) {
this.key2.push(this.keyTwo)
}
},
types() {
let se = new FormData(); // 创建form对象
se.append("query", "");
typesss(se).then((res) => {
this.type = res;
});
},
//删除
deleteField(index, rows) {
rows.splice(index, 1);
},
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
handleCloseFun() {
this.$emit("update:recordConnectionDialog", false);
},
SystemInfoDialogFun() {
this.form.key1 = JSON.stringify(this.key1);
this.form.key2 = JSON.stringify(this.key2);
this.handleCloseFun();
// this.form.fields = JSON.stringify(this.fields);
this.saveOutputDialog(this.form);
},
deleteRow(index, rows) {
rows.splice(index, 1);
},
},
};
</script>
<style lang="scss" scoped>
</style>
src/views/dashboard-kettle/components/designer/modules/node_menu.vue
...@@ -88,7 +88,9 @@ export default { ...@@ -88,7 +88,9 @@ export default {
return { return {
// prefix:'http://192.168.0.2:9700/etlweb/', // 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/`, // prefix:`http://192.168.0.24:9888/ETLWEB-SERVER/etlweb/`,
prefix:`http://192.168.0.25:9889/ETLWEB-SERVER/etlweb/`,
// 测试数据开始===== // 测试数据开始=====
jobTreeList: [ jobTreeList: [
{ {
......
src/views/dashboard-kettle/components/designer/mxgraphDesigner.vue
...@@ -845,6 +845,18 @@ ...@@ -845,6 +845,18 @@
:saveOutputDialog="saveOutputDialog" :saveOutputDialog="saveOutputDialog"
></mergeRecords> ></mergeRecords>
<!-- 记录连接-->
<recordConnection
ref="recordConnection"
:disabed="true"
:form="form"
:nodeData="nodeData"
:recordConnectionDialog.sync="recordConnectionDialog"
:saveOutputDialog="saveOutputDialog"
></recordConnection>
<!-- 改变开始复制的数量 --> <!-- 改变开始复制的数量 -->
<el-dialog <el-dialog
title="改变开始复制的数量" title="改变开始复制的数量"
...@@ -1220,6 +1232,7 @@ import sortRecord from "../appBulletFrame/sortRecord"; //排序记录 ...@@ -1220,6 +1232,7 @@ import sortRecord from "../appBulletFrame/sortRecord"; //排序记录
import setVariable from "../appBulletFrame/setVariable"; //设置变量 import setVariable from "../appBulletFrame/setVariable"; //设置变量
import getVariable from "../appBulletFrame/getVariable"; //获取变量 import getVariable from "../appBulletFrame/getVariable"; //获取变量
import mergeRecords from "../appBulletFrame/mergeRecords"; //合并记录 import mergeRecords from "../appBulletFrame/mergeRecords"; //合并记录
import recordConnection from '../appBulletFrame/recordConnection';//记录连接
import selectField from "../appBulletFrame/selectField"; //选择字段 import selectField from "../appBulletFrame/selectField"; //选择字段
import toRepeat from "../appBulletFrame/toRepeat"; //去除重复 import toRepeat from "../appBulletFrame/toRepeat"; //去除重复
import mapping from "../appBulletFrame/mapping"; //映射(子转换) import mapping from "../appBulletFrame/mapping"; //映射(子转换)
...@@ -1349,6 +1362,7 @@ export default { ...@@ -1349,6 +1362,7 @@ export default {
setVariableDialog: false, //设置变量 setVariableDialog: false, //设置变量
getVariableDialog: false, //获取变量 getVariableDialog: false, //获取变量
mergeRecordsDialog: false, //合并记录 mergeRecordsDialog: false, //合并记录
recordConnectionDialog:false,//记录连接
selectFieldDialog: false, //选择字段 selectFieldDialog: false, //选择字段
conversionSettingsDialog: false, //转换设置 conversionSettingsDialog: false, //转换设置
jobSettingsDialog: false, //作业设置 jobSettingsDialog: false, //作业设置
...@@ -1458,6 +1472,7 @@ export default { ...@@ -1458,6 +1472,7 @@ export default {
setVariable, //设置变量 setVariable, //设置变量
getVariable, //获取变量 getVariable, //获取变量
mergeRecords, //合并记录 mergeRecords, //合并记录
recordConnection,// 记录连接
selectField, //选择字段 selectField, //选择字段
conversionSettings, //转换设置 conversionSettings, //转换设置
jobSettings, //作业设置 jobSettings, //作业设置
...@@ -1731,19 +1746,7 @@ export default { ...@@ -1731,19 +1746,7 @@ export default {
// } // }
// }, // },
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,
name,
this.form[name]
);
this.graph.getModel().execute(edit);
}
},
copyNumberFun() { copyNumberFun() {
console.log(this.form, "数据"); console.log(this.form, "数据");
...@@ -2170,11 +2173,32 @@ export default { ...@@ -2170,11 +2173,32 @@ export default {
valueFormat(pamer2).then((res) => { valueFormat(pamer2).then((res) => {
this.fieldFormat = res; this.fieldFormat = res;
}); });
// if (this.curFileType == "transformation" && cell.dis == "step98") ||
// cell.value.attributes.ctype.value == "Dummy" ) {
// }else if ( (this.curFileType == "transformation" && cell.dis == "srep167") ||
if ( cell.value.attributes.ctype.value == "MappingInput") {
this.mappingInputDialog = !this.mappingInputDialog
this.form = this.showDataFunc();
setTimeout(() => {
this.$refs.mappingInput.clickFun(this.graph,this.form);
}, 500);
}else if ( (this.curFileType == "transformation" && cell.dis == "srep168") ||
cell.value.attributes.ctype.value == "MappingOutput") {
this.mappingOutputDialog = !this.mappingOutputDialog
this.form = this.showDataFunc();
setTimeout(() => {
this.$refs.mappingOutput.clickFun(this.graph,this.form);
}, 500);
}else if (
(this.curFileType == "transformation" && cell.dis == "srep133") ||
cell.value.attributes.ctype.value == "MergeJoin"
) {
this.recordConnectionDialog = !this.recordConnectionDialog
this.form = this.showDataFunc();
setTimeout(() => {
this.$refs.recordConnection.clickFun(this.graph,this.form);
}, 500);
}else if (
(this.curFileType == "transformation" && cell.dis == "srep98") || (this.curFileType == "transformation" && cell.dis == "srep98") ||
cell.value.attributes.ctype.value == "Dummy" cell.value.attributes.ctype.value == "Dummy"
) { ) {
...@@ -2586,14 +2610,14 @@ export default { ...@@ -2586,14 +2610,14 @@ export default {
this.$refs.conversionSettings.clickFun(this.graph, this.form); //向子组件传递画布 this.$refs.conversionSettings.clickFun(this.graph, this.form); //向子组件传递画布
}, 500); }, 500);
}); });
menu.addItem("映射输入规范", null, () => { // menu.addItem("映射输入规范", null, () => {
console.log(cell, "当前节点"); // console.log(cell, "当前节点");
this.mappingInputDialog = !this.mappingInputDialog; // this.mappingInputDialog = !this.mappingInputDialog;
}); // });
menu.addItem("映射输出规范", null, () => { // menu.addItem("映射输出规范", null, () => {
console.log(cell, "当前节点"); // console.log(cell, "当前节点");
this.mappingOutputDialog = !this.mappingOutputDialog; // this.mappingOutputDialog = !this.mappingOutputDialog;
}); // });
// menu.addItem("空操作", null, () => { // menu.addItem("空操作", null, () => {
// console.log(cell, "当前节点"); // console.log(cell, "当前节点");
// this.nullOperationDialog = !this.nullOperationDialog; // this.nullOperationDialog = !this.nullOperationDialog;
......
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