This commit is contained in:
Андрей Дувакин 2024-10-08 09:26:49 +05:00
parent e7012d697d
commit 66e2f4362d
7 changed files with 167 additions and 85 deletions

View File

@ -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">

View File

@ -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();

View File

@ -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>&times;</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>&times;</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;

View File

@ -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>

View File

@ -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>

View File

@ -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

View File

@ -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>