{"id":10122,"date":"2025-12-26T14:04:39","date_gmt":"2025-12-26T07:04:39","guid":{"rendered":"https:\/\/midar.vn\/?page_id=10122"},"modified":"2025-12-26T14:04:40","modified_gmt":"2025-12-26T07:04:40","slug":"luong-nhan-vien","status":"publish","type":"page","link":"https:\/\/midar.vn\/vi\/luong-nhan-vien\/","title":{"rendered":"Luong Nhan Vien"},"content":{"rendered":"\n\n\n\n \n \n Ch\u1ea5m B\u1ea3ng L\u01b0\u01a1ng Nh\u00e2n Vi\u00ean<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n min-height: 100vh;\n padding: 20px;\n }\n .container { max-width: 1200px; margin: 0 auto; }\n h1 { text-align: center; color: white; margin-bottom: 20px; text-shadow: 2px 2px 4px rgba(0,0,0,0.3); }\n .nav-tabs { display: flex; gap: 5px; margin-bottom: 20px; flex-wrap: wrap; justify-content: center; }\n .nav-tab {\n padding: 10px 15px; background: rgba(255,255,255,0.2); color: white; border: none;\n border-radius: 10px 10px 0 0; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.3s;\n }\n .nav-tab:hover { background: rgba(255,255,255,0.3); }\n .nav-tab.active { background: white; color: #5a67d8; }\n .tab-content { display: none; }\n .tab-content.active { display: block; }\n .card { background: white; border-radius: 15px; padding: 25px; margin-bottom: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); }\n .card h2 { color: #5a67d8; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #e2e8f0; }\n .form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin-bottom: 15px; }\n .form-group { display: flex; flex-direction: column; position: relative; }\n .form-group label { font-weight: 600; color: #4a5568; margin-bottom: 5px; font-size: 14px; }\n .form-group input, .form-group select {\n padding: 12px; border: 2px solid #e2e8f0; border-radius: 8px; font-size: 14px; transition: border-color 0.3s;\n }\n .form-group input:focus, .form-group select:focus { outline: none; border-color: #5a67d8; }\n .suggestions { position: absolute; top: 100%; left: 0; right: 0; background: white; border: 2px solid #e2e8f0; border-top: none; border-radius: 0 0 8px 8px; max-height: 150px; overflow-y: auto; z-index: 100; display: none; }\n .suggestions.show { display: block; }\n .suggestion-item { padding: 10px 12px; cursor: pointer; border-bottom: 1px solid #e2e8f0; }\n .suggestion-item:hover { background: #f7fafc; }\n .btn { padding: 12px 30px; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s; margin: 5px; }\n .btn-sm { padding: 8px 15px; font-size: 14px; }\n .btn-primary { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; }\n .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 5px 20px rgba(102, 126, 234, 0.4); }\n .btn-danger { background: #e53e3e; color: white; }\n .btn-success { background: #38a169; color: white; }\n .btn-secondary { background: #718096; color: white; }\n .btn-warning { background: #ed8936; color: white; }\n .btn-info { background: #4299e1; color: white; }\n .btn-group { text-align: center; margin-top: 20px; }\n table { width: 100%; border-collapse: collapse; margin-top: 15px; }\n th, td { padding: 12px; text-align: left; border-bottom: 1px solid #e2e8f0; }\n th { background: #5a67d8; color: white; font-weight: 600; }\n tr:hover { background: #f7fafc; }\n .salary-breakdown { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 15px; margin-top: 15px; }\n .breakdown-item { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 15px; border-radius: 10px; text-align: center; }\n .breakdown-item h3 { font-size: 13px; opacity: 0.9; margin-bottom: 8px; }\n .breakdown-item .amount { font-size: 18px; font-weight: bold; }\n .total-salary { background: linear-gradient(135deg, #38a169 0%, #2f855a 100%); }\n .deduction { background: linear-gradient(135deg, #e53e3e 0%, #c53030 100%); }\n .bonus { background: linear-gradient(135deg, #ed8936 0%, #dd6b20 100%); }\n .action-btn { padding: 6px 12px; border: none; border-radius: 5px; cursor: pointer; font-size: 12px; margin: 2px; }\n .view-btn { background: #4299e1; color: white; }\n .edit-btn { background: #ed8936; color: white; }\n .delete-btn { background: #e53e3e; color: white; }\n .print-btn { background: #38a169; color: white; }\n .empty-message { text-align: center; color: #718096; padding: 40px; font-style: italic; }\n .summary-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 15px; margin-bottom: 20px; }\n .stat-item { background: #f7fafc; padding: 15px; border-radius: 10px; text-align: center; }\n .stat-item h4 { color: #718096; font-size: 12px; margin-bottom: 5px; }\n .stat-item .value { color: #5a67d8; font-size: 18px; font-weight: bold; }\n .search-box { display: flex; gap: 10px; margin-bottom: 15px; }\n .search-box input { flex: 1; padding: 12px; border: 2px solid #e2e8f0; border-radius: 8px; font-size: 14px; }\n .filter-group { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 15px; align-items: center; }\n .filter-group select, .filter-group input { padding: 10px 15px; border: 2px solid #e2e8f0; border-radius: 8px; font-size: 14px; }\n .chart-container { background: #f7fafc; border-radius: 10px; padding: 20px; margin-bottom: 20px; }\n .bar-chart { display: flex; align-items: flex-end; gap: 20px; height: 200px; padding: 20px 0; }\n .bar-item { flex: 1; display: flex; flex-direction: column; align-items: center; }\n .bar { width: 100%; max-width: 60px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-radius: 5px 5px 0 0; }\n .bar-label { margin-top: 10px; font-size: 11px; color: #4a5568; text-align: center; }\n .bar-value { font-size: 10px; color: #718096; margin-bottom: 5px; }\n .section-title { font-size: 14px; font-weight: 600; color: #5a67d8; margin: 15px 0 10px 0; padding-bottom: 5px; border-bottom: 1px solid #e2e8f0; }\n .modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); }\n .modal.show { display: flex; align-items: center; justify-content: center; }\n .modal-content { background: white; border-radius: 15px; padding: 30px; max-width: 600px; width: 90%; max-height: 90vh; overflow-y: auto; }\n .modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }\n .modal-header h3 { color: #5a67d8; }\n .close-btn { background: none; border: none; font-size: 24px; cursor: pointer; color: #718096; }\n .phieu-luong { background: white; padding: 30px; border: 2px solid #5a67d8; }\n .phieu-luong h2 { text-align: center; color: #5a67d8; margin-bottom: 20px; }\n .phieu-luong table { border: 1px solid #e2e8f0; }\n .phieu-luong th, .phieu-luong td { border: 1px solid #e2e8f0; padding: 8px 12px; }\n .file-input { display: none; }\n .file-label { display: inline-block; padding: 12px 30px; background: #38a169; color: white; border-radius: 8px; cursor: pointer; font-weight: 600; }\n .file-label:hover { background: #2f855a; }\n .leave-badge { display: inline-block; padding: 4px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; }\n .leave-remaining { background: #c6f6d5; color: #276749; }\n .leave-used { background: #fed7d7; color: #c53030; }\n @media print { \n body { background: white; padding: 0; } \n .nav-tabs, .btn-group, .action-btn, .search-box, .filter-group, .modal { display: none !important; } \n .card { box-shadow: none; border: 1px solid #e2e8f0; } \n .phieu-luong { border: 2px solid #333; }\n }\n @media (max-width: 768px) { .form-row { grid-template-columns: 1fr; } .nav-tab { padding: 8px 10px; font-size: 12px; } }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <h1>Ch\u1ea5m B\u1ea3ng L\u01b0\u01a1ng Nh\u00e2n Vi\u00ean<\/h1>\n <div class=\"nav-tabs\">\n <button class=\"nav-tab active\" onclick=\"chuyenTab('chamLuong')\">Ch\u1ea5m L\u01b0\u01a1ng<\/button>\n <button class=\"nav-tab\" onclick=\"chuyenTab('danhSach')\">Danh S\u00e1ch NV<\/button>\n <button class=\"nav-tab\" onclick=\"chuyenTab('lichSu')\">L\u1ecbch S\u1eed L\u01b0\u01a1ng<\/button>\n <button class=\"nav-tab\" onclick=\"chuyenTab('nghiPhep')\">Ngh\u1ec9 Ph\u00e9p<\/button>\n <button class=\"nav-tab\" onclick=\"chuyenTab('baoCao')\">B\u00e1o C\u00e1o<\/button>\n <button class=\"nav-tab\" onclick=\"chuyenTab('duLieu')\">D\u1eef Li\u1ec7u<\/button>\n <\/div>\n\n <div id=\"chamLuong\" class=\"tab-content active\">\n <div class=\"card\">\n <h2>Th\u00f4ng Tin Nh\u00e2n Vi\u00ean<\/h2>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>M\u00e3 Nh\u00e2n Vi\u00ean<\/label>\n <input type=\"text\" id=\"maNV\" placeholder=\"VD: NV001\" oninput=\"goiYNhanVien('maNV')\">\n <div class=\"suggestions\" id=\"maNV_suggestions\"><\/div>\n <\/div>\n <div class=\"form-group\">\n <label>H\u1ecd v\u00e0 T\u00ean<\/label>\n <input type=\"text\" id=\"hoTen\" placeholder=\"Nh\u1eadp h\u1ecd t\u00ean\" oninput=\"goiYNhanVien('hoTen')\">\n <div class=\"suggestions\" id=\"hoTen_suggestions\"><\/div>\n <\/div>\n <div class=\"form-group\">\n <label>Ch\u1ee9c V\u1ee5<\/label>\n <select id=\"chucVu\">\n <option value=\"nhan_vien\">Nh\u00e2n vi\u00ean<\/option>\n <option value=\"truong_nhom\">Tr\u01b0\u1edfng nh\u00f3m<\/option>\n <option value=\"pho_phong\">Ph\u00f3 ph\u00f2ng<\/option>\n <option value=\"truong_phong\">Tr\u01b0\u1edfng ph\u00f2ng<\/option>\n <option value=\"giam_doc\">Gi\u00e1m \u0111\u1ed1c<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label>Ph\u00f2ng Ban<\/label>\n <select id=\"phongBan\">\n <option value=\"kinh_doanh\">Kinh doanh<\/option>\n <option value=\"ke_toan\">K\u1ebf to\u00e1n<\/option>\n <option value=\"nhan_su\">Nh\u00e2n s\u1ef1<\/option>\n <option value=\"ky_thuat\">K\u1ef9 thu\u1eadt<\/option>\n <option value=\"marketing\">Marketing<\/option>\n <option value=\"san_xuat\">S\u1ea3n xu\u1ea5t<\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"card\">\n <h2>Th\u00f4ng Tin Ch\u1ea5m C\u00f4ng & L\u01b0\u01a1ng<\/h2>\n <div class=\"section-title\">L\u01b0\u01a1ng c\u01a1 b\u1ea3n & Ng\u00e0y c\u00f4ng<\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>L\u01b0\u01a1ng C\u01a1 B\u1ea3n (VN\u0110)<\/label>\n <input type=\"number\" id=\"luongCoBan\" value=\"10000000\">\n <\/div>\n <div class=\"form-group\">\n <label>S\u1ed1 Ng\u00e0y C\u00f4ng Chu\u1ea9n<\/label>\n <input type=\"number\" id=\"ngayCongChuan\" value=\"26\" min=\"1\" max=\"31\">\n <\/div>\n <div class=\"form-group\">\n <label>S\u1ed1 Ng\u00e0y C\u00f4ng Th\u1ef1c T\u1ebf<\/label>\n <input type=\"number\" id=\"ngayCong\" value=\"26\" min=\"0\" max=\"31\">\n <\/div>\n <div class=\"form-group\">\n <label>Th\u00e1ng\/N\u0103m<\/label>\n <input type=\"month\" id=\"thangNam\" value=\"\">\n <\/div>\n <\/div>\n\n <div class=\"section-title\">L\u00e0m Th\u00eam Gi\u1edd (Theo Ca)<\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Gi\u1edd L\u00e0m Th\u00eam Ca Ng\u00e0y (x1.5)<\/label>\n <input type=\"number\" id=\"gioLamThemNgay\" value=\"0\" min=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Gi\u1edd L\u00e0m Th\u00eam Ca \u0110\u00eam (x2.0)<\/label>\n <input type=\"number\" id=\"gioLamThemDem\" value=\"0\" min=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Gi\u1edd L\u00e0m Cu\u1ed1i Tu\u1ea7n (x2.0)<\/label>\n <input type=\"number\" id=\"gioLamCuoiTuan\" value=\"0\" min=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Gi\u1edd L\u00e0m Ng\u00e0y L\u1ec5 (x3.0)<\/label>\n <input type=\"number\" id=\"gioLamNgayLe\" value=\"0\" min=\"0\">\n <\/div>\n <\/div>\n\n <div class=\"section-title\">C\u00e1c Kho\u1ea3n Ph\u1ee5 C\u1ea5p<\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Ph\u1ee5 C\u1ea5p Ch\u1ee9c V\u1ee5 (VN\u0110)<\/label>\n <input type=\"number\" id=\"phuCapChucVu\" value=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Ph\u1ee5 C\u1ea5p \u0102n Tr\u01b0a (VN\u0110)<\/label>\n <input type=\"number\" id=\"phuCapAn\" value=\"730000\">\n <\/div>\n <div class=\"form-group\">\n <label>Ph\u1ee5 C\u1ea5p X\u0103ng Xe (VN\u0110)<\/label>\n <input type=\"number\" id=\"phuCapXe\" value=\"500000\">\n <\/div>\n <div class=\"form-group\">\n <label>Ph\u1ee5 C\u1ea5p \u0110i\u1ec7n Tho\u1ea1i (VN\u0110)<\/label>\n <input type=\"number\" id=\"phuCapDienThoai\" value=\"200000\">\n <\/div>\n <\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Ph\u1ee5 C\u1ea5p Nh\u00e0 \u1ede (VN\u0110)<\/label>\n <input type=\"number\" id=\"phuCapNhaO\" value=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Ph\u1ee5 C\u1ea5p \u0110\u1ed9c H\u1ea1i (VN\u0110)<\/label>\n <input type=\"number\" id=\"phuCapDocHai\" value=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Th\u01b0\u1edfng \/ Ph\u1ee5 C\u1ea5p Kh\u00e1c (VN\u0110)<\/label>\n <input type=\"number\" id=\"thuongKhac\" value=\"0\">\n <\/div>\n <\/div>\n\n <div class=\"section-title\">Th\u01b0\u1edfng Cu\u1ed1i N\u0103m<\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>L\u01b0\u01a1ng Th\u00e1ng 13 (VN\u0110)<\/label>\n <input type=\"number\" id=\"luongThang13\" value=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Th\u01b0\u1edfng T\u1ebft (VN\u0110)<\/label>\n <input type=\"number\" id=\"thuongTet\" value=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Th\u01b0\u1edfng Hi\u1ec7u Su\u1ea5t (VN\u0110)<\/label>\n <input type=\"number\" id=\"thuongHieuSuat\" value=\"0\">\n <\/div>\n <\/div>\n\n <div class=\"section-title\">C\u00e1c Kho\u1ea3n Kh\u1ea5u Tr\u1eeb<\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>BHXH (% l\u01b0\u01a1ng \u0111\u00f3ng BH)<\/label>\n <input type=\"number\" id=\"bhxh\" value=\"8\" step=\"0.1\">\n <\/div>\n <div class=\"form-group\">\n <label>BHYT (% l\u01b0\u01a1ng \u0111\u00f3ng BH)<\/label>\n <input type=\"number\" id=\"bhyt\" value=\"1.5\" step=\"0.1\">\n <\/div>\n <div class=\"form-group\">\n <label>BHTN (% l\u01b0\u01a1ng \u0111\u00f3ng BH)<\/label>\n <input type=\"number\" id=\"bhtn\" value=\"1\" step=\"0.1\">\n <\/div>\n <div class=\"form-group\">\n <label>L\u01b0\u01a1ng \u0110\u00f3ng B\u1ea3o Hi\u1ec3m (VN\u0110)<\/label>\n <input type=\"number\" id=\"luongDongBH\" value=\"10000000\">\n <\/div>\n <\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>S\u1ed1 Ng\u01b0\u1eddi Ph\u1ee5 Thu\u1ed9c<\/label>\n <input type=\"number\" id=\"nguoiPhuThuoc\" value=\"0\" min=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>T\u1ea1m \u1ee8ng (VN\u0110)<\/label>\n <input type=\"number\" id=\"tamUng\" value=\"0\">\n <\/div>\n <div class=\"form-group\">\n <label>Kh\u1ea5u Tr\u1eeb Kh\u00e1c (VN\u0110)<\/label>\n <input type=\"number\" id=\"khauTruKhac\" value=\"0\">\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"btn-group\">\n <button class=\"btn btn-primary\" onclick=\"tinhLuong()\">T\u00ednh L\u01b0\u01a1ng<\/button>\n <button class=\"btn btn-success\" onclick=\"themNhanVien()\">Th\u00eam V\u00e0o Danh S\u00e1ch<\/button>\n <button class=\"btn btn-warning\" onclick=\"tinhLuongHangLoat()\">T\u00ednh L\u01b0\u01a1ng H\u00e0ng Lo\u1ea1t<\/button>\n <button class=\"btn btn-danger\" onclick=\"xoaForm()\">X\u00f3a Form<\/button>\n <\/div>\n\n <div class=\"card\" id=\"ketQuaCard\" style=\"display: none;\">\n <h2>K\u1ebft Qu\u1ea3 T\u00ednh L\u01b0\u01a1ng<\/h2>\n <div class=\"salary-breakdown\" id=\"ketQuaLuong\"><\/div>\n <\/div>\n <\/div>\n\n <div id=\"danhSach\" class=\"tab-content\">\n <div class=\"card\">\n <h2>Danh S\u00e1ch Nh\u00e2n Vi\u00ean<\/h2>\n <div class=\"search-box\">\n <input type=\"text\" id=\"timKiem\" placeholder=\"T\u00ecm ki\u1ebfm theo m\u00e3 NV ho\u1eb7c h\u1ecd t\u00ean...\" oninput=\"timKiemNhanVien()\">\n <\/div>\n <div class=\"summary-stats\">\n <div class=\"stat-item\"><h4>T\u1ed5ng Nh\u00e2n Vi\u00ean<\/h4><div class=\"value\" id=\"tongNV\">0<\/div><\/div>\n <div class=\"stat-item\"><h4>T\u1ed5ng L\u01b0\u01a1ng Chi Tr\u1ea3<\/h4><div class=\"value\" id=\"tongLuong\">0 \u0111<\/div><\/div>\n <div class=\"stat-item\"><h4>L\u01b0\u01a1ng Trung B\u00ecnh<\/h4><div class=\"value\" id=\"luongTB\">0 \u0111<\/div><\/div>\n <div class=\"stat-item\"><h4>L\u01b0\u01a1ng Cao Nh\u1ea5t<\/h4><div class=\"value\" id=\"luongMax\">0 \u0111<\/div><\/div>\n <div class=\"stat-item\"><h4>L\u01b0\u01a1ng Th\u1ea5p Nh\u1ea5t<\/h4><div class=\"value\" id=\"luongMin\">0 \u0111<\/div><\/div>\n <\/div>\n <div id=\"danhSachNV\"><p class=\"empty-message\">Ch\u01b0a c\u00f3 nh\u00e2n vi\u00ean n\u00e0o trong danh s\u00e1ch<\/p><\/div>\n <\/div>\n <\/div>\n\n <div id=\"lichSu\" class=\"tab-content\">\n <div class=\"card\">\n <h2>L\u1ecbch S\u1eed L\u01b0\u01a1ng Theo Th\u00e1ng<\/h2>\n <div class=\"filter-group\">\n <select id=\"locNVLichSu\" onchange=\"capNhatLichSu()\">\n <option value=\"\">T\u1ea5t c\u1ea3 nh\u00e2n vi\u00ean<\/option>\n <\/select>\n <input type=\"month\" id=\"tuThang\" onchange=\"capNhatLichSu()\">\n <input type=\"month\" id=\"denThang\" onchange=\"capNhatLichSu()\">\n <button class=\"btn btn-sm btn-primary\" onclick=\"capNhatLichSu()\">L\u1ecdc<\/button>\n <\/div>\n <div class=\"chart-container\">\n <h3 style=\"margin-bottom: 15px; color: #4a5568;\">Bi\u1ec3u \u0111\u1ed3 l\u01b0\u01a1ng theo th\u00e1ng<\/h3>\n <div class=\"bar-chart\" id=\"bieuDoLichSu\"><\/div>\n <\/div>\n <div id=\"bangLichSu\"><\/div>\n <\/div>\n <\/div>\n\n <div id=\"nghiPhep\" class=\"tab-content\">\n <div class=\"card\">\n <h2>Qu\u1ea3n L\u00fd Ngh\u1ec9 Ph\u00e9p<\/h2>\n <div class=\"section-title\">\u0110\u0103ng K\u00fd Ngh\u1ec9 Ph\u00e9p<\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Nh\u00e2n Vi\u00ean<\/label>\n <select id=\"nvNghiPhep\">\n <option value=\"\">Ch\u1ecdn nh\u00e2n vi\u00ean<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label>Lo\u1ea1i Ngh\u1ec9<\/label>\n <select id=\"loaiNghi\">\n <option value=\"phep_nam\">Ph\u00e9p n\u0103m<\/option>\n <option value=\"om\">Ngh\u1ec9 \u1ed1m<\/option>\n <option value=\"thai_san\">Thai s\u1ea3n<\/option>\n <option value=\"viec_rieng\">Vi\u1ec7c ri\u00eang (kh\u00f4ng l\u01b0\u01a1ng)<\/option>\n <option value=\"le_tet\">L\u1ec5 T\u1ebft<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label>T\u1eeb Ng\u00e0y<\/label>\n <input type=\"date\" id=\"tuNgayNghi\">\n <\/div>\n <div class=\"form-group\">\n <label>\u0110\u1ebfn Ng\u00e0y<\/label>\n <input type=\"date\" id=\"denNgayNghi\">\n <\/div>\n <\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>L\u00fd Do<\/label>\n <input type=\"text\" id=\"lyDoNghi\" placeholder=\"Nh\u1eadp l\u00fd do ngh\u1ec9 ph\u00e9p\">\n <\/div>\n <\/div>\n <div class=\"btn-group\">\n <button class=\"btn btn-success\" onclick=\"themNghiPhep()\">\u0110\u0103ng K\u00fd Ngh\u1ec9<\/button>\n <\/div>\n\n <div class=\"section-title\" style=\"margin-top: 30px;\">Danh S\u00e1ch Ngh\u1ec9 Ph\u00e9p<\/div>\n <div id=\"danhSachNghiPhep\"><p class=\"empty-message\">Ch\u01b0a c\u00f3 \u0111\u01a1n ngh\u1ec9 ph\u00e9p n\u00e0o<\/p><\/div>\n\n <div class=\"section-title\" style=\"margin-top: 30px;\">Th\u1ed1ng K\u00ea Ng\u00e0y Ph\u00e9p<\/div>\n <div id=\"thongKePhep\"><\/div>\n <\/div>\n <\/div>\n\n <div id=\"baoCao\" class=\"tab-content\">\n <div class=\"card\">\n <h2>B\u00e1o C\u00e1o T\u1ed5ng H\u1ee3p<\/h2>\n <div class=\"filter-group\">\n <select id=\"locPhongBan\" onchange=\"capNhatBaoCao()\">\n <option value=\"\">T\u1ea5t c\u1ea3 ph\u00f2ng ban<\/option>\n <option value=\"Kinh doanh\">Kinh doanh<\/option>\n <option value=\"K\u1ebf to\u00e1n\">K\u1ebf to\u00e1n<\/option>\n <option value=\"Nh\u00e2n s\u1ef1\">Nh\u00e2n s\u1ef1<\/option>\n <option value=\"K\u1ef9 thu\u1eadt\">K\u1ef9 thu\u1eadt<\/option>\n <option value=\"Marketing\">Marketing<\/option>\n <option value=\"S\u1ea3n xu\u1ea5t\">S\u1ea3n xu\u1ea5t<\/option>\n <\/select>\n <button class=\"btn btn-sm btn-secondary\" onclick=\"inBaoCao()\">In B\u00e1o C\u00e1o<\/button>\n <button class=\"btn btn-sm btn-primary\" onclick=\"xuatExcel()\">Xu\u1ea5t Excel<\/button>\n <\/div>\n <div class=\"chart-container\">\n <h3 style=\"margin-bottom: 15px; color: #4a5568;\">Bi\u1ec3u \u0111\u1ed3 l\u01b0\u01a1ng theo ph\u00f2ng ban<\/h3>\n <div class=\"bar-chart\" id=\"bieuDoPhongBan\"><\/div>\n <\/div>\n <div class=\"summary-stats\">\n <div class=\"stat-item\"><h4>T\u1ed5ng Nh\u00e2n Vi\u00ean<\/h4><div class=\"value\" id=\"baoCaoTongNV\">0<\/div><\/div>\n <div class=\"stat-item\"><h4>T\u1ed5ng Chi Ph\u00ed L\u01b0\u01a1ng<\/h4><div class=\"value\" id=\"baoCaoTongLuong\">0 \u0111<\/div><\/div>\n <div class=\"stat-item\"><h4>T\u1ed5ng B\u1ea3o Hi\u1ec3m<\/h4><div class=\"value\" id=\"baoCaoTongBH\">0 \u0111<\/div><\/div>\n <div class=\"stat-item\"><h4>T\u1ed5ng Th\u01b0\u1edfng<\/h4><div class=\"value\" id=\"baoCaoTongThuong\">0 \u0111<\/div><\/div>\n <\/div>\n <div id=\"bangBaoCao\"><\/div>\n <\/div>\n <\/div>\n\n <div id=\"duLieu\" class=\"tab-content\">\n <div class=\"card\">\n <h2>Qu\u1ea3n L\u00fd D\u1eef Li\u1ec7u<\/h2>\n \n <div class=\"section-title\">Nh\u1eadp D\u1eef Li\u1ec7u T\u1eeb File CSV<\/div>\n <p style=\"color: #718096; margin-bottom: 15px;\">File CSV c\u1ea7n c\u00f3 c\u00e1c c\u1ed9t: M\u00e3 NV, H\u1ecd T\u00ean, Ch\u1ee9c V\u1ee5, Ph\u00f2ng Ban, L\u01b0\u01a1ng C\u01a1 B\u1ea3n, L\u01b0\u01a1ng \u0110\u00f3ng BH<br><small>(L\u01b0u \u00fd: Ch\u1ec9 h\u1ed7 tr\u1ee3 file CSV. N\u1ebfu d\u00f9ng Excel, h\u00e3y l\u01b0u th\u00e0nh file CSV tr\u01b0\u1edbc khi nh\u1eadp)<\/small><\/p>\n <input type=\"file\" id=\"fileInput\" class=\"file-input\" accept=\".csv\" onchange=\"nhapCSV(event)\">\n <label for=\"fileInput\" class=\"file-label\">Ch\u1ecdn File CSV<\/label>\n <div id=\"ketQuaNhap\" style=\"margin-top: 15px;\"><\/div>\n\n <div class=\"section-title\" style=\"margin-top: 30px;\">Sao L\u01b0u & Kh\u00f4i Ph\u1ee5c D\u1eef Li\u1ec7u<\/div>\n <div class=\"btn-group\" style=\"text-align: left;\">\n <button class=\"btn btn-success\" onclick=\"saoLuuDuLieu()\">Sao L\u01b0u D\u1eef Li\u1ec7u<\/button>\n <input type=\"file\" id=\"restoreFile\" class=\"file-input\" accept=\".json\" onchange=\"khoiPhucDuLieu(event)\">\n <label for=\"restoreFile\" class=\"file-label\" style=\"background: #4299e1;\">Kh\u00f4i Ph\u1ee5c T\u1eeb File<\/label>\n <button class=\"btn btn-danger\" onclick=\"xoaTatCaDuLieu()\">X\u00f3a T\u1ea5t C\u1ea3 D\u1eef Li\u1ec7u<\/button>\n <\/div>\n\n <div class=\"section-title\" style=\"margin-top: 30px;\">Xu\u1ea5t B\u00e1o C\u00e1o<\/div>\n <div class=\"btn-group\" style=\"text-align: left;\">\n <button class=\"btn btn-primary\" onclick=\"xuatExcel()\">Xu\u1ea5t Excel<\/button>\n <button class=\"btn btn-secondary\" onclick=\"xuatCSV()\">Xu\u1ea5t CSV<\/button>\n <\/div>\n\n <div class=\"section-title\" style=\"margin-top: 30px;\">Th\u00f4ng Tin H\u1ec7 Th\u1ed1ng<\/div>\n <div class=\"summary-stats\">\n <div class=\"stat-item\"><h4>T\u1ed5ng Nh\u00e2n Vi\u00ean<\/h4><div class=\"value\" id=\"duLieuTongNV\">0<\/div><\/div>\n <div class=\"stat-item\"><h4>B\u1ea3n Ghi L\u01b0\u01a1ng<\/h4><div class=\"value\" id=\"duLieuTongLuong\">0<\/div><\/div>\n <div class=\"stat-item\"><h4>\u0110\u01a1n Ngh\u1ec9 Ph\u00e9p<\/h4><div class=\"value\" id=\"duLieuTongPhep\">0<\/div><\/div>\n <div class=\"stat-item\"><h4>Dung L\u01b0\u1ee3ng<\/h4><div class=\"value\" id=\"duLieuDungLuong\">0 KB<\/div><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div id=\"modalPhieuLuong\" class=\"modal\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h3>Phi\u1ebfu L\u01b0\u01a1ng<\/h3>\n <button class=\"close-btn\" onclick=\"dongModal()\">×<\/button>\n <\/div>\n <div id=\"noiDungPhieuLuong\"><\/div>\n <div class=\"btn-group\">\n <button class=\"btn btn-primary\" onclick=\"inPhieuLuong()\">In Phi\u1ebfu L\u01b0\u01a1ng<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n let danhSachNhanVien = [];\n let danhSachNhanVienDaLuu = [];\n let lichSuLuong = [];\n let danhSachNghiPhep = [];\n const GIAM_TRU_BAN_THAN = 11000000;\n const GIAM_TRU_PHU_THUOC = 4400000;\n const NGAY_PHEP_NAM = 12;\n\n function khoiTaoThang() {\n const now = new Date();\n const thang = now.toISOString().slice(0, 7);\n document.getElementById('thangNam').value = thang;\n document.getElementById('tuThang').value = new Date(now.getFullYear(), 0).toISOString().slice(0, 7);\n document.getElementById('denThang').value = thang;\n }\n\n function escapeHtml(text) {\n if (!text) return '';\n const div = document.createElement('div');\n div.textContent = text;\n return div.innerHTML;\n }\n function formatTien(so) { return new Intl.NumberFormat('vi-VN').format(Math.round(so)) + ' \u0111'; }\n function layGiaTri(id) { return parseFloat(document.getElementById(id).value) || 0; }\n function layText(id) { return document.getElementById(id).value.trim(); }\n function laySelectedText(id) { const s = document.getElementById(id); return s.options[s.selectedIndex].text; }\n\n function chuyenTab(tabId) {\n document.querySelectorAll('.tab-content').forEach(t => t.classList.remove('active'));\n document.querySelectorAll('.nav-tab').forEach(b => b.classList.remove('active'));\n document.getElementById(tabId).classList.add('active');\n event.target.classList.add('active');\n if (tabId === 'baoCao') capNhatBaoCao();\n if (tabId === 'lichSu') capNhatLichSu();\n if (tabId === 'nghiPhep') capNhatNghiPhep();\n if (tabId === 'duLieu') capNhatDuLieu();\n }\n\n function goiYNhanVien(fieldId) {\n const input = document.getElementById(fieldId);\n const value = input.value.toLowerCase().trim();\n const suggestionsDiv = document.getElementById(fieldId + '_suggestions');\n if (!value) { suggestionsDiv.classList.remove('show'); return; }\n let matches = danhSachNhanVienDaLuu.filter(nv => \n fieldId === 'maNV' ? nv.maNV.toLowerCase().includes(value) : nv.hoTen.toLowerCase().includes(value)\n );\n if (matches.length > 0) {\n suggestionsDiv.innerHTML = matches.map(nv => `<div class=\"suggestion-item\" onclick=\"chonNhanVien('${escapeHtml(nv.maNV)}')\"><strong>${escapeHtml(nv.maNV)}<\/strong> - ${escapeHtml(nv.hoTen)}<\/div>`).join('');\n suggestionsDiv.classList.add('show');\n } else { suggestionsDiv.classList.remove('show'); }\n }\n\n function chonNhanVien(maNV) {\n const nv = danhSachNhanVienDaLuu.find(n => n.maNV === maNV);\n if (nv) {\n document.getElementById('maNV').value = nv.maNV;\n document.getElementById('hoTen').value = nv.hoTen;\n document.getElementById('luongCoBan').value = nv.luongCoBan;\n document.getElementById('luongDongBH').value = nv.luongDongBH || nv.luongCoBan;\n const chucVuSelect = document.getElementById('chucVu');\n for (let i = 0; i < chucVuSelect.options.length; i++) {\n if (chucVuSelect.options[i].text === nv.chucVu) { chucVuSelect.selectedIndex = i; break; }\n }\n const phongBanSelect = document.getElementById('phongBan');\n for (let i = 0; i < phongBanSelect.options.length; i++) {\n if (phongBanSelect.options[i].text === nv.phongBan) { phongBanSelect.selectedIndex = i; break; }\n }\n }\n document.querySelectorAll('.suggestions').forEach(s => s.classList.remove('show'));\n }\n\n document.addEventListener('click', function(e) {\n if (!e.target.closest('.form-group')) document.querySelectorAll('.suggestions').forEach(s => s.classList.remove('show'));\n });\n\n function kiemTraDuLieu() {\n const ngayCongChuan = layGiaTri('ngayCongChuan');\n if (ngayCongChuan <= 0) { alert('S\u1ed1 ng\u00e0y c\u00f4ng chu\u1ea9n ph\u1ea3i l\u1edbn h\u01a1n 0!'); return false; }\n return true;\n }\n\n function tinhLuong() {\n if (!kiemTraDuLieu()) return null;\n\n const luongCoBan = layGiaTri('luongCoBan');\n const ngayCongChuan = layGiaTri('ngayCongChuan');\n const ngayCong = layGiaTri('ngayCong');\n \n const gioLamThemNgay = layGiaTri('gioLamThemNgay');\n const gioLamThemDem = layGiaTri('gioLamThemDem');\n const gioLamCuoiTuan = layGiaTri('gioLamCuoiTuan');\n const gioLamNgayLe = layGiaTri('gioLamNgayLe');\n \n const phuCapChucVu = layGiaTri('phuCapChucVu');\n const phuCapAn = layGiaTri('phuCapAn');\n const phuCapXe = layGiaTri('phuCapXe');\n const phuCapDienThoai = layGiaTri('phuCapDienThoai');\n const phuCapNhaO = layGiaTri('phuCapNhaO');\n const phuCapDocHai = layGiaTri('phuCapDocHai');\n const thuongKhac = layGiaTri('thuongKhac');\n \n const luongThang13 = layGiaTri('luongThang13');\n const thuongTet = layGiaTri('thuongTet');\n const thuongHieuSuat = layGiaTri('thuongHieuSuat');\n \n const bhxhRate = layGiaTri('bhxh') \/ 100;\n const bhytRate = layGiaTri('bhyt') \/ 100;\n const bhtnRate = layGiaTri('bhtn') \/ 100;\n const luongDongBH = layGiaTri('luongDongBH');\n const nguoiPhuThuoc = layGiaTri('nguoiPhuThuoc');\n const tamUng = layGiaTri('tamUng');\n const khauTruKhac = layGiaTri('khauTruKhac');\n\n const luongTheoNgay = (luongCoBan \/ ngayCongChuan) * ngayCong;\n const luongGio = luongCoBan \/ ngayCongChuan \/ 8;\n \n const luongLamThemNgay = gioLamThemNgay * luongGio * 1.5;\n const luongLamThemDem = gioLamThemDem * luongGio * 2.0;\n const luongLamCuoiTuan = gioLamCuoiTuan * luongGio * 2.0;\n const luongLamNgayLe = gioLamNgayLe * luongGio * 3.0;\n const luongLamThem = luongLamThemNgay + luongLamThemDem + luongLamCuoiTuan + luongLamNgayLe;\n \n const tongPhuCap = phuCapChucVu + phuCapAn + phuCapXe + phuCapDienThoai + phuCapNhaO + phuCapDocHai + thuongKhac;\n const tongThuong = luongThang13 + thuongTet + thuongHieuSuat;\n const tongThuNhap = luongTheoNgay + luongLamThem + tongPhuCap + tongThuong;\n \n const bhxh = luongDongBH * bhxhRate;\n const bhyt = luongDongBH * bhytRate;\n const bhtn = luongDongBH * bhtnRate;\n const tongBaoHiem = bhxh + bhyt + bhtn;\n \n const thuNhapChiuThue = tongThuNhap - tongBaoHiem - GIAM_TRU_BAN_THAN - (nguoiPhuThuoc * GIAM_TRU_PHU_THUOC);\n let thueTNCN = 0;\n if (thuNhapChiuThue > 0) {\n if (thuNhapChiuThue <= 5000000) thueTNCN = thuNhapChiuThue * 0.05;\n else if (thuNhapChiuThue <= 10000000) thueTNCN = 250000 + (thuNhapChiuThue - 5000000) * 0.1;\n else if (thuNhapChiuThue <= 18000000) thueTNCN = 750000 + (thuNhapChiuThue - 10000000) * 0.15;\n else if (thuNhapChiuThue <= 32000000) thueTNCN = 1950000 + (thuNhapChiuThue - 18000000) * 0.2;\n else if (thuNhapChiuThue <= 52000000) thueTNCN = 4750000 + (thuNhapChiuThue - 32000000) * 0.25;\n else if (thuNhapChiuThue <= 80000000) thueTNCN = 9750000 + (thuNhapChiuThue - 52000000) * 0.3;\n else thueTNCN = 18150000 + (thuNhapChiuThue - 80000000) * 0.35;\n }\n \n const tongKhauTru = tongBaoHiem + thueTNCN + tamUng + khauTruKhac;\n const luongThucNhan = tongThuNhap - tongKhauTru;\n\n const ketQua = { \n luongTheoNgay, luongLamThem, luongLamThemNgay, luongLamThemDem, luongLamCuoiTuan, luongLamNgayLe,\n tongPhuCap, tongThuong, tongThuNhap, bhxh, bhyt, bhtn, tongBaoHiem, \n thuNhapChiuThue, thueTNCN, tamUng, khauTruKhac, tongKhauTru, luongThucNhan, \n luongDongBH, ngayCong, gioLamThemNgay, gioLamThemDem, gioLamCuoiTuan, gioLamNgayLe,\n luongThang13, thuongTet, thuongHieuSuat\n };\n hienThiKetQua(ketQua);\n return ketQua;\n }\n\n function hienThiKetQua(kq) {\n let html = `\n <div class=\"breakdown-item\"><h3>L\u01b0\u01a1ng Theo Ng\u00e0y C\u00f4ng<\/h3><div class=\"amount\">${formatTien(kq.luongTheoNgay)}<\/div><\/div>\n <div class=\"breakdown-item\"><h3>L\u01b0\u01a1ng L\u00e0m Th\u00eam<\/h3><div class=\"amount\">${formatTien(kq.luongLamThem)}<\/div><\/div>\n <div class=\"breakdown-item\"><h3>T\u1ed5ng Ph\u1ee5 C\u1ea5p<\/h3><div class=\"amount\">${formatTien(kq.tongPhuCap)}<\/div><\/div>`;\n \n if (kq.tongThuong > 0) {\n html += `<div class=\"breakdown-item bonus\"><h3>T\u1ed5ng Th\u01b0\u1edfng<\/h3><div class=\"amount\">${formatTien(kq.tongThuong)}<\/div><\/div>`;\n }\n \n html += `\n <div class=\"breakdown-item\"><h3>T\u1ed5ng Thu Nh\u1eadp<\/h3><div class=\"amount\">${formatTien(kq.tongThuNhap)}<\/div><\/div>\n <div class=\"breakdown-item deduction\"><h3>B\u1ea3o Hi\u1ec3m (${((kq.tongBaoHiem\/kq.luongDongBH)*100).toFixed(1)}%)<\/h3><div class=\"amount\">-${formatTien(kq.tongBaoHiem)}<\/div><\/div>\n <div class=\"breakdown-item deduction\"><h3>Thu\u1ebf TNCN<\/h3><div class=\"amount\">-${formatTien(kq.thueTNCN)}<\/div><\/div>\n <div class=\"breakdown-item deduction\"><h3>T\u1ea1m \u1ee8ng & Kh\u1ea5u Tr\u1eeb Kh\u00e1c<\/h3><div class=\"amount\">-${formatTien(kq.tamUng + kq.khauTruKhac)}<\/div><\/div>\n <div class=\"breakdown-item total-salary\"><h3>L\u01af\u01a0NG TH\u1ef0C NH\u1eacN<\/h3><div class=\"amount\">${formatTien(kq.luongThucNhan)}<\/div><\/div>\n `;\n document.getElementById('ketQuaLuong').innerHTML = html;\n document.getElementById('ketQuaCard').style.display = 'block';\n }\n\n function themNhanVien() {\n const maNV = layText('maNV'), hoTen = layText('hoTen');\n if (!maNV || !hoTen) { alert('Vui l\u00f2ng nh\u1eadp \u0111\u1ea7y \u0111\u1ee7 M\u00e3 NV v\u00e0 H\u1ecd T\u00ean!'); return; }\n const ketQua = tinhLuong();\n if (!ketQua) return;\n \n const thangNam = layText('thangNam') || new Date().toISOString().slice(0, 7);\n \n const nhanVien = {\n maNV, hoTen, chucVu: laySelectedText('chucVu'), phongBan: laySelectedText('phongBan'),\n luongCoBan: layGiaTri('luongCoBan'), luongDongBH: layGiaTri('luongDongBH'),\n ngayCong: ketQua.ngayCong, \n gioLamThemNgay: ketQua.gioLamThemNgay, gioLamThemDem: ketQua.gioLamThemDem,\n gioLamCuoiTuan: ketQua.gioLamCuoiTuan, gioLamNgayLe: ketQua.gioLamNgayLe,\n tongThuNhap: ketQua.tongThuNhap, tongBaoHiem: ketQua.tongBaoHiem,\n tongThuong: ketQua.tongThuong,\n thueTNCN: ketQua.thueTNCN, luongThucNhan: ketQua.luongThucNhan, \n thangNam, ketQua, ngayPhepConLai: NGAY_PHEP_NAM\n };\n\n let index = danhSachNhanVien.findIndex(nv => nv.maNV === maNV);\n if (index >= 0) danhSachNhanVien[index] = nhanVien; else danhSachNhanVien.push(nhanVien);\n \n let savedIndex = danhSachNhanVienDaLuu.findIndex(nv => nv.maNV === maNV);\n if (savedIndex >= 0) danhSachNhanVienDaLuu[savedIndex] = nhanVien; else danhSachNhanVienDaLuu.push(nhanVien);\n\n const lichSuRecord = { ...nhanVien, id: Date.now(), ngayTao: new Date().toISOString() };\n lichSuLuong.push(lichSuRecord);\n\n luuDuLieu(); capNhatDanhSach(); capNhatDropdowns(); xoaForm();\n alert('\u0110\u00e3 th\u00eam\/c\u1eadp nh\u1eadt nh\u00e2n vi\u00ean th\u00e0nh c\u00f4ng!');\n }\n\n function tinhLuongHangLoat() {\n if (danhSachNhanVienDaLuu.length === 0) {\n alert('Ch\u01b0a c\u00f3 nh\u00e2n vi\u00ean n\u00e0o trong h\u1ec7 th\u1ed1ng!');\n return;\n }\n \n const thangNam = layText('thangNam') || new Date().toISOString().slice(0, 7);\n let count = 0;\n \n danhSachNhanVienDaLuu.forEach(nv => {\n document.getElementById('maNV').value = nv.maNV;\n document.getElementById('hoTen').value = nv.hoTen;\n document.getElementById('luongCoBan').value = nv.luongCoBan;\n document.getElementById('luongDongBH').value = nv.luongDongBH || nv.luongCoBan;\n \n const ketQua = tinhLuong();\n if (ketQua) {\n const nhanVien = {\n ...nv,\n ngayCong: ketQua.ngayCong,\n tongThuNhap: ketQua.tongThuNhap,\n tongBaoHiem: ketQua.tongBaoHiem,\n tongThuong: ketQua.tongThuong || 0,\n thueTNCN: ketQua.thueTNCN,\n luongThucNhan: ketQua.luongThucNhan,\n thangNam,\n ketQua\n };\n \n let index = danhSachNhanVien.findIndex(n => n.maNV === nv.maNV);\n if (index >= 0) danhSachNhanVien[index] = nhanVien; else danhSachNhanVien.push(nhanVien);\n \n const lichSuRecord = { ...nhanVien, id: Date.now() + count, ngayTao: new Date().toISOString() };\n lichSuLuong.push(lichSuRecord);\n count++;\n }\n });\n \n luuDuLieu();\n capNhatDanhSach();\n xoaForm();\n alert(`\u0110\u00e3 t\u00ednh l\u01b0\u01a1ng cho ${count} nh\u00e2n vi\u00ean th\u00e1ng ${thangNam}!`);\n }\n\n function xoaNhanVienByIndex(index) {\n if (confirm('B\u1ea1n c\u00f3 ch\u1eafc mu\u1ed1n x\u00f3a nh\u00e2n vi\u00ean n\u00e0y?')) {\n danhSachNhanVien.splice(index, 1); luuDuLieu(); capNhatDanhSach(); capNhatDropdowns();\n }\n }\n\n function suaNhanVienByIndex(index) {\n const nv = danhSachNhanVien[index];\n if (nv) { chonNhanVien(nv.maNV); document.getElementById('ngayCong').value = nv.ngayCong; chuyenTab('chamLuong'); document.querySelector('.nav-tab').click(); }\n }\n\n function xemChiTietByIndex(index) {\n const nv = danhSachNhanVien[index];\n if (nv) { chuyenTab('chamLuong'); document.querySelector('.nav-tab').click(); hienThiKetQua(nv.ketQua); document.getElementById('ketQuaCard').scrollIntoView({ behavior: 'smooth' }); }\n }\n\n function inPhieuLuongByIndex(index) {\n const nv = danhSachNhanVien[index];\n if (nv) {\n hienThiPhieuLuong(nv);\n }\n }\n\n function hienThiPhieuLuong(nv) {\n const kq = nv.ketQua;\n const html = `\n <div class=\"phieu-luong\" id=\"phieuLuongContent\">\n <h2>PHI\u1ebeU L\u01af\u01a0NG<\/h2>\n <p style=\"text-align:center; margin-bottom:20px;\">Th\u00e1ng: ${nv.thangNam || 'N\/A'}<\/p>\n <table style=\"width:100%; margin-bottom:20px;\">\n <tr><td><strong>M\u00e3 NV:<\/strong><\/td><td>${escapeHtml(nv.maNV)}<\/td><td><strong>H\u1ecd T\u00ean:<\/strong><\/td><td>${escapeHtml(nv.hoTen)}<\/td><\/tr>\n <tr><td><strong>Ch\u1ee9c V\u1ee5:<\/strong><\/td><td>${escapeHtml(nv.chucVu)}<\/td><td><strong>Ph\u00f2ng Ban:<\/strong><\/td><td>${escapeHtml(nv.phongBan)}<\/td><\/tr>\n <\/table>\n <table style=\"width:100%;\">\n <tr><th colspan=\"2\" style=\"background:#5a67d8;color:white;\">KHO\u1ea2N THU NH\u1eacP<\/th><\/tr>\n <tr><td>L\u01b0\u01a1ng theo ng\u00e0y c\u00f4ng (${nv.ngayCong} ng\u00e0y)<\/td><td style=\"text-align:right;\">${formatTien(kq.luongTheoNgay)}<\/td><\/tr>\n <tr><td>L\u01b0\u01a1ng l\u00e0m th\u00eam<\/td><td style=\"text-align:right;\">${formatTien(kq.luongLamThem)}<\/td><\/tr>\n <tr><td>Ph\u1ee5 c\u1ea5p<\/td><td style=\"text-align:right;\">${formatTien(kq.tongPhuCap)}<\/td><\/tr>\n ${kq.tongThuong > 0 ? `<tr><td>Th\u01b0\u1edfng<\/td><td style=\"text-align:right;\">${formatTien(kq.tongThuong)}<\/td><\/tr>` : ''}\n <tr style=\"font-weight:bold;background:#e2e8f0;\"><td>T\u1ed4NG THU NH\u1eacP<\/td><td style=\"text-align:right;\">${formatTien(kq.tongThuNhap)}<\/td><\/tr>\n <tr><th colspan=\"2\" style=\"background:#e53e3e;color:white;\">KHO\u1ea2N KH\u1ea4U TR\u1eea<\/th><\/tr>\n <tr><td>BHXH<\/td><td style=\"text-align:right;\">-${formatTien(kq.bhxh)}<\/td><\/tr>\n <tr><td>BHYT<\/td><td style=\"text-align:right;\">-${formatTien(kq.bhyt)}<\/td><\/tr>\n <tr><td>BHTN<\/td><td style=\"text-align:right;\">-${formatTien(kq.bhtn)}<\/td><\/tr>\n <tr><td>Thu\u1ebf TNCN<\/td><td style=\"text-align:right;\">-${formatTien(kq.thueTNCN)}<\/td><\/tr>\n <tr><td>T\u1ea1m \u1ee9ng & Kh\u1ea5u tr\u1eeb kh\u00e1c<\/td><td style=\"text-align:right;\">-${formatTien(kq.tamUng + kq.khauTruKhac)}<\/td><\/tr>\n <tr style=\"font-weight:bold;background:#e2e8f0;\"><td>T\u1ed4NG KH\u1ea4U TR\u1eea<\/td><td style=\"text-align:right;\">-${formatTien(kq.tongKhauTru)}<\/td><\/tr>\n <tr style=\"font-weight:bold;background:#38a169;color:white;font-size:16px;\"><td>L\u01af\u01a0NG TH\u1ef0C NH\u1eacN<\/td><td style=\"text-align:right;\">${formatTien(kq.luongThucNhan)}<\/td><\/tr>\n <\/table>\n <p style=\"margin-top:30px; text-align:right;\">Ng\u00e0y ____\/____\/________<\/p>\n <div style=\"display:flex; justify-content:space-between; margin-top:20px;\">\n <div style=\"text-align:center;\"><strong>Ng\u01b0\u1eddi L\u1eadp<\/strong><br><br><br>_______________<\/div>\n <div style=\"text-align:center;\"><strong>K\u1ebf To\u00e1n<\/strong><br><br><br>_______________<\/div>\n <div style=\"text-align:center;\"><strong>Ng\u01b0\u1eddi Nh\u1eadn<\/strong><br><br><br>_______________<\/div>\n <\/div>\n <\/div>\n `;\n document.getElementById('noiDungPhieuLuong').innerHTML = html;\n document.getElementById('modalPhieuLuong').classList.add('show');\n }\n\n function dongModal() {\n document.getElementById('modalPhieuLuong').classList.remove('show');\n }\n\n function inPhieuLuong() {\n const content = document.getElementById('phieuLuongContent').innerHTML;\n const printWindow = window.open('', '', 'width=800,height=600');\n printWindow.document.write(`\n <html><head><title>Phi\u1ebfu L\u01b0\u01a1ng<\/title>\n <style>\n body { font-family: Arial, sans-serif; padding: 20px; }\n table { width: 100%; border-collapse: collapse; }\n th, td { border: 1px solid #333; padding: 8px; }\n h2 { text-align: center; }\n <\/style>\n <\/head><body>${content}<\/body><\/html>\n `);\n printWindow.document.close();\n printWindow.print();\n }\n\n function timKiemNhanVien() { capNhatDanhSach(document.getElementById('timKiem').value.toLowerCase().trim()); }\n\n function capNhatDanhSach(tuKhoa = '') {\n const container = document.getElementById('danhSachNV');\n let ds = tuKhoa ? danhSachNhanVien.filter(nv => nv.maNV.toLowerCase().includes(tuKhoa) || nv.hoTen.toLowerCase().includes(tuKhoa)) : danhSachNhanVien;\n \n if (ds.length === 0) { container.innerHTML = '<p class=\"empty-message\">Kh\u00f4ng t\u00ecm th\u1ea5y nh\u00e2n vi\u00ean n\u00e0o<\/p>'; }\n else {\n let html = `<table><thead><tr><th>M\u00e3 NV<\/th><th>H\u1ecd T\u00ean<\/th><th>Ch\u1ee9c V\u1ee5<\/th><th>Ph\u00f2ng Ban<\/th><th>Ng\u00e0y C\u00f4ng<\/th><th>T\u1ed5ng Thu Nh\u1eadp<\/th><th>L\u01b0\u01a1ng Th\u1ef1c Nh\u1eadn<\/th><th>Thao T\u00e1c<\/th><\/tr><\/thead><tbody>`;\n ds.forEach((nv, i) => {\n const realIndex = danhSachNhanVien.indexOf(nv);\n html += `<tr><td>${escapeHtml(nv.maNV)}<\/td><td>${escapeHtml(nv.hoTen)}<\/td><td>${escapeHtml(nv.chucVu)}<\/td><td>${escapeHtml(nv.phongBan)}<\/td><td>${nv.ngayCong}<\/td><td>${formatTien(nv.tongThuNhap)}<\/td><td>${formatTien(nv.luongThucNhan)}<\/td><td><button class=\"action-btn view-btn\" onclick=\"xemChiTietByIndex(${realIndex})\">Xem<\/button><button class=\"action-btn print-btn\" onclick=\"inPhieuLuongByIndex(${realIndex})\">In<\/button><button class=\"action-btn edit-btn\" onclick=\"suaNhanVienByIndex(${realIndex})\">S\u1eeda<\/button><button class=\"action-btn delete-btn\" onclick=\"xoaNhanVienByIndex(${realIndex})\">X\u00f3a<\/button><\/td><\/tr>`;\n });\n html += '<\/tbody><\/table>';\n container.innerHTML = html;\n }\n\n const tongNV = danhSachNhanVien.length;\n const tongLuong = danhSachNhanVien.reduce((s, nv) => s + nv.luongThucNhan, 0);\n document.getElementById('tongNV').textContent = tongNV;\n document.getElementById('tongLuong').textContent = formatTien(tongLuong);\n document.getElementById('luongTB').textContent = formatTien(tongNV > 0 ? tongLuong \/ tongNV : 0);\n document.getElementById('luongMax').textContent = formatTien(tongNV > 0 ? Math.max(...danhSachNhanVien.map(nv => nv.luongThucNhan)) : 0);\n document.getElementById('luongMin').textContent = formatTien(tongNV > 0 ? Math.min(...danhSachNhanVien.map(nv => nv.luongThucNhan)) : 0);\n }\n\n function capNhatLichSu() {\n const maNV = document.getElementById('locNVLichSu').value;\n const tuThang = document.getElementById('tuThang').value;\n const denThang = document.getElementById('denThang').value;\n \n let ds = lichSuLuong.filter(ls => {\n let match = true;\n if (maNV && ls.maNV !== maNV) match = false;\n if (tuThang && ls.thangNam < tuThang) match = false;\n if (denThang && ls.thangNam > denThang) match = false;\n return match;\n });\n\n const luongTheoThang = {};\n ds.forEach(ls => {\n if (!luongTheoThang[ls.thangNam]) luongTheoThang[ls.thangNam] = 0;\n luongTheoThang[ls.thangNam] += ls.luongThucNhan;\n });\n\n const bieuDoContainer = document.getElementById('bieuDoLichSu');\n const sortedMonths = Object.keys(luongTheoThang).sort();\n \n if (sortedMonths.length > 0) {\n const maxLuong = Math.max(...Object.values(luongTheoThang), 1);\n bieuDoContainer.innerHTML = sortedMonths.map(thang => {\n const luong = luongTheoThang[thang];\n const height = (luong \/ maxLuong) * 150;\n return `<div class=\"bar-item\"><div class=\"bar-value\">${formatTien(luong)}<\/div><div class=\"bar\" style=\"height: ${height}px;\"><\/div><div class=\"bar-label\">${thang}<\/div><\/div>`;\n }).join('');\n } else {\n bieuDoContainer.innerHTML = '<p style=\"text-align:center;color:#718096;\">Ch\u01b0a c\u00f3 d\u1eef li\u1ec7u<\/p>';\n }\n\n const bangLichSu = document.getElementById('bangLichSu');\n if (ds.length > 0) {\n let html = `<table><thead><tr><th>Th\u00e1ng<\/th><th>M\u00e3 NV<\/th><th>H\u1ecd T\u00ean<\/th><th>Ng\u00e0y C\u00f4ng<\/th><th>T\u1ed5ng Thu Nh\u1eadp<\/th><th>Kh\u1ea5u Tr\u1eeb<\/th><th>Th\u1ef1c Nh\u1eadn<\/th><\/tr><\/thead><tbody>`;\n ds.sort((a, b) => b.thangNam.localeCompare(a.thangNam)).forEach(ls => {\n html += `<tr><td>${ls.thangNam}<\/td><td>${escapeHtml(ls.maNV)}<\/td><td>${escapeHtml(ls.hoTen)}<\/td><td>${ls.ngayCong}<\/td><td>${formatTien(ls.tongThuNhap)}<\/td><td>${formatTien(ls.tongBaoHiem + ls.thueTNCN)}<\/td><td>${formatTien(ls.luongThucNhan)}<\/td><\/tr>`;\n });\n html += '<\/tbody><\/table>';\n bangLichSu.innerHTML = html;\n } else {\n bangLichSu.innerHTML = '<p class=\"empty-message\">Ch\u01b0a c\u00f3 d\u1eef li\u1ec7u l\u1ecbch s\u1eed<\/p>';\n }\n }\n\n function themNghiPhep() {\n const maNV = document.getElementById('nvNghiPhep').value;\n const loaiNghi = document.getElementById('loaiNghi').value;\n const tuNgay = document.getElementById('tuNgayNghi').value;\n const denNgay = document.getElementById('denNgayNghi').value;\n const lyDo = document.getElementById('lyDoNghi').value;\n\n if (!maNV || !tuNgay || !denNgay) {\n alert('Vui l\u00f2ng nh\u1eadp \u0111\u1ea7y \u0111\u1ee7 th\u00f4ng tin!');\n return;\n }\n\n const tu = new Date(tuNgay);\n const den = new Date(denNgay);\n const soNgay = Math.ceil((den - tu) \/ (1000 * 60 * 60 * 24)) + 1;\n\n if (soNgay <= 0) {\n alert('Ng\u00e0y k\u1ebft th\u00fac ph\u1ea3i sau ng\u00e0y b\u1eaft \u0111\u1ea7u!');\n return;\n }\n\n const nv = danhSachNhanVienDaLuu.find(n => n.maNV === maNV);\n const nghiPhep = {\n id: Date.now(),\n maNV,\n hoTen: nv ? nv.hoTen : '',\n loaiNghi,\n loaiNghiText: document.getElementById('loaiNghi').options[document.getElementById('loaiNghi').selectedIndex].text,\n tuNgay,\n denNgay,\n soNgay,\n lyDo,\n ngayTao: new Date().toISOString()\n };\n\n danhSachNghiPhep.push(nghiPhep);\n\n if (loaiNghi === 'phep_nam' && nv) {\n const nvIndex = danhSachNhanVienDaLuu.findIndex(n => n.maNV === maNV);\n if (nvIndex >= 0) {\n danhSachNhanVienDaLuu[nvIndex].ngayPhepConLai = (danhSachNhanVienDaLuu[nvIndex].ngayPhepConLai || NGAY_PHEP_NAM) - soNgay;\n }\n }\n\n luuDuLieu();\n capNhatNghiPhep();\n \n document.getElementById('tuNgayNghi').value = '';\n document.getElementById('denNgayNghi').value = '';\n document.getElementById('lyDoNghi').value = '';\n \n alert('\u0110\u00e3 \u0111\u0103ng k\u00fd ngh\u1ec9 ph\u00e9p th\u00e0nh c\u00f4ng!');\n }\n\n function xoaNghiPhepById(id) {\n if (confirm('B\u1ea1n c\u00f3 ch\u1eafc mu\u1ed1n x\u00f3a \u0111\u01a1n ngh\u1ec9 ph\u00e9p n\u00e0y?')) {\n danhSachNghiPhep = danhSachNghiPhep.filter(np => np.id !== id);\n luuDuLieu();\n capNhatNghiPhep();\n }\n }\n\n function capNhatNghiPhep() {\n capNhatDropdowns();\n \n const container = document.getElementById('danhSachNghiPhep');\n if (danhSachNghiPhep.length === 0) {\n container.innerHTML = '<p class=\"empty-message\">Ch\u01b0a c\u00f3 \u0111\u01a1n ngh\u1ec9 ph\u00e9p n\u00e0o<\/p>';\n } else {\n let html = `<table><thead><tr><th>M\u00e3 NV<\/th><th>H\u1ecd T\u00ean<\/th><th>Lo\u1ea1i Ngh\u1ec9<\/th><th>T\u1eeb Ng\u00e0y<\/th><th>\u0110\u1ebfn Ng\u00e0y<\/th><th>S\u1ed1 Ng\u00e0y<\/th><th>L\u00fd Do<\/th><th>Thao T\u00e1c<\/th><\/tr><\/thead><tbody>`;\n danhSachNghiPhep.sort((a, b) => b.tuNgay.localeCompare(a.tuNgay)).forEach(np => {\n html += `<tr><td>${escapeHtml(np.maNV)}<\/td><td>${escapeHtml(np.hoTen)}<\/td><td>${escapeHtml(np.loaiNghiText)}<\/td><td>${np.tuNgay}<\/td><td>${np.denNgay}<\/td><td>${np.soNgay}<\/td><td>${escapeHtml(np.lyDo)}<\/td><td><button class=\"action-btn delete-btn\" onclick=\"xoaNghiPhepById(${np.id})\">X\u00f3a<\/button><\/td><\/tr>`;\n });\n html += '<\/tbody><\/table>';\n container.innerHTML = html;\n }\n\n const thongKeContainer = document.getElementById('thongKePhep');\n if (danhSachNhanVienDaLuu.length > 0) {\n let html = `<table><thead><tr><th>M\u00e3 NV<\/th><th>H\u1ecd T\u00ean<\/th><th>Ng\u00e0y Ph\u00e9p N\u0103m<\/th><th>\u0110\u00e3 S\u1eed D\u1ee5ng<\/th><th>C\u00f2n L\u1ea1i<\/th><\/tr><\/thead><tbody>`;\n danhSachNhanVienDaLuu.forEach(nv => {\n const daSuDung = danhSachNghiPhep.filter(np => np.maNV === nv.maNV && np.loaiNghi === 'phep_nam').reduce((sum, np) => sum + np.soNgay, 0);\n const conLai = NGAY_PHEP_NAM - daSuDung;\n html += `<tr><td>${escapeHtml(nv.maNV)}<\/td><td>${escapeHtml(nv.hoTen)}<\/td><td>${NGAY_PHEP_NAM}<\/td><td><span class=\"leave-badge leave-used\">${daSuDung} ng\u00e0y<\/span><\/td><td><span class=\"leave-badge leave-remaining\">${conLai} ng\u00e0y<\/span><\/td><\/tr>`;\n });\n html += '<\/tbody><\/table>';\n thongKeContainer.innerHTML = html;\n } else {\n thongKeContainer.innerHTML = '<p class=\"empty-message\">Ch\u01b0a c\u00f3 nh\u00e2n vi\u00ean<\/p>';\n }\n }\n\n function capNhatDropdowns() {\n const nvNghiPhep = document.getElementById('nvNghiPhep');\n const locNVLichSu = document.getElementById('locNVLichSu');\n \n const currentNghiPhep = nvNghiPhep.value;\n const currentLichSu = locNVLichSu.value;\n \n nvNghiPhep.innerHTML = '<option value=\"\">Ch\u1ecdn nh\u00e2n vi\u00ean<\/option>';\n locNVLichSu.innerHTML = '<option value=\"\">T\u1ea5t c\u1ea3 nh\u00e2n vi\u00ean<\/option>';\n \n danhSachNhanVienDaLuu.forEach(nv => {\n nvNghiPhep.innerHTML += `<option value=\"${escapeHtml(nv.maNV)}\">${escapeHtml(nv.maNV)} - ${escapeHtml(nv.hoTen)}<\/option>`;\n locNVLichSu.innerHTML += `<option value=\"${escapeHtml(nv.maNV)}\">${escapeHtml(nv.maNV)} - ${escapeHtml(nv.hoTen)}<\/option>`;\n });\n \n nvNghiPhep.value = currentNghiPhep;\n locNVLichSu.value = currentLichSu;\n }\n\n function capNhatBaoCao() {\n const locPhongBan = document.getElementById('locPhongBan').value;\n let ds = locPhongBan ? danhSachNhanVien.filter(nv => nv.phongBan === locPhongBan) : danhSachNhanVien;\n\n const tongNV = ds.length;\n const tongLuong = ds.reduce((s, nv) => s + nv.luongThucNhan, 0);\n const tongBH = ds.reduce((s, nv) => s + nv.tongBaoHiem, 0);\n const tongThuong = ds.reduce((s, nv) => s + (nv.tongThuong || 0), 0);\n\n document.getElementById('baoCaoTongNV').textContent = tongNV;\n document.getElementById('baoCaoTongLuong').textContent = formatTien(tongLuong);\n document.getElementById('baoCaoTongBH').textContent = formatTien(tongBH);\n document.getElementById('baoCaoTongThuong').textContent = formatTien(tongThuong);\n\n const luongTheoPhongBan = {};\n danhSachNhanVien.forEach(nv => { luongTheoPhongBan[nv.phongBan] = (luongTheoPhongBan[nv.phongBan] || 0) + nv.luongThucNhan; });\n const maxLuong = Math.max(...Object.values(luongTheoPhongBan), 1);\n const bieuDoContainer = document.getElementById('bieuDoPhongBan');\n \n if (Object.keys(luongTheoPhongBan).length > 0) {\n bieuDoContainer.innerHTML = Object.entries(luongTheoPhongBan).map(([pb, luong]) => {\n const height = (luong \/ maxLuong) * 150;\n return `<div class=\"bar-item\"><div class=\"bar-value\">${formatTien(luong)}<\/div><div class=\"bar\" style=\"height: ${height}px;\"><\/div><div class=\"bar-label\">${escapeHtml(pb)}<\/div><\/div>`;\n }).join('');\n } else { bieuDoContainer.innerHTML = '<p style=\"text-align:center;color:#718096;\">Ch\u01b0a c\u00f3 d\u1eef li\u1ec7u<\/p>'; }\n\n const bangBaoCao = document.getElementById('bangBaoCao');\n if (ds.length > 0) {\n let html = `<table><thead><tr><th>STT<\/th><th>M\u00e3 NV<\/th><th>H\u1ecd T\u00ean<\/th><th>Ph\u00f2ng Ban<\/th><th>T\u1ed5ng Thu Nh\u1eadp<\/th><th>B\u1ea3o Hi\u1ec3m<\/th><th>Thu\u1ebf TNCN<\/th><th>Th\u01b0\u1edfng<\/th><th>Th\u1ef1c Nh\u1eadn<\/th><\/tr><\/thead><tbody>`;\n ds.forEach((nv, i) => {\n html += `<tr><td>${i + 1}<\/td><td>${escapeHtml(nv.maNV)}<\/td><td>${escapeHtml(nv.hoTen)}<\/td><td>${escapeHtml(nv.phongBan)}<\/td><td>${formatTien(nv.tongThuNhap)}<\/td><td>${formatTien(nv.tongBaoHiem)}<\/td><td>${formatTien(nv.thueTNCN)}<\/td><td>${formatTien(nv.tongThuong || 0)}<\/td><td>${formatTien(nv.luongThucNhan)}<\/td><\/tr>`;\n });\n html += `<tr style=\"font-weight:bold;background:#e2e8f0;\"><td colspan=\"4\">T\u1ed4NG C\u1ed8NG<\/td><td>${formatTien(ds.reduce((s,nv)=>s+nv.tongThuNhap,0))}<\/td><td>${formatTien(tongBH)}<\/td><td>${formatTien(ds.reduce((s,nv)=>s+nv.thueTNCN,0))}<\/td><td>${formatTien(tongThuong)}<\/td><td>${formatTien(tongLuong)}<\/td><\/tr><\/tbody><\/table>`;\n bangBaoCao.innerHTML = html;\n } else { bangBaoCao.innerHTML = '<p class=\"empty-message\">Kh\u00f4ng c\u00f3 d\u1eef li\u1ec7u<\/p>'; }\n }\n\n function capNhatDuLieu() {\n document.getElementById('duLieuTongNV').textContent = danhSachNhanVienDaLuu.length;\n document.getElementById('duLieuTongLuong').textContent = lichSuLuong.length;\n document.getElementById('duLieuTongPhep').textContent = danhSachNghiPhep.length;\n \n const data = JSON.stringify({danhSachNhanVien, danhSachNhanVienDaLuu, lichSuLuong, danhSachNghiPhep});\n const bytes = new Blob([data]).size;\n document.getElementById('duLieuDungLuong').textContent = (bytes \/ 1024).toFixed(2) + ' KB';\n }\n\n function inBaoCao() { window.print(); }\n\n function xuatCSV() {\n if (danhSachNhanVien.length === 0) { alert('Kh\u00f4ng c\u00f3 d\u1eef li\u1ec7u!'); return; }\n let csv = '\\uFEFF' + 'STT,M\u00e3 NV,H\u1ecd T\u00ean,Ch\u1ee9c V\u1ee5,Ph\u00f2ng Ban,L\u01b0\u01a1ng C\u01a1 B\u1ea3n,Ng\u00e0y C\u00f4ng,T\u1ed5ng Thu Nh\u1eadp,B\u1ea3o Hi\u1ec3m,Thu\u1ebf TNCN,Th\u01b0\u1edfng,L\u01b0\u01a1ng Th\u1ef1c Nh\u1eadn\\n';\n danhSachNhanVien.forEach((nv, i) => {\n csv += `${i+1},\"${nv.maNV}\",\"${nv.hoTen}\",\"${nv.chucVu}\",\"${nv.phongBan}\",${nv.luongCoBan},${nv.ngayCong},${Math.round(nv.tongThuNhap)},${Math.round(nv.tongBaoHiem)},${Math.round(nv.thueTNCN)},${Math.round(nv.tongThuong || 0)},${Math.round(nv.luongThucNhan)}\\n`;\n });\n const blob = new Blob([csv], { type: 'text\/csv;charset=utf-8;' });\n const link = document.createElement('a');\n link.href = URL.createObjectURL(blob);\n link.download = 'bang_luong_' + new Date().toISOString().slice(0,10) + '.csv';\n link.click();\n }\n\n function xuatExcel() {\n if (danhSachNhanVien.length === 0) { alert('Kh\u00f4ng c\u00f3 d\u1eef li\u1ec7u!'); return; }\n \n let html = `<html xmlns:o=\"urn:schemas-microsoft-com:office:office\" xmlns:x=\"urn:schemas-microsoft-com:office:excel\" xmlns=\"http:\/\/www.w3.org\/TR\/REC-html40\">\n <head><meta charset=\"UTF-8\"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>B\u1ea3ng L\u01b0\u01a1ng<\/x:Name><x:WorksheetOptions><x:DisplayGridlines\/><\/x:WorksheetOptions><\/x:ExcelWorksheet><\/x:ExcelWorksheets><\/x:ExcelWorkbook><\/xml><![endif]--><\/head>\n <body><table border=\"1\">\n <tr style=\"background:#5a67d8;color:white;font-weight:bold;\"><th>STT<\/th><th>M\u00e3 NV<\/th><th>H\u1ecd T\u00ean<\/th><th>Ch\u1ee9c V\u1ee5<\/th><th>Ph\u00f2ng Ban<\/th><th>L\u01b0\u01a1ng C\u01a1 B\u1ea3n<\/th><th>Ng\u00e0y C\u00f4ng<\/th><th>T\u1ed5ng Thu Nh\u1eadp<\/th><th>B\u1ea3o Hi\u1ec3m<\/th><th>Thu\u1ebf TNCN<\/th><th>Th\u01b0\u1edfng<\/th><th>L\u01b0\u01a1ng Th\u1ef1c Nh\u1eadn<\/th><\/tr>`;\n \n danhSachNhanVien.forEach((nv, i) => {\n html += `<tr><td>${i+1}<\/td><td>${escapeHtml(nv.maNV)}<\/td><td>${escapeHtml(nv.hoTen)}<\/td><td>${escapeHtml(nv.chucVu)}<\/td><td>${escapeHtml(nv.phongBan)}<\/td><td>${nv.luongCoBan}<\/td><td>${nv.ngayCong}<\/td><td>${Math.round(nv.tongThuNhap)}<\/td><td>${Math.round(nv.tongBaoHiem)}<\/td><td>${Math.round(nv.thueTNCN)}<\/td><td>${Math.round(nv.tongThuong || 0)}<\/td><td>${Math.round(nv.luongThucNhan)}<\/td><\/tr>`;\n });\n \n const tongThuNhap = danhSachNhanVien.reduce((s,nv)=>s+nv.tongThuNhap,0);\n const tongBH = danhSachNhanVien.reduce((s,nv)=>s+nv.tongBaoHiem,0);\n const tongThue = danhSachNhanVien.reduce((s,nv)=>s+nv.thueTNCN,0);\n const tongThuong = danhSachNhanVien.reduce((s,nv)=>s+(nv.tongThuong||0),0);\n const tongLuong = danhSachNhanVien.reduce((s,nv)=>s+nv.luongThucNhan,0);\n \n html += `<tr style=\"font-weight:bold;background:#e2e8f0;\"><td colspan=\"7\">T\u1ed4NG C\u1ed8NG<\/td><td>${Math.round(tongThuNhap)}<\/td><td>${Math.round(tongBH)}<\/td><td>${Math.round(tongThue)}<\/td><td>${Math.round(tongThuong)}<\/td><td>${Math.round(tongLuong)}<\/td><\/tr>`;\n html += '<\/table><\/body><\/html>';\n \n const blob = new Blob([html], { type: 'application\/vnd.ms-excel;charset=utf-8;' });\n const link = document.createElement('a');\n link.href = URL.createObjectURL(blob);\n link.download = 'bang_luong_' + new Date().toISOString().slice(0,10) + '.xls';\n link.click();\n }\n\n function nhapCSV(event) {\n const file = event.target.files[0];\n if (!file) return;\n \n if (!file.name.toLowerCase().endsWith('.csv')) {\n document.getElementById('ketQuaNhap').innerHTML = '<p style=\"color:red;\">Vui l\u00f2ng ch\u1ecdn file CSV! N\u1ebfu b\u1ea1n \u0111ang d\u00f9ng file Excel, h\u00e3y m\u1edf file \u0111\u00f3 v\u00e0 l\u01b0u th\u00e0nh CSV tr\u01b0\u1edbc.<\/p>';\n event.target.value = '';\n return;\n }\n \n const reader = new FileReader();\n reader.onload = function(e) {\n const text = e.target.result;\n const lines = text.split('\\n').filter(line => line.trim());\n \n if (lines.length < 2) {\n document.getElementById('ketQuaNhap').innerHTML = '<p style=\"color:red;\">File kh\u00f4ng c\u00f3 d\u1eef li\u1ec7u!<\/p>';\n return;\n }\n \n let count = 0;\n let errors = [];\n \n for (let i = 1; i < lines.length; i++) {\n const cols = lines[i].split(',').map(c => c.replace(\/\"\/g, '').trim());\n if (cols.length >= 2) {\n const nv = {\n maNV: cols[0] || 'NV' + (danhSachNhanVienDaLuu.length + count + 1),\n hoTen: cols[1] || 'Ch\u01b0a c\u00f3 t\u00ean',\n chucVu: cols[2] || 'Nh\u00e2n vi\u00ean',\n phongBan: cols[3] || 'Ch\u01b0a ph\u00e2n lo\u1ea1i',\n luongCoBan: parseFloat(cols[4]) || 10000000,\n luongDongBH: parseFloat(cols[5]) || parseFloat(cols[4]) || 10000000,\n ngayPhepConLai: NGAY_PHEP_NAM\n };\n \n const existIndex = danhSachNhanVienDaLuu.findIndex(n => n.maNV === nv.maNV);\n if (existIndex >= 0) {\n danhSachNhanVienDaLuu[existIndex] = {...danhSachNhanVienDaLuu[existIndex], ...nv};\n } else {\n danhSachNhanVienDaLuu.push(nv);\n }\n count++;\n } else if (cols.length > 0 && cols[0]) {\n errors.push(`D\u00f2ng ${i+1}: Thi\u1ebfu d\u1eef li\u1ec7u`);\n }\n }\n \n luuDuLieu();\n capNhatDropdowns();\n \n let msg = `<p style=\"color:green;\">\u0110\u00e3 nh\u1eadp ${count} nh\u00e2n vi\u00ean th\u00e0nh c\u00f4ng!<\/p>`;\n if (errors.length > 0) {\n msg += `<p style=\"color:orange;\">L\u1ed7i: ${errors.slice(0, 5).join(', ')}${errors.length > 5 ? '...' : ''}<\/p>`;\n }\n document.getElementById('ketQuaNhap').innerHTML = msg;\n };\n \n reader.readAsText(file);\n event.target.value = '';\n }\n\n function saoLuuDuLieu() {\n const data = {\n danhSachNhanVien,\n danhSachNhanVienDaLuu,\n lichSuLuong,\n danhSachNghiPhep,\n ngaySaoLuu: new Date().toISOString()\n };\n \n const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application\/json' });\n const link = document.createElement('a');\n link.href = URL.createObjectURL(blob);\n link.download = 'sao_luu_luong_' + new Date().toISOString().slice(0,10) + '.json';\n link.click();\n \n alert('\u0110\u00e3 sao l\u01b0u d\u1eef li\u1ec7u th\u00e0nh c\u00f4ng!');\n }\n\n function khoiPhucDuLieu(event) {\n const file = event.target.files[0];\n if (!file) return;\n \n if (!confirm('Kh\u00f4i ph\u1ee5c s\u1ebd ghi \u0111\u00e8 to\u00e0n b\u1ed9 d\u1eef li\u1ec7u hi\u1ec7n t\u1ea1i. B\u1ea1n c\u00f3 ch\u1eafc kh\u00f4ng?')) {\n event.target.value = '';\n return;\n }\n \n const reader = new FileReader();\n reader.onload = function(e) {\n try {\n const data = JSON.parse(e.target.result);\n \n if (data.danhSachNhanVien) danhSachNhanVien = data.danhSachNhanVien;\n if (data.danhSachNhanVienDaLuu) danhSachNhanVienDaLuu = data.danhSachNhanVienDaLuu;\n if (data.lichSuLuong) lichSuLuong = data.lichSuLuong;\n if (data.danhSachNghiPhep) danhSachNghiPhep = data.danhSachNghiPhep;\n \n luuDuLieu();\n capNhatDanhSach();\n capNhatDropdowns();\n capNhatDuLieu();\n \n alert('\u0110\u00e3 kh\u00f4i ph\u1ee5c d\u1eef li\u1ec7u th\u00e0nh c\u00f4ng! (T\u1eeb file ng\u00e0y ' + (data.ngaySaoLuu ? data.ngaySaoLuu.slice(0,10) : 'N\/A') + ')');\n } catch (err) {\n alert('L\u1ed7i: File kh\u00f4ng h\u1ee3p l\u1ec7!');\n }\n };\n \n reader.readAsText(file);\n event.target.value = '';\n }\n\n function xoaTatCaDuLieu() {\n if (!confirm('B\u1ea0N C\u00d3 CH\u1eaeC MU\u1ed0N X\u00d3A T\u1ea4T C\u1ea2 D\u1eee LI\u1ec6U? H\u00e0nh \u0111\u1ed9ng n\u00e0y kh\u00f4ng th\u1ec3 ho\u00e0n t\u00e1c!')) return;\n if (!confirm('X\u00c1C NH\u1eacN L\u1ea6N CU\u1ed0I: X\u00f3a h\u1ebft d\u1eef li\u1ec7u?')) return;\n \n danhSachNhanVien = [];\n danhSachNhanVienDaLuu = [];\n lichSuLuong = [];\n danhSachNghiPhep = [];\n \n localStorage.clear();\n \n capNhatDanhSach();\n capNhatDropdowns();\n capNhatDuLieu();\n \n alert('\u0110\u00e3 x\u00f3a to\u00e0n b\u1ed9 d\u1eef li\u1ec7u!');\n }\n\n function xoaForm() {\n document.getElementById('maNV').value = '';\n document.getElementById('hoTen').value = '';\n document.getElementById('chucVu').selectedIndex = 0;\n document.getElementById('phongBan').selectedIndex = 0;\n document.getElementById('luongCoBan').value = '10000000';\n document.getElementById('ngayCongChuan').value = '26';\n document.getElementById('ngayCong').value = '26';\n document.getElementById('gioLamThemNgay').value = '0';\n document.getElementById('gioLamThemDem').value = '0';\n document.getElementById('gioLamCuoiTuan').value = '0';\n document.getElementById('gioLamNgayLe').value = '0';\n document.getElementById('phuCapChucVu').value = '0';\n document.getElementById('phuCapAn').value = '730000';\n document.getElementById('phuCapXe').value = '500000';\n document.getElementById('phuCapDienThoai').value = '200000';\n document.getElementById('phuCapNhaO').value = '0';\n document.getElementById('phuCapDocHai').value = '0';\n document.getElementById('thuongKhac').value = '0';\n document.getElementById('luongThang13').value = '0';\n document.getElementById('thuongTet').value = '0';\n document.getElementById('thuongHieuSuat').value = '0';\n document.getElementById('bhxh').value = '8';\n document.getElementById('bhyt').value = '1.5';\n document.getElementById('bhtn').value = '1';\n document.getElementById('luongDongBH').value = '10000000';\n document.getElementById('nguoiPhuThuoc').value = '0';\n document.getElementById('tamUng').value = '0';\n document.getElementById('khauTruKhac').value = '0';\n document.getElementById('ketQuaCard').style.display = 'none';\n }\n\n function luuDuLieu() {\n localStorage.setItem('danhSachNhanVien', JSON.stringify(danhSachNhanVien));\n localStorage.setItem('danhSachNhanVienDaLuu', JSON.stringify(danhSachNhanVienDaLuu));\n localStorage.setItem('lichSuLuong', JSON.stringify(lichSuLuong));\n localStorage.setItem('danhSachNghiPhep', JSON.stringify(danhSachNghiPhep));\n }\n\n function taiDuLieu() {\n const saved = localStorage.getItem('danhSachNhanVien');\n const savedAll = localStorage.getItem('danhSachNhanVienDaLuu');\n const savedLichSu = localStorage.getItem('lichSuLuong');\n const savedNghiPhep = localStorage.getItem('danhSachNghiPhep');\n \n if (saved) danhSachNhanVien = JSON.parse(saved);\n if (savedAll) danhSachNhanVienDaLuu = JSON.parse(savedAll);\n if (savedLichSu) lichSuLuong = JSON.parse(savedLichSu);\n if (savedNghiPhep) danhSachNghiPhep = JSON.parse(savedNghiPhep);\n }\n\n taiDuLieu();\n khoiTaoThang();\n capNhatDanhSach();\n capNhatDropdowns();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ch\u1ea5m B\u1ea3ng L\u01b0\u01a1ng Nh\u00e2n Vi\u00ean Ch\u1ea5m B\u1ea3ng L\u01b0\u01a1ng Nh\u00e2n Vi\u00ean Ch\u1ea5m L\u01b0\u01a1ng Danh S\u00e1ch NV L\u1ecbch S\u1eed L\u01b0\u01a1ng Ngh\u1ec9 Ph\u00e9p B\u00e1o C\u00e1o D\u1eef Li\u1ec7u Th\u00f4ng Tin Nh\u00e2n Vi\u00ean M\u00e3 Nh\u00e2n Vi\u00ean H\u1ecd v\u00e0 T\u00ean Ch\u1ee9c V\u1ee5 Nh\u00e2n vi\u00eanTr\u01b0\u1edfng nh\u00f3mPh\u00f3 ph\u00f2ngTr\u01b0\u1edfng ph\u00f2ngGi\u00e1m \u0111\u1ed1c Ph\u00f2ng Ban Kinh doanhK\u1ebf to\u00e1nNh\u00e2n s\u1ef1K\u1ef9 thu\u1eadtMarketingS\u1ea3n xu\u1ea5t Th\u00f4ng Tin Ch\u1ea5m C\u00f4ng &<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-10122","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/pages\/10122","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/comments?post=10122"}],"version-history":[{"count":1,"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/pages\/10122\/revisions"}],"predecessor-version":[{"id":10123,"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/pages\/10122\/revisions\/10123"}],"wp:attachment":[{"href":"https:\/\/midar.vn\/vi\/wp-json\/wp\/v2\/media?parent=10122"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}