<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport"
			content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, viewprot-fit:cover">
		<title>培训演练</title>
		<script type="text/javascript" src="../sdk/includeHead.js"></script>
	</head>
	<body>
	<div id="app">
		<div class="wrapper" v-cloak>
			<!-- 商户头部信息 -->
			<div class="header" v-if="userType=='shop'">
				<van-search v-model="title" show-action placeholder="请输入培训演练标题" @search="onSearch">
					<template #action>
						<div @click="onSearch"></div>
					</template>
				</van-search>
			</div>
			<div class="header" v-if="userType!='shop'">
				<van-search v-model="merName" show-action placeholder="请输入商家名称关键字" @search="onSearch">
					<template #action>
						<div @click="onSearch"></div>
					</template>
				</van-search>
			</div>
			<!-- 功能 -->
			<button v-if="userType=='shop'" type="info" class="func_btn" @click="viewDetail"><span>+</span>新增{{activeTab==0?'安全培训':'应急演练'}}</button>

			<!-- Tab栏 -->
			<van-tabs v-model:active="activeTab" @click="clickTab" title-active-color="#1989fa" line-height="2px"
				style="margin-bottom: 15px;">
				<van-tab :title="item.dictLabel" v-for="item in tabList4lv1"></van-tab>
		<!-- 		<van-tab title="安全培训" name="0"></van-tab>
				<van-tab title="应急演练" name="1"></van-tab> -->

			<div class="subNavWrapper">
				<!-- 隐患记录子Tab -->
				<van-tabs v-if="activeTab==0" v-model:active="subActiveTab" @click="clickSubTab" type="card">
					<van-tab :title="item.dictLabel" v-for="item in tabList4lv2"></van-tab>
					<!-- <van-tab title="全部"></van-tab>
					<van-tab title="特种作业"></van-tab>
					<van-tab title="常规"></van-tab>
					<van-tab title="新员工"></van-tab> -->
				</van-tabs>
				<!-- 隐患列表 -->
				<van-list v-model:loading="loading" :offset="10" :finished="finished" finished-text="没有更多了" @load="getList" :immediate-check="false">
					<div class="msgTip" v-if="reMark && userType=='shop'">
						{{reMark}}
					</div>
					<van-cell v-for="item in hazardList" :key="item.id" @click="viewDetail(item)">
						<div style="width: 100%;position: relative;">
							<!-- 第一行：商户名称 -->
							<div class="tab1-row1 bold">{{ item.title }}</div>
							<div class="tab1-row1" v-if="userType!='shop'">
							  <span>商家名称：{{ item.merName }}</span>
							</div>
							<div class="tab1-row1" v-if="!(activeTab==0&&subActiveTab==0)">
							  <span>日期：{{ item.exerciseDate }}</span>
							</div>
							<!-- 只有安全培训的全部时显示该内容 -->
							<div class="tab1-row2" v-if="activeTab==0&&subActiveTab==0">
							    <span>日期：{{ item.exerciseDate }}</span>
							    <span>类型：{{ item.typeName }}</span>
							</div>
					  
							<!-- 第三行：监察人 + 检查日期（两列） -->
							<div class="tab1-row2">
							  <span v-if="activeTab==0">培训人数：{{ item.participantsNum }}</span>
							  <span v-if="activeTab==1">演练人数：{{ item.participantsNum }}</span>
	
							   <span>负责人：{{ item.responsiblePerson }}</span>
							</div>
						</div>
					</van-cell>
				</van-list>
			</div>
		
		</div>
		</body>
</html>