wx-fensisiyu/pageA/duihuan.vue

<template>
	<view class="page">
		<view class="top">
			<view class="u-flex-col u-col-center">
				<view class=""><u-input :custom-style="{'width': '684rpx',
'height': '94rpx',
'background':' rgba(255,255,255,1)',
'border-radius': '48rpx',
'padding':'0 30rpx','box-sizing': 'border-box'}" v-model="value" :clearable='false' :type="type"
						placeholder="请输入来自樊樊直播间近3个月的订单号" /></view>
				<view class="button">提交转换</view>
			</view>
<!-- 			<view class="u-flex " style="justify-content: flex-end;margin-top: 42rpx;">
				<image style="width: 32rpx;height: 33rpx;" src="static/images/kefu.png" mode=""></image>
				<text class="font">联系客服</text>
			</view> -->
			<button open-type="contact" class="u-flex bor" style="justify-content: flex-end;margin-top: 42rpx;background-color: transparent;border:none;outline: none;">
				<image style="width: 32rpx;height: 33rpx;" src="static/images/kefu.png" mode=""></image>
				<text class="font">联系客服</text>
			</button>
		</view>
		<view class="content">
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: '',
				type: 'text',
			};
		}
	}
</script>

<style lang="scss">
	.bor::after{
		border:none
	}
	.content{
		margin-top: -50rpx;
		height: 70vh;
		width: 750rpx;
		background: rgba(255,255,255,1);
		border-radius: 72rpx 72rpx 0rpx 0rpx;
		padding: 34rpx 24rpx;
	}
	.font {
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		line-height: 48rpx;
		color: #5881C1;
		margin-left: 16rpx;
	}

	.button {
		width: 486rpx;
		height: 90rpx;
		background: rgba(143, 211, 243, 1);
		border-radius: 46rpx;
		margin-top: 58rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 90rpx;
		color: #FFFFFF;
		text-align: center;
	}

	.top {
		height: 430rpx;
		width: 100vw;
		background-color: #CFF4FE;
		padding: 48rpx 32rpx 46rpx;
		box-sizing: border-box;
	}
</style>