Skip to content

E
ETL-admin
Commit 5ab0f3e2 by 莫晓莉
Options

javascript代码组件

parent a353a67d
Showing with 994 additions and 8 deletions
src/views/dashboard-kettle/components/designer/mxgraphDesigner.vue
...@@ -1132,6 +1132,8 @@ ...@@ -1132,6 +1132,8 @@
:doubleClickCell="doubleClickCell" :doubleClickCell="doubleClickCell"
:scriptFormSend="outPutFormData16" :scriptFormSend="outPutFormData16"
></sqlScriptDialog> ></sqlScriptDialog>
<!-- 转换-脚本-javascript -->
<javaScriptDialog ref="refJavaScript" :javaScriptVisible.sync="javaScriptVisible" :saveOutputDialog="saveOutputDialog" :doubleClickCell="doubleClickCell" :javaScriptFormSend="outPutFormData6" ></javaScriptDialog>
<!-- 脚本弹窗组件end --> <!-- 脚本弹窗组件end -->
<!-- 转换弹窗组件start --> <!-- 转换弹窗组件start -->
...@@ -1271,6 +1273,7 @@ import switchDialog from "../../../stream-dialog/switch"; ...@@ -1271,6 +1273,7 @@ import switchDialog from "../../../stream-dialog/switch";
// 脚本弹窗组件start--------------------- // 脚本弹窗组件start---------------------
import sqlScriptDialog from "../../../script-dialog/sql-script"; import sqlScriptDialog from "../../../script-dialog/sql-script";
import javaScriptDialog from "../../../script-dialog/java-script";//转换-脚本-javaScript代码
// 脚本弹窗组件end----------------------- // 脚本弹窗组件end-----------------------
// 转换弹窗组件start---------- // 转换弹窗组件start----------
...@@ -1387,6 +1390,7 @@ export default { ...@@ -1387,6 +1390,7 @@ export default {
// 流程弹窗组件end------------ // 流程弹窗组件end------------
// 脚本组件start----- // 脚本组件start-----
scriptVisible:false, scriptVisible:false,
javaScriptVisible:false,
// 脚本组件end----- // 脚本组件end-----
// 输入模块 // 输入模块
...@@ -1499,6 +1503,7 @@ export default { ...@@ -1499,6 +1503,7 @@ export default {
// 脚本弹窗组件--- // 脚本弹窗组件---
sqlScriptDialog, sqlScriptDialog,
javaScriptDialog
// 脚本弹窗组件--- // 脚本弹窗组件---
// 转换弹窗组件start--- // 转换弹窗组件start---
...@@ -2548,6 +2553,14 @@ export default { ...@@ -2548,6 +2553,14 @@ export default {
this.$refs.importXmlFile.clickFun(this.graph,this.form);//向子组件传递画布 this.$refs.importXmlFile.clickFun(this.graph,this.form);//向子组件传递画布
}, 500); }, 500);
return; return;
}else if((this.curFileType=="transformation" && cell.ids == "step106") || cell.value.attributes.ctype.value == "ScriptValueMod" ){
//脚本 --javaScript代码
this.javaScriptVisible = !this.javaScriptVisible;
this.outPutFormData6 = this.showDataFunc()
setTimeout(() => {
this.$refs.refJavaScript.clickFun(this.graph);//向子组件传递画布
}, 500);
return;
} }
}); });
...@@ -3145,8 +3158,10 @@ export default { ...@@ -3145,8 +3158,10 @@ export default {
<style lang="scss" type="text/scss" scoped> <style lang="scss" type="text/scss" scoped>
.mxgraphClass, .mxgraphClass,
#mxgraph { #mxgraph {
height: 100vh; // height: 100vh;
height: 82vh;
width: 100%; width: 100%;
overflow: auto;
} }
.moveR-enter-active, .moveR-enter-active,
.moveR-leave-active { .moveR-leave-active {
......
src/views/dialogs-components/global/table-list/main.vue
...@@ -67,14 +67,14 @@ export default { ...@@ -67,14 +67,14 @@ export default {
} }
}, },
props: { // props: {
tableHead:Array, // tableHead:Array,
tableData:Array, // tableData:Array,
field:Boolean, // field:Boolean,
fieldClick:Function // fieldClick:Function
// },
props: ["tableHead","tableData","field","fieldClick"],
},
created() { created() {
}, },
......
src/views/script-dialog/java-script.vue 0 → 100644
<template>
<div>
<el-dialog
title="JavaScript代码"
:visible.sync="javaScriptVisible"
width="800px"
:before-close="handleClose"
top="10%"
>
<el-form ref="delForm" :model="myForm" label-width="200px">
<el-form-item label="步骤名称:" label-width="150px">
<el-input v-model="myForm.label"></el-input>
</el-form-item>
<el-row :gutter="20">
<el-col :span="8">
<!-- <el-input v-model="deleteForm.commit"></el-input> -->
<!-- 左边 -->
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>java script函数：</span>
<!-- <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button> -->
</div>
<!-- <div v-for="o in 4" :key="o" class="text item">
{{'列表内容 ' + o }}
</div> -->
<div style="height:25vh;overflow:auto;">
<!-- 555555555555 -->
<el-tree
class="trees"
:data="fileTreeList"
:props="defaultProps"
:render-after-expand="false"
>
<!-- <div class="custom-tree-node" slot-scope="{ node, data }">
<div
class="custom-tree-node"
:key-id="data.children ? '' : 123"
:id="data.id"
:icon="prefix+data.icon"
:pluginId="data.pluginId"
>
<img :src="prefix+data.icon" style="width:20px" width="" alt="">
{{ data.text }}
</div>
</div> -->
<span class="custom-tree-node" slot-scope="{ node, data }">
<span style="display: flex; align: center">
<div
v-if="data.iconCls"
:class="data.iconCls"
style="
display: inline-block;
width: 20px;
height: 20px;
background-repeat: no-repeat;
background-position: center;
"
width=""
alt=""
></div>
{{ node.label }}
</span>
</span>
</el-tree>
</div>
</el-card>
</el-col>
<el-col :span="16">
<!-- <el-input v-model="deleteForm.commit"></el-input> -->
<!-- <el-form-item> -->
<!-- 右边 -->
<!-- <el-tabs type="border-card" closable >
<el-tab-pane label="用户管理">
<el-input type="textarea" v-model="myForm.jsScripts" :rows="8"></el-input>
</el-tab-pane>
</el-tabs> -->
<!-- </el-form-item> -->
<!-- <el-tabs v-model="editableTabsValue" type="card" closable @tab-remove="removeTab"> -->
<el-tabs v-model="editableTabsValue" type="border-card" closable >
<el-tab-pane
v-for="(item, index) in myForm.jsScripts"
:key="index"
:label="item.name"
:name="item.name"
>
<!-- <span slot="label" style="display: flex; align-items: center">
<div
class="scriptType"
style="
display: inline-block;
width: 20px;
height: 20px;
background-repeat: no-repeat;
background-position: center;
"
width=""
alt=""
></div>{{item.name}}
</span> -->
<el-input type="textarea" v-model="item.value" :rows="8"></el-input>
</el-tab-pane>
</el-tabs>
</el-col>
</el-row>
<el-card class="box-card" style="margin-top:15px;">
<div slot="header" class="clearfix">
<!-- <span>查询值所需的关键字</span> -->
<el-button style="padding: 3px 0;" 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="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="120px">
<el-form-item label="字段名称:">
<el-input v-model="fieldForm.name"></el-input>
</el-form-item>
<el-form-item label="改名为:">
<el-input v-model="fieldForm.rename"></el-input>
</el-form-item>
<el-form-item label="类型:">
<el-select v-model="fieldForm.type" style="width: 100%" @focus="getValueMetaStore">
<el-option v-for="(item,index) in metaStoreList" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item label="长度:">
<el-input v-model="fieldForm.length"></el-input>
</el-form-item>
<el-form-item label="精度:">
<el-input v-model="fieldForm.precision"></el-input>
</el-form-item>
<el-form-item label="替换'FieldName'或'Rename to'值:">
<el-select v-model="fieldForm.replace" style="width: 100%">
<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="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="handleClose">取 消</el-button>
<el-button @click="testJs">测试脚本</el-button>
<el-button type="primary" @click="confirm">确 定</el-button>
</span>
</el-dialog>
<testDialog
ref="refTest"
:testVisible.sync="testVisible"
:testDataReturn="testDataReturn"
:doubleClickCell="doubleClickCell"
:formSend="formSend" ></testDialog>
<!-- <testDialog
ref="refTest"
:testVisible.sync="testVisible"
:testDataReturn="testDataReturn"
:doubleClickCell="doubleClickCell"
></testDialog> -->
</div>
</template>
<script>
import mxgraph from "@/utils/mxgraph";
const {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} = mxgraph
import {
getValueMetaStore,//获取类型
getLeftTree,//获取文件夹左边树
testData,//测试脚本
} from "@/api/kettle/file";
import testDialog from "./test-script";//
export default ({
components:{
testDialog,
},
data(){
return{
formSend:{
fields:"[]",
label:"## TEST DATA ##",
lastTimeField:"",
neverEnding:"N",
rowLimit:"10",
rowTimeField:"",
},//测试弹窗数据
testVisible:false,//测试脚本弹窗
testDataReturn:{},
editableTabsValue:'Script 1',
metaStoreList:[],//类型
// defaultProps: {
// children: "children",
// label: "text",
// id: "id",
// pluginId:"pluginId",
// },
defaultProps: {
label: "text",
children: "children",
},
fileTreeList: [],
prefix: this.etlWeb,
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: "name",column_comment:"字段名称"
},
{
column_name: "rename",column_comment:"改名为"
},
{
column_name: "type",column_comment:"类型"
},
{
column_name: "length",column_comment:"长度"
},
{
column_name: "precision",column_comment:"精度"
},
{
column_name: "replace",column_comment:"替换'FieldName'或'Rename to'值"
}
],
// 表格数据
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------
javaScriptFormSend(val){
console.log("回显的表单数据===",val);
this.myForm=val;
if(this.myForm.fields){
var ny=JSON.parse(this.myForm.fields);
this.tableData=ny;
}
var jsArray=JSON.parse(this.myForm.jsScripts);
var newJsScripts=[],newObj={};
jsArray.forEach((item)=>{
item.value=decodeURIComponent(item.value);
})
// this.myForm.jsScripts=
console.log("解码后集合",jsArray);
this.myForm.jsScripts=jsArray;
// this.myForm.jsValue=this.myForm.jsScripts[0].value;
},
// 解决子组件改变父组件传进来的变量的属性不报错start------
},
props:["javaScriptVisible","doubleClickCell","saveOutputDialog","javaScriptFormSend"],
// props:{
// title:{
// type:String,
// default:''
// },
// nodePath:{
// type:String,
// default:''
// },
// deleteVisible:{
// type: Boolean,
// default:false
// },
// },
mounted(){
},
// created(){
// // 深拷贝解决第一次不执行
// this.newform=JSON.parse(JSON.stringify(this.form));
// },
methods:{
clickFun(graph){
console.log(graph,'双击获取值')
this.newGraph = graph;
// setTimeout(() => {
// this.$refs.databaseChoose.clickFun(this.newGraph);
this.getLeftTree();
// }, 500);
},
// 获取左边树文件列表
getLeftTree(){
var formData = new FormData();
// 画布xml转码
const codec = new mxCodec();
const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
var myXmlVal = mxUtils.getPrettyXml(encodedModel);//xml字符串
formData.append("graphXml", myXmlVal);
if(this.doubleClickCell){
var title=this.doubleClickCell.value.attributes.label.value
}
formData.append("stepName", title);
formData.append("node", "xnode-1446");
this.$forceUpdate();
getLeftTree(formData).then((res) => {
if (res) {
this.fileTreeList = res;
} else {
this.$message.error(res.errMsg);
}
});
},
handleClose(){
this.$emit("update:javaScriptVisible", false);
},
confirm(){
// this.deleteForm.label=this.doubleClickCell.title;
this.myForm.jsScripts=JSON.stringify(this.myForm.jsScripts);//字段复值
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);
}
},
//删除全部
deleteFields(){
this.tableData=[];
},
// ----------------------------------------
// 获取字段类型
getValueMetaStore(){
var formData = new FormData();
formData.append('query', '');
getValueMetaStore(formData).then(res=>{
if (res) {
console.log('字段类型==',res);
this.metaStoreList=res;
}else {
this.$message.error(res.errMsg)
}
})
},
// 测试脚本
testJs(){
this.testData();
this.testVisible=!this.testVisible;
setTimeout(() => {
this.$refs.refTest.clickFun(this.newGraph);
}, 500);
},
//测试脚本
testData(){
if(this.doubleClickCell){
var title=this.doubleClickCell.value.attributes.label.value
}
var formData = new FormData();
// 画布xml转码
const codec = new mxCodec();
const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
console.log("获取字段的画布详情：", encodedModel);
var myXmlVal = mxUtils.getPrettyXml(encodedModel);//xml字符串
formData.append('graphXml', myXmlVal);
formData.append('stepName', title);
testData(formData).then(res=>{
if (res) {
console.log('测试脚本testData返回==',res);
this.testDataReturn=res;
// var doc = res.responseXML;
// var e = res.documentElement;
// console.log('测试脚本testData返回e---',e);
// this.testVisible=!this.testVisible;
// setTimeout(() => {
// this.$refs.refTest.clickFun(this.newGraph);
// }, 500);
}else {
this.$message.error(res.errMsg)
}
})
}
// ----------------------------------------
}
})
</script>
\ No newline at end of file
src/views/script-dialog/test-script.vue 0 → 100644
<template>
<div>
<el-dialog
title="生成记录"
:visible.sync="testVisible"
width="800px"
:before-close="handleClose"
top="10%"
>
<el-form ref="delForm" :model="myForm" label-width="230px">
<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-input v-model="myForm.rowLimit"></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="Never stop generating rows:">
<el-row :gutter="10">
<el-col :span="23">
<el-checkbox v-model="myForm.neverEnding" true-label='Y' false-label="N"></el-checkbox>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="Interval in ms(delay):">
<el-row :gutter="10">
<el-col :span="23">
<el-input v-model="myForm.intervalInMs"></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="Current row time field name:">
<el-row :gutter="10">
<el-col :span="23">
<el-input v-model="myForm.rowTimeField"></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="Previous row time field name:">
<el-row :gutter="10">
<el-col :span="23">
<el-input v-model="myForm.lastTimeField"></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="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.name"></el-input>
</el-form-item>
<el-form-item label="类型:">
<el-select v-model="fieldForm.type" style="width: 100%" @focus="getValueMetaStore">
<el-option v-for="(item,index) in metaStoreList" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item label="格式:">
<el-select v-model="fieldForm.format" style="width: 100%" @focus="getValueFormatStore">
<el-option v-for="(item,index) in formatStoreList" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item label="长度:">
<el-input v-model="fieldForm.length"></el-input>
</el-form-item>
<el-form-item label="精度:">
<el-input v-model="fieldForm.precision"></el-input>
</el-form-item>
<el-form-item label="货币类型:">
<el-input v-model="fieldForm.currencyType"></el-input>
</el-form-item>
<el-form-item label="小数:">
<el-input v-model="fieldForm.decimal"></el-input>
</el-form-item>
<el-form-item label="分组:">
<el-input v-model="fieldForm.group"></el-input>
</el-form-item>
<el-form-item label="值:">
<el-input v-model="fieldForm.value"></el-input>
</el-form-item>
<el-form-item label="设为空串？:">
<el-row :gutter="10">
<el-col :span="23">
<el-checkbox v-model="fieldForm.nullable" true-label='Y' false-label="N"></el-checkbox>
</el-col>
</el-row>
</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="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="testScript">确 定</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 {
getValueMetaStore,//获取类型
getValueFormatStore,//获取格式
testScript,//测试
// tableFields,
// inputOutputFields,//获取表输出
} from "@/api/kettle/file";
export default ({
data(){
return{
// formSend:{},
testReturn:{},
metaStoreList:[],//类型
formatStoreList:[],//格式
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: "name",column_comment:"名称"
},
{
column_name: "type",column_comment:"类型"
},
{
column_name: "format",column_comment:"格式"
},
{
column_name: "length",column_comment:"长度"
},
{
column_name: "precision",column_comment:"精度"
},
{
column_name: "currencyType",column_comment:"货币类型"
},
{
column_name: "decimal",column_comment:"小数"
},
{
column_name: "group",column_comment:"分组"
},
{
column_name: "value",column_comment:"值"
},
{
column_name:"nullable",column_comment:"设为空串？"
}
],
// 表格数据
tableData: [
// {
// field: '3',
// condition: '鞠婧祎',
// name: '女',
// name2:'1',
// },
// {
// field: '31',
// condition: '鞠婧祎',
// name: '女',
// name2:'1',
// },
// {
// field: '32',
// condition: '鞠婧祎',
// name: '女',
// name2:'1',
// },
],
// 查询字段--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------
formSend:{
　　 immediate:true,
handler:function(val){
console.log("测试脚本回显的表单数据===",val);
this.myForm=val;
if(this.myForm.fields){
var ny=JSON.parse(this.myForm.fields);
this.tableData=ny;
}
}
　　}
},
// props:["formSend","testVisible","testDataReturn","doubleClickCell"],
props:["formSend","testVisible","testDataReturn","doubleClickCell"],
// props:["testVisible","testDataReturn","doubleClickCell"],
mounted(){
},
// created(){
// // 深拷贝解决第一次不执行
// this.newform=JSON.parse(JSON.stringify(this.form));
// },
methods:{
// clickFun(graph,form){
// console.log(graph,'双击获取值')
// this.newGraph = graph;
// this.formSend=form;
// },
clickFun(graph){
console.log(graph,'双击获取值')
this.newGraph = graph;
},
handleClose(){
this.$emit("update:testVisible", false);
},
confirm(){
// this.deleteForm.label=this.doubleClickCell.title;
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);
// this.tableData=JSON.parse(this.tableData);
}
},
tableFields(){
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);
// pamer.append("before", true);
// pamer.append("query", '');
pamer.append("databaseName", this.deleteForm.connection);
// 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字符串
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.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=[];
},
// ----------------------------------------
// 获取字段类型
getValueMetaStore(){
var formData = new FormData();
formData.append('query', '');
getValueMetaStore(formData).then(res=>{
if (res) {
console.log('字段类型==',res);
this.metaStoreList=res;
}else {
this.$message.error(res.errMsg)
}
})
},
// 获取格式
getValueFormatStore(){
var formData = new FormData();
formData.append('valueType', 'all');
getValueFormatStore(formData).then(res=>{
if (res) {
console.log('字段格式==',res);
this.formatStoreList=res;
}else {
this.$message.error(res.errMsg)
}
})
},
//测试
testScript(){
if(this.doubleClickCell){
var title=this.doubleClickCell.value.attributes.label.value
}
var formData = new FormData();
// 画布xml转码
const codec = new mxCodec();
const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
console.log("获取字段的画布详情：", encodedModel);
var myXmlVal = mxUtils.getPrettyXml(encodedModel);//xml字符串
formData.append('graphXml', myXmlVal);
formData.append('stepName', title);
formData.append('rowGenerator', this.testDataReturn);
testScript(formData).then(res=>{
if (res) {
console.log('测试脚本test返回==',res);
this.testReturn=res;
this.handleClose();//关闭弹窗
// var doc = res.responseXML;
// var e = res.documentElement;
// console.log('测试脚本testData返回e---',e);
}
// else {
// this.$message.error(res.errMsg)
// }
})
}
// ----------------------------------------
}
})
</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