WenWuGuanJia/shouhu_fenbao/shouHu/yaoQing.vue

<template>
	<view class="box">
		<u-navbar :autoBack="true" title="邀请" bgColor="#f6deb8" :placeholder="true" titleStyle="font-weight:bold;color:#000000"></u-navbar>
		<view class="">
			<image style="width: 100%; height: 320rpx" src="https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/nav_bg.png"></image>
		</view>
		<view class="user_box2">
			<image style="width: 218rpx; height: 218rpx; border-radius: 50%" src="https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/bm_top.png" />
			<view style="font-size: 30rpx; font-weight: 600; margin-top: 20rpx">{{ title }}</view>
		</view>
		<view class="language">
			我们希望您对文化遗产充满热爱并愿意为它们守护。 珍贵的文化遗产历经岁月沉淀，它们诉说着历史的 沧桑和变迁，见证着人类的智慧和劳动成果。
			作为文物守护者，您拥有独特的使命感，保护着这些 珍贵的财富。在未来的岁月里， 愿你能坚定地守护着这份文化传承。
		</view>
		<view class="jiaru">邀请您加入{{ title }}的团队一起守护厦门文物</view>
		<view @click="joinTeam" class="star"><view class="tit">加入团队</view></view>
		<view style="display: flex; justify-content: center; align-items: center; gap: 50rpx" class=""></view>
	</view>
</template>

<script>
let that;
export default {
	data() {
		return {
			team_id: '',
			title: ''
		};
	},
	onLoad(o) {
		that = this;
		this.team_id = o.team_id;
		this.title = o.title;
	},
	methods: {
		// 加入团队
		joinTeam(id) {
			this.$api.joinTeam({ main_body_id: 1, team_id: this.team_id }, function (res) {
				console.log(res);
				if (res.code == 1) {
					that.$common.successToShow(res.msg);
				} else {
					that.$common.errorToShow(res.msg);
				}
			});
		}
	}
};
</script>

<style>
.box {
	height: 100%;
	width: 100%;
	padding-bottom: 50rpx;
	background-image: url('https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/xy_bgt.png');
	background-repeat: repeat-y;
	/* background-attachment: fixed; */
	background-size: 100% 100%;
}
.user_box2 {
	width: 90%;
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}
.language {
	width: 695rpx;
	font-size: 28rpx;
	padding: 40rpx;
	margin: auto;
	margin-top: 20rpx;
	background-image: url('/static/img/yq_tit_bg.png');
	background-size: 100% 100%;
}
.jiaru {
	width: 90%;
	margin: auto;
	margin-top: 50rpx;
	text-align: center;
	font-size: 28rpx;
}
.tit {
	width: 90%;
	margin: auto;

	font-size: 32rpx;
	letter-spacing: 6rpx;
	text-align: center;
	font-weight: 700;
	background: linear-gradient(180deg, #af7e44 0%, #934b36 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.star {
	width: 300rpx;
	height: 76rpx;
	margin: auto;
	margin-top: 80rpx;
	text-align: center;
	line-height: 76rpx;
	background: url('/static/img/dt_bg2.png') no-repeat;
	background-size: 100% 100%;
}
</style>