Có lỗi xảy ra trong quá trình xử lý biểu mẫu.
Can't convert this string to number: ""
The blamed expression:
==> folderId?number [in template "37610#37640#1003484" at line 179, column 75]
----
FTL stack trace ("~" means nesting-related):
- Failed at: #assign files = DLFileEntryLocalServi... [in template "37610#37640#1003484" at line 179, column 5]
----
1<style>
2 * { box-sizing: border-box; margin: 0; padding: 0; }
3 .slider-container {
4 position: relative;
5 /*max-width: 1119px;*/
6 margin: auto;
7 overflow: hidden;
8 }
9 .wrap-slider {
10 /* max-width: 1200px; */
11 margin: auto;
12 position: relative;
13 padding: 0 2.5rem;
14 }
15 .slides {
16 display: flex;
17 transition: transform 0.5s ease-in-out;
18 /*max-height: 600px;*/
19 }
20 .slide { min-width: 100%; }
21 .slide img { width: 100%; display: block; }
22 .prev, .next {
23 position: absolute; top: 50%; transform: translateY(-50%);
24 background: rgba(0, 0, 0, 0.5); color: white;
25 border: none; cursor: pointer; padding: 10px; font-size: 20px;
26 }
27 .prev { left: 10px; }
28 .next { right: 10px; }
29 .thumbnails {
30 display: flex;
31 /*justify-content: center;*/
32 margin-top: 10px;
33 overflow: auto;
34 scrollbar-width: thin;
35 }
36 .thumbnail {
37 width: 80px;
38 /*margin: 0 5px; */
39 margin-right: 1rem;
40 cursor: pointer;
41 opacity: 0.8;
42 }
43 .thumbnail.active {
44 border: 2px solid #DE6F18;
45 opacity: 1;
46 }
47
48 .prev-1, .next-2 {
49 position: absolute;
50 top: 50%;
51 transform: translateY(-50%);
52 /*background: rgb(65 62 62 / 16%);*/
53 color: white;
54 /*border: 1px solid #ACB0B3;*/
55 cursor: pointer;
56 padding: 0px 12px;
57 font-size: 20px;
58 border-radius: 50%;
59 border: 1px solid #DE6F18;
60 background: #e5ad81bd;
61 }
62 .prev-1:hover, .next-2:hover {
63 border: 1px solid #DE6F18;
64 background: #e5ad81bd;
65 }
66
67 .prev-1 svg path, .next-2 svg path {
68 fill: #DE6F18;
69 }
70
71 .prev-1 { left: 0px; }
72 .next-2 { right: 0px; }
73
74 .next-2 > svg, .prev-1 > svg {
75 height: 20px;
76 vertical-align: middle;
77 }
78
79 .main-image {
80 width: 100%;
81 aspect-ratio: 16 / 8;
82 border-top-left-radius: 10px;
83 border-top-right-radius: 10px;
84 }
85
86 .ct-thumbnail-small {
87 /*width: 170px;*/
88 width: 100%;
89 aspect-ratio: 16 / 10;
90 border-radius: 10px;
91 }
92 .ct-thumbnail-small:last-child {
93 margin-right: 0;
94 }
95
96 @media (max-width: 576px) {
97 .thumbnails {
98 display: none;
99 }
100
101 .main-image {
102 aspect-ratio: 16 / 9;
103 border-radius: 10px;
104 }
105 }
106
107 .bg-second {
108 background: linear-gradient(180deg, #c4ebf1 10%, #EFFDFF 100%), linear-gradient(180deg, #F0FDFF 0%, rgba(255, 255, 255, 0) 18%);
109 box-shadow: 0px 4px 8px 0px #00000040;
110 }
111
112 .bg-wrapper-image {
113 background-image: linear-gradient(rgb(255 255 255 / 76%), rgb(255 255 255 / 62%)), url(/documents/37638/39612/bg-waves.png);
114 background-position-y: center;
115 background-size: cover;
116 }
117
118</style>
119
120<style>
121 .breadcrumb-default-steps:not([href]):hover {
122 color: #5F676D;
123 text-decoration: none;
124 }
125
126 .breadcrumb-default-steps {
127 margin-top: 30px;
128 font-size: 16px;
129 font-weight: 700;
130 line-height: 22.4px;
131 letter-spacing: 0.0015em;
132 color: #424242;
133 }
134
135 .breadcrumb-default-steps.active {
136 display: inline !important;
137 color: rgba(13, 76, 146, 1);
138 }
139
140 @media only screen and (min-width: 1024px) {
141 .breadcrumb-default {
142 margin-top: 4px !important;
143 }
144 }
145
146 @media only screen and (min-width: 577px) and (max-width: 767px) {
147 .breadcrumb-default {
148 margin-top: 11px !important;
149 }
150 }
151
152 @media only screen and (max-width: 576px) {
153 .breadcrumb-default {
154 margin-top: 68px !important;
155 }
156 }
157
158 @media only screen and (max-width: 540px) {
159 .breadcrumb-default {
160 margin-top: 35px !important;
161 }
162 }
163
164 .ct-folder-name {
165 text-transform: uppercase;
166 }
167</style>
168
169
170<#assign DLFolderLocalService = serviceLocator.findService("com.liferay.document.library.kernel.service.DLFolderLocalService") />
171<#assign DLFileEntryLocalService = serviceLocator.findService("com.liferay.document.library.kernel.service.DLFileEntryLocalService") />
172<#assign repositoryId = themeDisplay.getScopeGroupId() />
173<#assign folderId = request.getParameter("getFolderId")! />
174<#assign currentUrl = themeDisplay.getURLCurrent() />
175
176<#if !currentUrl?contains("/chi-tiet-hinh-anh")>
177 <#assign files = DLFileEntryLocalService.getFileEntries(repositoryId, 972560) />
178<#else>
179 <#assign files = DLFileEntryLocalService.getFileEntries(repositoryId, folderId?number) />
180</#if>
181
182<#--<#assign files = DLFileEntryLocalService.getFileEntries(repositoryId, folderId?number) />-->
183<#assign imgUrl = "/documents/37638/972300/dng-trencao.jpg" />
184<#assign indexFile = 0 />
185
186<div class="container my-3">
187 <div class="breadcrumb-default">
188 <a class="breadcrumb-default-steps" href="/">TRANG CHỦ</a>
189 <a href="https://cttdt.danangportal.gov.vn/web/dng/da-phuong-tien" class="breadcrumb-default-steps"> / ĐA PHƯƠNG TIỆN</a>
190 <a href="https://cttdt.danangportal.gov.vn/web/dng/hinh-anh" class="breadcrumb-default-steps"> / HÌNH ẢNH /</a>
191 <a href="https://cttdt.danangportal.gov.vn/web/dng/test-chi-tiet" class="breadcrumb-default-steps active ct-folder-name"> / TEST-CHI-TIET</a>
192 </div>
193</div>
194<div class="bg-second">
195 <div class="bg-wrapper-image">
196 <div class="container py-3 py-lg-4">
197 <div class="wrap-slider">
198 <div class="slider-container">
199 <div class="slides">
200 <#if files?has_content>
201 <#list files as file >
202 <#assign firstFile = file />
203 <#if firstFile??>
204 <#if !currentUrl?contains("/chi-tiet-hinh-anh")>
205 <#assign folderIdUrl = 972560 />
206 <#else>
207 <#assign folderIdUrl = folderId?number />
208 </#if>
209 <#assign imgUrl = "/documents/" + repositoryId + "/" + folderIdUrl + "/" + firstFile.getFileName() />
210 <div class="slide"><img src="${imgUrl}" alt="Slide 1" class="main-image <#if indexFile == 0>active</#if>" style=""></div>
211 <#assign indexFile = indexFile + 1 />
212 </#if>
213 </#list>
214 </#if>
215 </div>
216 </div>
217 <button class="prev-1" onclick="moveSlide(-1)"><svg width="9" height="15" viewBox="0 0 9 15" fill="none" xmlns="http://www.w3.org/2000/svg">
218 <path d="M8.00955 0.624839C8.11859 0.736456 8.17963 0.886302 8.17963 1.04234C8.17963 1.19838 8.11859 1.34822 8.00955 1.45984L1.9183 7.70859L8.00955 13.9561C8.11859 14.0677 8.17963 14.2175 8.17963 14.3736C8.17963 14.5296 8.11859 14.6795 8.00955 14.7911C7.95655 14.8455 7.89319 14.8888 7.8232 14.9183C7.75321 14.9479 7.67802 14.9631 7.60205 14.9631C7.52608 14.9631 7.45088 14.9479 7.38089 14.9183C7.31091 14.8888 7.24754 14.8455 7.19455 14.7911L0.71705 8.14484C0.603282 8.02812 0.53961 7.87158 0.53961 7.70859C0.53961 7.5456 0.603282 7.38905 0.71705 7.27234L7.19455 0.626089C7.24754 0.57166 7.31091 0.528399 7.38089 0.49886C7.45088 0.46932 7.52608 0.454102 7.60205 0.454102C7.67802 0.454102 7.75321 0.46932 7.8232 0.49886C7.89319 0.528399 7.95655 0.57166 8.00955 0.626089V0.624839Z" fill="#ACB0B3"></path>
219 </svg></button>
220 <button class="next-2" onclick="moveSlide(1)"><svg width="9" height="15" viewBox="0 0 9 15" fill="none" xmlns="http://www.w3.org/2000/svg">
221 <path d="M0.990516 0.624839C0.881479 0.736456 0.820435 0.886302 0.820435 1.04234C0.820435 1.19838 0.881479 1.34822 0.990516 1.45984L7.08177 7.70859L0.990516 13.9561C0.881479 14.0677 0.820435 14.2175 0.820435 14.3736C0.820435 14.5296 0.881479 14.6795 0.990516 14.7911C1.04351 14.8455 1.10687 14.8888 1.17686 14.9183C1.24685 14.9479 1.32205 14.9631 1.39802 14.9631C1.47398 14.9631 1.54918 14.9479 1.61917 14.9183C1.68916 14.8888 1.75252 14.8455 1.80552 14.7911L8.28302 8.14484C8.39678 8.02812 8.46045 7.87158 8.46045 7.70859C8.46045 7.5456 8.39678 7.38905 8.28302 7.27234L1.80552 0.626089C1.75252 0.57166 1.68916 0.528399 1.61917 0.49886C1.54918 0.46932 1.47398 0.454102 1.39802 0.454102C1.32205 0.454102 1.24685 0.46932 1.17686 0.49886C1.10687 0.528399 1.04351 0.57166 0.990516 0.626089V0.624839Z" fill="#ACB0B3"></path>
222 </svg></button>
223 <div class="thumbnails row">
224 <#assign indexFileSmall = 0 />
225 <#if files?has_content>
226 <#list files as file >
227 <#assign firstFile = file />
228 <#if !currentUrl?contains("/chi-tiet-hinh-anh")>
229 <#assign folderIdSmall = 972560 />
230 <#else>
231 <#assign folderIdSmall = folderId?number />
232 </#if>
233 <#assign imgUrl = "/documents/" + repositoryId + "/" + folderIdSmall + "/" + firstFile.getFileName() />
234 <#if indexFileSmall < 6>
235 <div class="col-2 px px-md-1 px-lg-3">
236 <img class="thumbnail ct-thumbnail-small" src="${imgUrl}" onclick="currentSlide(${indexFileSmall})">
237 </div>
238 </#if>
239 <#assign indexFileSmall = indexFileSmall + 1 />
240 </#list>
241 </#if>
242 </div>
243 </div>
244 </div>
245 </div>
246</div>
247
248<script>
249
250 (function() {
251 let url = window.location.href;
252
253 if(url) {
254 const params = new URLSearchParams(url.split("?")[1]);
255 var el = document.querySelector('.ct-folder-name');
256 if (el && params) {
257 el.innerHTML = params.get("folderName")
258 }
259 }
260 })();
261
262 (function() {
263 var el = document.querySelector('.thumbnails');
264
265 if (el) {
266 function updateClassThumbnails() {
267 var width = window.innerWidth;
268 if (576 < width && width < 992) {
269 el.classList.add('mx-auto');
270 } else {
271 el.classList.remove('mx-auto');
272 }
273 }
274
275 updateClassThumbnails();
276 window.addEventListener('resize', updateClassThumbnails);
277 }
278 })();
279</script>
280
281<script>
282 let index = 0;
283 const slides = document.querySelector(".slides");
284 const totalSlides = document.querySelectorAll(".slide").length;
285 const thumbnails = document.querySelectorAll(".thumbnail");
286 let mainImages = document.querySelectorAll('.slide');
287 function moveSlide(step) {
288 index = (index + step + totalSlides) % totalSlides;
289 updateSlider();
290 }
291 function currentSlide(n) {
292 index = n;
293 updateSlider();
294 }
295 function updateSlider() {
296 slides.style.transform = "translateX(-" + (index * 100) + "%)";
297 thumbnails.forEach(t => t.classList.remove("active"));
298 thumbnails[index].classList.add("active");
299
300 mainImages.forEach(img => img.classList.remove('active'));
301 mainImages[index].classList.add('active');
302 }
303</script>
