Commit a7d791fc by 莫晓莉

表输出组件字段获取

parent e8853010
import main from './main.vue'
export default main
\ No newline at end of file
<template>
<div>
<el-table :data="tableData" style="width: 100%">
<template v-for="(item,index) in tableHead">
<el-table-column :prop="item.column_name" :label="item.column_comment" :key="index"></el-table-column>
</template>
<el-table-column label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="editField(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deletefield(scope.$index, tableData)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import { getFileexplorer,getFilextension } from "@/api/kettle/file";
export default {
name: "table-list",
data() {
return {
fieldForm: {},
// field: false,
dataState: false,
fieldFormat: [],
fieldType: [],
// 表头数据
// tableHead2:[
// {
// column_name: "column_name",column_comment:"表字段"
// },
// {
// column_name: "column_age",column_comment:"流字段"
// },
// ],
// // 表格数据
// tableData2: [{
// column_age: '3',
// column_name: '鞠婧祎',
// },
// {
// column_age: '25',
// column_name: '魏大勋',
// },
// {
// column_age: '18',
// column_name: '关晓彤',
// }],
}
},
props: {
tableHead:Array,
tableData:Array,
field:Boolean,
fieldClick:Function
},
created() {
},
methods: {
editField(state, val) {
// this.field = !this.field;
this.$emit("update:field", true);
this.fieldClick(state, val);
// this.dataState = state;
// if (state) {
// this.fieldForm = {};
// } else {
// this.fieldForm = val;
// }
},
// handleClose(){},
deletefield(index, rows) {
rows.splice(index, 1);
},
// 字段
// addField() {
// this.field = !this.field;
// if (this.dataState) {
// this.tableData.push(this.fieldForm);
// } else {
// }
// },
},
};
</script>
<style>
.type-checked {
background-color: #8888ff;
color: #fff;
}
</style>
\ No newline at end of file
......@@ -132,16 +132,58 @@
<el-tab-pane label="数据库字段" name="oher ">
<el-card class="box-card">
<div slot="header" class="clearfix">
<el-button style="padding: 3px 0" type="text">新增字段</el-button>
<el-button style="padding: 3px 0" type="text" @click="fieldClick(true)">新增字段</el-button>
<el-button style="padding: 3px 0" type="text">删除字段</el-button>
<el-button style="padding: 3px 0" type="text">获取字段</el-button>
<el-button style="padding: 3px 0" type="text">输入字段映射</el-button>
</div>
<el-table style="width: 100%" border :data="tableData2">
<!-- <el-table style="width: 100%" border :data="tableData2">
<template v-for="(item,index) in tableHead2">
<el-table-column :prop="item.column_name" :label="item.column_comment" :key="index" v-if="item.column_name != 'id'"></el-table-column>
</template>
</el-table>
</el-table> -->
<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="form" :model="fieldForm" label-width="80px">
<!-- <el-checkbox-group v-model="checkedCities" style="width:100%;">
<el-checkbox > -->
<el-form-item label="表字段:">
<el-select v-model="fieldForm.column_name" style="width: 100%">
<el-option label="不去掉空格" value="none"></el-option>
<el-option label="去掉左空格" value="left"></el-option>
<el-option label="去掉右空格" value="right"></el-option>
<el-option label="去掉左右两端空格" value="both"></el-option>
</el-select>
</el-form-item>
<!-- </el-checkbox> -->
<!-- <el-checkbox > -->
<el-form-item label="流字段:">
<el-select v-model="fieldForm.stream_name" style="width: 100%">
<el-option label="不去掉空格" value="none"></el-option>
<el-option label="去掉左空格" value="left"></el-option>
<el-option label="去掉右空格" value="right"></el-option>
<el-option label="去掉左右两端空格" value="both"></el-option>
</el-select>
</el-form-item>
<!-- </el-checkbox>
</el-checkbox-group> -->
</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-tab-pane>
</el-tabs>
......@@ -155,9 +197,18 @@
</template>
<script>
import {
inputOutputFields,//获取表输出
} from "@/api/kettle/file";
export default ({
data(){
return{
field:false,//编辑弹窗
checkedCities: ['上海', '北京'],
editDia:false,//编辑表字段
fieldForm:{},//编辑弹窗
radioTreaty:'0',
tableOutForm:{
commit: "1000",
......@@ -191,6 +242,31 @@ export default ({
include_subfolders: "1",
},
],
// 表头数据
tableHead:[
{
column_name: "column_name",column_comment:"表字段"
},
{
column_name: "stream_name",column_comment:"流字段"
},
],
// 表格数据
tableData: [{
stream_name: '3',
column_name: '鞠婧祎',
},
{
stream_name: '25',
column_name: '魏大勋',
},
{
stream_name: '18',
column_name: '关晓彤',
}],
// 表头数据
tableHead2:[
{
......@@ -253,40 +329,50 @@ export default ({
handleClose(){
this.$emit("update:tableOutPutVisible", false);
},
//新建转换
createTrans(){
var formData = new FormData();
var formData = new FormData();
formData.append('dir', this.nodePath);
formData.append('transName', this.inputValue);
// console.log('新建提交参数==',params);
createTrans(formData).then(res=>{
if (res) {
this.$message.success('创建成功!');
this.explorer('');
this.$emit("update:estabDialogVisible", false);
//获取表输出
inputOutputFields(){
// var enc = new mxCodec(mxUtils.createXmlDocument());
// var node = enc.encode(graph.getModel());
// store.baseParams.stepName = encodeURIComponent(cell.getAttribute('label'));
// store.baseParams.graphXml = mxUtils.getPrettyXml(node);
// store.baseParams.before = true
let pamer = new FormData(); // 创建form对象
pamer.append("stepName", this.nodePath);
pamer.append("graphXml", "transformation");
pamer.append("before", true);
pamer.append("query", '');
inputOutputFields(pamer).then(res=>{
console.log(res,'返回空白画布xml');
this.blankCanvas = res
})
},
}else {
this.$message.error(res.errMsg)
//新增或者编辑弹窗
fieldClick(state, val) {
this.field = !this.field;
this.dataState = state;
if (state) {
this.fieldForm = {};
} else {
this.fieldForm = val;
}
})
},
// 上传
handleChange(file, fileList) {
// console.log(file);
this.fileList = fileList.slice(-3);
this.tableData.push({ name: file.name });
// console.log(this.tableData);
// this.getObjectURL(file.raw)
// console.log(this.getObjectURL(file.raw));
//关闭编辑的弹窗
handleCloseEdit(){
this.field = !this.field;
},
addSheet(){},
fileChnageInput(e) {
console.log(e);
// 字段
addField() {
this.field = !this.field;
console.log('添加的字段===',this.fieldForm);
if (this.dataState) {
this.tableData.push(this.fieldForm);
}
},
}
})
</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