iep-ui/es/fullcalendar/components/eventCard.js

An enterprise-class UI design language and Vue-based implementation

import moment from 'moment';
export default {
  props: ['event', 'date', 'firstDay'],
  computed: {
    cssClasses: function cssClasses() {
      var cssClasses = this.event.cssClass;

      if (!Array.isArray(cssClasses)) {
        cssClasses = [cssClasses];
      } else {
        cssClasses = Array.from(cssClasses);
      }

      if (this.start.isSame(this.date, 'day')) {
        cssClasses.push('is-start');
      }

      if (this.end.isSame(this.date, 'day')) {
        cssClasses.push('is-end');
      }

      if (!this.event.isShow) {
        cssClasses.push('is-opacity');
      }

      return cssClasses.join(' ');
    },
    showTitle: function showTitle() {
      return this.date.day() == this.firstDay || this.start.isSame(this.date, 'day');
    },
    start: function start() {
      return moment(this.event.start);
    },
    end: function end() {
      return moment(this.event.end);
    }
  },
  render: function render() {
    var _this = this;

    var h = arguments[0];

    return h(
      'p',
      {
        'class': 'event-item ' + this.cssClasses,
        on: {
          'click': function click($event) {
            _this.$emit('click', _this.event, $event);
          }
        }
      },
      [this.$slots.p ? this.showTitle ? this.$slots.p : '' : this.showTitle ? this.event.title : '']
    );
  }
};