Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
362dcb49bb | ||
|
|
fd86c37615 | ||
|
|
b6a9bec423 |
@ -1,403 +1,78 @@
|
||||
:root {
|
||||
--bg: #f9fafb;
|
||||
--surface: #ffffff;
|
||||
--surface-muted: #f3f4f6;
|
||||
--border: #e5e7eb;
|
||||
--text: #111827;
|
||||
--muted: #6b7280;
|
||||
--accent: #2563eb;
|
||||
--accent-soft: #dbeafe;
|
||||
--success: #059669;
|
||||
--warning: #d97706;
|
||||
--info: #0284c7;
|
||||
--danger: #dc2626;
|
||||
--radius-sm: 8px;
|
||||
--radius-md: 12px;
|
||||
--radius-lg: 16px;
|
||||
--shadow-sm: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px rgba(0,0,0,0.06);
|
||||
--shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
||||
background-size: 400% 400%;
|
||||
animation: gradient 15s ease infinite;
|
||||
color: #212529;
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
min-height: 100vh;
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-family: "Inter", system-ui, -apple-system, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.main-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 100vh;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
a { color: var(--accent); text-decoration: none; transition: all 0.2s; }
|
||||
a:hover { opacity: 0.8; }
|
||||
|
||||
.card {
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border);
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow-sm);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@keyframes gradient {
|
||||
0% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
.card-header {
|
||||
background: #f9fafb;
|
||||
border-bottom: 1px solid var(--border);
|
||||
font-weight: 600;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
background: rgba(255, 255, 255, 0.85);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
border-radius: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 85vh;
|
||||
box-shadow: 0 20px 40px rgba(0,0,0,0.2);
|
||||
backdrop-filter: blur(15px);
|
||||
-webkit-backdrop-filter: blur(15px);
|
||||
overflow: hidden;
|
||||
.card-body { padding: 1.5rem; }
|
||||
|
||||
.btn {
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: var(--radius-sm);
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.chat-header {
|
||||
padding: 1.5rem;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
font-weight: 700;
|
||||
font-size: 1.1rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.btn-primary { background: var(--accent); color: white; border: none; }
|
||||
.btn-primary:hover { background: #1d4ed8; }
|
||||
|
||||
.chat-messages {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 1.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
.btn-outline-primary { border: 1px solid var(--accent); color: var(--accent); }
|
||||
|
||||
/* Custom Scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.message {
|
||||
max-width: 85%;
|
||||
padding: 0.85rem 1.1rem;
|
||||
border-radius: 16px;
|
||||
line-height: 1.5;
|
||||
font-size: 0.95rem;
|
||||
box-shadow: 0 4px 15px rgba(0,0,0,0.05);
|
||||
animation: fadeIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; transform: translateY(20px) scale(0.95); }
|
||||
to { opacity: 1; transform: translateY(0) scale(1); }
|
||||
}
|
||||
|
||||
.message.visitor {
|
||||
align-self: flex-end;
|
||||
background: linear-gradient(135deg, #212529 0%, #343a40 100%);
|
||||
color: #fff;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.message.bot {
|
||||
align-self: flex-start;
|
||||
background: #ffffff;
|
||||
color: #212529;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
.chat-input-area {
|
||||
padding: 1.25rem;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.chat-input-area form {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.chat-input-area input {
|
||||
flex: 1;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
border-radius: 12px;
|
||||
padding: 0.75rem 1rem;
|
||||
outline: none;
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.chat-input-area input:focus {
|
||||
border-color: #23a6d5;
|
||||
box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.2);
|
||||
}
|
||||
|
||||
.chat-input-area button {
|
||||
background: #212529;
|
||||
color: #fff;
|
||||
border: none;
|
||||
padding: 0.75rem 1.5rem;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.chat-input-area button:hover {
|
||||
background: #000;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
/* Background Animations */
|
||||
.bg-animations {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.blob {
|
||||
position: absolute;
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 50%;
|
||||
filter: blur(80px);
|
||||
animation: move 20s infinite alternate cubic-bezier(0.45, 0, 0.55, 1);
|
||||
}
|
||||
|
||||
.blob-1 {
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
background: rgba(238, 119, 82, 0.4);
|
||||
}
|
||||
|
||||
.blob-2 {
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
background: rgba(35, 166, 213, 0.4);
|
||||
animation-delay: -7s;
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
.blob-3 {
|
||||
top: 40%;
|
||||
left: 30%;
|
||||
background: rgba(231, 60, 126, 0.3);
|
||||
animation-delay: -14s;
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
@keyframes move {
|
||||
0% { transform: translate(0, 0) rotate(0deg) scale(1); }
|
||||
33% { transform: translate(150px, 100px) rotate(120deg) scale(1.1); }
|
||||
66% { transform: translate(-50px, 200px) rotate(240deg) scale(0.9); }
|
||||
100% { transform: translate(0, 0) rotate(360deg) scale(1); }
|
||||
}
|
||||
|
||||
.header-link {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 8px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.header-link:hover {
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Admin Styles */
|
||||
.admin-container {
|
||||
max-width: 900px;
|
||||
margin: 3rem auto;
|
||||
padding: 2.5rem;
|
||||
background: rgba(255, 255, 255, 0.85);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border-radius: 24px;
|
||||
box-shadow: 0 20px 50px rgba(0,0,0,0.15);
|
||||
border: 1px solid rgba(255, 255, 255, 0.4);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.admin-container h1 {
|
||||
margin-top: 0;
|
||||
color: #212529;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0 8px;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
.table th {
|
||||
background: transparent;
|
||||
border: none;
|
||||
padding: 1rem;
|
||||
color: #6c757d;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.table td {
|
||||
background: #fff;
|
||||
padding: 1rem;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.table tr td:first-child { border-radius: 12px 0 0 12px; }
|
||||
.table tr td:last-child { border-radius: 0 12px 12px 0; }
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.5rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.9rem;
|
||||
.badge {
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 9999px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
width: 100%;
|
||||
padding: 0.75rem 1rem;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
border-radius: 12px;
|
||||
background: #fff;
|
||||
transition: all 0.3s ease;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
outline: none;
|
||||
border-color: #23a6d5;
|
||||
box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.1);
|
||||
}
|
||||
|
||||
.header-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-links {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.admin-card {
|
||||
background: rgba(255, 255, 255, 0.6);
|
||||
padding: 2rem;
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
margin-bottom: 2.5rem;
|
||||
box-shadow: 0 10px 30px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.admin-card h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.btn-delete {
|
||||
background: #dc3545;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-add {
|
||||
background: #212529;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.btn-save {
|
||||
background: #0088cc;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.8rem 1.5rem;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
width: 100%;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.webhook-url {
|
||||
font-size: 0.85em;
|
||||
color: #555;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.history-table-container {
|
||||
overflow-x: auto;
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
padding: 1rem;
|
||||
border-radius: 12px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.history-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.history-table-time {
|
||||
width: 15%;
|
||||
white-space: nowrap;
|
||||
font-size: 0.85em;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.history-table-user {
|
||||
width: 35%;
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.history-table-ai {
|
||||
width: 50%;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.no-messages {
|
||||
text-align: center;
|
||||
color: #777;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-sm);
|
||||
padding: 0.6rem;
|
||||
width: 100%;
|
||||
}
|
||||
@ -1,39 +1,9 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const chatForm = document.getElementById('chat-form');
|
||||
const chatInput = document.getElementById('chat-input');
|
||||
const chatMessages = document.getElementById('chat-messages');
|
||||
|
||||
const appendMessage = (text, sender) => {
|
||||
const msgDiv = document.createElement('div');
|
||||
msgDiv.classList.add('message', sender);
|
||||
msgDiv.textContent = text;
|
||||
chatMessages.appendChild(msgDiv);
|
||||
chatMessages.scrollTop = chatMessages.scrollHeight;
|
||||
};
|
||||
|
||||
chatForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
const message = chatInput.value.trim();
|
||||
if (!message) return;
|
||||
|
||||
appendMessage(message, 'visitor');
|
||||
chatInput.value = '';
|
||||
|
||||
try {
|
||||
const response = await fetch('api/chat.php', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ message })
|
||||
});
|
||||
const data = await response.json();
|
||||
|
||||
// Artificial delay for realism
|
||||
setTimeout(() => {
|
||||
appendMessage(data.reply, 'bot');
|
||||
}, 500);
|
||||
} catch (error) {
|
||||
console.error('Error:', error);
|
||||
appendMessage("Sorry, something went wrong. Please try again.", 'bot');
|
||||
}
|
||||
const toastElList = document.querySelectorAll('.toast');
|
||||
if (toastElList.length > 0 && typeof bootstrap !== 'undefined') {
|
||||
toastElList.forEach((toastEl) => {
|
||||
const toast = new bootstrap.Toast(toastEl);
|
||||
toast.show();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
28
db/migrations/20260306_001_letters.sql
Normal file
28
db/migrations/20260306_001_letters.sql
Normal file
@ -0,0 +1,28 @@
|
||||
CREATE TABLE IF NOT EXISTS surat_masuk (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
nomor_surat VARCHAR(100) NULL,
|
||||
tanggal_surat DATE NOT NULL,
|
||||
pengirim VARCHAR(150) NOT NULL,
|
||||
perihal VARCHAR(200) NOT NULL,
|
||||
departemen_tujuan VARCHAR(120) NOT NULL,
|
||||
status ENUM('baru','diproses','selesai') NOT NULL DEFAULT 'baru',
|
||||
file_path VARCHAR(255) NULL,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||
|
||||
CREATE TABLE IF NOT EXISTS surat_keluar (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
nomor_surat VARCHAR(120) NOT NULL,
|
||||
kode_surat VARCHAR(30) NOT NULL,
|
||||
urut INT NOT NULL,
|
||||
bulan INT NOT NULL,
|
||||
tahun INT NOT NULL,
|
||||
tanggal_surat DATE NOT NULL,
|
||||
tujuan VARCHAR(150) NOT NULL,
|
||||
perihal VARCHAR(200) NOT NULL,
|
||||
departemen_pengirim VARCHAR(120) NOT NULL,
|
||||
status ENUM('draft','review','approved','kirim') NOT NULL DEFAULT 'draft',
|
||||
file_path VARCHAR(255) NULL,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
|
||||
UNIQUE KEY uniq_nomor (nomor_surat)
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||
14
db/migrations/20260306_002_surat_keluar_log.sql
Normal file
14
db/migrations/20260306_002_surat_keluar_log.sql
Normal file
@ -0,0 +1,14 @@
|
||||
-- Add status transition audit trail
|
||||
CREATE TABLE IF NOT EXISTS surat_keluar_log (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
surat_keluar_id INT NOT NULL,
|
||||
old_status VARCHAR(20),
|
||||
new_status VARCHAR(20),
|
||||
user_id INT,
|
||||
note TEXT,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
|
||||
FOREIGN KEY (surat_keluar_id) REFERENCES surat_keluar(id) ON DELETE CASCADE
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||
|
||||
-- Ensure enum has proper values if we needed to update (already has draft, review, approved, kirim)
|
||||
-- Since they exist, we just add the logging table.
|
||||
8
db/migrations/20260306_003_disposisi_surat_masuk.sql
Normal file
8
db/migrations/20260306_003_disposisi_surat_masuk.sql
Normal file
@ -0,0 +1,8 @@
|
||||
CREATE TABLE IF NOT EXISTS disposisi_surat_masuk (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
surat_masuk_id INT NOT NULL,
|
||||
tujuan_departemen VARCHAR(100) NOT NULL,
|
||||
instruksi TEXT,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
|
||||
FOREIGN KEY (surat_masuk_id) REFERENCES surat_masuk(id) ON DELETE CASCADE
|
||||
);
|
||||
19
includes/db_init.php
Normal file
19
includes/db_init.php
Normal file
@ -0,0 +1,19 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/../db/config.php';
|
||||
|
||||
function ensure_tables(): void {
|
||||
static $initialized = false;
|
||||
if ($initialized) {
|
||||
return;
|
||||
}
|
||||
$path = __DIR__ . '/../db/migrations/20260306_001_letters.sql';
|
||||
if (file_exists($path)) {
|
||||
$sql = file_get_contents($path);
|
||||
if ($sql !== false && trim($sql) !== '') {
|
||||
db()->exec($sql);
|
||||
}
|
||||
}
|
||||
$initialized = true;
|
||||
}
|
||||
35
includes/helpers.php
Normal file
35
includes/helpers.php
Normal file
@ -0,0 +1,35 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
function h(?string $value): string {
|
||||
return htmlspecialchars($value ?? '', ENT_QUOTES, 'UTF-8');
|
||||
}
|
||||
|
||||
function roman_month(int $month): string {
|
||||
$roman = [1 => 'I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX', 'X', 'XI', 'XII'];
|
||||
return $roman[$month] ?? '';
|
||||
}
|
||||
|
||||
function format_nomor(string $kode, int $urut, int $bulan, int $tahun): string {
|
||||
$kode = strtoupper(trim($kode));
|
||||
$urutFormatted = str_pad((string)$urut, 3, '0', STR_PAD_LEFT);
|
||||
return $kode . '/' . $urutFormatted . '/' . roman_month($bulan) . '/' . $tahun;
|
||||
}
|
||||
|
||||
function status_badge(string $status, string $type): string {
|
||||
$map = [
|
||||
'masuk' => [
|
||||
'baru' => 'info',
|
||||
'diproses' => 'warning',
|
||||
'selesai' => 'success',
|
||||
],
|
||||
'keluar' => [
|
||||
'draft' => 'info',
|
||||
'review' => 'warning',
|
||||
'approved' => 'success',
|
||||
'kirim' => 'success',
|
||||
],
|
||||
];
|
||||
$key = $map[$type][$status] ?? 'info';
|
||||
return 'badge-soft ' . $key;
|
||||
}
|
||||
84
includes/layout.php
Normal file
84
includes/layout.php
Normal file
@ -0,0 +1,84 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/helpers.php';
|
||||
|
||||
@date_default_timezone_set('Asia/Jakarta');
|
||||
|
||||
function render_header(string $pageTitle, string $active = ''): void {
|
||||
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||
$metaDescription = $projectDescription !== '' ? $projectDescription : 'Aplikasi tata kelola surat internal perusahaan.';
|
||||
$siteTitle = 'SuratFlow';
|
||||
$fullTitle = $pageTitle !== '' ? $pageTitle . ' | ' . $siteTitle : $siteTitle;
|
||||
$cssPath = __DIR__ . '/../assets/css/custom.css';
|
||||
$jsPath = __DIR__ . '/../assets/js/main.js';
|
||||
$cssVer = file_exists($cssPath) ? (string)filemtime($cssPath) : (string)time();
|
||||
$jsVer = file_exists($jsPath) ? (string)filemtime($jsPath) : (string)time();
|
||||
$GLOBALS['asset_js_ver'] = $jsVer;
|
||||
?>
|
||||
<!doctype html>
|
||||
<html lang="id">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title><?= h($fullTitle) ?></title>
|
||||
<meta name="description" content="<?= h($metaDescription) ?>" />
|
||||
<?php if ($projectDescription): ?>
|
||||
<meta property="og:description" content="<?= h($projectDescription) ?>" />
|
||||
<meta property="twitter:description" content="<?= h($projectDescription) ?>" />
|
||||
<?php endif; ?>
|
||||
<?php if ($projectImageUrl): ?>
|
||||
<meta property="og:image" content="<?= h($projectImageUrl) ?>" />
|
||||
<meta property="twitter:image" content="<?= h($projectImageUrl) ?>" />
|
||||
<?php endif; ?>
|
||||
<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=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/assets/css/custom.css?v=<?= h($cssVer) ?>" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-expand-lg navbar-light">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="/index.php">SuratFlow</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="mainNav">
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link <?= $active === 'dashboard' ? 'active' : '' ?>" href="/index.php">Dashboard</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link <?= $active === 'masuk' ? 'active' : '' ?>" href="/surat_masuk.php">Surat Masuk</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link <?= $active === 'keluar' ? 'active' : '' ?>" href="/surat_keluar.php">Surat Keluar</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="tag">Internal • 1 Perusahaan</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main class="container py-4">
|
||||
<?php
|
||||
}
|
||||
|
||||
function render_footer(): void {
|
||||
?>
|
||||
</main>
|
||||
<footer class="container footer">
|
||||
<div class="d-flex flex-wrap justify-content-between align-items-center gap-2">
|
||||
<span>© <?= date('Y') ?> SuratFlow — Tata kelola surat internal.</span>
|
||||
<span>Semua waktu: <?= date('d M Y H:i') ?> WIB</span>
|
||||
</div>
|
||||
</footer>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="/assets/js/main.js?v=<?= h((string)($GLOBALS['asset_js_ver'] ?? time())) ?>"></script>
|
||||
</body>
|
||||
</html>
|
||||
<?php
|
||||
}
|
||||
316
index.php
316
index.php
@ -1,150 +1,178 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@ini_set('display_errors', '1');
|
||||
@error_reporting(E_ALL);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
$phpVersion = PHP_VERSION;
|
||||
$now = date('Y-m-d H:i:s');
|
||||
require_once __DIR__ . '/includes/db_init.php';
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
ensure_tables();
|
||||
|
||||
$pdo = db();
|
||||
|
||||
$statsMasuk = $pdo->query("SELECT status, COUNT(*) as total FROM surat_masuk GROUP BY status")->fetchAll();
|
||||
$statsKeluar = $pdo->query("SELECT status, COUNT(*) as total FROM surat_keluar GROUP BY status")->fetchAll();
|
||||
|
||||
$totalMasuk = (int)$pdo->query("SELECT COUNT(*) FROM surat_masuk")->fetchColumn();
|
||||
$totalKeluar = (int)$pdo->query("SELECT COUNT(*) FROM surat_keluar")->fetchColumn();
|
||||
|
||||
$latestMasuk = $pdo->query("SELECT id, tanggal_surat, pengirim, perihal, status FROM surat_masuk ORDER BY tanggal_surat DESC, id DESC LIMIT 5")->fetchAll();
|
||||
$latestKeluar = $pdo->query("SELECT id, tanggal_surat, tujuan, perihal, nomor_surat, status FROM surat_keluar ORDER BY tanggal_surat DESC, id DESC LIMIT 5")->fetchAll();
|
||||
|
||||
render_header('Dashboard', 'dashboard');
|
||||
?>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>New Style</title>
|
||||
<?php
|
||||
// Read project preview data from environment
|
||||
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||
?>
|
||||
<?php if ($projectDescription): ?>
|
||||
<!-- Meta description -->
|
||||
<meta name="description" content='<?= htmlspecialchars($projectDescription) ?>' />
|
||||
<!-- Open Graph meta tags -->
|
||||
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||
<!-- Twitter meta tags -->
|
||||
<meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||
<?php endif; ?>
|
||||
<?php if ($projectImageUrl): ?>
|
||||
<!-- Open Graph image -->
|
||||
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<!-- Twitter image -->
|
||||
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<?php endif; ?>
|
||||
<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=Inter:wght@400;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
:root {
|
||||
--bg-color-start: #6a11cb;
|
||||
--bg-color-end: #2575fc;
|
||||
--text-color: #ffffff;
|
||||
--card-bg-color: rgba(255, 255, 255, 0.01);
|
||||
--card-border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Inter', sans-serif;
|
||||
background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end));
|
||||
color: var(--text-color);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 100vh;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
body::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M-10 10L110 10M10 -10L10 110" stroke-width="1" stroke="rgba(255,255,255,0.05)"/></svg>');
|
||||
animation: bg-pan 20s linear infinite;
|
||||
z-index: -1;
|
||||
}
|
||||
@keyframes bg-pan {
|
||||
0% { background-position: 0% 0%; }
|
||||
100% { background-position: 100% 100%; }
|
||||
}
|
||||
main {
|
||||
padding: 2rem;
|
||||
}
|
||||
.card {
|
||||
background: var(--card-bg-color);
|
||||
border: 1px solid var(--card-border-color);
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.loader {
|
||||
margin: 1.25rem auto 1.25rem;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 3px solid rgba(255, 255, 255, 0.25);
|
||||
border-top-color: #fff;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
@keyframes spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
.hint {
|
||||
opacity: 0.9;
|
||||
}
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px; height: 1px;
|
||||
padding: 0; margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap; border: 0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 1rem;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
p {
|
||||
margin: 0.5rem 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
code {
|
||||
background: rgba(0,0,0,0.2);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||
}
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 1rem;
|
||||
font-size: 0.8rem;
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div class="card">
|
||||
<h1>Analyzing your requirements and generating your website…</h1>
|
||||
<div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
|
||||
<span class="sr-only">Loading…</span>
|
||||
|
||||
<section class="hero mb-4">
|
||||
<div class="row g-3 align-items-center">
|
||||
<div class="col-lg-8">
|
||||
<h1 class="h4 mb-2">Aplikasi Tata Kelola Surat Internal</h1>
|
||||
<p class="mb-3 text-muted">
|
||||
Kelola surat masuk & surat keluar lintas departemen dengan nomor otomatis, status yang jelas,
|
||||
dan arsip yang mudah ditelusuri.
|
||||
</p>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<a href="/surat_masuk.php" class="btn btn-primary">Catat Surat Masuk</a>
|
||||
<a href="/surat_keluar.php" class="btn btn-outline-secondary">Buat Surat Keluar</a>
|
||||
</div>
|
||||
<p class="hint"><?= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.</p>
|
||||
<p class="hint">This page will update automatically as the plan is implemented.</p>
|
||||
<p>Runtime: PHP <code><?= htmlspecialchars($phpVersion) ?></code> — UTC <code><?= htmlspecialchars($now) ?></code></p>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
Page updated: <?= htmlspecialchars($now) ?> (UTC)
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
<div class="col-lg-4">
|
||||
<div class="card-muted">
|
||||
<div class="section-title mb-2">Ringkasan</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<span class="text-muted">Total Surat Masuk</span>
|
||||
<strong><?= h((string)$totalMasuk) ?></strong>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<span class="text-muted">Total Surat Keluar</span>
|
||||
<strong><?= h((string)$totalKeluar) ?></strong>
|
||||
</div>
|
||||
<div class="mt-3 small text-muted">Nomor surat keluar otomatis: KODE/URUT/BULAN_ROMAWI/TAHUN.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="mb-4">
|
||||
<div class="row g-3">
|
||||
<div class="col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-header">Status Surat Masuk</div>
|
||||
<div class="card-body">
|
||||
<?php if (empty($statsMasuk)): ?>
|
||||
<div class="empty-state">Belum ada data surat masuk.</div>
|
||||
<?php else: ?>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<?php foreach ($statsMasuk as $row): ?>
|
||||
<span class="<?= h(status_badge($row['status'], 'masuk')) ?>">
|
||||
<?= h(ucfirst($row['status'])) ?> · <?= h((string)$row['total']) ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-header">Status Surat Keluar</div>
|
||||
<div class="card-body">
|
||||
<?php if (empty($statsKeluar)): ?>
|
||||
<div class="empty-state">Belum ada data surat keluar.</div>
|
||||
<?php else: ?>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<?php foreach ($statsKeluar as $row): ?>
|
||||
<span class="<?= h(status_badge($row['status'], 'keluar')) ?>">
|
||||
<?= h(ucfirst($row['status'])) ?> · <?= h((string)$row['total']) ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="row g-3">
|
||||
<div class="col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<span>Surat Masuk Terbaru</span>
|
||||
<a href="/surat_masuk.php" class="small text-muted">Lihat semua</a>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (empty($latestMasuk)): ?>
|
||||
<div class="empty-state">Belum ada surat masuk tercatat.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Tanggal</th>
|
||||
<th>Pengirim</th>
|
||||
<th>Perihal</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($latestMasuk as $row): ?>
|
||||
<tr>
|
||||
<td><?= h($row['tanggal_surat']) ?></td>
|
||||
<td><?= h($row['pengirim']) ?></td>
|
||||
<td>
|
||||
<a href="/surat_masuk_view.php?id=<?= h((string)$row['id']) ?>">
|
||||
<?= h($row['perihal']) ?>
|
||||
</a>
|
||||
</td>
|
||||
<td><span class="<?= h(status_badge($row['status'], 'masuk')) ?>"><?= h($row['status']) ?></span></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<span>Surat Keluar Terbaru</span>
|
||||
<a href="/surat_keluar.php" class="small text-muted">Lihat semua</a>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (empty($latestKeluar)): ?>
|
||||
<div class="empty-state">Belum ada surat keluar tercatat.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Tanggal</th>
|
||||
<th>Nomor</th>
|
||||
<th>Perihal</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($latestKeluar as $row): ?>
|
||||
<tr>
|
||||
<td><?= h($row['tanggal_surat']) ?></td>
|
||||
<td>
|
||||
<a href="/surat_keluar_view.php?id=<?= h((string)$row['id']) ?>">
|
||||
<?= h($row['nomor_surat']) ?>
|
||||
</a>
|
||||
</td>
|
||||
<td><?= h($row['perihal']) ?></td>
|
||||
<td><span class="<?= h(status_badge($row['status'], 'keluar')) ?>"><?= h($row['status']) ?></span></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
|
||||
219
surat_keluar.php
Normal file
219
surat_keluar.php
Normal file
@ -0,0 +1,219 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/db_init.php';
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
require_once __DIR__ . '/includes/helpers.php';
|
||||
|
||||
ensure_tables();
|
||||
|
||||
$pdo = db();
|
||||
$errors = [];
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
$kode = trim($_POST['kode_surat'] ?? '');
|
||||
$tanggal = $_POST['tanggal_surat'] ?? '';
|
||||
$tujuan = trim($_POST['tujuan'] ?? '');
|
||||
$perihal = trim($_POST['perihal'] ?? '');
|
||||
$departemen = trim($_POST['departemen_pengirim'] ?? '');
|
||||
$status = $_POST['status'] ?? 'draft';
|
||||
|
||||
if ($kode === '') { $errors[] = 'Kode surat wajib diisi.'; }
|
||||
if ($tanggal === '') { $errors[] = 'Tanggal surat wajib diisi.'; }
|
||||
if ($tujuan === '') { $errors[] = 'Tujuan surat wajib diisi.'; }
|
||||
if ($perihal === '') { $errors[] = 'Perihal wajib diisi.'; }
|
||||
if ($departemen === '') { $errors[] = 'Departemen pengirim wajib diisi.'; }
|
||||
|
||||
$filePath = null;
|
||||
if (!empty($_FILES['lampiran']['name'])) {
|
||||
if ($_FILES['lampiran']['error'] === UPLOAD_ERR_OK) {
|
||||
if ($_FILES['lampiran']['size'] <= 8 * 1024 * 1024) {
|
||||
$ext = strtolower(pathinfo($_FILES['lampiran']['name'], PATHINFO_EXTENSION));
|
||||
$allowed = ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'];
|
||||
if (in_array($ext, $allowed, true)) {
|
||||
$safeName = preg_replace('/[^a-zA-Z0-9_-]/', '_', pathinfo($_FILES['lampiran']['name'], PATHINFO_FILENAME));
|
||||
$targetDir = __DIR__ . '/uploads';
|
||||
if (!is_dir($targetDir)) {
|
||||
mkdir($targetDir, 0775, true);
|
||||
}
|
||||
$fileName = 'keluar_' . time() . '_' . $safeName . '.' . $ext;
|
||||
$targetPath = $targetDir . '/' . $fileName;
|
||||
if (move_uploaded_file($_FILES['lampiran']['tmp_name'], $targetPath)) {
|
||||
$filePath = 'uploads/' . $fileName;
|
||||
} else {
|
||||
$errors[] = 'Gagal mengunggah lampiran.';
|
||||
}
|
||||
} else {
|
||||
$errors[] = 'Format lampiran tidak didukung (pdf/doc/jpg/png).';
|
||||
}
|
||||
} else {
|
||||
$errors[] = 'Ukuran lampiran maksimal 8 MB.';
|
||||
}
|
||||
} else {
|
||||
$errors[] = 'Lampiran gagal diunggah.';
|
||||
}
|
||||
}
|
||||
|
||||
if (empty($errors)) {
|
||||
$bulan = (int)date('n', strtotime($tanggal));
|
||||
$tahun = (int)date('Y', strtotime($tanggal));
|
||||
$pdo->beginTransaction();
|
||||
$stmt = $pdo->prepare("SELECT MAX(urut) as max_urut FROM surat_keluar WHERE kode_surat = ? AND bulan = ? AND tahun = ?");
|
||||
$stmt->execute([$kode, $bulan, $tahun]);
|
||||
$maxUrut = (int)($stmt->fetch()['max_urut'] ?? 0);
|
||||
$nextUrut = $maxUrut + 1;
|
||||
$nomor = format_nomor($kode, $nextUrut, $bulan, $tahun);
|
||||
|
||||
$insert = $pdo->prepare("INSERT INTO surat_keluar (nomor_surat, kode_surat, urut, bulan, tahun, tanggal_surat, tujuan, perihal, departemen_pengirim, status, file_path) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)");
|
||||
$insert->execute([
|
||||
$nomor,
|
||||
$kode,
|
||||
$nextUrut,
|
||||
$bulan,
|
||||
$tahun,
|
||||
$tanggal,
|
||||
$tujuan,
|
||||
$perihal,
|
||||
$departemen,
|
||||
$status,
|
||||
$filePath
|
||||
]);
|
||||
$suratId = $pdo->lastInsertId();
|
||||
$pdo->prepare("INSERT INTO surat_keluar_log (surat_keluar_id, new_status, note) VALUES (?, ?, ?)")
|
||||
->execute([$suratId, $status, 'Surat dibuat.']);
|
||||
$pdo->commit();
|
||||
|
||||
header('Location: /surat_keluar.php?success=1&nomor=' . urlencode($nomor));
|
||||
exit;
|
||||
}
|
||||
}
|
||||
|
||||
$search = trim($_GET['q'] ?? '');
|
||||
$where = '';
|
||||
$params = [];
|
||||
if ($search !== '') {
|
||||
$where = "WHERE nomor_surat LIKE ? OR perihal LIKE ? OR tujuan LIKE ? OR departemen_pengirim LIKE ?";
|
||||
$like = '%' . $search . '%';
|
||||
$params = [$like, $like, $like, $like];
|
||||
}
|
||||
|
||||
$stmt = $pdo->prepare("SELECT id, nomor_surat, tanggal_surat, tujuan, perihal, departemen_pengirim, status FROM surat_keluar $where ORDER BY tanggal_surat DESC, id DESC LIMIT 50");
|
||||
$stmt->execute($params);
|
||||
$rows = $stmt->fetchAll();
|
||||
|
||||
render_header('Surat Keluar', 'keluar');
|
||||
?>
|
||||
|
||||
<?php if (!empty($_GET['success'])): ?>
|
||||
<div class="toast-container position-fixed top-0 end-0 p-3">
|
||||
<div class="toast show text-bg-success border-0" role="alert" data-bs-delay="4000">
|
||||
<div class="toast-body">
|
||||
Surat keluar tersimpan. Nomor otomatis:
|
||||
<strong><?= h($_GET['nomor'] ?? '') ?></strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="row g-3">
|
||||
<div class="col-lg-4">
|
||||
<div class="card">
|
||||
<div class="card-header">Buat Surat Keluar</div>
|
||||
<div class="card-body">
|
||||
<?php if (!empty($errors)): ?>
|
||||
<div class="alert alert-danger">
|
||||
<ul class="mb-0">
|
||||
<?php foreach ($errors as $error): ?>
|
||||
<li><?= h($error) ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<form method="post" enctype="multipart/form-data">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Kode Surat</label>
|
||||
<input type="text" name="kode_surat" class="form-control" placeholder="HR/FIN/IT" required value="<?= h($_POST['kode_surat'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Tanggal Surat</label>
|
||||
<input type="date" name="tanggal_surat" class="form-control" required value="<?= h($_POST['tanggal_surat'] ?? date('Y-m-d')) ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Tujuan</label>
|
||||
<input type="text" name="tujuan" class="form-control" required value="<?= h($_POST['tujuan'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Perihal</label>
|
||||
<input type="text" name="perihal" class="form-control" required value="<?= h($_POST['perihal'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Departemen Pengirim</label>
|
||||
<input type="text" name="departemen_pengirim" class="form-control" required value="<?= h($_POST['departemen_pengirim'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Status Awal</label>
|
||||
<select name="status" class="form-select">
|
||||
<option value="draft" selected>Draft</option>
|
||||
<option value="review">Review</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Lampiran (PDF/DOC/JPG/PNG)</label>
|
||||
<input type="file" name="lampiran" class="form-control">
|
||||
</div>
|
||||
<div class="alert alert-secondary small">
|
||||
Nomor surat dibuat otomatis saat disimpan: <strong>KODE/URUT/BULAN_ROMAWI/TAHUN</strong>.
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary w-100">Simpan Surat Keluar</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-8">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex flex-wrap justify-content-between align-items-center gap-2">
|
||||
<span>Daftar Surat Keluar</span>
|
||||
<form class="d-flex gap-2" method="get">
|
||||
<input type="text" name="q" class="form-control" placeholder="Cari nomor/perihal/tujuan" value="<?= h($search) ?>">
|
||||
<button class="btn btn-light border" type="submit">Cari</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (empty($rows)): ?>
|
||||
<div class="empty-state">Belum ada data surat keluar.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Tanggal</th>
|
||||
<th>Nomor</th>
|
||||
<th>Tujuan</th>
|
||||
<th>Perihal</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($rows as $row): ?>
|
||||
<tr>
|
||||
<td><?= h($row['tanggal_surat']) ?></td>
|
||||
<td>
|
||||
<a href="/surat_keluar_view.php?id=<?= h((string)$row['id']) ?>">
|
||||
<?= h($row['nomor_surat']) ?>
|
||||
</a>
|
||||
</td>
|
||||
<td><?= h($row['tujuan']) ?></td>
|
||||
<td><?= h($row['perihal']) ?></td>
|
||||
<td><span class="<?= h(status_badge($row['status'], 'keluar')) ?>"><?= h($row['status']) ?></span></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
104
surat_keluar_view.php
Normal file
104
surat_keluar_view.php
Normal file
@ -0,0 +1,104 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/db_init.php';
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
require_once __DIR__ . '/includes/helpers.php';
|
||||
|
||||
ensure_tables();
|
||||
$pdo = db();
|
||||
|
||||
$id = isset($_GET['id']) ? (int)$_GET['id'] : 0;
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['update_status'])) {
|
||||
$newStatus = $_POST['status'];
|
||||
$note = trim($_POST['note'] ?? '');
|
||||
|
||||
$pdo->beginTransaction();
|
||||
$stmt = $pdo->prepare("SELECT status FROM surat_keluar WHERE id = ?");
|
||||
$stmt->execute([$id]);
|
||||
$oldStatus = $stmt->fetchColumn();
|
||||
|
||||
$stmt = $pdo->prepare("UPDATE surat_keluar SET status = ? WHERE id = ?");
|
||||
$stmt->execute([$newStatus, $id]);
|
||||
|
||||
$stmt = $pdo->prepare("INSERT INTO surat_keluar_log (surat_keluar_id, old_status, new_status, note) VALUES (?, ?, ?, ?)");
|
||||
$stmt->execute([$id, $oldStatus, $newStatus, $note]);
|
||||
$pdo->commit();
|
||||
|
||||
header('Location: /surat_keluar_view.php?id=' . $id . '&success=1');
|
||||
exit;
|
||||
}
|
||||
|
||||
$stmt = $pdo->prepare("SELECT * FROM surat_keluar WHERE id = ?");
|
||||
$stmt->execute([$id]);
|
||||
$row = $stmt->fetch();
|
||||
|
||||
$logs = $pdo->prepare("SELECT * FROM surat_keluar_log WHERE surat_keluar_id = ? ORDER BY created_at DESC");
|
||||
$logs->execute([$id]);
|
||||
$logs = $logs->fetchAll();
|
||||
|
||||
render_header('Detail Surat Keluar', 'keluar');
|
||||
?>
|
||||
|
||||
<div class="row g-3">
|
||||
<div class="col-lg-8">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">Detail Surat Keluar</div>
|
||||
<div class="card-body">
|
||||
<?php if (!$row): ?>
|
||||
<div class="empty-state">Data surat keluar tidak ditemukan.</div>
|
||||
<?php else: ?>
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Nomor Surat</div>
|
||||
<div class="fw-semibold"><?= h($row['nomor_surat']) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Status</div>
|
||||
<span class="<?= h(status_badge($row['status'], 'keluar')) ?>"><?= h($row['status']) ?></span>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="text-muted small">Perihal</div>
|
||||
<div class="fw-semibold"><?= h($row['perihal']) ?></div>
|
||||
</div>
|
||||
<!-- ... -->
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header">Riwayat Status</div>
|
||||
<div class="card-body">
|
||||
<ul class="list-group list-group-flush">
|
||||
<?php foreach($logs as $log): ?>
|
||||
<li class="list-group-item">
|
||||
<small class="text-muted"><?= h($log['created_at']) ?></small><br>
|
||||
Status: <strong><?= h($log['old_status'] ?? 'N/A') ?></strong> -> <strong><?= h($log['new_status']) ?></strong>
|
||||
<?php if($log['note']): ?> <br><em><?= h($log['note']) ?></em> <?php endif; ?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">Update Status</div>
|
||||
<div class="card-body">
|
||||
<form method="post">
|
||||
<select name="status" class="form-select mb-2">
|
||||
<?php foreach (['draft' => 'Draft', 'review' => 'Review', 'approved' => 'Approved', 'kirim' => 'Kirim'] as $val => $label): ?>
|
||||
<option value="<?= h($val) ?>" <?= ($row['status'] === $val ? 'selected' : '') ?>><?= h($label) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
<textarea name="note" class="form-control mb-2" placeholder="Catatan"></textarea>
|
||||
<button type="submit" name="update_status" class="btn btn-primary w-100">Simpan Status</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
196
surat_masuk.php
Normal file
196
surat_masuk.php
Normal file
@ -0,0 +1,196 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/db_init.php';
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
ensure_tables();
|
||||
|
||||
$pdo = db();
|
||||
$errors = [];
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
$tanggal = $_POST['tanggal_surat'] ?? '';
|
||||
$pengirim = trim($_POST['pengirim'] ?? '');
|
||||
$perihal = trim($_POST['perihal'] ?? '');
|
||||
$departemen = trim($_POST['departemen_tujuan'] ?? '');
|
||||
$status = $_POST['status'] ?? 'baru';
|
||||
$nomor = trim($_POST['nomor_surat'] ?? '');
|
||||
|
||||
if ($tanggal === '') { $errors[] = 'Tanggal surat wajib diisi.'; }
|
||||
if ($pengirim === '') { $errors[] = 'Pengirim wajib diisi.'; }
|
||||
if ($perihal === '') { $errors[] = 'Perihal wajib diisi.'; }
|
||||
if ($departemen === '') { $errors[] = 'Departemen tujuan wajib diisi.'; }
|
||||
|
||||
$filePath = null;
|
||||
if (!empty($_FILES['lampiran']['name'])) {
|
||||
if ($_FILES['lampiran']['error'] === UPLOAD_ERR_OK) {
|
||||
if ($_FILES['lampiran']['size'] <= 8 * 1024 * 1024) {
|
||||
$ext = strtolower(pathinfo($_FILES['lampiran']['name'], PATHINFO_EXTENSION));
|
||||
$allowed = ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'];
|
||||
if (in_array($ext, $allowed, true)) {
|
||||
$safeName = preg_replace('/[^a-zA-Z0-9_-]/', '_', pathinfo($_FILES['lampiran']['name'], PATHINFO_FILENAME));
|
||||
$targetDir = __DIR__ . '/uploads';
|
||||
if (!is_dir($targetDir)) {
|
||||
mkdir($targetDir, 0775, true);
|
||||
}
|
||||
$fileName = 'masuk_' . time() . '_' . $safeName . '.' . $ext;
|
||||
$targetPath = $targetDir . '/' . $fileName;
|
||||
if (move_uploaded_file($_FILES['lampiran']['tmp_name'], $targetPath)) {
|
||||
$filePath = 'uploads/' . $fileName;
|
||||
} else {
|
||||
$errors[] = 'Gagal mengunggah lampiran.';
|
||||
}
|
||||
} else {
|
||||
$errors[] = 'Format lampiran tidak didukung (pdf/doc/jpg/png).';
|
||||
}
|
||||
} else {
|
||||
$errors[] = 'Ukuran lampiran maksimal 8 MB.';
|
||||
}
|
||||
} else {
|
||||
$errors[] = 'Lampiran gagal diunggah.';
|
||||
}
|
||||
}
|
||||
|
||||
if (empty($errors)) {
|
||||
$stmt = $pdo->prepare("INSERT INTO surat_masuk (nomor_surat, tanggal_surat, pengirim, perihal, departemen_tujuan, status, file_path) VALUES (?, ?, ?, ?, ?, ?, ?)");
|
||||
$stmt->execute([
|
||||
$nomor !== '' ? $nomor : null,
|
||||
$tanggal,
|
||||
$pengirim,
|
||||
$perihal,
|
||||
$departemen,
|
||||
$status,
|
||||
$filePath
|
||||
]);
|
||||
header('Location: /surat_masuk.php?success=1');
|
||||
exit;
|
||||
}
|
||||
}
|
||||
|
||||
$search = trim($_GET['q'] ?? '');
|
||||
$where = '';
|
||||
$params = [];
|
||||
if ($search !== '') {
|
||||
$where = "WHERE nomor_surat LIKE ? OR pengirim LIKE ? OR perihal LIKE ? OR departemen_tujuan LIKE ?";
|
||||
$like = '%' . $search . '%';
|
||||
$params = [$like, $like, $like, $like];
|
||||
}
|
||||
|
||||
$stmt = $pdo->prepare("SELECT id, nomor_surat, tanggal_surat, pengirim, perihal, departemen_tujuan, status FROM surat_masuk $where ORDER BY tanggal_surat DESC, id DESC LIMIT 50");
|
||||
$stmt->execute($params);
|
||||
$rows = $stmt->fetchAll();
|
||||
|
||||
render_header('Surat Masuk', 'masuk');
|
||||
?>
|
||||
|
||||
<?php if (!empty($_GET['success'])): ?>
|
||||
<div class="toast-container position-fixed top-0 end-0 p-3">
|
||||
<div class="toast text-bg-dark border-0" role="alert" data-bs-delay="3500">
|
||||
<div class="toast-body">Surat masuk berhasil disimpan.</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="row g-3">
|
||||
<div class="col-lg-4">
|
||||
<div class="card">
|
||||
<div class="card-header">Catat Surat Masuk</div>
|
||||
<div class="card-body">
|
||||
<?php if (!empty($errors)): ?>
|
||||
<div class="alert alert-danger">
|
||||
<ul class="mb-0">
|
||||
<?php foreach ($errors as $error): ?>
|
||||
<li><?= h($error) ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<form method="post" enctype="multipart/form-data">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Tanggal Surat</label>
|
||||
<input type="date" name="tanggal_surat" class="form-control" required value="<?= h($_POST['tanggal_surat'] ?? date('Y-m-d')) ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Nomor Surat (opsional)</label>
|
||||
<input type="text" name="nomor_surat" class="form-control" value="<?= h($_POST['nomor_surat'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Pengirim</label>
|
||||
<input type="text" name="pengirim" class="form-control" required value="<?= h($_POST['pengirim'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Perihal</label>
|
||||
<input type="text" name="perihal" class="form-control" required value="<?= h($_POST['perihal'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Departemen Tujuan</label>
|
||||
<input type="text" name="departemen_tujuan" class="form-control" required value="<?= h($_POST['departemen_tujuan'] ?? '') ?>">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Status</label>
|
||||
<select name="status" class="form-select">
|
||||
<?php foreach (['baru' => 'Baru', 'diproses' => 'Diproses', 'selesai' => 'Selesai'] as $val => $label): ?>
|
||||
<option value="<?= h($val) ?>" <?= (($val === ($_POST['status'] ?? 'baru')) ? 'selected' : '') ?>><?= h($label) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Lampiran (PDF/DOC/JPG/PNG)</label>
|
||||
<input type="file" name="lampiran" class="form-control">
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary w-100">Simpan Surat Masuk</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-8">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex flex-wrap justify-content-between align-items-center gap-2">
|
||||
<span>Daftar Surat Masuk</span>
|
||||
<form class="d-flex gap-2" method="get">
|
||||
<input type="text" name="q" class="form-control" placeholder="Cari nomor/pengirim/perihal" value="<?= h($search) ?>">
|
||||
<button class="btn btn-light border" type="submit">Cari</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (empty($rows)): ?>
|
||||
<div class="empty-state">Belum ada data surat masuk.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Tanggal</th>
|
||||
<th>Nomor</th>
|
||||
<th>Pengirim</th>
|
||||
<th>Perihal</th>
|
||||
<th>Departemen</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($rows as $row): ?>
|
||||
<tr>
|
||||
<td><?= h($row['tanggal_surat']) ?></td>
|
||||
<td><?= h($row['nomor_surat'] ?? '-') ?></td>
|
||||
<td><?= h($row['pengirim']) ?></td>
|
||||
<td>
|
||||
<a href="/surat_masuk_view.php?id=<?= h((string)$row['id']) ?>">
|
||||
<?= h($row['perihal']) ?>
|
||||
</a>
|
||||
</td>
|
||||
<td><?= h($row['departemen_tujuan']) ?></td>
|
||||
<td><span class="<?= h(status_badge($row['status'], 'masuk')) ?>"><?= h($row['status']) ?></span></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
124
surat_masuk_view.php
Normal file
124
surat_masuk_view.php
Normal file
@ -0,0 +1,124 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/db_init.php';
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
ensure_tables();
|
||||
$pdo = db();
|
||||
|
||||
$id = isset($_GET['id']) ? (int)$_GET['id'] : 0;
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['disposisi_submit'])) {
|
||||
$tujuan = $_POST['tujuan_departemen'] ?? '';
|
||||
$instruksi = $_POST['instruksi'] ?? '';
|
||||
if (!empty($tujuan)) {
|
||||
$stmt = $pdo->prepare("INSERT INTO disposisi_surat_masuk (surat_masuk_id, tujuan_departemen, instruksi) VALUES (?, ?, ?)");
|
||||
$stmt->execute([$id, $tujuan, $instruksi]);
|
||||
}
|
||||
}
|
||||
|
||||
$stmt = $pdo->prepare("SELECT * FROM surat_masuk WHERE id = ?");
|
||||
$stmt->execute([$id]);
|
||||
$row = $stmt->fetch();
|
||||
|
||||
$disposisi = [];
|
||||
if ($row) {
|
||||
$stmtDispo = $pdo->prepare("SELECT * FROM disposisi_surat_masuk WHERE surat_masuk_id = ? ORDER BY created_at DESC");
|
||||
$stmtDispo->execute([$id]);
|
||||
$disposisi = $stmtDispo->fetchAll();
|
||||
}
|
||||
|
||||
render_header('Detail Surat Masuk', 'masuk');
|
||||
?>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-8">
|
||||
<div class="card border-0 shadow-sm mb-4">
|
||||
<div class="card-header bg-white py-3 fw-bold">Detail Surat Masuk</div>
|
||||
<div class="card-body p-4">
|
||||
<?php if (!$row): ?>
|
||||
<div class="empty-state">Data surat masuk tidak ditemukan.</div>
|
||||
<?php else: ?>
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Tanggal Surat</div>
|
||||
<div class="fw-semibold text-dark"><?= h($row['tanggal_surat']) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Nomor Surat</div>
|
||||
<div class="fw-semibold text-dark"><?= h($row['nomor_surat'] ?? '-') ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Pengirim</div>
|
||||
<div class="fw-semibold text-dark"><?= h($row['pengirim']) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Departemen Tujuan</div>
|
||||
<div class="fw-semibold text-dark"><?= h($row['departemen_tujuan']) ?></div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="text-muted small">Perihal</div>
|
||||
<div class="fw-semibold text-dark"><?= h($row['perihal']) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Status</div>
|
||||
<span class="badge bg-light text-dark border"><?= h($row['status']) ?></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="text-muted small">Lampiran</div>
|
||||
<?php if (!empty($row['file_path'])): ?>
|
||||
<a class="btn btn-sm btn-outline-primary" href="/<?= h($row['file_path']) ?>" target="_blank" rel="noopener">Download File</a>
|
||||
<?php else: ?>
|
||||
<span class="text-muted">Tidak ada lampiran.</span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card border-0 shadow-sm">
|
||||
<div class="card-header bg-white py-3 fw-bold">Riwayat Disposisi</div>
|
||||
<div class="card-body p-0">
|
||||
<ul class="list-group list-group-flush">
|
||||
<?php if (empty($disposisi)): ?>
|
||||
<li class="list-group-item text-muted p-4">Belum ada disposisi.</li>
|
||||
<?php else: ?>
|
||||
<?php foreach ($disposisi as $d): ?>
|
||||
<li class="list-group-item p-4">
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span class="badge bg-primary"><?= h($d['tujuan_departemen']) ?></span>
|
||||
<small class="text-muted"><?= h($d['created_at']) ?></small>
|
||||
</div>
|
||||
<p class="mb-0 text-dark"><?= h($d['instruksi']) ?></p>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<div class="card border-0 shadow-sm mb-4">
|
||||
<div class="card-header bg-white py-3 fw-bold">Buat Disposisi</div>
|
||||
<div class="card-body p-4">
|
||||
<form method="POST">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Tujuan Departemen</label>
|
||||
<input type="text" name="tujuan_departemen" class="form-control" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Instruksi</label>
|
||||
<textarea name="instruksi" class="form-control" rows="3" required></textarea>
|
||||
</div>
|
||||
<button type="submit" name="disposisi_submit" class="btn btn-primary w-100">Simpan Disposisi</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/surat_masuk.php" class="btn btn-light border w-100">Kembali ke Daftar</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
BIN
uploads/keluar_1772803870_Draft_PKS.docx
Normal file
BIN
uploads/keluar_1772803870_Draft_PKS.docx
Normal file
Binary file not shown.
BIN
uploads/masuk_1772803960_Estimasi_Ajuan_Harga_PIC_Bapak_Iwan.pdf
Normal file
BIN
uploads/masuk_1772803960_Estimasi_Ajuan_Harga_PIC_Bapak_Iwan.pdf
Normal file
Binary file not shown.
Loading…
x
Reference in New Issue
Block a user