时间选择

src/views/IM/diagnosis-admin/modal/newScheduling.vue

@@ -175,6 +175,7 @@
         week: 1, // 1:当前周 2:上一周 3:下一周
         currentIndex: 3,
         haveWeek: [1],
+        businessHours: true,
         calendarOptions: {
           // 引入的插件，比如fullcalendar/daygrid，fullcalendar/timegrid引入后才可显示月，周，日
           plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin],
@@ -186,6 +187,8 @@
           select: this.selectInfo,
           selectMinDistance: 0,
           eventResize: this.eventResize,
+          eventOverlap: false,
+          // eventDurationEditable:false,
           eventDrop: this.eventDrop,
           editable: true,
           overlap: false,
@@ -404,6 +407,34 @@
           }
           this.calendarOptions.events.push(dataObj);
         });
+        this.limmitDateFun();
+      },
+      limmitDateFun() {
+        const list = [];
+        for (let i = 0; i < 7; i++) {
+          const obj = {};
+          const lastObj = {};
+          const day = dayjs(this.getEveryDay)
+            .add(i, 'day')
+            .format('YYYY-MM-DD HH:mm:ss');
+          obj.start = dayjs(day).add(12, 'hour').format('YYYY-MM-DD HH:mm:ss');
+          obj.end = dayjs(day).add(13, 'hour').format('YYYY-MM-DD HH:mm:ss');
+          lastObj.start = dayjs(day)
+            .add(17, 'hour')
+            .format('YYYY-MM-DD HH:mm:ss');
+          lastObj.end = dayjs(day).add(18, 'hour').format('YYYY-MM-DD HH:mm:ss');
+          obj.constraint = 'businessHours';
+          obj.color = '#ccc';
+          obj.display = 'background';
+          obj.editable = false;
+          lastObj.constraint = 'businessHours';
+          lastObj.color = '#ccc';
+          lastObj.display = 'background';
+          lastObj.editable = false;
+          this.calendarOptions.events.push(obj);
+          this.calendarOptions.events.push(lastObj);
+        }
+        console.log(list, 'obj', this.getEveryDay);
       },
       handleDatesSet(dataInfo) {
         this.getEveryDay = dayjs(dataInfo.startStr).format('YYYY-MM-DD HH:mm:ss');
@@ -444,6 +475,10 @@
         }
       },
       eventResize(event) {
+        console.log(event, 'eventevent');
+        // if(){
+
+        // }
         const index = this.getIdDeleteData(event.event.id);
         const oldData = this.calendarOptions.events;
         const keyAll = Object.keys(oldData[index]);
@@ -459,9 +494,11 @@
         this.getHandleTime(dataObj);
       },
       handleEventClick(event) {
-        if (!this.calendarOptions.selectable) {
+        if (!this.calendarOptions.selectable || event.event.constraint) {
           return;
         }
+        console.log(event, event, 'iiiieventeventevent');
+
         this.$confirm('你要取消日期吗？', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
@@ -512,8 +549,10 @@
       },
       selectInfo(info) {
         console.log(info, 'infoinfoinfo');
-        const startDay = new Date(info.start).getDay();
-        const endDay = new Date(info.end).getDay();
+        // const startDay = new Date(info.start).getDay();
+        // const endDay = new Date(info.end).getDay();
+        // const startHour = new Date(info.start).hour();
+        // const endHour = new Date(info.end).hour();
         // const chooseStartH = new Date(info.start).getHours();
         // const chooseEndH = new Date(info.end).getHours();
         // // const startH = 9;
@@ -540,9 +579,9 @@
         //   );
         // }
         // this.calendarOptions.events = timeList;
-        if (startDay != endDay) {
-          return this.$toast('不能夸天选择排班');
-        }
+        // if (startDay != endDay) {
+        //   return this.$toast('不能夸天选择排班');
+        // }
         const id = (this.calendarOptions.events.length + 1) * 10;
         info.id = id;
         const keyAll = ['end', 'endStr', 'id', 'start', 'startStr', 'week'];
@@ -554,7 +593,6 @@
             dataObj[item] = info[item];
           }
         });
-
         console.log(dataObj, 'dataObjdataObj');
         this.calendarOptions.events.push(dataObj);
       },
@@ -563,7 +601,6 @@
         const startDay = new Date(info.start).getDay();
         const endDay = new Date(info.end).getDay();
         const startHour = dayjs(info.start).hour();
-        const endHour = dayjs(info.end).hour();
         console.log(dayjs(info.start).format('YYYY-MM-DD HH:mm:ss'));
         if (startDay != endDay) {
           return false;
@@ -572,12 +609,9 @@
         // if (dayjs(info.start).format('YYYY-MM-DD HH:mm:ss').split(' ')[1] == '12:00:00' || dayjs(info.start).format('YYYY-MM-DD HH:mm:ss').split(' ')[1] == '17:00:00') {
         //   return false;
         // }
-        if (startHour <= 12 && endHour <= 21) {
-          return false;
-        } else if (startHour >= 12 && endHour <= 21) {
+        if (startHour == 12 || startHour == 17) {
           return false;
         }
-
         const currentDate = new Date();
         const start = info.start;
         const end = info.end;
@@ -633,7 +667,7 @@
           const data = this.calendarOptions.events;
           console.log('data=======', data);
           data.forEach((item) => {
-            if (item.week == (weekV ? weekV : this.week)) {
+            if (item.week == (weekV ? weekV : this.week) && !item.constraint) {
               const obj = {};
               obj.startTime = this.dateFormat('YYYY-mm-dd HH:MM:SS', item.start);
               obj.endTime = this.dateFormat('YYYY-mm-dd HH:MM:SS', item.end);