expcman
/
joint_exc
mirror of https://ivis.backlog.com/git/TRAIN2025_GROUP_K/joint_exc.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

change to camelcase in frontend

Browse Source
feature-backend-tobuy-stock-2
Masaharu.Kato 5 months ago
parent 527194d5b7
commit b048eb01d5
4 changed files with 109 additions and 109 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 60
      frontend/src/pages/StockPage.tsx
  2. 32
      frontend/src/pages/TaskListPage.tsx
  3. 104
      frontend/src/services/api.ts
  4. 22
      frontend/src/types/types.ts

60
frontend/src/pages/StockPage.tsx
Unescape View File

@ -139,14 +139,14 @@ const StockPage: React.FC = () => {
.filter(stock => stock.category == "乳製品") // 乳製品だけ抽出 .filter(stock => stock.category == "乳製品") // 乳製品だけ抽出
.map(stock => ( .map(stock => (
<TableRow <TableRow
key={stock.stock_id} key={stock.stockId}
onClick={() => handleRowClick(stock.stock_id)} onClick={() => handleRowClick(stock.stockId)}
style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> style={{ backgroundColor: selectedRow === stock.stockId ? "yellow" : "white", cursor: "pointer" }}>
<TableCell>{stock.stuff_name}</TableCell> <TableCell>{stock.stuffName}</TableCell>
<TableCell>{stock.amount}</TableCell> <TableCell>{stock.amount}</TableCell>
<TableCell>{stock.price}</TableCell> <TableCell>{stock.price}</TableCell>
<TableCell>{formatDate(stock.exp_date)}</TableCell> <TableCell>{formatDate(stock.expDate)}</TableCell>
<TableCell>{formatDate(stock.buy_date)}</TableCell> <TableCell>{formatDate(stock.buyDate)}</TableCell>
</TableRow> </TableRow>
))} ))}
</TableBody> </TableBody>
@ -178,14 +178,14 @@ const StockPage: React.FC = () => {
.filter(stock => stock.category == "肉" || stock.category == "魚") // 肉と魚だけ抽出 .filter(stock => stock.category == "肉" || stock.category == "魚") // 肉と魚だけ抽出
.map(stock => ( .map(stock => (
<TableRow <TableRow
key={stock.stock_id} key={stock.stockId}
onClick={() => handleRowClick(stock.stock_id)} onClick={() => handleRowClick(stock.stockId)}
style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> style={{ backgroundColor: selectedRow === stock.stockId ? "yellow" : "white", cursor: "pointer" }}>
<TableCell>{stock.stuff_name}</TableCell> <TableCell>{stock.stuffName}</TableCell>
<TableCell>{stock.amount}</TableCell> <TableCell>{stock.amount}</TableCell>
<TableCell>{stock.price}</TableCell> <TableCell>{stock.price}</TableCell>
<TableCell>{formatDate(stock.exp_date)}</TableCell> <TableCell>{formatDate(stock.expDate)}</TableCell>
<TableCell>{formatDate(stock.buy_date)}</TableCell> <TableCell>{formatDate(stock.buyDate)}</TableCell>
</TableRow> </TableRow>
))} ))}
</TableBody> </TableBody>
@ -217,14 +217,14 @@ const StockPage: React.FC = () => {
.filter(stock => stock.category == "野菜") // 野菜だけ抽出 .filter(stock => stock.category == "野菜") // 野菜だけ抽出
.map(stock => ( .map(stock => (
<TableRow <TableRow
key={stock.stock_id} key={stock.stockId}
onClick={() => handleRowClick(stock.stock_id)} onClick={() => handleRowClick(stock.stockId)}
style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> style={{ backgroundColor: selectedRow === stock.stockId ? "yellow" : "white", cursor: "pointer" }}>
<TableCell>{stock.stuff_name}</TableCell> <TableCell>{stock.stuffName}</TableCell>
<TableCell>{stock.amount}</TableCell> <TableCell>{stock.amount}</TableCell>
<TableCell>{stock.price}</TableCell> <TableCell>{stock.price}</TableCell>
<TableCell>{formatDate(stock.exp_date)}</TableCell> <TableCell>{formatDate(stock.expDate)}</TableCell>
<TableCell>{formatDate(stock.buy_date)}</TableCell> <TableCell>{formatDate(stock.buyDate)}</TableCell>
</TableRow> </TableRow>
))} ))}
</TableBody> </TableBody>
@ -255,14 +255,14 @@ const StockPage: React.FC = () => {
.filter(stock => stock.category == "調味料") // 調味料だけ抽出 .filter(stock => stock.category == "調味料") // 調味料だけ抽出
.map(stock => ( .map(stock => (
<TableRow <TableRow
key={stock.stock_id} key={stock.stockId}
onClick={() => handleRowClick(stock.stock_id)} onClick={() => handleRowClick(stock.stockId)}
style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> style={{ backgroundColor: selectedRow === stock.stockId ? "yellow" : "white", cursor: "pointer" }}>
<TableCell>{stock.stuff_name}</TableCell> <TableCell>{stock.stuffName}</TableCell>
<TableCell>{stock.amount}</TableCell> <TableCell>{stock.amount}</TableCell>
<TableCell>{stock.price}</TableCell> <TableCell>{stock.price}</TableCell>
<TableCell>{formatDate(stock.exp_date)}</TableCell> <TableCell>{formatDate(stock.expDate)}</TableCell>
<TableCell>{formatDate(stock.buy_date)}</TableCell> <TableCell>{formatDate(stock.buyDate)}</TableCell>
</TableRow> </TableRow>
))} ))}
</TableBody> </TableBody>
@ -293,14 +293,14 @@ const StockPage: React.FC = () => {
.filter(stock => stock.category == "その他") // その他だけ抽出 .filter(stock => stock.category == "その他") // その他だけ抽出
.map(stock => ( .map(stock => (
<TableRow <TableRow
key={stock.stock_id} key={stock.stockId}
onClick={() => handleRowClick(stock.stock_id)} onClick={() => handleRowClick(stock.stockId)}
style={{ backgroundColor: selectedRow === stock.stock_id ? "yellow" : "white", cursor: "pointer" }}> style={{ backgroundColor: selectedRow === stock.stockId ? "yellow" : "white", cursor: "pointer" }}>
<TableCell>{stock.stuff_name}</TableCell> <TableCell>{stock.stuffName}</TableCell>
<TableCell>{stock.amount}</TableCell> <TableCell>{stock.amount}</TableCell>
<TableCell>{stock.price}</TableCell> <TableCell>{stock.price}</TableCell>
<TableCell>{formatDate(stock.exp_date)}</TableCell> <TableCell>{formatDate(stock.expDate)}</TableCell>
<TableCell>{formatDate(stock.buy_date)}</TableCell> <TableCell>{formatDate(stock.buyDate)}</TableCell>
</TableRow> </TableRow>
))} ))}
</TableBody> </TableBody>

32
frontend/src/pages/TaskListPage.tsx
Unescape View File

@ -40,9 +40,9 @@ import { TASK_ERRORS } from '../constants/errorMessages';
// 新規タスクの初期状態 // 新規タスクの初期状態
const EMPTY_TASK: Omit<ToBuy, 'tobuy_id' | 'stuff_id'> & { stuff_id: number | null, category: string } & { newAddition: boolean } = { const EMPTY_TASK: Omit<ToBuy, 'tobuyId' | 'stuffId'> & { stuffId: number | null, category: string } & { newAddition: boolean } = {
stuff_id: null, stuffId: null,
stuff_name: '', stuffName: '',
amount: 0, amount: 0,
shop: '', shop: '',
category: '', category: '',
@ -58,7 +58,7 @@ const TaskListPage: React.FC = () => {
//在庫登録ダイアログの表示状態 //在庫登録ダイアログの表示状態
const [openInfoDialog, setOpenInfoDialog] = useState(false); const [openInfoDialog, setOpenInfoDialog] = useState(false);
const [selectedTask, setSelectedTask] = useState<ToBuy["tobuy_id"]>(0); const [selectedTask, setSelectedTask] = useState<ToBuy["tobuyId"]>(0);
const [newToBuy, setNewToBuy] = useState(EMPTY_TASK); const [newToBuy, setNewToBuy] = useState(EMPTY_TASK);
@ -126,7 +126,7 @@ const TaskListPage: React.FC = () => {
const handleCreateTask = async () => { const handleCreateTask = async () => {
try { try {
if (newToBuy.newAddition) { if (newToBuy.newAddition) {
newToBuy.stuff_id = null; newToBuy.stuffId = null;
} }
console.log(newToBuy) console.log(newToBuy)
await toBuyApi.addToBuy(newToBuy); await toBuyApi.addToBuy(newToBuy);
@ -149,7 +149,7 @@ const TaskListPage: React.FC = () => {
{/* タスク一覧をマップして各タスクをリストアイテムとして表示 */} {/* タスク一覧をマップして各タスクをリストアイテムとして表示 */}
{tobuys && tobuys.map((tobuy) => ( {tobuys && tobuys.map((tobuy) => (
<ListItem <ListItem
key={tobuy.tobuy_id} key={tobuy.tobuyId}
sx={{ sx={{
bgcolor: 'background.paper', bgcolor: 'background.paper',
mb: 1, mb: 1,
@ -166,7 +166,7 @@ const TaskListPage: React.FC = () => {
*/} */}
{/* タスクのタイトルと説明 - 完了状態に応じて取り消し線を表示 */} {/* タスクのタイトルと説明 - 完了状態に応じて取り消し線を表示 */}
<ListItemText <ListItemText
primary={`${tobuy.stuff_name} × ${tobuy.amount}`} primary={`${tobuy.stuffName} × ${tobuy.amount}`}
//secondary={tobuy.amount} //secondary={tobuy.amount}
sx={{ sx={{
textDecoration: false ? 'line-through' : 'none', textDecoration: false ? 'line-through' : 'none',
@ -180,8 +180,8 @@ const TaskListPage: React.FC = () => {
aria-label="食材情報追加" aria-label="食材情報追加"
onClick={() => { onClick={() => {
setOpenInfoDialog(true) setOpenInfoDialog(true)
setSelectedTask(tobuy.tobuy_id) setSelectedTask(tobuy.tobuyId)
// handleDeleteTask(tobuy.tobuy_id) // handleDeleteTask(tobuy.tobuyId)
}} }}
> >
<ShoppingBasketIcon /> <ShoppingBasketIcon />
@ -205,7 +205,7 @@ const TaskListPage: React.FC = () => {
<IconButton <IconButton
edge="end" edge="end"
aria-label="delete" aria-label="delete"
onClick={() => handleDeleteTask(tobuy.tobuy_id)} onClick={() => handleDeleteTask(tobuy.tobuyId)}
> >
<DeleteIcon /> <DeleteIcon />
</IconButton> </IconButton>
@ -273,12 +273,12 @@ const TaskListPage: React.FC = () => {
<InputLabel id="demo-simple-select-label">材料名（選択）</InputLabel> <InputLabel id="demo-simple-select-label">材料名（選択）</InputLabel>
<Select <Select
labelId="demo-simple-select-label" labelId="demo-simple-select-label"
value={newToBuy.stuff_id} value={newToBuy.stuffId}
onChange={(e) => setNewToBuy({ ...newToBuy, stuff_id: Number(e.target.value) })} onChange={(e) => setNewToBuy({ ...newToBuy, stuffId: Number(e.target.value) })}
> >
{stuffs.map((stuff) => ( {stuffs.map((stuff) => (
<MenuItem key={stuff.stuff_id} value={stuff.stuff_id}> <MenuItem key={stuff.stuffId} value={stuff.stuffId}>
{stuff.stuff_name} {stuff.stuffName}
</MenuItem> </MenuItem>
))} ))}
</Select> </Select>
@ -290,8 +290,8 @@ const TaskListPage: React.FC = () => {
margin="dense" margin="dense"
label="材料名" label="材料名"
fullWidth fullWidth
value={newToBuy.stuff_name} value={newToBuy.stuffName}
onChange={(e) => setNewToBuy({ ...newToBuy, stuff_name: e.target.value })} onChange={(e) => setNewToBuy({ ...newToBuy, stuffName: e.target.value })}
sx={{ marginBottom: 2 }} sx={{ marginBottom: 2 }}
/>} />}
{/* 数量入力フィールド */} {/* 数量入力フィールド */}

104
frontend/src/services/api.ts
Unescape View File

@ -107,16 +107,16 @@ export const toBuyApi = {
// return { // return {
// "tobuy_array": [ // "tobuy_array": [
// { // {
// "tobuy_id": 1, // "tobuyId": 1,
// "stuff_id": 2, // "stuffId": 2,
// "stuff_name": "じゃがいも", // "stuffName": "じゃがいも",
// "amount": 3, // "amount": 3,
// "shop": "shopXXX" // "shop": "shopXXX"
// }, // },
// { // {
// "tobuy_id": 2, // "tobuyId": 2,
// "stuff_id": 5, // "stuffId": 5,
// "stuff_name": "にんじん", // "stuffName": "にんじん",
// "amount": 1 // "amount": 1
// } // }
// ] // ]
@ -129,7 +129,7 @@ export const toBuyApi = {
* @param tobuy 作成する材料情報 * @param tobuy 作成する材料情報
* @returns 作成された材料情報 * @returns 作成された材料情報
*/ */
addToBuy: async (tobuy: Omit<ToBuy, 'stuff_id' | 'tobuy_id'> & { stuff_id: number | null, category: string }): Promise<any> => { addToBuy: async (tobuy: Omit<ToBuy, 'stuffId' | 'tobuyId'> & { stuffId: number | null, category: string }): Promise<any> => {
const response = await fetch(`${API_BASE_URL}/api/tobuy/add`, { const response = await fetch(`${API_BASE_URL}/api/tobuy/add`, {
method: 'POST', method: 'POST',
headers: getHeaders(), headers: getHeaders(),
@ -145,8 +145,8 @@ export const toBuyApi = {
// return { // return {
// "result": true, // "result": true,
// "tobuy_id": 1, // "tobuyId": 1,
// "stuff_id": 6, // "stuffId": 6,
// "message": "追加に成功しました", // "message": "追加に成功しました",
// } // }
@ -156,11 +156,11 @@ export const toBuyApi = {
* 買うものリストを削除 * 買うものリストを削除
* @param id 削除対象の買うものリストID * @param id 削除対象の買うものリストID
*/ */
deleteToBuy: async (tobuy_id: number): Promise<{ result: boolean }> => { deleteToBuy: async (tobuyId: number): Promise<{ result: boolean }> => {
const response = await fetch(`${API_BASE_URL}/api/tobuy/delete`, { const response = await fetch(`${API_BASE_URL}/api/tobuy/delete`, {
method: 'DELETE', method: 'DELETE',
headers: getHeaders(), headers: getHeaders(),
body: JSON.stringify({tobuy_id}), body: JSON.stringify({tobuyId}),
}); });
if (!response.ok) { if (!response.ok) {
@ -178,35 +178,35 @@ export const toBuyApi = {
export const stuffApi = { export const stuffApi = {
getStuffs: async (category: string): Promise<{ stuff_array: Stuff[] }> => { getStuffs: async (category: string): Promise<{ stuff_array: Stuff[] }> => {
const data = [ const data = [
{ "stuff_id": 1, "stuff_name": "牛乳", "category": "乳製品" }, { stuffId: 1, stuffName: "牛乳", category: "乳製品" },
{ "stuff_id": 2, "stuff_name": "ヨーグルト", "category": "乳製品" }, { stuffId: 2, stuffName: "ヨーグルト", category: "乳製品" },
{ "stuff_id": 3, "stuff_name": "チーズ", "category": "乳製品" }, { stuffId: 3, stuffName: "チーズ", category: "乳製品" },
{ "stuff_id": 4, "stuff_name": "バター", "category": "乳製品" }, { stuffId: 4, stuffName: "バター", category: "乳製品" },
{ "stuff_id": 5, "stuff_name": "生クリーム", "category": "乳製品" }, { stuffId: 5, stuffName: "生クリーム", category: "乳製品" },
{ "stuff_id": 6, "stuff_name": "鮭", "category": "魚・肉" }, { stuffId: 6, stuffName: "鮭", category: "魚・肉" },
{ "stuff_id": 7, "stuff_name": "鶏むね肉", "category": "魚・肉" }, { stuffId: 7, stuffName: "鶏むね肉", category: "魚・肉" },
{ "stuff_id": 8, "stuff_name": "豚バラ肉", "category": "魚・肉" }, { stuffId: 8, stuffName: "豚バラ肉", category: "魚・肉" },
{ "stuff_id": 9, "stuff_name": "牛ひき肉", "category": "魚・肉" }, { stuffId: 9, stuffName: "牛ひき肉", category: "魚・肉" },
{ "stuff_id": 10, "stuff_name": "まぐろ", "category": "魚・肉" }, { stuffId: 10, stuffName: "まぐろ", category: "魚・肉" },
{ "stuff_id": 11, "stuff_name": "にんじん", "category": "野菜" }, { stuffId: 11, stuffName: "にんじん", category: "野菜" },
{ "stuff_id": 12, "stuff_name": "キャベツ", "category": "野菜" }, { stuffId: 12, stuffName: "キャベツ", category: "野菜" },
{ "stuff_id": 13, "stuff_name": "ほうれん草", "category": "野菜" }, { stuffId: 13, stuffName: "ほうれん草", category: "野菜" },
{ "stuff_id": 14, "stuff_name": "玉ねぎ", "category": "野菜" }, { stuffId: 14, stuffName: "玉ねぎ", category: "野菜" },
{ "stuff_id": 15, "stuff_name": "ピーマン", "category": "野菜" }, { stuffId: 15, stuffName: "ピーマン", category: "野菜" },
{ "stuff_id": 16, "stuff_name": "醤油", "category": "調味料" }, { stuffId: 16, stuffName: "醤油", category: "調味料" },
{ "stuff_id": 17, "stuff_name": "味噌", "category": "調味料" }, { stuffId: 17, stuffName: "味噌", category: "調味料" },
{ "stuff_id": 18, "stuff_name": "塩", "category": "調味料" }, { stuffId: 18, stuffName: "塩", category: "調味料" },
{ "stuff_id": 19, "stuff_name": "砂糖", "category": "調味料" }, { stuffId: 19, stuffName: "砂糖", category: "調味料" },
{ "stuff_id": 20, "stuff_name": "酢", "category": "調味料" }, { stuffId: 20, stuffName: "酢", category: "調味料" },
{ "stuff_id": 21, "stuff_name": "米", "category": "その他" }, { stuffId: 21, stuffName: "米", category: "その他" },
{ "stuff_id": 22, "stuff_name": "パスタ", "category": "その他" }, { stuffId: 22, stuffName: "パスタ", category: "その他" },
{ "stuff_id": 23, "stuff_name": "小麦粉", "category": "その他" }, { stuffId: 23, stuffName: "小麦粉", category: "その他" },
{ "stuff_id": 24, "stuff_name": "卵", "category": "その他" }, { stuffId: 24, stuffName: "卵", category: "その他" },
{ "stuff_id": 25, "stuff_name": "豆腐", "category": "その他" } { stuffId: 25, stuffName: "豆腐", category: "その他" }
] ]
const filtered = data.filter(stuff => stuff.category == category) const filtered = data.filter(stuff => stuff.category == category)
@ -237,25 +237,25 @@ export const stockApi = {
return { return {
"stock_array": [ "stock_array": [
{ {
"stock_id": 1, "stockId": 1,
"stuff_id": 10, "stuffId": 10,
"stuff_name": "豚肉", "stuffName": "豚肉",
"amount": 100, "amount": 100,
"price": 200, "price": 200,
"buy_date": "2025-05-18T09:00:00.000Z", "buyDate": "2025-05-18T09:00:00.000Z",
"last_update": "2025-05-18T09:00:00.000Z", "lastUpdate": "2025-05-18T09:00:00.000Z",
"exp_date": "2025-05-19T10:15:00.000Z", "expDate": "2025-05-19T10:15:00.000Z",
"category": "肉" "category": "肉"
}, },
{ {
"stock_id": 2, "stockId": 2,
"stuff_id": 1, "stuffId": 1,
"stuff_name": "トマト", "stuffName": "トマト",
"amount": 10, "amount": 10,
"price": 200, "price": 200,
"buy_date": "2025-05-18T09:00:00.000Z", "buyDate": "2025-05-18T09:00:00.000Z",
"last_update": "2025-05-18T09:00:00.000Z", "lastUpdate": "2025-05-18T09:00:00.000Z",
"exp_date": "2025-05-19T10:15:00.000Z", "expDate": "2025-05-19T10:15:00.000Z",
"category": "野菜" "category": "野菜"
} }
] ]

22
frontend/src/types/types.ts
Unescape View File

@ -22,16 +22,16 @@ export interface Task {
* タスクの基本情報と状態を管理 * タスクの基本情報と状態を管理
*/ */
export interface ToBuy { export interface ToBuy {
tobuy_id: number, tobuyId: number,
stuff_id: number, stuffId: number,
stuff_name: string, stuffName: string,
amount: number, amount: number,
shop?: string, shop?: string,
} }
export interface Stuff { export interface Stuff {
stuff_id: number, stuffId: number,
stuff_name: string, stuffName: string,
category: string, category: string,
} }
@ -40,14 +40,14 @@ export interface Stuff {
* タスクの基本情報と状態を管理 * タスクの基本情報と状態を管理
*/ */
export interface Stock { export interface Stock {
stock_id: number, stockId: number,
stuff_id: number, stuffId: number,
stuff_name: string, stuffName: string,
amount: number, amount: number,
price: number, price: number,
buy_date: string, buyDate: string,
last_update: string, lastUpdate: string,
exp_date: string, expDate: string,
category: string, category: string,
} }

Write Preview
Loading…
Cancel
Save