@campxdev/shared 1.10.41 → 1.10.46

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@campxdev/shared",
-  "version": "1.10.41",
+  "version": "1.10.46",
   "main": "./exports.ts",
   "scripts": {
     "start": "react-scripts start",

package/src/components/ApplicationProfile/UserProfileRelation.tsx

@@ -1,12 +1,14 @@
 import { yupResolver } from '@hookform/resolvers/yup'
 import { Stack } from '@mui/material'
+import { useEffect } from 'react'
 import { useForm } from 'react-hook-form'
-import { useMutation, useQueryClient } from 'react-query'
+import { useMutation, useQuery, useQueryClient } from 'react-query'
 import { toast } from 'react-toastify'
 import { useImmer } from 'use-immer'
-import { axiosErrorToast } from '../../config/axios'
+import axios, { axiosErrorToast } from '../../config/axios'
 import ActionButton from '../ActionButton'
-import { FormMultiSelect } from '../HookForm'
+import { FormMultiSelect, FormSingleSelect } from '../HookForm'
+import Spinner from '../Spinner'
 import {
   editUserProfileSchema,
   fetchUsers,
@@ -20,20 +22,27 @@ interface UserProps {
   }[]
   inputValue: string
 }
+const getDepartments = () => {
+  return axios.get('/hrms/departments').then((res) => res?.data?.data)
+}
 function UserProfileRelation({ close, application, profiles, data }) {
   const [state, setState] = useImmer<UserProps>({
     options: [],
     inputValue: '',
   })
   const queryClient = useQueryClient()
+  const { data: departments, isLoading } = useQuery('get-department', () =>
+    getDepartments(),
+  )
 
-  const { control, handleSubmit } = useForm({
+  const { control, handleSubmit, watch } = useForm({
     defaultValues: {
       profileIds:
         data?.profiles?.map((profile) => ({
           label: profile.name,
           value: profile.id,
         })) ?? [],
+      departmentId: null,
     },
     resolver: yupResolver(data ? editUserProfileSchema : userProfileSchema),
   })
@@ -54,6 +63,15 @@ function UserProfileRelation({ close, application, profiles, data }) {
     },
   )
 
+  useEffect(() => {
+    if (watch('departmentId')) {
+      fetchUsersFn({
+        application: application,
+        departmentId: watch('departmentId'),
+      })
+    }
+  }, [watch('departmentId')])
+
   const { mutate: fetchUsersFn, isLoading: gettingUsers } = useMutation(
     fetchUsers,
     {
@@ -69,10 +87,10 @@ function UserProfileRelation({ close, application, profiles, data }) {
   )
   const onSubmit = (formData) => {
     mutate({
-      id: data?.id,
+      userIds: formData?.userId?.map((userId) => +userId.value) ?? [],
       application: application,
       profileIds: formData.profileIds?.map((profile) => profile.value) ?? [],
-      userId: data ? data.id : +formData.userId?.value,
+      ...(data && { userId: data?.id }),
     })
   }
   const onError = (err) => {
@@ -86,22 +104,38 @@ function UserProfileRelation({ close, application, profiles, data }) {
       setState((s) => {
         s.inputValue = e.target.value
       })
-      if (e.target.value.length > 3) {
+      if (e.target.value.length >= 3) {
         fetchUsersFn({
           application: application,
           search: e.target.value,
+          departmentId: watch('departmentId') ?? null,
         })
       }
     }
   }
 
+  if (isLoading) {
+    return <Spinner />
+  }
+
   return (
     <>
       <form onSubmit={handleSubmit(onSubmit, onError)}>
         <Stack gap={4} sx={{ padding: '10px' }}>
+          {!data && (
+            <FormSingleSelect
+              control={control}
+              name="departmentId"
+              label="Department"
+              options={departments?.map((department) => ({
+                label: department.name,
+                value: department._id,
+              }))}
+            />
+          )}
+
           {!data && (
             <FormMultiSelect
-              multiple={false}
               label={'User'}
               name={'userId'}
               onInputChange={handleInputChange}

package/src/components/ApplicationProfile/services.ts

@@ -1,5 +1,4 @@
 import { AxiosRequestConfig } from 'axios'
-import { id } from 'date-fns/locale'
 import * as yup from 'yup'
 import axios from '../../config/axios'
 export const defaultFilterObj = {
@@ -12,13 +11,7 @@ export const defaultFilterObj = {
 }
 
 export const userProfileSchema = yup.object().shape({
-  userId: yup
-    .object()
-    .shape({
-      label: yup.string().required('User is required'),
-      value: yup.string().required('User is required'),
-    })
-    .required('User is required'),
+  userId: yup.array().min(1).required('User is required'),
   profileIds: yup.array().min(1).required('Profile is required'),
 })
 
@@ -50,9 +43,9 @@ export const fetchProfiles = (application) => {
 }
 
 interface ApplicationUserProfile {
-  id?: number
+  userId?: number
   application: string
-  userId: number
+  userIds: number[]
   profileIds: number[]
 }
 export const createApplicationUserProfile = (
@@ -73,8 +66,8 @@ export const updateCreateUserApplicationProfile = (
   postBody: ApplicationUserProfile,
 ) => {
   const config: AxiosRequestConfig = {
-    method: id ? 'PUT' : 'POST',
-    url: id
+    method: postBody?.userId ? 'PUT' : 'POST',
+    url: postBody?.userId
       ? `/square/profile-permissions/edit-user-permissions`
       : '/square/profile-permissions/add-user',
     data: postBody,

package/src/components/Layout/Header/AppHeader.tsx

@@ -41,7 +41,7 @@ interface AppHeaderProps {
     onClick: any
   }[]
   customHeaderActions?: ReactNode
-  cogWheelMenu?: { label: string; path: string }[]
+  cogWheelMenu?: { label: string; path: string; openNewTab?: boolean }[]
 }
 
 export default function AppHeader({

package/src/components/Layout/Header/HeaderActions/CogWheelMenu.tsx

@@ -1,10 +1,10 @@
 import { SettingsOutlined } from '@mui/icons-material'
 import { IconButton } from '@mui/material'
-import { useHistory } from '../../../../hooks/useRouter'
+import { useNavigate } from 'react-router-dom'
 import DropDownButton from '../../../DropDownButton/DropDownButton'
 
 const CogWheelMenu = ({ menu }) => {
-  const history = useHistory()
+  const navigate = useNavigate()
 
   return (
     <DropDownButton
@@ -16,7 +16,9 @@ const CogWheelMenu = ({ menu }) => {
       menu={menu?.map((item) => ({
         label: item?.label,
         onClick: () => {
-          history.push(item?.path)
+          item?.openNewTab
+            ? window.open(item?.path, '_blank')
+            : navigate(item?.path)
         },
       }))}
       menuProps={{

package/src/components/Layout/Header/HeaderActions/HeaderActions.tsx

@@ -1,13 +1,9 @@
 import { Box, styled } from '@mui/material'
-import UserBox from './UserBox'
-import CogWheelMenu from './CogWheelMenu'
-import FreshDeskHelpButton from './FreshDeskHelpButton'
 import InstitutionsDropDown from '../../../Institutions/InstitutionsDropdown'
-import SearchButton from '../Search/SearchButton'
-import { NotificationsNoneOutlined } from '@mui/icons-material'
-import { useEffect } from 'react'
+import CogWheelMenu from './CogWheelMenu'
+import UserBox from './UserBox'
 
-const StyledBeamerBox = styled(Box)(() => ({
+const StyledBeamedBox = styled(Box)(() => ({
   width: '60px',
 }))
 
@@ -21,7 +17,7 @@ export default function HeaderActions({
       <InstitutionsDropDown />
       {/* <SearchButton /> */}
       {/* <FreshDeskHelpButton /> */}
-      <StyledBeamerBox></StyledBeamerBox>
+      <StyledBeamedBox></StyledBeamedBox>
       {cogWheelMenu?.length ? <CogWheelMenu menu={cogWheelMenu} /> : null}
       <UserBox fullName={fullName} actions={userBoxActions} />
     </>

package/src/components/LoginForm.tsx

@@ -15,13 +15,13 @@ import Cookies from 'js-cookie'
 import { useEffect, useState } from 'react'
 import { useForm } from 'react-hook-form'
 import { Link } from 'react-router-dom'
+import { campxLogoPrimary } from '../assets/images'
 import axios from '../config/axios'
 import adminAxios from '../utils/adminAxios'
 import ActionButton from './ActionButton'
 import { FormTextField } from './HookForm'
-import ResetPassword from './ResetPassword'
 import Image from './Image/Image'
-import { campxLogoPrimary } from '../assets/images'
+import ResetPassword from './ResetPassword'
 
 export function LoginForm({
   loginUrl,
@@ -43,7 +43,10 @@ export function LoginForm({
         method: 'POST',
         baseURL: process.env.REACT_APP_API_HOST,
         url: loginUrl ? loginUrl : `/auth-server/auth/login`,
-        data: values,
+        data: {
+          ...values,
+          type: 'WEB',
+        },
       })
       Cookies.set('campx_tenant', res?.data?.subDomain)
       Cookies.set('campx_session_key', res.data?.token)

package/src/components/StudentCard/FeeCard.tsx

@@ -0,0 +1,301 @@
+import {
+  Box,
+  Divider,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  Typography,
+} from '@mui/material'
+import { StyledCardBorder } from './styles'
+
+function FeeCard({ data, feeDetails }) {
+  const studentFirstPart = [
+    { label: 'Roll.No', value: data?.admission?.rollNo ?? '-' },
+    { label: 'Branch', value: data?.admission?.branchCode ?? '-' },
+    { label: 'Seat', value: data?.admission?.quota?.name ?? '-' },
+    { label: 'Student Mobile', value: data?.admission?.mobile ?? '-' },
+  ]
+
+  const studentSecondPart = [
+    { label: 'Name', value: data?.admission?.fullName ?? '-' },
+    {
+      label: 'Semester',
+      value: data?.admission?.detained
+        ? 'Detained'
+        : data?.admission?.discontinued
+        ? 'Discontinued'
+        : data?.admission?.semNo ?? '-',
+    },
+    {
+      label: 'ScholarShip',
+      value: data?.admission?.hasScholarship ? 'Yes' : 'No',
+    },
+    { label: 'Parent Mobile', value: data?.admission?.parentMobile ?? '-' },
+  ]
+
+  const totalLateFinesPaid = feeDetails?.map((row) => {
+    const latefines = row[1]?.map((latefee) => {
+      const fines = latefee?.debits?.reduce((acc, curr) => {
+        if (curr.isFine && curr.debit > 0) {
+          return acc + curr.debit
+        }
+        return acc
+      }, 0)
+      return fines
+    })
+    return latefines
+  })
+
+  const lateFines = feeDetails?.map((row) => {
+    const latefine = row[1]?.map((latefee) => {
+      const fines = latefee?.credits?.reduce((acc, curr) => {
+        if (curr.isFine && curr.credit > 0) {
+          return acc + curr.credit
+        }
+        return acc
+      }, 0)
+      return fines
+    })
+    return latefine
+  })
+
+  function amountDue(row: any) {
+    const debitTotal = row?.debits?.reduce((acc, curr) => {
+      if (!curr.isFine) {
+        acc += curr.debit
+      }
+      return acc
+    }, 0)
+
+    const creditTotal = row?.credits?.reduce((acc, curr) => {
+      if (!curr.isFine) {
+        acc += curr.credit
+      }
+      return acc
+    }, 0)
+
+    const difference = Math.abs(creditTotal - debitTotal)
+    return difference
+  }
+  return (
+    <StyledCardBorder>
+      <Box
+        className='school-details'
+        sx={{
+          display: 'flex',
+          flexDirection: 'column',
+          padding: '20px',
+          alignItems: 'center',
+          gap: '10px',
+        }}
+      >
+        <Box>
+          <img
+            src={data?.institution?.images?.url}
+            alt='school-logo'
+            width={'200px'}
+          />
+        </Box>
+
+        <Typography variant='h6' sx={{ fontSize: '22px' }}>
+          {data?.institution?.name}
+        </Typography>
+        <Typography variant='h6' textAlign={'center'} sx={{ fontSize: '16px' }}>
+          {data?.institution?.recognitionDetails}
+        </Typography>
+        <Typography variant='h6' textAlign={'center'} sx={{ fontSize: '16px' }}>
+          {data?.institution?.address}
+        </Typography>
+      </Box>
+      <Divider />
+      <Typography
+        variant='h6'
+        textAlign={'center'}
+        sx={{ margin: '10px', fontSize: '22px' }}
+      >
+        STUDENT FEE CARD
+      </Typography>
+      <Divider />
+      <Box
+        className='student-details'
+        sx={{
+          display: 'flex',
+          padding: '10px',
+          gap: '30px',
+          justifyContent: 'space-around',
+        }}
+      >
+        <Box sx={{ display: 'flex', gap: '22px' }}>
+          <Box>
+            {studentFirstPart?.map((item, index) => (
+              <Box key={index} sx={{ mt: '10px' }}>
+                <Typography variant='h6'>{item.label}</Typography>
+              </Box>
+            ))}
+          </Box>
+          <Box>
+            {studentFirstPart?.map((item, index) => (
+              <Box key={index} sx={{ mt: '10px' }}>
+                <Typography variant='subtitle1'>{item.value}</Typography>
+              </Box>
+            ))}
+          </Box>
+        </Box>
+
+        <Box sx={{ display: 'flex', gap: '12px' }}>
+          <Box>
+            {studentSecondPart?.map((item, index) => (
+              <Box key={index} sx={{ mt: '10px' }}>
+                <Typography variant='h6'>{item.label}</Typography>
+              </Box>
+            ))}
+          </Box>
+          <Box>
+            {studentSecondPart?.map((item, index) => (
+              <Box key={index} sx={{ mt: '10px' }}>
+                <Typography variant='subtitle1'>{item.value}</Typography>
+              </Box>
+            ))}
+          </Box>
+        </Box>
+
+        <img
+          src={data?.admission?.photo}
+          alt='student-photo'
+          width={'150px'}
+          height={'120px'}
+        />
+      </Box>
+
+      <Divider />
+
+      <Box>
+        <Table>
+          <TableHead>
+            <TableRow>
+              <TableCell>SI.No</TableCell>
+              <TableCell>Fee</TableCell>
+              <TableCell>Payable</TableCell>
+              <TableCell>Paid</TableCell>
+              <TableCell>Rec.No(s)</TableCell>
+              <TableCell>Rec.Date(s)</TableCell>
+              <TableCell>Bank Details</TableCell>
+              <TableCell>Due</TableCell>
+              <TableCell>Excess paid</TableCell>
+            </TableRow>
+          </TableHead>
+
+          {feeDetails?.map((fee, index) => (
+            <>
+              <TableRow>
+                <TableCell colSpan={9}>{fee[0]} Year</TableCell>
+              </TableRow>
+              <>
+                {fee[1]?.map((item, i) => (
+                  <TableBody key={i}>
+                    <TableCell>{i + 1}</TableCell>
+                    <TableCell>{item.feeName}</TableCell>
+                    <TableCell>
+                      {item?.credits?.reduce((acc, curr) => {
+                        if (!curr.isFine) {
+                          acc = acc + curr.credit
+                        }
+                        return acc
+                      }, 0)}
+                    </TableCell>
+                    <TableCell>
+                      {item?.debits?.reduce((acc, curr) => {
+                        if (!curr.isFine) {
+                          acc = acc + curr.debit
+                        }
+                        return acc
+                      }, 0)}
+                    </TableCell>
+                    <TableCell>{item?.receipts.join(', ')}</TableCell>
+                    <TableCell>{item?.receiptDates?.join(', ')}</TableCell>
+                    <TableCell>{item.bankDetails?.join(' ')}</TableCell>
+                    <TableCell>
+                      {amountDue(item)}
+                      {lateFines[index][i] > 0 &&
+                        totalLateFinesPaid[index][i] == 0 && (
+                          <Typography variant='caption' color={'red'}>
+                            {'(+' +
+                              `${
+                                lateFines[index][i] -
+                                totalLateFinesPaid[index][i]
+                              }` +
+                              ' Late fee)'}
+                          </Typography>
+                        )}
+                    </TableCell>
+                    <TableCell>
+                      {item?.debits?.reduce((acc, curr) => {
+                        if (curr.isFine) {
+                          acc = acc + curr.debit
+                        }
+                        return acc
+                      }, 0)}
+                    </TableCell>
+                  </TableBody>
+                ))}
+              </>
+              <TableHead>
+                <TableRow>
+                  <TableCell colSpan={2}>
+                    <Typography variant='h6'>{fee[0]} year total</Typography>
+                  </TableCell>
+                  <TableCell>
+                    <Typography variant='h6'>
+                      {data?.totalFeesByYear[index]?.amount}
+                    </Typography>
+                  </TableCell>
+                  <TableCell colSpan={4}>
+                    <Typography variant='h6'>
+                      {data?.totalFeesPaidByYear[index]?.amount}{' '}
+                    </Typography>
+                  </TableCell>
+                  <TableCell>
+                    <Typography variant='h6'>
+                      {data?.totalFeesDueByYear[index]?.amount}
+                    </Typography>
+                  </TableCell>
+                  <TableCell>
+                    <Typography variant='h6'>
+                      {data?.totalFeesExcessiveByYear[index]?.amount}
+                    </Typography>
+                  </TableCell>
+                </TableRow>
+              </TableHead>
+            </>
+          ))}
+
+          <TableHead>
+            <TableRow>
+              <TableCell colSpan={2}>
+                <Typography variant='h6'>Grand total</Typography>
+              </TableCell>
+              <TableCell>
+                <Typography variant='h6'>{data?.grandFeeTotal}</Typography>
+              </TableCell>
+              <TableCell colSpan={4}>
+                <Typography variant='h6'>{data?.grandFeePaidTotal} </Typography>
+              </TableCell>
+              <TableCell>
+                <Typography variant='h6'>{data?.grandFeeDueTotal}</Typography>
+              </TableCell>
+              <TableCell>
+                <Typography variant='h6'>
+                  {data?.grandFeeExcessiveTotal}
+                </Typography>
+              </TableCell>
+            </TableRow>
+          </TableHead>
+        </Table>
+      </Box>
+    </StyledCardBorder>
+  )
+}
+
+export default FeeCard

package/src/components/StudentCard/PrintStudentCard.tsx

@@ -0,0 +1,39 @@
+import { Container } from '@mui/material'
+import _ from 'lodash'
+import { useQuery } from 'react-query'
+import { useSearchParams } from 'react-router-dom'
+import axios from '../../config/axios'
+import Spinner from '../Spinner'
+import FeeCard from './FeeCard'
+
+function PrintStudentCard({ url }) {
+  const [search] = useSearchParams()
+  const { data, isLoading } = useQuery('print-student-card', () =>
+    axios
+      .get(url, {
+        params: {
+          id: search.get('id'),
+          idType: search.get('idType'),
+        },
+      })
+      .then((res) => res.data),
+  )
+
+  if (isLoading) return <Spinner />
+
+  const feeDetails = Object.entries(
+    _.groupBy(data?.feeDataResult, 'year'),
+  )?.map((item) => {
+    return item
+  })
+
+  return (
+    <>
+      <Container>
+        <FeeCard data={data} feeDetails={feeDetails} />
+      </Container>
+    </>
+  )
+}
+
+export default PrintStudentCard

package/src/components/StudentCard/index.tsx

@@ -0,0 +1 @@
+export { default } from './PrintStudentCard'

package/src/components/StudentCard/styles.tsx

@@ -0,0 +1,34 @@
+import { Box, Typography, styled } from '@mui/material'
+
+export const StyledCardBorder = styled(Box)(({ theme }) => ({
+  border: theme.borders.grayLight,
+  display: 'inline-block',
+  width: '100%',
+  height: 'auto',
+}))
+
+export const StyledSchoolHeader = styled(Box)(({ theme }) => ({
+  textAlign: 'center',
+}))
+
+export const StyledMainBox = styled(Box)({
+  display: 'flex',
+  marginTop: '30px',
+  gap: '10px',
+  alignItems: 'flex-end',
+  marginBottom: '20px',
+})
+
+export const StyledSearch = styled(Box)({
+  border: '1px solid #22222233 ',
+  padding: '7px',
+  maxHeight: '55px',
+  borderRadius: '10px',
+  width: '400px',
+})
+export const StyledSearchLabel = styled(Typography)({
+  fontSize: '14px',
+  fontWeight: 'bold',
+  margin: '0px 0px 3px 10px',
+  color: '#888888',
+})

package/src/components/index.ts

@@ -36,6 +36,7 @@ import { CustomDrawer } from './ModalButtons/DrawerButton'
 import ExcelJsonUpload from './ExcelToJsonInput/ExcelJsonUpload'
 import ExcelToJsonInput from './ExcelToJsonInput'
 import ApplicationProfile from './ApplicationProfile'
+import PrintStudentCard from './StudentCard'
 import PopoverButton from './ModalButtons/PopoverButton'
 export { default as Image } from './Image'
 export { default as PageHeader } from './PageHeader'
@@ -101,6 +102,7 @@ export {
   ExcelJsonUpload,
   ExcelToJsonInput,
   ApplicationProfile,
+  PrintStudentCard,
   PopoverButton,
 }
 

package/src/shared-state/PermissionsStore.ts

@@ -685,6 +685,11 @@ export enum Permission {
   CAN_HOSTEL_TICKETS_DELETE = 'can_hostel_tickets_delete',
   CAN_HOSTEL_TICKETS_ADD = 'can_hostel_tickets_add',
 
+  // Hosteler attendence
+  CAN_HOSTELER_ATTENDANCE_VIEW = 'can_hosteler_attendance_view',
+  CAN_HOSTELER_ATTENDANCE_EDIT = 'can_hosteler_attendance_edit',
+  CAN_HOSTELER_ATTENDANCE_ADD = 'can_hosteler_attendance_add',
+
   // Square
   // manage