From bdd5c65091a2dbe0b5df4ee927655dc47d85cecd Mon Sep 17 00:00:00 2001 From: Frudrax Cheng Date: Fri, 5 Jun 2026 17:28:27 +0800 Subject: [PATCH] style: use date picker for manufacture date --- package.json | 1 + pnpm-lock.yaml | 17 ++++++++++------- src/pages/ProductTraces.tsx | 21 +++++++-------------- 3 files changed, 18 insertions(+), 21 deletions(-) diff --git a/package.json b/package.json index e79f9d0..9f32d8c 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "@ant-design/icons": "^6.1.0", "antd": "^6.3.1", "axios": "^1.13.6", + "dayjs": "^1.11.21", "qrcode": "^1.5.4", "react": "^19.2.4", "react-dom": "^19.2.4", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2746308..c72add5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -17,6 +17,9 @@ importers: axios: specifier: ^1.13.6 version: 1.13.6 + dayjs: + specifier: ^1.11.21 + version: 1.11.21 qrcode: specifier: ^1.5.4 version: 1.5.4 @@ -872,8 +875,8 @@ packages: csstype@3.2.3: resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==} - dayjs@1.11.19: - resolution: {integrity: sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==} + dayjs@1.11.21: + resolution: {integrity: sha512-98IT+HOahAisibz/yjKbzuOBwYcjJ7BCLPzARyHiyEBmRz4fatF+KPJszEHXsGYjUG234aH/cOjW1wwTbKUZlA==} debug@4.4.3: resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==} @@ -1679,7 +1682,7 @@ snapshots: react: 19.2.4 react-dom: 19.2.4(react@19.2.4) - '@rc-component/picker@1.9.0(dayjs@1.11.19)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)': + '@rc-component/picker@1.9.0(dayjs@1.11.21)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)': dependencies: '@rc-component/overflow': 1.0.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/resize-observer': 1.1.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4) @@ -1689,7 +1692,7 @@ snapshots: react: 19.2.4 react-dom: 19.2.4(react@19.2.4) optionalDependencies: - dayjs: 1.11.19 + dayjs: 1.11.21 '@rc-component/portal@2.2.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4)': dependencies: @@ -2022,7 +2025,7 @@ snapshots: '@rc-component/mutate-observer': 2.0.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/notification': 1.2.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/pagination': 1.2.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4) - '@rc-component/picker': 1.9.0(dayjs@1.11.19)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) + '@rc-component/picker': 1.9.0(dayjs@1.11.21)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/progress': 1.0.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/qrcode': 1.1.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/rate': 1.0.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4) @@ -2043,7 +2046,7 @@ snapshots: '@rc-component/upload': 1.1.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4) '@rc-component/util': 1.9.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4) clsx: 2.1.1 - dayjs: 1.11.19 + dayjs: 1.11.21 react: 19.2.4 react-dom: 19.2.4(react@19.2.4) scroll-into-view-if-needed: 3.1.0 @@ -2108,7 +2111,7 @@ snapshots: csstype@3.2.3: {} - dayjs@1.11.19: {} + dayjs@1.11.21: {} debug@4.4.3: dependencies: diff --git a/src/pages/ProductTraces.tsx b/src/pages/ProductTraces.tsx index 2cb5116..b358c99 100644 --- a/src/pages/ProductTraces.tsx +++ b/src/pages/ProductTraces.tsx @@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'; import { Button, Card, + DatePicker, Form, Image, Input, @@ -23,11 +24,12 @@ import { UploadOutlined, } from '@ant-design/icons'; import type { UploadFile } from 'antd'; +import dayjs, { type Dayjs } from 'dayjs'; import { productTracesApi } from '@/services/api'; import type { CreateProductTraceRequest, ProductTrace, UpdateProductTraceRequest } from '@/types'; type ProductTraceFormValues = Omit & { - manufactureDate: string; + manufactureDate: Dayjs; }; function formatDate(value: string) { @@ -35,15 +37,6 @@ function formatDate(value: string) { return new Date(value).toLocaleDateString('zh-CN'); } -function toDateInputValue(value: string) { - if (!value) return ''; - return new Date(value).toISOString().slice(0, 10); -} - -function dateInputToISOString(value: string) { - return new Date(`${value}T00:00:00+08:00`).toISOString(); -} - function ProductTracesPage() { const [traces, setTraces] = useState([]); const [loading, setLoading] = useState(true); @@ -110,7 +103,7 @@ function ProductTracesPage() { companyPhone: trace.companyPhone, deviceInfo: trace.deviceInfo, warrantyPeriod: trace.warrantyPeriod, - manufactureDate: toDateInputValue(trace.manufactureDate), + manufactureDate: dayjs(trace.manufactureDate), serialNumber: trace.serialNumber, officialWebsite: trace.officialWebsite, }); @@ -133,7 +126,7 @@ function ProductTracesPage() { companyPhone: values.companyPhone, deviceInfo: values.deviceInfo, warrantyPeriod: values.warrantyPeriod, - manufactureDate: dateInputToISOString(values.manufactureDate), + manufactureDate: values.manufactureDate.toDate().toISOString(), officialWebsite: values.officialWebsite || '', }; saved = await productTracesApi.update(editingTrace.serialNumber, payload); @@ -142,7 +135,7 @@ function ProductTracesPage() { ...values, officialWebsite: values.officialWebsite || '', serialNumber: values.serialNumber.trim(), - manufactureDate: dateInputToISOString(values.manufactureDate), + manufactureDate: values.manufactureDate.toDate().toISOString(), }; saved = await productTracesApi.create(payload); } @@ -367,7 +360,7 @@ function ProductTracesPage() { - +