<template>
    <div class="special">
        <van-sticky>
          <m-search @onSearch="onSearch" /> 
        </van-sticky>
        <div class="specialList">
            <van-list v-model="loading"  v-if="show" key="teachcer"
                :finished="finished"
                finished-text="- 没有更多数据了 -"
                :immediate-check="false"
                @load="getNewsList()">
                <!-- :href="origin + '/#/specialdetail/' + item.id" -->
                <a v-for="(item, index) in dataList" :key="index" @click="onHref(item)"
                     class="item-container">
                    <h2>{{ item.title }}</h2>
                    <div class="topinfo">
                        <p>{{ item.updateTime }}</p>
                        <p></p>
                    </div>
                    <!-- <div class="imgWrap" :class="[params.type == 1 ? 'imgWrapDefault' : '']" v-if="item.coverImage">
                        <van-image :src="item.coverImage">
                            <template v-slot:loading>
                                <van-loading type="spinner" size="20" />
                            </template>
                        </van-image>
                    </div> -->
                </a>
            </van-list>
            <m-empty v-else key="teachcer" />
        </div>
    </div>
</template>
<script>
// import MHeader from '@/components/MHeader'
import MSearch from '@/components/MSearch'
import MEmpty from '@/components/MEmpty'
import { newsList } from '@/api/teacher'
import cleanDeep from 'clean-deep'
// import { browser }  from '@/common/common'
export default {
    name: 'special',
    components: { 
        // MHeader, 
        MSearch, MEmpty },
    data() {
        return {
            search: null, // 查询信息
            show: true, // 判断是否有数据
            dataList: [], // 老师列表
            loading: false,
            finished: false,
            origin: window.location.origin,
            params: {
                type: 19,
                status: 1,
                page: 1,
                rows: 10
            },
            typeList: [],
        }
    },
    async mounted() {
        let params = this.$route.query
        if (params.Authorization) {
            localStorage.setItem('Authorization', decodeURI(params.Authorization))
            localStorage.setItem('userInfo', decodeURI(params.Authorization))
        } else {
            localStorage.removeItem('Authorization')
            localStorage.removeItem('userInfo')
        }
        document.title = '公告列表'

        await this.getNewsList()
    },
    methods: {
        onSearch(value) {
            this.show = true
            this.dataList = [] // 重置数据
            this.search = value
            this.params.page = 1
            this.finished = false
            this.getNewsList()
        },
        onHref(item) {
            if(item.linkUrl) {
              window.location.href = item.linkUrl
            } else {
              this.$router.push('/specialdetail?id=' + item.id)
            }
        },
        async getNewsList() {
            let params = this.params
            params.search = this.search
            await newsList(cleanDeep(params)).then(res => {
                let result = res.data
                this.loading = false
                if(result.code == 200) {
                    // 重点这句，判断是不是重复请求了
                    if (this.dataList.length > 0 && result.data.pageNo == 1) {
                        return;
                    }

                    this.dataList.push(...result.data.rows)
                    if(params.page >= Math.ceil(result.data.total / params.rows)) {
                        this.finished = true
                    }
                    this.params.page++
                } else {
                    this.finished = true
                }
                if(this.dataList.length <= 0) {
                    this.show = false
                }
            })
        }
    },
}
</script>
<style lang="less" scoped>
.special {
    min-height: 100vh;
}
.item-container {
    margin-top: .08rem;
    display: block;
    padding: .15rem;
    background: #fff;
    h2 {
        font-size: 0.18rem;
        color: rgba(68, 68, 68, 1);
        line-height: 0.25rem;
        font-weight: 600;
    }
}
.topinfo {
    margin-top: 0.05rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    font-size: 12px;
    font-family: PingFang-SC;
    font-weight: 500;
    color: rgba(170, 170, 170, 1);
    line-height: 17px;
}

// .imgWrap {
//     max-height: 1.75rem;
//     margin-top: 0.08rem;
//     border-radius: 0.05rem;
//     overflow: hidden;
//     display: flex;
//     justify-content: center;
//     align-items: center;
//     img {
//         width: 100%;
//     }
// }
// .imgWrapDefault {
//     align-items: baseline;
// }
</style>