moxuan_takeaway_shanghu/my/store/hdInfo.vue

<template>
	<view>
		<!-- swiper -->
		<view class="sw">
			<swiper :indicator-dots="false" style="width: 100%;height: 100%;" :autoplay="true" :interval="3000"
				:duration="300">
				<swiper-item v-for="(item,index) in imgs">
					<image :src="item" style="width: 100%;height: 100%;" mode="aspectFill"></image>
				</swiper-item>
			</swiper>
		</view>
		<!-- 活动标题 -->
		<view class="title flex justify-center align-center">
			<view class="title-box flex align-center">
				{{info.title}}
			</view>
		</view>
		<!-- 活动内容 -->
		<view class="info flex justify-center">
			<view class="info-box" v-html="content">

			</view>
		</view>
		<!-- 活动类型 -->
		<view class="title flex justify-center align-center">
			<view class="title-box flex align-center">
				<span v-if="info.type=='1'">普通活动</span>
				<span v-if="info.type=='2'">时段优惠</span>
				<span v-if="info.type=='3'">满额优惠</span>
				<span v-if="info.type=='4'">全场优惠</span>
			</view>
		</view>
		<!-- 活动内容 时段优惠-->
		<view class="title flex justify-center align-center" v-if="info.type=='2'">
			<view class="title-box align-center">
				<view v-for="(item,index) in info.timeIntervalInfos" :key="index">
					{{item.startTime}}至{{item.endTime}}打{{item.discountContent}}折
				</view><br/>
			</view>
		</view>
		<!-- 活动内容 满额优惠-->
		<view class="title flex justify-center align-center" v-if="info.type=='3'">
			<view class="title-box flex align-center" v-if="info.fullReductionInfo.type=='1'">
				订单满{{info.fullReductionInfo.minAmount}}减{{info.fullReductionInfo.discountContent}}元
			</view>
			<view class="title-box flex align-center" v-if="info.fullReductionInfo.type=='2'">
				订单满{{info.fullReductionInfo.minAmount}}打{{info.fullReductionInfo.discountContent}}折
			</view>
		</view>
		<!-- 活动内容 全场优惠-->
		<view class="title flex justify-center align-center" v-if="info.type=='4'">
			<view class="title-box flex align-center">
				全场打{{info.globalDiscountsInfo.discountRate}}折
			</view>
		</view>
		<!-- 活动时间 -->
		<view class="title flex justify-center align-center">
			<view class="title-box flex align-center">
				{{info.startTime}}至{{info.endTime}}
			</view>
		</view>

		<!-- 加入按钮 -->
		<view class="submit flex justify-center align-center">
			<view class="submit-box flex justify-center align-center" @click="joinHd()">
				加入活动
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				activityId: '',
				info: {},
				content: '',
				imgs: [],
			};
		},
		onLoad(option) {
			console.log()
			this.activityId = option.activityId
			this.getInfo()
		},
		methods: {
			//加入活动
			joinHd() {
				uni.navigateTo({
					url:'./join_huodong?activityId='+this.activityId
				})
				// let data = {
				// 	activityId: this.activityId,
				// 	shopId: uni.getStorageSync('shopId')
				// }
				// this.$Request.get("/app/activityManage/shopJoinActivity", data).then(res => {
				// 	if (res.code == 0) {
				// 		uni.showModal({
				// 			title: '提示',
				// 			content: '确定加入该活动？',
				// 			complete(ret) {
				// 				if (ret.confirm) {
				// 					uni.showToast({
				// 						title: '加入成功'
				// 					})
				// 					setTimeout(() => {
				// 						uni.navigateBack()
				// 					}, 1000)
				// 				}

				// 			}
				// 		})

				// 	} else {
				// 		uni.showToast({
				// 			title: res.msg,
				// 			icon: 'none'
				// 		})
				// 	}
				// });
			},
			//活动详情
			getInfo() {
				var activityId=this.activityId
				this.$Request.get(`/admin/activity/${activityId}`).then(res => {
					if(res.msg=='success'){
						this.content = res.data.content.replace(new RegExp("img", "g"),
							'img style="width:100%;height:auto;"')
						this.info = res.data
						this.imgs = res.data.image.split(',')
					}else{
						uni.showModal({
						  title: '提示',
						  content: res.msg,
						  success: function (res) {
						    if (res.confirm) {
						    } else if (res.cancel) {
						    }
						  }
						});
					}
				});
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ffffff;
	}

	.sw {
		width: 100%;
		height: 300rpx;
	}

	.title {
		width: 100%;
		height: 100rpx;
		background-color: #ffffff;

		.title-box {
			width: 686rpx;
			height: 100%;
			font-size: 32rpx;
			font-weight: bold;
		}
	}

	.info {
		width: 100%;
		height: auto;

		.info-box {
			width: 686rpx;
			height: 100%;
		}
	}

	.submit {
		width: 100%;
		height: 160rpx;
		position: fixed;
		bottom: 0;
		background-color: #ffffff;

		.submit-box {
			width: 686rpx;
			height: 88rpx;
			background-color: #FCD202;
			border-radius: 40rpx;
		}
	}
</style>