полное имя вместо email

frontend/src/webparts/approvalAdmin/components/screens/RouteStepsScreen.tsx

@@ -1,17 +1,20 @@
 import * as React from 'react';
 import { RouteStepFormModal } from './RouteStepFormModal';
 import { ApprovalRouteApi } from '../../services/api';
+import { PortalDictionaryClient } from '../../services/portalDictionary';
 import { RouteStepStatus, TemplateRoute, TemplateRouteStep } from '../../models';
 import { routeStepStatusLabels, routeTypeLabels, texts } from '../../texts';
 import { describeStepExecutor } from '../../utils/stepExecutor';
 import { useRouteSteps } from '../../hooks/useRouteSteps';
 import { useDeleteTarget } from '../../hooks/useDeleteTarget';
+import { usePortalEmployees } from '../../hooks/usePortalEmployees';
 import {
   ActionsCell,
   Alert,
   Badge,
   Breadcrumbs,
   Button,
+  CellNote,
   ConfirmDialog,
   DataTable,
   IconButton,
@@ -23,11 +26,14 @@ export interface IRouteStepsScreenProps {
   api: ApprovalRouteApi;
   route: TemplateRoute;
   requestTypeName: string;
+  /** Undefined, пока SPFx выдаёт AAD-клиент для api.tnsu.kz. */
+  dictionary?: PortalDictionaryClient;
   onBack: () => void;
 }
 
-export const RouteStepsScreen: React.FC<IRouteStepsScreenProps> = ({ api, route, requestTypeName, onBack }) => {
+export const RouteStepsScreen: React.FC<IRouteStepsScreenProps> = ({ api, route, requestTypeName, dictionary, onBack }) => {
   const steps = useRouteSteps(api, route.id);
+  const employees = usePortalEmployees(dictionary);
   const [savedWarning, setSavedWarning] = React.useState<string | undefined>();
 
   const [editing, setEditing] = React.useState<TemplateRouteStep | undefined>();
@@ -86,7 +92,15 @@ export const RouteStepsScreen: React.FC<IRouteStepsScreenProps> = ({ api, route,
           {
             key: 'executor',
             header: texts.routeSteps.columnExecutor,
-            render: r => <PrimaryCell>{describeStepExecutor(r)}</PrimaryCell>
+            render: r => {
+              const executor = describeStepExecutor(r, employees.items);
+              return (
+                <div>
+                  <PrimaryCell>{executor.primary}</PrimaryCell>
+                  {executor.secondary && <CellNote>{executor.secondary}</CellNote>}
+                </div>
+              );
+            }
           },
           {
             key: 'status',
@@ -128,6 +142,8 @@ export const RouteStepsScreen: React.FC<IRouteStepsScreenProps> = ({ api, route,
           route={route}
           editing={editing}
           nextOrderNo={nextOrderNo}
+          employees={employees.items}
+          employeesLoading={employees.isLoading}
           onSaved={handleSaved}
           onClose={() => setShowForm(false)}
         />