<template>
  <div class="q-py-xs centermydiv cardrec"
       :style="`max-width: `+ (tools.getwidth($q) - 20) +`px; ` + ($q.screen.lt.sm ? (`min-width: `+ (tools.getwidth($q) - 20) +`px;`) : ``)">

    <q-item v-if="myrec" clickable v-ripple class="shadow-2 q-btn--rounded bg-teal-1">

      <q-item-section v-if="myrec.photo" avatar
                      @click="cmdExt(costanti.CMD_SHOW_PAGE, myrec)">
        <q-avatar size="60px">
          <q-img :src="userStore.getImgByCircuit(myrec)" :alt="myrec.descr"
                 img-class="imgprofile" height="60px"/>
        </q-avatar>
      </q-item-section>

      <q-item-section @click="cmdExt(costanti.CMD_SHOW_PAGE, myrec)">
        <q-item-label v-if="myrec.name" lines="1" class="text_title">
          <span class="text-weight-bold">{{ myrec.name }}</span>
        </q-item-label>
        <q-item-label v-if="myrec.subname" lines="1" class="text_title">
          <span>{{ myrec.subname }}</span>
        </q-item-label>
        <q-item-label lines="3" v-if="myrec.longdescr">{{ myrec.longdescr }}<br>
        </q-item-label>
        <!--
        <CCurrencyValue
          :symbol="myrec.symbol"
          :tips="t('account.saldo_tips')"
          :color="myrec.color"
          :value="myrec.account.saldo"
          label="Saldo">

        </CCurrencyValue>
        -->

      </q-item-section>
      <q-item-section side v-if="tools.canModifyThisRec(myrec, table)">
        <q-item-label>
          <q-btn rounded icon="fas fa-pencil-alt">
            <q-menu>
              <q-list style="min-width: 150px">
                <q-item clickable v-close-popup
                        @click="cmdExt(costanti.CMD_MODIFY, myrec._id)">
                  <q-item-section side>
                    <q-icon name="fas fa-pencil-alt"/>
                  </q-item-section>
                  <q-item-section>{{ $t('reg.edit') }}</q-item-section>
                </q-item>
              </q-list>
              <q-list style="min-width: 150px">
                <q-item clickable v-close-popup @click="cmdExt(costanti.CMD_DELETE, myrec._id)">
                  <q-item-section side>
                    <q-icon name="fas fa-trash-alt"/>
                  </q-item-section>
                  <q-item-section>{{ $t('reg.elimina') }}</q-item-section>
                </q-item>
              </q-list>
            </q-menu>
          </q-btn>
        </q-item-label>
      </q-item-section>

    </q-item>
    <q-separator inset="item"/>
  </div>

</template>

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

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