14 search candidates

components/Layout/Toolbar.vue

@@ -5,6 +5,8 @@ const $q = useQuasar()
 
 const { loggedIn, session } = useAuth()
 
+const isCompanyOrAdmin = computed(() => session.value?.data?.role && session.value.data.role !== RoleEnum.candidate)
+
 async function onLogout() {
   $q.dialog({
     cancel: 'Não',
@@ -35,6 +37,9 @@ async function onLogout() {
       <div i-ph-list text-6 md:hidden @click="emit('toggle-drawer')" />
       <Logo cursor-pointer color2="primary-text" @click="navigateTo('/')" />
       <div flex="1" hidden gap-4 text-4 font-bold md:flex>
+        <layout-menu-link v-if="isCompanyOrAdmin" to="/candidatos">
+          Candidatos
+        </layout-menu-link>
         <layout-menu-link to="/vagas">
           Vagas
         </layout-menu-link>
@@ -122,7 +127,3 @@ async function onLogout() {
     </q-toolbar>
   </q-header>
 </template>
-
-<style lang="sass">
-
-</style>

components/LocationBadges.vue

@@ -0,0 +1,49 @@
+<script lang="ts" setup>
+const props = defineProps<{
+  locations?: { id: string, city: string | null, country: string, createAt: Date, state: string | null, updatedAt: Date }[]
+}>()
+
+const locationsMap = computed(() => props.locations?.length
+  ? props.locations?.map(
+    location => ({
+      label: [location.country, location.state, location.city].filter(Boolean).join(', '),
+      value: {
+        city: location.city ?? undefined,
+        country: location.country,
+        state: location.state ?? undefined,
+      },
+    }),
+  ).reduce(
+    (acc: {
+      label: string
+      value: {
+        city: string | undefined
+        country: string
+        state: string | undefined
+      }
+    }[], curr) => {
+      if (!curr?.label || acc.some(entry => entry.label === curr?.label))
+        return acc
+      acc.push(curr)
+      return acc
+    },
+    [],
+  )
+  : [])
+</script>
+
+<template>
+  <q-chip v-for="{ label, value } of locationsMap" :key="label" dense>
+    <q-img
+      v-if="value.country"
+      :src="`https://flagsapi.com/${value.country}/flat/64.png`"
+      size="16px"
+      mr-1
+    />
+    {{ label }}
+  </q-chip>
+</template>
+
+<style>
+
+</style>

components/OpeningCard.vue

@@ -71,7 +71,3 @@ defineProps<{ process: GetProcessesResponse['data'][0] }>()
     </div>
   </nuxt-link>
 </template>
-
-<style>
-
-</style>

db/users.ts

@@ -7,24 +7,16 @@ import { favorites } from './favorites'
 import { profiles } from './profiles'
 import { recommendations } from './recommendations'
 import { roleEnum } from './role'
-import { files } from './files'
 
 export const users = pgTable('users', {
-  // Relations
   companyId: uuid('company_id').references(() => companies.id),
   confirmedEmail: boolean('confirmed_email').notNull().default(false),
-  // Metadata
   createdAt: timestamp('created_at').notNull().defaultNow(),
   email: text('email').notNull().unique(),
-  // Data
   id: uuid('id').defaultRandom().primaryKey(),
-
-  // Flags
   invitePending: boolean('invite_pending').notNull().default(false),
   name: text('name').notNull(),
-
   password: text('password').notNull(),
-
   role: roleEnum('role').notNull(),
   updatedAt: timestamp('updated_at').notNull().defaultNow(),
 })

lib/prisma.ts

@@ -0,0 +1,15 @@
+import { PrismaClient } from '@prisma/client'
+
+const prismaClientSingleton = () => {
+  return new PrismaClient()
+}
+
+declare const globalThis: {
+  prismaGlobal: ReturnType<typeof prismaClientSingleton>;
+} & typeof global;
+
+const prisma = globalThis.prismaGlobal ?? prismaClientSingleton()
+
+export default prisma
+
+if (process.env.NODE_ENV !== 'production') globalThis.prismaGlobal = prisma

nuxt.config.ts

@@ -24,6 +24,8 @@ export default defineNuxtConfig({
     classSuffix: '',
   },
 
+  compatibilityDate: '2024-07-03',
+
   css: [
     '@unocss/reset/tailwind.css',
     'assets/main.sass',
@@ -70,6 +72,7 @@ export default defineNuxtConfig({
     dirs: [
       './db/**/*',
       './composables/**/*',
+      './stores/**/*',
     ],
   },
 
@@ -99,6 +102,7 @@ export default defineNuxtConfig({
         './db/**/*',
         './server/services/**/*',
         './server/utils/**/*',
+        './lib/*',
       ],
     },
     // prerender: {
@@ -158,6 +162,4 @@ export default defineNuxtConfig({
       crossOriginResourcePolicy: 'cross-origin',
     },
   },
-
-  compatibilityDate: '2024-07-03',
-})
+})

package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "private": true,
-  "packageManager": "pnpm@9.4.0",
+  "packageManager": "pnpm@9.5.0",
   "scripts": {
     "build": "nuxi build",
     "dev": "nuxi dev",
@@ -16,12 +16,10 @@
     "docs:build": "vitepress build docs",
     "docs:preview": "vitepress preview docs"
   },
-  "peerDependencies": {
-    "drizzle-orm": "^0.29.4"
-  },
   "dependencies": {
-    "@quasar/extras": "^1.16.11",
-    "drizzle-orm": "^0.31.2",
+    "@prisma/client": "^5.16.1",
+    "@quasar/extras": "^1.16.12",
+    "drizzle-orm": "^0.29.4",
     "firebase": "^10.12.3",
     "i18n-iso-countries": "^7.11.2",
     "postgres": "^3.4.4",
@@ -42,15 +40,15 @@
     "@pinia/nuxt": "^0.5.1",
     "@types/nodemailer": "^6.4.15",
     "@types/nodemailer-express-handlebars": "^4.0.5",
-    "@unocss/eslint-config": "^0.61.2",
-    "@unocss/eslint-plugin": "^0.61.2",
-    "@unocss/nuxt": "^0.61.2",
+    "@unocss/eslint-config": "^0.61.3",
+    "@unocss/eslint-plugin": "^0.61.3",
+    "@unocss/nuxt": "^0.61.3",
     "@vueuse/nuxt": "^10.11.0",
     "consola": "^3.2.3",
     "dayjs-nuxt": "^2.1.9",
     "drizzle-kit": "^0.22.8",
-    "eslint-plugin-format": "^0.1.2",
     "eslint": "npm:eslint-ts-patch@^8.57.0-0",
+    "eslint-plugin-format": "^0.1.2",
     "eslint-ts-patch": "^8.57.0-0",
     "nodemailer": "^6.9.14",
     "nodemailer-express-handlebars": "^6.1.2",
@@ -60,9 +58,10 @@
     "nuxt-security": "^1.4.3",
     "pg": "^8.12.0",
     "pinia": "^2.1.7",
+    "prisma": "^5.16.1",
     "sass": "^1.77.6",
     "typescript": "^5.5.3",
-    "vitepress": "^1.2.3",
+    "vitepress": "^1.3.0",
     "vue-tsc": "^2.0.26"
   }
 }

pages/candidatos.vue

@@ -0,0 +1,97 @@
+<script lang="ts" setup>
+import type { QTableProps } from 'quasar'
+
+const { session: user } = useAuth()
+
+if (!user.value?.data?.role || user.value.data.role === RoleEnum.candidate)
+  navigateTo('/')
+
+const { onRequest, pagination, updatePagination } = usePagination()
+
+type RowType = typeof candidatesRows.value[0]
+
+const search = ref<string>()
+
+const { data: candidates, status } = useFetch('/api/candidates', {
+  method: 'get',
+  query: {
+    page: computed(() => pagination.value.page ?? 1),
+    pageSize: computed(() => pagination.value.rowsPerPage ?? 20),
+    search,
+  },
+})
+
+const candidatesRows = computed(() => candidates.value?.data ?? [])
+
+const columns: QTableProps['columns'] = [
+  {
+    align: 'left',
+    field: (row: any) => row.user.name,
+    label: 'Nome',
+    name: 'name',
+    sortable: true,
+  },
+  {
+    align: 'left',
+    field: (row: RowType) => row.location,
+    label: 'Localização',
+    name: 'location',
+    sortable: true,
+  },
+]
+
+watch(candidates, () => updatePagination(candidates), { immediate: true })
+</script>
+
+<template>
+  <q-page
+    padding
+    flex="~ col items-center gap-4"
+    pt-12
+  >
+    <h2>Candidatos</h2>
+    <div flex="~">
+      <q-input
+        v-model="search"
+        placeholder="Pesquisar"
+        dense
+        outlined
+        clearable
+      />
+    </div>
+    <q-card
+      flat
+      max-w-4xl
+      w-full
+      b="1 primary solid rd-3"
+    >
+      <q-table
+        v-model:pagination="pagination"
+        :columns="columns"
+        :rows="candidatesRows"
+        :loading="status === 'pending'"
+        row-key="id"
+        binary-state-sort
+        w-full
+        @request="onRequest"
+      >
+        <template #body="props">
+          <q-tr :props="props">
+            <q-td key="name" :props="props">
+              {{ props.row.user.name }}
+            </q-td>
+
+            <q-td key="location" :props="props">
+              <template v-if="props.row.location">
+                <location-badges :locations="[props.row.location]" />
+              </template>
+              <template v-else>
+                Não definida
+              </template>
+            </q-td>
+          </q-tr>
+        </template>
+      </q-table>
+    </q-card>
+  </q-page>
+</template>

pages/empresas/[id].vue

@@ -26,38 +26,6 @@ const contractTypes = computed(() => company.value?.processesTypes?.length
     type => contractTypeOptions.find(op => op.value === type)?.label,
   )
   : undefined)
-
-const availableLocations = computed(() => company.value?.availableLocations?.length
-  ? company.value?.availableLocations.map(
-    location => ({
-      label: [
-        location.country,
-        location.state,
-        location.city,
-      ].filter(Boolean).join(', '),
-      value: {
-        city: location.city ?? undefined,
-        country: location.country,
-        state: location.state ?? undefined,
-      },
-    }),
-  ).reduce(
-    (acc: {
-      label: string
-      value: {
-        city: string | undefined
-        country: string
-        state: string | undefined
-      }
-    }[], curr) => {
-      if (!curr?.label || acc.some(entry => entry.label === curr?.label))
-        return acc
-      acc.push(curr)
-      return acc
-    },
-    [],
-  )
-  : undefined)
 </script>
 
 <template>
@@ -91,19 +59,11 @@ const availableLocations = computed(() => company.value?.availableLocations?.len
                 {{ t }}
               </q-chip>
             </div>
-            <div v-if="availableLocations" class="space-y-2">
+            <div v-if="company.availableLocations" class="space-y-2">
               <div class="text-primary font-600">
                 Locais de Contratação
               </div>
-              <q-chip v-for="{ label, value } of availableLocations" :key="label" dense>
-                <q-img
-                  v-if="value.country"
-                  :src="`https://flagsapi.com/${value.country}/flat/64.png`"
-                  size="16px"
-                  mr-1
-                />
-                {{ label }}
-              </q-chip>
+              <location-badges :locations="company.availableLocations" />
             </div>
             <div v-if="company.companySize" class="space-y-2">
               <div class="text-primary font-600">