<script lang="ts" setup>
import { elementsGroups } from './options';

</script>

<template>
  <view class="flex-1 flex flex-col h-full">
    <div v-for="(item, index) in elementsGroups" :key="index" class="p-2 rounded b-error b b-solid m-2">
      {{ index + 1 }}. {{ item.groupName }}

      <div v-for="(it, ind) in item.characteristic" :key="ind" class="p-2 b rounded bg-primary-50 b-amber b-solid my-2">
        <span class="text-onInfo">{{ it.groupName }}</span>
        <div v-for="(i, id) in it.traits" :key="id" class="p-2 b b-primary rounded b-solid my-2">
          {{ i.question }}
        </div>
      </div>
    </div>
  </view>
</template>

<style lang="scss" scoped>

</style>
