moxuan_takeaway_qishou_1/pages/riderMy/kefu.vue

<template>
	<view class="content">
		<view class="kefu_box">
			<view class="title">联系电话</view>
			<view style="font-size: 32rpx;">{{mobile}}</view>
			<view class="btn" @click="PhoneCall">一键拨打</view>
			<view class="image">
				<image src="../../../static/logo.png"></image>
			</view>
			<view class="tit">长按二维码添加微信</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mobile: '17884849832'
			}
		},
		methods: {
			PhoneCall() {
				uni.makePhoneCall({
					phoneNumber: this.mobile //仅为示例
				});
			}
		}
	}
</script>

<style>
	page {
		background: #F2F2F2;
	}

	.content {
		width: 100%;
	}

	.kefu_box {
		width: 90%;
		margin: 0 auto;
		background: #ffffff;
		border-radius: 17rpx;
		margin-top: 40rpx;
		padding: 35rpx 0rpx;
		text-align: center;
	}

	.title {
		padding: 20rpx 0rpx;
		font-size: 41rpx;
		letter-spacing: 2rpx;
	}

	.btn {
		background: #FF6A04;
		color: #ffffff;
		width: 42%;
		margin: 0 auto;
		border-radius: 54rpx;
		padding: 20rpx 0rpx;
		font-size: 37rpx;
		letter-spacing: 2rpx;
		margin-top: 25rpx;
	}

	.image {
		width: 40%;
		height: 300rpx;
		margin: 0 auto;
		padding: 20rpx 0rpx;
	}

	.image image {
		width: 100%;
		height: 100%;
	}

	.tit {
		color: #666666;
		font-size: 28rpx;
	}
</style>