version changed to 02.58

src/Pages/Tagging.tsx

@@ -11,6 +11,7 @@ import { useNavigate } from "@tanstack/react-router";
 import { TAGS } from "../routes/paths";
 import { DeleteButtonForPopOver } from "../components/PopOverButtons/PopOverButtons";
 import { TableButton } from "../components/TableButton/TableButton";
+import AutoComplete from "../components/AutoComplete/AutoComplete";
 
 const speciesMap: Record<number, string> = {
   1: "گاو",
@@ -24,12 +25,18 @@ export default function Tagging() {
   const { openModal } = useModalStore();
   const [tableInfo, setTableInfo] = useState({ page: 1, page_size: 10 });
   const [tagsTableData, setTagsTableData] = useState<any[]>([]);
+  const [selectedSpecie, setSelectedSpecie] = useState<
+    (string | number)[] | any
+  >([]);
+
   const navigate = useNavigate();
 
   const { data: tagsData, refetch } = useApiRequest({
-    api: "/tag/web/api/v1/tag_batch/",
+    api: `/tag/web/api/v1/tag_batch/?species_code=${
+      selectedSpecie.length ? selectedSpecie[0] : ""
+    }`,
     method: "get",
-    queryKey: ["tagsList", tableInfo],
+    queryKey: ["tagsList", tableInfo, selectedSpecie],
     params: { ...tableInfo },
   });
 
@@ -65,6 +72,8 @@ export default function Tagging() {
             : "نامشخص",
           item?.serial_from || "-",
           item?.serial_to || "-",
+          item?.total_distributed_tags || 0,
+          item?.total_remaining_tags || 0,
           <Popover key={item.id}>
             <Tooltip title="مشاهده پلاک ها" position="right">
               <Button
@@ -114,6 +123,22 @@ export default function Tagging() {
     }
   }, [tagsData, tableInfo.page, tableInfo.page_size, refetch]);
 
+  const { data: speciesData } = useApiRequest({
+    api: "/livestock/web/api/v1/livestock_species",
+    method: "get",
+    params: { page: 1, pageSize: 1000 },
+    queryKey: ["species"],
+  });
+
+  const speciesOptions = () => {
+    return speciesData?.results?.map((opt: any) => {
+      return {
+        key: opt?.value,
+        value: opt?.name,
+      };
+    });
+  };
+
   return (
     <Grid container column className="gap-4 mt-2 rtl">
       <Grid>
@@ -231,7 +256,18 @@ export default function Tagging() {
           ]}
         />
       </Grid>
-
+      <Grid container className="items-center gap-2">
+        <Grid>
+          {speciesOptions() && (
+            <AutoComplete
+              data={speciesOptions()}
+              selectedKeys={selectedSpecie}
+              onChange={setSelectedSpecie}
+              title="گونه"
+            />
+          )}
+        </Grid>
+      </Grid>
       <Table
         className="mt-2"
         onChange={setTableInfo}
@@ -244,6 +280,8 @@ export default function Tagging() {
           "گونه",
           "از بازه سریال",
           "تا بازه سریال",
+          "پلاک های توزیع شده",
+          "پلاک های باقیمانده",
           "عملیات",
         ]}
         rows={tagsTableData}

src/Pages/Tags.tsx

@@ -9,12 +9,22 @@ import { Tooltip } from "../components/Tooltip/Tooltip";
 import { DeleteButtonForPopOver } from "../components/PopOverButtons/PopOverButtons";
 import { TagDetails } from "../partials/tagging/TagDetails";
 import { useParams } from "@tanstack/react-router";
+import { TableButton } from "../components/TableButton/TableButton";
+
+const speciesMap: Record<number, string> = {
+  1: "گاو",
+  2: "گاومیش",
+  3: "شتر",
+  4: "گوسفند",
+  5: "بز",
+};
 
 export default function Tags() {
   const { openModal } = useModalStore();
   const [tableInfo, setTableInfo] = useState({ page: 1, page_size: 10 });
   const [tagsTableData, setTagsTableData] = useState([]);
   const { id, from, to } = useParams({ strict: false });
+
   const { data: tagsData, refetch } = useApiRequest({
     api: `/tag/web/api/v1/tag/${id ? id + "/tags_by_batch" : ""}`,
     method: "get",
@@ -25,7 +35,9 @@ export default function Tags() {
   });
 
   const { data: tagDashboardData } = useApiRequest({
-    api: "/tag/web/api/v1/tag/tag_dashboard/",
+    api: id
+      ? `/tag/web/api/v1/tag_batch/${id}/inner_dashboard`
+      : "/tag/web/api/v1/tag/tag_dashboard/",
     method: "get",
     queryKey: ["tagDashboard"],
   });
@@ -89,36 +101,140 @@ export default function Tags() {
 
   return (
     <Grid container column className="gap-4 mt-2">
-      <Grid isDashboard>
+      {tagDashboardData && (
-        <Table
+        <Grid isDashboard>
-          isDashboard
+          <Table
-          title="خلاصه اطلاعات"
+            isDashboard
-          noPagination
+            title="خلاصه اطلاعات"
-          noSearch
+            noPagination
-          columns={[
+            noSearch
-            "تعداد کل",
+            columns={
-            "تعداد پلاک های آزاد",
+              id
-            "تعداد پلاک شده",
+                ? [
-            "گاو",
+                    "تعداد پلاک",
-            "گاومیش",
+                    "پلاک های توزیع شده",
-            "شتر",
+                    "تعداد پلاک های گروه پلاک",
-            "گوسفند",
+                    "تعداد پلاک های توزیع شده",
-            "بز",
+                    "تعداد پلاک های باقیمانده",
-          ]}
+                    "آمار گونه ای",
-          rows={[
+                  ]
-            [
+                : [
-              tagDashboardData?.count?.toLocaleString() || 0,
+                    "تعداد کل",
-              tagDashboardData?.free_count?.toLocaleString() || 0,
+                    "تعداد پلاک های آزاد",
-              tagDashboardData?.assign_count?.toLocaleString() || 0,
+                    "تعداد پلاک شده",
-              tagDashboardData?.cow_count?.toLocaleString() || 0,
+                    "گاو",
-              tagDashboardData?.buffalo_count?.toLocaleString() || 0,
+                    "گاومیش",
-              tagDashboardData?.camel_count?.toLocaleString() || 0,
+                    "شتر",
-              tagDashboardData?.sheep_count?.toLocaleString() || 0,
+                    "گوسفند",
-              tagDashboardData?.goat_count?.toLocaleString() || 0,
+                    "بز",
-            ],
+                  ]
-          ]}
+            }
-        />
+            rows={
-      </Grid>
+              id
+                ? [
+                    [
+                      tagDashboardData?.batch_count?.toLocaleString() || 0,
+                      tagDashboardData?.has_distributed_batches_number?.toLocaleString() ||
+                        0,
+                      tagDashboardData?.tag_count_created_by_batch?.toLocaleString() ||
+                        0,
+                      tagDashboardData?.total_distributed_tags?.toLocaleString() ||
+                        0,
+                      tagDashboardData?.total_remaining_tags?.toLocaleString() ||
+                        0,
+                      <TableButton
+                        key="species-stats"
+                        size="small"
+                        onClick={() =>
+                          openModal({
+                            title: "آمار گونه‌ای",
+                            isFullSize: true,
+                            content: (
+                              <BatchBySpeciesModal
+                                batchData={
+                                  tagDashboardData?.batch_data_by_species || []
+                                }
+                                onRowAction={(row) => {
+                                  openModal({
+                                    title: `جزئیات ${
+                                      speciesMap[row?.species_code] ?? "-"
+                                    }`,
+                                    content: (
+                                      <div className="space-y-3">
+                                        <div className="flex items-center justify-between text-sm">
+                                          <span className="text-gray-600 dark:text-gray-300">
+                                            تعداد بچ
+                                          </span>
+                                          <span className="font-semibold text-gray-900 dark:text-gray-100">
+                                            {row?.batch_count?.toLocaleString?.() ??
+                                              0}
+                                          </span>
+                                        </div>
+                                        <div className="flex items-center justify-between text-sm">
+                                          <span className="text-gray-600 dark:text-gray-300">
+                                            پلاک تولید شده
+                                          </span>
+                                          <span className="font-semibold text-gray-900 dark:text-gray-100">
+                                            {row?.tag_count_created_by_batch?.toLocaleString?.() ??
+                                              0}
+                                          </span>
+                                        </div>
+                                        <div className="flex items-center justify-between text-sm">
+                                          <span className="text-gray-600 dark:text-gray-300">
+                                            پلاک توزیع شده
+                                          </span>
+                                          <span className="font-semibold text-gray-900 dark:text-gray-100">
+                                            {row?.total_distributed_tags?.toLocaleString?.() ??
+                                              0}
+                                          </span>
+                                        </div>
+                                        <div className="flex items-center justify-between text-sm">
+                                          <span className="text-gray-600 dark:text-gray-300">
+                                            پلاک باقی‌مانده
+                                          </span>
+                                          <span className="font-semibold text-gray-900 dark:text-gray-100">
+                                            {row?.total_remaining_tags?.toLocaleString?.() ??
+                                              0}
+                                          </span>
+                                        </div>
+                                        <div className="flex items-center justify-between text-sm">
+                                          <span className="text-gray-600 dark:text-gray-300">
+                                            بچ‌های توزیع‌شده
+                                          </span>
+                                          <span className="font-semibold text-gray-900 dark:text-gray-100">
+                                            {row?.has_distributed_batches_number?.toLocaleString?.() ??
+                                              0}
+                                          </span>
+                                        </div>
+                                      </div>
+                                    ),
+                                  });
+                                }}
+                              />
+                            ),
+                          })
+                        }
+                      >
+                        مشاهده
+                      </TableButton>,
+                    ],
+                  ]
+                : [
+                    [
+                      tagDashboardData?.count?.toLocaleString() || 0,
+                      tagDashboardData?.free_count?.toLocaleString() || 0,
+                      tagDashboardData?.assign_count?.toLocaleString() || 0,
+                      tagDashboardData?.cow_count?.toLocaleString() || 0,
+                      tagDashboardData?.buffalo_count?.toLocaleString() || 0,
+                      tagDashboardData?.camel_count?.toLocaleString() || 0,
+                      tagDashboardData?.sheep_count?.toLocaleString() || 0,
+                      tagDashboardData?.goat_count?.toLocaleString() || 0,
+                    ],
+                  ]
+            }
+          />
+        </Grid>
+      )}
 
       <Table
         className="mt-2"
@@ -140,3 +256,78 @@ export default function Tags() {
     </Grid>
   );
 }
+
+function BatchBySpeciesModal({
+  batchData = [],
+}: {
+  batchData: Array<any>;
+  onRowAction?: (row: any, index: number) => void;
+}) {
+  return (
+    <div className="w-full">
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
+        {batchData?.map((row, idx) => {
+          const speciesName = speciesMap[row?.species_code] ?? "-";
+          return (
+            <div
+              key={idx}
+              className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-xl shadow-sm p-4 flex flex-col"
+            >
+              <div className="flex items-center justify-between mb-3">
+                <div className="flex items-center gap-2">
+                  <div className="w-2 h-2 rounded-full bg-primary/70"></div>
+                  <span className="text-sm font-bold text-gray-900 dark:text-gray-100">
+                    {speciesName}
+                  </span>
+                </div>
+              </div>
+              <div className="space-y-2">
+                <div className="flex items-center justify-between text-sm">
+                  <span className="text-gray-600 dark:text-gray-300">
+                    تعداد گروه پلاک
+                  </span>
+                  <span className="font-semibold text-gray-900 dark:text-gray-100">
+                    {row?.batch_count?.toLocaleString?.() ?? 0}
+                  </span>
+                </div>
+                <div className="flex items-center justify-between text-sm">
+                  <span className="text-gray-600 dark:text-gray-300">
+                    گروه پلاک های توزیع‌شده
+                  </span>
+                  <span className="font-semibold text-gray-900 dark:text-gray-100">
+                    {row?.has_distributed_batches_number?.toLocaleString?.() ??
+                      0}
+                  </span>
+                </div>
+                <div className="flex items-center justify-between text-sm">
+                  <span className="text-gray-600 dark:text-gray-300">
+                    پلاک تولید شده
+                  </span>
+                  <span className="font-semibold text-gray-900 dark:text-gray-100">
+                    {row?.tag_count_created_by_batch?.toLocaleString?.() ?? 0}
+                  </span>
+                </div>
+                <div className="flex items-center justify-between text-sm">
+                  <span className="text-gray-600 dark:text-gray-300">
+                    پلاک توزیع شده
+                  </span>
+                  <span className="font-semibold text-gray-900 dark:text-gray-100">
+                    {row?.total_distributed_tags?.toLocaleString?.() ?? 0}
+                  </span>
+                </div>
+                <div className="flex items-center justify-between text-sm">
+                  <span className="text-gray-600 dark:text-gray-300">
+                    پلاک باقی‌مانده
+                  </span>
+                  <span className="font-semibold text-gray-900 dark:text-gray-100">
+                    {row?.total_remaining_tags?.toLocaleString?.() ?? 0}
+                  </span>
+                </div>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}

src/partials/tagging/SubmitTagDistribution.tsx

@@ -243,7 +243,11 @@ export const SubmitTagDistribution = ({ item, getData }: any) => {
             formattedNumber
             placeholder={
               distributionType === "group"
-                ? `تعداد (${batch.label})`
+                ? `تعداد ${
+                    speciesOptions().find(
+                      (s: any) => s.key === batch.species_code
+                    )?.value
+                  } (${batch.label}) `
                 : `تعداد ${
                     speciesOptions().find(
                       (s: any) => s.key === batch.species_code

src/partials/tagging/TagActiveDistributions.tsx

@@ -63,9 +63,11 @@ export default function TagActiveDistributions() {
             ? index + 1
             : index + tableInfo.page_size * (tableInfo.page - 1) + 1,
           item?.dist_batch_identity,
-          `${formatJustDate(item?.create_date)} (${formatJustTime(
+          `${formatJustDate(item?.create_date)} (${
-            item?.create_date
+            formatJustDate(item?.create_date)
-          )})`,
+              ? formatJustTime(item?.create_date)
+              : "-"
+          })`,
           item?.assigner_org?.name,
           item?.assigned_org?.name,
           item?.total_tag_count,

src/partials/tagging/TagCanceledDistributions.tsx

@@ -63,9 +63,11 @@ export default function TagCanceledDistributions() {
             ? index + 1
             : index + tableInfo.page_size * (tableInfo.page - 1) + 1,
           item?.dist_batch_identity,
-          `${formatJustDate(item?.create_date)} (${formatJustTime(
+          `${formatJustDate(item?.create_date)} (${
-            item?.create_date
+            formatJustDate(item?.create_date)
-          )})`,
+              ? formatJustTime(item?.create_date)
+              : "-"
+          })`,
           item?.assigner_org?.name,
           item?.assigned_org?.name,
           item?.total_tag_count,

src/utils/formatTime.ts

@@ -35,7 +35,9 @@ export const formatJustDate = (time: any) => {
 };
 
 export const formatJustTime = (time: any) => {
-  return format(new Date(time), "HH:mm");
+  if (time) {
+    return format(new Date(time), "HH:mm");
+  } else return "";
 };
 
 export function formatStampDate(timestamp: number) {

src/version.txt

@@ -1 +1 @@
-02.57
+02.58