nbjk-xcx/src/pages/future/index.vue

<template>
	<view class="content iPhoneX">
		<view v-if="isWatchFutureVideo == '0'" class="video">
			<video :initial-time="videoTime" id="futureVideo" autoplay show-play-btn :controls="false"
				:src="videoSrc"></video>
			<view style="width: 100%;padding-top: 15rpx;display: flex;" class="">
				<button @click="resetVideo" type="primary" style="width: 150rpx;">重播</button>
				<button @click="() => {
					isWatchFutureVideo = '1'
				}" type="warn" style="width: 150rpx;">关闭</button>
			</view>
		</view>
		<image class="bg" src="https://ndata.zzxcx.net/xpgx-xcx/index/bg1.png"></image>
		<image mode="widthFix" class="logo" src="https://ndata.zzxcx.net/xpgx-xcx/index/bg5.png"></image>
		<view class="form">
			<view class="content">
				<image class="content-title" mode="widthFix" src="https://ndata.zzxcx.net/xpgx-xcx/index/title.png"></image>
				<view class="content-inputs">
					<view class="content-inputs-row">
						<view class="content-inputs-row-label">命主姓名</view>
						<view>
							<input v-model="form.username" class="content-inputs-row-input" />
						</view>
					</view>
					<view class="content-inputs-row">
						<view class="content-inputs-row-label">起盘方式</view>
						<view @click="selectRadioByForm" class="content-inputs-row-radioGroup">

							<view data-value="公历" data-field="type" class="content-inputs-row-radioUnchecked"
								:class="{ 'content-inputs-row-radioChecked': form.type == '公历' }" checked="true">
								公历排盘 <!-- <view style="width: 100%;height: 100%;"></view> -->
							</view>
							<view data-value="农历" data-field="type" class="content-inputs-row-radioUnchecked"
								:class="{ 'content-inputs-row-radioChecked': form.type == '农历' }" checked="true">
								农历排盘 <!-- <view style="width: 100%;height: 100%;"></view> -->
							</view>
						</view>
					</view>
					<view style="height: auto;" class="content-inputs-row">
						<view class="content-inputs-row-label">出生时间</view>
						<view style="display: flex;flex-wrap: wrap;justify-content: space-between;" class="">
							<picker @change="changeFormBirthDay" :value="form.birthday" fields="day" mode="date">
								<view class="content-inputs-row-menu">
									{{ form.birthday.split('-')[0] }}年 <image
										style="height: 15rpx;width: 22rpx;margin-left: 8rpx;" :src="downArrowImg"></image>
								</view>
							</picker>
							<picker @change="changeFormBirthDay" :value="form.birthday" fields="day" mode="date">
								<view class="content-inputs-row-menu">
									{{ form.birthday.split('-')[1] }}月 <image
										style="height: 15rpx;width: 22rpx;margin-left: 8rpx;" :src="downArrowImg"></image>
								</view>
							</picker>
							<picker @change="changeFormBirthDay" :value="form.birthday" fields="day" mode="date">
								<view class="content-inputs-row-menu">
									{{ form.birthday.split('-')[2] }}日 <image
										style="height: 15rpx;width: 22rpx;margin-left: 8rpx;" :src="downArrowImg"></image>
								</view>
							</picker>
							<picker @change="changeFormBirthHour" mode="time">
								<view class="content-inputs-row-menu">
									{{ form.birthHour }} <image style="height: 15rpx;width: 22rpx;margin-left: 8rpx;"
										:src="downArrowImg"></image>
								</view>
							</picker>
							<navigator style="height: 80rpx;" open-type="navigate" url="/otherPages/forecastHistory/index">
								<button hover-class="none"
									style="background: #EEBB65;color: #fff;line-height: 80rpx;height: 80rpx;">
									历史记录
								</button>
							</navigator>
						</view>
					</view>
					<view class="content-inputs-row" style="flex-wrap: wrap;">
						<view class="content-inputs-row-label">命主性别</view>
						<view @click="selectRadioByForm" class="content-inputs-row-radioGroup">

							<view data-field="sex" data-value="1" class="content-inputs-row-radioUnchecked"
								:class="{ 'content-inputs-row-radioChecked': form.sex == 1 }" checked="true">
								男 <!-- <view style="width: 100%;height: 100%;"></view> -->
							</view>
							<view data-field="sex" data-value="2" class="content-inputs-row-radioUnchecked"
								:class="{ 'content-inputs-row-radioChecked': form.sex == 2 }" checked="true">
								女 <!-- <view style="width: 100%;height: 100%;"></view> -->
							</view>
						</view>
						<view style="color: red;text-align: right;width: 100%;font-size: 24rpx;padding-right: 90rpx;">
							排盘结果男女有别，请正确选择</view>
					</view>
					<view class="content-inputs-row">
						<view class="content-inputs-row-label">是否保存</view>
						<view @click="selectRadioByForm" class="content-inputs-row-radioGroup">

							<view data-field="isSave" data-value="1" class="content-inputs-row-radioUnchecked"
								:class="{ 'content-inputs-row-radioChecked': form.isSave == 1 }" checked="true">
								是 <!-- <view style="width: 100%;height: 100%;"></view> -->
							</view>
							<view data-field="isSave" data-value="0" class="content-inputs-row-radioUnchecked"
								:class="{ 'content-inputs-row-radioChecked': form.isSave == 0 }" checked="true">
								否 <!-- <view style="width: 100%;height: 100%;"></view> -->
							</view>
						</view>
					</view>
					<view class="content-button">
						<!-- <navigator url="/pages/forecast/index"> -->
						<view @click="submitForm" class="content-button-submit">开始排盘</view>
						<!-- </navigator> -->

					</view>
				</view>

			</view>

		</view>

		<custom-tab-bar></custom-tab-bar>
		<view style="height: 48px;width: 100%;">

		</view>
	</view>
</template>

<script>
import Vue from 'vue';
import calendar from 'js-calendar-converter'
export default {
	data() {
		return {
			videoSrc: "https://ndata.zzxcx.net/xpgx-xcx/video/8zi.mp4",
			videoTime: 0,
			isWatchFutureVideo: uni.getStorageSync("isWatchFutureVideo") || "0",
			title: '国学',
			downArrowImg: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAgCAYAAABpRpp6AAAAAXNSR0IArs4c6QAABI5JREFUWEfVmHtsFFUUxr8zQ3Gh7c62UUNIiFHUVKLGVirBNyERoZ3lITXRBBIkKUkjuo8afBCtkGCi3ZlCYzTiH2Ag0ZQ0sLOV+IqPEJFUqM8QEyMqqGkIdmdLa0u7c/S2bGnLXPfZGu9/u+fx/ebsd+/MLOF/tijFG15ZssBx1O0EqgD4W3bwrNlh//RfXU9ghe82VXW2MZT5AE5QElsj78Z/GQFuXF1ytTOsngRQngJkwhkHwwt3Rvu6pxs6rJdWMCtfgKCN0z6lDHpuGQEO6b4AwKYL2EenPfaytjYkpwu6Xp87uxh9Rwm41UVz7SiwX3sGjB1uUATaFrHiL0wXcEjX3gSw0U2PmR4bARb+ZUf9BoDqkphkBQ+ah+wPpxo6VOtbD+K9Ep2+JA3Pv7TpdN+LDH5ektztFA1VtrT3/zFV0IGakpsURf0SwGxXDUa9EbN3jwHX1UGdN6C9B2CpBOrT0x576VT4Wfi2BP2dAC9w16Z9hhVfJ2JjwOLDUyuK5yTVGV0A5rh6CNhhWvZzhZ5yyO/dC6b1kr4nlUFPdfP73X2XAY9uQN8SMH8g8TOTw8sjHQnxSxRkBXVtIwFio7mtfoZ6h2n9+X0qOGHCqS+Dtd6tRLRd0uQs84xKM3but3yJG2vKbnYU55jUt6ANhhXfM17HFbipCUriuHYYwAPuUHzE25tY0vQJhnOFbqi7qsQzcKETQIVEY49hJTZMjrkCi6TRu5/SBdBcya592YjZW3IFDunafgCPSuq/O4/iRW9Yv/dnDCwSgzVl95DifCzzs0KsN0cTHdlCh3Rt0z8b+3VJXZ/jJKtbOs6LR4XLlnTCqcxwrfY0E16SFJ8bYqVqV6zn10yhxUONovLnAGa51hCvM6KJfbJ+aYHF0RfUtQ4Clkugj5Z67Pub2nAhHfTm5eXeoqJkJxg3usNitxG16/+tTybACOulVzKUEwDmSaZiGNFEOB1wWNfeYeBhSd7X7CldbLad+StvYNEg4C+9S2FF+LnIpSEzaLVpxQ/JxIK6t4FAr0rivUlyqndGe39Id9EZTTjVJKRrjQBekTTtcVSqajkY/3lyPFCrVSkE4dsr3GqZ+BEzmng7HayIZwUs8kO6LwpwraR5p9dj3z3ez1vqyrShAUfY6TrXGsZrRsxuyAQ2F2AEl3nLaSYJgGvcRajVsOJPXIyJDXuAgDUSoK6hYXtx62EMThmwaNy40rvIcegzADNdTw6ihyLReHtY925m0C7JZG1WeKEZTfyYKWxOE77kZ+lrFcCwAWwC4S3pRTHqIjH7QDaweQGP+llrB7AqW1Fggm2yKs92001oHljl8ylJFn6+NgvV416PfWcmNxpXu2Uh5JoartFuZ2XkyHL186SiuAJUNVv2qVx185pwSjTo9z5OTK1pIJhAayJW/GCusPl6eIJu0K+1EWOtDIbBpmklQvnAFhT44g1CvPVePxmKGce0Wfa9ufp2fL+CWGLsqPP7KsF8ZNIrz1lKUrX4Xyzf6RZ0wmN+1n33EVg8b9zAwFcqKU82R3vEnzQFWQWdcEGI0jT5G9p5ijo2ng6iAAAAAElFTkSuQmCC",
			yearsRange: [2020, 2021, 2022],
			yearsValue: 0,
			chinaHours: [
				'子时 23:00-1:00',
				'丑时 1:00-3:00',
				'寅时 3:00-5:00',
				'卯时 5:00-7:00',
				'辰时 7:00-9:00',
				'巳时 9:00-11:00',
				'午时 11:00-13:00',
				'未时 13:00-15:00',
				'申时 15:00-17:00',
				'酉时 17:00-19:00',
				'戌时 19:00-21:00',
				'亥时 21:00-23:00'
			],
			form: {
				isPay: 0,
				birthday: '1995-01-01',
				birthHour: '00:00',
				birthChinaHour: '子时',
				isSave: 0, //是否保存 0:不保存 1保存
				sex: 1, //性别 1:男 2:女
				username: "",
				type: '公历'
			}
		}
	},
	onLoad() {
		uni.setStorageSync("isWatchFutureVideo", "1")
		uni.login({
			success: res => {
				console.log(res)
				// api.login.loginJscode({
				// 	jscode: res.code
				// }).then(result => {
				// 	uni.setStorageSync("token", result.data.data.token)


				// })

			}


		})

	},
	onShow() {
		if (typeof this.$mp.page.getTabBar === 'function' &&
			this.$mp.page.getTabBar()) {
			this.$mp.page.getTabBar().init()
		}
	},
	methods: {
		resetVideo() {
			//const query = wx.createSelectorQuery()
			//const video =query.select('#futureVideo')
			//console.log(video)
			var videoContext = wx.createVideoContext('futureVideo', this);
			videoContext.seek(0)
			videoContext.play()
			// this.videoSrc =''
			// this.videoSrc = "https://ndata.zzxcx.net/xpgx-xcx/video/8zi.mp4"

		},
		submitForm() {
			let that = this

			wx.showModal({
				title: '看广告免费测算',
				content: '是否观看激励广告',
				success(res) {

					if (res.confirm) {
						console.log('用户点击确定')
						let videoAd = null;
						if (wx.createRewardedVideoAd) {
							videoAd = wx.createRewardedVideoAd({
								adUnitId: "adunit-f0e94618f34d4baf",
							});
							videoAd.onLoad(() => { });
							videoAd.onError((err) => {
								console.log(err)
							});
							videoAd.offClose();
							videoAd.onClose((res) => {
								if (!res.isEnded) {
									return
								}
								uni.navigateTo({
									url: `/pages/forecast/index?birthday=${that.form.birthday + ' ' + that.form.birthHour+':00'}&sex=${that.form.sex}&username=${that.form.username}`
								})
							});

							videoAd.show().catch(() => {
								// 失败重试
								videoAd
									.load()
									.then(() => videoAd.show())
									.catch((err) => {
										console.log("激励视频 广告显示失败");
									});
							});

						} else if (res.cancel) {
							console.log('用户点击取消')
						}
					}
				}

			})
			// api.openApi.openApiBirthdayLog({
			// 	name:this.form.name,
			// 	sex:this.form.sex,
			// 	birthday:this.form.birthday+' '+this.form.birthHour+':00',
			// 	isPay:this.form.isPay
			// })



		},
		selectRadioByForm(e) {
			let field = String(e.target.dataset.field)
			switch (field) {
				case 'type':
					this.form.type = String(e.target.dataset.value)
					break;
				case 'sex':
					this.form.sex = Number(e.target.dataset.value)
					break;
				case 'isSave':
					this.form.isSave = Number(e.target.dataset.value)
					break;
			}
		},
		changeFormBirthHour(e) {
			this.form.birthHour = e.detail.value
		},
		changeFormBirthDay(e) {
			console.log(e.detail)
			this.form.birthday = e.detail.value
			if (this.form.type == '农历') {
				let birthdays = this.form.birthday.split('-')
				let c = calendar.lunar2solar(birthdays[0], birthdays[1], birthdays[2])
				this.form.birthday = `${c.cYear}-${c.cMonth}-${c.cDay}`
			}

		}
	}
};
</script>

<style lang="less">
.content {
	display: flex;
	flex-direction: row;

	position: relative;
	height: 1500rpx;

	.video {
		position: absolute;
		top: 10vh;
		z-index: 100;
		display: flex;
		justify-content: center;
		width: 100%;
		flex-wrap: wrap;

		video {
			width: 100%;
			height: 60vh;
		}
	}

	.bg {
		width: 100%;
		min-height: 100%;
	}

	.logo {
		width: 100%;
		position: absolute;
		top: 0;
	}

	.form {
		position: absolute;
		padding: 0 30rpx;
		top: 462rpx;
		width: 100vw;
		height: 913rpx;

		.content {
			width: 100%;
			height: 100%;
			padding: 0 30rpx;
			border-radius: 20rpx;
			background: #E4CFAC;
			display: flex;
			flex-wrap: wrap;
			align-items: flex-start;
			align-content: flex-start;

			.content-title {
				width: 100%;
				margin-top: 15rpx;
			}

			.content-inputs {
				width: 100%;
				background-color: #fff;
				height: 792rpx;
				padding: 30rpx 0rpx;

				.content-inputs-row {
					padding: 0rpx 30rpx;
					margin-bottom: 20rpx;
					height: 80rpx;
					font-size: 28rpx;
					font-weight: 600;
					color: #724D0F;
					display: flex;
					justify-content: space-between;
					align-items: center;
					align-content: center;

					.content-inputs-row-label {
						min-width: 128rpx;
					}

					.content-inputs-row-input {
						height: 80rpx;
						font-size: 48rpx;
						background: #F7EDDD;
						width: 442rpx;
						padding-left: 20rpx;
						box-sizing: border-box;
					}

					.content-inputs-row-menu {
						padding-left: 20rpx;
						padding-right: 20rpx;
						display: inline-flex;
						justify-content: space-between;
						align-items: center;
						align-content: center;
						font-size: 28rpx;
						margin-bottom: 20rpx;
						background: #F7EDDD;
						height: 80rpx;





					}

					.content-inputs-row-radioGroup {
						background-color: #F7EDDD;
						width: 442rpx;
						height: 80rpx;
						align-items: center;
						align-content: center;
						display: flex;

					}

					.content-inputs-row-radioUnchecked {
						// width: 38rpx;
						// height: 38rpx;
						// background-image: url("https://ndata.zzxcx.net/xpgx-xcx/index/select.png");
						// background-size: 100%;
						margin-left: 25rpx;
						height: 38rpx;
						display: flex;



					}

					.content-inputs-row-radioUnchecked::before {
						width: 38rpx;
						height: 38rpx;
						background-repeat: no-repeat;
						background-size: 100% 100%;
						margin-right: 10rpx;
						background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAAAXNSR0IArs4c6QAABFpJREFUWEfNmF1sU2UYx//POd0YruccI0FJMAG5kAgS4MJFE4NL9Ia1Z3jBFKPBDyImGsSeojdCsoRxo2srfiViRjRqwlIudG3HDSaFaDR4MY1OgxcOZBok86PnlLjOnvcxb78sW7u1XZk9lz3P87y/vu97no8/oYEn0NO5iVT1fgbdQ8B6gFcD0AEwABugXxk4T+Av2HU/jYxe/bbeZahWh2e74V2m6U8TsAegjbX65e14nIGhjGO/+3YS6Vp8FwTr7oZnq1d/DkSHCFiRWwb8GzElWBFnAWV85qqYuHKT85d8d/Mf2o2eG2idQryBhLKNiX0EuiXvh9/BfHhyuf1mNAp3PsB5wV7wee9QFPUjAFsLQc4yi8HJ5c7oQoGLi/b1Qb31b62HSDkAYFvh9zEh3EdfS6R/qAZXFSxgajsA5UMCvAxcAIvnI3EnVssxVLMJ+DUTpLxOwFqGPFLxWCTmfFLJviKY5dd3M+E4gVQwD//j2nvfOCUv9eKffduht6n6MRA9zGBXAZ4MxewPZkeeAxY0tQcF6GQOCnwkHLMPLh5nbgTL1AcAejkPxztDMefjcqtrwOSdIkU9J48Pgo+EE9cHqghg+fQBKBIOaRZuV/mdK4H1d8Nja8a53EVnDIfjqV3XY6dmxwyYxjABDwEY051UV38SWWlTAgv4tCApyiCAnzyU2vLKCJylAMvdOY8xBmAdWATDcSdcAssnT+NCLk8x+8Jxe3QpoEpH6td7QJSQeS7jpNbKJJzbMcuvWSAlxODPIzH73qWEKsGZRhLAfcVdK4Dp50F0O7PoXWyuavRPyRxHpIyA+cdw3F5Plr9zM8jztSwzkx326lozeqMA1fxyFWJa/yVXvji7hSzTkKXiVTCOh+OpPc1esJ54lt8YAuEpAbxIgV4jSoydTOKJyIjzfj2Bmm0b6NUeJ1beY8ZJuWOyV7rTBXcdjdlfNXuxeuLtN/W7VJDMpd9RwNSnCLSCIFaGYs5UPYGabbtvu3dlm0e9AuBPskw9A1D7pY7UsmgUM81erJ54/X1ot6eNDMDZVgXLtOhR8lQLX/5WTBeUTxetmWBbtiTlu4sWLOKt0vYETCNJs9ue8kbx/2h9ii3PnEZR7lpZaz3hodTmpWqtX+qFlmXjGwC3sRAHIgkndE3PXz6MEPOJUNx+pJ5y0qit5ddPyBmz6jAiA5ePb8w8EInbhxpdsBa/oF8/zEQH5x3fioFacuAtm1pKEoE81hnXfqaZEkG7qr/DRLvqkgiKcOWiCoAJZrF/sYNK4es7mrvojYgqRbgKMtQZQAxe6nBO1Tq0lMlQwdx4ln8al6GKcJWEO4AvAxRnEp8hq4xn2b14+WI6JX1WrfEanjZ1DSA2SuEOxD0ArZLvisLdWNp+K1mQAqp9JAsqikVHmYQ7vNpeEEmpc0MtX91/Nvw9mIem086xpkmdlQACOzo3QagPAHT3LHFYBUjqaD9LcRjgL+G6pxsRh/8FXsBF6DXA4sQAAAAASUVORK5CYII=);
						content: '';
						display: inline-block;
					}

					.content-inputs-row-radioChecked {
						// width: 38rpx;
						// height: 38rpx;
						// background-image: url("https://ndata.zzxcx.net/xpgx-xcx/index/select.png");
						// background-size: 100%;
						margin-left: 25rpx;
						height: 38rpx;
						display: flex;



					}

					.content-inputs-row-radioChecked::before {
						width: 38rpx;
						height: 38rpx;
						background-repeat: no-repeat;
						background-size: 100% 100%;
						margin-right: 10rpx;
						background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAAAXNSR0IArs4c6QAABYxJREFUWEfNmGtsFFUUx/9nZmlRlkdEogmJIiEUCuxMMRYi3WkTTTQloh/wragQ8YOJj+4sNQLJJjxC2Wl9JH4QAxF8hNcHHwE10aQ7WxBqQncKVEsIiAmJjxIQt9qWzj3mznYLbXe7S7uQ3g/7Ze899zfnnnvuOX/CCEaDsWCBy+oDRLwYTHNAmM6MSdIUES6DcR7E7cz0o0ruDzX28ePXuw3luyBSVer3u+NeBmgVCPPyXefNY5wEeHtSvfJRpLEtmc/anGCRKvj8IvAqQ1lPwNSUUf4DwAGAbPSirae368ys5l8uyX9Ol8+ZUuQbPxM+lAJsAFgK0B0pPlwgiA1JpfWDSCN6hwMcFqzOmD9XhfoZQGV9RmwWwmpuaj24D3Dz+fK9gHquIlBNimICkKASscWF+mytfeznbDaygkWD+qNE/ClAfgC/shCvhZtav84HJtucaEXgEVKU9wHMADjJTM+F44kvM83PCLbVCKxQoOwAoAK8J9nduTpy9PTl0UCl10YWzZrkL56wDaAnIb1O/JIZcz4ZbHsImBXUHwNhv4RiYFPYTqwrBNBgG1FD30jAWg+OsdyMJ764ds4AsDpj4VwVbrM8PobYFLZbbwhUGiBqBDYSlLXyWF245bX2if6Y6wdL3T69GUCZPD7Tdp7K5am6JYESVaFqAhYyKdO8PMbiLwaOuYIP1h5qbc9lI2poewj0BICWpJIoT9/WfrBopVZDTPUAn3HdLr32UPs/2YzWG/r9zNgEQqVkyTKPwYgRYW3IThzOZqsv5loAmknEoVDMafA+UP5suXfmZN+tE8+A6DYClobsxMFMhh4H1PKgvoXANSBScnkjlRlYMKihOZ54K1uKqTf0agYOyDzXqfTMkEnYA7MMLQSQxcyHwnGnItOGMh/9ZuifA5BuH8nYe9ROPJMNLhrUG4lQycShcMxpSIEFtXYQzWYSy8KxzLlqa4VmKQqFRkKUXiME169pcmSiHTL6ctxXYD5lxp0SigYXBoiEI5+Zo7YzPdMXpWKK43kfXzZ6ZkFEwUwxJ8NkkaGdl89XryCd6o2AyVCiAO8wbWdVJpuWoceuPiej8Zm31jbthLw0Q4ZlaNsBWkkQYbKC+j4QlgN40bQTOwfPfndJoKRXVWR+yfng54nMPlfMfSNDKrEM/QUAH4OxnyxDl7XSfBDKzVjip8HGraD2Joi8K1ywwVxjxp13huxVqd8HhsylJyTYRQBToPw7zWw81TF4ctTQdxKwomBQqfJnV9hOSO8MGJuDZdOKiP9k4KIEuwLAl+zoKY60tfVk8Ni3IHqokGBg/s6MOw8PthkpLS3y317UDaCXLEPrAqh4bIFxN0UNvcOrTLMcpRXUdoHo+UJ6LNdRAui4Gvy9KDcP35zgZ8GhcFPqTbx2WAOCf6ymizGbYLdUlGk+hRNj7kmSZ2wZWjtAs1mIZdkajpv+iPeBjZmyJ10sDikUh/PajSoU0yXPkEJReq2+Uqthr7TGWdf9T8tVWgvGZiKvgc1aWjPDVghvD1da1y0pmaiqtzgA7gHYNG1HMlw1Gqmq8vnFpVQzwrzbjDtP50qqhWhGrKC2G+T1mC1JZUp5pLHRkw6ytm8QvNFsctbnghvN/5ahbQBo3bDtW3qDMdnwpuEGSATMu5M9na8UVCIomvAhiGTf6gqIlWvs1l2DPZ+vqHKWhXi9QKLKe32Bfv2iSpq+TzLol6GYEVOYrSNNzjf5ylBeiqkIVIOUkGzPUrZHIUOl4bIId7+T16BSXHHpZJeCcz0Xuv+Wa4qmFk8eL3C3UHkeg4OygQboTg+nUMLdtecupc6JPG41C0/qLL2u28hoY4W3d9KVbQWTOjMBSHFYsPIgiBaDUQLCXQAmgaXelRaH0Q7mIwqJ70ciDv8PRRUGCsFUzCMAAAAASUVORK5CYII=);
						content: '';
						display: inline-block;





					}


				}

				.content-button {
					display: flex;
					justify-content: center;

					.content-button-submit {
						width: 400rpx;
						line-height: 80rpx;
						font-size: 34rpx;
						color: #66271B;

						background: linear-gradient(0deg, #D68D13, #EEBB65);
						text-align: center;
						font-weight: 500;

						border-radius: 10rpx;

						border: 4rpx solid #FDE575;
					}
				}
			}


		}

	}

}



.text-area {
	display: flex;
	justify-content: center;
}

.title {
	font-size: 36rpx;
	color: #8f8f94;
}
</style>