Skip to content

E
ETL-admin
Commit 1de08991 by 李耀琨
Options

更新

parent ab6029de
Showing with 1188 additions and 609 deletions
package.json
{
"name": "eladmin-web",
"version": "2.6.0",
"description": "EL-ADMIN 前端源码",
"description": " 前端源码",
"author": "Zheng Jie",
"license": "Apache-2.0",
"scripts": {
......
src/api/kettle/link.js
......@@ -388,3 +388,24 @@ export function variableType(data){
method: 'post'
})
}
// 语言列表
export function localeLists(data){
return request({
url:'etlweb//system/locale',
data,
method: 'post'
})
}
// 语言
export function locale(data){
return request({
url:'etlweb/ui/locale',
data,
method: 'post'
})
}
src/layout/components/Sidebar/Logo.vue
......@@ -25,7 +25,7 @@ export default {
},
data() {
return {
title: 'ELADMIN-后台管理',
title: '后台管理',
logo: Logo
}
}
......
src/settings.js
......@@ -2,7 +2,7 @@ module.exports = {
/**
* @description 网站标题
*/
title: 'EL-ADMIN',
title: '后台管理系统',
/**
* @description 是否显示 tagsView
*/
......
src/views/dashboard-kettle/components/appBulletFrame/conversionSettings.vue 0 → 100644
<template>
<div class="tableInput">
<el-dialog
title="提示"
:visible.sync="conversionSettingsDialog"
width="800px"
:before-close="handleClose"
>
<el-tabs type="border-card">
<el-tab-pane label="转换">
<el-form :model="conversionForm" label-width="160px">
<el-form-item label="转换名称">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="转换文件">
<el-input v-model="conversionForm.fileName"></el-input>
</el-form-item>
<el-form-item label="描述">
<el-input v-model="conversionForm.description"></el-input>
</el-form-item>
<el-form-item label="扩展描述">
<el-input
type="textarea"
v-model="conversionForm.extended_description"
:rows="5"
></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select
v-model="conversionForm.trans_status"
style="width: 100%"
>
<el-option label="草案" value="shanghai"></el-option>
<el-option label="产品" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="版本">
<el-input v-model="conversionForm.trans_version"></el-input>
</el-form-item>
<el-form-item label="目录">
<el-input v-model="conversionForm.directory"></el-input>
</el-form-item>
<el-form-item label="创建者">
<el-input v-model="conversionForm.created_user"></el-input>
</el-form-item>
<el-form-item label="创建时间">
<el-input v-model="conversionForm.created_date"></el-input>
</el-form-item>
<el-form-item label="最近修改的用户">
<el-input v-model="conversionForm.modified_user"></el-input>
</el-form-item>
<el-form-item label="最近修改的用户">
<el-input v-model="conversionForm.modified_date"></el-input>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="命名参数">
<el-button type="text">添加字段</el-button>
<el-table :data="fields" style="width: 100%">
<el-table-column prop="name" 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 label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deletefield(scope.$index, fields)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="日志">
<div>
<div class="leftDiv">
<ul>
<li class="list" v-for="item in liList" :key="item.id" @click="switchJournal(item)" style="cursor:pointer" :class="{'hover': switchState == item.id,'checked': switchState == item.id}">{{ item.name }}</li>
</ul>
</div>
<div class="rightDiv">
<div class="topRight">
<el-form :model="logEntry" label-width="200px">
<el-form-item label="日志数据库连接:">
<el-input v-model="logEntry.name"></el-input>
</el-form-item>
<el-form-item label="日志表模式:">
<el-input v-model="logEntry.name"></el-input>
</el-form-item>
<el-form-item label="日志表:">
<el-input v-model="logEntry.name"></el-input>
</el-form-item>
<el-form-item label="日志记录间隔时间(秒):">
<el-input v-model="logEntry.name"></el-input>
</el-form-item>
<el-form-item label="日志记录过时时间(天):">
<el-input v-model="logEntry.name"></el-input>
</el-form-item>
<el-form-item label="在内存中保存的日志行数限制:">
<el-input v-model="logEntry.name"></el-input>
</el-form-item>
</el-form>
</div>
<div class="lowerRight">
<el-table
:data="tableData"
height="250"
border
style="width: 100%"
:row-style="{ height: '10px' }"
:cell-style="{ height: '10px' }"
>
<el-table-column prop="date" label="启用"> </el-table-column>
<el-table-column prop="name" label="字段名称"> </el-table-column>
<el-table-column prop="address" label="步骤名称"></el-table-column>
<el-table-column prop="address" label="字段描述"></el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button
@click="liListClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="日期">
<el-form :model="conversionForm" label-width="160px">
<el-form-item label="最大日期数据库连接:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="最大日期表:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="最大日期字段:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="最大日期偏移(秒):">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="最大日期区别(秒):">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="依赖">
<el-button type="text">添加字段</el-button>
<el-table :data="fields" style="width: 100%">
<el-table-column prop="name" 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 label="操作" width="100px">
<template slot-scope="scope">
<el-button
@click="fieldClick(false, scope.row)"
type="text"
size="small"
>编辑</el-button
>
<el-button
type="text"
size="small"
@click="deletefield(scope.$index, fields)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="杂项">
<el-form :model="conversionForm" label-width="230px">
<el-form-item label="记录集合里的记录数:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="转换时是否在日志中记录反馈行?:">
<el-checkbox
v-model="conversionForm.errorIgnored"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
<el-form-item label="每个反馈行的处理记录数:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="使用唯一连接:">
<el-checkbox
v-model="conversionForm.errorIgnored"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
<el-form-item label="共享对象文件:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="管理线程优先级:">
<el-checkbox
v-model="conversionForm.errorIgnored"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
<el-form-item label="转换引擎类型:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="监控">
<el-form :model="conversionForm" label-width="180px">
<el-form-item label="开启步骤性能监控?:">
<el-checkbox
v-model="conversionForm.errorIgnored"
true-label="Y"
false-label="N"
></el-checkbox>
</el-form-item>
<el-form-item label="步骤性能监测间隔(毫秒):">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
<el-form-item label="内存中最大的快照数量:">
<el-input v-model="conversionForm.name"></el-input>
</el-form-item>
</el-form>
</el-tab-pane>
</el-tabs>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose">取 消</el-button>
<el-button type="primary" @click="conversionSettingsDialogFun"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
props: ["conversionSettingsDialog"],
data() {
return {
conversionForm: {},
fields: [],
liList: [
{
id: 1,
name: "转换",
},
{
id: 2,
name: "步骤",
},
{
id: 3,
name: "运行",
},
{
id: 4,
name: "日志通道",
},
{
id: 5,
name: "Metrics",
},
],
logEntry: {},
tableData: [
{
date: "2016-05-03",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-02",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-01",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-08",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-06",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-07",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
],
switchState:1,
};
},
created() {},
methods: {
switchJournal(val){
this.switchState = val.id
console.log(val);
},
handleClose() {
this.$emit("update:conversionSettingsDialog", false);
},
conversionSettingsDialogFun() {
this.handleClose();
},
},
};
</script>
<style>
.leftDiv {
width: 150px;
height: 500px;
/* background-color: antiquewhite; */
border: 1px solid #d2e0f1;
float: left;
padding: 10px;
}
.list.hover{
cursor: pointer;
background-color: #EEEEEE;
}
.list.checked{
background-color:#4e9df8;
color: #fff;
}
.rightDiv {
width: 550px;
height: 400px;
float: left;
}
.topRight {
width: 550px;
height: 250px;
border: 1px solid #d2e0f1;
padding: 10px;
/* background-color: aqua; */
}
.lowerRight {
width: 550px;
height: 250px;
border: 1px solid #d2e0f1;
padding: 10px;
overflow: hidden;
/* background-color: aqua; */
}
</style>
\ No newline at end of file
src/views/dashboard-kettle/components/designer/mxgraphDesigner.vue
......@@ -1072,6 +1072,14 @@
></job-run>
<!-- 执行作业结束 -->
<conversionSettings
ref="conversionSettings"
:conversionSettingsDialog.sync="conversionSettingsDialog"
></conversionSettings>
<!-- 数据浏览-->
<el-dialog
title="数据浏览"
......@@ -1137,6 +1145,8 @@ import getVariable from "../appBulletFrame/getVariable"; //获取变量
import mergeRecords from "../appBulletFrame/mergeRecords"; //合并记录
import selectField from "../appBulletFrame/selectField"; //选择字段
import conversionSettings from "../appBulletFrame/conversionSettings" //转换设置
// 作业弹窗组件开始---------------------------------------
import trans from "../../../job-dialog/trans";
import setvalue from "../../../job-dialog/set-value";
......@@ -1251,6 +1261,7 @@ export default {
getVariableDialog: false, //获取变量
mergeRecordsDialog: false, //合并记录
selectFieldDialog:false,//选择字段
conversionSettingsDialog:false,//转换设置
// 流程弹窗组件start----------
// 流程弹窗组件end------------
......@@ -1349,6 +1360,7 @@ export default {
getVariable, //获取变量
mergeRecords, //合并记录
selectField,//选择字段
conversionSettings,//转换设置
// 作业弹簧组件end----------------------
// 流程弹窗组件start---------
switchDialog,
......@@ -2366,7 +2378,7 @@ export default {
//画布右键
menu.addItem("转换属性设置", null, () => {
console.log(cell, "当前节点");
alert("Item 1");
this.conversionSettingsDialog = !this.conversionSettingsDialog
});
menu.addSeparator();
......
src/views/kettle/home.vue
......@@ -54,7 +54,7 @@
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item> 语言切换</el-dropdown-item>
<el-dropdown-item> 语言切换1111</el-dropdown-item>
<el-dropdown-item >关于</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
......
src/views/kettle/home2.vue
......@@ -2,61 +2,88 @@
<div class="box">
<div class="left">
<!-- <el-tabs v-model="activeName" type="card" @tab-click="handleClick"> -->
<el-tabs v-model="activeName" type="card" >
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="资源库" name="first">
<div class="sel-content">
<div class="sel-menu-bar">
<el-dropdown
size="small"
placement="bottom"
>
<el-dropdown size="small" placement="bottom">
<span class="sel-btn">
新建
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="password" @click.native="createTrans()">
<el-dropdown-item
command="password"
@click.native="createTrans()"
>
<template>
<i style="color:red;font-weight:bold;font-size:15px;" class="el-icon-refresh"></i>
<i
style="color: red; font-weight: bold; font-size: 15px"
class="el-icon-refresh"
></i>
新建转换
</template>
</el-dropdown-item>
<el-dropdown-item command="logout" @click.native="createJob()">
<el-dropdown-item
command="logout"
@click.native="createJob()"
>
<template>
<i style="color:#F99C1C;font-weight:bold;font-size:15px;" class="el-icon-refresh-left"></i>
<i
style="
color: #f99c1c;
font-weight: bold;
font-size: 15px;
"
class="el-icon-refresh-left"
></i>
新建任务
</template>
</el-dropdown-item>
<el-dropdown-item style="text-align:right" @click.native="createFile()">新建目录</el-dropdown-item>
<el-dropdown-item class="text-center" @click.native="deleteFile()">删除</el-dropdown-item>
<el-dropdown-item
style="text-align: right"
@click.native="createFile()"
>新建目录</el-dropdown-item
>
<el-dropdown-item
class="text-center"
@click.native="deleteFile()"
>删除</el-dropdown-item
>
<el-dropdown-item class="text-center">打开</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown
size="small"
placement="bottom">
<el-dropdown size="small" placement="bottom">
<span class="sel-btn">
资源库管理
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="showModalOne()">连接资源库</el-dropdown-item>
<el-dropdown-item >管理资源库</el-dropdown-item>
<el-dropdown-item @click.native="disconnect()" >断开资源库</el-dropdown-item>
<el-dropdown-item @click.native="exportTreeDialog()">导出资源库</el-dropdown-item>
<el-dropdown-item @click.native="importTreeDialog()">导入资源库</el-dropdown-item>
<el-dropdown-item @click.native="showModalOne()"
>连接资源库</el-dropdown-item
>
<el-dropdown-item>管理资源库</el-dropdown-item>
<el-dropdown-item @click.native="disconnect()"
>断开资源库</el-dropdown-item
>
<el-dropdown-item @click.native="exportTreeDialog()"
>导出资源库</el-dropdown-item
>
<el-dropdown-item @click.native="importTreeDialog()"
>导入资源库</el-dropdown-item
>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown
size="small"
placement="bottom">
<el-dropdown size="small" placement="bottom">
<span class="sel-btn">
帮组
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item> 语言切换</el-dropdown-item>
<el-dropdown-item >关于</el-dropdown-item>
<el-dropdown-item @click.native="language">
语言切换</el-dropdown-item
>
<el-dropdown-item>关于</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
......@@ -73,12 +100,23 @@
@node-click="handleNodeClick"
>
<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>
<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>
<!-- 文件夹存放区域end -->
</div>
......@@ -87,63 +125,102 @@
<div class="sel-content">
<!-- 核心对象 -->
<!-- <nodeMenu2 ref="nodeMenu2" @shooStatus="shooStatus"></nodeMenu2> -->
<nodeMenu2 ref="nodeMenu2" ></nodeMenu2>
<nodeMenu2 ref="nodeMenu2"></nodeMenu2>
</div>
</el-tab-pane>
</el-tabs>
</div>
<div class="resize" title="收缩侧边栏">...</div>
<div class="mid">
<el-tabs v-if="tabShowFlag" style="margin-top:-5vh;margin-bottom:0;" v-model="picName" type="card" closable @tab-remove="removeTab">
<el-tabs
v-if="tabShowFlag"
style="margin-top: -5vh; margin-bottom: 0"
v-model="picName"
type="card"
closable
@tab-remove="removeTab"
>
<!-- <el-tab-pane label="数据库名称" > -->
<el-tab-pane :label="curNodeText" >
<el-tab-pane :label="curNodeText">
<!-- <mxgraph-designer ref="pic" v-if="mxGraphShow" :blankCanvas="blankCanvas"></mxgraph-designer> -->
<mxgraph-designer ref="graphContainer" :blankCanvas="blankCanvas"></mxgraph-designer>
<mxgraph-designer
ref="graphContainer"
:blankCanvas="blankCanvas"
></mxgraph-designer>
</el-tab-pane>
</el-tabs>
</div>
<!-- 弹窗1start -->
<el-dialog
title="资源库连接"
:visible.sync="dialogVisibleOne"
width="500px"
:before-close="handleCloseOne">
:before-close="handleCloseOne"
>
<div>
<el-link @click.native="showModalTwo" class="btn-pointer" :underline="false">新增资源库</el-link>
<el-link class="btn-pointer" @click.native="editDataBase">修改资源库</el-link>
<el-link @click.native="deleteLinkRes" class="btn-pointer" :underline="false">删除资源库</el-link>
<el-link
@click.native="showModalTwo"
class="btn-pointer"
:underline="false"
>新增资源库</el-link
>
<el-link class="btn-pointer" @click.native="editDataBase"
>修改资源库</el-link
>
<el-link
@click.native="deleteLinkRes"
class="btn-pointer"
:underline="false"
>删除资源库</el-link
>
</div>
<div class="table-container">
<!-- <ul >
<li v-for="(item,index) in count" :key="index" class="infinite-list-item">{{ item }}</li>
</ul> -->
<ul >
<li class="btn" @mouseenter="listHoverIdx = idx" @mouseleave="listHoverIdx = -1" @click="chooselink(item,idx)" :class="{'hover': listHoverIdx == idx,'checked': listCheckedIdx == idx}" v-for="(item,idx) in linkList" :key="idx" >
<ul>
<li
class="btn"
@mouseenter="listHoverIdx = idx"
@mouseleave="listHoverIdx = -1"
@click="chooselink(item, idx)"
:class="{
hover: listHoverIdx == idx,
checked: listCheckedIdx == idx,
}"
v-for="(item, idx) in linkList"
:key="idx"
>
{{ item.name }}
</li>
</ul>
</div>
<el-form style="margin-top:15px;" label-position="left" :rules="loginRules" :model="loginModel" status-icon ref="loginForm" label-width="100px" class="demo-ruleForm">
<el-form
style="margin-top: 15px"
label-position="left"
:rules="loginRules"
:model="loginModel"
status-icon
ref="loginForm"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item label="用户名" prop="username">
<el-input v-model="loginModel.username"></el-input>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input v-model="loginModel.password" ></el-input>
<el-input v-model="loginModel.password"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCloseOne">取 消</el-button>
<el-button type="primary" @click.native="loginRepository('loginForm')">确 定</el-button>
<el-button type="primary" @click.native="loginRepository('loginForm')"
>确 定</el-button
>
</span>
<!-- </el-form> -->
</el-dialog>
......@@ -155,22 +232,34 @@
:visible.sync="dialogVisibleTwo"
width="650px"
top="15%"
:before-close="handleCloseTwo">
:before-close="handleCloseTwo"
>
<div class="table-container table-container-repos">
<ul>
<!-- <li :class="typeFlag==index?'type-checked':''" @click="chooseLinkType(index)" ref="acp" v-for="(item,index) in typesList" :key="index" >
{{ item.type }}:{{ item.name }}
</li> -->
<li class="btn" @mouseenter="typeHoverIdx = idx" @mouseleave="typeHoverIdx = -1" @click="typeCheckedIdx=idx" :class="{'hover': typeHoverIdx == idx,'checked': typeCheckedIdx == idx}" v-for="(item,idx) in typesList" :key="idx" >
<li
class="btn"
@mouseenter="typeHoverIdx = idx"
@mouseleave="typeHoverIdx = -1"
@click="typeCheckedIdx = idx"
:class="{
hover: typeHoverIdx == idx,
checked: typeCheckedIdx == idx,
}"
v-for="(item, idx) in typesList"
:key="idx"
>
{{ item.type }}:{{ item.name }}
</li>
</ul>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="FileModal = true">取 消</el-button>
<el-button type="primary" @click="showModalThree(typeCheckedIdx)">确 定</el-button>
<el-button type="primary" @click="showModalThree(typeCheckedIdx)"
>确 定</el-button
>
</span>
</el-dialog>
......@@ -182,17 +271,35 @@
:visible.sync="dialogVisibleThree"
width="600px"
top="19%"
:before-close="handleCloseThree">
<el-form style="margin-top:15px;" :model="repositoryInfoModel" status-icon ref="repositoryInfoForm" label-width="150px" class="demo-ruleForm">
:before-close="handleCloseThree"
>
<el-form
style="margin-top: 15px"
:model="repositoryInfoModel"
status-icon
ref="repositoryInfoForm"
label-width="150px"
class="demo-ruleForm"
>
<el-form-item label="选择数据库连接">
<!-- <el-select v-model="ruleForm.region" placeholder="请选择选择数据库连接">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select> -->
<el-select v-model="selectName" placeholder="请选择选择数据库连接" @focus="clickFunc" @change="selectNameFunc">
<el-option v-for="(item,index) in namesList" :key="index" :label="item.name" :value="item.name"></el-option>
<el-select
v-model="selectName"
placeholder="请选择选择数据库连接"
@focus="clickFunc"
@change="selectNameFunc"
>
<el-option
v-for="(item, index) in namesList"
:key="index"
:label="item.name"
:value="item.name"
></el-option>
</el-select>
<span style="margin-left:15px;">
<span style="margin-left: 15px">
<el-button @click="editDataBaseModal()">编辑</el-button>
<el-button @click="showModalFourth()">新建</el-button>
<el-button @click="deleteLink(selectName)">删除</el-button>
......@@ -206,7 +313,11 @@
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="repositoryInfoConfirm('repositoryInfoForm')">确 定</el-button>
<el-button
type="primary"
@click="repositoryInfoConfirm('repositoryInfoForm')"
>确 定</el-button
>
<el-button @click="createOrUpdate">创建或更新</el-button>
<el-button @click="dialogVisibleRemind = true">删 除</el-button>
<el-button @click="dialogVisibleThree = false">取 消</el-button>
......@@ -215,11 +326,14 @@
</el-dialog>
<!-- 弹窗3end -->
<!-- 弹窗4start -->
<estab-dialog ref="establishDia" :noneRespository="noneRespository" :dialogVisibleFourth.sync='dialogVisibleFourth' @getSonValue="getSonValue" :listNames="listNames"></estab-dialog>
<estab-dialog
ref="establishDia"
:noneRespository="noneRespository"
:dialogVisibleFourth.sync="dialogVisibleFourth"
@getSonValue="getSonValue"
:listNames="listNames"
></estab-dialog>
<!-- 弹窗5start -->
<el-dialog
......@@ -227,31 +341,51 @@
:visible.sync="FileModal"
width="600px"
top="19%"
:before-close="closeFileModal">
<el-form style="margin-top:15px;" :model="ruleForm" status-icon ref="ruleForm" label-width="150px" class="demo-ruleForm">
:before-close="closeFileModal"
>
<el-form
style="margin-top: 15px"
:model="ruleForm"
status-icon
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
>
<el-form-item label="根目录" prop="pass">
<div style="display:flex;">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
<span style="margin-left:15px;">
<div style="display: flex">
<el-input
type="password"
v-model="ruleForm.pass"
autocomplete="off"
></el-input>
<span style="margin-left: 15px">
<el-button @click="FileModalScan = true">浏览</el-button>
</span>
</div>
</el-form-item>
<el-form-item label="只读资源库？:" prop="checkPass">
<el-checkbox ></el-checkbox>
<el-checkbox></el-checkbox>
</el-form-item>
<el-form-item label="不显示隐藏文件:" prop="checkPass">
<el-checkbox ></el-checkbox>
<el-checkbox></el-checkbox>
</el-form-item>
<el-form-item label="资源库标志" prop="checkPass">
<el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
<el-input
type="password"
v-model="ruleForm.checkPass"
autocomplete="off"
></el-input>
</el-form-item>
<el-form-item label="名称" prop="checkPass">
<el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
<el-input
type="password"
v-model="ruleForm.checkPass"
autocomplete="off"
></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
......@@ -261,15 +395,14 @@
</el-dialog>
<!-- 弹窗5end -->
<!-- 弹窗6start -->
<el-dialog
title="文件浏览器"
:visible.sync="FileModalScan"
width="450px"
top="19%"
:before-close="closeFileModalScan">
:before-close="closeFileModalScan"
>
<div class="file-container">
<!-- 文件夹存放区域start-->
<!-- <el-tree
......@@ -297,204 +430,261 @@
</span>
</el-tree> -->
<!-- 文件夹存放区域end -->
</div>
<span slot="footer" class="dialog-footer" style="display:flex;">
<el-select style="flex:1;margin-right:25px;" v-model="ruleForm.region" placeholder="请选择选择数据库连接">
<span slot="footer" class="dialog-footer" style="display: flex">
<el-select
style="flex: 1; margin-right: 25px"
v-model="ruleForm.region"
placeholder="请选择选择数据库连接"
>
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
<el-button @click="FileModalScan = false">取 消</el-button>
<el-button type="primary" @click="FileModalScan = false">确 定</el-button>
<el-button type="primary" @click="FileModalScan = false"
>确 定</el-button
>
</span>
</el-dialog>
<!-- 弹窗6end -->
<testDialogue ref="testDialogue" :dialogVisible.sync='testDialogueFlag'></testDialogue>
<dialogRemind ref="testDialogueRemind" @getValue="getValueFromChild" :dialogVisibleOne.sync='dialogVisibleRemind' :repositoryInfoModel="repositoryInfoModel" :selectName='selectName'></dialogRemind>
<scanDialog ref="scanDialog" :scanDialogVisible.sync="scanDialogVisible" :createModel="createModel"></scanDialog>
<feature ref="feature" :featureDialogVisible.sync="featureDialogVisible"></feature>
<establishDialog ref="establishDialog" :estabDialogVisible.sync="estabDialogVisible" :title="estabTitle" :nodePath="nodePath" :explorer="explorer"></establishDialog>
<export-tree ref="exDialog" :exportDialogVisible.sync="exportDialogVisible" :explorer="explorer"></export-tree>
<in-repository ref="importDialog" :inputVisibility.sync="inputVisibility" :explorer="explorer"></in-repository>
<testDialogue
ref="testDialogue"
:dialogVisible.sync="testDialogueFlag"
></testDialogue>
<dialogRemind
ref="testDialogueRemind"
@getValue="getValueFromChild"
:dialogVisibleOne.sync="dialogVisibleRemind"
:repositoryInfoModel="repositoryInfoModel"
:selectName="selectName"
></dialogRemind>
<scanDialog
ref="scanDialog"
:scanDialogVisible.sync="scanDialogVisible"
:createModel="createModel"
></scanDialog>
<feature
ref="feature"
:featureDialogVisible.sync="featureDialogVisible"
></feature>
<establishDialog
ref="establishDialog"
:estabDialogVisible.sync="estabDialogVisible"
:title="estabTitle"
:nodePath="nodePath"
:explorer="explorer"
></establishDialog>
<export-tree
ref="exDialog"
:exportDialogVisible.sync="exportDialogVisible"
:explorer="explorer"
></export-tree>
<in-repository
ref="importDialog"
:inputVisibility.sync="inputVisibility"
:explorer="explorer"
></in-repository>
<el-dialog
title="语言切换"
:visible.sync="switchLanguageDled"
width="400px"
:before-close="handleClose">
<el-form :model="switchLanguage" label-width="80px">
<el-form-item label="选择语言">
<el-select v-model="switchLanguage.code" placeholder="请选择切换语言">
<el-option v-for=" (item,index) in languageList"
:key="index"
:value="item.code"
:label="item.desc"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="switchLanguageDledFun">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
// import '@/utils/dialog.js';
// import {jsPlumb} from 'jsplumb'
import mxgraphDesigner from '../dashboard-kettle/components/designer/mxgraphDesigner'
import nodeMenu2 from '../dashboard-kettle/components/designer/modules/node_menu2'//左边tab
import mxgraphDesigner from "../dashboard-kettle/components/designer/mxgraphDesigner";
import nodeMenu2 from "../dashboard-kettle/components/designer/modules/node_menu2"; //左边tab
import { mxGraph, mxUtils, mxEvent, mxKeyHandler, mxRubberband,mxConstants,mxStencilRegistry,mxStencil,mxCodec,mxGraphModel,mxGeometry } from 'mxgraph-js'
import {
mxGraph,
mxUtils,
mxEvent,
mxKeyHandler,
mxRubberband,
mxConstants,
mxStencilRegistry,
mxStencil,
mxCodec,
mxGraphModel,
mxGeometry,
} from "mxgraph-js";
// 弹窗组件start==================
import testDialogue from '../dialogs-components/test'
import scanDialog from '../dialogs-components/scan'
import feature from '../dialogs-components/feature'
import establishDialog from '../dialogs-components/establish'
import testDialogue from "../dialogs-components/test";
import scanDialog from "../dialogs-components/scan";
import feature from "../dialogs-components/feature";
import establishDialog from "../dialogs-components/establish";
// 弹窗组件end====================
// 删除
import {deleteLink} from '../dialogs-components/dialog'//左边tab
import dialogRemind from '../dialogs-components/dialog-remind'//删除提示弹窗
import { deleteLink } from "../dialogs-components/dialog"; //左边tab
import dialogRemind from "../dialogs-components/dialog-remind"; //删除提示弹窗
import {explorer,features,remove,checkInit,drop} from "@/api/kettle/file";
import { explorer, features, remove, checkInit, drop } from "@/api/kettle/file";
import {
types,
getLinkList,
accessMethod,//获取连接方式列表
accessData,//获取连接类型
accessMethod, //获取连接方式列表
accessData, //获取连接类型
create,
listNames,//获取已经创建的数据库列表
database,//编辑数据库信息
check,//编辑数据库
loginRepository,//连接数据库
addRepository,//资源库信息
listNames, //获取已经创建的数据库列表
database, //编辑数据库信息
check, //编辑数据库
loginRepository, //连接数据库
addRepository, //资源库信息
open,
logout
logout,
locale,
localeLists
} from "@/api/kettle/link";
// import Establish from '../dialogs-components/establish.vue'
// import Scan from '../dialogs-components/scan.vue'
export default {
components: {
mxgraphDesigner,
nodeMenu2,
testDialogue,//测试连接弹窗
dialogRemind,////删除提示弹窗
testDialogue, //测试连接弹窗
dialogRemind, ////删除提示弹窗
scanDialog,
feature,//特征列表
feature, //特征列表
establishDialog,
// Establish,//新建转换，新建作业，新建目录弹窗
},
props: ["dragItem"],
props: ["dragItem"],
data() {
return {
inputVisibility:false,//导入资源库
noneRespository:0,
curNodeText:'数据库名称',//当前点击选中的资源库节点
blankCanvas:"",//空白画布xml
graph:null,
flowData:[],
exportDialogVisible:false,//导出资源库弹窗
curDataBase:null,//当前选择的资源库
nodePath:'',//当前选中文件夹
curNodeIconCls:'',//当前选中节点
estabDialogVisible:false,//新建转换，新建作业，新建目录弹窗
estabTitle:'转换',//新建转换弹窗提示
featureDialogVisible:false,//特征列表弹窗
scanDialogVisible:false,//浏览弹窗
prefix:this.etlWeb,
inputValue:'',// 密码
languageList:[],
switchLanguage:{},
switchLanguageDled:false,
inputVisibility: false, //导入资源库
noneRespository: 0,
curNodeText: "数据库名称", //当前点击选中的资源库节点
blankCanvas: "", //空白画布xml
graph: null,
flowData: [],
exportDialogVisible: false, //导出资源库弹窗
curDataBase: null, //当前选择的资源库
nodePath: "", //当前选中文件夹
curNodeIconCls: "", //当前选中节点
estabDialogVisible: false, //新建转换，新建作业，新建目录弹窗
estabTitle: "转换", //新建转换弹窗提示
featureDialogVisible: false, //特征列表弹窗
scanDialogVisible: false, //浏览弹窗
prefix: this.etlWeb,
inputValue: "", // 密码
// dropFunction,//删除数据库表
deleteLink,//删除资源库模块的方法
dialogVisibleRemind:false,//资源库信息删除提示弹窗
testDialogueFlag:false,//测试弹弹窗
tabShowFlag:true,//控制选项卡的显示和隐藏
picName:'',//画板的标签明名称
accessDataList:[],//连接类型
typesList:[],//资源库连接类型
deleteLink, //删除资源库模块的方法
dialogVisibleRemind: false, //资源库信息删除提示弹窗
testDialogueFlag: false, //测试弹弹窗
tabShowFlag: true, //控制选项卡的显示和隐藏
picName: "", //画板的标签明名称
accessDataList: [], //连接类型
typesList: [], //资源库连接类型
typeHoverIdx: -1,
typeCheckedIdx: -2 ,
linkList:[],//获取历史连接的资源库列表
listHoverIdx: -1,//鼠标移动到历史创建数据库列表
listCheckedIdx: -2 ,//当前选择历史创建数据库列表
accessMethods:[],//连接方式列表
typeCheckedIdx: -2,
linkList: [], //获取历史连接的资源库列表
listHoverIdx: -1, //鼠标移动到历史创建数据库列表
listCheckedIdx: -2, //当前选择历史创建数据库列表
accessMethods: [], //连接方式列表
// linkHoverIdx: -1,//鼠标移动到连接类型
// linkCheckedIdx: -2 ,//当前选择连接类型列表
// methodHoverIdx:0,//鼠标移动到连接方式
// methodCheckedIdx: 0,//当前选择连接方式列表
initlinkTypeIdx:0,//初始化默认选择oracle
namesList:[],//已经创建的数据库列表
createModel:{
name:'',
type:'',
access:'',
hostname:'',
databaseName:'',
port:'',
username:'',
password:'',
stramingReasults:'',
supportBooleanDataType:'',
supportTimestampDataType:'',
preserveReservedCaseCheck:'',
extraOptions:[],
usingConnectionPool:'N',
initialPoolSize:'5',
maximumPoolSize:'10',
partitioned:'N',
partitionInfo:[]
},//创建数据库
selectName:'',//当前选中的下拉框的数据
dataBaseDetail:{},//数据库详情
addFlag:true,//新增还是编辑数据库判断
loginModel:{},//数据库连接
loginRules:{
username:[
{required:true,message:'请输入用户名',trigger:'blur'}
initlinkTypeIdx: 0, //初始化默认选择oracle
namesList: [], //已经创建的数据库列表
createModel: {
name: "",
type: "",
access: "",
hostname: "",
databaseName: "",
port: "",
username: "",
password: "",
stramingReasults: "",
supportBooleanDataType: "",
supportTimestampDataType: "",
preserveReservedCaseCheck: "",
extraOptions: [],
usingConnectionPool: "N",
initialPoolSize: "5",
maximumPoolSize: "10",
partitioned: "N",
partitionInfo: [],
}, //创建数据库
selectName: "", //当前选中的下拉框的数据
dataBaseDetail: {}, //数据库详情
addFlag: true, //新增还是编辑数据库判断
loginModel: {}, //数据库连接
loginRules: {
username: [
{ required: true, message: "请输入用户名", trigger: "blur" },
],
password:[
{required:true,message:'请输入密码',trigger:'blur'}
],
},//连接验证
repositoryInfoModel:{
name:'',
description:''
},//资源库信息
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
}, //连接验证
repositoryInfoModel: {
name: "",
description: "",
}, //资源库信息
// methodCheckedText:'Native (JDBC)',//当前选择的连接方式test
rulesOne:{
name:[
{required:true,message:'请输入名称',trigger:'blur'}
],
hostname:[
{required:true,message:'请输入主机名称',trigger:'blur'}
],
databaseName:[
{required:true,message:'请输入数据库名称',trigger:'blur'}
],
port:[
{required:true,message:'请输入端口号',trigger:'blur'}
rulesOne: {
name: [{ required: true, message: "请输入名称", trigger: "blur" }],
hostname: [
{ required: true, message: "请输入主机名称", trigger: "blur" },
],
username:[
{required:true,message:'请输入用户名',trigger:'blur'}
databaseName: [
{ required: true, message: "请输入数据库名称", trigger: "blur" },
],
password:[
{required:true,message:'请输入密码',trigger:'blur'}
port: [{ required: true, message: "请输入端口号", trigger: "blur" }],
username: [
{ required: true, message: "请输入用户名", trigger: "blur" },
],
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
// logLevel:[
// {required:true,message:'请选择日志级别',trigger:'change'}
// ],
},
checkModel:[],
visible:true,
dialogDrag:false,
dialog: {// dialog显示隐藏
checkModel: [],
visible: true,
dialogDrag: false,
dialog: {
// dialog显示隐藏
dialogVisible: false,
dialogDrag: true, // 可拖拽
dialogChange: true, // 可拉伸
title: '详情'
title: "详情",
},
activeName: 'first',//当前选择的标签
activeName: "first", //当前选择的标签
// jobTreeList:[
// {
// path: 'f0',
......@@ -539,10 +729,8 @@ props: ["dragItem"],
// lasted: true,
// }
// ],
fileTreeList:[
{ iconCls:"imageFolder",
path:"/",
childen:[]},
fileTreeList: [
{ iconCls: "imageFolder", path: "/", childen: [] },
// {
// "id":"f1e1928d205b49a8b4ceda97d51074c1",
// "text":"45",
......@@ -616,8 +804,8 @@ props: ["dragItem"],
// "path":"/作业1",
// "type":"job"
// }
],
childenTreeList:[],
],
childenTreeList: [],
// defaultProps: {
// label: 'path',
// children: 'children',
......@@ -626,19 +814,16 @@ props: ["dragItem"],
label: "text",
children: "children",
},
dialogVisibleOne:false,//链接资源库弹窗
dialogVisibleOne: false, //链接资源库弹窗
ruleForm: {
pass: '',
checkPass: '',
age: ''
pass: "",
checkPass: "",
age: "",
},
dialogVisibleTwo:false,//新增资源库弹窗
count:[
'1111111111111111',
'2222222222222222'
],
dialogVisibleThree:false,//资源库信息弹窗
dialogVisibleFourth:false,
dialogVisibleTwo: false, //新增资源库弹窗
count: ["1111111111111111", "2222222222222222"],
dialogVisibleThree: false, //资源库信息弹窗
dialogVisibleFourth: false,
// linkType:[
// {value: 0, text: '一般'},
// {value: 1, text: '高级'},
......@@ -647,25 +832,20 @@ props: ["dragItem"],
// {value: 4, text: '集群'}
// ],
// nowTypeIndex:0,//当前选中数据库类型
FileModal:false,//文件资源库弹窗
FileModalScan:false,//浏览弹窗
FileModal: false, //文件资源库弹窗
FileModalScan: false, //浏览弹窗
//画布
mxGraphShow:false
mxGraphShow: false,
};
},
mounted () {
this.dragControllerDiv();//左右窗体调整宽度
mounted() {
this.dragControllerDiv(); //左右窗体调整宽度
// this.treeRevert(this.jobTreeList);
// this.accessData();//页面一加载就获取连接类型
this.explorer('');//获取文件夹列表
this.explorer(""); //获取文件夹列表
// console.log(this.$refs.establishDia.linkType,'55555555555555555')
// this.$nextTick(function () {
// console.log(this.$refs.establishDia,'========')
......@@ -675,83 +855,95 @@ props: ["dragItem"],
// })
// this.dialogVisibleFourth=true
// this.$refs.scanDialog.dataBaseScan(formData);
},
methods: {
language() {
this.switchLanguageDled = !this.switchLanguageDled
let pamer = new FormData(); // 创建form对象
pamer.append("query", "");
localeLists(pamer).then((res) => {
console.log(res);
this.languageList = res
});
},
switchLanguageDledFun(){
console.log(this.switchLanguage.code);
this.switchLanguageDled = !this.switchLanguageDled
let pamer = new FormData(); // 创建form对象
pamer.append("locale", this.switchLanguage.code);
locale(pamer).then((res) => {
if (res.success) {
this.$message.success("切换成功");
} else {
this.$message.error(res.errMsg);
}
});
},
handleClose(done) {
this.$confirm('确认关闭？')
.then(_ => {
done();
})
.catch(_ => {});
},
},
methods: {
disconnect(){
logout().then(res => {
disconnect() {
localeList().then((res) => {
console.log(res);
if (res.success) {
this.$message.success(res.message)
this.explorer('');
this.$message.success(res.message);
this.explorer("");
this.$forceUpdate();
}else{
this.$message.error(res.errMsg)
} else {
this.$message.error(res.errMsg);
}
})
});
},
//接收子组件显示画布
shooStatus(e){
console.log(e,'接收子组件显示画布')
this.$nextTick(()=>{
this.mxGraphShow = e
})
shooStatus(e) {
console.log(e, "接收子组件显示画布");
this.$nextTick(() => {
this.mxGraphShow = e;
});
},
//文件夹列表
explorer(path){
explorer(path) {
var formData = new FormData();
formData.append('loadElement', 3);
formData.append('path', path);
formData.append('node', 'xnode-14');
formData.append("loadElement", 3);
formData.append("path", path);
formData.append("node", "xnode-14");
this.$forceUpdate();
explorer(formData).then(res=>{
explorer(formData).then((res) => {
if (res) {
if(path==''){
console.log('点击当前path==',path);
if (path == "") {
console.log("点击当前path==", path);
this.fileTreeList=res;
this.fileTreeList = res;
// this.fileTreeList=JSON.stringify(this.fileTreeList);
}else{
console.log('点击当前2222222222222path==',path);
this.childenTreeList=res;
console.log('子节点2path==',this.childenTreeList);
} else {
console.log("点击当前2222222222222path==", path);
this.childenTreeList = res;
console.log("子节点2path==", this.childenTreeList);
}
}else {
this.$message.error(res.errMsg)
} else {
this.$message.error(res.errMsg);
}
})
});
},
// 左边文件夹和右边画布的宽度可以拖拽调整
dragControllerDiv: function () {
var resize = document.getElementsByClassName('resize');
var left = document.getElementsByClassName('left');
var mid = document.getElementsByClassName('mid');
var box = document.getElementsByClassName('box');
var resize = document.getElementsByClassName("resize");
var left = document.getElementsByClassName("left");
var mid = document.getElementsByClassName("mid");
var box = document.getElementsByClassName("box");
for (let i = 0; i < resize.length; i++) {
// 鼠标按下事件
resize[i].onmousedown = function (e) {
......@@ -771,8 +963,8 @@ props: ["dragItem"],
resize[i].style.left = moveLen; // 设置左侧区域的宽度
for (let j = 0; j < left.length; j++) {
left[j].style.width = moveLen + 'px';
mid[j].style.width = (box[i].clientWidth - moveLen - 10) + 'px';
left[j].style.width = moveLen + "px";
mid[j].style.width = box[i].clientWidth - moveLen - 10 + "px";
}
};
// 鼠标松开事件
......@@ -790,10 +982,10 @@ props: ["dragItem"],
},
//文件夹数据转换
treeRevert(arrayList){
console.log('传入数据=============',arrayList);
treeRevert(arrayList) {
console.log("传入数据=============", arrayList);
let formatObj = arrayList.reduce((pre, cur) => {
return {...pre, [cur['id']]: cur}
return { ...pre, [cur["id"]]: cur };
}, {});
console.log(formatObj);
......@@ -803,71 +995,69 @@ props: ["dragItem"],
let parent = formatObj[pid];
cur.disabled = !cur.lasted;
if (parent) {
parent.children ? parent.children.push(cur) : parent.children=[cur];
parent.children
? parent.children.push(cur)
: (parent.children = [cur]);
} else {
arr.push(cur)
arr.push(cur);
}
return arr;
}, []);
console.log('树形数据=============',formatArray);
console.log("树形数据=============", formatArray);
// this.jobTreeList=formatArray;
},
// 打开关闭弹窗
showModalOne(){
console.log('打卡资源库连接：');
this.getLinkList();//打开资源库连接弹窗同时获取历史连接记录
this.dialogVisibleOne=true;
showModalOne() {
console.log("打卡资源库连接：");
this.getLinkList(); //打开资源库连接弹窗同时获取历史连接记录
this.dialogVisibleOne = true;
},
handleCloseOne(){
this.dialogVisibleOne=false;
this.listHoverIdx=-1;//清空当前鼠标移动到的数据
this.listCheckedIdx=-2;//清空当前鼠标选中的数据
handleCloseOne() {
this.dialogVisibleOne = false;
this.listHoverIdx = -1; //清空当前鼠标移动到的数据
this.listCheckedIdx = -2; //清空当前鼠标选中的数据
},
showModalTwo(){
this.dialogVisibleTwo=true;
showModalTwo() {
this.dialogVisibleTwo = true;
this.types();
},
handleCloseTwo(){
this.dialogVisibleTwo=false;
handleCloseTwo() {
this.dialogVisibleTwo = false;
},
showModalThree(typeCheckedIdx){
console.log('当前点击---',typeCheckedIdx);
if(typeCheckedIdx==0){
this.dialogVisibleThree=true;
showModalThree(typeCheckedIdx) {
console.log("当前点击---", typeCheckedIdx);
if (typeCheckedIdx == 0) {
this.dialogVisibleThree = true;
}
if(typeCheckedIdx==1){
this.FileModal=true;
if (typeCheckedIdx == 1) {
this.FileModal = true;
}
},
handleCloseThree(){
this.dialogVisibleThree=false;
handleCloseThree() {
this.dialogVisibleThree = false;
},
// 新增数据库
showModalFourth(){
this.dialogVisibleFourth=true;
showModalFourth() {
this.dialogVisibleFourth = true;
// this.$refs.establishDia.database();
this.$refs.establishDia.getRepositoryDatabase("");
// this.accessData();//获取连接类型
this.$refs.establishDia.accessMethod();//获取连接方式
this.$refs.establishDia.accessMethod(); //获取连接方式
// console.log('this.methodHoverIdx==',this.methodHoverIdx);
// console.log('this.methodCheckedIdx==',this.methodCheckedIdx);
},
//获取新建弹窗返回来的值
getSonValue(res){
if(typeof(res)=='boolean'){
this.dialogVisibleFourth=res;
getSonValue(res) {
if (typeof res == "boolean") {
this.dialogVisibleFourth = res;
}
this.linkCheckedIdx=this.initlinkTypeIdx;//关闭弹窗后初始化选择oracle数据
this.methodHoverIdx=0;//关闭弹窗后初始化选择oracle数据对应第一条
this.methodCheckedIdx=0;//关闭弹窗后初始化选择oracle数据对应第一条
this.linkCheckedIdx = this.initlinkTypeIdx; //关闭弹窗后初始化选择oracle数据
this.methodHoverIdx = 0; //关闭弹窗后初始化选择oracle数据对应第一条
this.methodCheckedIdx = 0; //关闭弹窗后初始化选择oracle数据对应第一条
// this.addFlag=true;//增减变量改为编辑变量
},
// handleCloseFourth(){
......@@ -878,176 +1068,158 @@ props: ["dragItem"],
// this.addFlag=true;//增减变量改为编辑变量
// },
closeFileModal(){
this.FileModal=false;
closeFileModal() {
this.FileModal = false;
},
closeFileModalScan(){
this.FileModalScan=false;
closeFileModalScan() {
this.FileModalScan = false;
},
// chooseType(index){
// this.nowTypeIndex=index;
// },
// 获取资源库连接类型
types(){
types().then(res=>{
types() {
types().then((res) => {
if (res) {
console.log('获取类型成功！');
this.typesList=res;
}else {
this.$message.error(res.errMsg)
console.log("获取类型成功！");
this.typesList = res;
} else {
this.$message.error(res.errMsg);
}
})
});
},
// 获取历史建立的连接资源库列表
getLinkList(){
getLinkList().then(res=>{
getLinkList() {
getLinkList().then((res) => {
if (res) {
console.log('获取历史连接资源库列表：');
this.linkList=res;
}else {
this.$message.error(res.errMsg)
console.log("获取历史连接资源库列表：");
this.linkList = res;
} else {
this.$message.error(res.errMsg);
}
})
});
},
// 编辑数据
comfirmCreate(formName){
comfirmCreate(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
// JSON对象转成formData对象
var params=this.createModel;
var params = this.createModel;
// 由于高级选项连接池集群页面没有画完，保存默认参数
params.supportBooleanDataType=true;
params.supportTimestampDataType=true;
params.preserveReservedCaseCheck=true;
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=[];
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);
console.log('编辑表单提交参数==',formData);
check(formData).then(res=>{
console.log('提交数据：',res);
formData.append("databaseInfo", JSON.stringify(params));
console.log("表单提交参数==", params);
console.log("编辑表单提交参数==", formData);
check(formData).then((res) => {
console.log("提交数据：", res);
if (res.success) {
create(formData).then(res=>{
console.log('提交数据：',res);
create(formData).then((res) => {
console.log("提交数据：", res);
if (res.success) {
this.$message.success('成功!');
this.dialogVisibleFourth=false;//关闭弹窗
this.linkCheckedIdx=this.initlinkTypeIdx;//关闭弹窗后初始化选择的数据
this.listNames();//刷新已经创建的数据库列表
}else {
this.$message.error(res.message)
this.$message.success("成功!");
this.dialogVisibleFourth = false; //关闭弹窗
this.linkCheckedIdx = this.initlinkTypeIdx; //关闭弹窗后初始化选择的数据
this.listNames(); //刷新已经创建的数据库列表
} else {
this.$message.error(res.message);
}
})
}else {
this.$message.error(res.message)
});
} else {
this.$message.error(res.message);
}
})
});
}
});
},
//查询已经建立的所有数据库列表
listNames(){
listNames().then(res=>{
listNames() {
listNames().then((res) => {
if (res) {
console.log('获取所有已经创建的数据库列表：',res);
this.namesList=res;
}else {
this.$message.error(res.errMsg)
console.log("获取所有已经创建的数据库列表：", res);
this.namesList = res;
} else {
this.$message.error(res.errMsg);
}
})
});
},
//选择数据库编辑
selectNameFunc(e){
console.log('当前选中的数',e);
console.log('当前选中的数-===',this.selectName);
selectNameFunc(e) {
console.log("当前选中的数", e);
console.log("当前选中的数-===", this.selectName);
},
//点击选择获取已经创建的数据库列表
clickFunc(){
clickFunc() {
this.listNames();
},
editDataBaseModal(){
if(this.selectName){
this.dialogVisibleFourth=true;
editDataBaseModal() {
if (this.selectName) {
this.dialogVisibleFourth = true;
// this.addFlag=false;//增减变量改为编辑变量
}
// this.$refs.establishDia.database(this.selectName);
this.$refs.establishDia.getRepositoryDatabase(this.selectName);
this.$refs.establishDia.accessMethod();//获取连接方式
this.$refs.establishDia.accessMethod(); //获取连接方式
// console.log('this.methodHoverIdx==',this.methodHoverIdx);
// console.log('this.methodCheckedIdx==',this.methodCheckedIdx);
},
// 资源库连接
loginRepository(formName){
console.log('进入登录==========');
loginRepository(formName) {
console.log("进入登录==========");
this.$refs[formName].validate((valid) => {
if (valid) {
// JSON对象转成formData对象
var params=this.loginModel;
params.atStartupShown=false;//在启动时显示此对话框默认为 false
console.log('登录提交参数==',params);
var params = this.loginModel;
params.atStartupShown = false; //在启动时显示此对话框默认为 false
console.log("登录提交参数==", params);
var formData = new FormData();
formData.append('loginInfo', JSON.stringify(params));
console.log('提交转换数据：',formData);
loginRepository(formData).then(res=>{
console.log('返回数据：',res);
formData.append("loginInfo", JSON.stringify(params));
console.log("提交转换数据：", formData);
loginRepository(formData).then((res) => {
console.log("返回数据：", res);
if (res.success) {
this.$message.success('连接成功!');
this.explorer('');
this.handleCloseOne();//关闭弹窗
this.$message.success("连接成功!");
this.explorer("");
this.handleCloseOne(); //关闭弹窗
// this.linkCheckedIdx=this.initlinkTypeIdx;//关闭弹窗后初始化选择的数据
}else {
this.$message.error(res.errMsg)
} else {
this.$message.error(res.errMsg);
}
})
});
} else {
console.log('error submit!!');
console.log("error submit!!");
return false;
}
});
},
// 选择资源库
chooselink(item,index){
this.listCheckedIdx=index;
this.loginModel.reposityId=item.name;
console.log('当前选择的资源库=====',item);
this.curDataBase=item;
console.log('当前选择连接的数据库reposityId==',this.loginModel.reposityId);
chooselink(item, index) {
this.listCheckedIdx = index;
this.loginModel.reposityId = item.name;
console.log("当前选择的资源库=====", item);
this.curDataBase = item;
console.log(
"当前选择连接的数据库reposityId==",
this.loginModel.reposityId
);
},
removeTab(){
removeTab() {
// this.tabShowFlag=false;//关闭画布
// this.activeName="first";//关闭关闭资源库
},
......@@ -1064,119 +1236,115 @@ props: ["dragItem"],
// this.accessData();//获取连接类型
// },
// 资源库信息确定新建
repositoryInfoConfirm(formName){
repositoryInfoConfirm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
// JSON对象转成formData对象
var params=this.repositoryInfoModel;
params.type='KettleDatabaseRepository';//写死
var extraOptions={database:this.selectName}
params.extraOptions=extraOptions;
var params = this.repositoryInfoModel;
params.type = "KettleDatabaseRepository"; //写死
var extraOptions = { database: this.selectName };
params.extraOptions = extraOptions;
var formData = new FormData();
formData.append('reposityInfo', JSON.stringify(params));
formData.append('add', true);
console.log('资源库信息确认提交参数==',params);
addRepository(formData).then(res=>{
console.log('提交数据：',res);
formData.append("reposityInfo", JSON.stringify(params));
formData.append("add", true);
console.log("资源库信息确认提交参数==", params);
addRepository(formData).then((res) => {
console.log("提交数据：", res);
if (res.success) {
this.$message.success('成功!');
this.handleCloseThree();// 关闭弹窗1
this.handleCloseTwo();//关闭弹窗2
this.getLinkList();//刷新列表
this.listCheckedIdx=-2;//清空当前选择的资源库
this.curDataBase=null;
this.selectName='';
}else {
this.$message.error(res.errMsg)
this.$message.success("成功!");
this.handleCloseThree(); // 关闭弹窗1
this.handleCloseTwo(); //关闭弹窗2
this.getLinkList(); //刷新列表
this.listCheckedIdx = -2; //清空当前选择的资源库
this.curDataBase = null;
this.selectName = "";
} else {
this.$message.error(res.errMsg);
}
})
});
} else {
console.log('error submit!!');
console.log("error submit!!");
return false;
}
});
},
testDialogueOpen(){
testDialogueOpen() {
// JSON对象转成formData对象
var params=this.createModel;
var params = this.createModel;
// 由于高级选项连接池集群页面没有画完，保存默认参数
params.supportBooleanDataType=true;
params.supportTimestampDataType=true;
params.preserveReservedCaseCheck=true;
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=[];
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);
formData.append("databaseInfo", JSON.stringify(params));
console.log("表单提交参数==", params);
this.$refs.testDialogue.test(formData);
this.testDialogueFlag = true;
},
getValueFromChild(input){
getValueFromChild(input) {
this.inputValue = input; //接收子组件的值，然后赋予自己的变量
// this.showChild = false; //关闭子组件dialog
},
featureDialogOpen(){
featureDialogOpen() {
// JSON对象转成formData对象
var params=this.createModel;
var params = this.createModel;
// 由于高级选项连接池集群页面没有画完，保存默认参数
params.supportBooleanDataType=true;
params.supportTimestampDataType=true;
params.preserveReservedCaseCheck=true;
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=[];
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);
formData.append("databaseInfo", JSON.stringify(params));
console.log("表单提交参数==", params);
this.$refs.feature.feature(formData);
this.featureDialogVisible = true;
},
// 资源库浏览
scanDialogOpen(){
var params=this.createModel;
scanDialogOpen() {
var params = this.createModel;
// 由于高级选项连接池集群页面没有画完，保存默认参数
params.supportBooleanDataType=true;
params.supportTimestampDataType=true;
params.preserveReservedCaseCheck=true;
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=[];
params.usingConnectionPool = "N";
params.initialPoolSize = "5";
params.maximumPoolSize = "10";
params.partitioned = "N";
params.partitionInfo = [];
var formData = new FormData();
formData.append('databaseInfo', JSON.stringify(params));
formData.append('includeElement', 15);
var node={
text: 'root',
iconCls: 'imageFolder',
}
formData.append('node', 'xnode-3620');
formData.append('nodeId', '');
formData.append('text', 'root');
formData.append("databaseInfo", JSON.stringify(params));
formData.append("includeElement", 15);
var node = {
text: "root",
iconCls: "imageFolder",
};
formData.append("node", "xnode-3620");
formData.append("nodeId", "");
formData.append("text", "root");
// 当前编辑的项目的id
// formData.append('node', 'xnode-3620');
// formData.append('nodeId', 'root');
// formData.append('text', '');
// formData.append('nodeId', '');
// formData.append('text', 'root');
// formData.append('node', 'xnode-2984');
......@@ -1184,107 +1352,102 @@ props: ["dragItem"],
this.scanDialogVisible = true;
},
// 删除资源库
deleteLinkRes(){
deleteLinkRes() {
var formData = new FormData();
formData.append('repositoryName', this.loginModel.reposityId);
console.log('参数==',formData);
remove(formData).then(res=>{
formData.append("repositoryName", this.loginModel.reposityId);
console.log("参数==", formData);
remove(formData).then((res) => {
if (res) {
this.$message.success('成功！');
this.getLinkList();//打开资源库连接弹窗同时获取历史连接记录
}else {
this.$message.error(res.errMsg)
this.$message.success("成功！");
this.getLinkList(); //打开资源库连接弹窗同时获取历史连接记录
} else {
this.$message.error(res.errMsg);
}
})
});
},
//新建转换
createTrans(){
createTrans() {
// if(this.curNodeIconCls =='imageFolder'){
this.estabDialogVisible=true;
this.estabTitle='转换';
this.estabDialogVisible = true;
this.estabTitle = "转换";
// }else{
// this.$message.error('请选择资源库中的一个目录');
// }
},
// 新建任务
createJob(){
if(this.curNodeIconCls =='imageFolder'){
this.estabDialogVisible=true;
this.estabTitle='任务';
}else{
this.$message.error('请选择资源库中的一个目录');
createJob() {
if (this.curNodeIconCls == "imageFolder") {
this.estabDialogVisible = true;
this.estabTitle = "任务";
} else {
this.$message.error("请选择资源库中的一个目录");
}
},
// 新建目录
createFile(){
if(this.curNodeIconCls =='imageFolder'){
this.estabDialogVisible=true;
this.estabTitle='目录';
}else{
this.$message.error('请选择资源库中的一个目录');
createFile() {
if (this.curNodeIconCls == "imageFolder") {
this.estabDialogVisible = true;
this.estabTitle = "目录";
} else {
this.$message.error("请选择资源库中的一个目录");
}
},
// 删除资源库文件
deleteFile(){
console.log("删除当前节点==========",this.curNode);
var path=this.curNode.data.path;
var type=this.curNode.data.type;
if(type==null){
type=''
deleteFile() {
console.log("删除当前节点==========", this.curNode);
var path = this.curNode.data.path;
var type = this.curNode.data.type;
if (type == null) {
type = "";
}
let pamer = new FormData(); // 创建form对象
pamer.append("path", path);
pamer.append("type", type);
drop(pamer).then(res=>{
if(res){
console.log('删除资源库文件==',res)
this.$message.success('删除成功');
drop(pamer).then((res) => {
if (res) {
console.log("删除资源库文件==", res);
this.$message.success("删除成功");
// 刷新
this.explorer('');
this.$refs.graphContainer.createGraph();//刷新画布
this.explorer("");
this.$refs.graphContainer.createGraph(); //刷新画布
}
})
});
},
handleNodeClick(data,node){
console.log('点击当前节点===',node);
this.curNode=node;//当前选中节点
this.nodePath=data.path;//当前选择数
this.curNodeIconCls=node.data.iconCls;
console.log('当前节点的文件夹路径:',this.nodePath);
if(node.data.leaf){
this.curNodeText=node.data.text;//当前节点
handleNodeClick(data, node) {
console.log("点击当前节点===", node);
this.curNode = node; //当前选中节点
this.nodePath = data.path; //当前选择数
this.curNodeIconCls = node.data.iconCls;
console.log("当前节点的文件夹路径:", this.nodePath);
if (node.data.leaf) {
this.curNodeText = node.data.text; //当前节点
let pamer = new FormData(); // 创建form对象
pamer.append("path", this.nodePath);
// pamer.append("type", "transformation");
pamer.append("type", node.data.type);
open(pamer).then(res=>{
open(pamer).then((res) => {
// console.log(res,'返回空白画布xml');
this.blankCanvas = res;
// this.tabShowFlag=true;//核心对象显项卡显示
//mxl判断作业和转换----------------------
if(node.data.type=="transformation"){
if (node.data.type == "transformation") {
this.$refs.nodeMenu2.stepsFun();
let that=this;
setTimeout(function(){
let that = this;
setTimeout(function () {
that.$refs.graphContainer.initGraphClick("transformation");
},500)
}else if(node.data.type=="job"){
}, 500);
} else if (node.data.type == "job") {
this.$refs.nodeMenu2.jobentrysFun();
let that=this;
setTimeout(function(){
let that = this;
setTimeout(function () {
that.$refs.graphContainer.initGraphClick("job");
},500)
}, 500);
}
// mxl判断作业和转换---------------------------
this.activeName="second";
this.activeName = "second";
// var xmlDocument = mxUtils.parseXml(res);
// var decoder = new mxCodec(xmlDocument);
......@@ -1294,72 +1457,55 @@ props: ["dragItem"],
// decoder.decode(node, graph.getModel());
// console.log(esponse.responseText);
})
});
}
// else{
// this.$message.error('请选择一个资源库！');
// return;
// }
// console.log(data,'当前节点的父节点:',node.parent.data);
},
//修改资源库
editDataBase(){
if(this.curDataBase){
this.repositoryInfoModel.name=this.curDataBase.name;
this.repositoryInfoModel.description=this.curDataBase.description;
this.selectName=this.curDataBase.extraOptions.database;
this.dialogVisibleThree=true;
}else{
this.$message.error('请选择一个资源库');
editDataBase() {
if (this.curDataBase) {
this.repositoryInfoModel.name = this.curDataBase.name;
this.repositoryInfoModel.description = this.curDataBase.description;
this.selectName = this.curDataBase.extraOptions.database;
this.dialogVisibleThree = true;
} else {
this.$message.error("请选择一个资源库");
}
},
//创建或者更新
createOrUpdate(){
createOrUpdate() {
var formData = new FormData();
formData.append('connection', this.selectName);
console.log('参数==',formData);
checkInit(formData).then(res=>{
formData.append("connection", this.selectName);
console.log("参数==", formData);
checkInit(formData).then((res) => {
if (res) {
this.$message.success('成功！');
this.$message.success("成功！");
// this.getLinkList();//打开资源库连接弹窗同时获取历史连接记录
}else {
this.$message.error(res.errMsg)
} else {
this.$message.error(res.errMsg);
}
})
});
},
// 导出资源库弹窗
exportTreeDialog(){
console.log('导出资源库====');
this.exportDialogVisible=true;
exportTreeDialog() {
console.log("导出资源库====");
this.exportDialogVisible = true;
},
// 导入资源库弹窗
importTreeDialog(){
console.log('导入资源库====');
this.inputVisibility=true;
}
}
};
importTreeDialog() {
console.log("导入资源库====");
this.inputVisibility = true;
},
},
};
</script>
<style>
@import url(./kettle.css);
@import url(./kettle.css);
</style>
src/views/login.vue
......@@ -2,7 +2,7 @@
<div class="login" :style="'background-image:url('+ Background +');'">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left" label-width="0px" class="login-form">
<h3 class="title">
EL-ADMIN 后台管理系统
后台管理系统
</h3>
<el-form-item prop="username">
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
......
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