IT4Change/gradido
3
0
Fork 0
mirror of https://github.com/IT4Change/gradido.git synced 2026-02-06 09:56:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

new control attributes and modify disabled button

Browse Source
This commit is contained in:
clauspeterhuebner 2025-03-27 23:52:56 +01:00
parent 9ab7516d38
commit 630955dff2
1 changed files with 34 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
frontend/src/components/Overview/CardUserSearch.vue
View File

@ -1,5 +1,5 @@
<template>
<div v-if="gmsActive" class="mb-3 p-3 card-user-search">
<div class="mb-3 p-3 card-user-search">
<BContainer class="bg-white app-box-shadow gradido-border-radius p-4 mt--3 container">
<div class="h3">{{ $t('card-user-search.headline') }}</div>
<div v-if="gmsUserLocationExists" class="my-3 text-small">
@ -23,20 +23,32 @@
<BRow class="my-1">
<BCol cols="12">
<div class="text-lg-end">
<BButton
v-if="gmsUserLocationExists"
:disabled="isUserSearchDisabled"
variant="gradido"
:href="gmsUri"
target="_blank"
>
{{ $t('card-user-search.allowed.button') }}
</BButton>
<RouterLink v-else to="/settings/extern">
<BButton variant="gradido">
{{ $t('card-user-search.not-allowed.button') }}
<div v-if="gmsUserLocationExists">
<BButton
v-if="isUserSearchDisabled"
:disabled="isUserSearchDisabled"
variant="gradido"
:href="gmsUri"
target="_blank"
>
{{ $t('card-user-search.allowed.disabled-button') }}
</BButton>
</RouterLink>
<BButton
v-else
variant="gradido"
:href="gmsUri"
target="_blank"
>
{{ $t('card-user-search.allowed.button') }}
</BButton>
</div>
<div v-else>
<RouterLink to="/settings/extern">
<BButton variant="gradido">
{{ $t('card-user-search.not-allowed.button') }}
</BButton>
</RouterLink>
</div>
</div>
</BCol>
</BRow>
@ -55,25 +67,25 @@ const { toastError } = useAppToast()
const store = useStore()
const gmsUri = ref('not initialized')
// console.log('store.state: gmsActive gmsAllowed userLocation=', store.state.gmsActive, store.state.gmsAllowed, store.state.userLocation)
const gmsActive = store.state.gmsActive
// console.log('gmsActive=', gmsActive)
console.log('store.state: gmsAllowed userLocation=', store.state.gmsAllowed, store.state.userLocation)
const gmsAllowed = store.state.gmsAllowed
console.log('gmsAllowed=', gmsAllowed)
const gmsUserLocationExists = store.state.userLocation !== null
// console.log('gmsUserLocationExists=', gmsUserLocationExists)
console.log('gmsUserLocationExists=', gmsUserLocationExists)
const isUserSearchDisabled = computed(() => gmsUri.value !== null)
const { onResult, result, loading, onError } = useQuery(authenticateGmsUserSearch)
onResult(({ data }) => {
if (gmsActive && gmsUserLocationExists && data !== undefined) {
if (gmsAllowed && gmsUserLocationExists && data !== undefined) {
gmsUri.value = `${data.authenticateGmsUserSearch.url}?accesstoken=${data.authenticateGmsUserSearch.token}`
}
})
onError(() => {
if (gmsActive && gmsUserLocationExists) {
if (gmsAllowed && gmsUserLocationExists) {
toastError('authenticateGmsUserSearch failed!')
} else if (gmsActive && !gmsUserLocationExists) {
} else if (gmsAllowed && !gmsUserLocationExists) {
// toastError('capture your location first!')
// eslint-disable-next-line no-console
console.log('capture your location first...')
@ -86,6 +98,6 @@ onError(() => {
background-position: left;
background-repeat: no-repeat;
background-size: 380px 180px;
background-image: url('/img/svg/usersearchmap6.jpg') !important;
background-image: url('/img/svg/usersearchmap5.jpg') !important;
}
</style>