|
|
|
@ -20,7 +20,7 @@ import { |
|
|
|
|
Box, |
|
|
|
|
|
|
|
|
|
} from '@mui/material'; |
|
|
|
|
import { TASK_ERRORS } from '../constants/errorMessages'; |
|
|
|
|
import { STOCK_ERRORS } from '../constants/errorMessages'; |
|
|
|
|
|
|
|
|
|
const StockPage: React.FC = () => { |
|
|
|
|
|
|
|
|
@ -47,9 +47,10 @@ const StockPage: React.FC = () => { |
|
|
|
|
const fetchStocks = async () => { |
|
|
|
|
try { |
|
|
|
|
const stocks = await stockApi.getStocks(); |
|
|
|
|
console.log('Stocks=', stocks) |
|
|
|
|
setStocks(stocks); |
|
|
|
|
} catch (error) { |
|
|
|
|
console.error(`${TASK_ERRORS.FETCH_FAILED}:`, error); |
|
|
|
|
console.error(`${STOCK_ERRORS.FETCH_FAILED}:`, error); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
@ -156,12 +157,12 @@ const StockPage: React.FC = () => { |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<Typography variant="h4" component="h1" gutterBottom> |
|
|
|
|
肉・魚 |
|
|
|
|
魚・肉 |
|
|
|
|
</Typography> |
|
|
|
|
{/* 肉・魚一覧表示エリア - 青い背景のコンテナ */} |
|
|
|
|
{/* 魚・肉一覧表示エリア - 青い背景のコンテナ */} |
|
|
|
|
<div style={{ border: '3px solid black', borderRadius: '8px', backgroundColor: '#add8e6', height: 'auto', padding: '20px', marginBottom: "20px" }}> |
|
|
|
|
|
|
|
|
|
{stocks.filter(stock => stock.category == "肉" || stock.category == "魚").length === 0 ? null : ( |
|
|
|
|
{stocks.filter(stock => stock.category == "魚・肉").length === 0 ? null : ( |
|
|
|
|
<TableContainer component={Paper}> |
|
|
|
|
<Table> |
|
|
|
|
<TableHead sx={{ backgroundColor: "#dcdcdc", color: "#333" }}> |
|
|
|
@ -175,7 +176,7 @@ const StockPage: React.FC = () => { |
|
|
|
|
</TableHead> |
|
|
|
|
<TableBody> |
|
|
|
|
{stocks |
|
|
|
|
.filter(stock => stock.category == "肉" || stock.category == "魚") // 肉と魚だけ抽出
|
|
|
|
|
.filter(stock => stock.category == "魚・肉") // 「魚・肉」だけ抽出
|
|
|
|
|
.map(stock => ( |
|
|
|
|
<TableRow |
|
|
|
|
key={stock.stockId} |
|
|
|
|