Skip to content

Commit

Permalink
Merge pull request #593 from NUTFes/fix/imaimai/null-activities
Browse files Browse the repository at this point in the history 
activityのstyleがない場合にエラーが出ないようにする
  • Loading branch information
@imaimai17468
imaimai17468 authored Jun 5, 2023
2 parents 0924337 + 0d90484 commit 1e2a9b7
Show file tree
Hide file tree
Showing 4 changed files with 69 additions and 40 deletions.
44 changes: 27 additions & 17 deletions view/next-project/src/components/sponsoractivities/DetailModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -157,25 +157,35 @@ const DetailModal: FC<ModalProps> = (props) => {
</tr>
</thead>
<tbody>
{props.sponsorActivitiesViewItem.styleDetail.map((styleDetail, index) => (
<tr
key={index}
className={clsx('border border-x-white-0 border-t-white-0', {
'border-b-primary-1':
index === props.sponsorActivitiesViewItem.styleDetail.length - 1,
})}
>
<td className='py-3'>
<div className='text-center text-sm'>{styleDetail.sponsorStyle.style}</div>
</td>
<td className='py-3'>
<div className='text-center text-sm'>{styleDetail.sponsorStyle.feature}</div>
</td>
<td className='py-3'>
<div className='text-center text-sm'>{styleDetail.sponsorStyle.price} 円</div>
{props.sponsorActivitiesViewItem.styleDetail ? (
props.sponsorActivitiesViewItem.styleDetail.map((styleDetail, index) => (
<tr
key={index}
className={clsx('border border-x-white-0 border-t-white-0', {
'border-b-primary-1':
index === props.sponsorActivitiesViewItem.styleDetail.length - 1,
})}
>
<td className='py-3'>
<div className='text-center text-sm'>{styleDetail.sponsorStyle.style}</div>
</td>
<td className='py-3'>
<div className='text-center text-sm'>{styleDetail.sponsorStyle.feature}</div>
</td>
<td className='py-3'>
<div className='text-center text-sm'>{styleDetail.sponsorStyle.price} 円</div>
</td>
</tr>
))
) : (
<tr className='border border-x-white-0 border-b-primary-1 border-t-white-0'>
<td colSpan={3} className='py-3'>
<div className='text-center text-sm text-red-500'>
協賛スタイルを登録してください
</div>
</td>
</tr>
))}
)}
</tbody>
</table>
</Modal>
Expand Down
26 changes: 19 additions & 7 deletions view/next-project/src/components/sponsoractivities/EditModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ interface ModalProps {
sponsorStyles: SponsorStyle[];
sponsors: Sponsor[];
users: User[];
sponsorStyleDetails: ActivityStyle[];
sponsorStyleDetails: ActivityStyle[] | null;
activityStyles: ActivityStyle[];
setIsOpen: (isOpen: boolean) => void;
}
Expand All @@ -44,14 +44,14 @@ export default function EditModal(props: ModalProps) {
...props.sponsorActivity,
expense: Number((props.sponsorActivity.expense / 11).toFixed(1)),
});
const initStyleIds = sponsorStyleDetails.map(
(sponsorStyleDetail) => sponsorStyleDetail.sponsorStyleID,
);
const initStyleIds = sponsorStyleDetails
? sponsorStyleDetails.map((sponsorStyleDetail) => sponsorStyleDetail.sponsorStyleID)
: [];
const [selectedStyleIds, setSelectedStyleIds] = useState<number[]>(initStyleIds);

const [isStyleError, setIsStyleError] = useState(false);
const [isStyleError, setIsStyleError] = useState(!sponsorStyleDetails);
useEffect(() => {
if (selectedStyleIds.length === 0) {
if (selectedStyleIds && selectedStyleIds.length === 0) {
setIsStyleError(true);
} else {
setIsStyleError(false);
Expand All @@ -69,6 +69,7 @@ export default function EditModal(props: ModalProps) {
}, [sponsorStyles]);

const isSelectSponsorBooth = useMemo(() => {
if (!selectedStyleIds) return false;
const isBooth = selectedStyleIds.some((id) => {
return sponsorStyles[id - 1]?.style === '企業ブース';
});
Expand Down Expand Up @@ -125,6 +126,11 @@ export default function EditModal(props: ModalProps) {

// 協賛企業の登録の更新を行い、ページをリロード
const submit = (data: SponsorActivity) => {
if (!selectedStyleIds) {
setIsStyleError(true);
return;
}

const { expense, userID, sponsorID, ...rest } = data;
const submitData: SponsorActivity = {
expense: Math.round(expense * 11),
Expand All @@ -138,6 +144,8 @@ export default function EditModal(props: ModalProps) {

// 協賛企業を更新
const updateSponsorStyle = async (data: SponsorActivity) => {
if (!selectedStyleIds) return;

const updateSponsorStyleUrl = process.env.CSR_API_URI + '/activities/' + data.id;
await put(updateSponsorStyleUrl, data);

Expand Down Expand Up @@ -175,7 +183,11 @@ export default function EditModal(props: ModalProps) {
<div className='col-span-4 w-full'>
<MultiSelect
options={styleOotions}
values={styleOotions.filter((option) => selectedStyleIds.includes(Number(option.value)))}
values={
selectedStyleIds
? styleOotions.filter((option) => selectedStyleIds.includes(Number(option.value)))
: []
}
onChange={(value) => {
setSelectedStyleIds(value.map((v) => Number(v.value)));
}}
Expand Down
8 changes: 5 additions & 3 deletions view/next-project/src/components/sponsoractivities/OpenEditModalButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,11 @@ const OpenEditModalButton: React.FC<Props> = (props) => {
const onOpen = () => {
setIsOpen(true);
};
const sponsorStyleDetails = props.sponsorStyleDetails.map((sponsorStyleDetail) => {
return sponsorStyleDetail.activityStyle;
});
const sponsorStyleDetails = props.sponsorStyleDetails
? props.sponsorStyleDetails.map((sponsorStyleDetail) => {
return sponsorStyleDetail.activityStyle;
})
: null;
return (
<>
<EditButton onClick={onOpen} isDisabled={props.isDisabled} />
Expand Down
31 changes: 18 additions & 13 deletions view/next-project/src/pages/sponsoractivities/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,13 +136,14 @@ export default function SponsorActivities(props: Props) {
<table className='my-1 w-full table-fixed border-collapse'>
<tbody>
<tr className='border border-b-primary-1'></tr>
{sponsorActivitiesItem.styleDetail.map((styleDetail) => (
<tr key={styleDetail.sponsorStyle.id}>
<td className='text-center'>{styleDetail.sponsorStyle.style}</td>
<td className='text-center'>{styleDetail.sponsorStyle.feature}</td>
<td className='text-center'>{styleDetail.sponsorStyle.price}円</td>
</tr>
))}
{sponsorActivitiesItem.styleDetail &&
sponsorActivitiesItem.styleDetail.map((styleDetail) => (
<tr key={styleDetail.sponsorStyle.id}>
<td className='text-center'>{styleDetail.sponsorStyle.style}</td>
<td className='text-center'>{styleDetail.sponsorStyle.feature}</td>
<td className='text-center'>{styleDetail.sponsorStyle.price}円</td>
</tr>
))}
<tr className='border border-b-primary-1'></tr>
</tbody>
</table>
Expand Down Expand Up @@ -240,12 +241,16 @@ export default function SponsorActivities(props: Props) {
className='py-3'
>
<div className='text-center text-sm text-black-600'>
{sponsorActivitiesItem.styleDetail.map((styleDetail) => (
<div key={styleDetail.sponsorStyle.id}>
<p>{`${styleDetail.sponsorStyle.style} / ${styleDetail.sponsorStyle.feature} / ${styleDetail.sponsorStyle.price} 円`}</p>
<p></p>
</div>
))}
{sponsorActivitiesItem.styleDetail ? (
sponsorActivitiesItem.styleDetail.map((styleDetail) => (
<div key={styleDetail.sponsorStyle.id}>
<p>{`${styleDetail.sponsorStyle.style} / ${styleDetail.sponsorStyle.feature} / ${styleDetail.sponsorStyle.price} 円`}</p>
<p></p>
</div>
))
) : (
<div className='text-red-500'>協賛スタイルを登録してください</div>
)}
</div>
</td>
<td
Expand Down

0 comments on commit 1e2a9b7

Please sign in to comment.