Project-Pro/orderPRO
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Jacek Pyziak
2026-04-04 18:20:13 +02:00
parent e95c4967d2
commit 7feda58a97
18 changed files with 845 additions and 325 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
resources/scss/app.css
View File

@@ -927,7 +927,9 @@ a {
align-items: center;
gap: 9px;
white-space: nowrap;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.sidebar__group-toggle::-webkit-details-marker {
@@ -1361,7 +1363,9 @@ h4.section-title::before {
border-radius: 6px;
color: #64748b;
cursor: grab;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
font-weight: 700;
font-size: 12px;
}
@@ -1979,7 +1983,8 @@ h4.section-title::before {
height: 48px;
border-radius: 4px;
border: 1px solid #dbe3ef;
object-fit: cover;
-o-object-fit: cover;
object-fit: cover;
background: #fff;
}
.orders-product__thumb--empty {
@@ -2019,7 +2024,8 @@ h4.section-title::before {
top: auto;
width: 350px;
max-height: 350px;
object-fit: contain;
-o-object-fit: contain;
object-fit: contain;
border-radius: 8px;
background: #fff;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
@@ -2300,7 +2306,8 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
height: 44px;
border-radius: 6px;
border: 1px solid #dbe3ef;
object-fit: cover;
-o-object-fit: cover;
object-fit: cover;
}
.order-item-thumb--empty {
@@ -2547,7 +2554,8 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
width: 60px;
height: 60px;
border-radius: 6px;
object-fit: cover;
-o-object-fit: cover;
object-fit: cover;
border: 1px solid var(--c-border);
background: #f8fafc;
}
@@ -2585,7 +2593,8 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
display: block;
width: 100%;
max-height: 70vh;
object-fit: contain;
-o-object-fit: contain;
object-fit: contain;
border-radius: 8px;
background: #f8fafc;
}
@@ -2613,7 +2622,8 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
.product-image-card__thumb {
width: 100%;
height: 160px;
object-fit: cover;
-o-object-fit: cover;
object-fit: cover;
display: block;
}
@@ -2780,7 +2790,9 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
cursor: pointer;
color: var(--c-muted, #888);
list-style: none;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
}
.product-show-image-path summary::-webkit-details-marker {
@@ -2802,7 +2814,8 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
.product-show-image {
width: 100%;
max-height: 260px;
object-fit: cover;
-o-object-fit: cover;
object-fit: cover;
border-radius: 8px;
border: 1px solid #d9e0ea;
}
@@ -2821,7 +2834,9 @@ details[open] > .order-statuses-side__title .order-statuses-side__arrow {
align-items: center;
justify-content: space-between;
cursor: pointer;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
min-height: 34px;
}
.searchable-select__trigger::after {
@@ -3344,4 +3359,4 @@ body.no-scroll {
padding: 12px 16px;
overflow-y: auto;
flex: 1;
}
}/*# sourceMappingURL=app.css.map */

2
resources/scss/app.css.map
View File

File diff suppressed because one or more lines are too long

58
resources/scss/login.css
View File

@@ -1,6 +1,8 @@
:root {
--c-primary: #6690f4;
--c-primary-dark: #3164db;
--c-action-primary: #0f766e;
--c-action-primary-dark: #0b5f59;
--c-bg: #f4f6f9;
--c-surface: #ffffff;
--c-text: #4e5e6a;
@@ -9,6 +11,7 @@
--c-border: #b0bec5;
--c-danger: #cc0000;
--focus-ring: 0 0 0 3px rgba(102, 144, 244, 0.15);
--focus-ring-action: 0 0 0 3px rgba(15, 118, 110, 0.18);
--shadow-card: 0 1px 4px rgba(0, 0, 0, 0.06);
}
@@ -29,11 +32,11 @@
.btn--primary {
color: #ffffff;
background: var(--c-primary);
background: var(--c-action-primary);
}
.btn--primary:hover {
background: var(--c-primary-dark);
background: var(--c-action-primary-dark);
}
.btn--secondary {
@@ -68,22 +71,28 @@
width: 100%;
}
.btn--disabled {
opacity: 0.3;
cursor: not-allowed;
pointer-events: none;
}
.btn:active {
transform: translateY(1px);
}
.btn:focus-visible {
outline: none;
box-shadow: var(--focus-ring);
border-color: var(--c-primary);
box-shadow: var(--focus-ring-action);
border-color: var(--c-action-primary);
}
.form-control {
width: 100%;
min-height: 34px;
min-height: 30px;
border: 1px solid var(--c-border);
border-radius: 8px;
padding: 5px 10px;
border-radius: 6px;
padding: 4px 8px;
font: inherit;
color: var(--c-text-strong);
background: #ffffff;
@@ -238,6 +247,41 @@
background: #edf2ff;
}
.receipt-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 2px solid var(--c-text-strong);
}
.receipt-header__seller {
flex: 1;
}
.receipt-header__seller strong {
font-size: 14px;
display: block;
margin-bottom: 4px;
}
.receipt-header__title {
text-align: right;
}
.receipt-header__title h1 {
font-size: 18px;
font-weight: 700;
margin-bottom: 4px;
}
.receipt-print {
max-width: 700px;
margin: 0 auto;
}
@media print {
.receipt-print {
max-width: 100%;
}
}
:root {
--shadow-card: 0 20px 50px rgba(22, 34, 58, 0.14);
}

2
resources/scss/login.css.map
View File

File diff suppressed because one or more lines are too long

221
resources/views/settings/email-templates-form.php Normal file
View File

@@ -0,0 +1,221 @@
<?php
$template = is_array($template ?? null) ? $template : null;
$isEdit = $template !== null;
$mailboxes = is_array($mailboxes ?? null) ? $mailboxes : [];
$variableGroups = is_array($variableGroups ?? null) ? $variableGroups : [];
$attachmentTypes = is_array($attachmentTypes ?? null) ? $attachmentTypes : [];
?>
<section class="card">
<h2 class="section-title"><?= $isEdit ? 'Edytuj szablon e-mail' : 'Dodaj szablon e-mail' ?></h2>
<p class="muted mt-12">Skonfiguruj temat, tresc i zmienne, ktore beda podstawiane podczas wysylki.</p>
<?php if (!empty($errorMessage)): ?>
<div class="alert alert--danger mt-12" role="alert"><?= $e((string) $errorMessage) ?></div>
<?php endif; ?>
<?php if (!empty($successMessage)): ?>
<div class="alert alert--success mt-12" role="status"><?= $e((string) $successMessage) ?></div>
<?php endif; ?>
</section>
<section class="card mt-16">
<form action="/settings/email-templates/save" method="post" novalidate class="mt-12" id="js-template-form">
<input type="hidden" name="_token" value="<?= $e($csrfToken ?? '') ?>">
<input type="hidden" name="body_html" id="js-body-html" value="<?= $e((string) ($template['body_html'] ?? '')) ?>">
<?php if ($isEdit): ?>
<input type="hidden" name="id" value="<?= (int) ($template['id'] ?? 0) ?>">
<?php endif; ?>
<div class="form-grid-2">
<label class="form-field">
<span class="field-label">Nazwa szablonu *</span>
<input class="form-control" type="text" name="name" maxlength="200" required value="<?= $e((string) ($template['name'] ?? '')) ?>" placeholder="np. Potwierdzenie zamowienia">
</label>
<label class="form-field">
<span class="field-label">Skrzynka nadawcza</span>
<select class="form-control" name="mailbox_id">
<option value="">- domyslna -</option>
<?php foreach ($mailboxes as $mailbox): ?>
<?php $mailboxId = (int) ($mailbox['id'] ?? 0); ?>
<option value="<?= $mailboxId ?>"<?= ((int) ($template['mailbox_id'] ?? 0)) === $mailboxId ? ' selected' : '' ?>>
<?= $e((string) ($mailbox['name'] ?? '')) ?> (<?= $e((string) ($mailbox['sender_email'] ?? '')) ?>)
</option>
<?php endforeach; ?>
</select>
</label>
</div>
<div class="form-grid-2 mt-0">
<label class="form-field">
<span class="field-label">Temat wiadomosci *</span>
<input class="form-control" type="text" name="subject" maxlength="500" required value="<?= $e((string) ($template['subject'] ?? '')) ?>" placeholder="np. Potwierdzenie zamowienia {{zamowienie.numer}}">
</label>
<div class="form-field" style="display:flex;align-items:flex-end;gap:8px">
<label style="display:flex;align-items:center;gap:6px;flex-direction:row">
<input type="checkbox" name="is_active" value="1"<?= $isEdit ? (((int) ($template['is_active'] ?? 0)) === 1 ? ' checked' : '') : ' checked' ?>>
<span class="field-label" style="margin:0">Aktywny</span>
</label>
</div>
</div>
<div class="form-grid-2 mt-0">
<label class="form-field">
<span class="field-label">Zalacznik nr 1</span>
<select class="form-control" name="attachment_1">
<option value="">- brak -</option>
<?php foreach ($attachmentTypes as $attachmentKey => $attachmentLabel): ?>
<option value="<?= $e($attachmentKey) ?>"<?= ((string) ($template['attachment_1'] ?? '')) === $attachmentKey ? ' selected' : '' ?>><?= $e($attachmentLabel) ?></option>
<?php endforeach; ?>
</select>
</label>
<div class="form-field"></div>
</div>
<div class="mt-12">
<span class="field-label">Tresc wiadomosci *</span>
<p class="muted mt-4">Dostepne sa zmienne przesylki: <code>{{przesylka.numer}}</code> oraz <code>{{przesylka.link_sledzenia}}</code>.</p>
<div class="email-tpl-editor-wrap mt-4">
<div class="email-tpl-toolbar">
<div class="email-tpl-var-dropdown">
<button type="button" class="btn btn--sm btn--secondary" id="js-var-toggle">Wstaw zmienna</button>
<div class="email-tpl-var-panel" id="js-var-panel" style="display:none">
<?php foreach ($variableGroups as $groupKey => $group): ?>
<div class="email-var-group">
<div class="email-var-group__label"><?= $e((string) ($group['label'] ?? '')) ?></div>
<?php foreach (($group['vars'] ?? []) as $varKey => $varDesc): ?>
<button type="button" class="email-var-item" data-var="{{<?= $e($groupKey . '.' . $varKey) ?>}}" title="<?= $e((string) $varDesc) ?>">
{{<?= $e($groupKey . '.' . $varKey) ?>}}
</button>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
</div>
</div>
<button type="button" class="btn btn--sm btn--secondary" id="js-preview-btn">Podglad</button>
</div>
<div id="js-quill-editor"></div>
</div>
</div>
<div class="form-actions mt-16">
<button type="submit" class="btn btn--primary"><?= $isEdit ? 'Zapisz zmiany' : 'Dodaj szablon' ?></button>
<a href="/settings/email-templates" class="btn btn--secondary">Powrot do listy</a>
</div>
</form>
</section>
<div class="modal-overlay" id="js-preview-overlay" style="display:none">
<div class="modal-box">
<div class="modal-box__header">
<h3 class="modal-box__title">Podglad szablonu</h3>
<button type="button" class="modal-box__close" id="js-preview-close">&times;</button>
</div>
<div class="modal-box__body">
<div class="mt-4"><strong>Temat:</strong> <span id="js-preview-subject"></span></div>
<hr class="mt-8 mb-8">
<div id="js-preview-body"></div>
</div>
</div>
</div>
<link href="https://cdn.quilljs.com/2.0.3/quill.snow.css" rel="stylesheet">
<script src="https://cdn.quilljs.com/2.0.3/quill.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var csrfToken = <?= json_encode($csrfToken ?? '', JSON_HEX_TAG) ?>;
var quill = new Quill('#js-quill-editor', {
theme: 'snow',
modules: {
toolbar: [
[{ header: [1, 2, 3, false] }],
['bold', 'italic', 'underline', 'strike'],
[{ color: [] }, { background: [] }],
[{ align: [] }],
[{ list: 'ordered' }, { list: 'bullet' }],
['link'],
['clean']
]
},
placeholder: 'Wpisz tresc wiadomosci...'
});
var existingHtml = document.getElementById('js-body-html').value;
if (existingHtml) {
quill.root.innerHTML = existingHtml;
}
var form = document.getElementById('js-template-form');
form.addEventListener('submit', function() {
document.getElementById('js-body-html').value = quill.root.innerHTML;
});
var varToggle = document.getElementById('js-var-toggle');
var varPanel = document.getElementById('js-var-panel');
varToggle.addEventListener('click', function(event) {
event.stopPropagation();
varPanel.style.display = varPanel.style.display === 'none' ? 'block' : 'none';
});
document.addEventListener('click', function(event) {
if (!varPanel.contains(event.target) && event.target !== varToggle) {
varPanel.style.display = 'none';
}
});
varPanel.addEventListener('click', function(event) {
var button = event.target.closest('.email-var-item');
if (!button) {
return;
}
var variableText = button.getAttribute('data-var');
var range = quill.getSelection(true);
quill.insertText(range.index, variableText);
quill.setSelection(range.index + variableText.length);
varPanel.style.display = 'none';
});
var previewBtn = document.getElementById('js-preview-btn');
var previewOverlay = document.getElementById('js-preview-overlay');
var previewClose = document.getElementById('js-preview-close');
var previewSubject = document.getElementById('js-preview-subject');
var previewBody = document.getElementById('js-preview-body');
previewBtn.addEventListener('click', function() {
var subjectVal = form.querySelector('[name="subject"]').value;
var bodyVal = quill.root.innerHTML;
previewBtn.disabled = true;
previewBtn.textContent = 'Ladowanie...';
var formData = new FormData();
formData.append('_token', csrfToken);
formData.append('subject', subjectVal);
formData.append('body_html', bodyVal);
fetch('/settings/email-templates/preview', { method: 'POST', body: formData })
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
previewSubject.textContent = data.subject;
previewBody.innerHTML = data.body_html;
previewOverlay.style.display = 'flex';
}
})
.catch(function() {})
.finally(function() {
previewBtn.disabled = false;
previewBtn.textContent = 'Podglad';
});
});
previewClose.addEventListener('click', function() {
previewOverlay.style.display = 'none';
});
previewOverlay.addEventListener('click', function(event) {
if (event.target === previewOverlay) {
previewOverlay.style.display = 'none';
}
});
});
</script>

232
resources/views/settings/email-templates.php
View File

@@ -1,14 +1,13 @@
<?php
$templates = is_array($templates ?? null) ? $templates : [];
$mailboxes = is_array($mailboxes ?? null) ? $mailboxes : [];
$et = is_array($editTemplate ?? null) ? $editTemplate : null;
$isEdit = $et !== null;
$variableGroups = is_array($variableGroups ?? null) ? $variableGroups : [];
$attachmentTypes = is_array($attachmentTypes ?? null) ? $attachmentTypes : [];
?>
<section class="card">
<h2 class="section-title">Szablony e-mail</h2>
<div class="section-header">
<h2 class="section-title">Szablony e-mail</h2>
<a href="/settings/email-templates/create" class="btn btn--primary btn--sm">Dodaj szablon</a>
</div>
<p class="muted mt-12">Szablony wiadomosci e-mail z edytorem i systemem zmiennych.</p>
<?php if (!empty($errorMessage)): ?>
@@ -23,7 +22,7 @@ $attachmentTypes = is_array($attachmentTypes ?? null) ? $attachmentTypes : [];
<h3 class="section-title">Lista szablonow</h3>
<?php if (count($templates) === 0): ?>
<p class="muted mt-12">Brak szablonow. Dodaj pierwszy szablon ponizej.</p>
<p class="muted mt-12">Brak szablonow. Kliknij "Dodaj szablon", aby utworzyc pierwszy.</p>
<?php else: ?>
<div class="table-wrap mt-12">
<table class="table">
@@ -39,11 +38,12 @@ $attachmentTypes = is_array($attachmentTypes ?? null) ? $attachmentTypes : [];
</thead>
<tbody>
<?php foreach ($templates as $tpl): ?>
<tr data-id="<?= (int) ($tpl['id'] ?? 0) ?>">
<?php $templateId = (int) ($tpl['id'] ?? 0); ?>
<tr data-id="<?= $templateId ?>">
<td><?= $e((string) ($tpl['name'] ?? '')) ?></td>
<td><?= $e((string) ($tpl['subject'] ?? '')) ?></td>
<td><?= $e((string) ($tpl['mailbox_name'] ?? '—')) ?></td>
<td><?= isset($tpl['attachment_1'], $attachmentTypes[$tpl['attachment_1']]) ? $e($attachmentTypes[$tpl['attachment_1']]) : '—' ?></td>
<td><?= $e((string) ($tpl['mailbox_name'] ?? '-')) ?></td>
<td><?= isset($tpl['attachment_1'], $attachmentTypes[$tpl['attachment_1']]) ? $e($attachmentTypes[$tpl['attachment_1']]) : '-' ?></td>
<td>
<?php if (((int) ($tpl['is_active'] ?? 0)) === 1): ?>
<span class="badge badge--success js-status-badge">Aktywny</span>
@@ -52,20 +52,20 @@ $attachmentTypes = is_array($attachmentTypes ?? null) ? $attachmentTypes : [];
<?php endif; ?>
</td>
<td style="white-space:nowrap">
<a href="/settings/email-templates?edit=<?= (int) ($tpl['id'] ?? 0) ?>" class="btn btn--sm btn--secondary">Edytuj</a>
<a href="/settings/email-templates/edit?id=<?= $templateId ?>" class="btn btn--sm btn--secondary">Edytuj</a>
<form action="/settings/email-templates/duplicate" method="post" style="display:inline">
<input type="hidden" name="_token" value="<?= $e($csrfToken ?? '') ?>">
<input type="hidden" name="id" value="<?= (int) ($tpl['id'] ?? 0) ?>">
<input type="hidden" name="id" value="<?= $templateId ?>">
<button type="submit" class="btn btn--sm btn--secondary">Duplikuj</button>
</form>
<button type="button" class="btn btn--sm btn--secondary js-toggle-btn"
data-id="<?= (int) ($tpl['id'] ?? 0) ?>"
data-id="<?= $templateId ?>"
data-active="<?= (int) ($tpl['is_active'] ?? 0) ?>">
<?= ((int) ($tpl['is_active'] ?? 0)) === 1 ? 'Dezaktywuj' : 'Aktywuj' ?>
</button>
<form action="/settings/email-templates/delete" method="post" style="display:inline" class="js-confirm-delete">
<input type="hidden" name="_token" value="<?= $e($csrfToken ?? '') ?>">
<input type="hidden" name="id" value="<?= (int) ($tpl['id'] ?? 0) ?>">
<input type="hidden" name="id" value="<?= $templateId ?>">
<button type="button" class="btn btn--sm btn--danger js-delete-btn">Usun</button>
</form>
</td>
@@ -77,211 +77,10 @@ $attachmentTypes = is_array($attachmentTypes ?? null) ? $attachmentTypes : [];
<?php endif; ?>
</section>
<section class="card mt-16">
<h3 class="section-title"><?= $isEdit ? 'Edytuj szablon' : 'Dodaj szablon' ?></h3>
<form action="/settings/email-templates/save" method="post" novalidate class="mt-12" id="js-template-form">
<input type="hidden" name="_token" value="<?= $e($csrfToken ?? '') ?>">
<input type="hidden" name="body_html" id="js-body-html" value="<?= $e((string) ($et['body_html'] ?? '')) ?>">
<?php if ($isEdit): ?>
<input type="hidden" name="id" value="<?= (int) ($et['id'] ?? 0) ?>">
<?php endif; ?>
<div class="form-grid-2">
<label class="form-field">
<span class="field-label">Nazwa szablonu *</span>
<input class="form-control" type="text" name="name" maxlength="200" required value="<?= $e((string) ($et['name'] ?? '')) ?>" placeholder="np. Potwierdzenie zamowienia">
</label>
<label class="form-field">
<span class="field-label">Skrzynka nadawcza</span>
<select class="form-control" name="mailbox_id">
<option value="">— domyslna —</option>
<?php foreach ($mailboxes as $mb): ?>
<option value="<?= (int) ($mb['id'] ?? 0) ?>"<?= ((int) ($et['mailbox_id'] ?? 0)) === (int) ($mb['id'] ?? 0) ? ' selected' : '' ?>>
<?= $e((string) ($mb['name'] ?? '')) ?> (<?= $e((string) ($mb['sender_email'] ?? '')) ?>)
</option>
<?php endforeach; ?>
</select>
</label>
</div>
<div class="form-grid-2 mt-0">
<label class="form-field">
<span class="field-label">Temat wiadomosci *</span>
<input class="form-control" type="text" name="subject" maxlength="500" required value="<?= $e((string) ($et['subject'] ?? '')) ?>" placeholder="np. Potwierdzenie zamowienia {{zamowienie.numer}}">
</label>
<div class="form-field" style="display:flex;align-items:flex-end;gap:8px">
<label style="display:flex;align-items:center;gap:6px;flex-direction:row">
<input type="checkbox" name="is_active" value="1"<?= $isEdit ? (((int) ($et['is_active'] ?? 0)) === 1 ? ' checked' : '') : ' checked' ?>>
<span class="field-label" style="margin:0">Aktywny</span>
</label>
</div>
</div>
<div class="form-grid-2 mt-0">
<label class="form-field">
<span class="field-label">Zalacznik nr 1</span>
<select class="form-control" name="attachment_1">
<option value="">— brak —</option>
<?php foreach ($attachmentTypes as $atKey => $atLabel): ?>
<option value="<?= $e($atKey) ?>"<?= ((string) ($et['attachment_1'] ?? '')) === $atKey ? ' selected' : '' ?>><?= $e($atLabel) ?></option>
<?php endforeach; ?>
</select>
</label>
<div class="form-field"></div>
</div>
<div class="mt-12">
<span class="field-label">Tresc wiadomosci *</span>
<p class="muted mt-4">Dostepne sa zmienne przesylki: <code>{{przesylka.numer}}</code> oraz <code>{{przesylka.link_sledzenia}}</code>.</p>
<div class="email-tpl-editor-wrap mt-4">
<div class="email-tpl-toolbar">
<div class="email-tpl-var-dropdown">
<button type="button" class="btn btn--sm btn--secondary" id="js-var-toggle">Wstaw zmienna ▾</button>
<div class="email-tpl-var-panel" id="js-var-panel" style="display:none">
<?php foreach ($variableGroups as $groupKey => $group): ?>
<div class="email-var-group">
<div class="email-var-group__label"><?= $e((string) ($group['label'] ?? '')) ?></div>
<?php foreach (($group['vars'] ?? []) as $varKey => $varDesc): ?>
<button type="button" class="email-var-item" data-var="{{<?= $e($groupKey . '.' . $varKey) ?>}}" title="<?= $e((string) $varDesc) ?>">
{{<?= $e($groupKey . '.' . $varKey) ?>}}
</button>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
</div>
</div>
<button type="button" class="btn btn--sm btn--secondary" id="js-preview-btn">Podglad</button>
</div>
<div id="js-quill-editor"></div>
</div>
</div>
<div class="form-actions mt-16">
<button type="submit" class="btn btn--primary"><?= $isEdit ? 'Zapisz zmiany' : 'Dodaj szablon' ?></button>
<?php if ($isEdit): ?>
<a href="/settings/email-templates" class="btn btn--secondary">Anuluj</a>
<?php endif; ?>
</div>
</form>
</section>
<div class="modal-overlay" id="js-preview-overlay" style="display:none">
<div class="modal-box">
<div class="modal-box__header">
<h3 class="modal-box__title">Podglad szablonu</h3>
<button type="button" class="modal-box__close" id="js-preview-close">&times;</button>
</div>
<div class="modal-box__body">
<div class="mt-4"><strong>Temat:</strong> <span id="js-preview-subject"></span></div>
<hr class="mt-8 mb-8">
<div id="js-preview-body"></div>
</div>
</div>
</div>
<link href="https://cdn.quilljs.com/2.0.3/quill.snow.css" rel="stylesheet">
<script src="https://cdn.quilljs.com/2.0.3/quill.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var csrfToken = <?= json_encode($csrfToken ?? '', JSON_HEX_TAG) ?>;
// Quill editor
var quill = new Quill('#js-quill-editor', {
theme: 'snow',
modules: {
toolbar: [
[{ header: [1, 2, 3, false] }],
['bold', 'italic', 'underline', 'strike'],
[{ color: [] }, { background: [] }],
[{ align: [] }],
[{ list: 'ordered' }, { list: 'bullet' }],
['link'],
['clean']
]
},
placeholder: 'Wpisz tresc wiadomosci...'
});
// Load existing content
var existingHtml = document.getElementById('js-body-html').value;
if (existingHtml) {
quill.root.innerHTML = existingHtml;
}
// Sync on submit
var form = document.getElementById('js-template-form');
form.addEventListener('submit', function() {
document.getElementById('js-body-html').value = quill.root.innerHTML;
});
// Variable panel toggle
var varToggle = document.getElementById('js-var-toggle');
var varPanel = document.getElementById('js-var-panel');
varToggle.addEventListener('click', function(e) {
e.stopPropagation();
varPanel.style.display = varPanel.style.display === 'none' ? 'block' : 'none';
});
document.addEventListener('click', function(e) {
if (!varPanel.contains(e.target) && e.target !== varToggle) {
varPanel.style.display = 'none';
}
});
// Insert variable into Quill
varPanel.addEventListener('click', function(e) {
var btn = e.target.closest('.email-var-item');
if (!btn) return;
var varText = btn.getAttribute('data-var');
var range = quill.getSelection(true);
quill.insertText(range.index, varText);
quill.setSelection(range.index + varText.length);
varPanel.style.display = 'none';
});
// Preview
var previewBtn = document.getElementById('js-preview-btn');
var previewOverlay = document.getElementById('js-preview-overlay');
var previewClose = document.getElementById('js-preview-close');
var previewSubject = document.getElementById('js-preview-subject');
var previewBody = document.getElementById('js-preview-body');
previewBtn.addEventListener('click', function() {
var subjectVal = form.querySelector('[name="subject"]').value;
var bodyVal = quill.root.innerHTML;
previewBtn.disabled = true;
previewBtn.textContent = 'Ladowanie...';
var fd = new FormData();
fd.append('_token', csrfToken);
fd.append('subject', subjectVal);
fd.append('body_html', bodyVal);
fetch('/settings/email-templates/preview', { method: 'POST', body: fd })
.then(function(r) { return r.json(); })
.then(function(data) {
if (data.success) {
previewSubject.textContent = data.subject;
previewBody.innerHTML = data.body_html;
previewOverlay.style.display = 'flex';
}
})
.catch(function() {})
.finally(function() {
previewBtn.disabled = false;
previewBtn.textContent = 'Podglad';
});
});
previewClose.addEventListener('click', function() {
previewOverlay.style.display = 'none';
});
previewOverlay.addEventListener('click', function(e) {
if (e.target === previewOverlay) previewOverlay.style.display = 'none';
});
// Toggle status (AJAX)
document.querySelectorAll('.js-toggle-btn').forEach(function(btn) {
btn.addEventListener('click', function() {
var id = this.getAttribute('data-id');
@@ -312,7 +111,6 @@ document.addEventListener('DOMContentLoaded', function() {
});
});
// Delete with OrderProAlerts
document.querySelectorAll('.js-delete-btn').forEach(function(btn) {
btn.addEventListener('click', function() {
var delForm = this.closest('form');
@@ -323,9 +121,7 @@ document.addEventListener('DOMContentLoaded', function() {
function() { delForm.submit(); }
);
} else {
if (confirm('Czy na pewno chcesz usunac ten szablon e-mail?')) {
delForm.submit();
}
delForm.submit();
}
});
});