443 lines
15 KiB
Vue
443 lines
15 KiB
Vue
<template>
|
|
<a-modal
|
|
:title="title"
|
|
:width="800"
|
|
:visible="visible"
|
|
:confirmLoading="confirmLoading"
|
|
@ok="handleOk"
|
|
@cancel="handleCancel"
|
|
:ok-button-props="{ style: { display: 'none' } }"
|
|
okText="保存数据"
|
|
cancelText="关闭">
|
|
|
|
<a-spin :spinning="confirmLoading">
|
|
<a-form :form="form" v-if = "models == 1">
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol" label="数据库IP" >
|
|
<a-input v-decorator="['ip',{
|
|
rules: [
|
|
{ required: true, message: '数据库IP不能为空' },
|
|
{ min: 8, max: 14, message: '长度8-14位' }
|
|
],
|
|
validateTrigger: 'change'
|
|
}]" :disabled="testConnBool"></a-input>
|
|
</a-form-item>
|
|
<a-form-item label="选择数据库类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<a-select show-search :disabled="testConnBool"placeholder="选择数据库类型" option-filter-prop="children" :filter-option="filterOption" size="large" v-decorator="['dbType', {
|
|
rules: [
|
|
{ required: true, message: '选择数据库类型' },
|
|
],
|
|
validateTrigger: 'change'
|
|
}]">
|
|
<a-select-option key="dm">
|
|
达梦数据库
|
|
</a-select-option>
|
|
<a-select-option key="mysql">
|
|
MySql
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol" label="端口号" >
|
|
<a-input v-decorator="['port',{
|
|
rules: [
|
|
{
|
|
required: true,
|
|
message: '端口号不能为空'
|
|
},
|
|
{
|
|
pattern: /^\d{1,5}$/,
|
|
message: '请输入1-5位的数字'
|
|
}
|
|
],
|
|
validateTrigger: 'change'
|
|
}]" :disabled="testConnBool"></a-input>
|
|
</a-form-item>
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol" label="用户名" >
|
|
<a-input v-decorator="['username',{
|
|
rules: [
|
|
{ required: true, message: '用户名不能为空' },
|
|
{ min: 1, max: 64, message: '长度1-64位' },
|
|
],
|
|
validateTrigger: 'change'
|
|
}]" :disabled="testConnBool"></a-input>
|
|
</a-form-item>
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol" label="密码" >
|
|
<a-input-password v-decorator="['password',{
|
|
rules: [
|
|
{ required: true, message: '密码不能为空' },
|
|
{ min: 1, max: 15, message: '长度1-15位' },
|
|
],
|
|
validateTrigger: 'change'
|
|
}]" :disabled="testConnBool"></a-input-password>
|
|
</a-form-item>
|
|
<a-form-item >
|
|
<a-button type="primary" @click="testConn" style="width:100%;">测试数据库连接</a-button>
|
|
</a-form-item>
|
|
<a-form-item label="选择源数据库" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<a-select show-search :disabled="selectDataBase"placeholder="选择源数据库" option-filter-prop="children" :filter-option="filterOption" size="large" v-decorator="['database', {}]">
|
|
<a-select-option v-for="d in databaseSource" :key="d">
|
|
{{ d }}
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item label="数据类型">
|
|
<a-select placeholder="选择数据类型" :disabled="selectDataBase" option-filter-prop="children" size="large" v-decorator="['dataType', {}]">
|
|
<a-select-option v-for="d in dataTypedataSources" :key="d.id">
|
|
{{ d.cnName }}
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item label="选择型号">
|
|
<a-select placeholder="选择型号" :disabled="selectDataBase" @change="QueryByModelId" option-filter-prop="children" size="large" v-decorator="['shipModel', {}]">
|
|
<a-select-option v-for="d in shipModelSources" :key="d.id">
|
|
{{ d.name }}
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item label="选择舷号">
|
|
<a-select placeholder="选择舷号" :disabled="selectDataBase" option-filter-prop="children" size="large" v-decorator="['shipNum', {}]">
|
|
<a-select-option v-for="d in shipNumSources" :key="d.id">
|
|
{{ d.name }}
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item >
|
|
<a-button :disabled="selectDataBase" type="primary" style="width:100%;" @click="createSchema">验证目标模式</a-button>
|
|
</a-form-item>
|
|
<a-form-item >
|
|
<a-button :disabled="createSchemaboll" type="primary" style="width:100%;" @click="getTableInfo">开始同步</a-button>
|
|
</a-form-item>
|
|
</a-form>
|
|
<a-table v-if="models == 2"
|
|
ref="table"
|
|
size="middle"
|
|
bordered
|
|
rowKey="id"
|
|
:columns="columns"
|
|
:dataSource="dataSource"
|
|
:loading="loading">
|
|
<!-- :locale="myLocale"-->
|
|
|
|
<!-- 字符串超长截取省略号显示-->
|
|
</a-table>
|
|
<a-button v-if="models == 2" type="primary" style="width:100%;" @click="syncOriginalData">同步</a-button>
|
|
</a-spin>
|
|
</a-modal>
|
|
</template>
|
|
|
|
<script>
|
|
import moment from "moment"
|
|
import { shipNumPageList,shipModelPageList,shipNumQueryByModelId } from '@/api/ship'
|
|
import JCron from "@/components/jeecg/JCron";
|
|
import JSelectMultiple from '@/components/jeecg/JSelectMultiple'
|
|
import pick from 'lodash.pick'
|
|
import {
|
|
dataTypePageList,
|
|
dataTypeDeleteById } from '@/api/dataType'
|
|
import { datasyncqueryPage,
|
|
datasyncupdateSyncRecord,
|
|
datasyncqueryById,
|
|
datasyncsyncOriginalData,
|
|
datasynccreateSyncRecord,
|
|
datasynccreateSchema,
|
|
datasyncgetDatabases,
|
|
datasyncgetTableInfo,
|
|
datasynctestConn } from '@/api/dblink'
|
|
|
|
export default {
|
|
name: "uploadModal",
|
|
components: {
|
|
JCron,
|
|
JSelectMultiple
|
|
},
|
|
data () {
|
|
return {
|
|
title:"操作",
|
|
buttonStyle: 'solid',
|
|
visible: false,
|
|
confirmLoading: false,
|
|
form: this.$form.createForm(this),
|
|
strategys:[],
|
|
dataLinkType:'',
|
|
models:1,
|
|
labelCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 5 },
|
|
},
|
|
wrapperCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 16 },
|
|
},
|
|
columns: [
|
|
{
|
|
title: '#',
|
|
dataIndex: '',
|
|
key:'id',
|
|
width:60,
|
|
align:"id",
|
|
customRender:function (t,r,index) {
|
|
return parseInt(index)+1;
|
|
}
|
|
},
|
|
{
|
|
title: '表名',
|
|
align:"tableName",
|
|
dataIndex: 'tableName',
|
|
},
|
|
{
|
|
title: '数据条数',
|
|
align:"rowCount",
|
|
dataIndex: 'rowCount'
|
|
},
|
|
],
|
|
queryParam: {
|
|
pageNum :1,
|
|
pageSize:20
|
|
},
|
|
dataTypedataSources: [],
|
|
shipModelSources:[],
|
|
shipNumSources:[],
|
|
dataSource:[],
|
|
selectDataBase:true,
|
|
createSchemaboll:true,
|
|
testConnBool:false,
|
|
databaseSource:[],
|
|
datamodel:{
|
|
ip:"",
|
|
port:"",
|
|
username:"",
|
|
password:"",
|
|
database:"",
|
|
dataType:"",
|
|
shipModel:"",
|
|
shipNum:"",
|
|
dbType:""
|
|
},
|
|
recordId:""
|
|
}
|
|
},
|
|
created () {
|
|
|
|
},
|
|
methods: {
|
|
add () {
|
|
this.visible =true;
|
|
this.recordId = '';
|
|
this.testConnBool = false,
|
|
this.getselect();
|
|
let model = {};
|
|
model.ip = "";
|
|
model.port = 0;
|
|
model.username = '';
|
|
model.password = '';
|
|
model.database = '';
|
|
model.dataType = '';
|
|
model.shipModel = '';
|
|
model.shipNum = '';
|
|
model.dbType='';
|
|
this.form.setFieldsValue(pick(model,'ip','dbType','port','username','password','database','dataType','shipModel','shipNum'));
|
|
},
|
|
edit (record) {
|
|
this.visible =true;
|
|
let that = this;
|
|
that.form.resetFields();
|
|
console.log(record);
|
|
this.model = Object.assign({},record);
|
|
this.getselect();
|
|
this.recordId = record.id;
|
|
datasyncqueryById({id:record.id}).then((res) => {
|
|
if (res.success) {
|
|
let model = {};
|
|
model.ip = res.result.sourceIp;
|
|
model.port = res.result.sourcePort;
|
|
model.username = res.result.username;
|
|
model.password = res.result.password;
|
|
model.database = res.result.sourceDatabase;
|
|
model.dataType = res.result.dataTypeId;
|
|
model.shipModel = res.result.shipModelId;
|
|
model.shipNum = res.result.shipNumId;
|
|
model.dbType== res.result.shipNumId;
|
|
this.form.setFieldsValue(pick(model,'ip','dbType','port','username','password','database','dataType','shipModel','shipNum'));
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
},
|
|
syncOriginalData(){
|
|
datasyncsyncOriginalData({recordId:this.recordId}).then((res) => {
|
|
if (res.success) {
|
|
this.$message.success(res.message);
|
|
this.close();
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
},
|
|
getTableInfo(){
|
|
this.form.validateFields((err, values) => {
|
|
console.log('values',values)
|
|
this.datamodel = values;
|
|
var that = this;
|
|
if (!err) {
|
|
that.confirmLoading = true;
|
|
datasyncgetTableInfo({ip:values.ip,port:values.port,username:values.username,password:values.password,database:values.database,dbType:values.dbType}).then((res) => {
|
|
if (res.result) {
|
|
this.confirmLoading = false;
|
|
this.dataSource = res.result;
|
|
this.models = 2;
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
if(this.recordId == ''){
|
|
datasynccreateSyncRecord({sourceIp:values.ip,
|
|
sourcePort:values.port,
|
|
username:values.username,
|
|
password:values.password,
|
|
sourceDatabase:values.database,
|
|
dataTypeId:values.dataType,
|
|
shipModelId:values.shipModel,
|
|
shipNumId:values.shipNum}).then((res) => {
|
|
if (res.success) {
|
|
this.recordId = res.result
|
|
this.$message.success(res.message);
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
}else{
|
|
datasyncupdateSyncRecord({id:this.recordId,sourceIp:values.ip,
|
|
sourcePort:values.port,
|
|
username:values.username,
|
|
password:values.password,
|
|
sourceDatabase:values.database,
|
|
dataTypeId:values.dataType,
|
|
shipModelId:values.shipModel,
|
|
shipNumId:values.shipNum}).then((res) => {
|
|
if (res.success) {
|
|
this.recordId = res.result
|
|
this.$message.success(res.message);
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
}
|
|
|
|
}
|
|
})
|
|
},
|
|
QueryByModelId(val){
|
|
shipNumQueryByModelId({modelId:val}).then((res) => {
|
|
if (res.success) {
|
|
this.shipNumSources = res.result.rows||res.result;
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
},
|
|
createSchema(){
|
|
this.form.validateFields((err, values) => {
|
|
console.log('values',values)
|
|
this.datamodel = values;
|
|
var that = this;
|
|
if (!err) {
|
|
that.confirmLoading = true;
|
|
datasynccreateSchema({shipModelId:this.datamodel.shipModel,shipNumId:this.datamodel.shipNum,dataTypeId:this.datamodel.dataType}).then((res) => {
|
|
if (res.success) {
|
|
this.createSchemaboll =false;
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
this.confirmLoading = false;
|
|
});
|
|
}
|
|
})
|
|
|
|
},
|
|
filterOption(input, option) {
|
|
return (
|
|
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
|
);
|
|
},
|
|
testConn(){
|
|
this.form.validateFields((err, values) => {
|
|
console.log('values',values)
|
|
this.datamodel = values;
|
|
var that = this;
|
|
if (!err) {
|
|
that.confirmLoading = true;
|
|
datasynctestConn({ip:values.ip,port:values.port,username:values.username,password:values.password,dbType:values.dbType}).then((res) => {
|
|
if (res.result) {
|
|
this.testConnBool =true;
|
|
this.getdatabaseList();
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
this.confirmLoading = false;
|
|
});
|
|
|
|
}
|
|
})
|
|
},
|
|
getdatabaseList(){
|
|
datasyncgetDatabases({ip:this.datamodel.ip,dbType:this.datamodel.dbType,port:this.datamodel.port,username:this.datamodel.username,password:this.datamodel.password}).then((res) => {
|
|
if (res.success) {
|
|
this.selectDataBase = false;
|
|
this.databaseSource = res.result;
|
|
this.getselect();
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
},
|
|
getselect(){
|
|
dataTypePageList(this.queryParam).then((res) => {
|
|
if (res.success) {
|
|
this.dataTypedataSources = res.result.rows||res.result;
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
shipModelPageList(this.queryParam).then((res) => {
|
|
if (res.success) {
|
|
this.shipModelSources = res.result.rows||res.result;
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
shipNumPageList(this.queryParam).then((res) => {
|
|
if (res.success) {
|
|
this.shipNumSources = res.result.rows||res.result;
|
|
} else {
|
|
this.$message.warning(res.message);
|
|
}
|
|
});
|
|
},
|
|
|
|
onOk(value) {
|
|
this.$emit('ok');
|
|
},
|
|
close () {
|
|
this.$emit('ok');
|
|
this.visible = false;
|
|
},
|
|
handleOk () {
|
|
this.$emit('ok');
|
|
this.close();
|
|
},
|
|
handleCancel () {
|
|
this.$emit('ok');
|
|
this.close()
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.disabled{
|
|
pointer-events: none;
|
|
}
|
|
</style> |