242 lines
12 KiB
PHP
242 lines
12 KiB
PHP
<?php
|
||
$enablePrototypeComments = true;
|
||
include '../../header-invoice.php';
|
||
?>
|
||
|
||
<div class="container-xxl flex-grow-1 container-p-y">
|
||
|
||
<h4 class="fw-bold py-3 mb-4">
|
||
<span class="text-muted fw-light">Zarządzanie zespołem /</span> Twój zespół
|
||
</h4>
|
||
|
||
<div class="card mb-4 bg-label-primary shadow-none border border-primary">
|
||
<div class="card-body">
|
||
<div class="d-flex align-items-start align-items-sm-center gap-3">
|
||
<div
|
||
class="avatar avatar-md p-1 bg-white rounded flex-shrink-0 shadow-sm d-flex align-items-center justify-content-center">
|
||
<i class="bx bx-info-circle text-primary fs-3"></i>
|
||
</div>
|
||
<div>
|
||
<h5 class="text-dark mb-1 fw-bold">Jak działa dodawanie pracowników i role?</h5>
|
||
<p class="mb-2 text-dark small">
|
||
System magico korzysta z centralnego konta <strong>id.magico</strong>. Wpisz e-mail poniżej, a
|
||
my sprawdzimy, czy pracownik ma już konto. Jeśli tak – dodamy go do Twojej firmy. Jeśli nie –
|
||
wyślemy mu link do założenia konta.
|
||
</p>
|
||
|
||
<div class="row mt-3 text-dark">
|
||
<div class="col-md-4 mb-2">
|
||
<strong class="d-block mb-1"><i class="bx bx-crown text-warning me-1"></i>
|
||
Właściciel</strong>
|
||
<span class="small opacity-75">Otrzymuje faktury, zarządza zespołem i ma pełne prawo
|
||
aktywacji/dezaktywacji wszystkich aplikacji.</span>
|
||
</div>
|
||
<div class="col-md-4 mb-2">
|
||
<strong class="d-block mb-1"><i class="bx bx-briefcase text-info me-1"></i>
|
||
Menadżer</strong>
|
||
<span class="small opacity-75">Zarządza zespołem i widzi panel, ale nie ma dostępu do
|
||
rozliczeń ani nie może kupować aplikacji.</span>
|
||
</div>
|
||
<div class="col-md-4 mb-2">
|
||
<strong class="d-block mb-1"><i class="bx bx-user text-secondary me-1"></i>
|
||
Pracownik</strong>
|
||
<span class="small opacity-75">Domyślnie brak dostępu do tego panelu. Uprawnienia nadajesz w
|
||
zakładce "Uprawnienia".</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card mb-4">
|
||
<div class="card-body">
|
||
<h5 class="card-title mb-1">Zaproś nowego członka zespołu</h5>
|
||
<p class="text-muted small mb-3">Wprowadź adres e-mail osoby, którą chcesz dodać do Twojej firmy.</p>
|
||
|
||
<form onsubmit="return false;" class="d-flex mb-3">
|
||
<div class="input-group input-group-merge shadow-sm" style="max-width: 500px;">
|
||
<span class="input-group-text bg-white border-end-0"><i
|
||
class="bx bx-envelope text-muted"></i></span>
|
||
<input type="email" class="form-control border-start-0 ps-0" placeholder="np. jan.kowalski@firma.pl"
|
||
required>
|
||
<button type="button" class="btn btn-primary px-4" data-bs-toggle="modal"
|
||
data-bs-target="#userSearchModal">
|
||
Sprawdź <i class="bx bx-right-arrow-alt ms-1"></i>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<h5 class="card-header border-bottom d-flex justify-content-between align-items-center">
|
||
Członkowie zespołu
|
||
</h5>
|
||
|
||
<div class="table-responsive text-nowrap pb-2">
|
||
<table class="table table-hover mb-0">
|
||
<thead class="table-light">
|
||
<tr>
|
||
<th>Użytkownik</th>
|
||
<th>Rola w firmie</th>
|
||
<th>Status</th>
|
||
<th class="text-end">Akcje</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody class="table-border-bottom-0">
|
||
|
||
<tr>
|
||
<td>
|
||
<div class="d-flex justify-content-start align-items-center">
|
||
<div class="avatar avatar-sm me-3">
|
||
<span class="avatar-initial rounded-circle bg-label-primary">BB</span>
|
||
</div>
|
||
<div class="d-flex flex-column">
|
||
<h6 class="mb-0 fw-semibold">
|
||
Bartłomiej Banaczyk
|
||
<i class="bx bxs-badge-check text-primary ms-1" data-bs-toggle="tooltip"
|
||
title="Zweryfikowane konto id.magico"></i>
|
||
</h6>
|
||
<small class="text-muted">banaczyk@magico.pl</small>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
<td style="width: 250px;">
|
||
<select class="form-select">
|
||
<option value="owner" selected>Właściciel</option>
|
||
<option value="manager">Menadżer</option>
|
||
<option value="user">Pracownik</option>
|
||
</select>
|
||
</td>
|
||
<td>
|
||
<span class="badge bg-label-success">Aktywny</span>
|
||
</td>
|
||
<td class="text-end">
|
||
<button type="button" class="btn btn-sm btn-icon btn-text-secondary rounded-circle"
|
||
disabled>
|
||
<i class="bx bx-trash fs-5 opacity-50"></i>
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<div class="d-flex justify-content-start align-items-center">
|
||
<div class="avatar avatar-sm me-3">
|
||
<span class="avatar-initial rounded-circle bg-label-secondary"><i
|
||
class="bx bx-user"></i></span>
|
||
</div>
|
||
<div class="d-flex flex-column">
|
||
<h6 class="mb-0 fw-semibold text-muted">
|
||
Piotr Mierzwa
|
||
</h6>
|
||
<small class="text-muted">piotr@magico.pl</small>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
<td style="width: 250px;">
|
||
<span class="text-muted small"><i class="bx bx-time-five me-1"></i>Oczekuje na
|
||
rejestrację</span>
|
||
</td>
|
||
<td>
|
||
<button class="btn btn-sm btn-label-warning px-2 py-1">
|
||
<i class="bx bx-mail-send me-1"></i> Ponów zaproszenie
|
||
</button>
|
||
</td>
|
||
<td class="text-end">
|
||
<button type="button" class="btn btn-sm btn-icon btn-text-danger rounded-circle"
|
||
data-bs-toggle="tooltip" title="Usuń z firmy">
|
||
<i class="bx bx-trash fs-5"></i>
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<div class="d-flex justify-content-start align-items-center">
|
||
<div class="avatar avatar-sm me-3">
|
||
<img src="https://ui-avatars.com/api/?name=Tech+Magico&background=e7e7ff&color=696cff"
|
||
alt="Avatar" class="rounded-circle">
|
||
</div>
|
||
<div class="d-flex flex-column">
|
||
<h6 class="mb-0 fw-semibold">
|
||
Tech Magico
|
||
<i class="bx bxs-badge-check text-primary ms-1" data-bs-toggle="tooltip"
|
||
title="Zweryfikowane konto id.magico"></i>
|
||
</h6>
|
||
<small class="text-muted">tech@magico.pl</small>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
<td style="width: 250px;">
|
||
<select class="form-select">
|
||
<option value="owner">Właściciel</option>
|
||
<option value="manager">Menadżer</option>
|
||
<option value="user" selected>Pracownik</option>
|
||
</select>
|
||
</td>
|
||
<td>
|
||
<span class="badge bg-label-success">Aktywny</span>
|
||
</td>
|
||
<td class="text-end">
|
||
<button type="button" class="btn btn-sm btn-icon btn-text-danger rounded-circle"
|
||
data-bs-toggle="tooltip" title="Usuń z firmy">
|
||
<i class="bx bx-trash fs-5"></i>
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal fade" id="userSearchModal" tabindex="-1" aria-hidden="true" data-bs-backdrop="static">
|
||
<div class="modal-dialog modal-dialog-centered" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header border-bottom pb-3">
|
||
<h5 class="modal-title">Dodawanie pracownika</h5>
|
||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||
</div>
|
||
<div class="modal-body p-4 text-center">
|
||
|
||
<div
|
||
class="avatar avatar-md mx-auto mb-3 bg-label-success rounded-circle d-flex align-items-center justify-content-center">
|
||
<i class="bx bx-user-check fs-2"></i>
|
||
</div>
|
||
<h5>Mamy go!</h5>
|
||
<p class="text-muted mb-4">Użytkownik <strong>jan.kowalski@firma.pl</strong> posiada już konto w
|
||
centralnym systemie magico.</p>
|
||
<button class="btn btn-primary w-100" data-bs-dismiss="modal">
|
||
<i class="bx bx-plus me-2"></i> Dodaj do mojej firmy
|
||
</button>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="footer" class="footer" style="background: #e7e7ff; position: sticky; bottom: 0px; right: 0px;">
|
||
<footer class="content-footer footer">
|
||
<div class="container-xxl d-flex py-3 justify-content-center">
|
||
<button class="btn btn-primary btn-lg">Zapisz</button>
|
||
</div>
|
||
</footer>
|
||
</div>
|
||
|
||
<div class="content-backdrop fade"></div>
|
||
|
||
<?php include '../../footer.php'; ?>
|
||
|
||
<!-- Scripts -->
|
||
<script>
|
||
document.addEventListener("DOMContentLoaded", function () {
|
||
// Tu znajdą się skrypty odpowiedzialne za logikę widoku zespołu, np. obsługa tabeli
|
||
});
|
||
</script>
|
||
|
||
</body>
|
||
|
||
</html>
|