added copy link button
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import type { CalendarEvent, CalendarSignup } from '@shared/types/calendar'
|
||||
import { CircleAlert, Clock4, EllipsisVertical, MapPin, User, X } from 'lucide-vue-next';
|
||||
import { CircleAlert, Clock4, EllipsisVertical, Link, MapPin, User, X } from 'lucide-vue-next';
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import ButtonGroup from '../ui/button-group/ButtonGroup.vue';
|
||||
import Button from '../ui/button/Button.vue';
|
||||
@@ -14,6 +14,7 @@ import DropdownMenuItem from '../ui/dropdown-menu/DropdownMenuItem.vue';
|
||||
import { Calendar } from 'lucide-vue-next';
|
||||
import MemberCard from '../members/MemberCard.vue';
|
||||
import Spinner from '../ui/spinner/Spinner.vue';
|
||||
import { CopyLink } from '@/lib/copyLink';
|
||||
|
||||
const route = useRoute();
|
||||
|
||||
@@ -178,17 +179,20 @@ defineExpose({ forceReload })
|
||||
<template>
|
||||
<div v-if="loaded">
|
||||
<!-- Header -->
|
||||
<div class="flex items-center justify-between gap-3 border-b px-4 py-3 h-14">
|
||||
<h2 class="text-lg font-semibold break-all">
|
||||
<div class="flex items-center justify-between gap-3 border-b px-4 py-3 ">
|
||||
<h2 class="text-lg font-semibold break-after-all">
|
||||
{{ activeEvent?.name || 'Event' }}
|
||||
</h2>
|
||||
<div class="flex gap-4 items-center">
|
||||
<div class="flex gap-2 items-center">
|
||||
<DropdownMenu v-if="canEditEvent">
|
||||
<DropdownMenuTrigger>
|
||||
<button
|
||||
<Button variant="ghost" size="icon">
|
||||
<EllipsisVertical class="size-5" />
|
||||
</Button>
|
||||
<!-- <button
|
||||
class="inline-flex flex-none size-8 items-center justify-center cursor-pointer rounded-md hover:bg-muted/40 transition">
|
||||
<EllipsisVertical class="size-6" />
|
||||
</button>
|
||||
</button> -->
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuItem @click="emit('edit', activeEvent)">
|
||||
@@ -202,11 +206,17 @@ defineExpose({ forceReload })
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
<button
|
||||
class="inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted/40 transition cursor-pointer"
|
||||
<Button variant="ghost" size="icon" @click="CopyLink()">
|
||||
<Link class="size-4" />
|
||||
</Button>
|
||||
<Button variant="ghost" size="icon" @click="emit('close')">
|
||||
<X class="size-5" />
|
||||
</Button>
|
||||
<!-- <button
|
||||
class="inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted transition cursor-pointer"
|
||||
aria-label="Close" @click="emit('close')">
|
||||
<X class="size-4" />
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- Body -->
|
||||
@@ -293,11 +303,9 @@ defineExpose({ forceReload })
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="flex justify-center h-full items-center">
|
||||
<button
|
||||
class="absolute top-4 right-4 inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted/40 transition cursor-pointer z-50"
|
||||
aria-label="Close" @click="emit('close')">
|
||||
<X class="size-4" />
|
||||
</button>
|
||||
<Button variant="ghost" size="icon" @click="emit('close')">
|
||||
<X class="size-5" />
|
||||
</Button>
|
||||
|
||||
<Spinner class="size-8"></Spinner>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user