lcoco/pages/common/call/call.vue

<template>
	<view class="call-box" @click.stop="sayHi">
		<view class="call-icon">
			<image class="call-img" src="/static/img/circle/Group-100243@2x.png" mode="aspectFill"></image>
		</view>
		<view class="call-text sys-weight-600 sys-color-black">打招呼</view>
	</view>
</template>

<script>
	import {
		sayHi
	} from "@/api/utility";
	import tools from "@/service/tools";

	export default {
		name: "call",
		components: {},
		props: {
			userId: {
				default: ''
			}
		},
		data() {
			return {
				isAjax: false
			}
		},
		watch: {},
		mounted() {

		},
		methods: {
			sayHi() {
				if (this.isAjax) {
					return false
				}
				this.isAjax = true
				sayHi(this.userId).then((res) => {
					this.isAjax = false
					if (res.code === 0) {
						tools.success('打招呼成功')
					} else {
						tools.error(res.msg)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.call-box {
		height: 40rpx;
		border-radius: 200rpx;
		border: 2rpx solid #141414;
		padding: 4rpx 16rpx;
		display: flex;
		justify-content: space-between;

		.call-img {
			width: 40rpx;
			height: 40rpx;
			margin-right: 8rpx;
		}

		.call-text {
			font-size: 28rpx;
			line-height: 40rpx;
		}
	}
</style>