<template>
	<view class="fullHeight">
		<headers :showBack="true" :themeType="'white'" class="fixedHeaderBox">
			<view class="headerName">
				查队伍
			</view>
		</headers>
		<view class="searchBox" :style="{ 'padding-top': (statusBarHeight+52) + 'px' }">
			<input type="text" v-model="teamName" confirm-type="search" class="input" placeholder-style="color:rgba(72, 141, 236, 0.5)" placeholder="按班组名称查找" @confirm="list=[];loadData()" />
		</view>
		<view class="listBox" :style="{ 'padding-top': (statusBarHeight+52+40) + 'px' }">
			<view class="listItem" v-for="item in list" :key="item.id" @click="goAdd(item.id)">
				<view class="title">
					{{item.teamName}}-{{item.enterpriseName}}
				</view>
				<view class="bottom">
					<image src="/static/icon-person.png" class="icon-person"></image>
					<text class="time">{{item.totalPersonNum}}人</text>
				</view>
				<image src="/static/icon-right.png" class="icon-right"></image>
			</view>
			<view class="placeholderBox" v-show="list.length==0">
				<image src="/static/noData.png" class="noDataImg"></image>
				<view class="text">
					暂无数据
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				projectDetail:{},
				list:[],
				statusBarHeight:0,
				teamName:''
			};
		},
		mounted() {
			this.statusBarHeight=uni.getStorageSync('systemInfo').statusBarHeight
			this.projectDetail=JSON.parse(uni.getStorageSync('projectDetail'))
			this.loadData()
		},

		methods:{
			loadData(){
				var that = this
				this.sendRequest({
					url: 'xmgl/workerInfo/selectAllProjectTeamList',
					data: {teamName:this.teamName,projectSn:this.projectDetail.projectSn},
					method: "POST",
					success(res){
						that.list=res.result
					}
				})
			},
			goAdd(id){
				uni.navigateTo({
					url:'./personList?id='+id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.searchBox{
	background-color: #2b8df3;
	padding: 0 15px 5px;
	position: fixed;
	left: 0;
	// width: calc(100% - 30px);
	width: 100%;
	top: 0;
	z-index: 1;
	.input{
		border-radius: 18px;
		height: 35px;
		text-align: center;
		background-color: white;
	}
}
.listBox{
	margin: 15px;
}
.listItem{
	box-shadow: 0px 4px 13px 0px rgba(212, 220, 236, 0.53);
	position: relative;
	margin-bottom: 5px;
	padding: 15px;
	border-radius: 8px;
	.title{
		font-size: 15px;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.bottom{
		color: rgba(55, 45, 102, 0.5);
		font-size: 12px;
		display: flex;
		align-items: center;
	}
	
	.time{
		margin-left: 6px;
	}
}
.icon-right{
	position: absolute;
	width: 8px;
	height: 14px;
	right: 15px;
	top: calc(50% - 7px);
}
.icon-person{
	width: 14px;
	height: 14px;
}
</style>
