// my-component.js
// 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
const { defineComponent, ref } = Vue;

// 定义组件（直接使用模板）
export const itemHead = defineComponent({
    name: "item-head",
    props: {
        itemdata: {
            type: Object,
            default: () => {},
        },
    },

    setup(props) {
        let sectionn = ref([]);
        let tags = ref([]);
        let item = ref({ ...props.itemdata });

        let timestamp = ref(strtimeago(item.value.release_at, 4));

        if (item.value.type == "tenement") timestamp = timeago(item.value.updatetime, 2);
        sectionn.value = item.value.sectionn || [];

        const sectionSet = new Set(sectionn.value);
        tags.value = item.value.tags.filter((tag) => !sectionSet.has(tag));

        return { item, timestamp, sectionn, tags };
    },

    template: `<div class="item-head flexacenter">    <img class="avatar" :src="item.user.avatar || item.avatar" />    <div class="name">{{ item.user.nickname || item.nickname || '匿名用户' }}</div>    <!-- <img class="group" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c_ZMtdXfqqsgFptxhcq_cQnrlcPJ0DVESBq_D-81qNDQyOQ~~" /> -->    <div class="time">{{ timestamp }}</div>    <div class="flex1"></div>    <div class="view flexacenter">        <img class="icon" src="https://app.gter.net/image/miniApp/offer/eye-icon.svg" />        <div class="text">{{ item.views }}</div>    </div>    <div class="btn flexcenter">        <img class="icon" src="https://app.gter.net/image/miniApp/offer/dot-dot-dot-gray.png" />    </div>    <!-- <template v-if="show">                        <div class="mask" catch:tap="cutShow" catch:touchmove="touchmove"></div>                        <div class="operate" catch:tap="true">                            <div class="item" bind:tap="report">举报</div>                            <template v-if="ismanager">                                <div class="item" bind:tap="hide">{{ item.hidden == 0 ? '隐藏' : '显示' }}</div>                                <div class="item" bind:tap="recommend">{{ item.recommend == 1 ? '取消' : '' }}推荐</div>                                <div class="item" bind:tap="essence">{{ item.best == 1 ? '取消' : '' }}精华</div>                            </template>                        </div>                    </template> --></div><div class="label flexflex" v-if="sectionn.length || tags.length">    <img class="item icon" src="./img/recommend-icon.png" />    <img class="item icon" src="./img/essence-icon.png" />    <div class="item blue" v-for="(item, index) in sectionn" :key="item">{{ item }}</div>    <div class="item" v-for="(item, index) in tags" :key="item">{{ item }}</div></div>`,
});