button disable and change position keberatan in radarchart

components/Riwayat/ChartRadarSudah.js

@@ -12,23 +12,24 @@ class ChartRadarSudah extends React.Component {
         super(props);
 
         this.radar = {
-            series: [{
-                name: 'Banding',
-                data: [4, 6, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1, 2, 3, 4, 4],
-            }
+            series: [
+                {
+                    name: 'Keberatan',
+                    data: [8, 6, 8, 1, 2, 3, 4, 5, 6, 7, 8, 8, 7, 6, 5, 3],
+                },
+                {
+                    name: 'Banding',
+                    data: [4, 6, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1, 2, 3, 4, 4],
+                }
                 , {
-                name: 'Pemantauan Perbaikan',
-                data: [4, 6, 8, 4, 5, 6, 7, 8, 8, 9, 3, 4, 5, 6, 7, 3],
-            }
+                    name: 'Pemantauan Perbaikan',
+                    data: [4, 6, 8, 4, 5, 6, 7, 8, 8, 9, 3, 4, 5, 6, 7, 3],
+                }
                 , {
-                name: 'Pencabutan Sanksi',
-                data: [4, 6, 6, 9, 8, 7, 6, 3, 2, 1, 8, 5, 4, 3, 6, 7],
-                colors: "#B2B0D2",
-            },
-            {
-                name: 'Keberatan',
-                data: [8, 6, 8, 1, 2, 3, 4, 5, 6, 7, 8, 8, 7, 6, 5, 3],
-            }],
+                    name: 'Pencabutan Sanksi',
+                    data: [4, 6, 6, 9, 8, 7, 6, 3, 2, 1, 8, 5, 4, 3, 6, 7],
+                    colors: "#B2B0D2",
+                },],
             options: {
                 chart: {
                     height: 150,

pages/laporan/new/index.js

@@ -153,6 +153,9 @@ class App extends Component {
       loading: false,
       disable: false,
       disablekirim: false,
+      disablekirim2: false,
+      disablekirim3: false,
+      loading2: false
     };
   }
 
@@ -383,7 +386,11 @@ class App extends Component {
                         <div className="col-md-10">
                           <Field name="no_hp">
                             {({ field, form }) => (
-                              <Input type="tel" {...field} />
+                              <Input type="tel" id="phone"
+                                name="phone"
+                                pattern="[0-9]{10,13}"
+                                // title="Nomor telepon tidak valid"
+                                {...field} />
                             )}
                           </Field>
                           <ErrorMessage
@@ -692,12 +699,17 @@ class App extends Component {
                 <Button
                   className="btn-login"
                   color
-                  disable={this.state.disablekirim}
+                  disabled={this.state.disablekirim3}
                   onClick={async () => {
+                    this.setState({ loading2: true })
+                    this.setState({ disablekirim2: true })
                     await this.createLaporan(this.state.token);
+                    this.setState({ loading2: false })
+                    this.setState({ disablekirim2: false })
+
                   }}
                 >
-                  {this.state.loading ?
+                  {this.state.loading2 ?
                     (
                       <div class="d-flex justify-content-center">
                         <span
@@ -715,7 +727,7 @@ class App extends Component {
                     )}
                 </Button>
                 <Button
-                  className="color-3e3a8e  btn-login bg-danger"
+                  className="bg-danger"
                   color
                   disabled={this.state.disable}
                   onClick={() => this.setState({ modal: false, disablekirim: true })}
@@ -725,9 +737,11 @@ class App extends Component {
                 <Button
                   className="color-3e3a8e btn-login bg-success"
                   color
-                  disable={this.state.disablekirim}
+                  disabled={this.state.disablekirim2}
                   onClick={async () => {
+                    this.setState({ disablekirim3: true })
                     if (this.state.kode) {
+
                       await this.createLaporan(
                         this.state.token,
                         this.state.kode
@@ -735,6 +749,7 @@ class App extends Component {
                     } else {
                       this.setState({ error: "Kode verifikasi harus diisi" });
                     }
+                    this.setState({ disablekirim3: false })
                   }}
                 >
                   <span className="font-color-white">Kirim</span>
@@ -789,7 +804,7 @@ class App extends Component {
                 <Button
                   className="btn-login bg-success"
                   color
-                  disable={this.state.disablekirim}
+                  disabled={this.state.disablekirim}
                   onClick={async () => {
                     await this.createLaporan(this.state.token);
                     // this.state.disable