Compare commits
10 Commits
d8737a15e3
...
bd3689cf14
| Author | SHA1 | Date | |
|---|---|---|---|
| bd3689cf14 | |||
| a86c8d5464 | |||
| 86ce7056e8 | |||
| 71873e0c30 | |||
| 9438ee30ad | |||
| 68638c765e | |||
| 295d9b7914 | |||
| 63a610655f | |||
| 8f7d81d2b6 | |||
| 571614c031 |
@@ -62,7 +62,20 @@ function Add-Column {
|
|||||||
param([string]$List, $Col)
|
param([string]$List, $Col)
|
||||||
|
|
||||||
if (Test-FieldExists -List $List -InternalName $Col.internalName) {
|
if (Test-FieldExists -List $List -InternalName $Col.internalName) {
|
||||||
|
# Колонка уже есть. Для Choice — досетапливаем варианты (могли добавиться новые
|
||||||
|
# статусы): существующие значения сохраняются, добавляются недостающие.
|
||||||
|
if ($Col.type -eq 'Choice' -and $Col.choices) {
|
||||||
|
try {
|
||||||
|
Set-PnPField -List $List -Identity $Col.internalName -Values @{ Choices = [string[]]$Col.choices } | Out-Null
|
||||||
|
Write-Host " [~] варианты обновлены: $($Col.internalName)" -ForegroundColor DarkGray
|
||||||
|
}
|
||||||
|
catch {
|
||||||
|
Write-Warning " [!] $($Col.internalName): не удалось обновить варианты — $($_.Exception.Message)"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
Write-Host " [=] колонка есть: $($Col.internalName)" -ForegroundColor DarkGray
|
Write-Host " [=] колонка есть: $($Col.internalName)" -ForegroundColor DarkGray
|
||||||
|
}
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -72,6 +72,9 @@
|
|||||||
padding: $sp-6;
|
padding: $sp-6;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Печать заявки идёт в отдельном окне (см. shared/ui/PrintButton), поэтому
|
||||||
|
// print-обходов для панели тут не нужно.
|
||||||
|
|
||||||
@keyframes slide {
|
@keyframes slide {
|
||||||
from { transform: translateX(24px); opacity: .6; }
|
from { transform: translateX(24px); opacity: .6; }
|
||||||
to { transform: translateX(0); opacity: 1; }
|
to { transform: translateX(0); opacity: 1; }
|
||||||
|
|||||||
@@ -8,6 +8,21 @@
|
|||||||
.CanvasComponent.LCS .CanvasZone {
|
.CanvasComponent.LCS .CanvasZone {
|
||||||
max-width: 100% !important;
|
max-width: 100% !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ---- Печать ----
|
||||||
|
// Печать идёт в ОТДЕЛЬНОМ чистом окне (см. shared/ui/PrintButton): документ
|
||||||
|
// .rp-print-root переносится туда со стилями страницы, поэтому скролл-контейнеры
|
||||||
|
// и высота SharePoint печать не режут. Здесь — только вид полей на печати
|
||||||
|
// (read-only без серой заливки), эти правила применяются и в окне печати.
|
||||||
|
@media print {
|
||||||
|
.rp-print-root input,
|
||||||
|
.rp-print-root textarea,
|
||||||
|
.rp-print-root select {
|
||||||
|
background: transparent !important;
|
||||||
|
color: #000 !important;
|
||||||
|
border-color: #ccc !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.requestPortal {
|
.requestPortal {
|
||||||
|
|||||||
@@ -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;
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -7,10 +7,14 @@ import {
|
|||||||
getPendingApproval,
|
getPendingApproval,
|
||||||
getPendingApprovalIndex,
|
getPendingApprovalIndex,
|
||||||
hydratePendingAuthors,
|
hydratePendingAuthors,
|
||||||
|
searchOwnRequests,
|
||||||
} from './myRequests.service';
|
} 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;
|
||||||
@@ -21,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 {
|
||||||
@@ -48,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).
|
||||||
@@ -175,12 +119,19 @@ const Table: React.FC<{
|
|||||||
|
|
||||||
// Раздел с таблицей заявок: поиск по всем полям + вывод постранично.
|
// Раздел с таблицей заявок: поиск по всем полям + вывод постранично.
|
||||||
//
|
//
|
||||||
// 'own' — Search сразу с пагинацией (RowLimit/StartRow): автор = текущий
|
// Движок выбирается по наличию текста в поиске, а не по разделу: БЕЗ запроса —
|
||||||
// пользователь + текст запроса по всем полям.
|
// всегда обычный REST (мгновенно свежий, без задержки индексации), С запросом —
|
||||||
|
// всегда Search (полнотекстовый, но переиндексируется с задержкой). Раньше
|
||||||
|
// поиск подмешивал REST для «свежих» строк поверх Search — из-за этого
|
||||||
|
// результат мог быть неустойчивым (заявка то находилась, то нет, в зависимости
|
||||||
|
// от того, попала ли она в окно подстраховки); эту гибридную логику убрали.
|
||||||
//
|
//
|
||||||
// 'approvals' без поиска — обычный REST, отфильтрованный по ApproverId(+Status),
|
// 'own' без поиска — getOwnRequests (REST по AuthorId, страница режется в
|
||||||
// страница нарезается на СЕРВЕРЕ (getPendingApproval сам берёт нужный срез
|
// памяти). 'own' с поиском — searchOwnRequests (Search, RowLimit/StartRow).
|
||||||
// индекса и дочитывает автора только для него).
|
//
|
||||||
|
// 'approvals' без поиска — getPendingApproval, REST по ApproverId(+Status),
|
||||||
|
// страница нарезается на СЕРВЕРЕ (сам берёт нужный срез индекса и дочитывает
|
||||||
|
// автора только для него).
|
||||||
// 'approvals' с поиском — область расширяется до «где пользователь вообще есть
|
// 'approvals' с поиском — область расширяется до «где пользователь вообще есть
|
||||||
// в маршруте» (getPendingApprovalIndex, ПОЛНЫЙ список без автора — постранично
|
// в маршруте» (getPendingApprovalIndex, ПОЛНЫЙ список без автора — постранично
|
||||||
// его тут не взять, т.к. фильтрация текстом идёт уже после), затем текстовый
|
// его тут не взять, т.к. фильтрация текстом идёт уже после), затем текстовый
|
||||||
@@ -191,15 +142,24 @@ const Table: React.FC<{
|
|||||||
// Оба варианта перечитываются по событию 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;
|
||||||
@@ -218,45 +178,58 @@ 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 = async (): Promise<void> => {
|
// Сразу показываем то, что уже загружали для ЭТОЙ вкладки (и этого запроса
|
||||||
try {
|
// и страницы), а обновление идёт фоном. Компонент один на обе вкладки —
|
||||||
|
// без кеша при переключении на экране оставались бы строки предыдущей
|
||||||
|
// вкладки, пока не придёт ответ. Если для этой вкладки данных ещё нет —
|
||||||
|
// rows становится undefined, и показывается «Загрузка…».
|
||||||
|
const cached = readPage(cacheKey);
|
||||||
|
setRows(cached ? cached.rows : undefined);
|
||||||
|
setTotalRows(cached ? cached.totalRows : 0);
|
||||||
|
|
||||||
|
const fetchPage = async (): Promise<IPage> => {
|
||||||
if (kind === 'own') {
|
if (kind === 'own') {
|
||||||
const r = await getOwnRequests(context, types, query, page);
|
return debouncedQuery.trim().length > 0
|
||||||
if (cancelled) return;
|
? searchOwnRequests(context, types, debouncedQuery, page)
|
||||||
setRows(r.rows);
|
: getOwnRequests(context, types, page);
|
||||||
setTotalRows(r.totalRows);
|
|
||||||
setError('');
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const hasQuery = query.trim().length > 0;
|
if (debouncedQuery.trim().length === 0) {
|
||||||
|
|
||||||
if (!hasQuery) {
|
|
||||||
// Без поиска — страница уже нарезана и дочитана сервером.
|
// Без поиска — страница уже нарезана и дочитана сервером.
|
||||||
const r = await getPendingApproval(context, 'myTurn', page);
|
const r = await getPendingApproval(context, 'myTurn', page);
|
||||||
if (cancelled) return;
|
return { rows: r.rows, totalRows: r.totalRows };
|
||||||
console.table(r.debug);
|
|
||||||
setRows(r.rows);
|
|
||||||
setTotalRows(r.totalRows);
|
|
||||||
setError('');
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// С поиском — сначала полный список «где я есть в маршруте» (без
|
// С поиском — сначала полный список «где я есть в маршруте» (без
|
||||||
// автора), фильтруем текстом, и только потом режем на страницы и
|
// автора), фильтруем текстом, и только потом режем на страницы и
|
||||||
// дочитываем автора — только для видимой страницы.
|
// дочитываем автора — только для видимой страницы.
|
||||||
const idx = await getPendingApprovalIndex(context, 'involved');
|
const idx = await getPendingApprovalIndex(context, 'involved');
|
||||||
if (cancelled) return;
|
const filtered = await filterPendingByQuery(context, idx.types, idx.rows, debouncedQuery);
|
||||||
console.table(idx.debug);
|
|
||||||
const filtered = await filterPendingByQuery(context, idx.types, idx.rows, query);
|
|
||||||
if (cancelled) return;
|
|
||||||
const pageRows = filtered.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
|
const pageRows = filtered.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
|
||||||
await hydratePendingAuthors(context, idx.types, pageRows);
|
await hydratePendingAuthors(context, idx.types, pageRows);
|
||||||
|
return { rows: pageRows, totalRows: filtered.length };
|
||||||
|
};
|
||||||
|
|
||||||
|
const load = async (): Promise<void> => {
|
||||||
|
try {
|
||||||
|
const fresh = await fetchPage();
|
||||||
if (cancelled) return;
|
if (cancelled) return;
|
||||||
setRows(pageRows);
|
|
||||||
setTotalRows(filtered.length);
|
// Перерисовываем, только если данные реально изменились — иначе при
|
||||||
|
// каждом возврате на вкладку таблица моргала бы, перерисовываясь тем же
|
||||||
|
// самым содержимым.
|
||||||
|
const prev = readPage(cacheKey);
|
||||||
|
if (!prev || pageSignature(prev) !== pageSignature(fresh)) {
|
||||||
|
writePage(cacheKey, fresh);
|
||||||
|
setRows(fresh.rows);
|
||||||
|
setTotalRows(fresh.totalRows);
|
||||||
|
}
|
||||||
setError('');
|
setError('');
|
||||||
|
if (onMyTurnCountChange && kind === 'approvals' && debouncedQuery.trim().length === 0) {
|
||||||
|
onMyTurnCountChange(fresh.totalRows);
|
||||||
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (!cancelled) setError((e as Error).message);
|
if (!cancelled) setError((e as Error).message);
|
||||||
}
|
}
|
||||||
@@ -270,10 +243,10 @@ export const RequestsTableView: React.FC<IRequestsTableViewProps> = ({ context,
|
|||||||
cancelled = true;
|
cancelled = true;
|
||||||
unsubscribe();
|
unsubscribe();
|
||||||
};
|
};
|
||||||
}, [context, types, kind, query, page]);
|
}, [context, types, kind, debouncedQuery, page]);
|
||||||
|
|
||||||
// Обе ветки теперь отдают уже нарезанную страницу — просто показываем как есть.
|
// Обе ветки теперь отдают уже нарезанную страницу — просто показываем как есть.
|
||||||
const q = query.trim();
|
const q = debouncedQuery.trim();
|
||||||
const total = totalRows;
|
const total = totalRows;
|
||||||
const visible = rows || [];
|
const visible = rows || [];
|
||||||
const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
|
const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
|
||||||
@@ -301,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,4 +1,4 @@
|
|||||||
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 { IList } from '@pnp/sp/lists';
|
||||||
@@ -16,10 +16,27 @@ const DATA_LIST_SUFFIX = /\s*—\s*данные\s*$/;
|
|||||||
|
|
||||||
// Свежие заявки/строки (созданы или изменены недавно) поисковый индекс может
|
// Свежие заявки/строки (созданы или изменены недавно) поисковый индекс может
|
||||||
// ещё не проиндексировать — такие добираем обычным REST-ом напрямую, в обход
|
// ещё не проиндексировать — такие добираем обычным REST-ом напрямую, в обход
|
||||||
// Search, и подмешиваем к результату (см. getOwnRequests, indexApprovalsForType,
|
// Search, и подмешиваем к результату (см. indexApprovalsForType/myTurn,
|
||||||
// filterPendingByQuery).
|
// getFreshOwnRowsForType). Используется ТОЛЬКО в паре с Search (гибрид для
|
||||||
|
// таблиц без текстового запроса — там, где важны и масштаб, и мгновенная
|
||||||
|
// свежесть); при поиске по тексту эта подстраховка не применяется (см. RequestsTableView).
|
||||||
const RECENT_MS = 10 * 60 * 1000;
|
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();
|
||||||
}
|
}
|
||||||
@@ -150,7 +167,7 @@ async function indexApprovalsForType(
|
|||||||
try {
|
try {
|
||||||
if (!tokenEmail) return { rows: [], debug };
|
if (!tokenEmail) return { rows: [], debug };
|
||||||
|
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
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')();
|
||||||
@@ -163,58 +180,68 @@ async function indexApprovalsForType(
|
|||||||
debug.approvalListTitle = approvalListTitle;
|
debug.approvalListTitle = approvalListTitle;
|
||||||
const approvalList = sp.web.lists.getByTitle(approvalListTitle);
|
const approvalList = sp.web.lists.getByTitle(approvalListTitle);
|
||||||
|
|
||||||
// Approver/EMail eq '...' в $filter по Person-полю ненадёжен в SharePoint
|
// TansuSiteApprover/EMail eq '...' в $filter по Person-полю ненадёжен в
|
||||||
// REST — резолвим email в числовой Id пользователя (как и везде в проекте,
|
// SharePoint REST — резолвим email в числовой Id пользователя (как и везде в
|
||||||
// см. ensureUser) и фильтруем по ApproverId.
|
// проекте, см. ensureUser) и фильтруем по TansuSiteApproverId.
|
||||||
//
|
//
|
||||||
// Status в $filter НЕ используем: подтверждено на практике — фильтр
|
// RequestStatus в $filter НЕ используем: подтверждено на практике — фильтр
|
||||||
// `Status eq 'На согласовании'` (кириллица в $filter) молча возвращает 0
|
// вида `RequestStatus eq 'На согласовании'` (кириллица в $filter) молча
|
||||||
// строк, даже когда без него те же строки находятся с этим же значением
|
// возвращает 0 строк, даже когда без него те же строки находятся с этим же
|
||||||
// Status. Поэтому фильтруем только по ApproverId (числовое значение,
|
// значением статуса. Поэтому фильтруем только по TansuSiteApproverId
|
||||||
// проблем нет), а Status сравниваем в JS после получения строк.
|
// (числовое значение, проблем нет), а статус сравниваем в JS после
|
||||||
|
// получения строк.
|
||||||
const claimsLogin = tokenEmail.indexOf('|') >= 0 ? tokenEmail : `i:0#.f|membership|${tokenEmail}`;
|
const claimsLogin = tokenEmail.indexOf('|') >= 0 ? tokenEmail : `i:0#.f|membership|${tokenEmail}`;
|
||||||
const approver = await sp.web.ensureUser(claimsLogin);
|
const approver = await sp.web.ensureUser(claimsLogin);
|
||||||
|
|
||||||
let stepRows: Array<Record<string, unknown>>;
|
let stepRows: Array<Record<string, unknown>>;
|
||||||
|
|
||||||
if (scope === 'myTurn') {
|
if (scope === 'myTurn') {
|
||||||
// 'myTurn' решает, надо ли действовать ПРЯМО СЕЙЧАС — Status должен быть
|
// 'myTurn' — гибрид для масштаба (список согласования может быть очень
|
||||||
// гарантированно свежим (индекс Search обновляется с задержкой и мог бы
|
// большим): Search находит кандидатов, не сканируя список целиком, плюс
|
||||||
// показать уже решённый шаг как ожидающий). Поэтому здесь только REST,
|
// REST по «последним N минутам» (Modified) добирает то, что Search мог ещё
|
||||||
// весь список по ApproverId, без архивного Search-довеска.
|
// не проиндексировать. Status в обоих случаях берётся СВЕЖИМ через REST по
|
||||||
const allRows: Array<Record<string, unknown>> = [];
|
// найденным Id (не из индекса Search) — именно это делает
|
||||||
for await (const p of approvalList.items
|
// getInvolvedRowsViaSearch, поэтому решение «моя очередь сейчас» всегда
|
||||||
.filter(`ApproverId eq ${approver.Id}`)
|
// точное, даже когда список кандидатов пришёл из Search.
|
||||||
.select('Id', 'TicketId', 'Status')
|
|
||||||
.top(2000)) {
|
|
||||||
allRows.push(...(p as Array<Record<string, unknown>>));
|
|
||||||
}
|
|
||||||
stepRows = allRows.filter((r) => r.Status === REQUEST_STATUS.onApproval);
|
|
||||||
console.log(
|
|
||||||
`[Текущие заявки] «${type.name}»: список согласования «${approvalListTitle}», approver.Id=${approver.Id}, scope=myTurn, строк по ApproverId: ${allRows.length}, после фильтра по статусу: ${stepRows.length}`
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
// 'involved' — просто «участвовал ли вообще», Status не важен для
|
|
||||||
// истинности результата, поэтому здесь можно рискнуть Search-ом для
|
|
||||||
// архивной (не только что созданной/изменённой) части: свежее по
|
|
||||||
// Modified — REST, остальное — Search по managed property ApproverOWSUSER
|
|
||||||
// (кастомное поле, не гарантировано, что проиндексировано — см. лог).
|
|
||||||
const cutoffIso = new Date(Date.now() - RECENT_MS).toISOString();
|
const cutoffIso = new Date(Date.now() - RECENT_MS).toISOString();
|
||||||
const recentRows = (await approvalList.items
|
const recentRows = (await approvalList.items
|
||||||
.filter(`ApproverId eq ${approver.Id} and Modified ge '${cutoffIso}'`)
|
.filter(`TansuSiteApproverId eq ${approver.Id} and Modified ge '${cutoffIso}'`)
|
||||||
.select('Id', 'TicketId', 'Status')
|
.select('Id', 'TicketId', 'RequestStatus')
|
||||||
.top(2000)()) as Array<Record<string, unknown>>;
|
.top(2000)()) as Array<Record<string, unknown>>;
|
||||||
|
|
||||||
const archivalRows = await getArchivalInvolvedRows(context, type, approvalList, claimsLogin);
|
// Статусы уходят в KQL: сервер сразу отдаёт только активные строки,
|
||||||
|
// а не всё, где пользователь есть в маршруте.
|
||||||
|
const searchRows = await getInvolvedRowsViaSearch(context, type, approvalList, [
|
||||||
|
REQUEST_STATUS.onApproval,
|
||||||
|
REQUEST_STATUS.onExecution,
|
||||||
|
]);
|
||||||
const seenIds = new Set(recentRows.map((r) => r.Id));
|
const seenIds = new Set(recentRows.map((r) => r.Id));
|
||||||
stepRows = recentRows.concat(archivalRows.filter((r) => !seenIds.has(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(
|
console.log(
|
||||||
`[Текущие заявки] «${type.name}»: список согласования «${approvalListTitle}», approver.Id=${approver.Id}, scope=involved — свежих (REST, < 10 мин): ${recentRows.length}, архивных (Search): ${archivalRows.length}, итого: ${stepRows.length}`
|
`[Текущие заявки] «${type.name}»: список согласования «${approvalListTitle}», approver.Id=${approver.Id}, scope=involved (Search) — найдено: ${stepRows.length}`
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
console.table(stepRows.map((r) => ({ Id: r.Id, TicketId: r.TicketId, Status: r.Status })));
|
console.table(stepRows.map((r) => ({ Id: r.Id, TicketId: r.TicketId, RequestStatus: r.RequestStatus })));
|
||||||
debug.approvalRowCount = stepRows.length;
|
debug.approvalRowCount = stepRows.length;
|
||||||
|
|
||||||
// Дедуп по TicketId: при scope='involved' у одной заявки может найтись
|
// Дедуп по TicketId: при scope='involved' у одной заявки может найтись
|
||||||
@@ -249,21 +276,39 @@ async function indexApprovalsForType(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Архивная (не только что созданная/изменённая) часть 'involved' — через
|
// Строки согласования текущего пользователя через Search, чтобы не сканировать
|
||||||
// Search по managed property ApproverOWSUSER (кастомное Person-поле, НЕТ
|
// список целиком (он растёт с каждой заявкой).
|
||||||
// гарантии, что проиндексировано без ручной настройки Search Schema — если
|
|
||||||
// лог покажет «найдено: 0» при заведомо непустом архиве, значит не сработало
|
|
||||||
// и стоит вернуться на чистый REST для этой ветки).
|
|
||||||
//
|
//
|
||||||
// Search используется ТОЛЬКО чтобы найти Id строк — TicketId и Status берём
|
// Фильтр по согласующему — managed property MP_APPROVER. Имя нестандартное
|
||||||
// свежими через REST по этим Id, а не из индекса (индекс мог устареть).
|
// (с префиксом группы колонок сайта), см. комментарий к константе: «ожидаемого»
|
||||||
async function getArchivalInvolvedRows(
|
// ApproverOWSUSER в схеме поиска нет вовсе, из-за чего запросы по нему долго
|
||||||
|
// возвращали 0.
|
||||||
|
//
|
||||||
|
// statuses задаёт фильтр по статусу строки прямо в KQL — нужен для режима
|
||||||
|
// «чья сейчас очередь» (без текстового поиска), чтобы страницу резал СЕРВЕР:
|
||||||
|
// без него в выдачу попали бы все строки, где пользователь вообще есть в
|
||||||
|
// маршруте, и после отбрасывания неактивных в странице появлялись бы дыры.
|
||||||
|
// Пустой массив — не фильтровать (режим текстового поиска: там важна полнота).
|
||||||
|
//
|
||||||
|
// Search используется ТОЛЬКО чтобы сузить набор Id — TicketId и Status берём
|
||||||
|
// свежими через REST по этим Id, а не из индекса (индекс мог устареть, а на
|
||||||
|
// устаревшем статусе решение «моя очередь» строить нельзя).
|
||||||
|
async function getInvolvedRowsViaSearch(
|
||||||
context: WebPartContext,
|
context: WebPartContext,
|
||||||
type: IRequestType,
|
type: IRequestType,
|
||||||
approvalList: IList,
|
approvalList: IList,
|
||||||
claimsLogin: string
|
statuses: string[] = []
|
||||||
): Promise<Array<Record<string, unknown>>> {
|
): Promise<Array<Record<string, unknown>>> {
|
||||||
try {
|
try {
|
||||||
|
const email = currentUserEmail(context);
|
||||||
|
if (!email) {
|
||||||
|
console.warn(
|
||||||
|
`[Текущие заявки] «${type.name}»: у текущего пользователя нет email — Search по согласующему невозможен`
|
||||||
|
);
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
const claimsLogin = `i:0#.f|membership|${email}`;
|
||||||
|
|
||||||
const rootFolder = (await approvalList
|
const rootFolder = (await approvalList
|
||||||
.select('RootFolder/ServerRelativeUrl')
|
.select('RootFolder/ServerRelativeUrl')
|
||||||
.expand('RootFolder')()) as { RootFolder?: { ServerRelativeUrl?: string } };
|
.expand('RootFolder')()) as { RootFolder?: { ServerRelativeUrl?: string } };
|
||||||
@@ -271,31 +316,44 @@ async function getArchivalInvolvedRows(
|
|||||||
if (!relUrl) return [];
|
if (!relUrl) return [];
|
||||||
const approvalListAbsUrl = `${siteOrigin(type.siteUrl as string)}${relUrl}`;
|
const approvalListAbsUrl = `${siteOrigin(type.siteUrl as string)}${relUrl}`;
|
||||||
|
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
const kql = `Path:"${approvalListAbsUrl}*" AND ApproverOWSUSER:"${claimsLogin}"`;
|
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({
|
const results = await sp.search({
|
||||||
Querytext: kql,
|
Querytext: kql,
|
||||||
RowLimit: 500,
|
RowLimit: SEARCH_ROW_LIMIT,
|
||||||
SelectProperties: ['ListItemID'],
|
SelectProperties: ['ListItemID'],
|
||||||
TrimDuplicates: false,
|
TrimDuplicates: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log(`[Текущие заявки] Search «${type.name}» (архив, involved): KQL = ${kql}, найдено: ${results.TotalRows}`);
|
const total = results.TotalRows || 0;
|
||||||
console.table(results.PrimarySearchResults);
|
|
||||||
|
|
||||||
const ids = (results.PrimarySearchResults as Array<Record<string, unknown>>)
|
const ids = (results.PrimarySearchResults as Array<Record<string, unknown>>)
|
||||||
.map((r) => Number(r.ListItemID))
|
.map((r) => Number(r.ListItemID))
|
||||||
.filter((id) => !isNaN(id) && id > 0);
|
.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 [];
|
if (ids.length === 0) return [];
|
||||||
|
|
||||||
return (await approvalList.items
|
return (await approvalList.items
|
||||||
.filter(ids.map((id) => `Id eq ${id}`).join(' or '))
|
.filter(ids.map((id) => `Id eq ${id}`).join(' or '))
|
||||||
.select('Id', 'TicketId', 'Status')
|
.select('Id', 'TicketId', 'RequestStatus')
|
||||||
.top(ids.length)()) as Array<Record<string, unknown>>;
|
.top(ids.length)()) as Array<Record<string, unknown>>;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(
|
console.error(
|
||||||
`[Текущие заявки] «${type.name}»: Search по архиву согласования не сработал:`,
|
`[Текущие заявки] «${type.name}»: Search по списку согласования не сработал:`,
|
||||||
(e as Error).message
|
(e as Error).message
|
||||||
);
|
);
|
||||||
return [];
|
return [];
|
||||||
@@ -328,7 +386,7 @@ async function hydrateAuthors(
|
|||||||
const type = typeById.get(requestTypeId);
|
const type = typeById.get(requestTypeId);
|
||||||
if (!type) return;
|
if (!type) return;
|
||||||
try {
|
try {
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
const authorRows = (await sp.web
|
const authorRows = (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 '))
|
||||||
@@ -371,23 +429,6 @@ const PAGE_SIZE = 20;
|
|||||||
// (см. filterPendingByQuery) — иначе строка запроса станет неподъёмной.
|
// (см. filterPendingByQuery) — иначе строка запроса станет неподъёмной.
|
||||||
const KQL_ID_LIMIT = 300;
|
const KQL_ID_LIMIT = 300;
|
||||||
|
|
||||||
function isRecent(createdIso: string): boolean {
|
|
||||||
if (!createdIso) return false;
|
|
||||||
const t = new Date(createdIso).getTime();
|
|
||||||
return !isNaN(t) && Date.now() - t <= RECENT_MS;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Замена свободному терму Search для случаев, когда матчим на клиенте (без
|
|
||||||
// индекса): все слова запроса должны встретиться в названии (без учёта
|
|
||||||
// регистра). Не идентично семантике Search (там — префикс, тут — подстрока),
|
|
||||||
// но для «довеска» из нескольких свежих строк разница не принципиальна.
|
|
||||||
function matchesQueryTitle(title: string, query: string): boolean {
|
|
||||||
const q = query.trim().toLowerCase();
|
|
||||||
if (!q) return true;
|
|
||||||
const t = title.toLowerCase();
|
|
||||||
return q.split(/\s+/).filter(Boolean).every((word) => t.indexOf(word) !== -1);
|
|
||||||
}
|
|
||||||
|
|
||||||
function siteOrigin(siteUrl: string): string {
|
function siteOrigin(siteUrl: string): string {
|
||||||
const match = /^https?:\/\/[^/]+/.exec(siteUrl);
|
const match = /^https?:\/\/[^/]+/.exec(siteUrl);
|
||||||
return match ? match[0] : siteUrl;
|
return match ? match[0] : siteUrl;
|
||||||
@@ -447,7 +488,7 @@ async function loadByIds(
|
|||||||
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 '))
|
||||||
@@ -464,17 +505,11 @@ async function loadByIds(
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Свежие (созданные за последние RECENT_MS) заявки автора — обычным REST-ом,
|
// Свежие (созданные за последние RECENT_MS) заявки автора — обычным REST-ом,
|
||||||
// в обход Search (индекс мог их ещё не подхватить). Текст запроса матчим на
|
// в обход Search (индекс мог их ещё не подхватить). Без текстового запроса —
|
||||||
// клиенте (matchesQueryTitle) — substringof с кириллицей в $filter уже
|
// матчить название не нужно, отдаём как есть.
|
||||||
// подводил на Status (см. indexApprovalsForType), поэтому в $filter только
|
async function getFreshOwnRowsForType(context: WebPartContext, type: IRequestType): Promise<IMyRequest[]> {
|
||||||
// нечувствительные к этому условия (AuthorId/Created).
|
|
||||||
async function getFreshOwnRowsForType(
|
|
||||||
context: WebPartContext,
|
|
||||||
type: IRequestType,
|
|
||||||
query: string
|
|
||||||
): Promise<IMyRequest[]> {
|
|
||||||
try {
|
try {
|
||||||
const sp = spfi(type.siteUrl as string).using(SPFx(context));
|
const sp = spForSite(type.siteUrl as string, context);
|
||||||
const me = await sp.web.currentUser.select('Id')();
|
const me = await sp.web.currentUser.select('Id')();
|
||||||
const cutoff = new Date(Date.now() - RECENT_MS).toISOString();
|
const cutoff = new Date(Date.now() - RECENT_MS).toISOString();
|
||||||
|
|
||||||
@@ -485,24 +520,55 @@ async function getFreshOwnRowsForType(
|
|||||||
.expand('Author')
|
.expand('Author')
|
||||||
.top(50)()) as Array<Record<string, unknown>>;
|
.top(50)()) as Array<Record<string, unknown>>;
|
||||||
|
|
||||||
return rows
|
return rows.map((r) => toMyRequest(r, r.Author as { EMail?: string; Title?: string } | undefined, type, 'own'));
|
||||||
.map((r) => toMyRequest(r, r.Author as { EMail?: string; Title?: string } | undefined, type, 'own'))
|
|
||||||
.filter((r) => matchesQueryTitle(r.title, query));
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(`[Текущие заявки] «${type.name}»: не удалось дочитать свежие заявки:`, (e as Error).message);
|
console.error(`[Текущие заявки] «${type.name}»: не удалось дочитать свежие заявки:`, (e as Error).message);
|
||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// «Мои заявки»: Search по спискам данных всех типов сразу — автор = текущий
|
// «Мои заявки» БЕЗ поиска — гибрид для масштаба: Search с серверной пагинацией
|
||||||
// пользователь, текст запроса по всем полям. Пагинация серверная
|
// (RowLimit/StartRow) находит страницу без сканирования всего архива, REST по
|
||||||
// (RowLimit/StartRow), поэтому таблица не тянет весь архив заявок.
|
// «последним N минутам» добирает то, что Search мог не успеть проиндексировать
|
||||||
//
|
// (см. RECENT_MS). Довесок применяется только на первой странице — свежее по
|
||||||
// На первой странице довешиваем то, что Search мог ещё не проиндексировать
|
// дате там и оказалось бы, будь оно проиндексировано.
|
||||||
// (см. getFreshOwnRowsForType) — дедуп по (тип, Id), сортировка по дате и
|
|
||||||
// обрезка до PAGE_SIZE. На страницах 2+ этого не делаем: свежее по дате и так
|
|
||||||
// оказалось бы на первой странице, будь оно проиндексировано.
|
|
||||||
export async function getOwnRequests(
|
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,
|
context: WebPartContext,
|
||||||
types: IRequestType[],
|
types: IRequestType[],
|
||||||
query: string,
|
query: string,
|
||||||
@@ -510,7 +576,7 @@ export async function getOwnRequests(
|
|||||||
): Promise<IOwnRequestsPage> {
|
): Promise<IOwnRequestsPage> {
|
||||||
if (types.length === 0) return { rows: [], totalRows: 0 };
|
if (types.length === 0) return { rows: [], totalRows: 0 };
|
||||||
|
|
||||||
const sp = spfi(types[0].siteUrl as string).using(SPFx(context));
|
const sp = spForSite(types[0].siteUrl as string, context);
|
||||||
const claimsLogin = `i:0#.f|membership|${currentUserEmail(context)}`;
|
const claimsLogin = `i:0#.f|membership|${currentUserEmail(context)}`;
|
||||||
|
|
||||||
const clauses = [
|
const clauses = [
|
||||||
@@ -537,45 +603,16 @@ export async function getOwnRequests(
|
|||||||
const entries = hitsToEntries(results, types);
|
const entries = hitsToEntries(results, types);
|
||||||
const byKey = entries.length > 0 ? await loadByIds(context, entries, 'own') : new Map<string, IMyRequest>();
|
const byKey = entries.length > 0 ? await loadByIds(context, entries, 'own') : new Map<string, IMyRequest>();
|
||||||
// Порядок задаёт релевантность поиска, а не порядок ответов REST.
|
// Порядок задаёт релевантность поиска, а не порядок ответов REST.
|
||||||
const searchRows = entries
|
const rows = entries.map((e) => byKey.get(`${e.type.id}-${e.id}`)).filter((r): r is IMyRequest => !!r);
|
||||||
.map((e) => byKey.get(`${e.type.id}-${e.id}`))
|
|
||||||
.filter((r): r is IMyRequest => !!r);
|
|
||||||
|
|
||||||
if (page !== 1) {
|
return { rows, totalRows: results.TotalRows || 0 };
|
||||||
return { rows: searchRows, totalRows: results.TotalRows || 0 };
|
|
||||||
}
|
|
||||||
|
|
||||||
const freshRows = (await Promise.all(types.map((t) => getFreshOwnRowsForType(context, t, query)))).reduce(
|
|
||||||
(all, r) => all.concat(r),
|
|
||||||
[] as IMyRequest[]
|
|
||||||
);
|
|
||||||
|
|
||||||
const searchKeys = new Set(searchRows.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(searchRows)
|
|
||||||
.sort((a, b) => b.created.localeCompare(a.created))
|
|
||||||
.slice(0, PAGE_SIZE);
|
|
||||||
|
|
||||||
return { rows: merged, totalRows: (results.TotalRows || 0) + onlyFresh.length };
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// «На согласовании»: список заявок уже отобран по строкам согласования
|
// «На согласовании»: список заявок уже отобран по строкам согласования
|
||||||
// (getPendingApproval/getPendingApprovalIndex — там же определяется, чья
|
// (getPendingApprovalIndex — там же определяется, чья сейчас очередь,
|
||||||
// сейчас очередь, обычным REST). Здесь среди НИХ фильтруем по тексту.
|
// обычным REST). Здесь среди НИХ фильтруем по тексту — только через Search
|
||||||
//
|
// (KQL ограничивается ListItemID этих заявок, текст идёт свободным термом по
|
||||||
// Свежие (< 10 мин, isRecent) заявки Search мог не проиндексировать —
|
// всем полям), без клиентского REST-матчинга по свежести.
|
||||||
// их матчим по названию на клиенте (matchesQueryTitle), без похода в Search.
|
|
||||||
// Остальные — через Search: KQL ограничивается ListItemID этих заявок, текст
|
|
||||||
// идёт свободным термом по всем полям. Порядок сохраняется (rows уже
|
|
||||||
// отсортированы по дате в buildPendingIndex, свежие — в начале).
|
|
||||||
export async function filterPendingByQuery(
|
export async function filterPendingByQuery(
|
||||||
context: WebPartContext,
|
context: WebPartContext,
|
||||||
types: IRequestType[],
|
types: IRequestType[],
|
||||||
@@ -585,23 +622,17 @@ export async function filterPendingByQuery(
|
|||||||
const text = freeTextClause(query);
|
const text = freeTextClause(query);
|
||||||
if (!text || rows.length === 0) return rows;
|
if (!text || rows.length === 0) return rows;
|
||||||
|
|
||||||
const fresh = rows.filter((r) => isRecent(r.created));
|
if (rows.length > KQL_ID_LIMIT) {
|
||||||
const older = rows.filter((r) => !isRecent(r.created));
|
|
||||||
const freshMatches = fresh.filter((r) => matchesQueryTitle(r.title, query));
|
|
||||||
|
|
||||||
if (older.length === 0) return freshMatches;
|
|
||||||
|
|
||||||
if (older.length > KQL_ID_LIMIT) {
|
|
||||||
console.warn(
|
console.warn(
|
||||||
`[Текущие заявки] Поиск среди ждущих решения ограничен ${KQL_ID_LIMIT} заявками из ${older.length}`
|
`[Текущие заявки] Поиск среди ждущих решения ограничен ${KQL_ID_LIMIT} заявками из ${rows.length}`
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
const candidates = older.slice(0, KQL_ID_LIMIT);
|
const candidates = rows.slice(0, KQL_ID_LIMIT);
|
||||||
|
|
||||||
const scopeTypes = types.filter((t) => candidates.some((r) => r.requestTypeId === t.id));
|
const scopeTypes = types.filter((t) => candidates.some((r) => r.requestTypeId === t.id));
|
||||||
if (scopeTypes.length === 0) return freshMatches;
|
if (scopeTypes.length === 0) return [];
|
||||||
|
|
||||||
const sp = spfi(scopeTypes[0].siteUrl as string).using(SPFx(context));
|
const sp = spForSite(scopeTypes[0].siteUrl as string, context);
|
||||||
const kql = [
|
const kql = [
|
||||||
`(${scopeTypes.map((t) => `Path:"${listAbsUrl(t)}*"`).join(' OR ')})`,
|
`(${scopeTypes.map((t) => `Path:"${listAbsUrl(t)}*"`).join(' OR ')})`,
|
||||||
`(${candidates.map((r) => `ListItemID:${r.id}`).join(' OR ')})`,
|
`(${candidates.map((r) => `ListItemID:${r.id}`).join(' OR ')})`,
|
||||||
@@ -620,9 +651,93 @@ export async function filterPendingByQuery(
|
|||||||
|
|
||||||
// ListItemID уникален только внутри своего списка — сверяем пару тип+Id.
|
// ListItemID уникален только внутри своего списка — сверяем пару тип+Id.
|
||||||
const found = new Set(hitsToEntries(results, scopeTypes).map((e) => `${e.type.id}-${e.id}`));
|
const found = new Set(hitsToEntries(results, scopeTypes).map((e) => `${e.type.id}-${e.id}`));
|
||||||
const olderMatches = candidates.filter((r) => found.has(`${r.requestTypeId}-${r.id}`));
|
return candidates.filter((r) => found.has(`${r.requestTypeId}-${r.id}`));
|
||||||
|
}
|
||||||
|
|
||||||
return freshMatches.concat(olderMatches);
|
// ---------------------------------------------------------------------------
|
||||||
|
// Вкладка «Поиск»: ищет сразу по двум категориям — «Мои заявки» (я автор) и
|
||||||
|
// «где я участвовал как согласующий» (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(';')}`;
|
||||||
|
}
|
||||||
@@ -1,9 +1,16 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { useState, useEffect, useMemo } from 'react';
|
import { useState, useEffect, useMemo, useCallback } from 'react';
|
||||||
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||||
import styles from './RecruitingHireView.module.scss';
|
import styles from './RecruitingHireView.module.scss';
|
||||||
import { Alert, Button, FormCard, FormModeProvider, CollapseSection, FormField, AttachmentList, Icon } from '../../shared/ui';
|
import { Alert, Button, FormCard, FormModeProvider, CollapseSection, FormField, AttachmentList, Icon, PrintButton } from '../../shared/ui';
|
||||||
import { ApproverService, DecisionPanel, StatusBadge } from '../../shared/approval';
|
import {
|
||||||
|
ApproverService,
|
||||||
|
DecisionPanel,
|
||||||
|
StatusBadge,
|
||||||
|
ApprovalMatrix,
|
||||||
|
useMatrixEditor,
|
||||||
|
APPROVAL_PHASE
|
||||||
|
} from '../../shared/approval';
|
||||||
import { navigate } from '../../shared/routing';
|
import { navigate } from '../../shared/routing';
|
||||||
import { getAttachments, IAttachmentInfo } from '../../shared/attachments/attachments.service';
|
import { getAttachments, IAttachmentInfo } from '../../shared/attachments/attachments.service';
|
||||||
import { IFormData, EMPTY_DATA, SetField } from './model';
|
import { IFormData, EMPTY_DATA, SetField } from './model';
|
||||||
@@ -42,6 +49,36 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
[]
|
[]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Матрица маршрута из фактических строк заявки (read-only), разбитая по фазам.
|
||||||
|
//
|
||||||
|
// decisionSeq входит в reloadKey: после решения согласующего строки маршрута
|
||||||
|
// меняются на сервере (своя — на «Согласовано», следующая — на «На
|
||||||
|
// согласовании»), поэтому счётчик инкрементируется и useMatrixEditor
|
||||||
|
// перечитывает матрицу. Иначе на экране остались бы данные, загруженные при
|
||||||
|
// открытии формы, и пользователь видел бы свой шаг всё ещё «На согласовании».
|
||||||
|
const [decisionSeq, setDecisionSeq] = useState<number>(0);
|
||||||
|
const approval = useMemo(() => hireApprovalService(), []);
|
||||||
|
const loadApprovers = useCallback(
|
||||||
|
() =>
|
||||||
|
approval
|
||||||
|
.getMatrixForRequest(itemId)
|
||||||
|
.then((rows) => rows.filter((r) => r.phase !== APPROVAL_PHASE.execution)),
|
||||||
|
[approval, itemId]
|
||||||
|
);
|
||||||
|
const approvers = useMatrixEditor(loadApprovers, `a-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
|
approval.getJobTitle(l)
|
||||||
|
);
|
||||||
|
const loadExecutors = useCallback(
|
||||||
|
() =>
|
||||||
|
approval
|
||||||
|
.getMatrixForRequest(itemId)
|
||||||
|
.then((rows) => rows.filter((r) => r.phase === APPROVAL_PHASE.execution)),
|
||||||
|
[approval, itemId]
|
||||||
|
);
|
||||||
|
const executors = useMatrixEditor(loadExecutors, `e-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
|
approval.getJobTitle(l)
|
||||||
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let alive = true;
|
let alive = true;
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
@@ -81,7 +118,7 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<div className={styles.toolbar}>
|
<div className={`${styles.toolbar} rp-no-print`}>
|
||||||
<Button
|
<Button
|
||||||
variant="secondary"
|
variant="secondary"
|
||||||
onClick={() =>
|
onClick={() =>
|
||||||
@@ -91,11 +128,13 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
<Icon name="copy" size="sm" />
|
<Icon name="copy" size="sm" />
|
||||||
Организация рабочего места на основе этой
|
Организация рабочего места на основе этой
|
||||||
</Button>
|
</Button>
|
||||||
|
<PrintButton />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className="rp-print-root">
|
||||||
<FormCard
|
<FormCard
|
||||||
title="Заявка на прием"
|
title="Заявка на прием"
|
||||||
subtitle={`№${itemId} · режим согласования`}
|
subtitle={`№${itemId}`}
|
||||||
headerRight={status ? <StatusBadge status={status} /> : undefined}
|
headerRight={status ? <StatusBadge status={status} /> : undefined}
|
||||||
>
|
>
|
||||||
<FormModeProvider readOnly>
|
<FormModeProvider readOnly>
|
||||||
@@ -105,15 +144,39 @@ const RecruitingHireView: React.FC<IRecruitingHireViewProps> = ({ context, itemI
|
|||||||
<ConditionsSection {...sectionProps} />
|
<ConditionsSection {...sectionProps} />
|
||||||
</FormModeProvider>
|
</FormModeProvider>
|
||||||
|
|
||||||
|
<div className="rp-no-print">
|
||||||
<CollapseSection title="Вложения" icon="upload">
|
<CollapseSection title="Вложения" icon="upload">
|
||||||
<FormField label="Файлы" full>
|
<FormField label="Файлы" full>
|
||||||
<AttachmentList items={attachments} />
|
<AttachmentList items={attachments} />
|
||||||
</FormField>
|
</FormField>
|
||||||
</CollapseSection>
|
</CollapseSection>
|
||||||
|
</div>
|
||||||
</FormCard>
|
</FormCard>
|
||||||
|
|
||||||
{/* Панель решения — ВНЕ FormModeProvider, чтобы комментарий был редактируемым. */}
|
<ApprovalMatrix editor={approvers} search={(q) => approval.searchUsers(q)} />
|
||||||
<DecisionPanel service={approverService} requestId={itemId} />
|
|
||||||
|
{!executors.loading && executors.rows.length > 0 && (
|
||||||
|
<ApprovalMatrix
|
||||||
|
editor={executors}
|
||||||
|
search={(q) => approval.searchUsers(q)}
|
||||||
|
title="Исполнение"
|
||||||
|
roleLabel="Исполнитель"
|
||||||
|
emptyText="Исполнители не назначены."
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Панель решения — ВНЕ печати и FormModeProvider (комментарий редактируемый). */}
|
||||||
|
<div className="rp-no-print">
|
||||||
|
<DecisionPanel
|
||||||
|
service={approverService}
|
||||||
|
requestId={itemId}
|
||||||
|
onDecided={(newStatus) => {
|
||||||
|
setStatus(newStatus);
|
||||||
|
setDecisionSeq((n) => n + 1);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</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" },
|
||||||
|
|||||||
@@ -6,3 +6,9 @@
|
|||||||
font-size: $fs-sm;
|
font-size: $fs-sm;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.toolbar {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
margin-bottom: $sp-4;
|
||||||
|
}
|
||||||
|
|||||||
@@ -1,9 +1,16 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { useState, useEffect, useMemo } from 'react';
|
import { useState, useEffect, useMemo, useCallback } from 'react';
|
||||||
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
import type { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||||
import styles from './WorkplaceSetupView.module.scss';
|
import styles from './WorkplaceSetupView.module.scss';
|
||||||
import { Alert, FormCard, FormModeProvider, CollapseSection, FormField, AttachmentList } from '../../shared/ui';
|
import { Alert, FormCard, FormModeProvider, CollapseSection, FormField, AttachmentList, PrintButton } from '../../shared/ui';
|
||||||
import { ApproverService, DecisionPanel, StatusBadge } from '../../shared/approval';
|
import {
|
||||||
|
ApproverService,
|
||||||
|
DecisionPanel,
|
||||||
|
StatusBadge,
|
||||||
|
ApprovalMatrix,
|
||||||
|
useMatrixEditor,
|
||||||
|
APPROVAL_PHASE
|
||||||
|
} from '../../shared/approval';
|
||||||
import { getAttachments, IAttachmentInfo } from '../../shared/attachments/attachments.service';
|
import { getAttachments, IAttachmentInfo } from '../../shared/attachments/attachments.service';
|
||||||
import { IFormData, EMPTY_DATA, SetField } from './model';
|
import { IFormData, EMPTY_DATA, SetField } from './model';
|
||||||
import { loadWorkplaceRequest } from './load';
|
import { loadWorkplaceRequest } from './load';
|
||||||
@@ -31,6 +38,36 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
[]
|
[]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Матрица маршрута из фактических строк заявки (read-only), разбитая по фазам.
|
||||||
|
//
|
||||||
|
// decisionSeq входит в reloadKey: после решения согласующего строки маршрута
|
||||||
|
// меняются на сервере (своя — на «Согласовано», следующая — на «На
|
||||||
|
// согласовании»), поэтому счётчик инкрементируется и useMatrixEditor
|
||||||
|
// перечитывает матрицу. Иначе на экране остались бы данные, загруженные при
|
||||||
|
// открытии формы, и пользователь видел бы свой шаг всё ещё «На согласовании».
|
||||||
|
const [decisionSeq, setDecisionSeq] = useState<number>(0);
|
||||||
|
const approval = useMemo(() => workplaceApprovalService(), []);
|
||||||
|
const loadApprovers = useCallback(
|
||||||
|
() =>
|
||||||
|
approval
|
||||||
|
.getMatrixForRequest(itemId)
|
||||||
|
.then((rows) => rows.filter((r) => r.phase !== APPROVAL_PHASE.execution)),
|
||||||
|
[approval, itemId]
|
||||||
|
);
|
||||||
|
const approvers = useMatrixEditor(loadApprovers, `a-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
|
approval.getJobTitle(l)
|
||||||
|
);
|
||||||
|
const loadExecutors = useCallback(
|
||||||
|
() =>
|
||||||
|
approval
|
||||||
|
.getMatrixForRequest(itemId)
|
||||||
|
.then((rows) => rows.filter((r) => r.phase === APPROVAL_PHASE.execution)),
|
||||||
|
[approval, itemId]
|
||||||
|
);
|
||||||
|
const executors = useMatrixEditor(loadExecutors, `e-${itemId}-${decisionSeq}`, false, true, (l) =>
|
||||||
|
approval.getJobTitle(l)
|
||||||
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let alive = true;
|
let alive = true;
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
@@ -70,9 +107,14 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
|
<div className={`${styles.toolbar} rp-no-print`}>
|
||||||
|
<PrintButton />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="rp-print-root">
|
||||||
<FormCard
|
<FormCard
|
||||||
title="Организация рабочего места"
|
title="Организация рабочего места"
|
||||||
subtitle={`№${itemId} · режим согласования`}
|
subtitle={`№${itemId}`}
|
||||||
headerRight={status ? <StatusBadge status={status} /> : undefined}
|
headerRight={status ? <StatusBadge status={status} /> : undefined}
|
||||||
>
|
>
|
||||||
<FormModeProvider readOnly>
|
<FormModeProvider readOnly>
|
||||||
@@ -80,14 +122,38 @@ const WorkplaceSetupView: React.FC<IWorkplaceSetupViewProps> = ({ context, itemI
|
|||||||
<EquipmentSection {...sectionProps} />
|
<EquipmentSection {...sectionProps} />
|
||||||
</FormModeProvider>
|
</FormModeProvider>
|
||||||
|
|
||||||
|
<div className="rp-no-print">
|
||||||
<CollapseSection title="Вложения" icon="upload">
|
<CollapseSection title="Вложения" icon="upload">
|
||||||
<FormField label="Файлы" full>
|
<FormField label="Файлы" full>
|
||||||
<AttachmentList items={attachments} />
|
<AttachmentList items={attachments} />
|
||||||
</FormField>
|
</FormField>
|
||||||
</CollapseSection>
|
</CollapseSection>
|
||||||
|
</div>
|
||||||
</FormCard>
|
</FormCard>
|
||||||
|
|
||||||
<DecisionPanel service={approverService} requestId={itemId} />
|
<ApprovalMatrix editor={approvers} search={(q) => approval.searchUsers(q)} />
|
||||||
|
|
||||||
|
{!executors.loading && executors.rows.length > 0 && (
|
||||||
|
<ApprovalMatrix
|
||||||
|
editor={executors}
|
||||||
|
search={(q) => approval.searchUsers(q)}
|
||||||
|
title="Исполнение"
|
||||||
|
roleLabel="Исполнитель"
|
||||||
|
emptyText="Исполнители не назначены."
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="rp-no-print">
|
||||||
|
<DecisionPanel
|
||||||
|
service={approverService}
|
||||||
|
requestId={itemId}
|
||||||
|
onDecided={(newStatus) => {
|
||||||
|
setStatus(newStatus);
|
||||||
|
setDecisionSeq((n) => n + 1);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</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)
|
||||||
@@ -48,14 +52,10 @@ export class ApprovalListService {
|
|||||||
// задан, иначе orderStart + позиция в массиве (фазы идут подряд в одном
|
// задан, иначе orderStart + позиция в массиве (фазы идут подряд в одном
|
||||||
// списке: сначала согласующие 1..N, затем исполнители N+1..N+M).
|
// списке: сначала согласующие 1..N, затем исполнители N+1..N+M).
|
||||||
//
|
//
|
||||||
// Статус строки решается здесь, а не читается заново при каждом открытии
|
// Статус пишется переданным значением ОДИНАКОВО для всех строк партии — кто
|
||||||
// заявки: строки с НАИМЕНЬШИМ order в этой партии получают переданный status
|
// сейчас «на очереди», а кто «ждёт», решает отдельно activateNextQueued
|
||||||
// (обычно «На согласовании» — их очередь СЕЙЧАС; если несколько согласующих
|
// (вызывается сразу после createSteps в approvalSubmission.service.ts/writeRoute
|
||||||
// делят один и тот же order — это параллельный шаг, активны все сразу),
|
// и в approverDecision.service.ts/decide).
|
||||||
// остальные — «Ждёт очереди». Так «чья сейчас очередь» — это просто значение
|
|
||||||
// колонки Status, без пересчёта порядка на клиенте (см.
|
|
||||||
// approverDecision.service.ts/decide, который двигает очередь дальше при
|
|
||||||
// каждом решении — той же логикой «наименьший order среди нерешённых»).
|
|
||||||
public async createSteps(
|
public async createSteps(
|
||||||
requestId: number,
|
requestId: number,
|
||||||
approvers: IApproverToWrite[],
|
approvers: IApproverToWrite[],
|
||||||
@@ -66,15 +66,13 @@ export class ApprovalListService {
|
|||||||
const withOrder = approvers
|
const withOrder = approvers
|
||||||
.map((a, i) => ({ a, order: a.order ?? orderStart + i }))
|
.map((a, i) => ({ a, order: a.order ?? orderStart + i }))
|
||||||
.filter((x) => !!x.a.email);
|
.filter((x) => !!x.a.email);
|
||||||
const minOrder = withOrder.length > 0 ? Math.min(...withOrder.map((x) => x.order)) : 0;
|
|
||||||
|
|
||||||
for (const { a, order } of withOrder) {
|
for (const { a, order } of withOrder) {
|
||||||
const approverId = await this.resolveUserId(a.email);
|
const approverId = await this.resolveUserId(a.email);
|
||||||
const rowStatus = order === minOrder ? status : REQUEST_STATUS.waitingInQueue;
|
|
||||||
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]: rowStatus,
|
[FIELDS.status]: status,
|
||||||
[`${FIELDS.ticket}Id`]: requestId,
|
[`${FIELDS.ticket}Id`]: requestId,
|
||||||
[FIELDS.order]: order,
|
[FIELDS.order]: order,
|
||||||
[FIELDS.allowReassign]: a.allowReassign,
|
[FIELDS.allowReassign]: a.allowReassign,
|
||||||
@@ -83,6 +81,47 @@ export class ApprovalListService {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Продвигает очередь: среди ещё не активных строк со статусом «Ждёт очереди»
|
||||||
|
// в текущей фазе активирует те, что делят наименьший 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,
|
||||||
@@ -206,12 +245,6 @@ export class ApprovalListService {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Только статус строки, без даты/комментария — продвижение очереди
|
|
||||||
// («На согласовании» ⇄ «Ждёт очереди»), а не решение согласующего.
|
|
||||||
public async setStatus(rowId: number, status: string): Promise<void> {
|
|
||||||
await this.list().items.getById(rowId).update({ [FIELDS.status]: status });
|
|
||||||
}
|
|
||||||
|
|
||||||
// Удаляет все строки согласования по заявке (при возврате/повторной отправке).
|
// Удаляет все строки согласования по заявке (при возврате/повторной отправке).
|
||||||
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,7 +43,12 @@ 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) и исполнителей
|
||||||
@@ -51,10 +56,11 @@ export async function writeApprovers(
|
|||||||
// стороне согласующего внешний API уже не нужен, переход в фазу исполнения
|
// стороне согласующего внешний API уже не нужен, переход в фазу исполнения
|
||||||
// делает computeRequestStatus, когда все согласующие одобрили.
|
// делает computeRequestStatus, когда все согласующие одобрили.
|
||||||
//
|
//
|
||||||
// Исполнители стартуют ВСЕ как «Ждёт очереди» (не передаём им status — фаза
|
// Исполнители стартуют ВСЕ как «Ждёт очереди» (rowStatus, та же логика, что и
|
||||||
// исполнения ещё не наступила, до неё нет ничьей текущей очереди). Первого
|
// у согласующих) — до прохождения фазы согласования у исполнителей нет текущей
|
||||||
// исполнителя переключит на «На согласовании» approverDecision.service.ts/decide,
|
// очереди. Первого исполнителя переключит на «На исполнении»
|
||||||
// когда фаза согласования будет пройдена целиком.
|
// approval.activateNextQueued, когда фаза согласования будет пройдена целиком
|
||||||
|
// (см. approverDecision.service.ts/decide).
|
||||||
export async function writeRoute(
|
export async function writeRoute(
|
||||||
approval: ApprovalListService,
|
approval: ApprovalListService,
|
||||||
requestId: number,
|
requestId: number,
|
||||||
@@ -63,12 +69,23 @@ export async function writeRoute(
|
|||||||
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);
|
||||||
await approval.createSteps(
|
await approval.createSteps(
|
||||||
requestId,
|
requestId,
|
||||||
executors,
|
executors,
|
||||||
REQUEST_STATUS.waitingInQueue,
|
rowStatus,
|
||||||
APPROVAL_PHASE.execution,
|
APPROVAL_PHASE.execution,
|
||||||
approvers.length + 1
|
approvers.length + 1
|
||||||
);
|
);
|
||||||
|
|
||||||
|
if (submitted) {
|
||||||
|
await approval.activateNextQueued(requestId);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,17 +8,17 @@ import { IApprovalRow } from './models/IApprovalRow';
|
|||||||
import { ISiteUser } from './models/ISiteUser';
|
import { ISiteUser } from './models/ISiteUser';
|
||||||
import { emitRequestsChanged } from '../requestEvents';
|
import { emitRequestsChanged } from '../requestEvents';
|
||||||
|
|
||||||
export type ApproverDecision = 'approve' | 'return' | 'reject';
|
// approve/return/reject — согласующий; execute — исполнитель отметил «Выполнено».
|
||||||
|
export type ApproverDecision = 'approve' | 'return' | 'reject' | 'execute';
|
||||||
|
|
||||||
// Решение согласующего → статус его строки в списке согласования.
|
// Решение → статус его строки в списке согласования.
|
||||||
const ROW_STATUS: Record<ApproverDecision, string> = {
|
const ROW_STATUS: Record<ApproverDecision, string> = {
|
||||||
approve: REQUEST_STATUS.approved,
|
approve: REQUEST_STATUS.approved,
|
||||||
return: REQUEST_STATUS.returned,
|
return: REQUEST_STATUS.returned,
|
||||||
reject: REQUEST_STATUS.rejected,
|
reject: REQUEST_STATUS.rejected,
|
||||||
|
execute: REQUEST_STATUS.executed,
|
||||||
};
|
};
|
||||||
|
|
||||||
const TERMINAL_STATUSES: string[] = [REQUEST_STATUS.approved, REQUEST_STATUS.rejected, REQUEST_STATUS.returned];
|
|
||||||
|
|
||||||
// Действия согласующего: определение его строки, применение решения,
|
// Действия согласующего: определение его строки, применение решения,
|
||||||
// делегирование и пересчёт статуса заявки в контентном списке.
|
// делегирование и пересчёт статуса заявки в контентном списке.
|
||||||
//
|
//
|
||||||
@@ -38,9 +38,14 @@ export class ApproverService {
|
|||||||
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 current = rows.filter((r) => r.status === REQUEST_STATUS.onApproval)[0];
|
// Активные строки текущего шага: согласующий («На согласовании») или, когда
|
||||||
if (current && current.approverId === userId) return current;
|
// согласование пройдено, исполнитель («На исполнении»). При параллельном шаге
|
||||||
return undefined;
|
// (одинаковый StepOrder) активных строк может быть несколько сразу — ищем
|
||||||
|
// среди ВСЕХ активных, а не только среди первой по порядку.
|
||||||
|
const active = rows.filter(
|
||||||
|
(r) => r.status === REQUEST_STATUS.onApproval || r.status === REQUEST_STATUS.onExecution
|
||||||
|
);
|
||||||
|
return active.filter((r) => r.approverId === userId)[0];
|
||||||
}
|
}
|
||||||
|
|
||||||
// Делегирование: согласующий добавляет делеганта ПЕРЕД собой (Order — между
|
// Делегирование: согласующий добавляет делеганта ПЕРЕД собой (Order — между
|
||||||
@@ -58,16 +63,17 @@ export class ApproverService {
|
|||||||
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);
|
||||||
// Делегат наследует фазу той строки, вместо которой согласует (согласование/исполнение).
|
// Делегат наследует фазу той строки, вместо которой согласует (согласование/исполнение).
|
||||||
// Пишем его сразу как «На согласовании» — advanceQueue ниже сам переведёт
|
// Обе строки — делегат и прежний согласующий — уходят в «Ждёт очереди»,
|
||||||
// строку currentRowId (у неё теперь больше не наименьший Order) в «Ждёт очереди».
|
// activateNextQueued затем активирует делегата (у него меньший order).
|
||||||
await this.approval.addApproverRow(
|
await this.approval.addApproverRow(
|
||||||
requestId,
|
requestId,
|
||||||
{ email: user.email, position, allowReassign: false },
|
{ email: user.email, position, allowReassign: false },
|
||||||
newOrder,
|
newOrder,
|
||||||
REQUEST_STATUS.onApproval,
|
REQUEST_STATUS.queued,
|
||||||
current.phase
|
current.phase
|
||||||
);
|
);
|
||||||
await this.advanceQueue(requestId);
|
await this.approval.setStatus(current.id, REQUEST_STATUS.queued);
|
||||||
|
await this.approval.activateNextQueued(requestId);
|
||||||
emitRequestsChanged();
|
emitRequestsChanged();
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -82,57 +88,19 @@ export class ApproverService {
|
|||||||
comment: string
|
comment: string
|
||||||
): Promise<string> {
|
): Promise<string> {
|
||||||
await this.approval.setDecision(rowId, ROW_STATUS[decision], comment);
|
await this.approval.setDecision(rowId, ROW_STATUS[decision], comment);
|
||||||
const rows = await this.advanceQueue(requestId);
|
// Положительное решение двигает очередь — активируем следующий ждущий шаг
|
||||||
|
// (в т.ч. переход из согласования в исполнение). При возврате/отклонении
|
||||||
|
// очередь не двигаем: заявка уходит на доработку.
|
||||||
|
if (decision === 'approve' || decision === 'execute') {
|
||||||
|
await this.approval.activateNextQueued(requestId);
|
||||||
|
}
|
||||||
|
const rows = await this.approval.getForRequest(requestId);
|
||||||
const requestStatus = this.computeRequestStatus(rows);
|
const requestStatus = this.computeRequestStatus(rows);
|
||||||
await this.updateRequestStatus(requestId, requestStatus);
|
await this.updateRequestStatus(requestId, requestStatus);
|
||||||
emitRequestsChanged();
|
emitRequestsChanged();
|
||||||
return requestStatus;
|
return requestStatus;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Пересчитывает и записывает «чья сейчас очередь» по обеим фазам маршрута:
|
|
||||||
// ровно у одной ещё не решённой строки на фазу становится «На согласовании»
|
|
||||||
// (наименьший StepOrder среди нерешённых), у остальных — «Ждёт очереди».
|
|
||||||
// Фаза исполнения активна, только когда фаза согласования пройдена целиком
|
|
||||||
// (без Отклонено/Возвращена) — иначе там тоже сплошное «Ждёт очереди».
|
|
||||||
// Возвращает строки МАРШРУТА в том виде, в каком они были ДО применения этих
|
|
||||||
// обновлений (для computeRequestStatus — ему важны только терминальные
|
|
||||||
// статусы approved/rejected/returned, на которые эта функция не влияет).
|
|
||||||
private async advanceQueue(requestId: number): Promise<IApprovalRow[]> {
|
|
||||||
const rows = await this.approval.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
|
|
||||||
);
|
|
||||||
const approvalDone =
|
|
||||||
!approvalStopped &&
|
|
||||||
(approvalRows.length === 0 || approvalRows.every((r) => r.status === REQUEST_STATUS.approved));
|
|
||||||
|
|
||||||
const updates = new Map<number, string>();
|
|
||||||
const applyPhase = (phaseRows: IApprovalRow[], eligible: boolean): void => {
|
|
||||||
const undecided = phaseRows.filter((r) => TERMINAL_STATUSES.indexOf(r.status) === -1);
|
|
||||||
if (undecided.length === 0) return;
|
|
||||||
if (!eligible) {
|
|
||||||
undecided.forEach((r) => {
|
|
||||||
if (r.status !== REQUEST_STATUS.waitingInQueue) updates.set(r.id, REQUEST_STATUS.waitingInQueue);
|
|
||||||
});
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const minOrder = Math.min(...undecided.map((r) => r.order));
|
|
||||||
undecided.forEach((r) => {
|
|
||||||
const desired = r.order === minOrder ? REQUEST_STATUS.onApproval : REQUEST_STATUS.waitingInQueue;
|
|
||||||
if (r.status !== desired) updates.set(r.id, desired);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
applyPhase(approvalRows, !approvalStopped);
|
|
||||||
applyPhase(execRows, approvalDone);
|
|
||||||
|
|
||||||
await Promise.all(Array.from(updates.entries()).map(([id, status]) => this.approval.setStatus(id, status)));
|
|
||||||
return rows;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Статус заявки из строк маршрута с учётом фазы:
|
// Статус заявки из строк маршрута с учётом фазы:
|
||||||
// 1) фаза согласования: отклонение/возврат → соответствующий статус;
|
// 1) фаза согласования: отклонение/возврат → соответствующий статус;
|
||||||
// не все согласовали → «На согласовании».
|
// не все согласовали → «На согласовании».
|
||||||
@@ -153,7 +121,7 @@ export class ApproverService {
|
|||||||
if (!approvalDone) return REQUEST_STATUS.onApproval;
|
if (!approvalDone) return REQUEST_STATUS.onApproval;
|
||||||
|
|
||||||
if (execRows.length === 0) return REQUEST_STATUS.approved;
|
if (execRows.length === 0) return REQUEST_STATUS.approved;
|
||||||
if (execRows.every((r) => r.status === REQUEST_STATUS.approved)) return REQUEST_STATUS.closed;
|
if (execRows.every((r) => r.status === REQUEST_STATUS.executed)) return REQUEST_STATUS.closed;
|
||||||
return REQUEST_STATUS.execution;
|
return REQUEST_STATUS.execution;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -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,22 +3,30 @@
|
|||||||
// В слое формы кодом ставятся 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: 'Возвращена на доработку',
|
||||||
|
// Статус ЗАЯВКИ (не строки) на этапе исполнения.
|
||||||
execution: 'Выполнение',
|
execution: 'Выполнение',
|
||||||
closed: 'Закрыта',
|
closed: 'Закрыта',
|
||||||
// Строка маршрута, до которой очередь ещё не дошла. Применяется ТОЛЬКО к
|
|
||||||
// строкам списка «— согласование» (не к заявке в контентном списке):
|
|
||||||
// при создании маршрута и при каждом решении согласующего (см.
|
|
||||||
// approvalList.service.ts/createSteps, approverDecision.service.ts/decide)
|
|
||||||
// ровно у одной строки на фазу выставляется onApproval («её очередь сейчас»),
|
|
||||||
// у всех остальных недорешённых строк — waitingInQueue. Это позволяет читать
|
|
||||||
// «чья сейчас очередь» прямым фильтром по Status, без пересчёта на клиенте.
|
|
||||||
waitingInQueue: 'Ждёт очереди',
|
|
||||||
} as const;
|
} as const;
|
||||||
|
|
||||||
// Статусы, при которых заявку ещё можно править (форма редактируема).
|
// Статусы, при которых заявку ещё можно править (форма редактируема).
|
||||||
@@ -35,11 +43,22 @@ export function isEditableStatus(status: string | undefined): boolean {
|
|||||||
return !status || EDITABLE_STATUSES.indexOf(status) !== -1;
|
return !status || EDITABLE_STATUSES.indexOf(status) !== -1;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Полный набор значений для Choice-колонки при провижининге.
|
// Наборов значений ДВА, и они не совпадают — это разные сущности:
|
||||||
|
//
|
||||||
|
// 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.waitingInQueue,
|
|
||||||
REQUEST_STATUS.approved,
|
REQUEST_STATUS.approved,
|
||||||
REQUEST_STATUS.rejected,
|
REQUEST_STATUS.rejected,
|
||||||
REQUEST_STATUS.returned,
|
REQUEST_STATUS.returned,
|
||||||
@@ -47,6 +66,17 @@ export const REQUEST_STATUS_CHOICES: string[] = [
|
|||||||
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 как
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import styles from './approval.module.scss';
|
|||||||
import { Icon } from '../../ui';
|
import { Icon } from '../../ui';
|
||||||
import { IUseMatrixEditor } from '../useMatrixEditor';
|
import { IUseMatrixEditor } from '../useMatrixEditor';
|
||||||
import { ISiteUser } from '../models/ISiteUser';
|
import { ISiteUser } from '../models/ISiteUser';
|
||||||
|
import { StatusBadge } from './StatusBadge';
|
||||||
import { UserPicker } from './UserPicker';
|
import { UserPicker } from './UserPicker';
|
||||||
|
|
||||||
export interface IApprovalMatrixProps {
|
export interface IApprovalMatrixProps {
|
||||||
@@ -53,7 +54,7 @@ export const ApprovalMatrix: React.FC<IApprovalMatrixProps> = ({
|
|||||||
<tr key={i}>
|
<tr key={i}>
|
||||||
<td>{r.who}</td>
|
<td>{r.who}</td>
|
||||||
<td>{r.position}</td>
|
<td>{r.position}</td>
|
||||||
<td>{r.status}</td>
|
<td>{r.status && r.status !== '—' ? <StatusBadge status={r.status} /> : '—'}</td>
|
||||||
<td>{r.date}</td>
|
<td>{r.date}</td>
|
||||||
{editable && (
|
{editable && (
|
||||||
<td className={styles.matrixActions}>
|
<td className={styles.matrixActions}>
|
||||||
|
|||||||
@@ -74,8 +74,10 @@ export const DecisionPanel: React.FC<IDecisionPanelProps> = ({ service, requestI
|
|||||||
|
|
||||||
const isExecution = phase === APPROVAL_PHASE.execution;
|
const isExecution = phase === APPROVAL_PHASE.execution;
|
||||||
|
|
||||||
if (checking) {
|
// Пока проверяем очередь или если действий нет (не твоя очередь / заявка
|
||||||
return <div className={styles.state}>Проверяем вашу очередь…</div>;
|
// обработана / тебя нет в маршруте) — панель не показываем вовсе.
|
||||||
|
if (checking || rowId === undefined) {
|
||||||
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (resultStatus) {
|
if (resultStatus) {
|
||||||
@@ -89,14 +91,6 @@ export const DecisionPanel: React.FC<IDecisionPanelProps> = ({ service, requestI
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (rowId === undefined) {
|
|
||||||
return (
|
|
||||||
<div className={styles.panel}>
|
|
||||||
<Alert variant="warn">Сейчас не ваша очередь, либо заявка уже обработана.</Alert>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Фаза исполнения: одно действие «Выполнено» (без обязательного комментария),
|
// Фаза исполнения: одно действие «Выполнено» (без обязательного комментария),
|
||||||
// строка помечается как «Согласовано» → computeRequestStatus переведёт заявку в
|
// строка помечается как «Согласовано» → computeRequestStatus переведёт заявку в
|
||||||
// «Выполнение»/«Закрыта».
|
// «Выполнение»/«Закрыта».
|
||||||
@@ -114,7 +108,7 @@ export const DecisionPanel: React.FC<IDecisionPanelProps> = ({ service, requestI
|
|||||||
/>
|
/>
|
||||||
</FormField>
|
</FormField>
|
||||||
<div className={styles.actions}>
|
<div className={styles.actions}>
|
||||||
<Button variant="accent" disabled={submitting} onClick={() => decide('approve')}>
|
<Button variant="accent" disabled={submitting} onClick={() => decide('execute')}>
|
||||||
<Icon name="check" size="sm" />
|
<Icon name="check" size="sm" />
|
||||||
Выполнено
|
Выполнено
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -17,6 +17,11 @@
|
|||||||
color: $gray-700;
|
color: $gray-700;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.queued {
|
||||||
|
background: $gray-100;
|
||||||
|
color: $gray-500;
|
||||||
|
}
|
||||||
|
|
||||||
.onApproval {
|
.onApproval {
|
||||||
background: $blue-50;
|
background: $blue-50;
|
||||||
color: $blue-600;
|
color: $blue-600;
|
||||||
|
|||||||
@@ -5,8 +5,11 @@ import { REQUEST_STATUS } from '../models/statuses';
|
|||||||
// Цвет бейджа по статусу заявки. Неизвестный статус → нейтральный (как черновик).
|
// Цвет бейджа по статусу заявки. Неизвестный статус → нейтральный (как черновик).
|
||||||
const VARIANT: Record<string, string> = {
|
const VARIANT: Record<string, string> = {
|
||||||
[REQUEST_STATUS.draft]: styles.draft,
|
[REQUEST_STATUS.draft]: styles.draft,
|
||||||
|
[REQUEST_STATUS.queued]: styles.queued,
|
||||||
[REQUEST_STATUS.onApproval]: styles.onApproval,
|
[REQUEST_STATUS.onApproval]: styles.onApproval,
|
||||||
|
[REQUEST_STATUS.onExecution]: styles.onApproval, // активный шаг — как «на согласовании»
|
||||||
[REQUEST_STATUS.approved]: styles.approved,
|
[REQUEST_STATUS.approved]: styles.approved,
|
||||||
|
[REQUEST_STATUS.executed]: styles.approved, // выполнено — как «согласовано» (зелёный)
|
||||||
[REQUEST_STATUS.rejected]: styles.rejected,
|
[REQUEST_STATUS.rejected]: styles.rejected,
|
||||||
[REQUEST_STATUS.returned]: styles.returned,
|
[REQUEST_STATUS.returned]: styles.returned,
|
||||||
[REQUEST_STATUS.execution]: styles.execution,
|
[REQUEST_STATUS.execution]: styles.execution,
|
||||||
|
|||||||
@@ -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,113 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
import { Button } from '../Button/Button';
|
||||||
|
import { Icon } from '../Icon/Icon';
|
||||||
|
|
||||||
|
// Значение поля для печати. Дату (input type=date, ISO yyyy-mm-dd) — в дд.мм.гггг.
|
||||||
|
function formatValue(el: HTMLInputElement): string {
|
||||||
|
if (el.type === 'date' && /^\d{4}-\d{2}-\d{2}$/.test(el.value)) {
|
||||||
|
const [y, m, d] = el.value.split('-');
|
||||||
|
return `${d}.${m}.${y}`;
|
||||||
|
}
|
||||||
|
return el.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Печатаем как ДАННЫЕ, а не как форму: каждое поле ввода в клоне заменяем на
|
||||||
|
// обычный текст его значения (значения берём из живого DOM — React держит их как
|
||||||
|
// свойства, в клонированном HTML их нет). Так textarea/поля не занимают лишнего
|
||||||
|
// места и лист выглядит как справка, а не как незаполненный бланк.
|
||||||
|
function renderValuesAsText(source: Element, clone: Element): void {
|
||||||
|
const put = (cloneEl: Element | undefined, text: string): void => {
|
||||||
|
if (!cloneEl) return;
|
||||||
|
const div = document.createElement('div');
|
||||||
|
div.className = 'rp-print-value';
|
||||||
|
div.textContent = text && text.length > 0 ? text : '—';
|
||||||
|
(cloneEl.closest('label') ?? cloneEl).replaceWith(div);
|
||||||
|
};
|
||||||
|
|
||||||
|
const cInputs = clone.querySelectorAll('input');
|
||||||
|
source.querySelectorAll('input').forEach((el, i) => {
|
||||||
|
if (el.type === 'checkbox' || el.type === 'radio') {
|
||||||
|
put(cInputs[i], el.checked ? 'Да' : 'Нет');
|
||||||
|
} else {
|
||||||
|
put(cInputs[i], formatValue(el));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const cAreas = clone.querySelectorAll('textarea');
|
||||||
|
source.querySelectorAll('textarea').forEach((el, i) => put(cAreas[i], el.value));
|
||||||
|
|
||||||
|
const cSelects = clone.querySelectorAll('select');
|
||||||
|
source.querySelectorAll('select').forEach((el, i) => {
|
||||||
|
const opt = el.options[el.selectedIndex];
|
||||||
|
put(cSelects[i], opt && opt.value ? opt.text : '');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Стили печатного окна: чистый лист (без «коробки» карточки), без иконок,
|
||||||
|
// значения — обычным текстом с переносами.
|
||||||
|
const PRINT_CSS =
|
||||||
|
// height:auto перебивает глобальный CSS SharePoint (html/body 100vh) — иначе
|
||||||
|
// body раздувается выше листа A4 и в печать идёт лишняя пустая страница.
|
||||||
|
'html,body{margin:0;background:#fff;height:auto!important;min-height:0!important}' +
|
||||||
|
'body{padding:24px;font-size:13px}' +
|
||||||
|
'svg{display:none!important}' +
|
||||||
|
'.rp-print-root>*{border:0!important;box-shadow:none!important;padding:0!important}' +
|
||||||
|
'.rp-print-value{white-space:pre-wrap;color:#000;padding:1px 0 2px}';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Кнопка «Печать»: переносит документ (`.rp-print-root`) в отдельное чистое окно,
|
||||||
|
* заменяя поля ввода на текст значений, и печатает его. Не зависит от скролл-
|
||||||
|
* контейнеров/высоты SharePoint, корректно разбивается на страницы. Общая для форм.
|
||||||
|
*/
|
||||||
|
export const PrintButton: React.FC<{ label?: string }> = ({ label = 'Печать' }) => {
|
||||||
|
const onPrint = (): void => {
|
||||||
|
const source = document.querySelector('.rp-print-root');
|
||||||
|
if (!source) {
|
||||||
|
window.print();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const win = window.open('', '_blank', 'width=980,height=1200');
|
||||||
|
if (!win) {
|
||||||
|
window.print(); // всплывающее окно заблокировано — печатаем как есть
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const clone = source.cloneNode(true) as Element;
|
||||||
|
// Убираем из печати всё помеченное rp-no-print (напр. блок «Вложения»).
|
||||||
|
clone.querySelectorAll('.rp-no-print').forEach((el) => el.remove());
|
||||||
|
renderValuesAsText(source, clone);
|
||||||
|
|
||||||
|
// Переносим стили страницы (CSS-модули инжектятся как <style>, шрифты — <link>).
|
||||||
|
const head = Array.from(document.querySelectorAll('style, link[rel="stylesheet"]'))
|
||||||
|
.map((n) => n.outerHTML)
|
||||||
|
.join('\n');
|
||||||
|
|
||||||
|
win.document.open();
|
||||||
|
win.document.write(
|
||||||
|
`<!doctype html><html><head><meta charset="utf-8">${head}` +
|
||||||
|
`<style>${PRINT_CSS}</style></head><body>${clone.outerHTML}</body></html>`
|
||||||
|
);
|
||||||
|
win.document.close();
|
||||||
|
win.focus();
|
||||||
|
|
||||||
|
// Даём стилям/шрифтам примениться, затем печатаем и закрываем окно.
|
||||||
|
const done = (): void => {
|
||||||
|
win.print();
|
||||||
|
win.close();
|
||||||
|
};
|
||||||
|
if (win.document.readyState === 'complete') {
|
||||||
|
window.setTimeout(done, 350);
|
||||||
|
} else {
|
||||||
|
win.onload = (): void => {
|
||||||
|
window.setTimeout(done, 350);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Button variant="secondary" onClick={onPrint}>
|
||||||
|
<Icon name="document" size="sm" />
|
||||||
|
{label}
|
||||||
|
</Button>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -21,5 +21,6 @@ export { FormModeProvider, useFormReadOnly } from './FormMode';
|
|||||||
export { Icon } from './Icon/Icon';
|
export { Icon } from './Icon/Icon';
|
||||||
export { SubmitActions } from './SubmitActions/SubmitActions';
|
export { SubmitActions } from './SubmitActions/SubmitActions';
|
||||||
export { RequestNumber } from './RequestNumber/RequestNumber';
|
export { RequestNumber } from './RequestNumber/RequestNumber';
|
||||||
|
export { PrintButton } from './PrintButton/PrintButton';
|
||||||
export { useRequestSubmit } from './useRequestSubmit';
|
export { useRequestSubmit } from './useRequestSubmit';
|
||||||
export type { IRequestSubmit, SubmitKind } from './useRequestSubmit';
|
export type { IRequestSubmit, SubmitKind } from './useRequestSubmit';
|
||||||
|
|||||||
@@ -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