Add password auth, business browsing, dev proxy, and production env.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/app/AppBusinessDetailView.vue

@@ -0,0 +1,129 @@
+<template>
+  <WebAppLayout>
+    <div v-if="loading" class="py-12 text-center text-sm text-muted">در حال بارگذاری…</div>
+    <p
+      v-else-if="error"
+      class="rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-600 dark:text-red-400"
+    >
+      {{ error }}
+    </p>
+    <section v-else-if="business" class="space-y-6">
+      <button
+        type="button"
+        class="text-sm text-brand-600 dark:text-brand-500"
+        @click="router.back()"
+      >
+        ← بازگشت
+      </button>
+
+      <div>
+        <span
+          v-if="business.category"
+          class="inline-block rounded-lg bg-brand-500/10 px-2 py-0.5 text-xs text-brand-700 dark:text-brand-500"
+        >
+          {{ business.category.title }}
+        </span>
+        <h1 class="mt-2 text-xl font-bold text-text">{{ business.title }}</h1>
+        <p v-if="business.description" class="mt-2 text-sm text-muted">
+          {{ business.description }}
+        </p>
+      </div>
+
+      <dl class="space-y-2 rounded-2xl border border-border bg-surface-2 p-4 text-sm">
+        <div v-if="business.contactPhone">
+          <dt class="text-muted">تلفن</dt>
+          <dd class="font-medium" dir="ltr">{{ business.contactPhone }}</dd>
+        </div>
+        <div v-if="business.address">
+          <dt class="text-muted">آدرس</dt>
+          <dd>{{ business.address }}</dd>
+        </div>
+      </dl>
+
+      <div>
+        <h2 class="mb-3 font-semibold text-text">خدمات</h2>
+        <div v-if="loadingServices" class="text-sm text-muted">در حال بارگذاری…</div>
+        <div
+          v-else-if="!services.length"
+          class="rounded-xl border border-dashed border-border p-4 text-center text-sm text-muted"
+        >
+          خدمتی ثبت نشده است.
+        </div>
+        <ul v-else class="space-y-3">
+          <li
+            v-for="svc in services"
+            :key="svc.id"
+            class="rounded-2xl border border-border bg-surface-2 p-4"
+          >
+            <p class="font-medium text-text">
+              {{ svc.serviceTemplate?.title ?? 'خدمت' }}
+            </p>
+            <p
+              v-if="svc.serviceTemplate?.description"
+              class="mt-1 text-sm text-muted"
+            >
+              {{ svc.serviceTemplate.description }}
+            </p>
+            <div class="mt-2 flex flex-wrap gap-3 text-sm text-muted">
+              <span>{{ formatPriceToman(svc.price) }} تومان</span>
+              <span>·</span>
+              <span>{{
+                formatDuration(
+                  svc.durationMinutes,
+                  svc.serviceTemplate?.defaultDurationMinutes,
+                )
+              }}</span>
+            </div>
+            <AppButton class="mt-3" variant="primary" @click="onBook(svc)">
+              رزرو (به‌زودی)
+            </AppButton>
+          </li>
+        </ul>
+      </div>
+    </section>
+  </WebAppLayout>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { fetchBusinessServices } from '@/api/business-services';
+import { fetchBusiness } from '@/api/businesses';
+import { ApiError } from '@/api/client';
+import type { Business, BusinessService } from '@/api/types';
+import AppButton from '@/components/ui/AppButton.vue';
+import WebAppLayout from '@/layouts/WebAppLayout.vue';
+import { formatDuration, formatPriceToman } from '@/utils/format';
+
+const route = useRoute();
+const router = useRouter();
+
+const business = ref<Business | null>(null);
+const services = ref<BusinessService[]>([]);
+const loading = ref(true);
+const loadingServices = ref(true);
+const error = ref('');
+
+async function load() {
+  const id = String(route.params.id);
+  loading.value = true;
+  loadingServices.value = true;
+  error.value = '';
+  try {
+    business.value = await fetchBusiness(id);
+    services.value = await fetchBusinessServices(id);
+  } catch (e) {
+    error.value =
+      e instanceof ApiError ? e.message : 'بارگذاری اطلاعات ناموفق بود.';
+  } finally {
+    loading.value = false;
+    loadingServices.value = false;
+  }
+}
+
+function onBook(_svc: BusinessService) {
+  // فاز بعدی: فرم رزرو
+}
+
+onMounted(load);
+</script>

src/views/app/AppHomeView.vue

@@ -1,19 +1,131 @@
 <template>
   <WebAppLayout>
-    <section class="space-y-4">
-      <h1 class="text-xl font-bold text-text">کشف خدمات محلی</h1>
-      <p class="text-sm text-muted">
-        به‌زودی: دسته‌بندی‌ها، جستجو و لیست کسب‌وکارها
+    <section class="space-y-5">
+      <div>
+        <h1 class="text-xl font-bold text-text">کشف خدمات</h1>
+        <p class="mt-1 text-sm text-muted">کسب‌وکارهای محلی نزدیک شما</p>
+      </div>
+
+      <div>
+        <label class="sr-only" for="search">جستجو</label>
+        <input
+          id="search"
+          v-model="searchQuery"
+          type="search"
+          placeholder="جستجو در نام یا آدرس…"
+          class="w-full rounded-xl border border-border bg-surface-2 px-4 py-3 text-sm text-text outline-none placeholder:text-muted focus:border-brand-500 focus:ring-2 focus:ring-brand-500/30"
+        />
+      </div>
+
+      <div v-if="loadingCategories" class="text-center text-sm text-muted">
+        در حال بارگذاری دسته‌ها…
+      </div>
+      <CategoryFilter
+        v-else-if="categories.length"
+        :categories="activeCategories"
+        :selected-id="selectedCategoryId"
+        @select="onCategorySelect"
+      />
+
+      <div v-if="loadingBusinesses" class="py-8 text-center text-sm text-muted">
+        در حال بارگذاری…
+      </div>
+      <p
+        v-else-if="error"
+        class="rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-600 dark:text-red-400"
+      >
+        {{ error }}
       </p>
       <div
-        class="rounded-2xl border border-dashed border-border bg-surface-2 p-6 text-center text-sm text-muted"
+        v-else-if="!filteredBusinesses.length"
+        class="rounded-2xl border border-dashed border-border bg-surface-2 p-8 text-center text-sm text-muted"
       >
-        فاز بعدی — صفحهٔ خانه
+        کسب‌وکاری یافت نشد.
       </div>
+      <ul v-else class="space-y-3">
+        <li v-for="b in filteredBusinesses" :key="b.id">
+          <BusinessCard :business="b" />
+        </li>
+      </ul>
     </section>
   </WebAppLayout>
 </template>
 
 <script setup lang="ts">
+import { computed, onMounted, ref, watch } from 'vue';
+import { fetchBusinessCategories } from '@/api/business-categories';
+import { fetchBusinesses } from '@/api/businesses';
+import { ApiError } from '@/api/client';
+import type { Business, BusinessCategory } from '@/api/types';
+import BusinessCard from '@/components/business/BusinessCard.vue';
+import CategoryFilter from '@/components/business/CategoryFilter.vue';
 import WebAppLayout from '@/layouts/WebAppLayout.vue';
+
+const categories = ref<BusinessCategory[]>([]);
+const businesses = ref<Business[]>([]);
+const selectedCategoryId = ref<string | null>(null);
+const searchQuery = ref('');
+const loadingCategories = ref(true);
+const loadingBusinesses = ref(true);
+const error = ref('');
+
+const activeCategories = computed(() =>
+  categories.value.filter((c) => c.isActive),
+);
+
+const filteredBusinesses = computed(() => {
+  const q = searchQuery.value.trim().toLowerCase();
+  if (!q) {
+    return businesses.value;
+  }
+  return businesses.value.filter((b) => {
+    const haystack = [b.title, b.description, b.address]
+      .filter(Boolean)
+      .join(' ')
+      .toLowerCase();
+    return haystack.includes(q);
+  });
+});
+
+async function loadCategories() {
+  loadingCategories.value = true;
+  try {
+    const all = await fetchBusinessCategories();
+    categories.value = all;
+  } catch (e) {
+    error.value =
+      e instanceof ApiError ? e.message : 'بارگذاری دسته‌ها ناموفق بود.';
+  } finally {
+    loadingCategories.value = false;
+  }
+}
+
+async function loadBusinesses() {
+  loadingBusinesses.value = true;
+  error.value = '';
+  try {
+    businesses.value = await fetchBusinesses({
+      categoryId: selectedCategoryId.value ?? undefined,
+      isActive: true,
+    });
+  } catch (e) {
+    error.value =
+      e instanceof ApiError ? e.message : 'بارگذاری کسب‌وکارها ناموفق بود.';
+  } finally {
+    loadingBusinesses.value = false;
+  }
+}
+
+function onCategorySelect(id: string | null) {
+  selectedCategoryId.value = id;
+}
+
+watch(selectedCategoryId, () => {
+  loadBusinesses();
+});
+
+onMounted(async () => {
+  await loadCategories();
+  await loadBusinesses();
+});
 </script>

src/views/app/AppProfileView.vue

@@ -1,29 +1,80 @@
 <template>
   <WebAppLayout>
     <h1 class="mb-4 text-xl font-bold text-text">پروفایل</h1>
-    <dl v-if="auth.user" class="space-y-3 rounded-2xl border border-border bg-surface-2 p-4">
-      <div>
-        <dt class="text-xs text-muted">موبایل</dt>
-        <dd class="font-medium" dir="ltr">{{ auth.user.mobile }}</dd>
-      </div>
-      <div>
-        <dt class="text-xs text-muted">نام</dt>
-        <dd class="font-medium">{{ auth.user.fullName ?? '—' }}</dd>
-      </div>
-      <div>
-        <dt class="text-xs text-muted">نقش</dt>
-        <dd class="font-medium">{{ roleLabel }}</dd>
-      </div>
-    </dl>
+
+    <p
+      v-if="message"
+      class="mb-4 rounded-xl border border-brand-500/40 bg-brand-500/10 px-4 py-3 text-sm text-brand-700 dark:text-brand-500"
+    >
+      {{ message }}
+    </p>
+    <p
+      v-if="error"
+      class="mb-4 rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-600"
+    >
+      {{ error }}
+    </p>
+
+    <div v-if="auth.user" class="space-y-4">
+      <dl class="space-y-3 rounded-2xl border border-border bg-surface-2 p-4">
+        <div>
+          <dt class="text-xs text-muted">موبایل</dt>
+          <dd class="font-medium" dir="ltr">{{ auth.user.mobile }}</dd>
+        </div>
+        <div>
+          <dt class="text-xs text-muted">نقش</dt>
+          <dd class="font-medium">{{ roleLabel }}</dd>
+        </div>
+      </dl>
+
+      <section class="space-y-3 rounded-2xl border border-border bg-surface-2 p-4">
+        <h2 class="text-sm font-semibold text-text">
+          {{ auth.user.hasPassword ? 'تغییر رمز عبور' : 'تنظیم رمز عبور' }}
+        </h2>
+        <p class="text-xs text-muted">
+          پس از تنظیم رمز، ورود با رمز عبور یا کد یکبارمصرف هر دو ممکن است.
+        </p>
+
+        <AppInput
+          v-if="auth.user.hasPassword"
+          id="currentPassword"
+          v-model="currentPassword"
+          label="رمز فعلی"
+          type="password"
+          ltr
+        />
+        <AppInput id="newPassword" v-model="newPassword" label="رمز جدید" type="password" ltr />
+        <AppInput
+          id="confirmPassword"
+          v-model="confirmPassword"
+          label="تکرار رمز جدید"
+          type="password"
+          ltr
+        />
+        <AppButton :loading="saving" @click="onSavePassword">
+          {{ auth.user.hasPassword ? 'به‌روزرسانی رمز' : 'ذخیره رمز' }}
+        </AppButton>
+      </section>
+    </div>
   </WebAppLayout>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
+import { computed, ref } from 'vue';
+import { setPassword } from '@/api/auth';
+import { ApiError } from '@/api/client';
+import AppButton from '@/components/ui/AppButton.vue';
+import AppInput from '@/components/ui/AppInput.vue';
 import WebAppLayout from '@/layouts/WebAppLayout.vue';
 import { useAuthStore } from '@/stores/auth';
 
 const auth = useAuthStore();
+const currentPassword = ref('');
+const newPassword = ref('');
+const confirmPassword = ref('');
+const saving = ref(false);
+const error = ref('');
+const message = ref('');
 
 const roleLabel = computed(() => {
   switch (auth.user?.role) {
@@ -35,4 +86,37 @@ const roleLabel = computed(() => {
       return 'مشتری';
   }
 });
+
+async function onSavePassword() {
+  if (!auth.user) return;
+  error.value = '';
+  message.value = '';
+
+  if (newPassword.value.length < 8) {
+    error.value = 'رمز باید حداقل ۸ کاراکتر باشد.';
+    return;
+  }
+  if (newPassword.value !== confirmPassword.value) {
+    error.value = 'تکرار رمز با رمز جدید یکسان نیست.';
+    return;
+  }
+
+  saving.value = true;
+  try {
+    const updated = await setPassword({
+      password: newPassword.value,
+      confirmPassword: confirmPassword.value,
+      ...(auth.user.hasPassword ? { currentPassword: currentPassword.value } : {}),
+    });
+    auth.setUser(updated);
+    currentPassword.value = '';
+    newPassword.value = '';
+    confirmPassword.value = '';
+    message.value = 'رمز عبور ذخیره شد.';
+  } catch (e) {
+    error.value = e instanceof ApiError ? e.message : 'خطا در ذخیره رمز';
+  } finally {
+    saving.value = false;
+  }
+}
 </script>

src/views/auth/LoginView.vue

@@ -1,5 +1,5 @@
 <template>
-  <AuthLayout title="مون‌تایم" subtitle="ورود با شماره موبایل">
+  <AuthLayout title="مون‌تایم" subtitle="ورود به حساب کاربری">
     <p
       v-if="error"
       class="mb-4 rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-600 dark:text-red-400"
@@ -7,6 +7,8 @@
       {{ error }}
     </p>
 
+    <AuthModeSwitch v-model="mode" />
+
     <form class="mt-auto space-y-4" @submit.prevent="onSubmit">
       <AppInput
         id="mobile"
@@ -19,22 +21,47 @@
         ltr
         required
       />
-      <AppButton type="submit" :loading="loading">دریافت کد تأیید</AppButton>
+
+      <AppInput
+        v-if="mode === 'password'"
+        id="password"
+        v-model="password"
+        label="رمز عبور"
+        type="password"
+        autocomplete="current-password"
+        ltr
+        required
+      />
+
+      <AppButton type="submit" :loading="loading">
+        {{ mode === 'otp' ? 'دریافت کد تأیید' : 'ورود' }}
+      </AppButton>
     </form>
+
+    <p v-if="mode === 'password'" class="mt-3 text-center text-xs text-muted">
+      اولین بار؟ با کد یکبارمصرف وارد شوید و در پروفایل رمز بسازید.
+    </p>
   </AuthLayout>
 </template>
 
 <script setup lang="ts">
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
-import { requestOtp } from '@/api/auth';
+import { loginWithPassword, requestOtp } from '@/api/auth';
+import { isValidIranMobile, normalizeIranMobile } from '@/utils/mobile';
 import { ApiError } from '@/api/client';
+import AuthModeSwitch from '@/components/auth/AuthModeSwitch.vue';
+import type { AuthLoginMode } from '@/components/auth/AuthModeSwitch.vue';
 import AppButton from '@/components/ui/AppButton.vue';
 import AppInput from '@/components/ui/AppInput.vue';
 import AuthLayout from '@/layouts/AuthLayout.vue';
+import { useAuthStore } from '@/stores/auth';
 
 const router = useRouter();
+const auth = useAuthStore();
+const mode = ref<AuthLoginMode>('otp');
 const mobile = ref('');
+const password = ref('');
 const loading = ref(false);
 const error = ref('');
 
@@ -42,18 +69,31 @@ async function onSubmit() {
   error.value = '';
   loading.value = true;
   try {
-    const res = await requestOtp(mobile.value.trim());
-    await router.push({
-      name: 'verify',
-      query: {
-        mobile: mobile.value.trim(),
-        expires: String(res.expiresInSeconds),
-        ...(res.otpCode ? { devCode: res.otpCode } : {}),
-      },
-    });
+    const normalized = normalizeIranMobile(mobile.value);
+    if (!isValidIranMobile(normalized)) {
+      error.value = 'شماره موبایل معتبر نیست. مثال: 09121234567';
+      return;
+    }
+
+    if (mode.value === 'otp') {
+      const res = await requestOtp(normalized);
+      await router.push({
+        name: 'verify',
+        query: {
+          mobile: normalized,
+          expires: String(res.expiresInSeconds),
+          ...(res.otpCode ? { devCode: res.otpCode } : {}),
+        },
+      });
+      return;
+    }
+
+    const res = await loginWithPassword(normalized, password.value);
+    auth.setSession(res.accessToken, res.user);
+    await router.replace({ name: 'app-home' });
   } catch (e) {
     error.value =
-      e instanceof ApiError ? e.message : 'خطا در ارسال درخواست. دوباره تلاش کنید.';
+      e instanceof ApiError ? e.message : 'خطا در ورود. دوباره تلاش کنید.';
   } finally {
     loading.value = false;
   }