cnic_buyer/pages/specialTitle/index.vue

<template>
	<view class="body">
		<view class="one">
			<image src="../../static/img/left_white.png" mode="" @click="back()"></image>
			<view class="one_text">{{ title }}</view>
		</view>
		<!-- <uni-nav-bar left-icon="left" @clickLeft="back()" backgroundColor="#000"  
		color="#fff" :title="title" :fixed="true" :border="false" :top="100 +rpx"/> -->
		<view v-for="(item,index) in list " :key="item.zone_id">
			<view v-for="(item1,index1) in item.blocks " :key="item1.block_pic">
				<view style="position: relative;" class="ONEPIC" v-if="item.zone_code=='ONEPIC' && item.zone_status=='NORMAL'"
					:style="{height:(item.zone_code=='ONEPIC')?item.zone_column+'rpx':''}">
					<!-- class="discount page_padding" -->
					<image :src="item1.block_pic" mode="" @click="imgTo(item1)">
						<a style="display: block;width: 100%;height: 100%;top: 0;position: absolute;" :href="item1.block_link"></a>
					</image>
				</view>
			</view>
			<!-- TWOPIC -->
			<view class="TWOPIC"
				:style="{height:(item.zone_code=='TWOPIC'&& item.zone_status=='NORMAL')?item.zone_column+'rpx':''}"
				v-if="item.zone_code=='TWOPIC' && item.zone_status=='NORMAL'">
				<image :src="item1.block_pic" @click="imgTo(item1)" mode="" v-for="(item1,index1) in item.blocks"
					:key="item1.block_id"></image>
			</view>
			<!-- THREEPIC -->
			<view class="THREEPIC"
				:style="{height:(item.zone_code=='THREEPIC'&& item.zone_status=='NORMAL')?item.zone_column+'rpx':''}"
				v-if="item.zone_code=='THREEPIC' && item.zone_status=='NORMAL'">
				<image :src="item1.block_pic" @click="imgTo(item1)" mode="" v-for="(item1,index1) in item.blocks"
					:key="item1.block_id"></image>
			</view>
			<!-- FOURPIC -->
			<view class="FOURPIC"
				:style="{height:(item.zone_code=='FOURPIC'&& item.zone_status=='NORMAL')?item.zone_column+'rpx':''}"
				v-if="item.zone_code=='FOURPIC' && item.zone_status=='NORMAL'">
				<image :src="item1.block_pic" mode="" @click="imgTo(item1)" v-for="(item1,index1) in item.blocks"
					:key="item1.block_id"></image>
			</view>
			<!-- FIVEPIC -->
			<view class="FIVEPIC"
				:style="{height:(item.zone_code=='FIVEPIC'&& item.zone_status=='NORMAL')?item.zone_column+'rpx':''}"
				v-if="item.zone_code=='FIVEPIC' && item.zone_status=='NORMAL'">
				<image :src="item1.block_pic" mode="" @click="imgTo(item1)" v-for="(item1,index1) in item.blocks"
					:key="item1.block_id"></image>
			</view>
			<!-- SIXPIC -->
			<view class="SIXPIC"
				:style="{height:(item.zone_code=='SIXPIC'&& item.zone_status=='NORMAL')?item.zone_column+'rpx':''}"
				v-if="item.zone_code=='SIXPIC' && item.zone_status=='NORMAL'">
				<image :src="item1.block_pic" mode="" @click="imgTo(item1)" v-for="(item1,index1) in item.blocks"
					:key="item1.block_id"></image>
			</view>
		</view>
	</view>
	<!-- </view> -->
</template>
<script>
	import {
		defaultRequest,
		defaultRequest4
	} from '../../api/index.js'
	export default {
		data() {
			return {
				list: [],
				data: {
					_action: 'getpagedata',
					pagecode: ''
				},
				title: ''
			}
		},
		onLoad(e) {
			console.log(e)
			this.title = e.title
			this.data.pagecode = e.id
			this.getpage()
		},
		methods: {
			getpage() {
				let imglist
				defaultRequest(this.data).then(res => {
					if (res.error == 0) {

						console.log(res, '数据')
						this.list = res.data.zones
						console.log(this.list)
						this.list.map(item => {
							console.log(item, item.zone_code, item.blocks.length)
						})
					}
				})
			},
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			imgTo(item) {
				console.log(item, 'item数据？')
				// console.log(item.block_link)
				// console.log(item.block_link.includes('dope.youhui'))
				let goodid
				if (item.goodid) {
					uni.navigateTo({
						// url: '../productDetails/index?goodid=' + item.goodid
						url: './paypalWebview?src' + item.goodid
					})
				} else if (item.block_link) {
					const i = item.block_link.indexOf('?')
					goodid = item.block_link.substring(i);
					////console.log(item.block_link)
					if (item.block_link.includes('goodslist')) {
						uni.navigateTo({
							url: '../category/productList' + goodid + '&tag=1'
						})
					} else if (item.block_link.includes('goodid')) {
						uni.navigateTo({
							url: '../productDetails/index' + goodid + '&img=1'
						})
					} else if (item.block_link.includes('dope.youhui')) {
						uni.navigateTo({
							url: './pickUpCentre'
						})
					} else if (item.block_link.includes('dope.adspecial')) {
						uni.navigateTo({
							url: '../specialTitle/index2' + goodid
						})
					}
				}

			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #000;
		height: 100vh;
		// margin: 20rpx;
	}

	.ONEPIC {
		width: 100%;
		height: 100%;
		margin: -12rpx 0;
		z-index: 1;

		image {
			height: 100%;
			width: 100%;
		}

		&:nth-last-child() {
			margin-bottom: 10rpx;
		}
	}

	.TWOPIC {
		width: 100%;
		display: flex;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.THREEPIC {
		width: 100%;
		display: flex;
		justify-content: space-between;

		image {
			width: 100%;
			height: 100%;

		}

	}

	.FOURPIC {
		width: 100%;
		display: flex;
		justify-content: space-between;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.FIVEPIC {
		width: 100%;
		display: flex;
		justify-content: space-between;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.SIXPIC {
		width: 100%;
		display: flex;
		justify-content: space-between;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.body {
		padding-top: 150rpx;
		height: auto;
		// height: 100vh;
		background-color: #000;
	}
</style>