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

OS標準のカレンダー設定

Browse Source
feature-frontend-stock-suzuki-ver3
akito.nishiwaki 4 months ago
parent 1f968f1943
commit 4c14bcde41
2 changed files with 110 additions and 38 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. 69
      frontend/src/components/BuyDialog.tsx
  2. 79
      frontend/src/pages/StockPage.tsx

69
frontend/src/components/BuyDialog.tsx
Unescape View File

@ -9,19 +9,19 @@ import {
Box,
} from '@mui/material';
import { NewStock } from '../types/types';
import DatePicker, { registerLocale } from 'react-datepicker';
import { ja } from 'date-fns/locale/ja'; // date-fnsの日本語ロケールをインポート
/*import DatePicker, { registerLocale } from 'react-datepicker';
import { ja } from 'date-fns/locale/ja'; // date-fnsの日本語ロケールをインポート*/
// 日付をyyyy-MM-dd形式で返す関数
/*// 日付をyyyy-MM-dd形式で返す関数
const formatDateLocal = (date: Date) => {
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
return `${year}-${month}-${day}`;
};
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
return `${year}-${month}-${day}`;
};*/
// 日本語ロケールを登録
registerLocale('ja', ja);
//registerLocale('ja', ja);
const BuyDialog = ({
openDialog,
@ -38,12 +38,12 @@ const BuyDialog = ({
setNewStock: (tobuy: NewStock) => void,
onSubmit: () => void,
}) => {
return (
<Dialog open={openDialog} onClose={() => setOpenDialog(false)} disableScrollLock={true} PaperProps={{ sx: { minHeight: '600px', maxHeight: '80vh' } }}
>
>
<DialogTitle>在庫登録</DialogTitle>
<DialogContent>
<Box sx={{ pt: 1 }}>
@ -54,7 +54,7 @@ const BuyDialog = ({
fullWidth
value={stuffName}
disabled
sx={{ marginBottom: 2 , marginTop: 2}}
sx={{ marginBottom: 2, marginTop: 2 }}
/>
{/* 価格入力フィールド */}
@ -75,7 +75,18 @@ const BuyDialog = ({
{/* 購入日・消費期限を横並びに */}
<Box sx={{ display: 'flex', gap: 2, mb: 2 }}>
{/* 購入日入力フィールド */}
<DatePicker
<TextField
margin="dense"
label="購入日"
type="date"
fullWidth
value={newStock.buyDate ? newStock.buyDate.substring(0, 10) : ''}
onChange={(e) =>
setNewStock({ ...newStock, buyDate: e.target.value })
}
InputLabelProps={{ shrink: true }}
/>
{/*<DatePicker
popperClassName="custom-datepicker-popper"
selected={newStock.buyDate ? new Date(newStock.buyDate) : null}
onChange={(date) =>
@ -91,18 +102,26 @@ const BuyDialog = ({
}
isClearable
//withPortal // ← 他の文字との重なり対策
/>
{/*
<TextField
margin="dense"
label="購入日(yyyy/MM/dd)"
fullWidth
value={newStock.buyDate}
onChange={(e) => setNewStock({ ...newStock, buyDate: e.target.value })}
/>
*/}
/>*/}
{/* 消費・賞味期限入力フィールド */}
<DatePicker
<TextField
margin="dense"
label="消費・賞味期限"
type="date"
fullWidth
value={newStock.expDate ? newStock.expDate.substring(0, 10) : ''}
onChange={(e) =>
setNewStock({ ...newStock, expDate: e.target.value })
}
InputLabelProps={{ shrink: true }}
InputProps={{
inputProps: {
min: newStock.buyDate ? newStock.buyDate.substring(0, 10) : undefined,
}
}}
/>
{/*<DatePicker
popperClassName="custom-datepicker-popper"
selected={newStock.expDate ? new Date(newStock.expDate) : null}
onChange={(date) =>
@ -118,7 +137,7 @@ const BuyDialog = ({
}
isClearable
//withPortal
/>
/>*/}
</Box>
{/* 購入店舗入力フィールド */}
{/* TODO: 実装 */}

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

@ -27,17 +27,17 @@ import {
MenuItem,
} from '@mui/material';
import { STOCK_ERRORS } from '../constants/errorMessages';
import DatePicker, { registerLocale } from 'react-datepicker';
import { ja } from 'date-fns/locale/ja'; // date-fnsの日本語ロケールをインポート
/*import DatePicker, { registerLocale } from 'react-datepicker';
import { ja } from 'date-fns/locale/ja'; // date-fnsの日本語ロケールをインポート*/
import { useMessage } from '../components/MessageContext';
// 日付をyyyy-MM-dd形式で返す関数
/*// 日付をyyyy-MM-dd形式で返す関数
const formatDateLocal = (date: Date) => {
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
return `${year}-${month}-${day}`;
};
};*/
// 新規在庫の初期状態
const EMPTY_STOCK: Omit<Stock, 'stockId' | 'stuffId'> & { stuffId: number | null } & { newAddition: boolean } = {
@ -54,7 +54,7 @@ const EMPTY_STOCK: Omit<Stock, 'stockId' | 'stuffId'> & { stuffId: number | null
}
// 日本語ロケールを登録
registerLocale('ja', ja);
//registerLocale('ja', ja);
const StockPage: React.FC = () => {
@ -380,7 +380,17 @@ const StockPage: React.FC = () => {
{/* 購入日・消費期限を横並びに */}
<Box sx={{ display: 'flex', gap: 2, mb: 2 }}>
{/* 購入日 */}
<DatePicker
<TextField
margin="normal"
label="購入日"
type="date"
fullWidth
name="buyDate"
value={editStock.buyDate ? editStock.buyDate.substring(0, 10) : ''}
onChange={(e) => setEditStock({ ...editStock, buyDate: e.target.value })}
InputLabelProps={{ shrink: true }}
/>
{/*<DatePicker
selected={editStock.buyDate ? new Date(editStock.buyDate) : null}
onChange={(date) => {
if (editStock) {
@ -400,9 +410,25 @@ const StockPage: React.FC = () => {
/>
}
isClearable
/>
/>*/}
{/* 消費・賞味期限 */}
<DatePicker
<TextField
margin="normal"
label="消費・賞味期限"
type="date"
fullWidth
name="expDate"
value={editStock.expDate ? editStock.expDate.substring(0, 10) : ''}
onChange={(e) => setEditStock({ ...editStock, expDate: e.target.value })}
InputLabelProps={{ shrink: true }}
InputProps={{
inputProps: {
min: newStock.buyDate ? newStock.buyDate.substring(0, 10) : undefined,
}
}}
/>
{/*<DatePicker
selected={editStock.expDate ? new Date(editStock.expDate) : null}
onChange={(date) => {
if (editStock) {
@ -422,7 +448,7 @@ const StockPage: React.FC = () => {
/>
}
isClearable
/>
/>*/}
</Box>
<Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 2, mt: 3, mb: 2 }}>
<Button onClick={() => { setIsEditOpen(false); setSelectedRow(null); }}>
@ -601,7 +627,18 @@ const StockPage: React.FC = () => {
{/* 購入日・消費期限を横並びに */}
<Box sx={{ display: 'flex', gap: 2, mb: 2 }}>
{/* 購入日入力フィールド */}
<DatePicker
<TextField
margin="dense"
label="購入日"
type="date"
fullWidth
value={newStock.buyDate ? newStock.buyDate.substring(0, 10) : ''}
onChange={(e) =>
setNewStock({ ...newStock, buyDate: e.target.value })
}
InputLabelProps={{ shrink: true }}
/>
{/*<DatePicker
popperClassName="custom-datepicker-popper"
selected={newStock.buyDate ? new Date(newStock.buyDate) : null}
onChange={(date) =>
@ -617,9 +654,25 @@ const StockPage: React.FC = () => {
}
isClearable
//withPortal // ← 他の文字との重なり対策
/>
/>*/}
{/* 消費・賞味期限入力フィールド */}
<DatePicker
<TextField
margin="dense"
label="消費・賞味期限"
type="date"
fullWidth
value={newStock.expDate ? newStock.expDate.substring(0, 10) : ''}
onChange={(e) =>
setNewStock({ ...newStock, expDate: e.target.value })
}
InputLabelProps={{ shrink: true }}
InputProps={{
inputProps: {
min: newStock.buyDate ? newStock.buyDate.substring(0, 10) : undefined,
}
}}
/>
{/*<DatePicker
popperClassName="custom-datepicker-popper"
selected={newStock.expDate ? new Date(newStock.expDate) : null}
onChange={(date) =>
@ -635,7 +688,7 @@ const StockPage: React.FC = () => {
}
isClearable
//withPortal
/>
/>*/}
</Box>
</Box>
</DialogContent>

Write Preview
Loading…
Cancel
Save