From c8f7e29dd52ddea8471f411761a5f4c143264313 Mon Sep 17 00:00:00 2001 From: Yena Kim <76564438+yeneua@users.noreply.github.com> Date: Fri, 19 Apr 2024 02:31:46 +0900 Subject: [PATCH] =?UTF-8?q?:lipstick:=20Design:=20Action=20Items=20?= =?UTF-8?q?=EB=8B=B4=EB=8B=B9=EC=9E=90=20=EC=A7=80=EC=A0=95=20=EC=B0=BD=20?= =?UTF-8?q?=ED=8D=BC=EB=B8=94=EB=A6=AC=EC=8B=B1=20(#173)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/UserProfile1.png | Bin 0 -> 11827 bytes src/assets/UserProfile2.png | Bin 0 -> 12220 bytes .../writeRetro/ActionItems/Members.tsx | 32 +++++++++++ src/components/writeRetro/task/TeamTask.tsx | 53 +++++++++++++++++- src/styles/writeRetroStyles/Layout.style.ts | 13 +++++ src/styles/writeRetroStyles/Members.styles.ts | 49 ++++++++++++++++ 6 files changed, 145 insertions(+), 2 deletions(-) create mode 100644 src/assets/UserProfile1.png create mode 100644 src/assets/UserProfile2.png create mode 100644 src/components/writeRetro/ActionItems/Members.tsx create mode 100644 src/styles/writeRetroStyles/Members.styles.ts diff --git a/src/assets/UserProfile1.png b/src/assets/UserProfile1.png new file mode 100644 index 0000000000000000000000000000000000000000..f411a968f970cd448d0b7148e45a5bce263eb839 GIT binary patch literal 11827 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 literal 0 HcmV?d00001 diff --git a/src/assets/UserProfile2.png b/src/assets/UserProfile2.png new file mode 100644 index 0000000000000000000000000000000000000000..13872984d93f8edb5b89ba5f7f4f09392b81c683 GIT binary patch literal 12220 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 KMNUMnLSTY|Dzsn# literal 0 HcmV?d00001 diff --git a/src/components/writeRetro/ActionItems/Members.tsx b/src/components/writeRetro/ActionItems/Members.tsx new file mode 100644 index 0000000..67e9546 --- /dev/null +++ b/src/components/writeRetro/ActionItems/Members.tsx @@ -0,0 +1,32 @@ +import * as S from '@/styles/writeRetroStyles/Members.styles'; + +interface UserListProps { + users: { name: string; image: string }[]; + onSelectUserImg: (image: string) => void; + onSelectUserName: (name: string) => void; +} + +export const Members: React.FC = ({ users, onSelectUserImg, onSelectUserName }) => { + const handleUserClick = (name: string, image: string) => { + onSelectUserName(name); + onSelectUserImg(image); + }; + + return ( + <> + + + 해당 업무의 담당자를 지정해주세요 + +
    + {users.map((user, index) => ( + handleUserClick(user.name, user.image)}> + {user.name} + + ))} +
+
+ + ); +}; +export default Members; diff --git a/src/components/writeRetro/task/TeamTask.tsx b/src/components/writeRetro/task/TeamTask.tsx index 73d2537..b06aa99 100644 --- a/src/components/writeRetro/task/TeamTask.tsx +++ b/src/components/writeRetro/task/TeamTask.tsx @@ -7,6 +7,9 @@ import dayjs from 'dayjs'; import TeamTaskMessage from './taskMessage/TeamTaskMessage'; import { sectionData } from '@/api/@types/Section'; import { SectionServices } from '@/api/services/Section'; +import UserProfile1 from '@/assets/UserProfile1.png'; +import UserProfile2 from '@/assets/UserProfile2.png'; +import Members from '@/components/writeRetro/ActionItems/Members'; import ReviseModal from '@/components/writeRetro/task/ReviseModal'; import { useCustomToast } from '@/hooks/useCustomToast'; import * as S from '@/styles/writeRetroStyles/Layout.style'; @@ -46,6 +49,38 @@ const TeamTask: FC = ({ name }) => { } }; + // action items 담당자 지정 + const [hoveredUser, setHoveredUser] = useState(null); + const [showPopup, setShowPopup] = useState(false); + const [selectedUserName, setSelectedUserName] = useState(null); + const [selectedUserImg, setSelectedUserImg] = useState(null); + + const users = [ + { name: 'User 1', image: UserProfile1 }, + { name: 'User 2', image: UserProfile2 }, + ]; + + const togglePopup = () => { + setShowPopup(!showPopup); + }; + + const handleSelectUserImg = (image: string) => { + setSelectedUserImg(image); + setShowPopup(false); + }; + + const handleSelectUserName = (name: string) => { + setSelectedUserName(name); + }; + + const handleMouseEnter = (name: string) => { + setHoveredUser(name); + }; + + const handleMouseLeave = () => { + setHoveredUser(null); + }; + return ( <> @@ -77,9 +112,23 @@ const TeamTask: FC = ({ name }) => { {name.sectionName === 'Action Items' && (
- M + handleMouseEnter(selectedUserName || '')} + onMouseLeave={handleMouseLeave} + > + {selectedUserImg ? : 'M'} + {hoveredUser && {hoveredUser}} {/* 이름 : {name.username} */} + + {showPopup && ( + + )}
- {name.username} + 담당자
)} diff --git a/src/styles/writeRetroStyles/Layout.style.ts b/src/styles/writeRetroStyles/Layout.style.ts index bdf0b91..ab8396e 100644 --- a/src/styles/writeRetroStyles/Layout.style.ts +++ b/src/styles/writeRetroStyles/Layout.style.ts @@ -414,6 +414,7 @@ export const ManagerButton = styled.button` &:hover { cursor: pointer; } + position: relative; `; export const ReviseModalStyle = styled.div` @@ -479,3 +480,15 @@ export const ReviseModalButton = styled.button` border-radius: 4px; margin-right: 30px; `; + +export const HoverUser = styled.span` + position: absolute; + width: 40px; + left: -5px; /* 원하는 만큼의 왼쪽 이동 값 설정 */ + top: 100%; +`; + +export const ActionItemsUserImg = styled.img` + width: 24px; + height: 24px; +`; diff --git a/src/styles/writeRetroStyles/Members.styles.ts b/src/styles/writeRetroStyles/Members.styles.ts new file mode 100644 index 0000000..71d36ce --- /dev/null +++ b/src/styles/writeRetroStyles/Members.styles.ts @@ -0,0 +1,49 @@ +import styled from 'styled-components'; + +export const ListConatiner = styled.div` + position: absolute; + z-index: 1; + width: 280px; + max-height: 350px; + overflow-y: auto; + border: 1px solid #c8c8c8; + border-radius: 10px; + background-color: #f4f4f4; +`; + +export const Title = styled.span` + color: #969696; +`; + +export const TitleContainer = styled.div` + background-color: #f0f0f0; + border-top-right-radius: 10px; + border-top-left-radius: 10px; + border-bottom: 1px solid #e5e5e5; + padding: 10px; +`; + +export const ListBox = styled.ul``; + +export const ListItem = styled.li` + list-style: none; + display: flex; + flex-direction: row; + margin-top: 10px; + margin-bottom: 10px; + color: #969696; + &:hover { + cursor: pointer; + } +`; + +export const ProfileImage = styled.img` + margin-left: 5px; + margin-right: 5px; + width: 30px; + height: 30px; +`; + +export const UserName = styled.span` + padding-left: 10px; +`;