+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/front/src/components/catalogs/CatalogStudents.jsx b/front/src/components/catalogs/CatalogStudents.jsx
new file mode 100644
index 0000000..72e77f2
--- /dev/null
+++ b/front/src/components/catalogs/CatalogStudents.jsx
@@ -0,0 +1,52 @@
+import { useState, useEffect } from 'react';
+import Catalog from './Catalog';
+import Component from '../../models/Component';
+import DataService from '../../services/DataService';
+
+export default function CatalogStudents(props) {
+ const getAllUrl = '/component';
+ const url = '/component/';
+ const transformer = (data) => new Component(data);
+ const catalogStudHeaders = [
+ { name: 'componentName', label: 'Название компонента' },
+ { name: 'price', label: 'Цена' }
+ ];
+
+ const [data, setData] = useState(new Component());
+
+ function handleOnAdd() {
+ setData(new Component());
+ }
+
+ function handleOnEdit(data) {
+ setData(new Component(data));
+ }
+
+ function handleFormChange(event) {
+ setData({ ...data, [event.target.id]: event.target.value })
+ }
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/front/src/components/catalogs/Menu.jsx b/front/src/components/catalogs/Menu.jsx
new file mode 100644
index 0000000..1b30df8
--- /dev/null
+++ b/front/src/components/catalogs/Menu.jsx
@@ -0,0 +1,112 @@
+import { useState, useEffect, Component } from "react";
+import CatalogProduct from "./CatalogProduct";
+import Product from "../../models/Product";
+import Components from "../../models/Component";
+import DataService from "../../services/DataService";
+export default function Menu(props) {
+ const url = "/product";
+ const categoryUrl = "/component";
+ const transformer = (data) => new Product(data);
+ const catalogStudHeaders = [
+ { name: "componentName", label: "Название компонента" },
+ { name: "count", label: "Количество" },
+ ];
+ const [data, setData] = useState(new Product());
+ const [component, setComponent] = useState([]);
+ const [componentProduct, setComponentProduct] = useState([]);
+ useEffect(() => {
+ DataService.readAll(categoryUrl, (data) => new Components(data)).then(
+ (data) => setComponent(data)
+ );
+ }, []);
+
+ function handleOnAdd() {
+ setData(new Product());
+ setComponentProduct([]);
+ }
+ function handleOnEdit(data) {
+ setData(new Product(data));
+ }
+
+ function handleFormChange(event) {
+ setData({ ...data, [event.target.id]: event.target.value });
+ }
+ const [imageURL, setImageURL] = useState();
+ const fileReader = new FileReader();
+ fileReader.onloadend = () => {
+ const tempval = fileReader.result;
+ setImageURL(tempval);
+ setData({ ...data, ["picture"]: tempval });
+ };
+ function handleOnChange(event) {
+ event.preventDefault();
+ const file = event.target.files[0];
+ fileReader.readAsDataURL(file);
+ }
+
+ function handleUpdateComponents(value, bool) {
+ if (bool) {
+ let temp = data.componentDTOList.filter((x) => x.id != value.id);
+ data.componentDTOList = [];
+ for (let i = 0; i < temp.length; i++) {
+ data.componentDTOList.push(temp[i]);
+ }
+ data.componentDTOList.push(value);
+ setData(data);
+ }
+ setComponentProduct(
+ componentProduct.map((obj) => {
+ if (obj.id == value.id) {
+ return { ...obj, count: value.count };
+ } else {
+ return obj;
+ }
+ })
+ );
+ }
+ function setDataa(value) {
+ setData({ ...data, ["image"]: value });
+ }
+ function setComponents() {
+ data.componentDTOList = [];
+ for (let i = 0; i < componentProduct.length; i++) {
+ data.componentDTOList.push(componentProduct[i]);
+ }
+ setData(data);
+ }
+ function handleDeleteComponents(value) {
+ setComponentProduct(componentProduct.filter((x) => x.id !== value));
+ }
+ function setprice(value){
+ let count = 0;
+ for (let i = 0; i < data.componentDTOList.length; i++) {
+ count +=
+ data.componentDTOList[i].price * data.componentDTOList[i].count;
+ }
+ data.price = count;
+ }
+ return (
+
+
+
+ );
+}
diff --git a/front/src/components/common/Card.jsx b/front/src/components/common/Card.jsx
new file mode 100644
index 0000000..8659881
--- /dev/null
+++ b/front/src/components/common/Card.jsx
@@ -0,0 +1,73 @@
+import DataService from "../../services/DataService";
+export default function Card(props) {
+ function edit(id) {
+ props.onEdit(id);
+ }
+
+ function remove(id) {
+ props.onRemove(id);
+ }
+ async function mess(id){
+ let currentProduct = props.product.filter(x => x.id == id.id);
+ if (currentProduct.length != 0){
+ let temp = props.product.filter(x => x.id != id.id);
+ currentProduct[0].count++;
+ temp.push(currentProduct[0]);
+ await props.setProduct(temp);
+ return;
+ }else{
+ id.count++;
+ props.product.push(id);
+ props.setProduct(props.product);
+ }
+ }
+ return (
+
+ {props.items.map((item) => (
+
+
+
+
![Бугер]({item["image"]})
+
+
+
+
+ ))}
+
+
+
+
+
{props.header}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{props.header}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ | # |
+ {
+ props.headers.map(header =>
+
+ {header.label}
+ |
+ )
+ }
+
+
+
+ {
+ props.items.map((item, index) =>
+ click(item.id, e)} onDoubleClick={(e) => dblClick(item.id, e)}>
+ | {index + 1} |
+ {
+ props.headers.map(header =>
+ {item[header.name]} |
+ )
+ }
+
+ )
+ }
+
+
+ );
+}
\ No newline at end of file
diff --git a/front/src/components/common/Table.module.css b/front/src/components/common/Table.module.css
new file mode 100644
index 0000000..f300e07
--- /dev/null
+++ b/front/src/components/common/Table.module.css
@@ -0,0 +1,12 @@
+.table tbody tr {
+ user-select: none;
+}
+
+.selectable tbody tr:hover {
+ cursor: pointer;
+}
+
+.selected {
+ background-color: #0d6efd;
+ opacity: 80%;
+}
\ No newline at end of file
diff --git a/front/src/components/common/TableOrder.jsx b/front/src/components/common/TableOrder.jsx
new file mode 100644
index 0000000..483f64f
--- /dev/null
+++ b/front/src/components/common/TableOrder.jsx
@@ -0,0 +1,97 @@
+import { useEffect } from "react";
+import { useState } from "react";
+import DataService from "../../services/DataService";
+import Order from "../../models/Order";
+
+export default function TableOrder(props) {
+ const [order, setOrder] = useState(new Order())
+ const [cost, setCost] = useState(0);
+ const [del, setDel] = useState(false);
+ useEffect(() => {
+ loadItems();
+ }, []);
+ useEffect(() => {
+ loadItems();
+ setDel(false);
+ }, [del]);
+ async function loadItems() {
+ await summ(props.product.sort((a, b) => a.name > b.name ? 1 : -1));
+
+ setOrder({...order,["productDTOList"]: props.product, ["price"]:cost});
+ }
+ async function summ(data) {
+ let tem = 0;
+ for (let i = 0; i < data.length; i++) {
+ tem += data[i].count * Number(data[i].price);
+ }
+ setCost(tem);
+ setOrder({...order,["price"]: tem});
+ }
+ async function deleteItem(item) {
+ let currentProduct = props.product.filter((x) => x.id == item.id)[0];
+ let temp = props.product.filter((x) => x.id != item.id);
+ if (currentProduct.count - 1 == 0) {
+ props.setProduct(temp);
+ setDel(true);
+ loadItems();
+ return;
+ } else {
+ currentProduct.count--;
+ temp.push(currentProduct);
+ props.setProduct(temp);
+ setDel(true);
+ loadItems();
+ }
+ }
+ async function needWait(){
+ setOrder({...order, ["price"]:cost});
+ }
+ async function acceptOrder(){
+ await needWait();
+
+ await DataService.create("/order",order ).then(data => {
+ props.setProduct([]);
+ setCost(0);
+ });
+ }
+ return (
+
+
+
+
+
+ | # |
+ Позиция |
+ |
+ Стоимость |
+ |
+
+
+
+ {props.product.map((item, index) => (
+
+ | {index + 1} |
+ {item.name} |
+
+ {item.count}x{item.price} руб
+ |
+
+
+ |
+
+ ))}
+
+
+
+
Итого: {cost} руб
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/front/src/components/common/Toolbar.module.css b/front/src/components/common/Toolbar.module.css
new file mode 100644
index 0000000..b169b69
--- /dev/null
+++ b/front/src/components/common/Toolbar.module.css
@@ -0,0 +1,3 @@
+.btn {
+ min-width: 140px;
+}
\ No newline at end of file
diff --git a/front/src/components/common/ToolbarProduct.jsx b/front/src/components/common/ToolbarProduct.jsx
new file mode 100644
index 0000000..6c4952c
--- /dev/null
+++ b/front/src/components/common/ToolbarProduct.jsx
@@ -0,0 +1,17 @@
+export default function ToolbarProduct(props) {
+ function add() {
+ props.onAdd();
+ }
+ return (
+
+
+
+ );
+ }
+
\ No newline at end of file
diff --git a/front/src/index.html b/front/src/index.html
deleted file mode 100644
index 59944c7..0000000
--- a/front/src/index.html
+++ /dev/null
@@ -1,82 +0,0 @@
-
-
-
-
-
-
- Заказы
-
-
-
-
-
-
-
-
-
-
-
- | ИД |
- Дата оформления |
- Цена |
- Продукты |
-
-
-
-
-
-
-
-
-
-
-
-
-
- | ИД |
- Название продукта |
- Цена |
- Компоненты |
-
-
-
-
-
-
-
- | ${Component.id} |
- ${Component.componentName} |
- ${Component.price} |
-
`;
- })
- }
-
- const create = async function (price, componentName) {
- const requestParams = {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/component?price=${price}&name=${componentName}`, requestParams);
- return await response.json();
- }
-
- const remove = async function (){
- console.info('Try to remove item');
- if (componentIdInput.value !== 0) {
- if (!confirm('Do you really want to remove this item?')) {
- console.info('Canceled');
- return;
- }
- }
- const requestParams = {
- method: "DELETE",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/component/` + componentIdInput.value, requestParams);
- return await response.json();
- }
-
- const update = async function (){
- console.info('Try to update item');
- if (componentIdInput.value === 0 || componentNameInput.value == null || priceInput.value === 0) {
- return;
- }
- const requestParams = {
- method: "PUT",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/component/${componentIdInput.value}?price=${priceInput.value}&name=${componentNameInput.value}`, requestParams);
- return await response.json();
- }
-
- buttonRemove.addEventListener('click', function (event){
- event.preventDefault();
- remove().then((result) => {
- getData()
- componentIdInput.value = "";
- priceInput.value = "";
- componentNameInput.value = "";
- });
- });
-
- buttonUpdate.addEventListener('click', function (event){
- event.preventDefault();
- update().then((result) => {
- getData()
- componentIdInput.value = "";
- priceInput.value = "";
- componentNameInput.value = "";
- });
- });
-
- form.addEventListener("submit", function (event) {
- event.preventDefault();
- create(priceInput.value, componentNameInput.value).then((result) => {
- getData();
- priceInput.value = "";
- componentNameInput.value = "";
- alert(`Component[id=${result.id}, price=${result.price}, componentName=${result.componentName}]`);
- });
- });
- getData();
-});
\ No newline at end of file
diff --git a/front/src/scriptOrder.js b/front/src/scriptOrder.js
deleted file mode 100644
index 1078ead..0000000
--- a/front/src/scriptOrder.js
+++ /dev/null
@@ -1,113 +0,0 @@
-"use strict";
-
-window.addEventListener('DOMContentLoaded', function () {
- const host = "http://localhost:8080";
- const table = document.getElementById("tbody");
- const form = document.getElementById("form");
- const orderIdInput = document.getElementById("orderId");
- const orderDate = document.getElementById("orderDate");
- const priceInput = document.getElementById("orderPrice");
- const productIdInput = document.getElementById("productId");
- const productCountInput = document.getElementById("productCount");
- const buttonRemove = document.getElementById("btnRemove");
- const buttonUpdate = document.getElementById("btnUpdate");
-
- const getData = async function () {
-
- table.innerHTML = "";
- const response = await fetch(host + "/order");
- const data = await response.json();
- data.forEach(Order => {
- let temp = ""
- table.innerHTML +=
- `
- | ${Order.id} |
- ${Order.date} |
- ${Order.price} |
- ${temp} |
-
`;
- })
- }
-
- const create = async function () {
- const requestParams = {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- }
- };
- let temp = Date.now();
- let time = new Date(temp);
- let tru = time.toString();
- const response = await fetch(host + `/order?price=${priceInput.value}&date=${tru}&count=${productCountInput.value}&prod=${productIdInput.value}`, requestParams);
- return await response.json();
- }
-
- const remove = async function (){
- console.info('Try to remove item');
- if (orderIdInput.value !== 0) {
- if (!confirm('Do you really want to remove this item?')) {
- console.info('Canceled');
- return;
- }
- }
- const requestParams = {
- method: "DELETE",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/order/` + orderIdInput.value, requestParams);
- return await response.json();
- }
-
- const update = async function (){
- console.info('Try to update item');
- if (orderIdInput.value === 0 || orderDate.value == null || orderPrice.value === 0 || productIdInput.value === 0 || productCountInput.value === 0) {
- return;
- }
- const requestParams = {
- method: "PUT",
- headers: {
- "Content-Type": "application/json",
- }
- };
- let temp = Date.now();
- let time = new Date(temp);
- let tru = time.toString();
- const response = await fetch(host + `/order/${orderIdInput.value}?price=${priceInput.value}&date=${tru}&count=${productCountInput.value}&prod=${productIdInput.value}`, requestParams);
- return await response.json();
- }
-
- buttonRemove.addEventListener('click', function (event){
- event.preventDefault();
- remove().then((result) => {
- getData()
- orderIdInput.value = "";
- });
- });
-
- buttonUpdate.addEventListener('click', function (event){
- event.preventDefault();
- update().then((result) => {
- getData()
- orderIdInput.value = "";
- priceInput.value = "";
- });
- });
-
- form.addEventListener("submit", function (event) {
- event.preventDefault();
- create().then((result) => {
- getData();
- priceInput.value = "";
- orderIdInput.value = "";
- alert(`Component[id=${result.id}, price=${result.price}, componentName=${result.date}]`);
- });
- });
- getData();
-});
\ No newline at end of file
diff --git a/front/src/scriptProduct.js b/front/src/scriptProduct.js
deleted file mode 100644
index e06899d..0000000
--- a/front/src/scriptProduct.js
+++ /dev/null
@@ -1,106 +0,0 @@
-"use strict";
-
-window.addEventListener('DOMContentLoaded', function () {
- const host = "http://localhost:8080";
- const table = document.getElementById("tbody");
- const form = document.getElementById("form");
- const productIdInpit = document.getElementById("productId");
- const productNameInput = document.getElementById("productName");
- const priceInput = document.getElementById("productPrice");
- const componentIdInput = document.getElementById("componentId");
- const componentCountInput = document.getElementById("componentCount");
- const buttonRemove = document.getElementById("btnRemove");
- const buttonUpdate = document.getElementById("btnUpdate");
- const getData = async function () {
-
- table.innerHTML = "";
- const response = await fetch(host + "/product");
- const data = await response.json();
- data.forEach(Product => {
- let temp = ""
- table.innerHTML +=
- `
- | ${Product.id} |
- ${Product.productName} |
- ${Product.price} |
- ${temp} |
-
`;
- })
- }
-
- const create = async function () {
- const requestParams = {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/product?price=${priceInput.value}&name=${productNameInput.value}&count=${componentCountInput.value}&comp=${componentIdInput.value}`, requestParams);
- return await response.json();
- }
-
- const remove = async function (){
- console.info('Try to remove item');
- if (productIdInpit.value !== 0) {
- if (!confirm('Do you really want to remove this item?')) {
- console.info('Canceled');
- return;
- }
- }
- const requestParams = {
- method: "DELETE",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/product/` + productIdInpit.value, requestParams);
- return await response.json();
- }
-
- const update = async function (){
- console.info('Try to update item');
- if (productIdInpit.value === 0 || productNameInput.value == null || priceInput.value === 0 || componentIdInput.value === 0 || componentCountInput.value === 0) {
- return;
- }
- const requestParams = {
- method: "PUT",
- headers: {
- "Content-Type": "application/json",
- }
- };
- const response = await fetch(host + `/product/${productIdInpit.value}?price=${priceInput.value}&name=${productNameInput.value}&count=${componentCountInput.value}&comp=${componentIdInput.value}`, requestParams);
- return await response.json();
- }
-
- buttonRemove.addEventListener('click', function (event){
- event.preventDefault();
- remove().then((result) => {
- getData()
- productIdInpit.value = "";
- });
- });
-
- buttonUpdate.addEventListener('click', function (event){
- event.preventDefault();
- update().then((result) => {
- getData()
- componentIdInput.value = "";
- priceInput.value = "";
- });
- });
-
- form.addEventListener("submit", function (event) {
- event.preventDefault();
- create().then((result) => {
- getData();
- priceInput.value = "";
- productNameInput.value = "";
- alert(`Component[id=${result.id}, price=${result.price}, componentName=${result.productName}]`);
- });
- });
- getData();
-});
\ No newline at end of file
diff --git a/front/src/services/DataService.js b/front/src/services/DataService.js
new file mode 100644
index 0000000..e4dd6d3
--- /dev/null
+++ b/front/src/services/DataService.js
@@ -0,0 +1,44 @@
+import axios from 'axios';
+
+export default class DataService {
+ static dataUrlPrefix = 'http://localhost:8080';
+
+ static async readAll(url, transformer) {
+ const response = await fetch(this.dataUrlPrefix + url);
+ const data = await response.json();
+ return data.map(item => transformer(item));
+ }
+
+ static async read(url, transformer) {
+ const response = await axios.get(this.dataUrlPrefix + url);
+ return transformer(response.data);
+ }
+
+ static async create(url, data) {
+ const requestParams = {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify(data),
+ };
+ const response = await fetch(this.dataUrlPrefix + url, requestParams);
+ }
+
+ static async update(url, data) {
+ const requestParams = {
+ method: "PUT",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify(data),
+ };
+ const response = await fetch(this.dataUrlPrefix + url, requestParams);
+ return true;
+ }
+
+ static async delete(url) {
+ const response = await axios.delete(this.dataUrlPrefix + url);
+ return response.data.id;
+ }
+}
\ No newline at end of file
diff --git a/front/src/style.css b/front/src/style.css
new file mode 100644
index 0000000..e69de29