version changed to 02.64

src/Pages/TagDistributionDetails.tsx

@@ -1,12 +1,22 @@
-import { useEffect, useState } from "react";
 import { useParams } from "@tanstack/react-router";
+import { Bars3Icon, CubeIcon, SparklesIcon } from "@heroicons/react/24/outline";
 import { useApiRequest } from "../utils/useApiRequest";
+import { formatJustDate, formatJustTime } from "../utils/formatTime";
+import ShowMoreInfo from "../components/ShowMoreInfo/ShowMoreInfo";
 import { Grid } from "../components/Grid/Grid";
+import Typography from "../components/Typography/Typography";
 import Table from "../components/Table/Table";
 
+const speciesMap: Record<number, string> = {
+  1: "گاو",
+  2: "گاومیش",
+  3: "شتر",
+  4: "گوسفند",
+  5: "بز",
+};
+
 export default function TagDistribtutionDetails() {
   const { id } = useParams({ strict: false });
-  const [tableData, setTableData] = useState([]);
 
   const { data } = useApiRequest({
     api: `/tag/web/api/v1/tag_distribution_batch/${id}/`,
@@ -15,42 +25,126 @@ export default function TagDistribtutionDetails() {
     enabled: !!id,
   });
 
-  useEffect(() => {
-    if (data?.distributions) {
-      const rows = data.distributions.map((item: any, index: number) => [
-        index + 1,
-        item?.dist_identity,
-        item?.batch_identity,
-        item?.distribution_type === "batch" ? "توزیع گروهی" : "توزیع تصادفی",
-        item?.species_code,
-        item?.total_tag_count,
-        item?.distributed_number,
-        item?.remaining_number,
-        `از ${item?.serial_from} تا ${item?.serial_to}`,
-      ]);
-      setTableData(rows);
-    }
-  }, [data]);
+  const dist = data?.distributions;
 
   return (
-    <Grid container column className="gap-4">
-      <Table
-        title="جزئیات توزیع پلاک"
-        noSearch
-        noPagination
-        columns={[
-          "ردیف",
-          "شناسه توزیع",
-          "شناسه پلاک",
-          "نوع توزیع",
-          "کد گونه",
-          "تعداد کل پلاک ها",
-          "تعداد توزیع شده",
-          "تعداد باقیمانده",
-          "بازه سریال",
-        ]}
-        rows={tableData}
-      />
+    <Grid container column className="gap-4 mt-2">
+      <Grid isDashboard>
+        <Table
+          isDashboard
+          title="مشخصات توزیع پلاک"
+          noSearch
+          noPagination
+          columns={[
+            "شناسه توزیع",
+            "تاریخ ثبت",
+            "توزیع کننده",
+            "دریافت کننده",
+            "تعداد کل پلاک",
+            "پلاک های توزیع شده",
+            "پلاک های باقیمانده",
+            "نوع توزیع",
+            "جزئیات توزیع",
+          ]}
+          rows={[
+            [
+              data?.dist_batch_identity ?? "-",
+              `${formatJustDate(data?.create_date) ?? "-"} (${
+                formatJustDate(data?.create_date)
+                  ? (formatJustTime(data?.create_date) ?? "-")
+                  : "-"
+              })`,
+              data?.assigner_org?.name ?? "-",
+              data?.assigned_org?.name ?? "-",
+              data?.total_tag_count?.toLocaleString() ?? "-",
+              data?.total_distributed_tag_count?.toLocaleString() ?? "-",
+              data?.remaining_tag_count?.toLocaleString() ?? "-",
+              data?.distribution_type === "batch"
+                ? "توزیع گروهی"
+                : "توزیع تصادفی",
+              <ShowMoreInfo key={data?.id} title="جزئیات توزیع">
+                <Grid container column className="gap-4 w-full">
+                  {dist?.map((opt: any, index: number) => (
+                    <Grid
+                      key={index}
+                      container
+                      column
+                      className="gap-3 w-full rounded-xl border border-gray-200 dark:border-gray-700 p-4"
+                    >
+                      <Grid container className="gap-2 items-center">
+                        <SparklesIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                        <Typography variant="body2" className="font-medium">
+                          گونه:
+                        </Typography>
+                        <Typography
+                          variant="body2"
+                          className="text-gray-700 dark:text-gray-300"
+                        >
+                          {speciesMap[opt?.species_code] ?? "-"}
+                        </Typography>
+                      </Grid>
+
+                      {data?.distribution_type === "batch" &&
+                        opt?.serial_from != null && (
+                          <Grid container className="gap-2 items-center">
+                            <Bars3Icon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                            <Typography variant="body2" className="font-medium">
+                              بازه سریال:
+                            </Typography>
+                            <Typography
+                              variant="body2"
+                              className="text-gray-600 dark:text-gray-400"
+                            >
+                              از {opt?.serial_from ?? "-"} تا{" "}
+                              {opt?.serial_to ?? "-"}
+                            </Typography>
+                          </Grid>
+                        )}
+
+                      <Grid container className="gap-2 items-center">
+                        <CubeIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                        <Typography variant="body2" className="font-medium">
+                          تعداد پلاک:
+                        </Typography>
+                        <Typography
+                          variant="body2"
+                          className="text-gray-700 dark:text-gray-300"
+                        >
+                          {opt?.total_tag_count?.toLocaleString() ?? "-"}
+                        </Typography>
+                      </Grid>
+                      <Grid container className="gap-2 items-center">
+                        <CubeIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                        <Typography variant="body2" className="font-medium">
+                          پلاک های توزیع شده:
+                        </Typography>
+                        <Typography
+                          variant="body2"
+                          className="text-gray-700 dark:text-gray-300"
+                        >
+                          {opt?.distributed_number?.toLocaleString() ?? "-"}
+                        </Typography>
+                      </Grid>
+                      <Grid container className="gap-2 items-center">
+                        <CubeIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                        <Typography variant="body2" className="font-medium">
+                          پلاک های باقیمانده:
+                        </Typography>
+                        <Typography
+                          variant="body2"
+                          className="text-gray-700 dark:text-gray-300"
+                        >
+                          {opt?.remaining_number?.toLocaleString() ?? "-"}
+                        </Typography>
+                      </Grid>
+                    </Grid>
+                  ))}
+                </Grid>
+              </ShowMoreInfo>,
+            ],
+          ]}
+        />
+      </Grid>
     </Grid>
   );
 }

src/partials/tagging/DistributeFromDistribution.tsx

@@ -81,8 +81,7 @@ export const DistributeFromDistribution = ({ item, getData }: any) => {
     }
 
     const parentDists: ParentDistItem[] = sourceDistributions.map((d: any) => {
-      const maxCount =
-        d?.remaining_number ?? d?.total_tag_count ?? d?.distributed_number ?? 0;
+      const maxCount = d?.remaining_number || 0;
       return {
         id: d?.id ?? d?.dist_identity,
         dist_identity: d?.dist_identity,
@@ -247,7 +246,7 @@ export const DistributeFromDistribution = ({ item, getData }: any) => {
         )}
 
         <Button disabled={!hasValidDists} type="submit">
-          توزیع از توزیع
+          ثبت
         </Button>
       </Grid>
     </form>

src/partials/tagging/TagActiveDistributions.tsx

@@ -75,6 +75,8 @@ export default function TagActiveDistributions() {
           item?.assigner_org?.name,
           item?.assigned_org?.name,
           item?.total_tag_count,
+          item?.total_distributed_tag_count,
+          item?.remaining_tag_count,
           item?.distribution_type === "batch" ? "توزیع گروهی" : "توزیع تصادفی",
           <ShowMoreInfo key={item?.id} title="جزئیات توزیع">
             <Grid container column className="gap-4 w-full">
@@ -85,6 +87,19 @@ export default function TagActiveDistributions() {
                   column
                   className="gap-3 w-full rounded-xl border border-gray-200 dark:border-gray-700 p-4"
                 >
+                  <Grid container className="gap-2 items-center">
+                    <SparklesIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                    <Typography variant="body2" className="font-medium">
+                      گونه:
+                    </Typography>
+                    <Typography
+                      variant="body2"
+                      className="text-gray-700 dark:text-gray-300"
+                    >
+                      {speciesMap[opt?.species_code] ?? "-"}
+                    </Typography>
+                  </Grid>
+
                   {item?.distribution_type === "batch" && opt?.serial_from && (
                     <Grid container className="gap-2 items-center">
                       <Bars3Icon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
@@ -112,17 +127,28 @@ export default function TagActiveDistributions() {
                       {opt?.total_tag_count?.toLocaleString()}
                     </Typography>
                   </Grid>
-
                   <Grid container className="gap-2 items-center">
-                    <SparklesIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                    <CubeIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
                     <Typography variant="body2" className="font-medium">
-                      گونه:
+                      پلاک های توزیع شده:
                     </Typography>
                     <Typography
                       variant="body2"
                       className="text-gray-700 dark:text-gray-300"
                     >
-                      {speciesMap[opt?.species_code] ?? "-"}
+                      {opt?.distributed_number?.toLocaleString()}
+                    </Typography>
+                  </Grid>
+                  <Grid container className="gap-2 items-center">
+                    <CubeIcon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
+                    <Typography variant="body2" className="font-medium">
+                      پلاک های باقیمانده:
+                    </Typography>
+                    <Typography
+                      variant="body2"
+                      className="text-gray-700 dark:text-gray-300"
+                    >
+                      {opt?.remaining_number?.toLocaleString()}
                     </Typography>
                   </Grid>
                 </Grid>
@@ -291,6 +317,8 @@ export default function TagActiveDistributions() {
           "توزیع کننده",
           "دریافت کننده",
           "تعداد کل پلاک",
+          "پلاک های توزیع شده",
+          "پلاک های باقیمانده",
           "نوع توزیع",
           "جزئیات توزیع",
           "عملیات",

src/version.txt

@@ -1 +1 @@
-02.63
+02.64