From d9ebc582fb6fff46ef46e36ea83ec74d4f142172 Mon Sep 17 00:00:00 2001 From: jiminChoi Date: Tue, 11 Jun 2024 15:19:41 +0900 Subject: [PATCH 1/2] =?UTF-8?q?[FE]=20FIX:=20=EC=95=84=EC=9D=B4=ED=85=9C?= =?UTF-8?q?=20=ED=86=B5=EA=B3=84=20=EA=B7=B8=EB=9E=98=ED=94=84=20=EB=84=88?= =?UTF-8?q?=EB=B9=84=20=EB=8B=A4=EC=8B=9C=20=EC=88=98=EC=A0=95=20#1604?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/AdminInfo/Chart/ItemBarChart.tsx | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx b/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx index a67b4c460..6932a0333 100644 --- a/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx +++ b/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx @@ -68,7 +68,7 @@ const ItemBarChart = ({ data }: { data: IItemUseCountDto[] }) => { "페널티 감면권-3일", ]} indexBy="item" - margin={{ top: 60, right: 30, bottom: 50, left: 45 }} + margin={{ top: 60, right: 30, bottom: 50, left: 35}} padding={0.3} layout="vertical" groupMode="stacked" @@ -126,19 +126,20 @@ const ItemBarChart = ({ data }: { data: IItemUseCountDto[] }) => { }; const ItemBarChartStyled = styled.div` - height: 90%; + height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; + @media screen and (min-width: 768px) { + padding-right: 80px; + padding-left: 50px; + } `; const ResponsiveBarStyled = styled.div` height: 100%; width: 100%; - @media screen and (min-width: 768px) { - padding-right: 80px; - } `; const ItemLegendsStyled = styled.div` From ace74f0000ee4023ded36624e4351f98cc636b03 Mon Sep 17 00:00:00 2001 From: jiminChoi Date: Tue, 11 Jun 2024 15:43:56 +0900 Subject: [PATCH 2/2] =?UTF-8?q?[FE]=20FIX:=20=EC=95=84=EC=9D=B4=ED=85=9C?= =?UTF-8?q?=20=EA=B5=AC=EB=A7=A4=20=EB=AA=A8=EB=8B=AC=20=EC=98=A4=EB=A5=98?= =?UTF-8?q?=20=EC=88=98=EC=A0=95=20=20#1604?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AdminInfo/Chart/ItemBarChart.tsx | 2 +- .../Modals/StoreModal/StoreBuyItemModal.tsx | 93 ++++++------------- 2 files changed, 30 insertions(+), 65 deletions(-) diff --git a/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx b/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx index 6932a0333..d29f57a54 100644 --- a/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx +++ b/frontend/src/Cabinet/components/AdminInfo/Chart/ItemBarChart.tsx @@ -68,7 +68,7 @@ const ItemBarChart = ({ data }: { data: IItemUseCountDto[] }) => { "페널티 감면권-3일", ]} indexBy="item" - margin={{ top: 60, right: 30, bottom: 50, left: 35}} + margin={{ top: 60, right: 30, bottom: 50, left: 35 }} padding={0.3} layout="vertical" groupMode="stacked" diff --git a/frontend/src/Cabinet/components/Modals/StoreModal/StoreBuyItemModal.tsx b/frontend/src/Cabinet/components/Modals/StoreModal/StoreBuyItemModal.tsx index a2a32659e..11f889862 100644 --- a/frontend/src/Cabinet/components/Modals/StoreModal/StoreBuyItemModal.tsx +++ b/frontend/src/Cabinet/components/Modals/StoreModal/StoreBuyItemModal.tsx @@ -51,42 +51,37 @@ const StoreBuyItemModal: React.FC<{ setSelectedOption(option); }; - const [dropdownProps, setDropdownProps] = useState({ - options: [], - defaultValue: "", - onChangeValue: () => {}, - isOpen: false, - setIsOpen: () => {}, - }); - + let dropdownProps: IDropdown = { + options: + props.selectItem.items.length > 1 + ? [ + { + name: props.selectItem.items[props.selectItem.items.length - 3] + .itemDetails, + value: String(props.selectItem.items.length - 3), + }, + { + name: props.selectItem.items[props.selectItem.items.length - 2] + .itemDetails, + value: String(props.selectItem.items.length - 2), + }, + { + name: props.selectItem.items[props.selectItem.items.length - 1] + .itemDetails, + value: String(props.selectItem.items.length - 1), + }, + ] + : [], + defaultValue: + props.selectItem.items.length > 1 + ? props.selectItem.items[props.selectItem.items.length - 3].itemDetails + : "", + onChangeValue: handleDropdownChange, + isOpen: isOpen, + setIsOpen: setIsOpen, + }; useEffect(() => { if (props.selectItem.items.length > 3) setSelectedOption("1"); - if (props.selectItem.items.length > 1) { - setDropdownProps({ - options: [ - { - name: props.selectItem.items[props.selectItem.items.length - 3] - .itemDetails, - value: String(props.selectItem.items.length - 3), - }, - { - name: props.selectItem.items[props.selectItem.items.length - 2] - .itemDetails, - value: String(props.selectItem.items.length - 2), - }, - { - name: props.selectItem.items[props.selectItem.items.length - 1] - .itemDetails, - value: String(props.selectItem.items.length - 1), - }, - ], - defaultValue: - props.selectItem.items[props.selectItem.items.length - 3].itemDetails, - onChangeValue: handleDropdownChange, - isOpen: isOpen, - setIsOpen: setIsOpen, - }); - } }, [props]); const modalContents: IModalContents = { @@ -103,41 +98,11 @@ const StoreBuyItemModal: React.FC<{ }, renderAdditionalComponent: () => ( <> - {console.log("dropdown", dropdownProps)} {props.selectItem.items.length > 1 && ( {props.selectItem.itemName} 타입 - {/* */} {" "} )}