@dative-gpi/foundation-shared-components 1.0.27 → 1.0.28-remove-deprecated2

package/components/buttons/FSButtonCopy.vue

@@ -0,0 +1,28 @@
+<template>
+  <FSButton
+    prependIcon="mdi-content-copy"
+    :label="$tr('ui.common.copy', 'Copy')"
+    :color="ColorEnum.Light"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+
+import FSButton from "../FSButton.vue";
+
+export default defineComponent({
+  name: "FSButtonCopy",
+  components: {
+    FSButton
+  },
+  setup() {
+    return {
+      ColorEnum
+    }
+  }
+});
+</script>

package/components/buttons/FSButtonCopyIcon.vue

@@ -0,0 +1,28 @@
+<template>
+  <FSButton
+    icon="mdi-content-copy"
+    variant="icon"
+    :color="ColorEnum.Light"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+
+import FSButton from "../FSButton.vue";
+
+export default defineComponent({
+  name: "FSButtonCopyIcon",
+  components: {
+    FSButton
+  },
+  setup() {
+    return {
+      ColorEnum
+    }
+  }
+});
+</script>

package/components/buttons/FSButtonCopyLabel.vue

@@ -0,0 +1,27 @@
+<template>
+  <FSButton
+    :label="$tr('ui.common.copy', 'Copy')"
+    :color="ColorEnum.Light"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+
+import FSButton from "../FSButton.vue";
+
+export default defineComponent({
+  name: "FSButtonCopyLabel",
+  components: {
+    FSButton
+  },
+  setup() {
+    return {
+      ColorEnum
+    }
+  }
+});
+</script>

package/components/buttons/FSButtonCopyMini.vue

@@ -0,0 +1,28 @@
+<template>
+  <FSButton
+    prependIcon="mdi-content-copy"
+    
+    :color="ColorEnum.Light"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+
+import FSButton from "../FSButton.vue";
+
+export default defineComponent({
+  name: "FSButtonCopyMini",
+  components: {
+    FSButton
+  },
+  setup() {
+    return {
+      ColorEnum
+    }
+  }
+});
+</script>

package/components/buttons/FSButtonDragIcon.vue

@@ -0,0 +1,27 @@
+<template>
+  <FSButton
+    icon="mdi-drag"
+    variant="icon"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+
+import FSButton from "../FSButton.vue";
+
+export default defineComponent({
+  name: "FSButtonCopyIcon",
+  components: {
+    FSButton
+  },
+  setup() {
+    return {
+      ColorEnum
+    }
+  }
+});
+</script>

package/components/buttons/FSButtonDuplicate.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-content-copy"
-    :label="$tr('ui.button.duplicate', 'Duplicate')"
+    :label="$tr('ui.common.duplicate', 'Duplicate')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonDuplicateLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.duplicate', 'Duplicate')"
+    :label="$tr('ui.common.duplicate', 'Duplicate')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonEdit.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-pencil-outline"
-    :label="$tr('ui.button.edit', 'Edit')"
+    :label="$tr('ui.common.edit', 'Edit')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonEditLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.edit', 'Edit')"
+    :label="$tr('ui.common.edit', 'Edit')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonFile.vue

@@ -2,7 +2,7 @@
   <div>
     <FSButton
       prependIcon="mdi-upload-outline"
-      :label="$tr('ui.button.import-file', 'Import file')"
+      :label="$tr('ui.common.import-file', 'Import file')"
       :color="ColorEnum.Light"
       @click="onClick"
       v-bind="$attrs"

package/components/buttons/FSButtonFileLabel.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <FSButton
-      :label="$tr('ui.button.import-file', 'Import file')"
+      :label="$tr('ui.common.import-file', 'Import file')"
       :color="ColorEnum.Light"
       @click="onClick"
       v-bind="$attrs"

package/components/buttons/FSButtonNext.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     appendIcon="mdi-chevron-right"
-    :label="$tr('ui.button.next', 'Next')"
+    :label="$tr('ui.common.next', 'Next')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonNextLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.next', 'Next')"
+    :label="$tr('ui.common.next', 'Next')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonPrevious.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-chevron-left"
-    :label="$tr('ui.button.previous', 'Previous')"
+    :label="$tr('ui.common.previous', 'Previous')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonPreviousLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.previous', 'Previous')"
+    :label="$tr('ui.common.previous', 'Previous')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonRedo.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-redo-variant"
-    :label="$tr('ui.button.redo', 'Redo')"
+    :label="$tr('ui.common.redo', 'Redo')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonRedoLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.redo', 'Redo')"
+    :label="$tr('ui.common.redo', 'Redo')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonRemove.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-delete-outline"
-    :label="$tr('ui.button.remove', 'Remove')"
+    :label="$tr('ui.common.remove', 'Remove')"
     :color="ColorEnum.Error"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonRemoveLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.remove', 'Remove')"
+    :label="$tr('ui.common.remove', 'Remove')"
     :color="ColorEnum.Error"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonSave.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-content-save-outline"
-    :label="$tr('ui.button.save', 'Save')"
+    :label="$tr('ui.common.save', 'Save')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonSaveLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.save', 'Save')"
+    :label="$tr('ui.common.save', 'Save')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonSearch.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-magnify"
-    :label="$tr('ui.button.search', 'Search')"
+    :label="$tr('ui.common.search', 'Search')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonSearchLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.search', 'Search')"
+    :label="$tr('ui.common.search', 'Search')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonUndo.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-undo-variant"
-    :label="$tr('ui.button.undo', 'Undo')"
+    :label="$tr('ui.common.undo', 'Undo')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonUndoLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.undo', 'Undo')"
+    :label="$tr('ui.common.undo', 'Undo')"
     :color="ColorEnum.Light"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonUpdate.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-pencil-outline"
-    :label="$tr('ui.button.update', 'Update')"
+    :label="$tr('ui.common.update', 'Update')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonUpdateLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.update', 'Update')"
+    :label="$tr('ui.common.update', 'Update')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonValidate.vue

@@ -1,7 +1,7 @@
 <template>
   <FSButton
     prependIcon="mdi-check"
-    :label="$tr('ui.button.validate', 'Validate')"
+    :label="$tr('ui.common.validate', 'Validate')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/buttons/FSButtonValidateLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <FSButton
-    :label="$tr('ui.button.validate', 'Validate')"
+    :label="$tr('ui.common.validate', 'Validate')"
     :color="ColorEnum.Primary"
     v-bind="$attrs"
   />

package/components/calendar/FSSimpleCalendar.vue

@@ -0,0 +1,145 @@
+<template>
+  <FSCol>
+    <FSRow
+      v-if="$props.showHeader"
+      :wrap="false"
+    >
+      <FSCol
+        v-for="i in 7"
+        :key="i"
+        :style="{
+          minWidth: `calc((100% - 8px * 7) / 7)`, 
+          maxWidth: `calc((100% - 8px * 7) / 7)`
+        }"
+        align="center-center"
+      >
+        {{ dayLabel(i - 1) }}
+      </FSCol>
+    </FSRow>
+    <FSRow>
+      <FSCol
+        v-for="date in days"
+        :key="$props.month + $props.year + date.date.toISOString()"
+        :style="{
+          minWidth: `calc((100% - 8px * 7) / 7)`, 
+          maxWidth: `calc((100% - 8px * 7) / 7)`
+        }"
+        align="center-center"
+        height="hug"
+      >
+        <slot
+          name="day"
+          v-bind="date"
+        />
+      </FSCol>
+    </FSRow>
+  </FSCol>
+</template>
+
+<script lang="ts">
+import { startOfWeek, endOfWeek, endOfMonth, isSameDay, isBefore, isAfter, isSameMonth, addDays } from "date-fns";
+import { defineComponent, computed } from "vue";
+
+import { dayLabel } from "../../tools";
+
+import { useAppTimeZone } from "@dative-gpi/foundation-shared-services/composables";
+
+import FSRow from "../FSRow.vue";
+import FSCol from "../FSCol.vue";
+
+export default defineComponent({
+  name: "FSCalendarHeader",
+  components: {
+    FSRow,
+    FSCol
+  },
+  props: {
+    year: {
+      type: Number,
+      required: true
+    },
+    month: {
+      type: Number,
+      required: true
+    },
+    showHeader: {
+      type: Boolean,
+      default: true
+    }
+  },
+  setup(props) {
+
+    const { getMachineOffset } = useAppTimeZone();
+
+    const firstDayOfMonth = computed(() => {
+      const date = new Date(props.year, props.month - 1, 1);
+      const offset = getMachineOffset(date.getTime());
+
+      date.setTime(date.getTime() + offset);
+
+      return date;
+    })
+
+    const firstMonday = computed(() => {
+      const day = new Date(firstDayOfMonth.value);
+      
+      const date = startOfWeek(day, { weekStartsOn: 1 });
+      const offset = getMachineOffset(date.getTime());
+
+      date.setTime(date.getTime() + offset);
+
+      return date;
+    });
+
+    const endDayOfMonth = computed(() => {
+      const day = new Date(firstDayOfMonth.value);
+
+      const date = endOfMonth(day);
+      const offset = getMachineOffset(date.getTime());
+
+      date.setTime(date.getTime() + offset);
+
+      return date;
+    });
+
+    const lastSunday = computed(() => {
+      const day = new Date(endDayOfMonth.value);
+
+      const date = endOfWeek(day, { weekStartsOn: 1 });
+      const offset = getMachineOffset(date.getTime());
+
+      date.setTime(date.getTime() + offset);
+
+      return date;
+    });
+
+    const days = computed(() => {
+      const result = [];
+
+      let currentDay = new Date(firstMonday.value);
+      const today = new Date();
+
+      while (currentDay <= lastSunday.value) {
+        result.push({
+          date: new Date(currentDay),
+          isToday: isSameDay(currentDay, today),
+          isPast: isBefore(currentDay, today) && !isSameDay(currentDay, today),
+          isFutur: isAfter(currentDay, today) && !isSameDay(currentDay, today),
+          isPreviousMonth: isBefore(currentDay, firstDayOfMonth.value),
+          isNextMonth: isAfter(currentDay, endDayOfMonth.value),
+          isCurrentMonth: isSameMonth(currentDay, firstDayOfMonth.value)
+        });
+
+        currentDay = addDays(currentDay, 1);
+      }
+
+      return result;
+    });
+
+    return {
+      dayLabel,
+      days
+    };
+  }
+});
+</script>

package/components/calendar/FSSimpleCalendarHeader.vue

@@ -0,0 +1,60 @@
+<template>
+  <FSRow>
+    <FSSimpleMonthSelector 
+      width="hug"
+      :year="$props.year"
+      :month="$props.month"
+      @update:year="$emit('update:year', $event)"
+      @update:month="$emit('update:month', $event)"
+      @update="$emit('update', $event)"
+    />
+    <FSButton
+      :label="$tr('ui.common.today', 'Today')"
+      icon="mdi-calendar-today"
+      @click="onToday"
+    />
+  </FSRow>
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+import FSRow from "../FSRow.vue";
+import FSButton from "../FSButton.vue";
+
+import FSSimpleMonthSelector from "./FSSimpleMonthSelector.vue";
+
+export default defineComponent({
+  name: "FSCalendarHeader",
+  components: {
+    FSRow,
+    FSButton,
+    FSSimpleMonthSelector
+  },
+  props: {
+    year: {
+      type: Number,
+      required: true
+    },
+    month: {
+      type: Number,
+      required: true
+    }
+  },
+  setup(_props, { emit }) {
+    const onToday = () => {
+      const now = new Date();
+      emit("update:year", now.getFullYear());
+      emit("update:month", now.getMonth() + 1);
+      emit("update", {
+        year: now.getFullYear(),
+        month: now.getMonth() + 1
+      });
+    };
+
+    return {
+      onToday
+    };
+  }
+});
+</script>