78 lines
1.6 KiB
JavaScript
78 lines
1.6 KiB
JavaScript
|
import { getDomOffset } from '@/utils/index';
|
||
|
|
||
|
const config = {
|
||
|
namespaced: true,
|
||
|
|
||
|
state: {
|
||
|
width: 800, // 地图canvas 容器 宽度
|
||
|
height: 600, // 地图canvas 容器 高度
|
||
|
menuBarLoadedCount: 0, // menuBar加载完成
|
||
|
canvasSizeCount: 0, // 地图canvas 大小变更标识
|
||
|
canvasId: '', // 地图canvas容器dom id
|
||
|
canvasOffset: {}, // canvas dom 偏移
|
||
|
canvasOffsetCount: 0 // 地图canvas 偏移变更标识
|
||
|
},
|
||
|
|
||
|
getters: {
|
||
|
width: (state) => {
|
||
|
return state.width;
|
||
|
},
|
||
|
height: (state) => {
|
||
|
return state.height;
|
||
|
},
|
||
|
canvasId: (state) => {
|
||
|
return state.canvasId;
|
||
|
}
|
||
|
},
|
||
|
|
||
|
mutations: {
|
||
|
SET_WIDTH: (state, width) => {
|
||
|
state.width = width;
|
||
|
state.canvasSizeCount += 1;
|
||
|
},
|
||
|
SET_HEIGHT: (state, height) => {
|
||
|
state.height = height;
|
||
|
state.canvasSizeCount += 1;
|
||
|
},
|
||
|
setCanvasId: (state, id) => {
|
||
|
state.canvasId = id;
|
||
|
},
|
||
|
updateMenuBar: (state) => {
|
||
|
state.menuBarLoadedCount += 1;
|
||
|
},
|
||
|
setCanvasOffset: (state, offset) => {
|
||
|
state.canvasOffset = offset;
|
||
|
state.canvasOffsetCount += 1;
|
||
|
}
|
||
|
},
|
||
|
actions: {
|
||
|
resize({ commit }, opt) {
|
||
|
if (opt.width) {
|
||
|
commit('SET_WIDTH', opt.width);
|
||
|
}
|
||
|
if (opt.height) {
|
||
|
commit('SET_HEIGHT', opt.height);
|
||
|
}
|
||
|
},
|
||
|
|
||
|
updateMenuBar({ commit }) {
|
||
|
commit('updateMenuBar');
|
||
|
},
|
||
|
|
||
|
setCurrentCancasId: ({ dispatch, commit }, payLoad) => {
|
||
|
commit('setCanvasId', payLoad.id);
|
||
|
dispatch('resetCanvasOffset');
|
||
|
},
|
||
|
|
||
|
resetCanvasOffset: ({ commit, state }) => {
|
||
|
const mapCanvas = document.getElementById(state.canvasId);
|
||
|
if (mapCanvas) {
|
||
|
const offset = getDomOffset(mapCanvas);
|
||
|
commit('setCanvasOffset', offset);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
export default config;
|