Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

学内募金の登録・編集時に登録済の教員を選択できないようにする #838

Merged
merged 4 commits into from
Jul 10, 2024
Merged

学内募金の登録・編集時に登録済の教員を選択できないようにする #838

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c483ac2
[feature]addモーダルで学内募金登録済教員を選択不可にする
Kubosaka Jul 8, 2024
e08d1af
[feat]編集画面も同様に登録済は選択不可にする
Kubosaka Jul 8, 2024
55cd1c8
[fix]編集モーダルで教員の過程を切り替えた際の処理の修正
Kubosaka Jul 8, 2024
1da9afb
[fix]年度が2024に固定されていたので、currentYearに設定
Kubosaka Jul 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 36 additions & 4 deletions view/next-project/src/components/fund_information/AddModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { useRecoilState } from 'recoil';

import { Modal, CloseButton, Input, Select, PrimaryButton } from '../common';
import { userAtom } from '@/store/atoms';
import { get } from '@api/api_methods';
import { post } from '@api/fundInformations';
import { BUREAUS } from '@constants/bureaus';
import { DONATION_AMOUNT } from '@constants/donationAmount';
Expand All @@ -15,10 +16,12 @@ interface ModalProps {
departments: Department[];
users: User[];
currentUser?: User;
currentYear: string;
}

const OpenAddModal: FC<ModalProps> = (props) => {
const [user] = useRecoilState(userAtom);
const { teachers, currentYear } = props;

const router = useRouter();
const [departmentID, setDepartmentID] = useState<number | string>(1);
Expand All @@ -41,6 +44,12 @@ const OpenAddModal: FC<ModalProps> = (props) => {
receivedAt: ymd,
});

const [registeredTeacherIds, setRegisteredTeacherIds] = useState<number[]>([]);

const isRegisteredTeacher = (id: number) => {
return registeredTeacherIds.includes(id);
};

// 担当者を局でフィルタを適用
const [bureauId, setBureauId] = useState<number>(loginUserBureau?.id || 1);
const defaultfilteredUsers = props.users
Expand Down Expand Up @@ -76,10 +85,13 @@ const OpenAddModal: FC<ModalProps> = (props) => {

const handleDepartmentID = (e: React.ChangeEvent<HTMLSelectElement>) => {
setDepartmentID(Number(e.target.value));
const departmentTeachers = props.teachers.filter(
const departmentTeachers = teachers.filter(
(teacher) => teacher.departmentID === Number(e.target.value),
);
setFormData({ ...formData, teacherID: departmentTeachers[0]?.id || 0 });
const firstNotRegisteredTeacher = departmentTeachers.find((teacher) => {
return !registeredTeacherIds.includes(teacher?.id || 0);
});
setFormData({ ...formData, teacherID: firstNotRegisteredTeacher?.id || 0 });
};

const addFundInformation = async (data: FundInformation) => {
Expand All @@ -89,6 +101,21 @@ const OpenAddModal: FC<ModalProps> = (props) => {

const isValid = !formData.userID || formData.teacherID == 0;

async function getRegisteredTeachers() {
const registeredTeachersURL =
process.env.CSR_API_URI + `/teachers/fundRegistered/${currentYear}`;
const resData = await get(registeredTeachersURL);
setRegisteredTeacherIds(resData);
const firstNotRegisteredTeacher = teachers.find((teacher) => {
return !resData.includes(teacher.id);
});
setFormData({ ...formData, teacherID: firstNotRegisteredTeacher?.id || 0 });
}

useEffect(() => {
getRegisteredTeachers();
}, []);

return (
<Modal className='md:w-1/2'>
<div className='w-full'>
Expand All @@ -111,11 +138,16 @@ const OpenAddModal: FC<ModalProps> = (props) => {
<p className='col-span-1 text-black-600'>教員名</p>
<div className='col-span-4 w-full'>
<Select className='w-full' value={formData.teacherID} onChange={handler('teacherID')}>
{props.teachers
{teachers
.filter((teacher) => teacher.departmentID === departmentID)
.map((teacher) => (
<option key={teacher.id} value={teacher.id}>
<option
key={teacher.id}
value={teacher.id}
disabled={isRegisteredTeacher(teacher?.id || 0)}
>
{teacher.name}
{isRegisteredTeacher(teacher?.id || 0) && '(募金登録済)'}
</option>
))}
</Select>
Expand Down
60 changes: 44 additions & 16 deletions view/next-project/src/components/fund_information/EditModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { useRouter } from 'next/router';
import { Dispatch, SetStateAction, useEffect, useState, useMemo } from 'react';

import { Modal, Input, Select, CloseButton, PrimaryButton } from '../common';
import { get } from '@api/api_methods';
import { put } from '@api/fundInformations';
import { BUREAUS } from '@constants/bureaus';
import { DONATION_AMOUNT } from '@constants/donationAmount';
Expand All @@ -13,39 +14,50 @@ interface ModalProps {
users: User[];
departments: Department[];
fundInformation: FundInformation;
currentYear: string;
}

export default function EditModal(props: ModalProps) {
const router = useRouter();

const { teachers, fundInformation, currentYear } = props;

const [formData, setFormData] = useState<FundInformation>({
id: props.fundInformation.id,
userID: props.fundInformation.userID,
teacherID: props.fundInformation.teacherID,
price: props.fundInformation.price,
remark: props.fundInformation.remark,
id: fundInformation.id,
userID: fundInformation.userID,
teacherID: fundInformation.teacherID,
price: fundInformation.price,
remark: fundInformation.remark,
isFirstCheck: false,
isLastCheck: false,
receivedAt: props.fundInformation.receivedAt,
receivedAt: fundInformation.receivedAt,
});

const defaultTeacher = props.teachers.find(
(teacher) => teacher.id === props.fundInformation.teacherID,
);
const defaultTeacher = teachers.find((teacher) => teacher.id === props.fundInformation.teacherID);
const [teacher, setTeacher] = useState<Teacher | undefined>(defaultTeacher);
const [departmentID, setDepartmentID] = useState<number>(defaultTeacher?.departmentID || 1);

const [registeredTeacherIds, setRegisteredTeacherIds] = useState<number[]>([]);

const isRegisteredTeacherWithoutEditID = (id: number) => {
return registeredTeacherIds.includes(id) && fundInformation.teacherID !== id;
};

useEffect(() => {
if (teacher?.departmentID !== departmentID) {
const relatedTeachers = props.teachers.filter(
(teacher) => teacher.departmentID === departmentID,
);
const relatedTeachers = teachers.filter((teacher) => teacher.departmentID === departmentID);
const firstNotRegisteredTeacher = relatedTeachers.find((teacher) => {
return (
!registeredTeacherIds.includes(teacher?.id || 0) ||
fundInformation.teacherID === teacher.id
);
});
relatedTeachers &&
setFormData({
...formData,
teacherID: relatedTeachers[0]?.id || 0,
teacherID: firstNotRegisteredTeacher?.id || 0,
});
setTeacher(relatedTeachers[0]);
setTeacher(firstNotRegisteredTeacher);
}
}, [departmentID]);

Expand Down Expand Up @@ -89,6 +101,17 @@ export default function EditModal(props: ModalProps) {
return res;
}, [bureauId]);

async function getRegisteredTeachers() {
const registeredTeachersURL =
process.env.CSR_API_URI + `/teachers/fundRegistered/${currentYear}`;
const resData = await get(registeredTeachersURL);
setRegisteredTeacherIds(resData);
}

useEffect(() => {
getRegisteredTeachers();
}, []);

return (
<Modal className='md:w-1/2'>
<div className='w-full'>
Expand Down Expand Up @@ -117,11 +140,16 @@ export default function EditModal(props: ModalProps) {
<p className='col-span-1 text-black-600'>教員名</p>
<div className='col-span-4 w-full'>
<Select className='w-full' value={formData.teacherID} onChange={handler('teacherID')}>
{props.teachers
{teachers
.filter((teacher) => teacher.departmentID === departmentID)
.map((teacher) => (
<option key={teacher.id} value={teacher.id}>
<option
key={teacher.id}
value={teacher.id}
disabled={isRegisteredTeacherWithoutEditID(teacher?.id || 0)}
>
{teacher.name}
{isRegisteredTeacherWithoutEditID(teacher?.id || 0) && '(募金登録済)'}
</option>
))}
</Select>
Expand Down
2 changes: 2 additions & 0 deletions view/next-project/src/components/fund_information/OpenAddModalButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ interface Props {
departments: Department[];
users: User[];
currentUser?: User;
currentYear: string;
}

export const OpenAddModalButton = (props: Props) => {
Expand All @@ -32,6 +33,7 @@ export const OpenAddModalButton = (props: Props) => {
departments={props.departments}
users={props.users}
currentUser={props.currentUser}
currentYear={props.currentYear}
/>
)}
</>
Expand Down
2 changes: 2 additions & 0 deletions view/next-project/src/components/fund_information/OpenEditModalButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ interface Props {
users: User[];
fundInformation: FundInformation;
isDisabled: boolean;
currentYear: string;
}

export const OpenAddModalButton = (props: Props) => {
Expand All @@ -30,6 +31,7 @@ export const OpenAddModalButton = (props: Props) => {
departments={props.departments}
users={props.users}
fundInformation={props.fundInformation}
currentYear={props.currentYear}
/>
)}
</>
Expand Down
11 changes: 8 additions & 3 deletions view/next-project/src/pages/fund_informations/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,10 @@ export default function FundInformations(props: Props) {

//年の指定
const yearPeriods = props.yearPeriods;
const [selectedYear, setSelectedYear] = useState<string>(
yearPeriods ? String(yearPeriods[yearPeriods.length - 1].year) : String(date.getFullYear()),
);
const currentYear = yearPeriods
? String(yearPeriods[yearPeriods.length - 1].year)
: String(date.getFullYear());
const [selectedYear, setSelectedYear] = useState<string>(currentYear);

//年度を指定して募金を取得し、fundInformationViewsにset
const getFundInformations = async () => {
Expand Down Expand Up @@ -185,6 +186,7 @@ export default function FundInformations(props: Props) {
departments={departments}
users={users}
currentUser={currentUser}
currentYear={currentYear}
>
学内募金登録
</OpenAddModalButton>
Expand All @@ -195,6 +197,7 @@ export default function FundInformations(props: Props) {
departments={departments}
users={users}
currentUser={currentUser}
currentYear={currentYear}
></OpenAddModalButton>
</div>
</div>
Expand Down Expand Up @@ -241,6 +244,7 @@ export default function FundInformations(props: Props) {
users={users}
departments={departments}
isDisabled={isDisabled(fundViewItem)}
currentYear={currentYear}
/>
<OpenDeleteModalButton
id={fundViewItem.fundInformation.id ? fundViewItem.fundInformation.id : 0}
Expand Down Expand Up @@ -358,6 +362,7 @@ export default function FundInformations(props: Props) {
users={users}
departments={departments}
isDisabled={isDisabled(fundViewItem)}
currentYear={currentYear}
/>
<OpenDeleteModalButton
id={fundViewItem.fundInformation.id ? fundViewItem.fundInformation.id : 0}
Expand Down
Loading