import {useRoute, useRouter} from "vue-router/dist/vue-router";
import {useStore} from "vuex";
import {TASK_TYPES} from "@/api/CONST";
import {computed, watchEffect} from "vue";

export function useTaskPage() {
    const router = useRouter()
    const {query: {id: taskId, type, infoId}} = useRoute()
    const {state, dispatch} = useStore()
    const info = computed(() => type == 1 ? state.projectInfo : state.routerInfo)

    const taskList = computed(() => type == 1 ? info.value.stageProcessList.flatMap(t => t.taskProcessList.map(s => ({
        ...s,
        stageId: t.id,
        stageName: t.name
    }))) : info.value.taskBoList)
    const index = computed(() => taskList.value?.findIndex(t => t.id == taskId))
    const hasPrev = computed(() => index.value - 1 > 0)
    const hasNext = computed(() => taskList.value.length > index.value)

    type == 1 ? dispatch('getProjectInfo', {projectId: infoId}) : dispatch('getRouterInfo', {routerId: infoId})

    function nextPage() {
        toPage(taskList.value[index.value + 1])
    }

    function prevPage() {
        toPage(taskList.value[index.value - 1])
    }

    function toPage(d) {
        if (typeof TASK_TYPES.path[d.type] === "string") {
            TASK_TYPES.path[d.type] && TASK_TYPES.path[d.type].startsWith("http") && window.open(TASK_TYPES.path[d.type] + d.targetId, '_top');
            TASK_TYPES.path[d.type] && TASK_TYPES.path[d.type].startsWith("/") && router.push({
                path: TASK_TYPES.path[d.type],
                query: {
                    id: d.id,
                    type: type,
                    infoId: info.id,
                    courseId: d.courseId,
                    pName: info.name,
                    sName: d.stageName,
                    chapterOrStageId: d.stageId,
                    btype: type
                },
            });
        } else if (typeof TASK_TYPES.path[d.type] === "function") {
            TASK_TYPES.path[d.type](d);
        }
    }

    return {hasPrev, hasNext, nextPage, prevPage}
}