1
1
<script setup lang="ts">
2
- import { createError , useAsyncData , useHead , useRoute , useRuntimeConfig } from ' #imports'
2
+ import {
3
+ createError ,
4
+ useAsyncData ,
5
+ useHead ,
6
+ useRoute ,
7
+ useRuntimeConfig ,
8
+ usePathWithLocale ,
9
+ } from ' #imports'
3
10
import type { Speaker } from ' @vuejs-jp/model'
4
11
import { useLocaleCurrent } from ' ~/composables/useLocaleCurrent'
5
12
import { useSupabase } from ' ~/composables/useSupabase'
@@ -28,6 +35,7 @@ if (!speakerData[0].detail_page_id) {
28
35
const { range } = useRange ()
29
36
const { color, trackName } = useSession ()
30
37
const currentLocale = useLocaleCurrent ().locale
38
+ const pathWithLocale = usePathWithLocale ()
31
39
32
40
useHead ({
33
41
titleTemplate : (titleChunk ) => ` ${speakerData [0 ].session_title_ja } | ${conferenceTitle } ` ,
@@ -53,16 +61,30 @@ useHead({
53
61
<div class =" session-detail" >
54
62
<div class =" session-detail-body" >
55
63
<div class =" detailbody-tags" >
56
- <VFTag :label =" trackName(speakerData[0].session_place)" :background =" color(speakerData[0].session_place)" />
57
- <VFTag :label =" range(speakerData[0].session_time_from, speakerData[0].session_time_duration)" background =" vue-green/200" />
64
+ <VFTag
65
+ :label =" trackName(speakerData[0].session_place)"
66
+ :background =" color(speakerData[0].session_place)"
67
+ />
68
+ <VFTag
69
+ :label =" range(speakerData[0].session_time_from, speakerData[0].session_time_duration)"
70
+ background =" vue-green/200"
71
+ />
58
72
</div >
59
73
60
74
<VFTitle id =" session-detail" class =" detailbody-title" >
61
- {{ currentLocale === 'ja' ? (speakerData[0].session_title_ja ?? 'TBD') : (speakerData[0].session_title_en ?? 'TBD') }}
75
+ {{
76
+ currentLocale === 'ja'
77
+ ? speakerData[0].session_title_ja ?? 'TBD'
78
+ : speakerData[0].session_title_en ?? 'TBD'
79
+ }}
62
80
</VFTitle >
63
81
64
82
<div class =" detailbody-explain" >
65
- {{ currentLocale === 'ja' ? (speakerData[0].session_description_ja ?? 'TBD') : (speakerData[0].session_description_en ?? 'TBD') }}
83
+ {{
84
+ currentLocale === 'ja'
85
+ ? speakerData[0].session_description_ja ?? 'TBD'
86
+ : speakerData[0].session_description_en ?? 'TBD'
87
+ }}
66
88
</div >
67
89
68
90
<div v-if =" speakerData[0].session_doc_url" class =" detailbody-archives" >
@@ -73,22 +95,30 @@ useHead({
73
95
color =" vue-blue"
74
96
class =" detailbody-archive-slide"
75
97
>
76
- {{ currentLocale === 'ja' ? speakerData[0].session_doc_title_ja : speakerData[0].session_doc_title_en }}
98
+ {{
99
+ currentLocale === 'ja'
100
+ ? speakerData[0].session_doc_title_ja
101
+ : speakerData[0].session_doc_title_en
102
+ }}
77
103
</VFTextLink >
78
104
</div >
79
105
80
106
<div class =" detailbody-persons" >
81
107
<VFSpeaker
82
108
:image =" speakerData[0].image_url"
83
109
:company =" currentLocale === 'en' ? speakerData[0].company_en : speakerData[0].company_ja"
84
- :division =" currentLocale === 'en' ? speakerData[0].position_en : speakerData[0].position_ja"
110
+ :division ="
111
+ currentLocale === 'en' ? speakerData[0].position_en : speakerData[0].position_ja
112
+ "
85
113
:name =" currentLocale === 'en' ? speakerData[0].name_en : speakerData[0].name_ja"
86
114
:github-id =" speakerData[0].github_id"
87
115
:x-id =" speakerData[0].x_id"
88
116
loading =" eager"
89
117
/>
90
118
<div class =" person-info" >
91
- {{ currentLocale === 'ja' ? speakerData[0].description_ja : speakerData[0].description_en }}
119
+ {{
120
+ currentLocale === 'ja' ? speakerData[0].description_ja : speakerData[0].description_en
121
+ }}
92
122
</div >
93
123
</div >
94
124
@@ -98,7 +128,7 @@ useHead({
98
128
background-color =" white"
99
129
color =" vue-blue"
100
130
target =" "
101
- :href =" currentLocale === 'ja' ? '/' : `${currentLocale}/` "
131
+ :href =" pathWithLocale('/') "
102
132
>
103
133
{{ $t('back_to_top') }}
104
134
</VFLinkButton >
@@ -124,7 +154,7 @@ useHead({
124
154
}
125
155
126
156
&:before {
127
- content : " " ;
157
+ content : ' ' ;
128
158
position : absolute ;
129
159
display : block ;
130
160
bottom : 0 ;
@@ -151,7 +181,7 @@ useHead({
151
181
152
182
@media (--tablet ) {
153
183
padding : 20px 0 60px ;
154
- max-width : 100%
184
+ max-width : 100% ;
155
185
}
156
186
157
187
.detailbody-title {
0 commit comments