Skip to content

Commit 20e0b5d

Browse files
hmbanan666hmbanan666
authored
feat: create flow item action (#179)
1 parent 59249c3 commit 20e0b5d

File tree

21 files changed

+268
-40
lines changed

21 files changed

+268
-40
lines changed

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
2-
<div class="z-50 touch-pan-x sticky inset-0 h-38">
3-
<div class="w-full h-14 px-4 py-0 flex flex-row flex-nowrap gap-0 items-start justify-center transition-all duration-200 ease-in-out">
2+
<div class="z-50 touch-pan-x sticky inset-0 h-24">
3+
<!-- <div class="w-full h-14 px-4 py-0 flex flex-row flex-nowrap gap-0 items-start justify-center transition-all duration-200 ease-in-out">
44
<UButton
55
v-if="isMainPage"
66
variant="solid"
@@ -13,7 +13,7 @@
1313
leadingIcon: 'size-6 mx-auto',
1414
}"
1515
/>
16-
</div>
16+
</div> -->
1717

1818
<nav
1919
v-if="isNavigationShown"
@@ -36,5 +36,5 @@
3636
</template>
3737

3838
<script setup lang="ts">
39-
const { isNavigationShown, mainRoutes, isMainPage } = useNavigation()
39+
const { isNavigationShown, mainRoutes } = useNavigation()
4040
</script>

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

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<template>
2+
<h2 class="text-2xl/6 font-bold tracking-tight">
3+
{{ title }}
4+
</h2>
5+
</template>
6+
7+
<script setup lang="ts">
8+
defineProps<{
9+
title: string
10+
}>()
11+
</script>

‎apps/atrium-telegram/app/components/flow/ItemCard.vue‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,16 @@
11
<template>
22
<ActiveCard>
33
<div class="flex flex-row gap-2 items-center">
4-
<UIcon name="i-lucide-clipboard-check" class="size-8 text-primary" />
4+
<UAvatar
5+
v-if="item.userId"
6+
:src="userAvatarUrl"
7+
class="size-8"
8+
/>
9+
<UIcon
10+
v-else
11+
name="i-lucide-clipboard-check"
12+
class="size-8 text-primary"
13+
/>
514

615
<div v-if="!isViewed" class="flex flex-row items-center gap-1.5 text-error">
716
<UIcon
@@ -49,4 +58,5 @@ const { item } = defineProps<{
4958
5059
const userStore = useUserStore()
5160
const isViewed = computed(() => item.views.some((view) => view.userId === userStore?.id))
61+
const userAvatarUrl = computed(() => userStore.users.find((user) => user.id === item.userId)?.avatarUrl ?? undefined)
5262
</script>

‎apps/atrium-telegram/app/components/form/CreateFlowItem.vue‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
<template>
2+
<UForm
3+
:validate="createValidator(createFlowItemSchema)"
4+
:state="state"
5+
class="flex flex-col gap-3"
6+
@submit="onSubmit"
7+
>
8+
<UFormField
9+
:label="$t('common.title')"
10+
name="title"
11+
required
12+
>
13+
<UInput
14+
v-model="state.title"
15+
size="xl"
16+
class="w-full"
17+
/>
18+
</UFormField>
19+
20+
<UFormField label="Текст" name="description">
21+
<UTextarea
22+
v-model="state.description"
23+
placeholder="Основной текст поста"
24+
autoresize
25+
size="xl"
26+
class="w-full"
27+
/>
28+
</UFormField>
29+
30+
<UButton
31+
type="submit"
32+
variant="solid"
33+
color="secondary"
34+
size="xl"
35+
block
36+
class="mt-3"
37+
:label="$t('common.create')"
38+
/>
39+
</UForm>
40+
</template>
41+
42+
<script setup lang="ts">
43+
import type { CreateFlowItem } from '#shared/services/flow'
44+
import type { FormSubmitEvent } from '@nuxt/ui'
45+
import { createFlowItemSchema } from '#shared/services/flow'
46+
47+
const emit = defineEmits(['success', 'submitted'])
48+
49+
const { t } = useI18n()
50+
const { vibrate } = useFeedback()
51+
const actionToast = useActionToast()
52+
53+
const flowStore = useFlowStore()
54+
const userStore = useUserStore()
55+
56+
const state = ref<Partial<CreateFlowItem>>({
57+
title: undefined,
58+
description: undefined,
59+
type: 'user_post',
60+
userId: userStore.id,
61+
})
62+
63+
async function onSubmit(event: FormSubmitEvent<CreateFlowItem>) {
64+
const toastId = actionToast.start()
65+
emit('submitted')
66+
67+
try {
68+
await $fetch('/api/flow', {
69+
method: 'POST',
70+
headers: {
71+
Authorization: `tma ${userStore.initDataRaw}`,
72+
},
73+
body: event.data,
74+
})
75+
76+
await Promise.all([
77+
flowStore.update(),
78+
userStore.update(),
79+
])
80+
81+
actionToast.success(toastId, t('toast.flow-item-created'))
82+
vibrate('success')
83+
emit('success')
84+
} catch (error) {
85+
console.error(error)
86+
actionToast.error(toastId)
87+
vibrate('error')
88+
}
89+
}
90+
</script>

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ function _useNavigation() {
1010
const mainRoutes = computed<NavigationRoute[]>(() => [
1111
{
1212
path: '/',
13-
names: ['index', 'flow-itemId'],
13+
names: ['index', 'flow-itemId', 'flow-new'],
1414
title: t('app.flow'),
1515
icon: 'i-lucide-waves',
1616
exact: true,

‎apps/atrium-telegram/app/pages/epic/[epicId]/index.vue‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,7 @@
1313
/>
1414
</div>
1515

16-
<h1 class="text-2xl/6 font-bold">
17-
{{ epic?.title }}
18-
</h1>
16+
<SectionTitle :title="epic?.title ?? ''" />
1917

2018
<div class="w-full text-base/5 whitespace-pre-wrap break-words">
2119
{{ epic?.description }}

‎apps/atrium-telegram/app/pages/flow/[itemId]/index.vue‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,19 @@
22
<PageContainer>
33
<Section>
44
<div class="flex flex-row items-start justify-between gap-2.5">
5-
<UIcon name="i-lucide-clipboard-check" class="size-10 text-primary" />
5+
<UAvatar
6+
v-if="item?.userId"
7+
:src="userAvatarUrl"
8+
class="size-10"
9+
/>
10+
<UIcon
11+
v-else
12+
name="i-lucide-clipboard-check"
13+
class="size-10 text-primary"
14+
/>
615
</div>
716

8-
<h1 class="text-2xl/6 font-bold">
9-
{{ item?.title }}
10-
</h1>
17+
<SectionTitle :title="item?.title ?? ''" />
1118

1219
<div class="w-full text-base/5 whitespace-pre-wrap break-words">
1320
{{ item?.description }}
@@ -61,6 +68,7 @@ const { params } = useRoute('flow-itemId')
6168
const userStore = useUserStore()
6269
const flowStore = useFlowStore()
6370
const item = computed(() => flowStore.items.find((item) => item.id === params.itemId))
71+
const userAvatarUrl = computed(() => userStore.users.find((user) => user.id === item.value?.userId)?.avatarUrl ?? undefined)
6472
6573
const isViewed = computed(() => item.value?.views.some((view) => view.userId === userStore?.id))
6674

‎apps/atrium-telegram/app/pages/flow/new.vue‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<template>
2+
<PageContainer>
3+
<div class="flex flex-col gap-2.5">
4+
<SectionTitle title="Создание поста" />
5+
6+
<FormCreateFlowItem @success="handleSuccess()" />
7+
</div>
8+
</PageContainer>
9+
</template>
10+
11+
<script setup lang="ts">
12+
definePageMeta({
13+
name: 'flow-new',
14+
canReturn: true,
15+
})
16+
17+
function handleSuccess() {
18+
return navigateTo('/')
19+
}
20+
</script>

‎apps/atrium-telegram/app/pages/index.vue‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,12 @@
11
<template>
22
<PageContainer :back="false" class="flex flex-col gap-y-8">
33
<div class="flex flex-col gap-2.5">
4-
<div class="text-2xl/6 font-bold tracking-tight">
5-
Команда
6-
</div>
4+
<SectionTitle title="Команда" />
75
<StaffBlock />
86
</div>
97

108
<div class="flex flex-col gap-2.5">
11-
<h1 class="text-2xl/6 font-bold tracking-tight">
12-
Данные на сегодня
13-
</h1>
9+
<SectionTitle title="Данные на сегодня" />
1410
<div class="grid grid-cols-2 gap-2">
1511
<FlowKitchensOnline />
1612
<FlowOrdersOnline />
@@ -20,8 +16,16 @@
2016
</div>
2117

2218
<div class="flex flex-col gap-2.5">
23-
<div class="text-2xl/6 font-bold tracking-tight">
24-
Поток
19+
<div class="flex flex-row justify-between items-center">
20+
<SectionTitle title="Поток" />
21+
22+
<UButton
23+
to="/flow/new"
24+
variant="solid"
25+
color="secondary"
26+
icon="i-lucide-plus"
27+
label="Создать пост"
28+
/>
2529
</div>
2630
<div class="flex flex-col gap-4">
2731
<NuxtLink

‎apps/atrium-telegram/app/pages/navigation.vue‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
<template>
22
<PageContainer>
3-
<h1 class="text-2xl/6 font-bold tracking-tight">
4-
В работе
5-
</h1>
3+
<SectionTitle title="В работе" />
64
</PageContainer>
75
</template>

0 commit comments

Comments
 (0)