390 lines
12 KiB
Vue
Executable File
390 lines
12 KiB
Vue
Executable File
<!--suppress ALL -->
|
|
<template>
|
|
<div class="q-py-xs centermydiv cardrec" :style="{ maxWidth: computedWidth }">
|
|
<div v-if="myrec && table === shared_consts.TABLES_MYBACHECAS">
|
|
<div class="row">
|
|
<div class="col-2 q-my-sm">
|
|
<div class="column">
|
|
<span class="ev_dayofweek">{{
|
|
tools.getDayOfWeek(myrec.dateTimeStart)
|
|
}}</span>
|
|
<span class="ev_day">{{
|
|
tools.getstrDay(myrec.dateTimeStart)
|
|
}}</span>
|
|
<span class="ev_month">{{
|
|
tools.getstrMonth3Letters(myrec.dateTimeStart)
|
|
}}</span>
|
|
<span class="ev_hour">{{
|
|
tools.getstrTime(myrec.dateTimeStart)
|
|
}}</span>
|
|
<span
|
|
v-if="
|
|
tools.getstrDay(myrec.dateTimeStart) ===
|
|
tools.getstrDay(myrec.dateTimeEnd)
|
|
"
|
|
class="ev_hour_end"
|
|
>{{ tools.getstrTime(myrec.dateTimeEnd) }}</span
|
|
>
|
|
<div
|
|
v-if="
|
|
tools.getstrDay(myrec.dateTimeStart) !==
|
|
tools.getstrDay(myrec.dateTimeEnd)
|
|
"
|
|
class="q-mx-sm"
|
|
>
|
|
-----
|
|
</div>
|
|
<span
|
|
v-if="
|
|
tools.getstrDay(myrec.dateTimeStart) !==
|
|
tools.getstrDay(myrec.dateTimeEnd)
|
|
"
|
|
class="ev_dayofweek"
|
|
>{{ tools.getDayOfWeek(myrec.dateTimeEnd) }}</span
|
|
>
|
|
<span
|
|
v-if="
|
|
tools.getstrDay(myrec.dateTimeStart) !==
|
|
tools.getstrDay(myrec.dateTimeEnd)
|
|
"
|
|
class="ev_day"
|
|
>{{ tools.getstrDay(myrec.dateTimeEnd) }}</span
|
|
>
|
|
<span
|
|
v-if="
|
|
tools.getstrDay(myrec.dateTimeStart) !==
|
|
tools.getstrDay(myrec.dateTimeEnd)
|
|
"
|
|
class="ev_month"
|
|
>{{ tools.getstrMonth3Letters(myrec.dateTimeEnd) }}</span
|
|
>
|
|
<span
|
|
v-if="
|
|
tools.getstrDay(myrec.dateTimeStart) !==
|
|
tools.getstrDay(myrec.dateTimeEnd)
|
|
"
|
|
class="ev_hour_end"
|
|
>{{ tools.getstrTime(myrec.dateTimeEnd) }}</span
|
|
>
|
|
<q-avatar size="50px" class="q-my-sm">
|
|
<q-img
|
|
:src="getImgUser(myrec)"
|
|
:alt="myrec.username"
|
|
img-class="imgprofile"
|
|
height="50px"
|
|
/>
|
|
</q-avatar>
|
|
</div>
|
|
</div>
|
|
<div class="col-10">
|
|
<q-img
|
|
:src="
|
|
tools.getFullFileName(myrec.photos, table, myrec.username, '')
|
|
"
|
|
:alt="myrec.descr"
|
|
img-class="imgprofile"
|
|
height="270px"
|
|
fit="cover"
|
|
@click="cmdExt(costanti.CMD_SHOW_PAGE, null, myrec)"
|
|
/>
|
|
<!--<div class="event_date">
|
|
<span v-html="tools.getstrDateTimeEvent($t, myrec, true, true)"></span>
|
|
</div>-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<q-item
|
|
v-if="myrec"
|
|
clickable
|
|
v-ripple
|
|
:class="
|
|
`shadow-2 butt_rounded ` +
|
|
(tools.isPartecipero(myrec) ? ` butt_green ` : '')
|
|
"
|
|
>
|
|
<q-item-section
|
|
v-if="
|
|
(shared_consts.TABLES_VISU_IMG.includes(table) &&
|
|
myrec.photos &&
|
|
myrec.photos.length > 0) ||
|
|
(myrec.mygrp && myrec.mygrp.photos.length > 0)
|
|
"
|
|
avatar
|
|
@click="cmdExt(costanti.CMD_SHOW_PAGE, null, myrec)"
|
|
>
|
|
<q-badge
|
|
v-if="showBadge()"
|
|
class="q-my-xs self-center"
|
|
:color="fieldsTable.getColByAdType(myrec.adType)"
|
|
>
|
|
{{ fieldsTable.getValByTabAndId(table, 'adType', myrec.adType) }}
|
|
<q-icon
|
|
:name="fieldsTable.getIconByAdType(myrec.adType)"
|
|
color="white"
|
|
class="q-ml-xs"
|
|
/>
|
|
</q-badge>
|
|
|
|
<q-avatar size="60px">
|
|
<q-img
|
|
v-if="
|
|
myrec.mygrp &&
|
|
myrec.mygrp.groupname &&
|
|
tools.getValue(myrec.mygrp, 'photos', '')
|
|
"
|
|
:src="
|
|
tools.getFullFileName(
|
|
tools.getValue(myrec.mygrp, 'photos', ''),
|
|
'mygroups',
|
|
myrec.username,
|
|
myrec.groupname
|
|
)
|
|
"
|
|
class="img"
|
|
alt="immagine del gruppo"
|
|
>
|
|
</q-img>
|
|
<q-img
|
|
v-else
|
|
:src="
|
|
tools.getFullFileName(myrec.photos, table, myrec.username, '')
|
|
"
|
|
:alt="myrec.descr"
|
|
img-class="imgprofile"
|
|
height="60px"
|
|
/>
|
|
</q-avatar>
|
|
</q-item-section>
|
|
|
|
<q-item-section
|
|
v-else-if="!myrec.organisedBy && table !== shared_consts.TABLES_MYBACHECAS"
|
|
avatar
|
|
@click="naviga(`/my/` + myrec.username)"
|
|
>
|
|
<q-badge
|
|
v-if="showBadge()"
|
|
class="q-my-xs self-center"
|
|
:color="fieldsTable.getColByAdType(myrec.adType)"
|
|
>
|
|
{{ fieldsTable.getValByTabAndId(table, 'adType', myrec.adType) }}
|
|
<q-icon
|
|
:name="fieldsTable.getIconByAdType(myrec.adType)"
|
|
color="white"
|
|
class="q-ml-xs"
|
|
/>
|
|
</q-badge>
|
|
<q-avatar size="60px">
|
|
<q-img
|
|
:src="getImgUser(myrec)"
|
|
:alt="myrec.username"
|
|
img-class="imgprofile"
|
|
height="60px"
|
|
/>
|
|
</q-avatar>
|
|
</q-item-section>
|
|
|
|
<q-item-section @click="navigaExt(myrec)">
|
|
<q-item-label lines="2" class="full-width">
|
|
<span
|
|
v-for="(rec, ind) of tools.getArrSubSector(table, myrec)"
|
|
:key="ind"
|
|
>
|
|
<q-chip
|
|
dense
|
|
class="text-center shadow-5 glossy text-white bg-green"
|
|
>{{ rec.descr }}</q-chip
|
|
>
|
|
</span>
|
|
<span>
|
|
<span
|
|
v-for="(rec, ind) of tools.getArrSector(table, myrec)"
|
|
:key="ind"
|
|
>
|
|
<q-chip
|
|
dense
|
|
class="text-center shadow-5 glossy text-white bg-blue"
|
|
>{{ rec.descr }}</q-chip
|
|
></span
|
|
>
|
|
</span>
|
|
<span
|
|
v-for="(recstatus, index) in myrec.idStatusSkill"
|
|
:key="index"
|
|
class="q-ml-xs"
|
|
style="vertical-align: middle"
|
|
>
|
|
<q-badge
|
|
v-if="
|
|
recstatus === shared_consts.STATUSSKILL_ONLINE ||
|
|
myrec.idStatusSkill.length > 1
|
|
"
|
|
dense
|
|
:color="globalStore.getColByStatusSkills(recstatus)"
|
|
text-color="white"
|
|
>
|
|
<q-icon
|
|
:name="globalStore.getStatusSkillIconById(recstatus)"
|
|
color="white"
|
|
/>
|
|
{{ globalStore.getStatusSkillById(recstatus) }}
|
|
</q-badge>
|
|
</span>
|
|
|
|
<!--<span class="dateevent" v-if="myrec.dateTimeStart">dal <span class="datainizio">{{tools.getstrVeryShortDate(myrec.dateStart) }}</span> al <span class="datafine">{{ tools.getstrVeryShortDate(myrec.dateEnd) }}</span>
|
|
</span>-->
|
|
</q-item-label>
|
|
|
|
<q-item-label
|
|
lines="4"
|
|
:class="table === shared_consts.TABLES_MYBACHECAS ? 'text-bold' : ''"
|
|
v-if="myrec.descr"
|
|
>{{ myrec.descr }}<br />
|
|
</q-item-label>
|
|
<q-item-label lines="1" style="" class="text_user_city">
|
|
<div class="row justify-between">
|
|
<div class="text-weight-bold text-italic">
|
|
<span
|
|
v-if="
|
|
table === shared_consts.TABLES_MYBACHECAS && myrec.organisedBy
|
|
"
|
|
>
|
|
<span>{{ myrec.organisedBy }} </span>
|
|
</span>
|
|
<span v-else>
|
|
{{ getNameToShow(myrec) }}
|
|
</span>
|
|
</div>
|
|
<div class="q-mx-sm">
|
|
(
|
|
<span
|
|
v-if="
|
|
table === shared_consts.TABLES_MYBACHECAS &&
|
|
tools.getNumPartecipantes(myrec) > 0
|
|
"
|
|
>
|
|
<span class="q-mx-xxs-left text-bold">{{
|
|
tools.getNumPartecipantes(myrec)
|
|
}}</span>
|
|
<span class="q-mx-xxs-left"
|
|
><q-icon dense color="blue" name="far fa-check-circle" />
|
|
</span>
|
|
</span>
|
|
<span class="q-mx-xxs-left">{{
|
|
myrec.numseen ? myrec.numseen : 0
|
|
}}</span>
|
|
<span class="q-mx-xxs-left"
|
|
><q-icon dense color="blue" name="far fa-eye" />
|
|
</span>
|
|
<span class="q-mx-xxs-left"> </span>
|
|
<span class="" v-if="myrec">{{
|
|
myrec.numfav ? myrec.numfav : 0
|
|
}}</span>
|
|
<span class="q-mx-xxs-left"
|
|
><q-icon
|
|
dense
|
|
color="red"
|
|
:name="
|
|
userStore.isFavorite(myrec._id, table)
|
|
? 'favorite'
|
|
: 'far fa-heart'
|
|
"
|
|
/>
|
|
</span>
|
|
<!--<span class="q-mx-xxs"> </span>
|
|
<span class="">{{ myrec.mybook.length }}</span>
|
|
<span class="q-mx-xxs"
|
|
><q-icon
|
|
dense
|
|
color="teal"
|
|
:name="
|
|
userStore.isBookmarked(myrec._id, table)
|
|
? 'bookmark'
|
|
: 'far fa-bookmark'
|
|
"
|
|
/>
|
|
</span>
|
|
-->
|
|
)
|
|
</div>
|
|
</div>
|
|
</q-item-label>
|
|
|
|
<q-item-label
|
|
v-if="tools.isPartecipero(myrec)"
|
|
lines="1"
|
|
style="text-align: left"
|
|
class="text_user_city"
|
|
>
|
|
<span class="text-bold text-green text-h7">
|
|
<q-icon name="fas fa-user-check" color="green"></q-icon>
|
|
{{ $t('event.attend') }}</span
|
|
>
|
|
</q-item-label>
|
|
<q-item-label
|
|
lines="1"
|
|
style="text-align: right"
|
|
class="text_user_city"
|
|
>
|
|
<span v-for="(rec, ind) of myrec.mycities" :key="ind"
|
|
><span v-if="ind > 0">, </span>{{ rec.comune }} ({{
|
|
rec.prov
|
|
}})</span
|
|
>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
<q-item-section side v-if="tools.canModifyThisRec(myrec) || editOn">
|
|
<q-item-label>
|
|
<q-btn rounded dense 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, null)"
|
|
>
|
|
<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_CLONE, myrec._id, null)"
|
|
>
|
|
<q-item-section side>
|
|
<q-icon name="fas fa-copy" />
|
|
</q-item-section>
|
|
<q-item-section>{{ $t('event.duplicate') }}</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, null)"
|
|
>
|
|
<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="./CMyRecCard.ts">
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './CMyRecCard.scss';
|
|
</style>
|