guci-date/Interceptor.js

A golden bottle of sake costs ten thousand yuan, and a jade plate costs ten thousand yuan.

import FullCalendar from "@fullcalendar/vue";
import dayGridPlugin from "@fullcalendar/daygrid";
import timeGridPlugin from "@fullcalendar/timegrid";
import interactionPlugin, { Draggable } from "@fullcalendar/interaction";

import apiBaseUrl from "../../config/api";
import axios from "axios";

export function beforeRouteLeave(to, from, next){
    if (to.name !== "ScheduleDetails") {
        from.meta.keepAlive = false;
      } else {
        from.meta.keepAlive = true;
      }
      next();
}

export function data(){
    return {
        gridData: [],
        dialogTableVisible: false,
        file: `${apiBaseUrl}/schedule/import`,
        isHideDetails: false,
        time: [],
        num: 0,
        educationType: 2, //教育类型
        relativeTime: "4", //自定义
        isFirst: 2,
        relativeTimes: [
          {
            value: "1",
            label: "每天",
          },
          {
            value: "2",
            label: "每周",
          },
          {
            value: "3",
            label: "自定义",
          },
          {
            value: "4",
            label: "无",
          },
        ],
        categoryId: "", //课程类型ID
        checkList: [],
        id1: "",
        teachers: [], //下拉框默认值
        query: "", // 查询关键字
        courses: [], //拖拽课程
        studentIds: [],
        counter: "",
        startTime: "", // 开始时间变量
        endTime: "", // 结束时间变量
        startTime1: "",
        endTime1: "",
        courseId: null,
        courseScheduleData: null, //存储回显的排课信息数据
        studentList: [], // 存储学生列表数据的变量
        selectedTeacher: null, // 如果需要预先选中某个选项，可以在这里设置默认值
        dialogVisible: false, // 控制弹层显示状态的数据属性
        ruleForm: {
          startTime: "",
          endTime: "",
          selectedTeacher: "",
        },
        // teacherId:this.ruleForm.selectedTeacher,
        rules: {
          startTime: [
            { required: true, message: "请选择开始时间", trigger: "blur" },
          ],
          endTime: [
            { required: true, message: "请选择结束时间", trigger: "blur" },
            { validator: this.checkEndTime, trigger: "change" },
          ],
          selectedTeacher: [
            { required: true, message: "请选择教师", trigger: "change" },
          ],
        },
        calendarOptions: {
          handleWindowResize: true,
          eventColor: this.getEventColor, // 使用方法来确定颜色
          firstDay: 1,
          allDaySlot: false, // 不显示all-day
          firstHour: 6,
          slotMinTime: "06:00:00",
          slotMaxTime: "24:00:00",
          plugins: [
            dayGridPlugin,
            timeGridPlugin,
            interactionPlugin, // needed for dateClick
          ],
          datesSet: this.handleDatesSet,
          headerToolbar: {
            left: "prev,next today",
            center: "title",
            right: "dayGridMonth,timeGridWeek,timeGridDay",
          },
  
          /* 设置按钮文字 */
          buttonText: {
            today: "今天",
            dayGridMonth: "月",
            timeGridWeek: "周",
            timeGridDay: "日",
          },
          locale: "zh-cn",
          // dayGridMonth, timeGridWeek,timeGridDay
          initialView: "dayGridMonth",
          // initialEvents: INITIAL_EVENTS, // alternatively, use the `events` setting to fetch from a feed
          editable: true,
          selectable: true,
          selectMirror: true,
          dayMaxEvents: true,
          weekends: true,
          // handleViewRender,
          eventDidMount: function (info) {
            if (info.event.extendedProps.isShowbgcColor) {
              info.el.style.background = "darkgray";
            } else {
              info.el.style.background = "#3788d8";
            }
            if (
              info.event.extendedProps.classEnding == 1 &&
              info.event.extendedProps.isFirst !== 1
            ) {
              info.el.style.background = "orange";
              info.el.style.borderColor = "orange";
            }
            if (
              info.event.extendedProps.isFirst == 1 &&
              info.event.extendedProps.classEnding == 1
            ) {
              info.el.style.background = "#E380E3";
              info.el.style.borderColor = "#E380E3";
            }
            if (
              info.event.extendedProps.isFirst == 1 &&
              info.event.extendedProps.classEnding !== 1
            ) {
              info.el.style.background = "#54bcbd";
              info.el.style.borderColor = "#54bcbd";
            }
          }, //事件挂载
          events: [],
          customButtons: {
            next: {
              click: this.nextClick,
            },
            prev: {
              click: this.prevClick,
            },
          },
          eventColor: function (event) {
            if (event.start.isBefore(new Date())) {
              return "f0f0f0"; // 过去事件的背景颜色
            } else {
              return "#008000"; // 未来事件的背景颜色
            }
          },
  
          // select: this.handleDateSelect,
          eventClick: this.handleEventClick,
          eventsSet: this.handleEvents,
          /* you can update a remote database when these fire:
          eventAdd:
          eventChange:
          eventRemove:
          */
        },
        pickerOptions: {
          shortcuts: [
            {
              text: "最近一周",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                picker.$emit("pick", [start, end]);
              },
            },
            {
              text: "最近一个月",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                picker.$emit("pick", [start, end]);
              },
            },
            {
              text: "最近三个月",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                picker.$emit("pick", [start, end]);
              },
            },
          ],
        },
        value1: "", //日期绑定
        value2: "",
        currentEvents: [],
        lockLoading: false,
        btnInitialViewSelect: "",
        loadingFalg: false,
        monStatus: "",
        satNum: "",
        sunNum: "",
        address: "",
        studentName: "",
        studentName_s: "",
        studentsList: [],
        studentsList_s: [],
        timeTeachers: [],
        parentScheduleId: "",
        jsonShow: true,
        dialogVisibles: false,
        courseDate1: "", //一键结课日期
        renderShow: false,
        eventBtn: false,
        listJsonString: "",
      };
}


export function created(){
    this.fetchTeachers();
    this.fetchCourses();
    this.getStudenList();
}


export function mounted(){
    axios.post(`${apiBaseUrl}/student/getStudentList`, {
      studentType: 1,
    })
    .then((res) => {
      let { data } = res;
      if (data.code == 200) {
        this.studentsList = data.data
        sessionStorage.setItem(
          "getStudentList_Jons",
          JSON.stringify(data.data)
        );
      }
    });
    axios.post(`${apiBaseUrl}/student/getStudentList`, {
      studentType: 2,
    })
    .then((res) => {
      let { data } = res;
      if (data.code == 200) {
        sessionStorage.setItem(
          "getStudentList_Jons_s",
          JSON.stringify(data.data)
        );
        this.studentsList_s = data.data
      }
    });

    let containerEl = document.getElementById("external-events");
    new Draggable(containerEl, {
        itemSelector: ".fc-event",
        eventData: function (eventEl) {
        //自定id
        let eventId = eventEl.querySelector(".fcevent").getAttribute("data-id");

        return {
            title: eventEl.innerText,
            id: eventId,
        };
        },
    });


    this.jsonShow = false;
    this.renderShow = false;
    this.listdate();

    // 重写 今天按钮
    const Dom = document.getElementsByClassName("fc-today-button")[0];
    Dom.addEventListener("click", (e) => {
      e.preventDefault();
      this.jsonShow = false;
      this.renderShow = false;
      this.listdate();
    });

}