const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provide } = Vue;
import { itemForum } from "../component/item-forum/item-forum.js";
import { itemOffer } from "../component/item-offer/item-offer.js";
import { itemSummary } from "../component/item-summary/item-summary.js";
import { itemVote } from "../component/item-vote/item-vote.js";
import { itemMj } from "../component/item-mj/item-mj.js";
import { itemTenement } from "../component/item-tenement/item-tenement.js";
import { headTop } from "../component/head-top/head-top.js";

const appSectionIndex = createApp({
    setup() {
        onMounted(() => {
            init();
        });

        let isLogin = ref(true);
        let realname = ref(1); // 是否已经实名
        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"]) isNeedLogin.value = false;
                else ajax_login();
            } else ajax_login();
        };

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

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

        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;

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

            getCollectList();
        };

        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");

        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);

        const getCollectList = () => {
            const limit = 10;
            ajax("/v2/api/forum/postUserCollect", {
                page: page.value,
                type: classify.value,
            }).then((res) => {
                if (res.code != 200) return;
                const data = res.data || [];
                console.log("data", data);
                total.value = data.count;
                list.value = [...list.value, ...data.data];
                page.value = data.count > data.page * limit ? page.value + 1 : 0;
            });
        };

        const cancelOperate = (token) => {
            console.log("token", token);
        };

        provide("cancelOperate", cancelOperate);

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

        return { 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.mount("#homepage-me");