@dative-gpi/foundation-core-components 1.0.45 → 1.0.46

package/components/autocompletes/FSAutocompleteChart.vue

@@ -56,12 +56,13 @@
 <script lang="ts">
 import { computed, defineComponent, type PropType } from "vue";
 
-import { type ChartOrganisationFilters, ChartOrigin, type ChartOrganisationTypeFilters } from "@dative-gpi/foundation-core-domain/models";
+import { type ChartOrganisationFilters, type ChartOrganisationTypeFilters } from "@dative-gpi/foundation-core-domain/models";
 import { useChartOrganisations, useChartOrganisationTypes } from "@dative-gpi/foundation-core-services/composables";
 import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui";
 
 import { chartOriginColor, chartOriginLabel } from "../../utils";
+import { ChartOrigin } from "@dative-gpi/foundation-shared-domain/enums";
 
 import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
 import FSButton from "@dative-gpi/foundation-shared-components/components/FSButton.vue";

package/components/autocompletes/FSAutocompleteDashboard.vue

@@ -60,8 +60,8 @@ import { type DashboardOrganisationFilters, type DashboardOrganisationTypeFilter
 import { useDashboardOrganisations, useDashboardOrganisationTypes, useDashboardShallows } from "@dative-gpi/foundation-core-services/composables";
 import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui";
-import { DashboardType } from "@dative-gpi/foundation-shared-domain/models";
 
+import { DashboardType } from "@dative-gpi/foundation-shared-domain/enums";
 import { dashboardTypeColor, dashboardTypeLabel } from "../../utils";
 
 import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";

package/components/autocompletes/FSAutocompleteRole.vue

@@ -56,10 +56,11 @@
 <script lang="ts">
 import { computed, defineComponent, type PropType } from "vue";
 
-import { type RoleOrganisationFilters, type RoleOrganisationTypeFilters, RoleType } from "@dative-gpi/foundation-core-domain/models";
+import { type RoleOrganisationFilters, type RoleOrganisationTypeFilters } from "@dative-gpi/foundation-core-domain/models";
 import { useRoleOrganisations, useRoleOrganisationTypes } from "@dative-gpi/foundation-core-services/composables";
 import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui";
+import { RoleType } from "@dative-gpi/foundation-shared-domain/enums";
 
 import { roleTypeColor, roleTypeLabel } from "../../utils";
 

package/components/customProperties/FSMetaField.vue

@@ -93,7 +93,8 @@ import { computed, defineComponent, type PropType } from "vue";
 
 import { useDateFormat } from "@dative-gpi/foundation-shared-services/composables";
 
-import { type CustomPropertyInfos, PropertyDataType } from "../../../foundation-core-domain/models";
+import { type CustomPropertyInfos } from "../../../foundation-core-domain/models";
+import { PropertyDataType } from "@dative-gpi/foundation-shared-domain/enums";
 
 import FSDateTimeField from "@dative-gpi/foundation-shared-components/components/fields/FSDateTimeField.vue";
 import FSNumberField from "@dative-gpi/foundation-shared-components/components/fields/FSNumberField.vue";

package/components/customProperties/FSMetaValue.vue

@@ -32,7 +32,8 @@ import { computed, defineComponent, type PropType } from "vue";
 
 import { useDateFormat } from "@dative-gpi/foundation-shared-services/composables";
 
-import { type CustomPropertyInfos, PropertyDataType } from "../../../foundation-core-domain/models";
+import { PropertyDataType } from "@dative-gpi/foundation-shared-domain/enums";
+import { type CustomPropertyInfos } from "../../../foundation-core-domain/models";
 import { getColor } from "./helpers";
 
 import FSIconCheck from "@dative-gpi/foundation-shared-components/components/FSIconCheck.vue";

package/components/customProperties/helpers.ts

@@ -1,6 +1,7 @@
 import { useAppTimeZone } from "@dative-gpi/foundation-shared-services/composables";
+import { FilterType, PropertyDataType } from "@dative-gpi/foundation-shared-domain/enums";
 
-import { type CustomPropertyInfos, FilterType, PropertyDataType } from "../../../foundation-core-domain/models";
+import { type CustomPropertyInfos,  } from "../../../foundation-core-domain/models";
 
 const { getOffsetDifference } = useAppTimeZone();
 

package/components/entities/FSBaseEntitiesList.vue

@@ -0,0 +1,50 @@
+<template>
+  <component 
+    :is="component"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, defineAsyncComponent, type PropType, computed } from "vue";
+
+import { EntityType } from "@dative-gpi/foundation-shared-domain/enums";
+
+export default defineComponent({
+  name: "FSBaseEntitiesList",
+  components: {
+  },
+  props: {
+    entityType: {
+      type: Number as PropType<EntityType>,
+      required: true
+    }
+  },
+  setup(props) {
+    const component = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return defineAsyncComponent(() => import("../lists/deviceOrganisations/FSBaseDeviceOrganisationsList.vue"));
+        case EntityType.Dashboard:
+          return defineAsyncComponent(() => import("../lists/dashboards/FSBaseDashboardsList.vue"));
+        case EntityType.Folder:
+          return defineAsyncComponent(() => import("../lists/folders/FSBaseFoldersList.vue"));
+        case EntityType.User:
+          return defineAsyncComponent(() => import("../lists/userOrganisations/FSBaseUserOrganisationsList.vue"));
+        case EntityType.Group:
+          return defineAsyncComponent(() => import("../lists/groups/FSBaseGroupsList.vue"));
+        case EntityType.Location:
+          return defineAsyncComponent(() => import("../lists/locations/FSBaseLocationsList.vue"));
+        // case EntityType.Model:
+        //   return defineAsyncComponent(() => import("../lists/models/FSBaseModelsList.vue"));
+        default:
+          return null;
+      };
+    });
+
+    return {
+      component,
+    }
+  }
+});
+</script>

package/components/entities/FSDialogSelectEntities.vue

@@ -0,0 +1,171 @@
+<template>
+  <FSDialogSubmit
+    :title="$tr('ui.common.select-entities', 'Select entities')"
+    width="1130px"
+    :model-value="$props.modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    @click:submit-button="onSubmit"
+  >
+    <template
+      #body
+    >
+      <FSCol
+        gap="24px"  
+      >
+        <FSCol>
+          <FSText
+            font="text-button"
+          >
+            {{ $tr("ui.common.selection-reminder", "Selection reminder") }}
+          </FSText>
+          <FSRow
+            align="center-left"
+            height="50px"
+          >
+            <FSSlideGroup
+              v-if="actualSelecteds.length > 0"
+            >
+              <FSSimpleEntitiesList
+                :entity-type="$props.entityType"
+                :filters="simpleListFilters"
+                :showEdit="false"
+                :showRemove="false"
+                direction="row"
+              />
+            </FSSlideGroup>
+            <FSText
+              v-else
+            >
+              {{ $tr("ui.common.no-selection", "No selection") }}
+            </FSText>
+          </FSRow>
+        </FSCol>
+
+        <FSCol>
+          <FSText
+            font="text-button"
+          >
+            {{ $tr("ui.common.entities-list", "Entities list") }}
+          </FSText>
+          <FSBaseEntitiesList
+            :entity-type="$props.entityType"
+            :tableCode="tableCode"
+            v-model="actualSelecteds"
+            v-bind="baseTableAttrs"
+          />
+        </FSCol>
+      </FSCol>
+    </template>
+  </FSDialogSubmit>
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType, computed, ref, watch } from "vue";
+
+import { EntityType } from "@dative-gpi/foundation-shared-domain/enums";
+import type { DashboardOrganisationFilters, DashboardOrganisationTypeFilters, DeviceOrganisationFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import { TABLES as T } from "../../utils";
+
+import FSSlideGroup from "@dative-gpi/foundation-shared-components/components/FSSlideGroup.vue";
+import FSDialogSubmit from "@dative-gpi/foundation-shared-components/components/FSDialogSubmit.vue";
+import FSCol from "@dative-gpi/foundation-shared-components/components/FSCol.vue";
+import FSRow from "@dative-gpi/foundation-shared-components/components/FSRow.vue";
+import FSText from "@dative-gpi/foundation-shared-components/components/FSText.vue";
+
+
+import FSSimpleEntitiesList from "./FSSimpleEntitiesList.vue";
+import FSBaseEntitiesList from "./FSBaseEntitiesList.vue";
+
+export default defineComponent({
+  name: "FSDialogSelectEntities",
+  components: {
+    FSSimpleEntitiesList,
+    FSBaseEntitiesList,
+    FSSlideGroup,
+    FSDialogSubmit,
+    FSCol,
+    FSRow,
+    FSText
+  },
+  emits: ["update:modelValue", "update:selecteds"],
+  props: {
+    entityType: {
+      type: Number as PropType<EntityType>,
+      required: true
+    },
+    selecteds: {
+      type: Array as PropType<string[]>,
+      required: false,
+      default: () => []
+    },
+    filters: {
+      type: Object,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  setup(props, { attrs, emit }){
+    const actualSelecteds = ref<string[]>([]);
+
+    const simpleListFilters = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return { 
+            deviceOrganisationsIds: actualSelecteds.value
+          } satisfies DeviceOrganisationFilters;
+        case EntityType.Dashboard:
+          return {
+            dashboardOrganisationIds: actualSelecteds.value,
+            dashboardOrganisationTypeIds: actualSelecteds.value
+          } satisfies DashboardOrganisationFilters & DashboardOrganisationTypeFilters;
+        default:
+          return undefined;
+      };
+    })
+
+    const tableCode = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return T.DEVICES_SELECT;
+        default:
+          return null;
+      };
+    })
+
+    const baseTableAttrs = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return { 
+            deviceOrganisationFilters: props.filters,
+            ...attrs
+          };
+        default:
+          return null;
+      };
+    });
+
+    const onSubmit = () => {
+      emit("update:selecteds", actualSelecteds.value);
+      emit("update:modelValue", false);
+    }
+
+    watch(() => props.selecteds, (value) => {
+      actualSelecteds.value = value;
+    }, { immediate: true });
+
+    return {
+      onSubmit,
+      actualSelecteds,
+      simpleListFilters,
+      baseTableAttrs,
+      tableCode
+    }
+  }
+});
+</script>

package/components/entities/FSEntityField.vue

@@ -0,0 +1,143 @@
+<template>
+  <FSEntityFieldUI
+    :description="$props.description"
+    :hideHeader="$props.hideHeader"
+    :required="$props.required"
+    :editable="$props.editable"
+    :label="$props.label"
+    :messages="$props.messages"
+    :entityType="$props.entityType"
+    :allowedEntityTypes="$props.allowedEntityTypes || []"
+    :itemsCount="($props.modelValue || []).length"
+    @update:entityType="$emit('update:entityType', $event); $emit('update:modelValue', [])"
+    :showEntities="$props.showEntities"
+    @click:select="dialog = true"
+  >
+    <template
+      #items
+    >
+      <FSSimpleEntitiesList
+        :entity-type="$props.entityType"
+        :filters="listComponentFilters"
+        :showEdit="false"
+        @click:remove="onRemove"
+      />
+    </template>
+  </FSEntityFieldUI>
+  <FSDialogSelectEntities
+    :entity-type="$props.entityType"
+    :filters="$props.filters"
+    v-model="dialog"
+    :selecteds="$props.modelValue || []"
+    @update:selecteds="$emit('update:modelValue', $event)"
+  />
+</template>
+
+
+<script lang="ts">
+import { defineComponent, ref, type PropType, computed } from "vue";
+
+import { EntityType } from "@dative-gpi/foundation-shared-domain/enums";
+
+import type { DeviceOrganisationFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSEntityFieldUI from "@dative-gpi/foundation-shared-components/components/fields/FSEntityFieldUI.vue";
+
+import FSSimpleEntitiesList from "./FSSimpleEntitiesList.vue";
+import FSDialogSelectEntities from "./FSDialogSelectEntities.vue";
+
+export default defineComponent({
+  name: "FSEntityField",
+  components: {
+    FSEntityFieldUI,
+    FSSimpleEntitiesList,
+    FSDialogSelectEntities
+  },
+  props: {
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    },
+    description: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: Array as PropType<string[]>,
+      required: true,
+      default: () => []
+    },
+    hideHeader: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    required: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    filters: {
+      type: Object,
+      required: false,
+      default: () => null
+    },
+    rules: {
+      type: Array as PropType<any[]>,
+      required: false,
+      default: () => []
+    },
+    messages: {
+      type: Array as PropType<string[]>,
+      required: false,
+      default: null
+    },
+    editable: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    entityType: {
+      type: Number as PropType<EntityType>,
+      required: true
+    },
+    allowedEntityTypes: {
+      type: Array as PropType<EntityType[]>,
+      required: false,
+      default: () => []
+    },
+    showEntities: {
+      type: Boolean,
+      required: false,
+      default: true
+    }
+  },
+  emits: ["update:modelValue", "update:entityType"],
+  setup(props, { emit }) {
+    const dialog = ref(false);
+
+    const listComponentFilters = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return { 
+            deviceOrganisationsIds: props.modelValue
+          } satisfies DeviceOrganisationFilters;
+        default:
+          return {};
+      };
+    });
+
+    const onRemove = (id: string) => {
+      emit("update:modelValue", props.modelValue.filter((i) => i !== id));
+    }
+
+    return {
+      dialog,
+      listComponentFilters,
+      onRemove
+    }
+  }
+});
+</script>

package/components/entities/FSSimpleEntitiesList.vue

@@ -0,0 +1,100 @@
+<template>
+  <component 
+    :is="component"
+    v-bind="componentProps"
+  />
+</template>
+
+
+<script lang="ts">
+import { defineComponent, defineAsyncComponent, type PropType, computed } from "vue";
+
+import { EntityType } from "@dative-gpi/foundation-shared-domain/enums";
+
+export default defineComponent({
+  name: "FSSimpleEntitiesList",
+  components: {
+  },
+  props: {
+    entityType: {
+      type: Number as PropType<EntityType>,
+      required: true
+    },
+    filters: {
+      type: Object,
+      required: false,
+      default: null
+    }
+  },
+  setup(props, { attrs }) {
+    const component = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return defineAsyncComponent(() => import("../lists/deviceOrganisations/FSSimpleDeviceOrganisationsList.vue"));
+        case EntityType.Dashboard:
+          return defineAsyncComponent(() => import("../lists/dashboards/FSSimpleDashboardsList.vue"));
+        case EntityType.Folder:
+          return defineAsyncComponent(() => import("../lists/folders/FSSimpleFoldersList.vue"));
+        case EntityType.User:
+          return defineAsyncComponent(() => import("../lists/userOrganisations/FSSimpleUserOrganisationsList.vue"));
+        case EntityType.Group:
+          return defineAsyncComponent(() => import("../lists/groups/FSSimpleGroupsList.vue"));
+        case EntityType.Location:
+          return defineAsyncComponent(() => import("../lists/locations/FSSimpleLocationsList.vue"));
+        case EntityType.Model:
+          return defineAsyncComponent(() => import("../lists/models/FSSimpleModelsList.vue"));
+        default:
+          return null;
+      };
+    });
+
+    const componentProps = computed(() => {
+      switch(props.entityType) {
+        case EntityType.Device:
+          return {
+            ...attrs,
+            deviceOrganisationFilters : props.filters
+          };
+        case EntityType.Dashboard:
+          return {
+            ...attrs,
+            dashboardOrganisationFilters : props.filters,
+            dashboardOrganisationTypeFilters : props.filters
+          };
+        case EntityType.Folder:
+          return {
+            ...attrs,
+            folderFilters : props.filters
+          };
+        case EntityType.User:
+          return {
+            ...attrs,
+            userFilters : props.filters
+          };
+        case EntityType.Group:
+          return {
+            ...attrs,
+            groupFilters : props.filters
+          };
+        case EntityType.Location:
+          return {
+            ...attrs,
+            locationFilters : props.filters
+          };
+        case EntityType.Model:
+          return {
+            ...attrs,
+            modelFilters : props.filters
+          };
+        default:
+          return null;
+      }
+    });
+
+    return {
+      component,
+      componentProps
+    }
+  }
+});
+</script>

package/components/lists/authTokens/FSBaseAuthTokensList.vue

@@ -0,0 +1,76 @@
+<template>
+  <FSDataTable
+    :items="authTokens"
+    :tableCode="$props.tableCode"
+    v-bind="$attrs"
+  >
+    <template
+      v-for="(_, name) in $slots"
+      v-slot:[name]="slotData"
+    >
+      <slot
+        :name="name"
+        v-bind="slotData"
+      />
+    </template>
+    <template
+      #item.creationDate="{item}"
+    >
+      <FSText>
+        {{ epochToLongTimeFormat(item.creationDate) }}
+      </FSText>
+    </template>
+    <template
+      #item.dateMax="{item}"
+    >
+      <FSText>
+        {{ epochToLongTimeFormat(item.dateMax) }}
+      </FSText>
+    </template>
+  </FSDataTable>
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType, watch } from "vue";
+import _ from "lodash";
+
+import { useDateFormat, useAuthTokens } from "@dative-gpi/foundation-shared-services/composables";
+import { type AuthTokenFilters } from "@dative-gpi/foundation-shared-domain/models";
+
+import FSDataTable from "../FSDataTable.vue";
+import FSText from "@dative-gpi/foundation-shared-components/components/FSText.vue";
+
+export default defineComponent({
+  name: "FSBaseAuthTokensList",
+  components: {
+    FSDataTable,
+    FSText
+  },
+  props: {
+    authTokensFilters: {
+      type: Object as PropType<AuthTokenFilters | null>,
+      required: false,
+      default: null
+    },
+    tableCode: {
+      type: String,
+      required: true
+    }
+  },
+  setup(props) {
+    const { getMany: fetchAuthTokens, entities: authTokens } = useAuthTokens();
+    const { epochToLongTimeFormat } = useDateFormat();
+
+    watch(() => props.authTokensFilters, (next, previous) => {
+      if ((!next && !previous) || !_.isEqual(next, previous)) {
+        fetchAuthTokens(props.authTokensFilters ?? undefined);
+      }
+    }, { immediate: true });
+
+    return {
+      authTokens,
+      epochToLongTimeFormat
+    };
+  }
+});
+</script>