nextorders · hmbanan666 · Jul 24, 2025 · Jul 23, 2025 · Jul 24, 2025 · coderabbitai
@@ -0,0 +1,78 @@
+<template>
+  <UCard
+    v-if="agreement"
+    variant="subtle"
+    class="h-full"
+  >
+    <div class="flex flex-col gap-3">
+      <div class="flex flex-row items-start gap-3.5">
+        <UIcon name="i-lucide-scroll-text" class="shrink-0 size-16 text-secondary" />
+
+        <UProgress
+          v-model="agreementProgress"
+          size="lg"
+          color="secondary"
+          status
+        />
+      </div>
+
+      <h3 class="text-xl md:text-xl/6 font-semibold">
+        Договор №{{ agreement.internalId }}
+      </h3>
-      <h3 class="text-xl md:text-xl/6 font-semibold">
-        Договор №{{ agreement.internalId }}
-      </h3>
+      <h3 class="text-xl md:text-xl/6 font-semibold">
+        {{ $t('partner.agreement.title', { id: agreement.internalId }) }}
+      </h3>
-      <h3 class="text-xl md:text-xl/6 font-semibold">
-        Договор №{{ agreement.internalId }}
-      </h3>
+      <h3 class="text-xl md:text-xl/6 font-semibold">
+        {{ $t('partner.agreement.title', { id: agreement.internalId }) }}
+      </h3>
+
+      <div>
+        <p v-if="agreement.concludedAt">
+          Заключен: {{ format(new Date(agreement.concludedAt), 'd MMMM yyyy', { locale: ru }) }}
+        </p>
+        <p v-if="agreement.willEndAt">
+          Действует до: {{ format(new Date(agreement.willEndAt), 'd MMMM yyyy', { locale: ru }) }}
+        </p>
+        <p>Роялти: {{ agreement.royalty }}%</p>
+        <p>Мин. роялти: {{ agreement.minRoyaltyPerMonth }} ₽ / месяц</p>
+
+        <p v-if="agreement.marketingFee">
+          Маркетинговый сбор: {{ agreement.marketingFee }}%
+        </p>
+        <p v-if="agreement.minMarketingFeePerMonth">
+          Мин. маркетинговый сбор: {{ agreement.minMarketingFeePerMonth }} ₽ / месяц
+        </p>
+
+        <p>Паушальный взнос: {{ agreement.lumpSumPayment }} ₽</p>
+      </div>
+
+      <p class="text-muted">
+        {{ agreement.comment }}
+      </p>
+    </div>
+  </UCard>
+  <CreateCard
+    v-else
+    label="Добавить договор"
+    icon="i-lucide-scroll-text"
+    @click="modalCreatePartnerAgreement.open({ partnerId, legalEntityId })"
+  />
+</template>
+
+<script setup lang="ts">
+import type { PartnerAgreement } from '@roll-stack/database'
+import { ModalCreatePartnerAgreement } from '#components'
+import { format } from 'date-fns'
+import { ru } from 'date-fns/locale/ru'
+
+const { agreement } = defineProps<{ partnerId: string, legalEntityId: string, agreement: PartnerAgreement | null | undefined }>()
+
+const overlay = useOverlay()
+const modalCreatePartnerAgreement = overlay.create(ModalCreatePartnerAgreement)
+
+const agreementProgress = computed(() => {
+  if (!agreement?.willEndAt || !agreement?.concludedAt) {
+    return 0
+  }
+
+  const now = new Date()
+  const concludedAt = new Date(agreement.concludedAt)
+  const willEndAt = new Date(agreement.willEndAt)
+
+  return Math.floor(100 - ((now.getTime() - concludedAt.getTime()) / (willEndAt.getTime() - concludedAt.getTime())) * 100)
+})
-const agreementProgress = computed(() => {
-  if (!agreement?.willEndAt || !agreement?.concludedAt) {
-    return 0
-  }
-
-  const now = new Date()
-  const concludedAt = new Date(agreement.concludedAt)
-  const willEndAt = new Date(agreement.willEndAt)
-
-  return Math.floor(100 - ((now.getTime() - concludedAt.getTime()) / (willEndAt.getTime() - concludedAt.getTime())) * 100)
-})
+const agreementProgress = computed(() => {
+  if (!agreement?.willEndAt || !agreement?.concludedAt) {
+    return 0
+  }
+
+  const now = new Date()
+  const concludedAt = new Date(agreement.concludedAt)
+  const willEndAt = new Date(agreement.willEndAt)
+
+  // Validate dates
+  if (concludedAt > willEndAt) {
+    return 0
+  }
+
+  const totalDuration = willEndAt.getTime() - concludedAt.getTime()
+  const elapsed = now.getTime() - concludedAt.getTime()
+  
+  // Calculate elapsed percentage (0-100)
+  const progress = Math.floor((elapsed / totalDuration) * 100)
+  
+  // Clamp between 0 and 100
+  return Math.max(0, Math.min(100, progress))
+})
-const agreementProgress = computed(() => {
-  if (!agreement?.willEndAt || !agreement?.concludedAt) {
-    return 0
-  }
-
-  const now = new Date()
-  const concludedAt = new Date(agreement.concludedAt)
-  const willEndAt = new Date(agreement.willEndAt)
-
-  return Math.floor(100 - ((now.getTime() - concludedAt.getTime()) / (willEndAt.getTime() - concludedAt.getTime())) * 100)
-})
+const agreementProgress = computed(() => {
+  if (!agreement?.willEndAt || !agreement?.concludedAt) {
+    return 0
+  }
+
+  const now = new Date()
+  const concludedAt = new Date(agreement.concludedAt)
+  const willEndAt = new Date(agreement.willEndAt)
+
+  // Validate dates
+  if (concludedAt > willEndAt) {
+    return 0
+  }
+
+  const totalDuration = willEndAt.getTime() - concludedAt.getTime()
+  const elapsed = now.getTime() - concludedAt.getTime()
+  
+  // Calculate elapsed percentage (0-100)
+  const progress = Math.floor((elapsed / totalDuration) * 100)
+  
+  // Clamp between 0 and 100
+  return Math.max(0, Math.min(100, progress))
+})
+</script>
@@ -8,7 +8,12 @@
         :class="{ 'opacity-75 grayscale group-hover:grayscale-0 group-hover:opacity-100': imagesMode === 'grayscale' }"
       >
 
-      <div class="absolute top-2 left-0 right-0 w-full">
+      <div
+        class="absolute top-2 left-0 right-0 w-full opacity-0 group-hover:opacity-100 duration-200"
+        :class="[
+          agreementProgress <= 15 && 'opacity-100',
+        ]"
+      >
         <div class="mx-2 px-2 py-1 bg-default/97 rounded-lg flex flex-row items-center gap-1.5">
           <UIcon name="i-lucide-scroll-text" class="shrink-0 size-5 text-secondary" />
 

@@ -0,0 +1,36 @@
+<template>
+  <UCard v-if="entity" class="h-full">
+    <div class="flex flex-col gap-2.5">
+      <UIcon name="i-lucide-scale" class="size-16 text-muted/25" />
+
+      <h3 class="text-xl md:text-xl/6 font-semibold">
+        {{ entity.name }}
+      </h3>
+
+      <div>
+        <p>ИНН {{ entity.inn }}</p>
+        <p>ОГРНИП {{ entity.ogrnip }}</p>
+      </div>
+
+      <p class="text-muted">
+        {{ entity.comment }}
+      </p>
+    </div>
+  </UCard>
+  <CreateCard
+    v-else
+    label="Добавить юридическое лицо"
+    icon="i-lucide-scale"
+    @click="modalCreatePartnerLegalEntity.open({ partnerId })"
+  />
+</template>
+
+<script setup lang="ts">
+import type { PartnerLegalEntity } from '@roll-stack/database'
+import { ModalCreatePartnerLegalEntity } from '#components'
+
+defineProps<{ partnerId: string, entity: PartnerLegalEntity | null | undefined }>()
+
+const overlay = useOverlay()
+const modalCreatePartnerLegalEntity = overlay.create(ModalCreatePartnerLegalEntity)
+</script>
@@ -0,0 +1,168 @@
+<template>
+  <UForm
+    :validate="createValidator(createPartnerAgreementSchema)"
+    :state="state"
+    class="flex flex-col gap-3"
+    @submit="onSubmit"
+  >
+    <UPopover>
+      <UFormField
+        label="Дата заключения"
+        name="concludedAt"
+        required
+      >
+        <UInput
+          :value="selectedConcludedAt ? df.format(selectedConcludedAt.toDate(getLocalTimeZone())) : ''"
+          placeholder="Выберите дату"
+          size="xl"
+          class="w-full items-center justify-center cursor-pointer"
+          :ui="{ trailing: 'pe-1.5' }"
+        />
+      </UFormField>
+
+      <template #content>
+        <UCalendar v-model="selectedConcludedAt" class="p-2" />
+      </template>
+    </UPopover>
+
+    <UPopover>
+      <UFormField
+        label="Дата окончания"
+        name="willEndAt"
+        required
+      >
+        <UInput
+          :value="selectedWillEndAt ? df.format(selectedWillEndAt.toDate(getLocalTimeZone())) : ''"
+          placeholder="Выберите дату"
+          size="xl"
+          class="w-full items-center justify-center cursor-pointer"
+          :ui="{ trailing: 'pe-1.5' }"
+        />
+      </UFormField>
+
+      <template #content>
+        <UCalendar v-model="selectedWillEndAt" class="p-2" />
+      </template>
+    </UPopover>
+
+    <UFormField label="Номер договора (внутренний)" name="internalId">
+      <UInput
+        v-model="state.internalId"
+        size="xl"
+        class="w-full items-center justify-center"
+      />
+    </UFormField>
+
+    <UFormField label="Роялти, %" name="royalty">
+      <UInputNumber
+        v-model="state.royalty"
+        orientation="vertical"
+        :step="0.1"
+        size="xl"
+        class="w-full items-center justify-center"
+      />
+    </UFormField>
+
+    <UFormField label="Мин. роялти, руб" name="minRoyaltyPerMonth">
+      <UInputNumber
+        v-model="state.minRoyaltyPerMonth"
+        orientation="vertical"
+        size="xl"
+        class="w-full items-center justify-center"
+      />
+    </UFormField>
+
+    <UFormField label="Паушальный взнос, руб" name="lumpSumPayment">
+      <UInputNumber
+        v-model="state.lumpSumPayment"
+        orientation="vertical"
+        size="xl"
+        class="w-full items-center justify-center"
+      />
+    </UFormField>
+
+    <UFormField :label="$t('common.comment')" name="comment">
+      <UInput
+        v-model="state.comment"
+        size="xl"
+        placeholder="Для внутреннего использования"
+        class="w-full items-center justify-center"
+      />
+    </UFormField>
+
+    <UButton
+      type="submit"
+      variant="solid"
+      color="secondary"
+      size="xl"
+      block
+      class="mt-3"
+      :label="$t('common.create')"
+    />
+  </UForm>
+</template>
+
+<script setup lang="ts">
+import type { CreatePartnerAgreement } from '#shared/services/partner'
+import type { CalendarDate } from '@internationalized/date'
+import type { FormSubmitEvent } from '@nuxt/ui'
+import { createPartnerAgreementSchema } from '#shared/services/partner'
+import { DateFormatter, getLocalTimeZone } from '@internationalized/date'
+
+const { partnerId, legalEntityId } = defineProps<{ partnerId: string, legalEntityId: string }>()
+const emit = defineEmits(['success', 'submitted'])
+
+const { t } = useI18n()
+const actionToast = useActionToast()
+
+const partnerStore = usePartnerStore()
+
+const state = ref<Partial<CreatePartnerAgreement>>({
+  concludedAt: undefined,
+  willEndAt: undefined,
+  internalId: undefined,
+  royalty: undefined,
+  minRoyaltyPerMonth: undefined,
+  lumpSumPayment: undefined,
+  comment: undefined,
+  legalEntityId,
+})
+
+const df = new DateFormatter('ru-RU', {
+  dateStyle: 'long',
+})
+
+const selectedConcludedAt = shallowRef<CalendarDate | undefined>()
+const selectedWillEndAt = shallowRef<CalendarDate | undefined>()
+
+watch(selectedConcludedAt, () => {
+  state.value.concludedAt = new Date(
+    `${selectedConcludedAt.value?.toString()} 12:00:00`,
+  ).toISOString()
+})
+watch(selectedWillEndAt, () => {
+  state.value.willEndAt = new Date(
+    `${selectedWillEndAt.value?.toString()} 12:00:00`,
+  ).toISOString()
+})
+
+async function onSubmit(event: FormSubmitEvent<CreatePartnerAgreement>) {
+  const toastId = actionToast.start()
+  emit('submitted')
+
+  try {
+    await $fetch(`/api/partner/id/${partnerId}/agreement`, {
+      method: 'POST',
+      body: event.data,
+    })
+
+    await partnerStore.update()
+
+    actionToast.success(toastId, t('toast.partner-agreement-created'))
+    emit('success')
+  } catch (error) {
+    console.error(error)
+    actionToast.error(toastId)
+  }
+}
+</script>