feat(crm): add deal create/update controls with status and payment

frontend/app/components/workspace/CrmWorkspaceApp.vue

@@ -229,6 +229,11 @@ const {
   getDealCurrentStepLabel,
   isDealStepDone,
   formatDealStepMeta,
+  dealStageOptions,
+  createDealForContact,
+  dealCreateLoading,
+  updateDealDetails,
+  dealUpdateLoading,
   refetchDeals,
 } = useDeals({ apolloAuthReady, contacts, calendarEvents });
 
@@ -896,31 +901,6 @@ function closeCommQuickMenu() {
   commQuickMenuOpen.value = false;
 }
 
-const commEventDateOptions = computed(() => {
-  const out: string[] = [];
-  const today = new Date();
-  for (let i = -7; i <= 30; i += 1) {
-    const d = new Date(today);
-    d.setDate(today.getDate() + i);
-    out.push(dayKey(d));
-  }
-  const selected = String(commEventForm.value.startDate ?? "").trim();
-  if (selected && !out.includes(selected)) out.unshift(selected);
-  return out;
-});
-
-const commEventTimeOptions = computed(() => {
-  const out: string[] = [];
-  for (let hour = 0; hour < 24; hour += 1) {
-    for (let minute = 0; minute < 60; minute += 15) {
-      out.push(`${String(hour).padStart(2, "0")}:${String(minute).padStart(2, "0")}`);
-    }
-  }
-  const selected = String(commEventForm.value.startTime ?? "").trim();
-  if (selected && !out.includes(selected)) out.unshift(selected);
-  return out;
-});
-
 function commComposerPlaceholder() {
   if (commComposerMode.value === "planned") return "Опиши, что нужно запланировать...";
   if (commComposerMode.value === "logged") return "Опиши итог/отчёт по прошедшему событию...";
@@ -2135,32 +2115,18 @@ onBeforeUnmount(() => {
                         />
 
                         <div v-if="commComposerMode === 'planned' || commComposerMode === 'logged'" class="comm-event-controls">
-                          <select
+                          <input
                             v-model="commEventForm.startDate"
-                            class="select select-bordered select-xs h-7 min-h-7"
+                            type="date"
+                            class="input input-bordered input-xs h-7 min-h-7"
                             :disabled="commEventSaving"
                           >
-                            <option
-                              v-for="dateValue in commEventDateOptions"
-                              :key="`comm-event-date-${dateValue}`"
-                              :value="dateValue"
-                            >
-                              {{ formatDay(`${dateValue}T00:00:00`) }}
-                            </option>
-                          </select>
-                          <select
+                          <input
                             v-model="commEventForm.startTime"
-                            class="select select-bordered select-xs h-7 min-h-7"
+                            type="time"
+                            class="input input-bordered input-xs h-7 min-h-7"
                             :disabled="commEventSaving"
                           >
-                            <option
-                              v-for="timeValue in commEventTimeOptions"
-                              :key="`comm-event-time-${timeValue}`"
-                              :value="timeValue"
-                            >
-                              {{ timeValue }}
-                            </option>
-                          </select>
                           <select
                             v-model.number="commEventForm.durationMinutes"
                             class="select select-bordered select-xs h-7 min-h-7"
@@ -2290,6 +2256,11 @@ onBeforeUnmount(() => {
                 :on-selected-deal-steps-expanded-change="(value) => { selectedDealStepsExpanded = value; }"
                 :is-deal-step-done="isDealStepDone"
                 :format-deal-step-meta="formatDealStepMeta"
+                :deal-stage-options="dealStageOptions"
+                :create-deal-for-contact="createDealForContact"
+                :deal-create-loading="dealCreateLoading"
+                :update-deal-details="updateDealDetails"
+                :deal-update-loading="dealUpdateLoading"
                 :active-review-contact-diff="activeReviewContactDiff"
                 :selected-workspace-contact="selectedWorkspaceContact"
               />

frontend/app/components/workspace/communications/CrmCommunicationsContextSidebar.vue

@@ -1,7 +1,9 @@
 <script setup lang="ts">
+import { computed, ref, watch } from "vue";
+
 type ContactRightPanelMode = "summary" | "documents";
 
-defineProps<{
+const props = defineProps<{
   selectedWorkspaceContactDocuments: any[];
   contactRightPanelMode: ContactRightPanelMode;
   onContactRightPanelModeChange: (mode: ContactRightPanelMode) => void;
@@ -24,6 +26,17 @@ defineProps<{
   onSelectedDealStepsExpandedChange: (value: boolean) => void;
   isDealStepDone: (step: any) => boolean;
   formatDealStepMeta: (step: any) => string;
+  dealStageOptions: string[];
+  createDealForContact: (input: {
+    contactId: string;
+    title: string;
+    stage: string;
+    amount: string;
+    paidAmount: string;
+  }) => Promise<any>;
+  dealCreateLoading: boolean;
+  updateDealDetails: (input: { dealId: string; stage: string; amount: string; paidAmount: string }) => Promise<boolean>;
+  dealUpdateLoading: boolean;
   activeReviewContactDiff: {
     contactId?: string;
     before?: string;
@@ -31,13 +44,132 @@ defineProps<{
   } | null;
   selectedWorkspaceContact: {
     id: string;
+    name?: string;
     description: string;
   } | null;
 }>();
 
 function onDocumentsSearchInput(event: Event) {
   const target = event.target as HTMLInputElement | null;
-  onContactDocumentsSearchInput(target?.value ?? "");
+  props.onContactDocumentsSearchInput(target?.value ?? "");
+}
+
+const dealStageDraft = ref("");
+const dealAmountDraft = ref("");
+const dealPaidAmountDraft = ref("");
+const dealNewStageDraft = ref("");
+const dealSaveError = ref("");
+const dealSaveSuccess = ref("");
+const dealCreateTitleDraft = ref("");
+const dealCreateStageDraft = ref("");
+const dealCreateAmountDraft = ref("");
+const dealCreatePaidAmountDraft = ref("");
+const dealCreateError = ref("");
+const dealCreateSuccess = ref("");
+const visibleDealStageOptions = computed(() => {
+  const unique = new Set<string>(props.dealStageOptions);
+  const current = dealStageDraft.value.trim();
+  if (current) unique.add(current);
+  return [...unique];
+});
+const visibleDealCreateStageOptions = computed(() => {
+  const unique = new Set<string>(props.dealStageOptions);
+  const current = dealCreateStageDraft.value.trim();
+  if (current) unique.add(current);
+  return [...unique];
+});
+
+watch(
+  () => props.selectedWorkspaceDeal?.id ?? "",
+  () => {
+    dealStageDraft.value = String(props.selectedWorkspaceDeal?.stage ?? "").trim();
+    dealAmountDraft.value = String(props.selectedWorkspaceDeal?.amount ?? "").trim();
+    dealPaidAmountDraft.value = String(props.selectedWorkspaceDeal?.paidAmount ?? "").trim();
+    dealNewStageDraft.value = "";
+    dealSaveError.value = "";
+    dealSaveSuccess.value = "";
+  },
+  { immediate: true },
+);
+
+watch(
+  () => props.selectedWorkspaceContact?.id ?? "",
+  () => {
+    dealCreateTitleDraft.value = "";
+    dealCreateAmountDraft.value = "";
+    dealCreatePaidAmountDraft.value = "";
+    dealCreateStageDraft.value = props.dealStageOptions[0] ?? "Новый";
+    dealCreateError.value = "";
+    dealCreateSuccess.value = "";
+  },
+  { immediate: true },
+);
+
+watch(
+  () => props.dealStageOptions.join("|"),
+  () => {
+    if (!dealCreateStageDraft.value.trim()) {
+      dealCreateStageDraft.value = props.dealStageOptions[0] ?? "Новый";
+    }
+  },
+  { immediate: true },
+);
+
+function applyNewDealStage() {
+  const value = dealNewStageDraft.value.trim();
+  if (!value) {
+    dealSaveError.value = "Введите название статуса";
+    dealSaveSuccess.value = "";
+    return;
+  }
+  dealStageDraft.value = value;
+  dealNewStageDraft.value = "";
+  dealSaveError.value = "";
+  dealSaveSuccess.value = "";
+}
+
+async function saveDealDetails() {
+  if (!props.selectedWorkspaceDeal) return;
+  dealSaveError.value = "";
+  dealSaveSuccess.value = "";
+
+  try {
+    const changed = await props.updateDealDetails({
+      dealId: props.selectedWorkspaceDeal.id,
+      stage: dealStageDraft.value,
+      amount: dealAmountDraft.value,
+      paidAmount: dealPaidAmountDraft.value,
+    });
+    dealSaveSuccess.value = changed ? "Сделка обновлена" : "Изменений нет";
+  } catch (error) {
+    dealSaveError.value = error instanceof Error ? error.message : "Не удалось обновить сделку";
+  }
+}
+
+async function createDeal() {
+  if (!props.selectedWorkspaceContact) return;
+  dealCreateError.value = "";
+  dealCreateSuccess.value = "";
+
+  try {
+    const created = await props.createDealForContact({
+      contactId: props.selectedWorkspaceContact.id,
+      title: dealCreateTitleDraft.value,
+      stage: dealCreateStageDraft.value,
+      amount: dealCreateAmountDraft.value,
+      paidAmount: dealCreatePaidAmountDraft.value,
+    });
+    if (!created) {
+      dealCreateError.value = "Не удалось создать сделку";
+      return;
+    }
+    dealCreateSuccess.value = "Сделка создана";
+    dealCreateTitleDraft.value = "";
+    dealCreateAmountDraft.value = "";
+    dealCreatePaidAmountDraft.value = "";
+  } catch (error) {
+    dealCreateError.value = error instanceof Error ? error.message : "Не удалось создать сделку";
+  }
 }
 </script>
 
@@ -45,35 +177,35 @@ function onDocumentsSearchInput(event: Event) {
   <aside class="h-full min-h-0">
     <div class="flex h-full min-h-0 flex-col p-3">
       <div
-        v-if="selectedWorkspaceContactDocuments.length"
+        v-if="props.selectedWorkspaceContactDocuments.length"
         class="mb-2 flex flex-wrap items-center gap-1.5 rounded-xl border border-base-300 bg-base-200/35 px-2 py-1.5"
       >
         <button
           class="badge badge-sm badge-outline"
-          @click="onContactRightPanelModeChange('documents')"
+          @click="props.onContactRightPanelModeChange('documents')"
         >
-          {{ selectedWorkspaceContactDocuments.length }} documents
+          {{ props.selectedWorkspaceContactDocuments.length }} documents
         </button>
         <button
-          v-for="doc in selectedWorkspaceContactDocuments.slice(0, 15)"
+          v-for="doc in props.selectedWorkspaceContactDocuments.slice(0, 15)"
           :key="`contact-doc-chip-${doc.id}`"
           class="rounded-full border border-base-300 bg-base-100 px-2 py-0.5 text-[10px] text-base-content/80 hover:bg-base-200/70"
-          @click="onContactRightPanelModeChange('documents'); onSelectedDocumentIdChange(doc.id)"
+          @click="props.onContactRightPanelModeChange('documents'); props.onSelectedDocumentIdChange(doc.id)"
         >
           {{ doc.title }}
         </button>
       </div>
 
-      <div v-if="contactRightPanelMode === 'documents'" class="min-h-0 flex-1 overflow-y-auto pr-1">
+      <div v-if="props.contactRightPanelMode === 'documents'" class="min-h-0 flex-1 overflow-y-auto pr-1">
         <div class="sticky top-0 z-10 border-b border-base-300 bg-base-100 pb-2">
           <div class="flex items-center justify-between gap-2">
             <p class="text-xs font-semibold uppercase tracking-wide text-base-content/60">
               Contact documents
             </p>
-            <button class="btn btn-ghost btn-xs" @click="onContactRightPanelModeChange('summary')">Summary</button>
+            <button class="btn btn-ghost btn-xs" @click="props.onContactRightPanelModeChange('summary')">Summary</button>
           </div>
           <input
-            :value="contactDocumentsSearch"
+            :value="props.contactDocumentsSearch"
             type="text"
             class="input input-bordered input-xs mt-2 w-full"
             placeholder="Search documents..."
@@ -82,22 +214,22 @@ function onDocumentsSearchInput(event: Event) {
         </div>
         <div class="mt-2 space-y-1.5">
           <article
-            v-for="doc in filteredSelectedWorkspaceContactDocuments"
+            v-for="doc in props.filteredSelectedWorkspaceContactDocuments"
             :key="`contact-doc-right-${doc.id}`"
             class="w-full rounded-xl border border-base-300 px-2.5 py-2 text-left transition hover:bg-base-200/50"
-            :class="selectedDocumentId === doc.id ? 'border-primary bg-primary/10' : ''"
-            @click="onSelectedDocumentIdChange(doc.id)"
+            :class="props.selectedDocumentId === doc.id ? 'border-primary bg-primary/10' : ''"
+            @click="props.onSelectedDocumentIdChange(doc.id)"
           >
             <div class="flex items-start justify-between gap-2">
               <p class="min-w-0 flex-1 truncate text-xs font-semibold">{{ doc.title }}</p>
             </div>
             <p class="mt-0.5 line-clamp-2 text-[11px] text-base-content/70">{{ doc.summary }}</p>
             <div class="mt-1 flex items-center justify-between gap-2">
-              <p class="text-[10px] text-base-content/55">Updated {{ formatStamp(doc.updatedAt) }}</p>
-              <button class="btn btn-ghost btn-xs px-1" @click.stop="onSelectedDocumentIdChange(doc.id); openDocumentsTab(true)">Open</button>
+              <p class="text-[10px] text-base-content/55">Updated {{ props.formatStamp(doc.updatedAt) }}</p>
+              <button class="btn btn-ghost btn-xs px-1" @click.stop="props.onSelectedDocumentIdChange(doc.id); props.openDocumentsTab(true)">Open</button>
             </div>
           </article>
-          <p v-if="filteredSelectedWorkspaceContactDocuments.length === 0" class="px-1 py-2 text-xs text-base-content/55">
+          <p v-if="props.filteredSelectedWorkspaceContactDocuments.length === 0" class="px-1 py-2 text-xs text-base-content/55">
             No linked documents.
           </p>
         </div>
@@ -105,46 +237,185 @@ function onDocumentsSearchInput(event: Event) {
 
       <div v-else class="min-h-0 flex-1 space-y-3 overflow-y-auto pr-1">
         <div
-          v-if="selectedWorkspaceDeal"
+          v-if="props.selectedWorkspaceContact"
+          class="rounded-xl border border-base-300 bg-base-200/25 p-2.5"
+        >
+          <p class="text-xs font-semibold uppercase tracking-wide text-base-content/60">Новая сделка</p>
+          <input
+            v-model="dealCreateTitleDraft"
+            type="text"
+            class="input input-bordered input-sm mt-2 w-full"
+            :disabled="props.dealCreateLoading"
+            placeholder="Название сделки"
+          >
+
+          <div class="mt-2 grid grid-cols-2 gap-1.5">
+            <div class="space-y-1">
+              <p class="text-[10px] uppercase tracking-wide text-base-content/60">Статус</p>
+              <select
+                v-model="dealCreateStageDraft"
+                class="select select-bordered select-xs w-full"
+                :disabled="props.dealCreateLoading"
+              >
+                <option
+                  v-for="stageOption in visibleDealCreateStageOptions"
+                  :key="`create-deal-stage-${stageOption}`"
+                  :value="stageOption"
+                >
+                  {{ stageOption }}
+                </option>
+              </select>
+            </div>
+            <div class="space-y-1">
+              <p class="text-[10px] uppercase tracking-wide text-base-content/60">Сумма</p>
+              <input
+                v-model="dealCreateAmountDraft"
+                type="text"
+                inputmode="numeric"
+                class="input input-bordered input-xs h-7 min-h-7 w-full"
+                :disabled="props.dealCreateLoading"
+                placeholder="0"
+              >
+            </div>
+          </div>
+
+          <div class="mt-1.5 space-y-1">
+            <p class="text-[10px] uppercase tracking-wide text-base-content/60">Оплачено</p>
+            <input
+              v-model="dealCreatePaidAmountDraft"
+              type="text"
+              inputmode="numeric"
+              class="input input-bordered input-xs h-7 min-h-7 w-full"
+              :disabled="props.dealCreateLoading"
+              placeholder="0"
+            >
+          </div>
+
+          <p v-if="dealCreateError" class="mt-2 text-[10px] text-error">{{ dealCreateError }}</p>
+          <p v-if="dealCreateSuccess" class="mt-2 text-[10px] text-success">{{ dealCreateSuccess }}</p>
+
+          <div class="mt-2 flex justify-end">
+            <button
+              class="btn btn-primary btn-xs h-7 min-h-7 px-2.5"
+              :disabled="props.dealCreateLoading"
+              @click="createDeal"
+            >
+              Создать сделку
+            </button>
+          </div>
+        </div>
+
+        <div
+          v-if="props.selectedWorkspaceDeal"
           class="rounded-xl border border-base-300 bg-base-200/30 p-2.5"
           :class="[
-            isReviewHighlightedDeal(selectedWorkspaceDeal.id) ? 'border-primary/60 bg-primary/10' : '',
-            contextPickerEnabled ? 'context-scope-block context-scope-block-active' : '',
-            hasContextScope('deal') ? 'context-scope-block-selected' : '',
+            props.isReviewHighlightedDeal(props.selectedWorkspaceDeal.id) ? 'border-primary/60 bg-primary/10' : '',
+            props.contextPickerEnabled ? 'context-scope-block context-scope-block-active' : '',
+            props.hasContextScope('deal') ? 'context-scope-block-selected' : '',
           ]"
-          @click="toggleContextScope('deal')"
+          @click="props.toggleContextScope('deal')"
         >
-          <span v-if="contextPickerEnabled" class="context-scope-label">Сделка</span>
+          <span v-if="props.contextPickerEnabled" class="context-scope-label">Сделка</span>
           <p class="text-sm font-medium">
-            {{ formatDealHeadline(selectedWorkspaceDeal) }}
+            {{ props.formatDealHeadline(props.selectedWorkspaceDeal) }}
           </p>
           <p class="mt-1 text-[11px] text-base-content/75">
-            {{ selectedWorkspaceDealSubtitle }}
+            {{ props.selectedWorkspaceDealSubtitle }}
           </p>
+          <div class="mt-2 space-y-2 rounded-lg border border-base-300/70 bg-base-100/75 p-2" @click.stop>
+            <div class="space-y-1">
+              <p class="text-[10px] uppercase tracking-wide text-base-content/60">Статус сделки</p>
+              <select
+                v-model="dealStageDraft"
+                class="select select-bordered select-xs w-full"
+                :disabled="props.dealUpdateLoading"
+              >
+                <option v-for="stageOption in visibleDealStageOptions" :key="`deal-stage-${stageOption}`" :value="stageOption">
+                  {{ stageOption }}
+                </option>
+              </select>
+            </div>
+
+            <div class="flex items-center gap-1.5">
+              <input
+                v-model="dealNewStageDraft"
+                type="text"
+                class="input input-bordered input-xs h-7 min-h-7 flex-1"
+                :disabled="props.dealUpdateLoading"
+                placeholder="Добавить статус"
+                @keydown.enter.prevent="applyNewDealStage"
+              >
+              <button
+                class="btn btn-ghost btn-xs h-7 min-h-7 px-2"
+                :disabled="props.dealUpdateLoading"
+                @click="applyNewDealStage"
+              >
+                Добавить
+              </button>
+            </div>
+
+            <div class="grid grid-cols-2 gap-1.5">
+              <div class="space-y-1">
+                <p class="text-[10px] uppercase tracking-wide text-base-content/60">Сумма</p>
+                <input
+                  v-model="dealAmountDraft"
+                  type="text"
+                  inputmode="numeric"
+                  class="input input-bordered input-xs h-7 min-h-7 w-full"
+                  :disabled="props.dealUpdateLoading"
+                  placeholder="0"
+                >
+              </div>
+              <div class="space-y-1">
+                <p class="text-[10px] uppercase tracking-wide text-base-content/60">Оплачено</p>
+                <input
+                  v-model="dealPaidAmountDraft"
+                  type="text"
+                  inputmode="numeric"
+                  class="input input-bordered input-xs h-7 min-h-7 w-full"
+                  :disabled="props.dealUpdateLoading"
+                  placeholder="0"
+                >
+              </div>
+            </div>
+
+            <p v-if="dealSaveError" class="text-[10px] text-error">{{ dealSaveError }}</p>
+            <p v-if="dealSaveSuccess" class="text-[10px] text-success">{{ dealSaveSuccess }}</p>
+
+            <div class="flex justify-end">
+              <button
+                class="btn btn-primary btn-xs h-7 min-h-7 px-2.5"
+                :disabled="props.dealUpdateLoading"
+                @click="saveDealDetails"
+              >
+                Сохранить
+              </button>
+            </div>
+          </div>
           <button
-            v-if="selectedWorkspaceDealSteps.length"
+            v-if="props.selectedWorkspaceDealSteps.length"
             class="mt-2 text-[11px] font-medium text-primary hover:underline"
-            @click="onSelectedDealStepsExpandedChange(!selectedDealStepsExpanded)"
+            @click="props.onSelectedDealStepsExpandedChange(!props.selectedDealStepsExpanded)"
           >
-            {{ selectedDealStepsExpanded ? "Скрыть шаги" : `Показать шаги (${selectedWorkspaceDealSteps.length})` }}
+            {{ props.selectedDealStepsExpanded ? "Скрыть шаги" : `Показать шаги (${props.selectedWorkspaceDealSteps.length})` }}
           </button>
-          <div v-if="selectedDealStepsExpanded && selectedWorkspaceDealSteps.length" class="mt-2 space-y-1.5">
+          <div v-if="props.selectedDealStepsExpanded && props.selectedWorkspaceDealSteps.length" class="mt-2 space-y-1.5">
             <div
-              v-for="step in selectedWorkspaceDealSteps"
+              v-for="step in props.selectedWorkspaceDealSteps"
               :key="step.id"
               class="flex items-start gap-2 rounded-lg border border-base-300/70 bg-base-100/80 px-2 py-1.5"
             >
               <input
                 type="checkbox"
                 class="checkbox checkbox-xs mt-0.5"
-                :checked="isDealStepDone(step)"
+                :checked="props.isDealStepDone(step)"
                 disabled
               >
               <div class="min-w-0 flex-1">
-                <p class="truncate text-[11px] font-medium" :class="isDealStepDone(step) ? 'line-through text-base-content/60' : 'text-base-content/90'">
+                <p class="truncate text-[11px] font-medium" :class="props.isDealStepDone(step) ? 'line-through text-base-content/60' : 'text-base-content/90'">
                   {{ step.title }}
                 </p>
-                <p class="mt-0.5 text-[10px] text-base-content/55">{{ formatDealStepMeta(step) }}</p>
+                <p class="mt-0.5 text-[10px] text-base-content/55">{{ props.formatDealStepMeta(step) }}</p>
               </div>
             </div>
           </div>
@@ -153,28 +424,28 @@ function onDocumentsSearchInput(event: Event) {
         <div
           class="relative"
           :class="[
-            contextPickerEnabled ? 'context-scope-block context-scope-block-active' : '',
-            hasContextScope('summary') ? 'context-scope-block-selected' : '',
+            props.contextPickerEnabled ? 'context-scope-block context-scope-block-active' : '',
+            props.hasContextScope('summary') ? 'context-scope-block-selected' : '',
           ]"
-          @click="toggleContextScope('summary')"
+          @click="props.toggleContextScope('summary')"
         >
-          <span v-if="contextPickerEnabled" class="context-scope-label">Summary</span>
+          <span v-if="props.contextPickerEnabled" class="context-scope-label">Summary</span>
           <p class="mb-2 text-xs font-semibold uppercase tracking-wide text-base-content/60">Summary</p>
           <div
-            v-if="activeReviewContactDiff && selectedWorkspaceContact && activeReviewContactDiff.contactId === selectedWorkspaceContact.id"
+            v-if="props.activeReviewContactDiff && props.selectedWorkspaceContact && props.activeReviewContactDiff.contactId === props.selectedWorkspaceContact.id"
             class="mb-2 rounded-xl border border-primary/35 bg-primary/5 p-2"
           >
             <p class="text-[11px] font-semibold uppercase tracking-wide text-primary/80">Review diff</p>
             <p class="mt-1 text-[11px] text-base-content/65">Before</p>
-            <pre class="mt-1 whitespace-pre-wrap rounded-lg border border-base-300/70 bg-base-100 px-2 py-1.5 text-[11px] leading-relaxed text-base-content/65 line-through">{{ activeReviewContactDiff.before || "Empty" }}</pre>
+            <pre class="mt-1 whitespace-pre-wrap rounded-lg border border-base-300/70 bg-base-100 px-2 py-1.5 text-[11px] leading-relaxed text-base-content/65 line-through">{{ props.activeReviewContactDiff.before || "Empty" }}</pre>
             <p class="mt-2 text-[11px] text-base-content/65">After</p>
-            <pre class="mt-1 whitespace-pre-wrap rounded-lg border border-success/40 bg-success/10 px-2 py-1.5 text-[11px] leading-relaxed text-base-content">{{ activeReviewContactDiff.after || "Empty" }}</pre>
+            <pre class="mt-1 whitespace-pre-wrap rounded-lg border border-success/40 bg-success/10 px-2 py-1.5 text-[11px] leading-relaxed text-base-content">{{ props.activeReviewContactDiff.after || "Empty" }}</pre>
           </div>
           <ContactCollaborativeEditor
-            v-if="selectedWorkspaceContact"
-            :key="`contact-summary-${selectedWorkspaceContact.id}`"
-            v-model="selectedWorkspaceContact.description"
-            :room="`crm-contact-${selectedWorkspaceContact.id}`"
+            v-if="props.selectedWorkspaceContact"
+            :key="`contact-summary-${props.selectedWorkspaceContact.id}`"
+            v-model="props.selectedWorkspaceContact.description"
+            :room="`crm-contact-${props.selectedWorkspaceContact.id}`"
             placeholder="Contact summary..."
             :plain="true"
           />

frontend/app/composables/useDeals.ts

@@ -1,6 +1,6 @@
 import { ref, computed, watch, type ComputedRef, type Ref } from "vue";
-import { useQuery } from "@vue/apollo-composable";
-import { DealsQueryDocument } from "~~/graphql/generated";
+import { useQuery, useMutation } from "@vue/apollo-composable";
+import { CreateDealMutationDocument, DealsQueryDocument, UpdateDealMutationDocument } from "~~/graphql/generated";
 
 import type { Contact } from "~/composables/useContacts";
 import type { CalendarEvent } from "~/composables/useCalendar";
@@ -22,6 +22,7 @@ export type Deal = {
   title: string;
   stage: string;
   amount: string;
+  paidAmount: string;
   nextStep: string;
   summary: string;
   currentStepId: string;
@@ -29,6 +30,26 @@ export type Deal = {
 };
 
 function safeTrim(value: unknown) { return String(value ?? "").trim(); }
+const DEFAULT_DEAL_STAGES = ["Новый", "Квалификация", "Переговоры", "Согласование", "Выиграно", "Проиграно"];
+
+function parseMoneyInput(value: unknown, fieldLabel: "Сумма" | "Оплачено") {
+  const normalized = safeTrim(value).replace(/\s+/g, "").replace(",", ".");
+  if (!normalized) return null;
+  if (!/^\d+(\.\d+)?$/.test(normalized)) {
+    throw new Error(`${fieldLabel} должно быть числом`);
+  }
+  const num = Number(normalized);
+  if (!Number.isFinite(num)) {
+    throw new Error(`${fieldLabel} заполнено некорректно`);
+  }
+  if (!Number.isInteger(num)) {
+    throw new Error(`${fieldLabel} должно быть целым числом`);
+  }
+  if (num < 0) {
+    throw new Error(`${fieldLabel} не может быть отрицательным`);
+  }
+  return num;
+}
 
 export function useDeals(opts: {
   apolloAuthReady: ComputedRef<boolean>;
@@ -40,6 +61,12 @@ export function useDeals(opts: {
     null,
     { enabled: opts.apolloAuthReady },
   );
+  const { mutate: doUpdateDeal, loading: dealUpdateLoading } = useMutation(UpdateDealMutationDocument, {
+    refetchQueries: [{ query: DealsQueryDocument }],
+  });
+  const { mutate: doCreateDeal, loading: dealCreateLoading } = useMutation(CreateDealMutationDocument, {
+    refetchQueries: [{ query: DealsQueryDocument }],
+  });
 
   const deals = ref<Deal[]>([]);
   const selectedDealId = ref(deals.value[0]?.id ?? "");
@@ -206,6 +233,136 @@ export function useDeals(opts: {
     },
   );
 
+  const dealStageOptions = computed(() => {
+    const unique = new Set<string>();
+    for (const stage of DEFAULT_DEAL_STAGES) unique.add(stage);
+    for (const deal of deals.value) {
+      const stage = safeTrim(deal.stage);
+      if (stage) unique.add(stage);
+    }
+    return [...unique];
+  });
+
+  async function updateDealDetails(input: {
+    dealId: string;
+    stage: string;
+    amount: string;
+    paidAmount: string;
+  }) {
+    const dealId = safeTrim(input.dealId);
+    if (!dealId) throw new Error("Не выбрана сделка");
+    const current = deals.value.find((deal) => deal.id === dealId);
+    if (!current) throw new Error("Сделка не найдена");
+
+    const stage = safeTrim(input.stage);
+    if (!stage) throw new Error("Статус обязателен");
+
+    const amount = parseMoneyInput(input.amount, "Сумма");
+    const paidAmount = parseMoneyInput(input.paidAmount, "Оплачено");
+    if (amount === null && paidAmount !== null) {
+      throw new Error("Нельзя указать 'Оплачено' без поля 'Сумма'");
+    }
+    if (amount !== null && paidAmount !== null && paidAmount > amount) {
+      throw new Error("'Оплачено' не может быть больше 'Сумма'");
+    }
+
+    const payload: {
+      id: string;
+      stage?: string;
+      amount?: number | null;
+      paidAmount?: number | null;
+    } = { id: dealId };
+
+    let changed = false;
+    if (stage !== current.stage) {
+      payload.stage = stage;
+      changed = true;
+    }
+    if (amount !== parseMoneyInput(current.amount, "Сумма")) {
+      payload.amount = amount;
+      changed = true;
+    }
+    if (paidAmount !== parseMoneyInput(current.paidAmount, "Оплачено")) {
+      payload.paidAmount = paidAmount;
+      changed = true;
+    }
+
+    if (!changed) return false;
+
+    const res = await doUpdateDeal({ input: payload });
+    const updated = res?.data?.updateDeal as Deal | undefined;
+    if (updated) {
+      deals.value = deals.value.map((deal) => (deal.id === updated.id ? updated : deal));
+    } else {
+      await refetchDeals();
+    }
+    return true;
+  }
+
+  async function createDealForContact(input: {
+    contactId: string;
+    title: string;
+    stage: string;
+    amount: string;
+    paidAmount: string;
+    nextStep?: string;
+    summary?: string;
+  }) {
+    const contactId = safeTrim(input.contactId);
+    if (!contactId) throw new Error("Не выбран контакт");
+    const title = safeTrim(input.title);
+    if (!title) throw new Error("Название сделки обязательно");
+    const stage = safeTrim(input.stage) || DEFAULT_DEAL_STAGES[0]!;
+    if (!stage) throw new Error("Статус обязателен");
+
+    const amount = parseMoneyInput(input.amount, "Сумма");
+    const paidAmount = parseMoneyInput(input.paidAmount, "Оплачено");
+    if (amount === null && paidAmount !== null) {
+      throw new Error("Нельзя указать 'Оплачено' без поля 'Сумма'");
+    }
+    if (amount !== null && paidAmount !== null && paidAmount > amount) {
+      throw new Error("'Оплачено' не может быть больше 'Сумма'");
+    }
+
+    const payload: {
+      contactId: string;
+      title: string;
+      stage: string;
+      amount?: number | null;
+      paidAmount?: number | null;
+      nextStep?: string;
+      summary?: string;
+    } = {
+      contactId,
+      title,
+      stage,
+    };
+
+    if (input.amount.trim()) payload.amount = amount;
+    if (input.paidAmount.trim()) payload.paidAmount = paidAmount;
+    const nextStep = safeTrim(input.nextStep);
+    if (nextStep) payload.nextStep = nextStep;
+    const summary = safeTrim(input.summary);
+    if (summary) payload.summary = summary;
+
+    const res = await doCreateDeal({ input: payload });
+    const created = res?.data?.createDeal as Deal | undefined;
+    if (created) {
+      deals.value = [created, ...deals.value.filter((deal) => deal.id !== created.id)];
+      selectedDealId.value = created.id;
+      selectedDealStepsExpanded.value = false;
+      return created;
+    }
+
+    await refetchDeals();
+    const refreshed = deals.value.find((deal) => deal.title === title && deal.stage === stage && deal.contact);
+    if (refreshed) {
+      selectedDealId.value = refreshed.id;
+      selectedDealStepsExpanded.value = false;
+    }
+    return refreshed ?? null;
+  }
+
   return {
     deals,
     selectedDealId,
@@ -221,6 +378,11 @@ export function useDeals(opts: {
     formatDealDeadline,
     isDealStepDone,
     formatDealStepMeta,
+    dealStageOptions,
+    createDealForContact,
+    dealCreateLoading,
+    updateDealDetails,
+    dealUpdateLoading,
     refetchDeals,
   };
 }