|*_*|

demo/src/main/java/com/example/demo/supply/Order/OrderController.java

@@ -1,5 +1,6 @@
 package com.example.demo.supply.Order;
 
+import com.example.demo.supply.Product.ProductDto;
 import org.springframework.web.bind.annotation.*;
 
 import java.util.List;
@@ -24,18 +25,23 @@ public class OrderController {
         return orderService.findAllOrders().stream().map(OrderDto::new).toList();
     }
 
+    @GetMapping("/getProducts/{id}")
+    public List<ProductDto> getOrderProducts(@PathVariable Long id) {
+        return orderService.findAllOrderProducts(id).stream().map(ProductDto::new).toList();
+    }
+
     @PostMapping("/")
     public OrderDto createOrder(@RequestParam() Long supplierId) {
         return new OrderDto(orderService.addOrder(supplierId));
     }
 
-    @PatchMapping("/addProduct/{id}/")
+    @PatchMapping("/addProduct/{id}")
     public OrderDto addProduct(@PathVariable Long id,
                                @RequestParam() Long productId){
         return new OrderDto(orderService.addProduct(id, productId));
     }
 
-    @PatchMapping("/removeProduct/{id}/")
+    @PatchMapping("/removeProduct/{id}")
     public OrderDto removeProduct(@PathVariable Long id,
                                @RequestParam() Long productId){
         return new OrderDto(orderService.removeProduct(id, productId));

demo/src/main/java/com/example/demo/supply/Order/OrderRepository.java

@@ -1,6 +1,10 @@
 package com.example.demo.supply.Order;
 
+import com.example.demo.supply.Product.Product;
 import org.springframework.data.jpa.repository.JpaRepository;
+import org.springframework.data.jpa.repository.Query;
+
+import java.util.List;
 
 public interface OrderRepository extends JpaRepository<_Order, Long> {
 }

demo/src/main/java/com/example/demo/supply/Order/OrderService.java

@@ -1,5 +1,6 @@
 package com.example.demo.supply.Order;
 
+import com.example.demo.supply.Product.Product;
 import com.example.demo.supply.Product.ProductService;
 import com.example.demo.supply.Supplier.SupplierService;
 import org.springframework.stereotype.Service;
@@ -64,6 +65,12 @@ public class OrderService {
         return orderRepository.findAll();
     }
 
+    @Transactional(readOnly = true)
+    public List<Product> findAllOrderProducts(Long orderId) {
+        final Optional<_Order> order = orderRepository.findById(orderId);
+        return order.orElseThrow(() -> new OrderNotFoundException(orderId)).getProducts();
+    }
+
     @Transactional
     public _Order deleteOrder(Long id) {
         final _Order currentOrder = findOrder(id);

front/src/DataService.js

@@ -12,6 +12,7 @@ function getFullUrl(url, data) {
         if (field === 'date') continue
         if (field === 'countProducts') continue
         if (field === 'products') continue
+        if (field === 'supplierName') continue
         currentUrl.searchParams.append(field, data[field])
     }
 
@@ -39,7 +40,7 @@ export default class DataService {
     }
 
     static async create(url, data) {
-        console.log(data)
+        //console.log(data)
         await fetch(getFullUrl(this.mainUrl + url, data), {
           method: 'POST',
         }).catch(e => console.log(e))  

front/src/Pages/CreateOrderPage.jsx

@@ -1,4 +1,5 @@
 import { React, useState, useEffect } from "react";
+import { Link } from 'react-router-dom';
 import Supplier from "../models/Supplier";
 import DataService from "../DataService";
 import Order from "../models/Order";
@@ -11,6 +12,8 @@ export default function CreateOrderPage(props){
     const supplierUrl = 'supplier/'
     const productUrl = 'product/'
 
+    let orderProductsArr = []
+
     const headers = [
         { name: 'name', label: 'Продукт' },
         { name: 'cost', label: 'Цена' }
@@ -23,50 +26,65 @@ export default function CreateOrderPage(props){
     const [suppliers, setSuppliers] = useState([])
     const [products, setProducts] = useState([])
 
-    const [productsOrder, setProductsOrder] = useState([])
+    const [order, setOrder] = useState(new Order())
+    const [addsProduct, setAddsProduct] = useState(new Product())
+
+    const [orderProducts, setOrderProducts] = useState([])
 
     const [modalHeader, setModalHeader] = useState('')
     const [modalConfirm, setModalConfirm] = useState('')
     const [modalVisible, setModalVisible] = useState(false)
 
+    const [isAddProd, setIsAddProd] = useState(false)
+    const [isAddSupplier, setIsAddSupplier] = useState(false)
+
     useEffect(() => {
         loadItems()
         //eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
 
     const loadItems = () => {
-        // DataService.getOrders(url).then(data => {
-        //     console.log(data)
-        //     setOrders([])
-        //     data.map(order => {
-        //         setOrders(prevState => [...prevState, new Order(order)])
-        //     })
-        // })
-
         DataService.readAll(supplierUrl, transformerSupplier).then(data => setSuppliers(data))
         DataService.readAll(productUrl, transformerProduct).then(data => setProducts(data))
     }
 
-    const saveItems = () => {
+    const createOrder = () => {
-        console.log("saveItems")
+       // console.log(order)
+        DataService.create(url, order)
         
+
+    }
+
+    const addProductInOrder = () => {
+        DataService.read(`${productUrl}${addsProduct.id}`, transformerProduct)
+        .then(data => {
+            order.products.push(data)
+            setOrder({ ...order, products: order.products })
+        })
     }
 
     const handleFormChange = (event) => {
-        //console.log([event.target.id].event.target.value)
+        setOrder({ ...order, [event.target.id]: event.target.value })
-        // console.log(currOrder)
+    }
-        // setData({ ...data, [event.target.id]: event.target.value })
+
-        // console.log(data)
+    const handleAddProduct = (event) => {
+        setAddsProduct({ ...addsProduct, [event.target.id]: event.target.value })
     }
 
     const addProduct = () => {
+        console.log(addsProduct)
+        setAddsProduct(new Product())
+        console.log(addsProduct)
+        setIsAddProd(true)
         setModalHeader('Добавление продукта');
         setModalConfirm('Добавить');
         setModalVisible(true);
     }
 
     const hideModal = () => setModalVisible(false)
-    const modalDone = () => saveItems()
+    const modalDone = () => {
+        
+    }
     const ds = () => console.log("")
 
     return(
@@ -77,15 +95,18 @@ export default function CreateOrderPage(props){
 
             <div className="row gx-5">
                 <div className="btn-group" role="group" aria-label="Basic mixed styles example">
-                  <button type="button" className="btn btn-success">Создать</button>
+                    <Link to="/orders">
+                        <button type="button" className="btn btn-success" onClick={createOrder}>Создать</button>
                         <button type="button" className="btn btn-danger">Отмена</button>
+                    </Link>
+
                 </div>
             </div>
             <br></br>
             <div className="mb-3">
                 <p className="h4" htmlFor="supplierId">Поставщик</p>
                 <select id="supplierId" className="form-select " required
-                    onChange={handleFormChange}>
+                    value={order.supplierId} onChange={handleFormChange}>
                     <option disabled value="">Укажите поставщика</option>
                     {
                         suppliers.map(supplier => 
@@ -97,12 +118,12 @@ export default function CreateOrderPage(props){
             <p className="h4">Продукты</p>
             <div className="btn-group" role="group" aria-label="Basic mixed styles example">
                 <button type="button" className="btn btn-success" onClick={addProduct}>Добавить продукт</button>
-                <button type="button" className="btn btn-danger">Удалить продукт</button>
+                <button type="button" className="btn btn-danger" >Удалить продукт</button>
             </div>
             
             <Table 
             headers={headers} 
-            items={productsOrder}
+            items={order.products}
             selectable={true}
             onClick={ds}
             onDblClick={ds}/>
@@ -112,11 +133,11 @@ export default function CreateOrderPage(props){
                 confirm={modalConfirm}
                 visible={modalVisible} 
                 onHide={hideModal}
-                onDone={modalDone}>
+                onDone={addProductInOrder}>
                     <div className="mb-3">
-                        <p className="h4" htmlFor="product">Продукт</p>
+                        <p className="h4" htmlFor="id">Продукт</p>
-                        <select id="product" className="form-select " required
+                        <select id="id" className="form-select " required
-                            onChange={handleFormChange}>
+                            value={addsProduct.id} onChange={handleAddProduct}>
                             <option disabled value="">Укажите продукт</option>
                             {
                                 products.map(product => 

front/src/Pages/OrdersPage.jsx

@@ -1,8 +1,6 @@
-import { Link } from 'react-router-dom';
 import { React, useState, useEffect } from "react";
 import Table from "../general/Table";
 import ToolBar from "../general/ToolBar";
-import Modal from "../general/Modal";
 import DataService from "../DataService";
 import Order from "../models/Order";
 import Product from "../models/Product";
@@ -10,8 +8,6 @@ import Supplier from "../models/Supplier";
 
 export default function OrderPage(){
     const url = 'order/'
-    const supplierUrl = 'supplier/'
-    const productUrl = 'product/'
 
     const transformer = (data) => new Order(data)
     const transformerSupplier = (data) => new Product(data)
@@ -20,18 +16,7 @@ export default function OrderPage(){
     const [orders, setOrders] = useState([])
     const [currOrder, setCurrOrder] = useState('')
 
-    const[suppliers, setSuppliers] = useState([])
-    const[supplier, setSupplier] = useState('')
-
-    const [products, setProducts] = useState([])
-
-    const [modalHeader, setModalHeader] = useState('')
-    const [modalConfirm, setModalConfirm] = useState('')
-    const [modalVisible, setModalVisible] = useState(false)
-    const [isAddProd, setIsAddProd] = useState(false)
-
     const [isEdit, setEdit] = useState(false)
-    const [addProdVisible, setAddProdVisible] = useState(false)
     
     const headers = [
         { name: 'date', label: 'Дата заказа' },
@@ -48,15 +33,12 @@ export default function OrderPage(){
 
     const loadItems = () => {
         DataService.getOrders(url).then(data => {
-            console.log(data)
+            //console.log(data)
             setOrders([])
             data.map(order => {
                 setOrders(prevState => [...prevState, new Order(order)])
             })
         })
-
-        DataService.readAll(supplierUrl, transformerSupplier).then(data => setSuppliers(data))
-        DataService.readAll(productUrl, transformerProduct).then(data => setProducts(data))
     }
 
     const add = () =>{
@@ -68,44 +50,24 @@ export default function OrderPage(){
     }
 
     const remove = () =>{
-
-    }
-
-    const addProduct = () =>{
         if (selectedItems.length === 0) 
             return
 
-        DataService.read(url + selectedItems[0], transformer)
+        if (window.confirm('Удалить выбранные элементы?')) {
-        .then(data => {
+            const promises = [];
-
+            selectedItems.forEach(item => {
-
+                promises.push(DataService.delete(url + item));
-
+            });
-            setEdit(false)
+            Promise.all(promises).then(results => {
-            setAddProdVisible(true)
+                selectedItems.length = 0;
-            setModalHeader('Добавление продукта к заказу')
+                loadItems();
-            setModalConfirm('Сохранить')
-            edit(data)
             });
         }
-
-    const removeProduct = () =>{
-
-    }
-
-    const handleFormChange = (event) => {
-        // console.log(currOrder)
-        // setData({ ...data, [event.target.id]: event.target.value })
-        // console.log(data)
     }
 
 
     const handleTableClick = (tableSelectedItems) => {selectedItems = tableSelectedItems;}
     const handleTableDblClick = (tableSelectedItem) =>{}
-    const hideModal = () => {
-        setModalVisible(false)
-        setAddProdVisible(false)
-    }
-    const modalDone = () => {}
 
     return(
         <>
@@ -113,8 +75,6 @@ export default function OrderPage(){
                 add={add}
                 edit={edit}   
                 remove={remove}
-                addProduct={addProduct}
-                removeProduct={removeProduct}
                 addsVisible={true}/>
 
             <Table 
@@ -123,59 +83,6 @@ export default function OrderPage(){
                 selectable={true}
                 onClick={handleTableClick}
                 onDblClick={handleTableDblClick}/>
-
-            <Modal
-                header={modalHeader}
-                confirm={modalConfirm}
-                visible={modalVisible} 
-                onHide={hideModal}
-                onDone={modalDone}> 
-                    {/* <div className="mb-3">
-                        <label htmlFor="supplierId" className="form-label">Поставщик</label>
-                        <select id="supplierId" className="form-select" required
-                            value={currOrder.supplierId} onChange={handleFormChange}>
-                            <option disabled value="">Укажите поставщика</option>
-                            {
-                                suppliers.map(supplier => 
-                                    <option key={supplier.id} value={supplier.id}>{supplier.name}</option>
-                                )
-                            }
-                        </select>
-                    </div> */}
-
-                    {/* <div className="mb-3">
-                        <label htmlFor="product" className="form-label">Поставщик</label>
-                        <select id="product" className="form-select" required
-                            onChange={handleFormChange}>
-                            <option disabled value="">Укажите продукт</option>
-                            {
-                                products.map(product => 
-                                    <option key={product.id} value={product.id}>{product.name}</option>
-                                )
-                            }
-                        </select>
-                    </div> */}
-            </Modal>
-
-            <Modal            
-            header={modalHeader}
-            confirm={modalConfirm}
-            visible={addProdVisible} 
-            onHide={hideModal}
-            onDone={modalDone}>
-                {/* <div className="mb-3">
-                    <label htmlFor="product" className="form-label">Поставщик</label>
-                    <select id="product" className="form-select" required
-                        value={products} onChange={handleFormChange}>
-                        <option disabled value="">Укажите продукт</option>
-                        {
-                            products.map(product => 
-                                <option key={product.id} value={product.id}>{product.name}</option>
-                            )
-                        }
-                    </select>
-                </div> */}
-        </Modal>
         </>
     )
 }

front/src/general/Table.jsx

@@ -54,7 +54,7 @@ import styles from './Table.module.css';
             </thead>
             <tbody>
                 {
-                    props.items.map((item, index) =>
+                    props.items && props.items.map((item, index) =>
                         <tr key={item.id}
                             className={isSelected(item.id) ? styles.selected : ''}
                             onClick={(e) => click(item.id, e)} onDoubleClick={(e) => dblClick(item.id, e)}>

front/src/general/ToolBar.jsx

@@ -8,8 +8,6 @@ function ToolBar(props) {
     const add = () => props.add()
     const edit = () => props.edit()
     const remove = () => props.remove()
-    const addProduct = () => props.addProduct()
-    const removeProduct = () => props.removeProduct()
 
   return (
     <div className="btn-group mt-2" role="group">

front/src/models/Order.js

@@ -6,6 +6,6 @@ export default class Order {
         this.date = data?.dateOfOrder || '';
         this.supplierId = data?.supplier.id || '';
         this.supplierName = data?.supplier.name || '';
-        this.products = data?.products || '';
+        this.products = data?.products || [];
     }
 }