Search requests #2
@@ -3,7 +3,7 @@ import styles from './RequestPortal.module.scss';
|
|||||||
import type { IRequestPortalProps } from './IRequestPortalProps';
|
import type { IRequestPortalProps } from './IRequestPortalProps';
|
||||||
import { IconSprite } from '../shared/ui/Icon/IconSprite';
|
import { IconSprite } from '../shared/ui/Icon/IconSprite';
|
||||||
import { navigate, useRoute, NavSection } from '../shared/routing';
|
import { navigate, useRoute, NavSection } from '../shared/routing';
|
||||||
import { onRequestsChanged } from '../shared/requestEvents';
|
import { onRequestsChanged, emitRequestsChanged } from '../shared/requestEvents';
|
||||||
import { SideNav } from './SideNav/SideNav';
|
import { SideNav } from './SideNav/SideNav';
|
||||||
import { Drawer } from './Drawer/Drawer';
|
import { Drawer } from './Drawer/Drawer';
|
||||||
import { CategoryTabs } from './CategoryTabs/CategoryTabs';
|
import { CategoryTabs } from './CategoryTabs/CategoryTabs';
|
||||||
@@ -12,6 +12,7 @@ import { REQUEST_TYPES } from '../data/requests';
|
|||||||
import SubmitFeature from '../features/submit/SubmitFeature';
|
import SubmitFeature from '../features/submit/SubmitFeature';
|
||||||
import ApproveFeature from '../features/approve/ApproveFeature';
|
import ApproveFeature from '../features/approve/ApproveFeature';
|
||||||
import { RequestsTableView } from '../features/myRequests/RequestsTableView';
|
import { RequestsTableView } from '../features/myRequests/RequestsTableView';
|
||||||
|
import { SearchView } from '../features/myRequests/SearchView';
|
||||||
import { getPendingApproval } from '../features/myRequests/myRequests.service';
|
import { getPendingApproval } from '../features/myRequests/myRequests.service';
|
||||||
|
|
||||||
// Оболочка портала: тёмное боковое меню (разделы) + основная область.
|
// Оболочка портала: тёмное боковое меню (разделы) + основная область.
|
||||||
@@ -39,14 +40,18 @@ const RequestPortal: React.FC<IRequestPortalProps> = ({ hasTeamsContext, context
|
|||||||
});
|
});
|
||||||
|
|
||||||
// Счётчик на пункте «На согласовании». Обновляется по тому же событию, что и
|
// Счётчик на пункте «На согласовании». Обновляется по тому же событию, что и
|
||||||
// сами таблицы (создание заявки, решение согласующего).
|
// сами таблицы (создание заявки, решение согласующего), и на монтировании
|
||||||
|
// (в т.ч. на обновление страницы). Когда сама вкладка «На согласовании»
|
||||||
|
// открыта, RequestsTableView сообщает точное число через onMyTurnCountChange
|
||||||
|
// (ниже) — это перезаписывает значение отсюда, чтобы не было гонки между
|
||||||
|
// двумя независимыми запросами одних и тех же данных.
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
let cancelled = false;
|
let cancelled = false;
|
||||||
|
|
||||||
const load = (): void => {
|
const load = (): void => {
|
||||||
getPendingApproval(context)
|
getPendingApproval(context)
|
||||||
.then((r) => {
|
.then((r) => {
|
||||||
if (!cancelled) setApprovalsCount(r.rows.length);
|
if (!cancelled) setApprovalsCount(r.totalRows);
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
if (!cancelled) setApprovalsCount(undefined);
|
if (!cancelled) setApprovalsCount(undefined);
|
||||||
@@ -70,7 +75,14 @@ const RequestPortal: React.FC<IRequestPortalProps> = ({ hasTeamsContext, context
|
|||||||
}
|
}
|
||||||
}, [route.mode, route.formKey]);
|
}, [route.mode, route.formKey]);
|
||||||
|
|
||||||
const goto = (nav: NavSection): void => navigate({ mode: 'submit', nav });
|
const goto = (nav: NavSection): void => {
|
||||||
|
// Клик по УЖЕ активному пункту меню не меняет маршрут, значит эффект
|
||||||
|
// загрузки в таблице не перезапустится сам. Шлём событие обновления —
|
||||||
|
// таблица на него подписана и перечитает данные фоном, не убирая с экрана
|
||||||
|
// текущие строки (см. RequestsTableView/SearchView).
|
||||||
|
if (nav === route.nav && route.mode === 'submit') emitRequestsChanged();
|
||||||
|
navigate({ mode: 'submit', nav });
|
||||||
|
};
|
||||||
const closeDrawer = (): void => navigate({ mode: 'submit', nav: route.nav });
|
const closeDrawer = (): void => navigate({ mode: 'submit', nav: route.nav });
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -84,7 +96,6 @@ const RequestPortal: React.FC<IRequestPortalProps> = ({ hasTeamsContext, context
|
|||||||
approvalsCount={approvalsCount}
|
approvalsCount={approvalsCount}
|
||||||
collapsed={navCollapsed}
|
collapsed={navCollapsed}
|
||||||
onToggleCollapsed={() => setNavCollapsed((v) => !v)}
|
onToggleCollapsed={() => setNavCollapsed((v) => !v)}
|
||||||
userName={context.pageContext.user.displayName}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -108,6 +119,18 @@ const RequestPortal: React.FC<IRequestPortalProps> = ({ hasTeamsContext, context
|
|||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
|
) : route.nav === 'search' ? (
|
||||||
|
<SearchView
|
||||||
|
context={context}
|
||||||
|
onOpen={(request) =>
|
||||||
|
navigate({
|
||||||
|
mode: 'approve',
|
||||||
|
nav: route.nav,
|
||||||
|
formKey: request.formKey,
|
||||||
|
itemId: request.id,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
/>
|
||||||
) : (
|
) : (
|
||||||
<RequestsTableView
|
<RequestsTableView
|
||||||
context={context}
|
context={context}
|
||||||
@@ -120,6 +143,7 @@ const RequestPortal: React.FC<IRequestPortalProps> = ({ hasTeamsContext, context
|
|||||||
itemId: request.id,
|
itemId: request.id,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
onMyTurnCountChange={route.nav === 'approvals' ? setApprovalsCount : undefined}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
@@ -39,22 +39,6 @@
|
|||||||
min-width: 0;
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
|
||||||
flex-shrink: 0;
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
border-radius: $r-sm;
|
|
||||||
background: $gold-500;
|
|
||||||
color: $navy-950;
|
|
||||||
font-family: $font-serif;
|
|
||||||
font-weight: 700;
|
|
||||||
font-size: 12px;
|
|
||||||
letter-spacing: .5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.brandText {
|
.brandText {
|
||||||
font-family: $font-serif;
|
font-family: $font-serif;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
@@ -168,41 +152,3 @@
|
|||||||
top: 6px;
|
top: 6px;
|
||||||
right: 8px;
|
right: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
// ---- Подвал рейла: пользователь ----
|
|
||||||
.footer {
|
|
||||||
margin: auto $sp-4 0; // margin-top:auto прижимает к низу; по бокам — инсет для border-top
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: $sp-2;
|
|
||||||
padding-top: $sp-3;
|
|
||||||
border-top: 1px solid rgba(255, 255, 255, .08);
|
|
||||||
}
|
|
||||||
|
|
||||||
.navCollapsed .footer {
|
|
||||||
justify-content: center;
|
|
||||||
margin: auto 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
flex-shrink: 0;
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: rgba(255, 255, 255, .1);
|
|
||||||
color: $white;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
.userName {
|
|
||||||
min-width: 0;
|
|
||||||
color: rgba(255, 255, 255, .8);
|
|
||||||
font-size: 13px;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ const ITEMS: INavItem[] = [
|
|||||||
{ id: 'new', title: 'Новая заявка', icon: 'plus' },
|
{ id: 'new', title: 'Новая заявка', icon: 'plus' },
|
||||||
{ id: 'approvals', title: 'На согласовании', icon: 'user-check' },
|
{ id: 'approvals', title: 'На согласовании', icon: 'user-check' },
|
||||||
{ id: 'own', title: 'Мои заявки', icon: 'clipboard' },
|
{ id: 'own', title: 'Мои заявки', icon: 'clipboard' },
|
||||||
|
{ id: 'search', title: 'Поиск', icon: 'search' },
|
||||||
];
|
];
|
||||||
|
|
||||||
interface ISideNavProps {
|
interface ISideNavProps {
|
||||||
@@ -23,27 +24,16 @@ interface ISideNavProps {
|
|||||||
approvalsCount?: number;
|
approvalsCount?: number;
|
||||||
collapsed: boolean;
|
collapsed: boolean;
|
||||||
onToggleCollapsed: () => void;
|
onToggleCollapsed: () => void;
|
||||||
/** Имя текущего пользователя (для подвала рейла). */
|
|
||||||
userName?: string;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Инициалы для аватара (первые буквы двух первых слов имени).
|
// Тёмный боковой рейл портала на всю высоту: бренд сверху, разделы снизу.
|
||||||
function initials(name?: string): string {
|
// Сворачивается до узкой полосы с одними иконками.
|
||||||
if (!name) return '—';
|
|
||||||
const parts = name.trim().split(/\s+/).filter(Boolean);
|
|
||||||
const value = ((parts[0]?.[0] ?? '') + (parts[1]?.[0] ?? '')).toUpperCase();
|
|
||||||
return value || '—';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Тёмный боковой рейл портала на всю высоту: бренд сверху, разделы, пользователь
|
|
||||||
// снизу. Сворачивается до узкой полосы с одними иконками.
|
|
||||||
export const SideNav: React.FC<ISideNavProps> = ({
|
export const SideNav: React.FC<ISideNavProps> = ({
|
||||||
activeId,
|
activeId,
|
||||||
onChange,
|
onChange,
|
||||||
approvalsCount,
|
approvalsCount,
|
||||||
collapsed,
|
collapsed,
|
||||||
onToggleCollapsed,
|
onToggleCollapsed,
|
||||||
userName,
|
|
||||||
}) => {
|
}) => {
|
||||||
const navClasses = [styles.nav, collapsed ? styles.navCollapsed : ''].filter(Boolean).join(' ');
|
const navClasses = [styles.nav, collapsed ? styles.navCollapsed : ''].filter(Boolean).join(' ');
|
||||||
|
|
||||||
@@ -51,7 +41,6 @@ export const SideNav: React.FC<ISideNavProps> = ({
|
|||||||
<nav className={navClasses} aria-label="Разделы портала">
|
<nav className={navClasses} aria-label="Разделы портала">
|
||||||
<div className={styles.head}>
|
<div className={styles.head}>
|
||||||
<div className={styles.brand}>
|
<div className={styles.brand}>
|
||||||
<span className={styles.logo}>ТС</span>
|
|
||||||
{!collapsed && <span className={styles.brandText}>Портал заявок</span>}
|
{!collapsed && <span className={styles.brandText}>Портал заявок</span>}
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
@@ -89,11 +78,6 @@ export const SideNav: React.FC<ISideNavProps> = ({
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className={styles.footer} title={collapsed ? userName : undefined}>
|
|
||||||
<span className={styles.avatar}>{initials(userName)}</span>
|
|
||||||
{!collapsed && <span className={styles.userName}>{userName || 'Пользователь'}</span>}
|
|
||||||
</div>
|
|
||||||
</nav>
|
</nav>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -0,0 +1,50 @@
|
|||||||
|
@import '../../../../styles/design-tokens';
|
||||||
|
|
||||||
|
.pager {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: $sp-1;
|
||||||
|
margin-top: $sp-4;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagerBtn {
|
||||||
|
min-width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
padding: 0 8px;
|
||||||
|
border: 1px solid $gray-200;
|
||||||
|
border-radius: $r-sm;
|
||||||
|
background: $white;
|
||||||
|
color: $gray-700;
|
||||||
|
font-family: $font-sans;
|
||||||
|
font-size: $fs-sm;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: .16s;
|
||||||
|
|
||||||
|
&:hover:not(:disabled) {
|
||||||
|
border-color: $gold-400;
|
||||||
|
color: $gold-600;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
opacity: .4;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagerBtnActive {
|
||||||
|
background: $navy-800;
|
||||||
|
border-color: $navy-800;
|
||||||
|
color: $white;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: $navy-800 !important;
|
||||||
|
color: $white !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagerEllipsis {
|
||||||
|
color: $gray-400;
|
||||||
|
font-size: $fs-sm;
|
||||||
|
padding: 0 4px;
|
||||||
|
}
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
import styles from './Pager.module.scss';
|
||||||
|
|
||||||
|
export interface IPagerProps {
|
||||||
|
page: number;
|
||||||
|
totalPages: number;
|
||||||
|
onChange: (page: number) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Постраничная навигация: номера страниц + вперёд/назад. При большом
|
||||||
|
// количестве страниц показывает только соседние с текущей + первую/последнюю.
|
||||||
|
// Общий для всех разделов «Текущие заявки» (RequestsTableView, SearchView).
|
||||||
|
export const Pager: React.FC<IPagerProps> = ({ page, totalPages, onChange }) => {
|
||||||
|
if (totalPages <= 1) return null;
|
||||||
|
|
||||||
|
const numbers: number[] = [];
|
||||||
|
const from = Math.max(1, page - 2);
|
||||||
|
const to = Math.min(totalPages, page + 2);
|
||||||
|
for (let i = from; i <= to; i++) numbers.push(i);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={styles.pager}>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className={styles.pagerBtn}
|
||||||
|
disabled={page <= 1}
|
||||||
|
onClick={() => onChange(page - 1)}
|
||||||
|
aria-label="Предыдущая страница"
|
||||||
|
>
|
||||||
|
‹
|
||||||
|
</button>
|
||||||
|
{from > 1 && (
|
||||||
|
<>
|
||||||
|
<button type="button" className={styles.pagerBtn} onClick={() => onChange(1)}>
|
||||||
|
1
|
||||||
|
</button>
|
||||||
|
{from > 2 && <span className={styles.pagerEllipsis}>…</span>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
{numbers.map((n) => (
|
||||||
|
<button
|
||||||
|
key={n}
|
||||||
|
type="button"
|
||||||
|
className={`${styles.pagerBtn} ${n === page ? styles.pagerBtnActive : ''}`}
|
||||||
|
onClick={() => onChange(n)}
|
||||||
|
>
|
||||||
|
{n}
|
||||||
|
</button>
|
||||||
|
))}
|
||||||
|
{to < totalPages && (
|
||||||
|
<>
|
||||||
|
{to < totalPages - 1 && <span className={styles.pagerEllipsis}>…</span>}
|
||||||
|
<button type="button" className={styles.pagerBtn} onClick={() => onChange(totalPages)}>
|
||||||
|
{totalPages}
|
||||||
|
</button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className={styles.pagerBtn}
|
||||||
|
disabled={page >= totalPages}
|
||||||
|
onClick={() => onChange(page + 1)}
|
||||||
|
aria-label="Следующая страница"
|
||||||
|
>
|
||||||
|
›
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -193,52 +193,3 @@
|
|||||||
background: $gray-100;
|
background: $gray-100;
|
||||||
color: $gray-500;
|
color: $gray-500;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pager {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: $sp-1;
|
|
||||||
margin-top: $sp-4;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagerBtn {
|
|
||||||
min-width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
padding: 0 8px;
|
|
||||||
border: 1px solid $gray-200;
|
|
||||||
border-radius: $r-sm;
|
|
||||||
background: $white;
|
|
||||||
color: $gray-700;
|
|
||||||
font-family: $font-sans;
|
|
||||||
font-size: $fs-sm;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: .16s;
|
|
||||||
|
|
||||||
&:hover:not(:disabled) {
|
|
||||||
border-color: $gold-400;
|
|
||||||
color: $gold-600;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:disabled {
|
|
||||||
opacity: .4;
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagerBtnActive {
|
|
||||||
background: $navy-800;
|
|
||||||
border-color: $navy-800;
|
|
||||||
color: $white;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-color: $navy-800 !important;
|
|
||||||
color: $white !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagerEllipsis {
|
|
||||||
color: $gray-400;
|
|
||||||
font-size: $fs-sm;
|
|
||||||
padding: 0 4px;
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -1,9 +1,20 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||||
import { getLinkedTypes, getOwnRequests, getPendingApproval } from './myRequests.service';
|
import {
|
||||||
|
filterPendingByQuery,
|
||||||
|
getLinkedTypes,
|
||||||
|
getOwnRequests,
|
||||||
|
getPendingApproval,
|
||||||
|
getPendingApprovalIndex,
|
||||||
|
hydratePendingAuthors,
|
||||||
|
searchOwnRequests,
|
||||||
|
} from './myRequests.service';
|
||||||
import { IMyRequest } from './models/IMyRequest';
|
import { IMyRequest } from './models/IMyRequest';
|
||||||
import { REQUEST_STATUS, IRequestType } from '../../shared/approval';
|
import { REQUEST_STATUS, IRequestType } from '../../shared/approval';
|
||||||
import { onRequestsChanged } from '../../shared/requestEvents';
|
import { onRequestsChanged } from '../../shared/requestEvents';
|
||||||
|
import { usePersistedQuery, useDebouncedQuery } from '../../shared/usePersistedQuery';
|
||||||
|
import { IPage, pageKey, pageSignature, readPage, writePage } from './pageCache';
|
||||||
|
import { Pager } from './Pager';
|
||||||
import styles from './RequestsTableView.module.scss';
|
import styles from './RequestsTableView.module.scss';
|
||||||
|
|
||||||
const PAGE_SIZE = 20;
|
const PAGE_SIZE = 20;
|
||||||
@@ -14,6 +25,10 @@ export interface IRequestsTableViewProps {
|
|||||||
kind: 'approvals' | 'own';
|
kind: 'approvals' | 'own';
|
||||||
/** Клик по строке — открыть заявку (в выезжающей панели). */
|
/** Клик по строке — открыть заявку (в выезжающей панели). */
|
||||||
onOpen: (request: IMyRequest) => void;
|
onOpen: (request: IMyRequest) => void;
|
||||||
|
/** Точное число «ждут решения СЕЙЧАС» (kind='approvals', без поиска) — для
|
||||||
|
* счётчика в SideNav, чтобы не гонять для него отдельный параллельный
|
||||||
|
* запрос, который мог бы разойтись по времени с тем, что видно в таблице. */
|
||||||
|
onMyTurnCountChange?: (count: number) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatDate(iso: string): string {
|
function formatDate(iso: string): string {
|
||||||
@@ -41,70 +56,6 @@ function statusClass(status: string): string {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Постраничная навигация: номера страниц + вперёд/назад. При большом
|
|
||||||
// количестве страниц показывает только соседние с текущей + первую/последнюю.
|
|
||||||
const Pager: React.FC<{ page: number; totalPages: number; onChange: (page: number) => void }> = ({
|
|
||||||
page,
|
|
||||||
totalPages,
|
|
||||||
onChange,
|
|
||||||
}) => {
|
|
||||||
if (totalPages <= 1) return null;
|
|
||||||
|
|
||||||
const numbers: number[] = [];
|
|
||||||
const from = Math.max(1, page - 2);
|
|
||||||
const to = Math.min(totalPages, page + 2);
|
|
||||||
for (let i = from; i <= to; i++) numbers.push(i);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={styles.pager}>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
className={styles.pagerBtn}
|
|
||||||
disabled={page <= 1}
|
|
||||||
onClick={() => onChange(page - 1)}
|
|
||||||
aria-label="Предыдущая страница"
|
|
||||||
>
|
|
||||||
‹
|
|
||||||
</button>
|
|
||||||
{from > 1 && (
|
|
||||||
<>
|
|
||||||
<button type="button" className={styles.pagerBtn} onClick={() => onChange(1)}>
|
|
||||||
1
|
|
||||||
</button>
|
|
||||||
{from > 2 && <span className={styles.pagerEllipsis}>…</span>}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{numbers.map((n) => (
|
|
||||||
<button
|
|
||||||
key={n}
|
|
||||||
type="button"
|
|
||||||
className={`${styles.pagerBtn} ${n === page ? styles.pagerBtnActive : ''}`}
|
|
||||||
onClick={() => onChange(n)}
|
|
||||||
>
|
|
||||||
{n}
|
|
||||||
</button>
|
|
||||||
))}
|
|
||||||
{to < totalPages && (
|
|
||||||
<>
|
|
||||||
{to < totalPages - 1 && <span className={styles.pagerEllipsis}>…</span>}
|
|
||||||
<button type="button" className={styles.pagerBtn} onClick={() => onChange(totalPages)}>
|
|
||||||
{totalPages}
|
|
||||||
</button>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
className={styles.pagerBtn}
|
|
||||||
disabled={page >= totalPages}
|
|
||||||
onClick={() => onChange(page + 1)}
|
|
||||||
aria-label="Следующая страница"
|
|
||||||
>
|
|
||||||
›
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
// Таблица заявок. Клик в ЛЮБОМ месте строки открывает заявку (кликабельна вся
|
// Таблица заявок. Клик в ЛЮБОМ месте строки открывает заявку (кликабельна вся
|
||||||
// строка, а не только название), поэтому строка — <tr> с onClick + tabIndex
|
// строка, а не только название), поэтому строка — <tr> с onClick + tabIndex
|
||||||
// (доступ с клавиатуры: Enter/Space).
|
// (доступ с клавиатуры: Enter/Space).
|
||||||
@@ -166,24 +117,49 @@ const Table: React.FC<{
|
|||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
// Раздел с таблицей заявок: поиск по названию + постраничный вывод.
|
// Раздел с таблицей заявок: поиск по всем полям + вывод постранично.
|
||||||
//
|
//
|
||||||
// 'approvals' грузится целиком (алгоритм «чья сейчас очередь» требует видеть
|
// Движок выбирается по наличию текста в поиске, а не по разделу: БЕЗ запроса —
|
||||||
// весь маршрут заявки), поиск и пагинация — на клиенте.
|
// всегда обычный REST (мгновенно свежий, без задержки индексации), С запросом —
|
||||||
// 'own' идёт постранично через обычный REST (см. myRequests.service), поиск —
|
// всегда Search (полнотекстовый, но переиндексируется с задержкой). Раньше
|
||||||
// серверным OData-фильтром по Title.
|
// поиск подмешивал REST для «свежих» строк поверх Search — из-за этого
|
||||||
|
// результат мог быть неустойчивым (заявка то находилась, то нет, в зависимости
|
||||||
|
// от того, попала ли она в окно подстраховки); эту гибридную логику убрали.
|
||||||
|
//
|
||||||
|
// 'own' без поиска — getOwnRequests (REST по AuthorId, страница режется в
|
||||||
|
// памяти). 'own' с поиском — searchOwnRequests (Search, RowLimit/StartRow).
|
||||||
|
//
|
||||||
|
// 'approvals' без поиска — getPendingApproval, REST по ApproverId(+Status),
|
||||||
|
// страница нарезается на СЕРВЕРЕ (сам берёт нужный срез индекса и дочитывает
|
||||||
|
// автора только для него).
|
||||||
|
// 'approvals' с поиском — область расширяется до «где пользователь вообще есть
|
||||||
|
// в маршруте» (getPendingApprovalIndex, ПОЛНЫЙ список без автора — постранично
|
||||||
|
// его тут не взять, т.к. фильтрация текстом идёт уже после), затем текстовый
|
||||||
|
// фильтр через Search (filterPendingByQuery), и только после фильтрации —
|
||||||
|
// нарезка на страницы и дочитывание автора (hydratePendingAuthors) — тоже
|
||||||
|
// только для видимой страницы, а не для всего отфильтрованного набора.
|
||||||
//
|
//
|
||||||
// Оба варианта перечитываются по событию rp-requests-changed
|
// Оба варианта перечитываются по событию rp-requests-changed
|
||||||
// (shared/requestEvents) — после создания заявки и после решения согласующего.
|
// (shared/requestEvents) — после создания заявки и после решения согласующего.
|
||||||
export const RequestsTableView: React.FC<IRequestsTableViewProps> = ({ context, kind, onOpen }) => {
|
// Поиск идёт по индексу, поэтому свежая правка может проявиться не мгновенно.
|
||||||
|
export const RequestsTableView: React.FC<IRequestsTableViewProps> = ({
|
||||||
|
context,
|
||||||
|
kind,
|
||||||
|
onOpen,
|
||||||
|
onMyTurnCountChange,
|
||||||
|
}) => {
|
||||||
const [types, setTypes] = React.useState<IRequestType[] | undefined>(undefined);
|
const [types, setTypes] = React.useState<IRequestType[] | undefined>(undefined);
|
||||||
const [rows, setRows] = React.useState<IMyRequest[] | undefined>(undefined);
|
const [rows, setRows] = React.useState<IMyRequest[] | undefined>(undefined);
|
||||||
const [totalRows, setTotalRows] = React.useState<number>(0);
|
const [totalRows, setTotalRows] = React.useState<number>(0);
|
||||||
const [page, setPage] = React.useState<number>(1);
|
const [page, setPage] = React.useState<number>(1);
|
||||||
const [query, setQuery] = React.useState<string>('');
|
const [query, setQuery] = usePersistedQuery(kind);
|
||||||
const [error, setError] = React.useState<string>('');
|
const [error, setError] = React.useState<string>('');
|
||||||
|
// query — то, что в поле ввода (меняется сразу); debouncedQuery — то, что
|
||||||
|
// уходит в запрос (после паузы в наборе). Всё ниже завязано на debouncedQuery,
|
||||||
|
// иначе поиск бил бы запросом по каждой набранной букве.
|
||||||
|
const debouncedQuery = useDebouncedQuery(query);
|
||||||
|
|
||||||
React.useEffect(() => setPage(1), [query, kind]);
|
React.useEffect(() => setPage(1), [debouncedQuery, kind]);
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
let cancelled = false;
|
let cancelled = false;
|
||||||
@@ -202,45 +178,77 @@ export const RequestsTableView: React.FC<IRequestsTableViewProps> = ({ context,
|
|||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (types === undefined) return;
|
if (types === undefined) return;
|
||||||
let cancelled = false;
|
let cancelled = false;
|
||||||
|
const cacheKey = pageKey('table', [kind, debouncedQuery.trim(), page]);
|
||||||
|
|
||||||
const load = (): void => {
|
// Сразу показываем то, что уже загружали для ЭТОЙ вкладки (и этого запроса
|
||||||
const request =
|
// и страницы), а обновление идёт фоном. Компонент один на обе вкладки —
|
||||||
kind === 'own'
|
// без кеша при переключении на экране оставались бы строки предыдущей
|
||||||
? getOwnRequests(context, types, query, page).then((r) => ({ rows: r.rows, total: r.totalRows }))
|
// вкладки, пока не придёт ответ. Если для этой вкладки данных ещё нет —
|
||||||
: getPendingApproval(context).then((r) => {
|
// rows становится undefined, и показывается «Загрузка…».
|
||||||
console.table(r.debug);
|
const cached = readPage(cacheKey);
|
||||||
return { rows: r.rows, total: r.rows.length };
|
setRows(cached ? cached.rows : undefined);
|
||||||
});
|
setTotalRows(cached ? cached.totalRows : 0);
|
||||||
|
|
||||||
request
|
const fetchPage = async (): Promise<IPage> => {
|
||||||
.then((result) => {
|
if (kind === 'own') {
|
||||||
if (cancelled) return;
|
return debouncedQuery.trim().length > 0
|
||||||
setRows(result.rows);
|
? searchOwnRequests(context, types, debouncedQuery, page)
|
||||||
setTotalRows(result.total);
|
: getOwnRequests(context, types, page);
|
||||||
setError('');
|
}
|
||||||
})
|
|
||||||
.catch((e) => {
|
if (debouncedQuery.trim().length === 0) {
|
||||||
if (!cancelled) setError((e as Error).message);
|
// Без поиска — страница уже нарезана и дочитана сервером.
|
||||||
});
|
const r = await getPendingApproval(context, 'myTurn', page);
|
||||||
|
return { rows: r.rows, totalRows: r.totalRows };
|
||||||
|
}
|
||||||
|
|
||||||
|
// С поиском — сначала полный список «где я есть в маршруте» (без
|
||||||
|
// автора), фильтруем текстом, и только потом режем на страницы и
|
||||||
|
// дочитываем автора — только для видимой страницы.
|
||||||
|
const idx = await getPendingApprovalIndex(context, 'involved');
|
||||||
|
const filtered = await filterPendingByQuery(context, idx.types, idx.rows, debouncedQuery);
|
||||||
|
const pageRows = filtered.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
|
||||||
|
await hydratePendingAuthors(context, idx.types, pageRows);
|
||||||
|
return { rows: pageRows, totalRows: filtered.length };
|
||||||
};
|
};
|
||||||
|
|
||||||
load();
|
const load = async (): Promise<void> => {
|
||||||
const unsubscribe = onRequestsChanged(load);
|
try {
|
||||||
|
const fresh = await fetchPage();
|
||||||
|
if (cancelled) return;
|
||||||
|
|
||||||
|
// Перерисовываем, только если данные реально изменились — иначе при
|
||||||
|
// каждом возврате на вкладку таблица моргала бы, перерисовываясь тем же
|
||||||
|
// самым содержимым.
|
||||||
|
const prev = readPage(cacheKey);
|
||||||
|
if (!prev || pageSignature(prev) !== pageSignature(fresh)) {
|
||||||
|
writePage(cacheKey, fresh);
|
||||||
|
setRows(fresh.rows);
|
||||||
|
setTotalRows(fresh.totalRows);
|
||||||
|
}
|
||||||
|
setError('');
|
||||||
|
if (onMyTurnCountChange && kind === 'approvals' && debouncedQuery.trim().length === 0) {
|
||||||
|
onMyTurnCountChange(fresh.totalRows);
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
if (!cancelled) setError((e as Error).message);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
load().catch(() => undefined); // ошибки уже обработаны внутри load через setError
|
||||||
|
const unsubscribe = onRequestsChanged(() => {
|
||||||
|
load().catch(() => undefined);
|
||||||
|
});
|
||||||
return () => {
|
return () => {
|
||||||
cancelled = true;
|
cancelled = true;
|
||||||
unsubscribe();
|
unsubscribe();
|
||||||
};
|
};
|
||||||
}, [context, types, kind, query, page]);
|
}, [context, types, kind, debouncedQuery, page]);
|
||||||
|
|
||||||
// 'approvals' приходит целиком — фильтруем и нарезаем страницы на клиенте.
|
// Обе ветки теперь отдают уже нарезанную страницу — просто показываем как есть.
|
||||||
const q = query.trim().toLowerCase();
|
const q = debouncedQuery.trim();
|
||||||
let visible = rows || [];
|
const total = totalRows;
|
||||||
let total = totalRows;
|
const visible = rows || [];
|
||||||
if (kind === 'approvals' && rows) {
|
|
||||||
const filtered = q ? rows.filter((r) => r.title.toLowerCase().indexOf(q) !== -1) : rows;
|
|
||||||
total = filtered.length;
|
|
||||||
visible = filtered.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
|
|
||||||
}
|
|
||||||
const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
|
const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
|
||||||
|
|
||||||
const heading = kind === 'approvals' ? 'Ждут вашего решения' : 'Мои заявки';
|
const heading = kind === 'approvals' ? 'Ждут вашего решения' : 'Мои заявки';
|
||||||
@@ -255,7 +263,7 @@ export const RequestsTableView: React.FC<IRequestsTableViewProps> = ({ context,
|
|||||||
<input
|
<input
|
||||||
type="search"
|
type="search"
|
||||||
className={styles.search}
|
className={styles.search}
|
||||||
placeholder="Поиск по названию…"
|
placeholder="Поиск по заявкам…"
|
||||||
value={query}
|
value={query}
|
||||||
onChange={(e) => setQuery(e.target.value)}
|
onChange={(e) => setQuery(e.target.value)}
|
||||||
/>
|
/>
|
||||||
@@ -266,7 +274,7 @@ export const RequestsTableView: React.FC<IRequestsTableViewProps> = ({ context,
|
|||||||
{!error && rows && total === 0 && (
|
{!error && rows && total === 0 && (
|
||||||
<div className={styles.empty}>
|
<div className={styles.empty}>
|
||||||
{q
|
{q
|
||||||
? `По запросу «${query}» ничего не найдено.`
|
? `По запросу «${debouncedQuery}» ничего не найдено.`
|
||||||
: kind === 'approvals'
|
: kind === 'approvals'
|
||||||
? 'Нет заявок, ждущих вашего решения.'
|
? 'Нет заявок, ждущих вашего решения.'
|
||||||
: 'Вы ещё не создавали заявок.'}
|
: 'Вы ещё не создавали заявок.'}
|
||||||
|
|||||||
@@ -0,0 +1,203 @@
|
|||||||
|
@import '../../../../styles/design-tokens';
|
||||||
|
|
||||||
|
.view {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: $sp-4;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin-bottom: $sp-4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.heading {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: $sp-3;
|
||||||
|
margin: 0;
|
||||||
|
font-family: $font-serif;
|
||||||
|
font-size: $fs-page-title;
|
||||||
|
font-weight: 600;
|
||||||
|
color: $navy-900;
|
||||||
|
}
|
||||||
|
|
||||||
|
.count {
|
||||||
|
padding: 2px 10px;
|
||||||
|
border-radius: $r-full;
|
||||||
|
background: $navy-100;
|
||||||
|
color: $navy-700;
|
||||||
|
font-family: $font-sans;
|
||||||
|
font-size: $fs-label;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 420px;
|
||||||
|
max-width: 100%;
|
||||||
|
padding: 9px 13px;
|
||||||
|
border: 1px solid $gray-300;
|
||||||
|
border-radius: $r-sm;
|
||||||
|
background: $white;
|
||||||
|
font-family: $font-sans;
|
||||||
|
font-size: $fs-sm;
|
||||||
|
color: $gray-900;
|
||||||
|
transition: .18s;
|
||||||
|
|
||||||
|
@include input-focus-gold;
|
||||||
|
|
||||||
|
&::placeholder {
|
||||||
|
color: $gray-400;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty,
|
||||||
|
.error {
|
||||||
|
padding: $sp-6;
|
||||||
|
background: $white;
|
||||||
|
border: 1px solid $gray-200;
|
||||||
|
border-radius: $r-md;
|
||||||
|
color: $gray-500;
|
||||||
|
font-size: $fs-sm;
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: $red-500;
|
||||||
|
border-color: $red-500;
|
||||||
|
background: $red-50;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableWrap {
|
||||||
|
background: $white;
|
||||||
|
border: 1px solid $gray-200;
|
||||||
|
border-radius: $r-md;
|
||||||
|
box-shadow: $sh-1;
|
||||||
|
overflow: hidden;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: $fs-sm;
|
||||||
|
|
||||||
|
th {
|
||||||
|
text-align: left;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: $gray-50;
|
||||||
|
border-bottom: 1px solid $gray-200;
|
||||||
|
color: $gray-500;
|
||||||
|
font-size: $fs-label;
|
||||||
|
font-weight: 600;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: .04em;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
padding: 14px 16px;
|
||||||
|
border-bottom: 1px solid $gray-100;
|
||||||
|
color: $gray-900;
|
||||||
|
vertical-align: middle;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
word-break: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
tbody tr:last-child td {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Кликабельна вся строка (см. SearchView — onClick на <tr>).
|
||||||
|
.row {
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background .16s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: $gold-50;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus-visible {
|
||||||
|
outline: 2px solid $gold-500;
|
||||||
|
outline-offset: -2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.colId {
|
||||||
|
width: 70px;
|
||||||
|
color: $gray-400;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colType {
|
||||||
|
width: 170px;
|
||||||
|
color: $navy-700;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colTitle {
|
||||||
|
min-width: 220px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colDate {
|
||||||
|
width: 100px;
|
||||||
|
color: $gray-500;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colAuthor {
|
||||||
|
width: 220px;
|
||||||
|
color: $gray-500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colStatus {
|
||||||
|
width: 170px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colKind {
|
||||||
|
width: 110px;
|
||||||
|
color: $gray-400;
|
||||||
|
font-size: $fs-caption;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 3px 10px;
|
||||||
|
border-radius: $r-md;
|
||||||
|
font-size: $fs-caption;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusDraft {
|
||||||
|
background: $gray-100;
|
||||||
|
color: $gray-700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusOnApproval {
|
||||||
|
background: $gold-100;
|
||||||
|
color: $gold-600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusApproved {
|
||||||
|
background: $green-50;
|
||||||
|
color: $green-600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusRejected {
|
||||||
|
background: $red-50;
|
||||||
|
color: $red-500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusReturned {
|
||||||
|
background: $blue-50;
|
||||||
|
color: $blue-600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusDefault {
|
||||||
|
background: $gray-100;
|
||||||
|
color: $gray-500;
|
||||||
|
}
|
||||||
@@ -0,0 +1,212 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||||
|
import { getLinkedTypes, searchMyRequests } from './myRequests.service';
|
||||||
|
import { IMyRequest } from './models/IMyRequest';
|
||||||
|
import { REQUEST_STATUS, IRequestType } from '../../shared/approval';
|
||||||
|
import { onRequestsChanged } from '../../shared/requestEvents';
|
||||||
|
import { usePersistedQuery, useDebouncedQuery } from '../../shared/usePersistedQuery';
|
||||||
|
import { pageKey, pageSignature, readPage, writePage } from './pageCache';
|
||||||
|
import { Pager } from './Pager';
|
||||||
|
import styles from './SearchView.module.scss';
|
||||||
|
|
||||||
|
const PAGE_SIZE = 20;
|
||||||
|
|
||||||
|
export interface ISearchViewProps {
|
||||||
|
context: WebPartContext;
|
||||||
|
/** Клик по строке — открыть заявку (в выезжающей панели). */
|
||||||
|
onOpen: (request: IMyRequest) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatDate(iso: string): string {
|
||||||
|
if (!iso) return '';
|
||||||
|
const d = new Date(iso);
|
||||||
|
const dd = d.getDate() < 10 ? `0${d.getDate()}` : `${d.getDate()}`;
|
||||||
|
const mm = d.getMonth() + 1 < 10 ? `0${d.getMonth() + 1}` : `${d.getMonth() + 1}`;
|
||||||
|
return `${dd}.${mm}.${d.getFullYear()}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function statusClass(status: string): string {
|
||||||
|
switch (status) {
|
||||||
|
case REQUEST_STATUS.approved:
|
||||||
|
return styles.statusApproved;
|
||||||
|
case REQUEST_STATUS.rejected:
|
||||||
|
return styles.statusRejected;
|
||||||
|
case REQUEST_STATUS.returned:
|
||||||
|
return styles.statusReturned;
|
||||||
|
case REQUEST_STATUS.onApproval:
|
||||||
|
return styles.statusOnApproval;
|
||||||
|
case REQUEST_STATUS.draft:
|
||||||
|
return styles.statusDraft;
|
||||||
|
default:
|
||||||
|
return styles.statusDefault;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// В отличие от RequestsTableView (где по смыслу раздела нужно либо Автор,
|
||||||
|
// либо Статус) — здесь смешаны «свои» и «где участвовал» заявки, поэтому
|
||||||
|
// показываем обе колонки сразу, плюс небольшая метка «Автор/Согласование» —
|
||||||
|
// чтобы было видно, откуда строка (kind), не только по автору.
|
||||||
|
const Table: React.FC<{ rows: IMyRequest[]; onOpen: (request: IMyRequest) => void }> = ({ rows, onOpen }) => (
|
||||||
|
<div className={styles.tableWrap}>
|
||||||
|
<table className={styles.table}>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th className={styles.colId}>ID</th>
|
||||||
|
<th className={styles.colType}>Тип</th>
|
||||||
|
<th className={styles.colTitle}>Название</th>
|
||||||
|
<th className={styles.colDate}>Дата</th>
|
||||||
|
<th className={styles.colAuthor}>Автор</th>
|
||||||
|
<th className={styles.colStatus}>Статус</th>
|
||||||
|
<th className={styles.colKind}>Роль</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{rows.map((r) => (
|
||||||
|
<tr
|
||||||
|
className={styles.row}
|
||||||
|
key={`${r.requestTypeId}-${r.id}`}
|
||||||
|
tabIndex={0}
|
||||||
|
role="button"
|
||||||
|
aria-label={`Открыть заявку «${r.title || r.id}»`}
|
||||||
|
onClick={() => onOpen(r)}
|
||||||
|
onKeyDown={(e) => {
|
||||||
|
if (e.key === 'Enter' || e.key === ' ') {
|
||||||
|
e.preventDefault();
|
||||||
|
onOpen(r);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<td className={styles.colId}>{r.id}</td>
|
||||||
|
<td className={styles.colType}>{r.requestTypeName}</td>
|
||||||
|
<td className={styles.colTitle}>{r.title || `#${r.id}`}</td>
|
||||||
|
<td className={styles.colDate}>{formatDate(r.created)}</td>
|
||||||
|
<td className={styles.colAuthor}>
|
||||||
|
{[r.authorName, r.authorEmail].filter(Boolean).join(' · ') || '—'}
|
||||||
|
</td>
|
||||||
|
<td className={styles.colStatus}>
|
||||||
|
<span className={`${styles.status} ${statusClass(r.status)}`}>{r.status || '—'}</span>
|
||||||
|
</td>
|
||||||
|
<td className={styles.colKind}>{r.kind === 'own' ? 'Создал(а) я' : 'Участвую'}</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
// Вкладка «Поиск»: ищет сразу и среди своих заявок, и среди тех, где
|
||||||
|
// пользователь участвует как согласующий (независимо от того, дошла ли уже
|
||||||
|
// очередь) — единым списком, с колонками Автор и Статус одновременно (см.
|
||||||
|
// searchMyRequests в myRequests.service.ts). Без введённого текста — пусто,
|
||||||
|
// это не список «на экран по умолчанию», а именно поиск.
|
||||||
|
//
|
||||||
|
// Перечитывается по событию rp-requests-changed (после создания заявки и
|
||||||
|
// после решения согласующего) — но т.к. это по большей части Search, свежая
|
||||||
|
// правка может проявиться не мгновенно (частично компенсируется довеском
|
||||||
|
// последних 10 минут через REST — см. myRequests.service.ts).
|
||||||
|
export const SearchView: React.FC<ISearchViewProps> = ({ context, onOpen }) => {
|
||||||
|
const [types, setTypes] = React.useState<IRequestType[] | undefined>(undefined);
|
||||||
|
const [rows, setRows] = React.useState<IMyRequest[] | undefined>(undefined);
|
||||||
|
const [totalRows, setTotalRows] = React.useState<number>(0);
|
||||||
|
const [page, setPage] = React.useState<number>(1);
|
||||||
|
const [query, setQuery] = usePersistedQuery('search');
|
||||||
|
// query — то, что в поле ввода (меняется сразу); debouncedQuery — то, что
|
||||||
|
// уходит в запрос (после паузы в наборе). Здесь это особенно важно: поиск
|
||||||
|
// ходит сразу по двум источникам (свои заявки + где участвую), то есть
|
||||||
|
// каждая набранная буква стоила бы двух серий запросов.
|
||||||
|
const debouncedQuery = useDebouncedQuery(query);
|
||||||
|
const [error, setError] = React.useState<string>('');
|
||||||
|
|
||||||
|
React.useEffect(() => setPage(1), [debouncedQuery]);
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
let cancelled = false;
|
||||||
|
getLinkedTypes(context)
|
||||||
|
.then((t) => {
|
||||||
|
if (!cancelled) setTypes(t);
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
if (!cancelled) setError((e as Error).message);
|
||||||
|
});
|
||||||
|
return () => {
|
||||||
|
cancelled = true;
|
||||||
|
};
|
||||||
|
}, [context]);
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
if (types === undefined) return;
|
||||||
|
if (debouncedQuery.trim().length === 0) {
|
||||||
|
setRows(undefined);
|
||||||
|
setTotalRows(0);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let cancelled = false;
|
||||||
|
const cacheKey = pageKey('search', [debouncedQuery.trim(), page]);
|
||||||
|
|
||||||
|
// Уже искали это раньше — показываем прежний результат сразу, обновление
|
||||||
|
// идёт фоном (см. RequestsTableView, там та же схема и те же причины).
|
||||||
|
const cached = readPage(cacheKey);
|
||||||
|
setRows(cached ? cached.rows : undefined);
|
||||||
|
setTotalRows(cached ? cached.totalRows : 0);
|
||||||
|
|
||||||
|
const load = async (): Promise<void> => {
|
||||||
|
try {
|
||||||
|
const fresh = await searchMyRequests(context, types, debouncedQuery, page);
|
||||||
|
if (cancelled) return;
|
||||||
|
const prev = readPage(cacheKey);
|
||||||
|
if (!prev || pageSignature(prev) !== pageSignature(fresh)) {
|
||||||
|
writePage(cacheKey, fresh);
|
||||||
|
setRows(fresh.rows);
|
||||||
|
setTotalRows(fresh.totalRows);
|
||||||
|
}
|
||||||
|
setError('');
|
||||||
|
} catch (e) {
|
||||||
|
if (!cancelled) setError((e as Error).message);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
load().catch(() => undefined);
|
||||||
|
const unsubscribe = onRequestsChanged(() => {
|
||||||
|
load().catch(() => undefined);
|
||||||
|
});
|
||||||
|
return () => {
|
||||||
|
cancelled = true;
|
||||||
|
unsubscribe();
|
||||||
|
};
|
||||||
|
}, [context, types, debouncedQuery, page]);
|
||||||
|
|
||||||
|
const hasQuery = debouncedQuery.trim().length > 0;
|
||||||
|
const totalPages = Math.max(1, Math.ceil(totalRows / PAGE_SIZE));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section className={styles.view}>
|
||||||
|
<div className={styles.head}>
|
||||||
|
<h2 className={styles.heading}>
|
||||||
|
Поиск
|
||||||
|
{hasQuery && rows && <span className={styles.count}>{totalRows}</span>}
|
||||||
|
</h2>
|
||||||
|
<input
|
||||||
|
type="search"
|
||||||
|
className={styles.search}
|
||||||
|
placeholder="Введите текст — ищем по своим заявкам и по тем, где вы участвуете…"
|
||||||
|
value={query}
|
||||||
|
onChange={(e) => setQuery(e.target.value)}
|
||||||
|
autoFocus
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{error && <div className={styles.error}>Не удалось выполнить поиск: {error}</div>}
|
||||||
|
{!error && !hasQuery && <div className={styles.empty}>Введите текст, чтобы начать поиск.</div>}
|
||||||
|
{!error && hasQuery && rows === undefined && <div className={styles.empty}>Ищем…</div>}
|
||||||
|
{!error && hasQuery && rows && totalRows === 0 && (
|
||||||
|
<div className={styles.empty}>По запросу «{debouncedQuery}» ничего не найдено.</div>
|
||||||
|
)}
|
||||||
|
{!error && hasQuery && rows && totalRows > 0 && (
|
||||||
|
<>
|
||||||
|
<Table rows={rows} onOpen={onOpen} />
|
||||||
|
<Pager page={page} totalPages={totalPages} onChange={setPage} />
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -1,8 +1,10 @@
|
|||||||
import { spfi, SPFx } from '@pnp/sp';
|
import { spForSite } from '../../shared/pnp/pnpjs';
|
||||||
import '@pnp/sp/webs';
|
import '@pnp/sp/webs';
|
||||||
import '@pnp/sp/lists';
|
import '@pnp/sp/lists';
|
||||||
|
import { IList } from '@pnp/sp/lists';
|
||||||
import '@pnp/sp/items';
|
import '@pnp/sp/items';
|
||||||
import '@pnp/sp/site-users/web';
|
import '@pnp/sp/site-users/web';
|
||||||
|
import '@pnp/sp/search';
|
||||||
import { WebPartContext } from '@microsoft/sp-webpart-base';
|
import { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||||
import { getRequestTypes, IRequestType, REQUEST_STATUS } from '../../shared/approval';
|
import { getRequestTypes, IRequestType, REQUEST_STATUS } from '../../shared/approval';
|
||||||
import { IMyRequest } from './models/IMyRequest';
|
import { IMyRequest } from './models/IMyRequest';
|
||||||
@@ -12,11 +14,28 @@ import { IMyRequestsTypeDebug } from './models/IMyRequestsDebug';
|
|||||||
// (конвенция именования; см. forms/*/provisioning.json и forms/*/approval/provisioning.json).
|
// (конвенция именования; см. forms/*/provisioning.json и forms/*/approval/provisioning.json).
|
||||||
const DATA_LIST_SUFFIX = /\s*—\s*данные\s*$/;
|
const DATA_LIST_SUFFIX = /\s*—\s*данные\s*$/;
|
||||||
|
|
||||||
interface IApprovalStep {
|
// Свежие заявки/строки (созданы или изменены недавно) поисковый индекс может
|
||||||
status: string;
|
// ещё не проиндексировать — такие добираем обычным REST-ом напрямую, в обход
|
||||||
order?: number;
|
// Search, и подмешиваем к результату (см. indexApprovalsForType/myTurn,
|
||||||
approverEmail: string;
|
// getFreshOwnRowsForType). Используется ТОЛЬКО в паре с Search (гибрид для
|
||||||
}
|
// таблиц без текстового запроса — там, где важны и масштаб, и мгновенная
|
||||||
|
// свежесть); при поиске по тексту эта подстраховка не применяется (см. RequestsTableView).
|
||||||
|
const RECENT_MS = 10 * 60 * 1000;
|
||||||
|
|
||||||
|
// Сколько строк согласования максимум забираем из Search за один запрос
|
||||||
|
// (см. getInvolvedRowsViaSearch). Постраничного перебора здесь нет: набор
|
||||||
|
// целиком уходит в слияние и сортировку по дате заявки, поэтому при превышении
|
||||||
|
// лимита пишем предупреждение в лог, а не молча обрезаем.
|
||||||
|
const SEARCH_ROW_LIMIT = 500;
|
||||||
|
|
||||||
|
// Managed properties списка согласования. Имена включают группу колонок сайта
|
||||||
|
// (TansuSite) — SharePoint генерирует их так, поэтому «ожидаемого»
|
||||||
|
// ApproverOWSUSER в схеме поиска не находилось (разбирались 2026-08-06).
|
||||||
|
// Суффикс — тип исходного поля: OWSUSER для Person/Group.
|
||||||
|
const MP_APPROVER = 'TansuSiteApproverOWSUSER';
|
||||||
|
// Статус строки маршрута — Choice-поле, отсюда суффикс OWSCHCS (подтверждено
|
||||||
|
// отладочным перебором 2026-08-06; у Person-полей он OWSUSER, см. MP_APPROVER).
|
||||||
|
const MP_STATUS = 'RequestStatusOWSCHCS';
|
||||||
|
|
||||||
export function currentUserEmail(context: WebPartContext): string {
|
export function currentUserEmail(context: WebPartContext): string {
|
||||||
return (context.pageContext.user.email || '').toLowerCase();
|
return (context.pageContext.user.email || '').toLowerCase();
|
||||||
@@ -28,32 +47,114 @@ export async function getLinkedTypes(context: WebPartContext): Promise<IRequestT
|
|||||||
return types.filter((t) => !!t.listId && !!t.siteUrl);
|
return types.filter((t) => !!t.listId && !!t.siteUrl);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Что показывать в разделе «На согласовании»:
|
||||||
|
// 'myTurn' — только заявки, где очередь дошла до текущего пользователя
|
||||||
|
// (обычный режим, когда поиск не задан);
|
||||||
|
// 'involved' — все заявки, где он вообще есть в маршруте (уже согласовал,
|
||||||
|
// ждёт своей очереди и т.п.) — так поиск ищет по всему, в чём
|
||||||
|
// пользователь участвует или будет участвовать.
|
||||||
|
export type ApprovalScope = 'myTurn' | 'involved';
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// «Ждёт вашего решения» — требует видеть ВЕСЬ маршрут заявки, чтобы понять,
|
// «На согласовании» — раньше сюда приходилось читать ВЕСЬ список согласования
|
||||||
// чья сейчас очередь, поэтому идёт обычным REST-запросом (не через Search),
|
// (иначе на клиенте нечем было посчитать «чья очередь»). Теперь очередь
|
||||||
// целиком за один раз. Пагинация по этому результату — на стороне панели
|
// проставляется при создании/решении (см. approvalList.service.ts/createSteps,
|
||||||
// (клиентская нарезка по страницам), т.к. сам список обычно небольшой
|
// approverDecision.service.ts/decide) — «чья сейчас очередь» это просто
|
||||||
// (сколько заявок сейчас реально ждут решения ОДНОГО согласующего).
|
// значение колонки Status, поэтому здесь достаточно ОДНОГО отфильтрованного
|
||||||
export async function getPendingApproval(
|
// запроса: ApproverId (+ Status для 'myTurn'). Список согласования больше НЕ
|
||||||
context: WebPartContext
|
// сканируется целиком, независимо от его размера.
|
||||||
): Promise<{ rows: IMyRequest[]; debug: IMyRequestsTypeDebug[] }> {
|
//
|
||||||
|
// Заявку (Title/Status/Created) читаем сразу через expand по Lookup-полю
|
||||||
|
// Ticket — отдельный запрос к списку данных нужен только за Author
|
||||||
|
// (двухуровневый expand Ticket/Author у SharePoint REST ненадёжен), и то —
|
||||||
|
// ТОЛЬКО для строк текущей страницы (см. hydrateAuthors ниже), а не для всего
|
||||||
|
// найденного среза. Полноценный $skip/$top здесь не сделать: SharePoint REST
|
||||||
|
// не умеет сортировать по полю через expand (Ticket/Created — поле не этого
|
||||||
|
// списка), поэтому «свежие сверху» через несколько сайтов/типов можно получить
|
||||||
|
// только слиянием и сортировкой в памяти. Экономим на самом дорогом шаге —
|
||||||
|
// не дочитываем Author там, где он не попадёт на экран.
|
||||||
|
export interface IPendingApprovalPage {
|
||||||
|
rows: IMyRequest[];
|
||||||
|
totalRows: number;
|
||||||
|
debug: IMyRequestsTypeDebug[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const PENDING_PAGE_SIZE = 20;
|
||||||
|
|
||||||
|
// Общая часть: собрать полный (не постраничный) индекс совпадающих заявок по
|
||||||
|
// всем типам — без автора, БЕЗ дочитывания. Используется и обычным режимом
|
||||||
|
// (без поиска — просто нарезаем страницу), и режимом с текстовым поиском (там
|
||||||
|
// нужен ПОЛНЫЙ набор, иначе фильтрация Search дала бы неверный итог/страницы —
|
||||||
|
// см. filterPendingByQuery и вызывающую сторону в RequestsTableView).
|
||||||
|
async function buildPendingIndex(
|
||||||
|
context: WebPartContext,
|
||||||
|
scope: ApprovalScope
|
||||||
|
): Promise<{ types: IRequestType[]; index: IMyRequest[]; debug: IMyRequestsTypeDebug[] }> {
|
||||||
const types = await getLinkedTypes(context);
|
const types = await getLinkedTypes(context);
|
||||||
const tokenEmail = currentUserEmail(context);
|
const tokenEmail = currentUserEmail(context);
|
||||||
|
|
||||||
const perType = await Promise.all(
|
const perType = await Promise.all(
|
||||||
types.map((t) => getApprovalPendingForType(context, t, tokenEmail))
|
types.map((t) => indexApprovalsForType(context, t, tokenEmail, scope))
|
||||||
);
|
);
|
||||||
|
|
||||||
return {
|
// Свежие сверху — типы объединяются в один список, сортировать нужно после слияния.
|
||||||
rows: perType.reduce((all, r) => all.concat(r.rows), [] as IMyRequest[]),
|
const index = perType
|
||||||
debug: perType.map((r) => r.debug),
|
.reduce((all, r) => all.concat(r.rows), [] as IMyRequest[])
|
||||||
};
|
.sort((a, b) => b.created.localeCompare(a.created));
|
||||||
|
|
||||||
|
return { types, index, debug: perType.map((r) => r.debug) };
|
||||||
}
|
}
|
||||||
|
|
||||||
async function getApprovalPendingForType(
|
// Без текстового поиска: страница нарезается ЗДЕСЬ (сервер решает, какие 20
|
||||||
|
// заявок отдать), автор дочитывается только для них.
|
||||||
|
export async function getPendingApproval(
|
||||||
|
context: WebPartContext,
|
||||||
|
scope: ApprovalScope = 'myTurn',
|
||||||
|
page: number = 1
|
||||||
|
): Promise<IPendingApprovalPage> {
|
||||||
|
const { types, index, debug } = await buildPendingIndex(context, scope);
|
||||||
|
|
||||||
|
const pageRows = index.slice((page - 1) * PENDING_PAGE_SIZE, page * PENDING_PAGE_SIZE);
|
||||||
|
console.log(
|
||||||
|
`[Текущие заявки] «На согласовании» (scope=${scope}): всего найдено ${index.length}, страница ${page} — ${pageRows.length} строк, дочитываем автора для них`
|
||||||
|
);
|
||||||
|
await hydrateAuthors(context, types, pageRows);
|
||||||
|
|
||||||
|
return { rows: pageRows, totalRows: index.length, debug };
|
||||||
|
}
|
||||||
|
|
||||||
|
// С текстовым поиском: полный индекс (без автора) — фильтрует его вызывающая
|
||||||
|
// сторона через filterPendingByQuery, а страницу и автора берёт из уже
|
||||||
|
// отфильтрованного результата (см. hydratePendingAuthors).
|
||||||
|
export async function getPendingApprovalIndex(
|
||||||
|
context: WebPartContext,
|
||||||
|
scope: ApprovalScope
|
||||||
|
): Promise<{ rows: IMyRequest[]; types: IRequestType[]; debug: IMyRequestsTypeDebug[] }> {
|
||||||
|
const { types, index, debug } = await buildPendingIndex(context, scope);
|
||||||
|
return { rows: index, types, debug };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Публичная обёртка над hydrateAuthors — для дочитывания автора по уже
|
||||||
|
// отфильтрованной и нарезанной на страницу выборке (см. getPendingApprovalIndex).
|
||||||
|
export async function hydratePendingAuthors(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
rows: IMyRequest[]
|
||||||
|
): Promise<void> {
|
||||||
|
await hydrateAuthors(context, types, rows);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Лёгкий индекс совпадающих заявок для одного типа: строки согласования по
|
||||||
|
// ApproverId → Title/Status/Created заявки отдельным запросом к списку ДАННЫХ
|
||||||
|
// (НЕ через expand по Lookup-полю Ticket — SharePoint REST не отдаёт так
|
||||||
|
// произвольные поля связанного элемента, только через Person-поля вроде
|
||||||
|
// Author; попытка `expand('Ticket').select('Ticket/Status', ...)` падает с 400).
|
||||||
|
// Author дочитывается позже (hydrateAuthors), только для строк итоговой страницы.
|
||||||
|
async function indexApprovalsForType(
|
||||||
context: WebPartContext,
|
context: WebPartContext,
|
||||||
type: IRequestType,
|
type: IRequestType,
|
||||||
tokenEmail: string
|
tokenEmail: string,
|
||||||
|
scope: ApprovalScope
|
||||||
): Promise<{ rows: IMyRequest[]; debug: IMyRequestsTypeDebug }> {
|
): Promise<{ rows: IMyRequest[]; debug: IMyRequestsTypeDebug }> {
|
||||||
const debug: IMyRequestsTypeDebug = {
|
const debug: IMyRequestsTypeDebug = {
|
||||||
requestTypeId: type.id,
|
requestTypeId: type.id,
|
||||||
@@ -64,7 +165,9 @@ async function getApprovalPendingForType(
|
|||||||
};
|
};
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
if (!tokenEmail) return { rows: [], debug };
|
||||||
|
|
||||||
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
const list = sp.web.getList(type.listId as string);
|
const list = sp.web.getList(type.listId as string);
|
||||||
|
|
||||||
const dataListInfo = await list.select('Title')();
|
const dataListInfo = await list.select('Title')();
|
||||||
@@ -77,63 +180,91 @@ async function getApprovalPendingForType(
|
|||||||
debug.approvalListTitle = approvalListTitle;
|
debug.approvalListTitle = approvalListTitle;
|
||||||
const approvalList = sp.web.lists.getByTitle(approvalListTitle);
|
const approvalList = sp.web.lists.getByTitle(approvalListTitle);
|
||||||
|
|
||||||
// Phase не смотрим вообще — работаем только по Status.
|
// TansuSiteApprover/EMail eq '...' в $filter по Person-полю ненадёжен в
|
||||||
const stepRows = (await approvalList.items
|
// SharePoint REST — резолвим email в числовой Id пользователя (как и везде в
|
||||||
.select('Id', 'StepOrder', 'Status', 'TicketId', 'Approver/EMail')
|
// проекте, см. ensureUser) и фильтруем по TansuSiteApproverId.
|
||||||
.expand('Approver')
|
//
|
||||||
.top(2000)()) as Array<Record<string, unknown>>;
|
// RequestStatus в $filter НЕ используем: подтверждено на практике — фильтр
|
||||||
console.log(
|
// вида `RequestStatus eq 'На согласовании'` (кириллица в $filter) молча
|
||||||
`[Текущие заявки] «${type.name}»: список согласования «${approvalListTitle}», элементов в списке: ${stepRows.length}, ваш email из токена: «${tokenEmail}»`
|
// возвращает 0 строк, даже когда без него те же строки находятся с этим же
|
||||||
);
|
// значением статуса. Поэтому фильтруем только по TansuSiteApproverId
|
||||||
console.table(
|
// (числовое значение, проблем нет), а статус сравниваем в JS после
|
||||||
stepRows.map((r) => ({
|
// получения строк.
|
||||||
Id: r.Id,
|
const claimsLogin = tokenEmail.indexOf('|') >= 0 ? tokenEmail : `i:0#.f|membership|${tokenEmail}`;
|
||||||
TicketId: r.TicketId,
|
const approver = await sp.web.ensureUser(claimsLogin);
|
||||||
StepOrder: r.StepOrder,
|
|
||||||
Status: r.Status,
|
|
||||||
'Approver/EMail': (r.Approver as { EMail?: string } | undefined)?.EMail,
|
|
||||||
}))
|
|
||||||
);
|
|
||||||
|
|
||||||
|
let stepRows: Array<Record<string, unknown>>;
|
||||||
|
|
||||||
|
if (scope === 'myTurn') {
|
||||||
|
// 'myTurn' — гибрид для масштаба (список согласования может быть очень
|
||||||
|
// большим): Search находит кандидатов, не сканируя список целиком, плюс
|
||||||
|
// REST по «последним N минутам» (Modified) добирает то, что Search мог ещё
|
||||||
|
// не проиндексировать. Status в обоих случаях берётся СВЕЖИМ через REST по
|
||||||
|
// найденным Id (не из индекса Search) — именно это делает
|
||||||
|
// getInvolvedRowsViaSearch, поэтому решение «моя очередь сейчас» всегда
|
||||||
|
// точное, даже когда список кандидатов пришёл из Search.
|
||||||
|
const cutoffIso = new Date(Date.now() - RECENT_MS).toISOString();
|
||||||
|
const recentRows = (await approvalList.items
|
||||||
|
.filter(`TansuSiteApproverId eq ${approver.Id} and Modified ge '${cutoffIso}'`)
|
||||||
|
.select('Id', 'TicketId', 'RequestStatus')
|
||||||
|
.top(2000)()) as Array<Record<string, unknown>>;
|
||||||
|
|
||||||
|
// Статусы уходят в KQL: сервер сразу отдаёт только активные строки,
|
||||||
|
// а не всё, где пользователь есть в маршруте.
|
||||||
|
const searchRows = await getInvolvedRowsViaSearch(context, type, approvalList, [
|
||||||
|
REQUEST_STATUS.onApproval,
|
||||||
|
REQUEST_STATUS.onExecution,
|
||||||
|
]);
|
||||||
|
const seenIds = new Set(recentRows.map((r) => r.Id));
|
||||||
|
const allRows = recentRows.concat(searchRows.filter((r) => !seenIds.has(r.Id)));
|
||||||
|
|
||||||
|
stepRows = allRows.filter(
|
||||||
|
(r) =>
|
||||||
|
r.RequestStatus === REQUEST_STATUS.onApproval ||
|
||||||
|
r.RequestStatus === REQUEST_STATUS.onExecution
|
||||||
|
);
|
||||||
|
console.log(
|
||||||
|
`[Текущие заявки] «${type.name}»: список согласования «${approvalListTitle}», approver.Id=${approver.Id}, scope=myTurn — свежих (REST, < 10 мин): ${recentRows.length}, через Search: ${searchRows.length}, после фильтра по статусу: ${stepRows.length}`
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
// 'involved' — используется ТОЛЬКО для текстового поиска (см.
|
||||||
|
// getPendingApprovalIndex/searchMyRequests) — здесь важна не мгновенная
|
||||||
|
// свежесть, а полнота по всему архиву, поэтому только Search, без
|
||||||
|
// REST-подстраховки на «последние N минут»: гибрид REST+Search при поиске
|
||||||
|
// давал неустойчивый результат (заявка то находилась, то нет, в
|
||||||
|
// зависимости от того, успел ли Search её проиндексировать к моменту
|
||||||
|
// REST-окна).
|
||||||
|
stepRows = await getInvolvedRowsViaSearch(context, type, approvalList);
|
||||||
|
|
||||||
|
console.log(
|
||||||
|
`[Текущие заявки] «${type.name}»: список согласования «${approvalListTitle}», approver.Id=${approver.Id}, scope=involved (Search) — найдено: ${stepRows.length}`
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
console.table(stepRows.map((r) => ({ Id: r.Id, TicketId: r.TicketId, RequestStatus: r.RequestStatus })));
|
||||||
debug.approvalRowCount = stepRows.length;
|
debug.approvalRowCount = stepRows.length;
|
||||||
|
|
||||||
const byTicket = new Map<number, IApprovalStep[]>();
|
// Дедуп по TicketId: при scope='involved' у одной заявки может найтись
|
||||||
stepRows.forEach((r) => {
|
// несколько ваших строк (напр. вы согласующий и делегат) — заявка одна.
|
||||||
const ticketId = r.TicketId as number | undefined;
|
const ticketIds = Array.from(
|
||||||
if (!ticketId) return;
|
new Set(stepRows.map((r) => r.TicketId as number | undefined).filter((id): id is number => !!id))
|
||||||
const approver = r.Approver as { EMail?: string } | undefined;
|
);
|
||||||
const steps = byTicket.get(ticketId) || [];
|
if (ticketIds.length === 0) {
|
||||||
steps.push({
|
debug.approvalPendingTickets = 0;
|
||||||
status: (r.Status as string) || '',
|
return { rows: [], debug };
|
||||||
order: typeof r.StepOrder === 'number' ? (r.StepOrder as number) : undefined,
|
}
|
||||||
approverEmail: (approver?.EMail || '').toLowerCase(),
|
|
||||||
});
|
|
||||||
byTicket.set(ticketId, steps);
|
|
||||||
});
|
|
||||||
|
|
||||||
const myTicketIds: number[] = [];
|
// Заголовок/статус/дата заявки — отдельным запросом к списку ДАННЫХ (см.
|
||||||
const byTicketDebug: Array<Record<string, unknown>> = [];
|
// комментарий у функции: через Lookup-expand это не отдаётся).
|
||||||
byTicket.forEach((steps, ticketId) => {
|
const ticketFilter = ticketIds.map((id) => `Id eq ${id}`).join(' or ');
|
||||||
const mine = isMyTurn(steps, tokenEmail);
|
|
||||||
byTicketDebug.push({ TicketId: ticketId, isMyTurn: mine, steps: JSON.stringify(steps) });
|
|
||||||
if (mine) myTicketIds.push(ticketId);
|
|
||||||
});
|
|
||||||
console.table(byTicketDebug);
|
|
||||||
|
|
||||||
debug.approvalPendingTickets = myTicketIds.length;
|
|
||||||
if (myTicketIds.length === 0) return { rows: [], debug };
|
|
||||||
|
|
||||||
const ticketFilter = myTicketIds.map((id) => `Id eq ${id}`).join(' or ');
|
|
||||||
const ticketRows = (await list.items
|
const ticketRows = (await list.items
|
||||||
.filter(ticketFilter)
|
.filter(ticketFilter)
|
||||||
.select('Id', 'Title', 'Status', 'Created', 'Author/EMail', 'Author/Title')
|
.select('Id', 'Title', 'Status', 'Created')
|
||||||
.expand('Author')
|
.top(ticketIds.length)()) as Array<Record<string, unknown>>;
|
||||||
.top(2000)()) as Array<Record<string, unknown>>;
|
|
||||||
|
|
||||||
const rows = ticketRows.map((r) => {
|
const rows = ticketRows.map((r) => toMyRequest(r, undefined, type, 'approval'));
|
||||||
const author = r.Author as { EMail?: string; Title?: string } | undefined;
|
|
||||||
return toMyRequest(r, author, type, 'approval');
|
debug.approvalPendingTickets = rows.length;
|
||||||
});
|
|
||||||
return { rows, debug };
|
return { rows, debug };
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
debug.approvalError = (e as Error).message;
|
debug.approvalError = (e as Error).message;
|
||||||
@@ -145,115 +276,210 @@ async function getApprovalPendingForType(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Сейчас ли очередь пользователя с данным email среди строк маршрута одной заявки.
|
// Строки согласования текущего пользователя через Search, чтобы не сканировать
|
||||||
// Маршрут остановлен (где-то есть Отклонено/Возвращена) — не его очередь, заявка
|
// список целиком (он растёт с каждой заявкой).
|
||||||
// не активна. Иначе «текущие» строки — это ещё не решённые (Status = На согласовании)
|
//
|
||||||
// без указанного StepOrder (параллельно, все активны сразу) плюс, если есть строки
|
// Фильтр по согласующему — managed property MP_APPROVER. Имя нестандартное
|
||||||
// с указанным StepOrder, ещё не решённая с минимальным StepOrder (последовательно).
|
// (с префиксом группы колонок сайта), см. комментарий к константе: «ожидаемого»
|
||||||
function isMyTurn(steps: IApprovalStep[], tokenEmail: string): boolean {
|
// ApproverOWSUSER в схеме поиска нет вовсе, из-за чего запросы по нему долго
|
||||||
if (!tokenEmail) return false;
|
// возвращали 0.
|
||||||
const stopped = steps.some(
|
//
|
||||||
(s) => s.status === REQUEST_STATUS.rejected || s.status === REQUEST_STATUS.returned
|
// statuses задаёт фильтр по статусу строки прямо в KQL — нужен для режима
|
||||||
|
// «чья сейчас очередь» (без текстового поиска), чтобы страницу резал СЕРВЕР:
|
||||||
|
// без него в выдачу попали бы все строки, где пользователь вообще есть в
|
||||||
|
// маршруте, и после отбрасывания неактивных в странице появлялись бы дыры.
|
||||||
|
// Пустой массив — не фильтровать (режим текстового поиска: там важна полнота).
|
||||||
|
//
|
||||||
|
// Search используется ТОЛЬКО чтобы сузить набор Id — TicketId и Status берём
|
||||||
|
// свежими через REST по этим Id, а не из индекса (индекс мог устареть, а на
|
||||||
|
// устаревшем статусе решение «моя очередь» строить нельзя).
|
||||||
|
async function getInvolvedRowsViaSearch(
|
||||||
|
context: WebPartContext,
|
||||||
|
type: IRequestType,
|
||||||
|
approvalList: IList,
|
||||||
|
statuses: string[] = []
|
||||||
|
): Promise<Array<Record<string, unknown>>> {
|
||||||
|
try {
|
||||||
|
const email = currentUserEmail(context);
|
||||||
|
if (!email) {
|
||||||
|
console.warn(
|
||||||
|
`[Текущие заявки] «${type.name}»: у текущего пользователя нет email — Search по согласующему невозможен`
|
||||||
);
|
);
|
||||||
if (stopped) return false;
|
return [];
|
||||||
|
|
||||||
const pending = steps.filter((s) => s.status === REQUEST_STATUS.onApproval);
|
|
||||||
const noOrder = pending.filter((s) => s.order === undefined);
|
|
||||||
const ordered = pending.filter((s): s is IApprovalStep & { order: number } => s.order !== undefined);
|
|
||||||
|
|
||||||
const current = [...noOrder];
|
|
||||||
if (ordered.length > 0) {
|
|
||||||
const minOrder = Math.min(...ordered.map((s) => s.order));
|
|
||||||
current.push(...ordered.filter((s) => s.order === minOrder));
|
|
||||||
}
|
}
|
||||||
|
const claimsLogin = `i:0#.f|membership|${email}`;
|
||||||
|
|
||||||
return current.some((s) => s.approverEmail === tokenEmail);
|
const rootFolder = (await approvalList
|
||||||
|
.select('RootFolder/ServerRelativeUrl')
|
||||||
|
.expand('RootFolder')()) as { RootFolder?: { ServerRelativeUrl?: string } };
|
||||||
|
const relUrl = rootFolder.RootFolder?.ServerRelativeUrl;
|
||||||
|
if (!relUrl) return [];
|
||||||
|
const approvalListAbsUrl = `${siteOrigin(type.siteUrl as string)}${relUrl}`;
|
||||||
|
|
||||||
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
|
const pathClause = `Path:"${approvalListAbsUrl}*"`;
|
||||||
|
const clauses = [pathClause, `${MP_APPROVER}:"${claimsLogin}"`];
|
||||||
|
if (statuses.length > 0) {
|
||||||
|
clauses.push(`(${statuses.map((s) => `${MP_STATUS}:"${s}"`).join(' OR ')})`);
|
||||||
|
}
|
||||||
|
const kql = clauses.join(' AND ');
|
||||||
|
|
||||||
|
const results = await sp.search({
|
||||||
|
Querytext: kql,
|
||||||
|
RowLimit: SEARCH_ROW_LIMIT,
|
||||||
|
SelectProperties: ['ListItemID'],
|
||||||
|
TrimDuplicates: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const total = results.TotalRows || 0;
|
||||||
|
const ids = (results.PrimarySearchResults as Array<Record<string, unknown>>)
|
||||||
|
.map((r) => Number(r.ListItemID))
|
||||||
|
.filter((id) => !isNaN(id) && id > 0);
|
||||||
|
|
||||||
|
console.log(
|
||||||
|
`[Текущие заявки] Search «${type.name}» (involved): KQL = ${kql}, найдено: ${total}, годных Id: ${ids.length}`
|
||||||
|
);
|
||||||
|
|
||||||
|
if (total > SEARCH_ROW_LIMIT) {
|
||||||
|
console.warn(
|
||||||
|
`[Текущие заявки] «${type.name}»: Search вернул ${total} строк, взяли первые ${SEARCH_ROW_LIMIT} — остальные не попадут в выборку`
|
||||||
|
);
|
||||||
|
}
|
||||||
|
if (ids.length === 0) return [];
|
||||||
|
|
||||||
|
return (await approvalList.items
|
||||||
|
.filter(ids.map((id) => `Id eq ${id}`).join(' or '))
|
||||||
|
.select('Id', 'TicketId', 'RequestStatus')
|
||||||
|
.top(ids.length)()) as Array<Record<string, unknown>>;
|
||||||
|
} catch (e) {
|
||||||
|
console.error(
|
||||||
|
`[Текущие заявки] «${type.name}»: Search по списку согласования не сработал:`,
|
||||||
|
(e as Error).message
|
||||||
|
);
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Дочитывает Author/EMail + Author/Title в списке ДАННЫХ каждого типа —
|
||||||
|
// только по переданным строкам (обычно уже нарезанная страница из ≤20), не по
|
||||||
|
// всему найденному срезу. Мутирует переданные объекты (проставляет authorEmail/authorName).
|
||||||
|
async function hydrateAuthors(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
rows: IMyRequest[]
|
||||||
|
): Promise<void> {
|
||||||
|
if (rows.length === 0) return;
|
||||||
|
|
||||||
|
const typeById = new Map<number, IRequestType>();
|
||||||
|
types.forEach((t) => typeById.set(t.id, t));
|
||||||
|
|
||||||
|
const idsByType = new Map<number, number[]>();
|
||||||
|
rows.forEach((r) => {
|
||||||
|
const ids = idsByType.get(r.requestTypeId) || [];
|
||||||
|
ids.push(r.id);
|
||||||
|
idsByType.set(r.requestTypeId, ids);
|
||||||
|
});
|
||||||
|
|
||||||
|
const byKey = new Map<string, { EMail?: string; Title?: string }>();
|
||||||
|
await Promise.all(
|
||||||
|
Array.from(idsByType.entries()).map(async ([requestTypeId, ids]) => {
|
||||||
|
const type = typeById.get(requestTypeId);
|
||||||
|
if (!type) return;
|
||||||
|
try {
|
||||||
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
|
const authorRows = (await sp.web
|
||||||
|
.getList(type.listId as string)
|
||||||
|
.items.filter(ids.map((id) => `Id eq ${id}`).join(' or '))
|
||||||
|
.select('Id', 'Author/EMail', 'Author/Title')
|
||||||
|
.expand('Author')
|
||||||
|
.top(ids.length)()) as Array<Record<string, unknown>>;
|
||||||
|
authorRows.forEach((r) => {
|
||||||
|
byKey.set(
|
||||||
|
`${requestTypeId}-${r.Id as number}`,
|
||||||
|
(r.Author as { EMail?: string; Title?: string }) || {}
|
||||||
|
);
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
console.error(`[Текущие заявки] Не удалось дочитать автора для «${type.name}»:`, (e as Error).message);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
|
||||||
|
rows.forEach((r) => {
|
||||||
|
const a = byKey.get(`${r.requestTypeId}-${r.id}`);
|
||||||
|
r.authorEmail = a?.EMail || '';
|
||||||
|
r.authorName = a?.Title || '';
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// «Созданы вами» — обычный REST по спискам данных (НЕ Search): данные всегда
|
// Поиск через SharePoint Search REST API (search/query, KQL).
|
||||||
// актуальны, только что созданная заявка видна сразу (у поискового индекса
|
|
||||||
// была бы задержка переиндексации).
|
|
||||||
//
|
//
|
||||||
// Пагинация «сшивает» несколько списков в один нумерованный список: сначала по
|
// Текст запроса идёт свободным термом — поиск по ВСЕМ проиндексированным полям
|
||||||
// каждому типу берём только лёгкие поля (Id + Created) всех заявок автора,
|
// элемента, а не только по названию. Плата за это — результаты берутся из
|
||||||
// сортируем объединённый набор по дате создания и лишь для нужной страницы
|
// поискового индекса, который переиндексируется с задержкой: только что
|
||||||
// дочитываем полные поля. Так на экран не тянется всё содержимое заявок,
|
// созданная или изменённая заявка может найтись не сразу.
|
||||||
// но общее число страниц известно точно.
|
|
||||||
export interface IOwnRequestsPage {
|
export interface IOwnRequestsPage {
|
||||||
rows: IMyRequest[];
|
rows: IMyRequest[];
|
||||||
totalRows: number;
|
totalRows: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
const PAGE_SIZE = 20;
|
const PAGE_SIZE = 20;
|
||||||
// Столько «лёгких» строк (Id + Created) максимум читаем из одного списка, чтобы
|
// Сколько заявок максимум перечисляем в KQL при поиске среди уже отобранных
|
||||||
// посчитать общее число страниц. Хватает с большим запасом; если у кого-то
|
// (см. filterPendingByQuery) — иначе строка запроса станет неподъёмной.
|
||||||
// заявок окажется больше — в консоль уйдёт предупреждение.
|
const KQL_ID_LIMIT = 300;
|
||||||
const INDEX_LIMIT = 5000;
|
|
||||||
|
|
||||||
// В OData-строке одинарная кавычка экранируется удвоением.
|
function siteOrigin(siteUrl: string): string {
|
||||||
function escapeOData(text: string): string {
|
const match = /^https?:\/\/[^/]+/.exec(siteUrl);
|
||||||
return text.replace(/'/g, "''");
|
return match ? match[0] : siteUrl;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface IOwnIndexEntry {
|
function listAbsUrl(type: IRequestType): string {
|
||||||
id: number;
|
return `${siteOrigin(type.siteUrl as string)}${type.listId}`;
|
||||||
created: string;
|
|
||||||
type: IRequestType;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getOwnRequests(
|
// KQL не терпит спецсимволов в свободном терме — оставляем буквы (лат./кир.),
|
||||||
context: WebPartContext,
|
// цифры и пробелы. (без \p{L} — целевой ES-таргет проекта его не поддерживает)
|
||||||
types: IRequestType[],
|
function sanitizeForKql(text: string): string {
|
||||||
query: string,
|
return text
|
||||||
page: number
|
.replace(/[^a-zA-Zа-яА-ЯёЁ0-9\s]/g, ' ')
|
||||||
): Promise<IOwnRequestsPage> {
|
.replace(/\s+/g, ' ')
|
||||||
if (types.length === 0) return { rows: [], totalRows: 0 };
|
.trim();
|
||||||
|
}
|
||||||
|
|
||||||
const q = query.trim();
|
// Свободный терм по всем полям: каждое слово — префиксный поиск, все слова
|
||||||
|
// обязательны (AND). Пустая строка → undefined (условие не добавляем).
|
||||||
|
function freeTextClause(query: string): string | undefined {
|
||||||
|
const q = sanitizeForKql(query);
|
||||||
|
if (!q) return undefined;
|
||||||
|
return `(${q.split(' ').map((word) => `${word}*`).join(' AND ')})`;
|
||||||
|
}
|
||||||
|
|
||||||
// 1) Лёгкий индекс по каждому типу: только Id + Created заявок автора.
|
// Ответ Search → пары (Id элемента, его тип по префиксу Path).
|
||||||
const perType = await Promise.all(
|
function hitsToEntries(
|
||||||
types.map(async (type): Promise<IOwnIndexEntry[]> => {
|
results: { PrimarySearchResults: unknown[] },
|
||||||
try {
|
types: IRequestType[]
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
): Array<{ id: number; type: IRequestType }> {
|
||||||
const me = await sp.web.currentUser.select('Id')();
|
const urls = types.map((t) => ({ type: t, url: listAbsUrl(t).toLowerCase() }));
|
||||||
const filters = [`AuthorId eq ${me.Id}`];
|
return (results.PrimarySearchResults as Array<Record<string, unknown>>)
|
||||||
if (q) filters.push(`substringof('${escapeOData(q)}',Title)`);
|
.map((r) => ({ id: Number(r.ListItemID), path: String(r.Path || '').toLowerCase() }))
|
||||||
|
.filter((h) => !isNaN(h.id) && h.id > 0)
|
||||||
const rows = (await sp.web
|
.map((h) => {
|
||||||
.getList(type.listId as string)
|
const matched = urls.filter((u) => h.path.indexOf(u.url) === 0)[0];
|
||||||
.items.filter(filters.join(' and '))
|
return matched ? { id: h.id, type: matched.type } : undefined;
|
||||||
.select('Id', 'Created')
|
|
||||||
.orderBy('Created', false)
|
|
||||||
.top(INDEX_LIMIT)()) as Array<Record<string, unknown>>;
|
|
||||||
|
|
||||||
if (rows.length === INDEX_LIMIT) {
|
|
||||||
console.warn(
|
|
||||||
`[Текущие заявки] «${type.name}»: индекс своих заявок обрезан на ${INDEX_LIMIT} — часть страниц не видна`
|
|
||||||
);
|
|
||||||
}
|
|
||||||
return rows.map((r) => ({ id: r.Id as number, created: (r.Created as string) || '', type }));
|
|
||||||
} catch (e) {
|
|
||||||
console.error(`[Текущие заявки] «${type.name}»: не удалось прочитать свои заявки:`, (e as Error).message);
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
);
|
.filter((e): e is { id: number; type: IRequestType } => !!e);
|
||||||
|
}
|
||||||
|
|
||||||
// 2) Общий список всех типов, свежие сверху.
|
// Дочитать поля заявок по найденным Id (Search отдаёт не все колонки, и для
|
||||||
const index = perType
|
// кастомных полей нет гарантии, что они проиндексированы как managed property).
|
||||||
.reduce((all, rows) => all.concat(rows), [] as IOwnIndexEntry[])
|
async function loadByIds(
|
||||||
.sort((a, b) => b.created.localeCompare(a.created));
|
context: WebPartContext,
|
||||||
|
entries: Array<{ id: number; type: IRequestType }>,
|
||||||
const pageEntries = index.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
|
kind: 'own' | 'approval'
|
||||||
if (pageEntries.length === 0) {
|
): Promise<Map<string, IMyRequest>> {
|
||||||
return { rows: [], totalRows: index.length };
|
|
||||||
}
|
|
||||||
|
|
||||||
// 3) Полные поля — только для заявок текущей страницы, по своему списку на тип.
|
|
||||||
const idsByType = new Map<IRequestType, number[]>();
|
const idsByType = new Map<IRequestType, number[]>();
|
||||||
pageEntries.forEach((e) => {
|
entries.forEach((e) => {
|
||||||
const ids = idsByType.get(e.type) || [];
|
const ids = idsByType.get(e.type) || [];
|
||||||
ids.push(e.id);
|
ids.push(e.id);
|
||||||
idsByType.set(e.type, ids);
|
idsByType.set(e.type, ids);
|
||||||
@@ -262,26 +488,256 @@ export async function getOwnRequests(
|
|||||||
const byKey = new Map<string, IMyRequest>();
|
const byKey = new Map<string, IMyRequest>();
|
||||||
await Promise.all(
|
await Promise.all(
|
||||||
Array.from(idsByType.entries()).map(async ([type, ids]) => {
|
Array.from(idsByType.entries()).map(async ([type, ids]) => {
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
const rows = (await sp.web
|
const rows = (await sp.web
|
||||||
.getList(type.listId as string)
|
.getList(type.listId as string)
|
||||||
.items.filter(ids.map((id) => `Id eq ${id}`).join(' or '))
|
.items.filter(ids.map((id) => `Id eq ${id}`).join(' or '))
|
||||||
.select('Id', 'Title', 'Status', 'Created', 'Author/EMail', 'Author/Title')
|
.select('Id', 'Title', 'Status', 'Created', 'Author/EMail', 'Author/Title')
|
||||||
.expand('Author')
|
.expand('Author')
|
||||||
.top(PAGE_SIZE)()) as Array<Record<string, unknown>>;
|
.top(ids.length)()) as Array<Record<string, unknown>>;
|
||||||
rows.forEach((r) => {
|
rows.forEach((r) => {
|
||||||
const author = r.Author as { EMail?: string; Title?: string } | undefined;
|
const author = r.Author as { EMail?: string; Title?: string } | undefined;
|
||||||
byKey.set(`${type.id}-${r.Id as number}`, toMyRequest(r, author, type, 'own'));
|
byKey.set(`${type.id}-${r.Id as number}`, toMyRequest(r, author, type, kind));
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
return byKey;
|
||||||
|
}
|
||||||
|
|
||||||
// Порядок страницы задаёт индекс (по дате), а не порядок ответов REST.
|
// Свежие (созданные за последние RECENT_MS) заявки автора — обычным REST-ом,
|
||||||
const rows = pageEntries
|
// в обход Search (индекс мог их ещё не подхватить). Без текстового запроса —
|
||||||
.map((e) => byKey.get(`${e.type.id}-${e.id}`))
|
// матчить название не нужно, отдаём как есть.
|
||||||
.filter((r): r is IMyRequest => !!r);
|
async function getFreshOwnRowsForType(context: WebPartContext, type: IRequestType): Promise<IMyRequest[]> {
|
||||||
|
try {
|
||||||
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
|
const me = await sp.web.currentUser.select('Id')();
|
||||||
|
const cutoff = new Date(Date.now() - RECENT_MS).toISOString();
|
||||||
|
|
||||||
return { rows, totalRows: index.length };
|
const rows = (await sp.web
|
||||||
|
.getList(type.listId as string)
|
||||||
|
.items.filter(`AuthorId eq ${me.Id} and Created ge '${cutoff}'`)
|
||||||
|
.select('Id', 'Title', 'Status', 'Created', 'Author/EMail', 'Author/Title')
|
||||||
|
.expand('Author')
|
||||||
|
.top(50)()) as Array<Record<string, unknown>>;
|
||||||
|
|
||||||
|
return rows.map((r) => toMyRequest(r, r.Author as { EMail?: string; Title?: string } | undefined, type, 'own'));
|
||||||
|
} catch (e) {
|
||||||
|
console.error(`[Текущие заявки] «${type.name}»: не удалось дочитать свежие заявки:`, (e as Error).message);
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// «Мои заявки» БЕЗ поиска — гибрид для масштаба: Search с серверной пагинацией
|
||||||
|
// (RowLimit/StartRow) находит страницу без сканирования всего архива, REST по
|
||||||
|
// «последним N минутам» добирает то, что Search мог не успеть проиндексировать
|
||||||
|
// (см. RECENT_MS). Довесок применяется только на первой странице — свежее по
|
||||||
|
// дате там и оказалось бы, будь оно проиндексировано.
|
||||||
|
export async function getOwnRequests(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
page: number
|
||||||
|
): Promise<IOwnRequestsPage> {
|
||||||
|
if (types.length === 0) return { rows: [], totalRows: 0 };
|
||||||
|
|
||||||
|
const searchPage = await searchOwnRequests(context, types, '', page);
|
||||||
|
|
||||||
|
if (page !== 1) return searchPage;
|
||||||
|
|
||||||
|
const freshRows = (await Promise.all(types.map((t) => getFreshOwnRowsForType(context, t)))).reduce(
|
||||||
|
(all, r) => all.concat(r),
|
||||||
|
[] as IMyRequest[]
|
||||||
|
);
|
||||||
|
|
||||||
|
const searchKeys = new Set(searchPage.rows.map((r) => `${r.requestTypeId}-${r.id}`));
|
||||||
|
const onlyFresh = freshRows.filter((r) => !searchKeys.has(`${r.requestTypeId}-${r.id}`));
|
||||||
|
|
||||||
|
if (onlyFresh.length > 0) {
|
||||||
|
console.log(
|
||||||
|
`[Текущие заявки] «Мои заявки»: довесили ${onlyFresh.length} свежих заявок (< 10 мин), которых Search ещё не нашёл`
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const merged = onlyFresh
|
||||||
|
.concat(searchPage.rows)
|
||||||
|
.sort((a, b) => b.created.localeCompare(a.created))
|
||||||
|
.slice(0, PAGE_SIZE);
|
||||||
|
|
||||||
|
return { rows: merged, totalRows: searchPage.totalRows + onlyFresh.length };
|
||||||
|
}
|
||||||
|
|
||||||
|
// «Мои заявки» С поиском — только Search, без REST-подстраховки на свежесть:
|
||||||
|
// только что созданная заявка может найтись не сразу (задержка индексации), но
|
||||||
|
// зато результат предсказуем — не зависит от 10-минутного REST-окна.
|
||||||
|
export async function searchOwnRequests(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
query: string,
|
||||||
|
page: number
|
||||||
|
): Promise<IOwnRequestsPage> {
|
||||||
|
if (types.length === 0) return { rows: [], totalRows: 0 };
|
||||||
|
|
||||||
|
const sp = spForSite(types[0].siteUrl as string, context);
|
||||||
|
const claimsLogin = `i:0#.f|membership|${currentUserEmail(context)}`;
|
||||||
|
|
||||||
|
const clauses = [
|
||||||
|
`(${types.map((t) => `Path:"${listAbsUrl(t)}*"`).join(' OR ')})`,
|
||||||
|
`AuthorOWSUSER:"${claimsLogin}"`,
|
||||||
|
];
|
||||||
|
const text = freeTextClause(query);
|
||||||
|
if (text) clauses.push(text);
|
||||||
|
const kql = clauses.join(' AND ');
|
||||||
|
|
||||||
|
const results = await sp.search({
|
||||||
|
Querytext: kql,
|
||||||
|
RowLimit: PAGE_SIZE,
|
||||||
|
StartRow: (page - 1) * PAGE_SIZE,
|
||||||
|
SelectProperties: ['ListItemID', 'Title', 'Path'],
|
||||||
|
TrimDuplicates: false,
|
||||||
|
// Свежие сверху (по умолчанию Search сортирует по релевантности, не по дате).
|
||||||
|
SortList: [{ Property: 'Created', Direction: 1 }],
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(`[Текущие заявки] Search «Мои заявки»: KQL = ${kql}, всего найдено: ${results.TotalRows}`);
|
||||||
|
console.table(results.PrimarySearchResults);
|
||||||
|
|
||||||
|
const entries = hitsToEntries(results, types);
|
||||||
|
const byKey = entries.length > 0 ? await loadByIds(context, entries, 'own') : new Map<string, IMyRequest>();
|
||||||
|
// Порядок задаёт релевантность поиска, а не порядок ответов REST.
|
||||||
|
const rows = entries.map((e) => byKey.get(`${e.type.id}-${e.id}`)).filter((r): r is IMyRequest => !!r);
|
||||||
|
|
||||||
|
return { rows, totalRows: results.TotalRows || 0 };
|
||||||
|
}
|
||||||
|
|
||||||
|
// «На согласовании»: список заявок уже отобран по строкам согласования
|
||||||
|
// (getPendingApprovalIndex — там же определяется, чья сейчас очередь,
|
||||||
|
// обычным REST). Здесь среди НИХ фильтруем по тексту — только через Search
|
||||||
|
// (KQL ограничивается ListItemID этих заявок, текст идёт свободным термом по
|
||||||
|
// всем полям), без клиентского REST-матчинга по свежести.
|
||||||
|
export async function filterPendingByQuery(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
rows: IMyRequest[],
|
||||||
|
query: string
|
||||||
|
): Promise<IMyRequest[]> {
|
||||||
|
const text = freeTextClause(query);
|
||||||
|
if (!text || rows.length === 0) return rows;
|
||||||
|
|
||||||
|
if (rows.length > KQL_ID_LIMIT) {
|
||||||
|
console.warn(
|
||||||
|
`[Текущие заявки] Поиск среди ждущих решения ограничен ${KQL_ID_LIMIT} заявками из ${rows.length}`
|
||||||
|
);
|
||||||
|
}
|
||||||
|
const candidates = rows.slice(0, KQL_ID_LIMIT);
|
||||||
|
|
||||||
|
const scopeTypes = types.filter((t) => candidates.some((r) => r.requestTypeId === t.id));
|
||||||
|
if (scopeTypes.length === 0) return [];
|
||||||
|
|
||||||
|
const sp = spForSite(scopeTypes[0].siteUrl as string, context);
|
||||||
|
const kql = [
|
||||||
|
`(${scopeTypes.map((t) => `Path:"${listAbsUrl(t)}*"`).join(' OR ')})`,
|
||||||
|
`(${candidates.map((r) => `ListItemID:${r.id}`).join(' OR ')})`,
|
||||||
|
text,
|
||||||
|
].join(' AND ');
|
||||||
|
|
||||||
|
const results = await sp.search({
|
||||||
|
Querytext: kql,
|
||||||
|
RowLimit: KQL_ID_LIMIT,
|
||||||
|
SelectProperties: ['ListItemID', 'Title', 'Path'],
|
||||||
|
TrimDuplicates: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(`[Текущие заявки] Search «На согласовании»: KQL = ${kql}, найдено: ${results.TotalRows}`);
|
||||||
|
console.table(results.PrimarySearchResults);
|
||||||
|
|
||||||
|
// ListItemID уникален только внутри своего списка — сверяем пару тип+Id.
|
||||||
|
const found = new Set(hitsToEntries(results, scopeTypes).map((e) => `${e.type.id}-${e.id}`));
|
||||||
|
return candidates.filter((r) => found.has(`${r.requestTypeId}-${r.id}`));
|
||||||
|
}
|
||||||
|
|
||||||
|
// ---------------------------------------------------------------------------
|
||||||
|
// Вкладка «Поиск»: ищет сразу по двум категориям — «Мои заявки» (я автор) и
|
||||||
|
// «где я участвовал как согласующий» (involved, независимо от того, дошла ли
|
||||||
|
// уже очередь) — и показывает их одним списком, с колонками Автор и Статус
|
||||||
|
// одновременно (в отличие от «Мои заявки»/«На согласовании», где по смыслу
|
||||||
|
// раздела одно из двух не нужно).
|
||||||
|
//
|
||||||
|
// Пагинация — клиентская поверх объединённого результата: «Мои заявки» уже
|
||||||
|
// умеет по-настоящему постранично через Search, но «где участвовал» — нет
|
||||||
|
// (см. filterPendingByQuery — там честного $skip/$top не сделать), так что
|
||||||
|
// единой серверной пагинации на двух источниках сразу не построить. Для
|
||||||
|
// сценария «искал что-то один раз» это приемлемо.
|
||||||
|
export interface ISearchPage {
|
||||||
|
rows: IMyRequest[];
|
||||||
|
totalRows: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Как searchOwnRequests, но без $skip/$top — сразу весь найденный срез (до
|
||||||
|
// KQL_ID_LIMIT). Только Search, без REST-подстраховки на свежесть.
|
||||||
|
async function searchOwnAll(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
query: string
|
||||||
|
): Promise<IMyRequest[]> {
|
||||||
|
if (types.length === 0) return [];
|
||||||
|
|
||||||
|
const sp = spForSite(types[0].siteUrl as string, context);
|
||||||
|
const claimsLogin = `i:0#.f|membership|${currentUserEmail(context)}`;
|
||||||
|
const clauses = [
|
||||||
|
`(${types.map((t) => `Path:"${listAbsUrl(t)}*"`).join(' OR ')})`,
|
||||||
|
`AuthorOWSUSER:"${claimsLogin}"`,
|
||||||
|
];
|
||||||
|
const text = freeTextClause(query);
|
||||||
|
if (text) clauses.push(text);
|
||||||
|
const kql = clauses.join(' AND ');
|
||||||
|
|
||||||
|
const results = await sp.search({
|
||||||
|
Querytext: kql,
|
||||||
|
RowLimit: KQL_ID_LIMIT,
|
||||||
|
SelectProperties: ['ListItemID', 'Title', 'Path'],
|
||||||
|
TrimDuplicates: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(`[Текущие заявки] Search «Поиск» (мои заявки): KQL = ${kql}, найдено: ${results.TotalRows}`);
|
||||||
|
console.table(results.PrimarySearchResults);
|
||||||
|
|
||||||
|
const entries = hitsToEntries(results, types);
|
||||||
|
const byKey = entries.length > 0 ? await loadByIds(context, entries, 'own') : new Map<string, IMyRequest>();
|
||||||
|
return entries.map((e) => byKey.get(`${e.type.id}-${e.id}`)).filter((r): r is IMyRequest => !!r);
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function searchMyRequests(
|
||||||
|
context: WebPartContext,
|
||||||
|
types: IRequestType[],
|
||||||
|
query: string,
|
||||||
|
page: number
|
||||||
|
): Promise<ISearchPage> {
|
||||||
|
const q = query.trim();
|
||||||
|
if (!q) return { rows: [], totalRows: 0 };
|
||||||
|
|
||||||
|
const [ownRows, involvedIdx] = await Promise.all([
|
||||||
|
searchOwnAll(context, types, q),
|
||||||
|
getPendingApprovalIndex(context, 'involved'),
|
||||||
|
]);
|
||||||
|
|
||||||
|
const involvedFiltered = await filterPendingByQuery(context, involvedIdx.types, involvedIdx.rows, q);
|
||||||
|
|
||||||
|
// Заявка может оказаться и своей, и involved одновременно (сам себе
|
||||||
|
// согласующий) — оставляем как 'own', не дублируем строку.
|
||||||
|
const ownKeys = new Set(ownRows.map((r) => `${r.requestTypeId}-${r.id}`));
|
||||||
|
const involvedOnly = involvedFiltered.filter((r) => !ownKeys.has(`${r.requestTypeId}-${r.id}`));
|
||||||
|
|
||||||
|
const merged = ownRows.concat(involvedOnly).sort((a, b) => b.created.localeCompare(a.created));
|
||||||
|
const totalRows = merged.length;
|
||||||
|
const pageRows = merged.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
|
||||||
|
|
||||||
|
// Автор нужен для 'approval'-строк текущей страницы — 'own' уже пришли с
|
||||||
|
// автором (loadByIds сам дочитывает Author).
|
||||||
|
const needAuthor = pageRows.filter((r) => r.kind === 'approval');
|
||||||
|
if (needAuthor.length > 0) {
|
||||||
|
await hydratePendingAuthors(context, involvedIdx.types, needAuthor);
|
||||||
|
}
|
||||||
|
|
||||||
|
return { rows: pageRows, totalRows };
|
||||||
}
|
}
|
||||||
|
|
||||||
function toMyRequest(
|
function toMyRequest(
|
||||||
|
|||||||
@@ -0,0 +1,43 @@
|
|||||||
|
import { IMyRequest } from './models/IMyRequest';
|
||||||
|
|
||||||
|
// Загруженная страница таблицы — то, что кладётся в кеш вкладки
|
||||||
|
// (см. RequestsTableView/SearchView).
|
||||||
|
export interface IPage {
|
||||||
|
rows: IMyRequest[];
|
||||||
|
totalRows: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Хранилище на уровне МОДУЛЯ, а не внутри компонента (useRef), потому что
|
||||||
|
// компоненты таблиц размонтируются при переключении разделов: RequestPortal
|
||||||
|
// рендерит либо SubmitFeature, либо SearchView, либо RequestsTableView — уход
|
||||||
|
// на «Поиск» или «Новая заявка» уничтожает экземпляр таблицы вместе со всем его
|
||||||
|
// состоянием. С useRef кеш переживал только переключение «Мои заявки» ↔ «На
|
||||||
|
// согласовании» (там экземпляр один, меняется лишь проп kind), а после захода
|
||||||
|
// на «Поиск» терялся. Здесь он живёт до перезагрузки страницы.
|
||||||
|
//
|
||||||
|
// Ключ формирует вызывающая сторона и обязательно начинает с префикса раздела
|
||||||
|
// (см. pageKey), иначе ключи двух таблиц пересеклись бы.
|
||||||
|
const store = new Map<string, IPage>();
|
||||||
|
|
||||||
|
// Ключ кеша: раздел + всё, от чего зависит содержимое страницы.
|
||||||
|
export function pageKey(view: string, parts: Array<string | number>): string {
|
||||||
|
return [view, ...parts].join('|');
|
||||||
|
}
|
||||||
|
|
||||||
|
export function readPage(key: string): IPage | undefined {
|
||||||
|
return store.get(key);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function writePage(key: string, page: IPage): void {
|
||||||
|
store.set(key, page);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Слепок страницы для сравнения «изменилось ли что-нибудь». Сравниваем поля,
|
||||||
|
// которые видны в таблице: если они совпали, перерисовывать нечего — иначе при
|
||||||
|
// каждом возврате на вкладку и при каждом фоновом обновлении таблица моргала бы,
|
||||||
|
// перерисовываясь тем же самым содержимым.
|
||||||
|
export function pageSignature(page: IPage): string {
|
||||||
|
return `${page.totalRows}|${page.rows
|
||||||
|
.map((r) => [r.requestTypeId, r.id, r.title, r.status, r.created, r.authorName].join('~'))
|
||||||
|
.join(';')}`;
|
||||||
|
}
|
||||||
@@ -50,6 +50,13 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
);
|
);
|
||||||
|
|
||||||
// Матрица маршрута из фактических строк заявки (read-only), разбитая по фазам.
|
// Матрица маршрута из фактических строк заявки (read-only), разбитая по фазам.
|
||||||
|
//
|
||||||
|
// decisionSeq входит в reloadKey: после решения согласующего строки маршрута
|
||||||
|
// меняются на сервере (своя — на «Согласовано», следующая — на «На
|
||||||
|
// согласовании»), поэтому счётчик инкрементируется и useMatrixEditor
|
||||||
|
// перечитывает матрицу. Иначе на экране остались бы данные, загруженные при
|
||||||
|
// открытии формы, и пользователь видел бы свой шаг всё ещё «На согласовании».
|
||||||
|
const [decisionSeq, setDecisionSeq] = useState<number>(0);
|
||||||
const approval = useMemo(() => hireApprovalService(), []);
|
const approval = useMemo(() => hireApprovalService(), []);
|
||||||
const loadApprovers = useCallback(
|
const loadApprovers = useCallback(
|
||||||
() =>
|
() =>
|
||||||
@@ -58,7 +65,7 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
.then((rows) => rows.filter((r) => r.phase !== APPROVAL_PHASE.execution)),
|
.then((rows) => rows.filter((r) => r.phase !== APPROVAL_PHASE.execution)),
|
||||||
[approval, itemId]
|
[approval, itemId]
|
||||||
);
|
);
|
||||||
const approvers = useMatrixEditor(loadApprovers, `a-${itemId}`, false, true, (l) =>
|
const approvers = useMatrixEditor(loadApprovers, `a-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
approval.getJobTitle(l)
|
approval.getJobTitle(l)
|
||||||
);
|
);
|
||||||
const loadExecutors = useCallback(
|
const loadExecutors = useCallback(
|
||||||
@@ -68,7 +75,7 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
.then((rows) => rows.filter((r) => r.phase === APPROVAL_PHASE.execution)),
|
.then((rows) => rows.filter((r) => r.phase === APPROVAL_PHASE.execution)),
|
||||||
[approval, itemId]
|
[approval, itemId]
|
||||||
);
|
);
|
||||||
const executors = useMatrixEditor(loadExecutors, `e-${itemId}`, false, true, (l) =>
|
const executors = useMatrixEditor(loadExecutors, `e-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
approval.getJobTitle(l)
|
approval.getJobTitle(l)
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -161,7 +168,14 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
|
|
||||||
{/* Панель решения — ВНЕ печати и FormModeProvider (комментарий редактируемый). */}
|
{/* Панель решения — ВНЕ печати и FormModeProvider (комментарий редактируемый). */}
|
||||||
<div className="rp-no-print">
|
<div className="rp-no-print">
|
||||||
<DecisionPanel service={approverService} requestId={itemId} />
|
<DecisionPanel
|
||||||
|
service={approverService}
|
||||||
|
requestId={itemId}
|
||||||
|
onDecided={(newStatus) => {
|
||||||
|
setStatus(newStatus);
|
||||||
|
setDecisionSeq((n) => n + 1);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
{
|
{
|
||||||
"dataListTitle": "Прием на работу — согласование",
|
"dataListTitle": "Прием на работу — согласование",
|
||||||
"columns": [
|
"columns": [
|
||||||
{ "internalName": "Approver", "title": "Согласующий", "type": "User", "userSelectionMode": "PeopleOnly" },
|
{ "internalName": "TansuSiteApprover", "title": "Согласующий", "type": "User", "userSelectionMode": "PeopleOnly" },
|
||||||
{ "internalName": "Status", "title": "Статус", "type": "Choice", "choices": ["Черновик", "На согласовании", "Согласовано", "Отклонено", "Возвращена на доработку", "Ждёт очереди", "На исполнении", "Выполнено", "Выполнение", "Закрыта"] },
|
{ "internalName": "RequestStatus", "title": "Статус", "type": "Choice", "choices": ["Черновик", "Ждёт очереди", "На согласовании", "На исполнении", "Согласовано", "Выполнено", "Отклонено", "Возвращена на доработку"] },
|
||||||
{ "internalName": "Ticket", "title": "Заявка", "type": "Lookup", "lookupList": "Прием на работу — данные", "lookupShowField": "Title" },
|
{ "internalName": "Ticket", "title": "Заявка", "type": "Lookup", "lookupList": "Прием на работу — данные", "lookupShowField": "Title" },
|
||||||
{ "internalName": "Date", "title": "Дата", "type": "DateTime" },
|
{ "internalName": "Date", "title": "Дата", "type": "DateTime" },
|
||||||
{ "internalName": "Comment", "title": "Комментарий", "type": "Note" },
|
{ "internalName": "Comment", "title": "Комментарий", "type": "Note" },
|
||||||
|
|||||||
@@ -39,6 +39,13 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
);
|
);
|
||||||
|
|
||||||
// Матрица маршрута из фактических строк заявки (read-only), разбитая по фазам.
|
// Матрица маршрута из фактических строк заявки (read-only), разбитая по фазам.
|
||||||
|
//
|
||||||
|
// decisionSeq входит в reloadKey: после решения согласующего строки маршрута
|
||||||
|
// меняются на сервере (своя — на «Согласовано», следующая — на «На
|
||||||
|
// согласовании»), поэтому счётчик инкрементируется и useMatrixEditor
|
||||||
|
// перечитывает матрицу. Иначе на экране остались бы данные, загруженные при
|
||||||
|
// открытии формы, и пользователь видел бы свой шаг всё ещё «На согласовании».
|
||||||
|
const [decisionSeq, setDecisionSeq] = useState<number>(0);
|
||||||
const approval = useMemo(() => workplaceApprovalService(), []);
|
const approval = useMemo(() => workplaceApprovalService(), []);
|
||||||
const loadApprovers = useCallback(
|
const loadApprovers = useCallback(
|
||||||
() =>
|
() =>
|
||||||
@@ -47,7 +54,7 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
.then((rows) => rows.filter((r) => r.phase !== APPROVAL_PHASE.execution)),
|
.then((rows) => rows.filter((r) => r.phase !== APPROVAL_PHASE.execution)),
|
||||||
[approval, itemId]
|
[approval, itemId]
|
||||||
);
|
);
|
||||||
const approvers = useMatrixEditor(loadApprovers, `a-${itemId}`, false, true, (l) =>
|
const approvers = useMatrixEditor(loadApprovers, `a-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
approval.getJobTitle(l)
|
approval.getJobTitle(l)
|
||||||
);
|
);
|
||||||
const loadExecutors = useCallback(
|
const loadExecutors = useCallback(
|
||||||
@@ -57,7 +64,7 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
.then((rows) => rows.filter((r) => r.phase === APPROVAL_PHASE.execution)),
|
.then((rows) => rows.filter((r) => r.phase === APPROVAL_PHASE.execution)),
|
||||||
[approval, itemId]
|
[approval, itemId]
|
||||||
);
|
);
|
||||||
const executors = useMatrixEditor(loadExecutors, `e-${itemId}`, false, true, (l) =>
|
const executors = useMatrixEditor(loadExecutors, `e-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
approval.getJobTitle(l)
|
approval.getJobTitle(l)
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -138,7 +145,14 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="rp-no-print">
|
<div className="rp-no-print">
|
||||||
<DecisionPanel service={approverService} requestId={itemId} />
|
<DecisionPanel
|
||||||
|
service={approverService}
|
||||||
|
requestId={itemId}
|
||||||
|
onDecided={(newStatus) => {
|
||||||
|
setStatus(newStatus);
|
||||||
|
setDecisionSeq((n) => n + 1);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
{
|
{
|
||||||
"dataListTitle": "Организация рабочего места — согласование",
|
"dataListTitle": "Организация рабочего места — согласование",
|
||||||
"columns": [
|
"columns": [
|
||||||
{ "internalName": "Approver", "title": "Согласующий", "type": "User", "userSelectionMode": "PeopleOnly" },
|
{ "internalName": "TansuSiteApprover", "title": "Согласующий", "type": "User", "userSelectionMode": "PeopleOnly" },
|
||||||
{ "internalName": "Status", "title": "Статус", "type": "Choice", "choices": ["Черновик", "На согласовании", "Согласовано", "Отклонено", "Возвращена на доработку", "Ждёт очереди", "На исполнении", "Выполнено", "Выполнение", "Закрыта"] },
|
{ "internalName": "RequestStatus", "title": "Статус", "type": "Choice", "choices": ["Черновик", "Ждёт очереди", "На согласовании", "На исполнении", "Согласовано", "Выполнено", "Отклонено", "Возвращена на доработку"] },
|
||||||
{ "internalName": "Ticket", "title": "Заявка", "type": "Lookup", "lookupList": "Организация рабочего места — данные", "lookupShowField": "Title" },
|
{ "internalName": "Ticket", "title": "Заявка", "type": "Lookup", "lookupList": "Организация рабочего места — данные", "lookupShowField": "Title" },
|
||||||
{ "internalName": "Date", "title": "Дата", "type": "DateTime" },
|
{ "internalName": "Date", "title": "Дата", "type": "DateTime" },
|
||||||
{ "internalName": "Comment", "title": "Комментарий", "type": "Note" },
|
{ "internalName": "Comment", "title": "Комментарий", "type": "Note" },
|
||||||
|
|||||||
@@ -12,8 +12,12 @@ import { APPROVAL_PHASE, REQUEST_STATUS } from './models/statuses';
|
|||||||
|
|
||||||
// Внутренние имена колонок списка согласования (создаются провижинингом).
|
// Внутренние имена колонок списка согласования (создаются провижинингом).
|
||||||
const FIELDS = {
|
const FIELDS = {
|
||||||
approver: 'Approver', // «Согласующий» (User) → ApproverId
|
// Внутренние имена с префиксом группы колонок сайта (TansuSite) и «Request» —
|
||||||
status: 'Status', // «Статус» (Choice)
|
// так они заведены в SharePoint. Из них SharePoint выводит имена managed
|
||||||
|
// properties для поиска: TansuSiteApproverOWSUSER и RequestStatusOWSCHCS
|
||||||
|
// (см. MP_APPROVER/MP_STATUS в features/myRequests/myRequests.service.ts).
|
||||||
|
approver: 'TansuSiteApprover', // «Согласующий» (User) → TansuSiteApproverId
|
||||||
|
status: 'RequestStatus', // «Статус» (Choice)
|
||||||
ticket: 'Ticket', // «Заявка» (Lookup) → TicketId
|
ticket: 'Ticket', // «Заявка» (Lookup) → TicketId
|
||||||
date: 'Date', // «Дата» (DateTime)
|
date: 'Date', // «Дата» (DateTime)
|
||||||
comment: 'Comment', // «Комментарий» (Text)
|
comment: 'Comment', // «Комментарий» (Text)
|
||||||
@@ -28,6 +32,12 @@ export interface IApproverToWrite {
|
|||||||
email: string;
|
email: string;
|
||||||
position: string;
|
position: string;
|
||||||
allowReassign: boolean;
|
allowReassign: boolean;
|
||||||
|
/** Порядок (StepOrder). Не задан — берётся позиция в массиве (orderStart + индекс).
|
||||||
|
* Несколько согласующих с ОДИНАКОВЫМ order — параллельный шаг: все становятся
|
||||||
|
* «На согласовании» одновременно (см. createSteps). Сейчас редактор матрицы
|
||||||
|
* (ApprovalMatrix/useMatrixEditor) всегда даёт уникальный order по позиции —
|
||||||
|
* это поле для параллельных шагов, приходящих из внешнего маршрута напрямую. */
|
||||||
|
order?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Все запросы к списку «<форма> — согласование». listTitle задаётся формой.
|
// Все запросы к списку «<форма> — согласование». listTitle задаётся формой.
|
||||||
@@ -38,9 +48,14 @@ export class ApprovalListService {
|
|||||||
return getSP().web.lists.getByTitle(this.listTitle);
|
return getSP().web.lists.getByTitle(this.listTitle);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Пишет по строке на каждого участника фазы с указанным статусом.
|
// Пишет по строке на каждого участника фазы. Порядок (Order) = a.order, если
|
||||||
// Порядок (Order) = orderStart + позиция в массиве (фазы идут подряд в одном списке:
|
// задан, иначе orderStart + позиция в массиве (фазы идут подряд в одном
|
||||||
// сначала согласующие 1..N, затем исполнители N+1..N+M).
|
// списке: сначала согласующие 1..N, затем исполнители N+1..N+M).
|
||||||
|
//
|
||||||
|
// Статус пишется переданным значением ОДИНАКОВО для всех строк партии — кто
|
||||||
|
// сейчас «на очереди», а кто «ждёт», решает отдельно activateNextQueued
|
||||||
|
// (вызывается сразу после createSteps в approvalSubmission.service.ts/writeRoute
|
||||||
|
// и в approverDecision.service.ts/decide).
|
||||||
public async createSteps(
|
public async createSteps(
|
||||||
requestId: number,
|
requestId: number,
|
||||||
approvers: IApproverToWrite[],
|
approvers: IApproverToWrite[],
|
||||||
@@ -48,22 +63,65 @@ export class ApprovalListService {
|
|||||||
phase: string = APPROVAL_PHASE.approval,
|
phase: string = APPROVAL_PHASE.approval,
|
||||||
orderStart: number = 1
|
orderStart: number = 1
|
||||||
): Promise<void> {
|
): Promise<void> {
|
||||||
for (let i = 0; i < approvers.length; i++) {
|
const withOrder = approvers
|
||||||
const a = approvers[i];
|
.map((a, i) => ({ a, order: a.order ?? orderStart + i }))
|
||||||
if (!a.email) continue;
|
.filter((x) => !!x.a.email);
|
||||||
|
|
||||||
|
for (const { a, order } of withOrder) {
|
||||||
const approverId = await this.resolveUserId(a.email);
|
const approverId = await this.resolveUserId(a.email);
|
||||||
await this.list().items.add({
|
await this.list().items.add({
|
||||||
Title: a.position || a.email,
|
Title: a.position || a.email,
|
||||||
[`${FIELDS.approver}Id`]: approverId,
|
[`${FIELDS.approver}Id`]: approverId,
|
||||||
[FIELDS.status]: status,
|
[FIELDS.status]: status,
|
||||||
[`${FIELDS.ticket}Id`]: requestId,
|
[`${FIELDS.ticket}Id`]: requestId,
|
||||||
[FIELDS.order]: orderStart + i,
|
[FIELDS.order]: order,
|
||||||
[FIELDS.allowReassign]: a.allowReassign,
|
[FIELDS.allowReassign]: a.allowReassign,
|
||||||
[FIELDS.phase]: phase,
|
[FIELDS.phase]: phase,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Продвигает очередь: среди ещё не активных строк со статусом «Ждёт очереди»
|
||||||
|
// в текущей фазе активирует те, что делят наименьший StepOrder (обычно одна
|
||||||
|
// строка; несколько — параллельный шаг). Фаза исполнения активируется, только
|
||||||
|
// когда фаза согласования пройдена целиком (без Отклонено/Возвращена) — иначе
|
||||||
|
// строки исполнения остаются «Ждёт очереди». Если фаза согласования уже
|
||||||
|
// остановлена решением, ничего не активирует.
|
||||||
|
public async activateNextQueued(requestId: number): Promise<void> {
|
||||||
|
const rows = await this.getForRequest(requestId);
|
||||||
|
const approvalRows = rows.filter((r) => r.phase !== APPROVAL_PHASE.execution);
|
||||||
|
const execRows = rows.filter((r) => r.phase === APPROVAL_PHASE.execution);
|
||||||
|
|
||||||
|
const approvalStopped = approvalRows.some(
|
||||||
|
(r) => r.status === REQUEST_STATUS.rejected || r.status === REQUEST_STATUS.returned
|
||||||
|
);
|
||||||
|
if (approvalStopped) return;
|
||||||
|
|
||||||
|
const approvalDone =
|
||||||
|
approvalRows.length === 0 || approvalRows.every((r) => r.status === REQUEST_STATUS.approved);
|
||||||
|
|
||||||
|
const activate = async (phaseRows: IApprovalRow[], activeStatus: string): Promise<void> => {
|
||||||
|
if (phaseRows.some((r) => r.status === activeStatus)) return;
|
||||||
|
const queuedRows = phaseRows.filter((r) => r.status === REQUEST_STATUS.queued);
|
||||||
|
if (queuedRows.length === 0) return;
|
||||||
|
const minOrder = Math.min(...queuedRows.map((r) => r.order));
|
||||||
|
await Promise.all(
|
||||||
|
queuedRows.filter((r) => r.order === minOrder).map((r) => this.setStatus(r.id, activeStatus))
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
if (!approvalDone) {
|
||||||
|
await activate(approvalRows, REQUEST_STATUS.onApproval);
|
||||||
|
} else {
|
||||||
|
await activate(execRows, REQUEST_STATUS.onExecution);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Точечное обновление статуса одной строки маршрута.
|
||||||
|
public async setStatus(rowId: number, status: string): Promise<void> {
|
||||||
|
await this.list().items.getById(rowId).update({ [FIELDS.status]: status });
|
||||||
|
}
|
||||||
|
|
||||||
// Добавляет одну строку согласования с заданным Order (для делегата).
|
// Добавляет одну строку согласования с заданным Order (для делегата).
|
||||||
public async addApproverRow(
|
public async addApproverRow(
|
||||||
requestId: number,
|
requestId: number,
|
||||||
@@ -187,19 +245,6 @@ export class ApprovalListService {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Активирует следующий шаг маршрута: первую по очереди строку со статусом
|
|
||||||
// «Ждёт очереди» переводит в активный статус её фазы (Согласование → «На
|
|
||||||
// согласовании», Исполнение → «На исполнении»). Если ждущих нет — ничего.
|
|
||||||
// Вызывается при отправке (активировать первый шаг) и после каждого решения.
|
|
||||||
public async activateNextQueued(requestId: number): Promise<void> {
|
|
||||||
const rows = await this.getForRequest(requestId); // отсортированы по StepOrder
|
|
||||||
const next = rows.filter((r) => r.status === REQUEST_STATUS.queued)[0];
|
|
||||||
if (!next) return;
|
|
||||||
const active =
|
|
||||||
next.phase === APPROVAL_PHASE.execution ? REQUEST_STATUS.onExecution : REQUEST_STATUS.onApproval;
|
|
||||||
await this.list().items.getById(next.id).update({ [FIELDS.status]: active });
|
|
||||||
}
|
|
||||||
|
|
||||||
// Удаляет все строки согласования по заявке (при возврате/повторной отправке).
|
// Удаляет все строки согласования по заявке (при возврате/повторной отправке).
|
||||||
public async deleteForRequest(requestId: number): Promise<void> {
|
public async deleteForRequest(requestId: number): Promise<void> {
|
||||||
const rows = await this.getForRequest(requestId);
|
const rows = await this.getForRequest(requestId);
|
||||||
|
|||||||
@@ -43,13 +43,24 @@ export async function writeApprovers(
|
|||||||
status: string
|
status: string
|
||||||
): Promise<void> {
|
): Promise<void> {
|
||||||
await approval.deleteForRequest(requestId);
|
await approval.deleteForRequest(requestId);
|
||||||
await approval.createSteps(requestId, approvers, status, APPROVAL_PHASE.approval, 1);
|
const submitted = status === REQUEST_STATUS.onApproval;
|
||||||
|
const rowStatus = submitted ? REQUEST_STATUS.queued : status;
|
||||||
|
await approval.createSteps(requestId, approvers, rowStatus, APPROVAL_PHASE.approval, 1);
|
||||||
|
if (submitted) {
|
||||||
|
await approval.activateNextQueued(requestId);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Записать ОБЕ фазы маршрута заявки: согласующих (Order 1..N) и исполнителей
|
// Записать ОБЕ фазы маршрута заявки: согласующих (Order 1..N) и исполнителей
|
||||||
// (Order N+1..N+M) в один список. Исполнители пишутся сразу при отправке —
|
// (Order N+1..N+M) в один список. Исполнители пишутся сразу при отправке —
|
||||||
// стороне согласующего внешний API уже не нужен, переход в фазу исполнения
|
// стороне согласующего внешний API уже не нужен, переход в фазу исполнения
|
||||||
// делает computeRequestStatus, когда все согласующие одобрили.
|
// делает computeRequestStatus, когда все согласующие одобрили.
|
||||||
|
//
|
||||||
|
// Исполнители стартуют ВСЕ как «Ждёт очереди» (rowStatus, та же логика, что и
|
||||||
|
// у согласующих) — до прохождения фазы согласования у исполнителей нет текущей
|
||||||
|
// очереди. Первого исполнителя переключит на «На исполнении»
|
||||||
|
// approval.activateNextQueued, когда фаза согласования будет пройдена целиком
|
||||||
|
// (см. approverDecision.service.ts/decide).
|
||||||
export async function writeRoute(
|
export async function writeRoute(
|
||||||
approval: ApprovalListService,
|
approval: ApprovalListService,
|
||||||
requestId: number,
|
requestId: number,
|
||||||
|
|||||||
@@ -32,17 +32,20 @@ export class ApproverService {
|
|||||||
) {}
|
) {}
|
||||||
|
|
||||||
// Ожидающая строка текущего пользователя, если сейчас его очередь; иначе undefined.
|
// Ожидающая строка текущего пользователя, если сейчас его очередь; иначе undefined.
|
||||||
// Последовательное согласование: активна первая строка со статусом «На согласовании».
|
// Очередь уже проставлена на запись (см. createSteps/advanceQueue) — активна
|
||||||
|
// ровно одна строка со статусом «На согласовании» на фазу, искать «первую по
|
||||||
|
// порядку» не нужно.
|
||||||
public async getPendingRowForCurrentUser(requestId: number): Promise<IApprovalRow | undefined> {
|
public async getPendingRowForCurrentUser(requestId: number): Promise<IApprovalRow | undefined> {
|
||||||
const rows = await this.approval.getForRequest(requestId);
|
const rows = await this.approval.getForRequest(requestId);
|
||||||
const userId = await this.approval.getCurrentUserId();
|
const userId = await this.approval.getCurrentUserId();
|
||||||
// Активна первая незакрытая строка по очереди: согласующий («На согласовании»)
|
// Активные строки текущего шага: согласующий («На согласовании») или, когда
|
||||||
// или, когда согласование пройдено, исполнитель («На исполнении»).
|
// согласование пройдено, исполнитель («На исполнении»). При параллельном шаге
|
||||||
const firstPending = rows.filter(
|
// (одинаковый StepOrder) активных строк может быть несколько сразу — ищем
|
||||||
|
// среди ВСЕХ активных, а не только среди первой по порядку.
|
||||||
|
const active = rows.filter(
|
||||||
(r) => r.status === REQUEST_STATUS.onApproval || r.status === REQUEST_STATUS.onExecution
|
(r) => r.status === REQUEST_STATUS.onApproval || r.status === REQUEST_STATUS.onExecution
|
||||||
)[0];
|
);
|
||||||
if (firstPending && firstPending.approverId === userId) return firstPending;
|
return active.filter((r) => r.approverId === userId)[0];
|
||||||
return undefined;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Делегирование: согласующий добавляет делеганта ПЕРЕД собой (Order — между
|
// Делегирование: согласующий добавляет делеганта ПЕРЕД собой (Order — между
|
||||||
@@ -59,22 +62,24 @@ export class ApproverService {
|
|||||||
const prevOrder = before.length > 0 ? before[before.length - 1].order : current.order - 1;
|
const prevOrder = before.length > 0 ? before[before.length - 1].order : current.order - 1;
|
||||||
const newOrder = (prevOrder + current.order) / 2;
|
const newOrder = (prevOrder + current.order) / 2;
|
||||||
const position = await this.approval.getJobTitle(user.loginName);
|
const position = await this.approval.getJobTitle(user.loginName);
|
||||||
// Делегат наследует фазу той строки, вместо которой действует, и её статус
|
// Делегат наследует фазу той строки, вместо которой согласует (согласование/исполнение).
|
||||||
// ожидания (согласование → «На согласовании», исполнение → «На исполнении»).
|
// Обе строки — делегат и прежний согласующий — уходят в «Ждёт очереди»,
|
||||||
const pendingStatus =
|
// activateNextQueued затем активирует делегата (у него меньший order).
|
||||||
current.phase === APPROVAL_PHASE.execution
|
|
||||||
? REQUEST_STATUS.onExecution
|
|
||||||
: REQUEST_STATUS.onApproval;
|
|
||||||
await this.approval.addApproverRow(
|
await this.approval.addApproverRow(
|
||||||
requestId,
|
requestId,
|
||||||
{ email: user.email, position, allowReassign: false },
|
{ email: user.email, position, allowReassign: false },
|
||||||
newOrder,
|
newOrder,
|
||||||
pendingStatus,
|
REQUEST_STATUS.queued,
|
||||||
current.phase
|
current.phase
|
||||||
);
|
);
|
||||||
|
await this.approval.setStatus(current.id, REQUEST_STATUS.queued);
|
||||||
|
await this.approval.activateNextQueued(requestId);
|
||||||
|
emitRequestsChanged();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Применяет решение: обновляет строку и пересчитывает статус заявки.
|
// Применяет решение: обновляет строку, продвигает очередь (на следующего
|
||||||
|
// согласующего внутри фазы либо на первого исполнителя, если фаза согласования
|
||||||
|
// только что завершилась целиком) и пересчитывает статус заявки.
|
||||||
// Возвращает новый статус заявки.
|
// Возвращает новый статус заявки.
|
||||||
public async decide(
|
public async decide(
|
||||||
requestId: number,
|
requestId: number,
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
export {
|
export {
|
||||||
REQUEST_STATUS,
|
REQUEST_STATUS,
|
||||||
REQUEST_STATUS_CHOICES,
|
REQUEST_STATUS_CHOICES,
|
||||||
|
APPROVAL_ROW_STATUS_CHOICES,
|
||||||
APPROVAL_PHASE,
|
APPROVAL_PHASE,
|
||||||
APPROVAL_PHASE_CHOICES,
|
APPROVAL_PHASE_CHOICES,
|
||||||
EDITABLE_STATUSES,
|
EDITABLE_STATUSES,
|
||||||
|
|||||||
@@ -3,18 +3,28 @@
|
|||||||
// В слое формы кодом ставятся Draft (черновик) и OnApproval (отправка на согласование);
|
// В слое формы кодом ставятся Draft (черновик) и OnApproval (отправка на согласование);
|
||||||
// Approved/Rejected/Returned выставляются при решениях согласующих; Execution/Closed —
|
// Approved/Rejected/Returned выставляются при решениях согласующих; Execution/Closed —
|
||||||
// зарезервированы под будущие этапы.
|
// зарезервированы под будущие этапы.
|
||||||
|
// Статусы СТРОК списка «— согласование» (не заявки в контентном списке):
|
||||||
|
// draft/rejected/returned — общие с заявкой; остальные — только для строк
|
||||||
|
// маршрута, по фазам:
|
||||||
|
// Согласование: queued («Ждёт очереди») → onApproval («На согласовании») → approved/rejected/returned.
|
||||||
|
// Исполнение: queued → onExecution («На исполнении») → executed («Выполнено»).
|
||||||
|
// Активация — только через ApprovalListService.activateNextQueued (вызывается
|
||||||
|
// при отправке заявки и после каждого положительного решения, см.
|
||||||
|
// approvalSubmission.service.ts/writeRoute, approverDecision.service.ts/decide):
|
||||||
|
// среди строк со статусом queued в текущей фазе находит наименьший StepOrder
|
||||||
|
// и переводит её (или несколько, если делят один order — параллельный шаг) в
|
||||||
|
// onApproval/onExecution. Так «чья сейчас очередь» — просто значение колонки
|
||||||
|
// Status, без пересчёта порядка на клиенте.
|
||||||
export const REQUEST_STATUS = {
|
export const REQUEST_STATUS = {
|
||||||
draft: 'Черновик',
|
draft: 'Черновик',
|
||||||
onApproval: 'На согласовании',
|
onApproval: 'На согласовании',
|
||||||
|
queued: 'Ждёт очереди',
|
||||||
|
onExecution: 'На исполнении',
|
||||||
|
executed: 'Выполнено',
|
||||||
approved: 'Согласовано',
|
approved: 'Согласовано',
|
||||||
rejected: 'Отклонено',
|
rejected: 'Отклонено',
|
||||||
returned: 'Возвращена на доработку',
|
returned: 'Возвращена на доработку',
|
||||||
// Статус СТРОКИ маршрута, до которой ещё не дошла очередь (активен только текущий шаг).
|
// Статус ЗАЯВКИ (не строки) на этапе исполнения.
|
||||||
queued: 'Ждёт очереди',
|
|
||||||
// Статусы СТРОК фазы исполнения: активная очередь исполнителя и выполнено.
|
|
||||||
onExecution: 'На исполнении',
|
|
||||||
executed: 'Выполнено',
|
|
||||||
// Статусы ЗАЯВКИ на этапе исполнения.
|
|
||||||
execution: 'Выполнение',
|
execution: 'Выполнение',
|
||||||
closed: 'Закрыта',
|
closed: 'Закрыта',
|
||||||
} as const;
|
} as const;
|
||||||
@@ -33,20 +43,40 @@ export function isEditableStatus(status: string | undefined): boolean {
|
|||||||
return !status || EDITABLE_STATUSES.indexOf(status) !== -1;
|
return !status || EDITABLE_STATUSES.indexOf(status) !== -1;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Полный набор значений для Choice-колонки Status при провижининге.
|
// Наборов значений ДВА, и они не совпадают — это разные сущности:
|
||||||
|
//
|
||||||
|
// 1) статус ЗАЯВКИ — колонка Status в списке «… — данные». Пишется формой
|
||||||
|
// (Черновик/На согласовании) и computeRequestStatus после каждого решения.
|
||||||
|
// «Ждёт очереди»/«На исполнении»/«Выполнено» здесь не бывают: это состояния
|
||||||
|
// отдельного шага маршрута, а не заявки целиком.
|
||||||
|
//
|
||||||
|
// 2) статус СТРОКИ МАРШРУТА — колонка RequestStatus в списке «… — согласование».
|
||||||
|
// Пишется createSteps/activateNextQueued/setDecision. «Выполнение»/«Закрыта»
|
||||||
|
// здесь не бывают: это агрегатные состояния заявки, у отдельного шага
|
||||||
|
// смысла не имеют.
|
||||||
|
//
|
||||||
|
// Держать их в синхроне с forms/*/provisioning.json и forms/*/approval/provisioning.json.
|
||||||
export const REQUEST_STATUS_CHOICES: string[] = [
|
export const REQUEST_STATUS_CHOICES: string[] = [
|
||||||
REQUEST_STATUS.draft,
|
REQUEST_STATUS.draft,
|
||||||
REQUEST_STATUS.onApproval,
|
REQUEST_STATUS.onApproval,
|
||||||
REQUEST_STATUS.approved,
|
REQUEST_STATUS.approved,
|
||||||
REQUEST_STATUS.rejected,
|
REQUEST_STATUS.rejected,
|
||||||
REQUEST_STATUS.returned,
|
REQUEST_STATUS.returned,
|
||||||
REQUEST_STATUS.queued,
|
|
||||||
REQUEST_STATUS.onExecution,
|
|
||||||
REQUEST_STATUS.executed,
|
|
||||||
REQUEST_STATUS.execution,
|
REQUEST_STATUS.execution,
|
||||||
REQUEST_STATUS.closed,
|
REQUEST_STATUS.closed,
|
||||||
];
|
];
|
||||||
|
|
||||||
|
export const APPROVAL_ROW_STATUS_CHOICES: string[] = [
|
||||||
|
REQUEST_STATUS.draft,
|
||||||
|
REQUEST_STATUS.queued,
|
||||||
|
REQUEST_STATUS.onApproval,
|
||||||
|
REQUEST_STATUS.onExecution,
|
||||||
|
REQUEST_STATUS.approved,
|
||||||
|
REQUEST_STATUS.executed,
|
||||||
|
REQUEST_STATUS.rejected,
|
||||||
|
REQUEST_STATUS.returned,
|
||||||
|
];
|
||||||
|
|
||||||
// Фаза строки в списке маршрута: согласование (кто одобряет) и исполнение
|
// Фаза строки в списке маршрута: согласование (кто одобряет) и исполнение
|
||||||
// (кто выполняет после согласования). Обе фазы живут в одном списке «— согласование»,
|
// (кто выполняет после согласования). Обе фазы живут в одном списке «— согласование»,
|
||||||
// строки различаются колонкой Phase. Значения приходят из внешнего API как
|
// строки различаются колонкой Phase. Значения приходят из внешнего API как
|
||||||
|
|||||||
@@ -4,9 +4,18 @@ import '@pnp/sp/lists';
|
|||||||
import '@pnp/sp/items';
|
import '@pnp/sp/items';
|
||||||
import '@pnp/sp/attachments';
|
import '@pnp/sp/attachments';
|
||||||
import '@pnp/sp/site-users/web';
|
import '@pnp/sp/site-users/web';
|
||||||
|
import { BrowserFetchWithRetry } from '@pnp/queryable';
|
||||||
import { WebPartContext } from '@microsoft/sp-webpart-base';
|
import { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||||
import { DATA_SITE_URL } from '../config';
|
import { DATA_SITE_URL } from '../config';
|
||||||
|
|
||||||
|
// Мягкая ретрай-политика вместо стандартной PnPjs (retries: 3, interval: 200).
|
||||||
|
// Дефолт слишком напорист: при отказе (429 «слишком много запросов», 503) он
|
||||||
|
// начинает повторять почти сразу, что при массовой загрузке только усугубляет
|
||||||
|
// throttling со стороны SharePoint. Здесь меньше попыток и заметно длиннее
|
||||||
|
// первая пауза; интервал в PnPjs удваивается с каждой попыткой, так что выходит
|
||||||
|
// примерно 1.5с → 3с.
|
||||||
|
const RETRY = { retries: 2, interval: 1500 };
|
||||||
|
|
||||||
// Единый инициализированный клиент PnPjs на весь web part.
|
// Единый инициализированный клиент PnPjs на весь web part.
|
||||||
let _sp: SPFI | undefined;
|
let _sp: SPFI | undefined;
|
||||||
|
|
||||||
@@ -16,7 +25,18 @@ let _sp: SPFI | undefined;
|
|||||||
* списки живут там, где бы ни стоял сам web part. Авторизация берётся из context.
|
* списки живут там, где бы ни стоял сам web part. Авторизация берётся из context.
|
||||||
*/
|
*/
|
||||||
export function initSP(context: WebPartContext): void {
|
export function initSP(context: WebPartContext): void {
|
||||||
_sp = spfi(DATA_SITE_URL).using(SPFx(context));
|
_sp = spfi(DATA_SITE_URL).using(SPFx(context), BrowserFetchWithRetry(RETRY));
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Клиент для ПРОИЗВОЛЬНОГО сайта (списки типов заявок живут на разных сайтах,
|
||||||
|
* см. approval-route API). В отличие от getSP() не кэшируется — адрес сайта
|
||||||
|
* приходит из данных. Ретрай-политика та же, что и у основного клиента:
|
||||||
|
* BrowserFetchWithRetry идёт ПОСЛЕ SPFx, поэтому заменяет его обработчик
|
||||||
|
* отправки (у behavior replace: true по умолчанию).
|
||||||
|
*/
|
||||||
|
export function spForSite(siteUrl: string, context: WebPartContext): SPFI {
|
||||||
|
return spfi(siteUrl).using(SPFx(context), BrowserFetchWithRetry(RETRY));
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Получить инициализированный клиент. Бросает, если initSP не был вызван. */
|
/** Получить инициализированный клиент. Бросает, если initSP не был вызван. */
|
||||||
|
|||||||
@@ -3,7 +3,8 @@ import * as React from 'react';
|
|||||||
// Маршрутизация портала по параметрам URL.
|
// Маршрутизация портала по параметрам URL.
|
||||||
//
|
//
|
||||||
// Раздел бокового меню — rpnav: 'new' (подать заявку, по умолчанию),
|
// Раздел бокового меню — rpnav: 'new' (подать заявку, по умолчанию),
|
||||||
// 'approvals' (ждут моего решения), 'own' (мои заявки).
|
// 'approvals' (ждут моего решения), 'own' (мои заявки), 'search' (поиск
|
||||||
|
// сразу по обеим категориям — и по своим заявкам, и по тем, где участвовал).
|
||||||
// Открытая заявка — переход по ссылке из потока Power Automate или клик по
|
// Открытая заявка — переход по ссылке из потока Power Automate или клик по
|
||||||
// строке таблицы:
|
// строке таблицы:
|
||||||
// …/СтраницаПортала.aspx?rpmode=approve&rptype=<форма>&rpid=<RowID>
|
// …/СтраницаПортала.aspx?rpmode=approve&rptype=<форма>&rpid=<RowID>
|
||||||
@@ -22,7 +23,7 @@ import * as React from 'react';
|
|||||||
export type PortalMode = 'submit' | 'approve' | 'create';
|
export type PortalMode = 'submit' | 'approve' | 'create';
|
||||||
|
|
||||||
/** Раздел бокового меню. */
|
/** Раздел бокового меню. */
|
||||||
export type NavSection = 'new' | 'approvals' | 'own';
|
export type NavSection = 'new' | 'approvals' | 'own' | 'search';
|
||||||
|
|
||||||
export interface IRoute {
|
export interface IRoute {
|
||||||
mode: PortalMode;
|
mode: PortalMode;
|
||||||
@@ -39,7 +40,7 @@ export interface IRoute {
|
|||||||
const ROUTE_CHANGE_EVENT = 'rp-route-change';
|
const ROUTE_CHANGE_EVENT = 'rp-route-change';
|
||||||
|
|
||||||
function parseNav(raw: string | undefined): NavSection {
|
function parseNav(raw: string | undefined): NavSection {
|
||||||
if (raw === 'approvals' || raw === 'own') return raw;
|
if (raw === 'approvals' || raw === 'own' || raw === 'search') return raw;
|
||||||
return 'new';
|
return 'new';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,76 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
|
||||||
|
// Текст поиска переживает перезагрузку страницы (localStorage), но не более
|
||||||
|
// того — это просто «продолжить с того же места», а не синхронизация между
|
||||||
|
// вкладками/устройствами. key должен быть уникальным на раздел (см. вызовы в
|
||||||
|
// RequestsTableView/SearchView), иначе значения разных таблиц перепишут друг друга.
|
||||||
|
function readStored(storageKey: string): string {
|
||||||
|
try {
|
||||||
|
return window.localStorage.getItem(storageKey) || '';
|
||||||
|
} catch {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export function usePersistedQuery(key: string): [string, (value: string) => void] {
|
||||||
|
const storageKey = `rp-search-query:${key}`;
|
||||||
|
|
||||||
|
const [value, setValue] = React.useState<string>(() => readStored(storageKey));
|
||||||
|
|
||||||
|
// Компонент может продолжать жить, когда key поменялся: RequestsTableView —
|
||||||
|
// это один и тот же элемент для вкладок «На согласовании» и «Мои заявки»,
|
||||||
|
// меняется только проп kind. Инициализатор useState при этом повторно НЕ
|
||||||
|
// срабатывает, поэтому без перечитывания текст из одной вкладки оставался бы
|
||||||
|
// на экране во второй и записывался уже под её ключ — выглядело бы так, будто
|
||||||
|
// ключ у них общий.
|
||||||
|
const prevKey = React.useRef<string>(storageKey);
|
||||||
|
React.useEffect(() => {
|
||||||
|
if (prevKey.current === storageKey) return;
|
||||||
|
prevKey.current = storageKey;
|
||||||
|
setValue(readStored(storageKey));
|
||||||
|
}, [storageKey]);
|
||||||
|
|
||||||
|
const setPersisted = React.useCallback(
|
||||||
|
(next: string): void => {
|
||||||
|
setValue(next);
|
||||||
|
try {
|
||||||
|
if (next) {
|
||||||
|
window.localStorage.setItem(storageKey, next);
|
||||||
|
} else {
|
||||||
|
window.localStorage.removeItem(storageKey);
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// localStorage недоступен (приватный режим и т.п.) — просто не сохраняем.
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[storageKey]
|
||||||
|
);
|
||||||
|
|
||||||
|
return [value, setPersisted];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Задержка перед тем, как введённый текст уйдёт в запрос. Без неё поиск
|
||||||
|
// срабатывает на КАЖДОЕ нажатие клавиши: «согласование» — это 12 полных циклов
|
||||||
|
// (Search + дочитывание через REST по каждому типу заявок), из которых нужен
|
||||||
|
// только последний. Заодно снимает часть нагрузки, из-за которой SharePoint
|
||||||
|
// начинает throttling'ить (429).
|
||||||
|
const SEARCH_DEBOUNCE_MS = 450;
|
||||||
|
|
||||||
|
// Значение, отстающее от переданного на SEARCH_DEBOUNCE_MS: в поле ввода текст
|
||||||
|
// меняется сразу (без «залипания»), а в запрос уходит только когда пользователь
|
||||||
|
// перестал печатать. Пустая строка проходит без задержки — очистка поиска
|
||||||
|
// должна возвращать полный список мгновенно.
|
||||||
|
export function useDebouncedQuery(value: string, delayMs: number = SEARCH_DEBOUNCE_MS): string {
|
||||||
|
const [debounced, setDebounced] = React.useState<string>(value);
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
if (!value) {
|
||||||
|
setDebounced('');
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
const timer = window.setTimeout(() => setDebounced(value), delayMs);
|
||||||
|
return () => window.clearTimeout(timer);
|
||||||
|
}, [value, delayMs]);
|
||||||
|
|
||||||
|
return debounced;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user