smartswrtch-app/pages/daili/bangzhu.vue

<template>
	<view>
		<u-navbar :is-back="true" title='帮助中心' title-color="#000" :border-bottom="false" :background="true" id="navbar">
		</u-navbar>
		<image src="https://api.ccttiot.com/smartmeter/img/static/ufS7gK1UMf2qgXlzUw1u" class="imgbj" mode=""></image>
        <view class="box">
        	<view class="serch">
        		<image src="https://api.ccttiot.com/smartmeter/img/static/uQ7koGotmd07EoqfPkQ8" mode=""></image> <input type="text" placeholder="请输入您的问题" /> <view class="sousuo">搜索</view>
        	</view>
			<view class="name">
				常见问题
			</view>
			<view class="list">
				<view class="list_item">
					<view class="lt">
						<image src="https://api.ccttiot.com/smartmeter/img/static/u1zFYYPCMcry9fkjSEjk" mode=""></image>
						<view class="">设备相关</view>
					</view>
					<view class="rt">
						<view class="" @click="btnxq">怎么绑定设备？</view>
						<view class="">怎么绑定设备？</view>
						<view class="">设备绑定不了怎么办？</view>
					</view>
				</view>
				<view class="list_item">
					<view class="lt">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uedKhx4vtckmamzJjsZb" mode=""></image>
						<view class="">套餐相关</view>
					</view>
					<view class="rt">
						<view class="">怎么绑定设备？</view>
						<view class="">怎么绑定设备？</view>
						<view class="">设备绑定不了怎么办？</view>
					</view>
				</view>
				<view class="list_item">
					<view class="lt">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uukAvGFkLNaUkvdEB4qm" mode=""></image>
						<view class="">提现相关</view>
					</view>
					<view class="rt">
						<view class="">怎么绑定设备？</view>
						<view class="">怎么绑定设备？</view>
						<view class="">设备绑定不了怎么办？</view>
					</view>
				</view>
			</view>
			<view class="bot" @click="btnkf">
				找不到答案？<text>联系客服吧</text>
			</view>
        </view>
		
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {
		
		},
		methods: {
			btnkf(){
				uni.navigateTo({
					url:'/page_user/Feedback'
				})
			},
			btnxq(){
				uni.navigateTo({
					url:'/pages/daili/bangzhuxq'
				})
			}
		}
	}
</script>																				

<style lang="less">
	.imgbj{
		width: 750rpx;
		height: 548rpx;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
	}
	.box{
		margin-top: 296rpx;
		width: 750rpx;
		height: 1130rpx;
		background: #FFFFFF;
		border-radius:50rpx 50rpx 0 0;
		padding-top: 32rpx;
		box-sizing: border-box;
		.bot{
			width: 100%;
			text-align: center;
			font-size: 32rpx;
			color: #3D3D3D;
			margin-top: 30rpx;
			text{
				color: #8883F0;
			}
		}
		.list{
			width: 724rpx;
			margin: auto;
			margin-top: 32rpx;
			// padding: 22rpx 0;
			box-sizing: border-box;
			max-height: 840rpx;
			border-top: 1rpx solid #D8D8D8; 
			border-bottom: 1rpx solid #D8D8D8;
			.list_item:last-child{
				border: none;
			}
			.list_item{
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-bottom: 1rpx solid #D8D8D8;
				.lt{	
					width: 200rpx;
					text-align: center;
					image{
						width: 80rpx;
						height: 80rpx;
					}
					view{
						font-size: 30rpx;
						color: #3D3D3D;
					}
				}
				.rt{
					width: 513rpx;
					view{
						height: 86rpx;
						line-height: 86rpx;
						border-bottom: 1rpx solid #D8D8D8;
					}
					view:last-child{
						border: none;
					}
				}		
			}
		}
		.name{
			font-weight: 600;
			font-size: 36rpx;
			color: #3D3D3D;
			width: 100%;
			margin-top: 32rpx;
			padding-left: 40rpx;
			box-sizing: border-box;
		}
		.serch{
			width: 670rpx;
			height: 86rpx;
			background: #F0F0F0;
			border-radius: 10rpx 10rpx 10rpx 10rpx;
			margin: auto;
			display: flex;
			align-items: center;
			padding-left: 38rpx;
			box-sizing: border-box;
			image{
				margin-right: 22rpx;
				width: 32rpx;
				height: 32rpx;
			}
			input{
				width: 460rpx;
				height: 86rpx;
				background: #F0F0F0;
				line-height: 86rpx;
			}
			.sousuo{
				border-left: 1px solid #95989D;
				font-size: 30rpx;
				color: #3D3D3D;
				height: 60rpx;
				line-height: 60rpx;
				text-align: center;
				width: 136rpx;
			}
		}
	}
	
</style>