添加元数据界面，修改数据备份/恢复页面UI

src/views/data/metadata.vue

@@ -0,0 +1,149 @@
+<template>
+    <a-card :bordered="false">
+        <!-- 查询区域 -->
+        <div class="table-page-search-wrapper">
+            <a-form layout="inline">
+                <a-row :gutter="30">
+                    <a-col :md="20">
+                        <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+                        </span>
+                    </a-col>
+                </a-row>
+                <a-row :gutter="24">
+                    <a-col :md="6" :sm="8">
+                        <a-form-item label="数据类型">
+                            <a-select placeholder="选择同步状态" option-filter-prop="children" size="large"
+                                v-model="queryParam.syncState">
+                                <a-select-option key="">
+                                    全部
+                                </a-select-option>
+                                <a-select-option key="0">
+                                    未同步
+                                </a-select-option>
+                                <a-select-option key="1">
+                                    进行中
+                                </a-select-option>
+                                <a-select-option key="2">
+                                    已结束
+                                </a-select-option>
+                            </a-select>
+                        </a-form-item>
+                    </a-col>
+                    <a-col :md="6" :sm="8">
+                        <a-form-item label="关键词">
+                            <a-input placeholder="请输入搜索关键词" v-model="queryParam.databaseName"></a-input>
+                        </a-form-item>
+                    </a-col>
+                    <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+                        <a-col :md="6" :sm="24">
+                            <a-button type="primary" style="left: 10px" icon="search">查询</a-button>
+                        </a-col>
+                    </span>
+
+                </a-row>
+            </a-form>
+        </div>
+
+        <a-row :gutter="30" style="padding: 0 10px;">
+            <a-col :md="6">
+                <div class="linese"></div>
+                <!-- 分类区域 -->
+                <div style="height:calc(100vh - 300px);background: #e6e9f1;padding:10px;">
+
+                </div>
+                <div class="linese"></div>
+            </a-col>
+            <a-col :md="18">
+                <div class="linese"></div>
+                <!-- 表格区域 -->
+                <div style="height:calc(100vh - 300px);background: #e6e9f1;overflow:hidden;padding: 15px;">
+                    <a-table ref="table" size="middle" style="height:calc(100vh - 344px);" bordered rowKey="id"
+                        :columns="columns" :dataSource="dataSource" :loading="loading">
+
+                        <!-- 字符串超长截取省略号显示-->
+                        <!-- <span slot="name" slot-scope="text">
+                            <j-ellipsis :value="text" :length="20" />
+                        </span>
+                        <span slot="describe" slot-scope="text">
+                            <j-ellipsis :value="text" :length="20" />
+                        </span> -->
+                    </a-table>
+                </div>
+                <div class="linese"></div>
+            </a-col>
+        </a-row>
+    </a-card>
+</template>
+<script>
+export default {
+    name: "metadata",
+    components: {
+    },
+    data() {
+        return {
+            loading: false,
+            // 查询条件
+            queryParam: {
+                databaseName: null,
+                syncState: null,
+                pageNum: 1,
+                pageSize: 9999999,
+            },
+            dataSource: [],
+            columns: [
+                {
+                    title: '序号',
+                    dataIndex: '',
+                    key: 'id',
+                    width: 60,
+                    align: "center",
+                    customRender: function (t, r, index) {
+                        return parseInt(index) + 1;
+                    }
+                },
+                {
+                    title: '字段名称',
+                    width: 200,
+                    align: "center",
+                    dataIndex: 'name',
+                },
+                {
+                    title: '索引类型',
+                    width: 130,
+                    align: "center",
+                    dataIndex: 'name',
+                },
+                {
+                    title: '数据长度',
+                    width: 100,
+                    align: "center",
+                    dataIndex: 'name',
+                },
+                {
+                    title: '数据精度',
+                    width: 100,
+                    align: "center",
+                    dataIndex: 'name',
+                },
+                {
+                    title: '描述',
+                    align: "center",
+                    dataIndex: 'issuingTime',
+                }
+            ]
+        }
+    },
+    mounted() {
+
+    },
+    computed: {
+
+    },
+    created() {
+
+    },
+    methods: {
+
+    }
+}
+</script>

src/views/securityAndBackup/backup.vue

@@ -5,19 +5,35 @@
     <div class="table-page-search-wrapper">
       <a-form layout="inline" @keyup.enter.native="searchQuery">
         <a-row :gutter="24">
-          <a-col :md="6" :sm="8">
+          <a-col :md="5" :sm="5">
-            <a-form-item label="模式名称">
+            <a-form-item label="任务名称">
-              <a-select  placeholder="选择模式" option-filter-prop="children" size="large" v-model="queryParam.schemaName">
+              <a-input placeholder="请输入" v-model="queryParam.databaseName"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :md="5" :sm="5">
+            <a-form-item label="数据库">
+              <a-select placeholder="请选择" option-filter-prop="children" size="small" v-model="queryParam.schemaName">
                 <a-select-option v-for="d in allSchemaName" :key="d">
                   {{ d }}
                 </a-select-option>
               </a-select>
             </a-form-item>
           </a-col>
+          <a-col :md="5" :sm="5">
+            <a-form-item label="调度开始时间">
+              <a-date-picker  v-model="queryParam.startTime" @change="onChangeStartTime" />
+            </a-form-item>
+          </a-col>
+          <a-col :md="5" :sm="5">
+            <a-form-item label="调度结束时间">
+              <a-date-picker  v-model="queryParam.endtime" @change="onChangeEndTime" />
+            </a-form-item>
+          </a-col>
           <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-            <a-col :md="6" :sm="24" >
+            <a-col :md="4" :sm="4">
               <a-button type="primary" style="left: 10px" @click="loadData" icon="search">查询</a-button>
-                <a-button type="primary"  @click="searchReset" icon="reload" style="margin-left: 8px;left: 10px">重置</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload"
+                style="margin-left: 8px;left: 10px">重置</a-button>
             </a-col>
           </span>
 
@@ -25,19 +41,12 @@
       </a-form>
     </div>
 
+    <div class="linese"></div>
     <!-- table区域-begin -->
-    <div style="height:900px;overflow-y:auto;">
+    <div style="height:calc(100vh - 300px);background: #e6e9f1;overflow:hidden;padding: 15px;">
-      <a-table
+      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
-        ref="table"
+        :pagination="ipagination" :loading="loading"
-        size="middle"
+        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" @change="handleTableChange">
-        bordered
-        rowKey="id"
-        :columns="columns"
-        :dataSource="dataSource"
-        :pagination="ipagination"
-        :loading="loading"
-        :rowSelection="{selectedRowKeys: selectedRowKeys,onChange: onSelectChange}"
-        @change="handleTableChange">
         <!--        :locale="myLocale"-->
 
         <!-- 字符串超长截取省略号显示-->
@@ -46,17 +55,22 @@
           <span style="color:darkorange;" v-if="text === 1">备份中</span>
           <span style="color:#87d068;" v-if="text === 2">完成</span>
         </template>
+        <template slot="endisStatus" slot-scope="text">
+          <span style="color:black;" v-if="text === 0">未启用</span>
+          <span style="color:#87d068;" v-if="text === 1">启用</span>
+        </template>
         <span slot="action" slot-scope="text, record">
           <a @click="handleEdit(record)">详情</a>
-          <a-divider type="vertical" />
+          <!-- <a-divider type="vertical" />
           <a>查看日志</a>
           <a-divider type="vertical" />
           <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
             <a>删除</a>
-          </a-popconfirm>
+          </a-popconfirm> -->
         </span>
       </a-table>
     </div>
+    <div class="linese"></div>
     <!-- table区域-end -->
 
     <!-- 表单区域 -->
@@ -64,15 +78,19 @@
 </template>
 
 <script>
-  import { shipModelPageList,
+import {
-    shipModeldeleteById } from '@/api/ship'
+  shipModelPageList,
+  shipModeldeleteById
+} from '@/api/ship'
 import { getAction } from '@/api/manage'
-  import { taskCreate,
+import {
+  taskCreate,
   taskUpdateById,
   taskQueryById,
   taskPageList,
   taskDistributeTask,
-    taskDeleteById } from '@/api/task'
+  taskDeleteById
+} from '@/api/task'
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from "@/components/jeecg/JEllipsis";
 
@@ -93,10 +111,12 @@
         {
           id: "1",
           name: "第一次备份",
-            createTime:"2024-03-06 10:30:26",
+          dataBaseName: 'test',
           startTime: "2024-03-06 10:30:26",
-            startTime:"2024-03-06 15:30:26",
+          endTime: "2024-03-06 15:30:26",
-            Status:2
+          larmder: '',
+          Status: 2,
+          endisStatus: 1
         }
       ],
       schemaName: "",
@@ -107,7 +127,7 @@
       },
       columns: [
         {
-            title: '#',
+          title: '序号',
           dataIndex: '',
           key: 'id',
           width: 60,
@@ -122,26 +142,37 @@
           dataIndex: 'name',
         },
         {
-            title: '创建时间',
+          title: '数据库',
           align: "center",
-            dataIndex: 'createTime'
+          dataIndex: 'dataBaseName',
         },
         {
-            title: '备份开始时间',
+          title: '调度开始时间',
           align: "center",
           dataIndex: 'startTime'
         },
         {
-            title: '备份结束时间',
+          title: '调度结束时间',
           align: "center",
           dataIndex: 'endTime',
         },
         {
-            title: '备份状态',
+          title: '表达式',
+          align: "center",
+          dataIndex: 'larmder',
+        },
+        {
+          title: '调度状态',
           align: "center",
           dataIndex: 'Status',
           scopedSlots: { customRender: 'Status' },
         },
+        {
+          title: '是否启用',
+          align: "center",
+          dataIndex: 'endisStatus',
+          scopedSlots: { customRender: 'endisStatus' },
+        },
         {
           title: '操作',
           dataIndex: 'action',
@@ -213,6 +244,12 @@
       this.$refs.modalForm.add();
       this.$refs.modalForm.title = "新增";
     },
+    onChangeStartTime(date, dateString) {
+      console.log(date, dateString);
+    },
+    onChangeEndTime(date, dateString) {
+      console.log(date, dateString);
+    },
   }
 }
 </script>

src/views/securityAndBackup/recovery.vue

@@ -25,8 +25,9 @@
       </a-form>
     </div>
 
+    <div class="linese"></div>
     <!-- table区域-begin -->
-    <div style="height:900px;overflow-y:auto;">
+    <div style="height:calc(100vh - 300px);background: #e6e9f1;overflow:hidden;padding: 15px;">
       <a-table
         ref="table"
         size="middle"
@@ -58,7 +59,7 @@
       </a-table>
     </div>
     <!-- table区域-end -->
-
+    <div class="linese"></div>
     <!-- 表单区域 -->
   </a-card>
 </template>