Merge pull request #145 from shancds/feature/project-finance
Feature/project finance
This commit is contained in:
@@ -35,7 +35,8 @@
|
||||
"ratecardsPluralText": "Rate Card Templates",
|
||||
"deleteConfirm": "Are you sure ?",
|
||||
"yes": "Yes",
|
||||
"no": "No"
|
||||
"no": "No",
|
||||
"alreadyImportedRateCardMessage": "A rate card has already been imported. Clear all imported rate cards to add a new one."
|
||||
|
||||
}
|
||||
|
||||
@@ -23,7 +23,8 @@ const RateCardAssigneeSelector = ({
|
||||
onChange,
|
||||
selectedMemberIds = [],
|
||||
memberlist = [],
|
||||
}: RateCardAssigneeSelectorProps) => {
|
||||
assignedMembers = [], // New prop: List of all assigned member IDs across all job titles
|
||||
}: RateCardAssigneeSelectorProps & { assignedMembers: string[] }) => {
|
||||
const membersInputRef = useRef<InputRef>(null);
|
||||
const [searchQuery, setSearchQuery] = useState('');
|
||||
const [members, setMembers] = useState<IProjectMemberViewModel[]>(memberlist);
|
||||
@@ -46,33 +47,39 @@ const RateCardAssigneeSelector = ({
|
||||
/>
|
||||
<List style={{ padding: 0, maxHeight: 200, overflow: 'auto' }}>
|
||||
{filteredMembers.length ? (
|
||||
filteredMembers.map((member) => (
|
||||
<List.Item
|
||||
key={member.id}
|
||||
style={{
|
||||
display: 'flex',
|
||||
gap: 8,
|
||||
alignItems: 'center',
|
||||
padding: '4px 8px',
|
||||
border: 'none',
|
||||
opacity: member.pending_invitation ? 0.5 : 1,
|
||||
justifyContent: 'flex-start',
|
||||
textAlign: 'left',
|
||||
}}
|
||||
>
|
||||
<Checkbox
|
||||
checked={selectedMemberIds.includes(member.id || '')}
|
||||
disabled={member.pending_invitation}
|
||||
onChange={() => onChange?.(member.id || '')}
|
||||
/>
|
||||
<SingleAvatar
|
||||
avatarUrl={member.avatar_url}
|
||||
name={member.name}
|
||||
email={member.email}
|
||||
/>
|
||||
<span>{member.name}</span>
|
||||
</List.Item>
|
||||
))
|
||||
filteredMembers.map((member) => {
|
||||
const isAssignedToAnotherJobTitle =
|
||||
assignedMembers.includes(member.id || '') &&
|
||||
!selectedMemberIds.includes(member.id || ''); // Check if the member is assigned elsewhere
|
||||
|
||||
return (
|
||||
<List.Item
|
||||
key={member.id}
|
||||
style={{
|
||||
display: 'flex',
|
||||
gap: 8,
|
||||
alignItems: 'center',
|
||||
padding: '4px 8px',
|
||||
border: 'none',
|
||||
opacity: member.pending_invitation || isAssignedToAnotherJobTitle ? 0.5 : 1,
|
||||
justifyContent: 'flex-start',
|
||||
textAlign: 'left',
|
||||
}}
|
||||
>
|
||||
<Checkbox
|
||||
checked={selectedMemberIds.includes(member.id || '')}
|
||||
disabled={member.pending_invitation || isAssignedToAnotherJobTitle}
|
||||
onChange={() => onChange?.(member.id || '')}
|
||||
/>
|
||||
<SingleAvatar
|
||||
avatarUrl={member.avatar_url}
|
||||
name={member.name}
|
||||
email={member.email}
|
||||
/>
|
||||
<span>{member.name}</span>
|
||||
</List.Item>
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<Empty description="No members found" />
|
||||
)}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Drawer, Typography, Button, Table, Menu, Flex, Spin } from 'antd';
|
||||
import { Drawer, Typography, Button, Table, Menu, Flex, Spin, Alert } from 'antd';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useAppSelector } from '../../../hooks/useAppSelector';
|
||||
@@ -85,32 +85,45 @@ const ImportRatecardsDrawer: React.FC = () => {
|
||||
}
|
||||
footer={
|
||||
<div style={{ textAlign: 'right' }}>
|
||||
<Button
|
||||
type="primary"
|
||||
disabled={rolesRedux.length !== 0}
|
||||
onClick={() => {
|
||||
if (!projectId) {
|
||||
// Handle missing project id (show error, etc.)
|
||||
return;
|
||||
}
|
||||
if (drawerRatecard?.jobRolesList?.length) {
|
||||
dispatch(
|
||||
insertProjectRateCardRoles({
|
||||
project_id: projectId,
|
||||
roles: drawerRatecard.jobRolesList
|
||||
.filter((role) => typeof role.rate !== 'undefined')
|
||||
.map((role) => ({
|
||||
...role,
|
||||
rate: Number(role.rate),
|
||||
})),
|
||||
})
|
||||
);
|
||||
}
|
||||
dispatch(toggleImportRatecardsDrawer());
|
||||
}}
|
||||
>
|
||||
{t('import')}
|
||||
</Button>
|
||||
{/* Alert message */}
|
||||
{rolesRedux.length !== 0 ? (
|
||||
<div style={{ textAlign: 'right' }}>
|
||||
<Alert
|
||||
message={t('alreadyImportedRateCardMessage') || 'A rate card has already been imported. Clear all imported rate cards to add a new one.'}
|
||||
type="warning"
|
||||
showIcon
|
||||
style={{ marginBottom: 16 }}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div style={{ textAlign: 'right' }}>
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
if (!projectId) {
|
||||
// Handle missing project id (show error, etc.)
|
||||
return;
|
||||
}
|
||||
if (drawerRatecard?.jobRolesList?.length) {
|
||||
dispatch(
|
||||
insertProjectRateCardRoles({
|
||||
project_id: projectId,
|
||||
roles: drawerRatecard.jobRolesList
|
||||
.filter((role) => typeof role.rate !== 'undefined')
|
||||
.map((role) => ({
|
||||
...role,
|
||||
rate: Number(role.rate),
|
||||
})),
|
||||
})
|
||||
);
|
||||
}
|
||||
dispatch(toggleImportRatecardsDrawer());
|
||||
}}
|
||||
>
|
||||
{t('import')}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
}
|
||||
open={isDrawerOpen}
|
||||
|
||||
@@ -307,16 +307,21 @@ const RatecardDrawer = ({
|
||||
},
|
||||
];
|
||||
|
||||
const handleDrawerClose = () => {
|
||||
if (!name || name.trim() === '' || name === 'Untitled Rate Card') {
|
||||
const handleDrawerClose = async() => {
|
||||
if (!name || name.trim() === '') {
|
||||
messageApi.open({
|
||||
type: 'warning',
|
||||
content: t('ratecardNameRequired') || 'Rate card name is required.',
|
||||
});
|
||||
return;
|
||||
} else if (hasChanges) {
|
||||
type: 'warning',
|
||||
content: t('ratecardNameRequired') || 'Rate card name is required.',
|
||||
});
|
||||
return;
|
||||
} else if (hasChanges) {
|
||||
setShowUnsavedAlert(true);
|
||||
} else {
|
||||
}
|
||||
else if (name === 'Untitled Rate Card' && roles.length === 0){
|
||||
await dispatch(deleteRateCard(ratecardId));
|
||||
dispatch(toggleRatecardDrawer());
|
||||
}
|
||||
else {
|
||||
dispatch(toggleRatecardDrawer());
|
||||
}
|
||||
};
|
||||
@@ -339,93 +344,93 @@ const RatecardDrawer = ({
|
||||
|
||||
return (
|
||||
<>
|
||||
{contextHolder}
|
||||
<Drawer
|
||||
loading={drawerLoading}
|
||||
onClose={handleDrawerClose}
|
||||
title={
|
||||
<Flex align="center" justify="space-between">
|
||||
<Typography.Text style={{ fontWeight: 500, fontSize: 16 }}>
|
||||
<Input
|
||||
value={name}
|
||||
placeholder="Enter rate card name"
|
||||
style={{
|
||||
fontWeight: 500,
|
||||
fontSize: 16,
|
||||
background: 'transparent',
|
||||
border: 'none',
|
||||
boxShadow: 'none',
|
||||
padding: 0,
|
||||
}}
|
||||
onChange={e => {
|
||||
setName(e.target.value);
|
||||
}}
|
||||
/>
|
||||
</Typography.Text>
|
||||
<Flex gap={8} align="center">
|
||||
<Typography.Text>{t('currency')}</Typography.Text>
|
||||
<Select
|
||||
value={currency}
|
||||
options={[
|
||||
{ value: 'USD', label: 'USD' },
|
||||
{ value: 'LKR', label: 'LKR' },
|
||||
{ value: 'INR', label: 'INR' },
|
||||
]}
|
||||
onChange={(value) => setCurrency(value)}
|
||||
/>
|
||||
<Button onClick={handleAddAllRoles} type="default">
|
||||
{t('addAllButton') || 'Add All'}
|
||||
{contextHolder}
|
||||
<Drawer
|
||||
loading={drawerLoading}
|
||||
onClose={handleDrawerClose}
|
||||
title={
|
||||
<Flex align="center" justify="space-between">
|
||||
<Typography.Text style={{ fontWeight: 500, fontSize: 16 }}>
|
||||
<Input
|
||||
value={name}
|
||||
placeholder="Enter rate card name"
|
||||
style={{
|
||||
fontWeight: 500,
|
||||
fontSize: 16,
|
||||
background: 'transparent',
|
||||
border: 'none',
|
||||
boxShadow: 'none',
|
||||
padding: 0,
|
||||
}}
|
||||
onChange={e => {
|
||||
setName(e.target.value);
|
||||
}}
|
||||
/>
|
||||
</Typography.Text>
|
||||
<Flex gap={8} align="center">
|
||||
<Typography.Text>{t('currency')}</Typography.Text>
|
||||
<Select
|
||||
value={currency}
|
||||
options={[
|
||||
{ value: 'USD', label: 'USD' },
|
||||
{ value: 'LKR', label: 'LKR' },
|
||||
{ value: 'INR', label: 'INR' },
|
||||
]}
|
||||
onChange={(value) => setCurrency(value)}
|
||||
/>
|
||||
<Button onClick={handleAddAllRoles} type="default">
|
||||
{t('addAllButton') || 'Add All'}
|
||||
</Button>
|
||||
</Flex>
|
||||
</Flex>
|
||||
}
|
||||
open={isDrawerOpen}
|
||||
width={700}
|
||||
footer={
|
||||
<Flex justify="end" gap={16} style={{ marginTop: 16 }}>
|
||||
<Button style={{ marginBottom: 24 }} onClick={handleSave} type="primary" disabled={name === '' || (name === 'Untitled Rate Card' && roles.length === 0)}>
|
||||
{t('saveButton')}
|
||||
</Button>
|
||||
</Flex>
|
||||
</Flex>
|
||||
}
|
||||
open={isDrawerOpen}
|
||||
width={700}
|
||||
footer={
|
||||
<Flex justify="end" gap={16} style={{ marginTop: 16 }}>
|
||||
<Button style={{ marginBottom: 24 }} onClick={handleSave} type="primary" disabled={name === '' || (name === 'Untitled Rate Card' && roles.length === 0)}>
|
||||
{t('saveButton')}
|
||||
</Button>
|
||||
</Flex>
|
||||
}
|
||||
>
|
||||
{showUnsavedAlert && (
|
||||
<Alert
|
||||
message={t('unsavedChangesTitle') || 'Unsaved Changes'}
|
||||
type="warning"
|
||||
showIcon
|
||||
closable
|
||||
onClose={() => setShowUnsavedAlert(false)}
|
||||
action={
|
||||
<Space direction="horizontal">
|
||||
<Button size="small" type="primary" onClick={handleConfirmSave}>
|
||||
Save
|
||||
</Button>
|
||||
<Button size="small" danger onClick={handleConfirmDiscard}>
|
||||
Discard
|
||||
</Button>
|
||||
</Space>
|
||||
}
|
||||
style={{ marginBottom: 16 }}
|
||||
/>
|
||||
)}
|
||||
<Table
|
||||
dataSource={roles}
|
||||
columns={columns}
|
||||
rowKey={(record) => record.job_title_id}
|
||||
pagination={false}
|
||||
footer={() => (
|
||||
<Button
|
||||
type="dashed"
|
||||
onClick={handleAddRole}
|
||||
block
|
||||
style={{ margin: 0, padding: 0 }}
|
||||
>
|
||||
{t('addRoleButton')}
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
{showUnsavedAlert && (
|
||||
<Alert
|
||||
message={t('unsavedChangesTitle') || 'Unsaved Changes'}
|
||||
type="warning"
|
||||
showIcon
|
||||
closable
|
||||
onClose={() => setShowUnsavedAlert(false)}
|
||||
action={
|
||||
<Space direction="horizontal">
|
||||
<Button size="small" type="primary" onClick={handleConfirmSave}>
|
||||
Save
|
||||
</Button>
|
||||
<Button size="small" danger onClick={handleConfirmDiscard}>
|
||||
Discard
|
||||
</Button>
|
||||
</Space>
|
||||
}
|
||||
style={{ marginBottom: 16 }}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Drawer>
|
||||
<Table
|
||||
dataSource={roles}
|
||||
columns={columns}
|
||||
rowKey={(record) => record.job_title_id}
|
||||
pagination={false}
|
||||
footer={() => (
|
||||
<Button
|
||||
type="dashed"
|
||||
onClick={handleAddRole}
|
||||
block
|
||||
style={{ margin: 0, padding: 0 }}
|
||||
>
|
||||
{t('addRoleButton')}
|
||||
</Button>
|
||||
)}
|
||||
/>
|
||||
</Drawer>
|
||||
</>
|
||||
|
||||
);
|
||||
|
||||
@@ -191,6 +191,10 @@ const RatecardTable: React.FC = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const assignedMembers = roles
|
||||
.flatMap((role) => role.members || [])
|
||||
.filter((memberId, index, self) => self.indexOf(memberId) === index);
|
||||
|
||||
// Columns
|
||||
const columns: TableProps<JobRoleType>['columns'] = [
|
||||
{
|
||||
@@ -267,6 +271,7 @@ const RatecardTable: React.FC = () => {
|
||||
selectedMemberIds={memberscol || []}
|
||||
onChange={(memberId) => handleMemberChange(memberId, index, record)}
|
||||
memberlist={members}
|
||||
assignedMembers={assignedMembers} // Pass assigned members here
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user