diff --git a/src/components/LandingPage/Box.css b/src/components/LandingPage/Box.css new file mode 100644 index 0000000..0adf9fd --- /dev/null +++ b/src/components/LandingPage/Box.css @@ -0,0 +1,29 @@ + +.Box { + width: 200px; + border-radius: 4px; + background: white; + height: 120px; + display: flex; + align-items: center; + justify-content: left; + cursor: pointer; + } + + + .text1 { + color: rgb(185, 185, 185); + font-size: 14px; + justify-content: left; + text-align: left; + margin-left: 17pt; + } + + + .text2 { + margin-left: 17pt; + color: rgb(185, 185, 185); + font-size: 30px; + justify-content: left; + text-align: left; + } \ No newline at end of file diff --git a/src/components/LandingPage/Box.js b/src/components/LandingPage/Box.js new file mode 100644 index 0000000..6d3c8f0 --- /dev/null +++ b/src/components/LandingPage/Box.js @@ -0,0 +1,20 @@ +import './Box.css'; + +export const Box = ({ data, title }) => { + return ( +
+
+
{title}
+ +
{data}
+
+
+ ); +}; diff --git a/src/components/LandingPage/LandingPage.js b/src/components/LandingPage/LandingPage.js index c77fb15..6697f8c 100644 --- a/src/components/LandingPage/LandingPage.js +++ b/src/components/LandingPage/LandingPage.js @@ -1,7 +1,83 @@ -import React from "react"; +import React, { useState, useEffect } from 'react'; +import { useSelector, useDispatch } from 'react-redux'; +import { Box } from './Box'; +import { LandingPage } from '../../state/actions-creators/LandingPage'; -function LandingPage() { - return
LandingPage
; +function Landing_Page() { + const dispatch = useDispatch(); + const { data } = useSelector(state => state.LandingPage); + + useEffect(() => { + dispatch(LandingPage()); + }, [dispatch]); + + console.log(data); + + return ( +
+ +
+ ); } -export default LandingPage; +export default Landing_Page; diff --git a/src/components/Tables/TicketsPage/TicketsPage.js b/src/components/Tables/TicketsPage/TicketsPage.js index b38f3ff..30a8d88 100644 --- a/src/components/Tables/TicketsPage/TicketsPage.js +++ b/src/components/Tables/TicketsPage/TicketsPage.js @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; - +import moment from 'moment'; import { useSelector, useDispatch } from 'react-redux'; import { Table, Segmented, Select } from 'antd'; import { @@ -139,8 +139,23 @@ function TicketsPage() { render={user => user.name} key="id" /> + - + { + return moment(element).utc(false).format('MM월DD일 HH:mm'); + }} + /> + { + return moment(element).utc(false).format('MM월DD일 HH:mm'); + }} + /> - - + + ); diff --git a/src/state/action-types/LandingPage.js b/src/state/action-types/LandingPage.js new file mode 100644 index 0000000..718ad26 --- /dev/null +++ b/src/state/action-types/LandingPage.js @@ -0,0 +1,2 @@ +export const LANDING_PAGE_SUCCESS = 'LANDING_PAGE_SUCCESS'; +export const LANDING_PAGE_ERROR = 'LANING_PAGE_ERROR'; diff --git a/src/state/action-types/index.js b/src/state/action-types/index.js index 99de7bf..39e9826 100644 --- a/src/state/action-types/index.js +++ b/src/state/action-types/index.js @@ -4,3 +4,4 @@ export * from './logout'; export * from './examplePagination'; export * from './ticketPagination'; export * from './usersPage'; +export * from './LandingPage'; diff --git a/src/state/actions-creators/LandingPage.js b/src/state/actions-creators/LandingPage.js new file mode 100644 index 0000000..1de2ed7 --- /dev/null +++ b/src/state/actions-creators/LandingPage.js @@ -0,0 +1,32 @@ +import axios from 'axios'; +import { LANDING_PAGE_SUCCESS, LANDING_PAGE_ERROR } from '../action-types'; + +export const LandingPage = callback => async dispatch => { + try { + const response = await axios.get( + `https://api.gosrock.band/v1/orders/report` + ); + console.log(response.data.data); + + const newData = response.data.data; + const data = { + totalTicket: newData.ticketReport.totalTicket, + depositedTicket: newData.ticketReport.depositedTicket, + income: newData.income, + doneOrder: newData.orderReport.doneOrder, + waitOrder: newData.orderReport.waitOrder, + expireOrder: newData.orderReport.waitOrder, + enteredTicket: newData.enterReport.enteredTicket, + nonEnteredTicket: newData.enterReport.nonEnteredTicket + }; + + dispatch({ type: LANDING_PAGE_SUCCESS, payload: data }); + + // 자동으로 피쳐로 넘어가게끔 + // callback(); + } catch (e) { + //400 ~ + console.log(e); + dispatch({ type: LANDING_PAGE_ERROR, payload: '조회 실패' }); + } +}; diff --git a/src/state/actions-creators/index.js b/src/state/actions-creators/index.js index 5a8d6bf..48b4bdb 100644 --- a/src/state/actions-creators/index.js +++ b/src/state/actions-creators/index.js @@ -2,5 +2,6 @@ import { slackMessage } from './slackMessage'; import { slackValidation } from './slackValidation'; import { logout } from './logout'; import { ticketPagination } from './ticketPagination'; +import { LandingPage } from './LandingPage'; -export { slackMessage, slackValidation, logout, ticketPagination }; +export { slackMessage, slackValidation, logout, ticketPagination, LandingPage }; diff --git a/src/state/actions-creators/ticketPagination.js b/src/state/actions-creators/ticketPagination.js index 00d7674..2279e32 100644 --- a/src/state/actions-creators/ticketPagination.js +++ b/src/state/actions-creators/ticketPagination.js @@ -40,6 +40,7 @@ export const changeState = try { console.log('ticketId:', id); console.log('status:', e); + const response = await axios.patch( `https://api.gosrock.band/v1/tickets/status`, { ticketId: id, status: e } diff --git a/src/state/reducers/LandingPage.js b/src/state/reducers/LandingPage.js new file mode 100644 index 0000000..3e4c5b6 --- /dev/null +++ b/src/state/reducers/LandingPage.js @@ -0,0 +1,29 @@ +/* eslint-disable import/no-anonymous-default-export */ +import { LANDING_PAGE_SUCCESS, LANDING_PAGE_ERROR } from '../action-types'; + +export default function ( + state = { + data: { + totalTicket: 0, + depositedTicket: 0, + income: 0, + doneOrder: 0, + waitOrder: 0, + expireOrder: 0, + enteredTicket: 0, + nonEnteredTicket: 0 + }, + error: null + }, + action +) { + switch (action.type) { + case LANDING_PAGE_SUCCESS: + return { ...state, data: action.payload, error: action.payload }; + case LANDING_PAGE_ERROR: + return { ...state, data: [], error: action.payload }; + + default: + return state; + } +} diff --git a/src/state/reducers/index.js b/src/state/reducers/index.js index 3134da7..f119dd5 100644 --- a/src/state/reducers/index.js +++ b/src/state/reducers/index.js @@ -2,6 +2,7 @@ import { combineReducers } from 'redux'; import { auth } from './auth'; import examplePagination from './examplePagination'; import ticketPagination from './ticketPagination'; +import LandingPage from './LandingPage'; import slackMessage from './slackMessage'; import usersPage from './usersPage'; @@ -10,5 +11,6 @@ export default combineReducers({ auth: auth, examplePagination: examplePagination, usersPage: usersPage, - ticketPagination: ticketPagination + ticketPagination: ticketPagination, + LandingPage: LandingPage });