const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provide } = Vue;
(async function () {
    const { itemForum } = await import(withVer("../component/item-forum/item-forum.js"));
    const { itemOffer } = await import(withVer("../component/item-offer/item-offer.js"));
    const { itemSummary } = await import(withVer("../component/item-summary/item-summary.js"));
    const { itemVote } = await import(withVer("../component/item-vote/item-vote.js"));
    const { itemMj } = await import(withVer("../component/item-mj/item-mj.js"));
    const { itemTenement } = await import(withVer("../component/item-tenement/item-tenement.js"));
    const { headTop } = await import(withVer("../component/head-top/head-top.js"));
    const { loadBox } = await import(withVer("../component/load-box/load-box.js"));

    const appSectionIndex = createApp({
        setup() {
            const tokenRef = ref(null);

            onMounted(() => {
                getUserInfoWin();
                // init();
                window.addEventListener("scroll", handleScroll);

                const params = getUrlParams();

                if (params.classify) {
                    classify.value = params.classify;
                }
                if (params.type) typeValue.value = params.type;

                const preLoader = document.getElementById("pre-loader");
                if (preLoader) preLoader.style.display = "none";
            });

            const handleScroll = () => {
                const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

                const scrollHeight = document.documentElement.scrollHeight;
                const clientHeight = window.innerHeight;

                // 列表下 滑动到底部 获取新数据
                if (scrollTop + clientHeight >= scrollHeight - 200) getList();
            };

            let uid = ref(0);
            let uin = ref(0);
            let isLogin = ref(false);
            let realname = ref(0); // 是否已经实名
            let userInfoWin = ref({});

            let permissions = ref([]);

            const getUserInfoWin = () => {
                const checkUser = () => {
                    const user = window.userInfoWin;
                    if (!user) return;
                    document.removeEventListener("getUser", checkUser);
                    realname.value = user.realname;
                    userInfoWin.value = user;
                    if (user?.uin > 0 || user?.uid > 0) isLogin.value = true;
                    permissions.value = user?.authority || [];

                    uid.value = user.uid;
                    uin.value = user.uin;
                    init();
                };
                document.addEventListener("getUser", checkUser);
            };

            const openAttest = () => {
                const handleAttestClose = () => {
                    document.removeEventListener("closeAttest", handleAttestClose);
                    realname.value = window.userInfoWin?.realname || 0;
                };
                // 启动认证流程时添加监听
                document.addEventListener("closeAttest", handleAttestClose);
                loadAttest(2);
            };

            // 跳转登录
            const goLogin = () => {
                if (typeof window === "undefined") return;
                if (window["userInfoWin"] && Object.keys(window["userInfoWin"]).length !== 0) {
                    if (window["userInfoWin"]["uid"]) isLogin.value = true;
                    else ajax_login();
                } else ajax_login();
            };

            provide("isLogin", isLogin);
            provide("userInfoWin", userInfoWin);
            provide("realname", realname);
            provide("openAttest", openAttest);
            provide("goLogin", goLogin);

            const init = () => {
                uid.value = 500144
                uin.value = 4238049
                ajaxGet(`/v2/api/forum/getSpaceDetail?uid=${uid.value}&uin=${uin.value}`).then((res) => {
                    if (res.code != 200) {
                        creationAlertBox("error", res.message);
                        return;
                    }

                    const data = res.data;

                    const allValues = Object.values(data.schoolTags || []);
                    const onlyArrays = allValues.filter((item) => Array.isArray(item));
                    let schoolTagsData = onlyArrays.flat();

                    data.info["lastlogintime"] = timeago(data.info.lastlogintime, 2);
                    data.info["gtercoin"] = Math.floor(data.info.gtercoin || 0);

                    info.value = data.info || {};
                    medallist.value = data.medal || [];
                    schoolTags.value = schoolTagsData;

                    calculateCreationType(data.count);

                    nextTick(() => {
                        getList();
                    });

                    const nickname = data.info.nickname || "";
                    document.title = `${nickname}的个人主页 -- 寄托天下`;
                });
                // .finally(() => wx.hideLoading());
            };

            let schoolTags = ref([]);
            let gtercoin = ref(0);
            let info = ref({});
            let medallist = ref([]);
            let introduction = ref("");

            let avatar = "";
            // const init = () => {
            //     ajax(`/v2/api/forum/postUserDetail`)
            //         .then((res) => {
            //             if (res.code == 401) {
            //                 goLogin();
            //                 return;
            //             }
            //             let data = res.data;

            //             const allValues = Object.values(data.schoolTags || []);
            //             const onlyArrays = allValues.filter((item) => Array.isArray(item));
            //             let schoolTagsData = onlyArrays.flat();
            //             schoolTags.value = schoolTagsData;

            //             gtercoin.value = data.gtercoin;
            //             info.value = data.info || {};
            //             medallist.value = data.medal || [];
            //             introduction.value = data?.urls?.introduction;
            //             avatar = data?.info?.avatar || "";

            //             getCount();
            //             getList();
            //         })
            //         .catch(() => {});
            // };

            let createCount = ref(0);
            let count = ref(0);
            let creation = ref([]);
            let interaction = ref({});

            const getCount = () => {
                ajax("/v2/api/forum/postUserStatistic").then((res) => {
                    if (res.code != 200) return;
                    const data = res.data;

                    count.value = data.count;
                    creation.value = data.create || [];
                    createCount.value = creation.value.reduce((sum, item) => {
                        const validCount = Number(item.count) || 0;
                        return sum + validCount;
                    }, 0);

                    interaction.value = data.interaction || [];

                    calculateCreationType(creation.value, createCount.value);
                });
            };

            let creationType = ref([]);

            // 计算出创作分类
            const calculateCreationType = (creation, creationCount) => {
                let value = {};
                creation.forEach((element) => {
                    value[element.type] = element.count;
                });

                let obj = {
                    offer: "offer",
                    offer_summary: "总结",
                    interviewexperience: "面经",
                };

                let arr = [];
                let accumulation = 0; // 累加
                for (const key in obj) {
                    accumulation += value[key] || 0;
                    arr.push({
                        text: obj[key],
                        number: value[key] || 0,
                    });
                }

                arr.push({
                    text: "其他",
                    number: creationCount - accumulation || 0,
                });

                creationType.value = arr;
            };

            let typeList = ref([
                {
                    text: "收藏",
                    type: "collection",
                },
                {
                    text: "发布",
                    type: "creation",
                },
                {
                    text: "评论",
                    type: "comment",
                },
                {
                    text: "点赞",
                    type: "like",
                },
                {
                    text: "足迹",
                    type: "footprint",
                },
            ]);

            let typeValue = ref("collection");
            // 监听 typeValue == creation 时 变量 listType 为 edit
            watch(
                () => typeValue.value,
                (newVal, oldVal) => {
                    if (newVal == "creation") listType.value = "edit";
                    else listType.value = "";
                }
            );

            let listType = ref(""); // edit

            const classifyList = ref([
                {
                    text: "全部",
                    type: "",
                },
                {
                    text: "帖子",
                    type: "thread",
                },
                {
                    text: "Offer",
                    type: "offer",
                },
                {
                    text: "总结",
                    type: "offer_summary",
                },
                {
                    text: "面经",
                    type: "interviewexperience",
                },
                {
                    text: "投票",
                    type: "vote",
                },
                {
                    text: "租房",
                    type: "tenement",
                },
            ]);

            let classify = ref("");

            let list = ref([]);
            let page = ref(1);
            let total = ref(0);

            let loading = ref(false);
            const getList = () => {
                if (page.value == 0 || loading.value) return;
                loading.value = true;
                let url = `/v2/api/forum/postUserCollect`;
                if (typeValue.value == "creation") url = `/v2/api/forum/postUserPublish`;
                if (typeValue.value == "like") url = `/v2/api/forum/postUserLike`;
                if (typeValue.value == "footprint") url = `/v2/api/forum/postUserFootprint`;

                ajax(url, {
                    page: page.value,
                    type: classify.value,
                })
                    .then((res) => {
                        if (res.code != 200) return;
                        const data = res.data || [];

                        let targetList = data.data || [];

                        targetList.forEach((element) => element.comment_list?.forEach((ele) => (ele["avatar"] = avatar)));

                        total.value = data.count;
                        list.value = [...list.value, ...targetList];
                        page.value = list.value.length >= data.count ? 0 : page.value + 1;
                    })
                    .finally(() => (loading.value = false));
            };

            // 取消操作后的删除
            const cancelOperate = (type, token) => {
                if (typeValue.value != type) return;
                const index = list.value.findIndex((item) => item.token == token);
                if (index == -1) return;
                list.value.splice(index, 1);
                total.value--;
            };

            provide("cancelOperate", cancelOperate);

            const classifyChange = (type) => {
                if (classify.value == type) return;
                page.value = 1;
                list.value = [];
                total.value = 0;
                classify.value = type;
                getList();
            };

            const typeChange = (type) => {
                if (typeValue.value == type) return;
                typeValue.value = type;
                page.value = 1;
                list.value = [];
                total.value = 0;
                classify.value = "";

                getList();
            };

            const copy = (text) => copyForumUid(text);

            const handleDelete = (token) => {
                const index = list.value.findIndex((item) => item.token == token);
                if (index == -1) return;
                list.value.splice(index, 1);
                total.value--;
            };

            provide("handleDelete", handleDelete);

            return { listType, typeChange, page, loading, classifyChange, total, list, classifyList, classify, typeValue, typeList, creationType, gtercoin, info, medallist, schoolTags, introduction, copy };
        },
    });

    appSectionIndex.component("itemForum", itemForum);
    appSectionIndex.component("itemOffer", itemOffer);
    appSectionIndex.component("itemSummary", itemSummary);
    appSectionIndex.component("itemVote", itemVote);
    appSectionIndex.component("itemMj", itemMj);
    appSectionIndex.component("itemTenement", itemTenement);
    appSectionIndex.component("headTop", headTop);
    appSectionIndex.component("loadBox", loadBox);

    appSectionIndex.mount("#homepage-me");
})();