surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sorting fixed

Browse Source 
- added tables Skills, Sectors,
This commit is contained in:
Paolo Arena
2021-10-05 00:19:17 +02:00
parent 1a9a81a1ba
commit 9121569809
22 changed files with 1323 additions and 1064 deletions
Download Patch File Download Diff File Expand all files Collapse all files

495
src/root/home/home.vue
View File

@@ -1,425 +1,80 @@
<template>
<q-page class="text-white">
<div class="landing">
<section>
<div class="landing__hero">
<q-carousel
animated
:autoplay="animare"
swipeable
infinite
navigation
transition-next="slide-left"
transition-prev="slide-right"
v-model="slide"
height="100%"
width="100%"
<q-page class="">
<h1>Inizio:</h1>
<template>
<div style="height: 75vh; width: 50vw;">
<l-map
v-model="zoom"
v-model:zoom="zoom"
:center="[47.41322, -1.219482]"
@move="log('move')"
>
<l-tile-layer
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
></l-tile-layer>
<l-control-layers />
<l-marker :lat-lng="[0, 0]" draggable @moveend="log('moveend')">
<l-tooltip>
lol
</l-tooltip>
</l-marker>
<l-marker :lat-lng="[47.41322, -1.219482]">
<l-icon :icon-url="iconUrl" :icon-size="iconSize" />
</l-marker>
<l-marker :lat-lng="[50, 50]" draggable @moveend="log('moveend')">
<l-popup>
lol
</l-popup>
</l-marker>
<l-polyline
:lat-lngs="[
[47.334852, -1.509485],
[47.342596, -1.328731],
[47.241487, -1.190568],
[47.234787, -1.358337],
]"
color="green"
></l-polyline>
<l-polygon
:lat-lngs="[
[46.334852, -1.509485],
[46.342596, -1.328731],
[46.241487, -1.190568],
[46.234787, -1.358337],
]"
color="#41b782"
:fill="true"
:fillOpacity="0.5"
fillColor="#41b782"
/>
<l-rectangle
:lat-lngs="[
[46.334852, -1.509485],
[46.342596, -1.328731],
[46.241487, -1.190568],
[46.234787, -1.358337],
]"
:fill="true"
color="#35495d"
/>
<l-rectangle
:bounds="[
[46.334852, -1.190568],
[46.241487, -1.090357],
]"
>
<q-carousel-slide name="first" img-src="images/cover.jpg">
<div class="landing__header"></div>
<div class="landing__hero-content row justify-center q-gutter-xs clgutter">
<div class="row">
<logo></logo>
</div>
<div class="flex justify-end">
<div class="q-gutter-xs testo-banda clgutter">
<div class="text-h1 shadow-max">{{ t('msg.myAppName') }}</div>
<div class="text-subtitle1 shadow text-italic q-pl-sm">
{{ t('msg.sottoTitoloApp') }}
</div>
<div class="text-subtitle1 shadow-max big text-italic q-pl-sm"><strong>{{
t('msg.sottoTitoloApp2')
}}</strong>
</div>
<div class="text-subtitle2 shadow text-italic q-pl-sm">
{{ t('msg.sottoTitoloApp3') }}
</div>
<div class="text-subtitle3 shadow text-italic q-pl-sm ">
{{ t('msg.sottoTitoloApp4') }}
</div>
<div v-if="isInCostruction" style="margin: 5px;">
<q-banner
rounded
class="bg-primary text-white"
style="text-align: center;">
<span class="mybanner">{{ t('msg.underconstruction') }}</span>
</q-banner>
<br>
</div>
<div v-else>
<div v-if="!isLogged()" style="margin: 5px; padding: 5px;" class="home">
<q-btn
rounded size="lg" color="primary" @click="PagLogin"
class="btn-start">
{{ $t('login.enter') }}
</q-btn>
<q-btn
rounded size="lg" color="positive" @click="PagReg"
class="btn-start">
{{ $t('reg.submit') }}
</q-btn>
</div>
</div>
<div v-if="isLogged()">
<div>
<!--<q-field-->
<!--v-if="getPermission() === 'granted'"-->
<!--icon="notifications"-->
<!--class="shadow"-->
<!--:label="t('notification.titlegranted')"-->
<!--:helper="t('notification.statusnot')">-->
<!--</q-field>-->
<q-field
v-if="NotServiceWorker()"
class="shadow"
icon="notifications"
label="Service Worker not present"
>
</q-field>
</div>
<div>
<q-btn
v-if="getPermission() !== 'granted'"
class="enable-notifications shadow"
color="primary" rounded
size="md"
icon="notifications" @click="tools.askfornotification($q)"
:label="t('notification.ask')"/>
<!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="primary" rounded size="lg" icon="notifications" @click="showNotificationExample" label="Send Notification"/>-->
<!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="secondary" rounded size="lg" icon="notifications" @click="createPushSubscription" label="Create Push Subscription !"/>-->
</div>
</div>
</div>
</div>
</div>
<div class="landing__arrow absolute-bottom text-center">
<i aria-hidden="true" class="q-icon text-h2 text-white material-icons">expand_more</i>
</div>
</q-carousel-slide>
<q-carousel-slide name="second" img-src="images/hand_people.jpg">
<div class="landing__header"></div>
<div class="landing__hero-content row justify-center q-gutter-xs clgutter">
<div class="row">
<logo></logo>
</div>
<div class="flex justify-end">
<div class="q-gutter-xs testo-banda clgutter">
<div class="text-h1 shadow-max">{{ t('msg.myAppName') }}</div>
<div class="text-subtitle1 shadow text-italic q-pl-sm">
{{ t('msg.sottoTitoloApp') }}
</div>
<div class="text-subtitle1 shadow-max big text-italic q-pl-sm"><strong>{{
t('msg.sottoTitoloApp2')
}}</strong>
</div>
<div class="text-subtitle2 shadow text-italic q-pl-sm">
{{ t('msg.sottoTitoloApp3') }}
</div>
<div class="text-subtitle3 shadow text-italic q-pl-sm ">
{{ t('msg.sottoTitoloApp4') }}
</div>
<div v-if="isInCostruction" style="margin: 5px;">
<q-banner
rounded
class="bg-primary text-white"
style="text-align: center;">
<span class="mybanner">{{ t('msg.underconstruction') }}</span>
</q-banner>
<br>
</div>
<div v-else>
<div v-if="!isLogged()" style="margin: 5px; padding: 5px;" class="home">
<q-btn
rounded size="lg" color="primary" @click="PagLogin"
class="btn-start">
{{ $t('login.enter') }}
</q-btn>
<q-btn
rounded size="lg" color="positive" @click="PagReg"
class="btn-start">
{{ $t('reg.submit') }}
</q-btn>
</div>
</div>
<div v-if="isLogged()">
<div>
<!--<q-field-->
<!--v-if="getPermission() === 'granted'"-->
<!--icon="notifications"-->
<!--class="shadow"-->
<!--:label="t('notification.titlegranted')"-->
<!--:helper="t('notification.statusnot')">-->
<!--</q-field>-->
<q-field
v-if="NotServiceWorker()"
class="shadow"
icon="notifications"
label="Service Worker not present"
>
</q-field>
</div>
<div>
<q-btn
v-if="getPermission() !== 'granted'"
class="enable-notifications shadow"
color="primary" rounded
size="md"
icon="notifications" @click="tools.askfornotification($q)"
:label="t('notification.ask')"/>
<!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="primary" rounded size="lg" icon="notifications" @click="showNotificationExample" label="Send Notification"/>-->
<!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="secondary" rounded size="lg" icon="notifications" @click="createPushSubscription" label="Create Push Subscription !"/>-->
</div>
</div>
</div>
</div>
</div>
<div class="landing__arrow absolute-bottom text-center">
<i aria-hidden="true" class="q-icon text-h2 text-white material-icons">expand_more</i>
</div>
<!--<div class="absolute-bottom custom-caption">-->
<!--<div class="text-h2">Second stop</div>-->
<!--<div class="text-subtitle1">Famous City</div>-->
<!--</div>-->
</q-carousel-slide>
<q-carousel-slide name="third" img-src="images/cibo_sano.jpg" class="carousel_img_3">
<div class="landing__header"></div>
<div class="landing__hero-content row justify-center q-gutter-xs clgutter">
<div class="row">
<logo></logo>
</div>
<div class="flex justify-end">
<div class="q-gutter-xs testo-banda clgutter">
<div class="text-h1 shadow-max">{{ t('msg.myAppName') }}</div>
<div class="text-subtitle1 shadow text-italic q-pl-sm">
{{ t('msg.sottoTitoloApp') }}
</div>
<div class="text-subtitle1 shadow-max big text-italic q-pl-sm"><strong>{{
t('msg.sottoTitoloApp2')
}}</strong>
</div>
<div class="text-subtitle2 shadow text-italic q-pl-sm">
{{ t('msg.sottoTitoloApp3') }}
</div>
<div class="text-subtitle3 shadow text-italic q-pl-sm ">
{{ t('msg.sottoTitoloApp4') }}
</div>
<div v-if="isInCostruction" style="margin: 5px;">
<q-banner
rounded
class="bg-primary text-white"
style="text-align: center;">
<span class="mybanner">{{ t('msg.underconstruction') }}</span>
</q-banner>
<br>
</div>
<div v-else>
<div v-if="!isLogged()" style="margin: 5px; padding: 5px;" class="home">
<q-btn
rounded size="lg" color="primary" @click="PagLogin"
class="btn-start">
{{ $t('login.enter') }}
</q-btn>
<q-btn
rounded size="lg" color="positive" @click="PagReg"
class="btn-start">
{{ t('reg.submit') }}
</q-btn>
</div>
</div>
<div v-if="isLogged()">
<div>
<!--<q-field-->
<!--v-if="getPermission() === 'granted'"-->
<!--icon="notifications"-->
<!--class="shadow"-->
<!--:label="t('notification.titlegranted')"-->
<!--:helper="t('notification.statusnot')">-->
<!--</q-field>-->
<q-field
v-if="NotServiceWorker()"
class="shadow"
icon="notifications"
label="Service Worker not present"
>
</q-field>
</div>
<div>
<q-btn
v-if="getPermission() !== 'granted'"
class="enable-notifications shadow"
color="primary" rounded
size="md"
icon="notifications" @click="tools.askfornotification($q)"
:label="t('notification.ask')"/>
<!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="primary" rounded size="lg" icon="notifications" @click="showNotificationExample" label="Send Notification"/>-->
<!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="secondary" rounded size="lg" icon="notifications" @click="createPushSubscription" label="Create Push Subscription !"/>-->
</div>
</div>
</div>
</div>
</div>
<div class="landing__arrow absolute-bottom text-center">
<i aria-hidden="true" class="q-icon text-h2 text-white material-icons">expand_more</i>
</div>
<!--<div class="absolute-bottom custom-caption">-->
<!--<div class="text-h2">Third stop</div>-->
<!--<div class="text-subtitle1">Famous Bridge</div>-->
<!--</div>-->
</q-carousel-slide>
</q-carousel>
</div>
</section>
<section class="padding bg-white text-grey-10 text-center">
<div class="landing__features row items-start q-col-gutter-sm">
<div class="col-12 text-center">
<div class="feature-item q-mx-md">
<img
src="images/group-together.jpg"
alt="together"
class="doc-img">
</div>
</div>
<div class="col-12 text-center"><h4>{{ t('homepage.descrapp_title1') }}</h4>
<p v-html="t('homepage.descrapp_pag1')"></p>
<p v-html="t('homepage.descrapp_pag2')"></p>
</div>
</div>
</section>
<section class="padding bg-primary landing__swirl-bg">
<div class="landing__features row justify-between items-start q-col-gutter-sm">
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-users"> </i><h4>
{{ t('homepage.freesocial.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.freesocial.descr')"></p></div>
</div>
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-user-clock"> </i><h4>
{{ t('homepage.freetalent.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.freetalent.descr')"></p></div>
</div>
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-apple-alt"> </i><h4>
{{ t('homepage.freegas.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.freegas.descr')"></p></div>
</div>
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-home"> </i><h4>
{{ t('homepage.freeliving.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.freeliving.descr')"></p></div>
</div>
</div>
</section>
<section class="padding bg-indigo-8">
<div class="landing__features row justify-between items-start q-col-gutter-sm">
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-people-carry"> </i><h4>
{{ t('homepage.freecollabora.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.freecollabora.descr')"></p></div>
</div>
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-hands-helping"> </i><h4>
{{ t('homepage.freesostieni.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.freesostieni.descr')"></p></div>
</div>
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-browser"> </i>
<div class="q-gutter-sm"><i
aria-hidden="true"
class="q-icon fas fa-browser"> </i><i
aria-hidden="true" class="q-icon fab fa-chrome"> </i><i
aria-hidden="true" class="q-icon fab fa-firefox"> </i><i
aria-hidden="true" class="q-icon fab fa-safari"> </i><i
aria-hidden="true" class="q-icon fab fa-edge"> </i></div>
<h4>{{ t('homepage.multiplatform.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.multiplatform.descr')"></p></div>
</div>
<div class="col-12 col-sm-5">
<div class="feature-item"><i
aria-hidden="true"
class="q-icon fas fa-universal-access"> </i><h4>
{{ t('homepage.free.title') }}</h4>
<p class="feat-descr" v-html="t('homepage.free.descr')"></p></div>
</div>
</div>
</section>
<section class="landing__footer">
<div class="text-center">
<div class="landing__footer-icons row flex-center">
<a :href="FBPage()" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-facebook-f icon_contact"> </i></a>
<a :href="TelegramSupport()" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-telegram icon_contact"></i></a>
<!--<a href="" target="_blank"><i aria-hidden="true" class="q-icon fab fa-github"> </i></a>-->
<!--<a href="https://twitter.com/" target="_blank"><i aria-hidden="true" class="q-icon fab fa-twitter"> </i></a>-->
<!--<a href="https://discord.gg/5TDhbDg" target="_blank"><i aria-hidden="true"-->
<!--class="q-icon fab fa-discord"> </i></a><a-->
<!--href="https://forum.quasar-framework.org/" target="_blank"><i aria-hidden="true"-->
<!--class="q-icon fas fa-comments"> </i></a><a-->
<!--href="https://www.patreon.com/quasarframework" target="_blank"><i aria-hidden="true"-->
<!--class="q-icon fab fa-patreon"> </i></a>-->
</div>
<div class="q-mt-xs text-weight-thin" style="text-shadow: 4px 4px 8px #555;">
{{ t('msg.myAppName') }} - {{ t('homepage.contacts') }}
<!--Released under the-->
<!--<a href="https://github.com/quasarframework/quasar/blob/dev/LICENSE" target="_blank"-->
<!--rel="noopener noreferrer" class="doc-link">-->
<!--MIT LICENSE-->
<!--<i aria-hidden="true"-->
<!--class="q-icon material-icons">launch</i></a>-->
<!--| <a href="https://www.iubenda.com/privacy-policy/40685560" target="_blank"-->
<!--rel="noopener noreferrer" class="doc-link">Privacy Policy<i aria-hidden="true"-->
<!--class="q-icon material-icons">launch</i></a>-->
</div>
</div>
</section>
<q-page-scroller position="bottom-right" :scroll-offset="850" :offset="[18, 18]" style="opacity: 0.3">
<q-btn fab icon="keyboard_arrow_up" color="accent"/>
</q-page-scroller>
<Footer></Footer>
</div>
<l-popup>
lol
</l-popup>
</l-rectangle>
</l-map>
<button @click="changeIcon">New kitten icon</button>
</div>
</template>
</q-page>
</template>