{"id":88,"date":"2025-09-04T23:32:30","date_gmt":"2025-09-04T16:32:30","guid":{"rendered":"https:\/\/informed.umuslim.ac.id\/?page_id=88"},"modified":"2026-07-07T14:40:18","modified_gmt":"2026-07-07T07:40:18","slug":"pengaduan-2","status":"publish","type":"page","link":"https:\/\/informed.umuslim.ac.id\/?page_id=88","title":{"rendered":"Pengaduan"},"content":{"rendered":"\n<meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Formulir Pengaduan &#8211; Informatika Medis<\/title>\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@300;400;500;600;700&amp;display=swap\" rel=\"stylesheet\">\n    <style>\n        :root {\n            --primary-color: #1a73e8;\n            --secondary-color: #0d47a1;\n            --accent-color: #e8f0fe;\n            --text-color: #333;\n            --light-gray: #f8f9fa;\n            --border-color: #ddd;\n            --error-color: #d93025;\n            --success-color: #0f9d58;\n        }\n        \n        * {\n            box-sizing: border-box;\n            margin: 0;\n            padding: 0;\n            font-family: 'Poppins', sans-serif;\n        }\n        \n        body {\n            background-color: #f5f7fa;\n            color: var(--text-color);\n            line-height: 1.6;\n            padding: 20px;\n            min-height: 100vh;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n        }\n        \n        .container {\n            max-width: 1000px;\n            margin: 0 auto;\n        }\n        \n        .form-container {\n            background-color: white;\n            border-radius: 10px;\n            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);\n            overflow: hidden;\n            width: 94%;\n        }\n        \n        .form-header {\n            background: linear-gradient(120deg, var(--primary-color), var(--secondary-color));\n            color: white;\n            padding: 20px;\n            text-align: center;\n        }\n        \n        .form-header h3 {\n            font-size: 22px;\n            font-weight: 600;\n        }\n        \n        .form-body {\n            padding: 30px;\n        }\n        \n        .form-section {\n            margin-bottom: 25px;\n            padding-bottom: 20px;\n            border-bottom: 1px solid var(--border-color);\n        }\n        \n        .section-title {\n            font-size: 18px;\n            color: var(--primary-color);\n            margin-bottom: 20px;\n            display: flex;\n            align-items: center;\n        }\n        \n        .section-title i {\n            margin-right: 10px;\n            font-size: 20px;\n        }\n        \n        .form-row {\n            display: flex;\n            flex-wrap: wrap;\n            margin: 0 -10px;\n        }\n        \n        .form-group {\n            flex: 1 0 300px;\n            margin: 0 10px 20px;\n        }\n        \n        label {\n            display: block;\n            margin-bottom: 8px;\n            font-weight: 500;\n            color: #444;\n        }\n        \n        .required::after {\n            content: \" *\";\n            color: var(--error-color);\n        }\n        \n        input[type=\"text\"],\n        input[type=\"email\"],\n        input[type=\"number\"],\n        select,\n        textarea {\n            width: 100%;\n            padding: 12px 15px;\n            border: 1px solid var(--border-color);\n            border-radius: 6px;\n            font-size: 15px;\n            transition: all 0.3s;\n        }\n        \n        input:focus,\n        select:focus,\n        textarea:focus {\n            outline: none;\n            border-color: var(--primary-color);\n            box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.2);\n        }\n        \n        textarea {\n            min-height: 120px;\n            resize: vertical;\n        }\n        \n        .error-message {\n            color: var(--error-color);\n            font-size: 14px;\n            margin-top: 5px;\n            display: none;\n        }\n        \n        .file-upload {\n            position: relative;\n            border: 2px dashed var(--border-color);\n            border-radius: 8px;\n            padding: 25px;\n            text-align: center;\n            margin-bottom: 20px;\n            transition: all 0.3s;\n            cursor: pointer;\n        }\n        \n        .file-upload:hover {\n            border-color: var(--primary-color);\n            background-color: var(--accent-color);\n        }\n        \n        .file-upload i {\n            font-size: 40px;\n            color: var(--primary-color);\n            margin-bottom: 10px;\n        }\n        \n        .file-input {\n            position: absolute;\n            width: 100%;\n            height: 100%;\n            top: 0;\n            left: 0;\n            opacity: 0;\n            cursor: pointer;\n        }\n        \n        .hidden-field {\n            display: none;\n        }\n        \n        .form-footer {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            margin-top: 30px;\n            padding-top: 20px;\n            border-top: 1px solid var(--border-color);\n        }\n        \n        .btn {\n            padding: 12px 25px;\n            border: none;\n            border-radius: 6px;\n            font-size: 16px;\n            font-weight: 500;\n            cursor: pointer;\n            transition: all 0.3s;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n        }\n        \n        .btn i {\n            margin-right: 8px;\n        }\n        \n        .btn-submit {\n            background: linear-gradient(120deg, var(--primary-color), var(--secondary-color));\n            color: white;\n        }\n        \n        .btn-submit:hover {\n            opacity: 0.9;\n            transform: translateY(-2px);\n            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n        }\n        \n        .instructions {\n            background-color: var(--accent-color);\n            padding: 20px;\n            border-radius: 8px;\n            margin-top: 30px;\n            border-left: 4px solid var(--primary-color);\n        }\n        \n        .instructions h4 {\n            color: var(--primary-color);\n            margin-bottom: 10px;\n        }\n        \n        .instructions ol {\n            padding-left: 20px;\n        }\n        \n        .instructions li {\n            margin-bottom: 8px;\n        }\n        \n        .integration-guide {\n            background-color: white;\n            border-radius: 10px;\n            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);\n            padding: 25px;\n            margin-top: 30px;\n        }\n        \n        .integration-guide h3 {\n            color: var(--primary-color);\n            margin-bottom: 15px;\n        }\n        \n        .integration-steps {\n            padding-left: 20px;\n        }\n        \n        .integration-steps li {\n            margin-bottom: 15px;\n        }\n        \n        code {\n            background-color: #f5f5f5;\n            padding: 2px 5px;\n            border-radius: 3px;\n            font-family: monospace;\n        }\n        \n        @media (max-width: 768px) {\n            .form-group {\n                flex: 1 0 100%;\n            }\n            \n            .form-footer {\n                flex-direction: column;\n                gap: 15px;\n            }\n            \n            .btn {\n                width: 100%;\n            }\n        }\n        \n        @media (max-width: 480px) {\n            .form-body {\n                padding: 20px;\n            }\n            \n            .section-title {\n                font-size: 16px;\n            }\n        }\n    <\/style>\n\n\n    <div class=\"container\">\n        <div class=\"form-container\">\n            <div class=\"form-header\">\n                <h3>Formulir Pengaduan Mahasiswa<\/h3>\n                <p>Program Studi Informatika Medis &#8211; Universitas Almuslim<\/p>\n            <\/div>\n            \n            <div class=\"form-body\">\n                <!-- Ganti ACTION_URL dengan URL Google Forms Anda -->\n                <form id=\"complaintForm\" action=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLSfCd6WU2dCSnIRjrwNB4zAgUQs5UKN0Hk_xliFwWv9t0lO45g\/viewform?usp=header\" method=\"POST\" target=\"_blank\">\n                    <!-- Data Mahasiswa -->\n                    <div class=\"form-section\">\n                        <h3 class=\"section-title\"><i class=\"fas fa-user-graduate\"><\/i> Data Mahasiswa<\/h3>\n                        \n                        <div class=\"form-row\">\n                            <div class=\"form-group\">\n                                <label for=\"nama\" class=\"required\">Nama Lengkap<\/label>\n                                <!-- Ganti entry.1649528872 dengan ID field dari Google Forms -->\n                                <input type=\"text\" id=\"nama\" name=\"entry.1649528872\" required=\"\" placeholder=\"Masukkan nama lengkap\">\n                                <div class=\"error-message\" id=\"namaError\">Nama lengkap harus diisi<\/div>\n                            <\/div>\n                            \n                            <div class=\"form-group\">\n                                <label for=\"nim\" class=\"required\">NIM<\/label>\n                                <!-- Ganti entry.1061809512 dengan ID field dari Google Forms -->\n                                <input type=\"text\" id=\"nim\" name=\"entry.1061809512\" required=\"\" pattern=\"[0-9]{10}\" placeholder=\"Contoh: 202201001 (10 Digit)\">\n                                <div class=\"error-message\" id=\"nimError\">NIM harus 10 digit angka<\/div>\n                            <\/div>\n                        <\/div>\n                        \n                        <div class=\"form-row\">\n                            <div class=\"form-group\">\n                                <label for=\"semester\" class=\"required\">Semester<\/label>\n                                <!-- Ganti entry.610310168 dengan ID field dari Google Forms -->\n                                <select id=\"semester\" name=\"entry.610310168\" required=\"\">\n                                    <option value=\"\">Pilih Semester<\/option>\n                                    <option value=\"1\">Semester 1<\/option>\n                                    <option value=\"2\">Semester 2<\/option>\n                                    <option value=\"3\">Semester 3<\/option>\n                                    <option value=\"4\">Semester 4<\/option>\n                                    <option value=\"5\">Semester 5<\/option>\n                                    <option value=\"6\">Semester 6<\/option>\n                                    <option value=\"7\">Semester 7<\/option>\n                                    <option value=\"8\">Semester 8<\/option>\n                                <\/select>\n                                <div class=\"error-message\" id=\"semesterError\">Pilih semester saat ini<\/div>\n                            <\/div>\n                            \n                            <div class=\"form-group\">\n                                <label for=\"prodi\" class=\"required\">Program Studi<\/label>\n                                <!-- Ganti entry.1835034148 dengan ID field dari Google Forms -->\n                                <input type=\"text\" id=\"prodi\" name=\"entry.1835034148\" value=\"Informatika Medis\" readonly=\"\">\n                            <\/div>\n                        <\/div>\n                        \n                        <div class=\"form-group\">\n                            <label for=\"email\" class=\"required\">Email<\/label>\n                            <!-- Ganti entry.824376083 dengan ID field dari Google Forms -->\n                            <input type=\"email\" id=\"email\" name=\"entry.824376083\" required=\"\" placeholder=\"email@student.almuslim.ac.id\">\n                            <div class=\"error-message\" id=\"emailError\">Email harus valid<\/div>\n                        <\/div>\n                    <\/div>\n                    \n                    <!-- Jenis Pengaduan -->\n                    <div class=\"form-section\">\n                        <h3 class=\"section-title\"><i class=\"fas fa-clipboard-list\"><\/i> Jenis Pengaduan<\/h3>\n                        \n                        <div class=\"form-row\">\n                            <div class=\"form-group\">\n                                <label for=\"jenis\" class=\"required\">Kategori Pengaduan<\/label>\n                                <!-- Ganti entry.277272079 dengan ID field dari Google Forms -->\n                                <select id=\"jenis\" name=\"entry.277272079\" required=\"\">\n                                    <option value=\"\">Pilih Kategori<\/option>\n                                    <option value=\"Akademik\">Masalah Akademik<\/option>\n                                    <option value=\"Fasilitas\">Fasilitas Kampus<\/option>\n                                    <option value=\"Dosen\">Hubungan dengan Dosen<\/option>\n                                    <option value=\"Administrasi\">Administrasi<\/option>\n                                    <option value=\"Teknologi\">Teknologi Informasi<\/option>\n                                    <option value=\"Lainnya\">Lainnya<\/option>\n                                <\/select>\n                                <div class=\"error-message\" id=\"jenisError\">Pilih kategori pengaduan<\/div>\n                            <\/div>\n                            \n                            <div class=\"form-group\">\n                                <label for=\"prioritas\" class=\"required\">Tingkat Prioritas<\/label>\n                                <!-- Ganti entry.833283019 dengan ID field dari Google Forms -->\n                                <select id=\"prioritas\" name=\"entry.833283019\" required=\"\">\n                                    <option value=\"\">Pilih Prioritas<\/option>\n                                    <option value=\"Tinggi\">Tinggi (Mendesak)<\/option>\n                                    <option value=\"Sedang\">Sedang (Perlu Perhatian)<\/option>\n                                    <option value=\"Rendah\">Rendah (Saran\/Umpan Balik)<\/option>\n                                <\/select>\n                                <div class=\"error-message\" id=\"prioritasError\">Pilih tingkat prioritas<\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                    \n                    <!-- Isi Pengaduan -->\n                    <div class=\"form-section\">\n                        <h3 class=\"section-title\"><i class=\"fas fa-edit\"><\/i> Isi Pengaduan<\/h3>\n                        \n                        <div class=\"form-group\">\n                            <label for=\"judul\" class=\"required\">Judul Pengaduan<\/label>\n                            <!-- Ganti entry.1577406094 dengan ID field dari Google Forms -->\n                            <input type=\"text\" id=\"judul\" name=\"entry.1577406094\" required=\"\" placeholder=\"Ringkasan singkat pengaduan\">\n                            <div class=\"error-message\" id=\"judulError\">Judul pengaduan harus diisi<\/div>\n                        <\/div>\n                        \n                        <div class=\"form-group\">\n                            <label for=\"deskripsi\" class=\"required\">Deskripsi Lengkap Pengaduan<\/label>\n                            <!-- Ganti entry.2054580909 dengan ID field dari Google Forms -->\n                            <textarea id=\"deskripsi\" name=\"entry.2054580909\" required=\"\" placeholder=\"Jelaskan secara detail pengaduan Anda, termasuk waktu, tempat, dan pihak yang terlibat (jika ada)\"><\/textarea>\n                            <div class=\"error-message\" id=\"deskripsiError\">Deskripsi pengaduan harus diisi<\/div>\n                        <\/div>\n                        \n                        <div class=\"form-group\">\n                            <label for=\"harapan\">Harapan atau Solusi yang Diinginkan<\/label>\n                            <!-- Ganti entry.875018315 dengan ID field dari Google Forms -->\n                            <textarea id=\"harapan\" name=\"entry.875018315\" placeholder=\"Apa yang Anda harapkan sebagai solusi dari pengaduan ini?\"><\/textarea>\n                        <\/div>\n                    <\/div>\n                    \n                    <!-- Bukti Pendukung -->\n                    <div class=\"form-section\">\n                        <h3 class=\"section-title\"><i class=\"fas fa-paperclip\"><\/i> Bukti Pendukung (Opsional)<\/h3>\n                        \n                        <div class=\"file-upload\">\n                            <i class=\"fas fa-cloud-upload-alt\"><\/i>\n                            <p>Klik atau seret file ke sini untuk mengunggah<\/p>\n                            <p>Maksimal 5MB per file (PDF, JPG, PNG)<\/p>\n                            <!-- Ganti entry.123456789 dengan ID field dari Google Forms -->\n                            <input type=\"file\" id=\"bukti\" name=\"entry.123456789\" class=\"file-input\" multiple=\"\">\n                        <\/div>\n                        \n                        <div class=\"form-group\">\n                            <label for=\"tanggal\" class=\"required\">Tanggal Kejadian<\/label>\n                            <!-- Ganti entry.123456789 dengan ID field dari Google Forms -->\n                            <input type=\"date\" id=\"tanggal\" name=\"entry.123456789\" required=\"\">\n                            <div class=\"error-message\" id=\"tanggalError\">Tanggal kejadian harus diisi<\/div>\n                        <\/div>\n                    <\/div>\n                    \n                    <div class=\"form-footer\">\n                        <p class=\"required-note\">* Menunjukkan field yang wajib diisi<\/p>\n                        <button type=\"submit\" class=\"btn btn-submit\"><i class=\"fas fa-paper-plane\"><\/i> Kirim Pengaduan<\/button>\n                    <\/div>\n                <\/form>\n                \n                <div class=\"instructions\">\n                    <h4>Catatan Penting:<\/h4>\n                    <ol>\n                        <li>Pastikan data yang diisi adalah benar dan dapat dipertanggungjawabkan<\/li>\n                        <li>Pengaduan akan diproses dalam waktu 1-3 hari kerja<\/li>\n                        <li>Untuk pertanyaan darurat, silakan hubungi langsung program studi<\/li>\n                    <\/ol>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n        \n    <script>\n        \/\/ Validasi form sebelum submit\n        document.getElementById('complaintForm').addEventListener('submit', function(event) {\n            let isValid = true;\n            \n            \/\/ Validasi Nama\n            const nama = document.getElementById('nama');\n            if (!nama.value.trim()) {\n                document.getElementById('namaError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('namaError').style.display = 'none';\n            }\n            \n            \/\/ Validasi NIM\n            const nim = document.getElementById('nim');\n            const nimPattern = \/^[0-9]{10}$\/;\n            if (!nimPattern.test(nim.value)) {\n                document.getElementById('nimError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('nimError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Semester\n            const semester = document.getElementById('semester');\n            if (!semester.value) {\n                document.getElementById('semesterError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('semesterError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Email\n            const email = document.getElementById('email');\n            const emailPattern = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n            if (!emailPattern.test(email.value)) {\n                document.getElementById('emailError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('emailError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Jenis Pengaduan\n            const jenis = document.getElementById('jenis');\n            if (!jenis.value) {\n                document.getElementById('jenisError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('jenisError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Prioritas\n            const prioritas = document.getElementById('prioritas');\n            if (!prioritas.value) {\n                document.getElementById('prioritasError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('prioritasError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Judul\n            const judul = document.getElementById('judul');\n            if (!judul.value.trim()) {\n                document.getElementById('judulError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('judulError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Deskripsi\n            const deskripsi = document.getElementById('deskripsi');\n            if (!deskripsi.value.trim()) {\n                document.getElementById('deskripsiError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('deskripsiError').style.display = 'none';\n            }\n            \n            \/\/ Validasi Tanggal\n            const tanggal = document.getElementById('tanggal');\n            if (!tanggal.value.trim()) {\n                document.getElementById('tanggalError').style.display = 'block';\n                isValid = false;\n            } else {\n                document.getElementById('tanggalError').style.display = 'none';\n            }\n            \n            if (!isValid) {\n                event.preventDefault();\n                \/\/ Scroll ke field error pertama\n                const firstError = document.querySelector('.error-message[style=\"display: block\"]');\n                if (firstError) {\n                    firstError.parentElement.scrollIntoView({ behavior: 'smooth', block: 'center' });\n                }\n            } else {\n                \/\/ Jika semua valid, tampilkan pesan sukses\n                alert('Pengaduan Anda berhasil dikirim! Terima kasih atas partisipasinya.');\n                \/\/ Form akan dikirim ke Google Forms\n            }\n        });\n        \n        \/\/ Menampilkan nama file yang diunggah\n        document.getElementById('bukti').addEventListener('change', function(e) {\n            const fileUpload = document.querySelector('.file-upload');\n            if (this.files.length > 0) {\n                fileUpload.innerHTML = `<i class=\"fas fa-file\"><\/i><p>${this.files.length} file dipilih<\/p>`;\n            }\n        });\n    <\/script>\n\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Formulir Pengaduan &#8211; Informatika Medis Formulir Pengaduan Mahasiswa Program Studi Informatika Medis &#8211; Universitas Almuslim Data Mahasiswa Nama Lengkap Nama lengkap harus diisi NIM NIM harus 10 digit angka Semester Pilih SemesterSemester 1Semester 2Semester 3Semester 4Semester 5Semester 6Semester 7Semester 8 Pilih semester saat ini Program Studi Email Email harus valid Jenis Pengaduan Kategori Pengaduan Pilih [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-88","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=\/wp\/v2\/pages\/88","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=88"}],"version-history":[{"count":12,"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=\/wp\/v2\/pages\/88\/revisions"}],"predecessor-version":[{"id":190,"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=\/wp\/v2\/pages\/88\/revisions\/190"}],"wp:attachment":[{"href":"https:\/\/informed.umuslim.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=88"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}