@dative-gpi/foundation-core-components 1.0.35 → 1.0.37-report-v1

package/components/lists/folders/FSSimpleFoldersList.vue

@@ -0,0 +1,44 @@
+<template>
+  <FSSimpleList
+    :items="folders"
+    :loading="fetching"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType, watch } from "vue";
+
+import type { FolderFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useFolders } from "@dative-gpi/foundation-core-services/composables";
+
+import FSSimpleList from "@dative-gpi/foundation-shared-components/components/lists/FSSimpleList.vue";
+
+export default defineComponent({
+  name: "FSSimpleFoldersList",
+  components: {
+    FSSimpleList,
+  },
+  props: {
+    folderFilters: {
+      type: Object as PropType<FolderFilters>,
+      required: false,
+      default: () => ({})
+    }
+  },
+  setup(props){
+    const { entities: folders, getMany, fetching } = useFolders();
+
+    const fetch = () => {
+      getMany(props.folderFilters);
+    }
+
+    watch(() => props.folderFilters, fetch, { immediate: true });
+
+    return {
+      folders,
+      fetching
+    }
+  }
+});
+</script>

package/components/lists/groups/FSBaseGroupsList.vue

@@ -0,0 +1,136 @@
+<template>
+  <FSDataTable
+    defaultMode="iterator"
+    :loading="fetchingGroups"
+    :items="groups"
+    :showSelect="$props.editable"
+    :tableCode="$props.tableCode"
+    :modelValue="$props.modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    v-bind="$attrs"
+  >
+    <template
+      v-for="(_, name) in $slots"
+      v-slot:[name]="slotData"
+    >
+      <slot
+        :name="name"
+        v-bind="slotData"
+      />
+    </template>
+    <template
+      #header.imageId-title
+    >
+      <FSIcon>
+        mdi-panorama-variant-outline
+      </FSIcon>
+    </template>
+    <template
+      #item.imageId="{ item }"
+    >
+      <FSImage
+        v-if="item.imageId"
+        height="32px"
+        width="32px"
+        :imageId="item.imageId"
+        :thumbnail="true"
+      />
+    </template>
+    <template
+      #item.icon="{ item }"
+    >
+      <FSIcon>
+        {{ item.icon }}
+      </FSIcon>
+    </template>
+    <template
+      #item.tags="{ item }"
+    >
+      <FSTagGroup
+        variant="slide"
+        :editable="false"
+        :tags="item.tags"
+      />
+    </template>
+    <template
+      #item.tile="{ item, toggleSelect }"
+    >
+      <FSGroupTileUI
+        :editable="$props.editable"
+        :modelValue="isSelected(item.id)"
+        @update:modelValue="toggleSelect(item)"
+        v-bind="item"
+      />
+    </template>
+  </FSDataTable>
+</template>
+
+<script lang="ts">
+import { defineComponent, watch } from "vue";
+import type { PropType} from "vue";
+import _ from "lodash";
+
+import type { GroupFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useGroups } from "@dative-gpi/foundation-core-services/composables";
+
+import FSDataTable from "../FSDataTable.vue";
+
+import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
+import FSImage from "@dative-gpi/foundation-shared-components/components/FSImage.vue";
+import FSTagGroup from "@dative-gpi/foundation-shared-components/components/FSTagGroup.vue";
+import FSGroupTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSGroupTileUI.vue";
+
+
+export default defineComponent({
+  name: "FSBaseGroupsList",
+  components: {
+    FSDataTable,
+    FSImage,
+    FSIcon,
+    FSGroupTileUI,
+    FSTagGroup
+  },
+  props: {
+    tableCode: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    },
+    groupsFilters: {
+      type: Object as PropType<GroupFilters>,
+      required: false,
+      default: null
+    },
+    editable: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    modelValue: {
+      type: Array as PropType<string[]>,
+      required: false,
+      default: () => []
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props) {
+    const { getMany: fetchGroups, fetching: fetchingGroups, entities: groups } = useGroups();
+
+    const isSelected = (id: string) => {
+      return props.modelValue.includes(id);
+    };
+
+    watch(() => props.groupsFilters, (next, previous) => {
+      if ((!next && !previous) || !_.isEqual(next, previous)) {
+        fetchGroups(props.groupsFilters);
+      }
+    }, { immediate: true });
+
+    return {
+      fetchingGroups,
+      groups,
+      isSelected
+    };
+  }
+});
+</script>

package/components/lists/groups/FSSimpleGroupsList.vue

@@ -0,0 +1,44 @@
+<template>
+  <FSSimpleList
+    :items="groups"
+    :loading="fetching"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType, watch } from "vue";
+
+import type { GroupFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useGroups } from "@dative-gpi/foundation-core-services/composables";
+
+import FSSimpleList from "@dative-gpi/foundation-shared-components/components/lists/FSSimpleList.vue";
+
+export default defineComponent({
+  name: "FSSimpleGroupsList",
+  components: {
+    FSSimpleList,
+  },
+  props: {
+    groupFilters: {
+      type: Object as PropType<GroupFilters>,
+      required: false,
+      default: () => ({})
+    }
+  },
+  setup(props){
+    const { entities: groups, getMany, fetching } = useGroups();
+
+    const fetch = () => {
+      getMany(props.groupFilters);
+    }
+
+    watch(() => props.groupFilters, fetch, { immediate: true });
+
+    return {
+      groups,
+      fetching
+    }
+  }
+});
+</script>

package/components/lists/locations/FSBaseLocationsList.vue

@@ -0,0 +1,118 @@
+<template>
+  <FSDataTable
+    defaultMode="iterator"
+    :loading="fetchingLocations"
+    :items="locations"
+    :showSelect="$props.editable"
+    :tableCode="tableCode"
+    :modelValue="$props.modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    v-bind="$attrs"
+  >
+    <template
+      v-for="(_, name) in $slots"
+      v-slot:[name]="slotData"
+    >
+      <slot
+        :name="name"
+        v-bind="slotData"
+      />
+    </template>
+    <template
+      #item.icon="{ item }"
+    >
+      <FSIcon >
+        {{ item.icon }}
+      </FSIcon>
+    </template>
+
+    <template
+      #item.tile="{ item, toggleSelect }"
+    >
+      <FSLocationTileUI
+        v-bind="item"
+        :bottomColor="item.colors"
+        :address="item.address.placeLabel"
+        :editable="true"
+        :singleSelect="singleSelect"
+        :modelValue="isSelected(item.id)"
+        :to="$props.itemTo && $props.itemTo(item)"
+        @update:modelValue="toggleSelect(item)"
+      />
+    </template>
+  </FSDataTable>
+</template>
+
+<script lang="ts">
+import _ from "lodash";
+import type { RouteLocation } from "vue-router";
+import { defineComponent, type PropType, watch } from "vue";
+
+import { useLocations } from "@dative-gpi/foundation-core-services/composables";
+import type { LocationFilters, LocationInfos } from "@dative-gpi/foundation-core-domain/models";
+
+import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
+
+import FSDataTable from "../FSDataTable.vue";
+import FSLocationTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSLocationTileUI.vue";
+
+export default defineComponent({
+  name: "FSBaseLocationsList",
+  components: {
+    FSLocationTileUI,
+    FSDataTable,
+    FSIcon
+  },
+  props: {
+    tableCode: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    },
+    locationsFilters: {
+      type: Object as PropType<LocationFilters>,
+      required: false,
+      default: null
+    },
+    editable: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    itemTo: {
+      type: Function as PropType<(item: LocationInfos) => Partial<RouteLocation>>,
+      required: false
+    },
+    singleSelect: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    modelValue: {
+      type: Array as PropType<string[]>,
+      default: () => [],
+      required: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props) {
+    const { getMany: fetchLocations, fetching: fetchingLocations, entities: locations } = useLocations();
+
+    watch(() => props.locationsFilters, (next, previous) => {
+      if ((!next && !previous) || !_.isEqual(next, previous)) {
+        fetchLocations(props.locationsFilters);
+      }
+    }, { immediate: true });
+
+    const isSelected = (id: string) => {
+      return props.modelValue?.includes(id);
+    };
+
+    return {
+      fetchingLocations,
+      isSelected,
+      locations
+    };
+  }
+});
+</script>

package/components/lists/locations/FSSimpleLocationsList.vue

@@ -0,0 +1,44 @@
+<template>
+  <FSSimpleList
+    :items="locations"
+    :loading="fetching"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType, watch } from "vue";
+
+import type { LocationFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useLocations } from "@dative-gpi/foundation-core-services/composables";
+
+import FSSimpleList from "@dative-gpi/foundation-shared-components/components/lists/FSSimpleList.vue";
+
+export default defineComponent({
+  name: "FSSimpleLocationsList",
+  components: {
+    FSSimpleList,
+  },
+  props: {
+    locationFilters: {
+      type: Object as PropType<LocationFilters>,
+      required: false,
+      default: () => ({})
+    }
+  },
+  setup(props){
+    const { entities: locations, getMany, fetching } = useLocations();
+
+    const fetch = () => {
+      getMany(props.locationFilters);
+    }
+
+    watch(() => props.locationFilters, fetch, { immediate: true });
+
+    return {
+      locations,
+      fetching
+    }
+  }
+});
+</script>

package/components/lists/models/FSBaseModelsList.vue

@@ -0,0 +1,155 @@
+<template>
+  <FSDataTable
+    defaultMode="iterator"
+    :singleSelect="$props.singleSelect"
+    :showSelect="$props.editable"
+    :tableCode="$props.tableCode"
+    :loading="fetchingModels"
+    :items="models"
+    :modelValue="$props.modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    v-bind="$attrs"
+  >
+    <template
+      v-for="(_, name) in $slots"
+      v-slot:[name]="slotData"
+    >
+      <slot
+        :name="name"
+        v-bind="slotData"
+      />
+    </template>
+    <template
+      #header.imageId-title
+    >
+      <FSIcon>
+        mdi-panorama-variant-outline
+      </FSIcon>
+    </template>
+    <template
+      #header.connectable-title
+    >
+      <FSIcon>
+        mdi-wifi
+      </FSIcon>
+    </template>
+    <template
+      #item.imageId="{ item }"
+    >
+      <FSImage
+        v-if="item.imageId"
+        height="32px"
+        width="32px"
+        :imageId="item.imageId"
+        :thumbnail="true"
+      />
+    </template>
+    <template
+      #item.icon="{ item }"
+    >
+      <FSIcon >
+        {{ item.icon }}
+      </FSIcon>
+    </template>
+    <template
+      #item.connectable="{ item }"
+    >
+      <FSIconCheck
+        :value="item.connectable"
+      />
+    </template>
+    <template
+      #item.tile="{ item, toggleSelect }"
+    >
+      <FSModelTileUI
+        :to="$props.itemTo && $props.itemTo(item)"
+        :singleSelect="$props.singleSelect"
+        :imageId="item.imageId"
+        :label="item.label"
+        :modelValue="isSelected(item.id)"
+        @update:modelValue="toggleSelect(item)"
+        v-bind="item"
+      />
+    </template>
+  </FSDataTable>
+</template>
+
+<script lang="ts">
+import _ from "lodash";
+import type { RouteLocation } from "vue-router";
+import { defineComponent, type PropType, watch } from "vue";
+
+import {ColorEnum} from "@dative-gpi/foundation-shared-components/models";
+
+import { useModels } from "@dative-gpi/foundation-core-services/composables";
+import type { ModelFilters, ModelInfos } from "@dative-gpi/foundation-core-domain/models";
+
+import FSDataTable from "../FSDataTable.vue";
+import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
+import FSImage from "@dative-gpi/foundation-shared-components/components/FSImage.vue";
+import FSIconCheck from "@dative-gpi/foundation-shared-components/components/FSIconCheck.vue";
+import FSModelTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSModelTileUI.vue";
+
+export default defineComponent({
+  name: "FSBaseModelsList",
+  components: {
+    FSModelTileUI,
+    FSDataTable,
+    FSIconCheck,
+    FSImage,
+    FSIcon,
+  },
+  props: {
+    tableCode: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    },
+    modelsFilters: {
+      type: Object as PropType<ModelFilters>,
+      required: false,
+      default: null
+    },
+    itemTo: {
+      type: Function as PropType<(item: ModelInfos) => Partial<RouteLocation>>,
+      required: false
+    },
+    editable: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    singleSelect: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    modelValue: {
+      type: Array as PropType<string[]>,
+      default: () => [],
+      required: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props) {
+    const { getMany: fetchModels, fetching: fetchingModels, entities: models } = useModels();
+
+    const isSelected = (id: string): boolean => {
+      return props.modelValue.includes(id);
+    };
+
+    watch(() => props.modelsFilters, (next, previous) => {
+      if ((!next && !previous) || !_.isEqual(next, previous)) {
+        fetchModels(props.modelsFilters);
+      }
+    }, { immediate: true });
+
+    return {
+      fetchingModels,
+      ColorEnum,
+      models,
+      isSelected
+    };
+  }
+});
+</script>

package/components/lists/models/FSSimpleModelsList.vue

@@ -0,0 +1,44 @@
+<template>
+  <FSSimpleList
+    :items="models"
+    :loading="fetching"
+    v-bind="$attrs"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, type PropType, watch } from "vue";
+
+import type { ModelFilters } from "@dative-gpi/foundation-core-domain/models";
+import { useModels } from "@dative-gpi/foundation-core-services/composables";
+
+import FSSimpleList from "@dative-gpi/foundation-shared-components/components/lists/FSSimpleList.vue";
+
+export default defineComponent({
+  name: "FSSimpleModelsList",
+  components: {
+    FSSimpleList,
+  },
+  props: {
+    modelFilters: {
+      type: Object as PropType<ModelFilters>,
+      required: false,
+      default: () => ({})
+    }
+  },
+  setup(props){
+    const { entities: models, getMany, fetching } = useModels();
+
+    const fetch = () => {
+      getMany(props.modelFilters);
+    }
+
+    watch(() => props.modelFilters, fetch, { immediate: true });
+
+    return {
+      models,
+      fetching
+    }
+  }
+});
+</script>