@zeedhi/zd-calendar-vue 1.6.1 → 1.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +1 -1
  2. package/dist/calendar-vue.esm.js +219 -83
  3. package/dist/calendar-vue.umd.js +219 -83
  4. package/package.json +2 -2
  5. package/types/Calendar.d.ts +10 -2
package/README.md CHANGED
@@ -1,4 +1,4 @@
1
- # Componente BottomSheet para Zeedhi
1
+ # Componente Calendar para Zeedhi
2
2
 
3
3
  <center>
4
4
  <p>
package/dist/calendar-vue.esm.js CHANGED
@@ -35,7 +35,7 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
35
35
  this.instanceType = Calendar;
36
36
  this.selectedOpen = false;
37
37
  this.selectedElement = null;
38
- this.selectedEvent = {};
38
+ this.selectedEvent = null;
39
39
  this.showDatePicker = false;
40
40
  }
41
41
  onChangePicker() {
@@ -83,6 +83,9 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
83
83
  this.instance.value = date;
84
84
  this.instance.type = 'day';
85
85
  }
86
+ callDayStyle(date) {
87
+ return (this.instance.dayStyle && typeof this.instance.dayStyle === 'function') ? this.instance.dayStyle(date) : '';
88
+ }
86
89
  showEvent({ nativeEvent, event }) {
87
90
  const open = () => {
88
91
  this.selectedEvent = event;
@@ -91,6 +94,7 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
91
94
  };
92
95
  if (this.selectedOpen) {
93
96
  this.selectedOpen = false;
97
+ this.selectedEvent = null;
94
98
  requestAnimationFrame(() => requestAnimationFrame(() => open()));
95
99
  }
96
100
  else {
@@ -111,9 +115,15 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
111
115
  }
112
116
  }
113
117
  clickEvent({ nativeEvent, event }) {
114
- this.instance.clickEvent(this.$el, nativeEvent);
118
+ this.instance.clickEvent(event, this.$el, nativeEvent);
115
119
  this.showEvent({ nativeEvent, event });
116
120
  }
121
+ clickEditEvent(selectedEvent, nativeEvent) {
122
+ this.instance.clickEditEvent(selectedEvent, this.$el, nativeEvent);
123
+ }
124
+ clickDeleteEvent(selectedEvent, nativeEvent) {
125
+ this.instance.clickDeleteEvent(selectedEvent, this.$el, nativeEvent);
126
+ }
117
127
  clickDay(event) {
118
128
  this.instance.clickDay(this.$el, event);
119
129
  }
@@ -132,6 +142,16 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
132
142
  moved(event) {
133
143
  this.instance.moved(this.$el, event);
134
144
  }
145
+ callCanEditEvent(event) {
146
+ return typeof this.instance.canEditEvent === 'function' && event
147
+ ? this.instance.canEditEvent(event)
148
+ : this.instance.canEditEvent;
149
+ }
150
+ callCanDeleteEvent(event) {
151
+ return typeof this.instance.canDeleteEvent === 'function' && event
152
+ ? this.instance.canDeleteEvent(event)
153
+ : this.instance.canDeleteEvent;
154
+ }
135
155
  };
136
156
  __decorate([
137
157
  Prop({ type: [String, Array], default: undefined }),
@@ -277,6 +297,18 @@ __decorate([
277
297
  Prop({ type: Function, default: null }),
278
298
  __metadata("design:type", Object)
279
299
  ], ZdCalendar.prototype, "intervalStyle", void 0);
300
+ __decorate([
301
+ Prop({ type: [Function, String], default: null }),
302
+ __metadata("design:type", Object)
303
+ ], ZdCalendar.prototype, "dayStyle", void 0);
304
+ __decorate([
305
+ PropWatch({ type: [Function, Boolean, String], default: true }),
306
+ __metadata("design:type", Object)
307
+ ], ZdCalendar.prototype, "canDeleteEvent", void 0);
308
+ __decorate([
309
+ PropWatch({ type: [Function, Boolean, String], default: true }),
310
+ __metadata("design:type", Object)
311
+ ], ZdCalendar.prototype, "canEditEvent", void 0);
280
312
  __decorate([
281
313
  PropWatch({ type: [String, Number], default: 60 }),
282
314
  __metadata("design:type", Object)
@@ -759,7 +791,7 @@ var __vue_render__ = function () {
759
791
  "interval-width": _vm.instance.intervalWidth,
760
792
  events: _vm.instance.calendarEvents,
761
793
  "first-interval": _vm.instance.firstInterval,
762
- "first-style": _vm.instance.intervalStyle,
794
+ "interval-style": _vm.instance.intervalStyle,
763
795
  "first-time": _vm.instance.firstTime,
764
796
  light: _vm.instance.light,
765
797
  id: _vm.instance.name,
@@ -800,6 +832,31 @@ var __vue_render__ = function () {
800
832
  "click:time-category": _vm.clickTimeCategory,
801
833
  moved: _vm.moved,
802
834
  },
835
+ scopedSlots: _vm._u([
836
+ {
837
+ key: "day",
838
+ fn: function (ref) {
839
+ var date = ref.date;
840
+ return [
841
+ _c(
842
+ "div",
843
+ {
844
+ staticStyle: {
845
+ position: "absolute",
846
+ top: "0",
847
+ left: "0",
848
+ right: "0",
849
+ bottom: "0",
850
+ opacity: "0.5",
851
+ },
852
+ style: _vm.callDayStyle(date),
853
+ },
854
+ [_vm._v("\n  \n ")]
855
+ ),
856
+ ]
857
+ },
858
+ },
859
+ ]),
803
860
  model: {
804
861
  value: _vm.instance.value,
805
862
  callback: function ($$v) {
@@ -809,108 +866,187 @@ var __vue_render__ = function () {
809
866
  },
810
867
  }),
811
868
  _vm._v(" "),
812
- _c(
813
- "v-menu",
814
- {
815
- attrs: {
816
- "close-on-content-click": false,
817
- activator: _vm.selectedElement,
818
- "offset-x": "",
819
- },
820
- model: {
821
- value: _vm.selectedOpen,
822
- callback: function ($$v) {
823
- _vm.selectedOpen = $$v;
824
- },
825
- expression: "selectedOpen",
826
- },
827
- },
828
- [
829
- _c(
830
- "zd-card",
869
+ _vm.selectedOpen
870
+ ? _c(
871
+ "v-menu",
831
872
  {
832
873
  attrs: {
833
- name: "card_" + _vm.instance.name,
834
- cssClass: "zd-pa-0",
835
- dark: _vm.instance.dark,
836
- light: _vm.instance.light,
874
+ "close-on-content-click": false,
875
+ activator: _vm.selectedElement,
876
+ "offset-x": "",
877
+ },
878
+ model: {
879
+ value: _vm.selectedOpen,
880
+ callback: function ($$v) {
881
+ _vm.selectedOpen = $$v;
882
+ },
883
+ expression: "selectedOpen",
837
884
  },
838
885
  },
839
886
  [
840
887
  _c(
841
- "v-toolbar",
888
+ "zd-card",
842
889
  {
843
890
  attrs: {
844
- color: _vm.selectedEvent.color,
845
- elevation: "0",
846
- dark: "",
891
+ name: "card_" + _vm.instance.name,
892
+ cssClass: "zd-pa-0",
893
+ dark: _vm.instance.dark,
894
+ light: _vm.instance.light,
847
895
  },
848
896
  },
849
897
  [
850
898
  _c(
851
- "zd-text",
852
- _vm._b(
853
- { attrs: { name: "title_" + _vm.instance.name } },
854
- "zd-text",
855
- {
856
- text: _vm.selectedEvent.name,
857
- tag: "h5",
899
+ "v-toolbar",
900
+ {
901
+ attrs: {
902
+ color: _vm.selectedEvent.color,
903
+ elevation: "0",
904
+ dark: "",
858
905
  },
859
- false
860
- )
906
+ },
907
+ [
908
+ _c(
909
+ "zd-text",
910
+ _vm._b(
911
+ {
912
+ staticClass: "mx-2",
913
+ attrs: {
914
+ name: "title_" + _vm.instance.name,
915
+ },
916
+ },
917
+ "zd-text",
918
+ {
919
+ text: _vm.selectedEvent.name,
920
+ tag: "h5",
921
+ },
922
+ false
923
+ )
924
+ ),
925
+ _vm._v(" "),
926
+ _c("v-spacer"),
927
+ _vm._v(" "),
928
+ _c(
929
+ "span",
930
+ [
931
+ _vm.callCanEditEvent(_vm.selectedEvent)
932
+ ? _c(
933
+ "v-btn",
934
+ {
935
+ attrs: { icon: "" },
936
+ on: {
937
+ click: function ($event) {
938
+ return _vm.clickEditEvent(
939
+ _vm.selectedEvent,
940
+ $event
941
+ )
942
+ },
943
+ },
944
+ },
945
+ [
946
+ _c(
947
+ "v-icon",
948
+ {
949
+ on: {
950
+ click: function ($event) {},
951
+ },
952
+ },
953
+ [
954
+ _vm._v(
955
+ "\n " +
956
+ _vm._s(
957
+ _vm.$getIcon("pencil")
958
+ ) +
959
+ "\n "
960
+ ),
961
+ ]
962
+ ),
963
+ ],
964
+ 1
965
+ )
966
+ : _vm._e(),
967
+ _vm._v(" "),
968
+ _vm.callCanDeleteEvent(_vm.selectedEvent)
969
+ ? _c(
970
+ "v-btn",
971
+ {
972
+ attrs: { icon: "" },
973
+ on: {
974
+ click: function ($event) {
975
+ return _vm.clickDeleteEvent(
976
+ _vm.selectedEvent,
977
+ $event
978
+ )
979
+ },
980
+ },
981
+ },
982
+ [
983
+ _c("v-icon", [
984
+ _vm._v(
985
+ "\n " +
986
+ _vm._s(_vm.$getIcon("trash")) +
987
+ "\n "
988
+ ),
989
+ ]),
990
+ ],
991
+ 1
992
+ )
993
+ : _vm._e(),
994
+ ],
995
+ 1
996
+ ),
997
+ ],
998
+ 1
861
999
  ),
862
- ],
863
- 1
864
- ),
865
- _vm._v(" "),
866
- _c(
867
- "v-card-text",
868
- [
1000
+ _vm._v(" "),
869
1001
  _c(
870
- "zd-text",
871
- _vm._b(
872
- {
1002
+ "v-card-text",
1003
+ [
1004
+ _c(
1005
+ "zd-text",
1006
+ _vm._b(
1007
+ {
1008
+ attrs: {
1009
+ name: "description_" + _vm.instance.name,
1010
+ },
1011
+ },
1012
+ "zd-text",
1013
+ {
1014
+ text: _vm.selectedEvent.description,
1015
+ tag: "p",
1016
+ },
1017
+ false
1018
+ )
1019
+ ),
1020
+ ],
1021
+ 1
1022
+ ),
1023
+ _vm._v(" "),
1024
+ _c(
1025
+ "v-card-actions",
1026
+ [
1027
+ _c("zd-button", {
873
1028
  attrs: {
874
- name: "description_" + _vm.instance.name,
1029
+ name: "buttonClose_" + _vm.instance.name,
1030
+ flat: "",
1031
+ color: "secondary",
1032
+ label: "$t(CALENDAR_CLOSE)",
875
1033
  },
876
- },
877
- "zd-text",
878
- {
879
- text: _vm.selectedEvent.description,
880
- tag: "p",
881
- },
882
- false
883
- )
1034
+ on: {
1035
+ click: function ($event) {
1036
+ _vm.selectedOpen = !_vm.selectedOpen;
1037
+ },
1038
+ },
1039
+ }),
1040
+ ],
1041
+ 1
884
1042
  ),
885
1043
  ],
886
1044
  1
887
1045
  ),
888
- _vm._v(" "),
889
- _c(
890
- "v-card-actions",
891
- [
892
- _c("zd-button", {
893
- attrs: {
894
- name: "buttonClose_" + _vm.instance.name,
895
- flat: "",
896
- color: "secondary",
897
- label: "$t(CALENDAR_CLOSE)",
898
- },
899
- on: {
900
- click: function ($event) {
901
- _vm.selectedOpen = !_vm.selectedOpen;
902
- },
903
- },
904
- }),
905
- ],
906
- 1
907
- ),
908
1046
  ],
909
1047
  1
910
- ),
911
- ],
912
- 1
913
- ),
1048
+ )
1049
+ : _vm._e(),
914
1050
  ],
915
1051
  1
916
1052
  ),
@@ -926,7 +1062,7 @@ __vue_render__._withStripped = true;
926
1062
  /* style */
927
1063
  const __vue_inject_styles__ = function (inject) {
928
1064
  if (!inject) return
929
- inject("data-v-33e7b457_0", { source: ".zd-calendar {\n display: flex;\n flex-direction: column;\n}\n.zd-calendar-content {\n display: flex;\n overflow: auto;\n height: 100%;\n}\n.zd-calendar .zd-toolbar-calendar {\n display: flex;\n flex: 0 1 auto;\n justify-items: center;\n justify-content: space-between;\n background-color: #fff;\n padding: 0.75rem 0.5rem;\n margin: 0;\n}\n.zd-calendar .zd-toolbar-calendar.theme--dark {\n background-color: #1e1e1e;\n}\n.zd-calendar .zd-toolbar-calendar div {\n align-items: center;\n display: flex;\n}\n@media screen and (max-width: 376px) {\n.zd-calendar .zd-toolbar-calendar {\n flex-direction: column;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-nav-title,\n .zd-calendar .zd-toolbar-calendar .zd-calendar-button-today {\n max-width: 100%;\n flex: 1;\n align-items: center;\n justify-content: space-between !important;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-button-today button {\n width: 100%;\n margin-right: 0px !important;\n}\n}\n.zd-calendar .zd-calendar-content-title .zd-calendar-title {\n display: flex;\n flex-direction: column;\n width: 154px;\n}", map: undefined, media: undefined });
1065
+ inject("data-v-25f678fe_0", { source: ".zd-calendar {\n display: flex;\n flex-direction: column;\n}\n.zd-calendar .v-btn--fab {\n z-index: 2;\n}\n.zd-calendar-content {\n display: flex;\n overflow: auto;\n height: 100%;\n}\n.zd-calendar .zd-toolbar-calendar {\n display: flex;\n flex: 0 1 auto;\n justify-items: center;\n justify-content: space-between;\n background-color: #fff;\n padding: 0.75rem 0.5rem;\n margin: 0;\n}\n.zd-calendar .zd-toolbar-calendar.theme--dark {\n background-color: #1e1e1e;\n}\n.zd-calendar .zd-toolbar-calendar div {\n align-items: center;\n display: flex;\n}\n@media screen and (max-width: 376px) {\n.zd-calendar .zd-toolbar-calendar {\n flex-direction: column;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-nav-title,\n .zd-calendar .zd-toolbar-calendar .zd-calendar-button-today {\n max-width: 100%;\n flex: 1;\n align-items: center;\n justify-content: space-between !important;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-button-today button {\n width: 100%;\n margin-right: 0px !important;\n}\n}\n.zd-calendar .zd-calendar-content-title .zd-calendar-title {\n display: flex;\n flex-direction: column;\n width: 154px;\n}", map: undefined, media: undefined });
930
1066
 
931
1067
  };
932
1068
  /* scoped */
package/dist/calendar-vue.umd.js CHANGED
@@ -36,7 +36,7 @@
36
36
  this.instanceType = zdCalendarCommon.Calendar;
37
37
  this.selectedOpen = false;
38
38
  this.selectedElement = null;
39
- this.selectedEvent = {};
39
+ this.selectedEvent = null;
40
40
  this.showDatePicker = false;
41
41
  }
42
42
  onChangePicker() {
@@ -84,6 +84,9 @@
84
84
  this.instance.value = date;
85
85
  this.instance.type = 'day';
86
86
  }
87
+ callDayStyle(date) {
88
+ return (this.instance.dayStyle && typeof this.instance.dayStyle === 'function') ? this.instance.dayStyle(date) : '';
89
+ }
87
90
  showEvent({ nativeEvent, event }) {
88
91
  const open = () => {
89
92
  this.selectedEvent = event;
@@ -92,6 +95,7 @@
92
95
  };
93
96
  if (this.selectedOpen) {
94
97
  this.selectedOpen = false;
98
+ this.selectedEvent = null;
95
99
  requestAnimationFrame(() => requestAnimationFrame(() => open()));
96
100
  }
97
101
  else {
@@ -112,9 +116,15 @@
112
116
  }
113
117
  }
114
118
  clickEvent({ nativeEvent, event }) {
115
- this.instance.clickEvent(this.$el, nativeEvent);
119
+ this.instance.clickEvent(event, this.$el, nativeEvent);
116
120
  this.showEvent({ nativeEvent, event });
117
121
  }
122
+ clickEditEvent(selectedEvent, nativeEvent) {
123
+ this.instance.clickEditEvent(selectedEvent, this.$el, nativeEvent);
124
+ }
125
+ clickDeleteEvent(selectedEvent, nativeEvent) {
126
+ this.instance.clickDeleteEvent(selectedEvent, this.$el, nativeEvent);
127
+ }
118
128
  clickDay(event) {
119
129
  this.instance.clickDay(this.$el, event);
120
130
  }
@@ -133,6 +143,16 @@
133
143
  moved(event) {
134
144
  this.instance.moved(this.$el, event);
135
145
  }
146
+ callCanEditEvent(event) {
147
+ return typeof this.instance.canEditEvent === 'function' && event
148
+ ? this.instance.canEditEvent(event)
149
+ : this.instance.canEditEvent;
150
+ }
151
+ callCanDeleteEvent(event) {
152
+ return typeof this.instance.canDeleteEvent === 'function' && event
153
+ ? this.instance.canDeleteEvent(event)
154
+ : this.instance.canDeleteEvent;
155
+ }
136
156
  };
137
157
  __decorate([
138
158
  vuePropertyDecorator.Prop({ type: [String, Array], default: undefined }),
@@ -278,6 +298,18 @@
278
298
  vuePropertyDecorator.Prop({ type: Function, default: null }),
279
299
  __metadata("design:type", Object)
280
300
  ], ZdCalendar.prototype, "intervalStyle", void 0);
301
+ __decorate([
302
+ vuePropertyDecorator.Prop({ type: [Function, String], default: null }),
303
+ __metadata("design:type", Object)
304
+ ], ZdCalendar.prototype, "dayStyle", void 0);
305
+ __decorate([
306
+ vuetify.PropWatch({ type: [Function, Boolean, String], default: true }),
307
+ __metadata("design:type", Object)
308
+ ], ZdCalendar.prototype, "canDeleteEvent", void 0);
309
+ __decorate([
310
+ vuetify.PropWatch({ type: [Function, Boolean, String], default: true }),
311
+ __metadata("design:type", Object)
312
+ ], ZdCalendar.prototype, "canEditEvent", void 0);
281
313
  __decorate([
282
314
  vuetify.PropWatch({ type: [String, Number], default: 60 }),
283
315
  __metadata("design:type", Object)
@@ -760,7 +792,7 @@
760
792
  "interval-width": _vm.instance.intervalWidth,
761
793
  events: _vm.instance.calendarEvents,
762
794
  "first-interval": _vm.instance.firstInterval,
763
- "first-style": _vm.instance.intervalStyle,
795
+ "interval-style": _vm.instance.intervalStyle,
764
796
  "first-time": _vm.instance.firstTime,
765
797
  light: _vm.instance.light,
766
798
  id: _vm.instance.name,
@@ -801,6 +833,31 @@
801
833
  "click:time-category": _vm.clickTimeCategory,
802
834
  moved: _vm.moved,
803
835
  },
836
+ scopedSlots: _vm._u([
837
+ {
838
+ key: "day",
839
+ fn: function (ref) {
840
+ var date = ref.date;
841
+ return [
842
+ _c(
843
+ "div",
844
+ {
845
+ staticStyle: {
846
+ position: "absolute",
847
+ top: "0",
848
+ left: "0",
849
+ right: "0",
850
+ bottom: "0",
851
+ opacity: "0.5",
852
+ },
853
+ style: _vm.callDayStyle(date),
854
+ },
855
+ [_vm._v("\n  \n ")]
856
+ ),
857
+ ]
858
+ },
859
+ },
860
+ ]),
804
861
  model: {
805
862
  value: _vm.instance.value,
806
863
  callback: function ($$v) {
@@ -810,108 +867,187 @@
810
867
  },
811
868
  }),
812
869
  _vm._v(" "),
813
- _c(
814
- "v-menu",
815
- {
816
- attrs: {
817
- "close-on-content-click": false,
818
- activator: _vm.selectedElement,
819
- "offset-x": "",
820
- },
821
- model: {
822
- value: _vm.selectedOpen,
823
- callback: function ($$v) {
824
- _vm.selectedOpen = $$v;
825
- },
826
- expression: "selectedOpen",
827
- },
828
- },
829
- [
830
- _c(
831
- "zd-card",
870
+ _vm.selectedOpen
871
+ ? _c(
872
+ "v-menu",
832
873
  {
833
874
  attrs: {
834
- name: "card_" + _vm.instance.name,
835
- cssClass: "zd-pa-0",
836
- dark: _vm.instance.dark,
837
- light: _vm.instance.light,
875
+ "close-on-content-click": false,
876
+ activator: _vm.selectedElement,
877
+ "offset-x": "",
878
+ },
879
+ model: {
880
+ value: _vm.selectedOpen,
881
+ callback: function ($$v) {
882
+ _vm.selectedOpen = $$v;
883
+ },
884
+ expression: "selectedOpen",
838
885
  },
839
886
  },
840
887
  [
841
888
  _c(
842
- "v-toolbar",
889
+ "zd-card",
843
890
  {
844
891
  attrs: {
845
- color: _vm.selectedEvent.color,
846
- elevation: "0",
847
- dark: "",
892
+ name: "card_" + _vm.instance.name,
893
+ cssClass: "zd-pa-0",
894
+ dark: _vm.instance.dark,
895
+ light: _vm.instance.light,
848
896
  },
849
897
  },
850
898
  [
851
899
  _c(
852
- "zd-text",
853
- _vm._b(
854
- { attrs: { name: "title_" + _vm.instance.name } },
855
- "zd-text",
856
- {
857
- text: _vm.selectedEvent.name,
858
- tag: "h5",
900
+ "v-toolbar",
901
+ {
902
+ attrs: {
903
+ color: _vm.selectedEvent.color,
904
+ elevation: "0",
905
+ dark: "",
859
906
  },
860
- false
861
- )
907
+ },
908
+ [
909
+ _c(
910
+ "zd-text",
911
+ _vm._b(
912
+ {
913
+ staticClass: "mx-2",
914
+ attrs: {
915
+ name: "title_" + _vm.instance.name,
916
+ },
917
+ },
918
+ "zd-text",
919
+ {
920
+ text: _vm.selectedEvent.name,
921
+ tag: "h5",
922
+ },
923
+ false
924
+ )
925
+ ),
926
+ _vm._v(" "),
927
+ _c("v-spacer"),
928
+ _vm._v(" "),
929
+ _c(
930
+ "span",
931
+ [
932
+ _vm.callCanEditEvent(_vm.selectedEvent)
933
+ ? _c(
934
+ "v-btn",
935
+ {
936
+ attrs: { icon: "" },
937
+ on: {
938
+ click: function ($event) {
939
+ return _vm.clickEditEvent(
940
+ _vm.selectedEvent,
941
+ $event
942
+ )
943
+ },
944
+ },
945
+ },
946
+ [
947
+ _c(
948
+ "v-icon",
949
+ {
950
+ on: {
951
+ click: function ($event) {},
952
+ },
953
+ },
954
+ [
955
+ _vm._v(
956
+ "\n " +
957
+ _vm._s(
958
+ _vm.$getIcon("pencil")
959
+ ) +
960
+ "\n "
961
+ ),
962
+ ]
963
+ ),
964
+ ],
965
+ 1
966
+ )
967
+ : _vm._e(),
968
+ _vm._v(" "),
969
+ _vm.callCanDeleteEvent(_vm.selectedEvent)
970
+ ? _c(
971
+ "v-btn",
972
+ {
973
+ attrs: { icon: "" },
974
+ on: {
975
+ click: function ($event) {
976
+ return _vm.clickDeleteEvent(
977
+ _vm.selectedEvent,
978
+ $event
979
+ )
980
+ },
981
+ },
982
+ },
983
+ [
984
+ _c("v-icon", [
985
+ _vm._v(
986
+ "\n " +
987
+ _vm._s(_vm.$getIcon("trash")) +
988
+ "\n "
989
+ ),
990
+ ]),
991
+ ],
992
+ 1
993
+ )
994
+ : _vm._e(),
995
+ ],
996
+ 1
997
+ ),
998
+ ],
999
+ 1
862
1000
  ),
863
- ],
864
- 1
865
- ),
866
- _vm._v(" "),
867
- _c(
868
- "v-card-text",
869
- [
1001
+ _vm._v(" "),
870
1002
  _c(
871
- "zd-text",
872
- _vm._b(
873
- {
1003
+ "v-card-text",
1004
+ [
1005
+ _c(
1006
+ "zd-text",
1007
+ _vm._b(
1008
+ {
1009
+ attrs: {
1010
+ name: "description_" + _vm.instance.name,
1011
+ },
1012
+ },
1013
+ "zd-text",
1014
+ {
1015
+ text: _vm.selectedEvent.description,
1016
+ tag: "p",
1017
+ },
1018
+ false
1019
+ )
1020
+ ),
1021
+ ],
1022
+ 1
1023
+ ),
1024
+ _vm._v(" "),
1025
+ _c(
1026
+ "v-card-actions",
1027
+ [
1028
+ _c("zd-button", {
874
1029
  attrs: {
875
- name: "description_" + _vm.instance.name,
1030
+ name: "buttonClose_" + _vm.instance.name,
1031
+ flat: "",
1032
+ color: "secondary",
1033
+ label: "$t(CALENDAR_CLOSE)",
876
1034
  },
877
- },
878
- "zd-text",
879
- {
880
- text: _vm.selectedEvent.description,
881
- tag: "p",
882
- },
883
- false
884
- )
1035
+ on: {
1036
+ click: function ($event) {
1037
+ _vm.selectedOpen = !_vm.selectedOpen;
1038
+ },
1039
+ },
1040
+ }),
1041
+ ],
1042
+ 1
885
1043
  ),
886
1044
  ],
887
1045
  1
888
1046
  ),
889
- _vm._v(" "),
890
- _c(
891
- "v-card-actions",
892
- [
893
- _c("zd-button", {
894
- attrs: {
895
- name: "buttonClose_" + _vm.instance.name,
896
- flat: "",
897
- color: "secondary",
898
- label: "$t(CALENDAR_CLOSE)",
899
- },
900
- on: {
901
- click: function ($event) {
902
- _vm.selectedOpen = !_vm.selectedOpen;
903
- },
904
- },
905
- }),
906
- ],
907
- 1
908
- ),
909
1047
  ],
910
1048
  1
911
- ),
912
- ],
913
- 1
914
- ),
1049
+ )
1050
+ : _vm._e(),
915
1051
  ],
916
1052
  1
917
1053
  ),
@@ -927,7 +1063,7 @@
927
1063
  /* style */
928
1064
  const __vue_inject_styles__ = function (inject) {
929
1065
  if (!inject) return
930
- inject("data-v-33e7b457_0", { source: ".zd-calendar {\n display: flex;\n flex-direction: column;\n}\n.zd-calendar-content {\n display: flex;\n overflow: auto;\n height: 100%;\n}\n.zd-calendar .zd-toolbar-calendar {\n display: flex;\n flex: 0 1 auto;\n justify-items: center;\n justify-content: space-between;\n background-color: #fff;\n padding: 0.75rem 0.5rem;\n margin: 0;\n}\n.zd-calendar .zd-toolbar-calendar.theme--dark {\n background-color: #1e1e1e;\n}\n.zd-calendar .zd-toolbar-calendar div {\n align-items: center;\n display: flex;\n}\n@media screen and (max-width: 376px) {\n.zd-calendar .zd-toolbar-calendar {\n flex-direction: column;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-nav-title,\n .zd-calendar .zd-toolbar-calendar .zd-calendar-button-today {\n max-width: 100%;\n flex: 1;\n align-items: center;\n justify-content: space-between !important;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-button-today button {\n width: 100%;\n margin-right: 0px !important;\n}\n}\n.zd-calendar .zd-calendar-content-title .zd-calendar-title {\n display: flex;\n flex-direction: column;\n width: 154px;\n}", map: undefined, media: undefined });
1066
+ inject("data-v-25f678fe_0", { source: ".zd-calendar {\n display: flex;\n flex-direction: column;\n}\n.zd-calendar .v-btn--fab {\n z-index: 2;\n}\n.zd-calendar-content {\n display: flex;\n overflow: auto;\n height: 100%;\n}\n.zd-calendar .zd-toolbar-calendar {\n display: flex;\n flex: 0 1 auto;\n justify-items: center;\n justify-content: space-between;\n background-color: #fff;\n padding: 0.75rem 0.5rem;\n margin: 0;\n}\n.zd-calendar .zd-toolbar-calendar.theme--dark {\n background-color: #1e1e1e;\n}\n.zd-calendar .zd-toolbar-calendar div {\n align-items: center;\n display: flex;\n}\n@media screen and (max-width: 376px) {\n.zd-calendar .zd-toolbar-calendar {\n flex-direction: column;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-nav-title,\n .zd-calendar .zd-toolbar-calendar .zd-calendar-button-today {\n max-width: 100%;\n flex: 1;\n align-items: center;\n justify-content: space-between !important;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-button-today button {\n width: 100%;\n margin-right: 0px !important;\n}\n}\n.zd-calendar .zd-calendar-content-title .zd-calendar-title {\n display: flex;\n flex-direction: column;\n width: 154px;\n}", map: undefined, media: undefined });
931
1067
 
932
1068
  };
933
1069
  /* scoped */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zeedhi/zd-calendar-vue",
3
- "version": "1.6.1",
3
+ "version": "1.7.0",
4
4
  "description": "Powered by Zeedhi",
5
5
  "main": "dist/calendar-vue.umd.js",
6
6
  "module": "dist/calendar-vue.esm.js",
@@ -20,5 +20,5 @@
20
20
  "vue-class-component": "7.2.*",
21
21
  "vue-property-decorator": "9.1.*"
22
22
  },
23
- "gitHead": "9f1ce5fd3fe8d169a3f78a04f93e09249af2c0d4"
23
+ "gitHead": "26b12f1ca3ad6e8900a8207633f56b3e2d85923d"
24
24
  }
package/types/Calendar.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { ZdComponentRender } from '@zeedhi/vuetify';
2
- import { Calendar } from '@zeedhi/zd-calendar-common';
2
+ import { Calendar, CalendarEvents } from '@zeedhi/zd-calendar-common';
3
3
  export default class ZdCalendar extends ZdComponentRender {
4
4
  categories: string | [];
5
5
  categoryDays: number | string;
@@ -37,6 +37,9 @@ export default class ZdCalendar extends ZdComponentRender {
37
37
  intervalHeight: number | string;
38
38
  intervalMinutes: number | string;
39
39
  intervalStyle: Function | null;
40
+ dayStyle: Function | null | string;
41
+ canDeleteEvent: Function | boolean | string;
42
+ canEditEvent: Function | boolean | string;
40
43
  intervalWidth: number | string;
41
44
  locale: string;
42
45
  localeFirstDayOfYear: number | string;
@@ -60,7 +63,7 @@ export default class ZdCalendar extends ZdComponentRender {
60
63
  instanceType: typeof Calendar;
61
64
  selectedOpen: boolean;
62
65
  selectedElement: null;
63
- selectedEvent: Function | {} | [];
66
+ selectedEvent?: object | null;
64
67
  showDatePicker: boolean;
65
68
  onChangePicker(): void;
66
69
  get titleLabel(): string;
@@ -69,14 +72,19 @@ export default class ZdCalendar extends ZdComponentRender {
69
72
  next(event: Event): void;
70
73
  setType(select: any): void;
71
74
  viewDay(date: string): void;
75
+ callDayStyle(date: string): string | object;
72
76
  showEvent({ nativeEvent, event }: any): void;
73
77
  clickDate(event: Event): void;
74
78
  clickMore(event: Event): void;
75
79
  clickEvent({ nativeEvent, event }: any): void;
80
+ clickEditEvent(selectedEvent: CalendarEvents, nativeEvent: Event): void;
81
+ clickDeleteEvent(selectedEvent: CalendarEvents, nativeEvent: Event): void;
76
82
  clickDay(event: Event): void;
77
83
  clickDayCategory(event: Event): void;
78
84
  clickInterval(event: Event): void;
79
85
  clickTime(event: Event): void;
80
86
  clickTimeCategory(event: Event): void;
81
87
  moved(event: Event): void;
88
+ callCanEditEvent(event: CalendarEvents): boolean | ((event: CalendarEvents) => boolean) | undefined;
89
+ callCanDeleteEvent(event: CalendarEvents): boolean | ((event: CalendarEvents) => boolean) | undefined;
82
90
  }