odd_job_applet/pages/comjobs/detail.vue

<template>
	<view v-if="pageloading">
		<view class="jobDesc">
			<view class="jobDesc-title">{{comjobs.title}}</view>
			<view class="jobDesc-salary">工资：{{comjobs.zwagall}}</view>
			<view class="jobDesc-tags">
				<view class="jobDesc-tags-item" v-if="comjobs.wtype==1">按月</view>
				<view class="jobDesc-tags-item" v-if="comjobs.wtype==2">按时</view>
				<view class="jobDesc-tags-item" v-if="comjobs.wtype==3">按件</view>
				<view class="jobDesc-tags-item" v-if="comjobs.wtype==4">按项目</view>
				<view class="jobDesc-tags-item">{{comjobs.recruit_num}}名</view>
				<view class="jobDesc-tags-item">{{sex_text}}</view>
			</view>
			<view class="jobDesc-tags">
				<view class="jobDesc-tags-item" v-for="(item,index) in comjobs.tags" :key="index">{{item}}</view>
			</view>
			<view class="jobDesc-date">截止日期：{{comjobs.enddate}}</view>
		</view>


		<!-- <view class="padding-lr padding-tb margin-bottom-sm bg-white">
			<view class="bg-white padding-top-sm text-xl text-black text-bold flex align-end">
				<view class="basis-lg">
					{{comjobs.title}}
					<text class="text-red text-sm" v-if="comjobs.wtype==1">(按月)</text>
					<text class="text-red text-sm" v-if="comjobs.wtype==2">(按时)</text>
					<text class="text-red text-sm" v-if="comjobs.wtype==3">(按件)</text>
					<text class="text-red text-sm" v-if="comjobs.wtype==4">(按项目)</text>
					<text class="text-sm">{{comjobs.recruit_num}}名</text>
				</view>
				<view class="basis-sm text-right text-df">
					<view><text class="text-red text-bold">{{comjobs.zwagall}}</text></view>
				</view>
			</view>
			<view class="bg-white padding-top text-gray">
				<view v-for="(item,index) in comjobs.tags" :key="index" class="cu-tag light bg-blue echo-tags-item">
					{{item}}</view>
			</view>
			<view class="text-gray padding-top-sm pad text-sm flex justify-between">
				<view class="text-red">{{sex_text}}</view>
				<view>截止日期：{{comjobs.enddate}}</view>
			</view>
		</view> -->

		<block v-if="comjobs.recruitment_cate==2">
			<view class="jobBrokerage">
				<view class="brokerage"
					:style="'background-image:url('+$getImageUrl('static/images/applet/other/recommend.png')+');'">
					<view class="jobBrokerage-money">{{comjobs.retmoney}}元<text class="money-tips"
							v-if="comjobs.is_pay == 1">（对方已支付悬赏金）</text></view>
					<view class="jobBrokerage-recommend" v-if="brokertol==0" @tap="gotoBroker"></view>
					<navigator class="jobBrokerage-recommend" :url="'/pages/comjobs/setreport?comjobsid='+comjobs.id"
						open-type="navigate" v-else>
					</navigator>
				</view>
			</view>


			<!-- <view class="cu-bar bg-white">
				<view class="action">
					<text class="cuIcon-titles text-themeRed"></text> 推广介绍
				</view>
			</view>
			<view class="echo-article-details bg-white solids-bottom flex justify-between" style="padding-top: 0rpx;">
				<view>
					<view class="text-lg">推荐一位朋友入职奖励：<text class="text-red">{{comjobs.retmoney}}</text></view>
					<view class="text-red" v-if="comjobs.is_pay == 1">对方已支付悬赏金</view>
				</view>
				<view v-if="brokertol==0" @tap="gotoBroker">
					<image :src="$getImageUrl('static/images/applet/retmoney.png')" mode="widthFix"
						style="width: 64rpx;"></image>
				</view>
				<navigator :url="'/pages/comjobs/setreport?comjobsid='+comjobs.id" open-type="navigate" v-else>
					<image :src="$getImageUrl('static/images/applet/retmoney.png')" mode="widthFix"
						style="width: 64rpx;"></image>
				</navigator>
			</view> -->
		</block>

		<view class="publisher">
			<view class="cu-bar bg-white">
				<view class="action">
					<text class="cuIcon-titles text-themeRed"></text> 信息发布方
				</view>
			</view>
			<view class="publisher-infor">
				<view class="infor-item">
					<view class="item-name" @tap="goShop(comjobs.workerid)">{{comjobs.worker.title}}</view>
					<image class="item-verified" :src="$getImageUrl('static/images/applet/other/verified.png')"></image>
				</view>
				<view class="infor-item infor-center" @tap="goShop(comjobs.workerid)">
					<image class="item-icon" :src="$getImageUrl('static/images/applet/other/shop.png')" mode="widthFix">
					</image>
					<view class="item-title">进店</view>
				</view>
				<view class="infor-item" @tap="setAddress()">
					<image class="item-icon" :src="$getImageUrl('static/images/applet/other/place.png')"
						mode="widthFix"></image>
					<view class="item-title">{{comjobs.worker.city}} {{comjobs.worker.district}}
						{{comjobs.worker.address}}
					</view>
				</view>
			</view>
		</view>

		<view class="cu-bar bg-white">
			<view class="action">
				<text class="cuIcon-titles text-themeRed"></text> 职位详情
			</view>
		</view>
		<view class="echo-article-details bg-white" style="padding-top: 0rpx;margin-bottom: 20rpx;">
			<text>{{comjobs.comdetails}}</text>
		</view>

		<view class="cu-bar bg-white">
			<view class="action">
				<text class="cuIcon-titles text-themeRed"></text> 任职要求
			</view>
		</view>
		<view class="echo-article-details bg-white" style="padding-top: 0rpx;margin-bottom: 20rpx;">
			<text>{{comjobs.requirement}}</text>
		</view>

		<view class="cu-bar bg-white">
			<view class="action">
				<text class="cuIcon-titles text-themeRed"></text> 环境图片
			</view>
			<view class="action" data-modalname="picallModal" @tap="showModal">
				<text class="text-df">查看全部 </text>
				<view class="cuIcon-right"></view>
			</view>
		</view>
		<view class="echo-article-details bg-white flex justify-between" v-if="comjobs.picall.length != 0"
			style="padding-top: 0rpx;" data-modalname="picallModal" @tap="showModal">
			<image class="picallitem" :src="comjobs.picall[0]" mode="aspectFill"></image>
			<image class="picallitem" :src="comjobs.picall[1]" mode="aspectFill"></image>
		</view>
		<view v-if="videosrc!==null" class="bg-white" style="padding: 0rpx 30rpx 30rpx 30rpx;"
			data-modalname="videoModal" @tap="showModal">
			<image style="width: 690rpx;" src="https://sc.laowushangcheng.com/static/images/videobtn.jpg"
				mode="widthFix"></image>
		</view>
		<!-- <view class="echo-article-details bg-white" style="padding-top: 0rpx;">
			<video v-if="videosrc!==null && modal.name==null" class="myVideo" poster="https://sc.laowushangcheng.com/static/images/videopic.jpg" :src="videosrc" enable-danmu :controls="true"></video>
		</view> -->

		<!-- <view class="cu-bar bg-white solids-top">
			<view class="action">
				<text class="cuIcon-titles text-themeRed"></text> 企业介绍
			</view>
		</view>
		<view class="echo-article-details bg-white" style="padding-top: 0rpx;">
			<text>{{comjobs.companydetails}}</text>
		</view>
		<view class="echo-article-details bg-white solids-bottom flex justify-start">
			<image class="solid margin-right-sm" :src="comjobs.worker.tilpic" style="width: 150rpx; height: 150rpx;">
			</image>
			<view>
				<view @tap="goShop(comjobs.workerid)">本信息由<text class="text-red">{{comjobs.worker.title}}</text>发布
				</view>
				<view class="flex align-center justify-between padding-bottom-xs align-center" style="width: 520rpx;">
					<view class="flex align-center">
						<image class="iconyrz" :src="$getImageUrl('static/images/applet/iconyrz.png')"
							mode="scaleToFill"></image>
						<image class="iconwyp" :src="$getImageUrl('static/images/applet/iconwyp.png')"
							mode="scaleToFill" v-if="comjobs.recruitment_cate==2"></image>
					</view>
					<view class="text-gray text-right basis-xs text-sm" @tap="goShop(comjobs.workerid)">
						<text class="cuIcon-shop margin-right-xs text-lg"></text>
						进店
					</view>
				</view>
				<view class="text-gray" @tap="setAddress()"><text
						class="cuIcon-locationfill text-red margin-right-xs"></text> {{comjobs.worker.city}}
					{{comjobs.worker.district}} {{comjobs.worker.address}}
				</view>
			</view>
		</view> -->

		<view class="cu-bar bg-white" style="margin-top: 20rpx;">
			<view class="action">
				<text class="cuIcon-titles text-themeRed"></text> 服务流程
			</view>
		</view>
		<view class="echo-article-details bg-white solids-bottom" style="padding-top: 0rpx;">
			<image :src="$getImageUrl('static/images/applet/detaillc.png')" mode="widthFix" style="width: 100%;">
			</image>
		</view>

		<view class="padding"></view>
		<view class="padding"></view>
		<view class="cu-bar bg-white tabbar border shop foot">
			<button class="text-gray action" data-modalname="shareModal" @tap="showModal" v-if="appplatform!='ios'">
				<view class="padding-bottom-xs">
					<image style="width: 38rpx; height: 38rpx;"
						:src="$getImageUrl('static/images/applet/detshare.png')"></image>
				</view>
				分享
			</button>
			<button class="text-gray action" @tap="setComjobsStar">
				<view class="padding-bottom-xs">
					<image style="width: 38rpx; height: 38rpx;" :src="$getImageUrl('static/images/applet/detstar.png')">
					</image>
				</view>
				{{comjobsstar==0 ? '收藏' : '已收藏'}}
			</button>
			<view class="botBtn" v-if="comjobs.status==3">
				<view class="botBtn-left bg-tags" v-if="comjobs.recruitment_cate==2">
					<view v-if="brokertol==0" @tap="gotoBroker">赚佣金</view>
					<navigator :url="'/pages/comjobs/setreport?comjobsid='+comjobs.id"
						open-type="navigate" v-else>赚佣金
					</navigator>
				</view>
				<view class="botBtn-right bg-themeBtn" @tap="setComjobsLog">立即报名</view>
			</view>
			<!-- <view class="bg-themeBtn submit echo-foot-button" @tap="setComjobsLog" v-if="comjobs.status==3">
				<text>立即报名</text>
			</view> -->
			<view class="bg-grey submit echo-foot-button" v-else> <text>已招满</text> </view>
		</view>


		<view class="cu-modal bottom-modal show" v-if="modal.name=='videoModal'" @tap="hideModal">
			<view class="cu-dialog" @tap.stop="">
				<view class="cu-bar bg-white">
					<view class="action text-black">视频</view>
					<view class="action text-blue" @tap="hideModal">取消</view>
				</view>
				<view class="solid-top" v-if="videosrc!==null">
					<video class="myVideo" :src="comjobs.video" enable-danmu :controls="true"></video>
				</view>
			</view>
		</view>

		<view class="cu-modal bottom-modal show" v-if="modal.name=='picallModal'" @tap="hideModal">
			<view class="cu-dialog" @tap.stop="">
				<view class="cu-bar bg-white">
					<view class="action text-black">环境图片</view>
					<view class="action text-blue" @tap="hideModal">取消</view>
				</view>
				<view class="solid-top">
					<scroll-view scroll-y="true" class="bg-white padding-tb padding-lr-sm solids-top echo-picalllist">
						<view class="flex justify-between">
							<view class="picitem">
								<block v-for="(item,index) in comjobs.picall" :key="index">
									<image class="solid" :data-current="index" @tap="previewImage" v-if="index%2==0"
										mode="widthFix" :src="item"></image>
								</block>
							</view>
							<view class="picitem">
								<block v-for="(item,index) in comjobs.picall" :key="index">
									<image class="solid" :data-current="index" @tap="previewImage" v-if="index%2==1"
										mode="widthFix" :src="item"></image>
								</block>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</view>

		<view class="cu-modal show" v-if="modal.name=='comjobspicModal'">
			<view class="cu-dialog picmodal">
				<view class="bg-img">
					<image mode="widthFix" :src="modal.comjobspic"></image>
					<view class="cu-bar justify-end text-white picmodalclose">
						<view class="action" @tap="hideModal">
							<text class="cuIcon-close "></text>
						</view>
					</view>
				</view>
				<view class="cu-bar bg-white margin-top-xs">
					<view class="action margin-0 flex-sub solid-left" @tap="saveImage">保存到相册</view>
				</view>
			</view>
		</view>

		<view class="cu-modal bottom-modal show" v-if="modal.name=='shareModal'" @tap="hideModal">
			<view class="cu-dialog" @tap.stop="">
				<view class="cu-bar bg-white">
					<view class="action text-black">点击海报</view>
					<view class="action text-blue" @tap="hideModal">取消</view>
				</view>
				<view class="solid-top">
					<scroll-view scroll-y="true" class="bg-white padding-tb padding-lr-sm solids-top echo-picalllist">
						<view class="cu-list grid col-2 no-border padding-lr">
							<block v-for="(item,index) in comjobsshare" :key="index">
								<view class="cu-item">
									<view class="padding-lr-sm" @tap="getComjobsImage(item.id)">
										<view class="bg-img" :style="'background-image:url(' + item.tilpic + ');'">
										</view>
										<view class="padding-tb-xs text-cut">{{item.title}}</view>
									</view>
								</view>
							</block>
						</view>
					</scroll-view>
				</view>
			</view>
		</view>
		<wxContact ref="wxContact"></wxContact>

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

<script>
	var _this;
	export default {
		data() {
			return {
				appplatform: "",
				pageloading: false,
				userinfo: {},
				comjobs: null,
				videosrc: null,

				comjobslist: {},
				comjobsstar: 0,
				comjobsshare: {},
				brokertol: 0,

				modal: {
					name: null,
					comjobspic: ""
				}
			}
		},
		onLoad: function(option) {
			_this = this;
			//#ifdef APP-PLUS
			_this.appplatform = uni.getSystemInfoSync().platform;
			//#endif
			var comjobsid = option.comjobsid || 0;
			var parentid = option.parentid || 0;
			if (option.scene) {
				const scene = decodeURIComponent(option.scene);
				if (scene != "undefined") {
					comjobsid = scene.split("&")[0];
					parentid = scene.split('&')[1];
				}
			}
			if (option.q) {
				const q = decodeURIComponent(option.q);
				if (q != "undefined") {
					comjobsid = q.split("=")[1];
				}
			}
			uni.setStorageSync('parentid', parentid);
			_this.userinfo = uni.getStorageSync('userinfo') || null;
			_this.$req.ajax({
				path: "comjobs/getcomjobs",
				title: "加载中...",
				data: {
					comjobsid: comjobsid,
					userid: _this.userinfo == null ? 0 : _this.userinfo.id
				}
			}).then((data) => {
				_this.comjobs = data.comjobs;
				_this.comjobslist = data.comjobslist;
				_this.comjobsstar = data.comjobsstar;
				_this.comjobsshare = data.comjobsshare;
				_this.brokertol = data.brokertol;

				setTimeout(function() {
					_this.videosrc = _this.comjobs.video == '' ? null : _this.comjobs.video;
				}, 1500);
				_this.pageloading = true;
			}).catch((err) => {
				uni.showModal({
					title: '信息提示',
					content: err,
					showCancel: false
				});
			});
		},
		onShareAppMessage: function(res) {
			_this.$req.ajax({
				path: "comjobs/shareComjobs",
				title: "分享中...",
				data: {
					userid: _this.userinfo.id
				}
			})
			return {
				title: _this.comjobs.title,
				path: "/pages/comjobs/detail?comjobsid=" + _this.comjobs.id + "&parentid=" + _this.userinfo == null ?
					0 : _this.userinfo.id
			}
		},
		methods: {

			getComjobsImage: function(shareid) {
				_this.userinfo = _this.checkLogin("/pages/comjobs/detail?comjobsid=" + _this.comjobs.id);
				if (_this.userinfo === false) {
					return false;
				}
				_this.$req.ajax({
					title: "推广海报生成中...",
					path: "comjobs/getcomjobsimage",
					data: {
						shareid: shareid,
						userid: _this.userinfo.id,
						comjobsid: _this.comjobs.id
					}
				}).then((data) => {
					var t1 = Math.round(Math.random() * 100);
					_this.modal.comjobspic = data.comjobspic + '?' + t1;
					_this.modal.name = "comjobspicModal";
				}).catch((err) => {
					uni.showModal({
						title: '温馨提示',
						content: err,
						showCancel: false
					});
				});
			},

			getComjobsCode: function() {
				_this.userinfo = _this.checkLogin("/pages/comjobs/detail?comjobsid=" + _this.comjobs.id);
				if (_this.userinfo === false) {
					return false;
				}
				_this.$req.ajax({
					title: "招聘简章生成中...",
					path: "comjobs/getcomjobscode",
					data: {
						comjobsid: _this.comjobs.id,
						userid: _this.userinfo.id
					}
				}).then((data) => {
					_this.modal.comjobspic = data.comjobspic;
					_this.modal.isshow = "show";
				}).catch((err) => {
					uni.showModal({
						title: '温馨提示',
						content: err,
						showCancel: false
					});
				});
			},

			saveImage: function() {
				uni.downloadFile({
					url: _this.modal.comjobspic,
					success: (res) => {
						if (res.statusCode === 200) {
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath,
								success: function() {
									uni.showModal({
										title: '信息提示',
										content: "已保存到手机相册，注意查收。",
										showCancel: false
									});
								}
							});
						}
					}
				});
			},
			setComjobsLog: function() {
				_this.userinfo = _this.checkLogin("/pages/comjobs/detail?comjobsid=" + _this.comjobs.id);
				if (_this.userinfo === false) {
					uni.navigateTo({
						url: "/pages/my/myinfo?pageurl=/pages/comjobs/detail/comjobsid=" + _this.comjobs.id,
					});
					return false;
				}
				//检测用户信息是否完整
				if (_this.userinfo.education == "" || _this.userinfo.address == "" || _this.userinfo.workexperience ==
					"") {
					uni.navigateTo({
						url: "/pages/my/myinfo?pageurl=/pages/comjobs/detail/comjobsid=" + _this.comjobs.id,
					});
					return false;
				}

				_this.$req.ajax({
					title: "报名中",
					path: "comjobs/setcomjobslog",
					data: {
						comjobsid: _this.comjobs.id,
						userid: _this.userinfo.id
					}
				}).then((data) => {
					if (data.is_public == 1) {
						var confirmText = '联系对方';
					} else {
						var confirmText = '联系客服';
					}
					uni.showModal({
						title: '温馨提示',
						content: data.msg,
						confirmText: confirmText,
						cancelText: "好的",
						success: function(res) {
							if (res.confirm) {
								if (data.is_public == 1) {
									uni.makePhoneCall({
										phoneNumber: data.mobile
									});
								} else {
									_this.$refs.wxContact.showConcatModel();
								}
							}
						},
					});
				}).catch((err) => {
					uni.showModal({
						title: '温馨提示',
						content: err,
						showCancel: false
					});
				});
			},

			setComjobsStar: function() {
				_this.userinfo = _this.checkLogin("/pages/comjobs/detail?comjobsid=" + _this.comjobs.id);
				if (_this.userinfo === false) {
					return false;
				}
				_this.$req.ajax({
					path: "comjobs/setcomjobsstar",
					data: {
						comjobsid: _this.comjobs.id,
						userid: _this.userinfo.id
					}
				}).then((data) => {
					_this.comjobsstar = data.comjobsstar;
				}).catch((err) => {
					uni.showModal({
						title: '温馨提示',
						content: err,
						showCancel: true
					});
				});
			},
			goPage: function(pageurl) {
				uni.navigateTo({
					url: pageurl,
					fail: function() {
						uni.switchTab({
							url: pageurl
						});
					}
				});
			},
			gotoBroker: function() {
				uni.showModal({
					title: '温馨提示',
					content: '您还不是经纪人，请联系客服，申请成为经纪人',
					confirmColor: "#007aff",
					success: function(res) {
						if (res.confirm) {
							_this.$refs.wxContact.showConcatModel();
							// uni.redirectTo({
							// 	url: '/pages/form/form?formid=4'
							// });
						}
					}
				});
			},
			goDetail: function(comjobsid) {
				uni.navigateTo({
					url: '/pages/comjobs/detail?comjobsid=' + comjobsid
				});
			},
			goShop: function(workerid) {
				uni.navigateTo({
					url: '/pages/worker/shop?workerid=' + workerid
				});
			},
			navigate: function(href, e) {
				// #ifdef H5
				location.href = href;
				// #endif
				// #ifndef H5
				uni.navigateTo({
					url: '/pages/tool/webview?pagesrc=' + encodeURIComponent(href)
				});
				// #endif
			},

			setAddress: function() {
				uni.openLocation({
					latitude: parseFloat(_this.comjobs.worker.latitude),
					longitude: parseFloat(_this.comjobs.worker.longitude),
					name: _this.comjobs.worker.title,
					address: _this.comjobs.worker.city + " " + _this.comjobs.worker.district + " " + _this
						.comjobs.worker.address,
					success: function() {
						console.log('success');
					}
				});
			},
			makeTelephone: function(e) {
				var telephone = e.currentTarget.dataset.telephone;
				uni.makePhoneCall({
					phoneNumber: telephone
				});
			},
			showModal: function(e) {
				var modalname = e.currentTarget.dataset.modalname;
				_this.modal.name = modalname;
			},
			hideModal: function() {
				_this.modal.name = null;
			},
			previewImage: function(e) {
				var current = e.currentTarget.dataset.current;
				uni.previewImage({
					current: current,
					urls: _this.comjobs.picall
				});
			}
		},
		computed: {
			sex_text() {
				const arr = ['男女不限', '男', '女'];
				return arr[_this.comjobs.sex];
			}
		}
	}
</script>

<style lang="scss">
	.flex-1 {
		flex: 1;
	}

	.flex-6 {
		flex: 6;
	}

	.picmodal {
		width: 450rpx;
		background-color: transparent;
	}

	.picmodal image {
		width: 100%;
	}

	.picmodal .bg-img {
		position: relative;
	}

	.picmodalclose {
		position: absolute;
		top: 0rpx;
		right: 0rpx;
	}

	.picallitem {
		width: 340rpx;
		height: 260rpx;
	}

	.echo-picalllist {
		height: calc(100vh - 105rpx);
	}

	.echo-picalllist .picitem {
		width: 345rpx !important;
	}

	.echo-picalllist image {
		width: 345rpx;
		padding-bottom: 15rpx;
	}

	.cu-item .bg-img {
		width: 100%;
		height: 390rpx;
		background-position: center top;
	}

	.myVideo {
		width: 750rpx;
		height: calc(100vh - 130px);
	}

	.jobDesc {
		padding: 30rpx 30rpx;
		margin-bottom: 20rpx;
		background-color: #ffffff;

		.jobDesc-title {
			font-size: 36rpx;
			font-weight: 600;
			color: #383838;
		}

		.jobDesc-salary {
			margin-top: 10rpx;
			font-size: 24rpx;
			font-weight: 400;
			color: #CA151C;
		}

		.jobDesc-tags {
			display: flex;
			flex-wrap: wrap;

			.jobDesc-tags-item {
				margin-top: 20rpx;
				margin-right: 18rpx;
				padding: 5rpx 30rpx;
				background: #F9E2AC;
				border-radius: 20rpx;
				font-size: 24rpx;
				font-weight: 400;
				color: #CA151C;
			}


		}

		.jobDesc-date {
			margin-top: 30rpx;
			font-size: 24rpx;
			font-weight: 400;
			color: #747474;
		}
	}

	.jobBrokerage {
		margin-bottom: 20rpx;
		padding: 30rpx 30rpx;
		background-color: #ffffff;
		position: relative;

		.brokerage {
			width: 100%;
			height: 175rpx;
			background-size: cover;
			display: flex;

			.jobBrokerage-money {
				margin-top: 84rpx;
				margin-left: 110rpx;
				font-size: 40rpx;
				font-weight: 600;
				color: #CA151C;

				.money-tips {
					font-size: 22rpx;
					color: #CA151C;
				}
			}

			.jobBrokerage-recommend {
				position: absolute;
				right: 0;
				margin-top: 30rpx;
				margin-right: 68rpx;
				// margin-left: 105rpx;
				width: 115rpx;
				height: 115rpx;
				border-radius: 60rpx;
			}
		}
	}

	.publisher {
		margin-bottom: 20rpx;
		background-color: #ffffff;

		.publisher-infor {
			padding: 0 30rpx 30rpx;

			.infor-center {
				margin: 25rpx 0 20rpx;
			}

			.infor-item {
				display: flex;

				.item-name {
					flex: 1;
					font-size: 32rpx;
					font-weight: 600;
					color: #747474;
				}

				.item-verified {
					margin-left: 20rpx;
					margin-top: 10rpx;
					width: 110rpx;
					height: 28rpx;
				}

				.item-icon {
					margin-top: 5rpx;
					width: 32rpx;
				}

				.item-title {
					margin-left: 20rpx;
					flex: 1;
					font-size: 28rpx;
					font-weight: 400;
					color: #747474;
				}
			}
		}
	}

	.botBtn {
		flex: 2;
		height: 100%;
		display: flex;

		.botBtn-left {
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.botBtn-right {
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
</style>