diff --git a/front/src/components/Gallery/TextPlaceholder.tsx b/front/src/components/Gallery/TextPlaceholder.tsx
new file mode 100644
index 0000000..8f06262
--- /dev/null
+++ b/front/src/components/Gallery/TextPlaceholder.tsx
@@ -0,0 +1,12 @@
+import { FC, FunctionComponent, memo, ReactNode } from 'react'
+
+const TextPlaceholder: FC<{ children?: ReactNode }> = memo(({ children }) => (
+
{ children }
+))
+
+export default TextPlaceholder
diff --git a/front/src/components/Gallery/index.tsx b/front/src/components/Gallery/index.tsx
index 441176d..860ab48 100644
--- a/front/src/components/Gallery/index.tsx
+++ b/front/src/components/Gallery/index.tsx
@@ -8,6 +8,8 @@ import { Gallery, Photo } from 'api/photo'
import { CoverClickEvent, Props as PhotoBoxProps } from 'components/PhotoBox'
import Submission from 'components/Submission'
import useSafeState from 'hooks/useSafeState'
+import { dateDiffInDays } from 'utils/date'
+import TextPlaceholder from './TextPlaceholder'
function getViewportWidth() {
const { innerWidth } = window
@@ -141,25 +143,46 @@ export type Props = {
}
export default ({
cannot_select_vote = false,
- show_vote_button, gallery, selected_id_list, onClickVote, onClickCover,
+ show_vote_button,
+ gallery,
+ selected_id_list,
+ onClickVote,
+ onClickCover,
}: Props) => {
const layout = useWaterfallLayout(gallery)
const title_node = useTitleNode(gallery)
- const waterfall_layout_node = useMemo(() => (
- {
- onClickVote && onClickVote(photoId)
- }}
- />
- ), [cannot_select_vote, gallery.photos, show_vote_button, layout, onClickCover, onClickVote, selected_id_list])
+ const waterfall_layout_node = useMemo(() => {
+ const day_diff = dateDiffInDays(new Date(gallery.event_start), new Date)
+ if (gallery.in_event) {
+ return 提交你的投稿
+ } else if (gallery.photos.length === 0) {
+ if ((day_diff < 30) && day_diff > 0) {
+ return (
+
+ 活动将于 { day_diff } 天后开始
+
+ )
+ } else {
+ return 暂无相片
+ }
+ } else {
+ return (
+ {
+ onClickVote && onClickVote(photoId)
+ }}
+ />
+ )
+ }
+ }, [gallery.event_start, gallery.in_event, gallery.photos, layout, cannot_select_vote, selected_id_list, show_vote_button, onClickCover, onClickVote])
return (
diff --git a/front/src/components/Waterfall/index.tsx b/front/src/components/Waterfall/index.tsx
index 0489f5d..286e3e5 100644
--- a/front/src/components/Waterfall/index.tsx
+++ b/front/src/components/Waterfall/index.tsx
@@ -19,15 +19,6 @@ type Pos = {
type PhotoID = number
type PosMap = Record
-const Empty: FunctionComponent = memo(() => (
- 暂无投稿作品
-))
-
export type WaterfallLayoutConfigure = {
box_type: PhotoBoxProps['type']
vertial_gutter: PhotoBoxProps['vertial_gutter']
@@ -95,10 +86,7 @@ export default (props: Props) => {
margin: 'auto',
minHeight: '150px',
}}>
- {(photos.length === 0) ? (
-
- ) : (
- {
))
}
- )}
)
}