Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
429 views
in Technique[技术] by (71.8m points)

How to fullcalendar fc-event cut

The fullcalendarAPI is in use . This will write a sentence if there is a question of being developed . Although events in the fc-event when you expose the calendar is exposed to the calendar , we want to prevent that time , the soil , the expression on Sunday . Is there a way....?

example :

enter image description here

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

enter image description here

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can take the events start/end and break it up into sections.

https://jsfiddle.net/31gayu5b/4/

/* Fiddle specs: fullcalendar v2.4.0, moment v2.10.6, jQuery v2.1.4 */

/* If chop is true, it cuts out Saturday, Sunday */
var events = [{
  start: '2016-02-01',
  end: '2016-03-01',
  title: 'This is the whole month long, no weekends!',
  id: 'month-long-no-weekends',
  chop: true
}, {
  start: '2016-02-01',
  end: '2016-03-01',
  title: 'This is the whole month long, including weekends!',
  id: 'month-long-weekends',
  chop: false
}, {
  start: '2016-02-07',
  end: '2016-02-16',
  title: 'Starts Sunday ends Tuesday the week after (no weekends)',
  id: 'start-sun-no-weekends',
  chop: true
}, {
  start: '2016-02-07',
  end: '2016-02-16',
  title: 'Starts Sunday ends Tuesday the week after (has weekends)',
  id: 'start-sun-weekends',
  chop: false
}];

$('#calendar').fullCalendar({
  defaultDate: '2016-02-01',
  events: chopEvents(events),
  eventClick: function(event, jsEvent, view) {
    alert(event.id);
  },
  eventRender: function(event, element, view) {
    console.log(event);
    if (event.chop)
      element.css('background-color', 'green');
  }
});

function chopEvents(events) {
  var chopped = [];
  $(events).each(function() {
    var event = this;
    if (this.chop) {
      var segments = makeChunks(this);
      $(segments).each(function(index, dates) {
        var start = dates.shift();
        var end = dates.pop();
        event.start = start;
        event.end = end;
        chopped.push($.extend({}, event));
      });
    } else {
      chopped.push(event);
    }
  });
  return chopped;
}

function makeChunks(event) {
  var seg = 0;
  var segments = [];
  var start = moment(event.start);
  var end = moment(event.end); //.add(1, 'day'); /* May want to add 1 day? */
  for (var day = moment(start); day <= end; day = day.add(1, 'day')) {
    var dayOfWeek = day.format('E');
    if (dayOfWeek == 7) {
      segments[++seg] = [];
      continue;
    }
    if (segments[seg] === undefined) {
      segments[seg] = [];
    }
    segments[seg].push(day.format('YYYY-MM-DD'));
  }
  segments = segments.filter(function(i) {
      return i !== null && i.length > 1;
    })
    // console.log(JSON.stringify(segments, null, 2));
  return segments;
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...