From 63ebb7b2a1f059116d4db4d0c46625437e0b4627 Mon Sep 17 00:00:00 2001 From: "Haru.Kusano" Date: Fri, 6 Jun 2025 10:50:35 +0900 Subject: [PATCH 1/8] =?UTF-8?q?=E6=96=99=E7=90=86=E8=BF=BD=E5=8A=A0?= =?UTF-8?q?=E3=81=B8=E3=81=AE=E3=83=9C=E3=82=BF=E3=83=B3=E6=8E=A8=E7=A7=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/pages/AddDishies1.tsx | 13 +++++++++++++ frontend/src/pages/TaskListPage.tsx | 10 ++++++++-- 2 files changed, 21 insertions(+), 2 deletions(-) create mode 100644 frontend/src/pages/AddDishies1.tsx diff --git a/frontend/src/pages/AddDishies1.tsx b/frontend/src/pages/AddDishies1.tsx new file mode 100644 index 0000000..fe425c0 --- /dev/null +++ b/frontend/src/pages/AddDishies1.tsx @@ -0,0 +1,13 @@ + +import React from 'react'; +import { Box } from '@mui/material'; + +const AddDishies1: React.FC = () => { + return ( + + {/* 白紙のページ - 何も表示しない */} + + ); +}; + +export default AddDishies1; \ No newline at end of file diff --git a/frontend/src/pages/TaskListPage.tsx b/frontend/src/pages/TaskListPage.tsx index 975f836..e1fee9a 100644 --- a/frontend/src/pages/TaskListPage.tsx +++ b/frontend/src/pages/TaskListPage.tsx @@ -4,6 +4,7 @@ */ import React, { useState, useEffect } from 'react'; import { toBuyApi, stuffApi } from '../services/api'; +import { useNavigate, Outlet, useLocation } from 'react-router-dom'; import { Container, Typography, @@ -36,7 +37,7 @@ import { import { Task, ToBuy, Stuff } from '../types/types'; import { TASK_ERRORS } from '../constants/errorMessages'; //import { FaCarrot } from "react-icons/fa6";　//エラー起きる　いったん保留 -import CategoryDropDown from "../components/CategoryDropDown"; +import handleNavigate from "../components/Layout"; @@ -227,7 +228,12 @@ const TaskListPage: React.FC = () => { setOpenDialog(true)} + onClick={() => {setOpenDialog(true); + //handleNavigate('/AddDishies1'); + }} + //selected={isSelected('/test')} + + > From 5ec94525905feca7b854b01cb2387f385363d5df Mon Sep 17 00:00:00 2001 From: "Haru.Kusano" Date: Fri, 6 Jun 2025 14:10:53 +0900 Subject: [PATCH 2/8] =?UTF-8?q?=E3=82=BF=E3=82=A4=E3=83=88=E3=83=AB?= =?UTF-8?q?=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/public/index.html | 2 +- frontend/src/components/Layout.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/public/index.html b/frontend/public/index.html index ed1fb15..6455083 100644 --- a/frontend/public/index.html +++ b/frontend/public/index.html @@ -23,7 +23,7 @@ work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> - React App + 料理材料アプリ diff --git a/frontend/src/components/Layout.tsx b/frontend/src/components/Layout.tsx index 4ac785b..91671d2 100644 --- a/frontend/src/components/Layout.tsx +++ b/frontend/src/components/Layout.tsx @@ -74,7 +74,7 @@ const Layout: React.FC = () => { - ToDoアプリ + 料理材料アプリ - - {/* タスク削除ボタン */} - {/* */} + + + 在庫の編集 + + 選択した食材の在庫を編集します + + + - - + {/* タスク削除ボタン */} + + 食材の削除 この操作は取り消せません。本当に削除しますか？ ⚠️ 注意: 削除すると復元できません。 - + From b9bb66b6d510857631c3dcce8e565309ca160637 Mon Sep 17 00:00:00 2001 From: "Haru.Kusano" Date: Mon, 9 Jun 2025 11:39:47 +0900 Subject: [PATCH 4/8] =?UTF-8?q?=E3=82=A2=E3=83=97=E3=83=AA=E5=90=8D?= =?UTF-8?q?=E3=82=92shopchop=E3=81=AB=E8=A8=AD=E5=AE=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/public/index.html | 2 +- frontend/src/components/Layout.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/public/index.html b/frontend/public/index.html index 6455083..8793c25 100644 --- a/frontend/public/index.html +++ b/frontend/public/index.html @@ -23,7 +23,7 @@ work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> - 料理材料アプリ + shopchop diff --git a/frontend/src/components/Layout.tsx b/frontend/src/components/Layout.tsx index 5d89da1..78c0a7b 100644 --- a/frontend/src/components/Layout.tsx +++ b/frontend/src/components/Layout.tsx @@ -74,7 +74,7 @@ const Layout: React.FC = () => { - 料理材料アプリ + shopchop */} - - - 在庫の編集 - - 選択した食材の在庫を編集します - - - + {/* タスク編集ボタン（全テーブル共通） */} + {/* タスク削除ボタン */} @@ -115,198 +163,140 @@ const StockPage: React.FC = () => { - - 乳製品 - - {/* 乳製品一覧表示エリア - 青い背景のコンテナ */} + {/* 在庫一覧リスト */} + {/* 乳製品 */} + 乳製品
+ {StockTable(stocks, ["乳製品"])} + + {/* 編集ダイアログ */} + + 在庫の編集 + + {selectedRow && ( + <> + 選択した食材の在庫を編集します + + + + + + + + )} + + - {/* 要素が無かったら表示しない */} - {stocks.filter(stock => stock.category === "乳製品").length === 0 ? null : ( - - - - - 食材名 - 数量 - 購入価格 - 賞味・消費期限 - 購入日 - - - - {stocks - .filter(stock => stock.category == "乳製品") // 乳製品だけ抽出 - .map(stock => ( - handleRowClick(stock.stock_id)} - style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> - {stock.stuff_name} - {stock.amount} - {stock.price} - {formatDate(stock.exp_date)} - {formatDate(stock.buy_date)} - - ))} - -
- - )}
- - 肉・魚 - - {/* 肉・魚一覧表示エリア - 青い背景のコンテナ */} + {/* 肉・魚 */} + 肉・魚
+ {StockTable(stocks, ["肉", "魚"])} - {stocks.filter(stock => stock.category == "肉" || stock.category == "魚").length === 0 ? null : ( - - - - - 食材名 - 数量 - 購入価格 - 賞味・消費期限 - 購入日 - - - - {stocks - .filter(stock => stock.category == "肉" || stock.category == "魚") // 肉と魚だけ抽出 - .map(stock => ( - handleRowClick(stock.stock_id)} - style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> - {stock.stuff_name} - {stock.amount} - {stock.price} - {formatDate(stock.exp_date)} - {formatDate(stock.buy_date)} - - ))} - -
- - )} + {/* 編集ダイアログ */} + + 在庫の編集 + + {selectedRow && ( + <> + 選択した食材の在庫を編集します + + + + + + + + )} + +
- - 野菜 - - {/* 野菜一覧表示エリア - 青い背景のコンテナ */} + {/* 野菜 */} + 野菜
- {stocks.filter(stock => stock.category === "野菜").length === 0 ? null : ( - - - - - 食材名 - 数量 - 購入価格 - 賞味・消費期限 - 購入日 - - - - {stocks - .filter(stock => stock.category == "野菜") // 野菜だけ抽出 - .map(stock => ( - handleRowClick(stock.stock_id)} - style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> - {stock.stuff_name} - {stock.amount} - {stock.price} - {formatDate(stock.exp_date)} - {formatDate(stock.buy_date)} - - ))} - -
- - )} + {StockTable(stocks, ["野菜"])} + + {/* 編集ダイアログ */} + + 在庫の編集 + + {selectedRow && ( + <> + 選択した食材の在庫を編集します + + + + + + + + )} + + +
- - 調味料 - - {/* 調味料一覧表示エリア - 青い背景のコンテナ */} + {/* 調味料 */} + 調味料
- {stocks.filter(stock => stock.category === "調味料").length === 0 ? null : ( - - - - - 食材名 - 数量 - 購入価格 - 賞味・消費期限 - 購入日 - - - - {stocks - .filter(stock => stock.category == "調味料") // 調味料だけ抽出 - .map(stock => ( - handleRowClick(stock.stock_id)} - style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> - {stock.stuff_name} - {stock.amount} - {stock.price} - {formatDate(stock.exp_date)} - {formatDate(stock.buy_date)} - - ))} - -
- - )} + {StockTable(stocks, ["調味料"])} + + {/* 編集ダイアログ */} + + 在庫の編集 + + {selectedRow && ( + <> + 選択した食材の在庫を編集します + + + + + + + + )} + + +
- - その他 - - {/* その他一覧表示エリア - 青い背景のコンテナ */} + {/* その他 */} + その他
- {stocks.filter(stock => stock.category === "その他").length === 0 ? null : ( - - - - - 食材名 - 数量 - 購入価格 - 賞味・消費期限 - 購入日 - - - - {stocks - .filter(stock => stock.category == "その他") // その他だけ抽出 - .map(stock => ( - handleRowClick(stock.stock_id)} - style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> - {stock.stuff_name} - {stock.amount} - {stock.price} - {formatDate(stock.exp_date)} - {formatDate(stock.buy_date)} - - ))} - -
- - )} + {StockTable(stocks, ["その他"])} + + {/* 編集ダイアログ */} + + 在庫の編集 + + {selectedRow && ( + <> + 選択した食材の在庫を編集します + + + + + + + + )} + + +
); From 978c0ad42bbe7d2214734bd47fed43088e481558 Mon Sep 17 00:00:00 2001 From: "Yuna.Suzuki" Date: Mon, 9 Jun 2025 16:16:04 +0900 Subject: [PATCH 6/8] =?UTF-8?q?stockpage=E3=82=92=E7=B7=A8=E9=9B=86?= =?UTF-8?q?=E3=81=97=E3=81=BE=E3=81=97=E3=81=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/pages/StockPage.tsx | 202 ++++++++++--------------------- 1 file changed, 63 insertions(+), 139 deletions(-) diff --git a/frontend/src/pages/StockPage.tsx b/frontend/src/pages/StockPage.tsx index ef8f92f..59a71c2 100644 --- a/frontend/src/pages/StockPage.tsx +++ b/frontend/src/pages/StockPage.tsx @@ -97,7 +97,7 @@ const StockPage: React.FC = () => { alert("削除する食材を選択してください。"); } }; - /** 編集ダイアログを閉じる */ + /** 削除ダイアログを閉じる */ const handleCloseDelete = () => { setIsDeleteOpen(false); }; @@ -109,34 +109,57 @@ const StockPage: React.FC = () => { if (filteredStocks.length === 0) return null; return ( - - - - - 食材名 - 数量 - 購入価格 - 賞味・消費期限 - 購入日 - - - - {filteredStocks.map(stock => ( - handleRowClick(stock)} - style={{ backgroundColor: selectedRow?.stock_id === stock.stock_id ? "yellow" : "white", cursor: "pointer" }} - > - {stock.stuff_name} - {stock.amount} - {stock.price} - {formatDate(stock.exp_date)} - {formatDate(stock.buy_date)} + <> + +
+ + + 食材名 + 数量 + 購入価格 + 賞味・消費期限 + 購入日 - ))} - -
- + + + {filteredStocks.map(stock => ( + handleRowClick(stock)} + style={{ backgroundColor: selectedRow?.stock_id === stock.stock_id ? "yellow" : "white", cursor: "pointer" }} + > + {stock.stuff_name} + {stock.amount} + {stock.price} + {formatDate(stock.exp_date)} + {formatDate(stock.buy_date)} + + ))} + + + + + {/* 編集ダイアログ */} + + 在庫の編集 + + {selectedRow && ( + <> + 選択した食材の在庫を編集します + + + + + + + + + )} + + + ); }; @@ -148,18 +171,24 @@ const StockPage: React.FC = () => { {/* タスク編集ボタン（全テーブル共通） */} - + {/* タスク削除ボタン */} - + 食材の削除 この操作は取り消せません。本当に削除しますか？ ⚠️ 注意: 削除すると復元できません。 - + + @@ -168,135 +197,30 @@ const StockPage: React.FC = () => { 乳製品
{StockTable(stocks, ["乳製品"])} - - {/* 編集ダイアログ */} - - 在庫の編集 - - {selectedRow && ( - <> - 選択した食材の在庫を編集します - - - - - - - - )} - - -
{/* 肉・魚 */} 肉・魚
- {StockTable(stocks, ["肉", "魚"])} - - {/* 編集ダイアログ */} - - 在庫の編集 - - {selectedRow && ( - <> - 選択した食材の在庫を編集します - - - - - - - - )} - - - + {StockTable(stocks, ["肉", "魚"])}
{/* 野菜 */} 野菜
{StockTable(stocks, ["野菜"])} - - {/* 編集ダイアログ */} - - 在庫の編集 - - {selectedRow && ( - <> - 選択した食材の在庫を編集します - - - - - - - - )} - - -
{/* 調味料 */} 調味料
{StockTable(stocks, ["調味料"])} - - {/* 編集ダイアログ */} - - 在庫の編集 - - {selectedRow && ( - <> - 選択した食材の在庫を編集します - - - - - - - - )} - - -
{/* その他 */} その他
{StockTable(stocks, ["その他"])} - - {/* 編集ダイアログ */} - - 在庫の編集 - - {selectedRow && ( - <> - 選択した食材の在庫を編集します - - - - - - - - )} - - -
); From cd8f3fd6c5d8991252a8a3fd0658c88a5a4b072b Mon Sep 17 00:00:00 2001 From: "Yuna.Suzuki" Date: Mon, 9 Jun 2025 16:58:02 +0900 Subject: [PATCH 7/8] =?UTF-8?q?merge=E3=81=97=E3=81=BE=E3=81=97=E3=81=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/pages/StockPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/pages/StockPage.tsx b/frontend/src/pages/StockPage.tsx index d63cb50..5bccca9 100644 --- a/frontend/src/pages/StockPage.tsx +++ b/frontend/src/pages/StockPage.tsx @@ -201,9 +201,9 @@ const StockPage: React.FC = () => { {/* 肉・魚 */} - 肉・魚 + 魚・肉
- {StockTable(stocks, ["肉", "魚"])} + {StockTable(stocks, ["魚・肉"])}
{/* 野菜 */} From 398ab54ba49047fb7050af2cd0180acf041756a9 Mon Sep 17 00:00:00 2001 From: "Yuna.Suzuki" Date: Tue, 10 Jun 2025 13:03:48 +0900 Subject: [PATCH 8/8] =?UTF-8?q?api=E3=81=A8stockpage=E3=82=92=E7=B7=A8?= =?UTF-8?q?=E9=9B=86=E3=81=97=E3=81=BE=E3=81=97=E3=81=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/pages/StockPage.tsx | 56 ++++++++++++++------ frontend/src/services/api.ts | 91 ++++++++++++++++++++++++++++---- 2 files changed, 122 insertions(+), 25 deletions(-) diff --git a/frontend/src/pages/StockPage.tsx b/frontend/src/pages/StockPage.tsx index 5bccca9..9b1765e 100644 --- a/frontend/src/pages/StockPage.tsx +++ b/frontend/src/pages/StockPage.tsx @@ -38,7 +38,7 @@ const StockPage: React.FC = () => { }, []); /** - * APIからタスク一覧を取得する関数 + * APIから在庫一覧を取得する関数 * 取得したタスクをstate(tasks)に設定 */ const fetchStocks = async () => { @@ -51,6 +51,19 @@ const StockPage: React.FC = () => { } }; + /** + * 在庫を削除するハンドラー + * 指定されたIDのタスクをAPIを通じて削除 + */ + const handleDeleteStock = async (stockId: number) => { + try { + await stockApi.deleteStock(stockId); + fetchStocks(); // 削除後の買うもの一覧を再取得 + } catch (error) { + console.error(`${STOCK_ERRORS.DELETE_FAILED}:`, error); + } + }; + /** * 文字列(ISO 8601形式)をyyyy/MM/ddに変換する関数 */ @@ -160,6 +173,32 @@ const StockPage: React.FC = () => { )} + + {/* タスク削除ダイアログ */} + + 食材の削除 + + {selectedRow && ( + <> + この操作は取り消せません。本当に削除しますか？ + ⚠️ 注意: 削除すると復元できません。 + + {/* */} + + + )} + + + + ); }; @@ -178,20 +217,7 @@ const StockPage: React.FC = () => { {/* タスク削除ボタン */} - - 食材の削除 - - この操作は取り消せません。本当に削除しますか？ - ⚠️ 注意: 削除すると復元できません。 - - - - + {/* 在庫一覧リスト */} {/* 乳製品 */} diff --git a/frontend/src/services/api.ts b/frontend/src/services/api.ts index 1477b83..a2a6967 100644 --- a/frontend/src/services/api.ts +++ b/frontend/src/services/api.ts @@ -140,7 +140,7 @@ export const toBuyApi = { const response = await fetch(`${API_BASE_URL}/api/tobuy/delete`, { method: 'DELETE', headers: getHeaders(), - body: JSON.stringify({tobuyId}), + body: JSON.stringify({ tobuyId }), }); if (!response.ok) { @@ -157,13 +157,13 @@ export const toBuyApi = { /** * 買うものリストの在庫登録（購入処理） */ - buy: async (req: {tobuyId: number, price: number, expDate: string, buyDate: string, lastUpdate: string}): Promise<{ result: boolean }> => { - + buy: async (req: { tobuyId: number, price: number, expDate: string, buyDate: string, lastUpdate: string }): Promise<{ result: boolean }> => { + console.log('req: ', req) req.buyDate = makeDateObject(req.buyDate)?.toISOString()?.substring(0, 10) || '' req.expDate = makeDateObject(req.expDate)?.toISOString()?.substring(0, 10) || '' - + const response = await fetch(`${API_BASE_URL}/api/tobuy/buy`, { method: 'POST', headers: getHeaders(), @@ -245,16 +245,87 @@ export const stockApi = { return response.json(); }, + + /** + * 在庫リストの編集 + */ + updateStock: async (req: {stockId: number, amount: number, price: number, lastUpdate: string, buyDate: string, expDate: string}): Promise<{ result: boolean; message: string }> => { + + + + const response = await fetch(`${API_BASE_URL}/api/stocks/update`, { + method: 'PUT', + headers: getHeaders(), + body: JSON.stringify(req), + }); + + if (!response.ok) { + throw new Error(STOCK_ERRORS.UPDATE_FAILED); + } + + return response.json() + + // return { + // "result": true + // } + }, + + /** + * 在庫リストの削除 + * @param id 削除対象の食材のID + */ + deleteStock: async (stockId: number): Promise<{ result: boolean; message: string }> => { + const response = await fetch(`${API_BASE_URL}/api/stocks/delete`, { + method: 'DELETE', + headers: getHeaders(), + body: JSON.stringify({ stockId }), + }); + + console.log("API レスポンスステータス:", response.status); + console.log("API レスポンス本文:", await response.text()); + + if (!response.ok) { + throw new Error(STOCK_ERRORS.DELETE_FAILED); + } + + return response.json() + + // return { + // "result": true + // } + }, + } +const deleteStock = async (stockId: number): Promise<{ result: boolean; message: string }> => { + console.log("API の deleteStock メソッドが呼ばれました。stockId:", stockId); + + const response = await fetch(`${API_BASE_URL}/api/stocks/delete`, { + method: "DELETE", + headers: getHeaders(), + body: JSON.stringify({ stockId }), + }); + + console.log("API レスポンスステータス:", response.status); + console.log("API レスポンス本文:", await response.text()); + + if (!response.ok) { + return { result: false, message: "削除に失敗しました。" }; + } + + // API のレスポンスから result と message を取得 + const data = await response.json(); + return { result: data.result, message: data.message }; +}; + function makeDateObject(dateStr: String) { - // 例: '2025/06/15' または '2025-06-15' を '2025-06-15' に変換 - const parts = dateStr.split(/[-\/]/); // ハイフンかスラッシュで分割 - if (parts.length === 3) { - return new Date(parts[0] + '-' + parts[1] + '-' + parts[2]); - } - return null; // 無効な日付の場合 + // 例: '2025/06/15' または '2025-06-15' を '2025-06-15' に変換 + const parts = dateStr.split(/[-\/]/); // ハイフンかスラッシュで分割 + if (parts.length === 3) { + return new Date(parts[0] + '-' + parts[1] + '-' + parts[2]); + } + return null; // 無効な日付の場合 }