110 lines
5.1 KiB
Twig
110 lines
5.1 KiB
Twig
{% extends 'base.html.twig' %}
|
|
{% block title %}Add Server - ServerControl{% endblock %}
|
|
|
|
{% block body %}
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-7 col-lg-6">
|
|
<a href="{{ path('app_server_index') }}" class="text-muted text-decoration-none small">
|
|
<i class="bi bi-arrow-left me-1"></i>Back to servers
|
|
</a>
|
|
|
|
<div class="card mt-3">
|
|
<div class="card-header py-3 d-flex align-items-center gap-2">
|
|
<i class="bi bi-hdd-stack-fill fs-5 text-primary"></i>
|
|
<div>
|
|
<h5 class="mb-0">Ajouter un nouveaux serveur</h5>
|
|
<small class="text-muted">Renseignez les détails de connection SSH</small>
|
|
</div>
|
|
</div>
|
|
<div class="card-body p-4">
|
|
{{ form_start(form) }}
|
|
|
|
<p class="form-section-title"><i class="bi bi-info-circle me-1"></i>General</p>
|
|
<div class="mb-3">
|
|
<label class="form-label fw-semibold">Server name</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text field-icon"><i class="bi bi-tag"></i></span>
|
|
{{ form_widget(form.name, {attr: {class: 'form-control', placeholder: 'e.g. Web server prod'}}) }}
|
|
</div>
|
|
{{ form_errors(form.name) }}
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label class="form-label fw-semibold">Description <span class="text-muted fw-normal">(optional)</span></label>
|
|
<div class="input-group">
|
|
<span class="input-group-text field-icon"><i class="bi bi-card-text"></i></span>
|
|
{{ form_widget(form.description, {attr: {class: 'form-control', placeholder: 'Short description…', rows: 2}}) }}
|
|
</div>
|
|
{{ form_errors(form.description) }}
|
|
</div>
|
|
|
|
<p class="form-section-title"><i class="bi bi-terminal me-1"></i>SSH Connection</p>
|
|
<div class="row g-3 mb-3">
|
|
<div class="col-8">
|
|
<label class="form-label fw-semibold">IP Address</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text field-icon"><i class="bi bi-router"></i></span>
|
|
{{ form_widget(form.ipAddress, {attr: {class: 'form-control', placeholder: '192.168.1.10'}}) }}
|
|
</div>
|
|
{{ form_errors(form.ipAddress) }}
|
|
</div>
|
|
<div class="col-4">
|
|
<label class="form-label fw-semibold">SSH Port</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text field-icon"><i class="bi bi-plug"></i></span>
|
|
{{ form_widget(form.sshPort, {attr: {class: 'form-control'}}) }}
|
|
</div>
|
|
{{ form_errors(form.sshPort) }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label class="form-label fw-semibold">SSH User</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text field-icon"><i class="bi bi-person-badge"></i></span>
|
|
{{ form_widget(form.sshUser, {attr: {class: 'form-control', placeholder: 'e.g. root, deploy'}}) }}
|
|
</div>
|
|
{{ form_errors(form.sshUser) }}
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label class="form-label fw-semibold">SSH Password</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text field-icon"><i class="bi bi-key"></i></span>
|
|
{{ form_widget(form.sshPassword, {attr: {class: 'form-control', placeholder: '••••••••', id: 'ssh-password-input'}}) }}
|
|
<button class="btn btn-outline-secondary" type="button" onclick="togglePwd()">
|
|
<i class="bi bi-eye" id="pwd-eye"></i>
|
|
</button>
|
|
</div>
|
|
{{ form_errors(form.sshPassword) }}
|
|
</div>
|
|
|
|
<div class="d-flex gap-2 pt-2 border-top">
|
|
<button type="submit" class="btn btn-primary px-4">
|
|
<i class="bi bi-plus-lg me-1"></i>Ajouter serveur
|
|
</button>
|
|
<a href="{{ path('app_server_index') }}" class="btn btn-outline-secondary">Cancel</a>
|
|
</div>
|
|
|
|
{{ form_end(form) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block javascripts %}
|
|
<script>
|
|
function togglePwd() {
|
|
const input = document.getElementById('ssh-password-input');
|
|
const eye = document.getElementById('pwd-eye');
|
|
if (input.type === 'password') {
|
|
input.type = 'text';
|
|
eye.className = 'bi bi-eye-slash';
|
|
} else {
|
|
input.type = 'password';
|
|
eye.className = 'bi bi-eye';
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %}
|