gorbenko.pavel/tnsu-approval-route
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Feature/request type access (#23)
Tests / frontend-test (push) Successful in 49s
Details
Tests / backend-test (push) Successful in 1m38s
Details

Browse Source 
Co-authored-by: gorbenko.pavel <gorbenko.pavel@tansu.kz>
Reviewed-on: http://git.tnsu.kz/gorbenko.pavel/tnsu-approval-route/pulls/23
This commit was merged in pull request #23.
This commit is contained in:
gorbenko.pavel
2026-09-25 11:48:02 +00:00
parent 1bf8d4ca11
commit a8bfd9f456
20 changed files with 1067 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/webparts/approvalAdmin/components/screens/RequestTypeAccessScreen.module.scss
+12
View File
@@ -0,0 +1,12 @@
.filters {
display: flex;
flex-wrap: wrap;
gap: 18px;
margin-bottom: 18px;
}
.filterField {
min-width: 220px;
max-width: 320px;
flex: 1;
}
frontend/src/webparts/approvalAdmin/components/screens/RequestTypeAccessScreen.tsx
+236
View File
@@ -0,0 +1,236 @@
import * as React from 'react';
import styles from './RequestTypeAccessScreen.module.scss';
import { ApprovalRouteApi } from '../../services/api';
import { PortalDictionaryClient } from '../../services/portalDictionary';
import { texts } from '../../texts';
import { useRequestTypes } from '../../hooks/useRequestTypes';
import { useRequestTypeAccess } from '../../hooks/useRequestTypeAccess';
import { usePortalEmployees } from '../../hooks/usePortalEmployees';
import { useAsyncSubmit } from '../../hooks/useAsyncSubmit';
import { useDeleteTarget } from '../../hooks/useDeleteTarget';
import { useLocalStorageState } from '../../hooks/useLocalStorageState';
import { toEmployeeOption } from '../../utils/employee';
import { replaceRoute } from '../../routing';
import { RequestTypeAccess } from '../../models';
import {
ActionsCell,
Alert,
Breadcrumbs,
Button,
ConfirmDialog,
DataTable,
Field,
FormGrid,
FormModal,
IconButton,
PageHeader,
PrimaryCell,
SearchableSelect,
Select
} from '../ui';
export interface IRequestTypeAccessScreenProps {
api: ApprovalRouteApi;
dictionary?: PortalDictionaryClient;
/** Фильтры из ссылки (aaacctype/aaaccemail) — перекрывают сохранённые, если заданы. */
initialFilterRequestTypeId?: string;
initialFilterEmail?: string;
}
// Фильтры переживают перезагрузку — тот же приём, что и ROUTES_FILTER_STORAGE_KEY в RoutesScreen.
const ACCESS_FILTER_TYPE_STORAGE_KEY = 'approvalAdmin.accessFilterRequestTypeId';
const ACCESS_FILTER_EMAIL_STORAGE_KEY = 'approvalAdmin.accessFilterEmail';
export const RequestTypeAccessScreen: React.FC<IRequestTypeAccessScreenProps> = ({
api,
dictionary,
initialFilterRequestTypeId,
initialFilterEmail
}) => {
const requestTypes = useRequestTypes(api);
const access = useRequestTypeAccess(api);
const employees = usePortalEmployees(dictionary);
const [showForm, setShowForm] = React.useState(false);
const [requestTypeId, setRequestTypeId] = React.useState('');
const [email, setEmail] = React.useState('');
const submit = useAsyncSubmit();
const [filterRequestTypeId, setFilterRequestTypeId] = useLocalStorageState(ACCESS_FILTER_TYPE_STORAGE_KEY, '');
const [filterEmail, setFilterEmail] = useLocalStorageState(ACCESS_FILTER_EMAIL_STORAGE_KEY, '');
// Ссылка с фильтром сильнее сохранённого значения — только на монтировании
// (см. тот же приём в RoutesScreen).
React.useEffect(() => {
if (initialFilterRequestTypeId) setFilterRequestTypeId(initialFilterRequestTypeId);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
React.useEffect(() => {
if (initialFilterEmail) setFilterEmail(initialFilterEmail);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
// Держим адрес синхронным с фильтрами — отфильтрованную таблицу можно
// передать ссылкой. replaceRoute, а не navigate: смена фильтра не должна
// плодить записи в истории браузера.
React.useEffect(() => {
replaceRoute({ tab: 'requestTypeAccess', accessFilterRequestTypeId: filterRequestTypeId, accessFilterEmail: filterEmail });
}, [filterRequestTypeId, filterEmail]);
const deleteTarget = useDeleteTarget<RequestTypeAccess>(item => api.requestTypeAccess.remove(item.id), access.reload);
const requestTypeName = (id: number): string => requestTypes.items.find(rt => rt.id === id)?.name ?? `#${id}`;
const filteredItems = access.items.filter(item => {
if (filterRequestTypeId && String(item.requestTypeId) !== filterRequestTypeId) return false;
if (filterEmail && item.email.toLowerCase() !== filterEmail.toLowerCase()) return false;
return true;
});
// Список SharePoint нужно вручную открыть на чтение этому email — иначе доступ
// здесь настраивает только видимость в UI approval-route, но не в самом
// SharePoint (поиск по порталу отфильтрует чужие заявки правами списка).
const formatSharePointLists = (item: RequestTypeAccess): string =>
item.sharePointLists.length === 0
? texts.common.empty
: item.sharePointLists.map(l => l.title ?? l.listId).join(', ');
const openCreate = (): void => {
setRequestTypeId('');
setEmail('');
setShowForm(true);
};
const submitForm = (): void => {
if (!requestTypeId) {
submit.fail(texts.requestTypeAccess.validationRequestType);
return;
}
if (!email.trim()) {
submit.fail(texts.requestTypeAccess.validationEmail);
return;
}
submit.run(() =>
api.requestTypeAccess.create({ requestTypeId: Number(requestTypeId), email: email.trim() }).then(() => {
setShowForm(false);
access.reload();
})
);
};
return (
<div>
<Breadcrumbs items={[{ label: texts.common.home }, { label: texts.requestTypeAccess.breadcrumb }]} />
<PageHeader
icon="people"
subtitle={texts.requestTypeAccess.subtitle}
title={texts.requestTypeAccess.title}
actions={<Button variant="accent" icon="plus" onClick={openCreate}>{texts.requestTypeAccess.add}</Button>}
/>
<div className={styles.filters}>
<div className={styles.filterField}>
<Field label={texts.requestTypeAccess.filterRequestTypeLabel}>
<Select
options={requestTypes.items.map(rt => ({ value: String(rt.id), label: rt.name }))}
placeholder={texts.requestTypeAccess.filterRequestTypeAll}
value={filterRequestTypeId}
onChange={e => setFilterRequestTypeId(e.target.value)}
/>
</Field>
</div>
<div className={styles.filterField}>
<Field label={texts.requestTypeAccess.filterEmailLabel}>
<SearchableSelect
options={employees.items.map(toEmployeeOption)}
value={filterEmail}
loading={employees.isLoading}
allowClear
clearLabel={texts.requestTypeAccess.filterEmailAll}
placeholder={texts.requestTypeAccess.filterEmailPlaceholder}
searchPlaceholder={texts.select.employeeSearchPlaceholder}
emptyMessage={texts.select.employeesEmpty}
onChange={setFilterEmail}
/>
</Field>
</div>
</div>
{access.error && <Alert kind="err">{access.error}</Alert>}
{deleteTarget.error && <Alert kind="err">{deleteTarget.error}</Alert>}
<DataTable
columns={[
{ key: 'requestType', header: texts.requestTypeAccess.columnRequestType, render: r => <PrimaryCell>{requestTypeName(r.requestTypeId)}</PrimaryCell> },
{ key: 'email', header: texts.requestTypeAccess.columnEmail, render: r => r.email },
{ key: 'sharePointLists', header: texts.requestTypeAccess.columnSharePointLists, render: formatSharePointLists },
{
key: 'actions',
header: '',
width: '100px',
align: 'right',
sticky: true,
render: r => (
<ActionsCell>
<IconButton icon="trash" label={texts.common.remove} danger onClick={() => deleteTarget.ask(r)} />
</ActionsCell>
)
}
]}
rows={filteredItems}
keyOf={r => r.id}
emptyMessage={
access.isLoading
? texts.common.loading
: access.items.length > 0 && filteredItems.length === 0
? texts.requestTypeAccess.emptyFiltered
: texts.requestTypeAccess.emptyList
}
/>
{showForm && (
<FormModal
title={texts.requestTypeAccess.createTitle}
error={submit.error}
isSaving={submit.isBusy}
onSubmit={submitForm}
onClose={() => setShowForm(false)}
>
<FormGrid>
<Field label={texts.requestTypeAccess.requestTypeLabel} required full>
<Select
options={requestTypes.items.map(rt => ({ value: String(rt.id), label: rt.name }))}
placeholder={texts.requestTypeAccess.requestTypePlaceholder}
value={requestTypeId}
onChange={e => setRequestTypeId(e.target.value)}
/>
</Field>
<Field label={texts.requestTypeAccess.emailLabel} required full>
<SearchableSelect
options={employees.items.map(toEmployeeOption)}
value={email}
loading={employees.isLoading}
placeholder={texts.requestTypeAccess.emailPlaceholder}
searchPlaceholder={texts.select.employeeSearchPlaceholder}
emptyMessage={texts.select.employeesEmpty}
onChange={setEmail}
/>
</Field>
</FormGrid>
</FormModal>
)}
{deleteTarget.target && (
<ConfirmDialog
title={texts.requestTypeAccess.deleteTitle}
text={texts.requestTypeAccess.deleteText(deleteTarget.target.email, requestTypeName(deleteTarget.target.requestTypeId))}
confirmLabel={texts.common.remove}
busy={deleteTarget.isBusy}
onCancel={deleteTarget.cancel}
onConfirm={deleteTarget.confirm}
/>
)}
</div>
);
};