{% extends "base.html" %}
{% block title %}空间预览{% endblock %}
{% block head %}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/>
{% endblock %}
{% block page_header %}
<div class="page-header">
  <h1>空间预览 <span class="tag">合成 GeoJSON</span></h1>
  <p class="sub">Leaflet 预览 · 面积同时显示 m² 与公顷</p>
</div>
{% endblock %}
{% block content %}
<div class="map-banner">⚠ 地图预览不等于验收核定。全部图斑/措施为合成数据，不代表真实勘界或验收结论。</div>
<div class="card">
  <div>
    <button class="btn" type="button" data-toggle-layer="range">范围</button>
    <button class="btn" type="button" data-toggle-layer="parcels">图斑</button>
    <button class="btn" type="button" data-toggle-layer="measures">工程措施</button>
  </div>
  <div id="map-error" class="hint"></div>
  <div id="map" data-range-url="{{ root_path }}/api/spatial/{% if project.code.startswith('LS-') %}range_ls{% else %}range{% endif %}"></div>
  <div id="map-legend" class="hint" style="margin-top:8px"></div>
</div>
{% endblock %}
{% block scripts %}
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="{{ root_path }}/static/js/spatial.js"></script>
{% endblock %}