11
11
class =" relative object-cover h-[180px]"
12
12
/>
13
13
</figure >
14
+ <div
15
+ v-if =" dateFromLink!=='' && showDetails"
16
+ class =" absolute right-2 bg-primary text-primary-content text-xs font-semibold px-2 py-1 rounded-full shadow-md"
17
+ >
18
+ {{ dateFromLink || '-' }}
19
+ </div >
14
20
<div
15
21
v-if =" !showDetails"
16
22
class =" card-body"
@@ -120,8 +126,8 @@ const props = defineProps({
120
126
desktopId: { type: String , required: true },
121
127
desktopData: { type: Object , required: true },
122
128
isoData: { type: Object , required: true },
123
- showDetails: { type: Boolean , required: true } } ,
124
- )
129
+ showDetails: { type: Boolean , required: true },
130
+ } )
125
131
const emit = defineEmits ([' details-toggled' ])
126
132
127
133
function getDownloadLink() {
@@ -133,6 +139,7 @@ function getDownloadLink() {
133
139
134
140
const showDetailsRef = ref (props .showDetails )
135
141
const fullImage = ref (true )
142
+ const dateFromLink = ref (' ' )
136
143
137
144
const enableDetails = () => {
138
145
showDetailsRef .value = true
@@ -156,4 +163,26 @@ const getDetailEntry = (entry: string) => {
156
163
}
157
164
return props .isoData [entry ]
158
165
}
166
+
167
+ if (props .isoData ?.image ) {
168
+ const datePattern = / (\d {6} )/
169
+ const match = props .isoData .image .match (datePattern )
170
+
171
+ if (match ) {
172
+ const dateStr = match [1 ]
173
+ const year = parseInt (dateStr .slice (0 , 2 ), 10 )
174
+ const month = parseInt (dateStr .slice (2 , 4 ), 10 ) - 1
175
+ const day = parseInt (dateStr .slice (4 , 6 ), 10 )
176
+
177
+ const dateObj = new Date (2000 + year , month , day )
178
+
179
+ const options: Intl .DateTimeFormatOptions = {
180
+ year: ' numeric' ,
181
+ month: ' long' ,
182
+ day: ' numeric' ,
183
+ }
184
+
185
+ dateFromLink .value = dateObj .toLocaleDateString (undefined , options )
186
+ }
187
+ }
159
188
</script >
0 commit comments