<!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">
				<!-- <div class="level">安全等级</div> -->
				<div class="title">
					<img src="../image/code/sj.png" alt="">
					<span style="display: inline-block; max-width: 4.5rem;word-break: break-all;">{{merInformation.unitName}}</span>
					<span class="tag green" v-if="merInformation.safeLevel==0" @click="gotoPage('anquan_level')">安全等级-绿</span>
					<span class="tag yellow" v-if="merInformation.safeLevel==1" @click="gotoPage('anquan_level')">安全等级-黄</span>
					<span class="tag red" v-if="merInformation.safeLevel==2" @click="gotoPage('anquan_level')">安全等级-红</span>
				</div>
				<span style="font-weight: 500;
					font-size: 0.28rem;
					color: rgb(133, 133, 133);
					position: absolute;
					top: 0;
					left: 1.2rem;
					top: 1.1rem;">{{ merInformation.gridName || '' }}</span>
				<div class="detail">
					<van-row>
						<van-col span="24">场所类型: {{merInformation.smallPlaceTypeName}}</van-col>
						<div class="detail_link"  @click="navTo('shanghu_detail-edit')">详情<van-icon name="arrow" /></div>
					</van-row>
					<van-row type="flex" justify="space-around"
						style="width:100%; margin-top: .3rem; margin-bottom: .3rem;">
						<van-col span="6">自查数:{{merInformation.checkSelfCount}}</van-col>
						<van-col span="6">检查数:{{merInformation.checkCount}}</van-col>
						<van-col span="6">隐患数:{{merInformation.hiddenCount}}</van-col>
						<van-col span="6">未整改:{{merInformation.hiddenNoReCount}}</van-col>
					</van-row>
					<van-row>
						<van-col span="24">{{merInformation.businessAddress}}</van-col>
					</van-row>

				</div>

			</div>
			<!-- 功能 -->
			<button type="info" v-show="UserPermission" class="func_btn" @click="navTo('check_info')"><span>+</span>安全检查</button>

			<!-- Tab栏 -->
			<van-tabs v-model:active="activeTab" @click="clickTab" title-active-color="#1989fa" line-height="2px"
				style="margin-bottom: 15px;">
				<van-tab title="隐患整改"></van-tab>
				<van-tab title="检查记录"></van-tab>
				<van-tab title="自查记录"></van-tab>
				<van-tab title="培训演练"></van-tab>
			</van-tabs>

			<div v-show="activeTab===0" class="subNavWrapper">

				<!-- 隐患记录子Tab -->
				<van-tabs v-model:active="subActiveTab" type="card">
					<van-tab title="全部"></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>
					<van-cell v-for="item in filteredHazards" :key="item.id" @click="viewDetail(item,'YH_XQ')">
						<div style="width: 100%;">
							<!-- 第一行：隐患描述 -->
							<div style="
								white-space: nowrap;
								overflow: hidden;
								text-overflow: ellipsis;
								color: #333;
								font-size: 0.3rem;
								font-weight: bold;
								font-family: PingFang SC;
							">{{ item.description }}</div>

							<!-- 第二行：状态和时间 -->
							<div style="display: flex; justify-content: start; gap: .34rem; margin: 8px 0;">
								<van-tag :type="statusTagType(item.rectificationStatus)" v-if="!item.reMark">
									{{ item.rectificationStatusName }}
								</van-tag>
								<van-tag type="primary-bold" v-if="item.reMark">
									复整改
								</van-tag>
								<span
									style="color: #737373; font-size: 0.28rem;margin-left: -1.6rem;">检查时间：{{ item.checkDate }}</span>
								<van-icon name="arrow" class="navToBtn" @click="viewDetail(item,'YH_XQ')" />
							</div>


							<!-- 第三行：商家和箭头 -->
							<div style="display: flex; justify-content: space-between; align-items: center;">
								<span style="color: #666; font-size: 0.28rem;">商家名称：{{ item.merName }}</span>
							</div>
						</div>
					</van-cell>
				</van-list>
			</div>

			<!-- 检查记录 -->
			<div v-show="activeTab>0 && activeTab<=2" class="subNavWrapper">

				<van-list>
					<van-cell v-for="item in jcLisk" :key="item.id" @click="viewDetail(item,'JC_XQ')" >
						<div style="width: 100%;">
							<!-- 第一行：隐患描述 -->
							<div style="
								white-space: nowrap;
								overflow: hidden;
								text-overflow: ellipsis;
								color: #333;
								font-size: 0.3rem;
								font-weight: bold;
								font-family: PingFang SC;
								">九小场所消防安全检查清单</div>
							<!-- ">{{ item.description }}</div> -->

							<!-- 第二行：状态和时间 -->
							<div style="display: flex; justify-content: space-between; margin: 8px 0;">
								<span style="color: #737373; font-size: 0.28rem;">时间：{{ item.checkDate }}</span>
							</div>

							<!-- 第三行：商家和箭头 -->
							<div>
								<van-row type="flex" justify="start" style="width:100%;">
									<van-col span="8">检查人:{{item.checkPeopleName}}</van-col>
									<van-col span="8">隐患数:{{item.hiddenCount}}</van-col>
									<van-col span="8">未整改:{{item.notRectifiedCount}}</van-col>
								</van-row>
							</div>
						</div>
					</van-cell>
				</van-list>
			</div>

			<!-- 培训演练 -->
			<div v-show="activeTab==3" class="subNavWrapper">
				<van-list>
					<div class="msgTip" v-if="reMark">
						{{reMark}}
					</div>
					<van-cell v-for="item in ylList" :key="item.id" @click="viewYlDetail(item)">
						
						<div style="width: 100%;">
							<!-- 第一行：隐患描述 -->
							<div style="
								white-space: nowrap;
								overflow: hidden;
								text-overflow: ellipsis;
								color: #333;
								font-size: 0.3rem;
								font-weight: bold;
								font-family: PingFang SC;
							">{{ item.title }}</div>

							<!-- 第二行：状态和时间 -->
							<div style="display: flex; justify-content: start; gap: .34rem; margin: 8px 0;">
								<van-tag type="primary">
									{{ item.typeName || '-' }}
								</van-tag>
								<span
									style="color: #737373; font-size: 0.28rem;">日期：{{ item.exerciseDate }}</span>
								<van-icon name="arrow" class="navToBtn" />
							</div>


							<!-- 第三行：商家和箭头 -->
							<div style="display: flex; justify-content: space-between; align-items: center;">
								<span style="color: #666; font-size: 0.28rem;">{{item.exerciseType == 1 ? '培训': '演练'}}人数（人）：{{ item.participantsNum }}</span>
							</div>
							<div style="display: flex; justify-content: space-between; align-items: center;">
								<span style="color: #666; font-size: 0.28rem;">负责人：{{ item.responsiblePerson }}</span>
							</div>
						</div>
					</van-cell>
				</van-list>
			</div>
		</div>
		</body>

</html>