<template>
    <view>
        <view class="new-item" v-for="(item, index) in lists" :key="index" @click="$emit('onTopic', item)">
        	<image class="new-cover" :src="item.cover ? item.cover : '/static/find/default_img.png'" mode="aspectFill"></image>
        	<view class="new-title">{{ item.name }}</view>
        	<view class="new-tool">
        		<text>阅读 {{ item.clicks }}</text>
        		<text>赞 {{ item.favorites }}</text>
        	</view>
        </view>
    </view>
</template>

<script>
	export default{
		props:{
			lists: {
				type	: Array,
				required: true,
				default : () => {
					return []
				}
			}
		},
		mounted() {
			
		}
	}
</script>

<style lang="scss" scoped>
    .new-item {
    	position: relative;
    	margin-top: $margin - 10;
    	background: #f5fdfa;
    	border-radius: $radius;
    	padding: $padding ($padding * 2 + 200rpx) $padding $padding;
    	.new-cover {
    		position: absolute;
    		right: $padding;
    		top: $padding;
    		width: 200rpx;
    		height: 150rpx;
    		border-radius: $radius;
    	}
    	.new-title {
    		font-size: $title-size-lg;
    		line-height: 45rpx;
    		min-height: 100rpx;
    		margin-bottom: 10px;
    		font-weight: bold;
    		color: $text-color;
    	}
    	.new-tool {
    		color: $text-gray;
    		font-size: $title-size-sm;
    		line-height: 40rpx;
    		text {
    			margin-right: $margin/2;
    		}
    	}
    }
</style>
