Commit cce6ac60fc75ffa6a52f6f7859242951417a1c46
1 parent
ff410b22
refactor(guideline): (en)update element position with the adsorption line; (zh)根据吸附线位置,更新元素的位置;
Showing
2 changed files
with
19 additions
and
3 deletions
front-end/h5/src/components/core/editor/canvas/edit.js
| @@ -15,17 +15,21 @@ export default { | @@ -15,17 +15,21 @@ export default { | ||
| 15 | }, | 15 | }, |
| 16 | methods: { | 16 | methods: { |
| 17 | ...mapActions('element', [ | 17 | ...mapActions('element', [ |
| 18 | - 'setEditingElement' // -> this.foo() | 18 | + 'setEditingElement', // -> this.foo() |
| 19 | + 'setElementPosition', // -> this.foo() | ||
| 20 | + 'setElementShape' // -> this.foo() | ||
| 19 | ]), | 21 | ]), |
| 20 | // TODO #!zh: 优化代码 | 22 | // TODO #!zh: 优化代码 |
| 21 | // generate vertical line | 23 | // generate vertical line |
| 22 | drawVLine (newLeft) { | 24 | drawVLine (newLeft) { |
| 23 | - this.editingElement.commonStyle.left = newLeft | 25 | + // this.editingElement.commonStyle.left = newLeft |
| 26 | + this.setElementPosition({ left: newLeft }) | ||
| 24 | this.vLines = [{ left: newLeft }] | 27 | this.vLines = [{ left: newLeft }] |
| 25 | }, | 28 | }, |
| 26 | // generate horizontal line | 29 | // generate horizontal line |
| 27 | drawHLine (newTop) { | 30 | drawHLine (newTop) { |
| 28 | - this.editingElement.commonStyle.top = newTop | 31 | + // this.editingElement.commonStyle.top = newTop |
| 32 | + this.setElementPosition({ top: newTop }) | ||
| 29 | this.hLines = [{ top: newTop }] | 33 | this.hLines = [{ top: newTop }] |
| 30 | }, | 34 | }, |
| 31 | calcX (newLeft) { | 35 | calcX (newLeft) { |
front-end/h5/src/store/modules/element.js
| @@ -12,6 +12,12 @@ const getters = { | @@ -12,6 +12,12 @@ const getters = { | ||
| 12 | const actions = { | 12 | const actions = { |
| 13 | setEditingElement ({ commit }, payload) { | 13 | setEditingElement ({ commit }, payload) { |
| 14 | commit('setEditingElement', payload) | 14 | commit('setEditingElement', payload) |
| 15 | + }, | ||
| 16 | + setElementPosition ({ commit }, payload) { | ||
| 17 | + commit('setElementPosition', payload) | ||
| 18 | + }, | ||
| 19 | + setElementShape ({ commit }, payload) { | ||
| 20 | + commit('setElementShape', payload) | ||
| 15 | } | 21 | } |
| 16 | } | 22 | } |
| 17 | 23 | ||
| @@ -19,6 +25,12 @@ const actions = { | @@ -19,6 +25,12 @@ const actions = { | ||
| 19 | const mutations = { | 25 | const mutations = { |
| 20 | setEditingElement (state, payload) { | 26 | setEditingElement (state, payload) { |
| 21 | state.editingElement = payload | 27 | state.editingElement = payload |
| 28 | + }, | ||
| 29 | + setElementCommonStyle (state, commonStyle) { | ||
| 30 | + state.editingElement.commonStyle = { | ||
| 31 | + ...state.editingElement.commonStyle, | ||
| 32 | + ...commonStyle | ||
| 33 | + } | ||
| 22 | } | 34 | } |
| 23 | } | 35 | } |
| 24 | 36 |