This commit is contained in:
@@ -3,7 +3,8 @@
|
|||||||
import { useAuth } from "@/lib/auth-context";
|
import { useAuth } from "@/lib/auth-context";
|
||||||
import { DEPARTMENTS } from "@/lib/constants";
|
import { DEPARTMENTS } from "@/lib/constants";
|
||||||
import { useShift } from "@/lib/shift-context";
|
import { useShift } from "@/lib/shift-context";
|
||||||
import { useState } from "react";
|
import { useQuery } from "@tanstack/react-query";
|
||||||
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
import type { ShiftDetailModalProps } from "./ShiftSchedule.types";
|
import type { ShiftDetailModalProps } from "./ShiftSchedule.types";
|
||||||
|
|
||||||
@@ -82,6 +83,44 @@ export default function ShiftDetailModal({
|
|||||||
absent: "bg-red-100 text-red-700",
|
absent: "bg-red-100 text-red-700",
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const StaffName = ({ staffId }: { staffId: string }) => {
|
||||||
|
const [name, setName] = useState("");
|
||||||
|
const [loading, setLoading] = useState(true);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// Hàm gọi API
|
||||||
|
const getName = async () => {
|
||||||
|
try {
|
||||||
|
setLoading(true);
|
||||||
|
|
||||||
|
const response = await fetch(`/api/staff/${staffId}`);
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error("Mạng lỗi hoặc không tìm thấy nhân viên");
|
||||||
|
}
|
||||||
|
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
setName(data["name"]);
|
||||||
|
} catch (error) {
|
||||||
|
console.error("Lỗi khi lấy tên:", error);
|
||||||
|
setName("Lỗi tải tên");
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (staffId) {
|
||||||
|
getName();
|
||||||
|
}
|
||||||
|
}, [staffId]); // Chạy lại nếu staffId thay đổi
|
||||||
|
|
||||||
|
if (loading)
|
||||||
|
return <span className="animate-pulse text-gray-400">...</span>;
|
||||||
|
|
||||||
|
return <span>{name || "N/A"}</span>;
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
|
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
|
||||||
{/* Backdrop */}
|
{/* Backdrop */}
|
||||||
@@ -183,7 +222,7 @@ export default function ShiftDetailModal({
|
|||||||
<i className="fa-solid fa-user text-[10px] text-(--color-primary)"></i>
|
<i className="fa-solid fa-user text-[10px] text-(--color-primary)"></i>
|
||||||
</div>
|
</div>
|
||||||
<span className="text-foreground text-sm font-medium">
|
<span className="text-foreground text-sm font-medium">
|
||||||
{staff.staffId}
|
<StaffName staffId={staff.staffId} />
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
{isManager && (
|
{isManager && (
|
||||||
|
|||||||
+1
-1
@@ -20,7 +20,7 @@ const nextConfig: NextConfig = {
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
async rewrites() {
|
async rewrites() {
|
||||||
const gatewayUrl = "http://localhost:32080";
|
const gatewayUrl = "http://172.17.0.1:32080";
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
source: "/api/:path*",
|
source: "/api/:path*",
|
||||||
|
|||||||
Reference in New Issue
Block a user