Skip to content

Commit f7622ac

Browse files
yn1323yn1323
authored
Merge pull request #324 from yn1323/feat/0415
chore: icon, header
2 parents 39f7194 + 0759903 commit f7622ac

File tree

10 files changed

+261
-200
lines changed

10 files changed

+261
-200
lines changed

‎design/dashboard.pen‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -491,7 +491,7 @@
491491
"id": "15olP",
492492
"name": "card1Submitted",
493493
"fill": "$fg/muted",
494-
"content": "提出状況: 8/10人",
494+
"content": "提出済み: 8人",
495495
"fontFamily": "Inter",
496496
"fontSize": "$fontSize/sm",
497497
"fontWeight": "normal"
@@ -629,7 +629,7 @@
629629
"id": "6UZso",
630630
"name": "card2Submitted",
631631
"fill": "$fg/muted",
632-
"content": "提出状況: 10/10人",
632+
"content": "提出済み: 10人",
633633
"fontFamily": "Inter",
634634
"fontSize": "$fontSize/sm",
635635
"fontWeight": "normal"
@@ -1691,7 +1691,7 @@
16911691
"id": "d3W9W",
16921692
"name": "spCard1Submitted",
16931693
"fill": "$fg/muted",
1694-
"content": "提出: 8/10人",
1694+
"content": "提出済み: 10人",
16951695
"fontFamily": "Inter",
16961696
"fontSize": "$fontSize/xs",
16971697
"fontWeight": "normal"
@@ -1818,7 +1818,7 @@
18181818
"id": "EeqAj",
18191819
"name": "spCard2Submitted",
18201820
"fill": "$fg/muted",
1821-
"content": "提出: 10/10人",
1821+
"content": "提出済み: 10人",
18221822
"fontFamily": "Inter",
18231823
"fontSize": "$fontSize/xs",
18241824
"fontWeight": "normal"

‎public/favicon.ico‎

258 KB
Binary file not shown.

‎public/logo192.png‎

22.2 KB
Loading

‎public/logo512.png‎

138 KB
Loading

‎src/components/features/StaffSubmit/ExpiredSubmitView/index.tsx‎

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,24 @@
11
import { Box, Flex, Icon, Text, VStack } from "@chakra-ui/react";
22
import { LuCalendarX } from "react-icons/lu";
3+
import { SubmitPageLayout } from "../SubmitPageLayout";
34

45
type Props = {
56
shopName: string;
67
};
78

89
export const ExpiredSubmitView = ({ shopName }: Props) => {
910
return (
10-
<Flex direction="column" minH="100dvh" bg="gray.50">
11-
{/* Header */}
12-
<Box bg="teal.600" px={4} pt={3} pb={4}>
13-
<Text fontSize="xs" color="white" opacity={0.8}>
14-
{shopName}
15-
</Text>
16-
<Text fontSize="xl" fontWeight="bold" color="white">
17-
シフト希望を提出
18-
</Text>
11+
<SubmitPageLayout>
12+
{/* Header (full-width bg) */}
13+
<Box bg="teal.600" w="full">
14+
<Box maxW="1024px" mx="auto" px={4} pt={3} pb={4}>
15+
<Text fontSize="xs" color="white" opacity={0.8}>
16+
{shopName}
17+
</Text>
18+
<Text fontSize="xl" fontWeight="bold" color="white">
19+
シフト希望を提出
20+
</Text>
21+
</Box>
1922
</Box>
2023

2124
{/* Content */}
@@ -32,6 +35,6 @@ export const ExpiredSubmitView = ({ shopName }: Props) => {
3235
</Text>
3336
</VStack>
3437
</Flex>
35-
</Flex>
38+
</SubmitPageLayout>
3639
);
3740
};

‎src/components/features/StaffSubmit/ReadOnlySubmitView/index.tsx‎

Lines changed: 51 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { LuInfo } from "react-icons/lu";
44
import { getDateRange } from "@/src/components/features/Shift/ShiftForm/utils/dateUtils";
55
import { DayCard } from "../DayCard";
66
import type { SubmissionData } from "../SubmitFormView";
7+
import { SubmitPageContent, SubmitPageLayout } from "../SubmitPageLayout";
78
import { buildEntries, formatPeriodLabel } from "../utils/timeOptions";
89

910
type Props = {
@@ -19,61 +20,61 @@ export const ReadOnlySubmitView = ({ data }: Props) => {
1920
);
2021

2122
return (
22-
<Flex direction="column" minH="100dvh" bg="gray.50">
23-
{/* Header */}
24-
<Box bg="teal.600" px={4} pt={3} pb={4}>
25-
<Text fontSize="xs" color="white" opacity={0.8}>
26-
{data.shopName}
27-
</Text>
28-
<Text fontSize="xl" fontWeight="bold" color="white">
29-
シフト希望を提出
30-
</Text>
23+
<SubmitPageLayout>
24+
{/* Header (full-width bg) */}
25+
<Box bg="teal.600" w="full">
26+
<Box maxW="1024px" mx="auto" px={4} pt={3} pb={4}>
27+
<Text fontSize="xs" color="white" opacity={0.8}>
28+
{data.shopName}
29+
</Text>
30+
<Text fontSize="xl" fontWeight="bold" color="white">
31+
シフト希望を提出
32+
</Text>
33+
</Box>
3134
</Box>
3235

33-
{/* Info Banner */}
34-
<Flex bg="blue.50" px={4} py={2.5} gap={2} align="center">
35-
<Icon color="blue.600" boxSize={4}>
36-
<LuInfo />
37-
</Icon>
38-
<Text fontSize="xs" fontWeight="medium" color="blue.800">
39-
提出締切を過ぎたため変更できません
40-
</Text>
41-
</Flex>
36+
{/* Info Banner (full-width bg) */}
37+
<Box bg="blue.50" w="full">
38+
<Flex maxW="1024px" mx="auto" px={4} py={2.5} gap={2} align="center">
39+
<Icon color="blue.600" boxSize={4}>
40+
<LuInfo />
41+
</Icon>
42+
<Text fontSize="xs" fontWeight="medium" color="blue.800">
43+
提出締切を過ぎたため変更できません
44+
</Text>
45+
</Flex>
46+
</Box>
4247

43-
{/* InfoBar */}
44-
<Flex
45-
bg="white"
46-
px={4}
47-
py={3}
48-
justify="space-between"
49-
align="center"
50-
borderBottomWidth={1}
51-
borderColor="border.default"
52-
>
53-
<Text fontSize="sm" fontWeight="semibold">
54-
{formatPeriodLabel(data.periodStart, data.periodEnd)}
55-
</Text>
56-
<Box bg="green.50" px={2.5} py={1} borderRadius="full">
57-
<Text fontSize="xs" fontWeight="semibold" color="green.800">
58-
提出済み
48+
{/* InfoBar (full-width bg) */}
49+
<Box bg="white" w="full" borderBottomWidth={1} borderColor="border.default">
50+
<Flex maxW="1024px" mx="auto" px={4} py={3} justify="space-between" align="center">
51+
<Text fontSize="sm" fontWeight="semibold">
52+
{formatPeriodLabel(data.periodStart, data.periodEnd)}
5953
</Text>
60-
</Box>
61-
</Flex>
54+
<Box bg="green.50" px={2.5} py={1} borderRadius="full">
55+
<Text fontSize="xs" fontWeight="semibold" color="green.800">
56+
提出済み
57+
</Text>
58+
</Box>
59+
</Flex>
60+
</Box>
6261

6362
{/* Card List */}
64-
<VStack px={4} py={3} gap={2}>
65-
{entries.map((entry) => (
66-
<DayCard
67-
key={entry.date}
68-
entry={entry}
69-
timeOptions={[]}
70-
onToggleWorking={() => {}}
71-
onTimeChange={() => {}}
72-
onClear={() => {}}
73-
isReadOnly
74-
/>
75-
))}
76-
</VStack>
77-
</Flex>
63+
<SubmitPageContent>
64+
<VStack px={4} py={3} gap={2}>
65+
{entries.map((entry) => (
66+
<DayCard
67+
key={entry.date}
68+
entry={entry}
69+
timeOptions={[]}
70+
onToggleWorking={() => {}}
71+
onTimeChange={() => {}}
72+
onClear={() => {}}
73+
isReadOnly
74+
/>
75+
))}
76+
</VStack>
77+
</SubmitPageContent>
78+
</SubmitPageLayout>
7879
);
7980
};

‎src/components/features/StaffSubmit/SubmitCompleteView/index.tsx‎

Lines changed: 73 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Box, Button, Circle, Flex, Icon, Text, VStack } from "@chakra-ui/react"
22
import { LuCheck } from "react-icons/lu";
33
import { formatDateWithWeekday } from "@/src/components/features/Shift/ShiftForm/utils/dateUtils";
44
import type { DayEntry } from "../DayCard";
5+
import { SubmitPageContent, SubmitPageLayout } from "../SubmitPageLayout";
56
import { formatTime, getDateColor } from "../utils/timeOptions";
67

78
type Props = {
@@ -12,77 +13,83 @@ type Props = {
1213

1314
export const SubmitCompleteView = ({ shopName, entries, onEdit }: Props) => {
1415
return (
15-
<Flex direction="column" minH="100dvh" bg="gray.50">
16-
{/* Header */}
17-
<Box bg="teal.600" px={4} pt={3} pb={4}>
18-
<Text fontSize="xs" color="white" opacity={0.8}>
19-
{shopName}
20-
</Text>
21-
<Text fontSize="xl" fontWeight="bold" color="white">
22-
シフト希望を提出
23-
</Text>
16+
<SubmitPageLayout>
17+
{/* Header (full-width bg) */}
18+
<Box bg="teal.600" w="full">
19+
<Box maxW="1024px" mx="auto" px={4} pt={3} pb={4}>
20+
<Text fontSize="xs" color="white" opacity={0.8}>
21+
{shopName}
22+
</Text>
23+
<Text fontSize="xl" fontWeight="bold" color="white">
24+
シフト希望を提出
25+
</Text>
26+
</Box>
2427
</Box>
2528

26-
{/* Success Area */}
27-
<VStack bg="white" px={4} pt={8} pb={6} gap={2}>
28-
<Circle size="56px" bg="teal.600">
29-
<Icon color="white" boxSize={7}>
30-
<LuCheck />
31-
</Icon>
32-
</Circle>
33-
<Text fontSize="xl" fontWeight="bold">
34-
提出しました
35-
</Text>
36-
<Text fontSize="sm" color="fg.muted">
37-
シフトが確定したらメールでお知らせします
38-
</Text>
39-
</VStack>
29+
{/* Success Area (full-width bg) */}
30+
<Box bg="white" w="full">
31+
<VStack maxW="1024px" mx="auto" px={4} pt={8} pb={6} gap={2}>
32+
<Circle size="56px" bg="teal.600">
33+
<Icon color="white" boxSize={7}>
34+
<LuCheck />
35+
</Icon>
36+
</Circle>
37+
<Text fontSize="xl" fontWeight="bold">
38+
提出しました
39+
</Text>
40+
<Text fontSize="sm" color="fg.muted">
41+
シフトが確定したらメールでお知らせします
42+
</Text>
43+
</VStack>
44+
</Box>
4045

41-
{/* Summary */}
42-
<Box px={4} pt={3}>
43-
<Box borderRadius="lg" borderWidth={1} borderColor="border.default" bg="white" overflow="hidden">
44-
{entries.map((entry, i) => (
45-
<Flex
46-
key={entry.date}
47-
h="40px"
48-
px={4}
49-
align="center"
50-
justify="space-between"
51-
borderBottomWidth={i < entries.length - 1 ? 1 : 0}
52-
borderColor="border.default"
53-
>
54-
<Text fontSize="sm" fontWeight="medium" color={getDateColor(entry.date)}>
55-
{formatDateWithWeekday(entry.date)}
56-
</Text>
57-
{entry.isWorking ? (
58-
<Text fontSize="sm" fontWeight="medium" color="teal.600">
59-
{formatTime(entry.startTime)} 〜 {formatTime(entry.endTime)}
60-
</Text>
61-
) : (
62-
<Text fontSize="sm" color="fg.subtle">
63-
休み
46+
<SubmitPageContent>
47+
{/* Summary */}
48+
<Box px={4} pt={3}>
49+
<Box borderRadius="lg" borderWidth={1} borderColor="border.default" bg="white" overflow="hidden">
50+
{entries.map((entry, i) => (
51+
<Flex
52+
key={entry.date}
53+
h="40px"
54+
px={4}
55+
align="center"
56+
justify="space-between"
57+
borderBottomWidth={i < entries.length - 1 ? 1 : 0}
58+
borderColor="border.default"
59+
>
60+
<Text fontSize="sm" fontWeight="medium" color={getDateColor(entry.date)}>
61+
{formatDateWithWeekday(entry.date)}
6462
</Text>
65-
)}
66-
</Flex>
67-
))}
63+
{entry.isWorking ? (
64+
<Text fontSize="sm" fontWeight="medium" color="teal.600">
65+
{formatTime(entry.startTime)} 〜 {formatTime(entry.endTime)}
66+
</Text>
67+
) : (
68+
<Text fontSize="sm" color="fg.subtle">
69+
休み
70+
</Text>
71+
)}
72+
</Flex>
73+
))}
74+
</Box>
6875
</Box>
69-
</Box>
7076

71-
{/* Edit Button */}
72-
<Box px={4} pt={4} pb={6}>
73-
<Button
74-
w="full"
75-
h="48px"
76-
variant="outline"
77-
borderRadius="lg"
78-
fontWeight="semibold"
79-
bg="white"
80-
_hover={{ bg: "gray.100" }}
81-
onClick={onEdit}
82-
>
83-
内容を修正する
84-
</Button>
85-
</Box>
86-
</Flex>
77+
{/* Edit Button */}
78+
<Box px={4} pt={4} pb={6}>
79+
<Button
80+
w="full"
81+
h="48px"
82+
variant="outline"
83+
borderRadius="lg"
84+
fontWeight="semibold"
85+
bg="white"
86+
_hover={{ bg: "gray.100" }}
87+
onClick={onEdit}
88+
>
89+
内容を修正する
90+
</Button>
91+
</Box>
92+
</SubmitPageContent>
93+
</SubmitPageLayout>
8794
);
8895
};

0 commit comments

Comments
 (0)
⚡