<template>
    <view class="history">
        <view class="list">
            <view class="list_item flex" v-for="(item,index) in list" :key="index">
                <image :src="item.thumbnail" mode="aspectFill" loading="lazy"></image>
                <view class="innews">
                    <text>{{item.title}}</text>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import { getServerWatchHistory } from '@/apis/my'
export default {
    data(){
        return{
            list:[]
        }
    },
    mounted() {
        this.getHistoryList()
    },
    methods:{
        async getHistoryList(){
            const res = await getServerWatchHistory()
            console.log(res,'res');
            this.list = res
        }
    }
}
</script>

<style lang="scss" scoped>
    .history{
        // height: 100%;
        display: flex;
        flex-direction: column;
        .list{
            padding: 20rpx;
            background: #fff;
            .list_item{
                padding: 20rpx;
                border-bottom: 1rpx solid #e2e1d0;
                image{
                    object-fit: contain !important;
                    width: 160rpx;
                    height: 220rpx;
                    margin-right: 30rpx;
                }
                .innews{
                    padding: 10rpx 0;
                    display: flex;
                    flex-direction: column;
                    // justify-content: space-around;
                }
            }
            .list_item:nth-last-child(1){
                border: 0;
            }
        }
    }
</style>