Trang t\u1ed5ng quan T\u01b0\u01a1ng t\u00e1c: \u0110\u1ec1 xu\u1ea5t Ph\u00f2ng Lab Thi\u1ebft k\u1ebf Vi m\u1ea1ch<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n \n \n \n <style>\n body {\n font-family: 'Be Vietnam Pro', sans-serif;\n background-color: #f8fafc; \/* slate-50 *\/\n color: #1e293b; \/* slate-800 *\/\n }\n .chart-container {\n position: relative;\n margin: auto;\n height: 40vh;\n width: 100%;\n max-width: 500px;\n max-height: 500px;\n }\n .nav-link {\n transition: color 0.3s, border-bottom-color 0.3s;\n border-bottom: 2px solid transparent;\n }\n .nav-link:hover, .nav-link.active {\n color: #4f46e5; \/* indigo-600 *\/\n border-bottom-color: #4f46e5;\n }\n .section-title {\n font-size: 2.25rem;\n font-weight: 700;\n color: #334155; \/* slate-700 *\/\n }\n .section-subtitle {\n font-size: 1.125rem;\n color: #64748b; \/* slate-500 *\/\n max-width: 800px;\n margin: 0 auto;\n }\n .card {\n background-color: white;\n border-radius: 0.75rem;\n box-shadow: 0 4px 6px -1px rgb(0 0 0 \/ 0.1), 0 2px 4px -2px rgb(0 0 0 \/ 0.1);\n transition: all 0.3s ease-in-out;\n }\n .card:hover {\n box-shadow: 0 10px 15px -3px rgb(0 0 0 \/ 0.1), 0 4px 6px -4px rgb(0 0 0 \/ 0.1);\n transform: translateY(-4px);\n }\n .btn-primary {\n background-color: #4f46e5; \/* indigo-600 *\/\n color: white;\n padding: 0.75rem 1.5rem;\n border-radius: 0.5rem;\n font-weight: 600;\n transition: background-color 0.3s;\n }\n .btn-primary:hover {\n background-color: #4338ca; \/* indigo-700 *\/\n }\n .timeline-item::before {\n content: '';\n position: absolute;\n top: 1.25rem;\n left: -1rem;\n transform: translateX(-50%);\n width: 1.25rem;\n height: 1.25rem;\n background-color: white;\n border: 4px solid #6366f1; \/* indigo-500 *\/\n border-radius: 9999px;\n z-index: 10;\n }\n .timeline-line {\n position: absolute;\n top: 1.25rem;\n left: -1rem;\n transform: translateX(-50%);\n width: 4px;\n height: 100%;\n background-color: #e0e7ff; \/* indigo-200 *\/\n }\n <\/style>\n<\/head>\n<body class=\"bg-slate-50 text-slate-800\">\n\n <header class=\"bg-white\/80 backdrop-blur-lg sticky top-0 z-50 shadow-sm\">\n <nav class=\"container mx-auto px-4 lg:px-6 py-3\">\n <div class=\"flex justify-between items-center\">\n <h1 class=\"text-xl font-bold text-indigo-600\">Lab Vi M\u1ea1ch<\/h1>\n <div class=\"hidden md:flex items-center space-x-8\">\n <a href=\"#overview\" class=\"nav-link\">T\u1ed5ng quan<\/a>\n <a href=\"#budget\" class=\"nav-link\">Ng\u00e2n s\u00e1ch<\/a>\n <a href=\"#roadmap\" class=\"nav-link\">L\u1ed9 tr\u00ecnh<\/a>\n <a href=\"#courses\" class=\"nav-link\">H\u1ecdc ph\u1ea7n<\/a>\n <\/div>\n <div class=\"md:hidden\">\n <button id=\"menu-btn\" class=\"text-slate-600 focus:outline-none\">\n <svg class=\"w-6 h-6\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16m-7 6h7\"><\/path><\/svg>\n <\/button>\n <\/div>\n <\/div>\n <div id=\"mobile-menu\" class=\"hidden md:hidden mt-4 space-y-2\">\n <a href=\"#overview\" class=\"block py-2 px-4 text-sm nav-link\">T\u1ed5ng quan<\/a>\n <a href=\"#budget\" class=\"block py-2 px-4 text-sm nav-link\">Ng\u00e2n s\u00e1ch<\/a>\n <a href=\"#roadmap\" class=\"block py-2 px-4 text-sm nav-link\">L\u1ed9 tr\u00ecnh<\/a>\n <a href=\"#courses\" class=\"block py-2 px-4 text-sm nav-link\">H\u1ecdc ph\u1ea7n<\/a>\n <\/div>\n <\/nav>\n <\/header>\n\n <main>\n \n <section id=\"overview\" class=\"py-16 md:py-24 text-center bg-white\">\n <div class=\"container mx-auto px-4\">\n <span class=\"text-indigo-600 font-semibold\">T\u1ea6M NH\u00ccN CHI\u1ebeN L\u01af\u1ee2C<\/span>\n <h2 class=\"section-title mt-2\">Th\u00e0nh l\u1eadp Ph\u00f2ng Th\u00ed nghi\u1ec7m Thi\u1ebft k\u1ebf Vi m\u1ea1ch Qu\u1ed1c gia t\u1ea1i Tr\u01b0\u1eddng \u0110\u1ea1i h\u1ecdc Quy Nh\u01a1n<\/h2>\n <p class=\"section-subtitle mt-4\">\n M\u1ed9t kho\u1ea3n \u0111\u1ea7u t\u01b0 chi\u1ebfn l\u01b0\u1ee3c nh\u1eb1m hi\u1ec7n th\u1ef1c h\u00f3a m\u1ee5c ti\u00eau qu\u1ed1c gia \u0111\u00e0o t\u1ea1o 50.000 k\u1ef9 s\u01b0 b\u00e1n d\u1eabn v\u00e0o n\u0103m 2030, t\u1ea1o ra m\u1ed9t trung t\u00e2m xu\u1ea5t s\u1eafc v\u1ec1 \u0111\u00e0o t\u1ea1o v\u00e0 nghi\u00ean c\u1ee9u, s\u1eb5n s\u00e0ng \u0111\u00e1p \u1ee9ng nhu c\u1ea7u c\u1ee7a ng\u00e0nh c\u00f4ng nghi\u1ec7p.\n <\/p>\n <div class=\"mt-12 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8\">\n <div class=\"card p-6 text-left\">\n <div class=\"flex items-center space-x-4\">\n <div class=\"bg-indigo-100 p-3 rounded-full\">\n <svg class=\"w-6 h-6 text-indigo-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v.01\"><\/path><\/svg>\n <\/div>\n <div>\n <p class=\"text-slate-500\">T\u1ed5ng Ng\u00e2n s\u00e1ch<\/p>\n <p class=\"text-2xl font-bold\">34 t\u1ef7 VND<\/p>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"card p-6 text-left\">\n <div class=\"flex items-center space-x-4\">\n <div class=\"bg-green-100 p-3 rounded-full\">\n <svg class=\"w-6 h-6 text-green-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z\"><\/path><\/svg>\n <\/div>\n <div>\n <p class=\"text-slate-500\">Quy m\u00f4 \u0111\u00e0o t\u1ea1o<\/p>\n <p class=\"text-2xl font-bold\">30 Sinh vi\u00ean \/ L\u1edbp<\/p>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"card p-6 text-left\">\n <div class=\"flex items-center space-x-4\">\n <div class=\"bg-sky-100 p-3 rounded-full\">\n <svg class=\"w-6 h-6 text-sky-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547a2 2 0 00-.547 1.806l.477 2.387a6 6 0 00.517 3.86l.158.318a6 6 0 00.517 3.86l2.387.477a2 2 0 001.806-.547a2 2 0 00.547-1.806l-.477-2.387a6 6 0 00-.517-3.86l-.158-.318a6 6 0 01-.517-3.86l-.477-2.387zM12 15a3 3 0 100-6 3 3 0 000 6z\"><\/path><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547a2 2 0 00-.547 1.806l.477 2.387a6 6 0 00.517 3.86l.158.318a6 6 0 00.517 3.86l2.387.477a2 2 0 001.806-.547a2 2 0 00.547-1.806l-.477-2.387a6 6 0 00-.517-3.86l-.158-.318a6 6 0 01-.517-3.86l-.477-2.387zM12 15a3 3 0 100-6 3 3 0 000 6z\"><\/path><\/svg>\n <\/div>\n <div>\n <p class=\"text-slate-500\">M\u1ee5c ti\u00eau Tape-out<\/p>\n <p class=\"text-2xl font-bold\">5 D\u1ef1 \u00e1n \/ N\u0103m<\/p>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"card p-6 text-left\">\n <div class=\"flex items-center space-x-4\">\n <div class=\"bg-amber-100 p-3 rounded-full\">\n <svg class=\"w-6 h-6 text-amber-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4\"><\/path><\/svg>\n <\/div>\n <div>\n <p class=\"text-slate-500\">\u0110\u1ed1i t\u00e1c chi\u1ebfn l\u01b0\u1ee3c<\/p>\n <p class=\"text-2xl font-bold\">Viettel, FPT<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section id=\"budget\" class=\"py-16 md:py-24\">\n <div class=\"container mx-auto px-4 text-center\">\n <span class=\"text-indigo-600 font-semibold\">PH\u00c2N T\u00cdCH \u0110\u1ea6U T\u01af<\/span>\n <h2 class=\"section-title mt-2\">Ph\u00e2n b\u1ed5 Ng\u00e2n s\u00e1ch 34 T\u1ef7 VND<\/h2>\n <p class=\"section-subtitle mt-4\">\n Nh\u1ea5p v\u00e0o t\u1eebng h\u1ea1ng m\u1ee5c tr\u00ean bi\u1ec3u \u0111\u1ed3 \u0111\u1ec3 xem chi ti\u1ebft danh m\u1ee5c \u0111\u1ea7u t\u01b0. Ng\u00e2n s\u00e1ch \u0111\u01b0\u1ee3c ph\u00e2n b\u1ed5 m\u1ed9t c\u00e1ch chi\u1ebfn l\u01b0\u1ee3c, \u01b0u ti\u00ean cho c\u00e1c ho\u1ea1t \u0111\u1ed9ng c\u1ed1t l\u00f5i nh\u01b0 ch\u1ebf t\u1ea1o chip v\u00e0 trang b\u1ecb m\u00e1y m\u00f3c hi\u1ec7n \u0111\u1ea1i.\n <\/p>\n <div class=\"mt-12 lg:grid lg:grid-cols-2 lg:gap-12 lg:items-center\">\n <div class=\"chart-container\">\n <canvas id=\"budgetChart\"><\/canvas>\n <\/div>\n <div id=\"budget-details\" class=\"mt-8 lg:mt-0 text-left\">\n <div class=\"card p-6\">\n <h3 class=\"font-bold text-xl text-slate-700\">Ch\u00e0o m\u1eebng \u0111\u1ebfn v\u1edbi Ph\u00e2n t\u00edch Ng\u00e2n s\u00e1ch<\/h3>\n <p class=\"mt-2 text-slate-600\">\u0110\u00e2y l\u00e0 trung t\u00e2m \u0111i\u1ec1u khi\u1ec3n cho k\u1ebf ho\u1ea1ch \u0111\u1ea7u t\u01b0 c\u1ee7a ph\u00f2ng lab. M\u1ecdi chi ph\u00ed \u0111\u1ec1u \u0111\u01b0\u1ee3c t\u00ednh to\u00e1n c\u1ea9n th\u1eadn \u0111\u1ec3 t\u1ed1i \u01b0u h\u00f3a hi\u1ec7u qu\u1ea3 \u0111\u00e0o t\u1ea1o v\u00e0 nghi\u00ean c\u1ee9u.<\/p>\n <ul class=\"mt-4 space-y-2 text-slate-500\">\n <li class=\"flex items-center\"><span class=\"w-2 h-2 bg-indigo-500 rounded-full mr-3\"><\/span>Kh\u00e1m ph\u00e1 chi ti\u1ebft b\u1eb1ng c\u00e1ch nh\u1ea5p v\u00e0o bi\u1ec3u \u0111\u1ed3.<\/li>\n <li class=\"flex items-center\"><span class=\"w-2 h-2 bg-indigo-500 rounded-full mr-3\"><\/span>So s\u00e1nh t\u1ef7 tr\u1ecdng gi\u1eefa c\u00e1c h\u1ea1ng m\u1ee5c.<\/li>\n <li class=\"flex items-center\"><span class=\"w-2 h-2 bg-indigo-500 rounded-full mr-3\"><\/span>Hi\u1ec3u r\u00f5 l\u00fd do \u0111\u1eb1ng sau m\u1ed7i kho\u1ea3n \u0111\u1ea7u t\u01b0.<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section id=\"roadmap\" class=\"py-16 md:py-24 bg-white\">\n <div class=\"container mx-auto px-4 text-center\">\n <span class=\"text-indigo-600 font-semibold\">K\u1ebe HO\u1ea0CH H\u00c0NH \u0110\u1ed8NG<\/span>\n <h2 class=\"section-title mt-2\">L\u1ed9 tr\u00ecnh Tri\u1ec3n khai D\u1ef1 \u00e1n<\/h2>\n <p class=\"section-subtitle mt-4\">\n D\u1ef1 \u00e1n \u0111\u01b0\u1ee3c tri\u1ec3n khai theo 4 giai \u0111o\u1ea1n r\u00f5 r\u00e0ng, \u0111\u1ea3m b\u1ea3o ti\u1ebfn \u0111\u1ed9, hi\u1ec7u qu\u1ea3 v\u00e0 s\u1ef1 t\u00edch h\u1ee3p \u0111\u1ed3ng b\u1ed9 gi\u1eefa c\u00e1c h\u1ea1ng m\u1ee5c \u0111\u1ea7u t\u01b0.\n <\/p>\n <div id=\"roadmap-container\" class=\"mt-12 flex flex-col md:flex-row justify-between gap-8 text-left\">\n \n <\/div>\n <\/div>\n <\/section>\n\n \n <section id=\"courses\" class=\"py-16 md:py-24\">\n <div class=\"container mx-auto px-4\">\n <div class=\"text-center\">\n <span class=\"text-indigo-600 font-semibold\">\u1ee8NG D\u1ee4NG \u0110\u00c0O T\u1ea0O<\/span>\n <h2 class=\"section-title mt-2\">\u00c1nh x\u1ea1 Trang thi\u1ebft b\u1ecb v\u00e0o Ch\u01b0\u01a1ng tr\u00ecnh h\u1ecdc<\/h2>\n <p class=\"section-subtitle mt-4\">\n Ch\u1ecdn m\u1ed9t h\u1ecdc ph\u1ea7n \u0111\u1ec3 xem ch\u00ednh x\u00e1c c\u00e1c ph\u1ea7n m\u1ec1m, ph\u1ea7n c\u1ee9ng v\u00e0 thi\u1ebft b\u1ecb \u0111o l\u01b0\u1eddng n\u00e0o s\u1ebd \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng. \u0110i\u1ec1u n\u00e0y minh ch\u1ee9ng cho s\u1ef1 \u0111\u1ea7u t\u01b0 c\u00f3 m\u1ee5c \u0111\u00edch, ph\u1ee5c v\u1ee5 tr\u1ef1c ti\u1ebfp cho t\u1eebng m\u1ee5c ti\u00eau h\u1ecdc t\u1eadp c\u1ee5 th\u1ec3.\n <\/p>\n <\/div>\n\n <div class=\"mt-12 lg:grid lg:grid-cols-3 lg:gap-8\">\n <div class=\"lg:col-span-1\">\n <h3 class=\"font-bold text-xl text-slate-700 mb-4\">Danh s\u00e1ch H\u1ecdc ph\u1ea7n<\/h3>\n <div id=\"course-list\" class=\"space-y-2\">\n \n <\/div>\n <\/div>\n <div id=\"course-details\" class=\"lg:col-span-2 mt-8 lg:mt-0\">\n <div class=\"card p-6 sticky top-24\">\n <h3 id=\"course-detail-title\" class=\"font-bold text-2xl text-indigo-700\">Vui l\u00f2ng ch\u1ecdn m\u1ed9t h\u1ecdc ph\u1ea7n<\/h3>\n <p id=\"course-detail-objective\" class=\"mt-2 text-slate-600\">Th\u00f4ng tin chi ti\u1ebft v\u1ec1 c\u00e1c ngu\u1ed3n l\u1ef1c \u0111\u01b0\u1ee3c ph\u00e2n b\u1ed5 s\u1ebd hi\u1ec3n th\u1ecb t\u1ea1i \u0111\u00e2y.<\/p>\n <div id=\"course-detail-content\" class=\"mt-6 grid grid-cols-1 sm:grid-cols-2 gap-6\">\n \n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <\/main>\n \n <footer class=\"bg-slate-800 text-slate-300 py-8\">\n <div class=\"container mx-auto px-4 text-center\">\n <p class=\"font-bold\">\u0110\u1ec0 \u00c1N PH\u00d2NG TH\u00cd NGHI\u1ec6M THI\u1ebeT K\u1ebe VI M\u1ea0CH<\/p>\n <p class=\"text-sm mt-2 text-slate-400\">X\u00e2y d\u1ef1ng t\u01b0\u01a1ng lai cho ng\u00e0nh c\u00f4ng nghi\u1ec7p b\u00e1n d\u1eabn Vi\u1ec7t Nam.<\/p>\n <\/div>\n <\/footer>\n\n\n <script>\n \/\/ Data from the report\n const budgetData = {\n labels: [\n 'D\u1ecbch v\u1ee5 Tape-out MPW',\n 'Tr\u1ea1m \u0110o l\u01b0\u1eddng (T&M)',\n 'M\u00e1y tr\u1ea1m Sinh vi\u00ean',\n 'H\u1ea1 t\u1ea7ng HPC',\n 'H\u1ea1 t\u1ea7ng Ph\u1ee5 tr\u1ee3',\n 'D\u1ef1 ph\u00f2ng (10%)',\n 'Ph\u00ed ph\u1ea7n m\u1ec1m EDA & Chi ph\u00ed kh\u00e1c',\n 'Ph\u1ea7n c\u1ee9ng FPGA\/SoC',\n ],\n percentages: [54.0, 13.7, 7.9, 6.3, 6.0, 9.4, 2.3+2.3, 1.4],\n costsVND: [\n '18,360,000,000', '4,652,347,500', '2,677,500,000', '2,142,000,000',\n '2,040,000,000', '3,189,282,750', '1,530,000,000', '491,002,500'\n ],\n details: [\n {\n title: 'D\u1ecbch v\u1ee5 Ch\u1ebf t\u1ea1o Chip (Tape-out MPW)',\n description: 'H\u1ea1ng m\u1ee5c quan tr\u1ecdng nh\u1ea5t, chi\u1ebfm h\u01a1n n\u1eeda ng\u00e2n s\u00e1ch. Cung c\u1ea5p kinh ph\u00ed cho 15 d\u1ef1 \u00e1n tape-out (5 d\u1ef1 \u00e1n\/n\u0103m trong 3 n\u0103m) th\u00f4ng qua d\u1ecbch v\u1ee5 MPW, cho ph\u00e9p sinh vi\u00ean bi\u1ebfn thi\u1ebft k\u1ebf c\u1ee7a m\u00ecnh th\u00e0nh chip v\u1eadt l\u00fd.',\n items: [\n 'Nh\u00e0 cung c\u1ea5p d\u1ecbch v\u1ee5: Europractice-IC',\n 'C\u00f4ng ngh\u1ec7 tham kh\u1ea3o: IHP 130nm CMOS',\n 'Chi ph\u00ed \u01b0\u1edbc t\u00ednh: ~1.22 t\u1ef7 VND \/ d\u1ef1 \u00e1n',\n 'M\u1ee5c ti\u00eau: \u0110\u1ed9ng l\u1ef1c h\u1ecdc t\u1eadp, tr\u1ea3i nghi\u1ec7m th\u1ef1c t\u1ebf v\u00f4 gi\u00e1.'\n ]\n },\n {\n title: 'Tr\u1ea1m \u0110o l\u01b0\u1eddng & Ki\u1ec3m ch\u1ee9ng (T&M)',\n description: 'Trang b\u1ecb 30 tr\u1ea1m \u0111o l\u01b0\u1eddng ti\u00eau chu\u1ea9n c\u00f4ng nghi\u1ec7p v\u00e0 15 m\u00e1y ph\u00e2n t\u00edch logic, \u0111\u1ea3m b\u1ea3o sinh vi\u00ean c\u00f3 th\u1ec3 ki\u1ec3m tra, x\u00e1c minh v\u00e0 g\u1ee1 l\u1ed7i c\u00e1c thi\u1ebft k\u1ebf ph\u1ea7n c\u1ee9ng m\u1ed9t c\u00e1ch chuy\u00ean nghi\u1ec7p.',\n items: [\n 'Oscilloscope: Rohde & Schwarz RTB2004 (30 b\u1ed9)',\n 'Ngu\u1ed3n DC, DMM, AFG: R&S, Keithley, Tektronix (30 b\u1ed9)',\n 'M\u00e1y ph\u00e2n t\u00edch logic: DreamSourceLab DSLogic (15 b\u1ed9)',\n 'M\u1ee5c ti\u00eau: K\u1ef9 n\u0103ng th\u1ef1c h\u00e0nh \u0111o ki\u1ec3m chuy\u00ean s\u00e2u.'\n ]\n },\n {\n title: 'M\u00e1y tr\u1ea1m Sinh vi\u00ean',\n description: '30 m\u00e1y tr\u1ea1m (workstation) c\u1ea5u h\u00ecnh c\u1ef1c m\u1ea1nh v\u00e0 60 m\u00e0n h\u00ecnh 2K, t\u1ea1o ra m\u00f4i tr\u01b0\u1eddng l\u00e0m vi\u1ec7c t\u01b0\u01a1ng t\u00e1c, m\u01b0\u1ee3t m\u00e0 cho c\u00e1c c\u00f4ng vi\u1ec7c thi\u1ebft k\u1ebf h\u00e0ng ng\u00e0y nh\u01b0 v\u1ebd schematic, layout.',\n items: [\n 'C\u1ea5u h\u00ecnh: Core i7\/i9, 64GB RAM, 1TB NVMe SSD, GPU RTX 4060',\n 'M\u00e0n h\u00ecnh: 2 x 27\" QHD cho m\u1ed7i m\u00e1y tr\u1ea1m',\n 'H\u1ec7 \u0111i\u1ec1u h\u00e0nh: Dual-boot Linux & Windows',\n 'M\u1ee5c ti\u00eau: N\u0103ng su\u1ea5t t\u1ed1i \u0111a cho sinh vi\u00ean.'\n ]\n },\n {\n title: 'H\u1ea1 t\u1ea7ng T\u00ednh to\u00e1n Hi\u1ec7u n\u0103ng cao (HPC)',\n description: 'M\u1ed9t c\u1ee5m 6 m\u00e1y ch\u1ee7 m\u1ea1nh m\u1ebd \u0111\u1ec3 x\u1eed l\u00fd c\u00e1c t\u00e1c v\u1ee5 t\u00ednh to\u00e1n n\u1eb7ng nh\u01b0 m\u00f4 ph\u1ecfng, t\u1ed5ng h\u1ee3p logic, ph\u00e2n t\u00edch th\u1eddi gian. Ki\u1ebfn tr\u00fac client-server t\u1ed1i \u01b0u hi\u1ec7u n\u0103ng v\u00e0 qu\u1ea3n l\u00fd.',\n items: [\n '4 m\u00e1y ch\u1ee7 t\u1ed1i \u01b0u th\u00f4ng l\u01b0\u1ee3ng (nhi\u1ec1u nh\u00e2n)',\n '2 m\u00e1y ch\u1ee7 t\u1ed1i \u01b0u t\u1ea7n s\u1ed1 (xung nh\u1ecbp cao)',\n 'H\u1ec7 th\u1ed1ng m\u1ea1ng 10Gbps v\u00e0 l\u01b0u tr\u1eef NAS 100TB',\n 'M\u1ee5c ti\u00eau: Cung c\u1ea5p s\u1ee9c m\u1ea1nh t\u00ednh to\u00e1n cho to\u00e0n b\u1ed9 ph\u00f2ng lab.'\n ]\n },\n {\n title: 'H\u1ea1 t\u1ea7ng Ph\u1ee5 tr\u1ee3',\n description: 'C\u00e1c chi ph\u00ed c\u1ea7n thi\u1ebft \u0111\u1ec3 ph\u00f2ng lab ho\u1ea1t \u0111\u1ed9ng tr\u01a1n tru, bao g\u1ed3m h\u1ec7 th\u1ed1ng m\u1ea1ng, l\u01b0u tr\u1eef t\u1eadp trung, b\u00e0n gh\u1ebf chuy\u00ean d\u1ee5ng, h\u1ec7 th\u1ed1ng \u0111i\u1ec7n v\u00e0 \u0111i\u1ec1u h\u00f2a.',\n items: [\n 'M\u1ea1ng l\u00f5i: 10 Gbps Ethernet',\n 'L\u01b0u tr\u1eef: NAS\/SAN dung l\u01b0\u1ee3ng 100 TB',\n 'N\u1ed9i th\u1ea5t: B\u00e0n gh\u1ebf, t\u1ee7 rack chuy\u00ean d\u1ee5ng',\n 'M\u00f4i tr\u01b0\u1eddng: H\u1ec7 th\u1ed1ng \u0111i\u1ec7n, \u0111i\u1ec1u h\u00f2a, ch\u1ed1ng t\u0129nh \u0111i\u1ec7n.'\n ]\n },\n {\n title: 'D\u1ef1 ph\u00f2ng (10%)',\n description: 'M\u1ed9t kho\u1ea3n ng\u00e2n s\u00e1ch d\u1ef1 ph\u00f2ng chi\u1ebfm kho\u1ea3ng 10% t\u1ed5ng \u0111\u1ea7u t\u01b0 \u0111\u1ec3 x\u1eed l\u00fd c\u00e1c chi ph\u00ed ph\u00e1t sinh, bi\u1ebfn \u0111\u1ed9ng t\u1ef7 gi\u00e1 ho\u1eb7c c\u00e1c c\u01a1 h\u1ed9i \u0111\u1ea7u t\u01b0 b\u1ed5 sung trong qu\u00e1 tr\u00ecnh tri\u1ec3n khai.',\n items: [\n 'Linh ho\u1ea1t cho c\u00e1c thay \u0111\u1ed5i c\u00f4ng ngh\u1ec7.',\n 'B\u00f9 \u0111\u1eafp bi\u1ebfn \u0111\u1ed9ng th\u1ecb tr\u01b0\u1eddng v\u00e0 chi ph\u00ed nh\u1eadp kh\u1ea9u.',\n '\u0110\u1ea3m b\u1ea3o d\u1ef1 \u00e1n ho\u00e0n th\u00e0nh \u0111\u00fang ng\u00e2n s\u00e1ch.'\n ]\n },\n {\n title: 'Ph\u00ed Ph\u1ea7n m\u1ec1m EDA & Chi ph\u00ed kh\u00e1c',\n description: 'Bao g\u1ed3m ph\u00ed tham gia c\u00e1c ch\u01b0\u01a1ng tr\u00ecnh \u0111\u1ea1i h\u1ecdc t\u1eeb nh\u00e0 cung c\u1ea5p ph\u1ea7n m\u1ec1m (Cadence) v\u00e0 c\u00e1c chi ph\u00ed v\u1eadn h\u00e0nh, b\u1ea3o tr\u00ec, \u0111\u00e0o t\u1ea1o gi\u1ea3ng vi\u00ean trong 3 n\u0103m \u0111\u1ea7u.',\n items: [\n 'Ph\u00ed tham gia Cadence University Program.',\n 'Chi ph\u00ed \u0111\u00e0o t\u1ea1o, ch\u1ee9ng ch\u1ec9 cho gi\u1ea3ng vi\u00ean.',\n 'Chi ph\u00ed v\u1eadn h\u00e0nh v\u00e0 b\u1ea3o tr\u00ec h\u1ec7 th\u1ed1ng h\u00e0ng n\u0103m.'\n ]\n },\n {\n title: 'Ph\u1ea7n c\u1ee9ng FPGA\/SoC',\n description: '\u0110\u1ea7u t\u01b0 v\u00e0o c\u00e1c bo m\u1ea1ch ph\u00e1t tri\u1ec3n theo 2 c\u1ea5p \u0111\u1ed9 \u0111\u1ec3 ph\u1ee5c v\u1ee5 t\u1eeb c\u00e1c b\u00e0i th\u1ef1c h\u00e0nh HDL c\u01a1 b\u1ea3n \u0111\u1ebfn c\u00e1c \u0111\u1ed3 \u00e1n thi\u1ebft k\u1ebf SoC v\u00e0 x\u1eed l\u00fd \u1ea3nh ph\u1ee9c t\u1ea1p.',\n items: [\n 'C\u1ea5p 1: Digilent Basys 3 (15 bo)',\n 'C\u1ea5p 2: AMD Zynq ZCU104 (10 bo)',\n 'Ph\u1ea7n m\u1ec1m \u0111i k\u00e8m: AMD Vivado & Vitis (mi\u1ec5n ph\u00ed)',\n 'M\u1ee5c ti\u00eau: C\u1ea7u n\u1ed1i gi\u1eefa l\u00fd thuy\u1ebft v\u00e0 tri\u1ec3n khai ph\u1ea7n c\u1ee9ng th\u1ef1c t\u1ebf.'\n ]\n }\n ]\n };\n\n const roadmapData = [\n {\n phase: 'Giai \u0111o\u1ea1n 1 (Th\u00e1ng 1-3)',\n title: 'X\u00e2y d\u1ef1ng H\u1ea1 t\u1ea7ng N\u1ec1n t\u1ea3ng',\n tasks: [\n 'Mua s\u1eafm v\u00e0 l\u1eafp \u0111\u1eb7t m\u00e1y ch\u1ee7, m\u00e1y tr\u1ea1m, m\u1ea1ng.',\n 'C\u00e0i \u0111\u1eb7t h\u1ec7 \u0111i\u1ec1u h\u00e0nh v\u00e0 c\u1ea5u h\u00ecnh c\u01a1 b\u1ea3n.',\n 'N\u1ed9p \u0111\u01a1n \u0111\u0103ng k\u00fd c\u00e1c ch\u01b0\u01a1ng tr\u00ecnh \u0111\u1ea1i h\u1ecdc (Cadence, AMD).'\n ]\n },\n {\n phase: 'Giai \u0111o\u1ea1n 2 (Th\u00e1ng 4-6)',\n title: 'Tri\u1ec3n khai C\u1ed1t l\u00f5i',\n tasks: [\n 'C\u00e0i \u0111\u1eb7t v\u00e0 c\u1ea5u h\u00ecnh b\u1ed9 c\u00f4ng c\u1ee5 EDA (Cadence & Open-source).',\n 'C\u00e0i \u0111\u1eb7t Vivado\/Vitis.',\n 'Tri\u1ec3n khai bo m\u1ea1ch FPGA C\u1ea5p 1 (Basys 3).',\n '\u0110\u00e0o t\u1ea1o gi\u1ea3ng vi\u00ean v\u1ec1 c\u00e1c c\u00f4ng c\u1ee5 m\u1edbi.'\n ]\n },\n {\n phase: 'Giai \u0111o\u1ea1n 3 (Th\u00e1ng 7-9)',\n title: 'T\u00edch h\u1ee3p N\u00e2ng cao',\n tasks: [\n 'Tri\u1ec3n khai b\u1ed9 kit SoC C\u1ea5p 2 (ZCU104) v\u00e0 tr\u1ea1m \u0111o T&M.',\n 'T\u00edch h\u1ee3p thi\u1ebft b\u1ecb \u0111o v\u1edbi ph\u1ea7n m\u1ec1m qu\u1ea3n l\u00fd.',\n 'Ph\u00e1t tri\u1ec3n v\u00e0 th\u1eed nghi\u1ec7m b\u00e0i th\u1ef1c h\u00e0nh n\u00e2ng cao.'\n ]\n },\n {\n phase: 'Giai \u0111o\u1ea1n 4 (Li\u00ean t\u1ee5c)',\n title: 'V\u1eadn h\u00e0nh & Ph\u00e1t tri\u1ec3n',\n tasks: [\n 'Tri\u1ec3n khai \u0111\u1ea7y \u0111\u1ee7 ch\u01b0\u01a1ng tr\u00ecnh gi\u1ea3ng d\u1ea1y.',\n 'Qu\u1ea3n l\u00fd quy tr\u00ecnh tape-out MPW h\u00e0ng n\u0103m.',\n 'T\u1ed5 ch\u1ee9c \u0111\u00e0o t\u1ea1o li\u00ean t\u1ee5c cho sinh vi\u00ean v\u00e0 gi\u1ea3ng vi\u00ean.'\n ]\n }\n ];\n\n const courseData = {\n 'hdl': {\n title: 'TK H\u1ec7 th\u1ed1ng s\u1ed1 v\u1edbi HDL & Th\u1ef1c h\u00e0nh',\n objective: 'Thi\u1ebft k\u1ebf, m\u00f4 ph\u1ecfng, v\u00e0 tri\u1ec3n khai c\u00e1c m\u1ea1ch s\u1ed1 c\u01a1 b\u1ea3n b\u1eb1ng VHDL\/Verilog tr\u00ean FPGA.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['AMD Vivado (Th\u01b0\u01a1ng m\u1ea1i)', 'GHDL\/Verilator (M\u00e3 ngu\u1ed3n m\u1edf)'],\n 'Ph\u1ea7n c\u1ee9ng': ['Digilent Basys 3'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['Oscilloscope', 'Ngu\u1ed3n DC', 'DMM']\n }\n },\n 'digital-ic': {\n title: 'TK Vi m\u1ea1ch s\u1ed1 & Th\u1ef1c h\u00e0nh',\n objective: 'Hi\u1ec3u v\u00e0 th\u1ef1c hi\u1ec7n lu\u1ed3ng thi\u1ebft k\u1ebf ASIC s\u1ed1 t\u1eeb RTL \u0111\u1ebfn GDSII, bao g\u1ed3m t\u1ed5ng h\u1ee3p v\u00e0 ph\u00e2n t\u00edch th\u1eddi gian.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['Cadence Genus, Tempus', 'Yosys, OpenSTA (M\u00e3 ngu\u1ed3n m\u1edf)'],\n 'Ph\u1ea7n c\u1ee9ng': ['N\/A (T\u1eadp trung m\u00f4 ph\u1ecfng)'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['N\/A']\n }\n },\n 'soc-design': {\n title: 'Thi\u1ebft k\u1ebf SoC',\n objective: 'Thi\u1ebft k\u1ebf m\u1ed9t h\u1ec7 th\u1ed1ng tr\u00ean chip ho\u00e0n ch\u1ec9nh, t\u00edch h\u1ee3p b\u1ed9 x\u1eed l\u00fd, b\u1ed9 nh\u1edb v\u00e0 c\u00e1c ngo\u1ea1i vi t\u00f9y ch\u1ec9nh.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['Cadence Genus, Innovus, Xcelium', 'OpenROAD, Verilator (M\u00e3 ngu\u1ed3n m\u1edf)'],\n 'Ph\u1ea7n c\u1ee9ng': ['AMD Zynq ZCU104'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['MSO (Mixed-Signal Osc.)', 'M\u00e1y ph\u00e2n t\u00edch logic']\n }\n },\n 'analog-ic': {\n title: 'TK Vi m\u1ea1ch T\u01b0\u01a1ng t\u1ef1 & H\u1ed7n h\u1ee3p',\n objective: 'Thi\u1ebft k\u1ebf v\u00e0 m\u00f4 ph\u1ecfng c\u00e1c m\u1ea1ch t\u01b0\u01a1ng t\u1ef1 (op-amp, LDO) v\u00e0 h\u1ed7n h\u1ee3p (ADC\/DAC) \u1edf c\u1ea5p \u0111\u1ed9 transistor.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['Cadence Virtuoso, Spectre', 'ngspice, Magic (M\u00e3 ngu\u1ed3n m\u1edf)'],\n 'Ph\u1ea7n c\u1ee9ng': ['N\/A (T\u1eadp trung m\u00f4 ph\u1ecfng)'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['Oscilloscope', 'M\u00e1y ph\u00e1t h\u00e0m (AFG)', 'Ngu\u1ed3n DC']\n }\n },\n 'capstone': {\n title: '\u0110\u1ed3 \u00e1n chuy\u00ean ng\u00e0nh TKVM',\n objective: '\u00c1p d\u1ee5ng t\u1ea5t c\u1ea3 ki\u1ebfn th\u1ee9c \u0111\u1ec3 ho\u00e0n th\u00e0nh m\u1ed9t d\u1ef1 \u00e1n thi\u1ebft k\u1ebf vi m\u1ea1ch ho\u00e0n ch\u1ec9nh, s\u1eb5n s\u00e0ng cho tape-out.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['To\u00e0n b\u1ed9 b\u1ed9 Cadence', 'To\u00e0n b\u1ed9 b\u1ed9 m\u00e3 ngu\u1ed3n m\u1edf'],\n 'Ph\u1ea7n c\u1ee9ng': ['AMD Zynq ZCU104'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['To\u00e0n b\u1ed9 tr\u1ea1m \u0111o']\n }\n },\n 'embedded': {\n title: 'H\u1ec7 th\u1ed1ng nh\u00fang tr\u00ean SoC',\n objective: 'Ph\u00e1t tri\u1ec3n ph\u1ea7n m\u1ec1m v\u00e0 h\u1ec7 \u0111i\u1ec1u h\u00e0nh nh\u00fang (Linux) cho m\u1ed9t h\u1ec7 th\u1ed1ng SoC.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['AMD Vitis, PetaLinux'],\n 'Ph\u1ea7n c\u1ee9ng': ['AMD Zynq ZCU104'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['MSO', 'M\u00e1y ph\u00e2n t\u00edch logic']\n }\n },\n 'image-processing': {\n title: 'X\u1eed l\u00fd \u1ea3nh tr\u00ean FPGA',\n objective: 'Tri\u1ec3n khai c\u00e1c thu\u1eadt to\u00e1n x\u1eed l\u00fd \u1ea3nh\/video tr\u00ean n\u1ec1n t\u1ea3ng SoC, t\u1eadn d\u1ee5ng t\u0103ng t\u1ed1c ph\u1ea7n c\u1ee9ng.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['AMD Vivado, Vitis'],\n 'Ph\u1ea7n c\u1ee9ng': ['AMD Zynq ZCU104 (v\u1edbi Video Codec)'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['MSO', 'M\u00e1y quay phim USB']\n }\n },\n 'asic-seminar': {\n title: 'Chuy\u00ean \u0111\u1ec1 thi\u1ebft k\u1ebf vi m\u1ea1ch (ASIC)',\n objective: 'Nghi\u00ean c\u1ee9u s\u00e2u v\u1ec1 m\u1ed9t ch\u1ee7 \u0111\u1ec1 n\u00e2ng cao trong thi\u1ebft k\u1ebf ASIC, th\u01b0\u1eddng d\u1eabn \u0111\u1ebfn m\u1ed9t thi\u1ebft k\u1ebf s\u1eb5n s\u00e0ng cho tape-out.',\n resources: {\n 'Ph\u1ea7n m\u1ec1m': ['To\u00e0n b\u1ed9 b\u1ed9 Cadence', 'To\u00e0n b\u1ed9 b\u1ed9 m\u00e3 ngu\u1ed3n m\u1edf'],\n 'Ph\u1ea7n c\u1ee9ng': ['N\/A (T\u1eadp trung tape-out)'],\n 'Thi\u1ebft b\u1ecb \u0111o': ['N\/A']\n }\n }\n };\n\n\n \/\/ On DOMContentLoaded\n document.addEventListener('DOMContentLoaded', () => {\n \/\/ Mobile Menu\n const menuBtn = document.getElementById('menu-btn');\n const mobileMenu = document.getElementById('mobile-menu');\n menuBtn.addEventListener('click', () => {\n mobileMenu.classList.toggle('hidden');\n });\n\n \/\/ Budget Chart\n const ctx = document.getElementById('budgetChart').getContext('2d');\n const budgetChart = new Chart(ctx, {\n type: 'doughnut',\n data: {\n labels: budgetData.labels,\n datasets: [{\n label: 'Ph\u00e2n b\u1ed5 Ng\u00e2n s\u00e1ch',\n data: budgetData.percentages,\n backgroundColor: [\n '#4338ca', '#3b82f6', '#0ea5e9', '#06b6d4',\n '#14b8a6', '#22c55e', '#84cc16', '#eab308'\n ],\n borderColor: '#f8fafc',\n borderWidth: 4,\n hoverOffset: 16\n }]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n plugins: {\n legend: {\n position: 'bottom',\n labels: {\n padding: 15,\n boxWidth: 12,\n font: {\n size: 12\n }\n }\n },\n tooltip: {\n callbacks: {\n label: function(context) {\n let label = context.label || '';\n if (label) {\n label += ': ';\n }\n if (context.parsed !== null) {\n label += context.parsed.toFixed(1) + '%';\n }\n return label;\n }\n }\n }\n },\n cutout: '60%',\n onClick: (event, elements) => {\n if (elements.length > 0) {\n const i = elements[0].index;\n updateBudgetDetails(i);\n }\n }\n }\n });\n\n function updateBudgetDetails(index) {\n const detailsContainer = document.getElementById('budget-details');\n const detail = budgetData.details[index];\n const cost = budgetData.costsVND[index];\n const percentage = budgetData.percentages[index];\n \n let itemsHtml = detail.items.map(item => `<li class=\"flex items-start\"><span class=\"w-2 h-2 bg-indigo-500 rounded-full mr-3 mt-2 flex-shrink-0\"><\/span><span>${item}<\/span><\/li>`).join('');\n\n detailsContainer.innerHTML = `\n <div class=\"card p-6 animate-fade-in\">\n <h3 class=\"font-bold text-xl text-indigo-700\">${detail.title}<\/h3>\n <div class=\"flex items-baseline space-x-2 mt-1\">\n <p class=\"text-2xl font-bold text-slate-800\">${cost} VND<\/p>\n <span class=\"text-sm font-semibold text-slate-500\">(${percentage.toFixed(1)}%)<\/span>\n <\/div>\n <p class=\"mt-3 text-slate-600\">${detail.description}<\/p>\n <ul class=\"mt-4 space-y-2 text-slate-600\">${itemsHtml}<\/ul>\n <\/div>\n `;\n \/\/ Add a simple fade-in animation\n detailsContainer.querySelector('.card').style.animation = 'fadeIn 0.5s ease-in-out';\n }\n \/\/ Add a keyframe animation for the fade-in effect\n const style = document.createElement('style');\n style.innerHTML = `@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fadeIn 0.5s; }`;\n document.head.appendChild(style);\n\n\n \/\/ Roadmap\n const roadmapContainer = document.getElementById('roadmap-container');\n roadmapData.forEach((item, index) => {\n const isLast = index === roadmapData.length - 1;\n const tasksHtml = item.tasks.map(task => `<li class=\"text-slate-600\">${task}<\/li>`).join('');\n\n const roadmapItem = document.createElement('div');\n roadmapItem.className = 'flex-1';\n roadmapItem.innerHTML = `\n <div class=\"relative pl-8 pb-8\">\n ${!isLast ? '<div class=\"timeline-line\"><\/div>' : ''}\n <div class=\"timeline-item\"><\/div>\n <div\n class=\"roadmap-header cursor-pointer p-4 rounded-lg transition duration-300 hover:bg-indigo-50\"\n data-target=\"roadmap-content-${index}\"\n >\n <p class=\"text-sm font-semibold text-indigo-600\">${item.phase}<\/p>\n <h4 class=\"font-bold text-lg text-slate-800 mt-1\">${item.title}<\/h4>\n <\/div>\n <div id=\"roadmap-content-${index}\" class=\"mt-2 pl-4 border-l-2 border-indigo-200 ml-2 hidden\">\n <ul class=\"list-disc list-inside space-y-2 py-2\">\n ${tasksHtml}\n <\/ul>\n <\/div>\n <\/div>\n `;\n roadmapContainer.appendChild(roadmapItem);\n });\n \n document.querySelectorAll('.roadmap-header').forEach(header => {\n header.addEventListener('click', () => {\n const targetId = header.getAttribute('data-target');\n const content = document.getElementById(targetId);\n content.classList.toggle('hidden');\n });\n });\n\n \/\/ Courses\n const courseListContainer = document.getElementById('course-list');\n const courseDetailTitle = document.getElementById('course-detail-title');\n const courseDetailObjective = document.getElementById('course-detail-objective');\n const courseDetailContent = document.getElementById('course-detail-content');\n\n Object.entries(courseData).forEach(([key, value]) => {\n const button = document.createElement('button');\n button.textContent = value.title;\n button.dataset.courseId = key;\n button.className = 'block w-full text-left p-3 rounded-md hover:bg-indigo-100 transition duration-200 course-btn';\n courseListContainer.appendChild(button);\n });\n \n let activeCourseButton = null;\n\n courseListContainer.addEventListener('click', (e) => {\n if(e.target && e.target.classList.contains('course-btn')) {\n const courseId = e.target.dataset.courseId;\n const data = courseData[courseId];\n\n if(activeCourseButton) {\n activeCourseButton.classList.remove('bg-indigo-100', 'text-indigo-700', 'font-semibold');\n }\n e.target.classList.add('bg-indigo-100', 'text-indigo-700', 'font-semibold');\n activeCourseButton = e.target;\n \n courseDetailTitle.textContent = data.title;\n courseDetailObjective.textContent = data.objective;\n \n let contentHtml = '';\n Object.entries(data.resources).forEach(([category, items]) => {\n contentHtml += `\n <div>\n <h4 class=\"font-semibold text-slate-700 mb-2\">${category}<\/h4>\n <ul class=\"space-y-1.5\">\n ${items.map(item => `<li class=\"flex items-center text-sm text-slate-600\"><span class=\"w-1.5 h-1.5 bg-slate-400 rounded-full mr-3\"><\/span>${item}<\/li>`).join('')}\n <\/ul>\n <\/div>\n `;\n });\n courseDetailContent.innerHTML = contentHtml;\n }\n });\n \n \/\/ Activate first course by default\n if(courseListContainer.children.length > 0) {\n courseListContainer.children[0].click();\n }\n\n \/\/ Smooth scrolling and active nav link\n const navLinks = document.querySelectorAll('.nav-link');\n const sections = document.querySelectorAll('main > section');\n\n function changeNav() {\n let index = sections.length;\n while(--index && window.scrollY + 100 < sections[index].offsetTop) {}\n \n navLinks.forEach((link) => link.classList.remove('active'));\n const activeLink = document.querySelector(`.nav-link[href=\"#${sections[index].id}\"]`);\n if(activeLink) {\n activeLink.classList.add('active');\n }\n }\n \n navLinks.forEach(link => {\n link.addEventListener('click', (e) => {\n if (mobileMenu.classList.contains('hidden') === false) {\n mobileMenu.classList.add('hidden');\n }\n });\n });\n\n window.addEventListener('scroll', changeNav);\n changeNav();\n });\n\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Trang t\u1ed5ng quan T\u01b0\u01a1ng t\u00e1c: \u0110\u1ec1 xu\u1ea5t Ph\u00f2ng Lab Thi\u1ebft k\u1ebf Vi m\u1ea1ch Lab Vi M\u1ea1ch T\u1ed5ng quan Ng\u00e2n s\u00e1ch L\u1ed9 tr\u00ecnh H\u1ecdc ph\u1ea7n T\u1ed5ng quan Ng\u00e2n s\u00e1ch L\u1ed9 tr\u00ecnh H\u1ecdc ph\u1ea7n T\u1ea6M NH\u00ccN CHI\u1ebeN L\u01af\u1ee2C Th\u00e0nh l\u1eadp Ph\u00f2ng Th\u00ed nghi\u1ec7m Thi\u1ebft k\u1ebf Vi m\u1ea1ch Qu\u1ed1c gia t\u1ea1i Tr\u01b0\u1eddng \u0110\u1ea1i h\u1ecdc Quy Nh\u01a1n M\u1ed9t kho\u1ea3n…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"categories":[1],"tags":[],"class_list":["post-4473","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/labantrithuc.com\/index.php?rest_route=\/wp\/v2\/posts\/4473","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/labantrithuc.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/labantrithuc.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/labantrithuc.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/labantrithuc.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4473"}],"version-history":[{"count":4,"href":"https:\/\/labantrithuc.com\/index.php?rest_route=\/wp\/v2\/posts\/4473\/revisions"}],"predecessor-version":[{"id":4478,"href":"https:\/\/labantrithuc.com\/index.php?rest_route=\/wp\/v2\/posts\/4473\/revisions\/4478"}],"wp:attachment":[{"href":"https:\/\/labantrithuc.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4473"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/labantrithuc.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4473"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/labantrithuc.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4473"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":4473,"date":"2025-06-19T21:24:04","date_gmt":"2025-06-19T14:24:04","guid":{"rendered":"https:\/\/labantrithuc.com\/?p=4473"},"modified":"2025-06-19T22:01:21","modified_gmt":"2025-06-19T15:01:21","slug":"phong-thi-nghiem-thiet-ke-vi-mach","status":"publish","type":"post","link":"https:\/\/labantrithuc.com\/?p=4473","title":{"rendered":"Ph\u00f2ng Th\u00ed nghi\u1ec7m Thi\u1ebft k\u1ebf Vi m\u1ea1ch"},"content":{"rendered":"\n