import { defineStore } from 'pinia'

export const useChartHistoryStore = defineStore({
  id: 'useChartHistoryStore',
  state: () => ({
    // 后退栈
    backStack: [],
    // 前进栈
    forwardStack: []
  }),
  getters: {
    getBackStack() {
      return this.backStack
    },
    getForwardStack() {
      return this.forwardStack
    }
  },
  actions: {
    /**
     * * 新增记录并插入栈
     * @param item 图表实例
     * @param actionType 动作类型
     * @param targetType 对象类型（默认图表）
     */
    createStackItem(
      item,
      actionType,
      targetType = 'chart'
    ) {
      // 优化性能转为 freeze
      this.pushBackStackItem(
        Object.freeze({
          'id': new Date().getTime().toString(),
          'historyData': item,
          'actionType': actionType,
          'targetType': targetType
        })
      )
    },
    // * 画布初始化
    canvasInit(canvas) {
      this.createStackItem([canvas], 'add', 'canvas')
    },
    // * 推入后退栈
    pushBackStackItem(item, notClear = false) {
      if (item instanceof Array) this.backStack = [...this.backStack, ...item]
      else this.backStack.push(item)
      this.backStack.splice(0, this.backStack.length - 100)
      // 新动作需清空前进栈
      if (notClear) return
      this.clearForwardStack()
    },
    // * 推入前进栈
    pushForwardStack(item) {
      if (item instanceof Array) this.forwardStack = [...this.forwardStack, ...item]
      else this.forwardStack.push(item);
    },
    // * 移出后退栈
    popBackStackItem() {
      if (this.backStack.length > 0) {
        return this.backStack.pop()
      }
    },
    // * 移出前进栈
    popForwardStack() {
      if (this.forwardStack.length > 0) {
        return this.forwardStack.pop()
      }
    },
    // * 清空前进栈
    clearForwardStack() {
      this.forwardStack = []
    },
    // * 清空后退栈(保留初始化)
    clearBackStack() {
      const canvasHistory = this.getBackStack[0]
      this.backStack = [canvasHistory]
    },
    // * 撤回
    backAction() {
      try {
        // 排除画布初始化
        if (this.getBackStack.length > 1) {
          const targetData = this.popBackStackItem();
          if (!targetData) {
            return
          }
          // 移除记录到前进堆
          this.pushForwardStack(targetData)
          return targetData
        }
      } catch (error) {
      }
    },
    // * 前进
    forwardAction() {
      try {
        if (this.getForwardStack.length) {
          const targetData = this.popForwardStack()
          if (!targetData) {
            return
          }
          // 放入后退栈
          this.pushBackStackItem(targetData, true)
          return targetData
        }
      } catch (error) {
      }
    },
    // * 新增组件记录
    createAddHistory(item) {
      this.createStackItem(item, 'add', 'chart')
    },
    // * 更新属性记录（大小、图表属性）
    createUpdateHistory(item) {
      this.createStackItem(item, 'update', 'chart')
    },
    // * 删除组件记录
    createDeleteHistory(item) {
      this.createStackItem(item, 'delete', 'chart')
    },
    // * 移动组件记录
    createMoveHistory(item) {
      this.createStackItem(item, 'move', 'chart')
    },
    // * 改变层级组件记录
    createLayerHistory(
      item,
      type
    ) {
      this.createStackItem(item, type, 'chart')
    },
    // * 剪切组件记录
    createPasteHistory(item) {
      this.createStackItem(item, 'cut', 'chart')
    },
    // * 创建分组
    createGroupHistory(item) {
      this.createStackItem(item, 'group', 'chart')
    },
    // * 解除分组
    createUnGroupHistory(item) {
      this.createStackItem(item, 'unGroup', 'chart')
    },
    // * 锁定记录
    createLockHistory(item) {
      this.createStackItem(item, 'lock', 'chart')
    },
    // * 解锁记录
    createUnLockHistory(item) {
      this.createStackItem(item, 'unLock', 'chart')
    },
    // * 隐藏记录
    createHideHistory(item) {
      this.createStackItem(item, 'hide', 'chart')
    },
    // * 展示记录
    createShowHistory(item) {
      this.createStackItem(item, 'show', 'chart')
    }
  }
})
