日历修改,可分别修改多日期内容

src/views/system/calendar/index.vue

@@ -66,12 +66,12 @@
               </el-button>
               <el-form
                 ref="formRef"
-                :model="formDataCaln"
+                :model="holidayDate[data.day]"
                 style="margin-top: 20px"
                 label-width="70px"
               >
                 <el-form-item label="状态" >
-                  <el-radio-group v-model="formDataCaln.isWorkday">
+                  <el-radio-group v-model="holidayDate[data.day].isWorkday">
                     <el-radio
                       v-for="dict in nowWork"
                       :key="dict.value"
@@ -82,9 +82,9 @@
                   </el-radio-group>
                 </el-form-item>
                 <el-form-item label="假期内容" >
-                  <el-select v-model="formDataCaln.content" placeholder="请选择假期内容" :teleported="false">
+                  <el-select v-model="holidayDate[data.day].content" placeholder="请选择假期内容" :teleported="false">
                     <el-option
-                      v-for="dict in getIntDictOptions(DICT_TYPE.CALENDAR_CONTENT)"
+                      v-for="dict in dictData"
                       :key="dict.value"
                       :label="dict.label"
                       :value="dict.value"
@@ -219,14 +219,6 @@ const handleSelect = async (date:any) => {
     message.error("未找到对应的假期数据");
     return;
   }
-  // 更新数据
-  formDataCaln.value = {
-    ...formDataCaln.value,
-    id: holidayData.id,
-    date: holidayData.date,
-    isWorkday: holidayData.isWorkday,
-    content: holidayData.content
-  };
 
   //关闭或开启弹窗
   holidayData.visible = !holidayData.visible;
@@ -236,20 +228,24 @@ const handleSelect = async (date:any) => {
 const submitForm = async (date:any)=> {
   // 判断更改是否符合
   await getDate(date);
-  const dataClan = formDataCaln.value as unknown as CalendarVO
+  const updatedHoliday = holidayDate.value[sDate.value];
+
+  let dataClan = formDataCaln.value as unknown as CalendarVO
   // 更新后台数据
   try {
+    // 更新数据
+    dataClan = {
+      ...dataClan,
+      id: updatedHoliday.id,
+      date: updatedHoliday.date,
+      isWorkday: updatedHoliday.isWorkday,
+      content: updatedHoliday.content
+    };
     await CalendarApi.updateCalendar(dataClan);
   } catch (error) {
     message.error("更新失败");
     return;
   }
-  const updatedHoliday = holidayDate.value[sDate.value];
-  // 更改展示状态
-  updatedHoliday.isWorkday = formDataCaln.value.isWorkday
-  updatedHoliday.content = formDataCaln.value.content
-  // 重新赋值触发新渲染 本来需要重新渲染才更新不知道怎么好了留着
-  // holidayDate.value = { ...holidayDate.value};
   // 关闭弹窗
   updatedHoliday.visible = false;
 }