feat: 添加 EmptyPlaceholder 组件并更新相关页面

- 新增 EmptyPlaceholder 组件，用于统一处理空状态提示，提升用户体验。
- 更新多个页面（JsonTools、Jwt、QrCode、Timestamp）以使用 EmptyPlaceholder 组件，简化空状态的实现。
- 更新 README.md，添加 EmptyPlaceholder 组件的说明。

src/pages/Timestamp/components/LiveClock.tsx

@@ -5,6 +5,7 @@ import { CopyButton } from '@/components/CopyButton';
 import type { UnitType } from '../constants';
 import { msToUnit } from '../constants';
 import { cn } from '@/lib/utils';
+import { Button } from '@/components/ui/button';
 
 interface LiveClockProps extends React.HTMLAttributes<HTMLDivElement> {
   unit: UnitType;
@@ -40,17 +41,19 @@ export default function LiveClock({ unit, onUseNow, className, ...props }: LiveC
         {text}
       </span>
 
-      <button
+      <Button
         type="button"
         onClick={() => {
           onUseNow(rawTime);
           toast.success('已使用当前时间戳');
         }}
         title={'填充到下方'}
-        className="flex h-7 w-7 items-center justify-center rounded-md border border-input bg-background text-muted-foreground shadow-sm hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+        variant="ghost"
+        size="icon"
+        className="h-7 w-7 text-muted-foreground hover:text-foreground"
       >
         <Clock className="w-3.5 h-3.5" />
-      </button>
+      </Button>
 
       <CopyButton text={text} tooltip={'复制时间戳'} className="h-7 w-7 rounded-md border" />
     </div>

src/pages/Timestamp/components/ResultView.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { CopyButton } from '@/components/CopyButton';
+import EmptyPlaceholder from '@/components/EmptyPlaceholder';
 import { cn } from '@/lib/utils';
 
 interface ResultViewProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -16,15 +17,13 @@ export default function ResultView({
   if (!result) {
     if (!showEmptyPlaceholder) return null;
     return (
-      <div
-        className={cn(
-          'flex-1 flex items-center justify-center text-sm font-medium border border-dashed border-border/60 rounded-xl py-12 px-4 text-center text-muted-foreground bg-muted/20 min-h-[320px]',
-          className,
-        )}
+      <EmptyPlaceholder
+        className={cn('flex-1 min-h-[320px]', className)}
+        messageClassName="text-sm font-medium text-muted-foreground max-w-none"
         {...props}
       >
         {'请输入并点击转换'}
-      </div>
+      </EmptyPlaceholder>
     );
   }
 
@@ -41,7 +40,9 @@ export default function ResultView({
         <CopyButton
           text={result}
           tooltip={'复制结果'}
-          className="h-8 w-8 rounded-md shrink-0 border"
+          variant="ghost"
+          size="icon"
+          className="h-7 w-7 text-muted-foreground hover:text-foreground"
         />
       </div>
     </div>

src/pages/Timestamp/constants.ts

@@ -11,12 +11,10 @@ export type ZoneType = (typeof ZONES)[number];
 
 const DIVISORS: Record<UnitType, number> = { ms: 1, s: 1000 };
 
-/** Convert milliseconds to display value based on unit. */
 export function msToUnit(ms: number, unit: UnitType): number {
   return Math.floor(ms / DIVISORS[unit]);
 }
 
-/** Build a dayjs object from a numeric timestamp according to unit. */
 export function dayjsFromTimestamp(ts: number, unit: UnitType): Dayjs {
   return unit === 'ms' ? dayjs(ts) : dayjs.unix(ts);
 }