Compact business cards and fix production image URLs
This commit is contained in:
+3
-1
@@ -1,3 +1,5 @@
|
|||||||
# Dev: /api (Vite proxy) | Production build: .env.production
|
# Dev: /api (Vite proxy) | Production: see .env.production
|
||||||
# Full local API: http://localhost:3000
|
# Full local API: http://localhost:3000
|
||||||
VITE_API_URL=/api
|
VITE_API_URL=/api
|
||||||
|
# Production: https://api.montime.ir (uploads served from API)
|
||||||
|
# VITE_ASSETS_URL=https://api.montime.ir
|
||||||
|
|||||||
@@ -1,2 +1,3 @@
|
|||||||
VITE_API_URL=https://api.montime.ir
|
VITE_API_URL=https://api.montime.ir
|
||||||
|
VITE_ASSETS_URL=https://api.montime.ir
|
||||||
VITE_APP_MODE=web
|
VITE_APP_MODE=web
|
||||||
|
|||||||
@@ -1,9 +1,29 @@
|
|||||||
<template>
|
<template>
|
||||||
<RouterLink
|
<RouterLink
|
||||||
:to="{ name: 'app-business-detail', params: { id: business.id } }"
|
:to="{ name: 'app-business-detail', params: { id: business.id } }"
|
||||||
class="block overflow-hidden rounded-2xl border border-border bg-surface-2 transition hover:border-brand-500/40 hover:shadow-md"
|
class="flex items-center gap-3 rounded-xl border border-border bg-surface-2 p-2.5 transition hover:border-brand-500/40 hover:shadow-sm"
|
||||||
>
|
>
|
||||||
<div class="relative aspect-[16/10] bg-surface-3">
|
<div class="min-w-0 flex-1">
|
||||||
|
<div class="flex items-start justify-between gap-2">
|
||||||
|
<h2 class="truncate text-sm font-semibold text-text">{{ business.title }}</h2>
|
||||||
|
<span
|
||||||
|
v-if="business.category"
|
||||||
|
class="shrink-0 rounded-lg bg-brand-500/10 px-1.5 py-0.5 text-[10px] text-brand-700 dark:text-brand-500"
|
||||||
|
>
|
||||||
|
{{ business.category.title }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<p v-if="business.description" class="mt-0.5 truncate text-xs text-muted">
|
||||||
|
{{ business.description }}
|
||||||
|
</p>
|
||||||
|
<p v-if="business.address" class="mt-0.5 truncate text-xs text-muted">
|
||||||
|
📍 {{ business.address }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="relative h-14 w-14 shrink-0 overflow-hidden rounded-lg bg-surface-3 sm:h-16 sm:w-16"
|
||||||
|
>
|
||||||
<img
|
<img
|
||||||
v-if="cover"
|
v-if="cover"
|
||||||
:src="cover"
|
:src="cover"
|
||||||
@@ -11,24 +31,12 @@
|
|||||||
class="h-full w-full object-cover"
|
class="h-full w-full object-cover"
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
/>
|
/>
|
||||||
<div v-else class="flex h-full items-center justify-center text-3xl text-muted/40">🏪</div>
|
<div
|
||||||
</div>
|
v-else
|
||||||
<div class="p-4">
|
class="flex h-full w-full items-center justify-center text-xl text-muted/50"
|
||||||
<div class="flex items-start justify-between gap-2">
|
|
||||||
<h2 class="font-semibold text-text">{{ business.title }}</h2>
|
|
||||||
<span
|
|
||||||
v-if="business.category"
|
|
||||||
class="shrink-0 rounded-lg bg-brand-500/10 px-2 py-0.5 text-xs text-brand-700 dark:text-brand-500"
|
|
||||||
>
|
>
|
||||||
{{ business.category.title }}
|
🏪
|
||||||
</span>
|
</div>
|
||||||
</div>
|
|
||||||
<p v-if="business.description" class="mt-2 line-clamp-2 text-sm text-muted">
|
|
||||||
{{ business.description }}
|
|
||||||
</p>
|
|
||||||
<p v-if="business.address" class="mt-2 text-xs text-muted">
|
|
||||||
📍 {{ business.address }}
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
+7
-2
@@ -1,9 +1,14 @@
|
|||||||
|
/** Base URL for uploaded files (empty = same origin /uploads via Vite proxy). */
|
||||||
const assetsBase = (import.meta.env.VITE_ASSETS_URL ?? '').replace(/\/$/, '');
|
const assetsBase = (import.meta.env.VITE_ASSETS_URL ?? '').replace(/\/$/, '');
|
||||||
|
|
||||||
export function uploadUrl(path: string | null | undefined): string {
|
export function uploadUrl(path: string | null | undefined): string {
|
||||||
if (!path) return '';
|
if (!path) return '';
|
||||||
if (path.startsWith('http')) return path;
|
if (path.startsWith('http://') || path.startsWith('https://')) return path;
|
||||||
const rel = path.startsWith('/uploads/') ? path : `/uploads/${path}`;
|
const rel = path.startsWith('/uploads/')
|
||||||
|
? path
|
||||||
|
: path.startsWith('/')
|
||||||
|
? path
|
||||||
|
: `/uploads/${path}`;
|
||||||
return assetsBase ? `${assetsBase}${rel}` : rel;
|
return assetsBase ? `${assetsBase}${rel}` : rel;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -42,7 +42,7 @@
|
|||||||
>
|
>
|
||||||
کسبوکاری یافت نشد.
|
کسبوکاری یافت نشد.
|
||||||
</div>
|
</div>
|
||||||
<ul v-else class="space-y-3">
|
<ul v-else class="space-y-2">
|
||||||
<li v-for="b in filteredBusinesses" :key="b.id">
|
<li v-for="b in filteredBusinesses" :key="b.id">
|
||||||
<BusinessCard :business="b" />
|
<BusinessCard :business="b" />
|
||||||
</li>
|
</li>
|
||||||
|
|||||||
Reference in New Issue
Block a user