add delete hint
This commit is contained in:
@@ -1,50 +1,58 @@
|
||||
<template>
|
||||
<div class="q-pa-sm">
|
||||
<q-card class='domain-card'>
|
||||
<q-card-section>
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="col">
|
||||
<div class="text-h6">{{ item.name }} <q-icon v-if="isNotOwnerFunc(item.id)" name="account_circle" color="teal" class="q-mb-xs"></q-icon> </div>
|
||||
<div class="text-subtitle2">{{ item.url }}</div>
|
||||
</div>
|
||||
<!-- <div v-if="isNotOwnerFunc(item.id)" class="col-auto">
|
||||
<q-icon name="account_circle" color="teal" size="2em"></q-icon>
|
||||
</div> -->
|
||||
<q-card :class="['domain-card', small ? 'small' : '']">
|
||||
<q-card-section :class="[small ? 'q-py-sm' : '']">
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="col">
|
||||
<div :class="[small ? 'text-subtitle2' : 'text-h6']">{{ item.name }} <q-icon v-if="isNotOwnerFunc(item.id)" name="account_circle" color="teal" class="q-mb-xs"></q-icon> </div>
|
||||
<div :class="[small ? 'text-caption' : 'text-subtitle2']">{{ item.url }}</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="col">
|
||||
<div class="text-grey-7 text-caption text-weight-medium">
|
||||
アカウント
|
||||
</div>
|
||||
<div class="smaller-font-size">{{ item.kintoneuser }}</div>
|
||||
</div>
|
||||
<div v-if="isNotOwnerFunc(item.id)" class="col-auto">
|
||||
<div class="text-grey-7 text-caption text-weight-medium">
|
||||
所有者
|
||||
</div>
|
||||
<div class="smaller-font-size">{{ item.owner }}</div>
|
||||
<!-- <div v-if="isNotOwnerFunc(item.id)" class="col-auto">
|
||||
<q-icon name="account_circle" color="teal" size="2em"></q-icon>
|
||||
</div> -->
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="col">
|
||||
<div class="text-grey-7 text-caption text-weight-medium">
|
||||
アカウント
|
||||
</div>
|
||||
<div class="smaller-font-size">{{ item.kintoneuser }}</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<slot name="actions" :item="item"></slot>
|
||||
</q-card>
|
||||
</div>
|
||||
<div v-if="isNotOwnerFunc(item.id)" class="col-auto">
|
||||
<div class="text-grey-7 text-caption text-weight-medium">
|
||||
所有者
|
||||
</div>
|
||||
<div class="smaller-font-size">{{ item.owner }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator v-if="$slots.actions" />
|
||||
<slot name="actions" :item="item"></slot>
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps } from 'vue';
|
||||
import { defineProps, computed } from 'vue';
|
||||
import { IDomain } from 'src/types/DomainTypes';
|
||||
import { useAuthStore } from 'stores/useAuthStore';
|
||||
|
||||
const props = defineProps<{
|
||||
item: IDomain;
|
||||
isNotOwnerFunc: (ownerId: any) => boolean;
|
||||
small: boolean;
|
||||
}>();
|
||||
|
||||
const authStore = useAuthStore();
|
||||
const isNotOwnerFunc = computed(() => (ownerId: string) => {
|
||||
return ownerId == authStore.userId;
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.domain-card.small {
|
||||
width: 18rem;
|
||||
}
|
||||
.domain-card {
|
||||
width: 22rem;
|
||||
word-break: break-word;
|
||||
|
||||
Reference in New Issue
Block a user