Parse refdt options and pass to widget component #147

archesproject · Jan 3, 2025 · 07b938b · 07b938b
1 parent 97b2e66
commit 07b938b
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 17 deletions.
diff --git a/arches_lingo/src/arches_lingo/components/generic/LabelEditor.vue b/arches_lingo/src/arches_lingo/components/generic/LabelEditor.vue
@@ -1,13 +1,18 @@
 <script setup lang="ts">
-import { defineProps, ref } from "vue";
+import { defineProps, onMounted, ref } from "vue";
+import { fetchControlledListOptions } from "@/arches_lingo/api.ts";
 
 import NonLocalizedString from "@/arches_lingo/components/generic/NonLocalizedString.vue";
-
+import ReferenceDatatype from "@/arches_lingo/components/generic/ReferenceDatatype.vue";
 // import ResourceInstanceRelationships from "@/arches_lingo/components/generic/ResourceInstanceRelationships.vue";
 
-import { EDIT } from "@/arches_lingo/constants.ts";
+import { EDIT, LANGUAGE_CONTROLLED_LIST } from "@/arches_lingo/constants.ts";
 
-import type { AppellativeStatus } from "@/arches_lingo/types.ts";
+import type {
+    AppellativeStatus,
+    ControlledListItem,
+    ControlledListItemResult,
+} from "@/arches_lingo/types.ts";
 
 const props = withDefaults(
     defineProps<{
@@ -17,13 +22,34 @@ const props = withDefaults(
         value: () => ({}) as AppellativeStatus,
     },
 );
-
 const appellative_status = ref(props.value);
 
 function onUpdate(newValue: string) {
     // handle the update
     console.log("Update new value here!" + newValue);
 }
+
+async function getOptions(listId: string): Promise<ControlledListItem[]> {
+    const parsed = await fetchControlledListOptions(listId);
+    const options = parsed.items.map(
+        (item: ControlledListItemResult): ControlledListItem => ({
+            item_id: item.id,
+            list_id: item.list_id,
+            uri: item.uri,
+            sortorder: item.sortorder,
+            guide: item.guide,
+            labels: item.values,
+        }),
+    );
+    return options;
+}
+
+const languageOptions = ref<ControlledListItem[]>([]);
+
+onMounted(async () => {
+    const lang_opts = await getOptions(LANGUAGE_CONTROLLED_LIST);
+    languageOptions.value = lang_opts;
+});
 </script>
 
 <template>
@@ -38,7 +64,12 @@ function onUpdate(newValue: string) {
     />
     <!-- Label Language: reference datatype -->
     <label for="">{{ $gettext("Label Language") }}</label>
-
+    <ReferenceDatatype
+        :value="appellative_status?.appellative_status_ascribed_name_language"
+        :mode="EDIT"
+        :multivalue="false"
+        :options="languageOptions"
+    />
     <!-- Label Type: reference datatype -->
     <label for="">{{ $gettext("Label Type") }}</label>
 

diff --git a/arches_lingo/src/arches_lingo/components/generic/ReferenceDatatype.vue b/arches_lingo/src/arches_lingo/components/generic/ReferenceDatatype.vue
@@ -8,10 +8,10 @@ import ReferenceDatatypeEditor from "@/arches_lingo/components/generic/reference
 import ReferenceDatatypeListEditor from "@/arches_lingo/components/generic/reference-datatype/ReferenceDatatypeListEditor.vue";
 import { EDIT, VIEW } from "@/arches_lingo/constants.ts";
 
-const { mode = VIEW } = defineProps<{
+defineProps<{
     mode?: DataComponentMode;
     value?: ControlledListItem | ControlledListItem[];
-    multiValue?: string;
+    multiValue?: boolean;
     options?: ControlledListItem[];
 }>();
 const emits = defineEmits(["update"]);
@@ -24,15 +24,17 @@ const onUpdate = (val: ControlledListItem) => {
         <div v-if="mode === VIEW">
             <ReferenceDatatypeViewer :value="value" />
         </div>
-        <div v-if="mode === EDIT && multiValue === '1'">
+        <div v-if="mode === EDIT && multiValue === false">
             <ReferenceDatatypeEditor
                 :value="value"
+                :options="options"
                 @update="onUpdate"
             />
         </div>
-        <div v-if="mode === EDIT && multiValue === 'n'">
+        <div v-if="mode === EDIT && multiValue === true">
             <ReferenceDatatypeListEditor
                 :value="value"
+                :options="options"
                 @update="onUpdate"
             />
         </div>

diff --git a/..._lingo/src/arches_lingo/components/generic/reference-datatype/ReferenceDatatypeEditor.vue b/..._lingo/src/arches_lingo/components/generic/reference-datatype/ReferenceDatatypeEditor.vue
@@ -20,8 +20,6 @@ const props = withDefaults(
     },
 );
 
-console.log(props);
-
 const emit = defineEmits(["update"]);
 const valRef = toRef(props, "val");
 const value = computed({
@@ -32,12 +30,8 @@ const value = computed({
         emit("update", value);
     },
 });
-// const getOptionLabels = (value) => {
-//     return getItemLabel(value, selectedLanguage.value.code, systemLanguage.code)
-//         .value;
-// };
-// :optionLabel="getOptionLabels"
 </script>
+
 <template>
     <Select
         v-model="value"

diff --git a/arches_lingo/src/arches_lingo/types.ts b/arches_lingo/src/arches_lingo/types.ts
@@ -54,6 +54,15 @@ export interface ControlledListItem {
     labels: ControlledListeItemLabelValue[];
 }
 
+export interface ControlledListItemResult {
+    id: string;
+    list_id: string;
+    uri: string;
+    sortorder: number;
+    guide: boolean;
+    values: ControlledListeItemLabelValue[];
+}
+
 export interface ResourceInstanceReference {
     resourceId: string;
     ontologyProperty: string;