Skip to content

Commit 6640f8b

Browse files
jiyuujinjiyuujin
committed
add share_image_url to public.sponsors
1 parent b4f7eba commit 6640f8b

File tree

15 files changed

+315
-33
lines changed

15 files changed

+315
-33
lines changed

‎apps/web/app/components/admin/SponsorItem.vue

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ const newSponsor = ref({
2020
name: props.sponsor?.name ?? '',
2121
detail_page_id: props.sponsor?.detail_page_id ?? '',
2222
image_url: props.sponsor?.image_url ?? '',
23+
share_image_url: props.sponsor?.share_image_url ?? '',
2324
description_ja: props.sponsor?.description_ja ?? '',
2425
description_en: props.sponsor?.description_en ?? '',
2526
link_url: props.sponsor?.link_url ?? '',
@@ -48,6 +49,18 @@ const checkFiles = async (files: File[]) => {
4849
4950
newSponsor.value.image_url = getFullAvatarUrl(filePath)
5051
}
52+
const checkShareFiles = async (files: File[]) => {
53+
if (files.length === 0) return
54+
55+
const file = files[0]
56+
// const filename = file.name
57+
const fileExt = file.name.split('.').pop()
58+
const filePath = `/${Math.random()}.${fileExt}`
59+
60+
uploadAvatar(filePath, file)
61+
62+
newSponsor.value.share_image_url = getFullAvatarUrl(filePath)
63+
}
5164
const updateDescriptionJa = (e: any) => {
5265
newSponsor.value.description_ja = e.target.value
5366
}
@@ -99,9 +112,23 @@ const onSubmit = () => {
99112
height="60"
100113
decoding="async"
101114
/>
102-
<p>Drag & drop a file</p>
115+
<p>Drag & drop an image file</p>
116+
<p>または</p>
117+
<p>Select an image file</p>
118+
</div>
119+
</VFDragDropArea>
120+
<VFDragDropArea file-name="profiledata" file-accept="image/*" @check-files="checkShareFiles">
121+
<div class="upload">
122+
<img
123+
v-if="newSponsor.share_image_url"
124+
alt=""
125+
:src="newSponsor.share_image_url"
126+
height="60"
127+
decoding="async"
128+
/>
129+
<p>Drag & drop a share image file</p>
103130
<p>または</p>
104-
<p>Select a file</p>
131+
<p>Select a share image file</p>
105132
</div>
106133
</VFDragDropArea>
107134
<VFTextAreaField

‎apps/web/app/components/admin/SponsorList.vue

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ const handleDialog = (id?: string) => {
2525
<th>name</th>
2626
<th>detail_page_id</th>
2727
<th>image_url</th>
28+
<th>share_image_url</th>
2829
<th>description</th>
2930
<th>link_url</th>
3031
<th>speaker_id</th>
@@ -47,6 +48,19 @@ const handleDialog = (id?: string) => {
4748
No image
4849
</p>
4950
</td>
51+
<td>
52+
<img
53+
v-if="sponsor.share_image_url"
54+
alt=""
55+
:src="sponsor.share_image_url"
56+
width="60"
57+
height="60"
58+
decoding="async"
59+
/>
60+
<p v-if="!sponsor.share_image_url">
61+
No share image
62+
</p>
63+
</td>
5064
<td>
5165
<p>{{ sponsor.description_ja }}</p>
5266
<p>{{ sponsor.description_en }}</p>

‎apps/web/app/content/ja/namecard_annotation_order_number.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
※注文番号は、チケット購入時にPeatixから送信されるメール内に含まれる[領収データ](https://help-attendee.peatix.com/ja-JP/support/solutions/articles/44001821741)から確認できます。
1+
※注文番号は、チケット購入時に Peatix から送信されるメール内に含まれる[領収データ](https://help-attendee.peatix.com/ja-JP/support/solutions/articles/44001821741)から確認できます。

‎apps/web/app/pages/namecard/[id]/edit/complete.vue

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -44,13 +44,13 @@ const { authUserId, statusKey, attendee } = await useNamecard()
4444
can-hover
4545
class="sns-button"
4646
/>
47-
<!-- TODO facebook追加 -->
48-
<!-- <VFIconButton
49-
class="sns-button"
50-
name="facebook"
47+
<VFIconButton
48+
name="Facebook"
49+
color="black"
5150
:href="`/namecard/${authUserId}/share/`"
5251
can-hover
53-
/> -->
52+
class="sns-button"
53+
/>
5454
</div>
5555
<CreationStatus :status-key="statusKey" size="small" class="creation-status" />
5656
<!-- TODO 24に置き換え&smallサイズ指定 -->

‎apps/web/app/pages/namecard/[id]/share.vue

Lines changed: 22 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -50,11 +50,16 @@ useHead({
5050
>{{ t('official_site') }}</VFLinkButton
5151
>
5252
<VFComment class="share-namecard" :title="t('share_namecard')" />
53-
<!-- TODO snsアイコン&リンク設置 -->
5453
<ul class="sns-list">
55-
<li>x</li>
56-
<li>facebook</li>
57-
<li>copy</li>
54+
<li>
55+
<VFIcon color="vue-blue" name="x40" />
56+
</li>
57+
<li>
58+
<VFIcon color="vue-blue" name="Facebook" />
59+
</li>
60+
<li>
61+
<VFIcon color="vue-blue" name="external" :can-hover="false" />
62+
</li>
5863
</ul>
5964
</div>
6065
</template>
@@ -72,7 +77,8 @@ useHead({
7277
max-width: 960px;
7378
margin: 0 auto calc(var(--unit) * 7.5);
7479
}
75-
.invite-comment {
80+
.invite-comment,
81+
.share-session {
7682
margin: 0 auto calc(var(--unit) * 2.5);
7783
}
7884
.link-button {
@@ -86,4 +92,15 @@ useHead({
8692
border-radius: var(--height-button);
8793
margin: 0 auto calc(var(--unit) * 7.5);
8894
}
95+
.sns-list {
96+
display: flex;
97+
justify-content: center;
98+
gap: calc(var(--unit) * 2.5);
99+
padding: 0;
100+
margin: 0;
101+
}
102+
.sns-list li {
103+
padding: 0;
104+
margin: 0;
105+
}
89106
</style>

‎apps/web/app/pages/sessions/[id]/share.vue

Lines changed: 114 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,114 @@
1-
<script setup lang="ts"></script>
2-
<template></template>
1+
<script setup lang="ts">
2+
import { createError, useAsyncData, useHead, useLocaleCurrent, useRoute, useSupabase } from '#imports'
3+
import { conferenceTitle, linkUrl, ogSpeakerDescription } from '~/utils/constants'
4+
import { generalOg, twitterOg } from '~/utils/og.constants'
5+
import type { Speaker } from '@vuejs-jp/model'
6+
7+
const route = useRoute()
8+
const id = route.params.id as string
9+
10+
const { fetchData } = useSupabase()
11+
const { data: speakers } = await useAsyncData('speakers', async () => {
12+
return await fetchData('speakers', { detailPageId: id })
13+
})
14+
const speakerData = speakers.value?.data as Speaker[]
15+
if (!speakerData) {
16+
throw createError({ statusCode: 404, statusMessage: 'Speaker not found' })
17+
}
18+
19+
if (!speakerData[0].detail_page_id) {
20+
throw createError({ statusCode: 404, statusMessage: 'Speaker not found' })
21+
}
22+
23+
const currentLocale = useLocaleCurrent().locale
24+
25+
useHead({
26+
titleTemplate: (titleChunk) => `${conferenceTitle}`,
27+
meta: [
28+
...generalOg({
29+
title: `${conferenceTitle}`,
30+
description: ogSpeakerDescription,
31+
url: `${linkUrl}sessions/${id}/share`,
32+
}),
33+
...twitterOg({
34+
title: `${conferenceTitle}`,
35+
description: ogSpeakerDescription,
36+
url: `${linkUrl}sessions/${id}/share`,
37+
}),
38+
],
39+
})
40+
</script>
41+
<template>
42+
<div class="session-share-root">
43+
<VFOgCard23
44+
class="session"
45+
:user="{
46+
name: speakerData[0].name_ja,
47+
avatar_url: speakerData[0].image_url,
48+
role: 'speaker',
49+
}"
50+
/>
51+
<VFComment class="invite-comment" :title="$t('invite_vue_fes')" />
52+
<VFLinkButton
53+
class="link-button"
54+
:href="currentLocale === 'ja' ? linkUrl : `${linkUrl}/en`"
55+
background-color="vue-green/200"
56+
color="white"
57+
>
58+
{{ $t('official_site') }}
59+
</VFLinkButton>
60+
<VFComment class="share-session" :title="$t('share_namecard')" />
61+
<ul class="sns-list">
62+
<li>
63+
<VFIcon color="vue-blue" name="x40" />
64+
</li>
65+
<li>
66+
<VFIcon color="vue-blue" name="Facebook" />
67+
</li>
68+
<li>
69+
<VFIcon color="vue-blue" name="external" :can-hover="false" />
70+
</li>
71+
</ul>
72+
</div>
73+
</template>
74+
75+
<style scoped>
76+
.session-share-root {
77+
--header-height: calc(var(--unit) * 10);
78+
--content-padding: calc(var(--unit) * 15);
79+
padding-top: calc(var(--header-height) + var(--content-padding));
80+
padding-bottom: var(--content-padding);
81+
max-width: 960px;
82+
margin: 0 auto;
83+
}
84+
.session {
85+
max-width: 960px;
86+
margin: 0 auto calc(var(--unit) * 7.5);
87+
}
88+
.invite-comment,
89+
.share-session {
90+
margin: 0 auto calc(var(--unit) * 2.5);
91+
}
92+
.link-button {
93+
--height-button: 66px;
94+
95+
display: flex;
96+
justify-content: center;
97+
align-items: center;
98+
width: 400px;
99+
height: var(--height-button);
100+
border-radius: var(--height-button);
101+
margin: 0 auto calc(var(--unit) * 7.5);
102+
}
103+
.sns-list {
104+
display: flex;
105+
justify-content: center;
106+
gap: calc(var(--unit) * 2.5);
107+
padding: 0;
108+
margin: 0;
109+
}
110+
.sns-list li {
111+
padding: 0;
112+
margin: 0;
113+
}
114+
</style>

‎apps/web/app/pages/sponsors/[id]/share.vue

Lines changed: 114 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,114 @@
1-
<script setup lang="ts"></script>
2-
<template></template>
1+
<script setup lang="ts">
2+
import { createError, useAsyncData, useHead, useLocaleCurrent, useRoute, useSupabase } from '#imports'
3+
import { conferenceTitle, linkUrl, ogSponsorDescription } from '~/utils/constants'
4+
import { generalOg, twitterOg } from '~/utils/og.constants'
5+
import type { Sponsor } from '@vuejs-jp/model'
6+
7+
const route = useRoute()
8+
const id = route.params.id as string
9+
10+
const { fetchData } = useSupabase()
11+
const { data: sponsors } = await useAsyncData('sponsors', async () => {
12+
return await fetchData('sponsors', { detailPageId: id })
13+
})
14+
const sponsorData = sponsors.value?.data as Sponsor[]
15+
if (!sponsorData) {
16+
throw createError({ statusCode: 404, statusMessage: 'Sponsor not found' })
17+
}
18+
19+
if (!sponsorData[0].detail_page_id) {
20+
throw createError({ statusCode: 404, statusMessage: 'Sponsor not found' })
21+
}
22+
23+
const currentLocale = useLocaleCurrent().locale
24+
25+
useHead({
26+
titleTemplate: (titleChunk) => `${conferenceTitle}`,
27+
meta: [
28+
...generalOg({
29+
title: `${conferenceTitle}`,
30+
description: ogSponsorDescription,
31+
url: `${linkUrl}sponsors/${id}/share`,
32+
}),
33+
...twitterOg({
34+
title: `${conferenceTitle}`,
35+
description: ogSponsorDescription,
36+
url: `${linkUrl}sponsors/${id}/share`,
37+
}),
38+
],
39+
})
40+
</script>
41+
<template>
42+
<div class="session-share-root">
43+
<VFOgCard23
44+
class="session"
45+
:user="{
46+
name: sponsorData[0].name,
47+
avatar_url: sponsorData[0].share_image_url,
48+
role: 'sponsor',
49+
}"
50+
/>
51+
<VFComment class="invite-comment" :title="$t('invite_vue_fes')" />
52+
<VFLinkButton
53+
class="link-button"
54+
:href="currentLocale === 'ja' ? linkUrl : `${linkUrl}/en`"
55+
background-color="vue-green/200"
56+
color="white"
57+
>
58+
{{ $t('official_site') }}
59+
</VFLinkButton>
60+
<VFComment class="share-session" :title="$t('share_namecard')" />
61+
<ul class="sns-list">
62+
<li>
63+
<VFIcon color="vue-blue" name="x40" />
64+
</li>
65+
<li>
66+
<VFIcon color="vue-blue" name="Facebook" />
67+
</li>
68+
<li>
69+
<VFIcon color="vue-blue" name="external" :can-hover="false" />
70+
</li>
71+
</ul>
72+
</div>
73+
</template>
74+
75+
<style scoped>
76+
.session-share-root {
77+
--header-height: calc(var(--unit) * 10);
78+
--content-padding: calc(var(--unit) * 15);
79+
padding-top: calc(var(--header-height) + var(--content-padding));
80+
padding-bottom: var(--content-padding);
81+
max-width: 960px;
82+
margin: 0 auto;
83+
}
84+
.session {
85+
max-width: 960px;
86+
margin: 0 auto calc(var(--unit) * 7.5);
87+
}
88+
.invite-comment,
89+
.share-session {
90+
margin: 0 auto calc(var(--unit) * 2.5);
91+
}
92+
.link-button {
93+
--height-button: 66px;
94+
95+
display: flex;
96+
justify-content: center;
97+
align-items: center;
98+
width: 400px;
99+
height: var(--height-button);
100+
border-radius: var(--height-button);
101+
margin: 0 auto calc(var(--unit) * 7.5);
102+
}
103+
.sns-list {
104+
display: flex;
105+
justify-content: center;
106+
gap: calc(var(--unit) * 2.5);
107+
padding: 0;
108+
margin: 0;
109+
}
110+
.sns-list li {
111+
padding: 0;
112+
margin: 0;
113+
}
114+
</style>

0 commit comments

Comments
 (0)