Merge branch 'main' of ssh://gitea.onecluster.org:6666/OneTeam/don_confiao_frontend
This commit is contained in:
@@ -49,20 +49,6 @@
|
||||
</div>
|
||||
</v-sheet>
|
||||
|
||||
<!-- Controles de paginación superiores -->
|
||||
<PaginationControls
|
||||
v-if="filteredItems.length > 0"
|
||||
:current-page="currentPage"
|
||||
:total-pages="totalPages"
|
||||
:items-per-page="itemsPerPage"
|
||||
:items-per-page-options="itemsPerPageOptions"
|
||||
:pagination-info="paginationInfo"
|
||||
:total-visible-pages="totalVisiblePages"
|
||||
@page-change="handlePageChange"
|
||||
@items-per-page-change="handleItemsPerPageChange"
|
||||
position="top"
|
||||
/>
|
||||
|
||||
<!-- Grid de productos paginados -->
|
||||
<v-row class="product-grid" v-if="paginatedItems.length > 0">
|
||||
<v-col
|
||||
@@ -82,6 +68,7 @@
|
||||
:updateQuantity="updateQuantity"
|
||||
:disabled="!isAuthenticated"
|
||||
@add-to-cart="addToCart"
|
||||
@request-login="showLogin"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -136,11 +123,54 @@
|
||||
@update-quantity="updateCartQuantity"
|
||||
@toggle-collapse="toggleCart"
|
||||
/>
|
||||
<v-card v-else class="login-prompt-card pa-4 text-center">
|
||||
<v-card v-else-if="!isMobile || showLoginPrompt" class="login-prompt-card pa-4 text-center">
|
||||
<v-btn
|
||||
icon
|
||||
size="x-small"
|
||||
variant="text"
|
||||
class="login-prompt-close"
|
||||
@click="showLoginPrompt = false"
|
||||
>
|
||||
<v-icon size="18">mdi-close</v-icon>
|
||||
</v-btn>
|
||||
<v-icon size="48" color="primary" class="mb-2">mdi-cart-lock</v-icon>
|
||||
<p class="text-body-2 text-medium-emphasis mb-3">
|
||||
Inicia sesión para agregar productos al carrito y finalizar tu compra
|
||||
Para hacer pedidos debes de tener usuario y clave, si no lo tienes comunicate con nosotros al
|
||||
<strong class="text-primary">{{ contactPhone }}</strong>
|
||||
para solicitarlo. Esto es necesario porque no podemos procesar tus pedidos todos los días del mes.
|
||||
Comunicate con nosotros para contarte todos los detalles y que puedas apoyar este proceso.
|
||||
</p>
|
||||
<div class="d-flex justify-center ga-2 mb-3">
|
||||
<v-btn
|
||||
icon
|
||||
size="small"
|
||||
color="primary"
|
||||
variant="tonal"
|
||||
:href="'tel:' + contactPhone"
|
||||
>
|
||||
<v-icon size="18">mdi-phone</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
icon
|
||||
size="small"
|
||||
color="success"
|
||||
variant="tonal"
|
||||
:href="'https://wa.me/' + contactPhone"
|
||||
target="_blank"
|
||||
>
|
||||
<v-icon size="18">mdi-whatsapp</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
icon
|
||||
size="small"
|
||||
color="info"
|
||||
variant="tonal"
|
||||
:href="'https://t.me/+57' + contactPhone"
|
||||
target="_blank"
|
||||
>
|
||||
<v-icon size="18">mdi-send</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="tonal"
|
||||
@@ -157,7 +187,7 @@
|
||||
<!-- Modal 1: Confirmación de productos -->
|
||||
<v-dialog v-model="checkoutDialog" max-width="600" persistent>
|
||||
<v-card>
|
||||
<v-card-title class="headline">Confirmar Compra</v-card-title>
|
||||
<v-card-title class="headline">Confirmar Pedido</v-card-title>
|
||||
<v-card-text>
|
||||
<v-list v-if="cartItems.length > 0" class="product-list-scroll">
|
||||
<v-list-item v-for="item in cartItems" :key="item.id">
|
||||
@@ -192,7 +222,7 @@
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<!-- Modal 2: Datos personales -->
|
||||
<!-- Modal 2: Datos personales + aviso de coordinación -->
|
||||
<v-dialog v-model="personalDataDialog" max-width="500" persistent>
|
||||
<v-card>
|
||||
<v-card-title class="headline">Datos de Contacto</v-card-title>
|
||||
@@ -229,6 +259,48 @@
|
||||
variant="outlined"
|
||||
></v-select>
|
||||
</v-form>
|
||||
|
||||
<v-divider class="my-3"></v-divider>
|
||||
|
||||
<v-alert type="info" variant="tonal" class="mb-0">
|
||||
<div class="text-body-2 mb-2">
|
||||
Para coordinar la entrega de tu pedido escríbenos:
|
||||
</div>
|
||||
<div class="d-flex ga-2">
|
||||
<v-btn
|
||||
icon
|
||||
size="x-small"
|
||||
color="primary"
|
||||
variant="tonal"
|
||||
:href="'tel:' + contactPhone"
|
||||
>
|
||||
<v-icon size="16">mdi-phone</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
icon
|
||||
size="x-small"
|
||||
color="success"
|
||||
variant="tonal"
|
||||
:href="'https://wa.me/57' + contactPhone"
|
||||
target="_blank"
|
||||
>
|
||||
<v-icon size="16">mdi-whatsapp</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
icon
|
||||
size="x-small"
|
||||
color="info"
|
||||
variant="tonal"
|
||||
:href="'https://t.me/+57' + contactPhone"
|
||||
target="_blank"
|
||||
>
|
||||
<v-icon size="16">mdi-send</v-icon>
|
||||
</v-btn>
|
||||
<span class="text-body-2 font-weight-bold ml-1 d-flex align-center">
|
||||
{{ contactPhone }}
|
||||
</span>
|
||||
</div>
|
||||
</v-alert>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
@@ -240,7 +312,7 @@
|
||||
:loading="isSubmitting"
|
||||
:disabled="isSubmitting"
|
||||
>
|
||||
Finalizar Compra
|
||||
Finalizar Pedido
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
@@ -274,7 +346,8 @@ export default {
|
||||
setup() {
|
||||
const cartStore = useCartStore();
|
||||
const authStore = useAuthStore();
|
||||
const cartCollapsed = ref(false); // Cambiado a false para que inicie expandido en desktop
|
||||
const cartCollapsed = ref(false);
|
||||
const showLoginPrompt = ref(false);
|
||||
const windowWidth = ref(window.innerWidth);
|
||||
|
||||
const isMobile = computed(() => windowWidth.value < 960); // Cambiado de 680 a 960
|
||||
@@ -295,6 +368,7 @@ export default {
|
||||
cartStore,
|
||||
authStore,
|
||||
cartCollapsed,
|
||||
showLoginPrompt,
|
||||
isMobile,
|
||||
windowWidth,
|
||||
};
|
||||
@@ -339,6 +413,9 @@ export default {
|
||||
isAuthenticated() {
|
||||
return this.authStore.isAuthenticated;
|
||||
},
|
||||
contactPhone() {
|
||||
return import.meta.env.VITE_CONTACT_PHONE || '';
|
||||
},
|
||||
// Búsqueda
|
||||
filteredItems() {
|
||||
if (!this.searchQuery) return this.items;
|
||||
@@ -471,7 +548,6 @@ export default {
|
||||
},
|
||||
async onSubmitPurchase() {
|
||||
const form = this.$refs.personalForm;
|
||||
|
||||
if (form) {
|
||||
const { valid } = await form.validate();
|
||||
if (!valid) return;
|
||||
@@ -493,7 +569,6 @@ export default {
|
||||
customer_phone: this.customerPhone,
|
||||
pickup_method: this.pickupMethod,
|
||||
};
|
||||
|
||||
this.api
|
||||
.createCatalogPurchase(payload)
|
||||
.then((data) => {
|
||||
@@ -501,7 +576,7 @@ export default {
|
||||
this.personalDataDialog = false;
|
||||
this.$router.push({
|
||||
path: "/summary_purchase",
|
||||
query: {
|
||||
query: {
|
||||
id: parseInt(data.id),
|
||||
type: 'catalog'
|
||||
},
|
||||
@@ -553,7 +628,14 @@ export default {
|
||||
openLoginDialog() {
|
||||
this.$refs.loginDialogRef.open();
|
||||
},
|
||||
showLogin() {
|
||||
this.showLoginPrompt = true;
|
||||
if (this.isMobile) {
|
||||
this.cartCollapsed = false;
|
||||
}
|
||||
},
|
||||
onLoginSuccess() {
|
||||
this.showLoginPrompt = false;
|
||||
this.api.getCurrentUser().then((user) => {
|
||||
this.authStore.setUser(user);
|
||||
});
|
||||
@@ -769,6 +851,15 @@ export default {
|
||||
.login-prompt-card {
|
||||
border: 2px dashed rgba(0, 0, 0, 0.12);
|
||||
background: #fafafa !important;
|
||||
position: relative;
|
||||
overflow-wrap: break-word;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.login-prompt-close {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
|
||||
Reference in New Issue
Block a user