robobyte-front-builder 1.0.16 → 1.0.19

package/src/views/rolePermissions/UpdateReportPermissionDialog.js

@@ -0,0 +1,315 @@
+// ** React Imports
+
+// ** MUI Imports
+import {yupResolver} from '@hookform/resolvers/yup'
+import * as yup from 'yup'
+import {
+  Button,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  Grid,
+  IconButton,
+  Typography
+} from '@mui/material'
+import Box from '@mui/material/Box'
+import {Close, DeleteOutline, Plus} from 'mdi-material-ui'
+import {useEffect, useState} from 'react'
+import {useForm} from 'react-hook-form'
+import {Endpoints, Services} from 'src/services/Endpoints'
+import {toast} from 'react-hot-toast'
+import {AgGridReact} from "ag-grid-react";
+import {AutocompleteEditorWrapper} from "views/genericTable/cellEditors/autocompleteEditor";
+
+const UpdateReportPermissionsDialog = props => {
+  // ** Props
+  const {handleToggleDialogs, report, dialog, setRefresh} = props
+  const [IsSubmitting, setIsSubmitting] = useState(false)
+  const [IsLoading, setIsLoading] = useState(false)
+  const [ReportPermissions, setReportPermissions] = useState([])
+  const [gridApi, setGridApi] = useState()
+
+  const colDefs = [
+    {
+      headerName: 'دور الصلاحية',
+      field: 'permissionRole',
+      valueFormatter: (value) => value.data.permissionRole?.name || '',
+      cellEditor: AutocompleteEditorWrapper,
+      cellEditorParams: (value) => {
+        return {
+          dataEndpoint: Endpoints.ViewPermissionRole.Post.GetViewPermissionRolePaged,
+          fieldName: ['name'],
+          filterFields: ['name'],
+          uniqueId: 'id',
+          value: value.data.permissionRole,
+          isSingle: true
+        }
+      },
+      editable: true,
+      onCellValueChanged: (params) => {
+        if (params.newValue && params.newValue.id) {
+          params.data.permissionRoleId = params.newValue.id
+          params.data.permissionRole = params.newValue
+          params.api.refreshCells({
+            rowNodes: [params.node],
+            force: true,
+            columns: ['permissionRole']
+          })
+        }
+      }
+    },
+    {
+      field: 'Delete',
+      width: 80,
+      headerName: 'حذف',
+      cellRenderer: (params) => {
+        return (
+          <IconButton
+            size="small"
+            onClick={() => handleItemDelete(params.node)}
+            color="error"
+          >
+            <DeleteOutline/>
+          </IconButton>
+        )
+      }
+    },
+  ]
+
+  const schema = yup.object().shape({})
+  const {
+    register,
+    handleSubmit,
+    clearErrors,
+    formState: {errors}
+  } = useForm({
+    mode: 'onBlur',
+    reValidateMode: 'onBlur',
+    resolver: yupResolver(schema)
+  })
+
+
+  const handleItemDelete = (node) => {
+    if (gridApi == null) {
+      return
+    }
+    if (node.data.isNew) {
+      gridApi.applyTransaction({
+        remove: [node.data],
+      });
+    } else {
+      node.data['isForDelete'] = !node.data['isForDelete']
+      gridApi.applyTransaction({
+        update: [node.data],
+      });
+    }
+  }
+
+  const handleAddNew = () => {
+    if (gridApi == null) {
+      return
+    }
+    const defaultItem = {
+      id: 0,
+      reportId: report.id,
+      permissionRoleId: 0,
+      permissionRole: null,
+      isForDelete: false,
+      isNew: true,
+      isAdd: false
+    }
+    gridApi.applyTransaction({
+      add: [defaultItem],
+      addIndex: gridApi.getDisplayedRowCount(),
+    });
+  }
+
+  async function handleSave() {
+    try {
+      setIsSubmitting(true)
+      if (!gridApi) return;
+
+      let allData = []
+      gridApi.forEachNode(node => {
+        if (node.data != null && !node.data.isAdd) {
+          // Only include if permissionRoleId is set (for new items) or if it's an existing item
+          if (node.data.permissionRoleId || node.data.id) {
+            allData.push({
+              reportId: report.id,
+              permissionRoleId: node.data.permissionRoleId || node.data.permissionRole?.id || 0,
+              id: node.data?.id ?? 0,
+              isForDelete: node.data.isForDelete || false,
+            })
+          }
+        }
+      })
+
+      allData = allData.filter(item => item.permissionRoleId > 0)
+      if (allData.length === 0) {
+        toast.error("الرجاء إضافة دور صلاحية واحد على الأقل")
+        setIsSubmitting(false)
+        return
+      }
+      const response = await Services.PostService(
+        Endpoints.ViewPermissionRole.Post.ReportPermissionsUpdateRange,
+        true,
+        allData
+      )
+
+      if (response) {
+        toast.success("تم الحفظ بنجاح")
+        handleDialogClose()
+        if (setRefresh) {
+          setRefresh(prev => !prev)
+        }
+      } else {
+        toast.error("فشل الحفظ، حاول مرة أخرى")
+      }
+
+    } catch (error) {
+      console.error("Error saving report permissions:", error)
+      toast.error("فشل الحفظ، حاول مرة أخرى")
+    } finally {
+      setIsSubmitting(false)
+    }
+  }
+
+  async function handleGetReportPermissions() {
+    try {
+      setIsLoading(true)
+      // TODO: Replace with actual endpoint for fetching report permissions
+      // For now, using a filter structure that might work
+      let filter = {
+        Tfilter: [
+          {
+            path: 'reportId',
+            method: 'Equals',
+            value: report.id
+          }
+        ]
+      }
+
+      // Using ViewPermissionRoleItems endpoint as it seems related
+      let response = await Services.PostService(
+        Endpoints.ViewPermissionRole.Post.ReportPermissionsGetAll,
+        false,
+        filter
+      )
+
+      if (response && response.data) {
+        const permissions = response.data.map((value, index) => ({
+          ...value,
+          key: index,
+          isForDelete: false,
+          permissionRoleId: value.permissionRoleId || value.permissionRole?.id,
+          permissionRole: value.permissionRole || null
+        }))
+        setReportPermissions(permissions)
+      } else {
+        setReportPermissions([])
+      }
+    } catch (error) {
+      console.error("Error fetching report permissions:", error)
+      setReportPermissions([])
+    } finally {
+      setIsLoading(false)
+    }
+  }
+
+
+  const handleDialogClose = async () => {
+    clearErrors()
+    handleToggleDialogs(dialog)
+  }
+
+  useEffect(() => {
+    if (report) {
+      handleGetReportPermissions()
+    }
+  }, [report])
+
+  return (
+    <>
+      <DialogTitle id='confirmation-dialog-title' sx={{padding: 0, marginBottom: 5}}>
+        <Box
+          sx={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            backgroundColor: 'background.default',
+            p: theme => theme.spacing(3, 3.255, 3, 5.255)
+          }}
+        >
+          <Typography variant='h6'>صلاحيات التقرير</Typography>
+          <Box sx={{display: 'flex', alignItems: 'center'}}>
+            <Close fontSize='small' onClick={handleDialogClose} sx={{cursor: 'pointer'}}/>
+          </Box>
+        </Box>
+      </DialogTitle>
+
+      <DialogContent className='dialog-body'>
+        <form
+          onSubmit={handleSubmit(e => {
+            handleSave(e)
+          })}
+        >
+          <Box sx={{display: 'flex', justifyContent: 'flex-end', mb: 2}}>
+            <Button
+              variant='outlined'
+              size='small'
+              startIcon={<Plus/>}
+              onClick={handleAddNew}
+            >
+              إضافة دور صلاحية
+            </Button>
+          </Box>
+          <Grid container size={{ xs: 12 }}>
+            <div style={{width: "100%", height: "40vh", direction: 'ltr'}}>
+              <AgGridReact
+                enableRtl={true}
+                columnDefs={colDefs}
+                rowData={ReportPermissions}
+                onGridReady={(params) => setGridApi(params.api)}
+                singleClickEdit={true}
+                defaultColDef={{
+                  sortable: false,
+                  suppressHeaderMenuButton: true,
+                }}
+                pinnedBottomRowData={[{
+                  id: 'add-row',
+                  isAdd: true
+                }]}
+                getRowStyle={(row) => {
+                  if (row.data?.isAdd) {
+                    return {display: 'none'};
+                  }
+                  if (row.data?.isForDelete) {
+                    return {backgroundColor: '#FF625F'};
+                  }
+                  if (row.data?.isNew) {
+                    return {backgroundColor: '#f6fff3'};
+                  }
+                  return null;
+                }}
+              />
+            </div>
+          </Grid>
+          <DialogActions sx={{pb: {xs: 8}, justifyContent: 'center'}}>
+            <Button
+              variant='contained'
+              sx={{mr: 2}}
+              disabled={IsSubmitting || IsLoading}
+              onClick={handleSave}
+            >
+              {IsSubmitting ? 'جاري الحفظ...' : 'حفظ'}
+            </Button>
+            <Button variant='outlined' color='secondary' onClick={handleDialogClose}>
+              الغاء
+            </Button>
+          </DialogActions>
+        </form>
+      </DialogContent>
+    </>
+  )
+}
+
+export default UpdateReportPermissionsDialog