From e4fc3c7ac002ccc7e37f1c6743031e6a939933a6 Mon Sep 17 00:00:00 2001
From: oat_dev <nattapon@frappet.com>
Date: Tue, 23 Apr 2024 13:52:19 +0700
Subject: [PATCH] feat: contact information component

---
 .../ContactInformation.vue                    | 48 +++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 src/components/03_customer-management/ContactInformation.vue

diff --git a/src/components/03_customer-management/ContactInformation.vue b/src/components/03_customer-management/ContactInformation.vue
new file mode 100644
index 00000000..894cd157
--- /dev/null
+++ b/src/components/03_customer-management/ContactInformation.vue
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+defineProps<{
+  title?: string;
+  dense?: boolean;
+  outlined?: boolean;
+  readonly?: boolean;
+  separator?: boolean;
+}>();
+
+const mail = defineModel<string>('mail');
+const telephone = defineModel<string>('telephone');
+</script>
+
+<template>
+  <div class="row">
+    <div class="col-3 app-text-muted">• {{ $t(`formDialogTitleContact`) }}</div>
+    <div class="col-9 row q-col-gutter-md">
+      <q-input
+        :dense="dense"
+        :outlined="!readonly"
+        :readonly="readonly"
+        :borderless="readonly"
+        hide-bottom-space
+        class="col-6"
+        :label="$t('formDialogInputEmail')"
+        v-model="mail"
+      />
+      <q-input
+        :dense="dense"
+        :outlined="!readonly"
+        :readonly="readonly"
+        :borderless="readonly"
+        hide-bottom-space
+        class="col-6"
+        :label="$t('formDialogInputTelephone')"
+        v-model="telephone"
+      />
+    </div>
+  </div>
+
+  <q-separator
+    v-if="separator"
+    class="col-12 q-mt-xl q-mb-md"
+    style="padding-block: 0.5px"
+  />
+</template>
+
+<style></style>