<template>
	<view class="check">
		<view class="check-top">
			<u-input
			  placeholder="输入物联设备类型/设备编号进行搜索"
			  prefixIcon="search"
			  prefixIconStyle="font-size: 52rpx;color: #000"
			></u-input>
			<view class="check-top-icon" @click="navigateCheck">
				图标1
			</view>
		</view>
		<view class="check-center-info" v-for="item in list" :key="item.name">
			<view class="list-left">
				<view>{{item.name}}</view>
				<view>({{item.numberNo}})</view>
			</view>
			<view class="list-center">
				{{item.status}}
			</view>
			<view class="list-right">
				<text>图标</text>
				<text>图标</text>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
	data() {
	  return {
	  	list:[
	  	{name:'井盖1',status: '正常',numberNo:'112022010260'},
	  	{name:'井盖2',status: '异常',numberNo:'112022010260'},
		{name:'井盖1',status: '正常',numberNo:'112022010260'},
		{name:'井盖1',status: '正常',numberNo:'112022010260'},
		{name:'井盖1',status: '正常',numberNo:'112022010260'},
	  	],
	  }
	},
	methods:{
		navigateCheck(){
			wx.navigateTo({
			  url: '/pages/reportList/reportList',
			});
		},
	}
	}
</script>

<style scoped lang="scss">
	.check {
		padding: 10rpx;
		.check-top{
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 20rpx;
			.check-top-icon{
				cursor:pointer;
				margin-left: 35rpx;
			}
		}
		.check-center-info{
			margin-top: 20rpx;
			padding: 20rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 2rpx #ccc solid;
		}
		.list-left{
			text-align: center;
		}
		.list-right{
			width: 160rpx;
			display: flex;
			justify-content: space-between;
		}
	}
</style>