import { setItem, getItem, removeAllItem, deepClone } from '@/utils/index'
import { TAGS_VIEW } from '@/utils/constant'
export default {
  namespaced: true, //单独的模块 不会合并到主模块里面去
  state: {
    tagsViewList: getItem(TAGS_VIEW) || []
  },
  mutations: {
    //   添加tags
    addTagsViewList(state, tag) {
      const isFind = state.tagsViewList.find((item) => {
        return item.path === tag.path
      })
      if (!isFind) {
        state.tagsViewList.push(tag)
        setItem(TAGS_VIEW, state.tagsViewList)
      }
    },

    /**
     * 根据params.id 和原本的 meta.title 判断唯一的缓存tag 并对其进行更改新的  tag title
     *  const { id, otherTitle, newTitle } = data
     * @param {*}
     * @param {*}   id           params.id
     * @param {*}   otherTitle   原本的   tag title
     * @param {*}   newTitle     新的   tag title
     * @returns
     */
    updataTagsItemMetaTitle(state, data) {
      const { id, otherTitle, newTitle } = data
      const deepTagsViewList = deepClone(state.tagsViewList)
      deepTagsViewList.forEach((e) => {
        if (e.params.id == id && e.meta.title == otherTitle) {
          e.title = newTitle
          e.meta.title = newTitle
        }
      })
      state.tagsViewList = deepTagsViewList
      setItem(TAGS_VIEW, deepTagsViewList)
    },

    /**
     * 处理需要清除缓存的路由
     * @param {*} _this 当前vue实例
     * @param {*} routeNumber 路由层数 也就是有几个`/` 就是几
     * @returns
     */
    clearCacheRoute(state, data) {
      const { _this, routeNumber } = data
      let cache = _this.$vnode.parent.componentInstance.cache
      console.log(_this.$vnode.parent.componentInstance)
      let keys = _this.$vnode.parent.componentInstance.keys
      let key = _this.$vnode.key
      let keyArr = key.split('/')
      let str = ''
      for (let i = 1; i <= routeNumber; i++) {
        str += `/${keyArr[i]}`
      }
      if (state.tagsViewList.findIndex((r) => r.fullPath == str) == -1) {
        if (cache[key]) {
          if (keys.length) {
            let index = keys.indexOf(key)
            if (index > -1) {
              keys.splice(index, 1)
              _this.$destroy()
            }
          }
          delete cache[key]
        }
      }
    },

    removeTagsViewList(state, tag) {
      state.tagsViewList = []
    },

    /**
     *
     * @param {*} state
     * @param {*} payload .type 删除 可能为右侧 或者其他 或者自身 "right" || "other" || "index"
     */
    removeTagsView(state, payload) {
      if (payload.type === 'index') {
        state.tagsViewList.splice(payload.index, 1)
      } else if (payload.type === 'other') {
        state.tagsViewList.splice(payload.index + 1, state.tagsViewList.length - payload.index + 1)
        state.tagsViewList.splice(1, payload.index - 1)
      } else if (payload.type === 'right') {
        state.tagsViewList.splice(payload.index + 1, state.tagsViewList.length - payload.index + 1)
      }

      setItem(TAGS_VIEW, state.tagsViewList)

      const cache = payload.componentInstance.cache || []
      const keys = payload.componentInstance.keys || []
      for (let i = 0; i < keys.length; i++) {
        const key = keys[i]
        const fullPath = `/${key.split('/').slice(1).join('/')}`
        if (state.tagsViewList.findIndex((r) => r.fullPath == fullPath) == -1) {
          if (cache[key]) {
            if (keys.length) {
              let index = keys.indexOf(key)
              if (index > -1) {
                keys.splice(index, 1)
              }
            }
            delete cache[key]
          }
        }
      }
    },

    moveTagsView(state, payload) {
      const source = state.tagsViewList[payload.dragIndex]
      state.tagsViewList.splice(payload.dragIndex, 1)
      state.tagsViewList.splice(payload.enterIndex == 0 ? 1 : payload.enterIndex, 0, source)
      setItem(TAGS_VIEW, state.tagsViewList)
    }
  }
}
