|
|
@@ -0,0 +1,314 @@
|
|
|
+<template lang="html">
|
|
|
+ <div id="strM">
|
|
|
+ <el-row class="register">
|
|
|
+ <el-col :span="24" class="btn">
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :span="20"><h3>策略管理</h3></el-col>
|
|
|
+ <!-- 批量导入按钮没加 -->
|
|
|
+ <el-col :span="4"><el-button type="success" icon="el-icon-plus" @click="dialogFormVisible = true">策略配置</el-button></el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="search">
|
|
|
+ <el-col :span="5" class="searchInp"><el-input v-model="input" placeholder="请输入内容"></el-input></el-col>
|
|
|
+ <el-col :span="2" class="searchBtn"><el-button icon="el-icon-search"></el-button></el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="list">
|
|
|
+ <el-table :data="tableData" style="width: 100%" border stripe>
|
|
|
+ <el-table-column prop="strName" align="center" label="策略名称"> </el-table-column>
|
|
|
+ <el-table-column align="center" prop="state" label="状态">
|
|
|
+ <template v-slot="scoped">
|
|
|
+ {{ scoped.row.state === '0' ? '冻结' : '使用中' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" label="操作">
|
|
|
+ <template v-slot="scoped">
|
|
|
+ <el-row type="flex" justify="center">
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-button size="small" type="text" @click="openDialog(scoped.$index)">策略变更</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-button v-if="scoped.row.state == 1" size="small" type="text" @click="open1(scoped.$index)">注销</el-button>
|
|
|
+ <el-button v-if="scoped.row.state == 0" size="small" type="text" @click="open2(scoped.$index)">恢复</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-col class="paging">
|
|
|
+ <el-pagination background layout="prev, pager, next" :total="1000"></el-pagination>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-dialog title="策略配置" :visible.sync="dialogFormVisible">
|
|
|
+ <el-form :model="form" label-position="left" label-width="auto" style="padding: 0 5px;">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="策略名称">
|
|
|
+ <el-input v-model="form.strName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="容错策略：">
|
|
|
+ <el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <span>重试次数</span>
|
|
|
+ <el-input v-model="form.ID_num"></el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <span>间隔</span>
|
|
|
+ <el-input v-model="form.ID_dis"></el-input>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="同步类型">
|
|
|
+ <el-select v-model="form.nation" filterable placeholder="数据库">
|
|
|
+ <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="同步目标数据库类型">
|
|
|
+ <el-select v-model="form.msql" filterable placeholder="Oracle">
|
|
|
+ <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="数据库用户名">
|
|
|
+ <el-input v-model="form.name" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="数据库密码">
|
|
|
+ <el-input v-model="form.password" show-password></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="地址">
|
|
|
+ <el-input v-model="form.address" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="数据名称">
|
|
|
+ <el-input v-model="form.dataNum"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="端口">
|
|
|
+ <el-input v-model="form.port" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="同步服务端口">
|
|
|
+ <el-input v-model="form.serPort"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="远程">
|
|
|
+ <el-radio v-model="long" label="1">是</el-radio>
|
|
|
+ <el-radio v-model="long" label="2">否</el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-if="long === '1'" label="本服务器地址">
|
|
|
+ <el-input v-model="form.myAddress" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-if="long === '1'" label="Adapter地址">
|
|
|
+ <el-input v-model="form.adapter" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-if="long === '1'" label="Adapter端口号">
|
|
|
+ <el-input v-model="form.adapter_port" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="连接配置">
|
|
|
+ <el-input v-model="form.indexSet" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="添加对外同步任务："> </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="WSDL地址">
|
|
|
+ <el-input v-model="form.wsdl" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="同步服务端口">
|
|
|
+ <el-input v-model="form.sinport" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogFormVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="handleEdit">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: 'strM',
|
|
|
+ props: {},
|
|
|
+ components: {},
|
|
|
+ data: () => ({
|
|
|
+ input: '',
|
|
|
+ textarea: '',
|
|
|
+ long: '1',
|
|
|
+ tableData: [
|
|
|
+ {
|
|
|
+ nation: '数据库',
|
|
|
+ msql: 'Oracle',
|
|
|
+ strName: '策略1',
|
|
|
+ state: '0',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ nation: 'webservice',
|
|
|
+ msql: 'sqlservice',
|
|
|
+ strName: '策略2',
|
|
|
+ state: '1',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ value: 'Oracle',
|
|
|
+ label: 'Oracle',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 'webservice',
|
|
|
+ label: 'webservice',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ options2: [
|
|
|
+ {
|
|
|
+ value: 'Oracle',
|
|
|
+ label: 'Oracle',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 'sqlserver',
|
|
|
+ label: 'sqlserver',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ value: '',
|
|
|
+ dialogFormVisible: false,
|
|
|
+ form: {
|
|
|
+ strName: '',
|
|
|
+ ID_num: '5',
|
|
|
+ ID_dis: '5',
|
|
|
+ name: '',
|
|
|
+ password: '',
|
|
|
+ dataNum: '',
|
|
|
+ address: '',
|
|
|
+ port: '',
|
|
|
+ serPort: '',
|
|
|
+ myAddress: '',
|
|
|
+ adapter: '',
|
|
|
+ adapter_port: '',
|
|
|
+ indexSet: '',
|
|
|
+ wsdl: '',
|
|
|
+ sinport: '8808',
|
|
|
+ },
|
|
|
+ }),
|
|
|
+ created() {},
|
|
|
+ computed: {},
|
|
|
+ methods: {
|
|
|
+ handleEdit() {
|
|
|
+ let chData = this.form;
|
|
|
+ const { index, ...form } = chData;
|
|
|
+ form['state'] = 1;
|
|
|
+ console.log(index, form);
|
|
|
+ if (index !== undefined) {
|
|
|
+ this.$set(this.tableData, `${index}`, form);
|
|
|
+ this.$message.success('修改成功');
|
|
|
+ } else {
|
|
|
+ this.tableData.push(form);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.handleCancel();
|
|
|
+ },
|
|
|
+ handleCancel() {
|
|
|
+ this.form = {};
|
|
|
+ this.dialogFormVisible = false;
|
|
|
+ },
|
|
|
+ openDialog(index) {
|
|
|
+ this.dialogFormVisible = true;
|
|
|
+ let data = JSON.parse(JSON.stringify(this.tableData[index]));
|
|
|
+ data[`index`] = index;
|
|
|
+ this.$set(this, `form`, data);
|
|
|
+ },
|
|
|
+ handleClose(done) {
|
|
|
+ this.$confirm('确认关闭？')
|
|
|
+ .then(_ => {
|
|
|
+ done();
|
|
|
+ })
|
|
|
+ .catch(_ => {});
|
|
|
+ },
|
|
|
+ open1(num) {
|
|
|
+ console.log(num);
|
|
|
+ this.$confirm('确认注销此用户吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.$set(this.tableData[num], `state`, '0');
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '注销成功!',
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消',
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ open2(num) {
|
|
|
+ console.log(num);
|
|
|
+ this.$confirm('确认恢复此用户吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.$set(this.tableData[num], `state`, '1');
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '恢复成功!',
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消',
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+h1,
|
|
|
+h2,
|
|
|
+h3,
|
|
|
+h4,
|
|
|
+h5,
|
|
|
+h6 {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+.register {
|
|
|
+ width: 100%;
|
|
|
+ padding: 20px;
|
|
|
+}
|
|
|
+.btn {
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ margin: 20px 0;
|
|
|
+}
|
|
|
+.search {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+}
|
|
|
+.searchSel .el-select {
|
|
|
+ border-radius: 0;
|
|
|
+}
|
|
|
+/deep/.searchInp .el-input__inner {
|
|
|
+ border-radius: 0;
|
|
|
+}
|
|
|
+.searchBtn .el-button {
|
|
|
+ border-radius: 0;
|
|
|
+}
|
|
|
+.paging {
|
|
|
+ text-align: right;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+.sizeA {
|
|
|
+ padding: 30px;
|
|
|
+}
|
|
|
+.paging {
|
|
|
+ text-align: right;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+</style>
|
