<%@ page import="java.util.List" %>
<%@ page import="pojo.ParkingSpot" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>管理员</title>
    <link rel="stylesheet" href="<%=request.getContextPath()%>/static/css/mainTemplate.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/static/css/parkingLotStyle.css">
</head>
<%
    request.setCharacterEncoding("UTF-8");
    List<ParkingSpot> spots = (List<ParkingSpot>) request.getAttribute("parkingSpots");
%>
<script>
function fillContent(location, spot_type, occupancy_status, fee_standard) {
    const targetDiv = document.getElementById(location);
    const carImg = targetDiv.querySelector('.car-img img');
    const occupancyStatus = targetDiv.querySelector('.occupancy_status');

    if (occupancy_status === 1) {
        carImg.src = "/ParkingLotManagementSystem/static/images/full.png";
        occupancyStatus.textContent = "使用情况: 已占用";
    } else {
        carImg.src = "/ParkingLotManagementSystem/static/images/empty.png";
        occupancyStatus.textContent = "使用情况: 空闲";
    }
    const locationSpan = targetDiv.querySelector('.location');
    const spotTypeSpan = targetDiv.querySelector('.spot_type');
    const feeStandardSpan = targetDiv.querySelector('.fee_standard');
    locationSpan.textContent = '车位: ' + location;
    spotTypeSpan.textContent = '车位类型: ' + spot_type;
    feeStandardSpan.textContent = '收费标准:' + fee_standard + '￥/小时';
}
document.addEventListener('DOMContentLoaded', function() {
    <%
        for(ParkingSpot spot : spots) {
    %>
    fillContent('<%= spot.getLocation() %>', '<%= spot.getSpot_type() %>', <%= spot.getOccupancy_status() %>, '<%= spot.getFee_standard() %>');
    <%
        }
    %>
});
</script>

<body>
<div class="top-bar">
    <div class="top-bar-logo">
        <a  href="#"><img id="logo" src="<%=request.getContextPath()%>/static/images/logo.jpg" alt="" ></a>
        <a id="logo-text" href="<%=request.getContextPath()%>">山东科技大学 作为小组停车场管理系统 <span style="font-size: 20px;">管理员端</span></a>
    </div>
    <div class="top-bar-btn">
<%--        <a class="top-bar-tag" href="<%=request.getContextPath()%>/mall/AllTask">任务广场</a>--%>
    </div>
    <div class="top-bar-right">
        <div class="drop-menu">
            <div class="top-bar-account">
<%--                <span><%=request.getSession().getAttribute("username")%></span>--%>
<%--                <div class="drop"><a href="<%=request.getContextPath()%>/account/exit">退出账户</a></div>--%>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <div class="side-bar">
        <a class="side-bar-button" href="<%=request.getContextPath()%>/main/admin/User">用户信息</a>
        <a class="side-bar-button" href="<%=request.getContextPath()%>/main/admin/Spots">车位情况</a>
        <a class="side-bar-button" href="<%=request.getContextPath()%>/main/admin/Records">停车记录</a>
        <a class="side-bar-button" href="<%=request.getContextPath()%>/main/admin/Vehicles">车辆信息</a>
    </div>
    <div class="main-content">
        <div class="block">
            <div class="car-area" id="A1">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="A2">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="A3">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="A4">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="A5">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="A6">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
        </div>
        <div class="block">
            <div class="car-area" id="B1">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="B2">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="B3">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="B4">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="B5">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="B6">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
        </div>
        <div class="block">
            <div class="car-area" id="C1">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="C2">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="C3">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="C4">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="C5">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="C6">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
        </div>
        <div class="block">
            <div class="car-area" id="D1">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="D2">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="D3">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="D4">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="D5">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="D6">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
        </div>
        <div class="block">
            <div class="car-area" id="E1">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="E2">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="E3">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="E4">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="E5">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="E6">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
        </div>
        <div class="block">
            <div class="car-area" id="F1">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="F2">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="F3">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="F4">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="F5">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
            <div class="car-area" id="F6">
                <div class="car-img">
                    <img src="/ParkingLotManagementSystem/static/images/none.png" alt="">
                    <span class="location">车位:</span>
                    <span class="spot_type">车位类型:</span>
                    <span class="occupancy_status">使用情况:</span>
                    <span class="fee_standard">收费标准：- ￥/小时</span>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>

</script>