Compare commits
4 Commits
3a17fcb448
...
f8d2da4f28
| Author | SHA1 | Date | |
|---|---|---|---|
| f8d2da4f28 | |||
| bb1d5b3315 | |||
| d8d415a8f5 | |||
| f58c8e6c58 |
@@ -1,12 +1,22 @@
|
|||||||
import { useEffect, useState } from "react";
|
|
||||||
import { useParams } from "@tanstack/react-router";
|
import { useParams } from "@tanstack/react-router";
|
||||||
|
import { Bars3Icon, CubeIcon, SparklesIcon } from "@heroicons/react/24/outline";
|
||||||
import { useApiRequest } from "../utils/useApiRequest";
|
import { useApiRequest } from "../utils/useApiRequest";
|
||||||
|
import { formatJustDate, formatJustTime } from "../utils/formatTime";
|
||||||
|
import ShowMoreInfo from "../components/ShowMoreInfo/ShowMoreInfo";
|
||||||
import { Grid } from "../components/Grid/Grid";
|
import { Grid } from "../components/Grid/Grid";
|
||||||
|
import Typography from "../components/Typography/Typography";
|
||||||
import Table from "../components/Table/Table";
|
import Table from "../components/Table/Table";
|
||||||
|
|
||||||
|
const speciesMap: Record<number, string> = {
|
||||||
|
1: "گاو",
|
||||||
|
2: "گاومیش",
|
||||||
|
3: "شتر",
|
||||||
|
4: "گوسفند",
|
||||||
|
5: "بز",
|
||||||
|
};
|
||||||
|
|
||||||
export default function TagDistribtutionDetails() {
|
export default function TagDistribtutionDetails() {
|
||||||
const { id } = useParams({ strict: false });
|
const { id } = useParams({ strict: false });
|
||||||
const [tableData, setTableData] = useState([]);
|
|
||||||
|
|
||||||
const { data } = useApiRequest({
|
const { data } = useApiRequest({
|
||||||
api: `/tag/web/api/v1/tag_distribution_batch/${id}/`,
|
api: `/tag/web/api/v1/tag_distribution_batch/${id}/`,
|
||||||
@@ -15,42 +25,126 @@ export default function TagDistribtutionDetails() {
|
|||||||
enabled: !!id,
|
enabled: !!id,
|
||||||
});
|
});
|
||||||
|
|
||||||
useEffect(() => {
|
const dist = data?.distributions;
|
||||||
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]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Grid container column className="gap-4">
|
<Grid container column className="gap-4 mt-2">
|
||||||
<Table
|
<Grid isDashboard>
|
||||||
title="جزئیات توزیع پلاک"
|
<Table
|
||||||
noSearch
|
isDashboard
|
||||||
noPagination
|
title="مشخصات توزیع پلاک"
|
||||||
columns={[
|
noSearch
|
||||||
"ردیف",
|
noPagination
|
||||||
"شناسه توزیع",
|
columns={[
|
||||||
"شناسه پلاک",
|
"شناسه توزیع",
|
||||||
"نوع توزیع",
|
"تاریخ ثبت",
|
||||||
"کد گونه",
|
"توزیع کننده",
|
||||||
"تعداد کل پلاک ها",
|
"دریافت کننده",
|
||||||
"تعداد توزیع شده",
|
"تعداد کل پلاک",
|
||||||
"تعداد باقیمانده",
|
"پلاک های توزیع شده",
|
||||||
"بازه سریال",
|
"پلاک های باقیمانده",
|
||||||
]}
|
"نوع توزیع",
|
||||||
rows={tableData}
|
"جزئیات توزیع",
|
||||||
/>
|
]}
|
||||||
|
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>
|
</Grid>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -81,8 +81,7 @@ export const DistributeFromDistribution = ({ item, getData }: any) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const parentDists: ParentDistItem[] = sourceDistributions.map((d: any) => {
|
const parentDists: ParentDistItem[] = sourceDistributions.map((d: any) => {
|
||||||
const maxCount =
|
const maxCount = d?.remaining_number || 0;
|
||||||
d?.remaining_number ?? d?.total_tag_count ?? d?.distributed_number ?? 0;
|
|
||||||
return {
|
return {
|
||||||
id: d?.id ?? d?.dist_identity,
|
id: d?.id ?? d?.dist_identity,
|
||||||
dist_identity: d?.dist_identity,
|
dist_identity: d?.dist_identity,
|
||||||
@@ -247,7 +246,7 @@ export const DistributeFromDistribution = ({ item, getData }: any) => {
|
|||||||
)}
|
)}
|
||||||
|
|
||||||
<Button disabled={!hasValidDists} type="submit">
|
<Button disabled={!hasValidDists} type="submit">
|
||||||
توزیع از توزیع
|
ثبت
|
||||||
</Button>
|
</Button>
|
||||||
</Grid>
|
</Grid>
|
||||||
</form>
|
</form>
|
||||||
|
|||||||
@@ -75,6 +75,8 @@ export default function TagActiveDistributions() {
|
|||||||
item?.assigner_org?.name,
|
item?.assigner_org?.name,
|
||||||
item?.assigned_org?.name,
|
item?.assigned_org?.name,
|
||||||
item?.total_tag_count,
|
item?.total_tag_count,
|
||||||
|
item?.total_distributed_tag_count,
|
||||||
|
item?.remaining_tag_count,
|
||||||
item?.distribution_type === "batch" ? "توزیع گروهی" : "توزیع تصادفی",
|
item?.distribution_type === "batch" ? "توزیع گروهی" : "توزیع تصادفی",
|
||||||
<ShowMoreInfo key={item?.id} title="جزئیات توزیع">
|
<ShowMoreInfo key={item?.id} title="جزئیات توزیع">
|
||||||
<Grid container column className="gap-4 w-full">
|
<Grid container column className="gap-4 w-full">
|
||||||
@@ -85,6 +87,19 @@ export default function TagActiveDistributions() {
|
|||||||
column
|
column
|
||||||
className="gap-3 w-full rounded-xl border border-gray-200 dark:border-gray-700 p-4"
|
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 && (
|
{item?.distribution_type === "batch" && opt?.serial_from && (
|
||||||
<Grid container className="gap-2 items-center">
|
<Grid container className="gap-2 items-center">
|
||||||
<Bars3Icon className="w-5 h-5 text-gray-500 dark:text-gray-300" />
|
<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()}
|
{opt?.total_tag_count?.toLocaleString()}
|
||||||
</Typography>
|
</Typography>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid container className="gap-2 items-center">
|
<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 variant="body2" className="font-medium">
|
||||||
گونه:
|
پلاک های توزیع شده:
|
||||||
</Typography>
|
</Typography>
|
||||||
<Typography
|
<Typography
|
||||||
variant="body2"
|
variant="body2"
|
||||||
className="text-gray-700 dark:text-gray-300"
|
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>
|
</Typography>
|
||||||
</Grid>
|
</Grid>
|
||||||
</Grid>
|
</Grid>
|
||||||
@@ -291,6 +317,8 @@ export default function TagActiveDistributions() {
|
|||||||
"توزیع کننده",
|
"توزیع کننده",
|
||||||
"دریافت کننده",
|
"دریافت کننده",
|
||||||
"تعداد کل پلاک",
|
"تعداد کل پلاک",
|
||||||
|
"پلاک های توزیع شده",
|
||||||
|
"پلاک های باقیمانده",
|
||||||
"نوع توزیع",
|
"نوع توزیع",
|
||||||
"جزئیات توزیع",
|
"جزئیات توزیع",
|
||||||
"عملیات",
|
"عملیات",
|
||||||
|
|||||||
@@ -1 +1 @@
|
|||||||
02.63
|
02.64
|
||||||
|
|||||||
Reference in New Issue
Block a user