Skip to content

Commit 3582594

Browse files
hmbanan666hmbanan666
authored
feat: cool partner card with link (#215)
1 parent d443096 commit 3582594

9 files changed

Lines changed: 134 additions & 11 deletions

File tree

‎apps/atrium-telegram/app/components/PageContainer.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@
33
<div class="px-4 py-2 max-w-[28rem] mx-auto mb-20 flex flex-col gap-y-6" :class="className">
44
<slot />
55

6-
<div class="mt-18 flex flex-row justify-center">
6+
<div class="mt-22 flex flex-row justify-center">
77
<img
88
src="/sushi-heart.svg"
99
alt=""
10-
class="w-14 opacity-25 invert-50"
10+
class="w-14 opacity-15 invert-50"
1111
>
1212
</div>
1313
</div>

‎apps/atrium-telegram/app/components/PartnerActiveCard.vue‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
<template>
2+
<ActiveCard>
3+
<div class="z-10 relative w-full h-auto aspect-3/2 perspective-normal motion-preset-slide-down">
4+
<div
5+
class="absolute inset-0 bg-primary rounded-lg transition duration-200"
6+
:style="{
7+
transform: `rotateX(${x * 5}deg) rotateY(${y * 5}deg)`,
8+
}"
9+
/>
10+
11+
<div
12+
class="z-20 w-full h-full p-4 flex flex-col justify-between transition duration-200 tg-text-button"
13+
:style="{
14+
transform: `rotateX(${x * 3}deg) rotateY(${y * 3}deg)`,
15+
}"
16+
>
17+
<div class="flex flex-row justify-between items-start">
18+
<div class="flex flex-col gap-3">
19+
<div class="flex flex-col gap-1">
20+
<div class="text-xl/5 font-bold">
21+
{{ partnerUser?.name }} {{ partnerUser?.surname }}
22+
</div>
23+
<div class="text-sm/4">
24+
{{ partner?.city }}
25+
</div>
26+
</div>
27+
28+
<div class="flex flex-row gap-1.5 items-start">
29+
<img
30+
:src="partnerUser?.avatarUrl ?? undefined"
31+
alt=""
32+
class="size-24 rounded-lg border-2"
33+
>
34+
35+
<div class="flex flex-row justify-end">
36+
<img
37+
v-for="user in otherUsers"
38+
:key="user.id"
39+
:src="user?.avatarUrl ?? undefined"
40+
alt=""
41+
class="size-12 rounded-lg border-2"
42+
>
43+
</div>
44+
</div>
45+
</div>
46+
47+
<img
48+
src="/sushi-heart.svg"
49+
alt=""
50+
class="w-12 opacity-35 invert-100"
51+
>
52+
</div>
53+
54+
<div class="flex flex-row justify-between items-center">
55+
<div class="flex flex-row gap-2 items-center">
56+
<div class="px-3.5 py-1.5 text-2xl/5 text-primary font-bold rounded-full tg-bg-section">
57+
{{ partner?.priceLevel }}
58+
</div>
59+
60+
<p class="tg-text-inverted font-medium">
61+
Уровень цен
62+
</p>
63+
</div>
64+
</div>
65+
</div>
66+
</div>
67+
</ActiveCard>
68+
</template>
69+
70+
<script setup lang="ts">
71+
const { partnerId } = defineProps<{ partnerId: string }>()
72+
73+
const { x, y } = useGyroscope()
74+
75+
const partnerStore = usePartnerStore()
76+
const partner = computed(() => partnerStore.partners.find((partner) => partner.id === partnerId))
77+
const partnerUser = computed(() => partner.value?.users.find((user) => user.type === 'partner'))
78+
const otherUsers = computed(() => partner.value?.users.filter((user) => user.type !== 'partner'))
79+
</script>

‎apps/atrium-telegram/app/components/PartnerAgreementCard.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,5 +64,5 @@ const { agreementId } = defineProps<{
6464
}>()
6565
6666
const partnerStore = usePartnerStore()
67-
const agreement = partnerStore.agreements.find((agreement) => agreement.id === agreementId)
67+
const agreement = computed(() => partnerStore.agreements.find((agreement) => agreement.id === agreementId))
6868
</script>

‎apps/atrium-telegram/app/composables/useGyroscope.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import type { EventListener } from '@telegram-apps/sdk-vue'
2+
import { off, on } from '@telegram-apps/sdk-vue'
3+
4+
function _useGyroscope() {
5+
const x = ref(0)
6+
const y = ref(0)
7+
const z = ref(0)
8+
9+
const listener: EventListener<'gyroscope_changed'> = (payload) => {
10+
x.value = payload.x
11+
y.value = payload.y
12+
z.value = payload.z
13+
}
14+
15+
onMounted(() => {
16+
on('gyroscope_changed', listener)
17+
})
18+
19+
onUnmounted(() => {
20+
off('gyroscope_changed', listener)
21+
})
22+
23+
return {
24+
x,
25+
y,
26+
z,
27+
}
28+
}
29+
30+
export const useGyroscope = createSharedComposable(_useGyroscope)

‎apps/atrium-telegram/app/pages/agreement/[agreementId]/index.vue‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,12 +49,16 @@
4949
</div>
5050
</Section>
5151

52+
<NuxtLink v-if="partner" :to="`/partner/${partner.id}`">
53+
<PartnerActiveCard :partner-id="partner.id" />
54+
</NuxtLink>
55+
5256
<div v-if="agreement?.files.length" class="flex flex-col gap-2.5">
5357
<div class="flex flex-row justify-between items-center">
5458
<SectionTitle title="Загруженные файлы" />
5559
</div>
5660

57-
<div class="flex flex-col gap-4">
61+
<div class="flex flex-col gap-2">
5862
<NuxtLink
5963
v-for="file of agreement.files"
6064
:key="file.id"
@@ -95,4 +99,5 @@ const { params } = useRoute('agreement-agreementId')
9599
96100
const partnerStore = usePartnerStore()
97101
const agreement = computed(() => partnerStore.agreements.find((agreement) => agreement.id === params.agreementId))
102+
const partner = computed(() => partnerStore.partners.find((partner) => partner.id === agreement.value?.legalEntity?.partners[0]?.id))
98103
</script>

‎apps/atrium-telegram/app/pages/partner/[partnerId]/index.vue‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
<SectionTitle title="Юридическое лицо" />
2727
</div>
2828

29-
<Section>
29+
<Section class="motion-preset-slide-left">
3030
<div class="flex flex-col gap-2.5">
3131
<div class="flex flex-row gap-2 items-center">
3232
<UIcon
@@ -76,11 +76,13 @@
7676
</div>
7777

7878
<div class="flex flex-col gap-4">
79-
<KitchenCard
79+
<div
8080
v-for="kitchen in partner.kitchens"
8181
:key="kitchen.id"
82-
:kitchen="kitchen"
83-
/>
82+
class="motion-preset-slide-left"
83+
>
84+
<KitchenCard :kitchen="kitchen" />
85+
</div>
8486
</div>
8587
</div>
8688
</PageContainer>

‎apps/atrium-telegram/app/stores/partner.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
import type { Kitchen, Partner, PartnerAgreement, PartnerAgreementFile, PartnerLegalEntity, User } from '@roll-stack/database'
22
import { initDataRaw as _initDataRaw, useSignal } from '@telegram-apps/sdk-vue'
33

4+
type PartnerLegalEntityWithPartners = PartnerLegalEntity & {
5+
partners: Partner[]
6+
}
7+
48
export type PartnerAgreementWithAllData = PartnerAgreement & {
59
files: PartnerAgreementFile[]
6-
legalEntity: PartnerLegalEntity | null
10+
legalEntity: PartnerLegalEntityWithPartners | null
711
kitchens: Kitchen[]
812
}
913

‎packages/database/src/repository/partner.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,11 @@ export class Partner {
6161
return useDatabase().query.partnerAgreements.findMany({
6262
with: {
6363
files: true,
64-
legalEntity: true,
64+
legalEntity: {
65+
with: {
66+
partners: true,
67+
},
68+
},
6569
kitchens: true,
6670
},
6771
})

‎packages/database/src/tables.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -821,7 +821,6 @@ export const partnerAgreementRelations = relations(partnerAgreements, ({ one, ma
821821
fields: [partnerAgreements.legalEntityId],
822822
references: [partnerLegalEntities.id],
823823
}),
824-
partners: many(partners),
825824
kitchens: many(kitchens),
826825
files: many(partnerAgreementFiles),
827826
}))

0 commit comments

Comments
 (0)