469 lines
16 KiB
Vue
469 lines
16 KiB
Vue
<template>
|
|
<div v-if="myrec && myrec._id" class="fulldiv">
|
|
<div class="q-pa-sm row items-start q-gutter-sm full-height fulldiv">
|
|
<q-card class="my-card fulldiv" bordered>
|
|
<CGalleryImages
|
|
v-if="myrec.photos.length > 0"
|
|
:imgGallery="myrec.photos"
|
|
:directory="'upload/' + tools.getDirectoryGall(myrec, table, '')"
|
|
>
|
|
</CGalleryImages>
|
|
|
|
<q-card-actions align="right">
|
|
<div class="">
|
|
<q-btn
|
|
flat
|
|
round
|
|
color="red"
|
|
:icon="userStore.isFavorite(myrec._id, table) ? 'favorite' : 'far fa-heart'"
|
|
@click="clicca(costanti.TIPOFAVBOOK.FAVORITE, true, '')"
|
|
>
|
|
<q-badge
|
|
v-if="myrec.myfav"
|
|
color="primary"
|
|
:label="myrec.myfav.length"
|
|
floating
|
|
transparent
|
|
/>
|
|
</q-btn>
|
|
</div>
|
|
<div class="">
|
|
<q-btn
|
|
flat
|
|
round
|
|
color="teal"
|
|
:icon="userStore.isBookmarked(myrec._id, table) ? 'bookmark' : 'far fa-bookmark'"
|
|
@click="clicca(costanti.TIPOFAVBOOK.BOOKMARK, true, '')"
|
|
>
|
|
<q-badge
|
|
v-if="myrec.mybook"
|
|
color="primary"
|
|
:label="myrec.mybook.length"
|
|
floating
|
|
transparent
|
|
/>
|
|
</q-btn>
|
|
</div>
|
|
<div>
|
|
<q-btn
|
|
flat
|
|
round
|
|
color="primary"
|
|
icon="share"
|
|
@click="tools.copyToClip($q, getlinkpage(), true)"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<q-btn flat round icon="fas fa-ellipsis-h">
|
|
<q-menu>
|
|
<q-list v-if="true" style="min-width: 200px">
|
|
<q-item
|
|
v-if="myrec.profile.username_telegram"
|
|
clickable
|
|
v-close-popup
|
|
>
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="far fa-comment" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
<a :href="tools.getHttpForTelegram(myrec.profile.username_telegram)" target="_blank">{{ $t('dialog.contact') }} - {{tools.getNomeUtenteByRecUser(myrec)}}</a>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item
|
|
v-if="!nopopup"
|
|
clickable
|
|
v-close-popup
|
|
@click="naviga(tools.getPathByTableAndRec(table, myrec))"
|
|
>
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="fas fa-globe" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
{{ $t('event.openpage') }}
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-separator />
|
|
<q-item
|
|
clickable
|
|
v-close-popup
|
|
@click="
|
|
clicca(
|
|
costanti.TIPOFAVBOOK.FAVORITE,
|
|
false,
|
|
$t('cmd.favorite', {num: myrec.myfav ? myrec.myfav.length : 0})
|
|
)
|
|
"
|
|
>
|
|
<q-item-section avatar>
|
|
<q-icon color="red" name="favorite" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
{{ $t('cmd.favorite', {num: myrec.myfav ? myrec.myfav.length : 0}) }}
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item
|
|
clickable
|
|
v-close-popup
|
|
@click="
|
|
clicca(
|
|
costanti.TIPOFAVBOOK.BOOKMARK,
|
|
false,
|
|
$t('cmd.bookmark', {num: myrec.mybook ? myrec.mybook.length : 0})
|
|
)
|
|
"
|
|
>
|
|
<q-item-section avatar>
|
|
<q-icon color="teal" name="bookmark" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
{{ $t('cmd.bookmark', {num: myrec.mybook ? myrec.mybook.length : 0}) }}
|
|
</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</q-menu>
|
|
</q-btn>
|
|
</div>
|
|
</q-card-actions>
|
|
<q-separator />
|
|
|
|
<q-list>
|
|
<q-item clickable>
|
|
<q-item-section avatar>
|
|
<div v-if="showBadge()" class="text-center">
|
|
<q-chip
|
|
dense
|
|
:color="fieldsTable.getColByAdType(myrec.adType)"
|
|
text-color="white"
|
|
>{{
|
|
fieldsTable.getValByTabAndId(table, 'adType', myrec.adType)
|
|
}}
|
|
</q-chip>
|
|
</div>
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label v-if="myrec.typeHosp" class="text-bold text-h7">
|
|
<q-chip dense color="green" text-color="white"
|
|
>{{ getTypeHosps() }}
|
|
</q-chip>
|
|
</q-item-label>
|
|
|
|
<q-item-label class="text-bold text-h7">{{
|
|
myrec.descr
|
|
}}</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
|
|
<q-item v-if="myrec.dateTimeStart">
|
|
<q-item-section avatar>
|
|
<q-icon color="green" name="far fa-calendar-alt" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<span>{{tools.getstrDateMonthTimeLong(myrec.dateTimeStart)}}</span>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item v-if="myrec.dateTimeEnd">
|
|
<q-item-section avatar>
|
|
<q-icon color="red" name="far fa-calendar-alt" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<span>{{tools.getstrDateMonthTimeLong(myrec.dateTimeEnd)}}</span>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
|
|
<q-item v-if="getSectorByRec(myrec)">
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="category" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<q-chip
|
|
v-if="getSectorByRec(myrec) && getSectorByRec(myrec)[0].descr"
|
|
class="glossy"
|
|
color="blue"
|
|
text-color="white"
|
|
dense
|
|
>
|
|
<span class="cal__quota-content">{{
|
|
getSectorByRec(myrec)[0].descr
|
|
}}</span>
|
|
</q-chip>
|
|
<q-chip
|
|
v-if="
|
|
getRecGoodSkillByRec(myrec) &&
|
|
getRecGoodSkillByRec(myrec).length > 0 &&
|
|
getRecGoodSkillByRec(myrec)[0].descr
|
|
"
|
|
class="glossy"
|
|
dense
|
|
color="blue"
|
|
text-color="white"
|
|
>
|
|
<span class="cal__quota-content">{{
|
|
getRecGoodSkillByRec(myrec)[0].descr
|
|
}}</span>
|
|
</q-chip>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item v-if="myrec.numMaxPeopleHosp" class="q-mt-sm">
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="fas fa-users" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
<q-item-label class="q-px-xs q-ma-xs">
|
|
<span class="accom_maxosp">{{ myrec.numMaxPeopleHosp }}</span
|
|
>{{ t('hosps.numMaxPeopleHosp') }}
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item v-if="!!myrec.accomodation && myrec.accomodation.length > 0">
|
|
<q-item-section avatar>
|
|
<q-icon color="orange" name="fas fa-bed" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<CAccomodation
|
|
v-if="!!myrec.accomodation"
|
|
:mylist="myrec.accomodation"
|
|
:isInModif="false"
|
|
:edit="false"
|
|
:canModify="false"
|
|
>
|
|
</CAccomodation>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item v-if="!!myrec.preferences && myrec.preferences.length > 0">
|
|
<q-item-section avatar>
|
|
<q-icon color="red" name="fas fa-asterisk" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<CMyChipList
|
|
:rec="myrec"
|
|
:type="costanti.FieldType.multiselect"
|
|
:value="myrec.preferences"
|
|
:options="
|
|
globalStore.getTableJoinByName(
|
|
toolsext.TABPREF,
|
|
false,
|
|
false,
|
|
null
|
|
)
|
|
"
|
|
:optval="fieldsTable.getKeyByTable(toolsext.TABPREF)"
|
|
:optlab="fieldsTable.getLabelByTable(toolsext.TABPREF)"
|
|
:opticon="fieldsTable.getIconByTable(toolsext.TABPREF)"
|
|
></CMyChipList>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-separator />
|
|
<q-item-label v-if="myrec.note"
|
|
><div v-html="myrec.note" class="clBorderService"></div
|
|
></q-item-label>
|
|
|
|
<q-card class="my-card clBorderUser" bordered>
|
|
<CMyUser
|
|
:mycontact="myrec"
|
|
:visu="costanti.FIND_PEOPLE"
|
|
@setCmd="tools.setCmd"
|
|
>
|
|
</CMyUser>
|
|
</q-card>
|
|
<q-item v-if="myrec.mycities[0].comune">
|
|
<q-item-section avatar>
|
|
<q-icon color="amber" name="fas fa-map-marker-alt" />
|
|
</q-item-section>
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<span v-for="(city, index) in myrec.mycities" :key="index">
|
|
<span v-if="city.comune">
|
|
{{ city.comune }} ({{ city.prov }})</span
|
|
><span v-if="myrec.mycities.length > 1"> - </span>
|
|
</span>
|
|
</q-item-label>
|
|
<q-item-label v-if="myrec.profile.qualifica" caption>{{
|
|
myrec.biografia
|
|
}}</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-if="myrec.website">
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="fas fa-globe" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label lines="1">
|
|
<span
|
|
v-html="
|
|
tools.getlinkhref(myrec.website, 'Visita il Sito Web')
|
|
"
|
|
/></q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-if="myrec.link_maplocation">
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="fas fa-map-marker-alt" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label lines="1">
|
|
<span
|
|
v-html="
|
|
tools.getlinkhref(myrec.link_maplocation, 'Apri Mappa')
|
|
"
|
|
/></q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item v-if="myrec.idContribType && myrec.idContribType.length > 0">
|
|
<q-item-section avatar>
|
|
<q-icon color="green" name="fas fa-hand-holding" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<span
|
|
v-for="(reccontr, index) in myrec.idContribType"
|
|
:key="index"
|
|
>
|
|
<q-chip
|
|
dense
|
|
:color="calendarStore.getColByContribType(reccontr)"
|
|
text-color="white"
|
|
>
|
|
{{ calendarStore.getContribtypeById(reccontr) }}
|
|
</q-chip>
|
|
</span>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item>
|
|
<q-item-section avatar>
|
|
<q-icon color="blue" name="far fa-edit" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label
|
|
><span v-if="myrec.date_updated">{{
|
|
tools.getstrDateMonthLong(myrec.date_updated)
|
|
}}</span
|
|
><span v-else>{{
|
|
tools.getstrDateMonthLong(myrec.date_created)
|
|
}}</span></q-item-label
|
|
>
|
|
</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-if="false">
|
|
<q-item-section avatar>
|
|
<q-icon color="red" name="local_gas_station" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label></q-item-label>
|
|
<q-item-label caption>Fill your gas tank.</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
<q-separator />
|
|
<div class="q-mb-xl"></div>
|
|
<q-card-actions
|
|
v-if="$q.screen.gt.sm || nopopup"
|
|
class="text-center justify-center"
|
|
>
|
|
<q-btn
|
|
v-if="myrec.profile.username_telegram"
|
|
:label="$t('dialog.contact')"
|
|
color="primary"
|
|
icon="far fa-comment"
|
|
target="_blank"
|
|
:type="tools.isUserOk() ? 'a' : 'btn'"
|
|
size="md"
|
|
rounded
|
|
:href="
|
|
tools.isUserOk()
|
|
? tools.getHttpForTelegram(myrec.profile.username_telegram)
|
|
: null
|
|
"
|
|
/>
|
|
<q-btn
|
|
v-if="!nopopup"
|
|
rounded
|
|
outline
|
|
:label="$t('dialog.close')"
|
|
color="primary"
|
|
icon="close"
|
|
v-close-popup
|
|
/>
|
|
</q-card-actions>
|
|
</q-card>
|
|
<div
|
|
v-if="!$q.screen.gt.sm && !nopopup"
|
|
class="row absolute-bottom text-shadow custom-caption q-px-md buttons_bottom"
|
|
>
|
|
<q-btn
|
|
v-if="myrec.profile.username_telegram"
|
|
:label="$t('dialog.contact')"
|
|
color="primary"
|
|
icon="far fa-comment"
|
|
target="_blank"
|
|
:type="tools.isUserOk() ? 'a' : 'btn'"
|
|
size="md"
|
|
rounded
|
|
:href="
|
|
tools.isUserOk()
|
|
? tools.getHttpForTelegram(myrec.profile.username_telegram)
|
|
: null
|
|
"
|
|
/>
|
|
<q-btn
|
|
v-if="!nopopup"
|
|
rounded
|
|
outline
|
|
:label="$t('dialog.close')"
|
|
color="primary"
|
|
icon="close"
|
|
v-close-popup
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<q-dialog v-model="usersList.show">
|
|
<q-card class="dialog_card">
|
|
<q-toolbar class="bg-primary text-white">
|
|
<q-toolbar-title>
|
|
{{ usersList.title }}
|
|
</q-toolbar-title>
|
|
<q-btn flat round color="white" icon="close" v-close-popup></q-btn>
|
|
</q-toolbar>
|
|
|
|
<q-card-section class="inset-shadow">
|
|
<div v-for="(rec, i) in usersList.list" :key="i">
|
|
<CMyUser
|
|
:mycontact="rec"
|
|
:visu="costanti.FIND_PEOPLE"
|
|
@setCmd="tools.setCmd"
|
|
>
|
|
</CMyUser>
|
|
</div>
|
|
</q-card-section>
|
|
</q-card>
|
|
</q-dialog>
|
|
</template>
|
|
|
|
<script lang="ts" src="./CMyCardService.ts">
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './CMyCardService.scss';
|
|
</style>
|
|
|