wans

src/router/generator-platform-routers.js

@@ -378,6 +378,7 @@ const constantRouterComponents = {
   // 新增路由
   'SparePartUsedSelectTable': () => import('@/views/sqarepartmanage/sparepartused/modules/SparePartUsedSelectTable'), // 备件使用记录
   // 电度和遥测数据
+  'DegreeManage': () => import('@/views/remote/Index.vue'),
   'RemoteMeasure': () => import('@/views/remote/measure/RemoteMeasure'),
   'RemoteMeasureLog': () => import('@/views/remote/measure-log/RemoteMeasureLog'),
   'RemoteDegree': () => import('@/views/remote/degree/RemoteDegree'),

src/views/remote/Index.vue

@@ -0,0 +1,81 @@
+<template>
+  <div>
+    <a-space :size="50">
+      <div class="filter-icon" v-for="(component,i) in components" :key="component.name" :class="current===i?'active':''" @click="handleFilter(i)">
+        <my-icon :type="component.icon"></my-icon>
+        <div>{{ component.name }}</div>
+      </div>
+    </a-space>
+    <keep-alive>
+      <component :is="components[current].component" />
+    </keep-alive>
+  </div>
+</template>
+
+<script>
+import RemoteDegree from './degree/RemoteDegree.vue'
+import RemoteDegreeLog from './degree-log/RemoteDegreeLog.vue'
+import RemoteMeasure from './measure/RemoteMeasure.vue'
+import RemoteMeasureLog from './measure-log/RemoteMeasureLog.vue'
+
+export default {
+  components: {
+    RemoteDegree,
+    RemoteMeasureLog,
+    RemoteMeasure,
+    RemoteDegreeLog
+  },
+  data () {
+    return {
+      current: 0,
+      components: [
+
+        {
+          name: '设备电度对应表',
+          icon: 'icon-shebeiguanli',
+          component: 'RemoteDegree'
+        },
+        {
+          name: '设备电度记录表',
+          icon: 'icon-shebeiguanli',
+          component: 'RemoteDegreeLog'
+        },
+        {
+          name: '设备遥测对应表',
+          icon: 'icon-shebeiguanli',
+          component: 'RemoteMeasure'
+        },
+        {
+          name: '设备遥测记录表',
+          icon: 'icon-shebeiguanli',
+          component: 'RemoteMeasureLog'
+        }
+      ]
+    }
+  },
+  methods: {
+    handleFilter (index) {
+      this.current = index
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.filter-icon{
+  font-size: 18px;
+  text-align: center;
+  color: #666;
+  cursor: pointer;
+  margin-bottom: 10px;
+  &>:first-child{
+  font-size: 30px;
+}
+&:hover{
+  color: #1890ff;
+}
+}
+.active{
+  color:#1890ff;
+}
+</style>

src/views/remote/degree-log/RemoteDegreeLog.vue

@@ -3,22 +3,16 @@
     <div v-show="visible">
       <div class="table-page-search-wrapper" @keyup.enter="handleEnter">
         <a-form layout="inline">
-          <a-row :gutter="48" v-show="advanced">
+          <a-row :gutter="48" >
             <a-col :md="6" :sm="24">
               <a-form-item label="关键字">
                 <a-input v-model="queryParam.keyword" placeholder="请输入名称/类型名称" />
               </a-form-item>
             </a-col>
-          </a-row>
-          <a-row :gutter="48">
-            <a-col :md="24 || 24" :sm="24" style="text-align: right">
+            <a-col :md="6 || 24" :sm="24" >
               <span class="table-page-search-submitButtons">
                 <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
                 <a-button style="margin-left: 8px" @click="resetSearchForm">重置</a-button>
-                <a @click="()=>{ this.advanced = !this.advanced}" style="margin-left: 8px">
-                  {{ advanced ? '收起' : '展开' }}
-                  <a-icon :type="advanced ? 'up' : 'down'" />
-                </a>
               </span>
             </a-col>
           </a-row>
@@ -37,7 +31,7 @@
               icon="download"
               @click="doExport">导出
             </a-button>
-<!--            <a-button
+            <!--            <a-button
               style="margin-left: 8px"
               type="primary"
               icon="download"

src/views/remote/degree/RemoteDegree.vue

@@ -3,22 +3,16 @@
     <div v-show="visible">
       <div class="table-page-search-wrapper" @keyup.enter="handleEnter">
         <a-form layout="inline">
-          <a-row :gutter="48" v-show="advanced">
+          <a-row :gutter="48">
             <a-col :md="6" :sm="24">
               <a-form-item label="关键字">
                 <a-input v-model="queryParam.keyword" placeholder="请输入名称/类型名称"/>
               </a-form-item>
             </a-col>
-          </a-row>
-          <a-row :gutter="48">
-            <a-col :md="24 || 24" :sm="24" style="text-align: right">
+            <a-col :md="6 || 24" :sm="24">
               <span class="table-page-search-submitButtons">
                 <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
                 <a-button style="margin-left: 8px" @click="resetSearchForm">重置</a-button>
-                <a @click="()=>{ this.advanced = !this.advanced}" style="margin-left: 8px">
-                  {{ advanced ? '收起' : '展开' }}
-                  <a-icon :type="advanced ? 'up' : 'down'"/>
-                </a>
               </span>
             </a-col>
           </a-row>

src/views/remote/measure-log/RemoteMeasureLog.vue

@@ -3,22 +3,16 @@
     <div v-show="visible">
       <div class="table-page-search-wrapper" @keyup.enter="handleEnter">
         <a-form layout="inline">
-          <a-row :gutter="48" v-show="advanced">
+          <a-row :gutter="48" >
             <a-col :md="6" :sm="24">
               <a-form-item label="关键字">
                 <a-input v-model="queryParam.keyword" placeholder="请输入名称/类型名称" />
               </a-form-item>
             </a-col>
-          </a-row>
-          <a-row :gutter="48">
-            <a-col :md="24 || 24" :sm="24" style="text-align: right">
+            <a-col :md="6 || 24" :sm="24" >
               <span class="table-page-search-submitButtons">
                 <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
                 <a-button style="margin-left: 8px" @click="resetSearchForm">重置</a-button>
-                <a @click="()=>{ this.advanced = !this.advanced}" style="margin-left: 8px">
-                  {{ advanced ? '收起' : '展开' }}
-                  <a-icon :type="advanced ? 'up' : 'down'" />
-                </a>
               </span>
             </a-col>
           </a-row>

src/views/remote/measure/RemoteMeasure.vue

@@ -3,22 +3,16 @@
     <div v-show="visible">
       <div class="table-page-search-wrapper" @keyup.enter="handleEnter">
         <a-form layout="inline">
-          <a-row :gutter="48" v-show="advanced">
+          <a-row :gutter="48" >
             <a-col :md="6" :sm="24">
               <a-form-item label="关键字">
                 <a-input v-model="queryParam.keyword" placeholder="请输入名称/类型名称" />
               </a-form-item>
             </a-col>
-          </a-row>
-          <a-row :gutter="48">
-            <a-col :md="24 || 24" :sm="24" style="text-align: right">
+            <a-col :md="6 || 24" :sm="24" >
               <span class="table-page-search-submitButtons">
                 <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
                 <a-button style="margin-left: 8px" @click="resetSearchForm">重置</a-button>
-                <a @click="()=>{ this.advanced = !this.advanced}" style="margin-left: 8px">
-                  {{ advanced ? '收起' : '展开' }}
-                  <a-icon :type="advanced ? 'up' : 'down'" />
-                </a>
               </span>
             </a-col>
           </a-row>