<template>
    <div>
        <!-- 帖子 -->
        <div v-for="(item, index) in list" :key="index">
            <template v-if="item.type == 'ad'">
                <a :href="item.url"><img class="banner-box" :src="item.image"></a>
            </template>

            <div class="card-box" v-else @click.stop="toDetail(item.tid)">
                <div class="top moreEllipsis">
                    <div class="top-label" v-if="item.typename">{{ item.typename }}</div>
                    <div class="top-title">{{ item.subject }}</div>
                </div>
                <div class="center">
                    <div class="center-text moreEllipsis">{{ item.message }}</div>
                </div>
                <div class="bottom">
                    <div class="bottom-box">
                        <img class="icon-head" :src="item.avatar">
                        <div class="bottom-name">{{ item.author }}</div>
                    </div>
                    <div class="bottom-box">
                        <div class="bottom-right">
                            <svg-icon icon-class="look" class-name="icon-look"></svg-icon>
                            <div>{{ item.views }}</div>
                        </div>
                        <div class="bottom-right">
                            <svg-icon icon-class="msg" class-name="icon-msg"></svg-icon>
                            <div>{{ item.replies }}</div>
                        </div>
                    </div>
                </div>
                <!-- 精华 -->
                <div class="rightTop" v-if="item.digest > 0">
                    <img class="rightTop-img" src="@/assets/img/icon/topRight .png">
                    <span>精华</span>
                </div>
            </div>
        </div>


        <!-- <div class="card-box">
            <div class="top moreEllipsis">
                <div class="top-label">经验</div>
                <div class="top-title">23fall 美国llm 求定位</div>
            </div>
            <div class="center">
                <div class="center-text-visible">
                    回复可见
                </div>
            </div>
            <div class="bottom">
                <div class="bottom-box">
                    <svg-icon icon-class="test-head" class-name="icon-head"></svg-icon>
                    <div class="bottom-name">匿名用户</div>
                </div>
                <div class="bottom-box">
                    <div class="bottom-right">
                        <svg-icon icon-class="look" class-name="icon-look"></svg-icon>
                        <div>1552</div>
                    </div>
                    <div class="bottom-right">
                        <svg-icon icon-class="msg" class-name="icon-msg"></svg-icon>
                        <div>12</div>
                    </div>
                </div>
            </div>
        </div> -->
        <!-- 广告 -->
        <!-- <div class="banner-box">
            <svg-icon icon-class="test-banner" class-name="banner"></svg-icon>
        </div> -->
    </div>
</template>

<script>
export default {
    name: 'IndexList',
    data() {
        return {

        };
    },
    props: ["list"],

    mounted() {

    },

    methods: {
        // 跳转详细
        toDetail(tid) {
            this.$router.push(`/detail?tid=${tid}`)
        },
    },
};
</script>

<style lang="scss" scoped></style>