完善

src/views/repair/calendar/Calendar.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div v-show="true" style="display:flex">
+    <div v-show="visible" style="display:flex">
       <a-card style="height: 850px;flex:1">
         <div style="color:#000;font-weight:700;font-size:30px;">
           {{ dateRangeText }}
@@ -40,7 +40,6 @@
         <ToastUICalendar
           ref="calendar"
           style="height: 800px;"
-          :use-detail-popup="true"
           :view="selectedView"
           :week="{
             showTimezoneCollapseButton: true,
@@ -68,6 +67,7 @@
         />
       </div>
     </div>
+    <Detail ref="detail" @ok="handleOk" />
   </div>
 </template>
 
@@ -78,14 +78,16 @@ import '@toast-ui/calendar/dist/toastui-calendar.min.css'
 import 'tui-date-picker/dist/tui-date-picker.min.css'
 import 'tui-time-picker/dist/tui-time-picker.min.css'
 import { TZDate } from '@toast-ui/calendar'
-import { getCalendar, pushCalendar } from '@/api/repair/application-form'
-
+import { getCalendar, pushCalendar, fetchRepairApplicationForm } from '@/api/repair/application-form'
+import Detail from '@/views/repair/application-form/modules/DetailRepair.vue'
 export default {
   components: {
-    ToastUICalendar
+    ToastUICalendar,
+    Detail
   },
   data () {
     return {
+      visible: true,
       checkedKeys: [2, 1, 3],
       dayNames: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
       calendars: [
@@ -298,7 +300,7 @@ export default {
       // this.calendarInstance.updateEvent(targetEvent.id, targetEvent.calendarId, changes)
         this.getInfo()
       }).catch((err) => {
-        this.$$message.error(err.message)
+        this.$message.error(err.message)
       })
     },
 
@@ -320,6 +322,11 @@ export default {
       console.log('MouseEvent : ', nativeEvent)
       console.log('Event Info : ', event)
       console.groupEnd()
+      fetchRepairApplicationForm({ id: event.id }).then(res => {
+        this.visible = false
+        const modal = this.$refs.detail
+        modal.base(res.data)
+      })
     },
     onClickTodayButton () {
       this.calendarInstance.today()
@@ -379,6 +386,10 @@ export default {
     },
     onSelect (keys, e) {
       this.events = this.dataList.filter(item => this.checkedKeys.includes(item.calendarId))
+    },
+    handleOk () {
+      this.visible = true
+      this.getInfo()
     }
   }
 }