const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch } = 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";

const appSectionIndex = createApp({
    setup() {
        let signInAlreadyState = ref(false);

        let authorInfo = ref({});
        let info = ref({});
        let ismyself = ref(false);
        let labelList = ref({
            sectionn: "",
            tags: [],
        });

        let timestamp = ref("");
        let updatedTime = ref("");
        let token = "";

        onMounted(() => {
            init();
        });

        const init = () => {
            ajaxget(`https://api.gter.net/v2/api/forum/getTopicDetails?uniqid=${"9GPSfyaGDTz5"}`).then((res) => {
                console.log("res", res);
                const data = res.data;

                console.log("data", data);

                let targetInfo = data.info;

                if (!targetInfo.hidden) targetInfo.hidden = 0;

                // 替换换行
                targetInfo.content = targetInfo.content?.replace(/\n/g, "<br>") || "";

                if (!targetInfo.content) {
                    targetInfo.content = targetInfo.title;
                    targetInfo.title = "";
                }

                authorInfo.value = Array.isArray(data.authorInfo) ? null : data.authorInfo;
                ismyself.value = data.ismyself || false;
                labelList.value = {
                    sectionn: targetInfo.sectionn,
                    tags: targetInfo.tags,
                };

                timestamp.value = strtimeago(targetInfo.release_at, 4);
                updatedTime.value = targetInfo.updated_at ? strtimeago(targetInfo.updated_at, 4) : null;
                info.value = targetInfo;

                token = data.token;

                // if (this.islogin) this.getTopicOperation();
            });
        };

        return { signInAlreadyState, authorInfo, info, timestamp, updatedTime, labelList };
    },
});
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.mount("#details");