feature: change password

2026-07-08 13:03:48 +07:00
parent 63764d0718
commit 6056e33ef8
16 changed files with 371 additions and 56 deletions
@@ -1,6 +1,6 @@
@props(['active' => false])

-<aside class="sidebar flex flex-col h-full bg-white border-r border-gray-100 shadow-sm transition-transform duration-300 w-64 fixed inset-y-0 left-0 z-40 lg:relative lg:translate-x-0 -translate-x-full" aria-label="Main navigation">
+<aside class="sidebar flex flex-col justify-between h-screen w-60 bg-white border-r border-gray-100 shadow-sm transition-all duration-300 shrink-0 overflow-hidden fixed inset-y-0 left-0 z-40 -translate-x-full lg:sticky lg:top-0 lg:translate-x-0" aria-label="Main navigation">
    <div class="p-6 flex items-center justify-between shrink-0">
        <img src="{{ asset('images/logo.png') }}" alt="GMO-Z.com RUNSYSTEM" class="h-6 w-auto object-contain">
        <!-- Mobile hamburger button/close -->
@@ -1,7 +1,15 @@
-@props(['action', 'search' => '', 'flagSend' => '', 'selectedMonth' => ''])
+@props([
+    'action', 
+    'search' => '', 
+    'selectedMonth' => '', 
+    'status' => '1',
+    'role' => '',
+    'department' => '',
+    'flagSend' => ''
+])

-<form id="filterForm" action="{{ $action }}" method="GET" class="flex flex-col md:flex-row items-stretch md:items-center gap-3.5 w-full mb-6 bg-white p-5 rounded-[24px] border border-white shadow-[0_10px_30px_rgba(15,23,42,0.05)]">
-    <div class="relative flex items-center flex-1 min-w-[200px]">
+<form id="filterForm" action="{{ $action }}" method="GET" class="flex flex-col md:flex-row md:flex-wrap items-stretch md:items-center gap-3.5 w-full mb-6 bg-white p-5 rounded-[24px] border border-white shadow-[0_10px_30px_rgba(15,23,42,0.05)]">
+    <div class="relative flex items-center w-full lg:flex-1 lg:min-w-[200px]">
        <input type="text" id="searchInput" name="search" value="{{ $search }}" placeholder="Tìm MSNV hoặc Email..." class="form-input !py-1.5 !text-sm !pl-10 !pr-10 w-full border-[#d9dfe7] rounded-xl bg-white">
        <svg class="w-4 h-4 text-text-light absolute left-3.5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" style="pointer-events: none;">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
@@ -13,15 +21,40 @@
        </button>
    </div>
    
-    <select name="flag_send" id="flagSendFilter" class="form-input !py-1.5 !text-sm w-full md:w-auto border-[#d9dfe7] rounded-xl bg-white min-w-[180px]">
-        <option value="" {{ is_null($flagSend) || $flagSend === '' ? 'selected' : '' }}>Quyền gửi: Tất cả</option>
+    <!-- Status Filter -->
+    <select name="status" id="statusFilter" class="form-input !py-1.5 !text-sm !w-full md:!w-[150px] border-[#d9dfe7] rounded-xl bg-white shrink-0">
+        <option value="" {{ $status === '' ? 'selected' : '' }}>Tất cả trạng thái</option>
+        <option value="1" {{ $status === '1' ? 'selected' : '' }}>Hoạt động</option>
+        <option value="0" {{ $status === '0' ? 'selected' : '' }}>Nghỉ việc</option>
+    </select>
+
+    <!-- Role Filter -->
+    <select name="role" id="roleFilter" class="form-input !py-1.5 !text-sm !w-full md:!w-[130px] border-[#d9dfe7] rounded-xl bg-white shrink-0">
+        <option value="" {{ $role === '' ? 'selected' : '' }}>Tất cả vai trò</option>
+        <option value="1" {{ $role === '1' ? 'selected' : '' }}>Admin</option>
+        <option value="0" {{ $role === '0' ? 'selected' : '' }}>Member</option>
+    </select>
+
+    <!-- Department Filter -->
+    <select name="department" id="departmentFilter" class="form-input !py-1.5 !text-sm !w-full md:!w-[170px] border-[#d9dfe7] rounded-xl bg-white shrink-0">
+        <option value="" {{ $department === '' ? 'selected' : '' }}>Tất cả phòng ban</option>
+        <option value="1" {{ $department === '1' ? 'selected' : '' }}>Phòng Phát Triển (Dev)</option>
+        <option value="2" {{ $department === '2' ? 'selected' : '' }}>Phòng Nhân Sự (HR)</option>
+        <option value="3" {{ $department === '3' ? 'selected' : '' }}>Phòng Kinh Doanh (Sale)</option>
+        <option value="4" {{ $department === '4' ? 'selected' : '' }}>Ban Giám Đốc (Board)</option>
+        <option value="5" {{ $department === '5' ? 'selected' : '' }}>Phòng Marketing</option>
+    </select>
+
+    <!-- Flag Send Filter -->
+    <select name="flag_send" id="flagSendFilter" class="form-input !py-1.5 !text-sm !w-full md:!w-[150px] border-[#d9dfe7] rounded-xl bg-white shrink-0">
+        <option value="" {{ $flagSend === '' ? 'selected' : '' }}>Tất cả quyền gửi</option>
        <option value="1" {{ $flagSend === '1' ? 'selected' : '' }}>Được gửi</option>
        <option value="0" {{ $flagSend === '0' ? 'selected' : '' }}>Không được gửi</option>
    </select>

-    <input type="month" name="month" id="monthFilter" value="{{ $selectedMonth }}" class="form-input !py-1.5 !text-sm w-full md:w-auto border-[#d9dfe7] rounded-xl bg-white">
+    <input type="month" name="month" id="monthFilter" value="{{ $selectedMonth }}" class="form-input !py-1.5 !text-sm !w-full md:!w-[140px] border-[#d9dfe7] rounded-xl bg-white shrink-0">

-    <div class="flex items-center gap-2 w-full md:w-auto shrink-0">
+    <div class="flex items-center gap-2 w-full md:w-auto md:ml-auto shrink-0">
        <button type="submit" id="btnFilter" class="btn-primary !py-2.5 !px-5 text-sm rounded-xl font-bold shadow-md shadow-blue-500/10 !bg-[#3462f7] hover:!bg-blue-700 flex items-center justify-center min-w-[80px] flex-1 md:flex-none">Tìm</button>
        <button type="button" id="btnClearFilters" class="btn-secondary !py-2.5 !px-5 text-sm rounded-xl font-bold border border-[#d9dfe7] hover:bg-gray-100 flex items-center justify-center min-w-[100px] flex-1 md:flex-none">Xóa bộ lọc</button>
    </div>