<!DOCTYPE html>
<html lang="en">
<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">
<!-- 商户头部信息 -->
<div class="header">
<van-search
v-model="shanghuName"
show-action
placeholder="请输入商家关键词"
@search="onSearch"
>
<template #action>
<div @click="onSearch"></div>
</template>
</van-search>
</div>
<!-- Tab栏 -->
<van-tabs v-model:active="activeTab" title-active-color="#1989fa" line-height="2px"
style="margin-bottom: 15px;">
<van-tab title="全部" name=""></van-tab>
<van-tab title="待审核" name="2"></van-tab>
<van-tab title="待整改" name="0"></van-tab>
<van-tab title="已整改" name="1"></van-tab>
<van-tab title="整改逾期" name="3"></van-tab>
</van-tabs>
<!-- 隐患列表 -->
<van-list>
<van-cell v-for="item in filteredHazards" :key="item.id" class="list-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.description }}</div>
<!-- 第二行：状态和时间 -->
<div style="display: flex; justify-content: start; gap: .34rem; margin: 8px 0;">
<van-tag :type="statusTagType(item.rectificationStatusName)">
{{ item.rectificationStatusName }}
</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)" />
</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>
</body>
</html>