From ee281986b8b50dec12777818ff4626f578c79622 Mon Sep 17 00:00:00 2001
From: dbdbd9 <hoangvi0206@gmail.com>
Date: Tue, 1 Jul 2025 16:36:21 +0700
Subject: [PATCH] update permission display for leave management

---
 .../pages/LeaveManagement/LeaveManagement.tsx | 207 ++++++++++++------
 1 file changed, 136 insertions(+), 71 deletions(-)

diff --git a/FRONTEND/src/pages/LeaveManagement/LeaveManagement.tsx b/FRONTEND/src/pages/LeaveManagement/LeaveManagement.tsx
index 744229d..1791eed 100644
--- a/FRONTEND/src/pages/LeaveManagement/LeaveManagement.tsx
+++ b/FRONTEND/src/pages/LeaveManagement/LeaveManagement.tsx
@@ -40,6 +40,8 @@ import {
 } from '@/api/Admin'
 import { update, Xdelete } from '@/rtk/helpers/CRUD'
 import { get, exportFile } from '@/rtk/helpers/apiService'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/rtk/store'
 
 interface User {
   id: number
@@ -95,6 +97,8 @@ interface UserData {
 // }
 
 const LeaveManagement = () => {
+  const user = useSelector((state: RootState) => state.authentication)
+
   const [opened1, { open: open1, close: close1 }] = useDisclosure(false)
   const [openedDetailOff, { open: openDetailOff, close: closeDetailOff }] =
     useDisclosure(false)
@@ -527,6 +531,14 @@ const LeaveManagement = () => {
           }}
           label={'Phép năm'}
           placeholder="Nhập số ngày phép năm"
+          disabled={
+            !['admin', 'hr'].some((role) =>
+              user.user.user.permission
+                .split(',')
+                .map((p: string) => p.trim())
+                .includes(role),
+            )
+          }
         />
         <TextInput
           mb={'md'}
@@ -554,6 +566,14 @@ const LeaveManagement = () => {
           }}
           label={'Phép năm cũ'}
           placeholder="Nhập số ngày phép năm cũ"
+          disabled={
+            !['admin', 'hr'].some((role) =>
+              user.user.user.permission
+                .split(',')
+                .map((p: string) => p.trim())
+                .includes(role),
+            )
+          }
         />
         <TextInput
           mb={'md'}
@@ -581,6 +601,14 @@ const LeaveManagement = () => {
           }}
           label={'Phép đặc biệt'}
           placeholder="Nhập số ngày phép đặc biệt"
+          disabled={
+            !['admin', 'hr'].some((role) =>
+              user.user.user.permission
+                .split(',')
+                .map((p: string) => p.trim())
+                .includes(role),
+            )
+          }
         />
         <Textarea
           mb={'md'}
@@ -590,40 +618,57 @@ const LeaveManagement = () => {
             setCustomAddNotes({ ...customAddNotes, note: e.target.value })
           }}
           rows={10}
+          disabled={
+            !['admin', 'hr'].some((role) =>
+              user.user.user.permission
+                .split(',')
+                .map((p: string) => p.trim())
+                .includes(role),
+            )
+          }
         />
 
-        <Button
-          onClick={() => {
-            setDisableBtn(true)
-            if (
-              customAddNotes.id === 0
-              // ||
-              // customAddNotes.totalLeave === '' ||
-              // customAddNotes.totalLeave === '0'
-              // customAddNotes.dayAdditional === 0 ||
-              // customAddNotes.note === ''
-            ) {
-              notifications.show({
-                title: 'Error',
-                message: 'Input data required',
-                color: 'red',
-              })
-              setDisableBtn(false)
-            } else {
-              updateInfoNote(
-                customAddNotes.id,
-                customAddNotes.user,
-                customAddNotes.totalLeave,
-                customAddNotes.dayAdditional,
-                customAddNotes.specialLeave,
-                customAddNotes.note,
-              )
-            }
-          }}
-          disabled={disableBtn}
-        >
-          Save
-        </Button>
+        {['admin', 'hr'].some((role) =>
+          user.user.user.permission
+            .split(',')
+            .map((p: string) => p.trim())
+            .includes(role),
+        ) ? (
+          <Button
+            onClick={() => {
+              setDisableBtn(true)
+              if (
+                customAddNotes.id === 0
+                // ||
+                // customAddNotes.totalLeave === '' ||
+                // customAddNotes.totalLeave === '0'
+                // customAddNotes.dayAdditional === 0 ||
+                // customAddNotes.note === ''
+              ) {
+                notifications.show({
+                  title: 'Error',
+                  message: 'Input data required',
+                  color: 'red',
+                })
+                setDisableBtn(false)
+              } else {
+                updateInfoNote(
+                  customAddNotes.id,
+                  customAddNotes.user,
+                  customAddNotes.totalLeave,
+                  customAddNotes.dayAdditional,
+                  customAddNotes.specialLeave,
+                  customAddNotes.note,
+                )
+              }
+            }}
+            disabled={disableBtn}
+          >
+            Save
+          </Button>
+        ) : (
+          ''
+        )}
       </Drawer>
 
       {/* Filter Year, Export Btn */}
@@ -1102,7 +1147,17 @@ const LeaveManagement = () => {
             <Table.Tr>
               <Table.Th>Time</Table.Th>
               <Table.Th>Status</Table.Th>
-              <Table.Th>Action</Table.Th>
+
+              {['admin', 'hr'].some((role) =>
+                user.user.user.permission
+                  .split(',')
+                  .map((p: string) => p.trim())
+                  .includes(role),
+              ) ? (
+                <Table.Th>Action</Table.Th>
+              ) : (
+                ''
+              )}
             </Table.Tr>
           </Table.Thead>
 
@@ -1129,50 +1184,60 @@ const LeaveManagement = () => {
                         {item.reason_name}
                       </Badge>
                     </Table.Td>
-                    <Table.Td>
-                      {item.reason_code === 'ONLEAVE' ? (
-                        <IconRefresh
+
+                    {['admin', 'hr'].some((role) =>
+                      user.user.user.permission
+                        .split(',')
+                        .map((p: string) => p.trim())
+                        .includes(role),
+                    ) ? (
+                      <Table.Td>
+                        {item.reason_code === 'ONLEAVE' ? (
+                          <IconRefresh
+                            className={classes.deleteIcon}
+                            onClick={() => {
+                              setIsStatusConfirmOpen(true)
+                              setNoteStatus({
+                                id: item.id,
+                                reason: 'LEAVE_WITHOUT_PAY',
+                              })
+                            }}
+                            title="Chuyển thành không phép"
+                            width={20}
+                            height={20}
+                          />
+                        ) : item.reason_code === 'LEAVE_WITHOUT_PAY' ? (
+                          <IconRefresh
+                            className={classes.editIcon}
+                            onClick={() => {
+                              setIsStatusConfirmOpen(true)
+                              setNoteStatus({
+                                id: item.id,
+                                reason: 'ONLEAVE',
+                              })
+                            }}
+                            title="Chuyển thành có phép"
+                            width={20}
+                            height={20}
+                          />
+                        ) : (
+                          ''
+                        )}
+
+                        <IconTrash
                           className={classes.deleteIcon}
                           onClick={() => {
-                            setIsStatusConfirmOpen(true)
-                            setNoteStatus({
-                              id: item.id,
-                              reason: 'LEAVE_WITHOUT_PAY',
-                            })
+                            setNoteToDelete(item)
+                            setIsDeleteConfirmOpen(true)
                           }}
-                          title="Chuyển thành không phép"
+                          title="Xóa Note"
                           width={20}
                           height={20}
                         />
-                      ) : item.reason_code === 'LEAVE_WITHOUT_PAY' ? (
-                        <IconRefresh
-                          className={classes.editIcon}
-                          onClick={() => {
-                            setIsStatusConfirmOpen(true)
-                            setNoteStatus({
-                              id: item.id,
-                              reason: 'ONLEAVE',
-                            })
-                          }}
-                          title="Chuyển thành có phép"
-                          width={20}
-                          height={20}
-                        />
-                      ) : (
-                        ''
-                      )}
-
-                      <IconTrash
-                        className={classes.deleteIcon}
-                        onClick={() => {
-                          setNoteToDelete(item)
-                          setIsDeleteConfirmOpen(true)
-                        }}
-                        title="Xóa Note"
-                        width={20}
-                        height={20}
-                      />
-                    </Table.Td>
+                      </Table.Td>
+                    ) : (
+                      ''
+                    )}
                   </Table.Tr>
                 )
               })}