@dative-gpi/foundation-shared-components 1.0.26 → 1.0.28-remove-deprecated2
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.
- package/components/FSBreadcrumbs.vue +1 -0
- package/components/FSButton.vue +10 -10
- package/components/FSCalendar.vue +52 -14
- package/components/FSCalendarTwin.vue +96 -40
- package/components/FSCard.vue +28 -7
- package/components/FSCardPlaceholder.vue +8 -5
- package/components/FSChip.vue +12 -2
- package/components/FSClickable.vue +20 -12
- package/components/FSClock.vue +16 -7
- package/components/FSColorIcon.vue +23 -5
- package/components/FSDialog.vue +2 -1
- package/components/FSDialogContent.vue +12 -11
- package/components/FSDialogForm.vue +22 -2
- package/components/FSDialogFormBody.vue +51 -32
- package/components/FSDialogMultiFormBody.vue +79 -56
- package/components/FSDialogRemove.vue +7 -7
- package/components/FSDialogSubmit.vue +20 -11
- package/components/FSEditImage.vue +1 -1
- package/components/FSEditImageUI.vue +20 -10
- package/components/FSFadeOut.vue +44 -18
- package/components/FSForm.vue +10 -8
- package/components/FSGrid.vue +1 -1
- package/components/FSIcon.vue +2 -1
- package/components/FSIconCard.vue +21 -4
- package/components/FSImage.vue +12 -4
- package/components/FSImageUI.vue +8 -15
- package/components/FSLink.vue +25 -9
- package/components/FSLoader.vue +28 -11
- package/components/FSOptionGroup.vue +51 -3
- package/components/FSRouterLink.vue +42 -0
- package/components/FSSlideGroup.vue +19 -5
- package/components/FSSpan.vue +9 -2
- package/components/FSSwitch.vue +57 -27
- package/components/FSTab.vue +15 -13
- package/components/FSTabs.vue +32 -7
- package/components/FSTag.vue +14 -3
- package/components/FSTagGroup.vue +1 -1
- package/components/FSText.vue +4 -2
- package/components/FSWindow.vue +128 -4
- package/components/FSWrapGroup.vue +13 -1
- package/components/agenda/FSAgenda.vue +223 -0
- package/components/agenda/FSAgendaDialogCalendar.vue +76 -0
- package/components/agenda/FSAgendaHeader.vue +215 -0
- package/components/agenda/FSAgendaHorizontalEvent.vue +174 -0
- package/components/agenda/FSAgendaHorizontalTimeLineMarker.vue +46 -0
- package/components/agenda/FSAgendaHoursCol.vue +103 -0
- package/components/agenda/FSAgendaHoursRow.vue +164 -0
- package/components/agenda/FSAgendaVerticalEvent.vue +160 -0
- package/components/agenda/FSAgendaVerticalTimeLineMarker.vue +46 -0
- package/components/agenda/FSDayAgenda.vue +199 -0
- package/components/agenda/FSMonthAgenda.vue +252 -0
- package/components/agenda/FSSelectAgendaMode.vue +54 -0
- package/components/agenda/FSWeekAgenda.vue +323 -0
- package/components/autocompletes/FSAutoCompleteAddress.vue +22 -20
- package/components/autocompletes/FSAutocompleteLanguage.vue +24 -39
- package/components/autocompletes/FSAutocompleteTimeZone.vue +26 -38
- package/components/buttons/FSButtonAdd.vue +1 -1
- package/components/buttons/FSButtonAddLabel.vue +1 -1
- package/components/buttons/FSButtonCancel.vue +1 -1
- package/components/buttons/FSButtonCancelLabel.vue +1 -1
- package/components/buttons/FSButtonCopy.vue +28 -0
- package/components/buttons/FSButtonCopyIcon.vue +28 -0
- package/components/buttons/FSButtonCopyLabel.vue +27 -0
- package/components/buttons/FSButtonCopyMini.vue +28 -0
- package/components/buttons/FSButtonDragIcon.vue +27 -0
- package/components/buttons/FSButtonDuplicate.vue +1 -1
- package/components/buttons/FSButtonDuplicateLabel.vue +1 -1
- package/components/buttons/FSButtonEdit.vue +1 -1
- package/components/buttons/FSButtonEditLabel.vue +1 -1
- package/components/buttons/FSButtonFile.vue +1 -1
- package/components/buttons/FSButtonFileLabel.vue +1 -1
- package/components/buttons/FSButtonNext.vue +1 -1
- package/components/buttons/FSButtonNextLabel.vue +1 -1
- package/components/buttons/FSButtonPrevious.vue +1 -1
- package/components/buttons/FSButtonPreviousLabel.vue +1 -1
- package/components/buttons/FSButtonRedo.vue +1 -1
- package/components/buttons/FSButtonRedoLabel.vue +1 -1
- package/components/buttons/FSButtonRemove.vue +1 -1
- package/components/buttons/FSButtonRemoveLabel.vue +1 -1
- package/components/buttons/FSButtonSave.vue +1 -1
- package/components/buttons/FSButtonSaveLabel.vue +1 -1
- package/components/buttons/FSButtonSearch.vue +1 -1
- package/components/buttons/FSButtonSearchLabel.vue +1 -1
- package/components/buttons/FSButtonUndo.vue +1 -1
- package/components/buttons/FSButtonUndoLabel.vue +1 -1
- package/components/buttons/FSButtonUpdate.vue +1 -1
- package/components/buttons/FSButtonUpdateLabel.vue +1 -1
- package/components/buttons/FSButtonValidate.vue +1 -1
- package/components/buttons/FSButtonValidateLabel.vue +1 -1
- package/components/calendar/FSSimpleCalendar.vue +145 -0
- package/components/calendar/FSSimpleCalendarHeader.vue +60 -0
- package/components/calendar/FSSimpleMonthSelector.vue +138 -0
- package/components/deviceOrganisations/FSConnectivity.vue +11 -1
- package/components/deviceOrganisations/FSConnectivityCard.vue +19 -47
- package/components/deviceOrganisations/FSStatus.vue +11 -1
- package/components/deviceOrganisations/FSStatusCard.vue +35 -61
- package/components/deviceOrganisations/FSStatusesCarousel.vue +1 -0
- package/components/deviceOrganisations/FSStatusesRow.vue +9 -3
- package/components/deviceOrganisations/FSWorstAlert.vue +30 -37
- package/components/deviceOrganisations/FSWorstAlertCard.vue +36 -85
- package/components/fields/FSAutocompleteField.vue +516 -341
- package/components/fields/FSAutocompleteTag.vue +100 -0
- package/components/fields/FSBaseField.vue +44 -27
- package/components/fields/FSColorField.vue +42 -39
- package/components/fields/FSCommentField.vue +105 -0
- package/components/fields/FSDateField.vue +2 -2
- package/components/fields/FSDateRangeField.vue +3 -2
- package/components/fields/FSDateTimeField.vue +4 -3
- package/components/fields/FSDateTimeRangeField.vue +8 -6
- package/components/fields/FSEntityFieldUI.vue +271 -0
- package/components/fields/FSGradientField.vue +27 -33
- package/components/fields/FSIconField.vue +0 -1
- package/components/fields/FSMagicConfigField.vue +34 -19
- package/components/fields/FSMagicField.vue +9 -4
- package/components/fields/FSNumberField.vue +13 -6
- package/components/fields/FSRichTextField.vue +102 -52
- package/components/fields/FSSearchField.vue +9 -115
- package/components/fields/FSSelectField.vue +489 -252
- package/components/fields/FSTagField.vue +1 -1
- package/components/fields/FSTermField.vue +33 -11
- package/components/fields/FSTextArea.vue +26 -7
- package/components/fields/FSTextField.vue +19 -10
- package/components/fields/FSTimeRangeField.vue +304 -0
- package/components/fields/FSTimeStepField.vue +3 -3
- package/components/fields/FSTranslateField.vue +4 -3
- package/components/fields/FSTranslateRichTextField.vue +15 -10
- package/components/fields/FSTranslateTextArea.vue +233 -0
- package/components/fields/FSTreeViewField.vue +3 -3
- package/components/fields/periodicField/FSPeriodicDailyField.vue +120 -0
- package/components/fields/periodicField/FSPeriodicField.vue +131 -0
- package/components/fields/periodicField/FSPeriodicMonthlyField.vue +222 -0
- package/components/fields/periodicField/FSPeriodicWeeklyField.vue +120 -0
- package/components/fields/periodicField/FSPeriodicYearlyField.vue +144 -0
- package/components/lists/FSDataTableUI.vue +148 -89
- package/components/lists/FSDraggable.vue +2 -2
- package/components/lists/FSFilterButton.vue +23 -28
- package/components/lists/FSHeaderButton.vue +4 -4
- package/components/lists/FSHiddenButton.vue +11 -15
- package/components/lists/FSLoadDataTable.vue +10 -7
- package/components/lists/FSSimpleList.vue +234 -0
- package/components/lists/FSSimpleListItem.vue +132 -0
- package/components/map/FSMap.vue +280 -399
- package/components/map/FSMapFeatureGroup.vue +51 -0
- package/components/map/FSMapLayerButton.vue +5 -5
- package/components/map/FSMapMarker.vue +120 -0
- package/components/map/FSMapMarkerClusterGroup.vue +72 -0
- package/components/map/FSMapOverlay.vue +70 -82
- package/components/map/FSMapPolygon.vue +81 -0
- package/components/map/FSMapTileLayer.vue +50 -0
- package/components/map/keys.ts +4 -0
- package/components/selects/FSSelectAutoRefresh.vue +9 -9
- package/components/selects/FSSelectDashboardVariableType.vue +5 -4
- package/components/selects/FSSelectDateSetting.vue +3 -2
- package/components/selects/FSSelectDays.vue +9 -9
- package/components/selects/FSSelectListMode.vue +51 -0
- package/components/selects/FSSelectMonths.vue +67 -0
- package/components/selects/chartSelectors/FSAggregationSelector.vue +52 -0
- package/components/selects/chartSelectors/FSAxisTypeSelector.vue +49 -0
- package/components/selects/chartSelectors/FSDisplayAsSelector.vue +53 -0
- package/components/selects/chartSelectors/FSFilterTypeSelector.vue +54 -0
- package/components/selects/chartSelectors/FSHeatmapRuleSelector.vue +54 -0
- package/components/selects/chartSelectors/FSOperationOnSelector.vue +53 -0
- package/components/selects/chartSelectors/FSPlanningTypeSelector.vue +53 -0
- package/components/selects/chartSelectors/FSPlotPerSelector.vue +52 -0
- package/components/selects/chartSelectors/FSSelectEntityType.vue +59 -0
- package/components/selects/chartSelectors/FSSerieTypeSelector.vue +53 -0
- package/components/tiles/FSAlertTileUI.vue +90 -0
- package/components/tiles/FSChartTile.vue +73 -0
- package/components/tiles/FSChartTileUI.vue +111 -0
- package/components/tiles/FSCommentTileUI.vue +174 -0
- package/components/tiles/FSDeviceOrganisationTileUI.vue +6 -0
- package/components/tiles/FSGroupTileUI.vue +2 -2
- package/components/tiles/FSLoadTile.vue +2 -0
- package/components/tiles/FSLocationTileUI.vue +192 -0
- package/components/tiles/FSModelTileUI.vue +18 -0
- package/components/tiles/FSSimpleTileUI.vue +9 -4
- package/components/tiles/FSTile.vue +93 -74
- package/components/tiles/FSUserOrganisationTileUI.vue +1 -1
- package/components/toggleSets/FSToggleSetPosition.vue +2 -2
- package/components/views/FSBaseView.vue +64 -0
- package/components/views/FSEntityView.vue +12 -140
- package/components/views/FSSimpleView.vue +29 -0
- package/components/views/desktop/FSBaseDefaultDesktopView.vue +134 -0
- package/components/views/desktop/FSBaseDesktopView.vue +53 -0
- package/components/views/desktop/FSBaseEntityDesktopView.vue +208 -0
- package/components/views/mobile/FSBaseDefaultMobileView.vue +132 -0
- package/components/views/mobile/FSBaseEntityMobileView.vue +198 -0
- package/components/views/mobile/FSBaseMobileView.vue +53 -0
- package/composables/useAddress.ts +2 -2
- package/composables/useBreakpoints.ts +39 -3
- package/composables/useColors.ts +3 -2
- package/composables/useMagicFieldProvider.ts +1 -0
- package/models/agenda.ts +9 -0
- package/models/deviceAlerts.ts +1 -1
- package/models/deviceConnectivities.ts +1 -1
- package/models/index.ts +1 -0
- package/models/magicFields.ts +1 -0
- package/models/map.ts +2 -2
- package/models/rules.ts +5 -5
- package/models/tables.ts +5 -2
- package/models/variableNode.ts +8 -5
- package/package.json +5 -5
- package/styles/components/fs_agenda.scss +36 -0
- package/styles/components/fs_agenda_event.scss +41 -0
- package/styles/components/fs_agenda_hours_col.scss +4 -0
- package/styles/components/fs_agenda_hours_row.scss +5 -0
- package/styles/components/fs_agenda_time_line_marker.scss +19 -0
- package/styles/components/fs_autocomplete_field.scss +0 -13
- package/styles/components/fs_breadcrumbs.scss +6 -12
- package/styles/components/fs_card.scss +0 -1
- package/styles/components/fs_clickable.scss +7 -14
- package/styles/components/fs_clock.scss +0 -10
- package/styles/components/fs_color_field.scss +1 -4
- package/styles/components/fs_data_table.scss +6 -9
- package/styles/components/fs_dialog.scss +7 -17
- package/styles/components/fs_edit_image.scss +8 -0
- package/styles/components/fs_fade_out.scss +11 -2
- package/styles/components/fs_filter_button.scss +1 -6
- package/styles/components/fs_gradient_field.scss +11 -11
- package/styles/components/fs_hidden_button.scss +2 -7
- package/styles/components/fs_image_card.scss +1 -1
- package/styles/components/fs_magic_config_field.scss +1 -2
- package/styles/components/fs_map.scss +36 -30
- package/styles/components/fs_meta_field.scss +3 -5
- package/styles/components/fs_option_group.scss +15 -5
- package/styles/components/fs_rich_text_field.scss +1 -9
- package/styles/components/fs_select_date_settings.scss +3 -0
- package/styles/components/fs_select_field.scss +0 -13
- package/styles/components/fs_slide_group.scss +7 -0
- package/styles/components/fs_span.scss +2 -1
- package/styles/components/fs_switch.scss +1 -0
- package/styles/components/fs_tabs.scss +10 -24
- package/styles/components/fs_tag.scss +3 -19
- package/styles/components/fs_text_area.scss +13 -17
- package/styles/components/fs_tile.scss +21 -15
- package/styles/components/fs_window.scss +7 -0
- package/styles/components/fs_wrap_group.scss +7 -0
- package/styles/components/index.scss +5 -5
- package/styles/globals/index.scss +1 -5
- package/styles/globals/overrides.scss +17 -57
- package/styles/globals/text_fonts.scss +18 -66
- package/tools/alertsTools.ts +69 -0
- package/tools/chartsTools.ts +427 -0
- package/tools/index.ts +3 -0
- package/tools/timeRangeTools.ts +125 -0
- package/utils/filter.ts +18 -0
- package/utils/index.ts +1 -0
- package/utils/leafletMarkers.ts +9 -3
- package/utils/sort.ts +2 -2
- package/utils/statuses.ts +1 -1
- package/utils/time.ts +17 -17
- package/components/autocompletes/FSAutocompleteTag.vue +0 -138
- package/components/fields/FSTimeSlotField.vue +0 -250
- package/components/map/FSMapEditPointAddressOverlay.vue +0 -164
- package/components/views/FSEntityHeader.vue +0 -350
- package/components/views/FSListHeader.vue +0 -83
- package/components/views/FSListView.vue +0 -83
- package/components/views/FSSkeletonView.vue +0 -100
- package/styles/components/fs_icon_field.scss +0 -12
- package/styles/components/fs_map_overlay.scss +0 -38
- package/styles/components/fs_tag_field.scss +0 -8
- package/styles/components/fs_time_field.scss +0 -12
- package/styles/components/fs_timeslot_field.scss +0 -12
- package/styles/globals/breakpoints.scss +0 -20
- package/styles/globals/fixes.scss +0 -5
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSButton
|
|
3
|
+
prependIcon="mdi-content-copy"
|
|
4
|
+
:label="$tr('ui.common.copy', 'Copy')"
|
|
5
|
+
:color="ColorEnum.Light"
|
|
6
|
+
v-bind="$attrs"
|
|
7
|
+
/>
|
|
8
|
+
</template>
|
|
9
|
+
|
|
10
|
+
<script lang="ts">
|
|
11
|
+
import { defineComponent } from "vue";
|
|
12
|
+
|
|
13
|
+
import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
|
|
14
|
+
|
|
15
|
+
import FSButton from "../FSButton.vue";
|
|
16
|
+
|
|
17
|
+
export default defineComponent({
|
|
18
|
+
name: "FSButtonCopy",
|
|
19
|
+
components: {
|
|
20
|
+
FSButton
|
|
21
|
+
},
|
|
22
|
+
setup() {
|
|
23
|
+
return {
|
|
24
|
+
ColorEnum
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
</script>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSButton
|
|
3
|
+
icon="mdi-content-copy"
|
|
4
|
+
variant="icon"
|
|
5
|
+
:color="ColorEnum.Light"
|
|
6
|
+
v-bind="$attrs"
|
|
7
|
+
/>
|
|
8
|
+
</template>
|
|
9
|
+
|
|
10
|
+
<script lang="ts">
|
|
11
|
+
import { defineComponent } from "vue";
|
|
12
|
+
|
|
13
|
+
import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
|
|
14
|
+
|
|
15
|
+
import FSButton from "../FSButton.vue";
|
|
16
|
+
|
|
17
|
+
export default defineComponent({
|
|
18
|
+
name: "FSButtonCopyIcon",
|
|
19
|
+
components: {
|
|
20
|
+
FSButton
|
|
21
|
+
},
|
|
22
|
+
setup() {
|
|
23
|
+
return {
|
|
24
|
+
ColorEnum
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
</script>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSButton
|
|
3
|
+
:label="$tr('ui.common.copy', 'Copy')"
|
|
4
|
+
:color="ColorEnum.Light"
|
|
5
|
+
v-bind="$attrs"
|
|
6
|
+
/>
|
|
7
|
+
</template>
|
|
8
|
+
|
|
9
|
+
<script lang="ts">
|
|
10
|
+
import { defineComponent } from "vue";
|
|
11
|
+
|
|
12
|
+
import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
|
|
13
|
+
|
|
14
|
+
import FSButton from "../FSButton.vue";
|
|
15
|
+
|
|
16
|
+
export default defineComponent({
|
|
17
|
+
name: "FSButtonCopyLabel",
|
|
18
|
+
components: {
|
|
19
|
+
FSButton
|
|
20
|
+
},
|
|
21
|
+
setup() {
|
|
22
|
+
return {
|
|
23
|
+
ColorEnum
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
</script>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSButton
|
|
3
|
+
prependIcon="mdi-content-copy"
|
|
4
|
+
|
|
5
|
+
:color="ColorEnum.Light"
|
|
6
|
+
v-bind="$attrs"
|
|
7
|
+
/>
|
|
8
|
+
</template>
|
|
9
|
+
|
|
10
|
+
<script lang="ts">
|
|
11
|
+
import { defineComponent } from "vue";
|
|
12
|
+
|
|
13
|
+
import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
|
|
14
|
+
|
|
15
|
+
import FSButton from "../FSButton.vue";
|
|
16
|
+
|
|
17
|
+
export default defineComponent({
|
|
18
|
+
name: "FSButtonCopyMini",
|
|
19
|
+
components: {
|
|
20
|
+
FSButton
|
|
21
|
+
},
|
|
22
|
+
setup() {
|
|
23
|
+
return {
|
|
24
|
+
ColorEnum
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
</script>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSButton
|
|
3
|
+
icon="mdi-drag"
|
|
4
|
+
variant="icon"
|
|
5
|
+
v-bind="$attrs"
|
|
6
|
+
/>
|
|
7
|
+
</template>
|
|
8
|
+
|
|
9
|
+
<script lang="ts">
|
|
10
|
+
import { defineComponent } from "vue";
|
|
11
|
+
|
|
12
|
+
import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
|
|
13
|
+
|
|
14
|
+
import FSButton from "../FSButton.vue";
|
|
15
|
+
|
|
16
|
+
export default defineComponent({
|
|
17
|
+
name: "FSButtonCopyIcon",
|
|
18
|
+
components: {
|
|
19
|
+
FSButton
|
|
20
|
+
},
|
|
21
|
+
setup() {
|
|
22
|
+
return {
|
|
23
|
+
ColorEnum
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
</script>
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSCol>
|
|
3
|
+
<FSRow
|
|
4
|
+
v-if="$props.showHeader"
|
|
5
|
+
:wrap="false"
|
|
6
|
+
>
|
|
7
|
+
<FSCol
|
|
8
|
+
v-for="i in 7"
|
|
9
|
+
:key="i"
|
|
10
|
+
:style="{
|
|
11
|
+
minWidth: `calc((100% - 8px * 7) / 7)`,
|
|
12
|
+
maxWidth: `calc((100% - 8px * 7) / 7)`
|
|
13
|
+
}"
|
|
14
|
+
align="center-center"
|
|
15
|
+
>
|
|
16
|
+
{{ dayLabel(i - 1) }}
|
|
17
|
+
</FSCol>
|
|
18
|
+
</FSRow>
|
|
19
|
+
<FSRow>
|
|
20
|
+
<FSCol
|
|
21
|
+
v-for="date in days"
|
|
22
|
+
:key="$props.month + $props.year + date.date.toISOString()"
|
|
23
|
+
:style="{
|
|
24
|
+
minWidth: `calc((100% - 8px * 7) / 7)`,
|
|
25
|
+
maxWidth: `calc((100% - 8px * 7) / 7)`
|
|
26
|
+
}"
|
|
27
|
+
align="center-center"
|
|
28
|
+
height="hug"
|
|
29
|
+
>
|
|
30
|
+
<slot
|
|
31
|
+
name="day"
|
|
32
|
+
v-bind="date"
|
|
33
|
+
/>
|
|
34
|
+
</FSCol>
|
|
35
|
+
</FSRow>
|
|
36
|
+
</FSCol>
|
|
37
|
+
</template>
|
|
38
|
+
|
|
39
|
+
<script lang="ts">
|
|
40
|
+
import { startOfWeek, endOfWeek, endOfMonth, isSameDay, isBefore, isAfter, isSameMonth, addDays } from "date-fns";
|
|
41
|
+
import { defineComponent, computed } from "vue";
|
|
42
|
+
|
|
43
|
+
import { dayLabel } from "../../tools";
|
|
44
|
+
|
|
45
|
+
import { useAppTimeZone } from "@dative-gpi/foundation-shared-services/composables";
|
|
46
|
+
|
|
47
|
+
import FSRow from "../FSRow.vue";
|
|
48
|
+
import FSCol from "../FSCol.vue";
|
|
49
|
+
|
|
50
|
+
export default defineComponent({
|
|
51
|
+
name: "FSCalendarHeader",
|
|
52
|
+
components: {
|
|
53
|
+
FSRow,
|
|
54
|
+
FSCol
|
|
55
|
+
},
|
|
56
|
+
props: {
|
|
57
|
+
year: {
|
|
58
|
+
type: Number,
|
|
59
|
+
required: true
|
|
60
|
+
},
|
|
61
|
+
month: {
|
|
62
|
+
type: Number,
|
|
63
|
+
required: true
|
|
64
|
+
},
|
|
65
|
+
showHeader: {
|
|
66
|
+
type: Boolean,
|
|
67
|
+
default: true
|
|
68
|
+
}
|
|
69
|
+
},
|
|
70
|
+
setup(props) {
|
|
71
|
+
|
|
72
|
+
const { getMachineOffset } = useAppTimeZone();
|
|
73
|
+
|
|
74
|
+
const firstDayOfMonth = computed(() => {
|
|
75
|
+
const date = new Date(props.year, props.month - 1, 1);
|
|
76
|
+
const offset = getMachineOffset(date.getTime());
|
|
77
|
+
|
|
78
|
+
date.setTime(date.getTime() + offset);
|
|
79
|
+
|
|
80
|
+
return date;
|
|
81
|
+
})
|
|
82
|
+
|
|
83
|
+
const firstMonday = computed(() => {
|
|
84
|
+
const day = new Date(firstDayOfMonth.value);
|
|
85
|
+
|
|
86
|
+
const date = startOfWeek(day, { weekStartsOn: 1 });
|
|
87
|
+
const offset = getMachineOffset(date.getTime());
|
|
88
|
+
|
|
89
|
+
date.setTime(date.getTime() + offset);
|
|
90
|
+
|
|
91
|
+
return date;
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
const endDayOfMonth = computed(() => {
|
|
95
|
+
const day = new Date(firstDayOfMonth.value);
|
|
96
|
+
|
|
97
|
+
const date = endOfMonth(day);
|
|
98
|
+
const offset = getMachineOffset(date.getTime());
|
|
99
|
+
|
|
100
|
+
date.setTime(date.getTime() + offset);
|
|
101
|
+
|
|
102
|
+
return date;
|
|
103
|
+
});
|
|
104
|
+
|
|
105
|
+
const lastSunday = computed(() => {
|
|
106
|
+
const day = new Date(endDayOfMonth.value);
|
|
107
|
+
|
|
108
|
+
const date = endOfWeek(day, { weekStartsOn: 1 });
|
|
109
|
+
const offset = getMachineOffset(date.getTime());
|
|
110
|
+
|
|
111
|
+
date.setTime(date.getTime() + offset);
|
|
112
|
+
|
|
113
|
+
return date;
|
|
114
|
+
});
|
|
115
|
+
|
|
116
|
+
const days = computed(() => {
|
|
117
|
+
const result = [];
|
|
118
|
+
|
|
119
|
+
let currentDay = new Date(firstMonday.value);
|
|
120
|
+
const today = new Date();
|
|
121
|
+
|
|
122
|
+
while (currentDay <= lastSunday.value) {
|
|
123
|
+
result.push({
|
|
124
|
+
date: new Date(currentDay),
|
|
125
|
+
isToday: isSameDay(currentDay, today),
|
|
126
|
+
isPast: isBefore(currentDay, today) && !isSameDay(currentDay, today),
|
|
127
|
+
isFutur: isAfter(currentDay, today) && !isSameDay(currentDay, today),
|
|
128
|
+
isPreviousMonth: isBefore(currentDay, firstDayOfMonth.value),
|
|
129
|
+
isNextMonth: isAfter(currentDay, endDayOfMonth.value),
|
|
130
|
+
isCurrentMonth: isSameMonth(currentDay, firstDayOfMonth.value)
|
|
131
|
+
});
|
|
132
|
+
|
|
133
|
+
currentDay = addDays(currentDay, 1);
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
return result;
|
|
137
|
+
});
|
|
138
|
+
|
|
139
|
+
return {
|
|
140
|
+
dayLabel,
|
|
141
|
+
days
|
|
142
|
+
};
|
|
143
|
+
}
|
|
144
|
+
});
|
|
145
|
+
</script>
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<FSRow>
|
|
3
|
+
<FSSimpleMonthSelector
|
|
4
|
+
width="hug"
|
|
5
|
+
:year="$props.year"
|
|
6
|
+
:month="$props.month"
|
|
7
|
+
@update:year="$emit('update:year', $event)"
|
|
8
|
+
@update:month="$emit('update:month', $event)"
|
|
9
|
+
@update="$emit('update', $event)"
|
|
10
|
+
/>
|
|
11
|
+
<FSButton
|
|
12
|
+
:label="$tr('ui.common.today', 'Today')"
|
|
13
|
+
icon="mdi-calendar-today"
|
|
14
|
+
@click="onToday"
|
|
15
|
+
/>
|
|
16
|
+
</FSRow>
|
|
17
|
+
</template>
|
|
18
|
+
|
|
19
|
+
<script lang="ts">
|
|
20
|
+
import { defineComponent } from "vue";
|
|
21
|
+
|
|
22
|
+
import FSRow from "../FSRow.vue";
|
|
23
|
+
import FSButton from "../FSButton.vue";
|
|
24
|
+
|
|
25
|
+
import FSSimpleMonthSelector from "./FSSimpleMonthSelector.vue";
|
|
26
|
+
|
|
27
|
+
export default defineComponent({
|
|
28
|
+
name: "FSCalendarHeader",
|
|
29
|
+
components: {
|
|
30
|
+
FSRow,
|
|
31
|
+
FSButton,
|
|
32
|
+
FSSimpleMonthSelector
|
|
33
|
+
},
|
|
34
|
+
props: {
|
|
35
|
+
year: {
|
|
36
|
+
type: Number,
|
|
37
|
+
required: true
|
|
38
|
+
},
|
|
39
|
+
month: {
|
|
40
|
+
type: Number,
|
|
41
|
+
required: true
|
|
42
|
+
}
|
|
43
|
+
},
|
|
44
|
+
setup(_props, { emit }) {
|
|
45
|
+
const onToday = () => {
|
|
46
|
+
const now = new Date();
|
|
47
|
+
emit("update:year", now.getFullYear());
|
|
48
|
+
emit("update:month", now.getMonth() + 1);
|
|
49
|
+
emit("update", {
|
|
50
|
+
year: now.getFullYear(),
|
|
51
|
+
month: now.getMonth() + 1
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
return {
|
|
56
|
+
onToday
|
|
57
|
+
};
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
</script>
|