Sửa hiển thị điểm đầu và điểm cuối của chặng

ItineraryTimeline.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { format, differenceInMinutes, parseISO } from 'date-fns';
-import { CheckCircle2, Circle, Clock, MapPin, AlertCircle, Zap, Navigation, Edit2, Trash2, Plus } from 'lucide-react';
+import { CheckCircle2, Circle, Clock, MapPin, AlertCircle, Zap, Navigation, Edit2, Trash2, Plus, List } from 'lucide-react';
 import { useTourStore } from './useTourStore.js';
 
 const TimeVariance = ({ planned, actual }: { planned: string, actual: string | null }) => {
@@ -36,7 +36,7 @@ const formatTravelTime = (minutes: number) => {
 };
 
 export const ItineraryTimeline = () => {
-  const { currentTour, legs, optimizeRouting, userRole, activeLegId, setActiveLegId, addLeg, updateLeg, deleteLeg } = useTourStore();
+  const { currentTour, legs, optimizeRouting, userRole, activeLegId, setActiveLegId, addLeg, updateLeg, deleteLeg, initializeLegs } = useTourStore();
 
   const toggleComplete = async (locationId: string) => {
     // Gọi API PATCH /api/v1/locations/:id để cập nhật trạng thái
@@ -50,6 +50,14 @@ export const ItineraryTimeline = () => {
     }
   };
 
+  const handleDeclareLegs = async () => {
+    const countStr = window.prompt("Chuyến đi này bạn muốn chia làm bao nhiêu chặng?", "3");
+    const count = parseInt(countStr || "0");
+    if (count > 0 && currentTour) {
+      await initializeLegs(currentTour.id, count);
+    }
+  };
+
   const handleEditLeg = async (leg: any) => {
     const note = window.prompt("Sửa ghi chú chặng:", leg.note || "");
     if (note !== null) {
@@ -86,6 +94,15 @@ export const ItineraryTimeline = () => {
               Chặng {leg.sequence}
             </button>
           ))}
+          {['OWNER', 'MANAGER'].includes(userRole || '') && (
+            <button
+              onClick={handleDeclareLegs}
+              className="flex-shrink-0 px-4 py-2.5 rounded-2xl bg-blue-50 text-blue-600 border border-dashed border-blue-200 hover:bg-blue-100 transition-all flex items-center gap-2 text-xs font-bold"
+              title="Khai báo nhanh số lượng chặng"
+            >
+              <List className="w-4 h-4" /> Khai báo số chặng
+            </button>
+          )}
           {['OWNER', 'MANAGER'].includes(userRole || '') && (
             <button
               onClick={handleAddLeg}