generated from jphacks/JP_sample
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #42 from jphacks/feat/hikahana/assignment-timer
お題が出てからの経過時間を表示
- Loading branch information
Showing
9 changed files
with
250 additions
and
85 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,40 +1,36 @@ | ||
| ;import { prisma } from "@lib/prisma"; | ||
| import type { Assignment, todayAssignment } from "@/types"; | ||
| import { prisma } from "@lib/prisma"; | ||
|
|
||
| // 課題新規作成（ランダム） | ||
| export async function GET() { | ||
| const startOfToday = new Date(); | ||
| startOfToday.setHours(0, 0, 0, 0); // 今日の開始時間を設定 (00:00:00) | ||
|
|
||
| const endOfToday = new Date(); | ||
| endOfToday.setHours(23, 59, 59, 999); // 今日の終了時間を設定 (23:59:59) | ||
|
|
||
| const assignments = await prisma.assignment.findMany({ | ||
| where: { | ||
| date: { | ||
| gte: startOfToday, // 今日の開始時間以上 | ||
| lte: endOfToday, // 今日の終了時間以下 | ||
| gte: startOfToday, // 今日の開始時間以上 | ||
| lte: endOfToday, // 今日の終了時間以下 | ||
| }, | ||
| }, | ||
| include: { word: true }, | ||
| }, | ||
| include: { word: true }, | ||
| }); | ||
| console.log(assignments); | ||
|
|
||
| const todayAssignments: todayAssignment[] = assignments.map((assignment) => { | ||
| const todayAssignment: todayAssignment = { | ||
| assignmentId: assignment.id, | ||
| english: assignment.word.english, | ||
| assignTime: assignment.date, | ||
| }; | ||
| return todayAssignment; | ||
| }) | ||
| }); | ||
|
|
||
| return new Response(JSON.stringify(todayAssignments), { | ||
| status: 200, | ||
| headers: { "Content-Type": "application/json" }, | ||
| }); | ||
| } | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| "use client"; | ||
|
|
||
| import * as ProgressPrimitive from "@radix-ui/react-progress"; | ||
| import * as React from "react"; | ||
|
|
||
| import { cn } from "@/lib/utils"; | ||
|
|
||
| const Progress = React.forwardRef< | ||
| React.ElementRef<typeof ProgressPrimitive.Root>, | ||
| React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root> | ||
| >(({ className, value, ...props }, ref) => ( | ||
| <ProgressPrimitive.Root | ||
| ref={ref} | ||
| className={cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className)} | ||
| {...props} | ||
| > | ||
| <ProgressPrimitive.Indicator | ||
| className="h-full w-full flex-1 bg-primary transition-all" | ||
| style={{ transform: `translateX(-${100 - (value || 0)}%)` }} | ||
| /> | ||
| </ProgressPrimitive.Root> | ||
| )); | ||
| Progress.displayName = ProgressPrimitive.Root.displayName; | ||
|
|
||
| export { Progress }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,57 @@ | ||
| import { Card } from "@/components/ui/card"; | ||
| import { type FC, useEffect, useState } from "react"; | ||
|
|
||
| interface TimerProps { | ||
| assignTime: Date; | ||
| } | ||
|
|
||
| const Timer: FC<TimerProps> = ({ assignTime }) => { | ||
| const [elapsedTime, setElapsedTime] = useState(0); | ||
| const startTime = new Date(assignTime).getTime(); | ||
|
|
||
| useEffect(() => { | ||
| const interval = setInterval(() => { | ||
| const currentTime = new Date(); | ||
| const timeElapsed = currentTime.getTime() - startTime; | ||
| setElapsedTime(timeElapsed); | ||
| }, 1000); | ||
|
|
||
| return () => { | ||
| clearInterval(interval); | ||
| }; | ||
| }, [startTime]); | ||
|
|
||
| // 経過時間を時間、分、秒に変換 | ||
| const formatTime = (ms: number) => { | ||
| const seconds = Math.floor(ms / 1000); | ||
| const minutes = Math.floor(seconds / 60); | ||
| const hours = Math.floor(minutes / 60); | ||
|
|
||
| return { | ||
| hh: hours % 24, | ||
| mm: minutes % 60, | ||
| ss: seconds % 60, | ||
| }; | ||
| }; | ||
|
|
||
| const { hh, mm, ss } = formatTime(elapsedTime); | ||
|
|
||
| const formattedHours = String(hh).padStart(2, "0"); | ||
| const formattedMinutes = String(mm).padStart(2, "0"); | ||
| const formattedSeconds = String(ss).padStart(2, "0"); | ||
|
|
||
| return ( | ||
| <Card className="bg-white rounded-lg border-gray-300 w-full"> | ||
| <div className="text-lg h-[6rem] w-full p-4 flex flex-col justify-center items-center text-gray-800"> | ||
| <div className="mb-2 text-xl font-semibold">経過時間</div> | ||
| <div className="flex text-3xl font-bold font-mono"> | ||
| <span className="mx-1">{formattedHours}</span>: | ||
| <span className="mx-1">{formattedMinutes}</span>: | ||
| <span className="mx-1">{formattedSeconds}</span> | ||
| </div> | ||
| </div> | ||
| </Card> | ||
| ); | ||
| }; | ||
|
|
||
| export default Timer; |
Oops, something went wrong.