Files
bssapp/ui/src/pages/UserGateway.vue

118 lines
2.6 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<q-page v-if="canReadUser" class="user-gateway-page flex flex-center">
<div class="gateway-container">
<div class="gateway-header">
<div class="text-h5">Kullanıcı Yönetim Merkezi</div>
<div class="text-subtitle2 text-grey-7">
Kullanıcı oluşturma ve yetkilendirme işlemleri
</div>
</div>
<div class="gateway-actions row q-col-gutter-lg q-mt-lg">
<!-- YENİ KULLANICI -->
<q-card
v-if="canWriteUser"
class="gateway-card cursor-pointer"
flat
bordered
@click="goCreate"
>
<q-card-section class="text-center">
<q-icon name="person_add" size="48px" color="primary" />
<div class="text-h6 q-mt-sm">Yeni Kullanıcı</div>
<div class="text-caption text-grey-7 q-mt-xs">
Sisteme yeni kullanıcı ekle
</div>
</q-card-section>
</q-card>
<!-- 👥 MEVCUT KULLANICILAR -->
<q-card
v-if="canReadUser"
class="gateway-card cursor-pointer"
flat
bordered
@click="goList"
>
<q-card-section class="text-center">
<q-icon name="groups" size="48px" color="primary" />
<div class="text-h6 q-mt-sm">Mevcut Kullanıcılar</div>
<div class="text-caption text-grey-7 q-mt-xs">
Kullanıcıları görüntüle ve düzenle
</div>
</q-card-section>
</q-card>
</div>
</div>
</q-page>
<q-page v-else class="q-pa-md flex flex-center">
<div class="text-negative text-subtitle1">
Bu module erisim yetkiniz yok.
</div>
</q-page>
</template>
<script setup>
import { useRouter } from 'vue-router'
import { usePermission } from 'src/composables/usePermission'
const { canRead, canWrite } = usePermission()
const canReadUser = canRead('user')
const canWriteUser = canWrite('user')
const router = useRouter()
function goCreate () {
if (!canWriteUser.value) return
router.push({
path: '/app/users/new',
query: { mode: 'new' }
})
}
function goList () {
if (!canReadUser.value) return
router.push({ name: 'user-list' })
}
</script>
<style scoped>
.user-gateway-page {
background: #fafafa;
}
.gateway-container {
width: 100%;
max-width: 900px;
padding: 24px;
}
.gateway-header {
text-align: center;
}
.gateway-actions {
justify-content: center;
}
.gateway-card {
width: 280px;
transition: all 0.2s ease;
}
.gateway-card:hover {
transform: translateY(-4px);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
</style>