<template>
	<view>
		<scroll-view scroll-y="true" class="hotel-pic">
			<view class="content">
				<view class="left">
					<template v-if="isLine==0">
						<view v-for="(x,i) in jiList" :key="i" class="image-box" @click="previewImage(x.Path)">
							<image :src="x.Path" mode="aspectFill"></image>
						</view>
					</template>
					<template v-else>
						<view v-for="(x,i) in jiList" :key="i" class="image-box" @click="previewImage(x.Url)">
							<image :src="x.Url" mode="aspectFill"></image>
						</view>
					</template>
				</view>
				<view class="right">
					<template v-if="isLine==0">
						<view v-for="(x,i) in ouList" :key="i" class="image-box" @click="previewImage(x.Path)">
							<image :src="x.Path" mode="aspectFill"></image>
						</view>
					</template>
					<template v-else>
						<view v-for="(x,i) in ouList" :key="i" class="image-box" @click="previewImage(x.Url)">
							<image :src="x.Url" mode="aspectFill"></image>
						</view>
					</template>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imageList:[],
				jiList:[],
				ouList:[],
				allImageSrc:[],
				isLine:0
			}
		},
		onLoad(options) {
			if(options.imgObj&&options.isLine==1){
				this.imageList=JSON.parse(decodeURIComponent(options.imgObj))
				this.isLine=1;
				this.getSeperate();
				uni.setNavigationBarTitle({
					title: "线路图片",
				});		
			}else if(options.imgObj&&options.carType){
				this.imageList=JSON.parse(decodeURIComponent(options.imgObj))
				this.isLine=0;
				let text = '接机'
				if(options.carType==2) text = '送机'
				else if(options.carType==3) text = '包车'
				this.getSeperate();
				uni.setNavigationBarTitle({
					title: text+"图片",
				});		
			}else if(options.Evaluation){
				this.imageList=JSON.parse(options.imgObj);
				this.isLine=0;
				this.getSeperate();
				uni.setNavigationBarTitle({
					title: "评价图片",
				});	
			} else{
				this.imageList=JSON.parse(options.imgObj);
				this.isLine=0;
				this.getSeperate();
				uni.setNavigationBarTitle({
					title: "酒店图片",
				});		
			}
		},
		created() {
		
		},
		mounted () {
			
		},
		methods: {
			getSeperate(){
				this.imageList.forEach((x,i)=>{
					if(this.isLine==1){
						this.allImageSrc.push(x.Url)
					}else{
						this.allImageSrc.push(x.Path)
					}
					if(i%2==0){
						this.jiList.push(x)
					}else{
						this.ouList.push(x)
					}
				})
			},
			previewImage(src) {
				uni.previewImage({
					urls: this.allImageSrc,
					current: src,
					longPressActions: {
						itemList: ["发送给朋友", "保存图片", "收藏"],
						success: function(data) {
							
						},
						fail: function(err) {
							console.log(err.errMsg);
						},
					},
				});
			}
		},
	}
</script>

<style>
	.hotel-pic{
		height: 100vh;
		width: 100vw;
	}
	.hotel-pic .content{
		display: flex;
		align-items: flex-start;
		padding: 44rpx;
		padding-top: 14rpx;
	}
	.hotel-pic .content .left{
		flex:1;
		margin-right: 15rpx;
	}
	.hotel-pic .content .right{
		flex:1;
		margin-left: 15rpx;
	}
	.hotel-pic .content .image-box{
		width:100%;
		margin-top: 30rpx;
	}
	.hotel-pic .content .image-box image{
		width: 100%;
		border-radius: 20rpx;
		height:200rpx;
	}
</style>
