From 9aec1ef099e93ce6db14d1482f0f1ae11ba62e00 Mon Sep 17 00:00:00 2001
From: zyy <1787816799@qq.com>
Date: Tue, 10 Dec 2019 16:57:31 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=8B=96=E6=8B=BD?=
=?UTF-8?q?=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/store/modules/config.js | 7 ++
src/views/components/drapLeft/index.vue | 149 ++++++++++++------------
src/views/newMap/newMapdraft/index.vue | 19 ++-
3 files changed, 98 insertions(+), 77 deletions(-)
diff --git a/src/store/modules/config.js b/src/store/modules/config.js
index ee3ddbac5..39c3ba599 100644
--- a/src/store/modules/config.js
+++ b/src/store/modules/config.js
@@ -4,6 +4,7 @@ const config = {
namespaced: true,
state: {
+ maskOpen: false, // 开关
width: document.documentElement.clientWidth, // 地图canvas 容器 宽度
height: document.documentElement.clientHeight, // 地图canvas 容器 高度
menuBarLoadedCount: 0, // menuBar加载完成
@@ -44,6 +45,9 @@ const config = {
},
changeSwitchMap: (state, swtichMap) => {
state.switchMap = swtichMap;
+ },
+ setMaskOpen: (state, flag) => {
+ state.maskOpen = flag;
}
},
actions: {
@@ -76,6 +80,9 @@ const config = {
},
changeSwitchMap: ({ commit, state}, switchMap) => {
commit('changeSwitchMap', switchMap);
+ },
+ setMaskOpen: ({ commit }, flag) => {
+ commit('setMaskOpen', flag);
}
}
};
diff --git a/src/views/components/drapLeft/index.vue b/src/views/components/drapLeft/index.vue
index 291c374a8..00e586f07 100644
--- a/src/views/components/drapLeft/index.vue
+++ b/src/views/components/drapLeft/index.vue
@@ -1,10 +1,9 @@
-
@@ -12,79 +11,79 @@
import localStore from 'storejs';
export default {
- name: 'DrapLeft',
- props: {
- widthLeft: {
- type: Number,
- required: true
- },
- isSave: {
- type: Boolean,
- default: true
- },
- max: {
- type: Number,
- default: 0
- },
- min: {
- type: Number,
- default: 0
- },
- width: {
- type: Number,
- default: 16
- }
- },
- data() {
- return {
- widthLefts: 0
- };
- },
- computed: {
- height() {
- return this.$store.state.app.height;
- }
- },
- mounted() {
- const oDiv = this.$refs.drapBox;
- oDiv.onmousedown = () => {
- return false;
- };
- },
- methods: {
- mousedown(e) {
- const oDiv = this.$refs.drapBox;
- const maxNum = this.max || 850;
- const minNum = this.min || 150;
- oDiv.onmousedown = function() {
- return false;
- };
- e.stopPropagation();
- window.event.cancelBubble = true;
- const odiv = e.target;
- const disX = e.clientX - odiv.offsetLeft;
- document.onmousemove = (e) => {
- let left = e.clientX - disX;
- if (left > maxNum) {
- left = maxNum;
- } else if (left < minNum) {
- left = minNum;
- }
- odiv.style.left = left + 'px';
- this.$emit('drapWidth', left);
- this.widthLefts = left;
- };
- document.onmouseup = (e) => {
- if (this.isSave) {
- if (this.widthLefts > minNum) { // 左侧菜单宽度必须大于150 才可以设置
- localStore('LeftWidth', JSON.stringify(this.widthLefts));
- }
- }
- document.onmousemove = null;
- document.onmouseup = null;
- };
- }
- }
+ name: 'DrapLeft',
+ props: {
+ widthLeft: {
+ type: Number,
+ required: true
+ },
+ isSave: {
+ type: Boolean,
+ default: true
+ },
+ max: {
+ type: Number,
+ default: 0
+ },
+ min: {
+ type: Number,
+ default: 0
+ },
+ width: {
+ type: Number,
+ default: 16
+ }
+ },
+ data() {
+ return {
+ widthLefts: 0
+ };
+ },
+ computed: {
+ height() {
+ return this.$store.state.app.height;
+ }
+ },
+ mounted() {
+ const oDiv = this.$refs.drapBox;
+ oDiv.onmousedown = () => {
+ return false;
+ };
+ },
+ methods: {
+ mousedown(e) {
+ const oDiv = this.$refs.drapBox;
+ const maxNum = this.max || 850;
+ const minNum = this.min || 150;
+ oDiv.onmousedown = function() {
+ return false;
+ };
+ const odiv = e.target;
+ const disX = e.clientX - odiv.offsetLeft;
+ this.$store.dispatch('config/setMaskOpen', true);
+ document.onmousemove = (e) => {
+ let left = e.clientX - disX;
+ if (left > maxNum) {
+ left = maxNum;
+ } else if (left < minNum) {
+ left = minNum;
+ }
+ odiv.style.left = left + 'px';
+ this.$emit('drapWidth', left);
+ this.widthLefts = left;
+ };
+ document.onmouseup = (e) => {
+ if (this.isSave) {
+ if (this.widthLefts > minNum) { // 左侧菜单宽度必须大于150 才可以设置
+ localStore('LeftWidth', JSON.stringify(this.widthLefts));
+ }
+ }
+ this.$store.dispatch('config/setMaskOpen', false);
+ document.onmousemove = null;
+ document.onmouseup = null;
+ };
+ }
+ }
};