zd_wechatApp/pages/noLogin/regulatorBoxList.vue

<template>
	<view>
		<image src="https://cczdsz.cn/app/images//background-from.png" mode="" class="background"></image>
		<view>
			<view class="sousuo">
				<u-search  placeholder="调压箱名称" @search="getProjectList(true)" v-model="name"  :show-action="false"></u-search>
				<!-- <u-select v-model="showName" :list="workList"  label-name="name" value-name="id" @confirm="worker()" @cancel="cancelWorker()"></u-select> -->
					<u-search placeholder="调压箱编号" v-model="code"  :show-action="false" :action-style="{'font-size':'40rpx'}"
						@search="getProjectList(true)"></u-search>
						<u-search placeholder="管理所编号" v-model="administrativeOffice"  :show-action="false" :action-style="{'font-size':'40rpx'}"
							@search="getProjectList(true)"></u-search>
			</view>

			<view v-for="(item,index) in list" :key="index">
				<view class="project-content houseList" @click="gotoindex(item)">
					<view class="font-forty-eight houseList_in">
						<view style="display: flex;flex-direction: column;">
						<span>调压箱名称:{{item.name}}</span>
						<span style="font-size: 15px;">调压箱编号:{{item.number}}</span>
						<!-- <span style="font-size: 15px;">管理所:{{item.managementOffice}}</span> -->
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	import service from '@/api/index.js'
	export default {
		data() {
			return {
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: false,
					second: false
				},
				showName:false,
				showTime: false,
				list: [],
				workList: [],
				value: '',
				nameValue: '',
				name:'',
				userName:'',
				civilPower: '',
				form:{},
				userId:'',
				code:'',administrativeOffice:'',
				ReachBottom:false,
				page:1,
				total:0
			}

		},
		onLoad() {
			this.getUserName();

			this.getWorker();
			uni.setNavigationBarColor({
			    frontColor: '#ffffff',
			    backgroundColor: '#2d95f4',
			})
		},
		onTabItemTap(e)
		{
			console.log(e)
			uni.removeStorageSync('type')
		},
		onReachBottom(){
			console.log('触底')
			this.getReachBottom()
		},
		onPullDownRefresh()
		{
			console.log('下拉刷新')
			this.getReachBottom()
		},
		methods: {
			getReachBottom()
			{
				if (this.ReachBottom) {

					this.page+=1
					this.getProjectList()
					}else
					{
						this.page=1
						this.ReachBottom=false
					}

			},
			getWorker()
			{
				service.getWorker().then(res => {
					this.workList=res
				})
			},
			worker(e)
			{
				this.userName=e[0].label
				this.userId=e[0].value
				this.getProjectList()
			},
			cancelWorker()
			{
				this.userName=''
				this.userId=''
			},
			time(e)
			{
				 this.form.time=e
			},
			gotoindex(item) {
				console.log(item)
				uni.navigateTo({
					url:`/pages/noLogin/PressureRegulatingBox/PressureRegulatingBox?number=${item.number}&name=${item.name}&managementOffice=${item.managementOffice}&id=${item.id}&type=2`
				})
			},
			topage(url) {
				uni.navigateTo({
					url
				})
			},
			getProjectList(flag) {
				if(flag){
					this.list=[];
				}
				service.getregulatorBoxList({inspector:this.userId,name:this.name,number:this.code,managementOffice:this.administrativeOffice,pageSize:10,pageNum:this.page}).then(res => {
					console.log('getregulatorBoxList', res)
					if (res.rows.length == 0) {
						this.$UTILS.showPrompt('暂无项目!')
					}
					this.total=res.total
					if(res.total>this.page*10)
					{
						this.ReachBottom=true
					}else
					{
						this.ReachBottom=false
					}
					this.list.push(...res.rows)
				})
			},
			getUserName() {
				service.getUserName().then(res => {
					this.userId=res.id
					this.civilPower = res.civilPower;
					this.getProjectList();
				})
			},
		},
	}
</script>

<style lang="scss" scoped>
	.background {
		z-index: -1;
		position: fixed;
		width: 100%;
		height: 100%;
		background-size: 100% 100%;
	}

	.project {
		border-radius: 72rpx;
		padding: 25rpx 0;
		text-align: center;
		margin: 170rpx 55rpx 0;
	}

	.project-content {
		width: 90%;
		margin: 40rpx auto;
		padding: 30rpx 20rpx;
		border-radius: 20rpx;
		background: #edf5ff;
		box-shadow: 0rpx 6rpx 8rpx #d3e6ff;
	}
	.houseList_in{
		display: flex;
		justify-content:space-between;
		align-items:center;
		color: #cbcbcb;
		font-size: 38rpx;
	}
	.houseList_in span{
		font-size: 36rpx;
		color: #333;
	}
	.sousuo{
		display: flex;
		justify-content:space-between;
		align-items:center;
	}
	.position {
		position: absolute;
		bottom: 100rpx;
		right: 50rpx;

		.arrow {
			width: 152rpx;
			height: 152rpx;
			border-radius: 50%;
			padding: 25rpx;
			margin-left: 20rpx;
		}
	}

</style>