From 63fe72f00fed7de503ec73caa9227aae328569f6 Mon Sep 17 00:00:00 2001
From: s7tya <53410646+s7tya@users.noreply.github.com>
Date: Mon, 15 Apr 2024 00:49:37 +0900
Subject: [PATCH 1/5] impl
---
package-lock.json | 2 +-
src/app/committee/forms/FormsList.tsx | 76 +++++++++++++++++++++++++++
src/app/committee/forms/page.tsx | 47 ++++++++++++++++-
src/lib/formHelpers.ts | 5 ++
4 files changed, 128 insertions(+), 2 deletions(-)
create mode 100644 src/app/committee/forms/FormsList.tsx
diff --git a/package-lock.json b/package-lock.json
index c7993a1b..afffd8e6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -98,7 +98,7 @@
},
"node_modules/@clack/prompts/node_modules/is-unicode-supported": {
"version": "1.3.0",
- "dev": true,
+ "extraneous": true,
"inBundle": true,
"license": "MIT",
"engines": {
diff --git a/src/app/committee/forms/FormsList.tsx b/src/app/committee/forms/FormsList.tsx
new file mode 100644
index 00000000..63c38d50
--- /dev/null
+++ b/src/app/committee/forms/FormsList.tsx
@@ -0,0 +1,76 @@
+import { css } from "@styled-system/css";
+import dayjs from "dayjs";
+import { FC } from "react";
+
+import { components } from "@/schema";
+
+
+import { NoResultNotice } from "@/components/NoResultNotice";
+import Link from "next/link";
+import { getCommitteeTimeLeftText } from "@/lib/formHelpers";
+
+type Form = components["schemas"]["FormSummary"];
+
+export const FormsList: FC<{
+ forms: Form[];
+}> = ({ forms}) => {
+
+ return (
+ * > *": {
+ pr: 4,
+ lineHeight: 2,
+ },
+ })}>
+
*": {
+ borderColor: "gray.500",
+ borderBottom: "1px solid",
+ },
+ })}>
+
配信日
+
締切日
+
タイトル
+
締切まで
+
+ {forms.length == 0 && (
+
+
+
+ )}
+ {forms.map((form) => {
+
+ const startsAt = dayjs(form.starts_at);
+ const endsAt = dayjs(form.ends_at);
+
+ return (
+
+
+
{startsAt.format("YYYY/MM/DD")}
+
{endsAt.format("YYYY/MM/DD")}
+
{form.title}
+
{getCommitteeTimeLeftText(dayjs(), endsAt)}
+
+
+ );
+ })}
+
Loading...
;
+ }
+
+ if (error || !forms) {
+ return (
+
+ 申請の取得中にエラーが発生しました
+ ({String(error)})
+
+ );
+ }
+
+ return (
+ <>
+
+
+ );
};
export default DashboardPage;
diff --git a/src/lib/formHelpers.ts b/src/lib/formHelpers.ts
index d36af94b..3241bad4 100644
--- a/src/lib/formHelpers.ts
+++ b/src/lib/formHelpers.ts
@@ -38,3 +38,8 @@ export const getTimeLeftText = (now: dayjs.Dayjs, deadline: dayjs.Dayjs, status:
const diff = getTimeLeft(now, deadline);
return status === "未提出" ? (diff >= 0 ? `残り${diff}日` : "締切を過ぎています") : "";
};
+
+export const getCommitteeTimeLeftText = (now: dayjs.Dayjs, deadline: dayjs.Dayjs) => {
+ const diff = getTimeLeft(now, deadline);
+ return diff >= 0 ? `残り${diff}日` : "締切を過ぎています";
+};
From 628f7e3efecde20b6b61b004df2ae2c5ac6fe5b7 Mon Sep 17 00:00:00 2001
From: s7tya <53410646+s7tya@users.noreply.github.com>
Date: Mon, 15 Apr 2024 01:01:24 +0900
Subject: [PATCH 2/5] =?UTF-8?q?=EF=BE=8C=EF=BE=9F=EF=BE=99=EF=BE=8C?=
=?UTF-8?q?=EF=BE=9F=EF=BE=99=E3=81=AEimpl?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/committee/forms/FormsList.tsx | 12 ++++++---
src/app/forms/FormsList.tsx | 5 ++--
src/components/FormStatusBadge.tsx | 38 +++++++++++++++++++++++++++
3 files changed, 50 insertions(+), 5 deletions(-)
create mode 100644 src/components/FormStatusBadge.tsx
diff --git a/src/app/committee/forms/FormsList.tsx b/src/app/committee/forms/FormsList.tsx
index 63c38d50..dcb1f8cc 100644
--- a/src/app/committee/forms/FormsList.tsx
+++ b/src/app/committee/forms/FormsList.tsx
@@ -7,13 +7,14 @@ import { components } from "@/schema";
import { NoResultNotice } from "@/components/NoResultNotice";
import Link from "next/link";
-import { getCommitteeTimeLeftText } from "@/lib/formHelpers";
+import { getCommitteeTimeLeftText, getFormStatus } from "@/lib/formHelpers";
+import { FormStatusBadge } from "@/components/FormStatusBadge";
type Form = components["schemas"]["FormSummary"];
export const FormsList: FC<{
forms: Form[];
-}> = ({ forms}) => {
+}> = ({ forms }) => {
return (
* > *": {
pr: 4,
lineHeight: 2,
@@ -37,6 +38,7 @@ export const FormsList: FC<{
borderBottom: "1px solid",
},
})}>
+
状態
配信日
締切日
タイトル
@@ -51,6 +53,7 @@ export const FormsList: FC<{
const startsAt = dayjs(form.starts_at);
const endsAt = dayjs(form.ends_at);
+ const status = getFormStatus(dayjs(), startsAt, endsAt);
return (
+
+
+
{startsAt.format("YYYY/MM/DD")}
{endsAt.format("YYYY/MM/DD")}
{form.title}
diff --git a/src/app/forms/FormsList.tsx b/src/app/forms/FormsList.tsx
index f3c2b211..805a0e5e 100644
--- a/src/app/forms/FormsList.tsx
+++ b/src/app/forms/FormsList.tsx
@@ -14,6 +14,7 @@ import Image from "next/image";
import { hiddenFormIdsAtom } from "./hiddenFormIds";
import toast from "react-hot-toast";
import { NoResultNotice } from "@/components/NoResultNotice";
+import Link from "next/link";
type Form = components["schemas"]["FormSummary"];
type Answer = components["schemas"]["FormAnswerSummary"];
@@ -94,7 +95,7 @@ export const FormsList: FC<{
}}>
{isShown ?
:
}
-
{endsAt.format("YYYY/MM/DD")}{form.title}
{getTimeLeftText(dayjs(), endsAt, status)}
-
+
)}
{forms.map((form) => {
-
const startsAt = dayjs(form.starts_at);
const endsAt = dayjs(form.ends_at);
const status = getFormStatus(dayjs(), startsAt, endsAt);
diff --git a/src/components/FormStatusBadge.tsx b/src/components/FormStatusBadge.tsx
index ca59a87b..e25b8863 100644
--- a/src/components/FormStatusBadge.tsx
+++ b/src/components/FormStatusBadge.tsx
@@ -29,7 +29,7 @@ export const FormStatusBadge = ({ status, className }: Props) => {
backgroundColor: "sohosai.orange",
color: "white",
},
- 不明: {}
+ 不明: {},
},
},
});
From da6485366f8b1abe80c308726b22a032b4fae901 Mon Sep 17 00:00:00 2001
From: s7tya <53410646+s7tya@users.noreply.github.com>
Date: Mon, 15 Apr 2024 01:21:52 +0900
Subject: [PATCH 4/5] =?UTF-8?q?=EF=BE=8C=EF=BE=9F=EF=BE=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/committee/forms/FormsList.tsx | 105 ++++++++++++++------------
1 file changed, 56 insertions(+), 49 deletions(-)
diff --git a/src/app/committee/forms/FormsList.tsx b/src/app/committee/forms/FormsList.tsx
index d9f7a321..7f7f0b91 100644
--- a/src/app/committee/forms/FormsList.tsx
+++ b/src/app/committee/forms/FormsList.tsx
@@ -1,11 +1,11 @@
import { css } from "@styled-system/css";
+import Link from "next/link"
import dayjs from "dayjs";
import { FC } from "react";
import { components } from "@/schema";
import { NoResultNotice } from "@/components/NoResultNotice";
-import Link from "next/link";
import { getCommitteeTimeLeftText, getFormStatus } from "@/lib/formHelpers";
import { FormStatusBadge } from "@/components/FormStatusBadge";
@@ -15,65 +15,72 @@ export const FormsList: FC<{
forms: Form[];
}> = ({ forms }) => {
return (
-
+
* > *": {
- pr: 4,
- lineHeight: 2,
- },
- })}>
+ justifyContent: "flex-end"
+ })}>+ 新規作成
*": {
- borderColor: "gray.500",
- borderBottom: "1px solid",
+ width: "full",
+ display: "grid",
+ alignItems: "center",
+ gridTemplateColumns: "1fr 1fr 1fr 3fr 2fr",
+ "& > * > *": {
+ pr: 4,
+ lineHeight: 2,
},
})}>
-
状態
-
配信日
-
締切日
-
タイトル
-
締切まで
-
- {forms.length == 0 && (
-
-
+
*": {
+ borderColor: "gray.500",
+ borderBottom: "1px solid",
+ },
+ })}>
+
状態
+
配信日
+
締切日
+
タイトル
+
締切まで
- )}
- {forms.map((form) => {
- const startsAt = dayjs(form.starts_at);
- const endsAt = dayjs(form.ends_at);
- const status = getFormStatus(dayjs(), startsAt, endsAt);
+ {forms.length == 0 && (
+
+
+
+ )}
+ {forms.map((form) => {
+ const startsAt = dayjs(form.starts_at);
+ const endsAt = dayjs(form.ends_at);
+ const status = getFormStatus(dayjs(), startsAt, endsAt);
- return (
-
-
-
-
-
-
{startsAt.format("YYYY/MM/DD")}
-
{endsAt.format("YYYY/MM/DD")}
-
{form.title}
-
{getCommitteeTimeLeftText(dayjs(), endsAt)}
-
-
- );
- })}
+
+
+
+
+
{startsAt.format("YYYY/MM/DD")}
+
{endsAt.format("YYYY/MM/DD")}
+
{form.title}
+
{getCommitteeTimeLeftText(dayjs(), endsAt)}
+
+
+ );
+ })}
+