<ion-header>
	<ion-navbar>
		<ion-title text-center>活动报名</ion-title>
	</ion-navbar>
</ion-header>
<ion-content class="content">

	<div class="item1">
		<div class="img-box">
			<img class="item1-image" src="./assets/imgs/logo.png">
		</div>
		<div class="item1-content">
			<div class="margin-5-0">
				<label class="item1-title">{{activity?.activityName}}</label>
				<div class="item1-content-box">
					<ion-icon name="md-contact" class="item1-icon"></ion-icon>
					 <span class="item-type" *ngIf="activity?.activityType =='1'">体检</span>
					 <span class="item-type" *ngIf="activity?.activityType =='2'">疗养师</span>
					 <span class="item-type" *ngIf="activity?.activityType =='3'">培训</span>
					 <span class="item-type" *ngIf="activity?.activityType =='4'">工会活动</span>
				</div>
			</div>
			<div class="item1-introduction">
				<!-- {{activity.activityIntro}} -->
				{{activity.activityIntro}}
				<button class="btn-introduce" (click)="show()">具体介绍</button>
			</div>
		</div>
	</div>

	<div class="item2">
		<ion-list class="item-list">
			<ion-item class="list-title">
				<label class="item-label">
					<span class="item-title">
						批次信息
						 <ng-container *ngIf="batchList.length > 0">
							 (最多可报名
								<span *ngIf="activity.applyCount == 0 || !activity.applyCount">{{ batchList.length}}</span>
								<span *ngIf="activity.applyCount != 0">{{activity.applyCount}}</span>
							个批次信息)
						 </ng-container>
					</span>
				</label>
			</ion-item>
			<ion-item class="item2-content"  *ngIf="batchList.length > 0">
				<div *ngFor="let batch of batchList" class="item2-box" (click)="goBatchDetail(batch)">
					<p>
						<span class="color-666">批次名称:</span>
						<span>{{batch.batchName}}</span>
						<ng-container *ngIf="batch.signUp">
							<span *ngIf=" batch.hasSignUpCount < batch.batchLimitNumber">
								<span class="activity-btn2" *ngIf="batch.order" float-right>已报名</span>
								<span class="activity-btn2" *ngIf="!batch.order" float-right>未报名</span>
							</span>
							<span *ngIf="batch.hasSignUpCount == batch.batchLimitNumber" class="activity-btn2" float-right>已满员</span>
						</ng-container>
						<ng-container *ngIf="! batch.signUp">
							<span class="activity-btn2" float-right>已截止</span>
						</ng-container>

					</p>
					<p>
						<span class="color-666">截止时间:</span>
						<span>{{batch.batchEndDate}}</span>
						<span class="color-24bafc" float-right>{{batch.hasSignUpCount}}/{{batch.batchLimitNumber}}</span>
					</p>
				</div>
			</ion-item>
			<p class="no-info" *ngIf="batchList.length == 0">
				暂无批次
			</p>
		</ion-list>
	</div>

	<!--<div class="item4 item-margin">-->
		<!--<ion-list class="item-list">-->
			<!--<ion-item>-->
				<!--<label class="item-label">-->
					<!--<span class="item-title">-->
						<!--活动说明-->
					<!--</span>-->
				<!--</label>-->
			<!--</ion-item>-->
			<!--<ion-item>-->
				<!--<label class="little-title-box">-->
					<!--<span class="little-title">时间</span>-->
				<!--</label>-->
				<!--<label class="item4-content">{{activity.time}}</label>-->
			<!--</ion-item>-->
			<!--<ion-item>-->
				<!--<label class="little-title-box">-->
					<!--<span class="little-title">地点</span>-->
				<!--</label>-->
				<!--<label class="item4-content">{{activity.location}}</label>-->
			<!--</ion-item>-->
			<!--<ion-item>-->
				<!--<label class="little-title-box">-->
					<!--<span class="little-title">交通</span>-->
				<!--</label>-->
				<!--<label class="item4-content">{{activity.musterTime}}</label>-->
			<!--</ion-item>-->
			<!--<ion-item>-->
				<!--<label class="little-title-box">-->
					<!--<span class="little-title">参与</span>-->
				<!--</label>-->
				<!--<label class="item4-content">{{activity.deadlineTime}}</label>-->
			<!--</ion-item>-->
		<!--</ion-list>-->
	<!--</div>-->
	<!--<div class="item5 item-margin">-->
		<!--<ion-list class="item-list">-->
			<!--<ion-item>-->
				<!--<label class="item-label">-->
					<!--<span class="item-title">-->
						<!--活动须知-->
					<!--</span>-->
				<!--</label>-->
			<!--</ion-item>-->
			<!--<ion-item class="item5-content">-->
				<!--<p>1.体检人员在体检服务窗口出示身份证即可；</p>-->
				<!--<p>2.体检前三天注意清淡饮食，规律作息；</p>-->
				<!--<p>3.体检前一天20:00后避免进食；</p>-->
				<!--<p>4.体检当天完成抽血、彩超后方可进食。</p>-->
			<!--</ion-item>-->
		<!--</ion-list>-->
	<!--</div>-->
	<!--<button ion-button block (click)="goJoinDetail()">人员参与情况</button>-->
</ion-content>

<div class="cover" *ngIf="isCover">
	<div class="cover-content">
		<div class="cover-content-box">
			<h4 class="cover-content-title">具体介绍</h4>
			<div class="cover-content-info">
				<p>
					{{activity?.activityIntro}}
				</p>
			</div>
			<button ion-button block (click)="hidden()">
				关闭
			</button>
		</div>
	</div>
</div>