增加绘图实例此操作界面

src/router/index_Common.js

@@ -964,6 +964,7 @@ export const asyncRouter = [
         children: [
             {
 				path:'design',
+				redirect: '/iscs/design/edit',
                 component: IscsDesign,
                 meta: {
                     i18n: 'router.iscsDraw',
@@ -976,26 +977,6 @@ export const asyncRouter = [
                         hidden: true
                     }
                 ]
-            },
-            {
-                path: 'system',
-                component: IscsSystem,
-                meta: {
-                    i18n: 'router.iscsSystem',
-                    roles: [admin, user]
-                },
-                children: [
-                    {
-                        path: 'config/:mode',
-                        component: IscsConfig,
-                        hidden: true
-                    },
-                    {
-                        path: 'stationConfig/:mode',
-                        component: IscsStationConfig,
-                        hidden: true
-                    }
-                ]
             }
         ]
     },

src/views/iscs/iscsDesign/demonList.vue

@@ -924,7 +924,6 @@ export default {
     .uploadDemo {
         position: relative;
         overflow: hidden;
-        // float: right;
         padding: 9px 15px;
         margin-right: 3px;
         cursor: pointer;

src/views/iscs/iscsDesign/index.vue

@@ -1,22 +1,22 @@
 <template>
   <div class="app-wrapper">
-    <map-create ref="mapCreate" :line-code="lineCode" @refresh="refresh1" />
+	<div class="left-card" :class="{'hide': viewShow}">
-    <div class="examList" :style="{width: widthLeft+'px'}">
+		<div class="btn_right_box" @click="clickLeftBtn"><i :class="viewShow?'el-icon-arrow-right':'el-icon-arrow-left'" /></div>
+		<div class="examList" style="width:100%">
 			<demon-list ref="demonList" @createMap="createMap" />
 		</div>
-    <drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
+	</div>
     <transition>
       <router-view />
     </transition>
     <context-menu />
+	<map-create ref="mapCreate" :line-code="lineCode" @refresh="refresh" />
   </div>
 </template>
 
 <script>
 import demonList from './demonList';
-import drapLeft from '@/views/components/drapLeft/index';
 import { launchFullscreen } from '@/utils/screen';
-import localStore from 'storejs';
 import { getSessionStorage, setSessionStorage } from '@/utils/auth';
 import MapCreate from './mapmanage/create';
 import ContextMenu from './contextMenu';
@@ -25,14 +25,14 @@ export default {
     name: 'DesignPlatform',
     components: {
         demonList,
-        drapLeft,
         MapCreate,
         ContextMenu
     },
     data() {
         return {
-            widthLeft: Number(localStore.get('LeftWidth')) || 450,
+			lineCode: '',
-            lineCode: ''
+			viewShow: false,
+			widthLeft: 450
         };
     },
     computed: {
@@ -41,9 +41,6 @@ export default {
         }
     },
     watch: {
-        widthLeft(val) {
-            this.setMapResize(val);
-        },
         '$store.state.app.windowSizeCount': function() {
             this.resize();
         }
@@ -57,31 +54,26 @@ export default {
             launchFullscreen();
             setSessionStorage('againEnter', true);
         }
-        this.widthLeft = Number(localStore.get('LeftWidth'));
     },
     methods: {
         refresh() {
             this.$refs && this.$refs.demonList && this.$refs.demonList.loadInitData();
         },
-        refresh1() {
-            this.$refs.demonList.loadInitData();
-        },
         createMap() {
             this.$refs.mapCreate.show();
         },
-        drapWidth(width) {
-            this.widthLeft = Number(width);
-        },
         resize() {
-            this.widthLeft = Number(localStore.get('LeftWidth')) || this.widthLeft;
+            const width = this.$store.state.app.width;
-            const width = this.$store.state.app.width - this.widthLeft;
             const height = this.$store.state.app.height - 90;
             this.$store.dispatch('config/resize', { width: width, height: height });
         },
         setMapResize(LeftWidth) {
-            const width = this.$store.state.app.width - LeftWidth;
+            const width = this.$store.state.app.width;
             const height = this.$store.state.app.height - 90;
             this.$store.dispatch('config/resize', { width: width, height: height });
+		},
+		clickLeftBtn() {
+            this.viewShow = !this.viewShow;
 		}
     }
 };
@@ -97,8 +89,40 @@ export default {
         overflow: hidden;
     }
 
+	.left-card{
+		width: 470px;
+		height: 100%;
+		position: absolute;
+		left: 0;
+		transform: translateX(-470px);
+		transition: all 0.5s;
+		background: #fff;
+		z-index: 9;
+		/deep/{
+			.v-modal{
+				opacity: 0;
+			}
+		}
+
+		&.hide{
+			transform: translateX(0);
+		}
+
 		.examList {
 			float: left;
 			height: 100%;
 		}
+
+		.btn_right_box{
+			position: absolute;
+			right: 0;
+			top: 50%;
+			padding: 8px 3px;
+			background: #fff;
+			z-index: 10;
+			transform: translateX(22px);
+			cursor: pointer;
+			border-radius: 0 5px 05px 0;
+		}
+    }
 </style>

src/views/iscs/iscsDraw/index.vue

@@ -4,8 +4,8 @@
       <div class="map-view">
         <iscs-plate ref="iscsPlate" @iscsChange="iscsChange" />
       </div>
-      <div class="map-draft" :class="{'hide': draftShow}">
+      <div class="right-card" :class="{'hide': draftShow}">
-        <div class="btn_left_box" @click="clickRightBtn"><i :class="draftShow?'el-icon-arrow-right':'el-icon-arrow-left'" /></div>
+        <div class="btn_draft_box" @click="clickDraftBtn"><i :class="draftShow?'el-icon-arrow-right':'el-icon-arrow-left'" /></div>
         <iscs-operate v-if="iscsMode==='fas'" ref="iscsOperate" @iscsChange="iscsChange" @handleSave="handleSave" />
         <iscs-bas-operate v-else-if="iscsMode==='bas'" ref="iscsBasOperate" @iscsChange="iscsChange" @handleSave="handleSave" />
         <iscs-psd-operate v-else-if="iscsMode==='psd'" ref="iscsPsdOperate" @iscsChange="iscsChange" @handleSave="handleSave" />
@@ -21,6 +21,10 @@
         <iscs-environment v-else-if="iscsMode=='environment02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" /> <!-- 环境与设备监控系统 -->
         <iscs-psd v-else-if="iscsMode=='psdSystem02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" /> <!-- 屏蔽门系统 -->
       </div>
+	  <div class="right-card" :class="{'hide': tableShow}">
+		<div class="btn_table_box" @click="clickTableBtn"><i :class="tableShow?'el-icon-arrow-right':'el-icon-arrow-left'" /></div>
+			///
+	  </div>
     </div>
   </transition>
 </template>
@@ -34,7 +38,6 @@ import IscsCctvOperate from './iscsCctvOperate/index';
 import IscsAfcOperate from './iscsAfcOperate/index';
 import IscsAcsOperate from './iscsAcsOperate/index';
 import IscsNetOperate from './IscsNetOperate/index';
-
 import IscsAutomatic from './iscsAutomatic/index';
 import IscsCommunication from './iscsCommunication/index';
 import IscsFireAlarm from './iscsFireAlarm/index';
@@ -42,7 +45,6 @@ import IscsPowerMonitoring from './iscsPowerMonitoring/index';
 import IscsSignalSystem from './iscsSignalSystem/index';
 import IscsPsd from './iscsPsd/index';
 import IscsEnvironment from './iscsEnvironment/index';
-
 import { saveIscsElement } from '@/api/iscs';
 
 export default {
@@ -72,7 +74,8 @@ export default {
                 height: this.$store.state.app.height - 60
             },
             widthLeft: Number(localStore.get('LeftWidth')) || 450,
-            draftShow: false
+			draftShow: false,
+			tableShow: false
         };
     },
     computed:{
@@ -97,9 +100,12 @@ export default {
             this.$refs.iscsPlate.show(mode, system, part);
             this.$refs.iscsPlate.drawIscsInit();
         },
-        clickRightBtn() {
+        clickDraftBtn() {
             this.draftShow = !this.draftShow;
 		},
+		clickTableBtn() {
+			this.tableShow = !this.tableShow;
+		},
         handleSave(data) {
             const param = {
                 graphData: data,
@@ -121,7 +127,17 @@ export default {
 <style rel="stylesheet/scss" lang="scss" scoped>
     @import "src/styles/mixin.scss";
 
-    .map-draft{
+    .map-view {
+        float: left;
+        width: 100%;
+    }
+
+	.mapPaint{
+        height: 100%;
+        overflow: hidden;
+    }
+
+	.right-card{
 		width: 470px;
 		height: 100%;
 		position: absolute;
@@ -138,17 +154,8 @@ export default {
 		&.hide{
 			transform: translateX(0);
 		}
-    }
 
-    .map-view {
+		.btn_draft_box{
-        float: left;
-        width: 60%;
-    }
-    .mapPaint{
-        height: 100%;
-        overflow: hidden;
-    }
-	.btn_left_box{
 			position: absolute;
 			left: 0;
 			top: 50%;
@@ -159,4 +166,17 @@ export default {
 			cursor: pointer;
 			border-radius: 5px 0 0 5px;
 		}
+
+		.btn_table_box {
+			position: absolute;
+			left: 0;
+			top: calc(50% +  50px);
+			padding: 8px 3px;
+			background: #fff;
+			z-index: 10;
+			transform: translateX(-22px);
+			cursor: pointer;
+			border-radius: 5px 0 0 5px;
+		}
+    }
 </style>

src/views/iscs/iscsSystem/bottom.vue

@@ -1,26 +0,0 @@
-<template>
-  <div class="bottom-box">
-    111
-  </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            mes: '1111'
-        };
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-.bottom-box{
-    width: 100%;
-    height: 95px;
-    background-color: #ACACAC;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-}
-</style>

src/views/iscs/iscsSystem/index.vue

@@ -14,7 +14,6 @@
         <router-view />
       </div>
     </div>
-    <!-- <bottom /> -->
   </div>
 </template>
 
@@ -23,7 +22,6 @@ import TopNav from './nav.vue';
 import GroupNav from './groupNav.vue';
 import StationNav from './stationNav.vue';
 import MenuBar from './menuBar.vue';
-// import bottom from './bottom.vue';
 
 export default {
     components: {
@@ -31,7 +29,6 @@ export default {
         GroupNav,
         MenuBar,
         StationNav
-        // bottom
     },
     data() {
         return {