davila.erdianita.1005/coba-tampilan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

halaman view permission

Browse Source
This commit is contained in:
Davila Erdianita
2025-06-30 11:09:10 +07:00
parent be4de9f24a
commit 8176411cfe
84 changed files with 5572 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
components/widgets2/cards/FollowerCards.vue Normal file
View File

@@ -0,0 +1,36 @@
<script setup lang="ts">
// import {followerCard} from '@/_mockApis/components/widget/card';
const props = defineProps({
data:{
type: Array,
default: () => []
}
})
const followerCard: any = computed(() => {
return props.data
});
</script>
<template>
<v-row class="pt-3">
<v-col cols="12" md="4" v-for="card in followerCard" :key="card.title">
<v-card elevation="10" rounded="md">
<v-card-item>
<div class="d-flex align-center">
<v-avatar size="40" >
<slot name="avatar" :prop="card"></slot>
</v-avatar>
<div class="pl-4 mt-n1">
<h5 class="text-h5" >
<slot name="title" :prop="card"></slot>
</h5>
<p class="text-body-1 textSecondary d-flex align-center">
<slot name="content" :prop="card"></slot>
</p>
</div>
<slot name="actions" :prop="card"></slot>
</div>
</v-card-item>
</v-card>
</v-col>
</v-row>
</template>

39
components/widgets2/cards/ProfileCards.vue Normal file
View File

@@ -0,0 +1,39 @@
<script setup lang="ts">
// import {profileCards, socialiconCard} from '@/_mockApis/components/widget/card';
const props = defineProps({
data:{
type: Array,
default: () => []
}
})
const profileCards: any = computed(() => {
return props.data
});
</script>
<template>
<v-row>
<v-col cols="12" md="4" v-for="card in profileCards" :key="card.title">
<v-card elevation="10" class=" text-center" rounded="md">
<v-card-item>
<v-avatar size="80">
<slot name="avatar" :prop="card"></slot>
</v-avatar>
<div class="mt-4">
<!-- <h5 class="text-h5" v-text="card.title"></h5>
<p class="text-body-2 mt-1 textSecondary " v-text="card.subtitle"></p> -->
<slot name="content" :prop="card"></slot>
</div>
</v-card-item>
<v-divider class="mt-1"></v-divider>
<div class="text-center d-flex justify-center pa-3">
<slot name="actions" :prop="card"></slot>
<!-- <v-btn size="30" icon variant="flat" v-for="icon in socialiconCard" :key="icon.name">
<v-avatar size="22">
<component :is="icon.icon" :class="'text-'+ icon.color" stroke-width="2" size="18" />
</v-avatar>
</v-btn> -->
</div>
</v-card>
</v-col>
</v-row>
</template>

32
components/widgets2/cards/UpcommingActivityCard.vue Normal file
View File

@@ -0,0 +1,32 @@
<script setup lang="ts">
import {upcommingCards} from '@/_mockApis/components/widget/card';
</script>
<template>
<v-card elevation="10" >
<v-card-item class="pb-sm-8 pb-6">
<v-card-title class="text-h5">Upcoming Activity</v-card-title>
<v-card-subtitle class="text-subtitle-1 ">In New year</v-card-subtitle>
<div class="">
<div class="d-flex align-center mt-6" v-for="list in upcommingCards" :key="list.title">
<v-avatar :class="'rounded-md bg-light'+ list.bgcolor" size="45">
<slot name="avatar" :prop="list"></slot>
<!-- <component :is="list.icon" :class="'text-'+ list.bgcolor" stroke-width="2" size="20" /> -->
</v-avatar>
<div class="pl-4 ">
<h5 class="text-h6 mb-1" >
<slot name="title" :prop="list"></slot>
</h5>
<p class="text-subtitle-1 textSecondary" >
<slot name="content" :prop="list"></slot>
</p>
<!-- <h5 class="text-h6 mb-1" v-text="list.title"></h5>
<p class="text-subtitle-1 textSecondary" v-text="list.subtitle"></p> -->
</div>
<div class="ml-auto font-weight-medium text-subtitle-1 textSecondary" >
<slot name="left-side-content" :prop="list"></slot>
</div>
</div>
</div>
</v-card-item>
</v-card>
</template>

41
components/widgets2/cards/UserCards.vue Normal file
View File

@@ -0,0 +1,41 @@
<script setup lang="ts">
// import { userCards } from '@/_mockApis/components/widget/card';
const props = defineProps({
data:{
type: Array,
default: () => []
}
})
const userCards: any = computed(() => {
return props.data
});
</script>
<template>
<v-row>
<v-col cols="12" md="3" sm="6" v-for="card in userCards" :key="card.title">
<v-card elevation="10" rounded="md">
<v-card-item>
<v-avatar size="80" >
<slot name="avatar" :prop="card"></slot>
</v-avatar>
<div class="mt-6">
<h5 class="text-h5 mb-2">
<slot name="title" :prop="card"></slot>
</h5>
<div class="d-flex align-center justify-space-between">
<div class="ml-2 d-flex ">
<slot name="left-side-content" :prop="card"></slot>
</div>
<slot name="right-side-content" :prop="card"></slot>
</div>
</div>
<div class="mt-6">
<slot name="actions" :prop="card"></slot>
</div>
</v-card-item>
</v-card>
</v-col>
</v-row>
</template>