moxuan_takeaway_shanghu/my/store/join_huodong.vue

<template>
	<view class="padding">
		<view class="text-white padding bg radius">
			<u-form :model="shop" label-position="top">
				<!-- <u-form-item label="参与活动的商品：">
					<view class="list-box-c-r" @click="selectShang">
						选择
					</view>
				</u-form-item> -->
				<u-form-item label="活动名称：">
					<text>{{info.title}}</text>
				</u-form-item>
				<u-form-item label="活动图片：">
					<view class="imgs" v-for="(item,index) in info.image.split(',')" :key="index">
						<img width="100%" class="images" height="100%" :src="item" alt="">
					</view>
				</u-form-item>
				<u-form-item label="活动详情：">
					<text v-html="info.content"></text>
				</u-form-item>
				<u-form-item label="参与活动的优惠：">
					<text v-if="info.type=='1'">普通活动</text>
					<text v-if="info.type=='2'">时段优惠</text>
					<text v-if="info.type=='3'">满额优惠</text>
					<text v-if="info.type=='4'">全场优惠</text>
				</u-form-item>
				<u-form-item label="适用情况：" v-if="info.type=='2' || info.type=='3' || info.type=='4'">
					<u-radio-group v-model="suitType">
						<u-radio name='1'>皆适用</u-radio>
						<u-radio name='2'>仅争对第一次下单</u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="活动限制：" v-if="info.type=='2' || info.type=='3' || info.type=='4'">
					<u-radio-group v-model="limitType">
						<u-radio name='1'>无限制</u-radio>
						<u-radio name='2'>每天使用</u-radio>
						<input v-model="limitNum" style="background-color: rgba(128, 128, 128, 0.3);" type="number" />
						<text>次</text>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="活动日期：">
					<text>{{info.startTime}}至{{info.endTime}}</text>
				</u-form-item>
			</u-form>
		</view>


		<u-button @click="submit" class="margin-top" :custom-style="customStyle" shape="square" :hair-line="false">确认
		</u-button>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				customStyle: {
					backgroundColor: '#FFCC00',
					color: '#000000',
					border: 0
				},
				info: {},
				activityId:'',
				suitType:'1',//适用情况
				limitType:'1',//使用限制
				limitNum:'',
				actShopid:'',//选择商品的id
				shunxu:'',
			}
		},
		onLoad(option) {
			this.activityId = option.activityId
			this.shunxu=option.shunxu
			this.getInfo()
		},
		methods: {
			//活动详情
			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.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				});
			},
			//参与活动
			submit(){
				var shopid=[uni.getStorageSync('shopId')]
				if (this.limitType == '') {
					uni.showToast({
						title: '有限制时不能为空',
						icon: 'none'
					})
					return
				}
				let data = {
					"activityId": this.activityId,
					"limitType": this.limitType,
					"limitValue": this.limitNum,
					"shopIds": shopid,
					"suitType": this.suitType
				}
				this.$Request.postJson("/admin/activity-shop/join", data).then(res => {
					if(res.code==0){
						this.actShopid=res.data
						uni.showToast({
							title: '操作成功',
							icon: 'success'
						})
						uni.navigateBack({
							delta: 1
						})
					}else{
						uni.showModal({
						  title: '提示',
						  content: res.msg,
						  success: function (res) {
						    if (res.confirm) {
						    } else if (res.cancel) {
						    }
						  }
						});
					}
				});
			},
		}
	}
</script>

<style>
	page {
		background-color: #F5F5F5;
	}
	
	.bg {
		background-color: #FFFFFF;
	}
	
	
	.tabBox {
		border: 1rpx solid #999999;
		padding: 15rpx 20rpx;
		border-radius: 15rpx;
		font-size: 28rpx;
	}
	
	.btnnum {
		color: #005DFF;
		border: 1rpx solid #005DFF;
	}
	.list-box-c-r {
		width: 120rpx;
		height: 62rpx;
		background: #FCD202;
		line-height: 62rpx;
		text-align: center;
		font-size: 26rpx;
		border-radius: 24rpx;

	}
</style>