iep-ui/lib/fullcalendar/components/header.js

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

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _moment = require('moment');

var _moment2 = _interopRequireDefault(_moment);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

exports['default'] = {
  props: {
    currentMonth: {},
    titleFormat: {},
    firstDay: {},
    monthNames: {},
    locale: {}
  },
  data: function data() {
    return {
      leftArrow: '<',
      rightArrow: '>'
    };
  },

  computed: {
    title: function title() {
      if (!this.currentMonth) return;
      return this.currentMonth.locale(this.locale).format('MMMM YYYY');
    }
  },
  methods: {
    goPrev: function goPrev() {
      var newMonth = (0, _moment2['default'])(this.currentMonth).subtract(1, 'months').startOf('month');
      this.$emit('change', newMonth);
    },
    goNext: function goNext() {
      var newMonth = (0, _moment2['default'])(this.currentMonth).add(1, 'months').startOf('month');
      this.$emit('change', newMonth);
    }
  },
  render: function render() {
    var h = arguments[0];

    return h(
      'div',
      { 'class': 'full-calendar-header' },
      [h(
        'div',
        { 'class': 'header-left' },
        [this.$slots.headerLeft]
      ), h(
        'div',
        { 'class': 'header-center' },
        [this.$slots.headerCenter]
      ), h(
        'div',
        { 'class': 'header-right' },
        [h(
          'a-button',
          {
            on: {
              'click': this.goPrev
            }
          },
          [h(
            'span',
            { 'class': 'prev-month' },
            [this.leftArrow]
          )]
        ), h(
          'span',
          { 'class': 'title' },
          [this.title]
        ), h(
          'a-button',
          {
            on: {
              'click': this.goNext
            }
          },
          [h(
            'span',
            { 'class': 'next-month' },
            [this.rightArrow]
          )]
        )]
      )]
    );
  }
};