talk_appAmin/pages/Friend/addfruebd.vue

<!-- 添加好友 -->
<template>
	<view class="uninavbar" @click="ToRun()">
		<image src="../../static/images/sign/return.png"></image>
	</view>

	<view class="back">
		<image class="backimage" src="../../static/images/sign/myBack.png"></image>

		<view class="backbot">
			<image src="../../static/images/icon/tu4-1.jpg"
				style="width: 154rpx; height: 154rpx;border-radius: 154rpx;">
			</image>
		</view>
		<view class="backright">
			<text class="backText"> {{contarr.infoName}}</text>
			<view class="backbo">
				<text class="textrig" style="margin-right: 24rpx;">女</text>
				<text class="textrig" style="margin-right: 24rpx;">LV {{contarr.infoRank}}</text>
				<text class="textrig" style="margin-right: 8rpx;">ID:</text>
				<text class="textrig">{{contarr.infoCode}}</text>
			</view>
		</view>

		<view class="divTu">
			<image src="../../static/images/sign/addrs.png"></image>
			<text>{{contarr.infoSchool}}</text>
		</view>
	</view>





	<view style="position: absolute; top: 424rpx; bottom: 0; left: 0; right: 0; border-radius: 32rpx 32rpx 32rpx 32rpx;
background: #ffffff; ">
		<view style="display: flex;margin-right: 32rpx; margin-left: 33rpx;">
			<view class="viewtop">
				<text class="viewtoptext">{{contarr.infoAssist}}</text>
				<text class="viewtoptexttow">获赞</text>
			</view>

			<view class="viewtop" style="margin-left: 128rpx;">
				<text class="viewtoptext">{{contarr.followCount}}</text>
				<text class="viewtoptexttow">关注</text>
			</view>

			<view class="viewtop" style="margin-left: 128rpx;">
				<text class="viewtoptext">{{contarr.fanCount}}</text>
				<text class="viewtoptexttow">粉丝</text>
			</view>
		</view>


		<view style="margin-top:44rpx; margin-left: 33rpx;">
			签名：{{contarr.remark}}
		</view>

		<view style="display: flex;">
			<view class="buttonSend" @click="TomessageChat()">
				<image style="width: 34rpx; height: 30rpx;" src="../../static/images/sign/go.png"></image>
				<text>发消息</text>
			</view>

			<view class="buttonFriend" @click="HaveGoFruebd()">
				<text>关注</text>
			</view>
		</view>



		<view style="margin-top: 74rpx; margin-left: 32rpx;">
			<text class="backbottom">发布的话题</text>
			<view class="backbottom_li"></view>
		</view>

		<!-- <view style="width: 100rpx;height: 1000rpx;"></view> -->


	</view>
</template>

<script setup>
	import {
		onMounted,
		ref,
		getCurrentInstance
	} from 'vue';
	import {
		useRouter,
		useRoute
	} from 'vue-router';

	import {
		GetListid
	} from "@/api/signln/SignTa/SignTa";

	import {
		listTask
	} from "@/api/signln/addfur/addfur.js";

	import {
		listFriendShip,
		getFriendShip,
		delFriendShip,
		addFriendShip,
		updateFriendShip
	} from "@/api/signln/FriendShip/FriendShip";

	const route = useRoute();

	const uid = ref(0);
	const myuserid = ref(0);

	onMounted(() => {
		// console.log(route.query.uid)
		uid.value = route.query.uid;

		GetMyContent();
		const getuser = GetListid().then(res => {
			myuserid.value = res;
		})
	})

	// 关注按钮
	function HaveGoFruebd() {
		console.log("关注")

		const form = {
			userId: null,
			friendId: null,
			actionUserId: null,
			actionTime: null,
			status: null
		}

		form.userId = myuserid.value;
		form.friendId = uid.value;
		form.actionTime = new Date();
		form.actionUserId = myuserid.value;
		form.status = 1;

		console.log(form)
		console.log(uid.value)
		console.log(myuserid.value)

		if (uid.value != 0 && myuserid.value != 0) {
			addFriendShip(form).then(response => {
				console.log(response)
			});
		}
	}

	const {
		proxy
	} = getCurrentInstance();

	// 发消息
	function TomessageChat() {
		if (uid.value != 0) {
			proxy.$tab.navigateTo("/pages/Friend/messagechat?id=" + uid.value)
		}
	}

	const contarr = ref(null);
	//获取当前的信息
	function GetMyContent() {
		listTask(uid.value).then(res => {
			contarr.value = res.data;
			console.log(contarr.value)
		})
	}

	// 
	function ToRun() {
		uni.navigateBack({
			delta: 1
		});
	}
</script>

<style scoped>
	.uninavbar {
		position: absolute;
		z-index: 9999;
		/* top: 110rpx; */
		margin-top: 53rpx;
		left: 32rpx;
		width: 750rpx;
		height: 170rpx;
	}

	.uninavbar>image {
		width: 31rpx;
		height: 44rpx;
		color: #000000;
	}

	.back {
		width: 750rpx;
		height: 500rpx;
		display: flex;
	}

	.backright {
		margin-left: 23rpx;
		margin-top: 194rpx;
	}

	.backbo {
		margin-top: 23rpx;
	}

	.backimage {
		position: fixed;
		top: 0;
		left: 0;
		width: 750rpx;
		height: 500rpx;
		z-index: -1;
	}

	.backText {
		font-weight: 600;
		width: 272rpx;
		height: 45rpx;
		font-size: 44rpx;
		text-align: left;
		color: #FFFFFF;
	}

	.backbot {
		width: 154rpx;
		margin-top: 50rpx;
		height: 154rpx;
		z-index: 100;
		margin-left: 32rpx;
		margin-top: 164rpx;
	}

	.textrig {
		font-weight: Regular;
		width: 24rpx;
		height: 24rpx;
		font-size: 24rpx;
		text-align: left;
		color: #FFFFFF;
	}

	.divTu {
		/* width: 100rpx; */
		height: 28rpx;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
		opacity: 0.5;
		background: #000000;
		float: right;
		margin-right: 10rpx;
		display: flex;

		position: absolute;
		right: 32rpx;
		top: 362rpx;
	}

	.divTu>image {
		width: 16rpx;
		height: 24rpx;
		vertical-align: middle;
		padding-top: 4rpx;
		margin-left: 20rpx;
	}

	.divTu>text {
		font-weight: 400;
		/* width: 36rpx; */
		height: 18rpx;
		font-size: 18rpx;
		text-align: left;
		color: #FFFFFF;
		display: block;
		line-height: 28rpx;
		/* padding-top: 2rpx; */
		padding-left: 10rpx;
		padding-right: 10rpx;
	}

	.viewtop {
		width: 170rpx;
		margin-top: 32rpx;
		display: flex;
	}

	.viewtoptext {
		font-weight: 600;
		/* width: 85rpx; */
		height: 30rpx;
		font-size: 36rpx;
		text-align: left;
		color: #000000;
		vertical-align: middle;
		line-height: 30rpx;
		;
	}

	.viewtoptexttow {
		font-weight: 400;
		width: 57rpx;
		height: 28rpx;
		font-size: 28rpx;
		text-align: left;
		color: #999999;
		vertical-align: middle;
		display: block;
		margin-left: 8rpx;
		line-height: 28rpx;
	}

	.buttonSend {
		width: 512rpx;
		height: 80rpx;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
		background: #f7f8fa;
		margin-top: 60rpx;
		margin-left: 32rpx;
	}

	.buttonSend>image {
		display: inline-block;
		line-height: 80rpx;
		vertical-align: middle;
		margin-left: 187rpx;
	}

	.buttonSend>text {
		display: inline-block;
		line-height: 80rpx;
		margin-left: 12rpx;
	}

	.buttonFriend {
		width: 150rpx;
		height: 80rpx;
		margin-top: 60rpx;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
		background: #83c4ff;
		margin-left: 24rpx;
	}

	.buttonFriend>text {
		font-weight: 600;
		width: 61rpx;
		height: 31rpx;
		font-size: 30rpx;
		text-align: left;
		color: #FFFFFF;
		display: block;
		margin: auto;
		line-height: 80rpx;
	}

	.backbottom {
		font-weight: 600;
		width: 155rpx;
		height: 31rpx;
		font-size: 30rpx;
		text-align: left;
		color: #333333
	}

	.backbottom_li {
		width: 154rpx;
		height: 12rpx;
		border-radius: 6rpx 6rpx 6rpx 6rpx;
		background: linear-gradient(-90deg, #c9f6f5, #f7f8e3);
	}
</style>