@@ -329,19 +351,21 @@ onMounted(()=>{
- {{ eventData.start }}
+ {{ splicingDataWeek(eventData.start) }}
{{ t("schedule.to") }}
- {{ eventData.end }}
+ {{
+ splicingDataWeek(
+ eventData.start === eventData.end
+ ? eventData.end
+ : DateUtils.toRealEnd(eventData.end),
+ )
+ }}
-
-
+
+
diff --git a/frontend/ops_vue_js/src/composables/useDateUtils.js b/frontend/ops_vue_js/src/composables/useDateUtils.js
new file mode 100644
index 0000000..2e7cc40
--- /dev/null
+++ b/frontend/ops_vue_js/src/composables/useDateUtils.js
@@ -0,0 +1,65 @@
+// composables/useDateUtils.js
+import { useI18n } from "vue-i18n";
+
+/**
+ * 日期字符串 转 日期对象 (纯日期,无时间)
+ * @param {string} dateStr - 格式:YYYY-MM-DD 例如 "2026-04-02"
+ * @returns {Date} 日期对象(时间自动设为 00:00:00)
+ */
+export function strToDate(dateStr) {
+ return new Date(dateStr);
+}
+
+/**
+ * 日期对象 转回 日期字符串 (YYYY-MM-DD)
+ * @param {Date} date - 日期对象
+ * @returns {string} 格式:YYYY-MM-DD
+ */
+export function dateToStr(date) {
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, "0");
+ const day = String(date.getDate()).padStart(2, "0");
+ return `${year}-${month}-${day}`;
+}
+
+// 封装成组合式函数,方便在组件中按需引入
+export const useDateUtils = () => {
+ const { t } = useI18n();
+ return {
+ strToDate,
+ dateToStr,
+ // 可以直接把 FullCalendar 常用的日期处理也封装进来
+ /**
+ * FullCalendar 显示用:给结束日期 +1 天(包含当天)
+ * @param {string | Date} endDate - 真实结束日期
+ * @returns {Date} FullCalendar 可用的 end 日期
+ */
+ toCalendarEnd: (endDate) => {
+ const date =
+ typeof endDate === "string" ? strToDate(endDate) : new Date(endDate);
+ date.setDate(date.getDate() + 1);
+ return date;
+ },
+ /**
+ * 提交数据库用:给 FullCalendar end 日期 -1 天(还原真实结束日)
+ * @param {Date} calendarEnd - FullCalendar 返回的 end 日期
+ * @returns {string} 可存库的 YYYY-MM-DD 字符串
+ */
+ toRealEnd: (calendarEnd) => {
+ const date = new Date(calendarEnd);
+ date.setDate(date.getDate() - 1);
+ return dateToStr(date);
+ },
+ /**
+ * 获取日期是星期几
+ * @param {string | Date} date - YYYY-MM-DD 或 Date 对象
+ * @returns {string} 星期一、星期二...星期日
+ */
+ getI18nWeekday(date) {
+ const d = typeof date === "string" ? strToDate(date) : new Date(date);
+ const weekKeys = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
+ const key = weekKeys[d.getDay()];
+ return t(`week.${key}`); // 自动切换中英文
+ },
+ };
+};
diff --git a/frontend/ops_vue_js/src/i18n/en.json b/frontend/ops_vue_js/src/i18n/en.json
index de8b56c..460dc62 100644
--- a/frontend/ops_vue_js/src/i18n/en.json
+++ b/frontend/ops_vue_js/src/i18n/en.json
@@ -1,4 +1,13 @@
{
+ "week": {
+ "sun": "Sunday",
+ "mon": "Monday",
+ "tue": "Tuesday",
+ "wed": "Wednesday",
+ "thu": "Thursday",
+ "fri": "Friday",
+ "sat": "Saturday"
+ },
"errorpage": {
"404_title": "404 Resource Not Found",
"404_msg_title": "Oops… You just found an error page",
diff --git a/frontend/ops_vue_js/src/i18n/zh-CN.json b/frontend/ops_vue_js/src/i18n/zh-CN.json
index cfd7d82..a6de0b1 100644
--- a/frontend/ops_vue_js/src/i18n/zh-CN.json
+++ b/frontend/ops_vue_js/src/i18n/zh-CN.json
@@ -1,4 +1,13 @@
{
+ "week": {
+ "sun": "星期日",
+ "mon": "星期一",
+ "tue": "星期二",
+ "wed": "星期三",
+ "thu": "星期四",
+ "fri": "星期五",
+ "sat": "星期六"
+ },
"errorpage": {
"404_title": "404 资源未找到",
"404_msg_title": "抱歉…您刚刚发现了一个错误页面",
diff --git a/frontend/ops_vue_js/src/views/scheduleView.vue b/frontend/ops_vue_js/src/views/scheduleView.vue
index 03a3a5f..8a16c7d 100644
--- a/frontend/ops_vue_js/src/views/scheduleView.vue
+++ b/frontend/ops_vue_js/src/views/scheduleView.vue
@@ -181,7 +181,7 @@ const calendarOptions = ref({
handleDoubleClick(info);
} else {
console.log("单击日期:", info.dateStr);
- // 单击功能:显示日期详情
+ // 单击功能:
handleSingleClick(info);
}
@@ -194,9 +194,10 @@ const calendarOptions = ref({
if (info.end - info.start > 86400000) {
//选择了多日
console.log("选择了多日:", info);
+ openEventModal(info.startStr,info.endStr);
} else {
- //选择单日
- console.log("选择单日:", info);
+ //选择单日 无功能
+ //console.log("选择单日:", info);
}
},
@@ -222,11 +223,11 @@ const calendarOptions = ref({
});
// 打开模态框
-const openEventModal = (dateStr) => {
+const openEventModal = (dateStr,dataEnd) => {
eventData.value = {
title: "",
startDate: dateStr,
- endDate: dateStr,
+ endDate: dataEnd,
color: "#066FD1",
};
@@ -240,7 +241,7 @@ const closeEventModal = () => {
// 处理双击事件:打开模态框添加事件
const handleDoubleClick = (info) => {
- openEventModal(info.dateStr);
+ openEventModal(info.dateStr,info.dateStr);
};
// 处理单机事件:显示日期详情
@@ -420,8 +421,8 @@ onMounted(() => {