build and format
This commit is contained in:
@@ -18,379 +18,374 @@ import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsT
|
||||
import useCities from "@/lib/hooks/useCities";
|
||||
|
||||
const OperatorList = () => {
|
||||
const columns = useMemo(
|
||||
() =>{
|
||||
const dynamicColumns = {
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
const columns = useMemo(() => {
|
||||
const dynamicColumns = {
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 130,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingProvinces) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorProvinces) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل کشور" },
|
||||
...provinces.map((province) => ({
|
||||
value: province.id,
|
||||
label: province.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [provinces, errorProvinces, loadingProvinces]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingProvinces ? "loading" : props.filterParameters.value}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return <>{row.original.province_name}</>;
|
||||
},
|
||||
};
|
||||
return [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: "کد یکتا",
|
||||
id: "id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "code",
|
||||
header: "کد خروج",
|
||||
id: "code",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 130,
|
||||
size: 100,
|
||||
},
|
||||
...[dynamicColumns],
|
||||
{
|
||||
header: "شهر",
|
||||
id: "city_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "province_id",
|
||||
grow: false,
|
||||
size: 120,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingProvinces) {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingCityList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorProvinces) {
|
||||
if (errorCityList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل کشور" },
|
||||
...provinces.map((province) => ({
|
||||
value: province.id,
|
||||
label: province.name_fa,
|
||||
{ value: "", label: "کل ادارات" },
|
||||
...cityList.map((edare) => ({
|
||||
value: edare.id,
|
||||
label: edare.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [provinces, errorProvinces, loadingProvinces]);
|
||||
}, [cityList, loadingCityList, errorCityList]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingProvinces ? "loading" : props.filterParameters.value}
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingCityList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.city_name}</>,
|
||||
},
|
||||
{
|
||||
accessorKey: "station_name",
|
||||
header: "راهدارخانه",
|
||||
id: "station_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "state_name",
|
||||
header: "وضعیت",
|
||||
id: "state_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "explanation",
|
||||
header: "موضوع",
|
||||
id: "explanation",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "category_id",
|
||||
header: "نوع",
|
||||
id: "category_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionCategoryTypes.map((category) => ({
|
||||
value: category.id,
|
||||
label: category.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.category_name,
|
||||
},
|
||||
{
|
||||
accessorKey: "zone",
|
||||
header: "محدوده",
|
||||
id: "zone",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionRegions.map((region) => ({
|
||||
value: region.id,
|
||||
label: region.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.zone_fa,
|
||||
},
|
||||
{
|
||||
accessorKey: "type",
|
||||
header: "نوع زمانبندی",
|
||||
id: "type",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionTypes.map((type) => ({
|
||||
value: type.id,
|
||||
label: type.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.type_fa,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ شروع",
|
||||
id: "start_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ پایان",
|
||||
id: "end_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "end_point",
|
||||
header: "مقصد",
|
||||
id: "end_point",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
header: "منطقه عملیاتی",
|
||||
id: "area",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ row }) =>
|
||||
row.original.area ? (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<ShowArea area={row.original.area} />
|
||||
</Stack>
|
||||
) : (
|
||||
"-"
|
||||
),
|
||||
},
|
||||
{
|
||||
header: "خودرو",
|
||||
id: "cmmsMachines__machine_code",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "contains",
|
||||
enableSorting: false,
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return <>{row.original.province_name}</>;
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<MachinesDialog rowId={row.original.id} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
};
|
||||
return [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: "کد یکتا",
|
||||
id: "id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "code",
|
||||
header: "کد خروج",
|
||||
id: "code",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
...[dynamicColumns],
|
||||
{
|
||||
header: "شهر",
|
||||
id: "city_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "province_id",
|
||||
grow: false,
|
||||
size: 120,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingCityList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorCityList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل ادارات" },
|
||||
...cityList.map((edare) => ({
|
||||
value: edare.id,
|
||||
label: edare.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [cityList, loadingCityList, errorCityList]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingCityList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.city_name}</>,
|
||||
},
|
||||
{
|
||||
accessorKey: "station_name",
|
||||
header: "راهدارخانه",
|
||||
id: "station_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "state_name",
|
||||
header: "وضعیت",
|
||||
id: "state_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "explanation",
|
||||
header: "موضوع",
|
||||
id: "explanation",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "category_id",
|
||||
header: "نوع",
|
||||
id: "category_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionCategoryTypes.map((category) => ({
|
||||
value: category.id,
|
||||
label: category.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.category_name,
|
||||
},
|
||||
{
|
||||
accessorKey: "zone",
|
||||
header: "محدوده",
|
||||
id: "zone",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionRegions.map((region) => ({
|
||||
value: region.id,
|
||||
label: region.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.zone_fa,
|
||||
},
|
||||
{
|
||||
accessorKey: "type",
|
||||
header: "نوع زمانبندی",
|
||||
id: "type",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionTypes.map((type) => ({
|
||||
value: type.id,
|
||||
label: type.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.type_fa,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ شروع",
|
||||
id: "start_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ پایان",
|
||||
id: "end_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "end_point",
|
||||
header: "مقصد",
|
||||
id: "end_point",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
header: "منطقه عملیاتی",
|
||||
id: "area",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "افراد",
|
||||
id: "rahdaran__code",
|
||||
enableColumnFilter: true,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "contains",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
Cell: ({ row }) =>
|
||||
row.original.area ? (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<ShowArea area={row.original.area} />
|
||||
</Stack>
|
||||
) : (
|
||||
"-"
|
||||
),
|
||||
},
|
||||
{
|
||||
header: "خودرو",
|
||||
id: "cmmsMachines__machine_code",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "contains",
|
||||
enableSorting: false,
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<RahdaranDialog rowId={row.original.id} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "دلیل رد درخواست",
|
||||
id: "description",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "contains",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<MachinesDialog rowId={row.original.id} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "افراد",
|
||||
id: "rahdaran__code",
|
||||
enableColumnFilter: true,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "contains",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<RahdaranDialog rowId={row.original.id} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<DescriptionDialog description={row.original.description} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
{
|
||||
header: "دلیل رد درخواست",
|
||||
id: "description",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "contains",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<DescriptionDialog description={row.original.description} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.start_time ? moment(row.start_time).locale("fa").format("HH:mm | yyyy/MM/DD") : null,
|
||||
header: "تاریخ خروج",
|
||||
id: "start_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.finish_time ? moment(row.finish_time).locale("fa").format("HH:mm | yyyy/MM/DD") : null,
|
||||
header: "تاریخ ورود",
|
||||
id: "finish_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.request_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "request_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
];
|
||||
},
|
||||
[]
|
||||
);
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.start_time ? moment(row.start_time).locale("fa").format("HH:mm | yyyy/MM/DD") : null,
|
||||
header: "تاریخ خروج",
|
||||
id: "start_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.finish_time ? moment(row.finish_time).locale("fa").format("HH:mm | yyyy/MM/DD") : null,
|
||||
header: "تاریخ ورود",
|
||||
id: "finish_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.request_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "request_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
];
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
@@ -35,7 +35,7 @@ const EditController = ({ row, mutate, openEditDialog, setOpenEditDialog }) => {
|
||||
|
||||
const submitForm = async (result) => {
|
||||
setSubmitting(true);
|
||||
const latlngs = result.bound.getLatLngs();
|
||||
const latlngs = result.bound.getLatLngs();
|
||||
|
||||
const normalized = result.bound_type === "polygon" ? latlngs : [latlngs];
|
||||
|
||||
|
||||
@@ -13,247 +13,243 @@ import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsT
|
||||
import useCities from "@/lib/hooks/useCities";
|
||||
|
||||
const TransportationList = () => {
|
||||
const columns = useMemo(
|
||||
() => {
|
||||
const dynamicColumns = {
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
const columns = useMemo(() => {
|
||||
const dynamicColumns = {
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 130,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingProvinces) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorProvinces) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل کشور" },
|
||||
...provinces.map((province) => ({
|
||||
value: province.id,
|
||||
label: province.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [provinces, errorProvinces, loadingProvinces]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingProvinces ? "loading" : props.filterParameters.value}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return <>{row.original.province_name}</>;
|
||||
},
|
||||
};
|
||||
return [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: "کد یکتا",
|
||||
id: "id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "state_name",
|
||||
header: "وضعیت",
|
||||
id: "state_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 130,
|
||||
size: 100,
|
||||
},
|
||||
...[dynamicColumns],
|
||||
{
|
||||
header: "شهر",
|
||||
id: "city_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "province_id",
|
||||
grow: false,
|
||||
size: 120,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingProvinces) {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingCityList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorProvinces) {
|
||||
if (errorCityList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل کشور" },
|
||||
...provinces.map((province) => ({
|
||||
value: province.id,
|
||||
label: province.name_fa,
|
||||
{ value: "", label: "کل ادارات" },
|
||||
...cityList.map((edare) => ({
|
||||
value: edare.id,
|
||||
label: edare.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [provinces, errorProvinces, loadingProvinces]);
|
||||
}, [cityList, loadingCityList, errorCityList]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingProvinces ? "loading" : props.filterParameters.value}
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingCityList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return <>{row.original.province_name}</>;
|
||||
Cell: ({ row }) => <>{row.original.city_name}</>,
|
||||
},
|
||||
{
|
||||
accessorKey: "station_name",
|
||||
header: "راهدارخانه",
|
||||
id: "station_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "explanation",
|
||||
header: "موضوع",
|
||||
id: "explanation",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "zone",
|
||||
header: "محدوده",
|
||||
id: "zone",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionRegions.map((region) => ({
|
||||
value: region.id,
|
||||
label: region.name_fa,
|
||||
}));
|
||||
},
|
||||
};
|
||||
return [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: "کد یکتا",
|
||||
id: "id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
Cell: ({ row }) => row.original.zone_fa,
|
||||
},
|
||||
{
|
||||
accessorKey: "type",
|
||||
header: "نوع زمانبندی",
|
||||
id: "type",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionTypes.map((type) => ({
|
||||
value: type.id,
|
||||
label: type.name_fa,
|
||||
}));
|
||||
},
|
||||
{
|
||||
accessorKey: "state_name",
|
||||
header: "وضعیت",
|
||||
id: "state_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
...[dynamicColumns],
|
||||
{
|
||||
header: "شهر",
|
||||
id: "city_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "province_id",
|
||||
grow: false,
|
||||
size: 120,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingCityList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorCityList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل ادارات" },
|
||||
...cityList.map((edare) => ({
|
||||
value: edare.id,
|
||||
label: edare.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [cityList, loadingCityList, errorCityList]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingCityList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.city_name}</>,
|
||||
},
|
||||
{
|
||||
accessorKey: "station_name",
|
||||
header: "راهدارخانه",
|
||||
id: "station_name",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "explanation",
|
||||
header: "موضوع",
|
||||
id: "explanation",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "zone",
|
||||
header: "محدوده",
|
||||
id: "zone",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionRegions.map((region) => ({
|
||||
value: region.id,
|
||||
label: region.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.zone_fa,
|
||||
},
|
||||
{
|
||||
accessorKey: "type",
|
||||
header: "نوع زمانبندی",
|
||||
id: "type",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return missionTypes.map((type) => ({
|
||||
value: type.id,
|
||||
label: type.name_fa,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => row.original.type_fa,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ شروع",
|
||||
id: "start_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ پایان",
|
||||
id: "end_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "end_point",
|
||||
header: "مقصد",
|
||||
id: "end_point",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
header: "منطقه عملیاتی",
|
||||
id: "area",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
Cell: ({ row }) => row.original.type_fa,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ شروع",
|
||||
id: "start_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.type == 1
|
||||
? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
: moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
|
||||
header: "تاریخ پایان",
|
||||
id: "end_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "end_point",
|
||||
header: "مقصد",
|
||||
id: "end_point",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
header: "منطقه عملیاتی",
|
||||
id: "area",
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
},
|
||||
},
|
||||
Cell: ({ row }) =>
|
||||
row.original.area ? (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<ShowArea area={row.original.area} />
|
||||
</Stack>
|
||||
) : (
|
||||
"-"
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.request_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "request_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
];},
|
||||
[]
|
||||
);
|
||||
Cell: ({ row }) =>
|
||||
row.original.area ? (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<ShowArea area={row.original.area} />
|
||||
</Stack>
|
||||
) : (
|
||||
"-"
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.request_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "request_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
];
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
@@ -9,7 +9,6 @@ const schema = yup.object().shape({
|
||||
});
|
||||
|
||||
const CreateViolationForm = ({ setOpenMachinesDialog, defaultValues, onSubmitBase }) => {
|
||||
|
||||
const {
|
||||
control,
|
||||
handleSubmit,
|
||||
@@ -22,33 +21,38 @@ const CreateViolationForm = ({ setOpenMachinesDialog, defaultValues, onSubmitBas
|
||||
return (
|
||||
<>
|
||||
<StyledForm onSubmit={handleSubmit(handleOnSubmit)}>
|
||||
<DialogContent>
|
||||
<Stack sx={{ minWidth: "200px" }}>
|
||||
<Controller
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<CarCode
|
||||
carCode={field.value}
|
||||
setCarCode={(value) => field.onChange(value)}
|
||||
error={error}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
name={"machinesId"}
|
||||
/>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions sx={{ alignItems: "center", justifyContent: "end" }}>
|
||||
<Button onClick={() => setOpenMachinesDialog(false)} variant="outlined" color="secondary" size="large">
|
||||
{"بستن"}
|
||||
</Button>
|
||||
<Button variant="contained" disabled={isSubmitting} size="large" type={"submit"}>
|
||||
{"تایید"}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
<DialogContent>
|
||||
<Stack sx={{ minWidth: "200px" }}>
|
||||
<Controller
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<CarCode
|
||||
carCode={field.value}
|
||||
setCarCode={(value) => field.onChange(value)}
|
||||
error={error}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
name={"machinesId"}
|
||||
/>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions sx={{ alignItems: "center", justifyContent: "end" }}>
|
||||
<Button
|
||||
onClick={() => setOpenMachinesDialog(false)}
|
||||
variant="outlined"
|
||||
color="secondary"
|
||||
size="large"
|
||||
>
|
||||
{"بستن"}
|
||||
</Button>
|
||||
<Button variant="contained" disabled={isSubmitting} size="large" type={"submit"}>
|
||||
{"تایید"}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</StyledForm>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default CreateViolationForm
|
||||
export default CreateViolationForm;
|
||||
|
||||
@@ -3,7 +3,6 @@ import { Button, Dialog, IconButton, Tooltip } from "@mui/material";
|
||||
import { useState } from "react";
|
||||
import ViolationForm from "./Form";
|
||||
|
||||
|
||||
const CreateViolation = ({ mutate }) => {
|
||||
const [openMachinesDialog, setOpenMachinesDialog] = useState(false);
|
||||
|
||||
|
||||
@@ -92,4 +92,4 @@ const EditViolationForm = ({ setOpenMachinesDialog, defaultValues, onSubmitBase
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default EditViolationForm
|
||||
export default EditViolationForm;
|
||||
|
||||
@@ -5,11 +5,9 @@ const RowActions = ({ row, mutate }) => {
|
||||
const canEdit = row.original.status === 0 && row.original.type === 1;
|
||||
return (
|
||||
<>
|
||||
{!row.original.mileage &&
|
||||
<EditViolation row={row} mutate={mutate} rowId={row.getValue("id")} />}
|
||||
{!row.original.mileage && <EditViolation row={row} mutate={mutate} rowId={row.getValue("id")} />}
|
||||
{canEdit && <CreateWithoutProcess row={row} mutate={mutate} />}
|
||||
</>
|
||||
);
|
||||
|
||||
};
|
||||
export default RowActions;
|
||||
|
||||
@@ -4,7 +4,7 @@ import CreateViolation from "./Actions/CreateViolation";
|
||||
const Toolbar = ({ mutate }) => {
|
||||
return (
|
||||
<Stack direction={"row"} spacing={1}>
|
||||
<CreateViolation mutate={mutate} />
|
||||
<CreateViolation mutate={mutate} />
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user