update dashboard

src/app/api/clientprojects/actions.ts

@@ -21,6 +21,21 @@ export interface ClientSubsidiaryProjectResult {
   comingPaymentMilestone: string;
 }
 
+export interface ClientProjectResult {
+  id: number;
+  customerId: number;
+  customerCode: string;
+  customerName: string;
+  subsidiaryId: number;
+  subsidiaryCode: string;
+  subsidiaryName: string;
+  projectNo: number;
+}
+
+export const fetchAllClientProjects = cache(async () => {
+  return serverFetchJson<ClientProjectResult[]>(`${BASE_API_URL}/dashboard/searchCustomerSubsidiary`);
+});
+
 export const fetchAllClientSubsidiaryProjects = cache(async (customerId: number, tableSorting:string, subsidiaryId?: number) => {
   if (subsidiaryId === 0){
     return serverFetchJson<ClientSubsidiaryProjectResult[]>(

src/components/ProgressByClient/ProgressByClient.tsx

@@ -22,7 +22,7 @@ import { ConstructionOutlined } from "@mui/icons-material";
 import ReactApexChart from "react-apexcharts";
 import { ApexOptions } from "apexcharts";
 import { useSearchParams } from 'next/navigation';
-import { fetchAllClientSubsidiaryProjects} from "@/app/api/clientprojects/actions";
+import { fetchAllClientSubsidiaryProjects,fetchAllClientProjects} from "@/app/api/clientprojects/actions";
 // const ReactApexChart = dynamic(() => import('react-apexcharts'), { ssr: false });
 
 type SearchProjectQuery = Partial<Omit<ClientSubsidiaryProjectResult, "id">>;
@@ -94,8 +94,15 @@ const ProgressByClient: React.FC<Props> = () => {
   "#d1fef0", "#04afff", "#ff859e", "#4bdd15", "#ccfb2b"];
   const [clientSubsidiaryProjectResult, setClientSubsidiaryProjectResult]:any[] = useState([]);
   const [tableSorting, setTableSorting] = useState('ProjectName');
+  const [customerNameAndCode,setCustomerNameAndCode] = useState("");
 
   const fetchData = async () => {
+    const clientprojects = await fetchAllClientProjects();
+    for (let i = 0; i < clientprojects.length; i++) {
+      if (customerId != null && clientprojects[i].customerId == parseInt(customerId)){
+        setCustomerNameAndCode(t("Selected Client") + ": " + clientprojects[i].customerName + " (" + clientprojects[i].customerCode + ")")
+      }
+    }
     if (customerId && subsidiaryId) {
       try {
         if (subsidiaryId === '-'){
@@ -112,6 +119,7 @@ const ProgressByClient: React.FC<Props> = () => {
             Number(subsidiaryId))
             console.log(clickResult)
           setClientSubsidiaryProjectResult(clickResult);
+          setFilteredClientSubsidiaryProjectResult(clickResult);
         }
         
         
@@ -123,6 +131,7 @@ const ProgressByClient: React.FC<Props> = () => {
         const clickResult = await fetchAllClientSubsidiaryProjects(
           Number(customerId),tableSorting)
         setClientSubsidiaryProjectResult(clickResult);
+        setFilteredClientSubsidiaryProjectResult(clickResult);
       } catch (error) {
         console.error('Error fetching client subsidiary projects:', error);
       }
@@ -594,6 +603,15 @@ const ProgressByClient: React.FC<Props> = () => {
     <Grid item sm>
       {/* <CustomSearchForm applySearch={applySearch} fields={InputFields}/> */}
       {/* <CustomDatagrid rows={rows} columns={columns} columnWidth={200} dataGridHeight={300}/> */}
+      {customerNameAndCode !== "" && (
+        <div style={{ display: "inline-block", width: "99%" }}>
+          <Grid item xs={12} md={12} lg={12}>
+              <Card>
+              <CardHeader className="text-slate-700" title= {customerNameAndCode} />
+              </Card>
+          </Grid>
+        </div>
+      )}
       <div style={{ display: "inline-block", width: "70%" }}>
         <Grid item xs={12} md={12} lg={12}>
           <Card>

src/components/ProgressByClientSearch/ProgressByClientSearch.tsx

@@ -11,6 +11,7 @@ import VisibilityIcon from '@mui/icons-material/Visibility';
 import { useRouter, useSearchParams } from "next/navigation";
 import ProgressByClient from "@/components/ProgressByClient";
 import Typography from "@mui/material/Typography";
+import { Card, CardHeader } from "@mui/material";
 
 interface Props {
   clientProjects: ClientProjectResult[];
@@ -43,6 +44,7 @@ const ProgressByClientSearch: React.FC<Props> = ({ clientProjects }) => {
 
   const onTaskClick = useCallback(async (clientProjectResult: ClientProjectResult) => {
     try {
+      // setCustomerNameAndCode(clientProjectResult.)
       router.push(
         `/dashboard/ProjectStatusByClient?customerId=${clientProjectResult.customerId}&subsidiaryId=${clientProjectResult.subsidiaryId}`
       );

src/components/ProgressByTeam/ProgressByTeam.tsx

@@ -19,7 +19,7 @@ import SearchBox, { Criterion } from "../SearchBox";
 import ProgressByTeamSearch from "@/components/ProgressByTeamSearch";
 import { Suspense } from "react";
 import { useSearchParams } from 'next/navigation';
-import { fetchAllTeamProjects,ClientSubsidiaryProjectResult} from "@/app/api/teamprojects/actions";
+import { fetchAllTeamProjects, fetchTeamProjects, ClientSubsidiaryProjectResult} from "@/app/api/teamprojects/actions";
 // const ReactApexChart = dynamic(() => import('react-apexcharts'), { ssr: false });
 
 type SearchProjectQuery = Partial<Omit<ClientSubsidiaryProjectResult, "id">>;
@@ -92,6 +92,7 @@ const ProgressByTeam: React.FC = () => {
   const [currentPage, setCurrentPage] = useState(1);
   const recordsPerPage = 10;
   const [tableSorting, setTableSorting] = useState('ProjectName');
+  const [teamNameAndCode,setTeamNameAndCode] = useState("");
 
   const projectSearchCriteria: Criterion<SearchProjectParamNames>[] = useMemo(
     () => [
@@ -102,7 +103,12 @@ const ProgressByTeam: React.FC = () => {
   );
 
   const fetchData = async () => {
-    console.log(tableSorting)
+    const teamprojects = await fetchTeamProjects();
+    for (let i = 0; i < teamprojects.length; i++) {
+      if (teamLeadId != null && teamprojects[i].teamLeadId == parseInt(teamLeadId)){
+        setTeamNameAndCode(t("Selected Team") + ": " + teamprojects[i].teamName + " (" + teamprojects[i].teamCode + ")")
+      }
+    }
     if (teamLeadId) {
       try {
         const clickResult = await fetchAllTeamProjects(
@@ -672,6 +678,15 @@ const ProgressByTeam: React.FC = () => {
     <Grid item sm>
       {/* <CustomSearchForm applySearch={applySearch} fields={InputFields}/> */}
       {/* <CustomDatagrid rows={rows} columns={columns} columnWidth={200} dataGridHeight={300}/> */}
+      {teamNameAndCode !== "" && (
+        <div style={{ display: "inline-block", width: "99%" }}>
+          <Grid item xs={12} md={12} lg={12}>
+              <Card>
+              <CardHeader className="text-slate-700" title= {teamNameAndCode} />
+              </Card>
+          </Grid>
+        </div>
+      )}
       <div style={{ display: "inline-block", width: "70%" }}>
         <Grid item xs={12} md={12} lg={12}>
           <Card>

src/components/ProjectFinancialSummary/ProjectFinancialCard.tsx

@@ -229,7 +229,7 @@ const ProjectFinancialCard: React.FC<Props> = ({
       {Number(CostPerformanceIndex) >= 1 && (
         <>
           <div
-            className="text-lg font-medium ml-5 mb-2"
+            className="text-lg font-medium mx-5 mb-2"
             style={dataPositiveStyle}
           >
             {CostPerformanceIndex}

src/i18n/en/dashboard.json

@@ -156,5 +156,7 @@
     "Task Count": "Task Count",
     "Total": "Total",
     "Status": "Status",
-    "Check Project Status": "Check Project Status"
+    "Check Project Status": "Check Project Status",
+    "Selected Client": "Selected Client",
+    "Selected Team": "Selected Team"
 }

src/i18n/zh/dashboard.json

@@ -157,5 +157,7 @@
     "Task Count": "工作數量",
     "Total": "總計",
     "Status": "狀態",
-    "Check Project Status": "查看項目狀態"
+    "Check Project Status": "查看項目狀態",
+    "Selected Client": "已選擇客戶",
+    "Selected Team": "已選擇團隊"
 }