Add business registration for customers, owner panel, role-based nav, and Montime branding.

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

index.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>مون‌تایم</title>
+    <title>منتایم</title>
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

src/api/business-registrations.ts

@@ -0,0 +1,16 @@
+import { api } from './client';
+import type {
+  BusinessRegistrationRequest,
+  CreateBusinessRegistrationPayload,
+} from './types';
+
+export function fetchMyBusinessRegistrations() {
+  return api<BusinessRegistrationRequest[]>('/business-registration-requests/mine');
+}
+
+export function submitBusinessRegistration(payload: CreateBusinessRegistrationPayload) {
+  return api<BusinessRegistrationRequest>('/business-registration-requests', {
+    method: 'POST',
+    body: JSON.stringify(payload),
+  });
+}

src/api/businesses.ts

@@ -1,5 +1,5 @@
 import { api } from './client';
-import type { Business } from './types';
+import type { Business, UpdateBusinessPayload } from './types';
 
 export function fetchBusinesses(params?: {
   categoryId?: string;
@@ -19,3 +19,14 @@ export function fetchBusinesses(params?: {
 export function fetchBusiness(id: string) {
   return api<Business>(`/businesses/${id}`);
 }
+
+export function fetchMyBusinesses() {
+  return api<Business[]>('/businesses/mine');
+}
+
+export function updateBusiness(id: string, payload: UpdateBusinessPayload) {
+  return api<Business>(`/businesses/${id}`, {
+    method: 'PATCH',
+    body: JSON.stringify(payload),
+  });
+}

src/api/types.ts

@@ -23,10 +23,47 @@ export type Business = {
   longitude: number | null;
   isActive: boolean;
   categoryId: string;
+  ownerId?: string | null;
   category?: BusinessCategory;
   images?: BusinessImage[];
 };
 
+export type BusinessRegistrationStatus = 'pending' | 'approved' | 'rejected';
+
+export type BusinessRegistrationRequest = {
+  id: string;
+  applicantId: string;
+  status: BusinessRegistrationStatus;
+  title: string;
+  slug: string;
+  categoryId: string;
+  description: string | null;
+  contactPhone: string | null;
+  address: string | null;
+  adminNote: string | null;
+  businessId: string | null;
+  createdAt: string;
+  category?: BusinessCategory;
+  applicant?: { id: string; mobile: string; fullName: string | null };
+};
+
+export type CreateBusinessRegistrationPayload = {
+  title: string;
+  categoryId: string;
+  description?: string;
+  contactPhone?: string;
+  address?: string;
+};
+
+export type UpdateBusinessPayload = {
+  title?: string;
+  description?: string | null;
+  contactPhone?: string | null;
+  address?: string | null;
+  latitude?: number | null;
+  longitude?: number | null;
+};
+
 export type ServiceTemplate = {
   id: string;
   title: string;

src/layouts/WebAppLayout.vue

@@ -4,7 +4,7 @@
       class="sticky top-0 z-10 flex items-center justify-between border-b border-border bg-surface/95 px-4 py-3 backdrop-blur"
     >
       <div>
-        <p class="font-bold text-text">مون‌تایم</p>
+        <p class="font-bold text-text">منتایم</p>
         <p v-if="auth.user" class="text-xs text-muted">{{ auth.user.mobile }}</p>
       </div>
       <div class="flex items-center gap-2">
@@ -28,7 +28,7 @@
     >
       <div
         class="grid gap-1"
-        :class="navItems.length === 4 ? 'grid-cols-4' : 'grid-cols-3'"
+        :class="navItems.length === 4 ? 'grid-cols-4' : navItems.length === 5 ? 'grid-cols-5' : 'grid-cols-3'"
       >
         <RouterLink
           v-for="item in navItems"
@@ -73,6 +73,13 @@ const navItems = computed(() => {
       label: 'کسب‌وکار',
       icon: '🏪',
     });
+  } else if (auth.isCustomer) {
+    items.splice(2, 0, {
+      to: '/app/register-business',
+      name: 'app-register-business',
+      label: 'ثبت کسب‌وکار',
+      icon: '➕',
+    });
   }
   return items;
 });

src/router/index.ts

@@ -41,6 +41,12 @@ const router = createRouter({
       component: () => import('@/views/app/AppProfileView.vue'),
       meta: { requiresAuth: true },
     },
+    {
+      path: '/app/register-business',
+      name: 'app-register-business',
+      component: () => import('@/views/app/AppRegisterBusinessView.vue'),
+      meta: { requiresAuth: true, requiresCustomer: true },
+    },
     {
       path: '/app/owner',
       name: 'app-owner',
@@ -54,7 +60,7 @@ const router = createRouter({
 router.beforeEach(async (to) => {
   const auth = useAuthStore();
 
-  if (auth.token && !auth.user) {
+  if (auth.token) {
     await auth.loadUser();
   }
 
@@ -66,6 +72,10 @@ router.beforeEach(async (to) => {
     return { name: 'app-home' };
   }
 
+  if (to.meta.requiresCustomer && !auth.isCustomer) {
+    return auth.isBusinessOwner ? { name: 'app-owner' } : { name: 'app-home' };
+  }
+
   if (to.meta.guest && auth.isLoggedIn) {
     return { name: 'app-home' };
   }

src/views/app/AppOwnerView.vue

@@ -1,13 +1,125 @@
 <template>
   <WebAppLayout>
     <h1 class="mb-4 text-xl font-bold text-text">مدیریت کسب‌وکار</h1>
-    <p class="mb-4 text-sm text-muted">خدمات، ویژگی‌ها و رزروهای ورودی</p>
+
-    <div class="rounded-2xl border border-dashed border-border bg-surface-2 p-6 text-center text-sm text-muted">
+    <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>
+    <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>
+
+    <div v-if="loading" class="text-sm text-muted">در حال بارگذاری…</div>
+
+    <div v-else-if="!business" class="rounded-2xl border border-dashed border-border p-6 text-center text-sm text-muted">
+      کسب‌وکاری به حساب شما وصل نیست.
     </div>
+
+    <form v-else class="space-y-4" @submit.prevent="onSave">
+      <div class="rounded-2xl border border-border bg-surface-2 p-4">
+        <p class="text-xs text-muted">دسته</p>
+        <p class="mt-0.5 font-medium text-text">{{ business.category?.title ?? '—' }}</p>
+        <span
+          class="mt-2 inline-block rounded-lg px-2 py-0.5 text-xs"
+          :class="business.isActive ? 'bg-green-500/15 text-green-700' : 'bg-amber-500/15 text-amber-700'"
+        >
+          {{ business.isActive ? 'فعال' : 'غیرفعال' }}
+        </span>
+      </div>
+
+      <AppInput id="ownerTitle" v-model="form.title" label="نام کسب‌وکار" required />
+
+      <div class="space-y-1.5">
+        <label for="ownerDesc" class="block text-sm font-medium text-muted">توضیحات</label>
+        <textarea
+          id="ownerDesc"
+          v-model="form.description"
+          rows="3"
+          class="w-full rounded-xl border border-border bg-surface-2 px-4 py-3 text-text outline-none focus:border-brand-500 focus:ring-2 focus:ring-brand-500/30"
+        />
+      </div>
+
+      <AppInput
+        id="ownerPhone"
+        v-model="form.contactPhone"
+        label="تلفن"
+        type="tel"
+        inputmode="tel"
+        ltr
+      />
+      <AppInput id="ownerAddress" v-model="form.address" label="آدرس" />
+
+      <AppButton type="submit" :loading="saving">ذخیره تغییرات</AppButton>
+    </form>
   </WebAppLayout>
 </template>
 
 <script setup lang="ts">
+import { onMounted, ref } from 'vue';
+import { fetchMyBusinesses, updateBusiness } from '@/api/businesses';
+import type { Business } from '@/api/types';
+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';
+
+const business = ref<Business | null>(null);
+const loading = ref(true);
+const saving = ref(false);
+const error = ref('');
+const message = ref('');
+
+const form = ref({
+  title: '',
+  description: '',
+  contactPhone: '',
+  address: '',
+});
+
+onMounted(async () => {
+  loading.value = true;
+  error.value = '';
+  try {
+    const list = await fetchMyBusinesses();
+    business.value = list[0] ?? null;
+    if (business.value) {
+      form.value = {
+        title: business.value.title,
+        description: business.value.description ?? '',
+        contactPhone: business.value.contactPhone ?? '',
+        address: business.value.address ?? '',
+      };
+    }
+  } catch (e) {
+    error.value = e instanceof ApiError ? e.message : 'خطا در بارگذاری';
+  } finally {
+    loading.value = false;
+  }
+});
+
+async function onSave() {
+  if (!business.value) return;
+  saving.value = true;
+  error.value = '';
+  message.value = '';
+  try {
+    business.value = await updateBusiness(business.value.id, {
+      title: form.value.title.trim(),
+      description: form.value.description.trim() || null,
+      contactPhone: form.value.contactPhone.trim() || null,
+      address: form.value.address.trim() || null,
+    });
+    message.value = 'ذخیره شد.';
+  } catch (e) {
+    error.value = e instanceof ApiError ? e.message : 'خطا در ذخیره';
+  } finally {
+    saving.value = false;
+  }
+}
 </script>

src/views/app/AppProfileView.vue

@@ -27,6 +27,35 @@
         </div>
       </dl>
 
+      <section
+        v-if="auth.isCustomer"
+        class="rounded-2xl border border-border bg-surface-2 p-4"
+      >
+        <h2 class="text-sm font-semibold text-text">کسب‌وکار من</h2>
+        <p class="mt-1 text-xs text-muted">
+          می‌توانید درخواست ثبت کسب‌وکار دهید تا پس از تأیید مدیریت، پنل صاحب کسب‌وکار فعال شود.
+        </p>
+        <RouterLink
+          to="/app/register-business"
+          class="mt-3 inline-flex w-full items-center justify-center rounded-xl bg-brand-600 px-4 py-3 text-sm font-semibold text-white"
+        >
+          ثبت کسب‌وکار من
+        </RouterLink>
+      </section>
+
+      <section
+        v-else-if="auth.isBusinessOwner"
+        class="rounded-2xl border border-border bg-surface-2 p-4"
+      >
+        <h2 class="text-sm font-semibold text-text">مدیریت کسب‌وکار</h2>
+        <RouterLink
+          to="/app/owner"
+          class="mt-3 inline-flex w-full items-center justify-center rounded-xl border border-border px-4 py-3 text-sm font-semibold text-text hover:bg-surface-3"
+        >
+          ورود به پنل کسب‌وکار
+        </RouterLink>
+      </section>
+
       <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 ? 'تغییر رمز عبور' : 'تنظیم رمز عبور' }}

src/views/app/AppRegisterBusinessView.vue

@@ -0,0 +1,173 @@
+<template>
+  <WebAppLayout>
+    <h1 class="mb-2 text-xl font-bold text-text">ثبت کسب‌وکار</h1>
+    <p class="mb-4 text-sm text-muted">
+      درخواست شما پس از بررسی توسط مدیریت منتایم فعال می‌شود.
+    </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="loading" class="text-sm text-muted">در حال بارگذاری…</div>
+
+    <div
+      v-else-if="pendingRequest"
+      class="space-y-4 rounded-2xl border border-amber-500/30 bg-amber-500/10 p-4"
+    >
+      <p class="font-semibold text-text">در انتظار تأیید</p>
+      <p class="text-sm text-muted">
+        درخواست «{{ pendingRequest.title }}» ثبت شده و در حال بررسی است.
+      </p>
+      <p class="text-xs text-muted">
+        پس از تأیید، پیامک دریافت می‌کنید و تب «کسب‌وکار» در اپ فعال می‌شود.
+      </p>
+    </div>
+
+    <div
+      v-else-if="lastRejected"
+      class="mb-4 rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-600"
+    >
+      آخرین درخواست «{{ lastRejected.title }}» رد شد.
+      <span v-if="lastRejected.adminNote"> — {{ lastRejected.adminNote }}</span>
+      می‌توانید دوباره درخواست دهید.
+    </div>
+
+    <form v-if="showForm" class="space-y-4" @submit.prevent="onSubmit">
+      <AppInput id="bizTitle" v-model="form.title" label="نام کسب‌وکار" required />
+
+      <div class="space-y-1.5">
+        <label for="bizCategory" class="block text-sm font-medium text-muted">دسته</label>
+        <select
+          id="bizCategory"
+          v-model="form.categoryId"
+          required
+          class="w-full rounded-xl border border-border bg-surface-2 px-4 py-3 text-text outline-none focus:border-brand-500 focus:ring-2 focus:ring-brand-500/30"
+        >
+          <option value="" disabled>انتخاب دسته</option>
+          <option v-for="cat in categories" :key="cat.id" :value="cat.id">
+            {{ cat.title }}
+          </option>
+        </select>
+      </div>
+
+      <div class="space-y-1.5">
+        <label for="bizDesc" class="block text-sm font-medium text-muted">توضیحات</label>
+        <textarea
+          id="bizDesc"
+          v-model="form.description"
+          rows="3"
+          class="w-full rounded-xl border border-border bg-surface-2 px-4 py-3 text-text outline-none focus:border-brand-500 focus:ring-2 focus:ring-brand-500/30"
+        />
+      </div>
+
+      <AppInput
+        id="bizPhone"
+        v-model="form.contactPhone"
+        label="تلفن تماس"
+        type="tel"
+        inputmode="tel"
+        ltr
+      />
+      <AppInput id="bizAddress" v-model="form.address" label="آدرس" />
+
+      <AppButton type="submit" :loading="saving">ارسال درخواست</AppButton>
+    </form>
+  </WebAppLayout>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+import { fetchBusinessCategories } from '@/api/business-categories';
+import {
+  fetchMyBusinessRegistrations,
+  submitBusinessRegistration,
+} from '@/api/business-registrations';
+import type { BusinessCategory, BusinessRegistrationRequest } from '@/api/types';
+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 router = useRouter();
+const auth = useAuthStore();
+
+const loading = ref(true);
+const saving = ref(false);
+const error = ref('');
+const categories = ref<BusinessCategory[]>([]);
+const requests = ref<BusinessRegistrationRequest[]>([]);
+
+const form = ref({
+  title: '',
+  categoryId: '',
+  description: '',
+  contactPhone: '',
+  address: '',
+});
+
+const pendingRequest = computed(() =>
+  requests.value.find((r) => r.status === 'pending'),
+);
+
+const lastRejected = computed(() =>
+  requests.value.find((r) => r.status === 'rejected'),
+);
+
+const showForm = computed(
+  () => !pendingRequest.value && auth.isCustomer,
+);
+
+onMounted(async () => {
+  if (auth.isBusinessOwner) {
+    await router.replace({ name: 'app-owner' });
+    return;
+  }
+
+  loading.value = true;
+  error.value = '';
+  try {
+    const [cats, mine] = await Promise.all([
+      fetchBusinessCategories(),
+      fetchMyBusinessRegistrations(),
+    ]);
+    categories.value = cats.filter((c) => c.isActive);
+    requests.value = mine;
+    if (categories.value[0] && !form.value.categoryId) {
+      form.value.categoryId = categories.value[0].id;
+    }
+  } catch (e) {
+    error.value = e instanceof ApiError ? e.message : 'خطا در بارگذاری';
+  } finally {
+    loading.value = false;
+  }
+});
+
+async function onSubmit() {
+  if (!form.value.title.trim() || !form.value.categoryId) {
+    error.value = 'نام و دسته را وارد کنید.';
+    return;
+  }
+  saving.value = true;
+  error.value = '';
+  try {
+    await submitBusinessRegistration({
+      title: form.value.title.trim(),
+      categoryId: form.value.categoryId,
+      description: form.value.description.trim() || undefined,
+      contactPhone: form.value.contactPhone.trim() || undefined,
+      address: form.value.address.trim() || undefined,
+    });
+    requests.value = await fetchMyBusinessRegistrations();
+  } 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"