Updated ERP with new modules and features
This commit is contained in:
Kwesi Banson
505
resources/views/vpns/index.blade.php
Normal file
505
resources/views/vpns/index.blade.php
Normal file
@@ -0,0 +1,505 @@
|
||||
@extends('layouts.masterbeta')
|
||||
|
||||
@section('title', 'Click ERP - VPN Management')
|
||||
|
||||
@section('breadcrumbs')
|
||||
<a href="{{ url('/') }}" class="text-secondary text-decoration-none"><i class="bi bi-house me-2"></i></a>
|
||||
<i class="bi bi-chevron-right text-secondary me-2" style="font-size: 0.8rem;"></i>
|
||||
<span class="fw-bold" style="font-size: 0.95rem;">VPN Management</span>
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<div>
|
||||
<h4 class="fw-bold mb-1">VPN Management</h4>
|
||||
<p class="text-secondary mb-0" style="font-size: 0.9rem;">Manage IPsec configurations with partners.</p>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<!-- Global Standard Template Export -->
|
||||
<a href="{{ route('vpns.standard-template') }}" class="btn btn-outline-dark fw-bold d-flex align-items-center" style="border-radius: 8px;">
|
||||
<i class="bi bi-file-earmark-arrow-down me-2"></i> Standard Parameters
|
||||
</a>
|
||||
|
||||
<button class="btn text-white fw-bold d-flex align-items-center" style="background-color: #5c4df0; border-radius: 8px;" data-bs-toggle="modal" data-bs-target="#addVpnModal">
|
||||
<i class="bi bi-plus-lg me-2"></i> Add VPN Config
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-card shadow-sm bg-white rounded-3 overflow-hidden">
|
||||
<!-- Filters Header -->
|
||||
<div class="p-3 border-bottom bg-light bg-opacity-50">
|
||||
<div class="row g-3 align-items-center">
|
||||
<div class="col-md-5">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-white border-end-0 text-secondary"><i class="bi bi-search"></i></span>
|
||||
<input type="text" class="form-control bg-white border-start-0 ps-0" id="searchVpn" placeholder="Search by partner name or IP...">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle mb-0">
|
||||
<thead class="table-light text-secondary" style="font-size: 0.85rem;">
|
||||
<tr>
|
||||
<th class="ps-4">Partner</th>
|
||||
<th>Gateways (Local ➔ Peer)</th>
|
||||
<th>Encryption Domains (Local ➔ Remote)</th>
|
||||
<th>Status</th>
|
||||
<th class="text-end pe-4">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@forelse($vpns as $vpn)
|
||||
<tr>
|
||||
<td class="ps-4 fw-bold text-dark">{{ $vpn->partner_name }}</td>
|
||||
<td>
|
||||
<div class="font-monospace small">
|
||||
<span class="text-primary">{{ $vpn->local_ip }}</span>
|
||||
<i class="bi bi-arrow-right mx-1 text-secondary"></i>
|
||||
<span class="text-danger">{{ $vpn->peer_ip }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="font-monospace small text-secondary">
|
||||
{{ $vpn->encryption_domain_local ?? 'Any' }}
|
||||
<i class="bi bi-arrow-right mx-1"></i>
|
||||
{{ $vpn->encryption_domain_remote ?? 'Any' }}
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge {{ $vpn->status == 'Active' ? 'bg-success' : 'bg-warning' }} bg-opacity-10 text-{{ $vpn->status == 'Active' ? 'success' : 'warning' }}">
|
||||
{{ $vpn->status }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="text-end pe-4">
|
||||
<button class="btn btn-sm btn-outline-dark fw-bold btn-export-vpn me-2" data-id="{{ $vpn->id }}">
|
||||
<i class="bi bi-download me-1"></i> Export
|
||||
</button>
|
||||
<button class="btn btn-sm btn-light text-primary btn-edit-vpn" data-id="{{ $vpn->id }}" title="Edit">
|
||||
<i class="bi bi-pencil"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="5" class="text-center py-5 text-secondary">
|
||||
<i class="bi bi-shield-slash fs-1 text-muted mb-2 d-block"></i>
|
||||
No VPN configurations added yet.
|
||||
</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
@if($vpns->hasPages())
|
||||
<div class="card-footer bg-white border-top p-3 d-flex justify-content-center">
|
||||
{{ $vpns->links('pagination::bootstrap-5') }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@push('modals')
|
||||
<!-- ADD VPN MODAL -->
|
||||
<!-- ADD VPN MODAL -->
|
||||
<div class="modal fade" id="addVpnModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-light border-bottom-0">
|
||||
<h5 class="modal-title fw-bold">Add VPN Configuration</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<form id="addVpnForm" novalidate>
|
||||
@csrf
|
||||
<div class="modal-body p-0">
|
||||
<!-- Modal Navigation Tabs -->
|
||||
<ul class="nav nav-tabs px-4 pt-3 bg-light" role="tablist">
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link active fw-bold" data-bs-toggle="tab" data-bs-target="#add-tab-basic" type="button">Basic Info</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link fw-bold text-dark" data-bs-toggle="tab" data-bs-target="#add-tab-phase1" type="button">Phase 1 (IKE)</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link fw-bold text-dark" data-bs-toggle="tab" data-bs-target="#add-tab-phase2" type="button">Phase 2 (IPSec)</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="tab-content p-4">
|
||||
<!-- TAB 1: BASIC INFO -->
|
||||
<div class="tab-pane fade show active" id="add-tab-basic">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Partner Name *</label>
|
||||
<input type="text" class="form-control" name="partner_name" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Status *</label>
|
||||
<select class="form-select" name="status" required>
|
||||
<option value="Active" selected>Active</option>
|
||||
<option value="Inactive">Inactive</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Local Device</label>
|
||||
<input type="text" class="form-control" name="local_device" placeholder="e.g. Cisco Catalyst 8500">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Peer Device</label>
|
||||
<input type="text" class="form-control" name="peer_device" placeholder="e.g. FortiGate 61E">
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4 mb-2 border-bottom pb-2">
|
||||
<h6 class="fw-bold text-dark mb-0"><i class="bi bi-router me-2"></i>Gateway IP Addresses</h6>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Local Gateway IP *</label>
|
||||
<input type="text" class="form-control font-monospace" name="local_ip" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Peer Gateway IP *</label>
|
||||
<input type="text" class="form-control font-monospace" name="peer_ip" required>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4 mb-2 border-bottom pb-2">
|
||||
<h6 class="fw-bold text-dark mb-0"><i class="bi bi-diagram-3 me-2"></i>Encryption Domains (Subnets)</h6>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Local Encryption Domain</label>
|
||||
<input type="text" class="form-control font-monospace" name="encryption_domain_local" placeholder="e.g. 10.0.0.0/24">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Remote Encryption Domain</label>
|
||||
<input type="text" class="form-control font-monospace" name="encryption_domain_remote">
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4 mb-2 border-bottom pb-2">
|
||||
<h6 class="fw-bold text-dark mb-0"><i class="bi bi-key me-2"></i>Authentication</h6>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<label class="form-label text-secondary fw-semibold small">Pre-Shared Key (PSK) *</label>
|
||||
<input type="password" class="form-control font-monospace" name="preshared_key" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TAB 2: PHASE 1 (IKE) -->
|
||||
<div class="tab-pane fade" id="add-tab-phase1">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">IKE Version *</label>
|
||||
<select class="form-select" name="ike_version">
|
||||
<option value="1">v1</option>
|
||||
<option value="2" selected>v2</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">Encryption *</label>
|
||||
<select class="form-select" name="phase1_encryption">
|
||||
<option value="AES-128">AES-128</option>
|
||||
<option value="AES-256" selected>AES-256</option>
|
||||
<option value="3DES">3DES</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">Hash *</label>
|
||||
<select class="form-select" name="phase1_hash">
|
||||
<option value="SHA-1">SHA-1</option>
|
||||
<option value="SHA-256" selected>SHA-256</option>
|
||||
<option value="SHA-512">SHA-512</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">DH Group *</label>
|
||||
<select class="form-select" name="phase1_dh_group">
|
||||
<option value="2">Group 2</option>
|
||||
<option value="14" selected>Group 14</option>
|
||||
<option value="21">Group 21</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Lifetime (Seconds) *</label>
|
||||
<input type="number" class="form-control" name="phase1_lifetime" value="28800" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TAB 3: PHASE 2 (IPSEC) -->
|
||||
<div class="tab-pane fade" id="add-tab-phase2">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Encryption *</label>
|
||||
<select class="form-select" name="phase2_encryption">
|
||||
<option value="AES-128">AES-128</option>
|
||||
<option value="AES-256" selected>AES-256</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Hash *</label>
|
||||
<select class="form-select" name="phase2_hash">
|
||||
<option value="SHA-1">SHA-1</option>
|
||||
<option value="SHA-256" selected>SHA-256</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">DH Group</label>
|
||||
<select class="form-select" name="phase2_dh_group">
|
||||
<option value="">Match Phase 1</option>
|
||||
<option value="14">Group 14</option>
|
||||
<option value="21">Group 21</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">Lifetime (Secs) *</label>
|
||||
<input type="number" class="form-control" name="phase2_lifetime" value="3600" required>
|
||||
</div>
|
||||
<div class="col-md-4 d-flex align-items-end">
|
||||
<div class="form-check form-switch mb-2">
|
||||
<input class="form-check-input" type="checkbox" name="pfs_enabled" value="1" checked id="addPfsSwitch">
|
||||
<label class="form-check-label text-secondary fw-semibold small" for="addPfsSwitch">Enable PFS</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer bg-light border-top-0">
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" id="btnSaveVpn" class="btn text-white btn-sm fw-bold px-4" style="background-color: #5c4df0;">
|
||||
Save Configuration
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- EDIT VPN MODAL -->
|
||||
<!-- EDIT VPN MODAL -->
|
||||
<div class="modal fade" id="editVpnModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-light border-bottom-0">
|
||||
<h5 class="modal-title fw-bold">Edit VPN Configuration</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
|
||||
<form id="editVpnForm" novalidate>
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<input type="hidden" id="edit_vpn_id">
|
||||
|
||||
<div class="modal-body p-0">
|
||||
<!-- Modal Navigation Tabs -->
|
||||
<ul class="nav nav-tabs px-4 pt-3 bg-light" role="tablist">
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link active fw-bold" data-bs-toggle="tab" data-bs-target="#edit-tab-basic" type="button">Basic Info</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link fw-bold text-dark" data-bs-toggle="tab" data-bs-target="#edit-tab-phase1" type="button">Phase 1 (IKE)</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link fw-bold text-dark" data-bs-toggle="tab" data-bs-target="#edit-tab-phase2" type="button">Phase 2 (IPSec)</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="tab-content p-4">
|
||||
<!-- TAB 1: BASIC INFO -->
|
||||
<div class="tab-pane fade show active" id="edit-tab-basic">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Partner Name *</label>
|
||||
<input type="text" class="form-control" name="partner_name" id="edit_partner_name" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Status *</label>
|
||||
<select class="form-select" name="status" id="edit_status" required>
|
||||
<option value="Active">Active</option>
|
||||
<option value="Inactive">Inactive</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Local Device</label>
|
||||
<input type="text" class="form-control" name="local_device" id="edit_local_device">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Peer Device</label>
|
||||
<input type="text" class="form-control" name="peer_device" id="edit_peer_device">
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4 mb-2 border-bottom pb-2">
|
||||
<h6 class="fw-bold text-dark mb-0"><i class="bi bi-router me-2"></i>Gateway IP Addresses</h6>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Local Gateway IP *</label>
|
||||
<input type="text" class="form-control font-monospace" name="local_ip" id="edit_local_ip" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Peer Gateway IP *</label>
|
||||
<input type="text" class="form-control font-monospace" name="peer_ip" id="edit_peer_ip" required>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4 mb-2 border-bottom pb-2">
|
||||
<h6 class="fw-bold text-dark mb-0"><i class="bi bi-diagram-3 me-2"></i>Encryption Domains (Subnets)</h6>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Local Encryption Domain</label>
|
||||
<input type="text" class="form-control font-monospace" name="encryption_domain_local" id="edit_encryption_domain_local">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Remote Encryption Domain</label>
|
||||
<input type="text" class="form-control font-monospace" name="encryption_domain_remote" id="edit_encryption_domain_remote">
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4 mb-2 border-bottom pb-2">
|
||||
<h6 class="fw-bold text-dark mb-0"><i class="bi bi-key me-2"></i>Authentication</h6>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<label class="form-label text-secondary fw-semibold small">Update Pre-Shared Key (PSK)</label>
|
||||
<input type="password" class="form-control font-monospace" name="preshared_key" placeholder="Leave blank to keep current PSK">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TAB 2: PHASE 1 (IKE) -->
|
||||
<div class="tab-pane fade" id="edit-tab-phase1">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">IKE Version *</label>
|
||||
<select class="form-select" name="ike_version" id="edit_ike_version">
|
||||
<option value="1">v1</option>
|
||||
<option value="2">v2</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">Encryption *</label>
|
||||
<select class="form-select" name="phase1_encryption" id="edit_phase1_encryption">
|
||||
<option value="AES-128">AES-128</option>
|
||||
<option value="AES-256">AES-256</option>
|
||||
<option value="3DES">3DES</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">Hash *</label>
|
||||
<select class="form-select" name="phase1_hash" id="edit_phase1_hash">
|
||||
<option value="SHA-1">SHA-1</option>
|
||||
<option value="SHA-256">SHA-256</option>
|
||||
<option value="SHA-512">SHA-512</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">DH Group *</label>
|
||||
<select class="form-select" name="phase1_dh_group" id="edit_phase1_dh_group">
|
||||
<option value="2">Group 2</option>
|
||||
<option value="14">Group 14</option>
|
||||
<option value="21">Group 21</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Lifetime (Seconds) *</label>
|
||||
<input type="number" class="form-control" name="phase1_lifetime" id="edit_phase1_lifetime" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TAB 3: PHASE 2 (IPSEC) -->
|
||||
<div class="tab-pane fade" id="edit-tab-phase2">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Encryption *</label>
|
||||
<select class="form-select" name="phase2_encryption" id="edit_phase2_encryption">
|
||||
<option value="AES-128">AES-128</option>
|
||||
<option value="AES-256">AES-256</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label text-secondary fw-semibold small">Hash *</label>
|
||||
<select class="form-select" name="phase2_hash" id="edit_phase2_hash">
|
||||
<option value="SHA-1">SHA-1</option>
|
||||
<option value="SHA-256">SHA-256</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">DH Group</label>
|
||||
<select class="form-select" name="phase2_dh_group" id="edit_phase2_dh_group">
|
||||
<option value="">Match Phase 1</option>
|
||||
<option value="14">Group 14</option>
|
||||
<option value="21">Group 21</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label text-secondary fw-semibold small">Lifetime (Secs) *</label>
|
||||
<input type="number" class="form-control" name="phase2_lifetime" id="edit_phase2_lifetime" required>
|
||||
</div>
|
||||
<div class="col-md-4 d-flex align-items-end">
|
||||
<div class="form-check form-switch mb-2">
|
||||
<input class="form-check-input" type="checkbox" name="pfs_enabled" value="1" id="edit_pfs_enabled">
|
||||
<label class="form-check-label text-secondary fw-semibold small" for="edit_pfs_enabled">Enable PFS</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer bg-light border-top-0">
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" id="btnUpdateVpn" class="btn text-white btn-sm fw-bold px-4" style="background-color: #5c4df0;">
|
||||
Update Configuration
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- EXPORT VPN CONFIG MODAL -->
|
||||
<div class="modal fade" id="exportVpnModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-dark text-white border-bottom-0">
|
||||
<h5 class="modal-title fw-bold"><i class="bi bi-file-earmark-code me-2"></i>Export Partner Config</h5>
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<form action="{{ route('vpns.download') }}" method="POST">
|
||||
@csrf
|
||||
<input type="hidden" name="partner_name" id="export_partner_name">
|
||||
|
||||
<div class="modal-body p-4">
|
||||
<div class="alert alert-info py-2 d-flex align-items-center" style="font-size: 0.85rem;">
|
||||
<i class="bi bi-info-circle-fill me-2 fs-5"></i>
|
||||
<div>You can edit the configuration parameters below before downloading the file to share with the partner.</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<textarea class="form-control font-monospace bg-light" name="config_content" id="export_config_content" rows="15" required style="font-size: 0.85rem; white-space: pre;"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer bg-light border-top-0 d-flex justify-content-between">
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" class="btn btn-success btn-sm fw-bold px-4">
|
||||
<i class="bi bi-download me-1"></i> Download .txt File
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endpush
|
||||
|
||||
@push('scripts')
|
||||
<script src="{{ asset('public/assets/js/vpn-index.js') }}"></script>
|
||||
@endpush
|
||||
Reference in New Issue
Block a user