303 lines
7.7 KiB
Vue
303 lines
7.7 KiB
Vue
<template>
|
||
<div>
|
||
|
||
<el-form label-width="80px" :model="SourceReq" ref="queryForm" :inline="true" class="demo-form-inline" size="small">
|
||
<el-form-item label="数据源名称">
|
||
<el-input v-model="SourceReq.dataResourceName"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据来源系统名称">
|
||
<el-input v-model="SourceReq.dataSourcesSystemName"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据库名称">
|
||
<el-input v-model="SourceReq.databaseName"></el-input>
|
||
</el-form-item>
|
||
<el-button @click="findSelectSourceList()">
|
||
查询
|
||
</el-button>
|
||
</el-form>
|
||
|
||
|
||
<!-- <el-button-->
|
||
<!-- v-hasPermi="['system:user:remove']"-->
|
||
<!-- icon="el-icon-delete"-->
|
||
<!-- size="mini"-->
|
||
<!-- type="text"-->
|
||
<!-- @click="handleDelete(scope.row)"-->
|
||
<!-- >删除-->
|
||
<!-- </el-button>-->
|
||
|
||
<el-button
|
||
v-hasPermi="['tool:gen:import']"
|
||
icon="el-icon-upload"
|
||
plain
|
||
size="mini"
|
||
type="info"
|
||
@click="findSelectSourceExport"
|
||
>导出
|
||
</el-button>
|
||
|
||
|
||
<el-button
|
||
icon="el-icon-delete"
|
||
plain
|
||
size="mini"
|
||
type="danger"
|
||
@click="insertAdd()"
|
||
>新增
|
||
</el-button>
|
||
|
||
|
||
<el-dialog title="添加数据源接入" :visible.sync="dialogFormVisible">
|
||
|
||
<el-form :model="sourceAddReq">
|
||
<el-form-item label="接入源名称">
|
||
<el-input v-model="sourceAddReq.dataResourceName"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据来源系统名称">
|
||
<el-input v-model="sourceAddReq.dataSourcesSystemName"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="主机地址">
|
||
<el-input v-model="sourceAddReq.host"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="主机端口">
|
||
<el-input v-model="sourceAddReq.port"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据接入类型">
|
||
<el-input v-model="sourceAddReq.databaseType"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据库名称">
|
||
<el-input v-model="sourceAddReq.databaseName"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据库用户">
|
||
<el-input v-model="sourceAddReq.username"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据库密码">
|
||
<el-input v-model="sourceAddReq.password"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="数据连接参数">
|
||
<el-input v-model="sourceAddReq.connectionParams"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="初始化连接数量">
|
||
<el-input v-model="sourceAddReq.initLinkNum"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="最大连接数量">
|
||
<el-input v-model="sourceAddReq.maxLinkNum"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="最大等待时间">
|
||
<el-input v-model="sourceAddReq.maxWaitTime"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="最大等待次数">
|
||
<el-input v-model="sourceAddReq.maxWaitTimes"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="备注">
|
||
<el-input v-model="sourceAddReq.remark"></el-input>
|
||
</el-form-item>
|
||
|
||
</el-form>
|
||
|
||
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button @click="textP()">测试</el-button>
|
||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||
<el-button type="primary" @click="addSource()">确 定</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<el-table
|
||
:data="source"
|
||
style="width: 100%"
|
||
|
||
@selection-change="handleSelectionChange">
|
||
|
||
<el-table-column
|
||
type="selection"
|
||
width="55">
|
||
</el-table-column>
|
||
|
||
|
||
<el-table-column
|
||
label="接入源名称"
|
||
prop="dataResourceName">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="数据来源系统名称"
|
||
prop="dataSourcesSystemName">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="主机地址"
|
||
prop="host">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="端口号"
|
||
prop="port">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="数据接入类型"
|
||
prop="databaseType">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="数据库名称"
|
||
prop="databaseName">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="是否初始化"
|
||
prop="name">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
label="备注"
|
||
prop="remark">
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
align="right">
|
||
<template slot-scope="scope">
|
||
<el-button
|
||
icon="el-icon-pear"
|
||
size="mini"
|
||
type="text"
|
||
@click="update(scope.row)">修改</el-button>
|
||
|
||
<el-button
|
||
icon="el-icon-delete"
|
||
size="mini"
|
||
type="text"
|
||
@click="handleDelete(scope.row)">删除</el-button>
|
||
|
||
<el-button
|
||
icon="el-icon-service"
|
||
size="mini"
|
||
type="text"
|
||
@click="struceure(scope.row)">同步资产结构</el-button>
|
||
|
||
<el-button
|
||
icon="el-icon-aim"
|
||
size="mini"
|
||
type="text"
|
||
@click="text(scope.row)">测试连接</el-button>
|
||
</template>
|
||
|
||
</el-table-column>
|
||
|
||
</el-table>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等),
|
||
//例如:import 《组件名称》 from '《组件路径》,
|
||
import {selectSourceList} from "@/api/etl/switch";
|
||
import {selectSourceExport} from "@/api/etl/switch";
|
||
import {connectionTest} from "@/api/etl/switch";
|
||
import {insertAdd} from "@/api/etl/switch";
|
||
import {getInfo} from "@/api/etl/switch";
|
||
|
||
export default {
|
||
//import引入的组件需要注入到对象中才能使用"
|
||
components: {},
|
||
props: {},
|
||
data() {
|
||
//这里存放数据"
|
||
|
||
return {
|
||
dialogFormVisible:false,
|
||
SourceReq:{
|
||
|
||
},
|
||
sourceAddReq:{
|
||
|
||
},
|
||
source:[],
|
||
};
|
||
},
|
||
//计算属性 类似于data概念",
|
||
computed: {},
|
||
//监控data中的数据变化",
|
||
watch: {},
|
||
//方法集合",
|
||
methods: {
|
||
textP(){
|
||
connectionTest(this.sourceAddReq).then(res=>{
|
||
if (res.code===200){
|
||
alert("测试连接成功")
|
||
}else{
|
||
alert("连接失败")
|
||
}
|
||
})
|
||
},
|
||
addSource(){
|
||
insertAdd(this.sourceAddReq).then(res=>{
|
||
|
||
})
|
||
},
|
||
//测试连接
|
||
text(row){
|
||
connectionTest(row).then(res=>{
|
||
if (res.code===200){
|
||
alert("测试连接成功");
|
||
}else {
|
||
alert("测试连接失败");
|
||
}
|
||
})
|
||
},
|
||
insertAdd(){
|
||
this.dialogFormVisible=true
|
||
|
||
},
|
||
findSelectSourceList(){
|
||
selectSourceList(this.SourceReq).then(res=>{
|
||
this.source=res.data.rows;
|
||
})
|
||
},
|
||
findSelectSourceExport(){
|
||
selectSourceExport(this.SourceReq).then();
|
||
},
|
||
handleSelectionChange(row){
|
||
|
||
},
|
||
},
|
||
//生命周期 - 创建完成(可以访问当前this实例)",
|
||
created() {
|
||
this.findSelectSourceList();
|
||
},
|
||
//生命周期 - 挂载完成(可以访问DOM元素)",
|
||
mounted() {
|
||
},
|
||
beforeCreate() {
|
||
}, //生命周期 - 创建之前",
|
||
beforeMount() {
|
||
}, //生命周期 - 挂载之前",
|
||
beforeUpdate() {
|
||
}, //生命周期 - 更新之前",
|
||
updated() {
|
||
}, //生命周期 - 更新之后",
|
||
beforeDestroy() {
|
||
}, //生命周期 - 销毁之前",
|
||
destroyed() {
|
||
}, //生命周期 - 销毁完成",
|
||
activated() {
|
||
} //如果页面有keep-alive缓存功能,这个函数会触发",
|
||
};
|
||
</script>
|
||
<style scoped>
|
||
|
||
</style>
|