From 587bf6c8ddaa528a221ae68874b194d8cc141da0 Mon Sep 17 00:00:00 2001
From: zhangchen <1652267879@qq.com>
Date: 星期四, 24 七月 2025 23:49:23 +0800
Subject: [PATCH] ID1625-定时任务暂存
---
src/views/mobile/bedsideAuxiliaryScreen/components/ScheduledTask.vue | 84 ++++++++++++++++++++++++++++++++++++-----
src/views/mobile/bedsideAuxiliaryScreen/components/TimePicker.vue | 22 ++++++++++
2 files changed, 94 insertions(+), 12 deletions(-)
diff --git a/src/views/mobile/bedsideAuxiliaryScreen/components/ScheduledTask.vue b/src/views/mobile/bedsideAuxiliaryScreen/components/ScheduledTask.vue
index f284fa8..96a2c1a 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/components/ScheduledTask.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/components/ScheduledTask.vue
@@ -6,6 +6,8 @@
title="定时任务"
width="80%"
:show-close="false"
+ class="scheduled-task-dialog"
+ top="0"
>
<template #header>
<div class="scheduled-task-header">
@@ -22,7 +24,16 @@
<div class="content-left">
<div class="content-left-date">
<TimePicker v-model="timeValue" />
- <div class="date-btn"></div>
+ <div class="date-btn">
+ <div
+ v-for="(item, index) in dateOptions"
+ :key="index"
+ class="my-button date"
+ @click="onAddMinutesClick(item)"
+ >
+ {{ item.label }}
+ </div>
+ </div>
</div>
<div class="content-left-stereotyped-writing">
<div class="stereotyped-writing">
@@ -60,7 +71,7 @@
<script lang="ts" setup>
import { computed, ref } from "vue";
// @ts-ignore
-import TimePicker from './TimePicker.vue'
+import TimePicker from "./TimePicker.vue";
import closeImg from "@/img/close.png";
import alertbaojin from "@/assets/alert.wav";
@@ -79,8 +90,8 @@
}
interface DateItem {
- label: string;
- value: number;
+ label: string;
+ value: number;
}
const isShow = ref(false);
@@ -88,7 +99,7 @@
const taskName = ref(""); // 任务名称
const isInpDisabled = ref(false); // 输入框是否禁用
-const timeValue = ref('19:16');
+const timeValue = ref("19:16");
const detaCheck = ref<number | null>(); // 这个是判断时间按钮的
@@ -131,12 +142,11 @@
},
]);
-
const dateOptions = ref<DateItem[]>([
- { label: '15分钟', value: 15 },
- { label: '30分钟', value: 30 },
- { label: '45分钟', value: 45 },
- { label: '60分钟', value: 60 },
+ { label: "15分钟", value: 15 },
+ { label: "30分钟", value: 30 },
+ { label: "45分钟", value: 45 },
+ { label: "60分钟", value: 60 },
]);
const taskItemCheck = computed(() => {
@@ -155,6 +165,32 @@
taskName.value = item.value;
isInpDisabled.value = true;
}
+};
+
+const onAddMinutesClick = (item: DateItem) => {
+ // if (detaCheck.value === item.value) {
+ // detaCheck.value = null;
+ // timeValue.value = addMinutes(timeValue.value, -item.value)
+ // } else {
+ detaCheck.value = item.value;
+ timeValue.value = addMinutes(timeValue.value, item.value);
+ // console.log('addMinutes(timeValue.value, item.value): ', addMinutes(timeValue.value, item.value))
+ // }
+};
+
+const addMinutes = (time: string, delta: number): string => {
+ const [hours, minutes] = time.split(":").map(Number);
+ const totalMinutes = hours * 60 + minutes + delta;
+
+ // 处理负数和超过 1440（一天分钟数）情况
+ const normalized = (totalMinutes + 1440) % 1440;
+
+ const newHours = Math.floor(normalized / 60);
+ const newMinutes = normalized % 60;
+
+ return `${newHours.toString().padStart(2, "0")}:${newMinutes
+ .toString()
+ .padStart(2, "0")}`;
};
const handleCancel = () => {
@@ -237,7 +273,26 @@
padding-right: 12px;
.content-left-date {
border-bottom: 1px solid #d8d8d8;
-
+ display: flex;
+
+ .date-btn {
+ flex: 1;
+ display: flex;
+ flex-wrap: wrap;
+ gap: 9px;
+ margin-left: 5px;
+ justify-content: flex-end;
+ .date {
+ margin-left: 0;
+ padding: 0;
+ width: 50px;
+ height: 23px;
+ line-height: 23px;
+ text-align: center;
+ font-size: 11px;
+ background-color: #769aff;
+ }
+ }
}
.content-left-stereotyped-writing {
.stereotyped-writing {
@@ -331,4 +386,11 @@
}
}
}
+</style>
+<style>
+.scheduled-task-dialog {
+ margin: 0 auto;
+ top: 50% !important;
+ transform: translateY(-50%) !important;
+}
</style>
\ No newline at end of file
diff --git a/src/views/mobile/bedsideAuxiliaryScreen/components/TimePicker.vue b/src/views/mobile/bedsideAuxiliaryScreen/components/TimePicker.vue
index 4a18241..1f1376f 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/components/TimePicker.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/components/TimePicker.vue
@@ -89,6 +89,27 @@
}
);
+watch(
+ () => props.modelValue,
+ (newVal) => {
+ const [h, m] = newVal.split(":").map(Number);
+ const hourIdx = hours.indexOf(h);
+ const minuteIdx = minutes.indexOf(m);
+
+ if (hourIdx !== -1) {
+ selectedIndexHour.value = hourIdx + 2;
+ selectedHour.value = h;
+ scrollToSelected("hour", selectedIndexHour.value);
+ }
+
+ if (minuteIdx !== -1) {
+ selectedIndexMinute.value = minuteIdx + 2;
+ selectedMinute.value = m;
+ scrollToSelected("minute", selectedIndexMinute.value);
+ }
+ }
+);
+
function onScroll(type: "hour" | "minute") {
if (isProgrammaticScroll[type]) {
// 程序滚动，忽略，避免死循环
@@ -186,7 +207,6 @@
user-select: none;
cursor: pointer;
transition: color 0.3s ease, font-size 0.3s ease;
-
&.active {
font-size: 0.5rem;
--
Gitblit v1.8.0