Adding registration date and multiple addresses for contacts and leads.

apps/web/src/views/PersonFormView.vue

@@ -60,7 +60,9 @@ const phone = ref('');
 const mobile = ref('');
 const position = ref('');
 const website = ref('');
+const instagram = ref('');
 const referrer = ref('');
+const addresses = ref<string[]>(['']);
 const notes = ref('');
 const tagsRaw = ref('');
 const companyId = ref('');
@@ -204,7 +206,9 @@ function fill(p: PersonDto) {
   mobile.value = p.mobile ?? '';
   position.value = p.position ?? '';
   website.value = p.website ?? '';
+  instagram.value = p.instagram ?? '';
   referrer.value = p.referrer ?? '';
+  addresses.value = p.addresses?.length ? [...p.addresses] : [''];
   notes.value = p.notes ?? '';
   tagsRaw.value = (p.tags ?? []).join('، ');
   companyId.value = p.company?.id ?? '';
@@ -214,6 +218,18 @@ function fill(p: PersonDto) {
   loyaltyTierName.value = p.loyaltyTier?.name ?? '';
 }
 
+function addAddress() {
+  addresses.value.push('');
+}
+
+function removeAddress(index: number) {
+  if (addresses.value.length <= 1) {
+    addresses.value[0] = '';
+    return;
+  }
+  addresses.value.splice(index, 1);
+}
+
 async function load() {
   loading.value = true;
   error.value = '';
@@ -253,7 +269,9 @@ function payload(): CreatePersonRequest {
     mobile: mobile.value || undefined,
     position: position.value || undefined,
     website: website.value || undefined,
+    instagram: instagram.value || undefined,
     referrer: referrer.value || undefined,
+    addresses: addresses.value.map((a) => a.trim()).filter(Boolean),
     notes: notes.value || undefined,
     tags: parseTags(tagsRaw.value),
     companyId: companyId.value || null,
@@ -446,10 +464,31 @@ onMounted(load);
             <UiInput id="website" v-model="website" dir="ltr" placeholder="https://example.com" />
           </UiField>
 
+          <UiField label="پیج اینستاگرام" for-id="instagram">
+            <UiInput id="instagram" v-model="instagram" dir="ltr" placeholder="@username یا لینک" />
+          </UiField>
+
           <UiField label="معرف" for-id="referrer">
             <UiInput id="referrer" v-model="referrer" placeholder="نام معرف" />
           </UiField>
 
+          <div class="crm-col-span-full addresses">
+            <div class="addresses-head">
+              <span>آدرس‌ها</span>
+              <button type="button" class="add-addr" @click="addAddress">+ افزودن آدرس</button>
+            </div>
+            <div v-for="(_, idx) in addresses" :key="idx" class="addr-row">
+              <UiInput
+                :id="`address-${idx}`"
+                v-model="addresses[idx]"
+                :placeholder="idx === 0 ? 'آدرس اصلی' : `آدرس ${idx + 1}`"
+              />
+              <button type="button" class="rm-addr" aria-label="حذف آدرس" @click="removeAddress(idx)">
+                ×
+              </button>
+            </div>
+          </div>
+
           <div class="crm-col-span-full">
             <UiField label="وضعیت مشتری">
               <div class="moods">
@@ -550,6 +589,57 @@ onMounted(load);
   margin-bottom: var(--sp-3);
 }
 
+.addresses {
+  display: grid;
+  gap: var(--sp-2);
+}
+
+.addresses-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--sp-2);
+  font-size: var(--fs-sm);
+  font-weight: var(--fw-semibold);
+  color: var(--ink);
+}
+
+.add-addr {
+  border: 0;
+  background: transparent;
+  color: var(--accent-deep);
+  font: inherit;
+  font-size: var(--fs-xs);
+  font-weight: var(--fw-bold);
+  cursor: pointer;
+  padding: 0;
+}
+
+.addr-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  gap: var(--sp-2);
+  align-items: center;
+}
+
+.rm-addr {
+  width: 2rem;
+  height: 2rem;
+  border: 1px solid var(--line);
+  border-radius: var(--radius);
+  background: var(--surface);
+  color: var(--muted);
+  font: inherit;
+  font-size: 1.1rem;
+  line-height: 1;
+  cursor: pointer;
+}
+
+.rm-addr:hover {
+  color: #b91c1c;
+  border-color: #fecaca;
+}
+
 .moods {
   display: flex;
   flex-wrap: wrap;