样式修改，分割线/echarts/字体

src/assets/less/JAreaLinkage.less

@@ -117,7 +117,6 @@
   z-index: 15000;
   background-color: #fff;
   box-sizing: border-box;
-  overflow-x: auto;
   margin: 2px 0;
   border-radius: 4px;
   outline: none;

src/assets/less/Suless.less

@@ -1,12 +1,58 @@
-@bordercolor      : #C8C8C8;
+@bordercolor      : rgb(98,133,151);
 @headercolor      : #ffffff;
 @backcolor        : #ffffff;
-@inpuitbackcolor  : #ffffff;
+@inpuitbordercolor   : rgb(10,63,85);
-@labelDeaultColor : #000000;
+@inpuitbackcolor  : rgb(4,27,43);
-@defaultWhiteColor: #000000;
+@labelDeaultColor : rgb(98,133,151);
-@fontfamily       : 'Microsoft YaHei';
+@defaultWhiteColor: rgb(98,133,151);
+@fontfamily       : 'MyCustomFont1', sans-serif;
 @tableheadColor   : #E5E8EB;
-@tableColor   : #000000;
+@tableheadBgColor : linear-gradient(180deg, rgb(20,108,173),rgb(11,57,90));
+@tableColor   : rgb(98,133,151);
+
+@font-face {
+  font-family: 'MyCustomFont1';
+  src: url('~@/assets/less/Acens-1.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'MyCustomFont2';
+  src: url('~@/assets/less/锐字潮牌真言简2.0免费 特粗(REEJI-ZhenyanGB2.0-Black).ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'MyCustomFont3';
+  src: url('~@/assets/less/锐字潮牌真言简2.0免费 常规(REEJI-ZhenyanGB2.0-Regular).ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+
+.datanum{
+  font-family: 'MyCustomFont2', sans-serif;
+}
+.echartsTitle{
+  height: 36px;
+  background: linear-gradient(90deg, rgb(9,62,81),rgb(8,43,62));
+  color: #ffffff;
+  font-size: 16px;
+  line-height: 34px;
+  .ecicon{
+    margin-top: 2px;
+    width:30px;
+    height: 30px;
+    float: left;
+    background: url('~@/assets/img/echartsTitlebg.png') no-repeat;
+  }
+}
+
+.linese{
+  width: 100%;
+  height: 2px;
+  margin: 10px 0;
+  background: linear-gradient(90deg, rgb(49,112,157) 20px,rgb(26,63,86) 20px,rgb(26,63,86) calc(100% - 20px),rgb(49,112,157) calc(100% - 20px));
+}
 
 /* 滚动条优化 start */
 ::-webkit-scrollbar {
@@ -72,15 +118,17 @@ body {
 }
 
 .ant-layout {
-  // background: url('~@/assets/img/layoutbg.png') no-repeat center bottom !important;
+  background-image: url('~@/assets/img/layoutbg.png') !important;
-  background-color: #fff !important;
+  background-size: 100% 100%;
+  // background-color: #fff !important;
   overflow: hidden;
 }
 
 .ant-layout-header {
-  background-image: url('~@/assets/img/header_bg.png') !important;
+  // background-image: url('~@/assets/img/header_bg.png') !important;
-  background-size: 100% 100%;
+  // background-size: 100% 100%;
-  height: 64px !important;
+  background: transparent !important;
+  height: 130px !important;
 }
 
 
@@ -92,7 +140,6 @@ body {
 .ant-breadcrumb-separator,
 .border-card,
 .ant-tabs-tab {
-  font-family: @fontfamily;
   font-weight: 400 !important;
   font-size  : 16px !important;
   color      : @labelDeaultColor  !important;
@@ -206,7 +253,7 @@ ul {
 ul li {
   line-height: 32px;
   font-family: @fontfamily;
-  font-weight: 400 !important;
+  font-weight: 400;
   font-size  : 16px !important;
   color      : @tableColor !important;
 }
@@ -276,7 +323,7 @@ ul li {
 .ant-pagination-disabled .ant-pagination-item-link,
 .ant-pagination-item a,
 .ant-empty-normal,
-.anticon.anticon-schedule, .border-card:hover,
+.border-card:hover,
 .ant-tabs-tab:hover,
 .ant-form-item,
 .ant-select-arrow,
@@ -296,10 +343,10 @@ ul li {
 }
 
 .ant-layout-content {
-  padding        : 0 !important;
+  padding        : 0 20px !important;
   // background     : url(~@/assets/img/layoutcontentTop.png) 0 0 no-repeat, url(~@/assets/img/layoutcontentMiddle.png) 0 24px no-repeat, url(~@/assets/img/layoutcontentBottom.png) 0 calc(100vh - 182px) no-repeat;
   // background-size: calc(100vw - 80px) 24px, calc(100vw - 80px) calc(100vh - 206px), calc(100vw - 80px) 24px;
-  height         : calc(100vh - 64px) !important;
+  height         : calc(100vh - 130px) !important;
   margin-top: -2px;
   overflow: hidden;
 }
@@ -568,6 +615,7 @@ textarea,
 .ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item-selected .ant-select-selected-icon,
 .ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item:hover .ant-select-selected-icon  {
   color: @defaultWhiteColor  !important;
+  min-height: 38px;
 }
 
 input:not(.ant-calendar-input):not(.ant-calendar-range-picker-input):not(.ant-select-search__field):not(.ant-input-lg),
@@ -576,12 +624,12 @@ textarea,
 .ant-calendar-picker-input,
 .ant-input-number-handler-wrap,
 .ant-select-dropdown-content {
-  border       : 1px solid @bordercolor  !important;
+  border       : 1px solid @inpuitbordercolor  !important;
   border-radius: 3px;
 }
 
 .ant-input-number-handler-down {
-  border-top: 1px solid @bordercolor  !important;
+  border-top: 1px solid @inpuitbordercolor  !important;
 }
 
 .ant-dropdown-menu,
@@ -623,8 +671,8 @@ textarea,
 
     .ant-table-tbody tr th,
     .ant-table-tbody tr td {
-      background-color: @backcolor  !important;
+      color           : @tableheadColor;
-      color           : @defaultWhiteColor;
+      font-family: 'MyCustomFont3', sans-serif;
 
       // height: 50px;
       a {
@@ -639,6 +687,7 @@ textarea,
       border-right : 0 !important;
       border-bottom: 1px solid #31343d !important;
       line-height  : 22px;
+      background: @tableheadBgColor;
     }
   }
 
@@ -755,11 +804,11 @@ textarea,
   background-size: 100% 100% !important;
   min-width     : 130px !important;
   margin        : 0 10px !important;
-  min-height    : 36px !important;
+  min-height    : 55px !important;
-  line-height   : 36px !important;
+  line-height   : 50px !important;
   text-align    : center;
-  font-weight   : bold;
+  font-weight   : 800;
-  font-size     : 16px !important;
+  font-size     : 20px !important;
   padding       :0 20px !important; 
   vertical-align: middle !important;
   font-family   : @fontfamily;
@@ -768,7 +817,7 @@ textarea,
 
 .ant-menu-item>a>span,
 .ant-menu-submenu {
-  color: #787a89 !important;
+  color: rgb(28,204,253) !important;
 }
 
 .ant-menu-item-selected>a>span,
@@ -860,6 +909,9 @@ textarea,
 .ant-menu-inline .ant-menu-submenu-title {
   font-size: 16px !important;
 }
+.ant-menu-item .anticon, .ant-menu-submenu-title .anticon{
+  font-size: 20px !important;
+}
 
 // 外置的样式控制
 .user-dropdown-menu-wrapper.ant-dropdown-menu {
@@ -887,7 +939,6 @@ textarea,
 .ant-table-row-expand-icon {
   background-color: transparent !important;
   color           : @labelDeaultColor  !important;
-  font-family     : @fontfamily;
   font-weight     : 400 !important;
   font-size       : 16px !important;
 }
@@ -901,11 +952,6 @@ tr.ant-table-expanded-row:hover {
   background: transparent !important;
 }
 
-// .ant-table-bordered .ant-table-thead > tr > th:first-child
-// {
-//   background-color:#112834;
-//   color:#00DEF4;
-// }
 .ant-table-row,
 .ant-table-row .ant-table-selection-column,
 .ant-avatar,
@@ -914,7 +960,7 @@ tr.ant-table-expanded-row:hover {
   background-color: transparent !important;
   color           : #00A2FF;
   height          : 50px;
-  font-family     : @fontfamily;
+  font-family     : 'MyCustomFont1', sans-serif;
   font-weight     : 400 !important;
   font-size       : 16px !important;
 }
@@ -935,9 +981,6 @@ tr.ant-table-expanded-row:hover {
 //   color: #00DEF4 !important;
 // }
 
-.ant-table-body {
-  overflow-x: auto !important;
-}
 
 .ant-alert-info,
 // .ant-pagination,
@@ -971,7 +1014,7 @@ tr.ant-table-expanded-row:hover {
 .ant-table-thead>tr>th,
 .ant-table-tbody>tr>td {
   border-right : 0px solid #096A87 !important;
-  border-bottom: 1px solid #31343d !important;
+  border-bottom: 1px solid rgb(10,49,75) !important;
 }
 
 .ant-table-tbody>tr>td {
@@ -979,9 +1022,10 @@ tr.ant-table-expanded-row:hover {
 }
 .ant-table-align-center,
 .ant-table-thead tr th {
-  background-color: @tableheadColor  !important;
+  background: @tableheadBgColor  !important;
-  color           : @labelDeaultColor  !important;
+  color           : @tableheadColor  !important;
-  font-weight: 700  !important;
+  font-family: 'MyCustomFont3', sans-serif;
+  font-size: 16px;
 }
 
 .ant-alert-info {

src/components/layouts/UserLayout.vue

@@ -114,7 +114,8 @@ export default {
     .main {
       width: 596px;
       height: 468px;
-      margin: 390px 1020px;
+      margin: 335px 1173px;
+      padding-top: 80px;
       background: url(~@/assets/img/login_bg.png) no-repeat;
     }
 

src/components/page/GlobalHeader.vue

@@ -27,16 +27,16 @@
     </div>
     <!-- 顶部导航栏模式 -->
     <div v-else :class="['top-nav-header-index', theme]">
-      <div class="header-index-wide">
+      <div>
-        <div class="header-nowTime" :style="topMenuStyle.headerIndexLeft">末端数据接入处理系统</div>
+        <div class="header-index-center header-nowTime" > <img src="~@/assets/img/main-logo.png"/></div>
-        <div class="header-index-center" :style="topMenuStyle.headerIndexCenter">
+        <div class="header-index-center" >
           <div class="header-index-wide">
             <div class="header-index-center" :style="topMenuStyle.topmenuCenter">
               <s-menu mode="horizontal" :menu="menus" :theme="theme"></s-menu>
             </div>
           </div>
         </div>
-        <user-menu class="header-index-right" :theme="theme" :style="topMenuStyle.headerIndexRight" />
+        <user-menu class="header-index-right" :theme="theme" />
       </div>
 
     </div>
@@ -205,7 +205,9 @@ export default {
     }
   }
 }
-
+.header-index-center{
+  text-align: center;
+}
 .ant-layout-header {
   height: 64px;
   line-height: 64px;
@@ -213,9 +215,15 @@ export default {
 .header-nowTime {
   color: #fff;
   font-family: 'Microsoft YaHei';
-  font-size: 26px;
+  font-size: 28px;
   letter-spacing: 3px;
   font-weight: 700;
-  padding-left:23px;
+  height:70px;
+}
+.header-index-right{
+  position: absolute;
+  right: 10px;
+  top: -4px;
+  line-height: 20px;
 }
 </style>

src/components/page/GlobalLayout.vue

@@ -90,8 +90,9 @@ export default {
   created() {
     //--update-begin----author:scott---date:20190320------for:根据后台菜单配置，判断是否路由菜单字段，动态选择是否生成路由（为了支持参数URL菜单）------
     //this.menus = this.mainRouters.find((item) => item.path === '/').children;
+    var cc = this.permissionMenuList.shift()
     this.menus = this.permissionMenuList
-    console.log(this.permissionMenuList)
+    console.log('顶部菜单',this.permissionMenuList)
     // 根据后台配置菜单，重新排序加载路由信息
     //console.log('----加载菜单逻辑----')
     //console.log(this.mainRouters)

src/components/page/PageHeader.vue

@@ -88,7 +88,6 @@
         this.name = this.$route.name
         this.$route.matched.forEach((item) => {
           // item.name !== 'index' && this.breadList.push(item)
-          console.log(this.$route.matched);
           this.breadList.push(item)
         })
       }

src/components/page/PageLayout.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :style="!$route.meta.pageHeader ? 'margin: 0;' : null">
+  <div :style="!$route.meta.pageHeader ? 'margin-top: 80px;border-top:1px solid rgb(18,45,60);' : null">
     <!-- pageHeader , route meta hideHeader:true on hide -->
     <!-- <page-header v-if="!$route.meta.pageHeader" :title="title" :logo="logo" :avatar="avatar">
       <slot slot="action" name="action"></slot>

src/components/tools/UserMenu.vue

@@ -1,17 +1,17 @@
 <template>
-  <div class="user-wrapper" :class="theme" style="min-width:460px">
+  <div class="user-wrapper" :class="theme">
     <a-dropdown>
       <span class="action action-full ant-dropdown-link user-dropdown-menu" >
         <!-- <a-avatar class="avatar" size="small" :src="getAvatar()"/> -->
-      <img src="~@/assets/u8.png" alt="logo" style="margin-right: 10px;margin-top: -6px;" >
+      <img src="~@/assets/u8.png" alt="logo" style="margin-right: 10px;margin-top: -4px;height:16px;" >
-        <span v-if="isDesktop()" style="color:#00c3ff">欢迎您，{{ nickname() }}</span>
+        <span v-if="isDesktop()" style="color:#00c3ff">{{ nickname() }}</span>
       </span>
     </a-dropdown>
     <span class="action">
       <a class="logout_title" href="javascript:;" @click="handleLogout">
         <!-- <a-icon type="logout"/> -->
-      <img src="~@/assets/u6.png" alt="logo" style="margin-right: 10px;margin-top: -4px;" >
+      <img src="~@/assets/u6.png" alt="logo" style="margin-right: 10px;margin-top: -4px; height:16px;" >
-        <span v-if="isDesktop()" style="color:#00c3ff">&nbsp;退出登录</span>
+        <span v-if="isDesktop()" style="color:#00c3ff"></span>
       </a>
     </span>
     <user-password ref="userPassword"></user-password>

src/views/data/dataCataloguing.vue

@@ -1,82 +1,38 @@
 <template>
-    <a-row :gutter="30">
+    <a-row>
-      <a-col :md="11" :sm="1" >
+      <a-col :md="11" style="padding:0 20px;">
+        <div class="linese"></div>
         <!-- 查询区域 -->
-        <a-form layout="inline" @keyup.enter.native="gettagTables" style="margin-top: 10px; margin-left: 4px;">
+        <a-form layout="inline" @keyup.enter.native="getTables" style="margin-top: 10px; margin-left: 4px;">
             <a-row :gutter="24">
             <a-col :md="10" :sm="1">
-              <a-form-item label="标签类型">
+                <a-form-item label="关键词">
-                    <a-select  placeholder="选择标签类型" option-filter-prop="children" size="large" @change="gattable" v-model="queryRefsParam.tagId" style="width: 200px;">
+                    <a-input placeholder="请输入搜索关键词" v-model="queryParam.name"></a-input>
-                        <a-select-option v-for="d in datatagSources" :key="d.id">
+                </a-form-item>
-                        {{ d.tagName }}
+            </a-col>
+            <a-col :md="10" :sm="2">
+                <a-form-item label="标签类型">
+                    <a-select  placeholder="选择标签类型" option-filter-prop="children" size="large" v-model="queryParam.type" style="width: 200px;">
+                        <a-select-option v-for="d in dataTypedataSources" :key="d.id">
+                        {{ d.cnName }}
                         </a-select-option>
                     </a-select>
                 </a-form-item>
             </a-col>
-            <a-col :md="10" :sm="2">
-              <a-form-item label="关键词">
-                    <a-input placeholder="请输入搜索关键词" v-model="queryRefsParam.tableName"></a-input>
-                </a-form-item>
-            </a-col>
             <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                 <a-col :md="4" :sm="3" >
-                    <a-button type="primary"  style="left: 10px" @click="gettagTables" icon="search">查询</a-button>
+                    <a-button type="primary"  style="left: 10px" @click="loadData" icon="search">查询</a-button>
                 </a-col>
             </span>
             </a-row>
         </a-form>
           <!-- table区域-begin -->
-          <div style="height:900px;overflow-y:auto;">
+          <div style="height:calc(100vh - 324px);">
-            <a-table
-              ref="tagtable"
-              size="middle"
-              :loading="tagloading"
-              :row-selection="tagrowSelection"
-              bordered
-              rowKey="id"
-              :pagination="false"
-              :scroll="{ y: 800 }"
-              :columns="tagcolumns"
-              :dataSource="dataRefsSources">
-      <!--        :locale="myLocale"-->
-  
-              <!-- 字符串超长截取省略号显示-->
-            </a-table>
-          </div>
-      </a-col>
-      <a-col :md="2" :sm="2" >
-        <div style="padding-top: 100%; padding-left: 15%;">
-            <a-button type="primary" @click="addtag"> <a-icon type="left" />添加标签 </a-button>
-            <div style="height: 50px;"></div>
-            <a-button type="primary" @click="detag">移除标签<a-icon type="right" /> </a-button>
-        </div>
-      </a-col>
-      <a-col :md="11" :sm="3" >
-        <a-form layout="inline" @keyup.enter.native="getalltable" style="margin-top: 10px; margin-left: 4px;">
-            <a-row :gutter="24">
-            <a-col :md="20" :sm="1">
-                <a-form-item label="关键词">
-                    <a-input placeholder="请输入搜索关键词" v-model="queryParam.tableName"></a-input>
-                </a-form-item>
-            </a-col>
-            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-                <a-col :md="4" :sm="3" >
-                    <a-button type="primary"  style="left: 10px" @click="getalltable" icon="search">查询</a-button>
-                </a-col>
-            </span>
-            </a-row>
-        </a-form>
-          <!-- table区域-begin -->
-          <div style="height:900px;overflow-y:auto;">
             <a-table
               ref="table"
               size="middle"
-              :row-selection="rowSelection"
               bordered
-              :loading="loading"
+              rowKey="id"
-              :rowKey="getRowKey"
-              :pagination="false"
-              :scroll="{ y: 800 }"
               :columns="columns"
               :dataSource="dataSource">
       <!--        :locale="myLocale"-->
@@ -84,6 +40,46 @@
               <!-- 字符串超长截取省略号显示-->
             </a-table>
           </div>
+          <div class="linese"></div>
+      </a-col>
+      <a-col :md="2">
+        <div style="padding-top: 100%; padding-left: 15%;">
+            <a-button type="primary"> <a-icon type="left" />添加标签 </a-button>
+            <div style="height: 50px;"></div>
+            <a-button type="primary">移除标签<a-icon type="right" /> </a-button>
+        </div>
+      </a-col>
+      <a-col :md="11" style="padding:0 20px;">
+        <div class="linese"></div>
+        <a-form layout="inline" @keyup.enter.native="getTables" style="margin-top: 10px; margin-left: 4px;">
+            <a-row :gutter="24">
+            <a-col :md="20" :sm="1">
+                <a-form-item label="关键词">
+                    <a-input placeholder="请输入搜索关键词" v-model="queryParam.name"></a-input>
+                </a-form-item>
+            </a-col>
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+                <a-col :md="4" :sm="3" >
+                    <a-button type="primary"  style="left: 10px" @click="loadData" icon="search">查询</a-button>
+                </a-col>
+            </span>
+            </a-row>
+        </a-form>
+          <!-- table区域-begin -->
+          <div style="height:calc(100vh - 324px);">
+            <a-table
+              ref="table"
+              size="middle"
+              bordered
+              rowKey="id"
+              :columns="columns"
+              :dataSource="endataSource">
+      <!--        :locale="myLocale"-->
+  
+              <!-- 字符串超长截取省略号显示-->
+            </a-table>
+          </div>
+          <div class="linese"></div>
       </a-col>
     </a-row>
     
@@ -92,12 +88,9 @@
   <script>
     import store from '@/store/'
     import {getAction} from '@/api/manage'
-    import { idcTableTagRef,
+    import { 
-    getTableTagRefs,
+      dataTypePageList,
-    getAllTable,
+      dataTypeDeleteById } from '@/api/dataType'
-    idcTableTagRefdelete } from '@/api/idcTableTagRef'
-    import { idcTableTaglist } from '@/api/tag'
-import get from 'lodash.get'
     export default {
       name: "dataManage",
       components: {
@@ -108,102 +101,75 @@ import get from 'lodash.get'
           contentList:[],
           percent:0,
           websock:{},
-          queryRefsParam: {
-            tableName :"",
-            tagId:"",
-            pageNum :1,
-            pageSize:9999999,
-          },
           queryParam: {
-            tableName :"",
+            name :"",
-            tagId:"",
+            type:"侦察预警"
-            pageNum :1,
-            pageSize:9999999,
           },
-          datatagSources: [],
+          dataTypedataSources: [],
-          dataRefsSources:[],
           dataSource:[
+            {
+              tableName:"LA_DATA_TABLE_0001",
+              data1:"舰艇综合导航信息II",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0002",
+              data1:"动力报文",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0003",
+              data1:"电测试报文",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0004",
+              data1:"损管测试报文",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0005",
+              data1:"舰炮测试报文",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0006",
+              data1:"反潜测试报文",
+            },
           ],
-          tagloading:false,
-          loading:false,
           columns: [
-            {
-              title: '表名',
-              align:"left",
-              dataIndex: 'tableName',
-            },
-            {
-              title: '报文名',
-              align:"left",
-              dataIndex: 'tableMessName'
-            },
-          ],
-          tagcolumns: [
             {
               title: '#',
               dataIndex: '',
               key:'id',
               width:60,
-              align:"center",
+              align:"id",
               customRender:function (t,r,index) {
                 return parseInt(index)+1;
               }
             },
             {
               title: '表名',
-              align:"left",
+              align:"center",
               dataIndex: 'tableName',
             },
             {
               title: '报文名',
-              align:"left",
+              align:"center",
-              dataIndex: 'tableMessName'
+              dataIndex: 'data1'
+            },
+          ],
+          endataSource:[
+            {
+              tableName:"LA_DATA_TABLE_0009",
+              data1:"舰艇综合导航信息I",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0010",
+              data1:"动力报文I",
             },
           ],
-          tagqueryParam: {
-            pageNum :1,
-            pageSize:20,
-            tagName:""
-          },
-          selectedRowKeys: [],
-          tagselectedRowKeys: [],
-          selectedRowData: [],
-          tagselectedRowData: [],
         }
       },
       mounted() { 
-          this.getdatatagSources()
+            this.getselect()
       },
       computed: {
-        getRowKey(record) {
-           return `${record.schemaName}_${record.tableName}`
-        },
-        rowSelection() {
-            return {
-              selectedRowKeys: this.selectedRowKeys,
-              onChange: this.handleSelectChange,
-              preserveSelectedRowKeys: true,  // 保持选中项key
-              type: 'checkbox',  // 多选模式
-              columnWidth: 60,   // 选择列宽度
-              getCheckboxProps: record => ({
-                // 可以在这里设置禁用条件
-                // disabled: record.disabled  
-              })
-            }
-        },
-        tagrowSelection() {
-            return {
-              selectedRowKeys: this.tagselectedRowKeys,
-              onChange: this.taghandleSelectChange,
-              preserveSelectedRowKeys: true,  // 保持选中项key
-              type: 'checkbox',  // 多选模式
-              columnWidth: 60,   // 选择列宽度
-              getCheckboxProps: record => ({
-                // 可以在这里设置禁用条件
-                // disabled: record.disabled  
-              })
-            }
-        }
       },
       destroyed: function () { 
       },
@@ -211,29 +177,6 @@ import get from 'lodash.get'
   
       },
       methods: {
-        handleSelectChange(selectedRowKeys,row) {
-          this.selectedRowKeys = selectedRowKeys
-          this.selectedRowData = row
-        },
-        taghandleSelectChange(selectedRowKeys,row) {
-          this.tagselectedRowKeys = selectedRowKeys
-          this.tagselectedRowData = row
-        },
-        gattable(){
-          this.getalltable();
-          this.gettagTables();
-        },
-        getdatatagSources(){
-          idcTableTaglist(this.tagqueryParam).then((res) => {
-              if (res.success) {
-                  this.datatagSources = res.result.records;
-                  this.queryRefsParam.tagId = res.result.records[0].id;
-                  this.gattable();
-              } else {
-                  this.$message.warning(res.message);
-              }
-          });
-        },
         dataAdd(){
           getAction("/dataSpecial/special").then((res) => {
               if (res.success) {
@@ -241,72 +184,15 @@ import get from 'lodash.get'
               }
           });
         },
+        getselect(){
 
-        addtag(){
-          var that = this;
-          this.selectedRowData.forEach(item => { 
-            idcTableTagRef({
-              "tagId": that.queryParam.tagId, 
-              "tableName": item.tableName, 
-              "schemaName": item.schemaName
-            }).then((res) => {
-              if (res.success) {
-                that.gattable();
-              } else {
-                that.$message.warning(res.message);
-              }
-            });
-          })
         },
-        detag(){
+        getTables(){
-          var that = this;
+
-          this.tagselectedRowKeys.forEach(item => {
-            idcTableTagRefdelete({id: item}).then((res) => {
-              if (res.success) {
-                that.gattable();
-              } else {
-                that.$message.warning(res.message);
-              }
-            });
-          });
-        },
-        getalltable(){
-          this.queryParam.tagId  = this.queryRefsParam.tagId 
-          this.loading = true;
-          getAllTable(this.queryParam).then((res) => {
-              if (res.success) {
-                  this.dataSource = res.result;
-              } else {
-                  this.$message.warning(res.message);
-              }
-              this.loading = false;
-          });
-        },
-        gettagTables(){
-          this.tagloading = true;
-          getTableTagRefs(this.queryRefsParam).then((res) => {
-              if (res.success) {
-                  this.dataRefsSources = res.result.records;
-              } else {
-                  this.$message.warning(res.message);
-              }
-              this.tagloading = false;
-          });
         },
       }
     }
   </script>
   <style scoped>
     @import '~@assets/less/common.less';
-    /deep/.ant-checkbox-inner {
-      border: 1px solid #000 !important;
-    }
-    /deep/.ant-checkbox-checked .ant-checkbox-inner {
-      background-color: #fff !important; /* 将背景颜色修改为白色 */
-      border-color: #000 !important; /* 将边框颜色修改为黑色 */
-    }
-    /deep/.ant-checkbox-checked .ant-checkbox-inner::after {
-      border-bottom: 2px solid #000;
-      border-right: 2px solid #000;
-    }
   </style>

src/views/data/dataCleansing.vue

@@ -1,22 +1,21 @@
 <template>
-  <a-row :gutter="30">
+  <a-row :gutter="30" style="padding: 0 10px;">
-    <a-col :md="12" :sm="1" >
+    <a-col :md="14" >
+      <div class="linese"></div>
       <!-- 查询区域 -->
-      <div class="table-page-search-wrapper">
+      <div class="table-page-search-wrapper" style="background: rgb(18, 44, 65);">
-         <a-select  placeholder="选择数据类型"  option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;">
+         <a-select  placeholder="选择数据类型"  option-filter-prop="children"  @change="getTables" style="width: 40%;">
-            <a-select-option v-for="d in dataTypedataSources" :key="d.enName">
+            <a-select-option v-for="d in dataTypedataSources" :key="d.id">
               {{ d.cnName }}
             </a-select-option>
           </a-select>
         </div>
         <!-- table区域-begin -->
-        <div style="height:900px;overflow-y:auto;">
+        <div style="height:calc(100vh - 347px);background: rgb(18, 44, 65);padding:10px;">
           <a-table
             ref="table"
             size="middle"
             bordered
-            :pagination="false"
-            :scroll="{ y: 800 }"
             rowKey="id"
             :columns="columns"
             :dataSource="dataSource">
@@ -25,27 +24,56 @@
             <!-- 字符串超长截取省略号显示-->
           </a-table>
         </div>
+      <div class="linese"></div>
     </a-col>
-    <a-col :md="12" :sm="2" >
+    <a-col :md="10">
-      <a-card :bordered="false">
+      <div class="linese"></div>
+      <a-card :bordered="false" style="background: rgb(18, 44, 65) !important;">
         <!-- 查询区域 -->
         <div class="table-page-search-wrapper">
           <a-form layout="inline">
-              <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <a-row :gutter="24">
-                <a-button @click="dataAdd" type="primary" icon="plus">数据清洗整编</a-button>
+              <a-col :md="12">
-              </span>
+                <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="7">
+              </a-col>
+              <a-col :md="5">
+                <a-button @click="dataAdd" type="primary">数据清洗整编</a-button>
+              </a-col>
+
+            </a-row>
           </a-form>
-          <a-progress :percent="percent" status="active" />
         </div>
         <!-- table区域-begin -->
-        <div style="height:900px;overflow-y:auto;">
+        <div class="datacleanResult">
-            <a-list bordered :data-source="contentList">
+          <div class="progressbg">
-              <a-list-item slot="renderItem" slot-scope="item, index">
+            <div class="title">清洗进度：</div>
-                  {{ item }}
+            <a-progress :percent="percent" status="active" class="progress" />
-                </a-list-item>
+          </div>
-            </a-list>
+          <a-list :data-source="contentList" style="padding:10px 20px;">
+            <a-list-item slot="renderItem" slot-scope="item">
+                {{ item }}
+              </a-list-item>
+          </a-list>
         </div>
       </a-card>
+      <div class="linese"></div>
     </a-col>
   </a-row>
 </template>
@@ -66,16 +94,54 @@
         contentList:[],
         percent:0,
         websock:{},
-        datatypequeryParam: {
-          schemaName:"",
-          sourceType:1
-        },
         queryParam: {
           pageNum :1,
-          pageSize:9999999,
+          pageSize:20
         },
         dataTypedataSources: [],
         dataSource:[
+          {
+            tableName:"LA_DATA_TABLE_0001",
+            data1:"舰艇综合导航信息II",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"侦察预警、指挥控制",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0002",
+            data1:"动力报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"指挥控制",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0003",
+            data1:"电测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"支援保障",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0004",
+            data1:"损管测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"支援保障",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0005",
+            data1:"舰炮测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"装备运行状态",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0006",
+            data1:"反潜测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"装备运行状态",
+          },
         ],
         columns: [
           {
@@ -96,30 +162,30 @@
           {
             title: '报文名',
             align:"center",
-            dataIndex: 'tableMessName'
+            dataIndex: 'data1'
           },
           {
             title: '开始时间',
             align:"center",
-            dataIndex: 'startTime'
+            dataIndex: 'data2'
           },
           {
             title: '最后更新时间',
             align:"center",
-            dataIndex: 'endTime'
+            dataIndex: 'data3'
           },
           {
             title: '标签类型',
             align:"center",
-            dataIndex: 'tagNames'
+            dataIndex: 'data4'
           },
         ],
       }
     },
     mounted() { 
           //初始化websocket
-        this.initWebSocket()
+          this.initWebSocket()
-        this.getselect()
+          this.getselect()
     },
     computed: {
     },
@@ -150,18 +216,23 @@
       },
       websocketonmessage: function (e) {
         var data = eval("(" + e.data + ")"); 
+        console.log(data);
+          //处理订阅信息
         if(data.content.length >0){
+          var char = "当前同步百分比：";
+          let index = data.content.indexOf(char);
+          if (index >= 0) {
+            let result = data.content.substring(index + char.length,data.content.length - 1); // 获取 "V" 及其后所有字符
+            this.percent = parseInt(result) ;
+          }
           this.contentList.unshift(data.content);
         }
-        if(data.currProgress != null){
-          this.percent = data.currProgress;
-        }
       },
       websocketclose: function (e) {
         console.log("connection closed (" + e + ")");
       },
       dataAdd(){
-        getAction("/dataCleaning/cleaning?taskId=3806ce79-dc28-48a3-9250-c7729e6b3ad4").then((res) => {
+        getAction("/rawToStandard/syncMultipleSchemas?dataTaskId=123").then((res) => {
             if (res.success) {
                 this.$message.success(res.message);
             }
@@ -171,25 +242,64 @@
         dataTypePageList(this.queryParam).then((res) => {
             if (res.success) {
                 this.dataTypedataSources = res.result.rows||res.result;
-                this.datatypequeryParam.schemaName = res.result.rows[0].cnName
-                this.getTables();
             } else {
                 this.$message.warning(res.message);
             }
         });
       },
       getTables(){
-        getAction("/dataManager/getDataManagerInfo",this.datatypequeryParam).then((res) => {
+        // datasyncgetTableInfo().then((res) => {
-            if (res.result) {
+        //     if (res.result) {
-              this.dataSource = res.result;
+        //       this.confirmLoading = false;
-            } else {
+        //       this.dataSource = res.result;
-                this.$message.warning(res.message);
+        //       this.models = 2;
-            }
+        //     } else {
-        });
+        //         this.$message.warning(res.message);
+        //     }
+        // });
       },
     }
   }
 </script>
-<style scoped>
+<style>
-  @import '~@assets/less/common.less';
+.datacleanResult{
+  height:calc(100vh - 374px);
+  overflow-y:auto;
+  margin: 10px;
+  background: rgb(11,34,52);
+}
+.datacleanResult .progressbg{
+  margin: 10px;
+  height: 60px;
+  padding:20px 10px;
+  background: rgb(17,42,64);
+  
+}
+.datacleanResult .title{
+  width: 12%;
+  font-size: 16px;
+  float: left;
+  text-align: right;
+  line-height: 20px;
+  color:#fff;
+}
+.datacleanResult .progress{
+  width: 88%;
+  float: left;
+}
+.datacleanResult .ant-progress-bg,
+.datacleanResult .ant-progress-inner{
+  height: 16px !important;
+}
+.datacleanResult .ant-progress-bg{
+  background: linear-gradient(180deg, rgb(43,97,48),rgb(75,160,75),rgb(43,97,48));
+}
+
+.datacleanResult .ant-progress-text{
+  color:#fff;
+}
+.datacleanResult .ant-list-items{
+  border-bottom:1px dashed rgb(35,72,100);
+  color:#fff;
+}
 </style>

src/views/data/dataManage.vue

@@ -3,7 +3,7 @@
     <a-col :md="12" :sm="1" >
       <!-- 查询区域 -->
       <div class="table-page-search-wrapper">
-         <a-select  placeholder="选择数据类型"  option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;">
+         <a-select  placeholder="选择数据类型"  option-filter-prop="children"  @change="getTables" style="width: 40%;">
             <a-select-option v-for="d in dataTypedataSources" :key="d.id">
               {{ d.cnName }}
             </a-select-option>
@@ -15,8 +15,6 @@
             ref="table"
             size="middle"
             bordered
-            :pagination="false"
-            :scroll="{ y: 800 }"
             rowKey="id"
             :columns="columns"
             :dataSource="dataSource">
@@ -35,7 +33,7 @@
           <a-row :gutter="30">
             <a-col :md="6" :sm="10" >
               <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-                <a-button @click="dataAdd" type="primary" icon="plus">发布到专题库</a-button>
+                <a-button @click="dataAdd" type="primary" v-has="'cont:btn'" icon="plus">发布到专题库</a-button>
               </span>
             </a-col>
           </a-row>
@@ -72,16 +70,54 @@
         contentList:[],
         percent:0,
         websock:{},
-        datatypequeryParam: {
-          schemaName:"",
-          sourceType:2
-        },
         queryParam: {
           pageNum :1,
-          pageSize:9999999,
+          pageSize:20
         },
         dataTypedataSources: [],
         dataSource:[
+          {
+            tableName:"LA_DATA_TABLE_0001",
+            data1:"舰艇综合导航信息II",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"侦察预警、指挥控制",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0002",
+            data1:"动力报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"指挥控制",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0003",
+            data1:"电测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"支援保障",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0004",
+            data1:"损管测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"支援保障",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0005",
+            data1:"舰炮测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"装备运行状态",
+          },
+          {
+            tableName:"LA_DATA_TABLE_0006",
+            data1:"反潜测试报文",
+            data2:"2024-03-06 10:30:26",
+            data3:"2024-03-06 15:30:26",
+            data4:"装备运行状态",
+          },
         ],
         columns: [
           {
@@ -102,22 +138,22 @@
           {
             title: '报文名',
             align:"center",
-            dataIndex: 'tableMessName'
+            dataIndex: 'data1'
           },
           {
             title: '开始时间',
             align:"center",
-            dataIndex: 'startTime'
+            dataIndex: 'data2'
           },
           {
             title: '最后更新时间',
             align:"center",
-            dataIndex: 'endTime'
+            dataIndex: 'data3'
           },
           {
             title: '标签类型',
             align:"center",
-            dataIndex: 'tagNames'
+            dataIndex: 'data4'
           },
         ],
       }
@@ -179,21 +215,21 @@
         dataTypePageList(this.queryParam).then((res) => {
             if (res.success) {
                 this.dataTypedataSources = res.result.rows||res.result;
-                this.datatypequeryParam.schemaName = res.result.rows[0].cnName
-                this.getTables();
             } else {
                 this.$message.warning(res.message);
             }
         });
       },
       getTables(){
-        getAction("/dataManager/getDataManagerInfo",this.datatypequeryParam).then((res) => {
+        // datasyncgetTableInfo().then((res) => {
-            if (res.result) {
+        //     if (res.result) {
-              this.dataSource = res.result;
+        //       this.confirmLoading = false;
-            } else {
+        //       this.dataSource = res.result;
-                this.$message.warning(res.message);
+        //       this.models = 2;
-            }
+        //     } else {
-        });
+        //         this.$message.warning(res.message);
+        //     }
+        // });
       },
     }
   }

src/views/data/statistics.vue

@@ -1,19 +1,29 @@
 <template>
     <div style="margin-top: 10px; margin-left: 10px;">
-        <a-row>
+        <a-row :gutter="20">
-            <a-col :md="12" :sm="1">
+            <a-col :md="12" :sm="1" style="height:calc(50vh - 125px);">
-                <div id="cleaningVariance" class="cleaningVariance" ref="cleaningVariance" style="width: 820px; height: 410px; float: left"></div>
+                <div class="linese"></div>
+                <div class="echartsTitle"><div class="ecicon"></div>数据清洗差异统计</div>
+                <div id="cleaningVariance" class="cleaningVariance" ref="cleaningVariance" style="width: 100%; height: calc(100% - 70px);"></div>
+                <div class="linese"></div>
             </a-col>
-            <a-col :md="12" :sm="2">
+            <a-col :md="12" :sm="2" style="height:calc(50vh - 125px);">
-                <div id="totalNumberCatalogues" class="totalNumberCatalogues" ref="totalNumberCatalogues"  style="width: 820px; height: 410px; float: right"></div>
+                <div class="linese"></div>
+                <div class="echartsTitle"><div class="ecicon"></div>数据编目总量统计</div>
+                <div id="totalNumberCatalogues" class="totalNumberCatalogues" ref="totalNumberCatalogues"  style="width: 100%; height: calc(100% - 70px); "></div>
+                <div class="linese"></div>
             </a-col>
-        </a-row>
+            <a-col :md="12" :sm="3" style="height:calc(50vh - 125px);">
-        <a-row>
+                <div class="linese"></div>
-            <a-col :md="12" :sm="3">
+                <div class="echartsTitle"><div class="ecicon"></div>数据类型存储占比统计</div>
-                <div id="catalogingStorage" class="catalogingStorage" ref="catalogingStorage" style="width: 820px; height: 410px;float: left"></div>
+                <div id="catalogingStorage" class="catalogingStorage" ref="catalogingStorage" style="width: 100%; height: calc(100% - 70px);"></div>
+                <div class="linese"></div>
             </a-col>
-            <a-col :md="12" :sm="4">
+            <a-col :md="12" :sm="4" style="height:calc(50vh - 125px);">
-                <div id="typeStorage" class="typeStorage" ref="typeStorage" style="width: 820px; height: 410px;float: right"></div>
+                <div class="linese"></div>
+                <div class="echartsTitle"><div class="ecicon"></div>数据编目存储占比统计</div>
+                <div id="typeStorage" class="typeStorage" ref="typeStorage" style="width: 100%; height: calc(100% - 70px);"></div>
+                <div class="linese"></div>
             </a-col>
         </a-row>
     </div>
@@ -30,14 +40,10 @@
       data () {
         return {
           description: '数据统计',
-          cleaningVarianceData:[],
-          totalNumberCataloguesData:[],
-          catalogingStorageData:[],
-          typeStorage:[]
         }
       },
       mounted() { 
-        this.getTables()
+            this.getTables()
       },
       computed: {
       },
@@ -48,64 +54,74 @@
       },
       methods: {
         dataAdd(){
+        },
+        getselect(){
+
         },
         getTables(){
-            this.cleaningVarianceData =[['product', '原始库', '标准库']];
+            this.getcleaningVariance();
-            getAction("/dataAnalysis/getClnDiffStats",{}).then((res)=>{
+            this.gettotalNumberCatalogues();
-                if(res.success){
+            this.getcatalogingStorage();
-                    res.result.schemaNames.forEach(row => {
+            this.gettypeStorage();
-                        this.cleaningVarianceData.push([row, parseInt(res.result.numRowOriMap[row]),parseInt(res.result.numRowStaMap[row]) ])
-                    })
-                    this.getcleaningVariance();
-                }
-            });
-            this.totalNumberCataloguesData =[];
-            getAction("/dataAnalysis/getTagStats",{}).then((res)=>{
-                if(res.success){
-                    res.result.tagNames.forEach(row => {
-                        this.totalNumberCataloguesData.push([row, parseInt(res.result.tagNumRow[row]) ])
-                    })
-                    this.gettotalNumberCatalogues();
-                }
-            });
-            this.catalogingStorageData =[];
-            getAction("/dataAnalysis/getDataTypeAnalysis",{}).then((res)=>{
-                if(res.success){
-                    res.result.typeName.forEach(row => {
-                        this.catalogingStorageData.push({ value: parseInt(res.result.numRowMap[row]), name: row })
-                    })
-                    this.getcatalogingStorage();
-                }
-            });
-            this.typeStorage =[]
-            getAction("/dataAnalysis/getTagNumRowStats",{}).then((res)=>{
-                if(res.success){
-                    res.result.tagNames.forEach(row => {
-                        this.typeStorage.push({ value: parseInt(res.result.tagNumRow[row]), name: row })
-                    })
-                    this.gettypeStorage();
-                }
-            });
         },
         getcleaningVariance(){
           var myChart = this.$echarts.init(this.$refs.cleaningVariance);
           var option = {
-                title: {
-                    text: '数据清洗差异统计'
-                },
-                legend: {
-                    bottom: 10,
-                    left: 'center'
-                },
                 tooltip: {},
-                dataset: {
+                grid:{
-                    source: this.cleaningVarianceData
+                    left:'40px',
+                    right:'20px',
+                    top:'20px',
+                    bottom:'20px'
+                },
+                xAxis: { 
+                    type: 'category' ,
+                    
+                    axisLabel:{
+                        color: '#fff'
+                    },
+                    splitLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                },
+                yAxis: {
+                    
+                    axisLabel:{
+                        color: '#fff'
+                    },
+                    splitLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                },
+                dataset: {
+                    source: [
+                        ['product', '原始库', '标准库'],
+                        ['平台', 43.3, 85.8],
+                        ['编队', 83.1, 73.4],
+                        ['航空兵', 86.4, 65.2],
+                        ['陆战队', 72.4, 53.9],
+                        ['作战', 72.4, 53.9],
+                        ['反潜', 72.4, 53.9],
+                        ['舰炮', 72.4, 53.9]
+                    ]
                 },
-                xAxis: { type: 'category' },
-                yAxis: {},
                 // Declare several bar series, each will be mapped
                 // to a column of dataset.source by default.
-                series: [{ type: 'bar' }, { type: 'bar' }],
+                series: [{ type: 'bar',barMaxWidth: 20,  }, { type: 'bar',barMaxWidth: 20,  }],
                 color:['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
             };
            myChart.setOption(option);
@@ -113,21 +129,60 @@
         gettotalNumberCatalogues(){
           var myChart = this.$echarts.init(this.$refs.totalNumberCatalogues);
           var option = {
-                title: {
-                    text: '数据编目总量统计'
-                },
-                legend: {
-                    bottom: 10,
-                    left: 'center'},
                 tooltip: {},
                 dataset: {
-                    source: this.totalNumberCataloguesData
+                    source: [
+                        ['product', ''],
+                        ['侦察预警', 43.3],
+                        ['指挥控制', 83.1],
+                        ['火力打击', 86.4],
+                        ['支援保障', 72.4],
+                        ['装备运行状态', 72.4],
+                        ['作战环境', 72.4]
+                    ]
+                },
+                grid:{
+                    left:'40px',
+                    right:'20px',
+                    top:'20px',
+                    bottom:'20px'
+                },
+                xAxis: { 
+                    type: 'category' ,
+                    
+                    axisLabel:{
+                        color: '#fff'
+                    },
+                    splitLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                },
+                yAxis: {
+                    
+                    axisLabel:{
+                        color: '#fff'
+                    },
+                    splitLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
                 },
-                xAxis: { type: 'category' },
-                yAxis: {},
                 // Declare several bar series, each will be mapped
                 // to a column of dataset.source by default.
-                series: [{ type: 'bar' }],
+                series: [{ type: 'bar',barMaxWidth: 30,  }],
                 color:['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
             };
            myChart.setOption(option);
@@ -135,23 +190,23 @@
         getcatalogingStorage(){
           var myChart = this.$echarts.init(this.$refs.catalogingStorage);
           var option = {
-            title: {
-                text: '数据类型存储占比统计',
-                left: 'left'
-            },
             tooltip: {
                 trigger: 'item'
             },
-            legend: {
-                bottom: 10,
-                left: 'center',
-            },
             series: [
                 {
                 name: '占比',
                 type: 'pie',
-                radius: '50%',
+                radius: '80%',
-                data: this.catalogingStorageData,
+                data: [
+                    { value: 1048, name: '平台' },
+                    { value: 735, name: '编队' },
+                    { value: 580, name: '航空兵' },
+                    { value: 484, name: '陆战队' },
+                    { value: 300, name: '作战' },
+                    { value: 735, name: '反潜' },
+                    { value: 580, name: '舰炮' }
+                ],
                 emphasis: {
                     itemStyle: {
                     shadowBlur: 10,
@@ -168,23 +223,22 @@
         gettypeStorage(){
           var myChart = this.$echarts.init(this.$refs.typeStorage);
           var option = {
-            title: {
-                text: '数据编目存储占比统计',
-                left: 'left'
-            },
             tooltip: {
                 trigger: 'item'
             },
-            legend: {
-                bottom: 10,
-                left: 'center',
-            },
             series: [
                 {
                 name: '占比',
                 type: 'pie',
-                radius: '50%',
+                radius: '80%',
-                data:  this.typeStorage,
+                data: [
+                    { value: 1048, name: '侦察预警' },
+                    { value: 735, name: '指挥控制' },
+                    { value: 580, name: '火力打击' },
+                    { value: 484, name: '支援保障' },
+                    { value: 300, name: '装备运行状态' },
+                    { value: 300, name: '作战环境' }
+                ],
                 emphasis: {
                     itemStyle: {
                     shadowBlur: 10,

src/views/data/thematicLibrary.vue

@@ -1,28 +1,17 @@
 <template>
     <a-row :gutter="30">
       <a-col :md="24" :sm="1" >
-        <div class="table-page-search-wrapper">
+          <!-- table区域-begin -->
-         <a-select  placeholder="选择数据类型"  option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;">
+          <div style="height:900px;overflow-y:auto;">
-            <a-select-option v-for="d in dataTypedataSources" :key="d.id">
+            <a-table
-              {{ d.cnName }}
+              ref="table"
-            </a-select-option>
+              size="middle"
-          </a-select>
+              bordered
-        </div>
+              rowKey="id"
-        <!-- table区域-begin -->
+              :columns="columns"
-        <div style="height:900px;overflow-y:auto;">
+              :dataSource="dataSource">
-          <a-table
-            ref="table"
-            size="middle"
-            bordered
-            :pagination="false"
-            :scroll="{ y: 800 }"
-            rowKey="id"
-            :columns="columns"
-            :dataSource="dataSource">
-    <!--        :locale="myLocale"-->
 
-            <!-- 字符串超长截取省略号显示-->
+            </a-table>
-          </a-table>
           </div>
       </a-col>
     </a-row>
@@ -30,11 +19,7 @@
   </template>
   
   <script>
-    import store from '@/store/'
+    
-    import {getAction} from '@/api/manage'
-    import { 
-      dataTypePageList,
-      dataTypeDeleteById } from '@/api/dataType'
     export default {
       name: "thematicLibrary",
       components: {
@@ -43,16 +28,53 @@
         return {
           description: '专题库',
           contentList:[],
-          datatypequeryParam: {
-            schemaName:"",
-            sourceType:3
-          },
           queryParam: {
             pageNum :1,
-            pageSize:9999999,
+            pageSize:20
           },
-          dataTypedataSources: [],
           dataSource:[
+            {
+              tableName:"LA_DATA_TABLE_0001",
+              data1:"舰艇综合导航信息II",
+              data2:"2024-03-06 10:30:26",
+              data3:"2024-03-06 15:30:26",
+              data4:"3646135477",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0002",
+              data1:"动力报文",
+              data2:"2024-03-06 10:30:26",
+              data3:"2024-03-06 15:30:26",
+              data4:"92547612",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0003",
+              data1:"电测试报文",
+              data2:"2024-03-06 10:30:26",
+              data3:"2024-03-06 15:30:26",
+              data4:"1658432215",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0004",
+              data1:"损管测试报文",
+              data2:"2024-03-06 10:30:26",
+              data3:"2024-03-06 15:30:26",
+              data4:"8535411",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0005",
+              data1:"舰炮测试报文",
+              data2:"2024-03-06 10:30:26",
+              data3:"2024-03-06 15:30:26",
+              data4:"1235744",
+            },
+            {
+              tableName:"LA_DATA_TABLE_0006",
+              data1:"反潜测试报文",
+              data2:"2024-03-06 10:30:26",
+              data3:"2024-03-06 15:30:26",
+              data4:"159748153",
+            },
           ],
           columns: [
             {
@@ -73,28 +95,28 @@
             {
               title: '报文名',
               align:"center",
-              dataIndex: 'tableMessName'
+              dataIndex: 'data1'
             },
             {
               title: '开始时间',
               align:"center",
-              dataIndex: 'startTime'
+              dataIndex: 'data2'
             },
             {
               title: '最后更新时间',
               align:"center",
-              dataIndex: 'endTime'
+              dataIndex: 'data3'
             },
             {
-              title: '标签类型',
+              title: '数据量',
               align:"center",
-              dataIndex: 'tagNames'
+              dataIndex: 'data4'
             },
           ],
         }
       },
       mounted() { 
-         this.getselect()
+         this.getTables()
       },
       computed: {
       },
@@ -104,25 +126,16 @@
   
       },
       methods: {
-        getselect(){
-          dataTypePageList(this.queryParam).then((res) => {
-              if (res.success) {
-                  this.dataTypedataSources = res.result.rows||res.result;
-                  this.datatypequeryParam.schemaName = res.result.rows[0].cnName
-                  this.getTables();
-              } else {
-                  this.$message.warning(res.message);
-              }
-          });
-        },
         getTables(){
-          getAction("/dataManager/getDataManagerInfo",this.datatypequeryParam).then((res) => {
+          // datasyncgetTableInfo().then((res) => {
-              if (res.result) {
+          //     if (res.result) {
-                this.dataSource = res.result;
+          //       this.confirmLoading = false;
-              } else {
+          //       this.dataSource = res.result;
-                  this.$message.warning(res.message);
+          //       this.models = 2;
-              }
+          //     } else {
-          });
+          //         this.$message.warning(res.message);
+          //     }
+          // });
         },
       }
     }

src/views/fileManage/index.vue

@@ -1,493 +1,479 @@
 <template>
-    <div class="pageBackground">
+  <div>
-        <div class="breadHeader">文件管理/列表</div>
+    <div class="filecontent">
-        <div class="filecontent">
+      <div class="flodContent">
-            <a-layout>
+        <div class="linese"></div>
-                <a-layout-sider>
+        <div class="siderHeader echartsTitle">
-                    <div class="siderHeader">文件目录</div>
+          <div class="ecicon"></div>
-                    <div class="flodContent">
+          文件目录
-                         <a-dropdown :trigger="['contextmenu']">
-                           <a-directory-tree :tree-data="treeData" v-model:expandedKeys="expandedKeys"
-                                v-model:selectedKeys="selectedKeys" @select="changeSelect">
-                                <a-tree-node v-for="itemNode in treeData" :key="itemNode.id"
-                                    :title="itemNode.title" :value="itemNode">
-                                </a-tree-node>
-                            </a-directory-tree>
-                            <template #overlay>
-                            <a-menu class="menu" @click="menuClick">
-                                <a-menu-item key="1">添加</a-menu-item>
-                                <a-menu-item key="2">重命名</a-menu-item>
-                                <a-menu-item key="3">删除</a-menu-item>
-                            </a-menu>
-                            </template>
-                        </a-dropdown>
-                        
-                        
-                    </div>
-                </a-layout-sider>
-                <a-layout-content>
-                    <div class="main">
-                        <div class="quarter-div">
-                            <a-row>
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
-                                </a-col>
-                                <a-col :span="12">
-                                    <div style="margin-top: 14px">{{fileNum.total}}</div>
-                                    <div>文件总数</div>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <div class="quarter-div">
-                            <a-row>
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
-                                </a-col>
-                                <a-col :span="12">
-                                    <div style="margin-top: 14px">{{fileNum.pictures}}</div>
-                                    <div>图片</div>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <div class="quarter-div">
-                            <a-row>
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
-                                </a-col>
-                                <a-col :span="12">
-                                    <div style="margin-top: 14px">{{fileNum.audio}}</div>
-                                    <div>音频</div>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <div class="quarter-div">
-                            <a-row>
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
-                                </a-col>
-                                <a-col :span="12">
-                                    <div style="margin-top: 14px">{{fileNum.dbfile}}</div>
-                                    <div>数据库文件</div>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <div class="quarter-div">
-                            <a-row>
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
-                                </a-col>
-                                <a-col :span="12">
-                                    <div style="margin-top: 14px">{{fileNum.video}}</div>
-                                    <div>视频</div>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <div class="quarter-div">
-                            <a-row>
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
-                                </a-col>
-                                <a-col :span="12">
-                                    <div style="margin-top: 14px">{{fileNum.document}}</div>
-                                    <div>文档</div>
-                                </a-col>
-                            </a-row>
-                        </div>
-                    </div>
-                    <div style="margin-top: 20px;">
-                        <a-row>
-                            <a-col :span="12">
-                                <a-form layout="inline">
-                                    <a-form-item>
-                                        <a-input placeholder="请输入" v-model="searchFile.queryCondition"></a-input>
-                                    </a-form-item>
-                                    <a-form-item>
-                                        <a-button type="primary" icon="search" style="margin-left: 21px" @click="searchgetFileList">查询</a-button>
-                                        <a-button type="primary" icon="reload" style="margin-left: 8px" @click="reloadFileList">重置</a-button>
-                                    </a-form-item>
-                                </a-form>
-                            </a-col>
-                            <a-col :span="12" style="text-align: right;">
-                                <a-button type="primary"  style="margin-left: 8px" @click="clickfile">
-                                    <a-icon type="upload"/>
-                                    文件上传
-                                </a-button>
-                            </a-col>
-                        </a-row>
-                    </div>
-                    <div style="margin-top: 15px">
-                        <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" class="fileTable"
-                            :dataSource="dataSource" :pagination="searchFileTable" :loading="loading"
-                            @change="handleTableChange">
-                            <span slot="action" slot-scope="text, record">
-                                <a @click="download(record,$event)">下载</a>&nbsp; <a @click="viewFile(record,$event)">预览</a>&nbsp; <a @click="DeleteFile(record,$event)">删除</a>
-                            </span>
-                        </a-table>
-                    </div>
-                </a-layout-content>
-            </a-layout>
         </div>
-        <a-modal v-model:open="isopen" :title="modalTitle" ok-text="确认" cancel-text="取消" @ok="hideModal">
+        <a-dropdown :trigger="['contextmenu']">
-            <a-input placeholder="请输入" v-model="dirName" style="color: #000000 !important"></a-input>
+          <a-directory-tree
-        </a-modal>
+            :tree-data="treeData"
-        <uploadModal ref="modalForm"></uploadModal>
+            v-model:expandedKeys="expandedKeys"
+            class="teeediv"
+            v-model:selectedKeys="selectedKeys"
+            @select="changeSelect"
+          >
+            <a-tree-node v-for="itemNode in treeData" :key="itemNode.id" :title="itemNode.title" :value="itemNode">
+            </a-tree-node>
+          </a-directory-tree>
+          <template #overlay>
+            <a-menu class="menu" @click="menuClick">
+              <a-menu-item key="1">添加</a-menu-item>
+              <a-menu-item key="2">重命名</a-menu-item>
+              <a-menu-item key="3">删除</a-menu-item>
+            </a-menu>
+          </template>
+        </a-dropdown>
+        <div class="linese"></div>
+      </div>
+      <div class="righttop">
+         <div class="linese"></div>
+          <a-row class="quarter-div">
+            <a-col :span="10">
+              <img src="~@/assets/img/icon-结构化数据条数.png" />
+            </a-col>
+            <a-col :span="14">
+              <div class="datanum">{{ fileNum.total }}</div>
+              <div>文件总数</div>
+            </a-col>
+          </a-row>
+          <a-row class="quarter-div">
+            <a-col :span="10">
+              <img src="~@/assets/img/icon非结构化文件大小.png" />
+            </a-col>
+            <a-col :span="14">
+              <div class="datanum">{{ fileNum.pictures }}</div>
+              <div>图片</div>
+            </a-col>
+          </a-row>
+          <a-row class="quarter-div">
+            <a-col :span="10">
+              <img src="~@/assets/img/icon-表数量.png" />
+            </a-col>
+            <a-col :span="14">
+              <div class="datanum">{{ fileNum.audio }}</div>
+              <div>音频</div>
+            </a-col>
+          </a-row>
+          <a-row class="quarter-div">
+            <a-col :span="10">
+              <img src="~@/assets/img/icon-文件接引数量.png" />
+            </a-col>
+            <a-col :span="14">
+              <div class="datanum">{{ fileNum.dbfile }}</div>
+              <div>数据库文件</div>
+            </a-col>
+          </a-row>
+          <a-row class="quarter-div">
+            <a-col :span="10">
+              <img src="~@/assets/img/icon-文档数量.png" />
+            </a-col>
+            <a-col :span="14">
+              <div class="datanum">{{ fileNum.video }}</div>
+              <div>视频</div>
+            </a-col>
+          </a-row>
+          <a-row class="quarter-div" style="margin-right: 0;">
+            <a-col :span="10">
+              <img src="~@/assets/img/icon-文档数量.png" />
+            </a-col>
+            <a-col :span="14">
+              <div class="datanum">{{ fileNum.document }}</div>
+              <div>文档</div>
+            </a-col>
+          </a-row>
+        <div class="linese" style="float: left;"></div>
+        <div class="linese" style="float: left;"></div>
+        
+        <div>
+            <a-row>
+            <a-col :span="12">
+                <a-form layout="inline">
+                <a-form-item>
+                    <a-input placeholder="请输入" v-model="searchFile.queryCondition"></a-input>
+                </a-form-item>
+                <a-form-item>
+                    <a-button type="primary" icon="search" style="margin-left: 21px" @click="searchgetFileList"
+                    >查询</a-button
+                    >
+                    <a-button type="primary" icon="reload" style="margin-left: 8px" @click="reloadFileList">重置</a-button>
+                </a-form-item>
+                </a-form>
+            </a-col>
+            <a-col :span="12" style="text-align: right">
+                <a-button type="primary" style="margin-left: 8px" @click="clickfile">
+                <a-icon type="upload" />
+                文件上传
+                </a-button>
+            </a-col>
+            </a-row>
+        </div>
+        <div class="rtable">
+            <a-table
+            ref="table"
+            bordered
+            size="middle"
+            rowKey="id"
+            :columns="columns"
+            class="fileTable"
+            :dataSource="dataSource"
+            :pagination="searchFileTable"
+            :loading="loading"
+            @change="handleTableChange"
+            >
+            <span slot="action" slot-scope="text, record">
+                <a @click="download(record, $event)">下载</a>&nbsp; <a @click="viewFile(record, $event)">预览</a>&nbsp;
+                <a @click="DeleteFile(record, $event)">删除</a>
+            </span>
+            </a-table>
+        </div>
+         <div class="linese"></div>
+      </div>
     </div>
+    <a-modal v-model="isopen" :title="modalTitle" ok-text="确认" cancel-text="取消" @ok="hideModal">
+      <a-input placeholder="请输入" v-model="dirName" style="color: #000000 !important"></a-input>
+    </a-modal>
+    <uploadModal ref="modalForm"></uploadModal>
+  </div>
 </template>
 <script>
 import uploadModal from './modules/uploadModal'
 import guaz from '@assets/guaz.png'
-import {createDir,logicDelDir,renameDir,dirtreeList} from '@/api/dirapi'
+import { createDir, logicDelDir, renameDir, dirtreeList } from '@/api/dirapi'
-import {downloadFile,filePreview,logicDeleteFile,pageList,uoloadFile,countFileNum} from '@/api/fileapi'
+import { downloadFile, filePreview, logicDeleteFile, pageList, uoloadFile, countFileNum } from '@/api/fileapi'
 export default {
-    name: "fileManage",
+  name: 'fileManage',
-    components: {
+  components: {
-      uploadModal
+    uploadModal,
-    },
+  },
-    data() {
+  data() {
-        return {
+    return {
-            dirName:"",
+      dirName: '',
-            guaz,
+      guaz,
-            expandedKeys: [],
+      expandedKeys: [],
-            selectedKeys: [],
+      selectedKeys: [],
-            treeData: [
+      treeData: [],
-            ],
+      isopen: false,
-            isopen:false,
+      columns: [
-            columns: [
+        {
-                {
+          title: '序号',
-                    title: "序号",
+          width: 70,
-                    width: 70,
+          customRender: (text, record, index) => `${index + 1}`,
-                    customRender: (text, record, index) => `${index + 1}`,
+        },
-                },
+        {
-                {
+          title: '文件名称',
-                    title: '文件名称',
+          align: 'center',
-                    align: "center",
+          dataIndex: 'fileName',
-                    dataIndex: 'fileName',
+          width: 120,
-                    width: 120,
+          sorter: true,
-                    sorter: true
+        },
-                },
+        {
-                {
+          title: '文件后缀',
-                    title: '文件后缀',
+          align: 'center',
-                    align: "center",
+          width: 100,
-                    width: 100,
+          dataIndex: 'fileSuffix',
-                    dataIndex: 'fileSuffix',
+        },
-                },
+        {
-                {
+          title: '文件大小',
-                    title: '文件大小',
+          align: 'center',
-                    align: "center",
+          width: 120,
-                    width: 120,
+          dataIndex: 'fileSize',
-                    dataIndex: 'fileSize'
+        },
-                },
 
-                {
+        {
-                    title: '文件类型',
+          title: '文件类型',
-                    align: "center",
+          align: 'center',
-                    width: 80,
+          width: 80,
-                    dataIndex: 'fileTypeName'
+          dataIndex: 'fileTypeName',
-                },
-                {
-                    title: '创建人',
-                    align: "center",
-                    width: 100,
-                    dataIndex: 'createByName'
-                },
-                {
-                    title: '操作',
-                    dataIndex: 'action',
-                    scopedSlots: { customRender: 'action' },
-                    align: "center",
-                    width: 170
-                }
-
-            ],
-            /* 分页参数 */
-            searchFileTable: {
-                current: 1,
-                pageSize: 10,
-                pageSizeOptions: ['5', '10', '20','50','100'],
-                showTotal: (total, range) => {
-                    return range[0] + "-" + range[1] + " 共" + total + "条"
-                },
-                showQuickJumper: true,
-                showSizeChanger: true,
-                total: 0
-            },
-            dataSource: [],
-            loading: false,
-            selectedRowKeys: [],
-            selectId:"",
-            modalTitle:"",
-            modelType:"",
-            searchFile:{
-                "dirId":"",
-                "queryCondition":"",
-                "pageNum":"",
-                "pageSize":"",
-            },
-            fileNum:{
-                document:0,
-                pictures:0,
-                video:0,
-                dbfile:0,
-                audio:0,
-                total:0
-            }
-        }
-    },
-    created() {
-    },
-    mounted() {
-        this.getDirList();
-        this.getcountFileNum();
-	},
-    computed: {
-        
-    },
-    methods: {
-        clickfile(){
-            if(this.selectId.length <= 0){
-                this.$message.warning("必须选择文件上传目录");
-                return;
-            }
-            console.log("dirid=" + this.searchFile.dirId)
-            this.$refs.modalForm.title = "文件上传";
-            this.$refs.modalForm.dirId = this.searchFile.dirId;
-            this.$refs.modalForm.add();
         },
-        getcountFileNum(){
+        {
-            var that = this;
+          title: '创建人',
-            countFileNum({}).then((res) => {
+          align: 'center',
-                if (res.success) {
+          width: 100,
-                    res.result.forEach((item,index)=>{
+          dataIndex: 'createByName',
-                        that.setcountFileNum(item);
-                    })
-                } else {
-                    this.$message.warning(res.message);
-                }
-            });
         },
-        setcountFileNum(item){
+        {
-            switch (item.FILETYPE) {
+          title: '操作',
-                case "document":
+          dataIndex: 'action',
-                    this.fileNum.document = item.NUMS
+          scopedSlots: { customRender: 'action' },
-                    break;
+          align: 'center',
-                case "pictures":
+          width: 170,
-                    this.fileNum.pictures = item.NUMS
-                    break;
-                case "video":
-                    this.fileNum.video = item.NUMS
-                    break;
-                case "dbfile":
-                    this.fileNum.dbfile = item.NUMS
-                    break;
-                case "audio":
-                    this.fileNum.audio = item.NUMS
-                    break;  
-                case "total":
-                    this.fileNum.total = item.NUMS
-                    break;  
-            }
         },
-        download(item){
+      ],
-            let apiBaseUrl = window._CONFIG['domianURL'] || "/jeecg-boot";
+      /* 分页参数 */
-            window.open(apiBaseUrl+"/file/downloadFile?fileId="+item.id);
+      searchFileTable: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['5', '10', '20', '50', '100'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' 共' + total + '条'
         },
-        viewFile(item){
+        showQuickJumper: true,
-            filePreview({fileId:item.id}).then((res) => {
+        showSizeChanger: true,
-                if (res.success) {
+        total: 0,
-                    window.open("http://"+res.result,"_blank");
+      },
-                } else {
+      dataSource: [],
-                    this.$message.warning(res.message);
+      loading: false,
-                }
+      selectedRowKeys: [],
-            });
+      selectId: '',
-        },
+      modalTitle: '',
-        DeleteFile(item){
+      modelType: '',
-            var that = this;
+      searchFile: {
-            that.$confirm({
+        dirId: '',
-                title: "确认删除",
+        queryCondition: '',
-                content: "是否删除选中文件?",
+        pageNum: '',
-                onOk: function () {
+        pageSize: '',
-                    logicDeleteFile({id:item.id}).then((res) => {
+      },
-                        that.$message.warning(res.message);
+      fileNum: {
-                        that.searchgetFileList();
+        document: 0,
-                    });
+        pictures: 0,
-                }
+        video: 0,
-            });
+        dbfile: 0,
-        },
+        audio: 0,
-        onSelectChange(selectedRowKeys, selectedRows) {
+        total: 0,
-            console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+      },
-        },
-        handleTableChange() {
-
-        },
-        reloadFileList(){
-            this.searchFile.queryCondition = "";
-            this.searchFile.pageNum = 1;
-            this.searchFile.pageSize = 10;
-            this.getFileList();
-        },
-        searchgetFileList(){
-            this.searchFile.dirId = this.selectId;
-            this.searchFile.pageNum = this.searchFileTable.current;
-            this.searchFile.pageSize = this.searchFileTable.pageSize;
-            this.getFileList();
-        },
-        getFileList(){
-            if(this.selectId.length <= 0){
-                this.$message.warning("必须选择查询目录");
-                return;
-            }
-            pageList(this.searchFile).then((res) => {
-                if (res.success) {
-                    this.dataSource = res.result.rows
-                    this.searchFileTable.total = res.result.total
-                } else {
-                    this.$message.warning(res.message);
-                }
-            });
-        },
-        hideModal(){
-            this.isopen =false;
-            switch(this.modelType) {
-                case "create":
-                    createDir({pid:this.selectId,dirName:this.dirName}).then((res) => {
-                        if (res.success) {
-                            this.treeData = res.result
-                            this.getDirList();
-                        } else {
-                            this.$message.warning(res.message);
-                        }
-                    });
-                    break;
-                case "rename":
-                     renameDir({id:this.selectId,dirName:this.dirName}).then((res) => {
-                        if (res.success) {
-                            this.treeData = res.result
-                            this.getDirList();
-                        } else {
-                            this.$message.warning(res.message);
-                        }
-                    });
-                    break;
-            } 
-        },
-        getDirList(){
-            dirtreeList({dirName:""}).then((res) => {
-                if (res.success) {
-                    this.treeData = res.result
-                } else {
-                    this.$message.warning(res.message);
-                }
-            });
-        },
-        menuClick(value){
-            switch(value.key) {
-                case "1":
-                    this.createDir();
-                    break;
-                case "2":
-                    this.renameDir();
-                    break;
-                case "3":
-                    this.logicDelDir();
-                    break;
-            } 
-        },
-        createDir(){
-            this.modalTitle = "添加节点";
-            this.isopen =true;
-            this.modelType = "create";
-            this.dirName="";
-        },
-        logicDelDir(){
-            var that = this;
-            this.$confirm({
-                title: "确认删除",
-                content: "是否删除选中目录?",
-                onOk: function () {
-                    logicDelDir({id:that.selectId}).then((res) => {
-                        that.$message.warning(res.message);
-                        that.getDirList();
-                    });
-                }
-            });
-        },
-        renameDir(){
-            this.modalTitle = "重命名节点";
-            this.isopen =true;
-            this.modelType = "rename";
-            this.dirName="";
-        },
-        changeSelect(selectedKeys,e){
-            this.selectId = e.node.dataRef.id
-            this.searchFile.dirId = this.selectId
-            this.searchgetFileList();
-        }
     }
+  },
+  created() {},
+  mounted() {
+    this.getDirList()
+    this.getcountFileNum()
+  },
+  computed: {},
+  methods: {
+    clickfile() {
+      if (this.selectId.length <= 0) {
+        this.$message.warning('必须选择文件上传目录')
+        return
+      }
+      console.log('dirid=' + this.searchFile.dirId)
+      this.$refs.modalForm.title = '文件上传'
+      this.$refs.modalForm.dirId = this.searchFile.dirId
+      this.$refs.modalForm.add()
+    },
+    getcountFileNum() {
+      var that = this
+      countFileNum({}).then((res) => {
+        if (res.success) {
+          res.result.forEach((item, index) => {
+            that.setcountFileNum(item)
+          })
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
+    setcountFileNum(item) {
+      switch (item.FILETYPE) {
+        case 'document':
+          this.fileNum.document = item.NUMS
+          break
+        case 'pictures':
+          this.fileNum.pictures = item.NUMS
+          break
+        case 'video':
+          this.fileNum.video = item.NUMS
+          break
+        case 'dbfile':
+          this.fileNum.dbfile = item.NUMS
+          break
+        case 'audio':
+          this.fileNum.audio = item.NUMS
+          break
+        case 'total':
+          this.fileNum.total = item.NUMS
+          break
+      }
+    },
+    download(item) {
+      let apiBaseUrl = window._CONFIG['domianURL'] || '/jeecg-boot'
+      window.open(apiBaseUrl + '/file/downloadFile?fileId=' + item.id)
+    },
+    viewFile(item) {
+      filePreview({ fileId: item.id }).then((res) => {
+        if (res.success) {
+          window.open('http://' + res.result, '_blank')
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
+    DeleteFile(item) {
+      var that = this
+      that.$confirm({
+        title: '确认删除',
+        content: '是否删除选中文件?',
+        onOk: function () {
+          logicDeleteFile({ id: item.id }).then((res) => {
+            that.$message.warning(res.message)
+            that.searchgetFileList()
+          })
+        },
+      })
+    },
+    onSelectChange(selectedRowKeys, selectedRows) {
+      console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows)
+    },
+    handleTableChange() {},
+    reloadFileList() {
+      this.searchFile.queryCondition = ''
+      this.searchFile.pageNum = 1
+      this.searchFile.pageSize = 10
+      this.getFileList()
+    },
+    searchgetFileList() {
+      this.searchFile.dirId = this.selectId
+      this.searchFile.pageNum = this.searchFileTable.current
+      this.searchFile.pageSize = this.searchFileTable.pageSize
+      this.getFileList()
+    },
+    getFileList() {
+      if (this.selectId.length <= 0) {
+        this.$message.warning('必须选择查询目录')
+        return
+      }
+      pageList(this.searchFile).then((res) => {
+        if (res.success) {
+          this.dataSource = res.result.rows
+          this.searchFileTable.total = res.result.total
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
+    hideModal() {
+      this.isopen = false
+      switch (this.modelType) {
+        case 'create':
+          createDir({ pid: this.selectId, dirName: this.dirName }).then((res) => {
+            if (res.success) {
+              this.treeData = res.result
+              this.getDirList()
+            } else {
+              this.$message.warning(res.message)
+            }
+          })
+          break
+        case 'rename':
+          renameDir({ id: this.selectId, dirName: this.dirName }).then((res) => {
+            if (res.success) {
+              this.treeData = res.result
+              this.getDirList()
+            } else {
+              this.$message.warning(res.message)
+            }
+          })
+          break
+      }
+    },
+    getDirList() {
+      dirtreeList({ dirName: '' }).then((res) => {
+        if (res.success) {
+          this.treeData = res.result
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
+    menuClick(value) {
+      switch (value.key) {
+        case '1':
+          this.createDir()
+          break
+        case '2':
+          this.renameDir()
+          break
+        case '3':
+          this.logicDelDir()
+          break
+      }
+    },
+    createDir() {
+      this.modalTitle = '添加节点'
+      this.isopen = true
+      this.modelType = 'create'
+      this.dirName = ''
+    },
+    logicDelDir() {
+      var that = this
+      this.$confirm({
+        title: '确认删除',
+        content: '是否删除选中目录?',
+        onOk: function () {
+          logicDelDir({ id: that.selectId }).then((res) => {
+            that.$message.warning(res.message)
+            that.getDirList()
+          })
+        },
+      })
+    },
+    renameDir() {
+      this.modalTitle = '重命名节点'
+      this.isopen = true
+      this.modelType = 'rename'
+      this.dirName = ''
+    },
+    changeSelect(selectedKeys, e) {
+      this.selectId = e.node.dataRef.id
+      this.searchFile.dirId = this.selectId
+      this.searchgetFileList()
+    },
+  },
 }
 </script>
 
 <style scoped>
-.pageBackground {
+.menu {
-    background: #dee3ee;
+  background: #ffffff !important;
-    height: 100vh;
-    font-size: 23px;
-}
-
-.breadHeader {
-    height: 40px;
-    background: #FFFFFF;
-    line-height: 40px;
-    font-size: 18px;
-    color: #a3a8bb;
-    padding: 0 100px;
-    margin-bottom: 8px;
-}
-.menu{
-    background: #ffffff !important;
 }
 .filecontent {
-    height: calc(100vh - 48px);
+  height: calc(100vh - 48px);
-    padding: 20px 30px;
+  padding: 10px 20px;
-    background: #FFFFFF;
-}
-
-.siderHeader {
-    height: 50px;
-    color: #212224;
-    line-height: 50px;
-    font-size: 20px;
-    background: #ebf0ff;
-    text-align: center;
 }
 
 .flodContent {
-    height: calc(100vh - 230px);
+  height: calc(100vh - 240px);
-    overflow-y: auto;
+  overflow-y: auto;
+  width: 300px;
+  float: left;
+  margin-right: 20px;
+}
+.siderHeader {
+  font-size: 18px;
+}
+.teeediv {
+  height: calc(100vh - 320px);
+  background: rgb(17, 42, 64);
 }
 
-.main {
+.righttop {
-    width: 100%;
+  width: calc(100vw - 400px);
-    height: 100px;
+  height: calc(100vh - 240px);
-    /* position: absolute; */
+  float: left;
 }
 
 .quarter-div {
-    width: 15%;
+  width:calc(16.6vw - 86px);
-    height: 100px;
+  height: 100px;
-    float: left;
+  float: left;
-    margin-right: 26px;
+  margin-right: 20px;
-    background: #edf2ff;
+  border: 2px solid rgb(11, 72, 98);
-    border: 1px solid #d3e5fd;
+  color: #fff;
-    border-radius: 10px;
+  font-size: 16px;
+  text-align: center;
+  padding: 20px 0;
 }
-
+.quarter-div div {
-/deep/ .ant-layout-sider {
+  text-align: left;
-    background: #f6f8ff !important;
+  line-height: 30px;
-    border: 1px solid #dfe4f3;
+}
-    border-radius: 10px;
+.quarter-div .datanum {
-    height: calc(100vh - 180px);
+  font-size: 26px;
-    min-width: 200px !important;
+}
-    margin-left: 0px;
+.rtable{
-    margin-right: 50px;
+  height: calc(100vh - 495px);
+  margin-top: 15px
 }
 </style>

src/views/system/PermissionList.vue

@@ -21,7 +21,7 @@
         selectedRowKeys.length }}</a>项&nbsp;&nbsp;
         <a style="margin-left: 24px" @click="onClearSelected">清空</a>
       </div>
-      <div style="height:calc(100vh - 128px);overflow:auto;">
+      <div style="height:calc(100vh - 218px);overflow:auto;">
       <a-table
         :columns="columns"
         size="middle"

src/views/task/index.vue

@@ -3,20 +3,59 @@
 
     <!-- 查询区域 -->
     <div class="table-page-search-wrapper">
-        <a-row :gutter="30">
+      <a-form layout="inline">
-          <a-col :md="6" :sm="10" >
+        <a-row :gutter="30" style="margin:-80px 0 20px;">
+          <a-col :md="20" >
             <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            </span>
+          </a-col>
+          <a-col :md="4">
+            <span style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
               <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
             </span>
           </a-col>
         </a-row>
+        <a-row :gutter="24">
+          <a-col :md="6" :sm="8">
+            <a-form-item label="关键词">
+              <a-input placeholder="请输入搜索关键词" v-model="queryParam.databaseName"></a-input>
+            </a-form-item>
+          </a-col>
+          <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>
+          <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <a-col :md="6" :sm="24" >
+                <a-button type="primary"  style="left: 10px" @click="loadData" icon="search">查询</a-button>
+            </a-col>
+          </span>
+
+        </a-row>
+      </a-form>
     </div>
 
     <!-- table区域-begin -->
-    <div style="height:900px;overflow-y:auto;">
+    <div style="height:calc(100vh - 300px);overflow:hidden;padding: 0 20px;">
+      <div class="linese"></div>
       <a-table
         ref="table"
         size="middle"
+        style="height:calc(100vh - 344px);"
         bordered
         rowKey="id"
         :columns="columns"
@@ -35,15 +74,16 @@
           <j-ellipsis :value="text" :length="20" />
         </span>
         <span slot="action" slot-scope="text, record">
-          <a @click="handleEdit(record)">修改</a>
+          <a @click="handleEdit(record)">编辑</a>
-          <a-divider type="vertical" />
+          <a-divider type="vertical"/>
-          <a @click="handleDistribute(record.id)">下发任务</a>
+          <a @click="handleDistribute(record.id)" >下发任务</a>
           <a-divider type="vertical" />
           <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
             <a>删除</a>
           </a-popconfirm>
         </span>
       </a-table>
+      <div class="linese"></div>
     </div>
     <!-- table区域-end -->
 
@@ -194,6 +234,3 @@
     }
   }
 </script>
-<style scoped>
-  @import '~@assets/less/common.less';
-</style>

src/views/task/statistics.vue

@@ -1,7 +1,9 @@
 <template>
-    <div style="margin-top: 10px; margin-left: 10px;">
+    <div style="margin-left: 10px;">
-        <a-row>
+        <a-row :gutter=20>
-            <a-col :md="8" :sm="1">
+            <a-col :md="7">
+                
+                 <div class="linese"></div>
                 <div class="table-page-search-wrapper">
                 <a-form layout="inline">
                     <a-row :gutter="30">
@@ -12,7 +14,7 @@
                         </a-col>
                         <a-col :md="6" :sm="10" >
                             <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-                                <a-button @click="loadData" type="primary" icon="search">查询</a-button>
+                                <a-button @click="handleAdd" type="primary" v-has="'cont:btn'" icon="search">查询</a-button>
                             </span>
                         </a-col>
                     </a-row>
@@ -21,87 +23,82 @@
                 <a-table
                     ref="table"
                     size="middle"
+                    style="height:calc(100vh - 359px);"
                     bordered
                     rowKey="id"
                     :columns="columns"
-                    :dataSource="dataSource"
+                    :dataSource="dataSource">
-                    @change="handleTableChange">
-            <!--        :locale="myLocale"-->
-
-                    <!-- 字符串超长截取省略号显示-->
-                    <span slot="action" slot-scope="text, record">
-                        <a @click="handleEdit(record)">选中</a>
-                    </span>
                 </a-table>
+                
+            <div class="linese"></div>
             </a-col>
-            <a-col :md="16" :sm="2">
+            <a-col :md="17" style="padding-right:20px;">
+                    
+                <div class="linese"></div>
                 <a-row>
-                    <div class="quarter">
+                    <div style="margin-left: 10px;">
-                        <div class="quarter-div">
+
-                            <a-row>
+                        <a-col :span="5" class="quarter-div">
-                                <a-col :span="12" style="text-align: center;">
+                                <a-col :span="8">
-                                    <img style="margin-top: 10px;" :src="guaz" />
+                                    <img src="~@/assets/img/icon-结构化数据条数.png" />
                                 </a-col>
-                                <a-col :span="12">
+                                <a-col :span="16">
-                                    <div style="margin-top: 14px">{{fileNum.totalNumRow}}</div>
+                                    <div class="datanum">9694</div>
                                     <div>结构化数据条数</div>
                                 </a-col>
-                            </a-row>
+                        </a-col>
-                        </div>
+                        <a-col :span="5" class="quarter-div">
-                        <div class="quarter-div">
+                                <a-col :span="8">
-                            <a-row>
+                                    <img src="~@/assets/img/icon非结构化文件大小.png" />
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
                                 </a-col>
-                                <a-col :span="12">
+                                <a-col :span="16">
-                                    <div style="margin-top: 14px">{{fileNum.totalFileSize}}GB</div>
+                                    <div class="datanum">10.92GB</div>
                                     <div>非结构化文件(大小)</div>
                                 </a-col>
-                            </a-row>
+                        </a-col>
-                        </div>
+                        <a-col :span="4" class="quarter-div">
-                        <div class="quarter-div">
+                                <a-col :span="10">
-                            <a-row>
+                                    <img src="~@/assets/img/icon-表数量.png" />
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
                                 </a-col>
-                                <a-col :span="12">
+                                <a-col :span="14">
-                                    <div style="margin-top: 14px">{{fileNum.tableCount}}</div>
+                                    <div class="datanum">22</div>
                                     <div>表数量</div>
                                 </a-col>
-                            </a-row>
+                        </a-col>
-                        </div>
+                        <a-col :span="4" class="quarter-div">
-                        <div class="quarter-div">
+                                <a-col :span="10">
-                            <a-row>
+                                    <img src="~@/assets/img/icon-文件接引数量.png" />
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
                                 </a-col>
-                                <a-col :span="12">
+                                <a-col :span="14">
-                                    <div style="margin-top: 14px">{{ fileNum.fileLinkCount }}</div>
+                                    <div class="datanum">7</div>
                                     <div>文件接引数量</div>
                                 </a-col>
-                            </a-row>
+                        </a-col>
-                        </div>
+                        <a-col :span="4" class="quarter-div">
-                        <div class="quarter-div">
+                                <a-col :span="10">
-                            <a-row>
+                                    <img src="~@/assets/img/icon-文档数量.png" />
-                                <a-col :span="12" style="text-align: center;">
-                                    <img style="margin-top: 10px;" :src="guaz" />
                                 </a-col>
-                                <a-col :span="12">
+                                <a-col :span="14">
-                                    <div style="margin-top: 14px">{{ fileNum.docFileCount }}</div>
+                                    <div class="datanum">5</div>
                                     <div>文档数量</div>
                                 </a-col>
-                            </a-row>
+                        </a-col>
-                        </div>
                     </div>
                 </a-row>
-                <a-row>
+                    
-                    <a-col :md="12" :sm="2">
+                <div class="linese"></div>
-                        <div id="cleaningVariance" class="cleaningVariance" ref="cleaningVariance"></div>
+                <div class="linese"></div>
+                <a-row :gutter="20">
+                    <a-col :md="12" :sm="2" style="height:calc(100vh - 420px);">
+                        <div class="echartsTitle"><div class="ecicon"></div>数据清洗差异统计</div>
+                        <div id="cleaningVariance" ref="cleaningVariance" style="width: 100%; height: calc(100% - 36px);background:rgb(8,34,52);"></div>
                     </a-col>
-                    <a-col :md="12" :sm="2">
+                    <a-col :md="12" :sm="2" style="height:calc(100vh - 420px);padding-right:20px;">
-                        <div id="totalNumberCatalogues" class="totalNumberCatalogues" ref="totalNumberCatalogues"></div>
+                        <div class="echartsTitle"><div class="ecicon"></div>数据类型存储占比统计</div>
+                        <div id="totalNumberCatalogues" ref="totalNumberCatalogues"  style="width: 100%; height: calc(100% - 36px);background:rgb(8,34,52);"></div>
                     </a-col>
                 </a-row>
+                <div class="linese"></div>
             </a-col>
         </a-row>
     </div>
@@ -110,12 +107,14 @@
   <script>
     import { shipModelPageList,
         shipModeldeleteById } from '@/api/ship'
-    import { getDataAnalysis,
+    import { taskCreate,
+        taskUpdateById,
+        taskQueryById,
         taskPageList,
-        getTaskDataTypeAnalysis } from '@/api/task'
+        taskDistributeTask,
+        taskDeleteById } from '@/api/task'
    import { getAction } from '@/api/manage'
    import JEllipsis from "@/components/jeecg/JEllipsis";
-   import guaz from '@assets/guaz.png'
    export default {
       name: "statistics",
       components: {
@@ -124,12 +123,10 @@
       data () {
         return {
           description: '任务统计',
-          dataSource: [],
+          dataSources: [],
-          guaz,
           queryParam: {
             pageNum :1,
-            pageSize:20,
+            pageSize:20
-            name:""
           },
           columns: [
             {
@@ -159,16 +156,7 @@
                 width:180,
                 scopedSlots: { customRender: 'action' },
             }
-          ],
+          ]
-          fileNum:{
-            totalNumRow:0,
-            tableCount:0,
-            docFileCount:0,
-            totalFileSize:0,
-            fileLinkCount:0
-          },
-          cleaningVariancesource:[],
-          totalNumberCataloguesData:[]
         }
       },
       mounted() { 
@@ -184,78 +172,85 @@
   
       },
       methods: {
-        //筛选需要重写handleTableChange
+        dataAdd(){
-        handleTableChange(pagination, filters, sorter) {
-            //分页、排序、筛选变化时触发
-            //TODO 筛选
-            if (Object.keys(sorter).length > 0) {
-            this.isorter.column = sorter.field;
-            this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
-            }
-            this.ipagination = pagination;
-            this.loadData();
         },
-        handleEdit(value){
+        getselect(){
-            this.cleaningVariancesource =[];
+
-            getDataAnalysis({taskId:value.id,startDate:value.startTime,endDate:value.endTime}).then((res) => {
-                if (res.success) {
-                   res.result.schemaNames.forEach(row => {
-                    this.cleaningVariancesource.push([row, parseInt(res.result.numRowMap[row]) ])
-                   })
-                   this.fileNum.totalNumRow = res.result.totalNumRow
-                   this.fileNum.tableCount = res.result.tableCount
-                   this.fileNum.docFileCount = res.result.docFileCount
-                   this.fileNum.totalFileSize = res.result.totalFileSize
-                   this.fileNum.fileLinkCount = res.result.fileLinkCount
-                   this.getcleaningVariance();
-                } else {
-                    this.$message.warning(res.message);
-                }
-            });
-            this.totalNumberCataloguesData =[]
-            getTaskDataTypeAnalysis({taskId:value.id,startDate:value.startTime,endDate:value.endTime}).then((res) => {
-                if (res.success) {
-                   res.result.typeName.forEach(row => {
-                    this.totalNumberCataloguesData.push({ value: parseFloat(res.result.numRowMap[row]), name: row })
-                   })
-                   this.gettotalNumberCatalogues();
-                } else {
-                    this.$message.warning(res.message);
-                }
-            });
         },
         loadData() {
             taskPageList(this.queryParam).then((res) => {
                 if (res.success) {
                     this.dataSource = res.result.rows||res.result;
-                    this.handleEdit(res.result.rows[0]);
+                    if(res.result.total)
+                    {
+                    this.ipagination.total = res.result.total;
+                    }
                 } else {
                     this.$message.warning(res.message);
                 }
             });
         },
         getTables(){
+            this.getcleaningVariance();
             this.gettotalNumberCatalogues();
         },
         getcleaningVariance(){
           var myChart = this.$echarts.init(this.$refs.cleaningVariance);
           var option = {
-                title: {
-                    text: '数据清洗差异统计'
-                },
                 legend: {},
                 tooltip: {},
-                dataset: {
+                grid:{
-                    source: this.cleaningVariancesource
+                    left:'40px',
+                    right:'20px',
+                    top:'20px',
+                    bottom:'20px'
+                },
+                dataset: {
+                    source: [
+                        ['product', '', ],
+                        ['平台', 43.3],
+                        ['编队', 83.1],
+                        ['航空兵', 86.4],
+                        ['陆战队', 72.4],
+                        ['作战', 72.4],
+                        ['反潜', 72.4],
+                        ['舰炮', 72.4]
+                    ]
+                },
+                xAxis: { 
+                    type: 'category', 
+                    axisLabel:{
+                        color: '#fff'
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                },
+                yAxis: {
+                    axisLabel:{
+                        color: '#fff'
+                    },
+                    splitLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
+                    axisLine:{
+                        lineStyle:{
+                            color: 'rgb(10,45,67)'
+                        }
+                    },
                 },
-                xAxis: { type: 'category',
-                nameTextStyle: {
-                    align: "center"
-                } },
-                yAxis: {},
                 // Declare several bar series, each will be mapped
                 // to a column of dataset.source by default.
-                series: [{ type: 'bar' }],
+                series: [{ type: 'bar',barMaxWidth: 20, }],
                 color:['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
             };
            myChart.setOption(option);
@@ -263,23 +258,23 @@
         gettotalNumberCatalogues(){
           var myChart = this.$echarts.init(this.$refs.totalNumberCatalogues);
           var option = {
-            title: {
-                text: '数据类型存储占比统计',
-                left: 'left'
-            },
             tooltip: {
                 trigger: 'item'
             },
-            legend: {
-                bottom: 10,
-                left: 'center',
-            },
             series: [
                 {
                 name: '占比',
                 type: 'pie',
-                radius: '50%',
+                radius: '80%',
-                data: this.totalNumberCataloguesData,
+                data: [
+                    { value: 1048, name: '平台' },
+                    { value: 735, name: '编队' },
+                    { value: 580, name: '航空兵' },
+                    { value: 484, name: '陆战队' },
+                    { value: 300, name: '作战' },
+                    { value: 735, name: '反潜' },
+                    { value: 580, name: '舰炮' }
+                ],
                 emphasis: {
                     itemStyle: {
                     shadowBlur: 10,
@@ -297,33 +292,21 @@
     }
   </script>
   <style scoped>
-    @import '~@assets/less/common.less';
-
     .quarter-div {
-        width: 18%;
         height: 100px;
         float: left;
-        margin-right: 6px;
+        margin-right: 16px;
-        background: #edf2ff;
+        border: 2px solid rgb(11,72,98);
-        border: 1px solid #d3e5fd;
+        color: #fff;
-        border-radius: 10px;
+        font-size: 16px;
-    }
+        text-align: center;
-    /deep/ .ant-layout-sider {
+        padding: 20px 0;
-        background: #f6f8ff !important;
-        border: 1px solid #dfe4f3;
-        border-radius: 10px;
-        height: calc(100vh - 180px);
-        min-width: 200px !important;
-        margin-left: 0px;
-        margin-right: 50px;
-    }
-    .cleaningVariance {
-        width: 620px; height: 450px; float: left; padding: 30px 10px 10px 20px;
-    }
-    .totalNumberCatalogues {
-        width: 620px; height: 450px; float: right; padding: 30px 10px 10px 20px;
-    }
-    .quarter {
-        margin-left: 10px; margin-bottom: 20px;padding: 30px 10px 10px 20px;
     }
+     .quarter-div div{
+        text-align: left;
+        line-height: 30px;
+     }
+     .quarter-div .datanum{
+        font-size: 26px;
+     }
   </style>