import { defineStore } from "pinia";
import { ref } from "vue";
import { useRouter, useRoute } from "vue-router";

export const useTagsView = defineStore('tagsView',()=>{
  const router = useRouter()
  const route = useRoute()
  //已显示的标签页list
  const visitedViews = ref([])

  //添加标签页面
  const addVisitedViews = ({path,meta,query}) => {
    if(visitedViews.value.length == 0) {
      visitedViews.value.push({path,meta,query})
    }else {
      const paths = visitedViews.value.map(item => item.path)
      if(paths.includes(path) == false) {
        visitedViews.value.push({path,meta,query})
      }
    }
  }

  //删除标签页
  const delVisitedViews = (path) => {
    if(visitedViews.value.length - 1 == 0) {
      return
    }
    visitedViews.value.forEach((item,index)=>{
      if(item.path == path) {
        visitedViews.value.splice(index,1)
      }
    })
    toLastTagView(visitedViews)
  }

  //删除当前标签页并跳转到指定路由
  const delViewAndGoView = (path) => {
    visitedViews.value.forEach((item,index)=>{
      if(item.path == route.path) {
        visitedViews.value.splice(index,1)
      }
    })
    router.push(path)
  }

  //删除其他标签页
  const delOtherVisitedViews = ({path,meta,query}) => {
    visitedViews.value = []
    visitedViews.value.push({path,meta,query})
    toLastTagView(visitedViews)
  }

  //路由到末尾标签页
  const toLastTagView = (view) => {
    const lastTagView = view.value.slice(-1)[0]
    router.push({path: lastTagView.path, query: lastTagView.query})
  }

  const removeAllTagView = () => {
    visitedViews.value.length = 0
  }

  return {
    visitedViews,
    addVisitedViews,
    delVisitedViews,
    delOtherVisitedViews,
    delViewAndGoView,
    removeAllTagView
  }
})
