Skip to content

Commit

Permalink
Added basic auth logic for leed scanning
Browse files Browse the repository at this point in the history
  • Loading branch information
Sak1012 committed Sep 9, 2024
1 parent 67ee3dd commit ed47b8c
Show file tree
Hide file tree
Showing 9 changed files with 213 additions and 25 deletions.
8 changes: 4 additions & 4 deletions src/components/Common/QRCamera.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { useCameraStore } from '@/stores/camera'
import { useProcessRegistrationStore } from '@/stores/processRegistration'
import { useProcessCheckInStore } from '@/stores/processCheckIn'
import { useProcessDeviceStore } from '@/stores/processDevice'
import { useProcessEventyayCheckInStore } from '@/stores/processEventyayCheckIn'
const props = defineProps({
qrType: {
Expand All @@ -25,7 +26,7 @@ const cameraStore = useCameraStore()
const processRegistrationStore = useProcessRegistrationStore()
const processCheckInStore = useProcessCheckInStore()
const processDeviceStore = useProcessDeviceStore()
const processEventyayCheckIn = useProcessEventyayCheckInStore()
const route = useRoute()
const stationId = route.params.stationId
const scannerType = route.params.scannerType
Expand All @@ -40,11 +41,10 @@ async function processQR() {
await processCheckInStore.checkInAttendeeScannerToRoom(stationId, scannerType)
}
if (props.qrType === 'device') {
await processDeviceStore.authDevice(cameraStore.qrCodeValue)
await processDeviceStore.authDevice()
}
if (props.qrType === 'eventyaycheckin') {
console.log(cameraStore.qrCodeValue)
console.log('Check-in')
await processEventyayCheckIn.checkIn()
}
cameraStore.paused = false
}
Expand Down
23 changes: 16 additions & 7 deletions src/components/Eventyay/EventyayEventSelection.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,18 +10,27 @@ const router = useRouter()
function checkIn() {
router.push({ name: 'eventyayevents' })
}
function leadscan() {
router.push({ name: 'eventyayleedlogin' })
}
</script>

<template>
<div
class="-mt-16 grid h-screen w-full grid-cols-1 place-items-center items-center justify-center align-middle"
>
<StandardButton :text="'Lead Scanning'" class="btn-primary mt-6 w-full justify-center" />
<p class="text-xl">OR</p>
<StandardButton
:text="'Check-In'"
class="btn-primary mt-6 w-full justify-center"
@click="checkIn()"
/>
<div class="flex h-1/4 w-1/2 flex-col items-center justify-around">
<StandardButton
:text="'Lead Scanning'"
class="btn-primary h-14 w-full justify-center"
@click="leadscan()"
/>
<p class="text-xl">OR</p>
<StandardButton
:text="'Check-In'"
class="btn-primary h-14 w-full justify-center"
@click="checkIn()"
/>
</div>
</div>
</template>
15 changes: 12 additions & 3 deletions src/components/Eventyay/EventyayEvents.vue
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,18 @@ watchEffect(() => {
})
const submitForm = () => {
if (localStorage.getItem('selectedEventSlug') || localStorage.getItem('selectedEventName')) {
localStorage.removeItem('selectedEventSlug')
localStorage.removeItem('selectedEventName')
}
if (selectedEvent.value) {
localStorage.setItem('selectedEvent', selectedEvent.value)
router.push({ name: 'eventyaycheckin' })
const selectedEventData = events.find((event) => event.slug === selectedEvent.value)
if (selectedEventData) {
localStorage.setItem('selectedEventSlug', selectedEventData.slug)
localStorage.setItem('selectedEventName', selectedEventData.name.en)
router.push({ name: 'eventyaycheckin' })
}
} else {
console.error('Please select an event.')
}
Expand Down Expand Up @@ -57,7 +66,7 @@ const submitForm = () => {
No events available
<StandardButton
:text="'Refresh'"
class="btn-primary mt-6 w-full justify-center"
class="btn-primary mt-6 w-1/2 justify-center"
@click="fetchEvents(url.value, apiToken.value, organiser.value)"
/>
</div>
Expand Down
82 changes: 82 additions & 0 deletions src/components/Eventyay/EventyayLeedLogin.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
<script setup>
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useLoadingStore } from '@/stores/loading'
import { useAuthStore } from '@/stores/auth'
import { useUserStore } from '@/stores/user'
import { useleedauth } from '@/stores/leedauth'
import StandardButton from '@/components/Common/StandardButton.vue'
const loadingStore = useLoadingStore()
const authStore = useAuthStore()
const userStore = useUserStore()
const leedauth = useleedauth()
const showError = ref(false)
const userId = ref('')
const password = ref('')
const server = ref('')
// router
const router = useRouter()
async function submitLogin() {
const payload = {
email: email.value,
key: password.value
}
console.log(payload)
console.log(JSON.stringify(payload))
const response = await leedauth.leedlogin(payload)
console.log(response)
}
loadingStore.contentLoaded()
</script>

<template>
<div class="-mt-16 flex h-screen flex-col justify-center">
<div class="my-auto sm:mx-auto sm:w-full sm:max-w-sm">
<h2 class="text-center">Sign in with your credentials</h2>
<form class="mt-10 space-y-3" @submit.prevent="submitLogin">
<div>
<label for="email">User ID</label>
<div class="mt-2">
<input
id="email"
v-model="email"
name="email"
type="email"
required="true"
class="block w-full"
/>
</div>
</div>

<div>
<label for="password">Password</label>
<div class="mt-2">
<input
id="password"
v-model="password"
name="password"
type="password"
autocomplete="current-password"
required="true"
class="block w-full"
/>
</div>
</div>

<div>
<StandardButton
:type="'submit'"
:text="'Login'"
class="btn-primary mt-6 w-full justify-center"
/>
</div>

<div v-if="showError">
<p class="text-sm text-danger">Wrong credentials or account does not exist</p>
</div>
</form>
</div>
</div>
</template>
8 changes: 0 additions & 8 deletions src/components/Registration/Device/Device.vue
Original file line number Diff line number Diff line change
Expand Up @@ -29,13 +29,5 @@ async function registerDevice() {
<div v-if="showError">
<p class="text-sm text-danger">Oops! something went wrong</p>
</div>
<div>
<input type="text" id="auth_token" placeholder="Device Key" class="input" />
<StandardButton
:text="'Register Device'"
class="btn-primary mt-6 w-full justify-center"
@click="registerDevice()"
/>
</div>
</div>
</template>
6 changes: 6 additions & 0 deletions src/router/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import CheckInStats from '@/components/CheckIn/CheckInStats.vue'
import EventyayEventCheckIn from '@/components/Eventyay/EventyayEventCheckIn.vue'
import EventyayEvents from '@/components/Eventyay/EventyayEvents.vue'
import EventyayEventSelection from '@/components/Eventyay/EventyayEventSelection.vue'
import EventyayLeedLogin from '@/components/Eventyay/EventyayLeedLogin.vue'
import Device from '@/components/Registration/Device/Device.vue'
import RegistrationKiosk from '@/components/Registration/Kiosk/KioskOverview.vue'
import RegistrationStats from '@/components/Registration/Station/RegistrationStats.vue'
Expand Down Expand Up @@ -44,6 +45,11 @@ const router = createRouter({
name: 'eventyayselect',
component: EventyayEventSelection
},
{
path: '/eventyayleedlogin',
name: 'eventyayleedlogin',
component: EventyayLeedLogin
},
{
path: '/panel',
name: 'auth',
Expand Down
29 changes: 29 additions & 0 deletions src/stores/leedauth.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import { mande } from 'mande'
import { defineStore } from 'pinia'

export const useleedauth = defineStore('leedauth', () => {
async function leedlogin(payload) {
try {
console.log('leedlogin')
const url = localStorage.getItem('url')
const organizer = localStorage.getItem('organizer')
const slug = localStorage.getItem('selectedEventSlug')
const apiToken = localStorage.getItem('api_token')
console.log(url, organizer, slug, apiToken, payload)
const headers = {
Authorization: `Device ${apiToken}`,
Accept: 'application/json'
}
const api = mande(url, { headers: headers })
const response = await api.post(`/api/v1/event/${organizer}/${slug}/exhibitors/auth`, payload)
console.log('here', response)
return response
} catch (error) {
console.log(error)
console.log('error')
return 'wt'
}
}

return { leedlogin }
})
6 changes: 3 additions & 3 deletions src/stores/processDevice.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,9 +41,9 @@ export const useProcessDeviceStore = defineStore('processDevice', () => {
showError.value = false
}

async function authDevice(val) {
async function authDevice() {
try {
const qrData = JSON.parse(val)
const qrData = JSON.parse(cameraStore.qrCodeValue)
if (qrData.handshake_version > 1) {
message.value = 'Unsupported handshake version'
showErrorMsg()
Expand All @@ -60,7 +60,7 @@ export const useProcessDeviceStore = defineStore('processDevice', () => {
software_version: 'x.x'
}
let url = qrData.url
const port = import.meta.env.VITE_LOCAL_PORT || 3000
const port = import.meta.env.VITE_LOCAL_PORT || 8000
if (url.includes('localhost')) {
url = `${url}:${port}` // Add your desired port number here
}
Expand Down
61 changes: 61 additions & 0 deletions src/stores/processEventyayCheckIn.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
import { useCameraStore } from '@/stores/camera'
import { defineStore } from 'pinia'
import { computed, ref } from 'vue'

export const useProcessEventyayCheckInStore = defineStore('processEventyayCheckIn', () => {
const cameraStore = useCameraStore()
const message = ref('')
const showSuccess = ref(false)
const showError = ref(false)
function $reset() {
message.value = ''
showSuccess.value = false
showError.value = false
}

const response = computed(() => {
let classType = ''
if (showSuccess.value) {
classType = 'text-success'
}
if (showError.value) {
classType = 'text-danger'
}
return {
message: message.value,
class: classType
}
})

function showErrorMsg() {
showSuccess.value = false
showError.value = true
}

function showSuccessMsg() {
showSuccess.value = true
showError.value = false
}

async function checkIn() {
const qrData = JSON.parse(cameraStore.qrCodeValue)
const event = localStorage.getItem('selectedEventName')

if (qrData.event === event) {
console.log(cameraStore.qrCodeValue)
message.value = 'Check in successful'
showSuccessMsg()
} else {
console.log(qrData.event)
console.log(event)
message.value = 'Invalid Event'
showErrorMsg()
}
}

return {
response,
checkIn,
$reset
}
})

0 comments on commit ed47b8c

Please sign in to comment.