change style
This commit is contained in:
AmirHossein Mahmoodi
@@ -36,243 +36,253 @@ const OperatorList = () => {
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "item",
|
||||
header: "آیتم فعالیت",
|
||||
id: "item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { itemsList, loadingItemsList, errorItemsList } = useRoadItemGetItems();
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه آیتم ها" },
|
||||
...itemsList.map((item) => ({
|
||||
value: item.id,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [itemsList, loadingItemsList, errorItemsList]);
|
||||
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingItemsList ? "loading" : props.filterParameters.value}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.item_fa;
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "sub_item",
|
||||
header: "اقدام انجام شده",
|
||||
id: "sub_item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "item",
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { subItemsList, loadingSubItemsList, errorSubItemsList } = useRoadItemGetSubItems(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا آیتم فعالیت را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingSubItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorSubItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه اقدام ها" },
|
||||
...subItemsList.map((item) => ({
|
||||
value: item.sub_item,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [subItemsList, loadingSubItemsList, errorSubItemsList]);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevDependency === props.dependencyFieldValue.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
setPrevDependency(props.dependencyFieldValue.value);
|
||||
}, [props.dependencyFieldValue.value]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue.value === ""
|
||||
? "empty"
|
||||
: loadingSubItemsList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.sub_item_fa;
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "value",
|
||||
header: "مقدار", // Value
|
||||
id: "value",
|
||||
header: "اطلاعات فعالیت",
|
||||
id: "info",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack direction="row" alignItems="center" spacing={0.5}>
|
||||
<Typography sx={{ margin: 1 }} component="span">
|
||||
{(row.original.sub_item_data / 1).toLocaleString()}
|
||||
</Typography>
|
||||
<Typography component="span" variant="caption">
|
||||
{`(${row.original.unit_fa})`}
|
||||
</Typography>
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "تصاویر",
|
||||
id: "images",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
size: 50,
|
||||
columns: [
|
||||
{
|
||||
accessorKey: "item",
|
||||
header: "آیتم فعالیت",
|
||||
id: "item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { itemsList, loadingItemsList, errorItemsList } = useRoadItemGetItems();
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه آیتم ها" },
|
||||
...itemsList.map((item) => ({
|
||||
value: item.id,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [itemsList, loadingItemsList, errorItemsList]);
|
||||
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingItemsList ? "loading" : props.filterParameters.value}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.item_fa;
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<ImageDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "موقعیت", // Location
|
||||
id: "location",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
{
|
||||
accessorKey: "sub_item",
|
||||
header: "اقدام انجام شده",
|
||||
id: "sub_item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "item",
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { subItemsList, loadingSubItemsList, errorSubItemsList } = useRoadItemGetSubItems(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا آیتم فعالیت را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingSubItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorSubItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه اقدام ها" },
|
||||
...subItemsList.map((item) => ({
|
||||
value: item.sub_item,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [subItemsList, loadingSubItemsList, errorSubItemsList]);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevDependency === props.dependencyFieldValue.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
setPrevDependency(props.dependencyFieldValue.value);
|
||||
}, [props.dependencyFieldValue.value]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue.value === ""
|
||||
? "empty"
|
||||
: loadingSubItemsList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.sub_item_fa;
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<LocationForm
|
||||
start_lat={row.original.start_lat}
|
||||
start_lng={row.original.start_lng}
|
||||
end_lat={row.original.end_lat}
|
||||
end_lng={row.original.end_lng}
|
||||
/>
|
||||
</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",
|
||||
{
|
||||
accessorKey: "value",
|
||||
header: "مقدار", // Value
|
||||
id: "value",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack direction="row" alignItems="center" spacing={0.5}>
|
||||
<Typography sx={{ margin: 1 }} component="span">
|
||||
{(row.original.sub_item_data / 1).toLocaleString()}
|
||||
</Typography>
|
||||
<Typography component="span" variant="caption">
|
||||
{`(${row.original.unit_fa})`}
|
||||
</Typography>
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<MachinesCodeDialog rowId={row.getValue("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",
|
||||
{
|
||||
header: "تصاویر",
|
||||
id: "images",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
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"}>
|
||||
<ImageDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<RahdaranDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.activity_date_time).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ فعالیت", // Start Date
|
||||
id: "activity_date_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
{
|
||||
header: "موقعیت", // Location
|
||||
id: "location",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
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"}>
|
||||
<LocationForm
|
||||
start_lat={row.original.start_lat}
|
||||
start_lng={row.original.start_lng}
|
||||
end_lat={row.original.end_lat}
|
||||
end_lng={row.original.end_lng}
|
||||
/>
|
||||
</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 (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<MachinesCodeDialog rowId={row.getValue("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: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<RahdaranDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.activity_date_time).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ فعالیت", // Start Date
|
||||
id: "activity_date_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
|
||||
@@ -125,8 +125,8 @@ const SupervisorList = () => {
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingEdaratList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
@@ -135,240 +135,250 @@ const SupervisorList = () => {
|
||||
Cell: ({ renderedCellValue, row }) => <>{row.original.edarat_name}</>,
|
||||
},
|
||||
{
|
||||
header: "آیتم فعالیت",
|
||||
id: "item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { itemsList, loadingItemsList, errorItemsList } = useRoadItemGetItems();
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه آیتم ها" },
|
||||
...itemsList.map((item) => ({
|
||||
value: item.id,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [itemsList, loadingItemsList, errorItemsList]);
|
||||
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingItemsList ? "loading" : props.filterParameters.value}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.item_fa;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "اقدام انجام شده",
|
||||
id: "sub_item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "item",
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { subItemsList, loadingSubItemsList, errorSubItemsList } = useRoadItemGetSubItems(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا آیتم فعالیت را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingSubItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorSubItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه اقدام ها" },
|
||||
...subItemsList.map((item) => ({
|
||||
value: item.sub_item,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [subItemsList, loadingSubItemsList, errorSubItemsList]);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevDependency === props.dependencyFieldValue.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
setPrevDependency(props.dependencyFieldValue.value);
|
||||
}, [props.dependencyFieldValue.value]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue.value === ""
|
||||
? "empty"
|
||||
: loadingSubItemsList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.sub_item_fa;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "مقدار", // Value
|
||||
id: "value",
|
||||
header: "اطلاعات فعالیت",
|
||||
id: "info",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 120,
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack direction="row" alignItems="center" spacing={0.5}>
|
||||
<Typography sx={{ margin: 1 }} component="span">
|
||||
{(row.original.sub_item_data / 1).toLocaleString()}
|
||||
</Typography>
|
||||
<Typography component="span" variant="caption">
|
||||
{`(${row.original.unit_fa})`}
|
||||
</Typography>
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "تصاویر",
|
||||
id: "images",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
size: 50,
|
||||
columns: [
|
||||
{
|
||||
header: "آیتم فعالیت",
|
||||
id: "item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { itemsList, loadingItemsList, errorItemsList } = useRoadItemGetItems();
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (loadingItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه آیتم ها" },
|
||||
...itemsList.map((item) => ({
|
||||
value: item.id,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [itemsList, loadingItemsList, errorItemsList]);
|
||||
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={loadingItemsList ? "loading" : props.filterParameters.value}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.item_fa;
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<ImageDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "موقعیت", // Location
|
||||
id: "location",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
grow: false,
|
||||
size: 100,
|
||||
muiTableBodyCellProps: {
|
||||
sx: {
|
||||
borderLeft: "1px solid #e1e1e1",
|
||||
py: 0,
|
||||
"&:first-of-type": {
|
||||
borderLeft: "unset",
|
||||
{
|
||||
header: "اقدام انجام شده",
|
||||
id: "sub_item",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "item",
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { subItemsList, loadingSubItemsList, errorSubItemsList } = useRoadItemGetSubItems(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا آیتم فعالیت را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingSubItemsList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorSubItemsList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "همه اقدام ها" },
|
||||
...subItemsList.map((item) => ({
|
||||
value: item.sub_item,
|
||||
label: item.name,
|
||||
})),
|
||||
];
|
||||
}, [subItemsList, loadingSubItemsList, errorSubItemsList]);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevDependency === props.dependencyFieldValue.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
setPrevDependency(props.dependencyFieldValue.value);
|
||||
}, [props.dependencyFieldValue.value]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue.value === ""
|
||||
? "empty"
|
||||
: loadingSubItemsList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return row.original.sub_item_fa;
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<LocationForm
|
||||
start_lat={row.original.start_lat}
|
||||
start_lng={row.original.start_lng}
|
||||
end_lat={row.original.end_lat}
|
||||
end_lng={row.original.end_lng}
|
||||
/>
|
||||
</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",
|
||||
{
|
||||
header: "مقدار", // Value
|
||||
id: "value",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 120,
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack direction="row" alignItems="center" spacing={0.5}>
|
||||
<Typography sx={{ margin: 1 }} component="span">
|
||||
{(row.original.sub_item_data / 1).toLocaleString()}
|
||||
</Typography>
|
||||
<Typography component="span" variant="caption">
|
||||
{`(${row.original.unit_fa})`}
|
||||
</Typography>
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<MachinesCodeDialog rowId={row.getValue("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",
|
||||
{
|
||||
header: "تصاویر",
|
||||
id: "images",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
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"}>
|
||||
<ImageDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
},
|
||||
Cell: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<RahdaranDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.activity_date_time).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ فعالیت", // Start Date
|
||||
id: "activity_date_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
{
|
||||
header: "موقعیت", // Location
|
||||
id: "location",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
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"}>
|
||||
<LocationForm
|
||||
start_lat={row.original.start_lat}
|
||||
start_lng={row.original.start_lng}
|
||||
end_lat={row.original.end_lat}
|
||||
end_lng={row.original.end_lng}
|
||||
/>
|
||||
</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 (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<MachinesCodeDialog rowId={row.getValue("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: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<RahdaranDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.activity_date_time).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ فعالیت", // Start Date
|
||||
id: "activity_date_time",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
|
||||
Reference in New Issue
Block a user