fix responsive

MuhammadAlifBudiman · Dec 19, 2023 · ed614da · ed614da
1 parent 9b1a22c
commit ed614da
Show file tree

Hide file tree

Showing 8 changed files with 55 additions and 65 deletions.
diff --git a/app.py b/app.py
@@ -1146,7 +1146,7 @@ def api_rekam_medis_post(decoded_token):
     if existing_no_kartu:
         raise HttpException(False, 400, "failed", "Nomor kartu sudah digunakan")
     if not is_valid_no_kartu(no_kartu):
-        raise HttpException(False, 400, "failed", "Format nomor kartu tidak valid, gunakan format nn-nn-nn")
+        raise HttpException(False, 400, "failed", "Format nomor kartu tidak valid, gunakan format xx-xx-xx")
     dokter = request.form.get('dokter')
     dokter_list = list(db.jadwal.distinct('nama'))
     if not dokter:
@@ -1229,13 +1229,15 @@ def api_users_pasien(decoded_token):
         ]
 
     # Adjust the query for sorting
-    sort_column = ["_id","name", "nik", "action"][order_column_index]
+    sort_column = ["_id","name", "nik", "_id"][order_column_index]
     sort_direction = ASCENDING if order_direction == 'asc' else DESCENDING
+    collation = {'locale': 'en', 'strength': 2}
 
     # Fetch user details from users collection based on unique usernames
     data_pasien_list = (
         db.users.find(query)
         .sort(sort_column, sort_direction)
+        .collation(collation)
         .skip(start)
         .limit(length)
     )

diff --git a/seeder.py b/seeder.py
@@ -169,7 +169,7 @@ def seed_registrations_pasien(num_registration=3):
                         'status_pernikahan': user['status'],
                         'alamat': user['alamat'],
                         'no_telp': user['no_telp'],
-                        'tanggal': (datetime.now() - timedelta(days=random.randint(0, 3))).strftime('%Y-%m-%d'),
+                        'tanggal': (datetime.now() - timedelta(days=random.randint(0, 3))).strftime('%d-%m-%Y'),
                         'keluhan': fake.sentence(),
                         'status': fake.random_element(elements=['approved', 'done', 'rejected'])
                     }
@@ -225,7 +225,7 @@ def seed_registrations_pasien(num_registration=3):
                         'status_pernikahan': user['status'],
                         'alamat': user['alamat'],
                         'no_telp': user['no_telp'],
-                        'tanggal': (datetime.now() - timedelta(days=random.randint(0, 3))).strftime('%Y-%m-%d'),
+                        'tanggal': (datetime.now() - timedelta(days=random.randint(0, 3))).strftime('%d-%m-%Y'),
                         'keluhan': fake.sentence(),
                         'status': fake.random_element(elements=status_choices)
                     }
@@ -251,7 +251,7 @@ def seed_registrations_pasien(num_registration=3):
                     if registration_data['status'] == 'pending':
                         # Set only one registration as pending for today
                         registration_data['tanggal'] = datetime.now().strftime(
-                            '%Y-%m-%d')
+                            '%d-%m-%Y')
 
                     # Check if there are more "done" registrations than "approved" registrations on the same date
                     if registration_data['status'] == 'done':

diff --git a/static/js/dashboard.js b/static/js/dashboard.js
@@ -93,7 +93,7 @@ $(document).ready(function () {
         orderable: false,
         searchable: false,
         render: function (data, type, row) {
-          return `<button class='btn text-light btn-lihat' data-bs-toggle='modal' data-bs-target='#lihatModal' data-rekammedis-nik='${row.nik}' style='background-color: #06a3da'>Lihat</button>`;
+          return `<button class='btn text-light btn-lihat' data-bs-toggle='modal' data-bs-target='#lihatModal' data-rekammedis-nik='${row.nik}' style='background-color: #091e3e'>Lihat</button>`;
         },
       },
     ],

diff --git a/static/js/index.js b/static/js/index.js
@@ -10,7 +10,7 @@ $(document).ready(function () {
   let jadwalTable = $("#jadwalTable").DataTable({
     serverSide: true,
     processing: true,
-    scrollX: true,
+    scrollX: isSmallDevice(),
     ajax: "/api/jadwal",
     columns: [
       { data: "nama" },
@@ -29,16 +29,11 @@ $(document).ready(function () {
       { width: "20%", targets: 2 },
       { width: "40%", targets: 3 },
     ],
-    initComplete: function () {
-      // Add AOS attributes dynamically after DataTable is populated
-      $("#jadwalTable tbody tr").each(function (index) {
-        $(this).attr("data-aos", "fade-up");
-        $(this).attr("data-aos-delay", index * 100);
-      });
-    },
   });
 
-  let antrianTable = $("#antrianTable").DataTable({});
+  let antrianTable = $("#antrianTable").DataTable({
+    scrollX: isSmallDevice(),
+  });
 
   // Ambil data antrian hari ini
   $.ajax({
@@ -51,24 +46,7 @@ $(document).ready(function () {
         antrianTable.row
           .add([row.poli, row.jumlah_pendaftar, row.dalam_antrian])
           .draw(false);
-        // Add AOS attributes dynamically after adding data to the DataTable
-        $("#antrianTable tbody tr:last").attr("data-aos", "fade-up");
-        $("#antrianTable tbody tr:last").attr(
-          "data-aos-delay",
-          (index + jadwalTable.rows().count()) * 100
-        );
       });
     },
   });
-
-  // Check screen size on window resize
-  $(window).resize(function () {
-    // Update DataTable settings based on screen size
-    jadwalTable.settings()[0].scrollX = isSmallDevice();
-    jadwalTable.draw();
-  });
-
-  // Initial check for screen size on page load
-  jadwalTable.settings()[0].scrollX = isSmallDevice();
-  jadwalTable.draw();
 });
diff --git a/static/js/praktik.js b/static/js/praktik.js
@@ -4,6 +4,7 @@ $(document).ready(function () {
   let jadwalTable = $("#jadwalTable").DataTable({
     serverSide: true,
     processing: true,
+    scrollX: true,
     ajax: "/api/jadwal",
     columns: [
       { data: "nama" },
@@ -20,10 +21,17 @@ $(document).ready(function () {
         orderable: false,
         searchable: false,
         render: function (data, type, row) {
-          return `<button class='btn btn-warning btn-sm btn-edit' data-bs-toggle='modal'        data-bs-target='#editModal' data-jadwal-id='${row._id}'>Edit</button> <button class='btn btn-danger btn-sm btn-delete' data-bs-toggle='modal' data-bs-target='#deleteModal' data-jadwal-id='${row._id}'>Delete</button>`;
+          return `<button class='btn text-light btn-sm btn-edit' data-bs-toggle='modal'        data-bs-target='#editModal' data-jadwal-id='${row._id}' style='background-color: #06a3da'>Edit</button> <button class='btn btn-danger btn-sm btn-delete' data-bs-toggle='modal' data-bs-target='#deleteModal' data-jadwal-id='${row._id}' style='background-color: #091e3e'>Delete</button>`;
         },
       },
     ],
+    columnDefs: [
+      { width: "20%", targets: 0 }, // Adjust the width as needed
+      { width: "20%", targets: 1 },
+      { width: "20%", targets: 2 },
+      { width: "10%", targets: 3 },
+      { width: "10%", targets: 4 },
+    ],
   });
 
   // insert button tambah below h2 with id jadwal
@@ -87,7 +95,6 @@ $(document).ready(function () {
       },
       error: function (error) {
         showToast(error.responseJSON.message, "error", 3000);
-        alert(error.responseJSON.message);
       },
     });
 

diff --git a/static/js/rekam_medis.js b/static/js/rekam_medis.js
@@ -21,10 +21,10 @@ $(document).ready(function () {
         data: null,
         render: function (data, type, row) {
           if (row.has_rekam_medis){
-            return `<button class='btn btn-danger btn-sm btn-lihat' data-bs-toggle='modal' data-bs-target='#lihatModal' data-rekammedis-nik='${row.nik}'>Lihat</button>`;
+            return `<button class='btn btn-sm btn-lihat text-light' data-bs-toggle='modal' data-bs-target='#lihatModal' data-rekammedis-nik='${row.nik}' style='background-color: #091e3e'>Lihat</button>`;
           }
           else{
-            return `<button class='btn btn-warning btn-sm btn-buat' data-bs-toggle='modal' data-bs-target='#buatModal' data-rekammedis-nik='${row.nik}'>Buat</button>`;
+            return `<button class='btn btn-sm btn-buat text-light' data-bs-toggle='modal' data-bs-target='#buatModal' data-rekammedis-nik='${row.nik}' style='background-color: #06a3da'>Buat</button>`;
           }
         },
       },
@@ -114,7 +114,7 @@ $(document).ready(function () {
           orderable: false,
           searchable: false,
           render: function (data, type, row) {
-            return `<button class='btn btn-warning btn-sm btn-edit' data-bs-toggle='modal'        data-bs-target='#editModal' data-checkup-id='${row._id}' data-rekammedis-nik='${rekamMedisNik}'>Edit</button>`;
+            return `<button class='btn btn-sm btn-edit text-light' data-bs-toggle='modal'        data-bs-target='#editModal' data-checkup-id='${row._id}' data-rekammedis-nik='${rekamMedisNik}' style='background-color: #06a3da'>Edit</button>`;
           },
         }
       ],
@@ -125,7 +125,6 @@ $(document).ready(function () {
       url: `/api/rekam_medis/${rekamMedisNik}`,
       type: "GET",
       success: function (response) {
-        console.log(response)
         $("#lihatModal").find("#no_kartu").text(response.data.no_kartu);
         $("#lihatModal").find("#nama").text(response.data.nama);
         $("#lihatModal").find("#nik").text(response.data.nik);

diff --git a/templates/pages/praktik.html b/templates/pages/praktik.html
@@ -36,7 +36,7 @@ <h1 class="modal-title fs-5" id="exampleModalLabel">
         </div>
         <div class="modal-body">
           <form id="tambahJadwal">
-            <div class="row mb-3">
+            <div class="row mb-3 d-flex align-items-center">
               <label
                 for="nama"
                 class="col-sm-2 col-form-label col-form-label-sm"
@@ -51,7 +51,7 @@ <h1 class="modal-title fs-5" id="exampleModalLabel">
                 />
               </div>
             </div>
-            <div class="row mb-3">
+            <div class="row mb-3 d-flex align-items-center">
               <label
                 for="poli"
                 class="col-sm-2 col-form-label col-form-label-sm"
@@ -186,12 +186,13 @@ <h1 class="modal-title fs-5" id="exampleModalLabel">
             <div class="d-flex justify-content-center">
               <button
                 type="button"
-                class="btn btn-secondary me-2"
+                class="btn text-light me-2"
                 data-bs-dismiss="modal"
+                style="background-color: #091e3e;"
               >
                 Cancel
               </button>
-              <button type="submit" class="btn btn-primary">Save</button>
+              <button type="submit" class="btn text-light" style="background-color: #06a3da;">Save</button>
             </div>
           </form>
         </div>
@@ -212,7 +213,7 @@ <h1 class="modal-title fs-5" id="exampleModalLabel">
       <div class="modal-content">
         <div class="modal-header">
           <h1 class="modal-title fs-5" id="editModalLabel">
-            Tambah Jadwal Praktik
+            Edit Jadwal Praktik
           </h1>
           <button
             type="button"
@@ -223,7 +224,7 @@ <h1 class="modal-title fs-5" id="editModalLabel">
         </div>
         <div class="modal-body">
           <form id="editJadwal">
-            <div class="row mb-3">
+            <div class="row mb-3 d-flex align-items-center">
               <label
                 for="nama"
                 class="col-sm-2 col-form-label col-form-label-sm"
@@ -238,7 +239,7 @@ <h1 class="modal-title fs-5" id="editModalLabel">
                 />
               </div>
             </div>
-            <div class="row mb-3">
+            <div class="row mb-3 d-flex align-items-center">
               <label
                 for="poli"
                 class="col-sm-2 col-form-label col-form-label-sm"
@@ -373,12 +374,13 @@ <h1 class="modal-title fs-5" id="editModalLabel">
             <div class="d-flex justify-content-center">
               <button
                 type="button"
-                class="btn btn-secondary me-2"
+                class="btn text-light me-2"
                 data-bs-dismiss="modal"
+                style="background-color: #091e3e;"
               >
                 Cancel
               </button>
-              <button type="submit" class="btn btn-primary">Save</button>
+              <button type="submit" class="btn text-light" style="background-color: #06a3da;">Save</button>
             </div>
           </form>
         </div>
@@ -412,13 +414,14 @@ <h1 class="modal-title fs-5 text-center" id="deleteModalLabel">
         <div class="modal-footer d-flex justify-content-center">
           <button
             type="button"
-            class="btn btn-secondary"
+            class="btn text-light"
             data-bs-dismiss="modal"
+            style="background-color: #091e3e; display: inline-block; width: auto;"
           >
             Cancel
           </button>
-          <form id="hapusJadwal">
-            <button type="submit" class="btn btn-danger">Yes</button>
+          <form id="hapusJadwal" style="display: inline-block;">
+            <button type="submit" class="btn text-light" style="background-color: #06a3da;">Yes</button>
           </form>
         </div>
       </div>

diff --git a/templates/pages/rekam_medis.html b/templates/pages/rekam_medis.html
@@ -33,7 +33,7 @@ <h1 class="modal-title fs-5" id="buatModalLabel">
       </div>
       <div class="modal-body">
         <form id="buatrekam_medis">
-          <div class="row mb-3">
+          <div class="row mb-3 d-flex align-items-center">
             <label for="no" class="col-sm-2 col-form-label col-form-label-sm"
               >No
             </label>
@@ -46,7 +46,7 @@ <h1 class="modal-title fs-5" id="buatModalLabel">
               />
             </div>
           </div>
-          <div class="row mb-3">
+          <div class="row mb-3 d-flex align-items-center">
             <label
               for="dokter"
               class="col-sm-2 col-form-label col-form-label-sm"
@@ -76,12 +76,13 @@ <h1 class="modal-title fs-5" id="buatModalLabel">
           <div class="d-flex justify-content-center">
             <button
               type="button"
-              class="btn btn-secondary me-2"
+              class="btn me-2 text-light"
               data-bs-dismiss="modal"
+              style="background-color: #091e3e;"
             >
               Cancel
             </button>
-            <button type="submit" class="btn btn-primary">Save</button>
+            <button type="submit" class="btn text-light" style="background-color: #06a3da;">Save</button>
           </div>
         </form>
       </div>
@@ -99,7 +100,7 @@ <h1 class="modal-title fs-5" id="buatModalLabel">
   aria-labelledby="lihatModalLabel"
   aria-hidden="true"
 >
-  <div class="modal-dialog modal-fullscreen" role="document">
+  <div class="modal-dialog modal-fullscreen " role="document">
     <div class="modal-content">
       <div class="modal-header">
         <div class="row">
@@ -142,7 +143,7 @@ <h1>Data Rekam Medis Pasien Klinik Google</h1>
           aria-label="Close"
         ></button>
       </div>
-      <div class="modal-body">
+      <div class="modal-body ">
         {% set table_title='' %} {% set table_headers=['No', 'Tgl Periksa',
         'Dokter', 'Poli', 'Keluhan', 'Anamnesa Hasil Pemeriksaan', 'Action'] %}
         {% set table_id='list_checkup_user' %} {% include
@@ -164,7 +165,7 @@ <h1>Data Rekam Medis Pasien Klinik Google</h1>
     <div class="modal-content">
       <div class="modal-header">
         <h1 class="modal-title fs-5" id="editModalLabel">
-          Tambah Data Rekam Medis
+          Edit Data Rekam Medis
         </h1>
         <button
           type="button"
@@ -173,9 +174,9 @@ <h1 class="modal-title fs-5" id="editModalLabel">
           aria-label="Close"
         ></button>
       </div>
-      <div class="modal-body">
+      <div class="modal-body ">
         <form id="edit">
-          <div class="row mb-3">
+          <div class="row mb-3 d-flex align-items-center">
             <label
               for="dokter"
               class="col-sm-2 col-form-label col-form-label-sm"
@@ -192,25 +193,25 @@ <h1 class="modal-title fs-5" id="editModalLabel">
           </div>
           <div class="field">
             <label class="label" for="textarea-about">Hasil Anamnesa</label>
-            <p class="control">
+            <div class="col-sm-12">
               <textarea
                 id="hasil_anamnesa"
-                class="textarea"
-                cols="45"
+                class="textarea form-control form-control-sm"
                 name="hasil_anamnesa"
               >
               </textarea>
-            </p>
+            </div>
           </div>
           <div class="d-flex justify-content-center">
             <button
               type="button"
-              class="btn btn-secondary me-2"
+              class="btn me-2 text-light"
               data-bs-dismiss="modal"
+              style="background-color: #091e3e;"
             >
               Cancel
             </button>
-            <button type="submit" class="btn btn-primary">Save</button>
+            <button type="submit" class="btn text-light" style="background-color: #06a3da;">Save</button>
           </div>
         </form>
       </div>