@finema/finework-layer 0.0.12 → 0.0.13

package/app/composables/useAuth.ts

@@ -0,0 +1,189 @@
+export enum Permission {
+  USER = 'USER',
+  ADMIN = 'ADMIN',
+  SUPER = 'SUPER',
+  NONE = 'NONE',
+}
+
+export const PERMISSION_LABEL = {
+  [Permission.ADMIN]: 'Admin',
+  [Permission.USER]: 'User',
+  [Permission.SUPER]: 'Super Admin',
+  [Permission.NONE]: 'No Access',
+}
+
+export interface ITeam {
+  id: string
+  name: string
+  code: string
+  color: string
+  description?: string
+  working_start_at: string
+  working_end_at: string
+  users: IUser[] | null
+  created_at: string
+  updated_at: string
+}
+
+export interface IUser {
+  id: string
+  email: string
+  full_name: string
+  display_name: string
+  position: string
+  team: ITeam
+  team_code: string
+  avatar_url: string
+  company: string
+  access_level: IUserAccessLevel
+  is_active: boolean
+  joined_date: string
+  slack_id: string
+  created_at: string
+  updated_at: string
+}
+
+export enum UserModule {
+  CHECKIN = 'clockin',
+  PMO = 'pmo',
+  TIMESHEET = 'timesheet',
+  SETTING = 'setting',
+}
+
+export interface IUserAccessLevel {
+  used_id: string
+  pmo: Permission.USER | Permission.ADMIN | Permission.SUPER
+  clockin: Permission.USER | Permission.ADMIN
+  timesheet: Permission.USER | Permission.ADMIN
+  setting: Permission.USER | Permission.SUPER
+}
+
+export const useAuth = () => {
+  const {
+    auth,
+  } = useRequestOptions()
+
+  const token = useCookie('token', {
+    path: '/',
+    maxAge: 60 * 60 * 24 * 365,
+  })
+
+  const isAuthenticated = computed(() => !!token.value)
+  const me = defineStore('auth.me', () => {
+    const value = ref<IUser | null>(null)
+
+    const set = (user: IUser | null) => {
+      value.value = user
+    }
+
+    return {
+      value,
+      set,
+    }
+  })()
+
+  const fetchMe = (() => {
+    return useObjectLoader<IUser>({
+      method: 'GET',
+      url: '/me',
+      getRequestOptions: auth,
+    })
+  })()
+
+  const updateMe = (() => {
+    return useObjectLoader<IUser>({
+      method: 'PUT',
+      url: '/me',
+      getRequestOptions: auth,
+    })
+  })()
+
+  const loginSlack = async () => {
+    const config = useRuntimeConfig()
+
+    window.location.href = config.public.baseAPI + '/auth/slack-login'
+  }
+
+  const loginMs = async () => {
+    const config = useRuntimeConfig()
+
+    window.location.href = config.public.baseAPI + '/auth/ms-login'
+  }
+
+  useWatchTrue(() => fetchMe.status.value.isSuccess, () => {
+    me.set(fetchMe.data.value)
+  })
+
+  useWatchTrue(() => fetchMe.status.value.isError, () => {
+    token.value = undefined
+    me.set(null)
+  })
+
+  const hasPermission = (module: UserModule, ...permission: Permission[]) => {
+    if (!me.value?.access_level) {
+      return false
+    }
+
+    return permission.includes(me.value.access_level[module])
+  }
+
+  const isSuperAdmin = computed(() => {
+    return me.value?.access_level?.setting === Permission.SUPER
+  })
+
+  const menusNavbar = computed(() => [
+    {
+      label: 'Clock-In',
+      icon: '/admin/clock-in-logo.png',
+      to: routes.clockin.home.to,
+    },
+    {
+      label: 'Timesheet',
+      icon: '/admin/timesheet-logo.png',
+      to: routes.timesheet.home.to,
+    },
+    ...(hasPermission(UserModule.PMO, Permission.ADMIN, Permission.USER, Permission.SUPER)
+      ? [{
+        label: 'PMO',
+        icon: '/admin/pmo-logo.png',
+        to: routes.pmo.project.projects.to,
+      }]
+      : []),
+    ...(hasPermission(UserModule.CHECKIN, Permission.ADMIN)
+      ? [{
+        label: 'Clock-In Admin',
+        icon: '/admin/clock-in-admin-logo.png',
+        to: routes.adminClockin.checkinDashboard.to,
+      }]
+      : []),
+    ...(hasPermission(UserModule.TIMESHEET, Permission.ADMIN)
+      ? [{
+        label: 'Timesheet Admin',
+        icon: '/admin/timesheet-admin-logo.png',
+        to: routes.adminTimesheet.summaryReport.to,
+      }]
+      : []),
+
+    ...(hasPermission(UserModule.SETTING, Permission.SUPER)
+      ? [{
+        label: 'Super Admin',
+        icon: '/admin/super-admin-logo.png',
+        to: routes.admin.users.to,
+      }]
+      : []),
+  ])
+
+  return {
+    token,
+    loginSlack,
+    loginMs,
+    isAuthenticated,
+    me,
+    fetchMe,
+    updateMe,
+    hasPermission,
+    isSuperAdmin,
+    menusNavbar,
+
+  }
+}

package/app/composables/useRequestOptions.ts

@@ -0,0 +1,50 @@
+import type { AxiosRequestConfig } from 'axios'
+
+export const useRequestOptions = () => {
+  const config = useRuntimeConfig()
+
+  const mock = (): Omit<AxiosRequestConfig, 'baseURL'> & {
+    baseURL: string
+  } => {
+    return {
+      baseURL: config.public.baseAPIMock || 'http://localhost:3000/api/mock',
+    }
+  }
+
+  const base = (): Omit<AxiosRequestConfig, 'baseURL'> & {
+    baseURL: string
+  } => {
+    return {
+      baseURL: config.public.baseAPI,
+    }
+  }
+
+  const auth = (): Omit<AxiosRequestConfig, 'baseURL'> & {
+    baseURL: string
+  } => {
+    return {
+      baseURL: config.public.baseAPI,
+      headers: {
+        Authorization: `Bearer ${useAuth().token.value}`,
+      },
+    }
+  }
+
+  const file = (): Omit<AxiosRequestConfig, 'baseURL'> & {
+    baseURL: string
+  } => {
+    return {
+      baseURL: config.public.baseAPI + '/uploads',
+      headers: {
+        Authorization: `Bearer ${useAuth().token.value}`,
+      },
+    }
+  }
+
+  return {
+    base,
+    mock,
+    auth,
+    file,
+  }
+}

package/app/constants/routes.ts

@@ -0,0 +1,86 @@
+export const routes = {
+  home: {
+    label: 'หน้าแรก',
+    to: '/',
+  },
+  chooseTeam: {
+    label: 'เลือกทีม',
+    to: '/choose-team',
+  },
+  login: {
+    label: 'เลือก',
+    to: '/login',
+  },
+  logout: {
+    label: 'Log out',
+    to: '/api/auth/logout',
+  },
+  releaseHistory: {
+    label: 'Release History',
+    to: '/releases',
+    icon: 'heroicons:tag',
+  },
+  account: {
+    profile: {
+      label: 'โปรไฟล์',
+      to: '/account/profile',
+      icon: 'mage:user',
+    },
+  },
+
+  announcements: {
+    label: 'Finema Newsletter',
+    to: '/announcements',
+    icon: 'mage:announcement',
+  },
+
+  adminClockin: {
+    checkinDashboard: {
+      label: 'ภาพรวมเช็คอิน',
+      icon: 'mage:dashboard',
+      to: '/clockin-admin',
+      permissions: ['clockin:ADMIN'],
+    },
+  },
+  adminTimesheet: {
+    summaryReport: {
+      label: 'ภาพรวม',
+      icon: 'heroicons-outline:user-group',
+      to: '/timesheet-admin/reports/summary',
+      permissions: ['timesheet:ADMIN'],
+    },
+  },
+  admin: {
+    users: {
+      label: 'จัดการผู้ใช้งาน',
+      icon: 'hugeicons:user-circle-02',
+      to: '/admin/users',
+      permissions: ['setting:SUPER'],
+    },
+  },
+  clockin: {
+    home: {
+      label: 'Clock-In',
+      icon: 'i-heroicons-outline:location-marker',
+      to: '/clockin',
+    },
+  },
+  timesheet: {
+    home: {
+      label: 'Timesheet',
+      icon: 'mage:dashboard',
+      to: '/timesheet',
+    },
+  },
+  pmo: {
+    project: {
+      projects: {
+        label: 'โครงการของฉัน',
+        to: '/pmo/projects',
+        icon: 'lucide:layers',
+        permissions: ['pmo:USER', 'pmo:ADMIN', 'pmo:SUPER'],
+      },
+    },
+  },
+
+} as const