비행승인리스트 보더라인 추가

3 months ago · 56b80b4560
5 changed files with 54 additions and 18 deletions
--- a/public/index.html
+++ b/public/index.html
@ -60,6 +60,7 @@
  </head>
  <body>
    <div id="root"></div>
+    <div id="spinner-root"></div>
    <!--
      This HTML file is a template.
      If you open it directly in the browser, you will see an empty page.
--- a/src/@core/components/spinner/Fallback-spinner.js
+++ b/src/@core/components/spinner/Fallback-spinner.js
@ -1,8 +1,9 @@
+import { createPortal } from 'react-dom';
 // ** Logo
-import logo from '@src/assets/images/logo/logo.png'
+import logo from '@src/assets/images/logo/kac_logo.svg';

 const SpinnerComponent = () => {
-  return (
+  return createPortal(
    <div className='fallback-spinner vh-100'>
      <img className='fallback-logo' src={logo} alt='logo' />
      <div className='loading'>
@ -10,8 +11,9 @@ const SpinnerComponent = () => {
        <div className='effect-2 effects'></div>
        <div className='effect-3 effects'></div>
      </div>
-    </div>
-  )
-}
+    </div>,
+    document.getElementById('spinner-root')
+  );
+};

-export default SpinnerComponent
+export default SpinnerComponent;
--- a/src/components/account/login/AccountLogin.js
+++ b/src/components/account/login/AccountLogin.js
@ -66,7 +66,7 @@ export const AccountLogin = ({ history }) => {
    }

    const { meta } = await dispatch(setLogin(loginForm));
-    console.log(meta);
+
    if (meta.requestStatus === 'fulfilled') {
      history.push('/control');
    }
--- a/src/components/flight/FlightApprovalsTable.js
+++ b/src/components/flight/FlightApprovalsTable.js
@ -30,10 +30,13 @@ export default function FlightApprovalsTable(props) {
  }, [laancAprvList]);

  // 행 토글
-  const toggleRow = rowId => {
+  const toggleRow = (e, row) => {
+    const parent = e.target.parentElement.parentElement;
+    parent.classList.add(`A${row.planSno}`);
+
    setExpandedRows({
      ...expandedRows,
-      [rowId]: !expandedRows[rowId]
+      [row.planSno]: !expandedRows[row.planSno]
    });
  };

@ -178,7 +181,7 @@ export default function FlightApprovalsTable(props) {
      width: '83px',
      cell: row =>
        row.areaList.length > 1 ? (
-          <Button color='flat-dark' onClick={() => toggleRow(row.planSno)}>
+          <Button color='flat-dark' onClick={e => toggleRow(e, row)}>
            {row.areaList.length}건<br /> 더보기
            {expandedRows[row.planSno] ? <FaAngleDown /> : <FaAngleUp />}
          </Button>
@ -381,15 +384,44 @@ export default function FlightApprovalsTable(props) {

  // 데이터 테이블 내부 컴포넌트
  const FlightInfoComponent = ({ data }) => {
+    useEffect(() => {
+      const expandeds = Object.keys(expandedRows);
+      if (expandeds.length > 0) {
+        expandeds.forEach(key => {
+          const el = document.querySelectorAll(`.A${key}`);
+
+          el.forEach((i, idx) => {
+            expandedRows[key]
+              ? idx === 0
+                ? (() => {
+                    i.style.borderTop = '2px solid blue';
+                    i.style.borderRight = '2px solid blue';
+                    i.style.borderLeft = '2px solid blue';
+                  })()
+                : (() => {
+                    i.style.borderBottom = '2px solid blue';
+                    i.style.borderRight = '2px solid blue';
+                    i.style.borderLeft = '2px solid blue';
+                  })()
+              : (() => {
+                  i.classList.remove(`A${key}`);
+                  i.style = '';
+                })();
+          });
+        });
+      }
+    }, []);
+
    return (
      <>
        <div
-        // style={{
-        //   borderBottom: '2px dashed #0000FF',
-        //   borderLeft: '2px dashed #0000FF',
-        //   borderRight: '2px dashed #0000FF',
-        //   cursor: 'pointer'
-        // }}
+          className={`A${data.planSno}`}
+          // style={{
+          //   borderBottom: '2px dashed #0000FF',
+          //   borderLeft: '2px dashed #0000FF',
+          //   borderRight: '2px dashed #0000FF',
+          //   cursor: 'pointer'
+          // }}
        >
          <DataTable
            className='flight-approval-in-table'
--- a/src/redux/features/account/auth/authThunk.ts
+++ b/src/redux/features/account/auth/authThunk.ts
@ -30,6 +30,7 @@ import {
  ORIGINPSWD_MISMATCH_MESSAGE,
  WITHDRAWAL_CONFIRM_MESSAGE
 } from '@src/configs/msgConst';
+import { AxiosError } from 'axios';

 // 로그인
 export const setLogin = createAsyncThunk(
@ -55,8 +56,8 @@ export const setLogin = createAsyncThunk(
    } catch (error: any) {
      thunkAPI.dispatch(
        openModal({
-          header: ERROR_TITLE,
-          body: ERROR_MESSAGE
+          header: '로그인 실패',
+          body: error
        })
      );
    }