<template>
	<view>
		<image src="/static/icon/background.png" mode="" class="background"></image>
		<view class="" style="padding-top: 90rpx;">
			<back></back>
		</view>
		<view style="padding-top: 60rpx;">
			<view style="margin: 20rpx;">
				<u-search placeholder="请输入搜索内容" v-model="nameValue" :action-style="{'font-size':'40rpx'}" @custom="getProjectList()"></u-search>
			</view>
			<view v-for="(item,index) in list" :key="index" >
				<view class="project-content" v-if="item.name == '灶管阀改造' && civilPower.includes('pu1')" @click="gotoindex()">
					<view>
						<view class="font-forty-eight blue">
							项目名称：{{item.name}}
						</view>
						<view class="font-forty-eight blue">
							项目地址：{{item.address}}
						</view>
					</view>
				</view>
				<view class="project-content" v-else-if="item.name == '安检' && civilPower.includes('pu2')" @click="topage(`/pages/noLogin/data?id=${item.id}&name=${item.name}&address=${item.address}`)">
					<view >
						<view class="font-forty-eight blue">
							项目名称：{{item.name}}
						</view>
						<view class="font-forty-eight blue">
							项目地址：{{item.address}}
						</view>
					</view>
				</view>
				<view class="project-content" v-else-if="item.name == '维修' && civilPower.includes('pu3')" @click="topage(`/pages/noLogin/data?id=${item.id}&name=${item.name}&address=${item.address}`)">
					<view >
						<view class="font-forty-eight blue">
							项目名称：{{item.name}}
						</view>
						<view class="font-forty-eight blue">
							项目地址：{{item.address}}
						</view>
					</view>
				</view>
				<view class="project-content" v-else-if="item.name == '开栓' && civilPower.includes('pu4')" @click="topage(`/pages/noLogin/data?id=${item.id}&name=${item.name}&address=${item.address}`)">
					<view >
						<view class="font-forty-eight blue">
							项目名称：{{item.name}}
						</view>
						<view class="font-forty-eight blue">
							项目地址：{{item.address}}
						</view>
					</view>
				</view>
				<view class="project-content" v-else-if="
						item.name != '灶管阀改造' && 
						item.name != '安检' && 
						item.name != '维修' && 
						item.name != '开栓' && 
						civilPower.includes('pu5')"
					@click="topage(`/pages/noLogin/uploadProject?id=${item.id}&name=${item.name}&address=${item.address}`)">
					<view>
						<view class="font-forty-eight blue">
							项目名称：{{item.name}}
						</view>
						<view class="font-forty-eight blue">
							项目地址：{{item.address}}
						</view>
					</view>
				</view>
				<view v-else></view>
			</view>
		</view>
	</view>
</template>

<script>
	import service from '@/api/index.js'
	export default {
		data() {
			return {
				list:[],
				value:'',
				nameValue:'',
				civilPower:''
			}
		},
		onLoad(e) {
			console.log(e)
			this.value = e.value
			this.getProjectList();
			this.getUserName();
		},
		methods: {
			gotoindex(){
				uni.switchTab({
					url:'/pages/index/index'
				})
			},
			topage(url){
				uni.navigateTo({
					url
				})
			},
			getProjectList() {
				service.getProjectList({engineType:this.value,name:this.nameValue}).then(res=>{
					console.log('getProjectType', res)
					if(res.length == 0){
						this.$UTILS.showPrompt('暂无项目!')
					}
					this.list = res;
				})
			},
			getUserName(){
				service.getUserName().then(res=>{
					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>
