verdnatura/floranet
verdnatura
/
floranet
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'develop' into master

This commit is contained in:
Pablo Natek 2023-12-28 06:18:01 +00:00
parent 8f3c56f28b 2c360c0e4a
commit aeb549e670
1 changed files with 44 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
src/components/swiper/Swiper.vue
View File

@ -1,48 +1,3 @@
<template>
<q-btn
title="previous button"
class="swiper-btn prev"
color="primary"
size="sm"
@click="handlePrev"
round
flat
>
<IconArrowCircleFilledLeft />
</q-btn>
<swiper-container
class="swiper"
:space-between="screenWidth > 1024 ? 56 : 25"
:slides-per-view="'auto'"
:centered-slides="true"
:grabCursor="true"
:navigation="true"
:loop="true"
:pagination="{
dynamicBullets: true,
clickable: true,
}"
:keyboard="{
enabled: true,
}"
>
<slot></slot>
</swiper-container>
<q-btn
title="next button"
class="swiper-btn next"
color="primary"
size="sm"
@click="handleNext"
round
flat
>
<IconArrowCircleFilledRight />
</q-btn>
</template>
<script>
import { storeToRefs } from 'pinia';
import { defineComponent, onMounted, ref } from 'vue';
@ -66,8 +21,7 @@ export default defineComponent({
onMounted(() => {
// console.log('Montado!');
swiperContainer.value =
/*swiperContainer.value =
document.querySelector('swiper-container').shadowRoot;
prevSwiperBtn.value = swiperContainer.value.querySelector(
'.swiper-button-prev'
@ -79,21 +33,9 @@ export default defineComponent({
nextSwiperBtn.value.style.display = swiperDisplay;
prevSwiperBtn.value.style.display = swiperDisplay;
nextBtn.value = document.querySelector('.swiper-btn.next');
prevBtn.value = document.querySelector('.swiper-btn.prev');
prevBtn.value = document.querySelector('.swiper-btn.prev');*/
});
/* onUpdated(() => {
console.log('Atualizado!');
console.groupCollapsed('%c Custom', 'color: tomato;');
console.log({ prevBtn: prevBtn.value, nextBtn: nextBtn.value });
console.groupEnd();
console.groupCollapsed('%c Swiper', 'color: hotpink;');
console.log(prevSwiperBtn.value);
console.groupEnd();
}); */
return {
screenWidth,
handlePrev() {
@ -108,7 +50,49 @@ export default defineComponent({
},
});
</script>
<template>
<q-btn
title="previous button"
class="swiper-btn prev"
color="primary"
size="sm"
@click="handlePrev"
round
flat
>
<IconArrowCircleFilledLeft />
</q-btn>
<!--<swiper-container
class="swiper"
:space-between="screenWidth > 1024 ? 56 : 25"
:slides-per-view="'auto'"
:centered-slides="true"
:grabCursor="true"
:navigation="true"
:loop="true"
:pagination="{
dynamicBullets: true,
clickable: true,
}"
:keyboard="{
enabled: true,
}"
>
<slot></slot>
</swiper-container>-->
<q-btn
title="next button"
class="swiper-btn next"
color="primary"
size="sm"
@click="handleNext"
round
flat
>
<IconArrowCircleFilledRight />
</q-btn>
</template>
<style lang="scss">
.swiper {
height: 100%;