Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
472459e447 |
@ -1,403 +1,117 @@
|
||||
:root {
|
||||
--bg: #f6f7f9;
|
||||
--surface: #ffffff;
|
||||
--border: #e5e7eb;
|
||||
--muted: #6b7280;
|
||||
--text: #111827;
|
||||
--primary: #2563eb;
|
||||
--primary-soft: #dbeafe;
|
||||
--success: #16a34a;
|
||||
--warning: #f59e0b;
|
||||
--danger: #dc2626;
|
||||
--radius-sm: 6px;
|
||||
--radius-md: 10px;
|
||||
--radius-lg: 14px;
|
||||
}
|
||||
|
||||
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;
|
||||
font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.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;
|
||||
.app-nav .navbar-brand {
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
@keyframes gradient {
|
||||
0% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
.card {
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.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-header {
|
||||
background: var(--surface);
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.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;
|
||||
.stat-card {
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
padding: 1.25rem;
|
||||
}
|
||||
|
||||
.chat-messages {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 1.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.25rem;
|
||||
.stat-label {
|
||||
color: var(--muted);
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
}
|
||||
|
||||
/* 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;
|
||||
.stat-value {
|
||||
font-size: 1.8rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0 8px;
|
||||
margin-top: 1.5rem;
|
||||
--bs-table-bg: transparent;
|
||||
}
|
||||
|
||||
.table th {
|
||||
background: transparent;
|
||||
border: none;
|
||||
padding: 1rem;
|
||||
color: #6c757d;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 1px;
|
||||
.table thead th {
|
||||
font-size: 0.85rem;
|
||||
color: var(--muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.table td {
|
||||
background: #fff;
|
||||
padding: 1rem;
|
||||
border: none;
|
||||
.table tbody tr {
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.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;
|
||||
.badge-soft {
|
||||
background: var(--primary-soft);
|
||||
color: var(--primary);
|
||||
border-radius: 999px;
|
||||
padding: 0.35rem 0.6rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.5rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.9rem;
|
||||
.form-control, .form-select {
|
||||
border-radius: var(--radius-sm);
|
||||
border-color: var(--border);
|
||||
}
|
||||
|
||||
.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;
|
||||
.btn-primary {
|
||||
background: var(--primary);
|
||||
border-color: var(--primary);
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
outline: none;
|
||||
border-color: #23a6d5;
|
||||
box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.1);
|
||||
.btn-outline-primary {
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
.header-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.section-title {
|
||||
font-size: 1.2rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.header-links {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
.small-muted {
|
||||
color: var(--muted);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.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);
|
||||
.alert {
|
||||
border-radius: var(--radius-md);
|
||||
}
|
||||
|
||||
.admin-card h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1.5rem;
|
||||
font-weight: 700;
|
||||
.empty-state {
|
||||
border: 1px dashed var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
padding: 1.5rem;
|
||||
text-align: center;
|
||||
color: var(--muted);
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
@ -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 alerts = document.querySelectorAll('.alert[data-autohide="true"]');
|
||||
alerts.forEach((alertEl) => {
|
||||
setTimeout(() => {
|
||||
alertEl.classList.add('fade');
|
||||
alertEl.addEventListener('transitionend', () => alertEl.remove());
|
||||
}, 4000);
|
||||
});
|
||||
});
|
||||
|
||||
114
departments.php
Normal file
114
departments.php
Normal file
@ -0,0 +1,114 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
$pdo = db();
|
||||
$errors = [];
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
$name = trim($_POST['name'] ?? '');
|
||||
$code = trim($_POST['code'] ?? '');
|
||||
|
||||
if ($name === '' || $code === '') {
|
||||
$errors[] = 'Nama dan kode departemen wajib diisi.';
|
||||
}
|
||||
|
||||
if (!$errors) {
|
||||
$stmt = $pdo->prepare("INSERT INTO departments (name, code) VALUES (:name, :code)");
|
||||
$stmt->execute([':name' => $name, ':code' => $code]);
|
||||
header('Location: departments.php?success=1');
|
||||
exit;
|
||||
}
|
||||
}
|
||||
|
||||
$departments = $pdo->query("
|
||||
SELECT d.*, COUNT(e.id) AS total_employee
|
||||
FROM departments d
|
||||
LEFT JOIN employees e ON e.dept_id = d.id
|
||||
GROUP BY d.id
|
||||
ORDER BY d.name ASC
|
||||
")->fetchAll();
|
||||
|
||||
render_header('Data Departemen', 'departments');
|
||||
?>
|
||||
|
||||
<div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-4">
|
||||
<div>
|
||||
<h1 class="h3 fw-semibold mb-1">Departemen</h1>
|
||||
<p class="small-muted mb-0">Struktur organisasi yang digunakan untuk penempatan pegawai.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (isset($_GET['success'])): ?>
|
||||
<div class="alert alert-success" data-autohide="true">Departemen berhasil ditambahkan.</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($errors): ?>
|
||||
<div class="alert alert-danger">
|
||||
<ul class="mb-0">
|
||||
<?php foreach ($errors as $err): ?>
|
||||
<li><?= e($err) ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-5">
|
||||
<form method="post" class="card">
|
||||
<div class="card-header">
|
||||
<span class="section-title">Tambah Departemen</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Nama Departemen</label>
|
||||
<input type="text" name="name" class="form-control" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Kode</label>
|
||||
<input type="text" name="code" class="form-control" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer bg-white">
|
||||
<button type="submit" class="btn btn-primary">Simpan Departemen</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="col-lg-7">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between">
|
||||
<span class="section-title">Daftar Departemen</span>
|
||||
<span class="small-muted"><?= count($departments) ?> total</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (count($departments) === 0): ?>
|
||||
<div class="empty-state">Belum ada departemen. Tambahkan departemen pertama.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nama</th>
|
||||
<th>Kode</th>
|
||||
<th>Jumlah Pegawai</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($departments as $dept): ?>
|
||||
<tr>
|
||||
<td><?= e($dept['name']) ?></td>
|
||||
<td><span class="badge-soft"><?= e($dept['code']) ?></span></td>
|
||||
<td><?= e((string)$dept['total_employee']) ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
140
employee_new.php
Normal file
140
employee_new.php
Normal file
@ -0,0 +1,140 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
$pdo = db();
|
||||
$departments = $pdo->query("SELECT id, name FROM departments ORDER BY name ASC")->fetchAll();
|
||||
$positions = $pdo->query("SELECT id, name FROM positions ORDER BY name ASC")->fetchAll();
|
||||
|
||||
$errors = [];
|
||||
$values = [
|
||||
'employee_code' => '',
|
||||
'full_name' => '',
|
||||
'email' => '',
|
||||
'phone' => '',
|
||||
'status' => 'Aktif',
|
||||
'employment_type' => 'Kontrak',
|
||||
'hire_date' => '',
|
||||
'dept_id' => '',
|
||||
'position_id' => '',
|
||||
];
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
foreach ($values as $key => $val) {
|
||||
$values[$key] = trim($_POST[$key] ?? '');
|
||||
}
|
||||
|
||||
if ($values['employee_code'] === '') {
|
||||
$errors[] = 'Kode pegawai wajib diisi.';
|
||||
}
|
||||
if ($values['full_name'] === '') {
|
||||
$errors[] = 'Nama lengkap wajib diisi.';
|
||||
}
|
||||
|
||||
if (!$errors) {
|
||||
$stmt = $pdo->prepare("
|
||||
INSERT INTO employees (employee_code, full_name, email, phone, status, employment_type, hire_date, dept_id, position_id)
|
||||
VALUES (:employee_code, :full_name, :email, :phone, :status, :employment_type, :hire_date, :dept_id, :position_id)
|
||||
");
|
||||
$stmt->bindValue(':employee_code', $values['employee_code']);
|
||||
$stmt->bindValue(':full_name', $values['full_name']);
|
||||
$stmt->bindValue(':email', $values['email'] !== '' ? $values['email'] : null);
|
||||
$stmt->bindValue(':phone', $values['phone'] !== '' ? $values['phone'] : null);
|
||||
$stmt->bindValue(':status', $values['status'] !== '' ? $values['status'] : 'Aktif');
|
||||
$stmt->bindValue(':employment_type', $values['employment_type'] !== '' ? $values['employment_type'] : 'Kontrak');
|
||||
$stmt->bindValue(':hire_date', $values['hire_date'] !== '' ? $values['hire_date'] : null);
|
||||
$stmt->bindValue(':dept_id', $values['dept_id'] !== '' ? (int)$values['dept_id'] : null, PDO::PARAM_INT);
|
||||
$stmt->bindValue(':position_id', $values['position_id'] !== '' ? (int)$values['position_id'] : null, PDO::PARAM_INT);
|
||||
$stmt->execute();
|
||||
|
||||
$newId = (int)$pdo->lastInsertId();
|
||||
header('Location: employee_view.php?id=' . $newId . '&created=1');
|
||||
exit;
|
||||
}
|
||||
}
|
||||
|
||||
render_header('Tambah Pegawai', 'employees');
|
||||
?>
|
||||
|
||||
<div class="mb-4">
|
||||
<h1 class="h3 fw-semibold mb-1">Tambah Pegawai</h1>
|
||||
<p class="small-muted mb-0">Lengkapi profil pegawai baru, status kerja, dan penempatan.</p>
|
||||
</div>
|
||||
|
||||
<?php if ($errors): ?>
|
||||
<div class="alert alert-danger" role="alert">
|
||||
<ul class="mb-0">
|
||||
<?php foreach ($errors as $err): ?>
|
||||
<li><?= e($err) ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form method="post" class="card">
|
||||
<div class="card-body">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Kode Pegawai *</label>
|
||||
<input type="text" name="employee_code" class="form-control" value="<?= e($values['employee_code']) ?>" required>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<label class="form-label">Nama Lengkap *</label>
|
||||
<input type="text" name="full_name" class="form-control" value="<?= e($values['full_name']) ?>" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Email</label>
|
||||
<input type="email" name="email" class="form-control" value="<?= e($values['email']) ?>">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Nomor Telepon</label>
|
||||
<input type="text" name="phone" class="form-control" value="<?= e($values['phone']) ?>">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Status</label>
|
||||
<select name="status" class="form-select">
|
||||
<?php foreach (['Aktif', 'Probation', 'Nonaktif'] as $st): ?>
|
||||
<option value="<?= e($st) ?>" <?= $values['status'] === $st ? 'selected' : '' ?>><?= e($st) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Tipe Kerja</label>
|
||||
<select name="employment_type" class="form-select">
|
||||
<?php foreach (['Kontrak', 'Tetap', 'Magang'] as $type): ?>
|
||||
<option value="<?= e($type) ?>" <?= $values['employment_type'] === $type ? 'selected' : '' ?>><?= e($type) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Tanggal Masuk</label>
|
||||
<input type="date" name="hire_date" class="form-control" value="<?= e($values['hire_date']) ?>">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Departemen</label>
|
||||
<select name="dept_id" class="form-select">
|
||||
<option value="">Pilih Departemen</option>
|
||||
<?php foreach ($departments as $dept): ?>
|
||||
<option value="<?= e((string)$dept['id']) ?>" <?= $values['dept_id'] == $dept['id'] ? 'selected' : '' ?>><?= e($dept['name']) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Jabatan</label>
|
||||
<select name="position_id" class="form-select">
|
||||
<option value="">Pilih Jabatan</option>
|
||||
<?php foreach ($positions as $pos): ?>
|
||||
<option value="<?= e((string)$pos['id']) ?>" <?= $values['position_id'] == $pos['id'] ? 'selected' : '' ?>><?= e($pos['name']) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer bg-white d-flex justify-content-between">
|
||||
<a href="employees.php" class="btn btn-light border">Kembali</a>
|
||||
<button type="submit" class="btn btn-primary">Simpan Pegawai</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
113
employee_view.php
Normal file
113
employee_view.php
Normal file
@ -0,0 +1,113 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
$pdo = db();
|
||||
$id = (int)($_GET['id'] ?? 0);
|
||||
|
||||
$stmt = $pdo->prepare("
|
||||
SELECT e.*, d.name AS dept_name, d.code AS dept_code, p.name AS position_name, p.level
|
||||
FROM employees e
|
||||
LEFT JOIN departments d ON d.id = e.dept_id
|
||||
LEFT JOIN positions p ON p.id = e.position_id
|
||||
WHERE e.id = :id
|
||||
");
|
||||
$stmt->execute([':id' => $id]);
|
||||
$employee = $stmt->fetch();
|
||||
|
||||
if (!$employee) {
|
||||
render_header('Pegawai Tidak Ditemukan', 'employees');
|
||||
echo '<div class="alert alert-warning">Pegawai tidak ditemukan.</div>';
|
||||
echo '<a href="employees.php" class="btn btn-light border">Kembali</a>';
|
||||
render_footer();
|
||||
exit;
|
||||
}
|
||||
|
||||
$created = isset($_GET['created']);
|
||||
|
||||
render_header('Detail Pegawai', 'employees');
|
||||
?>
|
||||
|
||||
<div class="mb-4 d-flex flex-wrap align-items-center justify-content-between gap-3">
|
||||
<div>
|
||||
<h1 class="h3 fw-semibold mb-1"><?= e($employee['full_name']) ?></h1>
|
||||
<p class="small-muted mb-0"><?= e($employee['employee_code']) ?> · <?= e($employee['status']) ?></p>
|
||||
</div>
|
||||
<a href="employees.php" class="btn btn-light border">Kembali ke daftar</a>
|
||||
</div>
|
||||
|
||||
<?php if ($created): ?>
|
||||
<div class="alert alert-success" data-autohide="true">
|
||||
Profil pegawai baru berhasil dibuat.
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-7">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<span class="section-title">Profil Pegawai</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<div class="small-muted">Email</div>
|
||||
<div class="fw-semibold"><?= e($employee['email'] ?? '-') ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="small-muted">Telepon</div>
|
||||
<div class="fw-semibold"><?= e($employee['phone'] ?? '-') ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="small-muted">Status Kerja</div>
|
||||
<div class="fw-semibold"><?= e($employee['status']) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="small-muted">Tipe Kerja</div>
|
||||
<div class="fw-semibold"><?= e($employee['employment_type']) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="small-muted">Tanggal Masuk</div>
|
||||
<div class="fw-semibold"><?= e(format_date($employee['hire_date'])) ?></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="small-muted">Dibuat</div>
|
||||
<div class="fw-semibold"><?= e(format_date($employee['created_at'])) ?></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-5">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header">
|
||||
<span class="section-title">Penempatan</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<div class="small-muted">Departemen</div>
|
||||
<div class="fw-semibold"><?= e($employee['dept_name'] ?? 'Belum ditetapkan') ?></div>
|
||||
<?php if (!empty($employee['dept_code'])): ?>
|
||||
<span class="badge-soft"><?= e($employee['dept_code']) ?></span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div>
|
||||
<div class="small-muted">Jabatan</div>
|
||||
<div class="fw-semibold"><?= e($employee['position_name'] ?? 'Belum ditetapkan') ?></div>
|
||||
<div class="small text-muted"><?= e($employee['level'] ?? '-') ?></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<span class="section-title">Catatan HR</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p class="small-muted mb-0">Gunakan halaman ini sebagai ringkasan cepat. Modul kontrak, dokumen, dan histori akan ditambahkan pada iterasi berikutnya.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
146
employees.php
Normal file
146
employees.php
Normal file
@ -0,0 +1,146 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
$pdo = db();
|
||||
$departments = $pdo->query("SELECT id, name FROM departments ORDER BY name ASC")->fetchAll();
|
||||
$positions = $pdo->query("SELECT id, name FROM positions ORDER BY name ASC")->fetchAll();
|
||||
|
||||
$q = trim($_GET['q'] ?? '');
|
||||
$deptId = $_GET['dept_id'] ?? '';
|
||||
$posId = $_GET['position_id'] ?? '';
|
||||
$status = $_GET['status'] ?? '';
|
||||
|
||||
$where = [];
|
||||
$params = [];
|
||||
if ($q !== '') {
|
||||
$where[] = "(e.full_name LIKE :q OR e.employee_code LIKE :q OR e.email LIKE :q)";
|
||||
$params[':q'] = '%' . $q . '%';
|
||||
}
|
||||
if ($deptId !== '') {
|
||||
$where[] = "e.dept_id = :dept_id";
|
||||
$params[':dept_id'] = $deptId;
|
||||
}
|
||||
if ($posId !== '') {
|
||||
$where[] = "e.position_id = :position_id";
|
||||
$params[':position_id'] = $posId;
|
||||
}
|
||||
if ($status !== '') {
|
||||
$where[] = "e.status = :status";
|
||||
$params[':status'] = $status;
|
||||
}
|
||||
|
||||
$sql = "
|
||||
SELECT e.*, d.name AS dept_name, p.name AS position_name
|
||||
FROM employees e
|
||||
LEFT JOIN departments d ON d.id = e.dept_id
|
||||
LEFT JOIN positions p ON p.id = e.position_id
|
||||
";
|
||||
if ($where) {
|
||||
$sql .= " WHERE " . implode(' AND ', $where);
|
||||
}
|
||||
$sql .= " ORDER BY e.full_name ASC";
|
||||
|
||||
$stmt = $pdo->prepare($sql);
|
||||
$stmt->execute($params);
|
||||
$employees = $stmt->fetchAll();
|
||||
|
||||
render_header('Data Pegawai', 'employees');
|
||||
?>
|
||||
|
||||
<div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-4">
|
||||
<div>
|
||||
<h1 class="h3 fw-semibold mb-1">Data Pegawai</h1>
|
||||
<p class="small-muted mb-0">Kelola profil, status kerja, dan penempatan pegawai.</p>
|
||||
</div>
|
||||
<a href="employee_new.php" class="btn btn-primary">Tambah Pegawai</a>
|
||||
</div>
|
||||
|
||||
<div class="card mb-4">
|
||||
<div class="card-body">
|
||||
<form class="row g-2 align-items-end" method="get">
|
||||
<div class="col-md-4">
|
||||
<label class="form-label small-muted">Cari</label>
|
||||
<input type="text" class="form-control" name="q" value="<?= e($q) ?>" placeholder="Nama, kode, atau email">
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<label class="form-label small-muted">Departemen</label>
|
||||
<select class="form-select" name="dept_id">
|
||||
<option value="">Semua</option>
|
||||
<?php foreach ($departments as $dept): ?>
|
||||
<option value="<?= e((string)$dept['id']) ?>" <?= $deptId == $dept['id'] ? 'selected' : '' ?>><?= e($dept['name']) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<label class="form-label small-muted">Jabatan</label>
|
||||
<select class="form-select" name="position_id">
|
||||
<option value="">Semua</option>
|
||||
<?php foreach ($positions as $pos): ?>
|
||||
<option value="<?= e((string)$pos['id']) ?>" <?= $posId == $pos['id'] ? 'selected' : '' ?>><?= e($pos['name']) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<label class="form-label small-muted">Status</label>
|
||||
<select class="form-select" name="status">
|
||||
<option value="">Semua</option>
|
||||
<?php foreach (['Aktif', 'Probation', 'Nonaktif'] as $st): ?>
|
||||
<option value="<?= e($st) ?>" <?= $status === $st ? 'selected' : '' ?>><?= e($st) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 d-flex gap-2">
|
||||
<button class="btn btn-outline-primary" type="submit">Terapkan Filter</button>
|
||||
<a class="btn btn-light border" href="employees.php">Reset</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header d-flex align-items-center justify-content-between">
|
||||
<span class="section-title">Daftar Pegawai</span>
|
||||
<span class="small-muted"><?= count($employees) ?> hasil</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (count($employees) === 0): ?>
|
||||
<div class="empty-state">Belum ada pegawai yang cocok dengan filter ini.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nama</th>
|
||||
<th>Kode</th>
|
||||
<th>Departemen</th>
|
||||
<th>Jabatan</th>
|
||||
<th>Status</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($employees as $emp): ?>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="fw-semibold"><?= e($emp['full_name']) ?></div>
|
||||
<div class="small text-muted"><?= e($emp['email'] ?? '-') ?></div>
|
||||
</td>
|
||||
<td><?= e($emp['employee_code']) ?></td>
|
||||
<td><?= e($emp['dept_name'] ?? '—') ?></td>
|
||||
<td><?= e($emp['position_name'] ?? '—') ?></td>
|
||||
<td><span class="badge bg-light text-dark border"><?= e($emp['status']) ?></span></td>
|
||||
<td class="text-end">
|
||||
<a class="btn btn-sm btn-outline-primary" href="employee_view.php?id=<?= e((string)$emp['id']) ?>">Detail</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
101
includes/db_init.php
Normal file
101
includes/db_init.php
Normal file
@ -0,0 +1,101 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/../db/config.php';
|
||||
|
||||
if (!function_exists('ensure_schema')) {
|
||||
function ensure_schema(): void {
|
||||
$pdo = db();
|
||||
$pdo->exec("
|
||||
CREATE TABLE IF NOT EXISTS departments (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
name VARCHAR(120) NOT NULL,
|
||||
code VARCHAR(20) NOT NULL,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||
");
|
||||
|
||||
$pdo->exec("
|
||||
CREATE TABLE IF NOT EXISTS positions (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
name VARCHAR(120) NOT NULL,
|
||||
level VARCHAR(60) DEFAULT NULL,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||
");
|
||||
|
||||
$pdo->exec("
|
||||
CREATE TABLE IF NOT EXISTS employees (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
employee_code VARCHAR(30) NOT NULL,
|
||||
full_name VARCHAR(160) NOT NULL,
|
||||
email VARCHAR(160) DEFAULT NULL,
|
||||
phone VARCHAR(40) DEFAULT NULL,
|
||||
status VARCHAR(40) NOT NULL DEFAULT 'Aktif',
|
||||
employment_type VARCHAR(60) DEFAULT 'Kontrak',
|
||||
hire_date DATE DEFAULT NULL,
|
||||
dept_id INT DEFAULT NULL,
|
||||
position_id INT DEFAULT NULL,
|
||||
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
|
||||
INDEX idx_dept (dept_id),
|
||||
INDEX idx_position (position_id)
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||
");
|
||||
}
|
||||
}
|
||||
|
||||
if (!function_exists('seed_demo_data')) {
|
||||
function seed_demo_data(): void {
|
||||
$pdo = db();
|
||||
|
||||
$deptCount = (int)$pdo->query("SELECT COUNT(*) FROM departments")->fetchColumn();
|
||||
if ($deptCount === 0) {
|
||||
$stmt = $pdo->prepare("INSERT INTO departments (name, code) VALUES (?, ?)");
|
||||
$rows = [
|
||||
['HR & People Ops', 'HR'],
|
||||
['Finance', 'FIN'],
|
||||
['Technology', 'TECH'],
|
||||
['Operations', 'OPS'],
|
||||
];
|
||||
foreach ($rows as $row) {
|
||||
$stmt->execute($row);
|
||||
}
|
||||
}
|
||||
|
||||
$posCount = (int)$pdo->query("SELECT COUNT(*) FROM positions")->fetchColumn();
|
||||
if ($posCount === 0) {
|
||||
$stmt = $pdo->prepare("INSERT INTO positions (name, level) VALUES (?, ?)");
|
||||
$rows = [
|
||||
['HR Manager', 'Lead'],
|
||||
['Recruiter', 'Staff'],
|
||||
['Software Engineer', 'Staff'],
|
||||
['Finance Analyst', 'Staff'],
|
||||
];
|
||||
foreach ($rows as $row) {
|
||||
$stmt->execute($row);
|
||||
}
|
||||
}
|
||||
|
||||
$empCount = (int)$pdo->query("SELECT COUNT(*) FROM employees")->fetchColumn();
|
||||
if ($empCount === 0) {
|
||||
$deptMap = $pdo->query("SELECT id, code FROM departments")->fetchAll(PDO::FETCH_KEY_PAIR);
|
||||
$posMap = $pdo->query("SELECT id, name FROM positions")->fetchAll(PDO::FETCH_KEY_PAIR);
|
||||
$stmt = $pdo->prepare("
|
||||
INSERT INTO employees (employee_code, full_name, email, phone, status, employment_type, hire_date, dept_id, position_id)
|
||||
VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)
|
||||
");
|
||||
$samples = [
|
||||
['EMP-001', 'Anisa Putri', 'anisa@company.id', '0812-100-200', 'Aktif', 'Kontrak', '2024-05-10', $deptMap['HR'], $posMap['HR Manager']],
|
||||
['EMP-002', 'Rafi Nugraha', 'rafi@company.id', '0812-301-222', 'Aktif', 'Tetap', '2023-11-02', $deptMap['TECH'], $posMap['Software Engineer']],
|
||||
['EMP-003', 'Sinta Rahma', 'sinta@company.id', '0813-403-900', 'Probation', 'Kontrak', '2025-01-08', $deptMap['OPS'], $posMap['Recruiter']],
|
||||
['EMP-004', 'Dimas Prakoso', 'dimas@company.id', '0812-112-555', 'Aktif', 'Tetap', '2022-06-19', $deptMap['FIN'], $posMap['Finance Analyst']],
|
||||
];
|
||||
foreach ($samples as $row) {
|
||||
$stmt->execute($row);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ensure_schema();
|
||||
seed_demo_data();
|
||||
13
includes/helpers.php
Normal file
13
includes/helpers.php
Normal file
@ -0,0 +1,13 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
function e(?string $value): string {
|
||||
return htmlspecialchars((string)($value ?? ''), ENT_QUOTES, 'UTF-8');
|
||||
}
|
||||
|
||||
function format_date(?string $value): string {
|
||||
if (!$value) return '-';
|
||||
$ts = strtotime($value);
|
||||
if ($ts === false) return e($value);
|
||||
return date('d M Y', $ts);
|
||||
}
|
||||
68
includes/layout.php
Normal file
68
includes/layout.php
Normal file
@ -0,0 +1,68 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/../db/config.php';
|
||||
require_once __DIR__ . '/db_init.php';
|
||||
require_once __DIR__ . '/helpers.php';
|
||||
|
||||
function render_header(string $title, string $active = ''): void {
|
||||
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||
?>
|
||||
<!doctype html>
|
||||
<html lang="id">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title><?= e($title) ?></title>
|
||||
<?php if ($projectDescription): ?>
|
||||
<meta name="description" content='<?= e($projectDescription) ?>' />
|
||||
<meta property="og:description" content="<?= e($projectDescription) ?>" />
|
||||
<meta property="twitter:description" content="<?= e($projectDescription) ?>" />
|
||||
<?php endif; ?>
|
||||
<?php if ($projectImageUrl): ?>
|
||||
<meta property="og:image" content="<?= e($projectImageUrl) ?>" />
|
||||
<meta property="twitter:image" content="<?= e($projectImageUrl) ?>" />
|
||||
<?php endif; ?>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?= time() ?>" />
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-white border-bottom sticky-top app-nav">
|
||||
<div class="container">
|
||||
<a class="navbar-brand fw-semibold" href="index.php">Sistem Informasi Kepegawaian</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNav" aria-controls="mainNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<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 === 'employees' ? 'active' : '' ?>" href="employees.php">Pegawai</a></li>
|
||||
<li class="nav-item"><a class="nav-link <?= $active === 'departments' ? 'active' : '' ?>" href="departments.php">Departemen</a></li>
|
||||
<li class="nav-item"><a class="nav-link <?= $active === 'positions' ? 'active' : '' ?>" href="positions.php">Jabatan</a></li>
|
||||
</ul>
|
||||
<div class="d-flex gap-2">
|
||||
<a href="employee_new.php" class="btn btn-primary btn-sm">Tambah Pegawai</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main class="container my-4 my-lg-5">
|
||||
<?php
|
||||
}
|
||||
|
||||
function render_footer(): void {
|
||||
?>
|
||||
</main>
|
||||
<footer class="border-top py-3 mt-4">
|
||||
<div class="container d-flex flex-wrap justify-content-between small text-muted">
|
||||
<span>© <?= date('Y') ?> HRIS · Sistem Informasi Kepegawaian</span>
|
||||
<span>Updated <?= date('d M Y, H:i') ?> UTC</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=<?= time() ?>"></script>
|
||||
</body>
|
||||
</html>
|
||||
<?php
|
||||
}
|
||||
312
index.php
312
index.php
@ -1,150 +1,172 @@
|
||||
<?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/layout.php';
|
||||
|
||||
$pdo = db();
|
||||
$stats = [
|
||||
'employees' => (int)$pdo->query("SELECT COUNT(*) FROM employees")->fetchColumn(),
|
||||
'departments' => (int)$pdo->query("SELECT COUNT(*) FROM departments")->fetchColumn(),
|
||||
'positions' => (int)$pdo->query("SELECT COUNT(*) FROM positions")->fetchColumn(),
|
||||
];
|
||||
|
||||
$deptSummary = $pdo->query("
|
||||
SELECT d.name, d.code, COUNT(e.id) AS total
|
||||
FROM departments d
|
||||
LEFT JOIN employees e ON e.dept_id = d.id
|
||||
GROUP BY d.id
|
||||
ORDER BY total DESC, d.name ASC
|
||||
LIMIT 6
|
||||
")->fetchAll();
|
||||
|
||||
$posSummary = $pdo->query("
|
||||
SELECT p.name, p.level, COUNT(e.id) AS total
|
||||
FROM positions p
|
||||
LEFT JOIN employees e ON e.position_id = p.id
|
||||
GROUP BY p.id
|
||||
ORDER BY total DESC, p.name ASC
|
||||
LIMIT 6
|
||||
")->fetchAll();
|
||||
|
||||
$recentEmployees = $pdo->query("
|
||||
SELECT e.id, e.full_name, e.employee_code, e.status, d.name AS dept_name, p.name AS position_name
|
||||
FROM employees e
|
||||
LEFT JOIN departments d ON d.id = e.dept_id
|
||||
LEFT JOIN positions p ON p.id = e.position_id
|
||||
ORDER BY e.created_at DESC
|
||||
LIMIT 5
|
||||
")->fetchAll();
|
||||
|
||||
render_header('Dashboard HRIS', '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>
|
||||
</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 class="mb-4">
|
||||
<h1 class="display-6 fw-semibold">Dashboard HRIS</h1>
|
||||
<p class="small-muted">Ringkasan data pegawai, departemen, dan jabatan terbaru untuk tim HR dan manajer.</p>
|
||||
</div>
|
||||
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-md-4">
|
||||
<div class="stat-card">
|
||||
<div class="stat-label">Total Pegawai</div>
|
||||
<div class="stat-value"><?= e((string)$stats['employees']) ?></div>
|
||||
<div class="small-muted">Termasuk status aktif & probation</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
Page updated: <?= htmlspecialchars($now) ?> (UTC)
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="stat-card">
|
||||
<div class="stat-label">Departemen</div>
|
||||
<div class="stat-value"><?= e((string)$stats['departments']) ?></div>
|
||||
<div class="small-muted">Struktur organisasi aktif</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="stat-card">
|
||||
<div class="stat-label">Jabatan</div>
|
||||
<div class="stat-value"><?= e((string)$stats['positions']) ?></div>
|
||||
<div class="small-muted">Role yang tersedia</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-7">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header d-flex align-items-center justify-content-between">
|
||||
<span class="section-title">Distribusi Departemen</span>
|
||||
<a href="departments.php" class="btn btn-outline-primary btn-sm">Kelola Departemen</a>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (count($deptSummary) === 0): ?>
|
||||
<div class="empty-state">Belum ada departemen. Tambahkan data departemen pertama Anda.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Departemen</th>
|
||||
<th>Kode</th>
|
||||
<th>Total Pegawai</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($deptSummary as $dept): ?>
|
||||
<tr>
|
||||
<td><?= e($dept['name']) ?></td>
|
||||
<td><span class="badge-soft"><?= e($dept['code']) ?></span></td>
|
||||
<td><?= e((string)$dept['total']) ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header d-flex align-items-center justify-content-between">
|
||||
<span class="section-title">Distribusi Jabatan</span>
|
||||
<a href="positions.php" class="btn btn-outline-primary btn-sm">Kelola Jabatan</a>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (count($posSummary) === 0): ?>
|
||||
<div class="empty-state">Belum ada jabatan. Tambahkan jabatan untuk tim Anda.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Jabatan</th>
|
||||
<th>Level</th>
|
||||
<th>Total Pegawai</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($posSummary as $pos): ?>
|
||||
<tr>
|
||||
<td><?= e($pos['name']) ?></td>
|
||||
<td><?= e($pos['level'] ?? '-') ?></td>
|
||||
<td><?= e((string)$pos['total']) ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex align-items-center justify-content-between">
|
||||
<span class="section-title">Pegawai Terbaru</span>
|
||||
<a href="employees.php" class="btn btn-outline-primary btn-sm">Lihat Semua</a>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (count($recentEmployees) === 0): ?>
|
||||
<div class="empty-state">Belum ada pegawai. Mulai tambah data pegawai baru.</div>
|
||||
<?php else: ?>
|
||||
<div class="d-grid gap-3">
|
||||
<?php foreach ($recentEmployees as $emp): ?>
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div>
|
||||
<div class="fw-semibold"><?= e($emp['full_name']) ?></div>
|
||||
<div class="small-muted"><?= e($emp['employee_code']) ?> · <?= e($emp['dept_name'] ?? 'Tanpa Departemen') ?></div>
|
||||
<div class="small text-muted"><?= e($emp['position_name'] ?? 'Tanpa Jabatan') ?></div>
|
||||
</div>
|
||||
<div class="text-end">
|
||||
<span class="badge bg-light text-dark border"><?= e($emp['status']) ?></span>
|
||||
<div><a class="small text-decoration-none" href="employee_view.php?id=<?= e((string)$emp['id']) ?>">Detail</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
|
||||
114
positions.php
Normal file
114
positions.php
Normal file
@ -0,0 +1,114 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
require_once __DIR__ . '/includes/layout.php';
|
||||
|
||||
$pdo = db();
|
||||
$errors = [];
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
$name = trim($_POST['name'] ?? '');
|
||||
$level = trim($_POST['level'] ?? '');
|
||||
|
||||
if ($name === '') {
|
||||
$errors[] = 'Nama jabatan wajib diisi.';
|
||||
}
|
||||
|
||||
if (!$errors) {
|
||||
$stmt = $pdo->prepare("INSERT INTO positions (name, level) VALUES (:name, :level)");
|
||||
$stmt->execute([':name' => $name, ':level' => $level !== '' ? $level : null]);
|
||||
header('Location: positions.php?success=1');
|
||||
exit;
|
||||
}
|
||||
}
|
||||
|
||||
$positions = $pdo->query("
|
||||
SELECT p.*, COUNT(e.id) AS total_employee
|
||||
FROM positions p
|
||||
LEFT JOIN employees e ON e.position_id = p.id
|
||||
GROUP BY p.id
|
||||
ORDER BY p.name ASC
|
||||
")->fetchAll();
|
||||
|
||||
render_header('Data Jabatan', 'positions');
|
||||
?>
|
||||
|
||||
<div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-4">
|
||||
<div>
|
||||
<h1 class="h3 fw-semibold mb-1">Jabatan</h1>
|
||||
<p class="small-muted mb-0">Master data jabatan dan level dalam organisasi.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (isset($_GET['success'])): ?>
|
||||
<div class="alert alert-success" data-autohide="true">Jabatan berhasil ditambahkan.</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($errors): ?>
|
||||
<div class="alert alert-danger">
|
||||
<ul class="mb-0">
|
||||
<?php foreach ($errors as $err): ?>
|
||||
<li><?= e($err) ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-5">
|
||||
<form method="post" class="card">
|
||||
<div class="card-header">
|
||||
<span class="section-title">Tambah Jabatan</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Nama Jabatan</label>
|
||||
<input type="text" name="name" class="form-control" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Level (Opsional)</label>
|
||||
<input type="text" name="level" class="form-control" placeholder="Staff / Lead / Manager">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer bg-white">
|
||||
<button type="submit" class="btn btn-primary">Simpan Jabatan</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="col-lg-7">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between">
|
||||
<span class="section-title">Daftar Jabatan</span>
|
||||
<span class="small-muted"><?= count($positions) ?> total</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if (count($positions) === 0): ?>
|
||||
<div class="empty-state">Belum ada jabatan. Tambahkan jabatan baru.</div>
|
||||
<?php else: ?>
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Jabatan</th>
|
||||
<th>Level</th>
|
||||
<th>Jumlah Pegawai</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($positions as $pos): ?>
|
||||
<tr>
|
||||
<td><?= e($pos['name']) ?></td>
|
||||
<td><?= e($pos['level'] ?? '-') ?></td>
|
||||
<td><?= e((string)$pos['total_employee']) ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php render_footer(); ?>
|
||||
Loading…
x
Reference in New Issue
Block a user