State bank of vietnam portal
the state bank of viet nam
In the coming period, the banking sector will continue to implement cross-sectoral cooperation: integrating, connecting, and sharing information between the banking sector and other industries to expand the digital ecosystem and develop digital banking and payment services. This will help form an interconnected digital ecosystem, creating favorable conditions for people and businesses to access services quickly, safely, and effectively.
To promote cross-border payment connectivity within the region and globally, and to meet the needs of individuals and businesses for fast, secure, and convenient transactions, it is necessary to establish a comprehensive legal framework, synchronized modern technical infrastructure, sustainable and secure payment technology platforms, and stronger inter-sectoral coordination and international cooperation.
.jpg)
CPI 
The following has evaluated to null or missing:
==> years[0] [in template "29795641980326#20120#1168319" at line 64, column 29]
----
Tip: It's the final [] step that caused this error, not those before it.
----
Tip: If the failing expression is known to legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: #assign selectedYear = years[0] [in template "29795641980326#20120#1168319" at line 64, column 5]
----
1<#assign currentURL = themeDisplay.getURLCurrent()?lower_case />
2<#if entries?has_content>
3
4<#assign yearNow = .now?string("yyyy") />
5
6<#assign processed = [] />
7<#assign monthMap = {} />
8
9<#list entries as entry>
10
11 <#assign renderer = entry.getAssetRenderer() />
12 <#assign ddm = renderer.getDDMFormValuesReader().getDDMFormValues().getDDMFormFieldValuesMap() />
13
14 <#if ddm["Date62813077"]?has_content>
15
16 <#assign raw = ddm["Date62813077"][0].getValue().getString(locale) />
17 <#assign dt = raw?date("yyyy-MM-dd") />
18
19 <#assign monthKey = dt?string("MM/yyyy") />
20 <#assign yearKey = dt?string("yyyy") />
21
22 <#-- mỗi tháng chỉ lấy 1 record -->
23 <#if !monthMap[monthKey]??>
24
25 <#assign processed = processed + [{
26 "entry" : entry,
27 "date" : dt,
28 "year" : yearKey
29 }] />
30
31 <#assign monthMap = monthMap + {monthKey : true} />
32
33 </#if>
34
35 </#if>
36
37</#list>
38
39<#-- sort theo ngày -->
40<#assign processed = processed?sort_by("date") />
41
42<#-- ================= GROUP THEO NĂM ================= -->
43<#assign dataByYear = {} />
44
45<#list processed as item>
46
47 <#assign y = item.year />
48
49 <#if !dataByYear[y]??>
50 <#assign dataByYear = dataByYear + {y : []} />
51 </#if>
52
53 <#assign dataByYear = dataByYear + {y : dataByYear[y] + [item]} />
54
55</#list>
56
57<#-- ================= CHỌN NĂM ================= -->
58
59<#assign selectedYear = yearNow />
60
61<#if !dataByYear[selectedYear]??>
62
63 <#assign years = dataByYear?keys?sort?reverse />
64 <#assign selectedYear = years[0] />
65
66</#if>
67
68
69<#assign finalData = dataByYear[selectedYear]?sort_by("date") />
70
71<#-- chỉ lấy 12 tháng -->
72<#assign size = finalData?size />
73<#if size gt 12>
74 <#assign finalData = finalData[(size-12)..] />
75</#if>
76
77<#-- gán lại cho chart -->
78<#assign entries = finalData?map(x -> x.entry) />
79<#assign dataChart = entries />
80
81
82 <div class="max-[1170px]:w-[calc(100%/2-12px)] max-[768px]:w-[calc(100%/2-4px)] max-[768px]:p-2 max-[650px]:w-full max-[650px]:px-0 sbv-chart">
83 <div class="flex flex-col space-y-[4px] mb-3">
84
85 <#if currentURL?contains("/vi/")>
86 <a href="/vi/du-no-tin-dung-doi-voi-nen-kt-dttktt" class="text-[#000000] text-[20px] leading-[1.15] font-bold uppercase">
87 Dư nợ tín dụng đối với nền kinh tế - thể hiện tốc độ tăng giảm
88 </a>
89 <#else>
90 <a href="https://dttktt.sbv.gov.vn/webcenter/portal/en/home/sbv/statistic/ctte" class="text-[#000000] text-[20px] leading-[1.15] font-bold uppercase">
91 Outstanding credit to the economy - showing the growth or decline rate
92 </a>
93 </#if>
94 </div>
95 <div class="w-[370px] h-[270px] max-[1170px]:w-full max-[1170px]:h-[370px] bg-white p-1">
96 <!-- Bar chart would be rendered here -->
97 <canvas id="statChart1" width="400" height="300"></canvas>
98 </div>
99 <div class="text-end mt-2">
100 <span class="text-[#9D1B43] rounded-full flex justify-start items-center space-x-[6px]">
101
102
103 <#if currentURL?contains("/vi/")>
104 <a href="/vi/du-no-tin-dung-doi-voi-nen-kt-dttktt" class="text-[#9D1B43] inline-block text-[14px] leading-[1.5] space-x-[6px]">
105 Xem chi tiết <i class="fa-solid fa-caret-right"></i>
106 </a>
107 <#else>
108 <a href="https://dttktt.sbv.gov.vn/webcenter/portal/en/home/sbv/statistic/ctte" class="text-[#9D1B43] inline-block text-[14px] leading-[1.5] space-x-[6px]">
109 Details <i class="fa-solid fa-caret-right"></i>
110 </a>
111 </#if>
112 </div>
113 </div>
114<style>
115 .sbv-chart .text-end a{color: #9D1B43;}
116 .sbv-chart .text-end a:hover{color: var(--btn-link-hover-color);}
117</style>
118<script type="text/javascript" src="/documents/d/sbv_portal/jquery-3-7-1.js"></script>
119<script>
120// Khi DOM xong thì build chart
121
122//document.addEventListener("DOMContentLoaded", function() {
123 // 3) Tạo mảng label: [ "QI/2024", "QII/2024", ... ]
124 const labels = [
125 <#list dataChart as curEntry>
126 <#assign ddm = curEntry.getAssetRenderer()
127 .getDDMFormValuesReader()
128 .getDDMFormValues()
129 .getDDMFormFieldValuesMap() />
130 <#assign raw = ddm["Date62813077"][0].getValue().getString(locale) />
131 <#assign dt = raw?date("yyyy-MM-dd") />
132 <#assign label = dt?string("M") + "/" + dt?string("yyyy") />
133 "${label}"<#if curEntry_has_next>,</#if>
134 </#list>
135 ];
136 // console.log(labels,"labels");
137 // Mỗi mảng số liệu build tách biệt:
138 const tocDoTangGiamNongNghiep = [
139 <#list entries as e>
140 <#assign ddm = e.getAssetRenderer()
141 .getDDMFormValuesReader()
142 .getDDMFormValues()
143 .getDDMFormFieldValuesMap() />
144 <#assign v = 0 />
145 <#if ddm["tocDoTangGiamNongNghiep"]?has_content>
146 <#assign v = ddm["tocDoTangGiamNongNghiep"][0].getValue().getString(locale)?replace(",", ".")?number />
147 </#if>
148 ${v}<#if e_has_next>,</#if>
149 </#list>
150 ];
151 const tocDoTangGiamCongNghiep = [
152 <#list entries as e>
153 <#assign ddm = e.getAssetRenderer()
154 .getDDMFormValuesReader()
155 .getDDMFormValues()
156 .getDDMFormFieldValuesMap() />
157 <#assign v = 0 />
158 <#if ddm["tocDoTangGiamCongNghiep"]?has_content>
159 <#assign v = ddm["tocDoTangGiamCongNghiep"][0].getValue().getString(locale)?replace(",", ".")?number />
160 </#if>
161 ${v}<#if e_has_next>,</#if>
162 </#list>
163 ];
164
165 const tocDoTangGiamXayDung = [
166 <#list entries as e>
167 <#assign ddm = e.getAssetRenderer()
168 .getDDMFormValuesReader()
169 .getDDMFormValues()
170 .getDDMFormFieldValuesMap() />
171 <#assign v = 0 />
172 <#if ddm["tocDoTangGiamXayDung"]?has_content>
173 <#assign v = ddm["tocDoTangGiamXayDung"][0].getValue().getString(locale)?replace(",", ".")?number />
174 </#if>
175 ${v}<#if e_has_next>,</#if>
176 </#list>
177 ];
178
179 const tocDoTangGiamHoatDongThuongMai = [
180 <#list entries as e>
181 <#assign ddm = e.getAssetRenderer()
182 .getDDMFormValuesReader()
183 .getDDMFormValues()
184 .getDDMFormFieldValuesMap() />
185 <#assign v = 0 />
186 <#if ddm["tocDoTangGiamHoatDongThuongMai"]?has_content>
187 <#assign v = ddm["tocDoTangGiamHoatDongThuongMai"][0].getValue().getString(locale)?replace(",", ".")?number />
188 </#if>
189 ${v}<#if e_has_next>,</#if>
190 </#list>
191 ];
192
193 const tocDoTangGiamVanTaiVaVienThong = [
194 <#list entries as e>
195 <#assign ddm = e.getAssetRenderer()
196 .getDDMFormValuesReader()
197 .getDDMFormValues()
198 .getDDMFormFieldValuesMap() />
199 <#assign v = 0 />
200 <#if ddm["tocDoTangGiamVanTaiVaVienThong"]?has_content>
201 <#assign v = ddm["tocDoTangGiamVanTaiVaVienThong"][0].getValue().getString(locale)?replace(",", ".")?number />
202 </#if>
203 ${v}<#if e_has_next>,</#if>
204 </#list>
205 ];
206
207 const Text47043993 = [
208 <#list entries as e>
209 <#assign ddm = e.getAssetRenderer()
210 .getDDMFormValuesReader()
211 .getDDMFormValues()
212 .getDDMFormFieldValuesMap() />
213 <#assign v = 0 />
214 <#if ddm["Text47043993"]?has_content>
215 <#assign v = ddm["Text47043993"][0].getValue().getString(locale)?replace(",", ".")?number />
216 </#if>
217 ${v}<#if e_has_next>,</#if>
218 </#list>
219 ];
220 const tocDoTangGiamTongCong = [
221 <#list entries as e>
222 <#assign ddm = e.getAssetRenderer()
223 .getDDMFormValuesReader()
224 .getDDMFormValues()
225 .getDDMFormFieldValuesMap() />
226 <#assign v = 0 />
227 <#if ddm["tocDoTangGiamTongCong"]?has_content>
228 <#assign v = ddm["tocDoTangGiamTongCong"][0].getValue().getString(locale)?replace(",", ".")?number />
229 </#if>
230 ${v}<#if e_has_next>,</#if>
231 </#list>
232 ];
233
234 // Vẽ chart
235 const ctx = document.getElementById("statChart1").getContext("2d");
236 new Chart(ctx, {
237 type: "line",
238 data: {
239 labels: labels,
240 datasets: [
241 <#if currentURL?contains("/vi/")>
242 { label: "Nông nghiệp, lâm nghiệp và thuỷ sản", data: tocDoTangGiamNongNghiep, borderColor: "rgb(0, 0, 255)", pointBackgroundColor: "rgb(0, 0, 255)", fill: false, tension: 0.3, borderWidth: 1 },
243 { label: "Công nghiệp", data: tocDoTangGiamCongNghiep, borderColor: "rgb(255, 90, 33)", pointBackgroundColor: "rgb(255, 90, 33)", fill: false, tension: 0.3, borderWidth: 1 },
244 { label: "Xây dựng", data: tocDoTangGiamXayDung, borderColor: "rgb(198, 198, 0)", pointBackgroundColor: "rgb(198, 198, 0)", fill: false, tension: 0.3, borderWidth: 1 },
245 { label: "Thương mại", data: tocDoTangGiamHoatDongThuongMai, borderColor: "rgb(57, 99, 0)", pointBackgroundColor: "rgb(57, 99, 0)", fill: false, tension: 0.3, borderWidth: 1 },
246 { label: "Vận tải và viễn thông", data: tocDoTangGiamVanTaiVaVienThong, borderColor: "rgb(82, 198, 255)", pointBackgroundColor: "rgb(82, 198, 255)", fill: false, tension: 0.3, borderWidth: 1 },
247 { label: "Các hoạt động dịch vụ khác",data: Text47043993, borderColor: "rgb(214, 231, 255)", pointBackgroundColor: "rgb(214, 231, 255)", fill: false, tension: 0.3, borderWidth: 1 },
248 { label: "Tổng cộng",data: tocDoTangGiamTongCong, borderColor: "rgb(255, 33, 148)", pointBackgroundColor: "rgb(255, 33, 148)", fill: false, tension: 0.3, borderWidth: 1 }
249 <#else>
250 { label: "Agriculture, forestry and fisheries", data: tocDoTangGiamNongNghiep, borderColor: "rgb(0, 0, 255)", pointBackgroundColor: "rgb(0, 0, 255)", fill: false, tension: 0.3, borderWidth: 1 },
251 { label: "Industry", data: tocDoTangGiamCongNghiep, borderColor: "rgb(255, 90, 33)", pointBackgroundColor: "rgb(255, 90, 33)", fill: false, tension: 0.3, borderWidth: 1 },
252 { label: "Construction", data: tocDoTangGiamXayDung, borderColor: "rgb(198, 198, 0)", pointBackgroundColor: "rgb(198, 198, 0)", fill: false, tension: 0.3, borderWidth: 1 },
253 { label: "Trade", data: tocDoTangGiamHoatDongThuongMai, borderColor: "rgb(57, 99, 0)", pointBackgroundColor: "rgb(57, 99, 0)", fill: false, tension: 0.3, borderWidth: 1 },
254 { label: "Transport and telecommunications", data: tocDoTangGiamVanTaiVaVienThong, borderColor: "rgb(82, 198, 255)", pointBackgroundColor: "rgb(82, 198, 255)", fill: false, tension: 0.3, borderWidth: 1 },
255 { label: "Orther service activities",data: Text47043993, borderColor: "rgb(214, 231, 255)", pointBackgroundColor: "rgb(214, 231, 255)", fill: false, tension: 0.3, borderWidth: 1 },
256 { label: "Total",data: tocDoTangGiamTongCong, borderColor: "rgb(255, 33, 148)", pointBackgroundColor: "rgb(255, 33, 148)", fill: false, tension: 0.3, borderWidth: 1 }
257 </#if>
258
259 ]
260 },
261 options: {
262 responsive: true,
263 plugins: {
264 tooltip: {
265 callbacks: {
266 title: function() {
267 return [];
268 },
269 label: function(context) {
270 const label = context.dataset.label || '';
271 const time = context.label || '';
272 const value = context.formattedValue || '';
273
274 <#if currentURL?contains("/vi/")>
275 return [
276 "Ngành: " + label,
277 "Thời điểm: " + time,
278 "Giá trị: " + value + "(%)",
279 ];
280 <#else>
281 return [
282 "Industry: " + label,
283 "Point in time: " + time,
284 "Value: " + value + "(%)",
285 ];
286 </#if>
287
288 }
289 }
290},
291legend: {
292 position: 'top',
293 labels: {
294 usePointStyle: true,
295 pointStyle: 'circle',
296 boxWidth: 5,
297 boxHeight: 5,
298 padding: 10,
299 color: "#000000",
300 font: { size: 10 },
301 generateLabels: function(chart) {
302 const items = Chart.defaults.plugins.legend.labels.generateLabels(chart);
303 // Group items thành mảng con 3 phần tử
304 const grouped = [];
305 for (let i = 0; i < items.length; i += 3) {
306 grouped.push(items.slice(i, i + 3));
307 }
308 // Flatten lại nhưng thêm dấu xuống dòng vào cuối mỗi dòng (hack wrap)
309 return grouped.flatMap((group, idx, arr) => {
310 if (idx < arr.length - 1) {
311 group[group.length - 1].text += '\n';
312 }
313 return group;
314 });
315 }
316 }
317},
318 title: {
319 display: false,
320 text: "DỮ LIỆU THỐNG KÊ\nQUÝ III NĂM 2024 (Triệu USD)",
321 font: { size: 16, weight: "bold" }
322 }
323 },
324 scales: {
325 x: {
326 ticks: {
327 color: '#000000'
328 },
329 },
330
331 y: {
332 ticks: {
333 color: '#000000'
334 },
335 beginAtZero: false
336 }
337 }
338 }
339 });
340//});
341</script>
342 </#if>
