<template>
	<view class="mult_content">
		<view class="mult_item" v-for="(item, key) in list"  :key="key" :style="{'left':item.left*rate+'rpx','top':item.top*rate+'rpx','right':item.right*rate+'rpx','bottom':item.bottom*rate+'rpx','width':item.width*rate+'rpx','height':item.height*rate+'rpx'}" @click="item.link ? $jump(item.link) : null">
			<image :src="item.img_url"></image>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			wrapper_props: {
				type: Object
			}
		},
		data() {
			return {
				rate: 3,
				style_setting: this.wrapper_props.style_setting,
				list: this.wrapper_props.list
			}
		},
		mounted() {
			const { type }  = this.style_setting;
			const rate = 750 / (type + 3);
			this.rate = rate;
		}
	}
</script>

<style lang="less" scoped>
	.mult_content {
		position: relative;
		height: 750rpx;
		.mult_item {
			position: absolute;
			image {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>