feat: request portal — bespoke forms + approval mechanism
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
@import '../../../../styles/design-tokens';
|
||||
|
||||
.back {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: $sp-2;
|
||||
margin-bottom: $sp-4;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: $navy-700;
|
||||
font-family: $font-sans;
|
||||
font-size: $fs-sm;
|
||||
cursor: pointer;
|
||||
transition: color .18s;
|
||||
|
||||
&:hover {
|
||||
color: $gold-600;
|
||||
}
|
||||
}
|
||||
|
||||
.statusRow {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: $sp-3;
|
||||
}
|
||||
|
||||
.statusPill {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4px 12px;
|
||||
border-radius: $r-full;
|
||||
background: $navy-50;
|
||||
border: 1px solid $navy-100;
|
||||
color: $navy-800;
|
||||
font-family: $font-sans;
|
||||
font-size: $fs-caption;
|
||||
font-weight: 600;
|
||||
letter-spacing: .2px;
|
||||
}
|
||||
@@ -0,0 +1,129 @@
|
||||
import * as React from 'react';
|
||||
import { useState, useMemo, useCallback } from 'react';
|
||||
import styles from './RecruitingHireForm.module.scss';
|
||||
import { Button, Alert, FormCard, FormActions, Icon } from '../../shared/ui';
|
||||
import {
|
||||
ApprovalMatrix,
|
||||
useMatrixEditor,
|
||||
getPlannedMatrix,
|
||||
REQUEST_STATUS,
|
||||
IApproverToWrite
|
||||
} from '../../shared/approval';
|
||||
import { IRequestFormProps } from '../../models/types';
|
||||
import { IFormData, EMPTY_DATA, SetField } from './model';
|
||||
import { saveHireRequest, hireApprovalService, HIRE_REQUEST_TYPE_ID } from './submit';
|
||||
import { ApplicationSection } from './sections/ApplicationSection';
|
||||
import { CandidateSection } from './sections/CandidateSection';
|
||||
import { PpeSection } from './sections/PpeSection';
|
||||
import { ConditionsSection } from './sections/ConditionsSection';
|
||||
import { ResponsibleSection } from './sections/ResponsibleSection';
|
||||
|
||||
type ActionStatus = 'idle' | 'saving' | 'success' | 'error';
|
||||
type ActionKind = 'draft' | 'submit';
|
||||
|
||||
const RecruitingHireForm: React.FC<IRequestFormProps> = ({ requestType, context, onCancel, onSaved }) => {
|
||||
const [data, setData] = useState<IFormData>(EMPTY_DATA);
|
||||
const [actionStatus, setActionStatus] = useState<ActionStatus>('idle');
|
||||
const [actionKind, setActionKind] = useState<ActionKind | undefined>(undefined);
|
||||
const [status, setStatus] = useState<string | undefined>(undefined);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
const set: SetField = (key, value) => {
|
||||
setData((prev) => ({ ...prev, [key]: value }));
|
||||
setActionStatus('idle');
|
||||
};
|
||||
|
||||
// Маршрут согласования (планируемый) резолвится по email инициатора — текущего
|
||||
// пользователя (кандидата ещё нет в системе).
|
||||
const approval = useMemo(() => hireApprovalService(), []);
|
||||
const userEmail = context.pageContext.user.email;
|
||||
const loadMatrix = useCallback(
|
||||
() => getPlannedMatrix(context, HIRE_REQUEST_TYPE_ID, userEmail, approval),
|
||||
[context, userEmail, approval]
|
||||
);
|
||||
const matrix = useMatrixEditor(loadMatrix, userEmail, true, true, (login) =>
|
||||
approval.getJobTitle(login)
|
||||
);
|
||||
|
||||
const saving = actionStatus === 'saving';
|
||||
const isValid = data.CandidateName.trim().length > 0 && data.Position.trim().length > 0;
|
||||
|
||||
const matrixApprovers = (): IApproverToWrite[] =>
|
||||
matrix.rows.map((r) => ({ email: r.email, position: r.position, allowReassign: r.allowReassign }));
|
||||
|
||||
async function run(kind: ActionKind, requestStatus: string): Promise<void> {
|
||||
if (!isValid) {
|
||||
setError('Заполните обязательные поля: Ф.И.О. кандидата, Должность.');
|
||||
return;
|
||||
}
|
||||
setError(null);
|
||||
setActionKind(kind);
|
||||
setActionStatus('saving');
|
||||
try {
|
||||
await saveHireRequest(data, matrixApprovers(), requestStatus);
|
||||
setStatus(requestStatus);
|
||||
setActionStatus('success');
|
||||
if (onSaved) {
|
||||
onSaved();
|
||||
}
|
||||
} catch (e) {
|
||||
setActionStatus('error');
|
||||
setError(`Ошибка сохранения: ${(e as Error).message}`);
|
||||
}
|
||||
}
|
||||
|
||||
const handleSaveDraft = (): Promise<void> => run('draft', REQUEST_STATUS.draft);
|
||||
const handleSubmit = (): Promise<void> => run('submit', REQUEST_STATUS.onApproval);
|
||||
|
||||
const sectionProps = { data, set, context };
|
||||
|
||||
return (
|
||||
<div>
|
||||
<button type="button" className={styles.back} onClick={onCancel}>
|
||||
<Icon name="arrow-left" size="sm" />
|
||||
<span>К списку заявок</span>
|
||||
</button>
|
||||
|
||||
<FormCard title={requestType.title} subtitle="Категория: Отдел рекрутинга">
|
||||
{status && (
|
||||
<div className={styles.statusRow}>
|
||||
<span className={styles.statusPill}>{status}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{actionStatus === 'success' && (
|
||||
<Alert variant="ok">
|
||||
{actionKind === 'draft'
|
||||
? 'Черновик сохранён.'
|
||||
: 'Заявка отправлена на согласование.'}
|
||||
</Alert>
|
||||
)}
|
||||
{error && <Alert variant="err">{error}</Alert>}
|
||||
|
||||
<ApplicationSection {...sectionProps} />
|
||||
<CandidateSection {...sectionProps} />
|
||||
<PpeSection {...sectionProps} />
|
||||
<ConditionsSection {...sectionProps} />
|
||||
<ResponsibleSection {...sectionProps} />
|
||||
|
||||
<ApprovalMatrix editor={matrix} search={(q) => approval.searchUsers(q)} />
|
||||
|
||||
<FormActions>
|
||||
<Button variant="secondary" onClick={onCancel} disabled={saving}>
|
||||
Отмена
|
||||
</Button>
|
||||
<Button variant="secondary" onClick={handleSaveDraft} disabled={!isValid || saving}>
|
||||
<Icon name="document" size="sm" />
|
||||
Сохранить черновик
|
||||
</Button>
|
||||
<Button variant="accent" onClick={handleSubmit} disabled={!isValid || saving}>
|
||||
<Icon name="send" size="sm" />
|
||||
{saving && actionKind === 'submit' ? 'Отправка…' : 'Отправить на согласование'}
|
||||
</Button>
|
||||
</FormActions>
|
||||
</FormCard>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default RecruitingHireForm;
|
||||
@@ -0,0 +1,12 @@
|
||||
{
|
||||
"dataListTitle": "Согласование — Прием на работу",
|
||||
"columns": [
|
||||
{ "internalName": "Approver", "title": "Согласующий", "type": "User", "userSelectionMode": "PeopleOnly" },
|
||||
{ "internalName": "Status", "title": "Статус", "type": "Choice", "choices": ["Черновик", "На согласовании", "Согласовано", "Отклонено", "Возвращена на доработку", "Выполнение", "Закрыта"] },
|
||||
{ "internalName": "Ticket", "title": "Заявка", "type": "Lookup", "lookupList": "Прием на работу — данные", "lookupShowField": "Title" },
|
||||
{ "internalName": "Date", "title": "Дата", "type": "DateTime" },
|
||||
{ "internalName": "Comment", "title": "Комментарий", "type": "Note" },
|
||||
{ "internalName": "Order", "title": "Порядок", "type": "Number" },
|
||||
{ "internalName": "AllowReassignToOtherApprovers", "title": "Можно перепоручать", "type": "Boolean" }
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,78 @@
|
||||
import { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||
import { ISelectOption } from '../../shared/ui';
|
||||
|
||||
/**
|
||||
* Данные формы «Заявка на прием». Ключи = internalName колонок SP-списка
|
||||
* «Прием на работу — данные», чтобы при записи маппинг был 1:1.
|
||||
*/
|
||||
export interface IFormData {
|
||||
// Заявка (шапка)
|
||||
Phone: string;
|
||||
HireType: string;
|
||||
ReplacedEmployee: string;
|
||||
// Кандидат
|
||||
CandidateName: string;
|
||||
HireDate: string;
|
||||
Position: string;
|
||||
WorkKind: string;
|
||||
SiteName: string;
|
||||
SiteLocation: string;
|
||||
// СИЗ
|
||||
PpeHeight: string;
|
||||
PpeClothingSize: string;
|
||||
PpeShoeSize: string;
|
||||
// Условия оплаты и оформления
|
||||
SalaryProbation: string;
|
||||
SalaryAfterProbation: string;
|
||||
WorkSchedule: string;
|
||||
EmploymentForm: string;
|
||||
// Ответственные лица
|
||||
SiteManager: string;
|
||||
SecuritySpecialist: string;
|
||||
}
|
||||
|
||||
/** Обновление одного поля формы с сохранением типа значения. */
|
||||
export type SetField = <K extends keyof IFormData>(key: K, value: IFormData[K]) => void;
|
||||
|
||||
/** Пропсы каждой секции формы: срез данных + колбэк обновления + контекст (для people picker). */
|
||||
export interface ISectionProps {
|
||||
data: IFormData;
|
||||
set: SetField;
|
||||
context: WebPartContext;
|
||||
}
|
||||
|
||||
export const EMPTY_DATA: IFormData = {
|
||||
Phone: '',
|
||||
HireType: '',
|
||||
ReplacedEmployee: '',
|
||||
CandidateName: '',
|
||||
HireDate: '',
|
||||
Position: '',
|
||||
WorkKind: '',
|
||||
SiteName: '',
|
||||
SiteLocation: '',
|
||||
PpeHeight: '',
|
||||
PpeClothingSize: '',
|
||||
PpeShoeSize: '',
|
||||
SalaryProbation: '',
|
||||
SalaryAfterProbation: '',
|
||||
WorkSchedule: '',
|
||||
EmploymentForm: '',
|
||||
SiteManager: '',
|
||||
SecuritySpecialist: ''
|
||||
};
|
||||
|
||||
/** Варианты «Тип приёма» — совпадают с choices колонки HireType. */
|
||||
export const HIRE_TYPE_OPTIONS: ISelectOption[] = [
|
||||
{ value: 'Новый сотрудник', label: 'Новый сотрудник' },
|
||||
{ value: 'Вместо уволенного', label: 'Вместо уволенного' }
|
||||
];
|
||||
|
||||
/** Варианты «Вид оформления» — совпадают с choices колонки EmploymentForm. */
|
||||
export const EMPLOYMENT_FORM_OPTIONS: ISelectOption[] = [
|
||||
{ value: 'ГПХ', label: 'ГПХ' },
|
||||
{ value: 'Штат', label: 'Штат' }
|
||||
];
|
||||
|
||||
/** Плейсхолдер для полей-людей. */
|
||||
export const PERSON_PLACEHOLDER = 'Начните вводить имя сотрудника…';
|
||||
@@ -0,0 +1,29 @@
|
||||
{
|
||||
"dataListTitle": "Прием на работу — данные",
|
||||
"columns": [
|
||||
{ "internalName": "Status", "title": "Статус", "type": "Choice", "choices": ["Черновик", "На согласовании", "Согласовано", "Отклонено", "Возвращена на доработку", "Выполнение", "Закрыта"] },
|
||||
|
||||
{ "internalName": "Phone", "title": "Телефон", "type": "Text" },
|
||||
{ "internalName": "HireType", "title": "Тип приёма", "type": "Choice", "choices": ["Новый сотрудник", "Вместо уволенного"] },
|
||||
{ "internalName": "ReplacedEmployee", "title": "Взамен кого (Ф.И.О. уволенного)", "type": "Text" },
|
||||
|
||||
{ "internalName": "CandidateName", "title": "Ф.И.О. кандидата", "type": "Text", "required": true },
|
||||
{ "internalName": "HireDate", "title": "Дата приёма", "type": "DateTime", "dateOnly": true },
|
||||
{ "internalName": "Position", "title": "Должность", "type": "Text", "required": true },
|
||||
{ "internalName": "WorkKind", "title": "Вид работ", "type": "Text" },
|
||||
{ "internalName": "SiteName", "title": "Наименование участка", "type": "Text" },
|
||||
{ "internalName": "SiteLocation", "title": "Местоположение участка", "type": "Text" },
|
||||
|
||||
{ "internalName": "PpeHeight", "title": "СИЗ: рост", "type": "Number" },
|
||||
{ "internalName": "PpeClothingSize", "title": "СИЗ: размер одежды", "type": "Text" },
|
||||
{ "internalName": "PpeShoeSize", "title": "СИЗ: размер обуви", "type": "Number" },
|
||||
|
||||
{ "internalName": "SalaryProbation", "title": "Оклад при испытательном сроке", "type": "Number", "decimals": 2 },
|
||||
{ "internalName": "SalaryAfterProbation", "title": "Оклад по завершении ИС", "type": "Number", "decimals": 2 },
|
||||
{ "internalName": "WorkSchedule", "title": "График работы", "type": "Text" },
|
||||
{ "internalName": "EmploymentForm", "title": "Вид оформления", "type": "Choice", "choices": ["ГПХ", "Штат"] },
|
||||
|
||||
{ "internalName": "SiteManager", "title": "Руководитель участка", "type": "User", "userSelectionMode": "PeopleOnly" },
|
||||
{ "internalName": "SecuritySpecialist", "title": "Специалист СБ", "type": "User", "userSelectionMode": "PeopleOnly" }
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput, Select } from '../../../shared/ui';
|
||||
import { ISectionProps, HIRE_TYPE_OPTIONS } from '../model';
|
||||
|
||||
export const ApplicationSection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="Заявка" icon="clipboard">
|
||||
<FormField label="Телефон" htmlFor="Phone">
|
||||
<TextInput id="Phone" value={data.Phone} onChange={(v) => set('Phone', v)} />
|
||||
</FormField>
|
||||
<FormField label="Тип приёма" htmlFor="HireType">
|
||||
<Select
|
||||
id="HireType"
|
||||
value={data.HireType}
|
||||
onChange={(v) => set('HireType', v)}
|
||||
options={HIRE_TYPE_OPTIONS}
|
||||
placeholder="— выберите —"
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Взамен кого (Ф.И.О. уволенного)" htmlFor="ReplacedEmployee" full>
|
||||
<TextInput
|
||||
id="ReplacedEmployee"
|
||||
value={data.ReplacedEmployee}
|
||||
onChange={(v) => set('ReplacedEmployee', v)}
|
||||
/>
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,26 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput } from '../../../shared/ui';
|
||||
import { ISectionProps } from '../model';
|
||||
|
||||
export const CandidateSection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="Кандидат" icon="people">
|
||||
<FormField label="Ф.И.О. кандидата" htmlFor="CandidateName" required full>
|
||||
<TextInput id="CandidateName" value={data.CandidateName} onChange={(v) => set('CandidateName', v)} />
|
||||
</FormField>
|
||||
<FormField label="Дата приёма" htmlFor="HireDate">
|
||||
<TextInput id="HireDate" type="date" value={data.HireDate} onChange={(v) => set('HireDate', v)} />
|
||||
</FormField>
|
||||
<FormField label="Должность" htmlFor="Position" required>
|
||||
<TextInput id="Position" value={data.Position} onChange={(v) => set('Position', v)} />
|
||||
</FormField>
|
||||
<FormField label="Вид работ" htmlFor="WorkKind">
|
||||
<TextInput id="WorkKind" value={data.WorkKind} onChange={(v) => set('WorkKind', v)} />
|
||||
</FormField>
|
||||
<FormField label="Наименование участка" htmlFor="SiteName">
|
||||
<TextInput id="SiteName" value={data.SiteName} onChange={(v) => set('SiteName', v)} />
|
||||
</FormField>
|
||||
<FormField label="Местоположение участка" htmlFor="SiteLocation">
|
||||
<TextInput id="SiteLocation" value={data.SiteLocation} onChange={(v) => set('SiteLocation', v)} />
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,36 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput, Select } from '../../../shared/ui';
|
||||
import { ISectionProps, EMPLOYMENT_FORM_OPTIONS } from '../model';
|
||||
|
||||
export const ConditionsSection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="Условия оплаты и оформления" icon="calculator">
|
||||
<FormField label="Оклад при испытательном сроке" htmlFor="SalaryProbation">
|
||||
<TextInput
|
||||
id="SalaryProbation"
|
||||
type="number"
|
||||
value={data.SalaryProbation}
|
||||
onChange={(v) => set('SalaryProbation', v)}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Оклад по завершении ИС" htmlFor="SalaryAfterProbation">
|
||||
<TextInput
|
||||
id="SalaryAfterProbation"
|
||||
type="number"
|
||||
value={data.SalaryAfterProbation}
|
||||
onChange={(v) => set('SalaryAfterProbation', v)}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="График работы" htmlFor="WorkSchedule">
|
||||
<TextInput id="WorkSchedule" value={data.WorkSchedule} onChange={(v) => set('WorkSchedule', v)} />
|
||||
</FormField>
|
||||
<FormField label="Вид оформления" htmlFor="EmploymentForm">
|
||||
<Select
|
||||
id="EmploymentForm"
|
||||
value={data.EmploymentForm}
|
||||
onChange={(v) => set('EmploymentForm', v)}
|
||||
options={EMPLOYMENT_FORM_OPTIONS}
|
||||
placeholder="— выберите —"
|
||||
/>
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,17 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput } from '../../../shared/ui';
|
||||
import { ISectionProps } from '../model';
|
||||
|
||||
export const PpeSection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="СИЗ (спецодежда)" icon="folder">
|
||||
<FormField label="Рост, см" htmlFor="PpeHeight">
|
||||
<TextInput id="PpeHeight" type="number" value={data.PpeHeight} onChange={(v) => set('PpeHeight', v)} />
|
||||
</FormField>
|
||||
<FormField label="Размер одежды" htmlFor="PpeClothingSize">
|
||||
<TextInput id="PpeClothingSize" value={data.PpeClothingSize} onChange={(v) => set('PpeClothingSize', v)} />
|
||||
</FormField>
|
||||
<FormField label="Размер обуви" htmlFor="PpeShoeSize">
|
||||
<TextInput id="PpeShoeSize" type="number" value={data.PpeShoeSize} onChange={(v) => set('PpeShoeSize', v)} />
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,24 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, PeopleField } from '../../../shared/ui';
|
||||
import { ISectionProps, PERSON_PLACEHOLDER } from '../model';
|
||||
|
||||
export const ResponsibleSection: React.FC<ISectionProps> = ({ data, set, context }) => (
|
||||
<CollapseSection title="Ответственные лица" icon="check">
|
||||
<FormField label="Руководитель участка" full>
|
||||
<PeopleField
|
||||
context={context}
|
||||
value={data.SiteManager}
|
||||
onChange={(v) => set('SiteManager', v)}
|
||||
placeholder={PERSON_PLACEHOLDER}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Специалист СБ" full>
|
||||
<PeopleField
|
||||
context={context}
|
||||
value={data.SecuritySpecialist}
|
||||
onChange={(v) => set('SecuritySpecialist', v)}
|
||||
placeholder={PERSON_PLACEHOLDER}
|
||||
/>
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,74 @@
|
||||
import { getSP } from '../../shared/pnp/pnpjs';
|
||||
import { ApprovalListService, IApproverToWrite, writeApprovers } from '../../shared/approval';
|
||||
import { IFormData } from './model';
|
||||
|
||||
const LIST_TITLE = 'Прием на работу — данные';
|
||||
export const APPROVAL_LIST_TITLE = 'Согласование — Прием на работу';
|
||||
// Тип заявки «Заявка на прием» во внешнем approval-route API
|
||||
// (GET /api/request-types → id 5). Захардкожен, как «отпуск = 1» в pto-tracker.
|
||||
export const HIRE_REQUEST_TYPE_ID = 5;
|
||||
|
||||
// Поля-люди (один человек): логин → ensureUser → Id в колонку <Field>Id.
|
||||
const PERSON_FIELDS: (keyof IFormData)[] = ['SiteManager', 'SecuritySpecialist'];
|
||||
// Числовые поля: пустая строка → null, иначе Number().
|
||||
const NUMBER_FIELDS: (keyof IFormData)[] = ['PpeHeight', 'PpeShoeSize', 'SalaryProbation', 'SalaryAfterProbation'];
|
||||
|
||||
/** Экземпляр сервиса списка согласования этой формы. */
|
||||
export function hireApprovalService(): ApprovalListService {
|
||||
return new ApprovalListService(APPROVAL_LIST_TITLE);
|
||||
}
|
||||
|
||||
/** Логин → числовой Id пользователя на текущем сайте. */
|
||||
async function resolveUserId(login: string): Promise<number> {
|
||||
const ensured = await getSP().web.ensureUser(login); // v4: возвращает ISiteUserInfo с .Id
|
||||
return ensured.Id;
|
||||
}
|
||||
|
||||
/** Осмысленный заголовок элемента списка (системная колонка Title). */
|
||||
function buildTitle(data: IFormData): string {
|
||||
return ['Прием', data.CandidateName, data.Position].filter(Boolean).join(' — ');
|
||||
}
|
||||
|
||||
/** Записать контент заявки со статусом. Возвращает Id созданного элемента. */
|
||||
async function writeContent(data: IFormData, status: string): Promise<number> {
|
||||
const item: Record<string, unknown> = { Title: buildTitle(data), Status: status };
|
||||
|
||||
// Текст/выбор/даты/числа (людей пропускаем — они ниже).
|
||||
(Object.keys(data) as (keyof IFormData)[]).forEach((key) => {
|
||||
if (PERSON_FIELDS.indexOf(key) !== -1) {
|
||||
return;
|
||||
}
|
||||
const value = data[key];
|
||||
if (NUMBER_FIELDS.indexOf(key) !== -1) {
|
||||
item[key] = value === '' ? null : Number(value);
|
||||
} else {
|
||||
item[key] = value === '' ? null : value;
|
||||
}
|
||||
});
|
||||
|
||||
// Один человек → <Field>Id.
|
||||
for (let i = 0; i < PERSON_FIELDS.length; i++) {
|
||||
const login = data[PERSON_FIELDS[i]] as string;
|
||||
if (login) {
|
||||
item[`${PERSON_FIELDS[i]}Id`] = await resolveUserId(login);
|
||||
}
|
||||
}
|
||||
|
||||
const added = await getSP().web.lists.getByTitle(LIST_TITLE).items.add(item);
|
||||
return (added as { Id: number }).Id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Сохранить заявку «на прием»: контент + маршрут согласующих со статусом.
|
||||
* status = «Черновик» (сохранение) или «На согласовании» (отправка).
|
||||
* Возвращает Id заявки.
|
||||
*/
|
||||
export async function saveHireRequest(
|
||||
data: IFormData,
|
||||
approvers: IApproverToWrite[],
|
||||
status: string
|
||||
): Promise<number> {
|
||||
const id = await writeContent(data, status);
|
||||
await writeApprovers(hireApprovalService(), id, approvers, status);
|
||||
return id;
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
@import '../../../../styles/design-tokens';
|
||||
|
||||
.back {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: $sp-2;
|
||||
margin-bottom: $sp-4;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: $navy-700;
|
||||
font-family: $font-sans;
|
||||
font-size: $fs-sm;
|
||||
cursor: pointer;
|
||||
transition: color .18s;
|
||||
|
||||
&:hover {
|
||||
color: $gold-600;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,83 @@
|
||||
import * as React from 'react';
|
||||
import { useState } from 'react';
|
||||
import styles from './RecruitingSelectionForm.module.scss';
|
||||
import { Button, Alert, FormCard, FormActions, Icon } from '../../shared/ui';
|
||||
import { IRequestFormProps } from '../../models/types';
|
||||
import { IFormData, EMPTY_DATA, SetField } from './model';
|
||||
import { submitRecruitingSelection } from './submit';
|
||||
import { ApplicationSection } from './sections/ApplicationSection';
|
||||
import { DepartmentSection } from './sections/DepartmentSection';
|
||||
import { VacancySection } from './sections/VacancySection';
|
||||
import { HealthTripsSection } from './sections/HealthTripsSection';
|
||||
import { ConditionsSection } from './sections/ConditionsSection';
|
||||
|
||||
const RecruitingSelectionForm: React.FC<IRequestFormProps> = ({ requestType, context, onCancel, onSaved }) => {
|
||||
const [data, setData] = useState<IFormData>(EMPTY_DATA);
|
||||
const [saving, setSaving] = useState<boolean>(false);
|
||||
const [saved, setSaved] = useState<boolean>(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
const set: SetField = (key, value) => {
|
||||
setData((prev) => ({ ...prev, [key]: value }));
|
||||
setSaved(false);
|
||||
};
|
||||
|
||||
async function handleSave(): Promise<void> {
|
||||
const missing: string[] = [];
|
||||
if (!data.Responsible) missing.push('Ответственный за подачу заявки');
|
||||
if (!data.DepartmentName) missing.push('Название отдела/департамента');
|
||||
if (!data.Position) missing.push('Должность');
|
||||
if (missing.length > 0) {
|
||||
setError(`Заполните обязательные поля: ${missing.join(', ')}`);
|
||||
return;
|
||||
}
|
||||
|
||||
setError(null);
|
||||
setSaving(true);
|
||||
try {
|
||||
await submitRecruitingSelection(data);
|
||||
setSaved(true);
|
||||
if (onSaved) {
|
||||
onSaved();
|
||||
}
|
||||
} catch (e) {
|
||||
setError(`Ошибка сохранения: ${(e as Error).message}`);
|
||||
} finally {
|
||||
setSaving(false);
|
||||
}
|
||||
}
|
||||
|
||||
const sectionProps = { data, set, context };
|
||||
|
||||
return (
|
||||
<div>
|
||||
<button type="button" className={styles.back} onClick={onCancel}>
|
||||
<Icon name="arrow-left" size="sm" />
|
||||
<span>К списку заявок</span>
|
||||
</button>
|
||||
|
||||
<FormCard title={requestType.title} subtitle="Категория: Отдел рекрутинга">
|
||||
{saved && <Alert variant="ok">Заявка сохранена в SharePoint.</Alert>}
|
||||
{error && <Alert variant="err">{error}</Alert>}
|
||||
|
||||
<ApplicationSection {...sectionProps} />
|
||||
<DepartmentSection {...sectionProps} />
|
||||
<VacancySection {...sectionProps} />
|
||||
<HealthTripsSection {...sectionProps} />
|
||||
<ConditionsSection {...sectionProps} />
|
||||
|
||||
<FormActions>
|
||||
<Button variant="secondary" onClick={onCancel} disabled={saving}>
|
||||
Отмена
|
||||
</Button>
|
||||
<Button variant="accent" onClick={handleSave} disabled={saving}>
|
||||
<Icon name="check" size="sm" />
|
||||
{saving ? 'Сохранение…' : 'Сохранить заявку'}
|
||||
</Button>
|
||||
</FormActions>
|
||||
</FormCard>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default RecruitingSelectionForm;
|
||||
@@ -0,0 +1,120 @@
|
||||
import { WebPartContext } from '@microsoft/sp-webpart-base';
|
||||
import { ISelectOption } from '../../shared/ui';
|
||||
|
||||
/**
|
||||
* Данные формы «Заявка на подбор». Ключи = internalName колонок SP-списка
|
||||
* «Заявка на подбор — данные», чтобы при записи маппинг был 1:1.
|
||||
*/
|
||||
export interface IFormData {
|
||||
// Заявка
|
||||
Responsible: string;
|
||||
SubmitDate: string;
|
||||
ClosingDeadline: string;
|
||||
OpenReason: string;
|
||||
IsRegistered: boolean;
|
||||
IsApproved: boolean;
|
||||
CompletionMark: boolean;
|
||||
// Отдел
|
||||
DepartmentName: string;
|
||||
DepartmentHeadcount: string;
|
||||
DepartmentGoals: string;
|
||||
RelatedDepartments: string;
|
||||
// Вакансия
|
||||
Position: string;
|
||||
ClassifierCode: string;
|
||||
EmploymentType: string;
|
||||
MainFunction: string;
|
||||
AdditionalFunction: string;
|
||||
Competencies: string;
|
||||
PersonalTraits: string;
|
||||
Education: string;
|
||||
WorkExperience: string;
|
||||
AdditionalEducation: string;
|
||||
EvaluationCriteria: string;
|
||||
PcSkills: string;
|
||||
ForeignLanguages: string;
|
||||
Residence: string;
|
||||
DrivingLicense: string;
|
||||
// Здоровье / командировки
|
||||
HealthRestrictions: string;
|
||||
BusinessTrips: string;
|
||||
// Условия работы
|
||||
RateProbation: string;
|
||||
RateAfterProbation: string;
|
||||
Awards: string;
|
||||
Bonuses: string;
|
||||
CompensationPackage: string;
|
||||
WorkSchedule: string;
|
||||
Location: string;
|
||||
MaterialResponsibility: boolean;
|
||||
WorkplaceProvision: string;
|
||||
ProposedMentor: string;
|
||||
DirectManager: string;
|
||||
DevelopmentPrograms: string;
|
||||
DesiredTraining: string;
|
||||
HiringDecisionMaker: string[];
|
||||
}
|
||||
|
||||
/** Обновление одного поля формы с сохранением типа значения. */
|
||||
export type SetField = <K extends keyof IFormData>(key: K, value: IFormData[K]) => void;
|
||||
|
||||
/** Пропсы каждой секции формы: срез данных + колбэк обновления + контекст (для people picker). */
|
||||
export interface ISectionProps {
|
||||
data: IFormData;
|
||||
set: SetField;
|
||||
context: WebPartContext;
|
||||
}
|
||||
|
||||
export const EMPTY_DATA: IFormData = {
|
||||
Responsible: '',
|
||||
SubmitDate: '',
|
||||
ClosingDeadline: '',
|
||||
OpenReason: '',
|
||||
IsRegistered: false,
|
||||
IsApproved: false,
|
||||
CompletionMark: false,
|
||||
DepartmentName: '',
|
||||
DepartmentHeadcount: '',
|
||||
DepartmentGoals: '',
|
||||
RelatedDepartments: '',
|
||||
Position: '',
|
||||
ClassifierCode: '',
|
||||
EmploymentType: '',
|
||||
MainFunction: '',
|
||||
AdditionalFunction: '',
|
||||
Competencies: '',
|
||||
PersonalTraits: '',
|
||||
Education: '',
|
||||
WorkExperience: '',
|
||||
AdditionalEducation: '',
|
||||
EvaluationCriteria: '',
|
||||
PcSkills: '',
|
||||
ForeignLanguages: '',
|
||||
Residence: '',
|
||||
DrivingLicense: '',
|
||||
HealthRestrictions: '',
|
||||
BusinessTrips: '',
|
||||
RateProbation: '',
|
||||
RateAfterProbation: '',
|
||||
Awards: '',
|
||||
Bonuses: '',
|
||||
CompensationPackage: '',
|
||||
WorkSchedule: '',
|
||||
Location: '',
|
||||
MaterialResponsibility: false,
|
||||
WorkplaceProvision: '',
|
||||
ProposedMentor: '',
|
||||
DirectManager: '',
|
||||
DevelopmentPrograms: '',
|
||||
DesiredTraining: '',
|
||||
HiringDecisionMaker: []
|
||||
};
|
||||
|
||||
/** Варианты «Характер занятости» — совпадают с choices колонки EmploymentType. */
|
||||
export const EMPLOYMENT_TYPE_OPTIONS: ISelectOption[] = [
|
||||
{ value: 'Постоянная', label: 'Постоянная' },
|
||||
{ value: 'Временная', label: 'Временная' }
|
||||
];
|
||||
|
||||
/** Плейсхолдер для полей-людей. */
|
||||
export const PERSON_PLACEHOLDER = 'Начните вводить имя сотрудника…';
|
||||
@@ -0,0 +1,51 @@
|
||||
{
|
||||
"dataListTitle": "Заявка на подбор — данные",
|
||||
"columns": [
|
||||
{ "internalName": "Responsible", "title": "Ответственный за подачу заявки", "type": "User", "userSelectionMode": "PeopleOnly", "required": true },
|
||||
{ "internalName": "SubmitDate", "title": "Дата подачи заявки", "type": "DateTime", "dateOnly": true },
|
||||
{ "internalName": "IsRegistered", "title": "Зарегистрирована", "type": "Boolean" },
|
||||
{ "internalName": "IsApproved", "title": "Одобрена", "type": "Boolean" },
|
||||
{ "internalName": "OpenReason", "title": "Причина открытия вакансии", "type": "Note" },
|
||||
{ "internalName": "ClosingDeadline", "title": "Крайний срок закрытия", "type": "DateTime", "dateOnly": true },
|
||||
{ "internalName": "CompletionMark", "title": "Отметка о выполнении", "type": "Boolean" },
|
||||
|
||||
{ "internalName": "DepartmentName", "title": "Название отдела/департамента", "type": "Text", "required": true },
|
||||
{ "internalName": "DepartmentHeadcount", "title": "Количество сотрудников в отделе", "type": "Number" },
|
||||
{ "internalName": "DepartmentGoals", "title": "Цели, стоящие перед отделом", "type": "Note" },
|
||||
{ "internalName": "RelatedDepartments", "title": "Смежные отделы по бизнес-процессам", "type": "Note" },
|
||||
|
||||
{ "internalName": "Position", "title": "Должность", "type": "Text", "required": true },
|
||||
{ "internalName": "ClassifierCode", "title": "Код по классификатору", "type": "Text" },
|
||||
{ "internalName": "EmploymentType", "title": "Характер занятости", "type": "Choice", "choices": ["Постоянная", "Временная"] },
|
||||
{ "internalName": "MainFunction", "title": "Основной функционал", "type": "Note" },
|
||||
{ "internalName": "AdditionalFunction", "title": "Дополнительный функционал", "type": "Note" },
|
||||
{ "internalName": "Competencies", "title": "Компетенции", "type": "Note" },
|
||||
{ "internalName": "PersonalTraits", "title": "Личностные характеристики", "type": "Note" },
|
||||
{ "internalName": "Education", "title": "Образование", "type": "Text" },
|
||||
{ "internalName": "WorkExperience", "title": "Опыт работы", "type": "Note" },
|
||||
{ "internalName": "AdditionalEducation", "title": "Дополнительное образование", "type": "Note" },
|
||||
{ "internalName": "EvaluationCriteria", "title": "Критерии оценки работы", "type": "Note" },
|
||||
{ "internalName": "PcSkills", "title": "Уровень владения ПК и программами", "type": "Note" },
|
||||
{ "internalName": "ForeignLanguages", "title": "Иностранные языки (уровень владения)", "type": "Note" },
|
||||
{ "internalName": "Residence", "title": "Проживание", "type": "Text" },
|
||||
{ "internalName": "DrivingLicense", "title": "Водительские права, стаж вождения", "type": "Text" },
|
||||
|
||||
{ "internalName": "HealthRestrictions", "title": "Приемлемые противопоказания (здоровье)", "type": "Note" },
|
||||
{ "internalName": "BusinessTrips", "title": "Командировки (есть/нет и продолжительность)", "type": "Note" },
|
||||
|
||||
{ "internalName": "RateProbation", "title": "Ставка на ИС", "type": "Number", "decimals": 2 },
|
||||
{ "internalName": "RateAfterProbation", "title": "Ставка после ИС", "type": "Number", "decimals": 2 },
|
||||
{ "internalName": "Awards", "title": "Премии", "type": "Note" },
|
||||
{ "internalName": "Bonuses", "title": "Бонусы", "type": "Note" },
|
||||
{ "internalName": "CompensationPackage", "title": "Компенсационный пакет", "type": "Note" },
|
||||
{ "internalName": "WorkSchedule", "title": "Режим работы", "type": "Text" },
|
||||
{ "internalName": "Location", "title": "Локация", "type": "Text" },
|
||||
{ "internalName": "MaterialResponsibility", "title": "Материальная ответственность", "type": "Boolean" },
|
||||
{ "internalName": "WorkplaceProvision", "title": "Обеспечение рабочего места", "type": "Note" },
|
||||
{ "internalName": "ProposedMentor", "title": "Предполагаемый наставник", "type": "User", "userSelectionMode": "PeopleOnly" },
|
||||
{ "internalName": "DirectManager", "title": "Непосредственный руководитель", "type": "User", "userSelectionMode": "PeopleOnly" },
|
||||
{ "internalName": "DevelopmentPrograms", "title": "Программы развития и обучения, периодичность", "type": "Note" },
|
||||
{ "internalName": "DesiredTraining", "title": "Желаемое доп. обучение при выходе на работу", "type": "Note" },
|
||||
{ "internalName": "HiringDecisionMaker", "title": "Кто принимает решение о приеме (собеседования)", "type": "User", "userSelectionMode": "PeopleOnly", "allowMultiple": true }
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput, TextArea, Toggle, PeopleField } from '../../../shared/ui';
|
||||
import { ISectionProps, PERSON_PLACEHOLDER } from '../model';
|
||||
|
||||
export const ApplicationSection: React.FC<ISectionProps> = ({ data, set, context }) => (
|
||||
<CollapseSection title="Заявка" icon="clipboard">
|
||||
<FormField label="Ответственный за подачу заявки" required full>
|
||||
<PeopleField
|
||||
context={context}
|
||||
value={data.Responsible}
|
||||
onChange={(v) => set('Responsible', v)}
|
||||
placeholder={PERSON_PLACEHOLDER}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Дата подачи заявки" htmlFor="SubmitDate">
|
||||
<TextInput id="SubmitDate" type="date" value={data.SubmitDate} onChange={(v) => set('SubmitDate', v)} />
|
||||
</FormField>
|
||||
<FormField label="Крайний срок закрытия" htmlFor="ClosingDeadline">
|
||||
<TextInput
|
||||
id="ClosingDeadline"
|
||||
type="date"
|
||||
value={data.ClosingDeadline}
|
||||
onChange={(v) => set('ClosingDeadline', v)}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Причина открытия вакансии" htmlFor="OpenReason" full>
|
||||
<TextArea id="OpenReason" value={data.OpenReason} onChange={(v) => set('OpenReason', v)} placeholder="..." />
|
||||
</FormField>
|
||||
<FormField label="Зарегистрирована">
|
||||
<Toggle checked={data.IsRegistered} onChange={(v) => set('IsRegistered', v)} onLabel="Да" />
|
||||
</FormField>
|
||||
<FormField label="Одобрена">
|
||||
<Toggle checked={data.IsApproved} onChange={(v) => set('IsApproved', v)} onLabel="Да" />
|
||||
</FormField>
|
||||
<FormField label="Отметка о выполнении">
|
||||
<Toggle checked={data.CompletionMark} onChange={(v) => set('CompletionMark', v)} onLabel="Да" />
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,74 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput, TextArea, Toggle, PeopleField, PeopleFieldMulti } from '../../../shared/ui';
|
||||
import { ISectionProps, PERSON_PLACEHOLDER } from '../model';
|
||||
|
||||
export const ConditionsSection: React.FC<ISectionProps> = ({ data, set, context }) => (
|
||||
<CollapseSection title="Условия работы" icon="chart">
|
||||
<FormField label="Ставка на ИС" htmlFor="RateProbation">
|
||||
<TextInput id="RateProbation" type="number" value={data.RateProbation} onChange={(v) => set('RateProbation', v)} />
|
||||
</FormField>
|
||||
<FormField label="Ставка после ИС" htmlFor="RateAfterProbation">
|
||||
<TextInput
|
||||
id="RateAfterProbation"
|
||||
type="number"
|
||||
value={data.RateAfterProbation}
|
||||
onChange={(v) => set('RateAfterProbation', v)}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Премии" htmlFor="Awards" full>
|
||||
<TextArea id="Awards" value={data.Awards} onChange={(v) => set('Awards', v)} />
|
||||
</FormField>
|
||||
<FormField label="Бонусы" htmlFor="Bonuses" full>
|
||||
<TextArea id="Bonuses" value={data.Bonuses} onChange={(v) => set('Bonuses', v)} />
|
||||
</FormField>
|
||||
<FormField label="Компенсационный пакет" htmlFor="CompensationPackage" full>
|
||||
<TextArea id="CompensationPackage" value={data.CompensationPackage} onChange={(v) => set('CompensationPackage', v)} />
|
||||
</FormField>
|
||||
<FormField label="Режим работы" htmlFor="WorkSchedule">
|
||||
<TextInput id="WorkSchedule" value={data.WorkSchedule} onChange={(v) => set('WorkSchedule', v)} />
|
||||
</FormField>
|
||||
<FormField label="Локация" htmlFor="Location">
|
||||
<TextInput id="Location" value={data.Location} onChange={(v) => set('Location', v)} />
|
||||
</FormField>
|
||||
<FormField label="Материальная ответственность">
|
||||
<Toggle
|
||||
checked={data.MaterialResponsibility}
|
||||
onChange={(v) => set('MaterialResponsibility', v)}
|
||||
onLabel="Да"
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Обеспечение рабочего места" htmlFor="WorkplaceProvision" full>
|
||||
<TextArea id="WorkplaceProvision" value={data.WorkplaceProvision} onChange={(v) => set('WorkplaceProvision', v)} />
|
||||
</FormField>
|
||||
<FormField label="Предполагаемый наставник">
|
||||
<PeopleField
|
||||
context={context}
|
||||
value={data.ProposedMentor}
|
||||
onChange={(v) => set('ProposedMentor', v)}
|
||||
placeholder={PERSON_PLACEHOLDER}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Непосредственный руководитель">
|
||||
<PeopleField
|
||||
context={context}
|
||||
value={data.DirectManager}
|
||||
onChange={(v) => set('DirectManager', v)}
|
||||
placeholder={PERSON_PLACEHOLDER}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Программы развития и обучения, периодичность" htmlFor="DevelopmentPrograms" full>
|
||||
<TextArea id="DevelopmentPrograms" value={data.DevelopmentPrograms} onChange={(v) => set('DevelopmentPrograms', v)} />
|
||||
</FormField>
|
||||
<FormField label="Желаемое доп. обучение при выходе на работу" htmlFor="DesiredTraining" full>
|
||||
<TextArea id="DesiredTraining" value={data.DesiredTraining} onChange={(v) => set('DesiredTraining', v)} />
|
||||
</FormField>
|
||||
<FormField label="Кто принимает решение о приеме (собеседования)" full>
|
||||
<PeopleFieldMulti
|
||||
context={context}
|
||||
value={data.HiringDecisionMaker}
|
||||
onChange={(v) => set('HiringDecisionMaker', v)}
|
||||
placeholder={PERSON_PLACEHOLDER}
|
||||
/>
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,29 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput, TextArea } from '../../../shared/ui';
|
||||
import { ISectionProps } from '../model';
|
||||
|
||||
export const DepartmentSection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="Отдел / Подразделение" icon="building">
|
||||
<FormField label="Название отдела/департамента" htmlFor="DepartmentName" required full>
|
||||
<TextInput id="DepartmentName" value={data.DepartmentName} onChange={(v) => set('DepartmentName', v)} />
|
||||
</FormField>
|
||||
<FormField label="Количество сотрудников в отделе" htmlFor="DepartmentHeadcount">
|
||||
<TextInput
|
||||
id="DepartmentHeadcount"
|
||||
type="number"
|
||||
value={data.DepartmentHeadcount}
|
||||
onChange={(v) => set('DepartmentHeadcount', v)}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Цели, стоящие перед отделом" htmlFor="DepartmentGoals" full>
|
||||
<TextArea id="DepartmentGoals" value={data.DepartmentGoals} onChange={(v) => set('DepartmentGoals', v)} />
|
||||
</FormField>
|
||||
<FormField label="Смежные отделы по бизнес-процессам" htmlFor="RelatedDepartments" full>
|
||||
<TextArea
|
||||
id="RelatedDepartments"
|
||||
value={data.RelatedDepartments}
|
||||
onChange={(v) => set('RelatedDepartments', v)}
|
||||
/>
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,18 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextArea } from '../../../shared/ui';
|
||||
import { ISectionProps } from '../model';
|
||||
|
||||
export const HealthTripsSection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="Здоровье и командировки" icon="send">
|
||||
<FormField label="Приемлемые противопоказания (здоровье)" htmlFor="HealthRestrictions" full>
|
||||
<TextArea
|
||||
id="HealthRestrictions"
|
||||
value={data.HealthRestrictions}
|
||||
onChange={(v) => set('HealthRestrictions', v)}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Командировки (есть/нет и продолжительность)" htmlFor="BusinessTrips" full>
|
||||
<TextArea id="BusinessTrips" value={data.BusinessTrips} onChange={(v) => set('BusinessTrips', v)} />
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,59 @@
|
||||
import * as React from 'react';
|
||||
import { CollapseSection, FormField, TextInput, TextArea, Select } from '../../../shared/ui';
|
||||
import { ISectionProps, EMPLOYMENT_TYPE_OPTIONS } from '../model';
|
||||
|
||||
export const VacancySection: React.FC<ISectionProps> = ({ data, set }) => (
|
||||
<CollapseSection title="Вакансия" icon="document">
|
||||
<FormField label="Должность" htmlFor="Position" required full>
|
||||
<TextInput id="Position" value={data.Position} onChange={(v) => set('Position', v)} />
|
||||
</FormField>
|
||||
<FormField label="Код по классификатору" htmlFor="ClassifierCode">
|
||||
<TextInput id="ClassifierCode" value={data.ClassifierCode} onChange={(v) => set('ClassifierCode', v)} />
|
||||
</FormField>
|
||||
<FormField label="Характер занятости" htmlFor="EmploymentType">
|
||||
<Select
|
||||
id="EmploymentType"
|
||||
value={data.EmploymentType}
|
||||
onChange={(v) => set('EmploymentType', v)}
|
||||
options={EMPLOYMENT_TYPE_OPTIONS}
|
||||
placeholder="— выберите —"
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Основной функционал" htmlFor="MainFunction" full>
|
||||
<TextArea id="MainFunction" value={data.MainFunction} onChange={(v) => set('MainFunction', v)} />
|
||||
</FormField>
|
||||
<FormField label="Дополнительный функционал" htmlFor="AdditionalFunction" full>
|
||||
<TextArea id="AdditionalFunction" value={data.AdditionalFunction} onChange={(v) => set('AdditionalFunction', v)} />
|
||||
</FormField>
|
||||
<FormField label="Компетенции" htmlFor="Competencies" full>
|
||||
<TextArea id="Competencies" value={data.Competencies} onChange={(v) => set('Competencies', v)} />
|
||||
</FormField>
|
||||
<FormField label="Личностные характеристики" htmlFor="PersonalTraits" full>
|
||||
<TextArea id="PersonalTraits" value={data.PersonalTraits} onChange={(v) => set('PersonalTraits', v)} />
|
||||
</FormField>
|
||||
<FormField label="Образование" htmlFor="Education">
|
||||
<TextInput id="Education" value={data.Education} onChange={(v) => set('Education', v)} />
|
||||
</FormField>
|
||||
<FormField label="Опыт работы" htmlFor="WorkExperience" full>
|
||||
<TextArea id="WorkExperience" value={data.WorkExperience} onChange={(v) => set('WorkExperience', v)} />
|
||||
</FormField>
|
||||
<FormField label="Дополнительное образование" htmlFor="AdditionalEducation" full>
|
||||
<TextArea id="AdditionalEducation" value={data.AdditionalEducation} onChange={(v) => set('AdditionalEducation', v)} />
|
||||
</FormField>
|
||||
<FormField label="Критерии оценки работы" htmlFor="EvaluationCriteria" full>
|
||||
<TextArea id="EvaluationCriteria" value={data.EvaluationCriteria} onChange={(v) => set('EvaluationCriteria', v)} />
|
||||
</FormField>
|
||||
<FormField label="Уровень владения ПК и программами" htmlFor="PcSkills" full>
|
||||
<TextArea id="PcSkills" value={data.PcSkills} onChange={(v) => set('PcSkills', v)} />
|
||||
</FormField>
|
||||
<FormField label="Иностранные языки (уровень владения)" htmlFor="ForeignLanguages" full>
|
||||
<TextArea id="ForeignLanguages" value={data.ForeignLanguages} onChange={(v) => set('ForeignLanguages', v)} />
|
||||
</FormField>
|
||||
<FormField label="Проживание" htmlFor="Residence">
|
||||
<TextInput id="Residence" value={data.Residence} onChange={(v) => set('Residence', v)} />
|
||||
</FormField>
|
||||
<FormField label="Водительские права, стаж вождения" htmlFor="DrivingLicense">
|
||||
<TextInput id="DrivingLicense" value={data.DrivingLicense} onChange={(v) => set('DrivingLicense', v)} />
|
||||
</FormField>
|
||||
</CollapseSection>
|
||||
);
|
||||
@@ -0,0 +1,58 @@
|
||||
import { getSP } from '../../shared/pnp/pnpjs';
|
||||
import { IFormData } from './model';
|
||||
|
||||
const LIST_TITLE = 'Заявка на подбор — данные';
|
||||
|
||||
// Поля-люди (один человек): логин → ensureUser → Id в колонку <Field>Id.
|
||||
const PERSON_FIELDS: (keyof IFormData)[] = ['Responsible', 'ProposedMentor', 'DirectManager'];
|
||||
// Поля-люди (несколько): логины → массив Id в колонку <Field>Id.
|
||||
const MULTI_PERSON_FIELDS: (keyof IFormData)[] = ['HiringDecisionMaker'];
|
||||
// Числовые поля: пустая строка → null, иначе Number().
|
||||
const NUMBER_FIELDS: (keyof IFormData)[] = ['DepartmentHeadcount', 'RateProbation', 'RateAfterProbation'];
|
||||
|
||||
/** Логин → числовой Id пользователя на текущем сайте. */
|
||||
async function resolveUserId(login: string): Promise<number> {
|
||||
const ensured = await getSP().web.ensureUser(login); // v4: возвращает ISiteUserInfo с .Id
|
||||
return ensured.Id;
|
||||
}
|
||||
|
||||
/** Записать заявку «на подбор» в список данных SharePoint. */
|
||||
export async function submitRecruitingSelection(data: IFormData): Promise<void> {
|
||||
const sp = getSP();
|
||||
const item: Record<string, unknown> = {};
|
||||
|
||||
// Текст/заметки/выбор/даты/да-нет/числа (людей пропускаем — они ниже).
|
||||
(Object.keys(data) as (keyof IFormData)[]).forEach((key) => {
|
||||
if (PERSON_FIELDS.indexOf(key) !== -1 || MULTI_PERSON_FIELDS.indexOf(key) !== -1) {
|
||||
return;
|
||||
}
|
||||
const value = data[key];
|
||||
if (typeof value === 'boolean') {
|
||||
item[key] = value;
|
||||
} else if (NUMBER_FIELDS.indexOf(key) !== -1) {
|
||||
item[key] = value === '' ? null : Number(value);
|
||||
} else {
|
||||
item[key] = value === '' ? null : value;
|
||||
}
|
||||
});
|
||||
|
||||
// Один человек → <Field>Id.
|
||||
for (let i = 0; i < PERSON_FIELDS.length; i++) {
|
||||
const login = data[PERSON_FIELDS[i]] as string;
|
||||
if (login) {
|
||||
item[`${PERSON_FIELDS[i]}Id`] = await resolveUserId(login);
|
||||
}
|
||||
}
|
||||
|
||||
// Несколько человек → <Field>Id = массив Id.
|
||||
for (let i = 0; i < MULTI_PERSON_FIELDS.length; i++) {
|
||||
const logins = data[MULTI_PERSON_FIELDS[i]] as string[];
|
||||
const ids: number[] = [];
|
||||
for (let j = 0; j < logins.length; j++) {
|
||||
ids.push(await resolveUserId(logins[j]));
|
||||
}
|
||||
item[`${MULTI_PERSON_FIELDS[i]}Id`] = ids;
|
||||
}
|
||||
|
||||
await sp.web.lists.getByTitle(LIST_TITLE).items.add(item);
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
import * as React from 'react';
|
||||
import { IRequestFormProps, RequestTypeId } from '../models/types';
|
||||
|
||||
type FormComponent = React.ComponentType<IRequestFormProps>;
|
||||
|
||||
/**
|
||||
* Реестр форм: id типа заявки → лениво загружаемая форма.
|
||||
* Каждая форма — отдельный чанк (React.lazy): в бандл первого экрана не попадает,
|
||||
* подтягивается только при открытии. Добавить форму = папка + строка здесь.
|
||||
*/
|
||||
const formRegistry: Record<string, React.LazyExoticComponent<FormComponent>> = {
|
||||
'recruiting-selection': React.lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: 'form-recruiting-selection' */ './RecruitingSelection/RecruitingSelectionForm'
|
||||
)
|
||||
),
|
||||
'recruiting-hire': React.lazy(
|
||||
() =>
|
||||
import(/* webpackChunkName: 'form-recruiting-hire' */ './RecruitingHire/RecruitingHireForm')
|
||||
)
|
||||
};
|
||||
|
||||
export function getFormComponent(
|
||||
id: RequestTypeId
|
||||
): React.LazyExoticComponent<FormComponent> | undefined {
|
||||
return formRegistry[id];
|
||||
}
|
||||
Reference in New Issue
Block a user