From 62cce4918b1ab04e109bbfd182a327e92228fa36 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=87=E9=98=B3?= Date: Mon, 2 Dec 2024 20:15:32 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8A=9F=E8=83=BD=EF=BC=9A=E8=B0=83=E6=95=B4?= =?UTF-8?q?=E9=97=AA=E5=BF=B5=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/record.ts | 27 ++++ .../Comment/components/List/index.tsx | 5 +- src/app/record/components/Comment/index.tsx | 17 ++- src/app/record/components/ImageList/index.tsx | 15 +-- src/app/record/page.tsx | 120 ++++++------------ src/components/Footer/index.tsx | 1 - src/types/app/record.d.ts | 6 + src/utils/dayFormat.ts | 42 ++++++ src/utils/index.ts | 6 +- 9 files changed, 140 insertions(+), 99 deletions(-) create mode 100644 src/api/record.ts create mode 100644 src/types/app/record.d.ts create mode 100644 src/utils/dayFormat.ts diff --git a/src/api/record.ts b/src/api/record.ts new file mode 100644 index 0000000..25aaab8 --- /dev/null +++ b/src/api/record.ts @@ -0,0 +1,27 @@ +import Request from '@/utils/request' +import { Record } from '@/types/app/record' + +// 新增说说 +export const addRecordDataAPI = (data: Record) => Request("POST", "/record", { data }) + +// 删除说说 +export const delRecordDataAPI = (id: number) => Request("DELETE", `/record/${id}`) + +// 修改说说 +export const editRecordDataAPI = (data: Record) => Request("PATCH", "/record", { data }) + +// 获取说说 +export const getRecordDataAPI = (id?: number) => Request("GET", `/record/${id}`) + +// 获取说说列表 +export const getRecordListAPI = (data?: QueryData) => Request("POST", `/record/list`, { + data: { ...data?.query }, +}) + +// 分页获取说说列表 +export const getRecordPagingAPI = (data?: QueryData) => Request>("POST", `/record/paging`, { + data: { ...data?.query }, + params: { + ...data?.pagination + } +}) \ No newline at end of file diff --git a/src/app/article/components/Comment/components/List/index.tsx b/src/app/article/components/Comment/components/List/index.tsx index 76875ab..5a1977d 100644 --- a/src/app/article/components/Comment/components/List/index.tsx +++ b/src/app/article/components/Comment/components/List/index.tsx @@ -28,11 +28,8 @@ const CommentList = ({ list, reply }: Props) => {
  • { - one.avatar - ? - : + one.avatar ? : } -
    { one.url diff --git a/src/app/record/components/Comment/index.tsx b/src/app/record/components/Comment/index.tsx index f18014c..104b064 100644 --- a/src/app/record/components/Comment/index.tsx +++ b/src/app/record/components/Comment/index.tsx @@ -1,9 +1,24 @@ "use client" +import { Accordion, AccordionItem } from "@nextui-org/react" + export default () => { return ( <> -
    展开
    + + +
    +
    + Avatar + +
    +
    满心
    +
    前段时间我也弄了，弄的脆皮肠，很好吃
    +
    +
    +
    +     +     ) } \ No newline at end of file diff --git a/src/app/record/components/ImageList/index.tsx b/src/app/record/components/ImageList/index.tsx index 5a5d5d3..bd3c0bf 100644 --- a/src/app/record/components/ImageList/index.tsx +++ b/src/app/record/components/ImageList/index.tsx @@ -3,22 +3,19 @@ import { PhotoProvider, PhotoView } from "react-photo-view" import 'react-photo-view/dist/react-photo-view.css'; -export default () => { - const list = [ - "https://bu.dusays.com/2024/10/28/671f7a44631d7.png", - "https://bu.dusays.com/2024/09/17/66e97036dddcb.png", - "https://bu.dusays.com/2024/09/17/66e97035726ae.png", - "https://bu.dusays.com/2024/09/17/66e97031cd456.png" - ] +interface Props { + list: string[] +} +export default ({ list }: Props) => { return ( <> -
    +
    800} easing={(type) => (type === 2 ? 'cubic-bezier(0.36, 0, 0.66, -0.56)' : 'cubic-bezier(0.34, 1.56, 0.64, 1)')} > -
    +
    { list?.map((url, index) => ( diff --git a/src/app/record/page.tsx b/src/app/record/page.tsx index 91dd9cf..d1eb57c 100644 --- a/src/app/record/page.tsx +++ b/src/app/record/page.tsx @@ -1,102 +1,56 @@ import Image from "next/image" import ImageList from "./components/ImageList" import Comment from "./components/Comment" +import { getRecordPagingAPI } from '@/api/record' +import { getUserDataAPI } from '@/api/user'; +import { Record } from "@/types/app/record" +import { User } from "@/types/app/user"; +import { dayFormat } from '@/utils' + +export default async () => { + const { data: user } = await getUserDataAPI() || { data: {} as User } + const { data: record } = await getRecordPagingAPI() || { data: {} as Paginate } -export default () => { return ( <>
    - 作者头像 + 作者头像

    👋 Liu 宇阳

    🎯 梦想做一名技术顶尖的架构师，奈何学历太低！

    -
    - 作者头像 + { + record?.result.map(item => ( +
    + 作者头像 -
    - 作者头像 +
    + 作者头像 -
    -

    宇阳

    - 3天前 +
    +

    {user.name}

    + {dayFormat(item.createTime)} +
    +
    + +
    +
    +

    {user.name}

    + {dayFormat(item.createTime)} +
    + +
    +

    {item.content}

    + + + +
    +
    -
    - -
    -
    -

    宇阳

    - 3天前 -
    - -
    -

    - 🎉 ThriveX 是一个 Next14 + Spring Boot 的产物，该项目专注于分享技术文章和知识，为技术爱好者和从业者提供一个分享、交流和学习的平台。用户可以在平台上发表自己的技术文章，或浏览其他用户分享的文章，并与他们进行讨论和互动。 -

    - - - -
    -
    -
    - -
    - 作者头像 - -
    - 作者头像 - -
    -

    宇阳

    - 3天前 -
    -
    - -
    -
    -

    宇阳

    - 3天前 -
    - -
    -

    - 🎉 ThriveX 是一个 Next14 + Spring Boot 的产物，该项目专注于分享技术文章和知识，为技术爱好者和从业者提供一个分享、交流和学习的平台。用户可以在平台上发表自己的技术文章，或浏览其他用户分享的文章，并与他们进行讨论和互动。 -

    - - -
    -
    -
    - -
    - 作者头像 - -
    - 作者头像 - -
    -

    宇阳

    - 3天前 -
    -
    - -
    -
    -

    宇阳

    - 3天前 -
    - -
    -

    - 🎉 ThriveX 是一个 Next14 + Spring Boot 的产物，该项目专注于分享技术文章和知识，为技术爱好者和从业者提供一个分享、交流和学习的平台。用户可以在平台上发表自己的技术文章，或浏览其他用户分享的文章，并与他们进行讨论和互动。 -

    - - -
    -
    -
    + )) + }
    diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx index 4bbf111..ac53a20 100644 --- a/src/components/Footer/index.tsx +++ b/src/components/Footer/index.tsx @@ -1,4 +1,3 @@ -import Image from 'next/image' import Link from 'next/link'; import { Tooltip } from '@nextui-org/react'; import { getConfigDataAPI } from '@/api/project'; diff --git a/src/types/app/record.d.ts b/src/types/app/record.d.ts new file mode 100644 index 0000000..e3da046 --- /dev/null +++ b/src/types/app/record.d.ts @@ -0,0 +1,6 @@ +export interface Record { + id?: number, + content: string, + images: string | string[], + createTime?: string | Dayjs; +} \ No newline at end of file diff --git a/src/utils/dayFormat.ts b/src/utils/dayFormat.ts new file mode 100644 index 0000000..5fb9d5a --- /dev/null +++ b/src/utils/dayFormat.ts @@ -0,0 +1,42 @@ +const dayjs = require('dayjs'); +const relativeTime = require('dayjs/plugin/relativeTime'); +const localeData = require('dayjs/plugin/localeData'); +const updateLocale = require('dayjs/plugin/updateLocale'); + +dayjs.extend(relativeTime); +dayjs.extend(localeData); +dayjs.extend(updateLocale); + +// 更新 locale 配置以自定义显示 +dayjs.updateLocale('en', { + relativeTime: { + future: 'in %s', + past: '%s前', + s: '几秒', + m: '1 分钟', + mm: '%d 分钟', + h: '1 小时', + hh: '%d 小时', + d: '1 天', + dd: '%d 天', + M: '1 个月', + MM: '%d 个月', + y: '1 年', + yy: '%d 年' + } +}); + +export default function dayFormat(timestamp: number | string) { + const now = dayjs(); + const target = dayjs(+timestamp); + + if (now.isSame(target, 'day')) { + return '今天'; + } else if (now.subtract(1, 'day').isSame(target, 'day')) { + return '昨天'; + } else if (now.subtract(2, 'day').isSame(target, 'day')) { + return '前天'; + } else { + return target.fromNow(); + } +} \ No newline at end of file diff --git a/src/utils/index.ts b/src/utils/index.ts index b47540d..3cb272f 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,4 +1,8 @@ +import dayFormat from './dayFormat' + // 生成随机数 export function getRandom(min: number, max: number): number { return Math.floor(Math.random() * (max - min + 1) + min); -} \ No newline at end of file +} + +export { dayFormat } \ No newline at end of file