events.pu sh (событие) работает в полном календаре, но не в режиме просмотра дневной сетки ресурса. - PullRequest
Новая
       5

events.pu sh (событие) работает в полном календаре, но не в режиме просмотра дневной сетки ресурса.

0 голосов
/ 02 февраля 2020

I sh, чтобы добавить событие при выборе времени.

Это прекрасно работает на fullcalendar без ресурсов.

Однако, это не создает никакого события, когда я изменяю defaultview на "resourceTimeGridDay". Я уже добавил ресурс ID. Это делает массив событий, когда я проверяю с console.log, но теперь отображается в календаре

любая помощь?

Я использую Vue js. 


   <template>
  <FullCalendar
    schedulerLicenseKey="GPL-My-Project-Is-Open-Source"
    ref="fullCalendar"
    defaultView="resourceTimeGridDay"
    :plugins="calendarPlugins"
    :config="config"
    :events="EVENTS"
    :resources="resources"
    :selectable="true"
    :editable="true"
    @select="handleSelect"
  />
</template>

<script>
import FullCalendar from "@fullcalendar/vue";
import { Calendar } from "@fullcalendar/core";
import resourceTimelinePlugin from "@fullcalendar/resource-timeline";
import resourceTimeGridPlugin from "@fullcalendar/resource-timegrid";
import InteractionPlugin from "@fullcalendar/interaction";

import { mapGetters } from "vuex";

export default {
  components: {
    FullCalendar // make the <FullCalendar> tag available
  },
  data() {
    return {
      calendarPlugins: [resourceTimeGridPlugin, InteractionPlugin],

      },
      resources: [
        { id: "a", title: "Auditorium A" },
        { id: "b", title: "Auditorium B" },
        { id: "c", title: "Auditorium C" }
      ],
      calendarApi: null,

    };
  },

  methods: {
    handleSelect(arg) {

      var resourceid = arg.resource.id;

      this.$store.commit("events/ADD_EVENT", {
        title: "test",
        start: arg.start,
        end: arg.end,
        resourceID: resourceid
      });

    },


  },
  mounted() {
    this.calendarApi = this.$refs.fullCalendar.getApi();
  },

  computed: {
    ...mapGetters("events", ["EVENTS"]),

  },


};
</script>

<style lang="scss">
@import "~@fullcalendar/core/main.css";
@import "~@fullcalendar/daygrid/main.css";
@import "~@fullcalendar/timeline/main.css";
@import "~@fullcalendar/resource-timeline/main.css";
@import "~@fullcalendar/timegrid/main.css";
</style>
...