@dative-gpi/foundation-core-components 0.1.120 → 1.0.0

package/components/selects/FSSerieTypeSelector.vue

@@ -0,0 +1,51 @@
+<template>
+  <FSSelectField
+    :label="label ?? $tr('ui.common.serie-type','Serie type')"
+    :items="serieTypeItems"
+    :modelValue="modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, type PropType } from "vue";
+
+import {SerieType} from "@dative-gpi/foundation-core-domain/models";
+
+import FSSelectField from "@dative-gpi/foundation-shared-components/components/fields/FSSelectField.vue";
+
+import {serieTypeLabel, getEnumEntries} from "../../utils";
+
+export default defineComponent({
+  components: {
+    FSSelectField
+  },
+  props: {
+    modelValue: {
+      type: Number as PropType<SerieType>,
+      required: false
+    },
+    label: {
+      type: String,
+      required: false
+    }
+  },
+  emits: ['update:modelValue'],
+  setup() {
+    
+    const serieTypeItems = computed(()=>{
+      return getEnumEntries(SerieType).map((f)=>{
+        return {
+          id: f.value,
+          label: serieTypeLabel(f.value)
+        }
+      })
+    });
+
+    return {
+      serieTypeItems
+    }
+  }
+})
+</script>

package/components/tiles/FSDashboardOrganisationTile.vue

@@ -7,11 +7,12 @@
   />
   <FSDashboardOrganisationTileUI
     v-else-if="entity"
-    :label="entity.label"
     :code="entity.code"
-    :bottomColor="entity.colors"
     :icon="entity.icon"
+    :label="entity.label"
+    :imageId="entity.imageId"
     :editable="$props.editable"
+    :bottomColor="entity.colors"
     :modelValue="$props.modelValue"
     @update:modelValue="(value) => $emit('update:modelValue', value)"
     v-bind="$attrs"

package/components/tiles/FSDashboardOrganisationTypeTile.vue

@@ -7,11 +7,12 @@
   />
   <FSDashboardOrganisationTypeTileUI
     v-else-if="entity"
-    :label="entity.label"
     :code="entity.code"
-    :bottomColor="entity.colors"
     :icon="entity.icon"
+    :label="entity.label"
+    :imageId="entity.imageId"
     :editable="$props.editable"
+    :bottomColor="entity.colors"
     :modelValue="$props.modelValue"
     @update:modelValue="(value) => $emit('update:modelValue', value)"
     v-bind="$attrs"

package/components/tiles/FSDashboardShallowTile.vue

@@ -7,11 +7,12 @@
   />
   <FSDashboardShallowTileUI
     v-else-if="entity"
-    :label="entity.label"
-    :code="entity.code"
-    :bottomColor="entity.colors"
     :icon="entity.icon"
+    :code="entity.code"
+    :label="entity.label"
+    :imageId="entity.imageId"
     :editable="$props.editable"
+    :bottomColor="entity.colors"
     :modelValue="$props.modelValue"
     @update:modelValue="(value) => $emit('update:modelValue', value)"
     v-bind="$attrs"

package/components/tiles/FSFolderTile.vue

@@ -11,6 +11,7 @@
     :code="entity.code"
     :bottomColor="entity.colors"
     :icon="entity.icon"
+    :imageId="entity.imageId"
     :editable="$props.editable"
     :modelValue="$props.modelValue"
     @update:modelValue="(value) => $emit('update:modelValue', value)"
@@ -21,7 +22,7 @@
 <script lang="ts">
 import { defineComponent, onMounted, watch } from "vue";
 
-import { useDashboardOrganisation, useFolder } from "@dative-gpi/foundation-core-services/composables";
+import { useFolder } from "@dative-gpi/foundation-core-services/composables";
 
 import FSFolderTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSFolderTileUI.vue";
 import FSLoadTile from "@dative-gpi/foundation-shared-components/components/tiles/FSLoadTile.vue";

package/components/tiles/FSUserOrganisationTile.vue

@@ -1,25 +1,25 @@
 <template>
-    <FSLoadTile
-      v-if="getting"
-      :editable="$props.editable"
-      :modelValue="modelValue"
-      @update:modelValue="(value) => $emit('update:modelValue', value)"
-    />
-    <FSGroupTileUI
-      v-else-if="entity"
-      :imageId="entity.imageId"
-      :name="entity.name"
-      :label="entity.label"
-      :userType="entity.userType"
-      :roleLabel="entity.roleLabel"
-      :roleIcon="entity.roleIcon"
-      :admin="entity.admin"
-      :editable="$props.editable"
-      :modelValue="modelValue"
-      @update:modelValue="(value) => $emit('update:modelValue', value)"
-      v-bind="$attrs"
-    />
-  </template>
+  <FSLoadTile
+    v-if="getting"
+    :editable="$props.editable"
+    :modelValue="modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+  />
+  <FSUserOrganisationTileUI
+    v-else-if="entity"
+    :imageId="entity.imageId"
+    :name="entity.name"
+    :label="entity.label"
+    :userType="entity.userType"
+    :roleLabel="entity.roleLabel"
+    :roleIcon="entity.roleIcon"
+    :admin="entity.admin"
+    :editable="$props.editable"
+    :modelValue="modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    v-bind="$attrs"
+  />
+</template>
   
 <script lang="ts">
 import { defineComponent, onMounted, watch } from "vue";

package/components/treeviews/FSTreeViewFolder.vue

@@ -0,0 +1,77 @@
+<template>
+  <FSTreeViewField
+    :multiple="$props.multiple"
+    :loading="fetchingFolders"
+    :items="folders"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-bind="$attrs"
+  >
+    <template
+      #menu-prepend="{ item }"
+    >
+      <FSIcon
+        v-if="item.icon"
+      >
+        {{ item.icon }}
+      </FSIcon>
+    </template>
+  </FSTreeViewField>
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType } from "vue";
+
+import { useTreeView } from "@dative-gpi/foundation-shared-components/composables";
+import { type FolderFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useFolders } from "@dative-gpi/foundation-core-services/composables";
+
+import FSTreeViewField from "@dative-gpi/foundation-shared-components/components/fields/FSTreeViewField.vue";
+import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
+
+export default defineComponent({
+  name: "FSTreeViewFolder",
+  components: {
+    FSTreeViewField,
+    FSIcon
+  },
+  props: {
+    folderFilters: {
+      type: Object as PropType<FolderFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    multiple: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyFolders, fetching: fetchingFolders, entities: folders } = useFolders();
+
+    const fetch = () => {
+      return getManyFolders({ ...props.folderFilters });
+    };
+
+    const { onUpdate } = useTreeView(
+      folders,
+      [() => props.folderFilters],
+      emit,
+      fetch
+    );
+
+    return {
+      fetchingFolders,
+      folders,
+      onUpdate
+    };
+  }
+});
+</script>

package/components/treeviews/FSTreeViewGroup.vue

@@ -0,0 +1,77 @@
+<template>
+  <FSTreeViewField
+    :multiple="$props.multiple"
+    :loading="fetchingGroups"
+    :items="groups"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-bind="$attrs"
+  >
+    <template
+      #menu-prepend="{ item }"
+    >
+      <FSIcon
+        v-if="item.icon"
+      >
+        {{ item.icon }}
+      </FSIcon>
+    </template>
+  </FSTreeViewField>
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType } from "vue";
+
+import { useTreeView } from "@dative-gpi/foundation-shared-components/composables";
+import { type GroupFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useGroups } from "@dative-gpi/foundation-core-services/composables";
+
+import FSTreeViewField from "@dative-gpi/foundation-shared-components/components/fields/FSTreeViewField.vue";
+import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
+
+export default defineComponent({
+  name: "FSTreeViewGroup",
+  components: {
+    FSTreeViewField,
+    FSIcon
+  },
+  props: {
+    groupFilters: {
+      type: Object as PropType<GroupFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    multiple: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyGroups, fetching: fetchingGroups, entities: groups } = useGroups();
+
+    const fetch = () => {
+      return getManyGroups({ ...props.groupFilters });
+    };
+
+    const { onUpdate } = useTreeView(
+      groups,
+      [() => props.groupFilters],
+      emit,
+      fetch
+    );
+
+    return {
+      fetchingGroups,
+      groups,
+      onUpdate
+    };
+  }
+});
+</script>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dative-gpi/foundation-core-components",
   "sideEffects": false,
-  "version": "0.1.120",
+  "version": "1.0.0",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -10,19 +10,21 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-core-domain": "0.1.120",
-    "@dative-gpi/foundation-core-services": "0.1.120",
-    "@dative-gpi/foundation-shared-components": "0.1.120",
-    "@dative-gpi/foundation-shared-domain": "0.1.120",
-    "@dative-gpi/foundation-shared-services": "0.1.120",
+    "@dative-gpi/foundation-core-domain": "1.0.0",
+    "@dative-gpi/foundation-core-services": "1.0.0",
+    "@dative-gpi/foundation-shared-components": "1.0.0",
+    "@dative-gpi/foundation-shared-domain": "1.0.0",
+    "@dative-gpi/foundation-shared-services": "1.0.0"
+  },
+  "peerDependencies": {
+    "@dative-gpi/bones-ui": "^0.0.75",
     "color": "^4.2.3",
-    "vue": "^3.4.23",
-    "vuedraggable": "^4.1.0"
+    "vue": "^3.4.29"
   },
   "devDependencies": {
-    "@types/color": "^3.0.6",
-    "sass": "^1.69.5",
-    "sass-loader": "^13.3.2"
+    "@types/color": "3.0.6",
+    "sass": "1.71.1",
+    "sass-loader": "13.3.2"
   },
-  "gitHead": "ea777a3a70e01d2b96981b2cb2e3da7b3af5f59c"
+  "gitHead": "93365f65d39d6c9cc3821ffb48cba187200deaf9"
 }

package/utils/charts.ts

@@ -0,0 +1,136 @@
+import { AggregationType, AxisType, ChartOrigin, DisplayAs, FilterType, HeatmapRule, OperationOn, PlanningType, PlotPer, SerieType } from "@dative-gpi/foundation-core-domain/models";
+import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui/composables";
+import { type ColorBase, ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+
+const { $tr } = useTranslationsProvider();
+
+export const chartOriginLabel = (type: ChartOrigin): string => {
+  switch (type) {
+    case ChartOrigin.None:             return $tr("ui.chart-type.none", "None");
+    case ChartOrigin.Organisation:     return $tr("ui.chart-type.organisation", "Custom");
+    case ChartOrigin.OrganisationType: return $tr("ui.chart-type.organisation-type", "Shared");
+  }
+};
+
+export const chartOriginColor = (type: ChartOrigin): ColorBase => {
+  switch (type) {
+    case ChartOrigin.None:             return ColorEnum.Error;
+    case ChartOrigin.Organisation:     return ColorEnum.Primary;
+    case ChartOrigin.OrganisationType: return ColorEnum.Warning;
+  }
+};
+
+export const aggregationTypeLabel = (aggregationType : AggregationType): string => {
+  switch (aggregationType) {
+    case AggregationType.Sum:        return $tr("ui.common.sum", "Sum");
+    case AggregationType.Cardinal:   return $tr("ui.common.cardinal", "Cardinal");
+    case AggregationType.Mean:       return $tr("ui.common.cean", "Mean");
+    case AggregationType.Median:     return $tr("ui.common.median", "Median");
+    case AggregationType.First:      return $tr("ui.common.first", "First");
+    case AggregationType.Last:       return $tr("ui.common.last", "Last");
+    case AggregationType.Difference: return $tr("ui.common.difference", "Difference");
+    case AggregationType.Minimum:    return $tr("ui.common.minimum", "Minimum");
+    case AggregationType.Maximum:    return $tr("ui.common.maximum", "Maximum");
+    case AggregationType.Range:      return $tr("ui.common.range", "Range");
+    default :                        return $tr("ui.common.none", "None");
+  }
+};
+
+export const axisTypeLabel = (axisType: AxisType | number): string => {
+  switch (axisType) {
+    case AxisType.Date:     return $tr("ui.common.date", "Date");
+    case AxisType.Value:    return $tr("ui.common.value", "Value");
+    case AxisType.Category: return $tr("ui.common.category", "Category");
+    default:                return $tr("ui.common.none", "None");
+  }
+};
+
+export const displayAsLabel = (display: DisplayAs | number): string => {
+  switch (display) {
+    case DisplayAs.Bars:   return $tr("ui.common.bars", "Bars");
+    case DisplayAs.Lines:  return $tr("ui.common.lines", "Lines");
+    case DisplayAs.Points: return $tr("ui.common.point", "Points");
+    default:               return $tr("ui.common.none", "None");
+  }
+};
+
+export const filterTypeLabel = (filterType: FilterType | number): string => {
+  switch (filterType) {
+    case FilterType.Contains:    return $tr("ui.common.contains", "contains");
+    case FilterType.Different:   return "≠";
+    case FilterType.EndsWith:    return $tr("ui.common.end-width", "end with") ;
+    case FilterType.Equal:       return "=";
+    case FilterType.Less:        return "<";
+    case FilterType.LessOrEqual: return "≤";
+    case FilterType.More:        return ">";
+    case FilterType.MoreOrEqual: return "≥";
+    case FilterType.StartsWith:  return $tr("ui.common.starts-with", "start with");
+    default:                     return $tr("ui.common.none", "None");
+  }
+};
+
+export const heatmapRuleLabel = (heatMap: HeatmapRule | number): string => {
+  switch (heatMap) {
+    case HeatmapRule.Gradient: return $tr("ui.common.gradient", "Gradient");
+    case HeatmapRule.Ranges:   return $tr("ui.common.ranges", "Ranges");
+    case HeatmapRule.Fixed :   return $tr("ui.common.fixed", "Fixed");
+    default:                   return $tr("ui.common.none", "None");
+  }
+};
+
+export const operationOnLabel = (operationOn: OperationOn | number): string => {
+  switch (operationOn) {
+    case OperationOn.SameEntity:         return $tr("ui.common.same-entity", "Same entity");
+    case OperationOn.SameGroup:          return $tr("ui.common.same-group", "Same group");
+    case OperationOn.SameGroupAndEntity: return $tr("ui.common.same-group-entity", "Same group and entity");
+    default:                             return $tr("ui.common.none", "None");
+  }
+};
+
+export const planningTypeLabel = (planningType : PlanningType | number): string => {
+  switch (planningType) {
+    case PlanningType.UntilNext:          return $tr("ui.common.until-next", "Until next");
+    case PlanningType.ElapsedTime:        return $tr("ui.common.elapsed-time", "Elapsed time");
+    case PlanningType.SinglePoint:        return $tr("ui.common.single-point", "Single point");
+    default:                              return $tr("ui.common.none", "None");
+  }
+};
+
+export const plotPerLabel = (plotper: PlotPer | number): string => {
+  switch (plotper) {
+    case PlotPer.SinglePlot: return $tr("ui.common.single-slot", "Single slot");
+    case PlotPer.Model:      return $tr("ui.common.model", "Model");
+    case PlotPer.Group:      return $tr("ui.common.group", "Group");
+    case PlotPer.Location:   return $tr("ui.common.location", "Location");
+    case PlotPer.Device:     return $tr("ui.common.device", "Device");
+    default:                 return $tr("ui.common.none", "None");
+  }
+};
+
+export const serieTypeLabel = (serieType : SerieType): string => {
+  switch (serieType) {
+    case SerieType.Lines:       return $tr("ui.common.lines", "Lines");
+    case SerieType.Area:        return $tr("ui.common.area", "Area");
+    case SerieType.Range:       return $tr("ui.common.range", "Range");
+    case SerieType.Histogram:   return $tr("ui.common.histogram", "Histogram");
+    case SerieType.Operation:   return $tr("ui.common.operation", "Operation");
+    case SerieType.Planning:    return $tr("ui.common.planning", "Planning");
+    case SerieType.ScatterPlot: return $tr("ui.common.scatter-plot", "Scatter plot");
+    case SerieType.Top:         return $tr("ui.common.top", "Top");
+    case SerieType.Bars:        return $tr("ui.common.bars", "Bars");
+    case SerieType.StackedBars: return $tr("ui.common.stacked-bars", "Stacked bars");
+    case SerieType.Pie:         return $tr("ui.common.pie", "Pie");
+    case SerieType.Heatmap:     return $tr('ui.common.heatmap', 'Heatmap');
+    case SerieType.Slider:      return $tr("ui.common.slider", "Slider");
+    case SerieType.Gauge:       return $tr("ui.common.gauge", "Gauge");
+    case SerieType.ScoreCard:   return $tr("ui.common.score-card", "Score card");
+    case SerieType.Table:       return $tr("ui.common.table", "Table");
+    default:                    return "";
+  }
+};
+
+export const getEnumEntries = (e: any) => {
+  return Object.keys(e)
+    .filter(key => isNaN(Number(key)))
+    .map(key => ({key : key, value : e[key]}));
+};

package/utils/dashboards.ts

@@ -1,15 +1,16 @@
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui/composables";
-import { ColorBase, ColorEnum } from "@dative-gpi/foundation-shared-components/models";
-import { DashboardType } from "@dative-gpi/foundation-core-domain/models"
+import type { ColorBase} from "@dative-gpi/foundation-shared-components/models";
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+import { DashboardType } from "@dative-gpi/foundation-shared-domain/models"
 
 const { $tr } = useTranslationsProvider();
 
 export const dashboardTypeLabel = (type: DashboardType): string => {
   switch (type) {
-    case DashboardType.None:             return $tr("ui.role-type.none", "None");
+    case DashboardType.None:             return $tr("ui.dashboard-type.none", "None");
     case DashboardType.Organisation:
-    case DashboardType.Shallow:          return $tr("ui.role-type.organisation", "Custom");
-    case DashboardType.OrganisationType: return $tr("ui.role-type.organisation-type", "Shared");
+    case DashboardType.Shallow:          return $tr("ui.dashboard-type.organisation", "Custom");
+    case DashboardType.OrganisationType: return $tr("ui.dashboard-type.organisation-type", "Shared");
   }
 };
 

package/utils/index.ts

@@ -1,3 +1,4 @@
+export * from "./charts";
 export * from "./dashboards";
 export * from "./roles";
 export * from "./users";

package/utils/roles.ts

@@ -1,5 +1,6 @@
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui/composables";
-import { ColorBase, ColorEnum } from "@dative-gpi/foundation-shared-components/models";
+import type { ColorBase} from "@dative-gpi/foundation-shared-components/models";
+import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
 import { RoleType } from "@dative-gpi/foundation-core-domain/models"
 
 const { $tr } = useTranslationsProvider();

package/utils/users.ts

@@ -1,5 +1,5 @@
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui/composables";
-import { UserType } from "@dative-gpi/foundation-core-domain/models"
+import { UserType, UserValidityState } from "@dative-gpi/foundation-core-domain/models"
 
 const { $tr } = useTranslationsProvider();
 
@@ -17,4 +17,13 @@ export const userTypeIcon = (type: UserType): string => {
     case UserType.ServiceAccount: return "mdi-puzzle-outline";
     case UserType.Extension:      return "mdi-cog-outline";
   }
-};
+};
+
+export const userValidityLabel = (validity: UserValidityState): string => {
+  switch (validity) {
+    case UserValidityState.InvitationNotSent: return $tr("ui.user-validity.invitation-not-sent", "Invitation not sent");
+    case UserValidityState.InvitationSent:    return $tr("ui.user-validity.invitation-sent", "Invitation sent");
+    case UserValidityState.AccountCreated:    return $tr("ui.user-validity.account-created", "Not validated");
+    case UserValidityState.AccountValidated:  return $tr("ui.user-validity.account-validated", "Validated");
+  }
+}