initial commit

resources/js/views/pages/account-settings/PaymentDetails.vue

@@ -0,0 +1,45 @@
+<script setup>
+const cardNumber = ref(null)
+const expiry = ref(null)
+const cvv = ref(null)
+
+
+
+</script>
+
+<template>
+  <VRow>
+    <VCol cols="12">
+      <VCard>
+        <VCardText>
+          <VForm>
+            <VCardText>
+              <VRow>
+                <VCol cols="12" md="6">
+                  <VTextField v-model="cardNumber" label="Card Number" />
+                </VCol>
+
+                <VCol cols="12" md="4">
+                  <VTextField v-model="expiry" label="Expiry" />
+                </VCol>
+
+                <VCol cols="12" md="2">
+                  <VTextField v-model="cvv" label="CVV" />
+                </VCol>
+              </VRow>
+            </VCardText>
+
+            <!-- 👉 Action Buttons -->
+            <VCardText class="d-flex flex-wrap gap-4">
+              <VBtn>Save changes</VBtn>
+
+              <!-- <VBtn type="reset" color="secondary" variant="tonal">
+                Reset
+              </VBtn> -->
+            </VCardText>
+          </VForm>
+        </VCardText>
+      </VCard>
+    </VCol>
+  </VRow>
+</template>