feat: Move WEA configuration to a collapsible accordion
Deploy Standortplaner / deploy (push) Successful in 16s
Details
Deploy Standortplaner / deploy (push) Successful in 16s
Details
This commit is contained in:
parent
12d6a77fe3
commit
894144a2c0
130
index.html
130
index.html
|
|
@ -60,71 +60,77 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<details class="section wea-accordion">
|
||||
<summary style="font-weight: bold; font-size: 1.1rem; color: var(--primary-color); display: flex; align-items: center; gap: 8px; cursor: pointer;">
|
||||
<span>🌀</span> WEA Konfiguration <span style="margin-left: auto;">+</span>
|
||||
</summary>
|
||||
<div style="margin-top: 12px; cursor: default;">
|
||||
<div style="display: flex; gap: 8px; margin-bottom: 6px;">
|
||||
<div style="flex: 1;">
|
||||
<label for="turbineManufacturer" class="label-small">Hersteller</label>
|
||||
<select id="turbineManufacturer" class="input-styled input-small">
|
||||
<option value="Enercon">Enercon</option>
|
||||
<option value="Nordex">Nordex</option>
|
||||
<option value="Vestas">Vestas</option>
|
||||
<option value="GE">GE</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="flex: 1;">
|
||||
<label for="turbineType" class="label-small">Anlagentyp</label>
|
||||
<input type="text" id="turbineType" class="input-styled input-small" placeholder="z.B. V162">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center; margin-bottom: 6px;">
|
||||
<label for="rotorDiameter" class="label-small" style="flex: 1; margin: 0;">Rotordurchmesser (m)</label>
|
||||
<input type="number" id="rotorDiameter" class="input-styled input-small" value="160" style="width: 60px;">
|
||||
</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center; margin-bottom: 6px;">
|
||||
<label for="hubHeight" class="label-small" style="flex: 1; margin: 0;">Nabenhöhe (m)</label>
|
||||
<input type="number" id="hubHeight" class="input-styled input-small" value="165" style="width: 60px;">
|
||||
</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center; margin-bottom: 6px;">
|
||||
<label for="foundationRadius" class="label-small" style="flex: 1; margin: 0;">Fundament Radius (m)</label>
|
||||
<input type="number" id="foundationRadius" class="input-styled input-small" value="15" style="width: 60px;">
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 12px;">
|
||||
<button class="btn-primary btn-mini" id="btnPlaceTurbine" style="width: 100%;">
|
||||
<span>📍</span> Anlage per Klick setzen
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 12px; border-top: 1px solid var(--border-color); padding-top: 12px;">
|
||||
<h3 style="margin-bottom: 6px; font-size: 0.9rem; color: var(--text-dim);">Eingabe durch Koordinaten (UTM)</h3>
|
||||
<div style="display: flex; gap: 6px; margin-bottom: 6px;">
|
||||
<div style="flex: 1;">
|
||||
<label for="utm-e" class="label-small">Rechts (E)</label>
|
||||
<input type="number" id="utm-e" class="input-styled input-small" placeholder="32..." step="0.01">
|
||||
</div>
|
||||
<div style="flex: 1;">
|
||||
<label for="utm-n" class="label-small">Hoch (N)</label>
|
||||
<input type="number" id="utm-n" class="input-styled input-small" placeholder="5..." step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn-secondary btn-mini" id="btnCreateAtUTM" style="width: 100%;">
|
||||
An UTM erzeugen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<div class="section">
|
||||
<h2>Anlagen-Konfiguration</h2>
|
||||
<div style="display: flex; gap: 8px; margin-bottom: 6px;">
|
||||
<div style="flex: 1;">
|
||||
<label for="turbineManufacturer" class="label-small">Hersteller</label>
|
||||
<select id="turbineManufacturer" class="input-styled input-small">
|
||||
<option value="Enercon">Enercon</option>
|
||||
<option value="Nordex">Nordex</option>
|
||||
<option value="Vestas">Vestas</option>
|
||||
<option value="GE">GE</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="flex: 1;">
|
||||
<label for="turbineType" class="label-small">Anlagentyp</label>
|
||||
<input type="text" id="turbineType" class="input-styled input-small" placeholder="z.B. V162">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center; margin-bottom: 6px;">
|
||||
<label for="rotorDiameter" class="label-small" style="flex: 1; margin: 0;">Rotordurchmesser (m)</label>
|
||||
<input type="number" id="rotorDiameter" class="input-styled input-small" value="160" style="width: 60px;">
|
||||
</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center; margin-bottom: 6px;">
|
||||
<label for="hubHeight" class="label-small" style="flex: 1; margin: 0;">Nabenhöhe (m)</label>
|
||||
<input type="number" id="hubHeight" class="input-styled input-small" value="165" style="width: 60px;">
|
||||
</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center; margin-bottom: 6px;">
|
||||
<label for="foundationRadius" class="label-small" style="flex: 1; margin: 0;">Fundament Radius (m)</label>
|
||||
<input type="number" id="foundationRadius" class="input-styled input-small" value="15" style="width: 60px;">
|
||||
<h2>Werkzeuge</h2>
|
||||
<div class="control-group" style="display: flex; gap: 6px; flex-wrap: wrap;">
|
||||
<button class="btn-secondary btn-mini" id="btnManageOwners"
|
||||
style="flex: 1.2; min-width: 100px; margin-top: 0;">
|
||||
<span>👥</span> Eigentümer
|
||||
</button>
|
||||
<button class="btn-secondary btn-mini" id="btnMeasureDist" title="Distanz messen"
|
||||
style="flex: 0.4; padding: 6px; margin-top: 0;">📏</button>
|
||||
<button class="btn-secondary btn-mini" id="btnMeasureArea" title="Fläche messen"
|
||||
style="flex: 0.4; padding: 6px; margin-top: 0;">📐</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Werkzeuge</h2>
|
||||
<div class="control-group" style="display: flex; gap: 6px; flex-wrap: wrap;">
|
||||
<button class="btn-primary btn-mini" id="btnPlaceTurbine" style="flex: 1.2; min-width: 100px;">
|
||||
<span>📍</span> Anlage setzen
|
||||
</button>
|
||||
<button class="btn-secondary btn-mini" id="btnManageOwners"
|
||||
style="flex: 1.2; min-width: 100px; margin-top: 0;">
|
||||
<span>👥</span> Eigentümer
|
||||
</button>
|
||||
<button class="btn-secondary btn-mini" id="btnMeasureDist" title="Distanz messen"
|
||||
style="flex: 0.4; padding: 6px; margin-top: 0;">📏</button>
|
||||
<button class="btn-secondary btn-mini" id="btnMeasureArea" title="Fläche messen"
|
||||
style="flex: 0.4; padding: 6px; margin-top: 0;">📐</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- UTM Coordinate Input -->
|
||||
<div class="section"
|
||||
style="border: 1px solid var(--border-color); padding: 8px; border-radius: 8px; background: rgba(255, 255, 255, 0.02);">
|
||||
<h2 style="margin-bottom: 6px;">UTM-Position</h2>
|
||||
<div style="display: flex; gap: 6px; margin-bottom: 6px;">
|
||||
<div style="flex: 1;">
|
||||
<label for="utm-e" class="label-small">Rechts (E)</label>
|
||||
<input type="number" id="utm-e" class="input-styled input-small" placeholder="32..." step="0.01">
|
||||
</div>
|
||||
<div style="flex: 1;">
|
||||
<label for="utm-n" class="label-small">Hoch (N)</label>
|
||||
<input type="number" id="utm-n" class="input-styled input-small" placeholder="5..." step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn-primary btn-mini" id="btnCreateAtUTM" style="font-size: 0.75rem;">
|
||||
An UTM erzeugen
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue