From 849e6ceef0fb845a86c55147a5230f9a9443e104 Mon Sep 17 00:00:00 2001
From: Jimmy Liow <lyj@hainatravel.com>
Date: Mon, 17 Jun 2024 10:59:14 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E6=9D=83=E9=99=90?=
 =?UTF-8?q?=E6=8E=A7=E5=88=B6=E7=BB=84=E4=BB=B6=E6=96=B9=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/RequireAuth.jsx   |  3 ++-
 src/main.jsx                     |  2 +-
 src/views/account/Management.jsx | 11 ++++++++++-
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/RequireAuth.jsx b/src/components/RequireAuth.jsx
index 24bbdae..d8feee7 100644
--- a/src/components/RequireAuth.jsx
+++ b/src/components/RequireAuth.jsx
@@ -6,8 +6,9 @@ export default function RequireAuth({ children, ...props }, ) {
   const isPermitted = useAuthStore((state) => state.isPermitted)
 
   if (isPermitted(props.subject)) {
+  // if (props.subject === '/account/management') {
     return children
-  } else {
+  } else if (props.result) {
     return (
       <Result
         status='403'
diff --git a/src/main.jsx b/src/main.jsx
index a5c8525..953db33 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -56,7 +56,7 @@ const router = createBrowserRouter([
       { path: "reservation/:reservationId", element: <ReservationDetail />},
       { path: "account/change-password", element: <ChangePassword />},
       { path: "account/profile", element: <AccountProfile />},
-      { path: "account/management", element: <RequireAuth subject={PERM_ACCOUNT_MANAGEMENT}><AccountManagement /></RequireAuth>},
+      { path: "account/management", element: <RequireAuth subject={PERM_ACCOUNT_MANAGEMENT} result={true}><AccountManagement /></RequireAuth>},
       { path: "feedback", element: <FeedbackIndex />},
       { path: "feedback/:GRI_SN/:CII_SN/:RefNo", element: <FeedbackCustomerDetail />},
       { path: "feedback/:GRI_SN/:RefNo", element: <FeedbackDetail />},
diff --git a/src/views/account/Management.jsx b/src/views/account/Management.jsx
index 5f063e0..d98dbd8 100644
--- a/src/views/account/Management.jsx
+++ b/src/views/account/Management.jsx
@@ -3,8 +3,11 @@ import { Row, Col, Space, Button, Table, Select, TreeSelect, Typography, Modal,
 import { ExclamationCircleFilled } from '@ant-design/icons'
 import { useTranslation } from 'react-i18next'
 import useFormStore from '@/stores/Form'
+import useAuthStore from '@/stores/Auth'
 import useReservationStore from '@/stores/Reservation'
 import SearchForm from '@/components/SearchForm'
+import RequireAuth from '@/components/RequireAuth'
+import { PERM_ROLE_NEW } from '@/config'
 
 const { Title } = Typography
 
@@ -69,6 +72,7 @@ const permissionData = [
 
 function Management() {
   const { t } = useTranslation()
+
   const accountListColumns = [
     {
       title: t('account:username'),
@@ -174,6 +178,9 @@ function Management() {
 
   const formValuesToSub = useFormStore((state) => state.formValuesToSub)
 
+
+  const isPermitted = useAuthStore((state) => state.isPermitted)
+
   const [editAccountForm, editRoleForm] = Form.useForm()
   const [fetchReservationList] =
     useReservationStore((state) =>
@@ -388,7 +395,9 @@ function Management() {
           <Col span={24}>
             <Space>
               <Button onClick={() => setAccountModalOpen(true)}>{t('account:management.newAccount')}</Button>
-              <Button onClick={() => setRoleModalOpen(true)}>{t('account:management.newRole')}</Button>
+              <RequireAuth subject={PERM_ROLE_NEW}>
+                <Button onClick={() => setRoleModalOpen(true)}>{t('account:management.newRole')}</Button>
+              </RequireAuth>
             </Space>
           </Col>
         </Row>