wans

src/router/generator-platform-routers.js

@@ -282,7 +282,7 @@ const constantRouterComponents = {
   'MyStart': () => import('@/views/activiti/task/MyStart'), // 我的申请
   'ActivitiUserModel': () => import('@/views/activiti/user-model/ActivitiUserModel'), // 流程审批节点设置
   'DesignForm': () => import('@/views/design/designForm/DesignForm'),
-  // 隐患管理
+  // 隐患 管理
   'HiddenDangerWait': () => import('@/views/hidden/hidden/HiddenDangerWait'), // 隐患任务
   'HiddenDangerHandle': () => import('@/views/hidden/hidden/HiddenDangerHandle'), // 隐患任务
   // 调拨申请
@@ -384,6 +384,7 @@ const constantRouterComponents = {
   'RemoteDegreeLog': () => import('@/views/remote/degree-log/RemoteDegreeLog'),
   // opc
   'RemoteOpc': () => import('@/views/remote/opc/RemoteOpc'), // 模拟+数字量+创建+未创建（全部的）
+  'OpcManage': () => import('@/views/remote/opc/Index.vue'), // 模拟+数字量+创建+未创建（全部的）
   'RemoteOpcNotCreated': () => import('@/views/remote/opc/RemoteOpcNotCreated'), // 服务端未创建对应的点位
   'RemoteOpcLog': () => import('@/views/remote/opc-log/RemoteOpcLog'), // 记录
   'OpcPosition': () => import('@/views/remote/opc/OpcPosition'), // opc车间

src/views/remote/opc/Index.vue

@@ -0,0 +1,94 @@
+<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 OpcPosition from './OpcPosition.vue'
+import OpcPositionForAh from './OpcPositionForAh.vue'
+import OpcPositionForProducer from './OpcPositionForProducer.vue'
+import OpcPositionNot from './OpcPositionNot.vue'
+import RemoteOpcNotCreated from './RemoteOpcNotCreated.vue'
+import RemoteOpc from './RemoteOpc.vue'
+
+export default {
+  components: {
+    OpcPosition,
+    RemoteOpc,
+    RemoteOpcNotCreated,
+    OpcPositionNot,
+    OpcPositionForProducer,
+    OpcPositionForAh
+  },
+  data () {
+    return {
+      current: 0,
+      components: [
+        {
+          name: 'OPC对应表',
+          icon: 'icon-shebeiguanli',
+          component: 'RemoteOpc'
+        },
+        {
+          name: 'OPC对应表未配置',
+          icon: 'icon-shebeiguanli',
+          component: 'RemoteOpcNotCreated'
+        },
+        {
+          name: 'OPC车间',
+          icon: 'icon-shebeiguanli',
+          component: 'OpcPositionNot'
+        },
+        {
+          name: 'OPC车间台账',
+          icon: 'icon-shebeiguanli',
+          component: 'OpcPosition'
+        },
+        {
+          name: 'OPC车间生产',
+          icon: 'icon-shebeiguanli',
+          component: 'OpcPositionForProducer'
+        },
+        {
+          name: 'OPC安环',
+          icon: 'icon-shebeiguanli',
+          component: 'OpcPositionForAh'
+        }
+      ]
+    }
+  },
+  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/opc/OpcPosition.vue

@@ -2,7 +2,7 @@
   <a-card :bordered="false" class="card" :title="modalTitle">
     <h1 style="margin:20px auto; text-align: center"> 生产过程工艺流程画面 </h1>
     <a-card v-show="visible">
-      <a-card-grid v-for="position in treeData" v-if="position.type==1" :key="position.key" style="cursor: pointer;width:25%;text-align:center" @click="showChild(position)">
+      <a-card-grid v-for="position in treeData" v-show="position.type==1" :key="position.key" style="cursor: pointer;width:25%;text-align:center" @click="showChild(position)">
         {{ position.title }}
       </a-card-grid>
     </a-card>
@@ -10,12 +10,12 @@
     <a-card v-show="visible2">
       <a-row :gutter="48" slot="extra">
         <a-col :md="48" :sm="48">
-        <span class="table-page-search-submitButtons" style="float: right">
-          <a-button style="margin-left: 8px" @click="handleCancel()">返回</a-button>
-        </span>
+          <span class="table-page-search-submitButtons" style="float: right">
+            <a-button style="margin-left: 8px" @click="handleCancel()">返回</a-button>
+          </span>
         </a-col>
       </a-row>
-      <a-card-grid v-for="child in childData" v-if="child.type==2" :key="child.key" style="cursor: pointer;width:25%;text-align:center" @click="showScreen(child)">
+      <a-card-grid v-for="child in childData" v-show="child.type==2" :key="child.key" style="cursor: pointer;width:25%;text-align:center" @click="showScreen(child)">
         {{ child.title }}
       </a-card-grid>
     </a-card>

src/views/remote/opc/OpcPositionForProducer.vue

@@ -2,7 +2,7 @@
   <a-card :bordered="false" class="card" :title="modalTitle">
     <h1 style="margin:20px auto; text-align: center"> 生产过程工艺流程画面 </h1>
     <a-card v-show="visible">
-      <a-card-grid v-for="position in treeData" v-if="position.type==1" :key="position.key" style="cursor: pointer;width:25%;text-align:center" @click="showChild(position)">
+      <a-card-grid v-for="position in treeData" v-show="position.type==1" :key="position.key" style="cursor: pointer;width:25%;text-align:center" @click="showChild(position)">
         {{ position.title }}
       </a-card-grid>
     </a-card>
@@ -15,7 +15,7 @@
           </span>
         </a-col>
       </a-row>
-      <a-card-grid v-for="child in childData" v-if="child.type==2" :key="child.key" style="cursor: pointer;width:25%;text-align:center" @click="showScreen(child)">
+      <a-card-grid v-for="child in childData" v-show="child.type==2" :key="child.key" style="cursor: pointer;width:25%;text-align:center" @click="showScreen(child)">
         {{ child.title }}
       </a-card-grid>
     </a-card>

src/views/remote/opc/RemoteOpc.vue

@@ -3,7 +3,7 @@
     <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="请输入名称/类型名称" />
@@ -33,16 +33,10 @@
                 </a-select>
               </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>
@@ -142,7 +136,7 @@
               v-if="record.type == 4"
               @click="handleAddFetch(record)">设置M点位
             </a>
-<!--            <a
+            <!--            <a
               style="margin-left: 8px"
               @click="doTestAdd(record)">测试写入
             </a>