Compare commits
4 Commits
a0a4cd28aa
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| ad9279dbce | |||
| f2e1fa6134 | |||
| eed545736d | |||
| c63e7e6c9c |
80
header-company.php
Normal file
80
header-company.php
Normal file
@@ -0,0 +1,80 @@
|
||||
<?php
|
||||
$basePath = '';
|
||||
if ($_SERVER['HTTP_HOST'] === 'localhost' || $_SERVER['HTTP_HOST'] === '127.0.0.1') {
|
||||
$basePath = '/magico-prototype';
|
||||
}
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en" class="light-style layout-navbar-fixed layout-menu-fixed layout-compact" dir="ltr"
|
||||
data-theme="theme-default" data-assets-path="<?= $basePath ?>/assets/"
|
||||
data-template="vertical-menu-template-no-customizer-starter">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
|
||||
|
||||
<title>company.magico</title>
|
||||
|
||||
<meta name="description" content="" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="<?= $basePath ?>/assets/img/favicon/favicon.ico" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
|
||||
rel="stylesheet" />
|
||||
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/fonts/boxicons.css" />
|
||||
<!-- <link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/fonts/fontawesome.css" /> -->
|
||||
<!-- <link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/fonts/flag-icons.css" /> -->
|
||||
|
||||
<!-- Core CSS -->
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/css/rtl/core.css" />
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/css/rtl/theme-default.css" />
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/css/demo.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.css" />
|
||||
|
||||
<!-- Page CSS -->
|
||||
|
||||
<!-- Helpers -->
|
||||
<script src="<?= $basePath ?>/assets/vendor/js/helpers.js"></script>
|
||||
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
|
||||
<!--? Config: Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file. -->
|
||||
<script src="<?= $basePath ?>/assets/js/config.js"></script>
|
||||
|
||||
<?php if (!empty($enablePrototypeComments) && $enablePrototypeComments): ?>
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/css/comments.css">
|
||||
<?php endif; ?>
|
||||
|
||||
<style>
|
||||
@media (min-width: 1200px) {
|
||||
|
||||
.layout-menu-fixed .layout-menu,
|
||||
.layout-menu-fixed-offcanvas .layout-menu {
|
||||
padding-top: 50px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Layout wrapper -->
|
||||
<div class="layout-wrapper layout-content-navbar">
|
||||
<div class="layout-container">
|
||||
<!-- Menu -->
|
||||
|
||||
<?php include 'menu.php'; ?>
|
||||
<!-- / Menu -->
|
||||
|
||||
<!-- Layout container -->
|
||||
<div class="layout-page pt-0" style="padding-top: 0 !important;">
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
257
prototype/company/app-billing.php
Normal file
257
prototype/company/app-billing.php
Normal file
@@ -0,0 +1,257 @@
|
||||
<?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 firmą /</span> Rozliczenia
|
||||
</h4>
|
||||
|
||||
<!-- Karta: Rozliczenia (Podsumowanie) -->
|
||||
<div class="card mb-4">
|
||||
<h5 class="card-header border-bottom">Rozliczenia</h5>
|
||||
<div class="card-body pt-5 pb-5">
|
||||
|
||||
<!-- Wycentrowany Alert z tłem ze screena -->
|
||||
<div class="d-flex justify-content-center mb-5">
|
||||
<div class="p-3 rounded text-white d-inline-flex align-items-center shadow-sm"
|
||||
style="background-color: #f04e76; font-weight: 500; width: 100%; max-width: 800px;">
|
||||
<i class='bx bxs-error-alt me-2 fs-5'></i>
|
||||
Dokonaj płatności aby zachować subskrypcję. Usługi pozostaną aktywne do 2026-03-31.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Parametry -->
|
||||
<div class="d-flex flex-column flex-md-row justify-content-center gap-5">
|
||||
<div class="text-start">
|
||||
<small class="text-muted text-uppercase fw-semibold" style="letter-spacing: 0.5px;">Aktualny okres
|
||||
rozliczeniowy:</small>
|
||||
<h5 class="mt-2 mb-0 fw-bold text-dark">2026-03-01 - 2026-03-31</h5>
|
||||
</div>
|
||||
|
||||
<div class="text-start">
|
||||
<small class="text-muted text-uppercase fw-semibold" style="letter-spacing: 0.5px;">Szacowane
|
||||
rozliczenie</small>
|
||||
<h3 class="mt-1 mb-1 fw-bold" style="color: #696cff;">425 zł</h3>
|
||||
<small class="text-muted">Następna płatność:: 2026-04-01</small>
|
||||
</div>
|
||||
|
||||
<div class="text-start">
|
||||
<small class="text-muted text-uppercase fw-semibold" style="letter-spacing: 0.5px;">Ilość miejsca na
|
||||
dysku</small>
|
||||
<h3 class="mt-1 mb-0 fw-bold" style="color: #696cff;">0.04 GB</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta: Historia płatności -->
|
||||
<div class="card">
|
||||
<h5 class="card-header border-bottom">Historia płatności</h5>
|
||||
<div class="table-responsive text-nowrap pb-2">
|
||||
<table class="table table-hover">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="fw-bold">Nr dokumentu</th>
|
||||
<th class="fw-bold">Status</th>
|
||||
<th class="fw-bold">Kwota (netto)</th>
|
||||
<th class="fw-bold">Data wystawienia</th>
|
||||
<th class="fw-bold">Faktura VAT</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
|
||||
<!-- Wiersz 1 -->
|
||||
<tr>
|
||||
<td><a href="#" class="fw-bold text-primary">5/05/2025</a></td>
|
||||
<td><span class="badge bg-label-warning px-2 py-1" style="font-size: 0.75rem;">Opóźniona</span>
|
||||
</td>
|
||||
<td class="fw-semibold">365 zł</td>
|
||||
<td class="text-dark">2025-06-01</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap disabled"
|
||||
style="background-color: #f8f9fa;"><i class="bx bx-cloud-download me-1"></i> Faktura
|
||||
VAT</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"><i
|
||||
class="bx bx-cloud-download me-1"></i> Faktura proforma</button>
|
||||
|
||||
<span class="text-muted mx-2">|</span>
|
||||
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap" data-bs-toggle="modal"
|
||||
data-bs-target="#billingDetailsModal">
|
||||
<i class="bx bx-list-ul me-1"></i> Szczegóły
|
||||
</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"
|
||||
style="background-color: #f8f9fa;">
|
||||
<i class="bx bx-credit-card me-1"></i> company.payonline
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 2 -->
|
||||
<tr>
|
||||
<td><a href="#" class="fw-bold text-primary">5/02/2025</a></td>
|
||||
<td><span class="badge bg-label-warning px-2 py-1" style="font-size: 0.75rem;">Opóźniona</span>
|
||||
</td>
|
||||
<td class="fw-semibold">345 zł</td>
|
||||
<td class="text-dark">2025-03-10</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap disabled"
|
||||
style="background-color: #f8f9fa;"><i class="bx bx-cloud-download me-1"></i> Faktura
|
||||
VAT</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"><i
|
||||
class="bx bx-cloud-download me-1"></i> Faktura proforma</button>
|
||||
|
||||
<span class="text-muted mx-2">|</span>
|
||||
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap" data-bs-toggle="modal"
|
||||
data-bs-target="#billingDetailsModal">
|
||||
<i class="bx bx-list-ul me-1"></i> Szczegóły
|
||||
</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"
|
||||
style="background-color: #f8f9fa;">
|
||||
<i class="bx bx-credit-card me-1"></i> company.payonline
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 3 - Przykładowy opłacony dodany dla logiki -->
|
||||
<tr>
|
||||
<td><a href="#" class="fw-bold text-muted">2/01/2025</a></td>
|
||||
<td><span class="badge bg-label-success px-2 py-1" style="font-size: 0.75rem;">Opłacona</span>
|
||||
</td>
|
||||
<td class="fw-semibold">345 zł</td>
|
||||
<td class="text-dark">2025-01-05</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"><i
|
||||
class="bx bx-cloud-download me-1"></i> Faktura VAT</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap disabled"
|
||||
style="background-color: #f8f9fa;"><i class="bx bx-cloud-download me-1"></i> Faktura
|
||||
proforma</button>
|
||||
|
||||
<span class="text-muted mx-2">|</span>
|
||||
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap" data-bs-toggle="modal"
|
||||
data-bs-target="#billingDetailsModal">
|
||||
<i class="bx bx-list-ul me-1"></i> Szczegóły
|
||||
</button>
|
||||
<!-- Brak przycisku opłać, bo jest opłacona -->
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Modal Szczegóły Rozliczenia -->
|
||||
<div class="modal fade" id="billingDetailsModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header border-bottom pb-3">
|
||||
<h5 class="modal-title fw-bold" id="exampleModalLabel1">Szczegóły rozliczenia dla dokumentu: <span
|
||||
class="text-primary">5/05/2025</span></h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body py-4 bg-lighter">
|
||||
|
||||
<div class="card shadow-none border">
|
||||
<div class="card-body p-0">
|
||||
<ul class="list-group list-group-flush mb-0">
|
||||
<!-- Pozycja 1 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Opłata podstawowa (Abonament Baza)</h6>
|
||||
<small class="text-muted mt-0 d-block">Utrzymanie rdzenia systemu. Nielimitowana
|
||||
ilość przestrzeni i kont właścicielskich.</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1">199.00 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Pozycja 2 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Aplikacja: helpdesk.magico</h6>
|
||||
<small class="text-muted mt-0 d-block">Liczba przypisanych kont pracowników w danym
|
||||
cyklu: <strong>4 stanowiska</strong><br>Opłata: 4 x 30.00 zł</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1">120.00 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Pozycja 3 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Bramka komunikacji SMS (Powiadomienia)</h6>
|
||||
<small class="text-muted mt-0 d-block">Wysłane wiadomości autoryzacyjne i systemowe:
|
||||
<strong>247 SMS</strong><br>Koszt jednostkowy API: 0.15 zł</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1">37.05 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Pozycja 4 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Aplikacja: invoice.magico</h6>
|
||||
<small class="text-muted mt-0 d-block">Moduł wbudowany bezpłatnie jako fundament
|
||||
profilu.</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1 text-success">0.00 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Suma Rozliczenia -->
|
||||
<li
|
||||
class="list-group-item d-flex justify-content-between align-items-center py-4 bg-label-primary bg-opacity-10 border-top-2">
|
||||
<div>
|
||||
<h5 class="mb-0 fw-bold text-primary">Kwota netto dokumentu</h5>
|
||||
<small class="text-primary text-opacity-75">Suma zliczona przed nałożeniem podatku
|
||||
VAT (23%)</small>
|
||||
</div>
|
||||
<span class="fw-bold text-primary fs-3">356.05 zł</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-secondary mb-0 mt-4 d-flex align-items-center overflow-hidden">
|
||||
<i class="bx bx-info-circle fs-3 me-3 text-secondary"></i>
|
||||
<small class="lh-sm">Koszt aplikacji stanowiskowych wyliczany jest na podstawie największej liczby
|
||||
kont pracowników z uprawnieniami w trakcie całego ubiegłego cyku rozliczeniowego.</small>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer border-top pt-3">
|
||||
<button type="button" class="btn btn-label-secondary" data-bs-dismiss="modal">Zamknij podgląd</button>
|
||||
<button type="button" class="btn btn-primary"><i class="bx bx-credit-card me-2"></i> Przejdź do
|
||||
opłacenia faktury</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// ...
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
291
prototype/company/app-company-info.php
Normal file
291
prototype/company/app-company-info.php
Normal file
@@ -0,0 +1,291 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<!-- Vendor CSS -->
|
||||
<link rel="stylesheet" href="../../assets/vendor/libs/select2/select2.css" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.13/cropper.min.css" />
|
||||
|
||||
<style>
|
||||
/* Obłe krawędzie dla kółka wykadrowania w Cropper JS */
|
||||
.cropper-view-box,
|
||||
.cropper-face {
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<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 firmą /</span> Informacje o firmie
|
||||
</h4>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
|
||||
<div class="card mb-4">
|
||||
<h5 class="card-header border-bottom">Profil firmy</h5>
|
||||
|
||||
<div class="card-body mt-3">
|
||||
<div class="d-flex align-items-start align-items-sm-center gap-4">
|
||||
<img src="https://ui-avatars.com/api/?name=Firma&background=e7e7ff&color=696cff&size=150"
|
||||
alt="Logo firmy" class="d-block rounded-circle" height="100" width="100" id="uploadedLogo"
|
||||
style="object-fit: cover;">
|
||||
<div class="button-wrapper">
|
||||
<label for="upload" class="btn btn-primary me-2 mb-3" tabindex="0">
|
||||
<span class="d-none d-sm-block">Wgraj nowe logo</span>
|
||||
<i class="bx bx-upload d-block d-sm-none"></i>
|
||||
<input type="file" id="upload" class="account-file-input" hidden
|
||||
accept="image/png, image/jpeg, image/jpg">
|
||||
</label>
|
||||
<button type="button" class="btn btn-label-secondary account-image-reset mb-3">
|
||||
<i class="bx bx-reset d-block d-sm-none"></i>
|
||||
<span class="d-none d-sm-block">Usuń</span>
|
||||
</button>
|
||||
<p class="text-muted mb-0">Dozwolone formaty: JPG, GIF lub PNG. Max rozmiar 800K</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="my-0">
|
||||
|
||||
<div class="card-body">
|
||||
<form id="formCompanyProfile" onsubmit="return false">
|
||||
<div class="row">
|
||||
<div class="mb-3 col-md-6">
|
||||
<label for="companyShortName" class="form-label">
|
||||
Krótka nazwa firmy
|
||||
<i class="bx bx-info-circle text-muted ms-1 cursor-pointer" data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
title="Nazwa będzie widoczna tylko dla Ciebie i współpracowników. Wykorzystywana w aplikacjach magico."></i>
|
||||
</label>
|
||||
<input class="form-control" type="text" id="companyShortName" name="companyShortName"
|
||||
placeholder="Wpisz krótką nazwę..." value="" autofocus>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mb-4">
|
||||
<h5 class="card-header border-bottom">Dane rozliczeniowe</h5>
|
||||
<div class="card-body mt-3">
|
||||
<form id="formBillingSettings" onsubmit="return false">
|
||||
<div class="row g-4">
|
||||
<div class="col-md-6">
|
||||
<label for="locationLabel" class="form-label">Kraj</label>
|
||||
<select id="locationLabel" class="form-select select2-country">
|
||||
<option value="pl" selected>Polska</option>
|
||||
<option value="us">Stany Zjednoczone</option>
|
||||
<option value="gb">Wielka Brytania</option>
|
||||
<option value="de">Niemcy</option>
|
||||
<option value="fr">Francja</option>
|
||||
<option value="it">Włochy</option>
|
||||
<option value="es">Hiszpania</option>
|
||||
<option value="ua">Ukraina</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label for="nipNumber" class="form-label">Numer NIP</label>
|
||||
<input type="text" name="nipNumber" id="nipNumber" placeholder="___-___-__-__"
|
||||
class="form-control">
|
||||
</div>
|
||||
|
||||
<div class="col-md-12">
|
||||
<label for="companyFullName" class="form-label">Pełna nazwa firmy</label>
|
||||
<input type="text" name="companyFullName" id="companyFullName"
|
||||
placeholder="Wpisz pełną nazwę podmiotu..." class="form-control">
|
||||
<div class="form-text">Do użytku w rozliczeniach i fakturach</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<label for="zipCode" class="form-label">Kod pocztowy</label>
|
||||
<input type="text" name="zipCode" id="zipCode" placeholder="__-___"
|
||||
class="form-control">
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<label for="cityName" class="form-label">Miasto</label>
|
||||
<input type="text" name="cityName" id="cityName" placeholder="Wpisz miasto..."
|
||||
class="form-control">
|
||||
</div>
|
||||
|
||||
<div class="col-md-12">
|
||||
<label for="addressDetails" class="form-label">Adres</label>
|
||||
<input type="text" name="addressDetails" id="addressDetails"
|
||||
placeholder="Ulica i numer budynku/lokalu" class="form-control">
|
||||
</div>
|
||||
|
||||
<div class="col-md-12 mt-4">
|
||||
<div class="border-top pt-4">
|
||||
<label for="billingEmail" class="form-label">Dodatkowy adres e-mail do
|
||||
rozliczeń</label>
|
||||
<input type="email" name="billingEmail" id="billingEmail"
|
||||
placeholder="np. ksiegowosc@twojafirma.pl" class="form-control mb-2">
|
||||
|
||||
<div class="alert alert-primary d-flex align-items-baseline mb-0" role="alert">
|
||||
<span class="alert-icon align-middle me-2">
|
||||
<i class="bx bx-info-circle"></i>
|
||||
</span>
|
||||
<div>
|
||||
Dokumenty rozliczeniowe będą automatycznie wysyłane na powyższy adres
|
||||
(opcjonalnie) oraz do wszystkich użytkowników posiadających rolę
|
||||
<strong>"Właściciel"</strong> ustawioną w sekcji Zespół.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal dla Cropper.js -->
|
||||
<div class="modal fade" id="cropModal" 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">
|
||||
<h5 class="modal-title" id="cropModalLabel">Wykadruj logo (koło)</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="img-container"
|
||||
style="max-height: 400px; display: flex; justify-content: center; background-color: #f5f5f9;">
|
||||
<img id="imageToCrop" src="" alt="Obraz do wykadrowania" style="max-width: 100%; display: block;">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-label-secondary" data-bs-dismiss="modal">Anuluj</button>
|
||||
<button type="button" class="btn btn-primary" id="cropButton">Zatwierdź logo</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 src="../../assets/vendor/libs/select2/select2.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.13/cropper.min.js"></script>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// --- Inicjalizacja Tooltipów ---
|
||||
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
||||
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||
return new bootstrap.Tooltip(tooltipTriggerEl);
|
||||
});
|
||||
|
||||
// --- Inicjalizacja Select2 ---
|
||||
function renderIcons(option) {
|
||||
if (!option.id) { return option.text; }
|
||||
var $icon = $(
|
||||
"<span class='d-flex align-items-center'><img src='https://flagcdn.com/w20/" + option.id.toLowerCase() + ".png' class='me-2' style='width: 20px; border-radius: 2px;' alt='flag' />" + option.text + "</span>"
|
||||
);
|
||||
return $icon;
|
||||
}
|
||||
|
||||
if ($('.select2-country').length) {
|
||||
$('.select2-country').select2({
|
||||
templateResult: renderIcons,
|
||||
templateSelection: renderIcons,
|
||||
escapeMarkup: function (es) { return es; }
|
||||
});
|
||||
}
|
||||
|
||||
// --- Inicjalizacja Cropper JS ---
|
||||
let cropper;
|
||||
const image = document.getElementById('imageToCrop');
|
||||
const input = document.getElementById('upload');
|
||||
const cropModalEl = document.getElementById('cropModal');
|
||||
const uploadedLogo = document.getElementById('uploadedLogo');
|
||||
let cropModal;
|
||||
|
||||
if (cropModalEl) {
|
||||
cropModal = new bootstrap.Modal(cropModalEl);
|
||||
}
|
||||
|
||||
if (input) {
|
||||
input.addEventListener('change', function (e) {
|
||||
const files = e.target.files;
|
||||
if (files && files.length > 0) {
|
||||
const file = files[0];
|
||||
const reader = new FileReader();
|
||||
reader.onload = function (e) {
|
||||
image.src = e.target.result;
|
||||
cropModal.show();
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
input.value = ''; // reset value to allow choosing the same file again
|
||||
});
|
||||
}
|
||||
|
||||
if (cropModalEl) {
|
||||
cropModalEl.addEventListener('shown.bs.modal', function () {
|
||||
cropper = new Cropper(image, {
|
||||
aspectRatio: 1, // kwadrat = koło po zaokrągleniu
|
||||
viewMode: 1,
|
||||
dragMode: 'move',
|
||||
autoCropArea: 0.8,
|
||||
restore: false,
|
||||
guides: false,
|
||||
center: false,
|
||||
highlight: false,
|
||||
cropBoxMovable: true,
|
||||
cropBoxResizable: true,
|
||||
toggleDragModeOnDblclick: false,
|
||||
});
|
||||
});
|
||||
|
||||
cropModalEl.addEventListener('hidden.bs.modal', function () {
|
||||
if (cropper) {
|
||||
cropper.destroy();
|
||||
cropper = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const cropBtn = document.getElementById('cropButton');
|
||||
if (cropBtn) {
|
||||
cropBtn.addEventListener('click', function () {
|
||||
if (!cropper) return;
|
||||
const canvas = cropper.getCroppedCanvas({
|
||||
width: 300,
|
||||
height: 300
|
||||
});
|
||||
uploadedLogo.src = canvas.toDataURL(); // aktualizacja logo
|
||||
cropModal.hide();
|
||||
});
|
||||
}
|
||||
|
||||
// Reset obrazka
|
||||
const resetBtn = document.querySelector('.account-image-reset');
|
||||
if (resetBtn) {
|
||||
resetBtn.addEventListener('click', () => {
|
||||
uploadedLogo.src = 'https://ui-avatars.com/api/?name=Firma&background=e7e7ff&color=696cff&size=150';
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
304
prototype/company/app-group-edit.php
Normal file
304
prototype/company/app-group-edit.php
Normal file
@@ -0,0 +1,304 @@
|
||||
<?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 / <a href="app-groups.php"
|
||||
class="text-muted text-decoration-none">Grupy</a> /</span> Edycja grupy
|
||||
</h4>
|
||||
|
||||
<div class="row">
|
||||
<!-- Formularz informacji ogólnych -->
|
||||
<div class="col-md-12 col-lg-4 mb-4">
|
||||
<div class="card h-100">
|
||||
<h5 class="card-header border-bottom">Informacje ogólne</h5>
|
||||
<div class="card-body mt-4">
|
||||
<form id="formGroupEdit" onsubmit="return false">
|
||||
<div class="mb-3">
|
||||
<label for="groupName" class="form-label">Nazwa grupy <span
|
||||
class="text-danger">*</span></label>
|
||||
<input type="text" class="form-control" id="groupName" value="Kadra Kierownicza" autofocus>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="groupDescription" class="form-label">Opis / Notatka dla użytkowników</label>
|
||||
<textarea class="form-control" id="groupDescription"
|
||||
rows="4">Pełny wgląd w raporty finansowe, listę pracowników oraz obieg dokumentów.</textarea>
|
||||
<div class="form-text">Zwięzły opis pomoże innym administratorom zrozumieć przeznaczenie tej
|
||||
grupy.</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label d-block">Status grupy</label>
|
||||
<div class="form-check form-switch mb-2">
|
||||
<input class="form-check-input" type="checkbox" id="flexSwitchCheckChecked" checked>
|
||||
<label class="form-check-label" for="flexSwitchCheckChecked">Aktywna</label>
|
||||
</div>
|
||||
<div class="form-text">Wyłączenie grupy tymczasowo odbierze dostęp do jej zasobów wszystkim
|
||||
uprawnionym użytkownikom, ale nie usunie z niej członków.</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Przypisywanie użytkowników -->
|
||||
<div class="col-md-12 col-lg-8 mb-4">
|
||||
<div class="card h-100">
|
||||
<div class="card-header border-bottom d-flex justify-content-between align-items-center">
|
||||
<h5 class="m-0">Przypisani członkowie zespołu (3)</h5>
|
||||
<div class="input-group input-group-merge" style="max-width: 250px;">
|
||||
<span class="input-group-text"><i class="bx bx-search"></i></span>
|
||||
<input type="text" id="searchUser" class="form-control form-control-sm"
|
||||
placeholder="Szukaj osoby...">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive text-nowrap" style="max-height: 500px; overflow-y: auto;">
|
||||
<table class="table table-hover">
|
||||
<thead class="table-light sticky-top">
|
||||
<tr>
|
||||
<th style="width: 50px;" class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" id="selectAll"
|
||||
style="cursor: pointer;">
|
||||
</div>
|
||||
</th>
|
||||
<th>Użytkownik</th>
|
||||
<th>Rola w firmie</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
|
||||
<!-- Aktywny przypisany właściciel -->
|
||||
<tr class="table-primary">
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" checked
|
||||
style="cursor: pointer;">
|
||||
</div>
|
||||
</td>
|
||||
<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=Bartłomiej+Banaczyk&background=e7e7ff&color=696cff"
|
||||
alt="Avatar" class="rounded-circle">
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-primary">Bartłomiej Banaczyk (Ty)</h6>
|
||||
<small class="text-muted">banaczyk@magico.pl</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-label-warning"><i class="bx bx-crown me-1"></i>
|
||||
Właściciel</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Aktywny przypisany 1 -->
|
||||
<tr class="table-primary">
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" checked
|
||||
style="cursor: pointer;">
|
||||
</div>
|
||||
</td>
|
||||
<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=Jan+Kowalski&background=e7e7ff&color=696cff"
|
||||
alt="Avatar" class="rounded-circle">
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-primary">Jan Kowalski</h6>
|
||||
<small class="text-muted">jan.kowalski@firma.pl</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-muted small">Menadżer</span></td>
|
||||
</tr>
|
||||
|
||||
<!-- Aktywny przypisany 2 -->
|
||||
<tr class="table-primary">
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" checked
|
||||
style="cursor: pointer;">
|
||||
</div>
|
||||
</td>
|
||||
<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=Anna+Nowak&background=ffe7e7&color=ff6969"
|
||||
alt="Avatar" class="rounded-circle">
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-primary">Anna Nowak</h6>
|
||||
<small class="text-muted">anna.nowak@firma.pl</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-muted small">Menadżer</span></td>
|
||||
</tr>
|
||||
|
||||
<!-- Nieprzypisany 1 -->
|
||||
<tr>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" style="cursor: pointer;">
|
||||
</div>
|
||||
</td>
|
||||
<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=Katarzyna+Lewandowska&background=e7f0ff&color=69a6ff"
|
||||
alt="Avatar" class="rounded-circle">
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-body">Katarzyna Lewandowska</h6>
|
||||
<small class="text-muted">k.lewandowska@firma.pl</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-muted small">Pracownik</span></td>
|
||||
</tr>
|
||||
|
||||
<!-- Nieprzypisany 2 -->
|
||||
<tr>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" style="cursor: pointer;">
|
||||
</div>
|
||||
</td>
|
||||
<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=Piotr+Wiśniewski&background=e7ffe7&color=69ff69"
|
||||
alt="Avatar" class="rounded-circle">
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-body">Piotr Wiśniewski</h6>
|
||||
<small class="text-muted">p.wisniewski@firma.pl</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-muted small">Pracownik</span></td>
|
||||
</tr>
|
||||
|
||||
<!-- Nieprzypisany 3 w trakcie rejestracji -->
|
||||
<tr>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<input class="form-check-input m-0" type="checkbox" style="cursor: pointer;">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-start align-items-center opacity-50">
|
||||
<div class="avatar avatar-sm me-3">
|
||||
<span class="avatar-initial rounded-circle bg-label-secondary"><i
|
||||
class="bx bx-time-five"></i></span>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-muted">Zuzanna Szymańska</h6>
|
||||
<small class="text-muted">zuzanna@firma.pl</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-label-secondary">Oczekuje na rejestrację</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer" class="footer" style="background: #e7e7ff; position: sticky; bottom: 0px; right: 0px; z-index: 1000;">
|
||||
<footer class="content-footer footer border-top">
|
||||
<div class="container-xxl d-flex py-3 justify-content-center">
|
||||
<a href="app-groups.php" class="btn btn-label-secondary btn-lg me-3">Anuluj</a>
|
||||
<button class="btn btn-primary btn-lg px-5">Zapisz ustawienia grupy</button>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// Logika zaznaczania / odznaczania wszystkich checkboxów
|
||||
const selectAllCheckbox = document.getElementById('selectAll');
|
||||
const userCheckboxes = document.querySelectorAll('tbody .form-check-input');
|
||||
|
||||
// Klikanie w dowolne miejsce wiersza zaznacza/odznacza checkboxa
|
||||
const tbodyRows = document.querySelectorAll('tbody tr');
|
||||
tbodyRows.forEach(row => {
|
||||
row.style.cursor = 'pointer'; // Kursor łapki na całym wierszu
|
||||
row.addEventListener('click', function (e) {
|
||||
// Pomijamy sytuację, gdy kliknięto bezpośrednio w checkbox (żeby nie wywoływać podwójnego toggle)
|
||||
if (e.target.tagName !== 'INPUT') {
|
||||
const checkbox = this.querySelector('.form-check-input');
|
||||
if (checkbox) {
|
||||
checkbox.checked = !checkbox.checked;
|
||||
// Ręczne wymuszenie eventu 'change' by reszta skryptów (np. zmiana koloru) prawidłowo zareagowała
|
||||
checkbox.dispatchEvent(new Event('change'));
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (selectAllCheckbox) {
|
||||
selectAllCheckbox.addEventListener('change', function () {
|
||||
const isChecked = this.checked;
|
||||
userCheckboxes.forEach(checkbox => {
|
||||
checkbox.checked = isChecked;
|
||||
updateRowHighlight(checkbox);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
userCheckboxes.forEach(checkbox => {
|
||||
checkbox.addEventListener('change', function () {
|
||||
updateRowHighlight(this);
|
||||
// Aktualizuj stan selectAll
|
||||
const allChecked = Array.from(userCheckboxes).every(cb => cb.checked);
|
||||
if (selectAllCheckbox) selectAllCheckbox.checked = allChecked;
|
||||
|
||||
const someChecked = Array.from(userCheckboxes).some(cb => cb.checked);
|
||||
if (selectAllCheckbox) selectAllCheckbox.indeterminate = someChecked && !allChecked;
|
||||
});
|
||||
});
|
||||
|
||||
function updateRowHighlight(checkbox) {
|
||||
const tr = checkbox.closest('tr');
|
||||
const h6 = tr.querySelector('h6');
|
||||
if (checkbox.checked) {
|
||||
tr.classList.add('table-primary');
|
||||
if (h6) {
|
||||
h6.classList.remove('text-body');
|
||||
h6.classList.add('text-primary');
|
||||
}
|
||||
} else {
|
||||
tr.classList.remove('table-primary');
|
||||
if (h6) {
|
||||
h6.classList.remove('text-primary');
|
||||
h6.classList.add('text-body');
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
339
prototype/company/app-groups.php
Normal file
339
prototype/company/app-groups.php
Normal file
@@ -0,0 +1,339 @@
|
||||
<?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 d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<span class="text-muted fw-light">Zarządzanie zespołem /</span> Grupy
|
||||
</div>
|
||||
<a href="app-group-edit.php" class="btn btn-primary">
|
||||
<i class="bx bx-plus me-1"></i> Utwórz grupę
|
||||
</a>
|
||||
</h4>
|
||||
|
||||
<!-- Filters/Search Card -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-body">
|
||||
<div class="row gx-3 gy-2 align-items-center">
|
||||
<div class="col-md-4">
|
||||
<label class="form-label" for="searchGroup">Wyszukaj grupę</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<span class="input-group-text"><i class="bx bx-search"></i></span>
|
||||
<input type="text" id="searchGroup" class="form-control" placeholder="Wpisz nazwę...">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<label class="form-label" for="filterStatus">Status</label>
|
||||
<select id="filterStatus" class="form-select">
|
||||
<option value="">Wszystkie</option>
|
||||
<option value="active">Aktywne</option>
|
||||
<option value="inactive">Nieaktywne</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-5 d-flex align-items-end justify-content-md-end mt-md-0 mt-3">
|
||||
<button class="btn btn-label-secondary"><i class="bx bx-reset me-1"></i> Wyczyść filtry</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Groups Table -->
|
||||
<div class="card">
|
||||
<h5 class="card-header border-bottom">Lista grup dostępu</h5>
|
||||
<div class="table-responsive text-nowrap pb-2">
|
||||
<table class="table table-hover">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th style="width: 250px;">Nazwa grupy</th>
|
||||
<th>Opis</th>
|
||||
<th style="width: 150px;">Członkowie</th>
|
||||
<th class="text-center" style="width: 100px;">Status</th>
|
||||
<th class="text-end" style="width: 120px;">Akcje</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
|
||||
<!-- Wiersz 1: Kadra Kierownicza -->
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm me-3 bg-label-primary rounded p-1 flex-shrink-0 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-briefcase fs-4"></i>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold"><a href="app-group-edit.php"
|
||||
class="text-body text-truncate">Kadra Kierownicza</a></h6>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small text-truncate d-block" style="max-width: 300px;">
|
||||
Pełny wgląd w raporty finansowe, listę pracowników oraz obieg dokumentów.
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center avatar-group">
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Jan Kowalski">
|
||||
<img src="https://ui-avatars.com/api/?name=Jan+Kowalski&background=e7e7ff&color=696cff"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Anna Nowak">
|
||||
<img src="https://ui-avatars.com/api/?name=Anna+Nowak&background=ffe7e7&color=ff6969"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Piotr Wiśniewski">
|
||||
<img src="https://ui-avatars.com/api/?name=Piotr+Wiśniewski&background=e7ffe7&color=69ff69"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="badge bg-label-success">Aktywna</span>
|
||||
</td>
|
||||
<td class="text-end">
|
||||
<div class="d-flex justify-content-end align-items-center">
|
||||
<div class="btn-group" role="group">
|
||||
<a href="app-group-edit.php" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="bx bx-edit-alt me-1 d-none d-sm-inline-block"></i> Edytuj
|
||||
</a>
|
||||
<div class="btn-group">
|
||||
<button type="button"
|
||||
class="btn btn-outline-secondary btn-sm dropdown-toggle dropdown-toggle-split"
|
||||
data-bs-toggle="dropdown" aria-expanded="false"></button>
|
||||
<div class="dropdown-menu dropdown-menu-end mt-1">
|
||||
<a href="javascript:void(0);" class="dropdown-item"><i
|
||||
class="bx bx-copy me-2"></i> Duplikuj</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="javascript:void(0);" class="dropdown-item text-danger"><i
|
||||
class="bx bx-trash me-2"></i> Usuń</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 2: Dział Marketingu -->
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm me-3 bg-label-info rounded p-1 flex-shrink-0 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-broadcast fs-4"></i>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold"><a href="app-group-edit.php"
|
||||
class="text-body text-truncate">Dział Marketingu</a></h6>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small text-truncate d-block" style="max-width: 300px;">
|
||||
Dostęp do lejków sprzedażowych, mailingów i zarządzania ofertami.
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center avatar-group">
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Katarzyna Lewandowska">
|
||||
<img src="https://ui-avatars.com/api/?name=Katarzyna+Lewandowska&background=e7f0ff&color=69a6ff"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Michał Zieliński">
|
||||
<img src="https://ui-avatars.com/api/?name=Michał+Zieliński&background=fff4e7&color=ffb869"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Zuzanna Szymańska">
|
||||
<span class="avatar-initial rounded-circle bg-label-warning pull-up">ZS</span>
|
||||
</div>
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Tomasz Dąbrowski">
|
||||
<img src="https://ui-avatars.com/api/?name=Tomasz+Dąbrowski&background=e7ebff&color=697fff"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
<div class="avatar avatar-sm">
|
||||
<span class="avatar-initial rounded-circle bg-lighter text-body pull-up"
|
||||
data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="5 kolejnych osób">+5</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="badge bg-label-success">Aktywna</span>
|
||||
</td>
|
||||
<td class="text-end">
|
||||
<div class="d-flex justify-content-end align-items-center">
|
||||
<div class="btn-group" role="group">
|
||||
<a href="app-group-edit.php" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="bx bx-edit-alt me-1 d-none d-sm-inline-block"></i> Edytuj
|
||||
</a>
|
||||
<div class="btn-group">
|
||||
<button type="button"
|
||||
class="btn btn-outline-secondary btn-sm dropdown-toggle dropdown-toggle-split"
|
||||
data-bs-toggle="dropdown" aria-expanded="false"></button>
|
||||
<div class="dropdown-menu dropdown-menu-end mt-1">
|
||||
<a href="javascript:void(0);" class="dropdown-item"><i
|
||||
class="bx bx-copy me-2"></i> Duplikuj</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="javascript:void(0);" class="dropdown-item text-danger"><i
|
||||
class="bx bx-trash me-2"></i> Usuń</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 3: Dział Obsługi Klienta -->
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm me-3 bg-label-success rounded p-1 flex-shrink-0 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-support fs-4"></i>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold"><a href="app-group-edit.php"
|
||||
class="text-body text-truncate">Dział Obsługi Klienta</a></h6>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small text-truncate d-block" style="max-width: 300px;">
|
||||
Dostęp do ticketów, korespondencji i podstawowych danych konrahentów.
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center avatar-group">
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Magdalena Kaczmarek">
|
||||
<img src="https://ui-avatars.com/api/?name=Magdalena+Kaczmarek&background=f4ffe7&color=b8ff69"
|
||||
alt="Avatar" class="rounded-circle pull-up">
|
||||
</div>
|
||||
<div class="avatar avatar-sm" data-bs-toggle="tooltip" data-bs-placement="top"
|
||||
title="Kamil Piotrowski">
|
||||
<span class="avatar-initial rounded-circle bg-label-dark pull-up">KP</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="badge bg-label-success">Aktywna</span>
|
||||
</td>
|
||||
<td class="text-end">
|
||||
<div class="d-flex justify-content-end align-items-center">
|
||||
<div class="btn-group" role="group">
|
||||
<a href="app-group-edit.php" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="bx bx-edit-alt me-1 d-none d-sm-inline-block"></i> Edytuj
|
||||
</a>
|
||||
<div class="btn-group">
|
||||
<button type="button"
|
||||
class="btn btn-outline-secondary btn-sm dropdown-toggle dropdown-toggle-split"
|
||||
data-bs-toggle="dropdown" aria-expanded="false"></button>
|
||||
<div class="dropdown-menu dropdown-menu-end mt-1">
|
||||
<a href="javascript:void(0);" class="dropdown-item"><i
|
||||
class="bx bx-copy me-2"></i> Duplikuj</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="javascript:void(0);" class="dropdown-item text-danger"><i
|
||||
class="bx bx-trash me-2"></i> Usuń</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 4: Zewnętrzna Księgowość (Przykład nieaktywnej) -->
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm me-3 bg-label-secondary rounded p-1 flex-shrink-0 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-calculator fs-4"></i>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h6 class="mb-0 fw-semibold text-muted"><a href="app-group-edit.php"
|
||||
class="text-muted text-truncate">Zewnętrzna Księgowość</a></h6>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small text-truncate d-block" style="max-width: 300px;">
|
||||
Tymczasowy dostęp audytowy – tylko odczyt sekcji finansowej.
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-label-secondary">Brak przypisań</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="badge bg-label-secondary">Nieaktywna</span>
|
||||
</td>
|
||||
<td class="text-end">
|
||||
<div class="d-flex justify-content-end align-items-center">
|
||||
<div class="btn-group" role="group">
|
||||
<a href="app-group-edit.php" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="bx bx-edit-alt me-1 d-none d-sm-inline-block"></i> Edytuj
|
||||
</a>
|
||||
<div class="btn-group">
|
||||
<button type="button"
|
||||
class="btn btn-outline-secondary btn-sm dropdown-toggle dropdown-toggle-split"
|
||||
data-bs-toggle="dropdown" aria-expanded="false"></button>
|
||||
<div class="dropdown-menu dropdown-menu-end mt-1">
|
||||
<a href="javascript:void(0);" class="dropdown-item"><i
|
||||
class="bx bx-copy me-2"></i> Duplikuj</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="javascript:void(0);" class="dropdown-item text-danger"><i
|
||||
class="bx bx-trash me-2"></i> Usuń</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Pagination -->
|
||||
<div class="card-footer d-flex justify-content-center border-top">
|
||||
<nav aria-label="Page navigation">
|
||||
<ul class="pagination pagination-sm mb-0">
|
||||
<li class="page-item prev disabled"><a class="page-link" href="javascript:void(0);"><i
|
||||
class="tf-icon bx bx-chevron-left"></i></a></li>
|
||||
<li class="page-item active"><a class="page-link" href="javascript:void(0);">1</a></li>
|
||||
<li class="page-item next disabled"><a class="page-link" href="javascript:void(0);"><i
|
||||
class="tf-icon bx bx-chevron-right"></i></a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// Inicjalizacja Tooltipów dla awatarów
|
||||
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
||||
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||
return new bootstrap.Tooltip(tooltipTriggerEl);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
425
prototype/company/app-permissions-acl.php
Normal file
425
prototype/company/app-permissions-acl.php
Normal file
@@ -0,0 +1,425 @@
|
||||
<?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 / <a href="app-permissions.php"
|
||||
class="text-muted text-decoration-none">Uprawnienia</a> /</span> invoice.magico (ACL)
|
||||
</h4>
|
||||
|
||||
<!-- Nagłówek kontekstu -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-body d-flex flex-column flex-md-row align-items-md-center justify-content-between">
|
||||
<div class="d-flex align-items-center mb-3 mb-md-0">
|
||||
<div
|
||||
class="avatar avatar-lg bg-label-primary rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-receipt fs-2"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-1 fw-bold">invoice.magico</h5>
|
||||
<p class="text-muted small mb-0">Zarządzaj macierzą uprawnień systemowych (ACL) dla modułu
|
||||
księgowego. Każda kolumna to Grupa a każdy wiersz to konkretna funkcja dostępna w aplikacji.
|
||||
Właściciel posiada niemodyfikowalny, pełny dostęp.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ms-md-4">
|
||||
<button class="btn btn-outline-secondary" onclick="window.location.href='app-groups.php'">
|
||||
<i class="bx bx-group me-1"></i> Zarządzaj grupami
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tabela Macierzy (ACL Matrix) -->
|
||||
<div class="card">
|
||||
<div
|
||||
class="card-header border-bottom d-flex flex-column flex-md-row justify-content-between align-items-md-center">
|
||||
<h5 class="m-0 mb-3 mb-md-0">Macierz uprawnień</h5>
|
||||
<div class="d-flex flex-wrap gap-2 flex-grow-1 ms-md-4 justify-content-end">
|
||||
<div class="dropdown flex-grow-1" style="max-width: 250px;">
|
||||
<button
|
||||
class="btn btn-outline-secondary dropdown-toggle w-100 text-start d-flex justify-content-between align-items-center"
|
||||
type="button" id="columnFilterDropdown" data-bs-toggle="dropdown" data-bs-auto-close="outside"
|
||||
aria-expanded="false">
|
||||
<span><i class="bx bx-filter-alt me-1"></i> Wybierz grupy</span>
|
||||
</button>
|
||||
<div class="dropdown-menu p-3" aria-labelledby="columnFilterDropdown" style="min-width: 250px;">
|
||||
<h6 class="dropdown-header px-0 text-uppercase fw-bold pt-0">Wyświetlane kolumny (max 5)</h6>
|
||||
<div class="form-check mb-2">
|
||||
<input class="form-check-input column-toggle" type="checkbox" value="1" id="col_1" checked>
|
||||
<label class="form-check-label" for="col_1">Właściciel </label>
|
||||
</div>
|
||||
<div class="form-check mb-2">
|
||||
<input class="form-check-input column-toggle" type="checkbox" value="2" id="col_2" checked>
|
||||
<label class="form-check-label" for="col_2">Kadra Kierownicza</label>
|
||||
</div>
|
||||
<div class="form-check mb-2">
|
||||
<input class="form-check-input column-toggle" type="checkbox" value="3" id="col_3" checked>
|
||||
<label class="form-check-label" for="col_3">Dział Marketingu</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input column-toggle" type="checkbox" value="4" id="col_4" checked>
|
||||
<label class="form-check-label" for="col_4">Dział Obsługi Klienta</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-group input-group-merge" style="max-width: 250px;">
|
||||
<span class="input-group-text"><i class="bx bx-search"></i></span>
|
||||
<input type="text" class="form-control form-control-sm" placeholder="Szukaj uprawnienia...">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive text-nowrap pb-2">
|
||||
<!-- Dodana klasa acl-table dla łatwiejszego stylowania przez JS -->
|
||||
<table class="table table-hover table-bordered mb-0 acl-table">
|
||||
<thead class="table-light align-middle sticky-top" style="z-index: 10;">
|
||||
<tr>
|
||||
<th style="min-width: 250px;">Moduł i Nazwa Uprawnienia</th>
|
||||
<th class="text-center" style="width: 150px;">
|
||||
<i class="bx bx-crown text-warning fs-5 mb-1 d-block"></i>
|
||||
Właściciel <br>
|
||||
<span class="badge bg-label-secondary mt-1">N/D</span>
|
||||
</th>
|
||||
<th class="text-center" style="width: 150px;">
|
||||
<i class="bx bx-briefcase text-primary fs-5 mb-1 d-block"></i>
|
||||
Kadra Kierownicza
|
||||
</th>
|
||||
<th class="text-center" style="width: 150px;">
|
||||
<i class="bx bx-broadcast text-info fs-5 mb-1 d-block"></i>
|
||||
Dział Marketingu
|
||||
</th>
|
||||
<th class="text-center" style="width: 150px;">
|
||||
<i class="bx bx-support text-success fs-5 mb-1 d-block"></i>
|
||||
Dział Obsługi Klienta
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
|
||||
<!-- SEKCJA: GŁÓWNE -->
|
||||
<tr class="table-secondary border-top-2 border-bottom-2">
|
||||
<td colspan="5" class="fw-bold fs-6 text-uppercase tracking-wider">
|
||||
<i class="bx bx-power-off me-2 text-muted"></i> Dostęp do modułu
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="global-access-row">
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Dostęp do aplikacji</h6>
|
||||
<small class="text-muted">Główny włącznik modułu dla tej grupy. Wyłączenie blokuje poniższe
|
||||
opcje.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0 global-access-checkbox" type="checkbox" checked
|
||||
style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0 global-access-checkbox" type="checkbox"
|
||||
style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0 global-access-checkbox" type="checkbox" checked
|
||||
style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- SEKCJA: FAKTURY -->
|
||||
<tr class="table-secondary border-top-2 border-bottom-2">
|
||||
<td colspan="5" class="fw-bold fs-6 text-uppercase tracking-wider">
|
||||
<i class="bx bx-file me-2 text-muted"></i> Dokumenty Sprzedaży (Faktury)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Odczyt plików i listy faktur</h6>
|
||||
<small class="text-muted">Pozwala m.in przeglądać ekran głównego listingu.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Wystawianie nowych</h6>
|
||||
<small class="text-muted">Ręczne kreowanie faktur przez formularz.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Trwałe usunięcie (Delete)</h6>
|
||||
<small class="text-muted">Prawo do kasacji dokumentów z bazy danych.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- SEKCJA: BAZA KONTRAHENTÓW -->
|
||||
<tr class="table-secondary border-top-2 border-bottom-2">
|
||||
<td colspan="5" class="fw-bold fs-6 text-uppercase tracking-wider">
|
||||
<i class="bx bx-buildings me-2 text-muted"></i> Baza Kontrahentów (CRM)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Przeglądanie kontrahentów</h6>
|
||||
<small class="text-muted">Podstawowy dostęp do modułu z listą firm.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Dodawanie i Edycja</h6>
|
||||
<small class="text-muted">Aktualizowanie adresów i nr NIP klientów.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- SEKCJA: USTAWIENIA KSIĘGOWE -->
|
||||
<tr class="table-secondary border-top-2 border-bottom-2">
|
||||
<td colspan="5" class="fw-bold fs-6 text-uppercase tracking-wider text-danger">
|
||||
<i class="bx bx-cog me-2 text-danger"></i> Krytyczne (Ustawienia Główne)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Edycja numeracji i rejestrów</h6>
|
||||
<small class="text-muted">Pozwala edytować schematy np: FV/2026/XX.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h6 class="mb-0 text-body">Eksport pliku JPK_V7</h6>
|
||||
<small class="text-muted">Przesyłanie danych do Urzędu Skarbowego.</small>
|
||||
</td>
|
||||
<td class="text-center align-middle bg-label-secondary"><i
|
||||
class="bx bx-check text-muted fs-4"></i></td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" checked style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
<td class="text-center align-middle">
|
||||
<div class="d-flex justify-content-center align-items-center"><input
|
||||
class="form-check-input m-0" type="checkbox" style="cursor: pointer;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sticky Save Footer -->
|
||||
<div id="footer" class="footer" style="background: #e7e7ff; position: sticky; bottom: 0px; right: 0px; z-index: 1000;">
|
||||
<footer class="content-footer footer border-top">
|
||||
<div class="container-xxl d-flex py-3 justify-content-center">
|
||||
<a href="app-permissions.php" class="btn btn-label-secondary btn-lg me-3">Anuluj</a>
|
||||
<button class="btn btn-primary btn-lg px-5">Zapisz</button>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// Podobnie jak z członkami grup, uczyńmy całe komórki klikalnymi!
|
||||
const aclTds = document.querySelectorAll('.acl-table tbody tr td.text-center');
|
||||
|
||||
aclTds.forEach(td => {
|
||||
// Pomijamy komórki szare/zablokowane (Oznaczyliśmy Właściciela jako bg-label-secondary)
|
||||
if (!td.classList.contains('bg-label-secondary')) {
|
||||
td.style.cursor = 'pointer';
|
||||
td.addEventListener('click', function (e) {
|
||||
if (e.target.tagName !== 'INPUT') {
|
||||
const checkbox = this.querySelector('.form-check-input');
|
||||
// Zmieniamy tylko jeśli checkbox nie jest zablokowany (disabled)
|
||||
if (checkbox && !checkbox.disabled) {
|
||||
checkbox.checked = !checkbox.checked;
|
||||
checkbox.dispatchEvent(new Event('change'));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Sprawdzanie czy w komórce jest Główny Włącznik, aby odciąć resztę w dół
|
||||
const accessCheckbox = td.querySelector('.form-check-input.global-access-checkbox');
|
||||
if (accessCheckbox) {
|
||||
accessCheckbox.addEventListener('change', function () {
|
||||
toggleColumnAccess(td.cellIndex, this.checked);
|
||||
});
|
||||
|
||||
// Wymuś stan po wczytaniu strony, jeśli aplikacja jest odznaczona (np. marketing)
|
||||
if (!accessCheckbox.checked) {
|
||||
toggleColumnAccess(td.cellIndex, false);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Funkcja blokowania/odblokowania całej kolumny
|
||||
function toggleColumnAccess(colIndex, isEnabled) {
|
||||
const allRows = document.querySelectorAll('.acl-table tbody tr');
|
||||
allRows.forEach(row => {
|
||||
// Pomijamy szare wiersze podziału oraz sam wiersz głównego włącznika
|
||||
if (!row.classList.contains('table-secondary') && !row.classList.contains('global-access-row') && row.cells.length > colIndex) {
|
||||
const cell = row.cells[colIndex];
|
||||
const checkbox = cell.querySelector('.form-check-input');
|
||||
|
||||
if (checkbox && !cell.classList.contains('bg-label-secondary')) {
|
||||
if (!isEnabled) {
|
||||
checkbox.checked = false;
|
||||
checkbox.disabled = true;
|
||||
cell.style.opacity = '0.4';
|
||||
cell.style.pointerEvents = 'none'; // cała komórka staje się nieklikalna
|
||||
} else {
|
||||
checkbox.disabled = false;
|
||||
cell.style.opacity = '1';
|
||||
cell.style.pointerEvents = 'auto'; // przywraca klikalność
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Logika wyświetlania/ukrywania kolumn grupowych
|
||||
const maxColumns = 5; // Mamy w sumie 1(nazwa) + 4 (grupy). Limit 5 grup oznacza max 6 kolumn tabeli. Zostawiłem zmienną na przyszłość.
|
||||
const columnToggles = document.querySelectorAll('.column-toggle:not(:disabled)');
|
||||
|
||||
columnToggles.forEach(toggle => {
|
||||
toggle.addEventListener('change', function () {
|
||||
const checkedCount = document.querySelectorAll('.column-toggle:checked').length;
|
||||
|
||||
// Zabezpieczenie limitu 5 (wliczając właściciela)
|
||||
if (this.checked && checkedCount > 5) {
|
||||
this.checked = false;
|
||||
alert('Możesz wybrać maksymalnie 5 grup do jednoczesnego wyświetlania.');
|
||||
return;
|
||||
}
|
||||
|
||||
const colIndex = parseInt(this.value);
|
||||
const isVisible = this.checked;
|
||||
|
||||
// Ukrywamy nagłówek
|
||||
const theadRow = document.querySelector('.acl-table thead tr');
|
||||
if (theadRow && theadRow.cells[colIndex]) {
|
||||
theadRow.cells[colIndex].style.display = isVisible ? '' : 'none';
|
||||
}
|
||||
|
||||
// Ukrywamy komórki w ciele tabeli
|
||||
const tbodyRows = document.querySelectorAll('.acl-table tbody tr');
|
||||
tbodyRows.forEach(row => {
|
||||
// Wiersze sekcji (szare) mają colspan=5, trzeba go dynamicznie zaktualizować
|
||||
if (row.classList.contains('table-secondary')) {
|
||||
const th = row.querySelector('td');
|
||||
// Liczymy widoczne kolumny (nagłówek)
|
||||
const visibleCols = document.querySelectorAll('.acl-table thead th:not([style*="display: none"])').length;
|
||||
if (th) th.setAttribute('colspan', visibleCols || 2);
|
||||
} else if (row.cells[colIndex]) {
|
||||
row.cells[colIndex].style.display = isVisible ? '' : 'none';
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
192
prototype/company/app-permissions.php
Normal file
192
prototype/company/app-permissions.php
Normal file
@@ -0,0 +1,192 @@
|
||||
<?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> Uprawnienia
|
||||
</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 justify-content-center align-items-center">
|
||||
<i class="bx bx-shield-quarter text-primary fs-3"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-dark mb-1 fw-bold">Uprawnienia w ekosystemie magico</h5>
|
||||
<p class="mb-0 text-dark small">
|
||||
Poniżej widzisz wszystkie aktywne aplikacje Twojej firmy. Ze względu na budowę systemu, każda z
|
||||
aplikacji
|
||||
operuje własnym, unikalnym zestawem uprawnień szczegółowych (Matrix ACL). Wybierz aplikację z
|
||||
listy, aby zarządzać szczegółowym poziomem dostępu poszczególnych <a href="app-groups.php"
|
||||
class="fw-bold">Grup</a> do jej poszczególnych modułów.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Układ 4 kart z Aplikacjami -->
|
||||
<div class="row g-4 mb-4">
|
||||
|
||||
<!-- Karta 1: invoice.magico -->
|
||||
<div class="col-md-6 col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-primary rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-receipt fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">invoice.magico</h5>
|
||||
<span class="badge bg-label-success ms-auto">Aktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4">
|
||||
Moduł obsługi księgowej i wystawiania dokumentów sprzedaży. Zarządzanie fakturami VAT,
|
||||
proformami oraz bazą kontrahentów.
|
||||
</p>
|
||||
|
||||
<div class="mb-4">
|
||||
<h6 class="text-muted fw-normal small text-uppercase mb-2">Grupy posiadające dostęp (dowolny):
|
||||
</h6>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<span class="badge bg-label-secondary">Właściciel</span>
|
||||
<span class="badge bg-label-secondary">Kadra Kierownicza</span>
|
||||
<span class="badge bg-label-secondary">Dział Obsługi Klienta</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent text-end">
|
||||
<a href="app-permissions-acl.php" class="btn btn-primary w-100">
|
||||
Zarządzaj uprawnieniami ACL <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 2: sync.magico -->
|
||||
<div class="col-md-6 col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-info rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-refresh fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">sync.magico</h5>
|
||||
<span class="badge bg-label-success ms-auto">Aktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4">
|
||||
Centrum integracji e-commerce. Kontrola wymiany danych produktowych i magazynowych z
|
||||
zewnętrznymi platformami (BaseLinker, Allegro).
|
||||
</p>
|
||||
|
||||
<div class="mb-4">
|
||||
<h6 class="text-muted fw-normal small text-uppercase mb-2">Grupy posiadające dostęp (dowolny):
|
||||
</h6>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<span class="badge bg-label-secondary">Właściciel</span>
|
||||
<span class="badge bg-label-secondary">Kadra Kierownicza</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent text-end">
|
||||
<a href="#" class="btn btn-outline-primary w-100">
|
||||
Zarządzaj uprawnieniami ACL <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 3: helpdesk.magico -->
|
||||
<div class="col-md-6 col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-warning rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-support fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">helpdesk.magico</h5>
|
||||
<span class="badge bg-label-success ms-auto">Aktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4">
|
||||
System zarządzania zgłoszeniami i wsparcia klienta. Śledzenie statusu ticketów, komunikacja oraz
|
||||
baza wiedzy (BOK).
|
||||
</p>
|
||||
|
||||
<div class="mb-4">
|
||||
<h6 class="text-muted fw-normal small text-uppercase mb-2">Grupy posiadające dostęp (dowolny):
|
||||
</h6>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<span class="badge bg-label-secondary">Właściciel</span>
|
||||
<span class="badge bg-label-secondary">Dział Obsługi Klienta</span>
|
||||
<span class="badge bg-label-secondary">Menadżer</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent text-end">
|
||||
<a href="#" class="btn btn-outline-primary w-100">
|
||||
Zarządzaj uprawnieniami ACL <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 4: employee.magico -->
|
||||
<div class="col-md-6 col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-success rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-group fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">employee.magico</h5>
|
||||
<span class="badge bg-label-secondary ms-auto">Nieaktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4">
|
||||
Dedykowany portal pracowniczy (HR). Zarządzanie urlopami, wnioskami pracowniczymi, ewidencją
|
||||
czasu pracy oraz komunikacją wewnętrzną firmy.
|
||||
</p>
|
||||
|
||||
<div class="mb-4">
|
||||
<h6 class="text-muted fw-normal small text-uppercase mb-2">Grupy posiadające dostęp (dowolny):
|
||||
</h6>
|
||||
<p class="text-muted small fst-italic mb-0">Ta usługa nie jest włączona w Twoim pakiecie,
|
||||
uprawnienia są uśpione.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent text-end">
|
||||
<button class="btn btn-outline-secondary w-100" disabled>
|
||||
Aplikacja jest nieaktywna
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// ...
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
214
prototype/company/app-services-detail.php
Normal file
214
prototype/company/app-services-detail.php
Normal file
@@ -0,0 +1,214 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
include '../../header-invoice.php';
|
||||
|
||||
// Pobieranie przekazanej aplikacji, tu symulujemy, że otwieramy "employee.magico" jako system nieaktywny
|
||||
$appId = isset($_GET['id']) ? $_GET['id'] : 'employee';
|
||||
|
||||
// Symulowana baza dla demonstracji widoku
|
||||
$appData = [
|
||||
'title' => 'employee.magico',
|
||||
'badge' => 'Nieaktywna',
|
||||
'badgeClass' => 'bg-label-secondary',
|
||||
'icon' => 'bx-group',
|
||||
'desc' => 'Kompleksowy portal HR (Self-Service) dla pracowników Twojej firmy.',
|
||||
'isActive' => false
|
||||
];
|
||||
?>
|
||||
|
||||
<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 firmą / <a href="app-services.php"
|
||||
class="text-muted text-decoration-none">Usługi i aplikacje</a> /</span>
|
||||
<?php echo $appData['title']; ?>
|
||||
</h4>
|
||||
|
||||
<!-- Nagłówek i status (Hero Banner) -->
|
||||
<div class="card mb-4 border-0 shadow-sm" style="background: linear-gradient(to right, #ffffff, #f8f9fa);">
|
||||
<div class="card-body p-5">
|
||||
<div class="row align-items-center text-center text-md-start">
|
||||
<div class="col-md-8 mb-4 mb-md-0">
|
||||
<div class="d-flex flex-column flex-md-row align-items-center mb-3">
|
||||
<div
|
||||
class="avatar avatar-xl bg-label-secondary rounded p-3 me-md-4 mb-3 mb-md-0 d-flex align-items-center justify-content-center">
|
||||
<i class="bx <?php echo $appData['icon']; ?> mb-0" style="font-size: 2.5rem;"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center justify-content-center justify-content-md-start mb-1">
|
||||
<h2 class="mb-0 fw-bold me-3 text-dark">
|
||||
<?php echo $appData['title']; ?>
|
||||
</h2>
|
||||
<span class="badge <?php echo $appData['badgeClass']; ?> px-3 py-2 fs-6">
|
||||
<?php echo $appData['badge']; ?>
|
||||
</span>
|
||||
</div>
|
||||
<p class="text-muted fs-5 mb-0">
|
||||
<?php echo $appData['desc']; ?>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Przycisk Aktywacji -->
|
||||
<div class="col-md-4 text-md-end">
|
||||
<?php if (!$appData['isActive']): ?>
|
||||
<div class="border rounded p-4 text-center bg-white shadow-sm">
|
||||
<p class="mb-3 fw-semibold text-body">Aplikacja pozostaje uśpiona. Aby z niej korzystać,
|
||||
wymagana jest aktywacja licencji.</p>
|
||||
<button type="button" class="btn btn-primary btn-lg w-100" data-bs-toggle="modal"
|
||||
data-bs-target="#activationModal">
|
||||
<i class="bx bx-power-off me-2"></i> Aktywuj moduł
|
||||
</button>
|
||||
<small class="text-muted d-block mt-2">Bez żadnych umów długoterminowych. Płatność doliczana do
|
||||
faktury cyklicznej.</small>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<!-- Widok dla aktywnej np invoice.magico -->
|
||||
<button class="btn btn-outline-danger btn-lg">
|
||||
<i class="bx bx-power-off me-2"></i> Wyłącz moduł
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Prezentacja (Marketing / Zrzuty ekranu) -->
|
||||
<div class="row mb-5">
|
||||
<div class="col-12 text-center mb-4">
|
||||
<h3 class="fw-bold mb-2">Zapomnij o papierowych wnioskach urlopowych</h3>
|
||||
<p class="text-muted fs-5">Zautomatyzuj procesy kadrowe. Zyskaj jedno, spójne środowisko dla swojego
|
||||
zespołu.</p>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-4">
|
||||
<div class="card h-100 shadow-none bg-transparent">
|
||||
<img class="card-img-top rounded-3 shadow-sm border"
|
||||
src="https://placehold.co/800x500/ebeef0/696cff?text=Ekran+Wniosk%C3%B3w+Pracowniczych&font=roboto"
|
||||
alt="Wnioski Urlopowe Screenshot">
|
||||
<div class="card-body px-0">
|
||||
<h5 class="card-title fw-bold"><i class="bx bx-check-circle text-primary me-2"></i>Samoobsługa
|
||||
pracownika (Self-Service)</h5>
|
||||
<p class="card-text text-muted">Pracownicy samodzielnie zgłaszają wnioski urlopowe, delegacje oraz
|
||||
odbiory nadgodzin z poziomu swojego konta. Przełożeni jednym kliknięciem akceptują prośby w
|
||||
systemie.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-4">
|
||||
<div class="card h-100 shadow-none bg-transparent">
|
||||
<img class="card-img-top rounded-3 shadow-sm border"
|
||||
src="https://placehold.co/800x500/ebeef0/696cff?text=Ewidencja+Czasu+Pracy+(ECP)&font=roboto"
|
||||
alt="Ewidencja Czasu Pracy Screenshot">
|
||||
<div class="card-body px-0">
|
||||
<h5 class="card-title fw-bold"><i class="bx bx-pie-chart-alt text-primary me-2"></i>Ewidencja i
|
||||
Rozliczanie (ECP)</h5>
|
||||
<p class="card-text text-muted">Rejestruj wejścia, wyjścia i przerwy za pomocą elektronicznych kart
|
||||
(tzw. "odbijanie karty"). Raportowanie bezpośrednio na poczet rozliczeń kadrowo-płacowych.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Cennik -->
|
||||
<div class="card mb-4 bg-label-secondary bg-opacity-10 border-0">
|
||||
<div class="card-body p-4 p-md-5">
|
||||
<div class="text-center mb-4">
|
||||
<h4 class="fw-bold"><i class="bx bx-wallet me-2 text-primary"></i>Przejrzysty model cenowy</h4>
|
||||
<p class="text-muted">Płacisz tylko wtedy, kiedy faktycznie potrzebujesz tej usługi dla swojego zespołu.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8 col-lg-5">
|
||||
<div class="card shadow-sm border-primary border">
|
||||
<div class="card-body text-center p-5">
|
||||
<span class="badge bg-label-primary px-3 py-2 fs-6 mb-4 rounded-pill">Model Per Seat
|
||||
(Zależny od załogi)</span>
|
||||
<h1 class="display-3 fw-bold text-dark mb-1">10 <span
|
||||
class="fs-4 fw-normal text-muted">PLN</span></h1>
|
||||
<p class="text-muted fw-semibold mb-4">Miesięcznie, <span
|
||||
class="text-primary text-decoration-underline">za każdego przypisanego
|
||||
pracownika</span></p>
|
||||
|
||||
<ul class="list-unstyled text-start mb-0">
|
||||
<li class="mb-3 d-flex"><i class="bx bx-check text-primary me-2 fs-5 mt-1"></i>
|
||||
<span>Możliwość przypisania konkretnych działów. Brak opłaty za uśpione
|
||||
konta.</span></li>
|
||||
<li class="mb-3 d-flex"><i class="bx bx-check text-primary me-2 fs-5 mt-1"></i>
|
||||
<span>Pełny dostęp do aplikacji mobilnej.</span></li>
|
||||
<li class="mb-3 d-flex"><i class="bx bx-check text-primary me-2 fs-5 mt-1"></i>
|
||||
<span>Zintegrowana wysyłka powiadomień na e-mail i push.</span></li>
|
||||
<li class="d-flex"><i class="bx bx-check text-primary me-2 fs-5 mt-1"></i> <span>Moduł
|
||||
kadrowy dla zewnętrznej księgowości (gratis).</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Modal Potwierdzający Aktywację -->
|
||||
<div class="modal fade" id="activationModal" tabindex="-1" aria-hidden="true">
|
||||
<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 fw-bold" id="exampleModalLabel1">Potwierdzenie aktywacji modułu</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body py-4">
|
||||
<div class="d-flex align-items-center mb-4">
|
||||
<div
|
||||
class="avatar avatar-md bg-label-warning rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-error text-warning fs-3"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="mb-0 fw-bold">Uwaga o zmianie abonamentu</h6>
|
||||
<small class="text-muted">Aktywacja usług dodatkowych wpływa na wysokość opłat
|
||||
subskrypcyjnych.</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>Czy na pewno chcesz aktywować wybraną usługę <strong>
|
||||
<?php echo $appData['title']; ?>
|
||||
</strong> na koncie firmy?</p>
|
||||
|
||||
<div class="alert alert-secondary p-3 mb-0">
|
||||
<p class="mb-1 fw-bold"><i class="bx bx-info-circle me-1"></i> Informacje rozliczeniowe:</p>
|
||||
<ul class="mb-0 ps-3 small">
|
||||
<li>Koszty usługi to 10 PLN miesięcznie za każdego użytkownika podpiętego testowo pod tę
|
||||
strukturę.</li>
|
||||
<li>Kwota zostanie automatycznie doliczona do najbliższej zbiorczej faktury abonamentowej (cykl
|
||||
30-dniowy).</li>
|
||||
<li>Aplikację możesz w każdej chwili ponownie wyłączyć powracając do tego widoku.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer border-top pt-3">
|
||||
<button type="button" class="btn btn-label-secondary" data-bs-dismiss="modal">Zrezygnuj</button>
|
||||
<button type="button" class="btn btn-primary"
|
||||
onclick="alert('Moduł został aktywowany! Symulacja zakończenia procesu.'); bootstrap.Modal.getInstance(document.getElementById('activationModal')).hide();">Akceptuję,
|
||||
zaktualizuj usługi</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// ...
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
218
prototype/company/app-services.php
Normal file
218
prototype/company/app-services.php
Normal file
@@ -0,0 +1,218 @@
|
||||
<?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 firmą /</span> Usługi i aplikacje
|
||||
</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 justify-content-center align-items-center">
|
||||
<i class="bx bx-grid-alt text-primary fs-3"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-dark mb-1 fw-bold">Twój ekosystem magico</h5>
|
||||
<p class="mb-0 text-dark small">
|
||||
Poniżej znajduje się lista wszystkich modułów i aplikacji dostępnych w ramach naszego systemu.
|
||||
Widzisz tutaj zarówno aplikacje, z których aktualnie korzystasz, jak i te, które możesz w każdej
|
||||
chwili aktywować.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Układ 3 kart (col-md-4) z Aplikacjami -->
|
||||
<div class="row g-4 mb-4">
|
||||
|
||||
<!-- Karta 1: invoice.magico -->
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center justify-content-between mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-primary rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-receipt fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">invoice.magico</h5>
|
||||
</div>
|
||||
<span class="badge bg-label-success">Aktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4 flex-grow-1">
|
||||
Moduł obsługi księgowej i wystawiania dokumentów sprzedaży. Zarządzanie fakturami VAT,
|
||||
proformami oraz bazą kontrahentów.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-2 mt-auto">
|
||||
<div class="d-flex align-items-center text-muted small mb-2">
|
||||
<i class="bx bx-check text-success me-2"></i> KSeF Ready
|
||||
</div>
|
||||
<div class="d-flex align-items-center text-muted small mb-3">
|
||||
<i class="bx bx-check text-success me-2"></i> Automatyzacja faktur
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent pt-3 pb-3">
|
||||
<a href="app-services-detail.php?id=invoice" class="btn btn-outline-primary w-100">
|
||||
Zarządzaj aplikacją <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 2: sync.magico -->
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card h-100">
|
||||
<div class="card-body d-flex flex-column">
|
||||
<div class="d-flex align-items-center justify-content-between mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-info rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-refresh fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">sync.magico</h5>
|
||||
</div>
|
||||
<span class="badge bg-label-success">Aktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4 flex-grow-1">
|
||||
Centrum integracji e-commerce. Kontrola wymiany danych produktowych i magazynowych z
|
||||
zewnętrznymi platformami.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-2 mt-auto">
|
||||
<div class="d-flex align-items-center text-muted small mb-2">
|
||||
<i class="bx bx-check text-success me-2"></i> Integracja z BaseLinker
|
||||
</div>
|
||||
<div class="d-flex align-items-center text-muted small mb-3">
|
||||
<i class="bx bx-check text-success me-2"></i> Dwukierunkowa synch.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent pt-3 pb-3">
|
||||
<a href="app-services-detail.php?id=sync" class="btn btn-outline-primary w-100">
|
||||
Zarządzaj aplikacją <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 3: helpdesk.magico -->
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card h-100">
|
||||
<div class="card-body d-flex flex-column">
|
||||
<div class="d-flex align-items-center justify-content-between mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-warning rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-support fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold">helpdesk.magico</h5>
|
||||
</div>
|
||||
<span class="badge bg-label-success">Aktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4 flex-grow-1">
|
||||
System zarządzania zgłoszeniami i wsparcia klienta. Śledzenie statusu ticketów, system ticketowy
|
||||
oraz centrum BOK.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-2 mt-auto">
|
||||
<div class="d-flex align-items-center text-muted small mb-2">
|
||||
<i class="bx bx-check text-success me-2"></i> Skrzynki e-mail (IMAP)
|
||||
</div>
|
||||
<div class="d-flex align-items-center text-muted small mb-3">
|
||||
<i class="bx bx-check text-success me-2"></i> Szablony odpowiedzi
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer border-top bg-transparent pt-3 pb-3">
|
||||
<a href="app-services-detail.php?id=helpdesk" class="btn btn-outline-primary w-100">
|
||||
Zarządzaj aplikacją <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 4: employee.magico -->
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card h-100 border border-secondary shadow-none">
|
||||
<div class="card-body d-flex flex-column">
|
||||
<div class="d-flex align-items-center justify-content-between mb-3">
|
||||
<div class="d-flex align-items-center opacity-75">
|
||||
<div
|
||||
class="avatar avatar-sm bg-label-secondary rounded p-2 me-3 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-group fs-4"></i>
|
||||
</div>
|
||||
<h5 class="mb-0 fw-bold text-muted">employee.magico</h5>
|
||||
</div>
|
||||
<span class="badge bg-label-secondary">Nieaktywna</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted small mb-4 flex-grow-1">
|
||||
Dedykowany portal pracowniczy (HR). Zarządzanie urlopami, wnioskami pracowniczymi oraz ewidencją
|
||||
czasu pracy.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-2 mt-auto">
|
||||
<div class="d-flex align-items-center text-muted small mb-2 opacity-50">
|
||||
<i class="bx bx-check me-2"></i> Portal pracownika (Self-Service)
|
||||
</div>
|
||||
<div class="d-flex align-items-center text-muted small mb-3 opacity-50">
|
||||
<i class="bx bx-check me-2"></i> Obieg wniosków urlopowych
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Przycisk z akcentem na włączenie -->
|
||||
<div class="card-footer border-top bg-secondary bg-opacity-10 pt-3 pb-3">
|
||||
<a href="app-services-detail.php?id=employee" class="btn btn-primary w-100">
|
||||
Dowiedz się więcej <i class="bx bx-right-arrow-alt ms-1"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 5: pos.magico (zwiastun nowej aplikacji) -->
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card h-100 border border-dashed border-secondary shadow-none bg-lighter">
|
||||
<div class="card-body d-flex flex-column justify-content-center align-items-center text-center">
|
||||
<div
|
||||
class="avatar avatar-md bg-label-secondary rounded p-2 mb-3 mt-4 d-flex align-items-center justify-content-center">
|
||||
<i class="bx bx-store-alt fs-2 text-muted"></i>
|
||||
</div>
|
||||
<h5 class="mb-1 fw-bold text-muted">pos.magico</h5>
|
||||
<span class="badge bg-label-dark mb-3">Wkrótce (Q3 2026)</span>
|
||||
|
||||
<p class="text-muted small mb-4">
|
||||
System kasowy (Point of Sale) dla sklepów stacjonarnych. Integracja z terminalami płatniczymi i
|
||||
drukarkami fiskalnymi.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// ...
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
242
prototype/company/app-team.php
Normal file
242
prototype/company/app-team.php
Normal file
@@ -0,0 +1,242 @@
|
||||
<?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>
|
||||
296
prototype/company/index.php
Normal file
296
prototype/company/index.php
Normal file
@@ -0,0 +1,296 @@
|
||||
<?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">
|
||||
Zarządzanie firmą <span class="text-muted fw-light">/ Kokpit</span>
|
||||
</h4>
|
||||
|
||||
<!-- Baner Informacyjny -->
|
||||
<div class="row mb-4">
|
||||
<div class="col-12">
|
||||
<div class="card bg-primary text-white text-center text-md-start"
|
||||
style="background: linear-gradient(135deg, #696cff 0%, #a481ff 100%);">
|
||||
<div
|
||||
class="card-body d-flex flex-column flex-md-row justify-content-between align-items-center py-4 px-5">
|
||||
<div class="mb-3 mb-md-0 d-flex gap-4 align-items-center">
|
||||
<div
|
||||
class="avatar avatar-lg bg-white rounded flex-shrink-0 d-flex align-items-center justify-content-center shadow-sm">
|
||||
<i class="bx bx-buildings text-primary fs-2"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-white fw-bold mb-1">Centrum Dowodzenia Twojej Firmy</h5>
|
||||
<p class="mb-0 text-white-50" style="max-width: 600px;">
|
||||
Aplikacja <strong>company.magico</strong> to miejsce, w którym kontrolujesz cały swój
|
||||
ekosystem. Od konfiguracji uprawnień i zapraszania współpracowników, po zarządzanie
|
||||
rozliczeniami, modułami i danymi fakturowymi firmy.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<a href="app-company-info.php" class="btn btn-white text-primary shadow-sm fw-bold">
|
||||
<i class="bx bx-cog me-2"></i> Konfiguracja danych
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 1. Sekcja KPI (Karty informacyjne) -->
|
||||
<div class="row g-4 mb-4">
|
||||
<!-- Aktywne aplikacje -->
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card h-100 shadow-sm border-0">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-muted text-uppercase small fw-bold" style="letter-spacing: 0.5px;">Aktywne
|
||||
moduły</span>
|
||||
<div class="d-flex align-items-end mt-2">
|
||||
<h3 class="mb-0 me-2 text-dark">3 <span class="fs-6 fw-normal text-muted">/ 5</span>
|
||||
</h3>
|
||||
</div>
|
||||
<small class="text-success"><i class="bx bx-check-circle"></i> Ekosystem działa
|
||||
poprawnie</small>
|
||||
</div>
|
||||
<span class="badge bg-label-primary rounded p-2">
|
||||
<i class="bx bx-grid-alt fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Wielkość zespołu -->
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card h-100 shadow-sm border-0">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-muted text-uppercase small fw-bold" style="letter-spacing: 0.5px;">Twój
|
||||
zespół</span>
|
||||
<div class="d-flex align-items-end mt-2">
|
||||
<h3 class="mb-0 me-2 text-dark">14</h3>
|
||||
</div>
|
||||
<small class="text-warning"><i class="bx bx-time"></i> 2 zaproszenia w toku</small>
|
||||
</div>
|
||||
<span class="badge bg-label-info rounded p-2">
|
||||
<i class="bx bx-group fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Najbliższa płatność -->
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card h-100 shadow-sm border-0 border-start border-danger border-3">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-muted text-uppercase small fw-bold"
|
||||
style="letter-spacing: 0.5px;">Najbliższa płatność</span>
|
||||
<div class="d-flex align-items-end mt-2">
|
||||
<h3 class="mb-0 me-2 text-danger">365 zł</h3>
|
||||
</div>
|
||||
<small class="text-danger fw-semibold"><i class="bx bx-error-circle"></i> Płatność
|
||||
opóźniona</small>
|
||||
</div>
|
||||
<span class="badge bg-label-danger rounded p-2">
|
||||
<i class="bx bx-credit-card fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Zużycie przestrzeni -->
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card h-100 shadow-sm border-0">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-muted text-uppercase small fw-bold"
|
||||
style="letter-spacing: 0.5px;">Składnica plików</span>
|
||||
<div class="d-flex align-items-end mt-2">
|
||||
<h3 class="mb-0 me-2 text-dark">0.04 <span class="fs-6 fw-normal text-muted">GB</span>
|
||||
</h3>
|
||||
</div>
|
||||
<small class="text-muted"><i class="bx bx-data"></i> Wykorzystano 1% z limitu</small>
|
||||
</div>
|
||||
<span class="badge bg-label-success rounded p-2">
|
||||
<i class="bx bx-hdd fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Główny układ dwukolumnowy -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Lewa kolumna: Dziennik Aktywności (Timeline) -->
|
||||
<div class="col-xl-8 mb-4 col-md-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-header d-flex justify-content-between align-items-center mb-3 border-bottom">
|
||||
<h5 class="card-title m-0 me-2"><i class="bx bx-list-ol text-primary me-2"></i>Dziennik aktywności w
|
||||
środowisku</h5>
|
||||
<div class="dropdown">
|
||||
<button class="btn p-0" type="button" id="timelineDropdown" data-bs-toggle="dropdown"
|
||||
aria-haspopup="true" aria-expanded="false">
|
||||
<i class="bx bx-dots-vertical-rounded"></i>
|
||||
</button>
|
||||
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="timelineDropdown">
|
||||
<a class="dropdown-item" href="javascript:void(0);">Cała historia</a>
|
||||
<a class="dropdown-item" href="javascript:void(0);">Pobierz raport (.csv)</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body pt-4 mb-2 pb-0">
|
||||
<ul class="timeline pb-0 mb-0">
|
||||
|
||||
<!-- Element 1 -->
|
||||
<li class="timeline-item timeline-item-transparent border-primary">
|
||||
<span class="timeline-indicator border-0 shadow-none bg-white">
|
||||
<span class="timeline-point timeline-point-primary position-static m-0"></span>
|
||||
</span>
|
||||
<div class="timeline-event">
|
||||
<div class="timeline-header">
|
||||
<h6 class="mb-0">Zaktualizowano uprawnienia grupy</h6>
|
||||
<small class="text-body-secondary">Dzisiaj, 14:30</small>
|
||||
</div>
|
||||
<p class="mt-3">Zmieniono reguły dostępu dla grupy <span
|
||||
class="fw-semibold text-dark">"Kadra kierownicza"</span> w ramach aplikacji
|
||||
<span class="badge bg-label-primary ms-1">invoice.magico</span>.
|
||||
</p>
|
||||
<div class="d-flex align-items-center mt-3">
|
||||
<div class="avatar avatar-xs me-2">
|
||||
<img src="../../assets/img/avatars/1.png" alt="Avatar" class="rounded-circle">
|
||||
</div>
|
||||
<span class="text-dark small fw-semibold">Jan Kowalski (Administrator)</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Element 2 -->
|
||||
<li class="timeline-item timeline-item-transparent border-primary">
|
||||
<span class="timeline-indicator border-0 shadow-none bg-white">
|
||||
<span class="timeline-point timeline-point-primary position-static m-0"></span>
|
||||
</span>
|
||||
<div class="timeline-event">
|
||||
<div class="timeline-header">
|
||||
<h6 class="mb-0">Nowy członek zespołu</h6>
|
||||
<small class="text-body-secondary">Wczoraj, 09:15</small>
|
||||
</div>
|
||||
<p class="mt-3 mb-3">Anna Nowak zaakceptowała Twoje zaproszenie e-mail i założyła
|
||||
konto w portalu pracowniczym.</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Element 3 -->
|
||||
<li class="timeline-item timeline-item-transparent border-primary">
|
||||
<span class="timeline-indicator border-0 shadow-none bg-white">
|
||||
<span class="timeline-point timeline-point-primary position-static m-0"></span>
|
||||
</span>
|
||||
<div class="timeline-event">
|
||||
<div class="timeline-header">
|
||||
<h6 class="mb-0">Moduł helpdesk aktywny</h6>
|
||||
<small class="text-body-secondary">Poniedziałek, 12:00</small>
|
||||
</div>
|
||||
<p class="mt-3 mb-3">Rozpoczęto naliczanie opłat za nową aplikację <span
|
||||
class="badge bg-label-warning ms-1">helpdesk.magico</span>. Dostęp przyznano dla
|
||||
4 stanowisk.</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Element 4 -->
|
||||
<li class="timeline-item timeline-item-transparent border-transparent pb-0">
|
||||
<span class="timeline-indicator border-0 shadow-none bg-white">
|
||||
<span class="timeline-point timeline-point-primary position-static m-0"></span>
|
||||
</span>
|
||||
<div class="timeline-event pb-0">
|
||||
<div class="timeline-header">
|
||||
<h6 class="mb-0">Wygenerowano nową fakturę VAT</h6>
|
||||
<small class="text-body-secondary">01.03.2026, 06:05</small>
|
||||
</div>
|
||||
<p class="mt-3 mb-0">System przygotował rozliczenie dokumentem <span
|
||||
class="fw-semibold text-primary">5/05/2025</span> za kolejny okres cykliczny.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="card-footer border-top bg-transparent text-center">
|
||||
<a href="javascript:void(0)" class="text-primary btn-link">Załaduj starsze wydarzenia <i
|
||||
class="bx bx-chevron-down"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Prawa kolumna: Skróty i Nowości -->
|
||||
<div class="col-xl-4 col-md-12">
|
||||
|
||||
<!-- Szybkie akcje -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-header border-bottom">
|
||||
<h6 class="m-0 text-uppercase fw-bold text-muted" style="letter-spacing: 0.5px;">Szybkie akcje</h6>
|
||||
</div>
|
||||
<div class="card-body pt-3 pb-3">
|
||||
<div class="d-grid gap-2">
|
||||
<a href="app-team.php"
|
||||
class="btn btn-outline-secondary d-flex justify-content-between align-items-center text-start">
|
||||
<span><i class="bx bx-user-plus me-2 text-primary"></i> Zaproś pracownika</span>
|
||||
<i class="bx bx-chevron-right text-muted"></i>
|
||||
</a>
|
||||
<a href="app-billing.php"
|
||||
class="btn btn-outline-secondary d-flex justify-content-between align-items-center text-start">
|
||||
<span><i class="bx bx-credit-card mx-0 me-2 text-primary"></i> Twoje płatności i
|
||||
faktury</span>
|
||||
<i class="bx bx-chevron-right text-muted"></i>
|
||||
</a>
|
||||
<a href="app-services.php"
|
||||
class="btn btn-outline-secondary d-flex justify-content-between align-items-center text-start">
|
||||
<span><i class="bx bx-grid-alt me-2 text-primary"></i> Przeglądaj aplikacje</span>
|
||||
<i class="bx bx-chevron-right text-muted"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Magico News / Baner informacyjny -->
|
||||
<div class="card bg-primary text-white text-center rounded shadow-sm border-0"
|
||||
style="background: linear-gradient(135deg, #696cff 0%, #a481ff 100%);">
|
||||
<div class="card-body py-5">
|
||||
<div class="badge bg-white text-primary mb-3 rounded-pill px-3 py-2 fw-bold shadow-sm">magico
|
||||
roadmap 2026</div>
|
||||
<h5 class="text-white fw-bold mt-2 mb-3">Integracja KSeF gotowa do uruchomienia</h5>
|
||||
<p class="text-white-50 mb-4 px-2">Zabezpiecz procesy fakturowania w swojej firmie przed nowymi
|
||||
regulacjami państwowymi jednym przyciskiem.</p>
|
||||
<a href="#" class="btn btn-white text-primary shadow-sm"><i class="bx bx-book-open me-2"></i>
|
||||
Przeczytaj instrukcję</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
73
prototype/company/menu.php
Normal file
73
prototype/company/menu.php
Normal file
@@ -0,0 +1,73 @@
|
||||
<?php
|
||||
$currentPage = basename($_SERVER['PHP_SELF']);
|
||||
?>
|
||||
<aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
|
||||
<div class="app-brand demo">
|
||||
<a href="index.php" class="app-brand-link">
|
||||
<span class="app-brand-text demo menu-text fw-bold ms-2">company.magico</span>
|
||||
</a>
|
||||
<a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
|
||||
<i class="bx bx-chevron-left bx-sm align-middle"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="menu-inner-shadow"></div>
|
||||
|
||||
<ul class="menu-inner py-1">
|
||||
|
||||
<!-- Zarządzanie firmą -->
|
||||
<li class="menu-header small text-uppercase">
|
||||
<span class="menu-header-text" data-i18n="Zarządzanie firmą">Zarządzanie firmą</span>
|
||||
</li>
|
||||
|
||||
<li class="menu-item <?php echo ($currentPage == 'index.php') ? 'active' : ''; ?>">
|
||||
<a href="index.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-home-circle"></i>
|
||||
<div class="text-truncate" data-i18n="Kokpit">Kokpit</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-services.php') ? 'active' : ''; ?>">
|
||||
<a href="app-services.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-grid-alt"></i>
|
||||
<div class="text-truncate" data-i18n="Usługi i aplikacje">Usługi i aplikacje</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-billing.php') ? 'active' : ''; ?>">
|
||||
<a href="app-billing.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-receipt"></i>
|
||||
<div class="text-truncate" data-i18n="Rozliczenia">Rozliczenia</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-company-info.php') ? 'active' : ''; ?>">
|
||||
<a href="app-company-info.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-buildings"></i>
|
||||
<div class="text-truncate" data-i18n="Informacje o firmie">Informacje o firmie</div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Zarządzanie zespołem -->
|
||||
<li class="menu-header small text-uppercase">
|
||||
<span class="menu-header-text" data-i18n="Zarządzanie zespołem">Zarządzanie zespołem</span>
|
||||
</li>
|
||||
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-team.php') ? 'active' : ''; ?>">
|
||||
<a href="app-team.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-group"></i>
|
||||
<div class="text-truncate" data-i18n="Zespół">Zespół</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-groups.php') ? 'active' : ''; ?>">
|
||||
<a href="app-groups.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-sitemap"></i>
|
||||
<div class="text-truncate" data-i18n="Grupy">Grupy uprawnień</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-permissions.php') ? 'active' : ''; ?>">
|
||||
<a href="app-permissions.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-shield-quarter"></i>
|
||||
<div class="text-truncate" data-i18n="Uprawnienia">Uprawnienia</div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</aside>
|
||||
20
prototype/invoice/app-contractors-list.php
Normal file
20
prototype/invoice/app-contractors-list.php
Normal file
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y d-flex flex-column justify-content-center">
|
||||
<div class="card p-0 mb-4 h-100 mt-5 border-0 shadow-sm" style="min-height: 400px;">
|
||||
<div class="card-body d-flex flex-column justify-content-center align-items-center p-5 text-center">
|
||||
<h1 class="display-1 text-primary mb-4"><i class="bx bx-group"></i></h1>
|
||||
<h3 class="mb-2">Moduł "Kontrahenci" pojawi się wkrótce!</h3>
|
||||
<p class="text-muted mb-4 fs-5">
|
||||
Obecnie intensywnie pracujemy nad nowymi funkcjonalnościami dla tego modułu.<br>
|
||||
Zaglądaj tu regularnie, aby być na bieżąco z nowościami!
|
||||
</p>
|
||||
<a href="index.php" class="btn btn-primary btn-lg mt-3">Wróć na Kokpit</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -549,4 +549,4 @@ include '../../header-invoice.php';
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -899,4 +899,4 @@ include '../../header-invoice.php';
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -459,4 +459,4 @@ include '../../header-invoice.php';
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -531,4 +531,4 @@ include '../../header-invoice.php';
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -188,4 +188,4 @@ include '../../header-invoice.php';
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</script>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -1227,4 +1227,4 @@ include '../../header-invoice.php';
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
349
prototype/invoice/app-report-customers.php
Normal file
349
prototype/invoice/app-report-customers.php
Normal file
@@ -0,0 +1,349 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y">
|
||||
<!-- Vendors CSS dla Select2 i Flatpickr -->
|
||||
<link rel="stylesheet" href="../../assets/vendor/libs/select2/select2.css" />
|
||||
<link rel="stylesheet" href="../../assets/vendor/libs/flatpickr/flatpickr.css" />
|
||||
|
||||
<!-- Nagłówek i przyciski akcji -->
|
||||
<div
|
||||
class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center mb-4 gap-3">
|
||||
<div>
|
||||
<h4 class="fw-bold mb-1">
|
||||
<span class="text-muted fw-light">Raporty /</span> Ranking klientów
|
||||
</h4>
|
||||
<p class="text-muted mb-0">Zestawienie kontrahentów generujących największy przychód (Top Nabywców).</p>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<button class="btn btn-label-secondary">
|
||||
<i class="bx bx-export me-1"></i> Eksportuj CSV
|
||||
</button>
|
||||
<button class="btn btn-primary">
|
||||
<i class="bx bx-printer me-1"></i> Drukuj raport
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta filtrów -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-body">
|
||||
<form class="row g-3">
|
||||
<div class="col-12 col-md-4">
|
||||
<label class="form-label" for="reportDateRange">Zakres dat</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<span class="input-group-text"><i class="bx bx-calendar"></i></span>
|
||||
<input type="text" id="reportDateRange" class="form-control flatpickr-range"
|
||||
placeholder="Wybierz okres (od - do)" value="2026-01-01 do 2026-06-30" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-4">
|
||||
<label class="form-label" for="reportLimit">Zakres danych</label>
|
||||
<select id="reportLimit" class="form-select select2">
|
||||
<option value="10" selected>Top 10</option>
|
||||
<option value="50">Top 50</option>
|
||||
<option value="all">Wszyscy</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 col-md-4 d-flex align-items-end">
|
||||
<button type="button" class="btn btn-primary w-100 w-md-auto">
|
||||
<i class="bx bx-refresh me-1"></i> Generuj
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-4">
|
||||
<!-- Wykres - zajmuje prawą stronę na dużym ekranie, bądź górę -->
|
||||
<div class="col-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5 class="card-title m-0">Wykres Top 10 Odbiorców</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div id="customersReportChart" style="min-height: 400px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tabela -->
|
||||
<div class="col-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-header border-bottom">
|
||||
<h5 class="card-title m-0">Szczegółowe zestawienie</h5>
|
||||
</div>
|
||||
<div class="table-responsive text-nowrap">
|
||||
<table class="table table-hover table-sm align-middle">
|
||||
<thead class="table-light sticky-top">
|
||||
<tr>
|
||||
<th class="text-center" style="width: 50px;">Miejsce</th>
|
||||
<th>Kontrahent</th>
|
||||
<th class="text-center">Dokumenty</th>
|
||||
<th class="text-end">Kwota Netto</th>
|
||||
<th style="width: 120px;">Udział %</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div class="avatar avatar-sm mx-auto">
|
||||
<span
|
||||
class="avatar-initial rounded-circle bg-label-warning fw-bold fs-6">1</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="fw-medium text-heading">TechSolutions Sp. z o.o.</span>
|
||||
<small class="text-muted">NIP: 813-345-67-89</small>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">24</td>
|
||||
<td class="text-end fw-bold">64 500.00 zł</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-between align-items-center gap-2">
|
||||
<div class="progress w-100" style="height: 6px;">
|
||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 35.3%"
|
||||
aria-valuenow="35.3" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small class="fw-medium">35%</small>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div class="avatar avatar-sm mx-auto">
|
||||
<span class="avatar-initial rounded-circle bg-label-secondary fw-bold fs-6"
|
||||
style="color:#788393 !important;">2</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="fw-medium text-heading">Gmina Stalowa Wola</span>
|
||||
<small class="text-muted">NIP: 865-123-44-55</small>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">8</td>
|
||||
<td class="text-end fw-bold">42 800.00 zł</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-between align-items-center gap-2">
|
||||
<div class="progress w-100" style="height: 6px;">
|
||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 23.4%"
|
||||
aria-valuenow="23.4" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small class="fw-medium">23%</small>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div class="avatar avatar-sm mx-auto">
|
||||
<span class="avatar-initial rounded-circle bg-label-danger fw-bold fs-6"
|
||||
style="color:#ffb400 !important; background-color: #fff2d6 !important;">3</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="fw-medium text-heading">Kwiaciarnia "Róża"</span>
|
||||
<small class="text-muted">NIP: 734-111-22-33</small>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">45</td>
|
||||
<td class="text-end fw-bold">31 200.00 zł</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-between align-items-center gap-2">
|
||||
<div class="progress w-100" style="height: 6px;">
|
||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 17.1%"
|
||||
aria-valuenow="17.1" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small class="fw-medium">17%</small>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-center"><span class="text-muted fw-bold">4</span></td>
|
||||
<td>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="fw-medium text-heading">F.H.U Jan Kowalski</span>
|
||||
<small class="text-muted">NIP: 555-666-77-88</small>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">12</td>
|
||||
<td class="text-end fw-bold">18 500.00 zł</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-between align-items-center gap-2">
|
||||
<div class="progress w-100" style="height: 6px;">
|
||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 10.1%"
|
||||
aria-valuenow="10.1" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small class="fw-medium">10%</small>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-center"><span class="text-muted fw-bold">5</span></td>
|
||||
<td>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="fw-medium text-heading">Piekarnia "Złoty Kłos"</span>
|
||||
<small class="text-muted">NIP: 123-456-78-90</small>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">31</td>
|
||||
<td class="text-end fw-bold">15 400.00 zł</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-between align-items-center gap-2">
|
||||
<div class="progress w-100" style="height: 6px;">
|
||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 8.4%"
|
||||
aria-valuenow="8.4" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small class="fw-medium">8%</small>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-center"><span class="text-muted fw-bold">6</span></td>
|
||||
<td>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="fw-medium text-heading">Sklep Rybny "Posejdon"</span>
|
||||
<small class="text-muted">NIP: 987-654-32-10</small>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">4</td>
|
||||
<td class="text-end fw-bold">10 150.00 zł</td>
|
||||
<td>
|
||||
<div class="d-flex justify-content-between align-items-center gap-2">
|
||||
<div class="progress w-100" style="height: 6px;">
|
||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 5.6%"
|
||||
aria-valuenow="5.6" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small class="fw-medium">6%</small>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot class="table-light fw-bold">
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td class="text-center">124</td>
|
||||
<td class="text-end text-primary">182 550.00 zł</td>
|
||||
<td class="text-center">100%</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Vendors JS -->
|
||||
<script src="../../assets/vendor/libs/select2/select2.js"></script>
|
||||
<script src="../../assets/vendor/libs/flatpickr/flatpickr.js"></script>
|
||||
|
||||
<!-- ApexCharts scripts and local chart init -->
|
||||
<script src="../../assets/vendor/libs/apex-charts/apexcharts.js"></script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// 1. Inicjalizacja Flatpickr
|
||||
if (typeof flatpickr !== 'undefined') {
|
||||
const dateRangeEl = document.querySelector('.flatpickr-range');
|
||||
if (dateRangeEl) {
|
||||
flatpickr(dateRangeEl, {
|
||||
mode: 'range',
|
||||
dateFormat: 'Y-m-d',
|
||||
locale: 'pl'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 2. Inicjalizacja Select2
|
||||
if (typeof $ !== 'undefined' && $('.select2').length) {
|
||||
$('.select2').select2({
|
||||
minimumResultsForSearch: Infinity
|
||||
});
|
||||
}
|
||||
|
||||
// 3. Inicjalizacja Wykresu (Horizontal Bar)
|
||||
const chartEl = document.querySelector('#customersReportChart');
|
||||
if (chartEl && typeof ApexCharts !== 'undefined') {
|
||||
const chartConfig = {
|
||||
chart: {
|
||||
type: 'bar',
|
||||
height: 480, // Trochę wyższy by pomieścić wszystkie etykiety
|
||||
parentHeightOffset: 0,
|
||||
toolbar: { show: false }
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
borderRadius: 4,
|
||||
horizontal: true, // Kluczowe by wykres był poziomy
|
||||
barHeight: '50%',
|
||||
startingShape: 'rounded',
|
||||
endingShape: 'rounded'
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
textAnchor: 'start',
|
||||
style: {
|
||||
colors: ['#fff']
|
||||
},
|
||||
formatter: function (val, opt) {
|
||||
return val.toLocaleString('pl-PL') + " zł";
|
||||
},
|
||||
offsetX: 0,
|
||||
},
|
||||
series: [{
|
||||
name: 'Przychody netto',
|
||||
data: [64500, 42800, 31200, 18500, 15400, 10150]
|
||||
}],
|
||||
xaxis: {
|
||||
categories: [
|
||||
'TechSolutions Sp.', 'Gmina Stalowa Wola',
|
||||
'Kwiaciarnia "Róża"',
|
||||
'F.H.U Jan Kowalski',
|
||||
'Piekarnia Złoty Kłos',
|
||||
'Sklep Rybny Posejdon'
|
||||
],
|
||||
labels: {
|
||||
formatter: function (val) {
|
||||
return (val / 1000) + "k";
|
||||
},
|
||||
style: { colors: '#a1acb8', fontSize: '13px' }
|
||||
},
|
||||
axisBorder: { show: false },
|
||||
},
|
||||
yaxis: {
|
||||
labels: {
|
||||
style: { colors: '#566a7f', fontSize: '13px', fontWeight: 500 }
|
||||
}
|
||||
},
|
||||
colors: ['#696cff'], // Primary color
|
||||
grid: {
|
||||
borderColor: '#e9ecef',
|
||||
strokeDashArray: 4,
|
||||
xaxis: { lines: { show: true } },
|
||||
yaxis: { lines: { show: false } },
|
||||
padding: { top: -20, bottom: -10, left: 10, right: 10 }
|
||||
},
|
||||
tooltip: {
|
||||
y: {
|
||||
formatter: function (val) {
|
||||
return val.toLocaleString('pl-PL') + " zł";
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const customersChart = new ApexCharts(chartEl, chartConfig);
|
||||
customersChart.render();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
330
prototype/invoice/app-report-sales.php
Normal file
330
prototype/invoice/app-report-sales.php
Normal file
@@ -0,0 +1,330 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y">
|
||||
<!-- Vendors CSS dla Select2 i Flatpickr -->
|
||||
<link rel="stylesheet" href="../../assets/vendor/libs/select2/select2.css" />
|
||||
<link rel="stylesheet" href="../../assets/vendor/libs/flatpickr/flatpickr.css" />
|
||||
|
||||
<!-- Nagłówek i przyciski akcji -->
|
||||
<div
|
||||
class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center mb-4 gap-3">
|
||||
<div>
|
||||
<h4 class="fw-bold mb-1">
|
||||
<span class="text-muted fw-light">Raporty /</span> Raport kwotowy sprzedaży
|
||||
</h4>
|
||||
<p class="text-muted mb-0">Zestawienie wygenerowanych przychodów ze sprzedaży we wskazanym okresie.</p>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<button class="btn btn-label-secondary">
|
||||
<i class="bx bx-export me-1"></i> Eksportuj CSV
|
||||
</button>
|
||||
<button class="btn btn-primary">
|
||||
<i class="bx bx-printer me-1"></i> Drukuj raport
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta filtrów -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-body">
|
||||
<form class="row g-3">
|
||||
<div class="col-12 col-md-4">
|
||||
<label class="form-label" for="reportDateRange">Zakres dat</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<span class="input-group-text"><i class="bx bx-calendar"></i></span>
|
||||
<input type="text" id="reportDateRange" class="form-control flatpickr-range"
|
||||
placeholder="Wybierz okres (od - do)" value="2026-01-01 do 2026-06-30" />
|
||||
<button class="btn btn-outline-primary dropdown-toggle" type="button" data-bs-toggle="dropdown"
|
||||
aria-expanded="false">Wybierz</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li><a class="dropdown-item preset-date-range" href="javascript:void(0);"
|
||||
data-range="last-6-months">Ostatnie 6 miesięcy</a></li>
|
||||
<li><a class="dropdown-item preset-date-range" href="javascript:void(0);"
|
||||
data-range="last-12-months">Ostatnie 12 miesięcy</a></li>
|
||||
<li>
|
||||
<hr class="dropdown-divider">
|
||||
</li>
|
||||
<li><a class="dropdown-item preset-date-range" href="javascript:void(0);"
|
||||
data-range="this-month">Ten miesiąc</a></li>
|
||||
<li><a class="dropdown-item preset-date-range" href="javascript:void(0);"
|
||||
data-range="last-month">Poprzedni miesiąc</a></li>
|
||||
<li>
|
||||
<hr class="dropdown-divider">
|
||||
</li>
|
||||
<li><a class="dropdown-item preset-date-range" href="javascript:void(0);"
|
||||
data-range="this-year">Ten rok</a></li>
|
||||
<li><a class="dropdown-item preset-date-range" href="javascript:void(0);"
|
||||
data-range="last-year">Poprzedni rok</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-4">
|
||||
<label class="form-label" for="reportGranularity">Szczegółowość</label>
|
||||
<select id="reportGranularity" class="form-select select2">
|
||||
<option value="days">Dni</option>
|
||||
<option value="months" selected>Miesiące</option>
|
||||
<option value="years">Lata</option>
|
||||
</select>
|
||||
<small id="daysLimitInfo" class="text-muted d-none mt-1 d-block">
|
||||
<i class="bx bx-info-circle fs-6 align-middle me-1"></i>Maksymalny okres dla tej opcji wynosi
|
||||
366 dni.
|
||||
</small>
|
||||
</div>
|
||||
<div class="col-12 col-md-4 d-flex align-items-end">
|
||||
<button type="button" class="btn btn-primary w-100 w-md-auto">
|
||||
<i class="bx bx-refresh me-1"></i> Generuj
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta z wykresem -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5 class="card-title m-0">Przychody netto w czasie</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div id="salesReportChart" style="min-height: 350px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta z tabelą danych -->
|
||||
<div class="card">
|
||||
<div class="card-header border-bottom">
|
||||
<h5 class="card-title m-0">Szczegółowe zestawienie</h5>
|
||||
</div>
|
||||
<div class="table-responsive text-nowrap">
|
||||
<table class="table table-hover">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>Okres (Miesiąc)</th>
|
||||
<th class="text-center">Ilość dokumentów</th>
|
||||
<th class="text-end">Suma Kwot Netto</th>
|
||||
<th class="text-end">Suma Kwot VAT</th>
|
||||
<th class="text-end">Suma Kwot Brutto</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="fw-medium">Styczeń 2026</td>
|
||||
<td class="text-center">15</td>
|
||||
<td class="text-end">24 500.00 zł</td>
|
||||
<td class="text-end">5 635.00 zł</td>
|
||||
<td class="text-end fw-bold text-heading">30 135.00 zł</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="fw-medium">Luty 2026</td>
|
||||
<td class="text-center">21</td>
|
||||
<td class="text-end">31 200.00 zł</td>
|
||||
<td class="text-end">7 176.00 zł</td>
|
||||
<td class="text-end fw-bold text-heading">38 376.00 zł</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="fw-medium">Marzec 2026</td>
|
||||
<td class="text-center">18</td>
|
||||
<td class="text-end">28 450.00 zł</td>
|
||||
<td class="text-end">6 543.50 zł</td>
|
||||
<td class="text-end fw-bold text-heading">34 993.50 zł</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="fw-medium">Kwiecień 2026</td>
|
||||
<td class="text-center">24</td>
|
||||
<td class="text-end">36 800.00 zł</td>
|
||||
<td class="text-end">8 464.00 zł</td>
|
||||
<td class="text-end fw-bold text-heading">45 264.00 zł</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="fw-medium">Maj 2026</td>
|
||||
<td class="text-center">12</td>
|
||||
<td class="text-end">19 100.00 zł</td>
|
||||
<td class="text-end">4 393.00 zł</td>
|
||||
<td class="text-end fw-bold text-heading">23 493.00 zł</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="fw-medium">Czerwiec 2026</td>
|
||||
<td class="text-center">30</td>
|
||||
<td class="text-end">42 500.00 zł</td>
|
||||
<td class="text-end">9 775.00 zł</td>
|
||||
<td class="text-end fw-bold text-heading">52 275.00 zł</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot class="table-light fw-bold">
|
||||
<tr>
|
||||
<td>Podsumowanie całkowite</td>
|
||||
<td class="text-center">120</td>
|
||||
<td class="text-end text-primary">182 550.00 zł</td>
|
||||
<td class="text-end text-primary">41 986.50 zł</td>
|
||||
<td class="text-end text-primary fs-5">224 536.50 zł</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Vendors JS -->
|
||||
<script src="../../assets/vendor/libs/select2/select2.js"></script>
|
||||
<script src="../../assets/vendor/libs/flatpickr/flatpickr.js"></script>
|
||||
|
||||
<!-- ApexCharts scripts and local chart init -->
|
||||
<script src="../../assets/vendor/libs/apex-charts/apexcharts.js"></script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// 1. Inicjalizacja Flatpickr dla zakresu dat
|
||||
if (typeof flatpickr !== 'undefined') {
|
||||
const dateRangeEl = document.querySelector('.flatpickr-range');
|
||||
if (dateRangeEl) {
|
||||
const fp = flatpickr(dateRangeEl, {
|
||||
mode: 'range',
|
||||
dateFormat: 'Y-m-d',
|
||||
locale: 'pl'
|
||||
});
|
||||
|
||||
// Obsługa szybkich zakresów dat
|
||||
document.querySelectorAll('.preset-date-range').forEach(item => {
|
||||
item.addEventListener('click', function (e) {
|
||||
e.preventDefault();
|
||||
const rangeType = this.getAttribute('data-range');
|
||||
const today = new Date();
|
||||
let startDate = new Date();
|
||||
let endDate = new Date();
|
||||
|
||||
switch (rangeType) {
|
||||
case 'last-6-months':
|
||||
startDate.setMonth(today.getMonth() - 6);
|
||||
break;
|
||||
case 'last-12-months':
|
||||
startDate.setFullYear(today.getFullYear() - 1);
|
||||
break;
|
||||
case 'this-month':
|
||||
startDate = new Date(today.getFullYear(), today.getMonth(), 1);
|
||||
endDate = new Date(today.getFullYear(), today.getMonth() + 1, 0);
|
||||
break;
|
||||
case 'last-month':
|
||||
startDate = new Date(today.getFullYear(), today.getMonth() - 1, 1);
|
||||
endDate = new Date(today.getFullYear(), today.getMonth(), 0);
|
||||
break;
|
||||
case 'this-year':
|
||||
startDate = new Date(today.getFullYear(), 0, 1);
|
||||
endDate = new Date(today.getFullYear(), 11, 31);
|
||||
break;
|
||||
case 'last-year':
|
||||
startDate = new Date(today.getFullYear() - 1, 0, 1);
|
||||
endDate = new Date(today.getFullYear() - 1, 11, 31);
|
||||
break;
|
||||
}
|
||||
|
||||
if (startDate && endDate) {
|
||||
fp.setDate([startDate, endDate]);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 2. Inicjalizacja Select2
|
||||
if (typeof $ !== 'undefined' && $('.select2').length) {
|
||||
$('.select2').select2({
|
||||
minimumResultsForSearch: Infinity // Ukrywamy search jeśli to tylko 3 opcje
|
||||
});
|
||||
|
||||
// Obsługa pojawiania się podpowiedzi po wybraniu z selecta
|
||||
$('#reportGranularity').on('change', function () {
|
||||
const daysInfo = document.getElementById('daysLimitInfo');
|
||||
if (this.value === 'days') {
|
||||
daysInfo.classList.remove('d-none');
|
||||
} else {
|
||||
daysInfo.classList.add('d-none');
|
||||
}
|
||||
});
|
||||
|
||||
// Triggerujemy change dla zainicjowania stanu ukrycia/pokazania podczas ładowania
|
||||
$('#reportGranularity').trigger('change');
|
||||
}
|
||||
|
||||
// 3. Inicjalizacja Wykresu
|
||||
const chartEl = document.querySelector('#salesReportChart');
|
||||
if (chartEl && typeof ApexCharts !== 'undefined') {
|
||||
const chartConfig = {
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'bar', // lub 'line' / 'area' w zależności od preferencji, bar dobrze działa do zestawień miesięcznych
|
||||
parentHeightOffset: 0,
|
||||
toolbar: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
borderRadius: 4,
|
||||
columnWidth: '40%',
|
||||
startingShape: 'rounded',
|
||||
endingShape: 'rounded'
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'Przychody netto (PLN)',
|
||||
data: [24500, 31200, 28450, 36800, 19100, 42500]
|
||||
}],
|
||||
xaxis: {
|
||||
categories: ['Styczeń', 'Luty', 'Marzec', 'Kwiecień', 'Maj', 'Czerwiec'],
|
||||
axisBorder: {
|
||||
show: false
|
||||
},
|
||||
axisTicks: {
|
||||
show: false
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
colors: '#a1acb8',
|
||||
fontSize: '13px'
|
||||
}
|
||||
}
|
||||
},
|
||||
yaxis: {
|
||||
labels: {
|
||||
formatter: function (val) {
|
||||
return val.toLocaleString('pl-PL') + " zł";
|
||||
},
|
||||
style: {
|
||||
colors: '#a1acb8',
|
||||
fontSize: '13px'
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: ['#696cff'], // Kolor primary bootstrapa z szablonu Sneat
|
||||
grid: {
|
||||
borderColor: '#e9ecef',
|
||||
strokeDashArray: 4,
|
||||
padding: {
|
||||
top: -20,
|
||||
bottom: -10,
|
||||
left: 20,
|
||||
right: 20
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
y: {
|
||||
formatter: function (val) {
|
||||
return val.toLocaleString('pl-PL') + " zł";
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const salesChart = new ApexCharts(chartEl, chartConfig);
|
||||
salesChart.render();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
164
prototype/invoice/app-reports.php
Normal file
164
prototype/invoice/app-reports.php
Normal file
@@ -0,0 +1,164 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y">
|
||||
<!-- Header with description -->
|
||||
<div class="card p-0 mb-4">
|
||||
<div class="card-body d-flex flex-column flex-md-row justify-content-between p-0">
|
||||
|
||||
<!-- Left image -->
|
||||
<div class="d-none d-md-flex app-academy-md-25 card-body py-0 pt-3 ps-5 align-items-center">
|
||||
<img src="../../assets/img/illustrations/bulb-light.png" width="90" class="img-fluid" alt="Bulb"
|
||||
data-app-light-img="illustrations/bulb-light.png" data-app-dark-img="illustrations/bulb-dark.png">
|
||||
</div>
|
||||
|
||||
<!-- Center context -->
|
||||
<div class="app-academy-md-50 card-body d-flex align-items-md-center flex-column text-md-center mb-1 py-5">
|
||||
<h4 class="card-title mb-4 px-md-12 lh-base fw-bold">
|
||||
Analizuj i wizualizuj dane finansowe<br>
|
||||
w <span class="text-primary text-nowrap">przejrzystych raportach</span>.
|
||||
</h4>
|
||||
<p class="mb-4 col-md-10 text-muted">
|
||||
Poniżej prezentujemy dostępne raporty, które pomogą Ci śledzić i analizować kondycję finansową
|
||||
Twojej firmy.
|
||||
Monitoruj przychody, koszty oraz rentowność, wybierając odpowiedni typ zestawienia, a następnie
|
||||
dostosuj
|
||||
jego parametry czasowe żeby wygenerować dokument dla pożądanego okresu.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Right image -->
|
||||
<div class="d-none d-md-flex app-academy-md-25 align-items-end justify-content-end pe-4 pb-2">
|
||||
<img src="../../assets/img/illustrations/pencil-rocket.png" alt="pencil rocket" height="150"
|
||||
class="scaleX-n1-rtl">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Reports Gallery -->
|
||||
<div class="card p-4">
|
||||
<div class="row">
|
||||
|
||||
<!-- Raport kwotowy sprzedaży -->
|
||||
<div class="col-sm-6 col-lg-4 mb-4">
|
||||
<div class="card p-2 h-100 shadow-none border">
|
||||
<div class="card-body p-4 pt-2 d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<span class="badge bg-label-success">Przychody</span>
|
||||
</div>
|
||||
<a href="javascript:void(0);" class="h5 mb-2 fw-semibold">Raport kwotowy sprzedaży</a>
|
||||
<p class="mt-1 text-muted mb-4 flex-grow-1">
|
||||
Szczegółowe zestawienie wygenerowanych przychodów ze sprzedaży we wskazanym okresie.
|
||||
Pozwala przeanalizować jakie towary i usługi przynoszą największy obrót.
|
||||
</p>
|
||||
<div class="d-flex flex-column flex-md-row gap-4 mt-auto">
|
||||
<a class="w-100 btn btn-label-primary d-flex align-items-center justify-content-center"
|
||||
href="app-report-sales.php">
|
||||
<span class="me-2">Wygeneruj</span>
|
||||
<i class="bx bx-chevron-right icon-sm lh-1 scaleX-n1-rtl"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Ranking klientów -->
|
||||
<div class="col-sm-6 col-lg-4 mb-4">
|
||||
<div class="card p-2 h-100 shadow-none border">
|
||||
<div class="card-body p-4 pt-2 d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<span class="badge bg-label-success">Przychody</span>
|
||||
</div>
|
||||
<a href="javascript:void(0);" class="h5 mb-2 fw-semibold">Ranking klientów</a>
|
||||
<p class="mt-1 text-muted mb-4 flex-grow-1">
|
||||
Zbiorcze zestawienie wszystkich kontrahentów ułożonych od generujących największy przychód
|
||||
do najmniejszego.
|
||||
Pomaga szybko zidentyfikować kluczowych nabywców.
|
||||
</p>
|
||||
<div class="d-flex flex-column flex-md-row gap-4 mt-auto">
|
||||
<a class="w-100 btn btn-label-primary d-flex align-items-center justify-content-center"
|
||||
href="app-report-customers.php">
|
||||
<span class="me-2">Wygeneruj</span>
|
||||
<i class="bx bx-chevron-right icon-sm lh-1 scaleX-n1-rtl"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Analiza kontrahenta -->
|
||||
<div class="col-sm-6 col-lg-4 mb-4">
|
||||
<div class="card p-2 h-100 shadow-none border">
|
||||
<div class="card-body p-4 pt-2 d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<span class="badge bg-label-success">Przychody</span>
|
||||
</div>
|
||||
<a href="javascript:void(0);" class="h5 mb-2 fw-semibold">Historia kontrahenta</a>
|
||||
<p class="mt-1 text-muted mb-4 flex-grow-1">
|
||||
Szczegółowa analiza sprzedaży dla wybranego, pojedynczego klienta.
|
||||
Ukazuje trendy, zestawienie poszczególnych faktur i dokumentów z danym kontrahentem.
|
||||
</p>
|
||||
<div class="d-flex flex-column flex-md-row gap-4 mt-auto">
|
||||
<a class="w-100 btn btn-label-primary d-flex align-items-center justify-content-center"
|
||||
href="javascript:void(0);">
|
||||
<span class="me-2">Wygeneruj</span>
|
||||
<i class="bx bx-chevron-right icon-sm lh-1 scaleX-n1-rtl"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Raport kwotowy kosztów -->
|
||||
<div class="col-sm-6 col-lg-4 mb-4">
|
||||
<div class="card p-2 h-100 shadow-none border">
|
||||
<div class="card-body p-4 pt-2 d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<span class="badge bg-label-danger">Koszty i wydatki</span>
|
||||
</div>
|
||||
<a href="javascript:void(0);" class="h5 mb-2 fw-semibold">Raport kwotowy kosztów</a>
|
||||
<p class="mt-1 text-muted mb-4 flex-grow-1">
|
||||
Analiza poniesionych wydatków i kosztów firmowych z podziałem na kategorie oraz sprzedawców,
|
||||
ułatwiająca zlokalizowanie kluczowych obszarów wydatków.
|
||||
</p>
|
||||
<div class="d-flex flex-column flex-md-row gap-4 mt-auto">
|
||||
<a class="w-100 btn btn-label-primary d-flex align-items-center justify-content-center"
|
||||
href="javascript:void(0);">
|
||||
<span class="me-2">Wygeneruj</span>
|
||||
<i class="bx bx-chevron-right icon-sm lh-1 scaleX-n1-rtl"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bilans zysków i strat -->
|
||||
<div class="col-sm-6 col-lg-4 mb-4">
|
||||
<div class="card p-2 h-100 shadow-none border">
|
||||
<div class="card-body p-4 pt-2 d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<span class="badge bg-label-info">Podsumowanie całkowite</span>
|
||||
</div>
|
||||
<a href="javascript:void(0);" class="h5 mb-2 fw-semibold">Bilans zysków i strat</a>
|
||||
<p class="mt-1 text-muted mb-4 flex-grow-1">
|
||||
Kompleksowe zestawienie przychodów oraz kosztów. Generuje automatyczne wyliczenia podatków
|
||||
oraz ilustruje całkowitą rentowność i ogólny wynik finansowy w podanym przedziale czasowym.
|
||||
</p>
|
||||
<div class="d-flex flex-column flex-md-row gap-4 mt-auto">
|
||||
<a class="w-100 btn btn-label-primary d-flex align-items-center justify-content-center"
|
||||
href="javascript:void(0);">
|
||||
<span class="me-2">Wygeneruj</span>
|
||||
<i class="bx bx-chevron-right icon-sm lh-1 scaleX-n1-rtl"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
418
prototype/invoice/index.php
Normal file
418
prototype/invoice/index.php
Normal file
@@ -0,0 +1,418 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-fluid flex-grow-1 container-p-y">
|
||||
|
||||
<div
|
||||
class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center mb-4 gap-3">
|
||||
<div class="d-flex flex-column justify-content-center">
|
||||
<h4 class="mb-1 text-body">Witaj w panelu firmy! 👋</h4>
|
||||
<p class="text-muted mb-0">Oto finansowe podsumowanie Twojego biznesu.</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-xl-5 g-4 mb-4">
|
||||
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-2 pb-1">
|
||||
<div class="avatar me-2">
|
||||
<span class="avatar-initial rounded bg-label-primary"><i
|
||||
class='bx bx-trending-up fs-4'></i></span>
|
||||
</div>
|
||||
<h4 class="ms-1 mb-0 text-nowrap">24 500 zł</h4>
|
||||
</div>
|
||||
<p class="mb-1 fw-medium text-heading">Sprzedaż (Ten miesiąc)</p>
|
||||
<p class="mb-0 text-muted small">
|
||||
<span class="text-success fw-medium"><i class='bx bx-up-arrow-alt'></i> +12.4%</span> vs zeszły
|
||||
m-c
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-2 pb-1">
|
||||
<div class="avatar me-2">
|
||||
<span class="avatar-initial rounded bg-label-secondary"><i
|
||||
class='bx bx-calendar fs-4'></i></span>
|
||||
</div>
|
||||
<h4 class="ms-1 mb-0 text-nowrap">21 800 zł</h4>
|
||||
</div>
|
||||
<p class="mb-1 fw-medium text-heading">Sprzedaż (Poprzedni m-c)</p>
|
||||
<p class="mb-0 text-muted small">Zamknięty okres rozliczeniowy</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-2 pb-1">
|
||||
<div class="avatar me-2">
|
||||
<span class="avatar-initial rounded bg-label-success"><i
|
||||
class='bx bx-wallet fs-4'></i></span>
|
||||
</div>
|
||||
<h4 class="ms-1 mb-0 text-nowrap">15 200 zł</h4>
|
||||
</div>
|
||||
<p class="mb-1 fw-medium text-heading">Należności</p>
|
||||
<p class="mb-0 text-muted small">Niezapłacone faktury (w terminie)</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card h-100 border border-danger">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-2 pb-1">
|
||||
<div class="avatar me-2">
|
||||
<span class="avatar-initial rounded bg-label-danger"><i
|
||||
class='bx bx-error-circle fs-4'></i></span>
|
||||
</div>
|
||||
<h4 class="ms-1 mb-0 text-danger text-nowrap">4 350 zł</h4>
|
||||
</div>
|
||||
<p class="mb-1 fw-medium text-danger">Po terminie</p>
|
||||
<p class="mb-0 text-muted small">5 dokumentów wymaga uwagi</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-2 pb-1">
|
||||
<div class="avatar me-2">
|
||||
<span class="avatar-initial rounded bg-label-warning"><i
|
||||
class='bx bx-credit-card-front fs-4'></i></span>
|
||||
</div>
|
||||
<h4 class="ms-1 mb-0 text-nowrap">8 100 zł</h4>
|
||||
</div>
|
||||
<p class="mb-1 fw-medium text-heading">Zobowiązania</p>
|
||||
<p class="mb-0 text-muted small">Twoje koszty do opłacenia</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row mb-4 g-4">
|
||||
|
||||
<div class="col-lg-8">
|
||||
<div class="card h-100">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5 class="card-title mb-0">Sprzedaż netto (Ostatnie 12 miesięcy)</h5>
|
||||
<div class="dropdown">
|
||||
<button class="btn p-0" type="button" data-bs-toggle="dropdown"><i
|
||||
class="bx bx-dots-vertical-rounded"></i></button>
|
||||
<div class="dropdown-menu dropdown-menu-end">
|
||||
<a class="dropdown-item" href="javascript:void(0);">Pobierz jako raport</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div id="sales12MonthsChart" style="min-height: 300px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<div class="card h-100">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5 class="card-title mb-0">Porównanie Rok do Roku</h5>
|
||||
<select class="form-select form-select-sm w-auto">
|
||||
<option value="3" selected>Ost. 3 lata</option>
|
||||
<option value="5">Ost. 5 lat</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div id="salesYoYChart" style="min-height: 300px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row g-4">
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-header border-bottom d-flex justify-content-between align-items-center px-3 py-2">
|
||||
<h5 class="card-title mb-0 pt-1 px-2">Wymaga uwagi</h5>
|
||||
<ul class="nav nav-pills card-header-pills" role="tablist">
|
||||
<li class="nav-item">
|
||||
<button type="button" class="nav-link active btn-sm" data-bs-toggle="tab"
|
||||
data-bs-target="#tab-debtors">Dłużnicy</button>
|
||||
</li>
|
||||
<li class="nav-item ms-2">
|
||||
<button type="button" class="nav-link btn-sm" data-bs-toggle="tab"
|
||||
data-bs-target="#tab-payables">Do zapłaty</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="tab-content p-0">
|
||||
|
||||
<div class="tab-pane fade show active" id="tab-debtors">
|
||||
<div class="table-responsive text-nowrap">
|
||||
<table class="table table-hover table-sm align-middle mb-0">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="ps-4">Klient</th>
|
||||
<th>Nr Faktury</th>
|
||||
<th class="text-center">Dni zwłoki</th>
|
||||
<th class="text-end pe-4">Kwota</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
<tr>
|
||||
<td class="ps-4 fw-medium text-heading">Gmina Stalowa Wola</td>
|
||||
<td><a href="#">FV/02/2026</a></td>
|
||||
<td class="text-center"><span class="badge bg-label-danger">14 dni</span>
|
||||
</td>
|
||||
<td class="text-end pe-4 fw-bold">1 250,00 zł</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ps-4 fw-medium text-heading">TechSolutions Sp. z o.o.</td>
|
||||
<td><a href="#">FV/01/2026</a></td>
|
||||
<td class="text-center"><span class="badge bg-label-warning">5 dni</span>
|
||||
</td>
|
||||
<td class="text-end pe-4 fw-bold">3 100,00 zł</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="p-3 text-center border-top">
|
||||
<a href="app-invoice-list.php" class="btn btn-label-primary btn-sm">Zobacz faktury
|
||||
nierozliczone</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab-pane fade" id="tab-payables">
|
||||
<div class="table-responsive text-nowrap">
|
||||
<table class="table table-hover table-sm align-middle mb-0">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="ps-4">Dostawca</th>
|
||||
<th>Termin</th>
|
||||
<th class="text-end pe-4">Kwota</th>
|
||||
<th style="width: 50px;"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
<tr>
|
||||
<td class="ps-4 fw-medium text-heading">Tauron Polska</td>
|
||||
<td><span class="text-danger fw-bold">Wczoraj</span></td>
|
||||
<td class="text-end pe-4 fw-bold">1 450,20 zł</td>
|
||||
<td><button class="btn btn-sm btn-icon btn-label-success"
|
||||
title="Oznacz jako zapłacone"><i class="bx bx-check"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ps-4 fw-medium text-heading">Orange S.A.</td>
|
||||
<td>Za 2 dni</td>
|
||||
<td class="text-end pe-4 fw-bold">150,00 zł</td>
|
||||
<td><button class="btn btn-sm btn-icon btn-label-success"
|
||||
title="Oznacz jako zapłacone"><i class="bx bx-check"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="p-3 text-center border-top">
|
||||
<a href="app-purchase-list.php" class="btn btn-label-primary btn-sm">Zobacz wszystkie
|
||||
koszty</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-header border-bottom d-flex justify-content-between align-items-center">
|
||||
<h5 class="card-title mb-0"><i class='bx bx-cloud-download text-primary me-2'></i>Ostatnio pobrane z
|
||||
KSeF</h5>
|
||||
<button class="btn btn-sm btn-label-secondary" title="Sprawdź nowe dokumenty"><i
|
||||
class="bx bx-refresh"></i></button>
|
||||
</div>
|
||||
<div class="table-responsive text-nowrap">
|
||||
<table class="table table-hover table-sm align-middle mb-0">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="ps-4">Wystawca</th>
|
||||
<th>Numer KSeF</th>
|
||||
<th class="text-end">Kwota Brutto</th>
|
||||
<th class="text-end pe-4">Pobrano</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
<tr>
|
||||
<td class="ps-4">
|
||||
<span class="fw-medium text-heading">Orlen S.A.</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">...3C4D5E-6F</span>
|
||||
</td>
|
||||
<td class="text-end fw-bold">350,00 zł</td>
|
||||
<td class="text-end pe-4"><span class="badge bg-label-info">15 min temu</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ps-4">
|
||||
<span class="fw-medium text-heading">PGE Obrót S.A.</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">...A8B9C0-11</span>
|
||||
</td>
|
||||
<td class="text-end fw-bold">1 200,45 zł</td>
|
||||
<td class="text-end pe-4"><span class="badge bg-label-secondary">2 godz. temu</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ps-4">
|
||||
<span class="fw-medium text-heading">Castorama Polska</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">...F1A2D3-44</span>
|
||||
</td>
|
||||
<td class="text-end fw-bold">840,00 zł</td>
|
||||
<td class="text-end pe-4"><span class="badge bg-label-secondary">Wczoraj</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ps-4">
|
||||
<span class="fw-medium text-heading">Poczta Polska S.A.</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">...E5F6A7-99</span>
|
||||
</td>
|
||||
<td class="text-end fw-bold">12,50 zł</td>
|
||||
<td class="text-end pe-4"><span class="badge bg-label-secondary">Wczoraj</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="card-footer border-top text-center py-2">
|
||||
<a href="app-purchase-list.php" class="text-primary small fw-medium">Przejdź do listy faktur
|
||||
zakupowych</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<script src="../../assets/vendor/libs/apex-charts/apexcharts.js"></script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
|
||||
// Konfiguracja i kolory ze stylu szablonu
|
||||
let cardColor = '#fff',
|
||||
headingColor = '#566a7f',
|
||||
axisColor = '#a1acb8',
|
||||
borderColor = '#eceef1',
|
||||
primaryColor = '#696cff',
|
||||
infoColor = '#03c3ec';
|
||||
|
||||
// 1. Wykres Słupkowy - 12 Miesięcy (Przychody)
|
||||
const sales12MonthsEl = document.querySelector('#sales12MonthsChart');
|
||||
if (sales12MonthsEl) {
|
||||
const sales12MonthsOptions = {
|
||||
chart: {
|
||||
height: 300,
|
||||
type: 'bar',
|
||||
toolbar: { show: false }
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
borderRadius: 4,
|
||||
columnWidth: '40%',
|
||||
startingShape: 'rounded',
|
||||
endingShape: 'rounded'
|
||||
}
|
||||
},
|
||||
colors: [primaryColor],
|
||||
dataLabels: { enabled: false },
|
||||
series: [{
|
||||
name: 'Sprzedaż Netto (zł)',
|
||||
data: [12000, 15000, 14000, 18000, 22000, 19000, 25000, 21000, 17000, 23000, 21800, 24500]
|
||||
}],
|
||||
xaxis: {
|
||||
categories: ['Kwi', 'Maj', 'Cze', 'Lip', 'Sie', 'Wrz', 'Paź', 'Lis', 'Gru', 'Sty', 'Lut', 'Mar'],
|
||||
axisBorder: { show: false },
|
||||
axisTicks: { show: false },
|
||||
labels: { style: { colors: axisColor } }
|
||||
},
|
||||
yaxis: {
|
||||
labels: { style: { colors: axisColor }, formatter: function (val) { return val / 1000 + "k"; } }
|
||||
},
|
||||
grid: {
|
||||
borderColor: borderColor,
|
||||
strokeDashArray: 4,
|
||||
padding: { top: -20, bottom: -10, left: 10, right: 10 }
|
||||
}
|
||||
};
|
||||
const sales12MonthsChart = new ApexCharts(sales12MonthsEl, sales12MonthsOptions);
|
||||
sales12MonthsChart.render();
|
||||
}
|
||||
|
||||
// 2. Wykres Liniowy - Porównanie Rok do Roku (YoY)
|
||||
const salesYoYEl = document.querySelector('#salesYoYChart');
|
||||
if (salesYoYEl) {
|
||||
const salesYoYOptions = {
|
||||
chart: {
|
||||
height: 300,
|
||||
type: 'line',
|
||||
toolbar: { show: false }
|
||||
},
|
||||
stroke: {
|
||||
width: [2, 2, 2],
|
||||
curve: 'smooth'
|
||||
},
|
||||
colors: [primaryColor, infoColor, '#ffab00'], // Lata 2026, 2025, 2024
|
||||
series: [
|
||||
{ name: '2026', data: [15, 21.8, 24.5, null, null, null, null, null, null, null, null, null] },
|
||||
{ name: '2025', data: [12, 14, 18, 20, 25, 22, 28, 29, 31, 26, 33, 35] },
|
||||
{ name: '2024', data: [10, 11, 13, 14, 17, 16, 20, 21, 23, 22, 25, 28] }
|
||||
],
|
||||
legend: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
horizontalAlign: 'start',
|
||||
labels: { colors: headingColor }
|
||||
},
|
||||
xaxis: {
|
||||
categories: ['I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX', 'X', 'XI', 'XII'],
|
||||
axisBorder: { show: false },
|
||||
axisTicks: { show: false },
|
||||
labels: { style: { colors: axisColor } }
|
||||
},
|
||||
yaxis: {
|
||||
show: false // Ukrywamy oś Y by wykres był czystszy (trend jest widoczny z tooltipów)
|
||||
},
|
||||
grid: {
|
||||
borderColor: borderColor,
|
||||
strokeDashArray: 4,
|
||||
padding: { top: 0, bottom: -10, left: 10, right: 10 }
|
||||
}
|
||||
};
|
||||
const salesYoYChart = new ApexCharts(salesYoYEl, salesYoYOptions);
|
||||
salesYoYChart.render();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,17 +1,95 @@
|
||||
<?php
|
||||
$currentPage = basename($_SERVER['PHP_SELF']);
|
||||
?>
|
||||
<aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
|
||||
<div class="app-brand demo">
|
||||
<aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme" style="padding-top: 10px">
|
||||
<div class="app-brand demo" style="padding-left: .5rem;">
|
||||
<a href="index.php" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<svg width="25" viewBox="0 0 25 42" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg width="228" height="35" viewBox="0 0 1617 249" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_448_749)">
|
||||
<path d="M405.93 88.56H365.16V64.54H476.18V88.56H435.41V191.94H405.93V88.56Z" fill="#001D4A" />
|
||||
<path
|
||||
d="M13.79,0.35 L3.39,7.44 C0.56,9.69 -0.37,12.47 0.55,15.79 C3.12,19.22 7.65,21.21 7.65,21.21 L2.63,24.54 C0.44,26.3 0.08,28.5 1.56,31.17 C7.09,32.53 16.41,26.37 18.4,20.23 C13.04,14.37 18.61,7.98 13.79,0.35 Z"
|
||||
fill="#696cff" />
|
||||
</svg>
|
||||
</span>
|
||||
<span class="app-brand-text demo menu-text fw-bold ms-2">invoice.magico</span>
|
||||
d="M548.62 92.56V118.77C546.25 118.59 544.43 118.41 542.25 118.41C526.6 118.41 516.22 126.96 516.22 145.71V191.94H487.83V94.02H514.95V106.94C521.87 97.48 533.51 92.56 548.62 92.56Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M651.641 136.06V191.94H625.071V179.75C619.791 188.67 609.601 193.4 595.221 193.4C572.291 193.4 558.641 180.66 558.641 163.73C558.641 146.8 570.831 134.43 600.681 134.43H623.251C623.251 122.23 615.971 115.14 600.681 115.14C590.311 115.14 579.571 118.6 572.471 124.24L562.281 104.4C573.021 96.76 588.851 92.57 604.501 92.57C634.351 92.57 651.641 106.4 651.641 136.07V136.06ZM623.251 161V150.99H603.781C590.491 150.99 586.311 155.9 586.311 162.46C586.311 169.56 592.321 174.29 602.331 174.29C611.791 174.29 619.981 169.92 623.261 161H623.251Z"
|
||||
fill="#001D4A" />
|
||||
<path d="M772.67 94.02L731.35 191.94H702.05L660.92 94.02H690.22L717.34 160.64L745.37 94.02H772.67Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M876.961 150.99H802.881C805.611 163.18 815.981 170.65 830.911 170.65C841.281 170.65 848.751 167.56 855.481 161.19L870.591 177.57C861.491 187.95 847.841 193.4 830.181 193.4C796.331 193.4 774.301 172.11 774.301 142.98C774.301 113.85 796.691 92.56 826.541 92.56C856.391 92.56 877.501 111.85 877.501 143.34C877.501 145.52 877.141 148.62 876.951 150.98L876.961 150.99ZM802.521 134.43H850.751C848.751 122.05 839.471 114.05 826.731 114.05C813.991 114.05 804.531 121.88 802.521 134.43Z"
|
||||
fill="#001D4A" />
|
||||
<path d="M896.43 56.89H924.82V191.94H896.43V56.89Z" fill="#001D4A" />
|
||||
<path
|
||||
d="M952.26 64.54C952.26 55.62 959.36 48.71 969.91 48.71C980.46 48.71 987.57 55.26 987.57 64C987.57 73.46 980.47 80.38 969.91 80.38C959.35 80.38 952.26 73.46 952.26 64.55V64.54ZM955.72 94.02H984.11V191.94H955.72V94.02Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M1110.6 135.88V191.94H1082.21V140.25C1082.21 124.42 1074.93 117.13 1062.37 117.13C1048.72 117.13 1038.89 125.5 1038.89 143.52V191.93H1010.5V94.01H1037.62V105.48C1045.26 97.11 1056.73 92.56 1070.02 92.56C1093.13 92.56 1110.61 106.03 1110.61 135.88H1110.6Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M1231.64 94.02L1190.33 191.94H1161.03L1119.9 94.02H1149.2L1176.32 160.64L1204.35 94.02H1231.65H1231.64Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M1233.27 142.98C1233.27 113.49 1256.02 92.56 1287.15 92.56C1318.28 92.56 1340.84 113.49 1340.84 142.98C1340.84 172.47 1318.27 193.4 1287.15 193.4C1256.03 193.4 1233.27 172.47 1233.27 142.98ZM1312.08 142.98C1312.08 126.05 1301.34 115.86 1287.15 115.86C1272.96 115.86 1262.03 126.05 1262.03 142.98C1262.03 159.91 1272.95 170.1 1287.15 170.1C1301.35 170.1 1312.08 159.91 1312.08 142.98Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M1356.31 64.54C1356.31 55.62 1363.41 48.71 1373.96 48.71C1384.51 48.71 1391.62 55.26 1391.62 64C1391.62 73.46 1384.52 80.38 1373.96 80.38C1363.4 80.38 1356.31 73.46 1356.31 64.55V64.54ZM1359.76 94.02H1388.15V191.94H1359.76V94.02Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M1407.27 142.98C1407.27 113.49 1430.02 92.56 1461.87 92.56C1482.44 92.56 1498.64 101.48 1505.73 117.5L1483.71 129.33C1478.43 120.05 1470.6 115.86 1461.69 115.86C1447.31 115.86 1436.03 125.87 1436.03 142.98C1436.03 160.09 1447.32 170.1 1461.69 170.1C1470.61 170.1 1478.43 166.1 1483.71 156.63L1505.73 168.64C1498.63 184.29 1482.43 193.39 1461.87 193.39C1430.02 193.39 1407.27 172.46 1407.27 142.97V142.98Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M1616.21 150.99H1542.13C1544.86 163.18 1555.24 170.65 1570.16 170.65C1580.54 170.65 1588 167.56 1594.73 161.19L1609.84 177.57C1600.74 187.95 1587.09 193.4 1569.43 193.4C1535.58 193.4 1513.55 172.11 1513.55 142.98C1513.55 113.85 1535.94 92.56 1565.79 92.56C1595.64 92.56 1616.75 111.85 1616.75 143.34C1616.75 145.52 1616.39 148.62 1616.21 150.98V150.99ZM1541.77 134.43H1590C1588 122.05 1578.71 114.05 1565.97 114.05C1553.23 114.05 1543.76 121.88 1541.76 134.43H1541.77Z"
|
||||
fill="#E0740C" />
|
||||
<path
|
||||
d="M132.02 151.25C120.97 144.9 120.97 128.91 132.02 122.55C135.3 120.66 136.67 116.71 135.27 113.2C132.98 107.47 129.88 102.11 126.05 97.27C123.71 94.31 119.6 93.52 116.34 95.41C105.33 101.78 91.4796 93.82 91.4996 81.06C91.4996 77.27 88.7696 74.11 85.0196 73.57C78.9596 72.7 72.6996 72.7 66.6396 73.57C62.8896 74.11 60.1596 77.27 60.1596 81.06C60.1796 93.8 46.3396 101.79 35.3196 95.41C32.0596 93.52 27.9496 94.3 25.6096 97.27C21.7896 102.11 18.6796 107.47 16.3896 113.2C14.9896 116.71 16.3696 120.67 19.6396 122.55C24.7596 125.49 27.9496 130.99 27.9496 136.9C27.9496 142.81 24.7696 148.31 19.6396 151.25C16.3596 153.13 14.9796 157.09 16.3896 160.6C18.6796 166.32 21.7896 171.69 25.6096 176.53C27.9496 179.49 32.0596 180.27 35.3196 178.38C46.2996 172.03 60.1796 179.93 60.1596 192.73C60.1596 196.52 62.8896 199.68 66.6396 200.22C72.6996 201.09 78.9596 201.1 85.0196 200.22C88.7696 199.68 91.4996 196.52 91.4996 192.73C91.4796 179.98 105.33 172 116.34 178.38C119.61 180.27 123.72 179.48 126.06 176.52C129.88 171.68 132.99 166.32 135.28 160.6C136.68 157.09 135.31 153.13 132.03 151.25H132.02ZM75.8296 159.28C63.4896 159.28 53.4596 149.24 53.4596 136.9C53.4596 124.56 63.4996 114.53 75.8296 114.53C88.1596 114.53 98.2096 124.57 98.2096 136.9C98.2096 149.23 88.1996 159.28 75.8296 159.28Z"
|
||||
fill="url(#paint0_linear_448_749)" />
|
||||
<path
|
||||
d="M121.79 215.99C95.3395 221.5 70.0795 216.46 44.7695 208.22C44.3395 208.08 44.1095 207.62 44.2595 207.18L48.6395 194.41L10.0195 211.36L30.0495 248.5L34.4495 235.73C34.5995 235.31 35.0395 235.08 35.4695 235.22C57.7195 242.32 82.7495 246.67 105.79 240.76C122.58 236.45 136.01 227.29 147.51 214.51L156.57 204.44C144.79 208.98 134.34 213.39 121.8 216L121.79 215.99Z"
|
||||
fill="url(#paint1_linear_448_749)" />
|
||||
<path
|
||||
d="M34.65 59.94C61.05 54.16 86.35 58.94 111.75 66.91C112.18 67.04 112.42 67.5 112.27 67.94L108.02 80.75L146.46 63.4L126.05 26.47L121.78 39.29C121.64 39.72 121.2 39.94 120.77 39.81C98.45 32.94 73.37 28.85 50.39 35C33.64 39.48 20.31 48.78 8.94 61.68L0 71.85C11.73 67.19 22.13 62.68 34.65 59.93V59.94Z"
|
||||
fill="url(#paint2_linear_448_749)" />
|
||||
<path
|
||||
d="M245.04 123.94H148.53C146.79 128.39 143.57 132.28 139.09 134.85C138.31 135.3 137.92 135.99 137.92 136.9C137.92 137.37 138.03 137.77 138.23 138.12H245.04C248.96 138.12 252.13 134.94 252.13 131.03C252.13 127.12 248.95 123.94 245.04 123.94Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M245.04 89.17H137.71C141.12 93.59 144.04 98.34 146.43 103.36H245.04C248.96 103.36 252.13 100.18 252.13 96.27C252.13 92.36 248.95 89.18 245.04 89.18V89.17Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M190.56 42.94H151.36L158.88 56.54C158.98 56.73 159.07 56.93 159.16 57.12H190.56C194.48 57.12 197.65 53.94 197.65 50.03C197.65 46.12 194.47 42.94 190.56 42.94Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M288 46.11C270.79 26.44 264.74 19.76 249.27 4.24C246.58 1.54 242.86 0 239.05 0H130.52C116.93 0 104.86 7.75 97.3096 19.69C102.18 20.47 107.19 21.49 112.34 22.76L112.59 22C114.37 16.66 119.14 12.87 124.75 12.36C125.19 12.32 125.62 12.3 126.05 12.3C128.57 12.3 130.99 12.97 133.11 14.19H224.74V49.69C224.74 61.21 233.02 70.58 243.19 70.58H277.8V194.63C277.8 213.37 265.34 229.21 250.59 229.21H153.06C147.43 234.77 141.53 239.5 135.28 243.4H250.58C273.41 243.4 291.98 221.52 291.98 194.63V56.74C291.98 52.83 290.56 49.05 287.98 46.11H288ZM243.2 56.39C241.23 56.39 238.94 53.46 238.94 49.69V14.19H239.05C239.11 14.19 239.18 14.22 239.22 14.26C254.5 29.58 260.08 35.75 277.32 55.45C277.55 55.72 277.71 56.04 277.77 56.39H243.2Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M89.9397 43.11C89.7597 43.09 89.5896 43.04 89.4196 43.01C89.4196 43.09 89.3996 43.18 89.3896 43.26C89.5696 43.21 89.7497 43.16 89.9397 43.11Z"
|
||||
fill="#001D4A" />
|
||||
<path
|
||||
d="M245.04 157.35H150.01C150.06 160.18 149.57 163.07 148.45 165.87C147.68 167.79 146.83 169.68 145.91 171.54H245.04C248.96 171.54 252.13 168.36 252.13 164.45C252.13 160.54 248.95 157.36 245.04 157.36V157.35Z"
|
||||
fill="#001D4A" />
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_448_749" x1="15.8396" y1="136.91" x2="135.81" y2="136.91"
|
||||
gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0.4" stop-color="#D26601" />
|
||||
<stop offset="0.94" stop-color="#EC8116" />
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_448_749" x1="21.0018" y1="239.655" x2="150.77" y2="189.399"
|
||||
gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0.4" stop-color="#D26601" />
|
||||
<stop offset="0.94" stop-color="#EC8116" />
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_448_749" x1="135.331" y1="35.5783" x2="6.07726" y2="87.1713"
|
||||
gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0.4" stop-color="#D26601" />
|
||||
<stop offset="0.94" stop-color="#EC8116" />
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_448_749">
|
||||
<rect width="1616.75" height="248.49" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
</a>
|
||||
<a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
|
||||
<i class="bx bx-chevron-left bx-sm align-middle"></i>
|
||||
@@ -65,6 +143,12 @@ $currentPage = basename($_SERVER['PHP_SELF']);
|
||||
<div class="text-truncate" data-i18n="Kontrahenci">Kontrahenci</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item <?php echo ($currentPage == 'app-reports.php') ? 'active' : ''; ?>">
|
||||
<a href="app-reports.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-bar-chart-alt-2"></i>
|
||||
<div class="text-truncate" data-i18n="Raporty">Raporty</div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li
|
||||
class="menu-item <?php echo ($currentPage == 'sys-export.php' || $currentPage == 'sys-dictionaries.php' || $currentPage == 'sys-settings.php' || $currentPage == 'sys-logs.php') ? 'active open' : ''; ?>">
|
||||
|
||||
20
prototype/invoice/sys-dictionaries.php
Normal file
20
prototype/invoice/sys-dictionaries.php
Normal file
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y d-flex flex-column justify-content-center">
|
||||
<div class="card p-0 mb-4 h-100 mt-5 border-0 shadow-sm" style="min-height: 400px;">
|
||||
<div class="card-body d-flex flex-column justify-content-center align-items-center p-5 text-center">
|
||||
<h1 class="display-1 text-primary mb-4"><i class="bx bx-book-bookmark"></i></h1>
|
||||
<h3 class="mb-2">Moduł "Słowniki" pojawi się wkrótce!</h3>
|
||||
<p class="text-muted mb-4 fs-5">
|
||||
Obecnie intensywnie pracujemy nad nowymi funkcjonalnościami dla tego modułu.<br>
|
||||
Zaglądaj tu regularnie, aby być na bieżąco z nowościami!
|
||||
</p>
|
||||
<a href="index.php" class="btn btn-primary btn-lg mt-3">Wróć na Kokpit</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
20
prototype/invoice/sys-export.php
Normal file
20
prototype/invoice/sys-export.php
Normal file
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y d-flex flex-column justify-content-center">
|
||||
<div class="card p-0 mb-4 h-100 mt-5 border-0 shadow-sm" style="min-height: 400px;">
|
||||
<div class="card-body d-flex flex-column justify-content-center align-items-center p-5 text-center">
|
||||
<h1 class="display-1 text-primary mb-4"><i class="bx bx-export"></i></h1>
|
||||
<h3 class="mb-2">Moduł "Eksport dokumentów" pojawi się wkrótce!</h3>
|
||||
<p class="text-muted mb-4 fs-5">
|
||||
Obecnie intensywnie pracujemy nad nowymi funkcjonalnościami dla tego modułu.<br>
|
||||
Zaglądaj tu regularnie, aby być na bieżąco z nowościami!
|
||||
</p>
|
||||
<a href="index.php" class="btn btn-primary btn-lg mt-3">Wróć na Kokpit</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
20
prototype/invoice/sys-logs.php
Normal file
20
prototype/invoice/sys-logs.php
Normal file
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y d-flex flex-column justify-content-center">
|
||||
<div class="card p-0 mb-4 h-100 mt-5 border-0 shadow-sm" style="min-height: 400px;">
|
||||
<div class="card-body d-flex flex-column justify-content-center align-items-center p-5 text-center">
|
||||
<h1 class="display-1 text-primary mb-4"><i class="bx bx-list-ul"></i></h1>
|
||||
<h3 class="mb-2">Moduł "Logi zdarzeń" pojawi się wkrótce!</h3>
|
||||
<p class="text-muted mb-4 fs-5">
|
||||
Obecnie intensywnie pracujemy nad nowymi funkcjonalnościami dla tego modułu.<br>
|
||||
Zaglądaj tu regularnie, aby być na bieżąco z nowościami!
|
||||
</p>
|
||||
<a href="index.php" class="btn btn-primary btn-lg mt-3">Wróć na Kokpit</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -185,4 +185,4 @@ include '../../header-invoice.php';
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$enablePrototypeComments = false;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
@@ -184,4 +184,4 @@ include '../../header-invoice.php';
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user