fix(Calendar): 添加保存按钮防抖并移除营期开始时间字段
添加isSaving状态防止重复提交保存请求 移除不再需要的campStartDate字段及相关逻辑 保存按钮在提交时显示加载状态
This commit is contained in:
@@ -120,8 +120,11 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button @click="showCampModal = false" class="cancel-btn">取消</button>
|
<button @click="showCampModal = false" class="cancel-btn" :disabled="isSaving">取消</button>
|
||||||
<button @click="saveCampSettings" class="save-btn">保存</button>
|
<button @click="saveCampSettings" class="save-btn" :disabled="isSaving">
|
||||||
|
<span v-if="isSaving">保存中...</span>
|
||||||
|
<span v-else>保存</span>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -262,9 +265,9 @@ const tooltipPosition = ref({ x: 0, y: 0 });
|
|||||||
|
|
||||||
// 营期设置相关
|
// 营期设置相关
|
||||||
const showCampModal = ref(false);
|
const showCampModal = ref(false);
|
||||||
const campStartDate = ref('');
|
|
||||||
const campDays = ref();
|
const campDays = ref();
|
||||||
const restDays = ref();
|
const restDays = ref();
|
||||||
|
const isSaving = ref(false);
|
||||||
const isCampFinished = ref(false);
|
const isCampFinished = ref(false);
|
||||||
|
|
||||||
// 结束营期确认弹框相关
|
// 结束营期确认弹框相关
|
||||||
@@ -435,10 +438,11 @@ const loadHistoryPeriods = async () => {
|
|||||||
|
|
||||||
// 方法:保存营期设置
|
// 方法:保存营期设置
|
||||||
const saveCampSettings = async () => {
|
const saveCampSettings = async () => {
|
||||||
if (!campStartDate.value) {
|
// 防抖:如果正在保存中,直接返回
|
||||||
alert('请选择营期开始时间');
|
if (isSaving.value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!campDays.value || campDays.value < 1) {
|
if (!campDays.value || campDays.value < 1) {
|
||||||
alert('请输入有效的接数据天数');
|
alert('请输入有效的接数据天数');
|
||||||
return;
|
return;
|
||||||
@@ -448,10 +452,11 @@ const saveCampSettings = async () => {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
isSaving.value = true;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// 调用API设置营期参数并获取营期安排
|
// 调用API设置营期参数并获取营期安排
|
||||||
const result = await CenterCampPeriodAdmin({
|
const result = await CenterCampPeriodAdmin({
|
||||||
receipt_data_start_time: campStartDate.value,
|
|
||||||
receipt_data_time: campDays.value.toString(),
|
receipt_data_time: campDays.value.toString(),
|
||||||
rest_days: restDays.value.toString()
|
rest_days: restDays.value.toString()
|
||||||
});
|
});
|
||||||
@@ -459,7 +464,6 @@ const saveCampSettings = async () => {
|
|||||||
if (result && result.data) {
|
if (result && result.data) {
|
||||||
showCampModal.value = false;
|
showCampModal.value = false;
|
||||||
// 重置表单数据
|
// 重置表单数据
|
||||||
campStartDate.value = '';
|
|
||||||
campDays.value = null;
|
campDays.value = null;
|
||||||
restDays.value = null;
|
restDays.value = null;
|
||||||
alert('营期设置成功!');
|
alert('营期设置成功!');
|
||||||
@@ -467,59 +471,12 @@ const saveCampSettings = async () => {
|
|||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('保存营期设置失败:', error);
|
console.error('保存营期设置失败:', error);
|
||||||
alert('保存营期设置失败,请重试');
|
alert('保存营期设置失败,请重试');
|
||||||
|
} finally {
|
||||||
|
isSaving.value = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// 方法:生成营期日程安排
|
|
||||||
const generateCampSchedule = () => {
|
|
||||||
const startDate = new Date(campStartDate.value);
|
|
||||||
const dataDays = campDays.value || 2; // 接数据天数,默认2天
|
|
||||||
let currentDate = new Date(startDate);
|
|
||||||
let eventId = events.value.length + 1;
|
|
||||||
|
|
||||||
// 清除之前的营期相关事件
|
|
||||||
events.value = events.value.filter(event => !event.isCampEvent);
|
|
||||||
|
|
||||||
// 添加接数据日程
|
|
||||||
for (let i = 0; i < dataDays; i++) {
|
|
||||||
const dateStr = formatDateToString(currentDate);
|
|
||||||
events.value.push({
|
|
||||||
id: eventId++,
|
|
||||||
date: dateStr,
|
|
||||||
title: `接数据 第${i + 1}天`,
|
|
||||||
description: '营期数据接收阶段',
|
|
||||||
isCampEvent: true,
|
|
||||||
type: 'data'
|
|
||||||
});
|
|
||||||
currentDate.setDate(currentDate.getDate() + 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 添加课程日程
|
|
||||||
const courses = ['课1', '课2', '课3', '课4'];
|
|
||||||
courses.forEach((course, index) => {
|
|
||||||
const dateStr = formatDateToString(currentDate);
|
|
||||||
events.value.push({
|
|
||||||
id: eventId++,
|
|
||||||
date: dateStr,
|
|
||||||
title: course,
|
|
||||||
description: `${course}`,
|
|
||||||
isCampEvent: true,
|
|
||||||
type: 'course'
|
|
||||||
});
|
|
||||||
currentDate.setDate(currentDate.getDate() + 1);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 添加休息日程
|
|
||||||
const restDateStr = formatDateToString(currentDate);
|
|
||||||
events.value.push({
|
|
||||||
id: eventId++,
|
|
||||||
date: restDateStr,
|
|
||||||
title: '休息',
|
|
||||||
description: '营期休息日',
|
|
||||||
isCampEvent: true,
|
|
||||||
type: 'rest'
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// 辅助方法:格式化日期为字符串
|
// 辅助方法:格式化日期为字符串
|
||||||
const formatDateToString = (date) => {
|
const formatDateToString = (date) => {
|
||||||
@@ -689,9 +646,8 @@ async function CenterCampPeriodAdmin(data = {}) {
|
|||||||
// 兼容原有逻辑,使用全局变量
|
// 兼容原有逻辑,使用全局变量
|
||||||
if (isCampFinished.value) {
|
if (isCampFinished.value) {
|
||||||
Finsh.is_camp_finish = isCampFinished.value
|
Finsh.is_camp_finish = isCampFinished.value
|
||||||
} else if (campStartDate.value && campDays.value) {
|
} else if (campDays.value) {
|
||||||
// 只有在有营期设置数据时才传递参数
|
// 只有在有营期设置数据时才传递参数
|
||||||
Finsh.receipt_data_start_time = campStartDate.value
|
|
||||||
Finsh.receipt_data_time = campDays.value.toString()
|
Finsh.receipt_data_time = campDays.value.toString()
|
||||||
if (restDays.value) {
|
if (restDays.value) {
|
||||||
Finsh.rest_days = restDays.value.toString()
|
Finsh.rest_days = restDays.value.toString()
|
||||||
|
|||||||
Reference in New Issue
Block a user