feat(packages): implementa tab Unidades no dialog de pacote

- Renomeia tab 'Dados da Unidade' para 'Informações'
- Adiciona campo 'Visível para todas as Unidades / Grupos' com ações check/X
- Campo de busca de unidade/grupo com botão +
- Lista de unidades com contador, colunas Unidade/Status e botões check/X por linha
- Filtro reativo por busca e setAllVisible para controle em massa

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/pages/packages/components/AddEditPackageDialog.vue

@@ -24,7 +24,8 @@
               class="q-mb-md"
             />
 
-            <div v-show="currentTab === 'dados'">
+            <!-- Tab: Informações -->
+            <div v-show="currentTab === 'informacoes'">
               <div class="row q-col-gutter-sm">
                 <DefaultInput
                   v-model="form.name"
@@ -96,8 +97,118 @@
               </div>
             </div>
 
+            <!-- Tab: Unidades -->
             <div v-show="currentTab === 'unidades'">
-              <!-- Unidades tab content -->
+              <div class="column q-gutter-y-sm">
+                <!-- Visível para todas as Unidades / Grupos -->
+                <q-input
+                  outlined
+                  readonly
+                  dense
+                  label="Visível para todas as Unidades / Grupos"
+                  label-color="secondary"
+                  color="secondary"
+                  bg-color="white"
+                  style="border-radius: 8px"
+                >
+                  <template #append>
+                    <q-btn
+                      flat
+                      round
+                      dense
+                      size="sm"
+                      icon="mdi-check"
+                      color="positive"
+                      @click="setAllVisible(true)"
+                    />
+                    <q-btn
+                      flat
+                      round
+                      dense
+                      size="sm"
+                      icon="mdi-close-circle-outline"
+                      color="negative"
+                      @click="setAllVisible(false)"
+                    />
+                  </template>
+                </q-input>
+
+                <!-- Buscar Unidade / Grupo + botão + -->
+                <div class="row items-center q-gutter-x-sm">
+                  <q-input
+                    v-model="unitSearch"
+                    outlined
+                    dense
+                    label="Buscar Unidade / Grupo"
+                    label-color="secondary"
+                    color="secondary"
+                    bg-color="white"
+                    class="col"
+                    style="border-radius: 8px"
+                  >
+                    <template #append>
+                      <q-icon name="mdi-magnify" color="secondary" />
+                    </template>
+                  </q-input>
+
+                  <q-btn
+                    color="primary"
+                    icon="mdi-plus"
+                    unelevated
+                    style="border-radius: 8px; height: 40px; width: 40px; flex-shrink: 0"
+                  />
+                </div>
+
+                <!-- Lista de Unidades -->
+                <div
+                  class="rounded-borders q-pa-sm"
+                  style="background-color: #f5f5f5"
+                >
+                  <div class="row items-center q-mb-xs q-px-sm">
+                    <q-icon
+                      name="mdi-account-multiple"
+                      color="secondary"
+                      size="sm"
+                      class="q-mr-xs"
+                    />
+                    <span class="text-body2">
+                      Unidades Ativas ({{ filteredUnits.length }})
+                    </span>
+                  </div>
+
+                  <q-separator class="q-mb-xs" />
+
+                  <div class="row q-px-sm q-py-xs">
+                    <span class="col text-caption text-grey-6">Unidade</span>
+                    <span class="col-auto text-caption text-grey-6">Status</span>
+                  </div>
+
+                  <template v-for="unit in filteredUnits" :key="unit.id">
+                    <q-separator />
+                    <div class="row items-center q-px-sm q-py-sm">
+                      <span class="col text-body2">{{ unit.name }}</span>
+                      <div class="col-auto row q-gutter-x-xs">
+                        <q-btn
+                          round
+                          unelevated
+                          color="positive"
+                          icon="mdi-check"
+                          size="xs"
+                          @click="unit.active = true"
+                        />
+                        <q-btn
+                          round
+                          outline
+                          color="negative"
+                          icon="mdi-close"
+                          size="xs"
+                          @click="unit.active = false"
+                        />
+                      </div>
+                    </div>
+                  </template>
+                </div>
+              </div>
             </div>
           </q-card-section>
 
@@ -122,7 +233,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";
@@ -144,10 +255,10 @@ const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } =
 
 const formRef = ref(null);
 const loading = ref(false);
-const currentTab = ref("dados");
+const currentTab = ref("informacoes");
 
 const tabs = [
-  { name: "dados", label: "Dados da Unidade" },
+  { name: "informacoes", label: "Informações" },
   { name: "unidades", label: "Unidades" },
 ];
 
@@ -164,6 +275,25 @@ const addMaterial = () => {
   form.value.materials.push({ type: null, value: null });
 };
 
+// Unidades tab state
+const unitSearch = ref("");
+
+const units = ref([
+  { id: 1, name: "Unidade 1", active: true },
+  { id: 2, name: "Unidade 2", active: true },
+  { id: 3, name: "Unidade 3", active: true },
+]);
+
+const filteredUnits = computed(() => {
+  const q = unitSearch.value.toLowerCase();
+  if (!q) return units.value;
+  return units.value.filter((u) => u.name.toLowerCase().includes(q));
+});
+
+const setAllVisible = (active) => {
+  units.value.forEach((u) => (u.active = active));
+};
+
 const onOKClick = () => {
   onDialogOK(form.value);
 };