feat(support): adiciona destino como select

src/pages/support/components/AddEditTicketDialog.vue

@@ -10,6 +10,7 @@
         <q-form ref="formRef" @submit="onOKClick">
           <q-card-section class="q-pt-sm">
             <CustomTabComponent
+              v-if="ticket?.id"
               v-model:active-tab="currentTab"
               :tabs="tabs"
               class="q-mb-md"
@@ -25,7 +26,7 @@
                 />
 
                 <DefaultInputDatePicker
-                  v-model="form.date"
+                  v-model:untreated-date="form.date"
                   label="Data do Registro"
                   class="col-6"
                 />
@@ -37,19 +38,31 @@
                   class="col-6"
                 />
 
-                <DefaultSelect
-                  v-model="form.responsible"
+                <DefaultInput
+                  :model-value="user?.name"
                   label="Responsável"
-                  :options="[]"
+                  disable
                   class="col-6"
                 />
 
-                <UnitSelect v-model="form.unit" class="col-6" />
-
                 <DefaultSelect
+                  v-model="form.unit_target"
+                  label="Destino"
+                  :options="unitTargetOptions"
+                  emit-value
+                  map-options
+                  class="col-6"
+                />
+
+                <DefaultInput
                   v-model="form.sector"
                   label="Setor"
-                  :options="[]"
+                  class="col-6"
+                />
+
+                <UnitSelect
+                  v-if="form.unit_target === 'specific'"
+                  v-model="form.unit"
                   class="col-6"
                 />
 
@@ -63,7 +76,29 @@
             </div>
 
             <!-- Tab: Comentários -->
-            <div v-show="currentTab === 'comentarios'" />
+            <div v-show="currentTab === 'comentarios'">
+              <div class="flex justify-end q-mb-sm">
+                <q-btn
+                  color="primary"
+                  icon="mdi-plus"
+                  unelevated
+                  style="width: 40px; height: 40px"
+                  @click="onAddComment"
+                />
+              </div>
+              <div
+                class="column q-gutter-y-sm overflow-y-auto"
+                style="max-height: 340px"
+              >
+                <TicketCommentCard
+                  v-for="comment in mockComments"
+                  :key="comment.id"
+                  :reply="comment.reply"
+                  :created-at="comment.created_at"
+                  :user-name="comment.user_name"
+                />
+              </div>
+            </div>
           </q-card-section>
 
           <q-card-actions align="right" class="q-px-md q-pb-md">
@@ -87,7 +122,7 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, computed } from "vue";
 import { useDialogPluginComponent } from "quasar";
 
 import CustomTabComponent from "src/components/shared/CustomTabComponent.vue";
@@ -96,6 +131,8 @@ import DefaultInput from "src/components/defaults/DefaultInput.vue";
 import DefaultInputDatePicker from "src/components/defaults/DefaultInputDatePicker.vue";
 import DefaultSelect from "src/components/defaults/DefaultSelect.vue";
 import UnitSelect from "src/components/selects/UnitSelect.vue";
+import TicketCommentCard from "./TicketCommentCard.vue";
+import { userStore } from "src/stores/user";
 
 defineEmits([...useDialogPluginComponent.emits]);
 
@@ -109,13 +146,43 @@ const { ticket } = defineProps({
 const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } =
   useDialogPluginComponent();
 
+const { user } = userStore();
+
 const formRef = ref(null);
 const loading = ref(false);
 const currentTab = ref("ticket");
 
-const tabs = [
-  { name: "ticket", label: "Ticket" },
-  { name: "comentarios", label: "Comentários" },
+const tabs = computed(() => {
+  const base = [{ name: "ticket", label: "Ticket" }];
+  if (ticket?.id) base.push({ name: "comentarios", label: "Comentários" });
+  return base;
+});
+
+const mockComments = [
+  {
+    id: 1,
+    reply: "Já identifiquei o problema, estou trabalhando na correção.",
+    created_at: "18/05/2026 09:14",
+    user_name: "Ana Souza",
+  },
+  {
+    id: 2,
+    reply: "Correção aplicada em ambiente de homologação, aguardando validação.",
+    created_at: "18/05/2026 11:30",
+    user_name: "Carlos Mendes",
+  },
+  {
+    id: 3,
+    reply: "Validado com sucesso em homologação, subindo para produção.",
+    created_at: "18/05/2026 14:05",
+    user_name: "Ana Souza",
+  },
+  {
+    id: 4,
+    reply: "Deploy concluído. Por favor confirme se o problema foi resolvido.",
+    created_at: "18/05/2026 15:48",
+    user_name: "Carlos Mendes",
+  },
 ];
 
 const priorityOptions = [
@@ -124,16 +191,29 @@ const priorityOptions = [
   { label: "Baixa", value: "baixa" },
 ];
 
+const unitTargetOptions = [
+  { label: "Todas as Unidades", value: "all" },
+  { label: "Suporte Interno", value: "internal" },
+  { label: "Unidade Específica", value: "specific" },
+];
+
+const today = new Date();
+const todayUntreated = `${today.getFullYear()}-${String(today.getMonth() + 1).padStart(2, "0")}-${String(today.getDate()).padStart(2, "0")}`;
+
 const form = ref({
   title: ticket?.title ?? null,
-  date: ticket?.date ?? null,
+  date: ticket?.date ?? todayUntreated,
   priority: ticket?.priority ?? null,
-  responsible: ticket?.responsible ?? null,
+  unit_target: ticket?.unit_target ?? null,
   unit: ticket?.unit ?? null,
   sector: ticket?.sector ?? null,
   description: ticket?.description ?? null,
 });
 
+const onAddComment = () => {
+  // TODO: implement add comment
+};
+
 const onOKClick = async () => {
   loading.value = true;
   try {

src/pages/support/components/TicketCommentCard.vue

@@ -0,0 +1,27 @@
+<template>
+  <q-card flat bordered class="q-pa-md">
+    <div class="text-body2">
+      <span class="text-weight-medium">Resposta:</span> {{ reply }}
+    </div>
+    <div class="text-caption text-grey-6 q-mt-xs">
+      {{ createdAt }} &mdash; {{ userName }}
+    </div>
+  </q-card>
+</template>
+
+<script setup>
+defineProps({
+  reply: {
+    type: String,
+    required: true,
+  },
+  createdAt: {
+    type: String,
+    required: true,
+  },
+  userName: {
+    type: String,
+    required: true,
+  },
+});
+</script>