diff --git a/src/store/design/history/actions/handleHistory.ts b/src/store/design/history/actions/handleHistory.ts index 1e84f69..28d673a 100644 --- a/src/store/design/history/actions/handleHistory.ts +++ b/src/store/design/history/actions/handleHistory.ts @@ -6,12 +6,13 @@ * @LastEditTime: 2024-03-27 21:00:00 */ -import { useControlStore, usePageStore } from "@/store" +import { useControlStore, usePageStore, useWidgetStore } from "@/store" import { THistoryStore } from ".." export default function handleHistory(store: THistoryStore, action: "undo" | "redo") { const pageStore = usePageStore() const controlStore = useControlStore() + const widgetStore = useWidgetStore() controlStore.setShowMoveable(false) // 清理掉上一次的选择框 // store.commit('setShowMoveable', false) // 清理掉上一次的选择框 const history = store.dHistory @@ -21,14 +22,14 @@ export default function handleHistory(store: THistoryStore, action: "undo" | "re historyParams.index -= 1 // 下标向前移1 撤销 console.log(historyParams.index) if (historyParams.index > -1) { - store.state.dWidgets = JSON.parse(history[historyParams.index]) + widgetStore.setDWidgets(JSON.parse(history[historyParams.index])) pageStore.setDPage(JSON.parse(pageHistory[historyParams.index])) } } else if (action === 'redo') { historyParams.index += 1 // 下标向后移1 重做 // 如果下标小于历史记录列表长度,直接取出历史记录 // if (historyParams.index < historyParams.length) { - store.state.dWidgets = JSON.parse(history[historyParams.index]) + widgetStore.setDWidgets(JSON.parse(history[historyParams.index])) pageStore.setDPage(JSON.parse(pageHistory[historyParams.index])) // } else { // // 否则设置下标为列表最后一项 diff --git a/src/store/design/history/actions/pushHistory.ts b/src/store/design/history/actions/pushHistory.ts index abee906..83175ca 100644 --- a/src/store/design/history/actions/pushHistory.ts +++ b/src/store/design/history/actions/pushHistory.ts @@ -13,10 +13,10 @@ import { proxyToObject } from "@/utils/utils" /** push操作历史记录 */ export function pushHistory(store: THistoryStore, msg: string = "") { const pageStore = usePageStore() - const selectStore = useWidgetStore() + const widgetStore = useWidgetStore() console.log('history压栈', '来源: ' + msg) // 如果有上一次记录,并且与新纪录相同,那么不继续操作 - if (store.dHistory[history.length - 1] && store.dHistory[history.length - 1] === JSON.stringify(selectStore.dWidgets)) { + if (store.dHistory[store.dHistory.length - 1] && store.dHistory[store.dHistory.length - 1] === JSON.stringify(widgetStore.dWidgets)) { return } if (store.dHistoryParams.index < history.length - 1) { @@ -24,13 +24,13 @@ export function pushHistory(store: THistoryStore, msg: string = "") { const len = history.length - index store.dHistory.splice(index, len) store.dPageHistory.splice(index, len) - store.dHistoryParams.length = history.length - store.dHistoryParams.index = history.length - 1 + store.dHistoryParams.length = store.dHistory.length + store.dHistoryParams.index = store.dHistory.length - 1 } - store.dHistory.push(JSON.stringify(selectStore.dWidgets)) + store.dHistory.push(JSON.stringify(widgetStore.dWidgets)) store.dPageHistory.push(JSON.stringify(proxyToObject(pageStore.dPage))) - store.dHistoryParams.index = history.length - 1 - store.dHistoryParams.length = history.length + store.dHistoryParams.index = store.dHistory.length - 1 + store.dHistoryParams.length = store.dHistory.length } /** 添加颜色选择历史记录 */ diff --git a/src/store/design/history/index.ts b/src/store/design/history/index.ts index eb6651d..c99d648 100644 --- a/src/store/design/history/index.ts +++ b/src/store/design/history/index.ts @@ -64,11 +64,11 @@ const HistoryStore = defineStore<"historyStore", THistoryState, {}, THistoryActi pushHistory(this, msg) }, handleHistory(action) { - const selectStore = useWidgetStore() + const widgetStore = useWidgetStore() const pageStore = usePageStore() handleHistory(this, action) // 激活组件默认为page - selectStore.dActiveElement = pageStore.dPage + widgetStore.setdActiveElement(pageStore.dPage) }, pushColorToHistory(color) { pushColorToHistory(this, color) diff --git a/src/store/design/widget/actions/group.ts b/src/store/design/widget/actions/group.ts index 151a5fe..5c13d0c 100644 --- a/src/store/design/widget/actions/group.ts +++ b/src/store/design/widget/actions/group.ts @@ -12,15 +12,16 @@ import { customAlphabet } from 'nanoid/non-secure' const nanoid = customAlphabet('1234567890abcdef', 12) -export function addGroup(store: TWidgetStore, group: TdWidgetData[]) { +export function addGroup(store: TWidgetStore, group: TdWidgetData[] | TdWidgetData) { const historyStore = useHistoryStore() const canvasStore = useCanvasStore() let parent: TdWidgetData | null = null - group.forEach((item) => { + const tmpGroup: TdWidgetData[] = !Array.isArray(group) ? [group] : group + tmpGroup.forEach((item) => { item.uuid = nanoid() // 重设id item.type === 'w-group' && (parent = item) // 找出父组件 }) - group.forEach((item) => { + tmpGroup.forEach((item) => { !item.isContainer && parent && (item.parent = parent.uuid) // 重设父id item.text && (item.text = decodeURIComponent(item.text)) store.dWidgets.push(item) diff --git a/src/store/design/widget/actions/index.ts b/src/store/design/widget/actions/index.ts index f21bac1..6b64d65 100644 --- a/src/store/design/widget/actions/index.ts +++ b/src/store/design/widget/actions/index.ts @@ -7,7 +7,7 @@ */ import { useCanvasStore, useControlStore, usePageStore } from "@/store" -import { TWidgetStore } from ".." +import { TWidgetStore, TdWidgetData } from ".." export type TInidDMovePayload = { startX: number @@ -123,3 +123,7 @@ export function setDropOver(store: TWidgetStore, uuid: string) { export function setMouseEvent(state: TWidgetStore, e: MouseEvent | null) { state.activeMouseEvent = e } + +export function setdActiveElement(state: TWidgetStore, data: TdWidgetData) { + state.dActiveElement = data +} diff --git a/src/store/design/widget/index.ts b/src/store/design/widget/index.ts index 0fae785..b66acbb 100644 --- a/src/store/design/widget/index.ts +++ b/src/store/design/widget/index.ts @@ -7,7 +7,7 @@ */ import { Store, defineStore } from "pinia"; -import { TInidDMovePayload, TMovePayload, dMove, initDMove, setDropOver, setMouseEvent, updateGroupSize, updateHoverUuid } from "./actions"; +import { TInidDMovePayload, TMovePayload, dMove, initDMove, setDropOver, setMouseEvent, setdActiveElement, updateGroupSize, updateHoverUuid } from "./actions"; import { TPageState } from "../page"; import { TInitResize, TResize, TdResizePayload, dResize, initDResize, resize } from "./actions/resize"; import { TUpdateWidgetMultiplePayload, TUpdateWidgetPayload, TsetWidgetStyleData, addWidget, deleteWidget, setDWidgets, setWidgetStyle, updateWidgetData, updateWidgetMultiple } from "./actions/widget"; @@ -117,6 +117,7 @@ type TAction = { setWidgetStyle: (data: TsetWidgetStyleData) => void setDWidgets: (data: TdWidgetData[]) => void setMouseEvent: (e: MouseEvent | null) => void + setdActiveElement: (data: TdWidgetData) => void } const WidgetStore = defineStore<"widgetStore", TWidgetState, TGetter, TAction>("widgetStore", { @@ -175,7 +176,8 @@ const WidgetStore = defineStore<"widgetStore", TWidgetState, TGetter, TAction>(" resize(data) { resize(this, data) }, setWidgetStyle(data) { setWidgetStyle(this, data) }, setDWidgets(data) { setDWidgets(this, data) }, - setMouseEvent(event) { setMouseEvent(this, event) } + setMouseEvent(event) { setMouseEvent(this, event) }, + setdActiveElement(data) { setdActiveElement(this, data) }, } }) diff --git a/src/views/components/HeaderOptions.vue b/src/views/components/HeaderOptions.vue index 08f22ca..0b811ab 100644 --- a/src/views/components/HeaderOptions.vue +++ b/src/views/components/HeaderOptions.vue @@ -203,8 +203,7 @@ async function load(id: number, tempId: number, type: number, cb: () => void) { const data = JSON.parse(content) state.stateBollean = !!_state state.title = title - // store.commit('setShowMoveable', false) // 清理掉上一次的选择框 - controlStore.setShowMoveable(false) + controlStore.setShowMoveable(false) // 清理掉上一次的选择框 // this.$store.commit('setDWidgets', []) if (type == 1) { @@ -212,18 +211,12 @@ async function load(id: number, tempId: number, type: number, cb: () => void) { dPage.value.width = width dPage.value.height = height widgetStore.addGroup(data) - // store.dispatch('addGroup', data) - // addGroup(data) } else { pageStore.setDPage(data.page) - // store.commit('setDPage', data.page) id ? widgetStore.setDWidgets(data.widgets) : widgetStore.setTemplate(data.widgets) - // id ? store.commit('setDWidgets', data.widgets) : store.dispatch('setTemplate', data.widgets) } cb() historyStore.pushHistory('请求加载load') - // store.dispatch('pushHistory', '请求加载load') - // pushHistory('请求加载load') } }