<template>
    <view class="listItem">
        <!-- <video  :src="url" :show-fullscreen-btn="true"></video> -->
		<view v-if="type == '2'" class="video-container">
			<image :src="url" mode="aspectFill" class="video"></image>
			<image src="/static/videoPlay.png" mode="aspectFill" class="play-video"></image>
		</view>
        <image v-else :src="url" mode="aspectFill"></image>
    </view>
</template>
<style lang="scss" scoped>
.listItem{
    width: 365rpx;
    height: 500rpx;
	overflow: hidden;
    > image {
        width: 100%;
        height: 100%;
		margin-bottom: 20rpx;
    }
	.video-container {
		width: 100%;
        height: 100%;
		margin-bottom: 20rpx;
		position: relative;
		.video {
			width: 100%;
        	height: 100%;
		}
		.play-video {
			position: absolute;
			width: 100rpx;
			height: 100rpx;
			z-index: 19;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
	}
}
</style>
<script>
export default {
    name:"listItem",
    data(){
        return {

        }
    },
    props:['url','type']
}
</script>