@extends('layouts.app', ['title' => 'PMS · DMS Einstellungen'])
@section('content')

<div class="container-fluid py-4" style="max-width:900px;">

    <div class="d-flex align-items-center justify-content-between mb-4">
        <div>
            <h4 class="fw-bold mb-0">DMS Ordnerstruktur</h4>
            <small class="text-muted">PMS · Einstellungen · Dokumentenverwaltung</small>
        </div>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show border-0 shadow-sm py-2 mb-3">
            <i class="bi bi-check-circle me-2"></i>{{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <form method="POST" action="{{ route('pms.settings.dms.update') }}">
        @csrf

        <div class="row g-4">

            {{-- Vorschau --}}
            <div class="col-12">
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white border-0 fw-semibold pt-3 pb-1 px-4">
                        <i class="bi bi-folder2-open me-2 text-primary"></i>Vorschau Ordnerstruktur
                    </div>
                    <div class="card-body py-3 px-4">
                        <div class="small text-muted mb-2">Beispiel: Projekt ID 42</div>
                        <pre class="mb-0 small lh-lg" id="tree-preview" style="background:transparent;border:none;padding:0;font-family:monospace;"></pre>
                        <div class="text-muted mt-2" style="font-size:11px;">
                            <i class="bi bi-hdd me-1"></i>Basis: <code>storage/app/dms/</code>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Basis & Präfix --}}
            <div class="col-12">
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white border-0 fw-semibold pt-3 pb-1 px-4">
                        <i class="bi bi-sliders me-2 text-primary"></i>Projektordner-Aufbau
                    </div>
                    <div class="card-body px-4 pb-4">
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label small fw-semibold">Basis-Ordner</label>
                                <input type="text" name="dms_pms_base" id="s_base"
                                       class="form-control" maxlength="100"
                                       value="{{ $settings['dms_pms_base'] }}"
                                       placeholder="PMS-Projekte">
                                <div class="form-text">Wurzelordner unter <code>dms/</code></div>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label small fw-semibold">Präfix</label>
                                <input type="text" name="dms_pms_prefix" id="s_prefix"
                                       class="form-control" maxlength="10"
                                       value="{{ $settings['dms_pms_prefix'] }}"
                                       placeholder="P">
                                <div class="form-text">z.B. P, PRJ</div>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label small fw-semibold">Trennzeichen</label>
                                <input type="text" name="dms_pms_separator" id="s_sep"
                                       class="form-control" maxlength="5"
                                       value="{{ $settings['dms_pms_separator'] }}"
                                       placeholder="-">
                                <div class="form-text">z.B. - oder _</div>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label small fw-semibold">Jahr-Format</label>
                                <select name="dms_pms_year_format" id="s_year" class="form-select">
                                    <option value="2" {{ $settings['dms_pms_year_format'] == '2' ? 'selected' : '' }}>2-stellig (26)</option>
                                    <option value="4" {{ $settings['dms_pms_year_format'] == '4' ? 'selected' : '' }}>4-stellig (2026)</option>
                                </select>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label small fw-semibold">ID-Stellen</label>
                                <select name="dms_pms_id_digits" id="s_id" class="form-select">
                                    @foreach([2,3,4,5,6] as $d)
                                        <option value="{{ $d }}" {{ $settings['dms_pms_id_digits'] == $d ? 'selected' : '' }}>
                                            {{ $d }} ({{ str_pad('42', $d, '0', STR_PAD_LEFT) }})
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="row g-3 mt-1">
                            <div class="col-md-6">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" name="dms_pms_include_kunde"
                                           id="s_kunde" role="switch"
                                           {{ $settings['dms_pms_include_kunde'] == '1' ? 'checked' : '' }}>
                                    <label class="form-check-label" for="s_kunde">
                                        <span class="fw-semibold">Kunde</span>
                                        <span class="text-muted ms-1 small">– Kundenname im Projektordner</span>
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" name="dms_pms_include_bv"
                                           id="s_bv" role="switch"
                                           {{ $settings['dms_pms_include_bv'] == '1' ? 'checked' : '' }}>
                                    <label class="form-check-label" for="s_bv">
                                        <span class="fw-semibold">Bauvorhaben</span>
                                        <span class="text-muted ms-1 small">– BV-Name im Projektordner</span>
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Unterordner-Namen --}}
            <div class="col-12">
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white border-0 fw-semibold pt-3 pb-1 px-4">
                        <i class="bi bi-folder-symlink me-2 text-primary"></i>Unterordner-Namen
                    </div>
                    <div class="card-body px-4 pb-4">
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label small fw-semibold">Angebot</label>
                                <input type="text" name="dms_pms_folder_angebot" id="s_f_ang"
                                       class="form-control" maxlength="50"
                                       value="{{ $settings['dms_pms_folder_angebot'] }}"
                                       placeholder="01_Angebot">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label small fw-semibold">Auftragsbestätigung</label>
                                <input type="text" name="dms_pms_folder_ab" id="s_f_ab"
                                       class="form-control" maxlength="50"
                                       value="{{ $settings['dms_pms_folder_ab'] }}"
                                       placeholder="02_Auftragsbestaetigung">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label small fw-semibold">Auftrag</label>
                                <input type="text" name="dms_pms_folder_auftrag" id="s_f_auf"
                                       class="form-control" maxlength="50"
                                       value="{{ $settings['dms_pms_folder_auftrag'] }}"
                                       placeholder="03_Auftrag">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label small fw-semibold">Durchführung</label>
                                <input type="text" name="dms_pms_folder_durchfuehrung" id="s_f_df"
                                       class="form-control" maxlength="50"
                                       value="{{ $settings['dms_pms_folder_durchfuehrung'] }}"
                                       placeholder="04_Durchfuehrung">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label small fw-semibold">Rechnung</label>
                                <input type="text" name="dms_pms_folder_rechnung" id="s_f_rech"
                                       class="form-control" maxlength="50"
                                       value="{{ $settings['dms_pms_folder_rechnung'] }}"
                                       placeholder="05_Rechnung">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

        <div class="mt-4 d-flex justify-content-end">
            <button type="submit" class="btn btn-primary rounded-pill px-4">
                <i class="bi bi-floppy me-1"></i>Speichern
            </button>
        </div>

    </form>
</div>

<script>
const exampleYear     = {{ now()->year }};
const exampleId       = 42;
const exampleCategory = 200;
const exampleKunde    = 'Musterfirma-GmbH';
const exampleBv       = 'Neubau-Musterstrasse';

function sanitize(raw, sep) {
    const escaped = sep.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
    return raw.replace(/[^a-zA-Z0-9]/g, sep).replace(new RegExp(escaped + '+', 'g'), sep).replace(new RegExp('^' + escaped + '|' + escaped + '$', 'g'), '');
}

function updatePreview() {
    const base     = document.getElementById('s_base').value   || 'PMS-Projekte';
    const prefix   = document.getElementById('s_prefix').value || 'P';
    const sep      = document.getElementById('s_sep').value    || '-';
    const yearFmt  = document.getElementById('s_year').value;
    const idDig    = parseInt(document.getElementById('s_id').value);
    const inclKunde = document.getElementById('s_kunde').checked;
    const inclBv    = document.getElementById('s_bv').checked;

    const fAng  = document.getElementById('s_f_ang').value  || '01_Angebot';
    const fAb   = document.getElementById('s_f_ab').value   || '02_Auftragsbestaetigung';
    const fAuf  = document.getElementById('s_f_auf').value  || '03_Auftrag';
    const fDf   = document.getElementById('s_f_df').value   || '04_Durchfuehrung';
    const fRech = document.getElementById('s_f_rech').value || '05_Rechnung';

    const year  = yearFmt == '2' ? String(exampleYear).slice(-2) : String(exampleYear);
    const idStr = String(exampleId).padStart(idDig, '0');

    let parts = [prefix, String(exampleCategory), year, idStr];
    if (inclKunde) parts.push(sanitize(exampleKunde, sep));
    if (inclBv)    parts.push(sanitize(exampleBv, sep));
    const project = parts.join(sep);

    const safeNr  = 'AN-' + year + '-' + idStr;

    const tree =
`📁 ${base}/
└── 📁 ${exampleYear}/
    └── 📁 ${project}/
        ├── 📁 ${fAng}/
        │   └── Angebot_${safeNr}.pdf
        ├── 📁 ${fAb}/
        │   └── AB_${safeNr}.pdf
        ├── 📁 ${fAuf}/
        │   └── Auftrag_AU-${year}-${idStr}.pdf
        ├── 📁 ${fDf}/
        └── 📁 ${fRech}/`;

    document.getElementById('tree-preview').textContent = tree;
}

['s_base','s_prefix','s_sep','s_year','s_id','s_kunde','s_bv',
 's_f_ang','s_f_ab','s_f_auf','s_f_df','s_f_rech'].forEach(id => {
    document.getElementById(id).addEventListener('input',  updatePreview);
    document.getElementById(id).addEventListener('change', updatePreview);
});

updatePreview();
</script>
@endsection