封装车次窗鼠标事件以及车次窗操作

src/jmap/shape/Section/EMouse.js

@@ -99,8 +99,8 @@ class EMouse extends Group {
 			this.sectionTextBorder && this.sectionTextBorder.show();
 			this.lineBorder && this.lineBorder.show();
 			const instance = this.getInstanceByCode(this.device.model.trainWindowCode);
-			if (instance && instance.mouseEnter) {
-				instance.mouseEnter(e);
+			if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) {
+				instance.mouseEvent.mouseEnter(e);
 			}
 		}
 	}
@@ -118,8 +118,8 @@ class EMouse extends Group {
 				this.sectionTextBorder && this.sectionTextBorder.hide();
 				this.lineBorder && this.lineBorder.hide();
 				const instance = this.getInstanceByCode(this.device.model.trainWindowCode);
-				if (instance && instance.mouseLeave) {
-					instance.mouseLeave(e);
+				if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) {
+					instance.mouseEvent.mouseLeave(e);
 				}
 			}
 		}

src/jmap/shape/Switch/EMouse.js

@@ -83,8 +83,8 @@ class EMouse extends Group {
 			const section = store.getters['map/getDeviceByCode'](this.device.model.sectionACode) || {};
 			const parentSection = store.getters['map/getDeviceByCode'](section.parentCode) || {};
 			const instance = this.getInstanceByCode(parentSection.trainWindowCode);
-			if (instance && instance.mouseLeave) {
-				instance.mouseLeave(e);
+			if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) {
+				instance.mouseEvent.mouseLeave(e);
 			}
 		}
 	}
@@ -101,8 +101,8 @@ class EMouse extends Group {
 		const section = store.getters['map/getDeviceByCode'](this.device.model.sectionACode) || {};
 		const parentSection = store.getters['map/getDeviceByCode'](section.parentCode) || {};
 		const instance = this.getInstanceByCode(parentSection.trainWindowCode);
-		if (instance && instance.mouseEnter) {
-			instance.mouseEnter(e);
+		if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) {
+			instance.mouseEvent.mouseEnter(e);
 		}
 	}
 

src/jmap/shape/TrainWindow/EMouse.js

@@ -0,0 +1,37 @@
+export default class EMouse {
+	constructor(device) {
+		this.device = device;
+	}
+
+	mouseover(e) {
+		if (this.device.prdType) {
+			this.device.setVisible(true);
+			const instance = this.device.getInstanceByCode(this.device.model.sectionCode);
+			if (instance && instance.mouseEvent && instance.mouseEvent.mouseover) {
+				instance.mouseEvent.mouseEnter(e);
+			}
+		}
+	}
+
+	mouseout(e) {
+		if (this.device.prdType) {
+			this.device.setVisible(false || this.device.model.trainWindowShow);
+			const instance = this.device.getInstanceByCode(this.device.model.sectionCode);
+			if (instance && instance.mouseEvent && instance.mouseEvent.mouseout) {
+				instance.mouseEvent.mouseLeave(e);
+			}
+		}
+	}
+
+	mouseEnter(e) {
+		if (this.device.prdType) {
+			this.device.setVisible(true);
+		}
+	}
+
+	mouseLeave(e) {
+		if (this.device.prdType ) {
+			this.device.setVisible(false);
+		}
+	}
+}

src/jmap/shape/TrainWindow/index.js

@@ -1,6 +1,7 @@
 /* 车次窗*/
 import Polygon from 'zrender/src/graphic/shape/Polygon';
 import Group from 'zrender/src/container/Group';
+import EMouse from './EMouse';
 import store from '@/store';
 
 class TrainWindow extends Group {
@@ -14,6 +15,7 @@ class TrainWindow extends Group {
 		this.z = 9;
 		this.prdType = store.state.training.prdType;
 		this.create(model);
+		this.createMouseEvent();
 		this.setState(model);
 	}
 	create(model) {
@@ -22,6 +24,12 @@ class TrainWindow extends Group {
 		}
 	}
 
+	createMouseEvent() {
+		this.mouseEvent = new EMouse(this);
+		this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
+		this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
+	}
+
 	/** 创建车次窗*/
 	createTrainWindow() {
 		const model = this.model;
@@ -44,9 +52,7 @@ class TrainWindow extends Group {
 				lineWidth: this.style.TrainWindow.lineWidth,
 				stroke: this.style.TrainWindow.lineColor,
 				fill: this.style.transparentColor
-			},
-			onmouseover: (e) => { this.mouseover(e); },
-			onmouseout: (e) => { this.mouseout(e); }
+			}
 		});
 		this.add(this.trainRect);
 	}
@@ -72,38 +78,6 @@ class TrainWindow extends Group {
 	getInstanceByCode(code) {
 		return (store.getters['map/getDeviceByCode'](code) || {}).instance;
 	}
-
-	mouseout(e) {
-		if (this.prdType) {
-			this.setVisible(false);
-			const instance = this.getInstanceByCode(this.model.sectionCode);
-			if (instance && instance.mouseEvent && instance.mouseEvent.mouseout) {
-				instance.mouseEvent.mouseLeave(e);
-			}
-		}
-	}
-
-	mouseover(e) {
-		if (this.prdType) {
-			this.setVisible(true);
-			const instance = this.getInstanceByCode(this.model.sectionCode);
-			if (instance && instance.mouseEvent && instance.mouseEvent.mouseover) {
-				instance.mouseEvent.mouseEnter(e);
-			}
-		}
-	}
-
-	mouseEnter(e) {
-		if (this.prdType) {
-			this.setVisible(true);
-		}
-	}
-
-	mouseLeave(e) {
-		if (this.prdType ) {
-			this.setVisible(false);
-		}
-	}
 }
 
 export default TrainWindow;

src/views/components/filterCity/index.vue

@@ -175,7 +175,6 @@ export default {
 			}
 		},
 		filterSelectChange(filterSelect) {
-			this.$emit('changeFilter', filterSelect);
 			if (this.isCascader) {
 				// 设置二级联动组件
 				localStore.set('cityCode', filterSelect[0]);

src/views/demonstration/deomonList/index.vue

@@ -71,8 +71,6 @@ export default {
 			return true;
 		}
 	},
-	watch: {
-	},
 	methods: {
 		filterNode(value, data) {
 			if (!value) return true;
@@ -99,9 +97,6 @@ export default {
 		doClose() {
 			this.loading = false;
 			this.dialogShow = false;
-		},
-		handleWatch() {
-
 		},
 		async handleJoin() {
 			if (this.group) {

src/views/demonstration/list/demonList.vue

@@ -2,9 +2,8 @@
   <el-card v-loading="loading" class="map-list-main">
     <div slot="header" class="clearfix">
       <span>{{ $t('global.mapList') }}</span>
-      <!-- <div v-if="role" class="back-home" @click="backHome">返回首页</div> -->
     </div>
-    <filter-city ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" @changeFilter="clearMapSelect" />
+    <filter-city ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" />
     <el-input v-model="filterText" :placeholder="this.$t('global.filteringKeywords')" clearable />
     <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: (height-125) +'px' }">
       <el-tree
@@ -31,8 +30,8 @@
 <script>
 import { getPublishMapTree } from '@/api/management/mapprd';
 import { UrlConfig } from '@/router/index';
-import FilterCity from '@/views/components/filterCity';
 import { getSessionStorage, setSessionStorage, removeSessionStorage } from '@/utils/auth';
+import FilterCity from '@/views/components/filterCity';
 
 export default {
 	name: 'ExamDetailList',
@@ -77,12 +76,9 @@ export default {
 		}
 	},
 	beforeDestroy () {
-		this.clearMapSelect();
+		removeSessionStorage('demonList');
 	},
 	methods: {
-		// backHome() {
-		// 	this.$router.push({ path: `/` });
-		// },
 		filterNode(value, data) {
 			if (!value) return true;
 			return data.name.indexOf(value) !== -1;
@@ -117,6 +113,7 @@ export default {
 				}
 				this.$nextTick(() => {
 					const mapId = getSessionStorage('demonList') || null;
+					console.log(mapId);
 					this.$refs.tree.setCurrentKey(mapId);
 					this.loading = false;
 				});
@@ -124,9 +121,6 @@ export default {
 				this.loading = false;
 				this.$messageBox(this.$t('error.refreshFailed'));
 			}
-		},
-		clearMapSelect() {
-			removeSessionStorage('demonList');
 		}
 	}
 };

src/views/planMonitor/planmanage/planList.vue

@@ -31,6 +31,7 @@
 import FilterCity from '@/views/components/filterCity';
 import { listPublishMap } from '@/api/jmap/map';
 import { queryPermissionScreen } from '@/api/management/author';
+import { getSessionStorage, setSessionStorage, removeSessionStorage } from '@/utils/auth';
 import { UrlConfig } from '@/router/index';
 
 export default {
@@ -72,6 +73,9 @@ export default {
 	created() {
 		this.getScreenLists();
 	},
+	beforeDestroy () {
+		removeSessionStorage('planMonitorList');
+	},
 	methods: {
 		async getScreenLists() {
 			const list = await queryPermissionScreen();
@@ -88,6 +92,7 @@ export default {
 			}
 		},
 		clickEvent(obj) {
+			setSessionStorage('planMonitorList', obj.id);
 			this.$router.push({ path: `${UrlConfig.plan.detail}/${obj.id}` });
 		},
 		refresh(filterSelect) {
@@ -114,7 +119,7 @@ export default {
 					this.$router.push({ path: `${UrlConfig.plan.prefix}/home` });
 				} else {
 					this.$nextTick(() => {
-						const mapId = (this.treeList[0] || { id: 0 }).id;
+						const mapId = getSessionStorage('planMonitorList') || (this.treeList[0] || { id: 0 }).id;
 						this.$router.push({ path: `${UrlConfig.plan.detail}/${mapId}` });
 						this.$refs.tree.setCurrentKey(mapId); // value 绑定的node-key
 					});

src/views/screenMonitor/list/demonList.vue

@@ -1,18 +1,27 @@
 <template>
-    <el-card class="map-list-main" v-loading="loading">
+  <el-card v-loading="loading" class="map-list-main">
     <div slot="header" class="clearfix">
       <span>{{ $t('global.mapList') }}</span>
     </div>
-        <filter-city ref="filerCity" @filterSelectChange="refresh" filterEmpty :queryFunction="queryFunction">
-        </filter-city>
-        <el-input :placeholder="this.$t('global.filteringKeywords')" v-model="filterText" clearable> </el-input>
-        <el-scrollbar wrapClass="scrollbar-wrapper" :style="{ height: (height-125) +'px' }">
-            <el-tree ref="tree" :data="treeList" node-key="id" highlight-current
-                :default-expanded-keys="defaultShowKeys" :props="defaultProps" @node-click="clickEvent"
-                @node-contextmenu="showContextMenu" :span=22>
-                <span slot-scope="{ node, data }">
-                    <span class="el-icon-tickets"
-                        :style="{color: data.valid ? 'green':''}">&nbsp;{{ node.label }}</span>
+    <filter-city ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" />
+    <el-input v-model="filterText" :placeholder="this.$t('global.filteringKeywords')" clearable />
+    <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: (height-125) +'px' }">
+      <el-tree
+        ref="tree"
+        :data="treeList"
+        node-key="id"
+        highlight-current
+        :default-expanded-keys="defaultShowKeys"
+        :props="defaultProps"
+        :span="22"
+        @node-click="clickEvent"
+        @node-contextmenu="showContextMenu"
+      >
+        <span slot-scope="{ node:nd, data }">
+          <span
+            class="el-icon-tickets"
+            :style="{color: data.valid ? 'green':''}"
+          >&nbsp;{{ nd.label }}</span>
         </span>
       </el-tree>
     </el-scrollbar>
@@ -22,18 +31,21 @@
 import FilterCity from '@/views/components/filterCity';
 import { listPublishMap } from '@/api/jmap/map';
 import { queryPermissionScreen } from '@/api/management/author';
+import { getSessionStorage, setSessionStorage, removeSessionStorage } from '@/utils/auth';
+
 import { UrlConfig } from '@/router/index';
 
 export default {
 	name: 'ExamDetailList',
-        props: {
-            height: {
-                type: Number
-            }
-        },
 	components: {
 		FilterCity
 	},
+	props: {
+		height: {
+			type: Number,
+			required: true
+		}
+	},
 	data() {
 		return {
 			loading: true,
@@ -49,22 +61,25 @@
 			},
 			node: {
 			},
-                screenList: [],
-            }
+			screenList: []
+		};
 	},
 	watch: {
 		filterText(val) {
 			this.treeList = this.treeData.filter((res) => {
-                    return res.name.includes(val)
-                })
+				return res.name.includes(val);
+			});
 		}
 	},
 	created() {
 		this.getScreenLists();
 	},
+	beforeDestroy () {
+		removeSessionStorage('screenMonitorList');
+	},
 	methods: {
 		async getScreenLists() {
-                let list = await queryPermissionScreen();
+			const list = await queryPermissionScreen();
 			this.screenList = list.data;
 		},
 		filterNode(value, data) {
@@ -78,6 +93,7 @@
 			}
 		},
 		clickEvent(obj) {
+			setSessionStorage('screenMonitorList', obj.id);
 			this.$router.push({ path: `${UrlConfig.dp.detail}/${obj.id}` });
 		},
 		refresh(filterSelect) {
@@ -92,33 +108,34 @@
 						}
 						this.treeData.push(ele);
 					}
-                    })
+				});
 
-                    this.treeList = this.filterText ?
-                        this.treeData.filter((res) => {
-                            return res.name.includes(this.filterText)
+				this.treeList = this.filterText
+					? this.treeData.filter((res) => {
+						return res.name.includes(this.filterText);
 					})
-                        :
-                        this.treeData;
+					: this.treeData;
 
 				if (this.treeList.length == 0) {
 					this.$router.push({ path: `${UrlConfig.dp.prefix}/home` });
 				} else {
 					this.$nextTick(() => {
-                            let mapId = (this.treeList[0] || { id: 0 }).id;
+						const mapId = getSessionStorage('screenMonitorList')|| (this.treeList[0] || { id: 0 }).id;
 						this.$router.push({ path: `${UrlConfig.dp.detail}/${mapId}` });
 						this.$refs.tree.setCurrentKey(mapId); // value 绑定的node-key
 					});
 				}
 
-                    this.$nextTick(() => { this.loading = false; })
-                }).catch(error => {
+				this.$nextTick(() => {
+					this.loading = false;
+				});
+			}).catch(() => {
 				this.loading = false;
 				this.$messageBox(this.$t('error.refreshFailed'));
 			});
 		}
 	}
-    }
+};
 </script>
 <style>
     .el-tree {