-

src/components/notification/Notification.js

@@ -0,0 +1,55 @@
+import { notification } from 'antd'
+import _ from 'lodash'
+
+const def = {
+  message: '성공',
+  description: '정상 처리 되었습니다.'
+}
+
+/**
+ * @description
+ * Notifacation Success
+ *
+ * @param {Object} data - {message: string, description: string}
+ */
+export const notificationSuccess = (data) => {
+  notification.success({
+    message: !_.isEmpty(data.message) ? data.message : def.message,
+    description: !_.isEmpty(data.description)
+      ? data.description
+      : def.description,
+    placement: 'topRight'
+  })
+}
+
+/**
+ * @description
+ * Notifacation Info
+ *
+ * @param {Object} data - {message: string, description: string}
+ */
+export const notificationInfo = (data) => {
+  notification.info({
+    message: !_.isEmpty(data.message) ? data.message : def.message,
+    description: !_.isEmpty(data.description)
+      ? data.description
+      : def.description,
+    placement: 'topRight'
+  })
+}
+
+/**
+ * @description
+ * Notifacation Error
+ *
+ * @param {Object} data - {message: string, description: string}
+ */
+export const notificationError = (data) => {
+  notification.error({
+    message: !_.isEmpty(data.message) ? data.message : def.message,
+    description: !_.isEmpty(data.description)
+      ? data.description
+      : def.description,
+    placement: 'topRight'
+  })
+}

src/views/cloudPcInfo/CloudPcResource.js

@@ -3,6 +3,7 @@ import { Col, Card, Row, Button, message } from 'antd'
 import { call_updateVmAlias } from '../../api/resource'
 import { AliasChangeMdoal } from '../dashboard/DashboardModal'
 import { aliasChangeMdoalOptions } from '../../utils/modalOptions'
+import { notificationSuccess } from '../../components/notification/Notification'
 
 import iconCpu from '../../assets/images/security/ico_cpu.png'
 import iconMem from '../../assets/images/security/ico_mem.png'
@@ -57,7 +58,7 @@ const CloudPcResource = ({
       const model = { newAlias: data.newAlias, vmAuthId: alias.vm_auth_id }
       const { status } = await call_updateVmAlias(model)
       if (status === 200) {
-        message.success('별칭이 변경 되었습니다.')
+        notificationSuccess({ description: '별칭이 변경 되었습니다.' })
         setIsModalVisible(false)
         callback()
       }

src/views/cloudPcInfo/components/ResourceModal.js

@@ -1,16 +1,19 @@
 /* eslint-disable react-hooks/exhaustive-deps */
+import _ from 'lodash'
+import moment from 'moment'
 import React, { useEffect, useState } from 'react'
 import { Form, Input, DatePicker, message } from 'antd'
 import {
   call_userPcPeriodHistory,
   call_userPcPeriodRequest,
   call_userPcPeriodRequestCancel
 } from '../../../api/user'
-import { confirmBox, infoBox } from '../../../components/messageBox/MessageBox'
 import CommonWrapperModal from '../../../components/modal/CommonWrapperModal'
-
-import _ from 'lodash'
-import moment from 'moment'
+import { confirmBox, infoBox } from '../../../components/messageBox/MessageBox'
+import {
+  notificationSuccess,
+  notificationInfo
+} from '../../../components/notification/Notification'
 
 const dateFormat = 'YYYY-MM-DD'
 
@@ -113,8 +116,10 @@ export const PeriodExtensionModal = (rootProps) => {
             payload
           )
           if (status === 200) {
-            message.config({ top: 100 })
-            message.info('신청이 취소 되었습니다.')
+            notificationInfo({
+              message: '알림',
+              description: '신청이 취소 되었습니다.'
+            })
             parentProps.handleCancel()
           }
         } catch (error) {
@@ -145,7 +150,7 @@ export const PeriodExtensionModal = (rootProps) => {
         try {
           const { status } = await call_userPcPeriodRequest(payload)
           if (status === 200) {
-            message.success('기간 연장 신청 되었습니다.')
+            notificationSuccess({ description: '기간 연장 신청 되었습니다.' })
             parentProps.handleCancel()
           }
         } catch (error) {

src/views/dashboard/Dashboard.js

@@ -1,6 +1,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
+import _ from 'lodash'
 import React, { useEffect, useState } from 'react'
-import { Row, Col, Collapse, Space, Spin, Menu, Button, message } from 'antd'
+import { Row, Col, Collapse, Space, Spin, Menu, Button } from 'antd'
 import { DesktopOutlined } from '@ant-design/icons'
 import { userResourceFactory } from '../../api/factory/resource_factory'
 import {
@@ -16,8 +17,7 @@ import CustomHeader from './CustomHeader'
 import ControlContent from './ControlContent'
 import { AliasChangeMdoal } from './DashboardModal'
 import { aliasChangeMdoalOptions } from '../../utils/modalOptions'
-
-import _ from 'lodash'
+import { notificationSuccess } from '../../components/notification/Notification'
 
 const { Panel } = Collapse
 
@@ -151,7 +151,7 @@ function Dashboard() {
         setResource(resourceList)
         setAlias(null)
         setIsModalVisible(false)
-        message.success('별칭이 변경 되었습니다.')
+        notificationSuccess({ description: '별칭이 변경 되었습니다.' })
       }
     } catch (error) {
       console.error(error)

src/views/login/Login.js

@@ -10,13 +10,13 @@ import {
   Form,
   Space,
   Row,
-  message,
   Typography
 } from 'antd'
 import { UserOutlined, LockOutlined } from '@ant-design/icons'
 import { authUser, userAccount } from '../../store/actions/user_action'
 import { SET_LOADING } from '../../store/modules/app'
 import { useNavigate } from 'react-router-dom'
+import { notificationSuccess } from '../../components/notification/Notification'
 import _ from 'lodash'
 
 import banner1 from '../../assets/images/login/user_banner_01.png'
@@ -71,7 +71,9 @@ const Login = () => {
               setTimeout(() => {
                 navigate('/dashboard', { replace: true })
                 dispatch(SET_LOADING(false))
-                message.info('정상적으로 로그인 되었습니다.')
+                notificationSuccess({
+                  description: '정상적으로 로그인 되었습니다.'
+                })
               }, 600)
             }
           }