nostrmarket/static/components/customer-market/customer-market.html
2023-07-18 16:40:43 +02:00

41 lines
No EOL
1.6 KiB
HTML

<div>
<div v-if="searchNostr" class="row q-col-gutter-md">
<div class="col-12 q-gutter-y-md">
<q-card>
<q-card-section>
<div class="row items-center no-wrap q-mb-md">
<div class="col">
<h5 class="text-subtitle1 q-my-none">Search Globally</h5>
<p>Search for products on Nostr</p>
</div>
</div>
</q-card-section>
<q-card-section>
<q-input class="q-ml-md" standout square dense outlined clearable v-model.trim="search"
label="Search products" @keydown.enter="searchProducts" hint="Enter search terms separated by spaces">
<template v-slot:after>
<q-btn dense flat icon="search" label="Search" @click="searchProducts" />
</template>
</q-input>
</q-card-section>
</q-card>
</div>
</div>
<q-banner v-if="styles?.ui?.banner" class="row q-pa-none q-mb-md">
<q-img :src="styles.ui.banner" style="width: 100%; height: 250px" cover></q-img>
</q-banner>
<q-infinite-scroll v-if="showProducts" @load="onLoad" :offset="250">
<div class="row q-col-gutter-md">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3" v-for="(item, idx) in partialProducts" :key="idx">
<product-card :product="item" @change-page="changePageM"></product-card>
</div>
</div>
<template v-if="lastProductIndex < filteredProducts.length" v-slot:loading>
<div class="row justify-center q-my-md">
<q-spinner-dots color="primary" size="40px" />
</div>
</template>
</q-infinite-scroll>
</div>
</div>