feat: adiciona tab de financas

src/pages/unit/tabs/FinancialTab.vue

@@ -1,12 +1,16 @@
 <template>
   <div class="q-pa-md">
     <div class="row full-width q-col-gutter-md">
-      <div class="col-12">
-        <span class="text-subtitle1 text-weight-medium">Dados Bancários</span>
-      </div>
-
-      <div class="col-12 col-md-6">
+      <!-- Coluna esquerda -->
+      <div class="col-12 col-md-6 column q-gutter-md">
+        <!-- Dados Bancários -->
         <div class="row q-col-gutter-sm">
+          <div class="col-12">
+            <span class="text-subtitle1 text-weight-medium"
+              >Dados Bancários</span
+            >
+          </div>
+
           <DefaultSelect
             v-model="form.tax_regime"
             label="Regime Tributário"
@@ -27,14 +31,13 @@
           <DefaultInput
             v-model="form.agency"
             label="Agência"
-            class="col-6"
+            class="col-12"
             outlined
           />
-
           <DefaultInput
             v-model="form.account"
             label="Conta"
-            class="col-6"
+            class="col-12"
             outlined
           />
 
@@ -54,7 +57,6 @@
             class="col-12"
             outlined
           />
-
           <DefaultInput
             v-model="form.pix_key"
             label="Chave Pix"
@@ -62,6 +64,95 @@
             outlined
           />
         </div>
+
+        <!-- Dados para Faturamento -->
+        <div class="row q-col-gutter-sm">
+          <div class="col-12">
+            <span class="text-subtitle1 text-weight-medium"
+              >Dados para Faturamento</span
+            >
+          </div>
+
+          <DefaultSelect
+            v-model="form.billing_method"
+            label="Forma de Cobrança"
+            :options="billingMethodOptions"
+            class="col-12"
+            outlined
+            emit-value
+            map-options
+          />
+
+          <DefaultInput
+            v-model="form.due_date"
+            label="Data de Vencimento"
+            class="col-12"
+            outlined
+          />
+          <DefaultInput
+            v-model="form.financial_email"
+            label="E-mail Financeiro"
+            class="col-12"
+            outlined
+          />
+        </div>
+      </div>
+
+      <!-- Coluna direita -->
+      <div class="col-12 col-md-6 column q-gutter-md">
+        <!-- Dados do Contrato -->
+        <div class="row q-col-gutter-sm">
+          <div class="col-12">
+            <span class="text-subtitle1 text-weight-medium"
+              >Dados do Contrato</span
+            >
+          </div>
+
+          <DefaultSelect
+            v-model="form.group"
+            label="Grupo"
+            :options="groupOptions"
+            class="col-12"
+            outlined
+            emit-value
+            map-options
+          />
+
+          <DefaultInput
+            v-model="form.maintenance_fee"
+            label="Taxa de Manutenção"
+            class="col-12"
+            outlined
+          />
+          <DefaultInput
+            v-model="form.marketing_fund"
+            label="Fundo de Marketing"
+            class="col-12"
+            outlined
+          />
+          <DefaultInput
+            v-model="form.tbr"
+            label="TBR"
+            class="col-12"
+            outlined
+          />
+        </div>
+
+        <div class="row q-col-gutter-sm">
+          <div class="col-12">
+            <span class="text-subtitle1 text-weight-medium"
+              >Dados de Contato</span
+            >
+          </div>
+
+          <div
+            v-for="(partner, index) in contactPartners"
+            :key="index"
+            class="col-6"
+          >
+            <PartnerCardComponent :partner />
+          </div>
+        </div>
       </div>
     </div>
 
@@ -80,8 +171,10 @@
 </template>
 
 <script setup>
+import { ref } from "vue";
 import DefaultInput from "src/components/defaults/DefaultInput.vue";
 import DefaultSelect from "src/components/defaults/DefaultSelect.vue";
+import PartnerCardComponent from "src/components/shared/PartnerCardComponent.vue";
 import { useFormUpdateTracker } from "src/composables/useFormUpdateTracker";
 
 const taxRegimeOptions = [
@@ -98,6 +191,21 @@ const accountTypeOptions = [
   { label: "Conta Poupança", value: "poupanca" },
 ];
 
+const billingMethodOptions = [
+  { label: "Selecione", value: null },
+  { label: "Boleto", value: "boleto" },
+  { label: "Débito Automático", value: "debit" },
+  { label: "PIX", value: "pix" },
+  { label: "Cartão de Crédito", value: "credit_card" },
+];
+
+const groupOptions = [{ label: "Selecione", value: null }];
+
+const contactPartners = ref([
+  { social_name: null, role: null, avatarUrl: null, color: "#ff8340" },
+  { social_name: null, role: null, avatarUrl: null, color: "#4caf50" },
+]);
+
 const { form } = useFormUpdateTracker({
   tax_regime: null,
   bank: null,
@@ -106,5 +214,12 @@ const { form } = useFormUpdateTracker({
   account_type: null,
   account_holder: null,
   pix_key: null,
+  billing_method: null,
+  due_date: null,
+  financial_email: null,
+  group: null,
+  maintenance_fee: null,
+  marketing_fund: null,
+  tbr: null,
 });
 </script>