diff --git a/src/views/jlmap/index.vue b/src/views/jlmap/index.vue
index e4e8130b8..6be23b2e1 100644
--- a/src/views/jlmap/index.vue
+++ b/src/views/jlmap/index.vue
@@ -1,282 +1,282 @@
 <template>
-    <div class="jlmap-canvas" :style="{ width: width+'px', height: height+28+'px' }">
-        <div :id="canvasId" style="background: #000;"></div>
-        <progress-bar ref="progressBar" ></progress-bar>
-        <zoom-box @setShrink="setShrink" @setMagnify="setMagnify" :scaleRate="dataZoom.scaleRate" v-if="!isScreen"></zoom-box>
-        <div v-if="show" class="zoom-view" :style="{ width: width +'px'}">
-            <el-form :model="dataZoom" label-width="60px" size="mini" inline>
-                <el-form-item label="偏移:">
-                    <el-input v-model="dataZoom.offsetX" :disabled="true"></el-input>
-                </el-form-item>
-                <el-form-item>
-                    <el-input v-model="dataZoom.offsetY" :disabled="true"></el-input>
-                </el-form-item>
-                <el-form-item label="缩放:" style="float: right">
-                    <el-input v-model="dataZoom.scaleRate" :disabled="true"></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
+  <div class="jlmap-canvas" :style="{ width: width+'px', height: height+28+'px' }">
+    <div :id="canvasId" style="background: #000;" />
+    <progress-bar ref="progressBar" />
+    <zoom-box :scale-rate="dataZoom.scaleRate" v-if="!isScreen" @setShrink="setShrink" @setMagnify="setMagnify" />
+    <div v-if="show" class="zoom-view" :style="{ width: width +'px'}">
+      <el-form :model="dataZoom" label-width="60px" size="mini" inline>
+        <el-form-item label="偏移:">
+          <el-input v-model="dataZoom.offsetX" :disabled="true" />
+        </el-form-item>
+        <el-form-item>
+          <el-input v-model="dataZoom.offsetY" :disabled="true" />
+        </el-form-item>
+        <el-form-item label="缩放:" style="float: right">
+          <el-input v-model="dataZoom.scaleRate" :disabled="true" />
+        </el-form-item>
+      </el-form>
     </div>
+  </div>
 </template>
 
 <script>
-    import Vue from 'vue';
-    import localStore from 'storejs';
-    import Jlmap from '@/jmap/map';
-    import ZoomBox from './zoom/zoom';
-    import ProgressBar from '@/views/components/progressBar/index';
-    import { mapGetters } from 'vuex';
-    import { Loading } from 'element-ui';
+import Vue from 'vue';
+import localStore from 'storejs';
+import Jlmap from '@/jmap/map';
+import ZoomBox from './zoom/zoom';
+import ProgressBar from '@/views/components/progressBar/index';
+// import { mapGetters } from 'vuex';
+// import { Loading } from 'element-ui';
 
-    export default {
-        name: 'JlmapVisual',
-        components: {
-            ZoomBox,
-            ProgressBar
-        },
-        data() {
-            return {
-                width: this.$store.state.config.width,
-                height: this.$store.state.config.height,
-                loading: true,
-                dataZoom: {
-                    offsetX: '0',
-                    offsetY: '0',
-                    scaleRate: '1'
-                },
-                sectionActive: false,
-                operate: null,
-            }
-        },
-        computed: {
-            // ...mapGetters('training', [
-            //     'mode',
-            //     'offsetStationCode'
-            // ]),
-            canvasId() {
-                const canvasId = ['map', (Math.random().toFixed(5)) * 100000].join('_');
-                this.$store.dispatch('config/setCurrentCancasId', { id: canvasId });
-                return canvasId;
-            },
-            show() {
-                // if (this.mode === TrainingMode.EDIT || this.mode === TrainingMode.MAP_EDIT) {
-                //     return true;
-                // }
-                // return false;
-                return true;
-            },
-            isScreen() {
-                return this.$route.params.mode === 'dp'
-            }
-        },
-        watch: {
-            '$store.state.map.map': function (val, old) {
-                if (val && val.skinStyle) {
-                    try {
-                        this.setMap(val);
-                    } catch (error) {
-                        console.log(error);
-                    }
-                }
-            },
-            '$store.state.training.rezoomCount': function (val, old) {
-                this.setShowCenter(this.$store.state.training.offsetStationCode);
-            },
-            '$store.state.config.canvasSizeCount': function (val) {
-                this.resetSize();
-            },
-            '$store.state.menuOperation.magnifyCount': function () {
-                this.setMagnify();
-            },
-            '$store.state.menuOperation.shrinkCount': function () {
-                this.setShrink();
-            },
-            $route() {
-                this.mapViewLoaded(true);
-            }
-        },
-        created() {
-            // eventBus.$on('viewLoading', (loading) => {
-            //     this.mapViewLoaded(loading)
-            // });
-            // eventBus.$on('viewProgressAt', (percentage) => {
-            //     this.mapViewProgressAt(percentage);
-            // });
-            // eventBus.$on('refresh', () => {
-            //     this.refresh(this.$store.state.map.map);
-            // })
-        },
-        mounted() {
-            this.initLoadPage();
-        },
-        beforeDestroy() {
-            // eventBus.$off('refresh');
-            // eventBus.$off('viewLoading');
-            // eventBus.$off('viewProgressAt');
-            if (this.$jlmap) {
-                this.$jlmap.dispose();
-            }
-        },
-        methods: {
-            // 初始化jlmap
-            initLoadPage() {
-                const dom = document.getElementById(this.canvasId).oncontextmenu = function (e) {
-                    return false;
-                };
+export default {
+	name: 'JlmapVisual',
+	components: {
+		ZoomBox,
+		ProgressBar
+	},
+	data() {
+		return {
+			width: this.$store.state.config.width,
+			height: this.$store.state.config.height,
+			loading: true,
+			dataZoom: {
+				offsetX: '0',
+				offsetY: '0',
+				scaleRate: '1'
+			},
+			sectionActive: false,
+			operate: null
+		};
+	},
+	computed: {
+		// ...mapGetters('training', [
+		//     'mode',
+		//     'offsetStationCode'
+		// ]),
+		canvasId() {
+			const canvasId = ['map', (Math.random().toFixed(5)) * 100000].join('_');
+			this.$store.dispatch('config/setCurrentCancasId', { id: canvasId });
+			return canvasId;
+		},
+		show() {
+			// if (this.mode === TrainingMode.EDIT || this.mode === TrainingMode.MAP_EDIT) {
+			//     return true;
+			// }
+			// return false;
+			return true;
+		},
+		isScreen() {
+			return this.$route.params.mode === 'dp';
+		}
+	},
+	watch: {
+		'$store.state.map.map': function (val, old) {
+			if (val && val.skinStyle) {
+				try {
+					this.setMap(val);
+				} catch (error) {
+					console.log(error);
+				}
+			}
+		},
+		'$store.state.training.rezoomCount': function (val, old) {
+			this.setShowCenter(this.$store.state.training.offsetStationCode);
+		},
+		'$store.state.config.canvasSizeCount': function (val) {
+			this.resetSize();
+		},
+		'$store.state.menuOperation.magnifyCount': function () {
+			this.setMagnify();
+		},
+		'$store.state.menuOperation.shrinkCount': function () {
+			this.setShrink();
+		},
+		$route() {
+			this.mapViewLoaded(true);
+		}
+	},
+	created() {
+		// eventBus.$on('viewLoading', (loading) => {
+		//     this.mapViewLoaded(loading)
+		// });
+		// eventBus.$on('viewProgressAt', (percentage) => {
+		//     this.mapViewProgressAt(percentage);
+		// });
+		// eventBus.$on('refresh', () => {
+		//     this.refresh(this.$store.state.map.map);
+		// })
+	},
+	mounted() {
+		this.initLoadPage();
+	},
+	beforeDestroy() {
+		// eventBus.$off('refresh');
+		// eventBus.$off('viewLoading');
+		// eventBus.$off('viewProgressAt');
+		if (this.$jlmap) {
+			this.$jlmap.dispose();
+		}
+	},
+	methods: {
+		// 初始化jlmap
+		initLoadPage() {
+			document.getElementById(this.canvasId).oncontextmenu = function (e) {
+				return false;
+			};
 
-                Vue.prototype.$jlmap = new Jlmap({
-                    dom: document.getElementById(this.canvasId),
-                    config: {
-                        renderer: 'canvas',
-                        width: this.width,
-                        height: this.height
-                    },
-                    options: {
-                        scaleRate: 1,
-                        offsetX: 0,
-                        offsetY: 0
-                    },
-                    methods: {
-                        dataLoaded() { 
-                            console.log('dataLoaded'); 
-                        },
-                        viewLoaded() { 
-                            console.log('viewLoaded'); 
-                            this.mapViewLoaded(true);
-                        },
-                        stateLoaded() {
-                        },
-                        viewUpdate() { 
-                            console.log('viewUpdate'); 
-                        },                        
-                        stateUpdate() {
-                            console.log('stateUpdate');
-                        },
-                        optionsUpdate() { console.log('optionsUpdate'); }
-                    }
-                });
+			Vue.prototype.$jlmap = new Jlmap({
+				dom: document.getElementById(this.canvasId),
+				config: {
+					renderer: 'canvas',
+					width: this.width,
+					height: this.height
+				},
+				options: {
+					scaleRate: 1,
+					offsetX: 0,
+					offsetY: 0
+				},
+				methods: {
+					dataLoaded() {
+						console.log('dataLoaded');
+					},
+					viewLoaded() {
+						console.log('viewLoaded');
+						this.mapViewLoaded(true);
+					},
+					stateLoaded() {
+					},
+					viewUpdate() {
+						console.log('viewUpdate');
+					},
+					stateUpdate() {
+						console.log('stateUpdate');
+					},
+					optionsUpdate() { console.log('optionsUpdate'); }
+				}
+			});
 
-                this.$jlmap.on('datazoom', this.onDataZoom, this);
-                this.$jlmap.on('selected', this.onSelected, this);
-                this.$jlmap.on('contextmenu', this.onContextMenu, this);
-        
-                window.document.oncontextmenu = function () {
-                    return false;
-                }
-            },
-            // 重置jlmap宽高
-            resetSize() {
-                this.$nextTick(() => {
-                    this.width = this.$store.state.config.width;
-                    this.height = this.$store.state.config.height;
+			this.$jlmap.on('datazoom', this.onDataZoom, this);
+			this.$jlmap.on('selected', this.onSelected, this);
+			this.$jlmap.on('contextmenu', this.onContextMenu, this);
 
-                    if (this.$jlmap) {
-                        this.$jlmap.resizeZr({ width: this.width, height: this.height });
-                    }
+			window.document.oncontextmenu = function () {
+				return false;
+			};
+		},
+		// 重置jlmap宽高
+		resetSize() {
+			this.$nextTick(() => {
+				this.width = this.$store.state.config.width;
+				this.height = this.$store.state.config.height;
 
-                    this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
+				if (this.$jlmap) {
+					this.$jlmap.resize({ width: this.width, height: this.height });
+				}
 
-                    setTimeout(() => {
-                        this.$store.dispatch('config/resetCanvasOffset');
-                        this.$store.dispatch('training/emitTipFresh');
-                    }, 100);
-                });
-            },
-            // 设置显示图层
-            setShowLevel(level) {
-                if (this.$jlmap) {
-                    console.log('设置显示图层');
-                    // this.$jlmap.setShowLevel(level);
-                }
-            },
-            // 设置逻辑视图Level
-            setShowLogicalLevel(levels) {
-                if (this.$jlmap) {
-                    console.log('设置逻辑视图Level');
-                    // this.$jlmap.setShowLogicalLevel(levels);
-                }
-            },
-            // 设置物理视图Level
-            setShowPhysicalLevel(levels) {
-                if (this.$jlmap) {
-                    onsole.log('设置物理视图Level');
-                    // this.$jlmap.setShowPhysicalLevel(levels);
-                }
-            },
-            // 设置显示中心
-            setShowCenter(deviceCode) {
-                if (this.$jlmap) {
-                    this.$jlmap.setCenter(deviceCode);
-                }
-            },
-            // 监听缩放事件
-            onDataZoom(dataZoom) {
-                this.dataZoom.offsetX = dataZoom._offsetX.toFixed(1) + '';
-                this.dataZoom.offsetY = dataZoom._offsetY.toFixed(1) + '';
-                this.dataZoom.scaleRate = dataZoom._scaleRate + '';
+				// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
 
-                let skinStyle = this.$store.state.map.map.skinStyle;
-                if (skinStyle) {
-                    let param = {
-                        scaleRate: this.dataZoom.scaleRate,
-                        skinCode: skinStyle,
-                        offsetY: this.dataZoom.offsetY,
-                    }
+				// setTimeout(() => {
+				// 	this.$store.dispatch('config/resetCanvasOffset');
+				// 	this.$store.dispatch('training/emitTipFresh');
+				// }, 100);
+			});
+		},
+		// 设置显示图层
+		setShowLevel(level) {
+			if (this.$jlmap) {
+				console.log('设置显示图层');
+				// this.$jlmap.setShowLevel(level);
+			}
+		},
+		// 设置逻辑视图Level
+		setShowLogicalLevel(levels) {
+			if (this.$jlmap) {
+				console.log('设置逻辑视图Level');
+				// this.$jlmap.setShowLogicalLevel(levels);
+			}
+		},
+		// 设置物理视图Level
+		setShowPhysicalLevel(levels) {
+			if (this.$jlmap) {
+				console.log('设置物理视图Level');
+				// this.$jlmap.setShowPhysicalLevel(levels);
+			}
+		},
+		// 设置显示中心
+		setShowCenter(deviceCode) {
+			if (this.$jlmap) {
+				this.$jlmap.setCenter(deviceCode);
+			}
+		},
+		// 监听缩放事件
+		onDataZoom(dataZoom) {
+			this.dataZoom.offsetX = dataZoom._offsetX.toFixed(1) + '';
+			this.dataZoom.offsetY = dataZoom._offsetY.toFixed(1) + '';
+			this.dataZoom.scaleRate = dataZoom._scaleRate + '';
 
-                    localStore.set(`scaleRate_${skinStyle}`, JSON.stringify(param));  // 保存缩放倍数
-                }
+			const skinStyle = this.$store.state.map.map.skinStyle;
+			if (skinStyle) {
+				const param = {
+					scaleRate: this.dataZoom.scaleRate,
+					skinCode: skinStyle,
+					offsetY: this.dataZoom.offsetY
+				};
 
-                this.$store.dispatch('map/updateZoom', this.dataZoom);
-                this.$store.dispatch('training/emitTipFresh');
-            },
-            // 点击选择事件
-            onSelected(em) {
-                this.$emit('onSelect', em);
-            },
-            // 右键点击事件
-            onContextMenu(em) {
-                this.$emit('onMenu', em);
-            },
-            // 设置地图加载状态
-            mapViewLoaded(loading) {
-                this.loading = loading;
-                if (loading) {
-                    this.$refs.progressBar.start();
-                } else {
-                    this.$refs.progressBar.end(true);
-                }
-            },
-            // 设置地图加载进度
-            mapViewProgressAt(percentage) {
-                this.$nextTick(() => {
-                    this.$refs.progressBar.progressAt(percentage);
-                });
-            },
-            // 设置新的地图数据
-            setMap(map) {
-                this.$jlmap.setMap(map);
-            },
-            // 刷新地图数据
-            refresh(map) {
-            },
-            // 新增设备
-            addOrUpdateDevices(devices) {
-                this.$jlmap.render(devices);
-            },
-            // 删除设备
-            deleteDevices(devices) {
-                this.$jlmap.render(devices);
-            },
-            // 缩小
-            setShrink() {
-                this.$jlmap.setOptions({scale: -1});
-            },
-            // 放大
-            setMagnify() {
-                this.$jlmap.setOptions({scale: 1});
-            }
-        }
-    }
+				localStore.set(`scaleRate_${skinStyle}`, JSON.stringify(param)); // 保存缩放倍数
+			}
+
+			this.$store.dispatch('map/updateZoom', this.dataZoom);
+			this.$store.dispatch('training/emitTipFresh');
+		},
+		// 点击选择事件
+		onSelected(em) {
+			this.$emit('onSelect', em);
+		},
+		// 右键点击事件
+		onContextMenu(em) {
+			this.$emit('onMenu', em);
+		},
+		// 设置地图加载状态
+		mapViewLoaded(loading) {
+			this.loading = loading;
+			if (loading) {
+				this.$refs.progressBar.start();
+			} else {
+				this.$refs.progressBar.end(true);
+			}
+		},
+		// 设置地图加载进度
+		mapViewProgressAt(percentage) {
+			this.$nextTick(() => {
+				this.$refs.progressBar.progressAt(percentage);
+			});
+		},
+		// 设置新的地图数据
+		setMap(map) {
+			this.$jlmap.setMap(map);
+		},
+		// 刷新地图数据
+		refresh(map) {
+		},
+		// 新增设备
+		addOrUpdateDevices(devices) {
+			this.$jlmap.render(devices);
+		},
+		// 删除设备
+		deleteDevices(devices) {
+			this.$jlmap.render(devices);
+		},
+		// 缩小
+		setShrink() {
+			this.$jlmap.setOptions({scale: -1});
+		},
+		// 放大
+		setMagnify() {
+			this.$jlmap.setOptions({scale: 1});
+		}
+	}
+};
 </script>
 <style rel="stylesheet/scss" lang="scss" scoped>
     .jlmap-canvas {