40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
"use client";
|
|
import React, { useState } from "react";
|
|
import RegisterFaceCount from "./registerFaceCount/RegisterFaceCount";
|
|
import HeadCount from "./headCount/HeadCount";
|
|
|
|
const RealtimeCount: React.FC = () => {
|
|
const [activeTab, setActiveTab] = useState<
|
|
"register-face-count" | "get-face-count"
|
|
>("register-face-count");
|
|
|
|
return (
|
|
<div className="main-container">
|
|
<div className="tabs">
|
|
<button
|
|
className={`tab-button ${
|
|
activeTab === "register-face-count" ? "active" : ""
|
|
}`}
|
|
onClick={() => setActiveTab("register-face-count")}
|
|
>
|
|
Register Face Count
|
|
</button>
|
|
<button
|
|
className={`tab-button ${
|
|
activeTab === "get-face-count" ? "active" : ""
|
|
}`}
|
|
onClick={() => setActiveTab("get-face-count")}
|
|
>
|
|
Get Face Count
|
|
</button>
|
|
</div>
|
|
<div className="tab-content">
|
|
{activeTab === "register-face-count" && <RegisterFaceCount />}
|
|
{activeTab === "get-face-count" && <HeadCount />}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default RealtimeCount;
|