opendesk

1<template>
2  <div class="flex gap-3 w-full justify-between flex-1">
3    <div class="flex-1 flex flex-col gap-1.5">
4      <span class="block text-xs text-ink-gray-5"
5        >{{ __("Parent field") }}
6        <span class="text-ink-red-6 select-none">*</span>
7      </span>
8      <Combobox
9        v-model="state.selectedParentField"
10        :options="parentFields"
11        :disabled="!isNew"
12        :open-on-focus="true"
13        class="w-full"
14      />
15    </div>
16    <div class="flex-1 flex flex-col gap-1.5">
17      <span class="block text-xs text-ink-gray-5"
18        >{{ __("Child field") }}
19        <span class="text-ink-red-6 select-none">*</span>
20      </span>
21      <Combobox
22        v-model="state.selectedChildField"
23        :options="state.childFields"
24        :disabled="!state.selectedParentField || !isNew"
25        :open-on-focus="true"
26        class="w-full"
27      />
28    </div>
29  </div>
30</template>
31
32<script setup lang="ts">
33import { FieldCriteriaState } from "@/types";
34import { Combobox } from "frappe-ui";
35
36const state = defineModel<FieldCriteriaState>();
37
38const props = defineProps<{
39  isNew: boolean;
40  parentFields: any[];
41}>();
42</script>
43
44<style scoped></style>
45