feat: adiciona layout para adicionar usuarios para a unidade

src/api/user.js

@@ -10,6 +10,11 @@ export const getUsers = async () => {
   return data.payload;
 };
 
+export const getUsersByUnit = async () => {
+  const { data } = await api.get("/user/unit");
+  return data.payload;
+};
+
 export const createUser = async (user) => {
   const { data } = await api.post("/user", user);
   return data.payload;

src/pages/users/UsersPage.vue

@@ -1,68 +1,25 @@
 <template>
   <div>
-    <DefaultHeaderPage title="Usuários" show-filter-icon />
-
-    <div class="row q-col-gutter-x-md q-pa-sm">
-      <q-select
-        v-model="funcaoSelected"
-        label="Selecione a Função"
-        class="col-3"
-        color="secondary"
-        emit-value
-        map-options
-        :options="funcaoOptions"
-      />
-
-      <q-select
-        v-model="unitSelected"
-        label="Selecione a Unidade"
-        class="col-3"
-        color="secondary"
-        emit-value
-        map-options
-        :options="unitOptions"
-      />
-    </div>
+    <DefaultHeaderPage title="Usuários" />
 
     <div class="q-px-sm">
       <DefaultTable
-        v-model:rows="rows"
         title="Lista de Usuários"
-        :columns
-        descricao="Usuários"
-        no-api-call
-        add-item
-        add-item-route="UserAddPage"
+        :columns="columns"
+        :api-call="getUsersByUnit"
+        descricao="usuários"
+        :feminino="false"
       >
-        <template #body-cell-status="{ row }">
+        <template #body-cell-actions="{ row }">
           <q-td align="center">
-            <q-badge
-              :color="row.status === 'active' ? 'positive' : 'warning'"
-              :label="row.status === 'active' ? 'Ativo' : 'Inativo'"
+            <q-btn
+              outline
+              icon="mdi-account-edit-outline"
+              style="width: 36px"
+              @click.prevent.stop="onEdit(row)"
             />
           </q-td>
         </template>
-
-        <template #body-cell-actions>
-          <q-td auto-width>
-            <q-item-section class="no-wrap" style="flex-direction: row">
-              <q-btn
-                outline
-                icon="mdi-account-edit-outline"
-                style="width: 36px"
-                class="q-mr-sm"
-                @click.prevent.stop="() => {}"
-              />
-              <q-btn
-                outline
-                icon="mdi-trash-can-outline"
-                style="width: 36px"
-                class="q-mr-sm"
-                @click.prevent.stop="() => {}"
-              />
-            </q-item-section>
-          </q-td>
-        </template>
       </DefaultTable>
     </div>
   </div>
@@ -71,115 +28,45 @@
 <script setup>
 import DefaultHeaderPage from "src/components/layout/DefaultHeaderPage.vue";
 import DefaultTable from "src/components/defaults/DefaultTable.vue";
-import { ref } from "vue";
+import { getUsersByUnit } from "src/api/user";
 
-const funcaoSelected = ref(null);
-const unitSelected = ref(null);
+import { useRouter } from "vue-router";
+import { formatDateYMDtoDMY } from "src/helpers/utils";
 
-const funcaoOptions = ref([
-  { label: "Todas", value: null },
-  { label: "Neurotainer", value: "neurotainer" },
-  { label: "Assessor", value: "assessor" },
-  { label: "Marketing", value: "marketing" },
-  { label: "Comercial", value: "comercial" },
-  { label: "Gestor", value: "gestor" },
-  { label: "Administrativo", value: "administrativo" },
-  { label: "Recepção", value: "recepcao" },
-]);
+const router = useRouter();
 
-const unitOptions = ref([
-  { label: "Todas", value: null },
-  { label: "Toledo-PR", value: "toledo" },
-  { label: "Arapongas-PR", value: "arapongas" },
-  { label: "Curitiba-PR", value: "curitiba" },
-  { label: "Londrina-PR", value: "londrina" },
-  { label: "Ponta Grossa-PR", value: "ponta_grossa" },
-  { label: "Maringá-PR", value: "maringa" },
-  { label: "Cascavel-PR", value: "cascavel" },
-]);
-
-const columns = ref([
+const columns = [
   {
     name: "name",
     label: "Nome",
     field: "name",
     align: "left",
+    sortable: true,
   },
   {
-    name: "unit",
-    label: "Unidade",
-    field: "unit",
+    name: "type",
+    label: "Tipo de Usuário",
+    field: (row) => row.user_type_label ?? "-",
     align: "left",
+    sortable: true,
   },
   {
-    name: "role",
-    label: "Função",
-    field: "role",
+    name: "created_at",
+    label: "Data de Cadastro",
+    field: (row) => formatDateYMDtoDMY(row.created_at),
     align: "left",
-  },
-  {
-    name: "status",
-    label: "Status",
-    field: "status",
-    align: "center",
+    sortable: true,
   },
   {
     name: "actions",
     label: "Ações",
     field: null,
     align: "center",
+    required: true,
   },
-]);
+];
 
-const rows = ref([
-  {
-    id: 1,
-    name: "Heloisa Faria",
-    unit: "Toledo-PR",
-    role: "Neurotainer",
-    status: "inactive",
-  },
-  {
-    id: 2,
-    name: "Carol",
-    unit: "Arapongas-PR",
-    role: "Assessor",
-    status: "active",
-  },
-  {
-    id: 3,
-    name: "Marcelo Souza",
-    unit: "Curitiba-PR",
-    role: "Marketing",
-    status: "active",
-  },
-  {
-    id: 4,
-    name: "Ana Lúcia",
-    unit: "Londrina-PR",
-    role: "Comercial",
-    status: "active",
-  },
-  {
-    id: 5,
-    name: "Ricardo Silva",
-    unit: "Ponta Grossa-PR",
-    role: "Gestor",
-    status: "active",
-  },
-  {
-    id: 6,
-    name: "Juliana Civita",
-    unit: "Maringá-PR",
-    role: "Administrativo",
-    status: "active",
-  },
-  {
-    id: 7,
-    name: "Fernando Almeida",
-    unit: "Cascavel-PR",
-    role: "Recepção",
-    status: "active",
-  },
-]);
+const onEdit = (row) => {
+  router.push({ name: "UserEditPage", params: { id: row.id } });
+};
 </script>

src/router/routes/config.route.js

@@ -111,7 +111,6 @@ export default [
         translate: false,
       },
       requireAuth: true,
-      requiredPermission: "config.user",
       breadcrumbs: [
         {
           name: "UsersPage",
@@ -138,7 +137,6 @@ export default [
         translate: true,
       },
       requireAuth: true,
-      requiredPermission: "config.user",
       breadcrumbs: [
         {
           name: "UsersPage",

src/stores/navigation.js

@@ -36,14 +36,14 @@ export const navigationStore = defineStore("navigation", () => {
       disable: false,
       permission: true,
     },
-    // {
-    //   type: "single",
-    //   title: "Usuários",
-    //   name: "UsersPage",
-    //   icon: "mdi-account-multiple-outline",
-    //   disable: false,
-    //   permission: true,
-    // },
+    {
+      type: "single",
+      title: "Usuários",
+      name: "UsersPage",
+      icon: "mdi-account-multiple-outline",
+      disable: false,
+      permission: true,
+    },
     {
       type: "single",
       title: "Dados da Unidade",