Bug修复和功能增加
1.修复了自慰日历显示不准的Bug。 2.增加了记录当中的暂停功能,现在你可以进行寸止挑战了。
This commit is contained in:
parent
9c9a245e78
commit
7eddb0b5de
@ -18,26 +18,32 @@ import TimerIcon from '@mui/icons-material/Timer';
|
|||||||
export const RecordForm = () => {
|
export const RecordForm = () => {
|
||||||
// 记录状态:是否正在记录中
|
// 记录状态:是否正在记录中
|
||||||
const [isRecording, setIsRecording] = useState(false);
|
const [isRecording, setIsRecording] = useState(false);
|
||||||
|
// 是否暂停中
|
||||||
|
const [isPaused, setIsPaused] = useState(false);
|
||||||
// 开始时间
|
// 开始时间
|
||||||
const [startTime, setStartTime] = useState<Date | null>(null);
|
const [startTime, setStartTime] = useState<Date | null>(null);
|
||||||
// 已经过的时间(秒)
|
// 已经过的时间(秒)
|
||||||
const [elapsedTime, setElapsedTime] = useState(0);
|
const [elapsedTime, setElapsedTime] = useState(0);
|
||||||
|
// 暂停时累计的时间(毫秒)
|
||||||
|
const [accumulatedTime, setAccumulatedTime] = useState(0);
|
||||||
|
// 上次暂停的时间
|
||||||
|
const [lastPauseTime, setLastPauseTime] = useState<Date | null>(null);
|
||||||
// 备注信息
|
// 备注信息
|
||||||
const [notes, setNotes] = useState('');
|
const [notes, setNotes] = useState('');
|
||||||
|
|
||||||
// 计时器效果:每秒更新已经过的时间
|
// 计时器效果:每秒更新已经过的时间
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let intervalId: number;
|
let intervalId: number;
|
||||||
if (isRecording && startTime) {
|
if (isRecording && startTime && !isPaused) {
|
||||||
intervalId = window.setInterval(() => {
|
intervalId = window.setInterval(() => {
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
const elapsed = Math.floor((now.getTime() - startTime.getTime()) / 1000);
|
const elapsed = Math.floor((now.getTime() - startTime.getTime() - accumulatedTime) / 1000);
|
||||||
setElapsedTime(elapsed);
|
setElapsedTime(elapsed);
|
||||||
}, 1000);
|
}, 1000);
|
||||||
}
|
}
|
||||||
// 清理定时器
|
// 清理定时器
|
||||||
return () => clearInterval(intervalId);
|
return () => clearInterval(intervalId);
|
||||||
}, [isRecording, startTime]);
|
}, [isRecording, startTime, isPaused, accumulatedTime]);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 处理开始/停止按钮点击
|
* 处理开始/停止按钮点击
|
||||||
@ -49,12 +55,17 @@ export const RecordForm = () => {
|
|||||||
// 开始记录
|
// 开始记录
|
||||||
setStartTime(new Date());
|
setStartTime(new Date());
|
||||||
setIsRecording(true);
|
setIsRecording(true);
|
||||||
|
setIsPaused(false);
|
||||||
|
setAccumulatedTime(0);
|
||||||
|
setLastPauseTime(null);
|
||||||
} else {
|
} else {
|
||||||
// 停止记录
|
// 停止记录
|
||||||
setIsRecording(false);
|
setIsRecording(false);
|
||||||
|
setIsPaused(false);
|
||||||
if (startTime) {
|
if (startTime) {
|
||||||
const endTime = new Date();
|
const endTime = new Date();
|
||||||
const durationInMinutes = (endTime.getTime() - startTime.getTime()) / (1000 * 60);
|
const totalPausedTime = accumulatedTime + (lastPauseTime ? endTime.getTime() - lastPauseTime.getTime() : 0);
|
||||||
|
const durationInMinutes = (endTime.getTime() - startTime.getTime() - totalPausedTime) / (1000 * 60);
|
||||||
|
|
||||||
// 创建记录对象
|
// 创建记录对象
|
||||||
const record = {
|
const record = {
|
||||||
@ -68,6 +79,8 @@ export const RecordForm = () => {
|
|||||||
StorageService.saveRecord(record);
|
StorageService.saveRecord(record);
|
||||||
setStartTime(null);
|
setStartTime(null);
|
||||||
setElapsedTime(0);
|
setElapsedTime(0);
|
||||||
|
setAccumulatedTime(0);
|
||||||
|
setLastPauseTime(null);
|
||||||
setNotes('');
|
setNotes('');
|
||||||
|
|
||||||
// 触发自定义事件通知数据更新
|
// 触发自定义事件通知数据更新
|
||||||
@ -77,6 +90,27 @@ export const RecordForm = () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 处理暂停/继续按钮点击
|
||||||
|
*/
|
||||||
|
const handlePause = () => {
|
||||||
|
if (!isRecording) return;
|
||||||
|
|
||||||
|
if (!isPaused) {
|
||||||
|
// 暂停计时
|
||||||
|
setIsPaused(true);
|
||||||
|
setLastPauseTime(new Date());
|
||||||
|
} else {
|
||||||
|
// 继续计时
|
||||||
|
setIsPaused(false);
|
||||||
|
if (lastPauseTime) {
|
||||||
|
const now = new Date();
|
||||||
|
setAccumulatedTime(prev => prev + (now.getTime() - lastPauseTime.getTime()));
|
||||||
|
setLastPauseTime(null);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 格式化时间显示
|
* 格式化时间显示
|
||||||
* @param seconds 秒数
|
* @param seconds 秒数
|
||||||
@ -166,6 +200,7 @@ export const RecordForm = () => {
|
|||||||
<Typography variant="h4" color="text.secondary" sx={{ mb: 2 }}>
|
<Typography variant="h4" color="text.secondary" sx={{ mb: 2 }}>
|
||||||
{isRecording ? formatTime(elapsedTime) : '准备开始'}
|
{isRecording ? formatTime(elapsedTime) : '准备开始'}
|
||||||
</Typography>
|
</Typography>
|
||||||
|
<Stack direction="row" spacing={2}>
|
||||||
<Button
|
<Button
|
||||||
variant="contained"
|
variant="contained"
|
||||||
size="large"
|
size="large"
|
||||||
@ -176,6 +211,19 @@ export const RecordForm = () => {
|
|||||||
>
|
>
|
||||||
{isRecording ? '结束' : '开始'}
|
{isRecording ? '结束' : '开始'}
|
||||||
</Button>
|
</Button>
|
||||||
|
{isRecording && (
|
||||||
|
<Button
|
||||||
|
variant="contained"
|
||||||
|
size="large"
|
||||||
|
onClick={handlePause}
|
||||||
|
startIcon={isPaused ? <PlayArrowIcon /> : <TimerIcon />}
|
||||||
|
color="warning"
|
||||||
|
sx={{ borderRadius: 28, px: 4, py: 1.5 }}
|
||||||
|
>
|
||||||
|
{isPaused ? '继续' : '暂停'}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
</Stack>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
<TextField
|
<TextField
|
||||||
|
@ -96,10 +96,11 @@ export const StatsChart = () => {
|
|||||||
const recordDate = new Date(record.startTime);
|
const recordDate = new Date(record.startTime);
|
||||||
if (recordDate >= startDate) {
|
if (recordDate >= startDate) {
|
||||||
const daysSince = Math.floor((now.getTime() - recordDate.getTime()) / (1000 * 60 * 60 * 24));
|
const daysSince = Math.floor((now.getTime() - recordDate.getTime()) / (1000 * 60 * 60 * 24));
|
||||||
const weekIndex = Math.floor(daysSince / 7);
|
const weekIndex = WEEKS_TO_SHOW - 1 - Math.floor(daysSince / 7);
|
||||||
let dayIndex = recordDate.getDay() - 1;
|
let dayIndex = recordDate.getDay();
|
||||||
if (dayIndex === -1) dayIndex = 6; // 将周日从0改为6
|
if (dayIndex === 0) dayIndex = 6; // 将周日从0改为6
|
||||||
if (weekIndex < WEEKS_TO_SHOW) {
|
else dayIndex -= 1; // 其他日期减1,使周一为0
|
||||||
|
if (weekIndex >= 0 && weekIndex < WEEKS_TO_SHOW) {
|
||||||
contributionData[weekIndex][dayIndex]++;
|
contributionData[weekIndex][dayIndex]++;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user