zd_wechatApp/pages/noLogin/listProject.vue

<template>
	<view>
		<image src="/static/icon/background.png" mode="" class="background"></image>
		<view class="" style="padding-top: 0rpx;">
			<!-- <back></back> -->
		</view>
		<view >
			<u-grid :col="4">
					<u-grid-item @click="getProjectList(index1)" v-for="(item, index1) in viewList" :bg-color="index1==index ? '#6aabff':''" :index="index1">
						<image :src="item.src" mode="" style="height: 100rpx;width: 100rpx;"></image>
						<view class="grid-text">{{item.name}}</view>
					</u-grid-item>
				</u-grid>
				<view>
					<u-search placeholder="请输入搜索内容" v-model="value1"  shape="square" :show-action="false" :action-style="{'font-size':'40rpx'}" @search="gethosList()"></u-search>
				</view>
			<view v-for="(item,index) in list" :key="index" >
				<view class="project-content"  @click="gotoindex(item)">
					<view>
						<view class="font-forty-eight blue">
							项目名称：{{item.name}}
						</view>
						<view class="font-forty-eight blue">
							项目时间：{{item.time}}
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import service from '@/api/index.js'
	export default {
		data() {
			return {
				list:[],
				value:'',
				value1:'',
				nameValue:'',
				civilPower:'',
				userId:'',
				index:-1,
				ReachBottom:true,
				page:1,
				viewList:[{name:'抢险维修',src:'../../static/icon/qxwx.png'},{name:'调压箱管理',src:'../../static/icon/xxdy.png'},{name:'庭院网管',src:'../../static/icon/tywg.png'},{name:'警示桩管理',src:'../../static/icon/jsz.png'}]
			}
		},
		onLoad(e) {
			console.log(e)
			this.nameValue = e.nameValue
			//this.getProjectList();
			this.getUserName();
			uni.setNavigationBarTitle({
					title: '历史记录',
			});
			uni.setNavigationBarColor({
			    frontColor: '#ffffff',
			    backgroundColor: '#2d95f4',
			})
		},
		onReachBottom(){
			console.log('触底')
			this.getReachBottom()
		},
		onPullDownRefresh()
		{
			console.log('下拉刷新')
			this.getvalueproject()
		},
		methods: {
			getReachBottom()
			{
				if (this.ReachBottom) {
					
					this.page+=1
					this.getvalueproject()
					}else
					{
						this.page=1
						this.ReachBottom=false
					}
			
			},
			gotoindex(item){
				console.log(item)
				if(this.index==1)
				{//调压箱
				console.log(item)
					uni.navigateTo({
						url: `/pages/noLogin/PressureRegulatingBox/PressureRegulatingBox?type=1&id=${item.id}`
					})
				}else if(this.index==2)
				{//庭院管理
					uni.navigateTo({
						url: `/pages/noLogin/CourtyardNetworkManagement/CourtyardNetworkManagement?type=1&id=${item.id}`
					})
				}else if(this.index==0)
				{//抢险维修
					uni.navigateTo({
						url: `/pages/noLogin/emergencyRepairOrder/emergencyRepairOrder?type=1&id=${item.id}`
					})
				}else if(this.index==3)
				{//警示桩
				console.log(item)
				let url1= `/pages/noLogin/WarningPileForm/WarningPileForm?type=1&id=${item.id}`
					uni.navigateTo({
						url: url1
					})
				}
				// uni.switchTab({
				// 	url:'/pages/index/index'
				// })
			},
			topage(url){
				uni.navigateTo({
					url
				})
			},
			getvalueproject()
			{
				service.getSearch({type:this.index,userId:this.userId,page:this.page,size:10,value:this.value1}).then(res=>{
					console.log('getProjectType', res)
					if(null==res){
						//this.$UTILS.showPrompt('暂无历史记录!')
						return
					}
					let list1=[]
					list1=res
					this.list.push(...list1)
	// 				list1.forEach(item=>{
	
	// 					this.list.push(item)
	// 				})
						
					//this.list = res;
				})
			},
			gethosList()
			{
				service.getSearch({type:this.index,userId:this.userId,page:this.page,size:10,value:this.value1}).then(res=>{
								console.log('getProjectType', res)
								if(res.length == 0){
									this.list=[]
									this.$UTILS.showPrompt('暂无历史记录!')
									return
								}
								let list1=[]
								list1=res
								list1.forEach(item=>{
									this.list.push(item)
								})
									
								this.list = res;
							})
			},
			getProjectList(val) {
				this.page=1
				this.value1=''
				this.ReachBottom=true
				console.log(val,'11111111')
				if(val==this.index)
				{
					this.index=-1
					return
				}
				this.index=val
				this.list=[]
				service.getSearch({type:val,userId:this.userId,page:this.page,size:10,value:this.value1}).then(res=>{
					console.log('getProjectType', res)
					if(res.length == 0){
						this.$UTILS.showPrompt('暂无历史记录!')
						return
					}
					let list1=[]
					list1=res
					list1.forEach(item=>{
						 if(item.type==1)
						{
							item.typeValue='调压箱'
						}else if(item.type==2)
						{
							item.typeValue='庭院管网'
						}
						else if(item.type==3)
						{
							item.typeValue='抢险维修'
						}else if(item.type==4)
						{
							item.typeValue='警示桩'
						}
						this.list.push(item)
					})
		
					//this.list = res;
				})
			},
			getUserName(){
				service.getUserName().then(res=>{
					this.userId=res.id
					this.civilPower = res.civilPower;
				})
			},
		},
	}
</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 {
		border: 4rpx solid #3857F3;
		margin: 40rpx 55rpx 0;
		padding: 30rpx 20rpx;
		border-radius: 48rpx;
	}
	.position{
		position: absolute;
		bottom: 100rpx;
		right: 50rpx;
		.arrow{
			width: 152rpx;
			height: 152rpx;
			border-radius: 50%;
			padding: 25rpx;
			margin-left: 20rpx;
		}
	}
	
</style>