feat(users): adiciona tela de cadastro de usuarios

src/pages/users/UserActionPage.vue

@@ -0,0 +1,170 @@
+<template>
+  <div>
+    <DefaultHeaderPage title="Cadastro de Usuário" />
+
+    <div class="q-pa-md">
+      <div class="column justify-center items-center q-mb-lg">
+        <AvatarImageComponent @update:file="onAvatarChange" />
+
+        <div class="row full-width q-mt-md q-col-gutter-sm">
+          <DefaultSelect
+            v-model="form.state"
+            label="Estado / UF"
+            class="col-6"
+            outlined
+            emit-value
+            map-options
+            :options="stateOptions"
+          />
+
+          <DefaultSelect
+            v-model="form.unit"
+            label="Unidade"
+            class="col-6"
+            outlined
+            emit-value
+            map-options
+            :options="unitOptions"
+          />
+
+          <DefaultSelect
+            v-model="form.role"
+            label="Tipo de Usuário"
+            class="col-6"
+            outlined
+            emit-value
+            map-options
+            :options="roleOptions"
+          />
+
+          <DefaultInput
+            v-model="form.cpf"
+            label="CPF"
+            class="col-6"
+            outlined
+          />
+
+          <DefaultInput
+            v-model="form.name"
+            label="Nome"
+            class="col-6"
+            outlined
+          />
+
+          <DefaultInput
+            v-model="form.password"
+            label="Senha"
+            class="col-6"
+            outlined
+            type="password"
+          />
+
+          <DefaultInput
+            v-model="form.surname"
+            label="Sobrenome"
+            class="col-6"
+            outlined
+          />
+
+          <DefaultInput
+            v-model="form.password_confirmation"
+            label="Repetir Senha"
+            class="col-6"
+            outlined
+            type="password"
+          />
+
+          <DefaultInput
+            v-model="form.email"
+            label="E-mail"
+            class="col-6"
+            outlined
+            type="email"
+          />
+
+          <div class="col-6 flex items-center">
+            <q-btn
+              label="Gerar senha segura"
+              icon="mdi-thumb-up-outline"
+              color="primary"
+              @click="generatePassword"
+            />
+          </div>
+        </div>
+
+        <div class="row justify-end q-mt-md full-width">
+          <q-btn
+            label="SALVAR"
+            icon-right="mdi-check"
+            color="primary"
+            @click="onSave"
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import DefaultHeaderPage from "src/components/layout/DefaultHeaderPage.vue";
+import DefaultInput from "src/components/defaults/DefaultInput.vue";
+import DefaultSelect from "src/components/defaults/DefaultSelect.vue";
+import AvatarImageComponent from "src/components/shared/AvatarImageComponent.vue";
+import { ref } from "vue";
+
+const form = ref({
+  state: null,
+  unit: null,
+  role: null,
+  cpf: null,
+  name: null,
+  surname: null,
+  email: null,
+  password: null,
+  password_confirmation: null,
+});
+
+const stateOptions = ref([
+  { label: "Paraná", value: "PR" },
+  { label: "São Paulo", value: "SP" },
+  { label: "Santa Catarina", value: "SC" },
+]);
+
+const unitOptions = ref([
+  { 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 roleOptions = ref([
+  { 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" },
+]);
+
+function onAvatarChange(file) {
+  console.log("Avatar file selected:", file);
+}
+
+function generatePassword() {
+  const chars =
+    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%";
+  const password = Array.from({ length: 12 }, () =>
+    chars.charAt(Math.floor(Math.random() * chars.length)),
+  ).join("");
+  form.value.password = password;
+  form.value.password_confirmation = password;
+}
+
+function onSave() {
+  console.log("Saving user:", form.value);
+}
+</script>

src/pages/users/UserPage.vue

@@ -32,6 +32,7 @@
         descricao="Usuários"
         no-api-call
         add-item
+        add-item-route="UserAddPage"
       >
         <template #body-cell-status="{ row }">
           <q-td align="center">

src/router/routes/user.route.js

@@ -1,4 +1,27 @@
 export default [
+  {
+    path: "/users/create",
+    name: "UserAddPage",
+    component: () => import("pages/users/UserActionPage.vue"),
+    meta: {
+      title: {
+        value: "Cadastro de Usuário",
+        translate: false,
+      },
+      requireAuth: true,
+      requiredPermission: "config.city",
+      breadcrumbs: [
+        {
+          name: "UserPage",
+          title: "Usuários",
+        },
+        {
+          name: "UserAddPage",
+          title: "Cadastro de Usuário",
+        },
+      ],
+    },
+  },
   {
     path: "/users",
     name: "UserPage",