._.
This commit is contained in:
parent
e7012d697d
commit
66e2f4362d
@ -2,7 +2,7 @@
|
|||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<title>Логистика</title>
|
<title>Logistics service</title>
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
||||||
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
||||||
|
|||||||
@ -4,6 +4,12 @@ import { useNavigate } from "react-router-dom";
|
|||||||
import polyline from "@mapbox/polyline";
|
import polyline from "@mapbox/polyline";
|
||||||
import "./DeliveryOrdersList.css";
|
import "./DeliveryOrdersList.css";
|
||||||
|
|
||||||
|
const DELIVERY_CITY = {
|
||||||
|
name: "Челябинск",
|
||||||
|
latitude: 55.159902,
|
||||||
|
longitude: 61.402554,
|
||||||
|
};
|
||||||
|
|
||||||
const DeliveryOrdersList = ({
|
const DeliveryOrdersList = ({
|
||||||
totalOrderId,
|
totalOrderId,
|
||||||
onSubOrderClick,
|
onSubOrderClick,
|
||||||
@ -50,6 +56,66 @@ const DeliveryOrdersList = ({
|
|||||||
await Promise.all(
|
await Promise.all(
|
||||||
ordersToCalculate.map(async (order) => {
|
ordersToCalculate.map(async (order) => {
|
||||||
try {
|
try {
|
||||||
|
// const deliveryOrderDetails = await getDeliveryOrderDetails(order.id);
|
||||||
|
|
||||||
|
// const coords = await Promise.all(
|
||||||
|
// accessories.map(async (accessory) => {
|
||||||
|
// if (accessory.latitude && accessory.longitude) {
|
||||||
|
// return {
|
||||||
|
// city: accessory.city_name,
|
||||||
|
// latitude: accessory.latitude,
|
||||||
|
// longitude: accessory.longitude,
|
||||||
|
// accessory_name:
|
||||||
|
// accessory.accessory_name +
|
||||||
|
// Math.round(
|
||||||
|
// (accessory.accessory_volume * accessory.count) / 100
|
||||||
|
// ) +
|
||||||
|
// "шт.",
|
||||||
|
// };
|
||||||
|
// } else {
|
||||||
|
// const coords = await getCoordinates(accessory.city_name);
|
||||||
|
// return {
|
||||||
|
// city: accessory.city_name,
|
||||||
|
// accessory_name:
|
||||||
|
// accessory.accessory_name +
|
||||||
|
// ": " +
|
||||||
|
// Math.round(
|
||||||
|
// (accessory.accessory_volume * accessory.count) / 100
|
||||||
|
// ) +
|
||||||
|
// "шт.",
|
||||||
|
// ...coords,
|
||||||
|
// };
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
// );
|
||||||
|
|
||||||
|
// if (fullCoordinates.length > 1) {
|
||||||
|
// const waypoints = fullCoordinates
|
||||||
|
// .map(({ longitude, latitude }) => `${longitude},${latitude}`)
|
||||||
|
// .join(";");
|
||||||
|
|
||||||
|
// const routeUrl = `https://router.project-osrm.org/route/v1/driving/${waypoints}?overview=full`;
|
||||||
|
|
||||||
|
// const response = await fetch(routeUrl);
|
||||||
|
// const data = await response.json();
|
||||||
|
|
||||||
|
// if (data.routes && data.routes.length > 0) {
|
||||||
|
// const geometry = data.routes[0].geometry;
|
||||||
|
// const decodedRoute = polyline.decode(geometry);
|
||||||
|
// setRoute(decodedRoute);
|
||||||
|
// const duration = data.routes[0].duration;
|
||||||
|
// setOrderDuration(duration);
|
||||||
|
|
||||||
|
// await updateDeliveryOrderRoute(
|
||||||
|
// order.id,
|
||||||
|
// duration / 60,
|
||||||
|
// decodedRoute
|
||||||
|
// );
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// const fullCoordinates = [...coords, DELIVERY_CITY];
|
||||||
|
|
||||||
const routeUrl = `https://router.project-osrm.org/route/v1/driving/${order.start_longitude},${order.start_latitude};${order.end_longitude},${order.end_latitude}?overview=full`;
|
const routeUrl = `https://router.project-osrm.org/route/v1/driving/${order.start_longitude},${order.start_latitude};${order.end_longitude},${order.end_latitude}?overview=full`;
|
||||||
const response = await fetch(routeUrl);
|
const response = await fetch(routeUrl);
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
|
|||||||
@ -1,71 +1,78 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from "react";
|
||||||
import './Dialog.css';
|
import "./Dialog.css";
|
||||||
|
|
||||||
const SelectionDialog = ({ show, handleClose, items, columns, onSelect }) => {
|
const SelectionDialog = ({ show, handleClose, items, columns, onSelect }) => {
|
||||||
const [searchTerm, setSearchTerm] = useState('');
|
const [searchTerm, setSearchTerm] = useState("");
|
||||||
const [filteredItems, setFilteredItems] = useState(items);
|
const [filteredItems, setFilteredItems] = useState(items);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setFilteredItems(
|
setFilteredItems(
|
||||||
items.filter(item =>
|
items.filter((item) =>
|
||||||
columns.some(column =>
|
columns.some((column) =>
|
||||||
item[column.key].toString().toLowerCase().includes(searchTerm.toLowerCase())
|
item[column.key]
|
||||||
)
|
.toString()
|
||||||
)
|
.toLowerCase()
|
||||||
);
|
.includes(searchTerm.toLowerCase())
|
||||||
}, [searchTerm, items, columns]);
|
)
|
||||||
|
)
|
||||||
if (!show) return null;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="modal-backdrop fade show"></div>
|
|
||||||
<div className="modal show d-block" tabIndex="-1">
|
|
||||||
<div className="modal-dialog">
|
|
||||||
<div className="modal-content">
|
|
||||||
<div className="modal-header">
|
|
||||||
<h5 className="modal-title">Выбор</h5>
|
|
||||||
<button type="button" className="close" onClick={handleClose}>
|
|
||||||
<span>×</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div className="modal-body">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
className="form-control mb-3"
|
|
||||||
placeholder="Поиск..."
|
|
||||||
value={searchTerm}
|
|
||||||
onChange={(e) => setSearchTerm(e.target.value)}
|
|
||||||
/>
|
|
||||||
<table className="table table-bordered">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
{columns.map(column => (
|
|
||||||
<th key={column.key}>{column.label}</th>
|
|
||||||
))}
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
{filteredItems.map(item => (
|
|
||||||
<tr key={item.id} onClick={() => onSelect(item)}>
|
|
||||||
{columns.map(column => (
|
|
||||||
<td key={column.key}>{item[column.key]}</td>
|
|
||||||
))}
|
|
||||||
</tr>
|
|
||||||
))}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<div className="modal-footer">
|
|
||||||
<button type="button" className="btn btn-secondary" onClick={handleClose}>
|
|
||||||
Закрыть
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
);
|
||||||
|
}, [searchTerm, items, columns]);
|
||||||
|
|
||||||
|
if (!show) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="modal-backdrop fade show"></div>
|
||||||
|
<div className="modal show d-block" tabIndex="-1">
|
||||||
|
<div className="modal-dialog">
|
||||||
|
<div className="modal-content">
|
||||||
|
<div className="modal-header">
|
||||||
|
<h5 className="modal-title">Выбор</h5>
|
||||||
|
<button type="button" className="close" onClick={handleClose}>
|
||||||
|
<span>×</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div className="modal-body">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
className="form-control mb-3"
|
||||||
|
placeholder="Поиск..."
|
||||||
|
value={searchTerm}
|
||||||
|
onChange={(e) => setSearchTerm(e.target.value)}
|
||||||
|
/>
|
||||||
|
<table className="table table-bordered">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
{columns.map((column) => (
|
||||||
|
<th key={column.key}>{column.label}</th>
|
||||||
|
))}
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{filteredItems.map((item) => (
|
||||||
|
<tr key={item.id} onClick={() => onSelect(item)}>
|
||||||
|
{columns.map((column) => (
|
||||||
|
<td key={column.key}>{item[column.key]}</td>
|
||||||
|
))}
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div className="modal-footer">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className="btn btn-secondary"
|
||||||
|
onClick={handleClose}
|
||||||
|
>
|
||||||
|
Закрыть
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default SelectionDialog;
|
export default SelectionDialog;
|
||||||
|
|||||||
@ -83,7 +83,10 @@ const Accessories = () => {
|
|||||||
fetchAccessories();
|
fetchAccessories();
|
||||||
resetForm();
|
resetForm();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("Ошибка при добавлении или обновлении комплектующих:", error);
|
console.error(
|
||||||
|
"Ошибка при добавлении или обновлении комплектующих:",
|
||||||
|
error
|
||||||
|
);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -151,15 +154,16 @@ const Accessories = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="form-group">
|
<div className="form-group">
|
||||||
<label htmlFor="accessoryVolume">Количество</label>
|
<label htmlFor="accessoryVolume">Количество роботов</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="form-control"
|
className="form-control"
|
||||||
id="accessoryCount"
|
id="accessoryCount"
|
||||||
name="count"
|
name="count"
|
||||||
placeholder="Введите количество"
|
placeholder="Введите количество роботов"
|
||||||
value={newAccessory.count}
|
value={newAccessory.count}
|
||||||
onChange={handleInputChange}
|
onChange={handleInputChange}
|
||||||
|
min={1}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="form-group">
|
<div className="form-group">
|
||||||
@ -172,28 +176,30 @@ const Accessories = () => {
|
|||||||
placeholder="Введите объем"
|
placeholder="Введите объем"
|
||||||
value={newAccessory.volume}
|
value={newAccessory.volume}
|
||||||
onChange={handleInputChange}
|
onChange={handleInputChange}
|
||||||
|
min={1}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="form-group">
|
<div className="form-group">
|
||||||
<label htmlFor="accessoryWeight">Вес</label>
|
<label htmlFor="accessoryWeight">Вес, кг.</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="form-control"
|
className="form-control"
|
||||||
id="accessoryWeight"
|
id="accessoryWeight"
|
||||||
name="weight"
|
name="weight"
|
||||||
placeholder="Введите вес"
|
placeholder="Введите вес в килограммах"
|
||||||
value={newAccessory.weight}
|
value={newAccessory.weight}
|
||||||
onChange={handleInputChange}
|
onChange={handleInputChange}
|
||||||
|
min={1}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="form-group mb-3">
|
<div className="form-group mb-3">
|
||||||
<label htmlFor="accessoryPeriod">Период</label>
|
<label htmlFor="accessoryPeriod">Период в днях</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="form-control"
|
className="form-control"
|
||||||
id="accessoryPeriod"
|
id="accessoryPeriod"
|
||||||
name="period"
|
name="period"
|
||||||
placeholder="Введите период"
|
placeholder="Введите период в днях"
|
||||||
value={newAccessory.period}
|
value={newAccessory.period}
|
||||||
onChange={handleInputChange}
|
onChange={handleInputChange}
|
||||||
/>
|
/>
|
||||||
@ -244,10 +250,10 @@ const Accessories = () => {
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Название</th>
|
<th>Название</th>
|
||||||
<th>Количество</th>
|
<th>Количество роботов</th>
|
||||||
<th>Объем</th>
|
<th>Объем</th>
|
||||||
<th>Вес</th>
|
<th>Вес, кг</th>
|
||||||
<th>Период</th>
|
<th>Период, дни</th>
|
||||||
<th>Город</th>
|
<th>Город</th>
|
||||||
<th>Действия</th>
|
<th>Действия</th>
|
||||||
</tr>
|
</tr>
|
||||||
|
|||||||
@ -194,7 +194,7 @@ const Cities = () => {
|
|||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
className="form-control"
|
className="form-control"
|
||||||
placeholder="X координата"
|
placeholder="X-координата"
|
||||||
value={newCity.x_coordinate || ""}
|
value={newCity.x_coordinate || ""}
|
||||||
readOnly
|
readOnly
|
||||||
/>
|
/>
|
||||||
@ -204,7 +204,7 @@ const Cities = () => {
|
|||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
className="form-control"
|
className="form-control"
|
||||||
placeholder="Y координата"
|
placeholder="Y-координата"
|
||||||
value={newCity.y_coordinate || ""}
|
value={newCity.y_coordinate || ""}
|
||||||
readOnly
|
readOnly
|
||||||
/>
|
/>
|
||||||
@ -249,8 +249,8 @@ const Cities = () => {
|
|||||||
<tr>
|
<tr>
|
||||||
<th>Название</th>
|
<th>Название</th>
|
||||||
<th>Федеральный округ</th>
|
<th>Федеральный округ</th>
|
||||||
<th>X координата</th>
|
<th>X-координата</th>
|
||||||
<th>Y координата</th>
|
<th>Y-координата</th>
|
||||||
<th>Действия</th>
|
<th>Действия</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
|
|||||||
@ -190,8 +190,8 @@ const DeliveryOrderDetails = () => {
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col">Общая стоимость</th>
|
<th scope="col">Общая стоимость</th>
|
||||||
<th scope="col">Тип машины</th>
|
<th scope="col">Тип транспортного средства</th>
|
||||||
<th scope="col">Количество машин</th>
|
<th scope="col">Количество транспортных средств</th>
|
||||||
<th scope="col">Прогнозируемое время этапа</th>
|
<th scope="col">Прогнозируемое время этапа</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
@ -201,6 +201,7 @@ const DeliveryOrderDetails = () => {
|
|||||||
<td>
|
<td>
|
||||||
{truckName}
|
{truckName}
|
||||||
<br />
|
<br />
|
||||||
|
<br />
|
||||||
Грузоподъемность: {truckCapacity}кг
|
Грузоподъемность: {truckCapacity}кг
|
||||||
</td>
|
</td>
|
||||||
<td>{truckCount}</td>
|
<td>{truckCount}</td>
|
||||||
@ -228,9 +229,9 @@ const DeliveryOrderDetails = () => {
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col">Город</th>
|
<th scope="col">Город</th>
|
||||||
<th scope="col">Комплектующее</th>
|
<th scope="col">Комплектующие</th>
|
||||||
<th scope="col">Количество, шт.</th>
|
<th scope="col">Количество, шт.</th>
|
||||||
<th scope="col">Объем, м^3</th>
|
<th scope="col">Объем, куб. м</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@ -253,6 +254,8 @@ const DeliveryOrderDetails = () => {
|
|||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
<h2 style={{ textAlign: "center" }}>Схема маршрута</h2>
|
||||||
|
|
||||||
{coordinates.length > 0 && (
|
{coordinates.length > 0 && (
|
||||||
<div className="map-container">
|
<div className="map-container">
|
||||||
<MapContainer
|
<MapContainer
|
||||||
|
|||||||
@ -156,8 +156,8 @@ const Trucks = () => {
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Название</th>
|
<th>Название</th>
|
||||||
<th>Грузоподъемность</th>
|
<th>Грузоподъемность, кг</th>
|
||||||
<th>Объем</th>
|
<th>Объем, куб. м</th>
|
||||||
<th>Действия</th>
|
<th>Действия</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user