Skip to content

Commit d74640f

Browse files
KaichiManabeKaichiManabe
committed
時間割登録、削除、編集関係のdaisyUI移行完了
1 parent 66f5222 commit d74640f

File tree

3 files changed

+141
-174
lines changed

3 files changed

+141
-174
lines changed

‎web/components/course/components/CourseDeleteConfirmDialog.tsx‎

Lines changed: 31 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,3 @@
1-
import {
2-
Alert,
3-
Box,
4-
Button,
5-
Dialog,
6-
DialogActions,
7-
DialogContent,
8-
DialogContentText,
9-
DialogTitle,
10-
} from "@mui/material";
111
import { useEffect, useState } from "react";
122
import { deleteMyCourse, getMyCoursesOverlapWith } from "~/api/course";
133
import type { Course } from "~/common/types";
@@ -26,7 +16,6 @@ export default function CourseDeleteRegisterConfirmDialog({
2616
handleCoursesUpdate: (courses: Course[]) => void;
2717
}) {
2818
const [overlapCourses, setOverlapCourses] = useState<Course[]>([]);
29-
3019
const [isLoading, setIsLoading] = useState(false);
3120

3221
useEffect(() => {
@@ -43,19 +32,15 @@ export default function CourseDeleteRegisterConfirmDialog({
4332
}, [course]);
4433

4534
return (
46-
<Dialog open={open} onClose={onClose}>
47-
<DialogTitle>削除の確認</DialogTitle>
48-
<DialogContent>
49-
<DialogContentText>
50-
次の授業を削除します。よろしいですか？
51-
</DialogContentText>
52-
<Box mt={1}>
35+
<div className={`modal ${open ? "modal-open" : ""}`}>
36+
<div className="modal-box">
37+
<h3 className="font-bold text-lg">削除の確認</h3>
38+
<p className="py-4">次の授業を削除します。よろしいですか？</p>
39+
<div className="mt-2">
5340
{isLoading ? (
54-
<Alert color="info" icon={false} severity="info" sx={{ mt: 1 }}>
55-
読み込み中...
56-
</Alert>
41+
<div className="alert alert-info">読み込み中...</div>
5742
) : (
58-
<Alert color="error" icon={false} severity="info" sx={{ mt: 1 }}>
43+
<div className="alert alert-error">
5944
{`削除: ${
6045
overlapCourses
6146
.map(
@@ -64,26 +49,31 @@ export default function CourseDeleteRegisterConfirmDialog({
6449
)
6550
.join("・") || "なし"
6651
}`}
67-
</Alert>
52+
</div>
6853
)}
69-
</Box>
70-
</DialogContent>
71-
<DialogActions>
72-
<Button onClick={onClose}>キャンセル</Button>
73-
{course && (
74-
<Button
75-
onClick={async () => {
76-
const newCourses = await deleteMyCourse(course.id);
77-
handleCoursesUpdate(newCourses);
54+
</div>
55+
<div className="modal-action">
56+
{/* biome-ignore lint/a11y/useButtonType: <explanation> */}
57+
<button className="btn btn-ghost" onClick={onClose}>
58+
キャンセル
59+
</button>
60+
{course && (
61+
// biome-ignore lint/a11y/useButtonType: <explanation>
62+
<button
63+
className="btn btn-primary"
64+
onClick={async () => {
65+
const newCourses = await deleteMyCourse(course.id);
66+
handleCoursesUpdate(newCourses);
7867

79-
onClose();
80-
handleSelectDialogClose();
81-
}}
82-
>
83-
確定
84-
</Button>
85-
)}
86-
</DialogActions>
87-
</Dialog>
68+
onClose();
69+
handleSelectDialogClose();
70+
}}
71+
>
72+
確定
73+
</button>
74+
)}
75+
</div>
76+
</div>
77+
</div>
8878
);
8979
}

‎web/components/course/components/CourseRegisterConfirmDialog.tsx‎

Lines changed: 33 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,3 @@
1-
import {
2-
Alert,
3-
Box,
4-
Button,
5-
Dialog,
6-
DialogActions,
7-
DialogContent,
8-
DialogContentText,
9-
DialogTitle,
10-
} from "@mui/material";
111
import { useEffect, useState } from "react";
122
import { addMyCourse, getMyCoursesOverlapWith } from "~/api/course";
133
import type { Course } from "~/common/types";
@@ -26,7 +16,6 @@ export default function CourseRegisterConfirmDialog({
2616
handleCoursesUpdate: (courses: Course[]) => void;
2717
}) {
2818
const [overlapCourses, setOverlapCourses] = useState<Course[]>([]);
29-
3019
const [isLoading, setIsLoading] = useState(false);
3120

3221
useEffect(() => {
@@ -43,24 +32,20 @@ export default function CourseRegisterConfirmDialog({
4332
}, [course]);
4433

4534
return (
46-
<Dialog open={open} onClose={onClose}>
47-
<DialogTitle>変更の確認</DialogTitle>
48-
<DialogContent>
49-
<DialogContentText>
50-
次のように変更します。よろしいですか？
51-
</DialogContentText>
52-
<Box mt={2}>
35+
<div className={`modal ${open ? "modal-open" : ""}`}>
36+
<div className="modal-box">
37+
<h3 className="font-bold text-lg">変更の確認</h3>
38+
<p className="py-4">次のように変更します。よろしいですか？</p>
39+
<div className="mt-2 space-y-2">
5340
{course && (
54-
<Alert color="success" icon={false} severity="info">
41+
<div className="alert alert-success">
5542
{`追加: ${course.name} (${course.teacher})`}
56-
</Alert>
43+
</div>
5744
)}
5845
{isLoading ? (
59-
<Alert color="info" icon={false} severity="info" sx={{ mt: 1 }}>
60-
読み込み中...
61-
</Alert>
46+
<div className="alert alert-info">読み込み中...</div>
6247
) : (
63-
<Alert color="error" icon={false} severity="info" sx={{ mt: 1 }}>
48+
<div className="alert alert-error">
6449
{`削除: ${
6550
overlapCourses
6651
.map(
@@ -69,25 +54,30 @@ export default function CourseRegisterConfirmDialog({
6954
)
7055
.join("・") || "なし"
7156
}`}
72-
</Alert>
57+
</div>
58+
)}
59+
</div>
60+
<div className="modal-action">
61+
{/* biome-ignore lint/a11y/useButtonType: <explanation> */}
62+
<button className="btn btn-ghost" onClick={onClose}>
63+
キャンセル
64+
</button>
65+
{course && (
66+
// biome-ignore lint/a11y/useButtonType: <explanation>
67+
<button
68+
className="btn btn-primary"
69+
onClick={async () => {
70+
const newCourses = await addMyCourse(course.id);
71+
handleCoursesUpdate(newCourses);
72+
onClose();
73+
handleSelectDialogClose();
74+
}}
75+
>
76+
確定
77+
</button>
7378
)}
74-
</Box>
75-
</DialogContent>
76-
<DialogActions>
77-
<Button onClick={onClose}>キャンセル</Button>
78-
{course && (
79-
<Button
80-
onClick={async () => {
81-
const newCourses = await addMyCourse(course.id);
82-
handleCoursesUpdate(newCourses);
83-
onClose();
84-
handleSelectDialogClose();
85-
}}
86-
>
87-
確定
88-
</Button>
89-
)}
90-
</DialogActions>
91-
</Dialog>
79+
</div>
80+
</div>
81+
</div>
9282
);
9383
}

0 commit comments

Comments
 (0)