|
|
@@ -0,0 +1,135 @@
|
|
|
+<template>
|
|
|
+ <div id="synch">
|
|
|
+ <el-row class="register">
|
|
|
+ <el-col :span="24" class="btn">
|
|
|
+ <el-col :span="20"><h3>同步</h3></el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="search">
|
|
|
+ <el-col :span="6" class="searchSel">
|
|
|
+ <el-date-picker v-model="value1" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" class="searchInp"><el-input v-model="input1" placeholder="输入策略名"></el-input></el-col>
|
|
|
+ <el-col :span="5" class="searchInp"><el-input v-model="input2" 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>
|
|
|
+ <el-table :data="tableData" style="width: 100%" border>
|
|
|
+ <el-table-column align="center" prop="data" label="时间"> </el-table-column>
|
|
|
+ <el-table-column align="center" prop="name1" label="策略名称" width="80"> </el-table-column>
|
|
|
+ <el-table-column align="center" prop="name2" label="服务器名称" width="150"> </el-table-column>
|
|
|
+ <el-table-column align="center" prop="behavior" label="同步行为"> </el-table-column>
|
|
|
+ <el-table-column align="center" prop="stata" label="完成情况"> </el-table-column>
|
|
|
+ <el-table-column align="center" label="操作" width="130">
|
|
|
+ <el-button type="text" @click="dialogTableVisible = true">查看异常信息</el-button>
|
|
|
+ </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="查看异常信息" fullscreen :visible.sync="dialogTableVisible">
|
|
|
+ <el-table :data="dialogData">
|
|
|
+ <el-table-column align="center" property="time" label="时间"></el-table-column>
|
|
|
+ <el-table-column align="center" property="reason" label="原因"></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div slot="footer" align="center" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="dialogTableVisible = false">返回</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { log } from 'util';
|
|
|
+export default {
|
|
|
+ name: 'synch',
|
|
|
+ props: {},
|
|
|
+ components: {},
|
|
|
+ data: () => ({
|
|
|
+ tableData: [
|
|
|
+ {
|
|
|
+ data: '2018年9月1日上午9：40至2018年12月3日下午5：23',
|
|
|
+ name1: 'abc',
|
|
|
+ name2: '服务器1',
|
|
|
+ behavior: '同步用户数据',
|
|
|
+ stata: '正常',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data: '2018年9月1日上午9：40至2018年12月3日下午5：23',
|
|
|
+ name1: 'Zed',
|
|
|
+ name2: '服务器1',
|
|
|
+ behavior: '同步应用数据',
|
|
|
+ stata: '异常',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data: '2018年9月1日上午9：40至2018年12月3日下午5：23',
|
|
|
+ name1: 'bac',
|
|
|
+ name2: '服务器2',
|
|
|
+ behavior: '同步文档数据',
|
|
|
+ stata: '异常',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data: '2018年9月1日上午9：40至2018年12月3日下午5：23',
|
|
|
+ name1: 'bca',
|
|
|
+ name2: '服务器2',
|
|
|
+ behavior: '同步用户数据',
|
|
|
+ stata: '正常',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ dialogData: [
|
|
|
+ { time: '时间：2018年9月1日上午9：40', reason: '网络终断' },
|
|
|
+ { time: '时间：2018年12月3日下午5：23', reason: '人为停止' },
|
|
|
+ { time: '时间：2019年3月28日下午9：52', reason: '人为停止' },
|
|
|
+ { time: '时间：2019年6月17日上午11：20', reason: '未知原因 ' },
|
|
|
+ ],
|
|
|
+ input1: '',
|
|
|
+ input2: '',
|
|
|
+ value1: '',
|
|
|
+ dialogTableVisible: false,
|
|
|
+ }),
|
|
|
+ created() {},
|
|
|
+ computed: {},
|
|
|
+ methods: {},
|
|
|
+};
|
|
|
+</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;
|
|
|
+}
|
|
|
+</style>
|
