<template>
  <div v-if="tools.isUserOk()">
    <div v-if="grp">
      <q-item class="q-my-sm" clickable>
        <q-item-section avatar @click="naviga(tools.getPathByGroup(grp))">
          <q-item-label v-if="labelextra"
            ><strong>{{ labelextra }}</strong></q-item-label
          >
          <q-avatar size="60px">
            <q-img
              :src="getImgGroup(grp)"
              :alt="grp.groupname"
              img-class="imgprofile"
              height="60px"
            />
          </q-avatar>
        </q-item-section>

        <q-item-section @click="naviga(tools.getPathByGroup(grp))">
          <q-item-label
            ><strong>{{ grp.title }}</strong> ({{ grp.groupname }})
          </q-item-label>
          <q-item-label v-if="grp.descr" caption lines="3"
            ><em>{{ grp.descr }}</em></q-item-label
          >
        </q-item-section>
      </q-item>
    </div>
  </div>
  <div v-else></div>
</template>

<script lang="ts" src="./CMyGroupOnlyView.ts">
</script>

<style lang="scss" scoped>
@import './CMyGroupOnlyView.scss';
</style>
