j-MonthlyCalendar

jComponent 20 · jcomponent@20 component Παράδειγμα φορτωμένο με jComponent 20

Υποστηρίζει μόνο μηνιαία εικόνα

ΕΠΙΤΡΟΦΗ:

parent {String} επιλεκτή jQuery για την απόκτηση σταθερού ύψους (προεπιλεγμένη auto)
firstday {Number} την πρώτη ημέρα του ημερολογίου 0 = Sunday, προεπιλεγμένη 0
noborder {Boolean} διακόπτει το όριο (προεπιλεγμένο: false)
Το selectable {Boolean} επιτρέπει την επιλογή ημερών (προεπιλεγμένο: true)
morebutton {String} ένα πρότυπο Tangular για το κουμπί More (προεπιλεγμένο: +{{ count }} more)
select {String} ένα μονοπάτι για Function(item_event, el, e), να είστε προσεκτικοί: item_event μπορεί να είναι null
create {String} Ο δρόμος για Function({ beg: Date, end: Date }, beg_element, end_element)
dblclick {String} Ο δρόμος για Function(item_event, el, e)
dblclickdate {String} Ο δρόμος για Function(date, el, e)
contextmenu {String} Ο δρόμος για Function(item_event, el, e)
rebind {String} ένα μονοπάτι προς Function({ dates: Array, date: Date }) εκτελείται όταν το ημερολόγιο είναι ανασυνδεδεμένο
topoffset {Boolean} υποστρώματα offset.top από height (προεπιλεγμένο: false)
topposition {Boolean} υποστρώματα position.top από height (προεπιλεγμένο: false)
margin {Number} κορυφαία / κάτω περιθώριο μαζί (προεπιλεγμένη: 0)
marginxs {Number} top/bottom marge μαζί για το πλάτος οθόνης xs
marginsm {Number} top/bottom marge μαζί για το πλάτος οθόνης sm
marginmd {Number} top/bottom marge μαζί για το πλάτος οθόνης md
marginlg {Number} top/bottom marge μαζί για το πλάτος οθόνης lg
NEW: keepselected {Boolean} διατηρεί επιλεγμένες (επιλεγμένες) ημέρες (προσδιορισμός: false)
NEW: hover {String} ένα μονοπάτι προς το Function({ beg: Date, end: Date }, beg_element, end_element) (όπως και το create, αλλά ονομάζεται μεθόδους component.hover() και component.unhover())
NEW: scalewidth {Boolean} κλίμακα το ύψος σύμφωνα με το πλάτος του γονικού στοιχείου

Μέθοδοι:

component.addevents(events) προσθέτει γεγονότα
- events σημαίνει Αρμή αντικειμένων παρακάτω:
- [{ id: String, beg: Date, end: Date, html: String, icon: String, color: String, background: Boolean }]
Το component.addevent(event) προσθέτει ένα γεγονός
- Δεν μπορεί να συνδυαστεί με τη μέθοδο addevents
- Μπορεί να εκτελεστεί πολλές φορές
- Ετικέτες: { id: String, html: String, icon: String, color: String, background: Boolean }
_NEW__: component.addbadge(date, [color]) προσθέτει ένα σημάδι
Ετικέτες: component.hover(beg, end)
Ετικέτες: component.unhover()
Το component.clear() αφαιρεί όλα τα γεγονότα και τις ενδείξεις

Τοποθεσία:

Τα ονόματα μήνα και ημερών λαμβάνονται από τις ιδιότητες MONTHS και DAYS που καθορίζονται στη βιβλιοθήκη jComponent.

Χρησιμοποιήστε το με <ui-component name="monthlycalendar">Όταν το στοιχείο δεν έχει φορτωθεί ακόμα, jComponent Κατεβάστε το για πρώτη φορά από τη διεύθυνση DEF.fallback (Η Componentator Συγγραφέας: Peter Širka. πηγή: το Componentator Ετικέτες Αξιολόγηση, MIT άδεια.

example.html

<style>
	body{margin:0;padding:0;overflow:hidden;}
</style>

<ui-component name="monthlycalendar" path="common.date" config="parent:auto;noborder:1;firstday:1"></ui-component>

<script>
	var common = { date: NOW };

	(function() {
		var events = [];
		events.push({ id: 'a', beg: NOW.add('-10 days'), end: NOW.add('2 days'), html: 'Big event', color: 'orange' });
		events.push({ id: 'b', beg: NOW, html: 'Current', icon: 'ti ti-car', color: 'blue' });
		SETTER(true, 'monthlycalendar/addevents', events);
	})();

</script>