636 lines
29 KiB
TypeScript
636 lines
29 KiB
TypeScript
import React, { useEffect, useContext, useState, useMemo } from "react";
|
||
import { TaxiOrder_type, TaxiOrder_initial } from '../types/taxiOrderType';
|
||
import { addDays, format } from 'date-fns';
|
||
import { getCsrfToken } from "../../../../../resources/js/services/getCsrfService";
|
||
import { Button, TextInput, Select, Option } from '@SharePoint/rencredit_uikit';
|
||
import FormValidErr, { FormValidErrObject } from "../../../../../resources/js/components/formValidErr/FormValidErr";
|
||
import { PopupContext } from "../../../../../resources/js/contexts/PopupContext";
|
||
import { EntityHistoryProps } from "../../../../../resources/js/components/entityHistory/EntityHistory";
|
||
import { PreloaderContext } from "../../../../../resources/js/contexts/PreloaderContext";
|
||
|
||
//Гаврилов типы для пропсов?
|
||
// export default function TaxiOrder( {rqstId, setPreloaderProp}: {rqstId: number | undefined, setPreloaderProp: CallableFunction} )
|
||
export default function TaxiOrder( {rqstId}: {rqstId: number | undefined} )
|
||
{
|
||
let newDate = new Date('2024-06-05');
|
||
newDate.setHours(0, 0, 0);
|
||
let fakeObjArr: EntityHistoryProps[] = [
|
||
{
|
||
changeAction: 'insert',
|
||
changeAuthor: 'login',
|
||
changeDate: newDate,
|
||
changeDetails: [
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле2',
|
||
propValue: 'значение2'
|
||
}
|
||
]
|
||
},
|
||
{
|
||
changeAction: 'insert',
|
||
changeAuthor: 'login',
|
||
changeDate: new Date('2024-06-05'),
|
||
changeDetails: [
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле2',
|
||
propValue: 'значение2'
|
||
}
|
||
]
|
||
},
|
||
{
|
||
changeAction: 'insert',
|
||
changeAuthor: 'login',
|
||
changeDate: new Date('2024-06-05'),
|
||
changeDetails: [
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле',
|
||
propValue: 'значение'
|
||
},
|
||
{
|
||
propName: 'поле2',
|
||
propValue: 'значение2'
|
||
}
|
||
]
|
||
},
|
||
{
|
||
changeAction: 'update',
|
||
changeAuthor: 'login2',
|
||
changeDate: new Date('2025-06-05'),
|
||
changeDetails: [
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле5',
|
||
propValue: 'значение6'
|
||
}
|
||
]
|
||
},
|
||
{
|
||
changeAction: 'update',
|
||
changeAuthor: 'login2',
|
||
changeDate: new Date('2025-06-05'),
|
||
changeDetails: [
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле3',
|
||
propValue: 'значение4'
|
||
},
|
||
{
|
||
propName: 'поле5',
|
||
propValue: 'значение6'
|
||
}
|
||
]
|
||
}
|
||
];
|
||
|
||
const preloaderContext = useContext(PreloaderContext);
|
||
|
||
//ГАВРИЛОВ ПОСТОЯННЫЙ ПЕРЕРЕНДЕРИНГ СПРОСИТЬ У САШИ. ЭЛЕМЕНТ НЕ МИГАЕТ В КОНСОЛИ, НО ПИШЕТ ПОСТОЯННО ПЕРЕРЕНДЕР
|
||
console.log('🔁 TaxiForm перерендерился!');
|
||
interface UserData {
|
||
emp_id: number,
|
||
emp_address: string,
|
||
emp_lastname: string,
|
||
emp_name: string,
|
||
emp_surname: string,
|
||
emp_login: string | null
|
||
emp_phone: string,
|
||
//Все остальные поля объекта могут быть пустыми
|
||
[key: string]: unknown,
|
||
full_name: string,
|
||
};
|
||
const UserData_initial: UserData = {
|
||
emp_id: 0,
|
||
emp_address: '',
|
||
emp_lastname: '',
|
||
emp_name: '',
|
||
emp_surname: '',
|
||
emp_login: '',
|
||
emp_phone: '',
|
||
full_name: '',
|
||
// _token: getCsrfToken()
|
||
};
|
||
//Проверка загрузки необходимых для начала работ данных. После успешного получения всех данных происходит рендеринг
|
||
const [checkLoad, setCheckLoad] = useState(
|
||
{
|
||
ccEmp: false,
|
||
orderData: false,
|
||
checkEditOrderUserData: false,
|
||
getTimePeriods: false,
|
||
checkOfficeAddress: false,
|
||
}
|
||
);
|
||
const todayDate = new Date();
|
||
//Данные по всем пользователям
|
||
const [ccEmp, setCcEmp] = useState<UserData[]>( [UserData_initial] );
|
||
//Данные по редактируемому запросу (если вызвано редактирование)
|
||
const [orderData, setOrderData] = useState<TaxiOrder_type>(TaxiOrder_initial);
|
||
//Данные по пользователю, чей запрос редактируется (если вызвано редактирование запроса)
|
||
const [editOrderUserData, setEditOrderUserData] = useState<UserData>(UserData_initial);
|
||
//Данные по временным промежуткам
|
||
const [orderTimePeriods, setOrderTimePeriods] = useState< {time_period: string, is_morning_time: number}[] >(
|
||
[ {time_period: '', is_morning_time: 0} ]
|
||
);
|
||
//Массив доступных для заказа такси дат для их дальнейшего преобразования в теги option селекта
|
||
const [dateOrderArr, setDateOrderArr] = useState<string[]>(
|
||
[
|
||
format(todayDate, "yyyy-MM-dd"),
|
||
format(addDays(todayDate, 1), "yyyy-MM-dd")
|
||
]
|
||
);
|
||
const popupContext = useContext(PopupContext);
|
||
useEffect ( () => {
|
||
setFormCreateVisible(true);
|
||
setFormCreateValidObj([{fieldName: 'testField', fieldErrors: ['errOne']}]);
|
||
console.log(popupContext)
|
||
// console.log()
|
||
// setTimeout(() => {
|
||
// popupContext.addPopupArrTest([
|
||
// {message: 'для информации', timeOut: true, type: 'attention'}
|
||
// ])
|
||
// }, 1000);
|
||
// setTimeout(() => {
|
||
// setPopupArrProp([
|
||
// {message: 'для информации', timeOut: true, type: 'attention'},
|
||
// ])
|
||
// }, 1000);
|
||
// setTimeout(() => {
|
||
// setPopupArrProp([
|
||
// {message: 'для информации', timeOut: false, type: 'info'},
|
||
// ])
|
||
// }, 2000);
|
||
// setTimeout(() => {
|
||
// setPopupArrProp([
|
||
// {message: 'для информации', timeOut: false, type: 'info'},
|
||
// ])
|
||
// }, 3000);
|
||
// setPopupArrProp([
|
||
// {message: 'для информации', timeOut: false, type: 'info'},
|
||
// {message: 'успешно', timeOut: true, type: 'success'},
|
||
// {message: 'ошибка', timeOut: true, type: 'error'},
|
||
// {message: 'обратить внимание', timeOut: true, type: 'attention'}
|
||
// ])
|
||
}, [])
|
||
|
||
const [formCreateVisible, setFormCreateVisible] = useState<boolean>(false);
|
||
const [formCreateValidErrObj, setFormCreateValidObj] = useState<FormValidErrObject[]>([{fieldName: null, fieldErrors: []}])
|
||
|
||
//ГАВРИЛОВ ДОБАВИТЬ ВСПЛЫВАЮЩЕЕ ОКНО ЕСЛИ ПРОИСХОДИТ НЕСООТВЕТСТВИЕ ВРЕМЕНИ И ДАТЫ ЗАКАЗА ТАКСИ? А НЕ ПРОСТО УДАЛЯТЬ ЗНАЧЕНИЕ ИЗ СОСЕДНЕГО ПОЛЯ?
|
||
|
||
//Адреса офисов
|
||
const [officeAddressInfo, setOfficeAddressInfo] = useState< {place: string, address: string}[] >(
|
||
[ {place: '', address: ''} ]
|
||
);
|
||
//Адрес офиса, где работает сотрудник. Определяется на этапе выбора логина
|
||
const [empOfficeAddress, setEmpOfficeAddress] = useState<string | null>(null);
|
||
//const [orderTime, setOrderTime] = useState<string|null>(null);
|
||
//const [orderDate, setOrderDate] = useState<string|null>(null);
|
||
// const [orderAddressFrom, setOrderAddressFrom] = useState<string|null>(null);
|
||
// const [orderAddressTo, setOrderAddressTo] = useState<string|null>(null);
|
||
|
||
function gotoHome()
|
||
{
|
||
document.location.href = '/public/taxi/home';
|
||
}
|
||
|
||
//Гаврилов. Не передаешь CSRF токен
|
||
//Отправка заказа на такси
|
||
function sendTaxiOrder ()
|
||
{
|
||
console.log(orderData)
|
||
console.log(editOrderUserData)
|
||
//return
|
||
// setPreloaderProp(true, 'создаем заявку')
|
||
preloaderContext.setPreloaderVisible(true);
|
||
preloaderContext.setPreloaderText('создаем заявку');
|
||
let popupType;
|
||
fetch('/public/api/taxi/' + (rqstId ? `editOrder/${rqstId}` : 'createRqst'), {
|
||
credentials: 'include',
|
||
method: (rqstId ? "PATCH" : "POST"),
|
||
body: JSON.stringify(orderData),
|
||
headers: {
|
||
'content-type': 'application/json',
|
||
'Accept': 'application/json'
|
||
}
|
||
}).then(result => {
|
||
preloaderContext.setPreloaderVisible(false);
|
||
// setPreloaderProp(false)
|
||
result.json().then(jsonResult => {
|
||
console.log(jsonResult)
|
||
if (!result.ok) {
|
||
//ГАВРИЛОВ здесь обработка ошибок валидации формы
|
||
if (result.status == 422) {
|
||
// setPopupArrProp(
|
||
// [
|
||
// //ГАВРИЛОВ обработка ошибки
|
||
// {message: 'Произошла ошибка! Заявка не создана', type: 'error'},
|
||
// ]
|
||
// )
|
||
} else {
|
||
// setPopupArrProp(
|
||
// [
|
||
// //ГАВРИЛОВ обработка ошибки
|
||
// {message: jsonResult.result_msg, type: 'error'},
|
||
// ]
|
||
// )
|
||
}
|
||
popupType = 'error'
|
||
} else {
|
||
popupType = 'success'
|
||
}
|
||
popupContext.addPopupArrTest(
|
||
[
|
||
{message: jsonResult.message, type: popupType},
|
||
]
|
||
)
|
||
})
|
||
})
|
||
}
|
||
|
||
//Функция, собирающая нужный массив для формирования из него списка option для select
|
||
function transformToOptionsFunc <T,>(
|
||
dataArr: T[],
|
||
dataKey?: keyof T
|
||
): Option<string>[] {
|
||
let optionArr = dataArr.map(item => {
|
||
//Без проверки ниже, Typescript ругается на условный атрибут dataKey, который может отсутствовать, но при этом укаан как относящийся к Дженерику
|
||
const value = dataKey !== undefined
|
||
? item[dataKey]
|
||
: item;
|
||
|
||
return {
|
||
caption: String(value),
|
||
value: String(value),
|
||
id: String(value)
|
||
};
|
||
});
|
||
return optionArr;
|
||
}
|
||
|
||
|
||
/**
|
||
* Метод проверки соответствует ли дата и время заказа логике. Наприме, если дата заказа сегодняшняя - нельзя выбрать утренний промежуток времени
|
||
* @param orderTime время заказа такси
|
||
* @param orderDate дата заказа такси
|
||
* @returns результат проверки соответствия даты и времени заказа
|
||
*/
|
||
function checkTimeAndDate (orderTime: string|null, orderDate: string|null): boolean
|
||
{
|
||
// console.log(orderTime)
|
||
// console.log(!orderTime)
|
||
// console.log(orderDate)
|
||
// console.log(!orderDate)
|
||
if (!orderTime || !orderDate) {
|
||
//console.log(1)
|
||
return true;
|
||
}
|
||
let isMorningTimeCheck = orderTimePeriods.filter( e => e.time_period == orderTime )[0].is_morning_time;
|
||
// console.log(isMorningTimeCheck)
|
||
//Если выбранная дата заказа больше текущей - заказ на завтра, можно выбирать любую дату
|
||
if (!(new Date(orderDate) > todayDate)) {
|
||
//console.log(2)
|
||
return !isMorningTimeCheck;
|
||
}
|
||
return true;
|
||
}
|
||
|
||
// const ccEmpList: Option<string>[] = useMemo(() => {
|
||
// return ccEmp.map(empData => {
|
||
// return {
|
||
// caption: empData.emp_login,
|
||
// value: empData.emp_login,
|
||
// id: empData.emp_login
|
||
// }
|
||
// })
|
||
// }, [ccEmp]);
|
||
|
||
// console.log(ccEmpList)
|
||
|
||
|
||
const ccEmpList = useMemo( () => {
|
||
return transformToOptionsFunc(ccEmp, 'emp_login');
|
||
}, [ccEmp]);
|
||
|
||
const orderDateList = useMemo( () => {
|
||
return transformToOptionsFunc(dateOrderArr);
|
||
}, [dateOrderArr]);
|
||
|
||
const orderTimeList = useMemo( () => {
|
||
return transformToOptionsFunc(orderTimePeriods, 'time_period')
|
||
}, [orderTimePeriods]);
|
||
|
||
//Загрузка данных для старта работ
|
||
useEffect ( () => {
|
||
//Получаем информацию по сотруднику при загрузке страницы
|
||
fetch('/public/api/taxi/getEmpInfo', {
|
||
credentials: 'include',
|
||
method: 'GET',
|
||
// headers: new Headers({
|
||
// 'Authorization': `Bearer ${sanctumToken()}`
|
||
// })
|
||
}).then(empInfo_resp => empInfo_resp.json().then(empInfo_json => {
|
||
console.log(empInfo_json)
|
||
console.log(editOrderUserData)
|
||
setCcEmp(empInfo_json);
|
||
setCheckLoad(loadObj => ( {...loadObj, ccEmp: true} ));
|
||
}));
|
||
//Получаем доступные временные промежутки для заказа такси
|
||
fetch('/public/api/taxi/getTimePeriods', {
|
||
method: 'GET',
|
||
credentials: 'include',
|
||
// headers: new Headers({
|
||
// 'Authorization': `Bearer ${sanctumToken()}`
|
||
// })
|
||
}).then(timePeriods_resp => timePeriods_resp.json().then(timePeriods_json => {
|
||
setOrderTimePeriods(timePeriods_json);
|
||
setCheckLoad(loadObj => ( {...loadObj, getTimePeriods: true} ));
|
||
}));
|
||
//ГАВРИЛОВ. ВЕЗДЕ В FETCH ЗАПРОСАХ ПЕРЕХВАТЫВАЙ ОШИБКИ И ВЫВОДИ СООБЩЕНИЯ ОБ ОШИБКЕ. НАПРИМЕМР С 401. В ЭТОМ СЛУЧАЕ НУЖНО ПЕРЕБРАСЫВАТЬ ПОЛЬЗОВАТЕЛЯ НА СТРАНИЦУ АУТЕНТИФИКАЦИИ
|
||
//Получае адреса всех офисов, куда могут заказываться такси?
|
||
fetch('/public/api/taxi/getOfficeAddress', {
|
||
method: 'GET',
|
||
credentials: 'include',
|
||
}).then(officeAddress_resp => {officeAddress_resp.json().then(officeAddress_json => {
|
||
setOfficeAddressInfo(officeAddress_json);
|
||
setCheckLoad(loadObj => ( {...loadObj, checkOfficeAddress: true} ));
|
||
})});
|
||
//Если в пропсах передается rqstId, происходит редактирование заявки, а не создание новой - получаем данные по редактируемой заявке на такси
|
||
if (rqstId) {
|
||
fetch(`/public/api/taxi/getOrderById/${rqstId}`, {
|
||
method: 'GET',
|
||
credentials: 'include',
|
||
// headers: new Headers({
|
||
// 'Authorization': `Bearer ${sanctumToken()}`
|
||
// })
|
||
}).then(orderData_resp => orderData_resp.json().then( orderData_json => {
|
||
console.log(orderData_json)
|
||
setOrderData(orderData_json);
|
||
setCheckLoad(loadObj => ({...loadObj, orderData: true}));
|
||
}));
|
||
}
|
||
}, [])
|
||
|
||
//гаврилов. Нужно ввести объект с данными по запросу и туда класть только нужные данные , а не все параметры пользователя. и тогда не нужно нигде проверять rqstId. Внизу в методе класть в этот объект все нужные параметры
|
||
|
||
useEffect ( () => {
|
||
//Гаврилов. Причем тут проверка логина? Зачем она?
|
||
if (rqstId && orderData.emp_login) {
|
||
//Если передан id запроса на редактирование, устанавливаем значение с данными пользователя редактируемого запроса
|
||
fetch(`/public/api/taxi/getEmpInfo/${orderData.emp_login}`).then(userData_resp => userData_resp.json().then(userData_json => {
|
||
//гаврилов. Вот здесь нужно класть данные в orderData, а также заполнять адрес из и адрес куда
|
||
setEditOrderUserData(userData_json[0]);
|
||
//setOrderData(prevData => ({...prevData, userData_json[0]}));
|
||
//setEmpAddress(editOrderUserData['emp_address']);
|
||
setCheckLoad(loadObj => ( {...loadObj, checkEditOrderUserData: true} ));
|
||
//ГАВРИЛОВ. вынеси в отедльную функцию определение адреса офиса?
|
||
setEmpOfficeAddress(officeAddressInfo.filter(addressInfo => addressInfo.place == userData_json[0].emp_area)[0].address);
|
||
}));
|
||
}
|
||
}, [orderData.emp_login])
|
||
|
||
//Итоговая проверка все ли необходимые данные для рендеринга получены
|
||
const isReady = rqstId ?
|
||
checkLoad.ccEmp && checkLoad.checkEditOrderUserData && checkLoad.orderData && checkLoad.checkOfficeAddress && checkLoad.getTimePeriods
|
||
: checkLoad.ccEmp;
|
||
|
||
//Регулировка видимости прелоадера в зависимости от того все ли данные для рендеринга получены или нет
|
||
useEffect ( () => {
|
||
//isReady ? setPreloaderProp(false) : setPreloaderProp(true);
|
||
isReady ? preloaderContext.setPreloaderVisible(false) : preloaderContext.setPreloaderVisible(true);
|
||
}, [isReady])
|
||
|
||
if (!isReady) {
|
||
return;
|
||
}
|
||
|
||
return (
|
||
<div id = "taxi__order-create">
|
||
{/* <EntityHistory
|
||
entityId={1}
|
||
entityProps= {fakeObjArr}
|
||
/> */}
|
||
<div className = "order-create__btn-block">
|
||
<Button
|
||
type = 'button'
|
||
onClick = {gotoHome}
|
||
text = 'Домой'
|
||
ui = 'secondary'
|
||
/>
|
||
</div>
|
||
<h2>{rqstId ? 'Редактирование' : 'Создание'} заявки на такси</h2>
|
||
<div className="form-container form-container--medium-size form-containter--left-pos">
|
||
{/* <FormValidErr
|
||
visible = {formCreateVisible}
|
||
validErrorsObj = {formCreateValidErrObj}
|
||
/> */}
|
||
<form>
|
||
{/* ГАВРИЛОВ как защищаешься от csrf если комментируешь поле ниже? */}
|
||
{/* <input
|
||
type="hidden"
|
||
name="_token"
|
||
value={getCsrfToken()}
|
||
/> */}
|
||
<div className="form__field-block">
|
||
<Select
|
||
//ГАВРИЛОВ. ПЕРЕПИШИ НА ОПРЕДЕЛЕНИЕ НАЗВАНИЯ ПОЛЯ, СОГЛАСНО TaxiOrder_fieldName ИЗ TAXIORDERTYPE
|
||
labelText = 'Дата заказа'
|
||
options = {orderDateList}
|
||
//Гаврилов. Может где-то сверху нужно класть в объект с данными формы данные из orderData (если она есть) .тогда не нужно проверять props.rqstId ?
|
||
value = {orderData.taxi_date ? orderDateList.find(dateData => dateData.value === orderData.taxi_date) : null}
|
||
size = 'm'
|
||
onChange = {
|
||
(_, sel:{caption:string, id:string, value:string} ) => {
|
||
let selOrderDate: string|null = (sel ? sel.value : null);
|
||
//setEditOrderUserData(prevData => ({...prevData, taxi_date: selOrderDate}));
|
||
setOrderData(prevData => ( {...prevData, taxi_date: selOrderDate} ));
|
||
//Если проверка соответствия времени и даты заказа не выполняется, сбрасываем время.
|
||
// if (!checkTimeAndDate(orderData.taxi_time, selOrderDate)) {
|
||
popupContext.addPopupArrTest( [{message: 'Несоответствие времени и даты', type: 'error'}] )
|
||
// setOrderData(prevData => ( {...prevData, taxi_time: null} ));
|
||
// }
|
||
}}
|
||
/>
|
||
</div>
|
||
<div className="form__field-block">
|
||
<Select
|
||
labelText = "Время заказа"
|
||
options = {orderTimeList}
|
||
value = {orderData.taxi_time ? orderTimeList.find(dateData => dateData.value === orderData.taxi_time) : null}
|
||
size = 'm'
|
||
onChange = {(_, sel:{caption:string, id:string, value:string}) => {
|
||
let selOrderTime = (sel ? sel.value : null);
|
||
setOrderData(prevData => ( {...prevData, taxi_time: selOrderTime} ));
|
||
//Проверяем относится ли выбранный промежуток времени заказа к утру или нет. Если выбран утренний промежуток, дата откуда - адрес сотрудника, адрес куда - офис, если выбран вечерний промежуток - наоборот
|
||
if (orderTimePeriods.filter( e => selOrderTime == e.time_period )[0].is_morning_time == 1) {
|
||
console.log(1)
|
||
setOrderData(prevData => ( {...prevData, taxi_address_from: editOrderUserData.emp_address, taxi_address_to: empOfficeAddress} ));
|
||
} else {
|
||
console.log(2)
|
||
console.log(empOfficeAddress)
|
||
setOrderData(prevData => ( {...prevData, taxi_address_from: empOfficeAddress, taxi_address_to: editOrderUserData.emp_address} ));
|
||
}
|
||
//Если проверка соответствия и времени заказа не выполняется, сбрасываем дату
|
||
if (!checkTimeAndDate(selOrderTime, orderData.taxi_date)) {
|
||
popupContext.addPopupArrTest(
|
||
[{message: 'Несоответствие времени и даты', type: 'error'}]
|
||
)
|
||
setOrderData(prevData => ({...prevData, taxi_date: null}));
|
||
}
|
||
}}
|
||
/>
|
||
</div>
|
||
<div className="form__field-block">
|
||
<Select
|
||
labelText = 'Логин сотрудника'
|
||
options = {ccEmpList}
|
||
value = {orderData.emp_login}
|
||
size = 'm'
|
||
//В компоненте Select значение "выбранного" option помещается во второй аргумент onChange
|
||
onChange = { (_, sel:{caption:string, id:string, value:string}) => {
|
||
if (sel) {
|
||
let empData = ccEmp.filter(empData => {return empData.emp_login == sel.value})[0];
|
||
//При создании нового запроса, на этом действии время и дата могут быть уже записаны в объект editOrderUserData, но при выборе нового логина, если передать в сеттер setEditOrderUserData только объект empData, он перезапишет значения времени и даты, поэтому конкатенируем объект, отдавая приоритет при замене дублирующих значений empData (правый объект перезапишет левый)
|
||
setEditOrderUserData( {...editOrderUserData, ...empData} );
|
||
setOrderData(prevData => ({...prevData, emp_login: sel.value, emp_phone: empData.emp_phone}));
|
||
//Гаврилов. Если площадка РКЦ - выводить ошибку? Так как у этой площадки нет адреса офиса
|
||
//ГАВРИЛОВ. ВЫНЕСИ ОПРЕДЕЛЕНИЕ АДРЕСА В ОТДЕЛЬНУЮ ФУНКЦИЮ?
|
||
let officeAddress: string | null = empData.emp_area == 'РКЦ' ? null : officeAddressInfo.filter(addressInfo => addressInfo.place == empData.emp_area)[0].address;
|
||
setEmpOfficeAddress(officeAddress);
|
||
setOrderData(prevData => {
|
||
let setAddressTo: string|null, setAddressFrom: string|null;
|
||
//Если время выставлено в форме
|
||
if (orderData.taxi_time) {
|
||
//Проверяем относится ли выбранный промежуток времени заказа к утру или нет. Если выбран утренний промежуток, дата откуда - адрес сотрудника, адрес куда - офис, если выбран вечерний промежуток - наоборот
|
||
if (orderTimePeriods.filter( e => orderData.taxi_time == e.time_period )[0].is_morning_time == 1) {
|
||
setAddressTo = officeAddress;
|
||
setAddressFrom = empData.emp_address;
|
||
} else {
|
||
setAddressTo = empData.emp_address;
|
||
setAddressFrom = officeAddress;
|
||
}
|
||
//Если время заказа не выбрано, сбрасываем дату откуда и дату куда
|
||
} else {
|
||
setAddressTo = null;
|
||
setAddressFrom = null;
|
||
}
|
||
return {...prevData, taxi_address_from: setAddressFrom, taxi_address_to: setAddressTo};
|
||
});
|
||
} else {
|
||
setOrderData(prevData => ({...prevData, emp_login: null, emp_phone: null}));
|
||
setEditOrderUserData(UserData_initial);
|
||
setEmpOfficeAddress(null);
|
||
setOrderData(prevData => ({...prevData, taxi_address_from: null, taxi_address_to: null}));
|
||
}
|
||
} }
|
||
//При редактировании существующего запроса нельзя менять выбранный логин сотрудника для заказа
|
||
disabled = {rqstId ? true : false}
|
||
/>
|
||
</div>
|
||
<div className="form__field-block">
|
||
<TextInput
|
||
labelText = 'ФИО'
|
||
value = {editOrderUserData.full_name}
|
||
disabled = {true}
|
||
/>
|
||
</div>
|
||
<div className="form__field-block">
|
||
<TextInput
|
||
labelText = 'Мобильный номер телефона'
|
||
value = {orderData.emp_phone}
|
||
onChange = {(e: string) => {
|
||
setOrderData(prevData => ({...prevData, emp_phone: e}));
|
||
}}
|
||
/>
|
||
</div>
|
||
<div className="form__field-block">
|
||
<TextInput
|
||
labelText = 'Адрес (откуда)'
|
||
value = {
|
||
//Если в пропсы передается id запроса, проставляем значение из параметров имеющегося запроса. В противном случае определяем является ли выбранный временной промежуток утренним. Если да - прописываем, что едем из адреса сотрудника, в противном случае - из офиса
|
||
//Гаврилов. Будет ли при редактировании уже созданного запроса, работать смена адресов при изменении времени запроса? Или всегда будет искаться props.rqstId и логика будет исходить из этого?
|
||
orderData.taxi_address_from
|
||
}
|
||
onChange = { (e: string) => {
|
||
setOrderData(prevData => ({...prevData, taxi_address_from: e}));
|
||
}}
|
||
/>
|
||
</div>
|
||
<div className = "form__field-block">
|
||
<TextInput
|
||
labelText = 'Адрес (куда)'
|
||
value = {orderData.taxi_address_to}
|
||
onChange = {(e: string) => {
|
||
setOrderData(prevData => ({...prevData, taxi_address_to: e}));
|
||
}}
|
||
/>
|
||
</div>
|
||
<div className = "order-create__btn-block">
|
||
<Button
|
||
type = 'button'
|
||
onClick = {sendTaxiOrder}
|
||
text = 'Отправить'
|
||
/>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|