Feat: Create Customer Post API

tienda_ilusion/don_confiao/frontend/don-confiao/src/components/CreateCustomerModal.vue

@@ -10,13 +10,18 @@
             v-model="customer.name"
             label="Nombre"
             :rules="[rules.required]"
-            required
           ></v-text-field>
           <v-text-field
-            v-model="customer.email"
-            label="Correo Electrónico"
-            :rules="[rules.required, rules.email]"
-            required
+              v-model="customer.address"
+              label="Direccion"
+              :rules="[rules.required]"
+              required
+          ></v-text-field>
+          <v-text-field
+              v-model="customer.email"
+              label="Correo Electrónico"
+              :rules="[rules.required, rules.email]"
+              required
           ></v-text-field>
           <v-text-field
             v-model="customer.phone"
@@ -63,11 +68,27 @@
              this.showModal = false;
              this.resetForm();
          },
-         submitForm() {
+         async submitForm() {
              if (this.$refs.form.validate()) {
-                 // Aquí puedes manejar el envío del formulario
-                 console.log('Cliente guardado:', this.customer);
-                 this.closeModal();
+                 try {
+                     console.log(this.customer)
+                     const response = await fetch('/don_confiao/api/customers/', {
+                         method: 'POST',
+                         headers: {
+                             'Content-Type': 'application/json',
+                         },
+                         body: JSON.stringify(this.customer),
+                     });
+                     if (response.ok) {
+                         const data = await response.json();
+                         console.log('Cliente Guardado:', data);
+                         this.closeModal();
+                     } else {
+                         console.error('Error al Crear el Cliente:', response.statusText);
+                     }
+                 } catch (error) {
+                     console.error('Error de red:', error);
+                 }
              }
          },
          resetForm() {