feat: adiciona conteudo em tab de configuracoes

src/api/tbr.js

@@ -0,0 +1,16 @@
+import api from "src/api";
+
+export const getRoyaltiesBaseBrackets = async () => {
+  const { data } = await api.get("/royalties-base-bracket");
+  return data.payload;
+};
+
+export const getFnmBaseBrackets = async () => {
+  const { data } = await api.get("/fnm-base-bracket");
+  return data.payload;
+};
+
+export const getMaintenanceBaseBrackets = async () => {
+  const { data } = await api.get("/maintenance-base-bracket");
+  return data.payload;
+};

src/pages/tbr/tabs/SettingsTab.vue

@@ -1,8 +1,73 @@
 <script setup>
+import { ref, onMounted } from "vue";
+import DefaultInput from "src/components/defaults/DefaultInput.vue";
+import {
+  getRoyaltiesBaseBrackets,
+  getFnmBaseBrackets,
+  getMaintenanceBaseBrackets,
+} from "src/api/tbr";
+
+const royaltiesBrackets = ref([]);
+const fnmBrackets = ref([]);
+const maintenanceBrackets = ref([]);
+
+function bracketRangeLabel(bracket) {
+  return `Meses ${bracket.start_month} a ${bracket.end_month}`;
+}
+
+onMounted(async () => {
+  const [royalties, fnm, maintenance] = await Promise.all([
+    getRoyaltiesBaseBrackets(),
+    getFnmBaseBrackets(),
+    getMaintenanceBaseBrackets(),
+  ]);
+
+  royaltiesBrackets.value = royalties;
+  fnmBrackets.value = fnm;
+  maintenanceBrackets.value = maintenance;
+});
 </script>
 
 <template>
-  <div>
-    <h6>Configurações</h6>
+  <div class="q-pa-sm">
+    <p class="text-subtitle2 q-mb-md">Definir Faixa (Mês de Contrato)</p>
+
+    <div
+      v-for="(royalties, index) in royaltiesBrackets"
+      :key="royalties.id"
+      class="row q-col-gutter-md q-mb-sm"
+    >
+      <div class="col-12 col-md-3">
+        <DefaultInput
+          :model-value="bracketRangeLabel(royalties)"
+          label="Faixa (mês de contrato)"
+          readonly
+        />
+      </div>
+
+      <div class="col-12 col-md-3">
+        <DefaultInput
+          :model-value="royalties.description"
+          label="Royalties"
+          readonly
+        />
+      </div>
+
+      <div class="col-12 col-md-3">
+        <DefaultInput
+          :model-value="fnmBrackets[index]?.description"
+          label="FNM"
+          readonly
+        />
+      </div>
+
+      <div class="col-12 col-md-3">
+        <DefaultInput
+          :model-value="maintenanceBrackets[index]?.description"
+          label="Taxa de Manutenção"
+          readonly
+        />
+      </div>
+    </div>
   </div>
 </template>