adding country

maudhelen · Oct 14, 2023 · 8f8a8c7 · 8f8a8c7
1 parent b693458
commit 8f8a8c7
Showing 1 changed file with 59 additions and 56 deletions.
diff --git a/src/components/AppAccounts.vue b/src/components/AppAccounts.vue
@@ -26,9 +26,9 @@
                 <th scope="col">Account Name</th>
                 <th scope="col">Account Number</th>
                 <th scope="col">Account Balance</th>
-                <th scope="col">Account Country</th>
                 <th scope="col">Account Currency</th>
                 <th scope="col">Account Status</th>
+                <th scope="col">Country</th>
                 <th scope="col">Actions</th>
               </tr>
             </thead>
@@ -37,7 +37,6 @@
                 <td>{{ account.name }}</td>
                 <td>{{ account.account_number }}</td>
                 <td>{{ account.balance }}</td>
-                <td>{{ account.country }}</td>
                 <td>{{ account.currency }}</td>
                 <td>
                   <span
@@ -49,6 +48,7 @@
                     account.status
                   }}</span>
                 </td>
+                <td>{{ account.country }}</td>
                 <td>
                   <div class="btn-group" role="group">
                     <button
@@ -76,61 +76,62 @@
           </footer>
         </div>
       </div>
-<b-modal
-  ref="addAccountModal"
-  id="account-modal"
-  title="Create a new account"
-  hide-backdrop
-  hide-footer
->
-  <b-form @submit="onSubmit" class="w-100">
-    <b-form-group
-      id="form-name-group"
-      label="Account Name:"
-      label-for="form-name-input"
-    >
-      <b-form-input
-        id="form-name-input"
-        type="text"
-        v-model="createAccountForm.name"
-        placeholder="Account Name"
-        required
-      >
-      </b-form-input>
-    </b-form-group>
-    <b-form-group
-      id="form-currency-group"
-      label="Currency:"
-      label-for="form-currency-input"
-    >
-      <b-form-input
-        id="form-currency-input"
-        type="text"
-        v-model="createAccountForm.currency"
-        placeholder="$ or €"
-        required
-      >
-      </b-form-input>
-    </b-form-group>
-    <b-form-group
-      id="form-country-group"
-      label="Country:"
-      label-for="form-country-input"
-    >
-      <b-form-input
-        id="form-country-input"
-        type="text"
-        v-model="createAccountForm.country"
-        placeholder="Country"
-        required
+      <b-modal
+        ref="addAccountModal"
+        id="account-modal"
+        title="Create a new account"
+        hide-backdrop
+        hide-footer
       >
-      </b-form-input>
-    </b-form-group>
+        <b-form @submit="onSubmit" class="w-100">
+          <b-form-group
+            id="form-name-group"
+            label="Account Name:"
+            label-for="form-name-input"
+          >
+            <b-form-input
+              id="form-name-input"
+              type="text"
+              v-model="createAccountForm.name"
+              placeholder="Account Name"
+              required
+            >
+            </b-form-input>
+          </b-form-group>
+
+          <b-form-group
+            id="form-currency-group"
+            label="Currency:"
+            label-for="form-currency-input"
+          >
+            <b-form-input
+              id="form-currency-input"
+              type="text"
+              v-model="createAccountForm.currency"
+              placeholder="$ or €"
+              required
+            >
+            </b-form-input>
+          </b-form-group>
 
-    <b-button type="submit" variant="outline-info">Submit</b-button>
-  </b-form>
-</b-modal>
+          <b-form-group
+            id="form-country-group"
+            label="Country:"
+            label-for="form-country-input"
+          >
+            <b-form-input
+              id="form-country-input"
+              type="text"
+              v-model="createAccountForm.country"
+              placeholder="Spain"
+              required
+            >
+            </b-form-input>
+          </b-form-group>
 
+          <b-button type="submit" variant="outline-info">Submit</b-button>
+        </b-form>
+      </b-modal>
       <!-- End of Modal for Create Account-->
       <!-- Start of Modal for Edit Account-->
       <b-modal
@@ -231,7 +232,7 @@ export default {
         .then((response) => {
           this.RESTgetAccounts();
           // For message alert
-          this.message = "Account Updated succesfully!";
+          this.message = "Account Updated successfully!";
           // To actually show the message
           this.showMessage = true;
           // To hide the message after 3 seconds
@@ -275,6 +276,7 @@ export default {
     initForm() {
       this.createAccountForm.name = "";
       this.createAccountForm.currency = "";
+      this.createAccountForm.country = "";
       this.editAccountForm.id = "";
       this.editAccountForm.name = "";
     },
@@ -286,6 +288,7 @@ export default {
       const payload = {
         name: this.createAccountForm.name,
         currency: this.createAccountForm.currency,
+        country: this.createAccountForm.country,
       };
       this.RESTcreateAccount(payload);
       this.initForm();
@@ -320,4 +323,4 @@ export default {
     this.RESTgetAccounts();
   },
 };
-</script>
+</script>