progressbar button kirim laporan tanpa kode verifikasi

components/Main/Login.js

@@ -159,14 +159,6 @@ class Login extends Component {
                   <b className="font-color-white">
                     {" "}
                     {this.state.loading ? (
-                      // <div class="d-flex align-items-center">
-                      //   <strong>Login...</strong>
-                      //   <div
-                      //     class="spinner-border spinner-border-sm ml-auto"
-                      //     role="status"
-                      //     aria-hidden="true"
-                      //   ></div>
-                      // </div>
                       <div class="d-flex justify-content-center">
                         <div
                           class="spinner-border spinner-border-sm"

pages/laporan/new/index.js

@@ -149,6 +149,7 @@ class App extends Component {
       error: null,
       data: {},
       token: "",
+      loading: false,
     };
   }
 
@@ -209,6 +210,7 @@ class App extends Component {
     }
 
     const toastid = toast.loading("Please wait...");
+
     const success = await createLaporanPublic(formdata);
     if (!success) {
       swal.fire({
@@ -241,7 +243,8 @@ class App extends Component {
       });
     }
 
-    const toastid = toast.loading("loading...");
+    // const toastid = toast.loading("loading...");
+    this.setState({ loading: true });
     const success = await createLaporanPublic(token, formdata);
     if (!success) {
       // toast.update(toastid, { render: "All is not good", type: "error", isLoading: false, autoClose: true, closeButton: true });
@@ -262,6 +265,7 @@ class App extends Component {
       this.toggleModal();
       Router.push("/laporan/new");
     }
+    this.setState({ loading: false });
   };
 
   createUser = async (data) => {
@@ -672,15 +676,35 @@ class App extends Component {
               </ModalBody>
               <ModalFooter>
                 <Button
-                  className="color-3e3a8e"
+                  className="color-3e3a8e ml-auto"
+                  color
+                  type="cancel"
+                >
+                  <span className="font-color-white">cancel</span>
+                </Button>
+                <Button
+                  className="btn-login"
                   color
                   onClick={async () => {
                     await this.createLaporan(this.state.token);
                   }}
                 >
-                  <span className="font-color-white">
-                    Buat Laporan Tanpa Kode Verifikasi
-                  </span>
+                  {this.state.loading ?
+                    (
+                      <div class="d-flex justify-content-center">
+                        <span
+                          class="spinner-border spinner-border-sm text-white"
+                          role="status"
+                        ></span>
+                        <span className="font-color-white">
+                          &nbsp; Diproses...
+                        </span>
+                      </div>
+                    ) : (
+                      <span className="font-color-white">
+                        Buat Laporan Tanpa Kode Verifikasi
+                      </span>
+                    )}
                 </Button>
                 <Button
                   className="color-3e3a8e"

pages/pt/jawaban-pencabutan-sanksi/detail.js

@@ -104,7 +104,11 @@ class DetailJawabanPencabutanSanksi extends Component {
 															query: { id: sanksi.data._id },
 														}}
 													>
-														<Button color="primary">Perbaiki Dokumen</Button>
+														<Button color className="btn-login color-3e3a8e">
+															<span className="font-color-white">
+																Dokumen Perbaikan
+															</span>
+														</Button>
 													</Link>
 												)}
 											</Col>