caimei-applets-caimei/pages/h5/activity/activity-entry.vue

<template>
	<view class="container cashier">
        <view class="container-banner" :style="{paddingTop:CustomBar + 230 +'px'}">
            <view class="login-input">
            	<input type="text" 
            		   v-model="params.name"
            		   maxlength="20" 
            		   class="input" 
            		   placeholder="请填写您的姓名"
            	/>
            </view>
            <view class="login-input">
            	<input type="number" 
            		   v-model="params.shareCode"
            		   maxlength="11" 
            		   class="input" 
            		   placeholder="请填写您的手机号"
            	/>
            </view>
            <view class="login-btn"  @click="handleEntry">大会签到</view>
        </view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				shopOrderId:0,
				payType:'',
				payStatus:true,
				payBtnStatus:false,
				amuntMoney:0,
				successText:'订单支付失败',
				isIphoneX:this.$store.state.isIphoneX,
				CustomBar:this.CustomBar,// 顶部导航栏高度
				params:{
                    name:'',
                    shareCode:'' 
                }
			}
		},
		filters:{
			NumFormat(value) {
			    //处理金额
			    if (value) {
			        return Number(value).toFixed(2)
			    } else {
			        return '0.00'
			    }
			}
		},
		onLoad(option) {
			this.initData(option)
		},
		methods:{
			initOrderInfo() {
			    this.orderInfo = uni.getStorageSync('orderInfo')
			    uni.removeStorageSync('orderInfo')
			},
            handleEntry(){
                if(!this.params.name){
                	this.$util.msg('请填写您的姓名',2000) 
                	return
                }
                if(!this.params.shareCode){
                	this.$util.msg('请填写您的联系方式',2000) 
                	return
                }
            },
			initData(option){
				const data = JSON.parse(option.data)
				this.orderId = data.data.orderId
				this.shopOrderId = data.data.shopOrderId
				this.payType = data.data.type
				this.amuntMoney = data.data.payAmount
				if(this.payType == 'success'){
					this.payStatus = true
					this.successText = '订单支付成功'
				}else{
					this.payStatus = false
					this.successText = '订单支付失败'
				}
				this.PayOrderCheckoutCounter(this.shopOrderId)
			},
			async PayOrderCheckoutCounter(shopOrderId){//初始化支付信息
				try{
					const res = await this.PayService.PayOrderCheckoutCounter({ shopOrderId : shopOrderId })
					const data = res.data.shopOrder
					const status = data.status //子订单状态
					this.mapStateArr.forEach(value => {
						if(status === value){
							this.payBtnStatus = true
						}
					})
					this.isRepuest = true
				}catch(error){
					this.$util.msg(error.msg,2000)
				}
			},
			toAgainPay(){
				this.$api.reLaunch(`/pages/user/order/order-pay-list?shopOrderId=${this.shopOrderId}`)
			},
			details(){
				this.$api.reLaunch('/pages/user/order/order-details?type=share&shopOrderId='+this.shopOrderId)
			}
		},
		onShow() {
			
		}
	}
</script>

<style lang="scss">
	page{
        background-color: #3d68eb;
		height: auto !important;
	}
    .container-banner{
        width: 100%;
        height: 1142rpx;
        background: url(https://admin.caimei365.com/userfiles/1/images/photo/2024/08/ziluo_bg.jpg) no-repeat;
        background-size: contain;
        box-sizing: border-box;
        padding: 0 150rpx;
        .login-input{
        	width: 100%;
        	height: 88rpx;
        	padding:0 24rpx;
        	margin: 0 auto;
        	margin-bottom: 60rpx;
        	background: #FFFFFF;
            box-sizing: border-box;
            border-radius: 50rpx;
        	.input{
        		width: 100%;
        		height: 100%;
        		background: #FFFFFF;
        		font-size: $font-size-28;
        		line-height: 88rpx;
        		color: #333333;
                 border-radius: 50rpx;
        	}
        }
        .login-btn {
        	width: 100%;
        	height: 88rpx;
        	font-size: $font-size-28;
        	line-height: 88rpx;
        	color: #ffffff;
        	margin: 0 auto;
        	margin-bottom: 24rpx;
        	text-align: center;
        	background-color: #e10078;
        	border-radius: 50rpx;
        }
    }
	
</style>