add creation date display with CalendarPlus icon to DeliveryCard header
Some checks failed
Build and Push Docker Images / build-backend (push) Has been cancelled
Build and Push Docker Images / build-frontend (push) Has been cancelled

This commit is contained in:
Egor Pozharov
2026-05-12 15:08:51 +06:00
parent 48a32d50fd
commit dc85b62bdb
3 changed files with 17 additions and 6 deletions

View File

@@ -1,12 +1,12 @@
{ {
"name": "delivery-tracker", "name": "delivery-tracker",
"version": "0.0.1", "version": "0.0.2",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "delivery-tracker", "name": "delivery-tracker",
"version": "0.0.1", "version": "0.0.2",
"dependencies": { "dependencies": {
"@tailwindcss/vite": "^4.2.2", "@tailwindcss/vite": "^4.2.2",
"date-fns": "^4.1.0", "date-fns": "^4.1.0",

View File

@@ -1,7 +1,7 @@
{ {
"name": "delivery-tracker", "name": "delivery-tracker",
"private": true, "private": true,
"version": "0.0.1", "version": "0.0.2",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",

View File

@@ -1,11 +1,18 @@
import { memo } from 'react'; import { memo } from 'react';
import { MapPin, Phone, Store, Calendar, MessageSquare, CheckCircle2, Circle, CheckSquare, User, Wrench } from 'lucide-react'; import { MapPin, Phone, Store, Calendar, MessageSquare, CheckCircle2, Circle, CheckSquare, User, Wrench, CalendarPlus } from 'lucide-react';
import type { Delivery } from '../../types'; import type { Delivery } from '../../types';
import { formatPickupLocation } from '../../types'; import { formatPickupLocation } from '../../types';
import { StatusBadge } from './StatusBadge'; import { StatusBadge } from './StatusBadge';
import { Card } from '../ui/Card'; import { Card } from '../ui/Card';
const CITY = 'kokshetau'; const CITY = 'kokshetau';
const createdAtFormatter = new Intl.DateTimeFormat('ru-RU', {
day: '2-digit',
month: '2-digit',
year: 'numeric',
});
const formatCreatedAt = (timestamp: number) => createdAtFormatter.format(new Date(timestamp));
interface DeliveryCardProps { interface DeliveryCardProps {
delivery: Delivery; delivery: Delivery;
@@ -26,8 +33,12 @@ export const DeliveryCard = memo(({ delivery, onStatusChange, onEdit, onDelete }
return ( return (
<Card className="relative"> <Card className="relative">
<div className="flex items-start justify-between mb-3"> <div className="flex items-start justify-between gap-3 mb-3">
<div className="flex items-center gap-2"> <div className="flex min-w-0 flex-col gap-2">
<div className="flex items-center gap-2 text-xs text-[#75777d]">
<CalendarPlus size={14} className="shrink-0" />
<span className="truncate">Создано {formatCreatedAt(delivery.createdAt)}</span>
</div>
<StatusBadge <StatusBadge
status={delivery.status} status={delivery.status}
onClick={() => onStatusChange(delivery.id)} onClick={() => onStatusChange(delivery.id)}