알람

src/entities/alarm/ui/alarm-item.tsx

@@ -2,6 +2,9 @@ import { PATHS } from '@/shared/constants/paths';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import moment from 'moment';
+import { useAppAlarmMarkMutation } from '../api/use-app-alarm-mark-mutation';
+import { AppAlarmMarkParams, AppAlarmMarkResponse } from '../model/types';
+import { useStore } from '@/shared/model/store';
 
 export interface AlarmItemProps {
   appNotificationSequence?: number;
@@ -22,9 +25,52 @@ export const AlarmItem = ({
 }: AlarmItemProps) => {
   const { navigate } = useNavigate();
 
+  let userInfo = useStore.getState().UserStore.userInfo;
+  const {mutateAsync: appAlarmMark} = useAppAlarmMarkMutation();
+
   const onClickToNavigate = () => {
     let path = PATHS.support.notice.detail + appNotificationSequence;
-    // navigate(path);
+    let pathState = {};
+
+    console.log('appNotificationSequence : [' + appNotificationSequence + ']');
+    console.log('appNotificationCategory : [' + appNotificationCategory + ']');
+    console.log('notificationReceivedDate : [' + notificationReceivedDate + ']');
+    console.log('appNotificationTitle : [' + appNotificationTitle + ']');
+    console.log('appNotificationContent : [' + appNotificationContent + ']');
+    console.log('appNotificationLink : [' + appNotificationLink + ']');
+    
+    if(appNotificationCategory === '10'){
+
+    }
+    else if(appNotificationCategory === '20'){
+
+    }
+    else if(appNotificationCategory === '30'){
+
+    }
+    else if(appNotificationCategory === '40'){
+
+    }
+    else if(appNotificationCategory === '60'){
+      
+    }
+    navigate(path, {
+      state: pathState
+    });
+  };
+
+  const callAppAlarmMark = () => {
+    if(!!userInfo.usrid && !!appNotificationSequence){
+      let params: AppAlarmMarkParams = {
+        appNotificationSequence: appNotificationSequence,
+        usrid: userInfo.usrid
+      };
+      appAlarmMark(params).then((rs: AppAlarmMarkResponse) => {
+        console.log(rs);
+      }).finally(() => {
+        onClickToNavigate();
+      });
+    }
   };
 
   return (
@@ -38,7 +84,7 @@ export const AlarmItem = ({
       </div>
       <div 
         className="notice-arrow"
-        onClick={ () => onClickToNavigate() }
+        onClick={ () => callAppAlarmMark() }
       >
         <img 
           src={ IMAGE_ROOT + '/Forward.svg' }

src/entities/alarm/ui/alarm-list.tsx

@@ -123,6 +123,7 @@ export const AlarmList = ({
       <div className="notice-box sub">
       { getAlarmItems() }
       </div>
+      <div ref={ setTarget }></div>
       <div className="notice-alert">※ 알림은 90일간 보관 후 삭제됩니다.</div>
     </>
   );