diff --git a/view/next-project/src/components/common/Input/Input.tsx b/view/next-project/src/components/common/Input/Input.tsx index 00860de0a..c80dfad84 100644 --- a/view/next-project/src/components/common/Input/Input.tsx +++ b/view/next-project/src/components/common/Input/Input.tsx @@ -11,6 +11,10 @@ interface Props { onChange?: (e: React.ChangeEvent) => void; children?: React.ReactNode; type?: string; + datalist?: { + key: string; + data: { id: number; name: string }[]; + }; } function Input(props: Props): JSX.Element { @@ -18,16 +22,26 @@ function Input(props: Props): JSX.Element { 'rounded-full border border-primary-1 py-2 px-4' + (props.className ? ` ${props.className}` : ''); return ( - - {props.children} - +
+ + {props.children} + + {props.datalist && ( + + {props.datalist.data.map((option) => ( + + )} +
); } diff --git a/view/next-project/src/components/fund_information/AddModal.tsx b/view/next-project/src/components/fund_information/AddModal.tsx index fbe14c544..b295659a6 100644 --- a/view/next-project/src/components/fund_information/AddModal.tsx +++ b/view/next-project/src/components/fund_information/AddModal.tsx @@ -6,6 +6,7 @@ import { Modal, CloseButton, Input, Select, PrimaryButton } from '../common'; import { userAtom } from '@/store/atoms'; import { post } from '@api/fundInformations'; import { BUREAUS } from '@constants/bureaus'; +import { DONATION_AMOUNT } from '@constants/donationAmount'; import { Department, FundInformation, Teacher, User } from '@type/common'; interface ModalProps { @@ -132,7 +133,15 @@ const OpenAddModal: FC = (props) => {

金額

- +

備考

diff --git a/view/next-project/src/components/fund_information/EditModal.tsx b/view/next-project/src/components/fund_information/EditModal.tsx index 157c69fb6..651e00355 100644 --- a/view/next-project/src/components/fund_information/EditModal.tsx +++ b/view/next-project/src/components/fund_information/EditModal.tsx @@ -4,6 +4,7 @@ import { Dispatch, SetStateAction, useEffect, useState, useMemo } from 'react'; import { Modal, Input, Select, CloseButton, PrimaryButton } from '../common'; import { put } from '@api/fundInformations'; import { BUREAUS } from '@constants/bureaus'; +import { DONATION_AMOUNT } from '@constants/donationAmount'; import { FundInformation, Teacher, User, Department } from '@type/common'; interface ModalProps { @@ -140,7 +141,15 @@ export default function EditModal(props: ModalProps) {

金額

- +

備考

diff --git a/view/next-project/src/constants/donationAmount.ts b/view/next-project/src/constants/donationAmount.ts new file mode 100644 index 000000000..e1c24180e --- /dev/null +++ b/view/next-project/src/constants/donationAmount.ts @@ -0,0 +1,18 @@ +export const DONATION_AMOUNT = [ + { + id: 1, + name: '1000', + }, + { + id: 2, + name: '2000', + }, + { + id: 3, + name: '5000', + }, + { + id: 4, + name: '10000', + }, +];