From f4a3c12d994bfb256df95f92124305d4f7644af6 Mon Sep 17 00:00:00 2001
From: "kelvin.yau" <kelvin.yau@2fi-solutions.com.hk>
Date: Tue, 3 Mar 2026 18:08:19 +0800
Subject: [PATCH] title updates

---
 .../GoodsReceiptStatusNew.tsx                 |  5 ++++
 .../truckSchedule/TruckScheduleDashboard.tsx  |  7 ++++-
 .../FGPickOrderTicketReleaseTable.tsx         |  2 +-
 .../Jodetail/MaterialPickStatusTable.tsx      | 12 ++++----
 .../EquipmentStatusDashboard.tsx              |  2 +-
 .../ProductionProcess/JobProcessStatus.tsx    | 30 ++++++++++---------
 .../OperatorKpiDashboard.tsx                  | 13 ++++----
 7 files changed, 44 insertions(+), 27 deletions(-)

diff --git a/src/components/DashboardPage/goodsReceiptStatus/GoodsReceiptStatusNew.tsx b/src/components/DashboardPage/goodsReceiptStatus/GoodsReceiptStatusNew.tsx
index e763a8c..6b6cdae 100644
--- a/src/components/DashboardPage/goodsReceiptStatus/GoodsReceiptStatusNew.tsx
+++ b/src/components/DashboardPage/goodsReceiptStatus/GoodsReceiptStatusNew.tsx
@@ -155,6 +155,11 @@ const GoodsReceiptStatusNew: React.FC = () => {
   return (
     <Card sx={{ mb: 2 }}>
       <CardContent>
+        {/* Title */}
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
+          {t("Goods Receipt Status New")}
+        </Typography>
+
         {/* Header */}
         <Stack direction="row" spacing={2} sx={{ mb: 2 }} alignItems="center" flexWrap="wrap">
           <Stack direction="row" spacing={1} alignItems="center">
diff --git a/src/components/DashboardPage/truckSchedule/TruckScheduleDashboard.tsx b/src/components/DashboardPage/truckSchedule/TruckScheduleDashboard.tsx
index 1588085..2c963dd 100644
--- a/src/components/DashboardPage/truckSchedule/TruckScheduleDashboard.tsx
+++ b/src/components/DashboardPage/truckSchedule/TruckScheduleDashboard.tsx
@@ -442,6 +442,11 @@ const TruckScheduleDashboard: React.FC = () => {
   return (
     <Card sx={{ mb: 2 }}>
       <CardContent>
+        {/* Title */}
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
+          {t("Truck Schedule Dashboard")}
+        </Typography>
+
         {/* Filter */}
         <Stack direction="row" spacing={2} sx={{ mb: 3 }}>
           <FormControl sx={{ minWidth: 150 }} size="small">
@@ -499,9 +504,9 @@ const TruckScheduleDashboard: React.FC = () => {
                     <TableCell sx={{ fontWeight: 600 }}>{t("Truck Schedule")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }}>{t("Time Remaining")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }} align="center">{t("No. of Shops")}</TableCell>
-                    <TableCell sx={{ fontWeight: 600 }} align="center">{t("Total Items")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }} align="center">{t("Tickets Released")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }} align="center">{t("Tickets Completed")}</TableCell>
+                    <TableCell sx={{ fontWeight: 600 }} align="center">{t("Total Items")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }}>{t("First Ticket Start")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }}>{t("Last Ticket End")}</TableCell>
                     <TableCell sx={{ fontWeight: 600 }} align="center">{t("Pick Time (min)")}</TableCell>
diff --git a/src/components/FinishedGoodSearch/FGPickOrderTicketReleaseTable.tsx b/src/components/FinishedGoodSearch/FGPickOrderTicketReleaseTable.tsx
index df6e0b3..3ce432b 100644
--- a/src/components/FinishedGoodSearch/FGPickOrderTicketReleaseTable.tsx
+++ b/src/components/FinishedGoodSearch/FGPickOrderTicketReleaseTable.tsx
@@ -145,7 +145,7 @@ const FGPickOrderTicketReleaseTable: React.FC = () => {
     <Card sx={{ mb: 2 }}>
       <CardContent>
         {/* Title */}
-        <Typography variant="h5" sx={{ mb: 3, fontWeight: 600 }}>
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
           {t("Ticket Release Table")}
         </Typography>
 
diff --git a/src/components/Jodetail/MaterialPickStatusTable.tsx b/src/components/Jodetail/MaterialPickStatusTable.tsx
index a445100..decce55 100644
--- a/src/components/Jodetail/MaterialPickStatusTable.tsx
+++ b/src/components/Jodetail/MaterialPickStatusTable.tsx
@@ -18,6 +18,7 @@ import {
   FormControl,
   Select,
   MenuItem,
+  Stack
 } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import dayjs from 'dayjs';
@@ -228,11 +229,12 @@ const MaterialPickStatusTable: React.FC = () => {
     <Card sx={{ mb: 2 }}>
       <CardContent>
         {/* Title */}
-        <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 3 }}>
-          <Typography variant="h5" sx={{ fontWeight: 600 }}>
-            {t("Material Pick Status")}
-          </Typography>
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
+          {t("Material Pick Status")}
+        </Typography>
 
+        {/* Filters */}
+        <Stack direction="row" spacing={2} sx={{ mb: 3 }}>
           <FormControl size="small" sx={{ minWidth: 160 }}>
             <Select
               value={selectedDate}
@@ -243,7 +245,7 @@ const MaterialPickStatusTable: React.FC = () => {
               <MenuItem value={dayjs().subtract(2, "day").format("YYYY-MM-DD")}>{t("Two Days Ago")}</MenuItem>
             </Select>
           </FormControl>
-        </Box>
+        </Stack>
 
         <Box sx={{ mt: 2 }}>
           {loading ? (
diff --git a/src/components/ProductionProcess/EquipmentStatusDashboard.tsx b/src/components/ProductionProcess/EquipmentStatusDashboard.tsx
index 473c200..18d9de5 100644
--- a/src/components/ProductionProcess/EquipmentStatusDashboard.tsx
+++ b/src/components/ProductionProcess/EquipmentStatusDashboard.tsx
@@ -175,7 +175,7 @@ const EquipmentStatusDashboard: React.FC = () => {
   return (
     <Box>
       <Box sx={{ display: "flex", justifyContent: "space-between", alignItems: "center", mb: 2 }}>
-        <Typography variant="h5" sx={{ fontWeight: 600 }}>
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
           {t("Production Equipment Status Dashboard")}
         </Typography>
       </Box>
diff --git a/src/components/ProductionProcess/JobProcessStatus.tsx b/src/components/ProductionProcess/JobProcessStatus.tsx
index 4fb3244..3dfdd35 100644
--- a/src/components/ProductionProcess/JobProcessStatus.tsx
+++ b/src/components/ProductionProcess/JobProcessStatus.tsx
@@ -15,6 +15,7 @@ import {
   TableRow,
   Paper,
   CircularProgress,
+  Stack
 } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import dayjs from 'dayjs';
@@ -171,23 +172,24 @@ const JobProcessStatus: React.FC = () => {
   return (
     <Card sx={{ mb: 2 }}>
       <CardContent>
-      <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 3 }}>
-        <Typography variant="h5" sx={{ fontWeight: 600 }}>
+      {/* Title */}
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
           {t("Job Process Status Dashboard")}
         </Typography>
 
-        <FormControl size="small" sx={{ minWidth: 160 }}>
-          <Select
-            value={selectedDate}
-            onChange={(e) => setSelectedDate(e.target.value)}
-          >
-            <MenuItem value={dayjs().format("YYYY-MM-DD")}>今天</MenuItem>
-            <MenuItem value={dayjs().subtract(1, "day").format("YYYY-MM-DD")}>昨天</MenuItem>
-            <MenuItem value={dayjs().subtract(2, "day").format("YYYY-MM-DD")}>前天</MenuItem>
-          </Select>
-        </FormControl>
-      </Box>
-
+        {/* Filters */}
+        <Stack direction="row" spacing={2} sx={{ mb: 3 }}>
+          <FormControl size="small" sx={{ minWidth: 160 }}>
+            <Select
+              value={selectedDate}
+              onChange={(e) => setSelectedDate(e.target.value)}
+            >
+              <MenuItem value={dayjs().format("YYYY-MM-DD")}>今天</MenuItem>
+              <MenuItem value={dayjs().subtract(1, "day").format("YYYY-MM-DD")}>昨天</MenuItem>
+              <MenuItem value={dayjs().subtract(2, "day").format("YYYY-MM-DD")}>前天</MenuItem>
+            </Select>
+          </FormControl>
+        </Stack>
         <Box sx={{ mt: 2 }}>
           {loading ? (
             <Box sx={{ display: 'flex', justifyContent: 'center', p: 3 }}>
diff --git a/src/components/ProductionProcess/OperatorKpiDashboard.tsx b/src/components/ProductionProcess/OperatorKpiDashboard.tsx
index e9b3769..5ee42c1 100644
--- a/src/components/ProductionProcess/OperatorKpiDashboard.tsx
+++ b/src/components/ProductionProcess/OperatorKpiDashboard.tsx
@@ -17,6 +17,7 @@ import {
   FormControl,
   Select,
   MenuItem,
+  Stack
 } from "@mui/material";
 import { useTranslation } from "react-i18next";
 import dayjs from "dayjs";
@@ -149,11 +150,13 @@ const OperatorKpiDashboard: React.FC = () => {
   return (
     <Card sx={{ mb: 2 }}>
       <CardContent>
-        <Box sx={{ display: "flex", justifyContent: "space-between", alignItems: "center", mb: 3 }}>
-          <Typography variant="h5" sx={{ fontWeight: 600 }}>
-            {t("Operator KPI Dashboard")}
-          </Typography>
+         {/* Title */}
+        <Typography variant="h5" sx={{ fontWeight: 600, mb: 2 }}>
+          {t("Operator KPI Dashboard")}
+        </Typography>
 
+        {/* Filters */}
+        <Stack direction="row" spacing={2} sx={{ mb: 3 }}>
           <FormControl size="small" sx={{ minWidth: 160 }}>
             <Select
               value={selectedDate}
@@ -164,7 +167,7 @@ const OperatorKpiDashboard: React.FC = () => {
               <MenuItem value={dayjs().subtract(2, "day").format("YYYY-MM-DD")}>{t("Two Days Ago")}</MenuItem>
             </Select>
           </FormControl>
-        </Box>
+        </Stack>
 
         {loading ? (
           <Box sx={{ display: "flex", justifyContent: "center", p: 3 }}>