@dative-gpi/foundation-core-components 0.0.85 → 0.0.86

package/components/autocompletes/FSAutocompleteDataCategory.vue

@@ -0,0 +1,112 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="dataCategories"
+    :multiple="$props.multiple"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs">
+    <template #selection="{ item }">
+      <FSRow align="center-center"
+        :wrap="false"
+        :gap="0">
+        <FSText>
+          {{ item.raw.label }}
+        </FSText>
+        <FSIcon>
+          {{ item.raw.correlated ? 'mdi-link' : 'mdi-link-off' }}
+        </FSIcon>
+      </FSRow>
+    </template>
+    <template #item="{ props, item }">
+      <v-list-item v-bind="{ ...props, title: '' }">
+        <FSRow align="center-left">
+          <FSCheckbox v-if="$props.multiple"
+            :modelValue="isSelected(item.value)" />
+          <FSRow :gap="2">
+            <FSText>
+              {{ item.raw.label }}
+            </FSText>
+            <FSIcon>
+              {{ item.raw.correlated ? 'mdi-link' : 'mdi-link-off' }}
+            </FSIcon>
+          </FSRow>
+        </FSRow>
+      </v-list-item>
+    </template>
+  </FSAutocompleteField>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useDataCategories } from "@dative-gpi/foundation-core-services/composables";
+import { DataCategoryFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+import FSText from "@dative-gpi/foundation-shared-components/components/FSText.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteDataCategory",
+  components: {
+    FSAutocompleteField,
+    FSText
+  },
+  props: {
+    dataCategoriesFilters: {
+      type: Object as PropType<DataCategoryFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    multiple: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyDataCategories, fetching: fetchingDataCategories, entities: dataCategories } = useDataCategories();
+
+    const innerFetch = (search: string | null) => {
+      return getManyDataCategories({ ...props.dataCategoriesFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      dataCategories,
+      [() => props.dataCategoriesFilters],
+      emit,
+      innerFetch
+    );
+
+    const loading = computed((): boolean => {
+      return init.value && fetchingDataCategories.value;
+    });
+
+    const isSelected = (id: any) => {
+      return props.modelValue?.includes(id);
+    }
+
+    return {
+      dataCategories,
+      toggleSet,
+      loading,
+      search,
+      onUpdate,
+      isSelected
+    };
+  }
+});
+</script>

package/components/autocompletes/FSAutocompleteDataDefinition.vue

@@ -0,0 +1,112 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="dataDefinitions"
+    :multiple="$props.multiple"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs">
+    <template #selection="{ item }">
+      <FSRow align="center-center"
+        :wrap="false"
+        :gap="0">
+        <FSText>
+          {{ item.raw.label }}
+        </FSText>
+        <FSText v-if="item.raw.unit">
+          ({{ item.raw.unit }})
+        </FSText>
+      </FSRow>
+    </template>
+    <template #item="{ props, item }">
+      <v-list-item v-bind="{ ...props, title: '' }">
+        <FSRow align="center-left">
+          <FSCheckbox v-if="$props.multiple"
+            :modelValue="isSelected(item.value)" />
+          <FSRow :gap="0">
+            <FSText>
+              {{ item.raw.label }}
+            </FSText>
+            <FSText v-if="item.raw.unit">
+              ({{ item.raw.unit }})
+            </FSText>
+          </FSRow>
+        </FSRow>
+      </v-list-item>
+    </template>
+  </FSAutocompleteField>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useDataDefinitions } from "@dative-gpi/foundation-core-services/composables";
+import { DataDefinitionFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+import FSText from "@dative-gpi/foundation-shared-components/components/FSText.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteDataDefinition",
+  components: {
+    FSAutocompleteField,
+    FSText
+  },
+  props: {
+    dataDefinitionFilters: {
+      type: Object as PropType<DataDefinitionFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    multiple: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyDataDefinitions, fetching: fetchingDataDefinitions, entities: dataDefinitions } = useDataDefinitions();
+
+    const innerFetch = (search: string | null) => {
+      return getManyDataDefinitions({ ...props.dataDefinitionFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      dataDefinitions,
+      [() => props.dataDefinitionFilters],
+      emit,
+      innerFetch
+    );
+
+    const loading = computed((): boolean => {
+      return init.value && fetchingDataDefinitions.value;
+    });
+
+    const isSelected = (id: any) => {
+      return props.modelValue?.includes(id);
+    }
+
+    return {
+      dataDefinitions,
+      toggleSet,
+      loading,
+      search,
+      onUpdate,
+      isSelected
+    };
+  }
+});
+</script>

package/components/autocompletes/FSAutocompleteGroup.vue

@@ -0,0 +1,70 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="groups"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs" />
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useGroups } from "@dative-gpi/foundation-core-services/composables";
+import { GroupFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteGroup",
+  components: {
+    FSAutocompleteField
+  },
+  props: {
+    groupFilters: {
+      type: Object as PropType<GroupFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyGroups, fetching: fetchingGroups, entities: groups } = useGroups();
+
+    const innerFetch = (search: string | null) => {
+      return getManyGroups({ ...props.groupFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      groups,
+      [() => props.groupFilters],
+      emit,
+      innerFetch
+    );
+
+    const loading = computed((): boolean => {
+      return init.value && fetchingGroups.value;
+    });
+
+    return {
+      groups,
+      toggleSet,
+      loading,
+      search,
+      onUpdate
+    };
+  }
+});
+</script>

package/components/autocompletes/FSAutocompleteManufacturer.vue

@@ -0,0 +1,70 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="manufacturers"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs" />
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useManufacturers } from "@dative-gpi/foundation-core-services/composables";
+import { ManufacturerFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteManufacturer",
+  components: {
+    FSAutocompleteField
+  },
+  props: {
+    manufacturerFilters: {
+      type: Object as PropType<ManufacturerFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyManufacturers, fetching: fetchingManufacturers, entities: manufacturers } = useManufacturers();
+
+    const innerFetch = (search: string | null) => {
+      return getManyManufacturers({ ...props.manufacturerFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      manufacturers,
+      [() => props.manufacturerFilters],
+      emit,
+      innerFetch
+    );
+
+    const loading = computed((): boolean => {
+      return init.value && fetchingManufacturers.value;
+    });
+
+    return {
+      manufacturers,
+      toggleSet,
+      loading,
+      search,
+      onUpdate
+    };
+  }
+});
+</script>

package/components/autocompletes/FSAutocompleteModel.vue

@@ -0,0 +1,70 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="models"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs" />
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useModels } from "@dative-gpi/foundation-core-services/composables";
+import { ModelFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteModel",
+  components: {
+    FSAutocompleteField
+  },
+  props: {
+    modelFilters: {
+      type: Object as PropType<ModelFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyModels, fetching: fetchingModels, entities: models } = useModels();
+
+    const innerFetch = (search: string | null) => {
+      return getManyModels({ ...props.modelFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      models,
+      [() => props.modelFilters],
+      emit,
+      innerFetch
+    );
+
+    const loading = computed((): boolean => {
+      return init.value && fetchingModels.value;
+    });
+
+    return {
+      models,
+      toggleSet,
+      loading,
+      search,
+      onUpdate
+    };
+  }
+});
+</script>

package/components/autocompletes/FSAutocompleteOrganisationType.vue

@@ -0,0 +1,70 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="organisationTypes"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs" />
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useOrganisationTypes } from "@dative-gpi/foundation-core-services/composables";
+import { OrganisationTypeFilters } from "@dative-gpi/foundation-shared-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteOrganisationType",
+  components: {
+    FSAutocompleteField
+  },
+  props: {
+    organisationTypeFilters: {
+      type: Object as PropType<OrganisationTypeFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyOrganisationTypes, fetching: fetchingOrganisationTypes, entities: organisationTypes } = useOrganisationTypes();
+
+    const innerFetch = (search: string | null) => {
+      return getManyOrganisationTypes({ ...props.organisationTypeFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      organisationTypes,
+      [() => props.organisationTypeFilters],
+      emit,
+      innerFetch
+    );
+
+    const loading = computed((): boolean => {
+      return init.value && fetchingOrganisationTypes.value;
+    });
+
+    return {
+      organisationTypes,
+      toggleSet,
+      loading,
+      search,
+      onUpdate
+    };
+  }
+});
+</script>

package/components/autocompletes/FSAutocompleteUserOrganisation.vue

@@ -0,0 +1,109 @@
+<template>
+  <FSAutocompleteField :toggleSet="!$props.toggleSetDisabled && toggleSet"
+    :loading="loading"
+    :items="userOrganisations"
+    :multiple="$props.multiple"
+    :modelValue="$props.modelValue"
+    @update:modelValue="onUpdate"
+    v-model:search="search"
+    v-bind="$attrs">
+    <template #selection="{ item }">
+      <FSRow align="center-center"
+        :wrap="false">
+        <FSImage height="26px"
+          width="26px"
+          :imageId="item.raw.imageId" />
+        <FSText>
+          {{ item.raw.label }}
+        </FSText>
+      </FSRow>
+    </template>
+    <template #item="{ props, item }">
+      <v-list-item v-bind="{ ...props, title: '' }">
+        <FSRow align="center-left">
+          <FSCheckbox v-if="$props.multiple"
+            :modelValue="isSelected(item.value)" />
+          <FSImage height="26px"
+            width="26px"
+            :imageId="item.raw.imageId" />
+          <FSText>
+            {{ item.raw.label }}
+          </FSText>
+        </FSRow>
+      </v-list-item>
+    </template>
+  </FSAutocompleteField>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+import { useAutocomplete } from "@dative-gpi/foundation-shared-components/composables";
+import { useUserOrganisations } from "@dative-gpi/foundation-core-services/composables";
+import { UserOrganisationFilters } from "@dative-gpi/foundation-core-domain/models";
+
+import FSAutocompleteField from "@dative-gpi/foundation-shared-components/components/fields/FSAutocompleteField.vue";
+import FSImage from "@dative-gpi/foundation-shared-components/components/FSImage.vue";
+import FSText from "@dative-gpi/foundation-shared-components/components/FSText.vue";
+
+export default defineComponent({
+  name: "FSAutocompleteUserOrganisation",
+  components: {
+    FSAutocompleteField,
+    FSImage,
+    FSText
+  },
+  props: {
+    userOrganisationFilters: {
+      type: Object as PropType<UserOrganisationFilters>,
+      required: false,
+      default: null
+    },
+    modelValue: {
+      type: [Array, String] as PropType<string[] | string | null>,
+      required: false,
+      default: null
+    },
+    multiple: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    toggleSetDisabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props, { emit }) {
+    const { getMany: getManyUserOrganisations, fetching: fetchingUserOrganisations, entities: userOrganisations } = useUserOrganisations();
+
+    const innerFetch = (search: string | null) => {
+      return getManyUserOrganisations({ ...props.userOrganisationFilters, search: search ?? undefined });
+    };
+
+    const { toggleSet, search, init, onUpdate } = useAutocomplete(
+      userOrganisations,
+      [() => props.userOrganisationFilters],
+      emit,
+      innerFetch
+    );
+
+    const isSelected = (id: any) => {
+      return props.modelValue?.includes(id);
+    }
+    const loading = computed((): boolean => {
+      return init.value && fetchingUserOrganisations.value;
+    });
+
+    return {
+      userOrganisations,
+      toggleSet,
+      loading,
+      search,
+      isSelected,
+      onUpdate
+    };
+  }
+});
+</script>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dative-gpi/foundation-core-components",
   "sideEffects": false,
-  "version": "0.0.85",
+  "version": "0.0.86",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -10,11 +10,11 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-core-domain": "0.0.85",
-    "@dative-gpi/foundation-core-services": "0.0.85",
-    "@dative-gpi/foundation-shared-components": "0.0.85",
-    "@dative-gpi/foundation-shared-domain": "0.0.85",
-    "@dative-gpi/foundation-shared-services": "0.0.85",
+    "@dative-gpi/foundation-core-domain": "0.0.86",
+    "@dative-gpi/foundation-core-services": "0.0.86",
+    "@dative-gpi/foundation-shared-components": "0.0.86",
+    "@dative-gpi/foundation-shared-domain": "0.0.86",
+    "@dative-gpi/foundation-shared-services": "0.0.86",
     "color": "^4.2.3",
     "vue": "^3.4.23",
     "vuedraggable": "^4.1.0"
@@ -24,5 +24,5 @@
     "sass": "^1.69.5",
     "sass-loader": "^13.3.2"
   },
-  "gitHead": "9c0b770f8b54cce1cd3aa7c25c91ad1a99b08862"
+  "gitHead": "ff4a752918cbf77980545c0056db4235bcb23a11"
 }