From 9f65883534d9541067a6882fb495e226d87e9fb8 Mon Sep 17 00:00:00 2001
From: Edison <ewow0981@gmail.com>
Date: Fri, 2 Jan 2026 15:15:20 +0800
Subject: [PATCH] arrow detailed

---
 src/components/PersonnelManagement.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/PersonnelManagement.vue b/src/components/PersonnelManagement.vue
index c55980b..284f332 100644
--- a/src/components/PersonnelManagement.vue
+++ b/src/components/PersonnelManagement.vue
@@ -58,19 +58,24 @@
             class="border border-gray-300 dark:border-gray-600 rounded-md px-3 py-2 w-full shadow-sm focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-gray-700 text-gray-900 dark:text-white" />
         </div>
         <div class="shrink-0 flex flex-col gap-2">
-          <label for="department-filter" class="text-sm font-medium text-gray-700 dark:text-gray-300">{{
-            $t('departmentFilter') }}</label>
+        <label for="department-filter" class="text-sm font-medium text-gray-700 dark:text-gray-300">{{
+          $t('departmentFilter') }}</label>
+        <div class="relative">
           <select
             id="department-filter"
             v-model="selectedDepartment"
-            class="border border-gray-300 dark:border-gray-600 rounded-md px-3 py-2 focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-gray-700 text-gray-900 dark:text-white min-w-[180px]"
+            class="appearance-none border border-gray-300 dark:border-gray-600 rounded-md pl-3 pr-10 py-2 focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-gray-700 text-gray-900 dark:text-white min-w-[180px] w-full"
           >
             <option value="">{{ $t('allDepartments') }}</option>
             <option v-for="dept in departments" :key="dept" :value="dept">
               {{ dept }}
             </option>
           </select>
+          <svg xmlns="http://www.w3.org/2000/svg" class="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-500 dark:text-gray-400 pointer-events-none" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+          </svg>
         </div>
+      </div>
         <div class="shrink-0 flex flex-col gap-2">
           <label for="export-start-date" class="text-sm font-medium text-gray-700 dark:text-gray-300">{{
             $t('startDate') }}</label>