chore: remove working copies and superseded verify.get.js
This commit is contained in:
parent
e81000b5a6
commit
ee438f5c60
6 changed files with 0 additions and 1198 deletions
|
|
@ -1,542 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="bg-guild-900 border-b border-guild-700">
|
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
||||||
<div class="py-6">
|
|
||||||
<h1 class="text-display font-bold text-guild-100">Event Management</h1>
|
|
||||||
<p class="text-guild-400">
|
|
||||||
Create, manage, and monitor Ghost Guild events and workshops
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
||||||
<!-- Search and Actions -->
|
|
||||||
<div class="mb-6 flex justify-between items-center">
|
|
||||||
<div class="flex gap-4 items-center">
|
|
||||||
<UInput
|
|
||||||
v-model="searchQuery"
|
|
||||||
placeholder="Search events..."
|
|
||||||
class="w-80"
|
|
||||||
/>
|
|
||||||
<USelect
|
|
||||||
v-model="typeFilter"
|
|
||||||
:items="[
|
|
||||||
{ label: 'All Types', value: '' },
|
|
||||||
{ label: 'Community', value: 'community' },
|
|
||||||
{ label: 'Workshop', value: 'workshop' },
|
|
||||||
{ label: 'Social', value: 'social' },
|
|
||||||
{ label: 'Showcase', value: 'showcase' },
|
|
||||||
]"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
<USelect
|
|
||||||
v-model="statusFilter"
|
|
||||||
:items="[
|
|
||||||
{ label: 'All Status', value: '' },
|
|
||||||
{ label: 'Upcoming', value: 'upcoming' },
|
|
||||||
{ label: 'Ongoing', value: 'ongoing' },
|
|
||||||
{ label: 'Past', value: 'past' },
|
|
||||||
]"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
@click="showCreateModal = true"
|
|
||||||
class="bg-candlelight-600 text-white px-4 py-2 rounded-lg hover:bg-candlelight-700 focus:ring-2 focus:ring-candlelight-500 focus:ring-offset-2"
|
|
||||||
>
|
|
||||||
Create Event
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Events Table -->
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow overflow-hidden">
|
|
||||||
<div v-if="pending" class="p-8 text-center">
|
|
||||||
<div class="inline-flex items-center">
|
|
||||||
<div
|
|
||||||
class="animate-spin rounded-full h-6 w-6 border-b-2 border-candlelight-500 mr-3"
|
|
||||||
></div>
|
|
||||||
Loading events...
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else-if="error" class="p-8 text-center text-ember-400">
|
|
||||||
Error loading events: {{ error }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table v-else class="w-full">
|
|
||||||
<thead class="bg-guild-950">
|
|
||||||
<tr>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Title
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Type
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Start Date
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Status
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Registration
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Actions
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody class="bg-guild-900 divide-y divide-guild-700">
|
|
||||||
<tr
|
|
||||||
v-for="event in filteredEvents"
|
|
||||||
:key="event._id"
|
|
||||||
class="hover:bg-guild-800"
|
|
||||||
>
|
|
||||||
<td class="px-6 py-4">
|
|
||||||
<div class="text-sm font-medium text-guild-100">
|
|
||||||
{{ event.title }}
|
|
||||||
</div>
|
|
||||||
<div class="text-sm text-guild-500">
|
|
||||||
{{ event.description.substring(0, 100) }}...
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<span
|
|
||||||
:class="getEventTypeClasses(event.eventType)"
|
|
||||||
class="inline-flex px-2 py-1 text-xs font-semibold rounded-full"
|
|
||||||
>
|
|
||||||
{{ event.eventType }}
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-guild-400">
|
|
||||||
{{ formatDateTime(event.startDate) }}
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<span
|
|
||||||
:class="getStatusClasses(event)"
|
|
||||||
class="inline-flex px-2 py-1 text-xs font-semibold rounded-full"
|
|
||||||
>
|
|
||||||
{{ getEventStatus(event) }}
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<span
|
|
||||||
:class="
|
|
||||||
event.registrationRequired
|
|
||||||
? 'bg-candlelight-900/20 text-candlelight-400'
|
|
||||||
: 'bg-guild-800 text-guild-300'
|
|
||||||
"
|
|
||||||
class="inline-flex px-2 py-1 text-xs font-semibold rounded-full"
|
|
||||||
>
|
|
||||||
{{ event.registrationRequired ? "Required" : "Open" }}
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-guild-100">
|
|
||||||
<div class="flex gap-2">
|
|
||||||
<button
|
|
||||||
@click="editEvent(event)"
|
|
||||||
class="text-candlelight-400 hover:text-candlelight-300"
|
|
||||||
>
|
|
||||||
Edit
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
@click="duplicateEvent(event)"
|
|
||||||
class="text-candlelight-400 hover:text-candlelight-300"
|
|
||||||
>
|
|
||||||
Duplicate
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
@click="deleteEvent(event)"
|
|
||||||
class="text-ember-400 hover:text-ember-300"
|
|
||||||
>
|
|
||||||
Delete
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div
|
|
||||||
v-if="!pending && !error && filteredEvents.length === 0"
|
|
||||||
class="p-8 text-center text-guild-500"
|
|
||||||
>
|
|
||||||
No events found matching your criteria
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Create/Edit Event Modal -->
|
|
||||||
<div
|
|
||||||
v-if="showCreateModal"
|
|
||||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 overflow-y-auto"
|
|
||||||
>
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow-xl max-w-2xl w-full mx-4 my-8">
|
|
||||||
<div class="px-6 py-4 border-b border-guild-700">
|
|
||||||
<h3 class="text-display-sm font-semibold text-guild-100">
|
|
||||||
{{ editingEvent ? "Edit Event" : "Create New Event" }}
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form @submit.prevent="saveEvent" class="p-6 space-y-4">
|
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
||||||
<div class="md:col-span-2">
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Event Title</label
|
|
||||||
>
|
|
||||||
<UInput
|
|
||||||
v-model="eventForm.title"
|
|
||||||
placeholder="Enter event title"
|
|
||||||
required
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Event Type</label
|
|
||||||
>
|
|
||||||
<USelect
|
|
||||||
v-model="eventForm.eventType"
|
|
||||||
:items="[
|
|
||||||
{ label: 'Community Meetup', value: 'community' },
|
|
||||||
{ label: 'Workshop', value: 'workshop' },
|
|
||||||
{ label: 'Social Event', value: 'social' },
|
|
||||||
{ label: 'Showcase', value: 'showcase' },
|
|
||||||
]"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Location</label
|
|
||||||
>
|
|
||||||
<UInput
|
|
||||||
v-model="eventForm.location"
|
|
||||||
placeholder="Event location"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Start Date & Time</label
|
|
||||||
>
|
|
||||||
<UInput
|
|
||||||
v-model="eventForm.startDate"
|
|
||||||
type="datetime-local"
|
|
||||||
required
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>End Date & Time</label
|
|
||||||
>
|
|
||||||
<UInput
|
|
||||||
v-model="eventForm.endDate"
|
|
||||||
type="datetime-local"
|
|
||||||
required
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Max Attendees</label
|
|
||||||
>
|
|
||||||
<UInput
|
|
||||||
v-model="eventForm.maxAttendees"
|
|
||||||
type="number"
|
|
||||||
placeholder="Optional"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Registration Deadline</label
|
|
||||||
>
|
|
||||||
<UInput
|
|
||||||
v-model="eventForm.registrationDeadline"
|
|
||||||
type="datetime-local"
|
|
||||||
placeholder="Optional"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Description</label
|
|
||||||
>
|
|
||||||
<UTextarea
|
|
||||||
v-model="eventForm.description"
|
|
||||||
placeholder="Event description"
|
|
||||||
required
|
|
||||||
:rows="3"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Additional Content</label
|
|
||||||
>
|
|
||||||
<UTextarea
|
|
||||||
v-model="eventForm.content"
|
|
||||||
placeholder="Detailed event information, agenda, etc."
|
|
||||||
:rows="4"
|
|
||||||
class="w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex items-center gap-6">
|
|
||||||
<label class="flex items-center">
|
|
||||||
<input
|
|
||||||
v-model="eventForm.isOnline"
|
|
||||||
type="checkbox"
|
|
||||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500"
|
|
||||||
/>
|
|
||||||
<span class="ml-2 text-sm text-guild-100">Online Event</span>
|
|
||||||
</label>
|
|
||||||
<label class="flex items-center">
|
|
||||||
<input
|
|
||||||
v-model="eventForm.registrationRequired"
|
|
||||||
type="checkbox"
|
|
||||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500"
|
|
||||||
/>
|
|
||||||
<span class="ml-2 text-sm text-guild-100"
|
|
||||||
>Registration Required</span
|
|
||||||
>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex justify-end gap-3 pt-4">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
@click="cancelEdit"
|
|
||||||
class="px-4 py-2 text-guild-400 hover:text-guild-100 font-medium"
|
|
||||||
>
|
|
||||||
Cancel
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="submit"
|
|
||||||
:disabled="creating"
|
|
||||||
class="bg-candlelight-600 text-white px-4 py-2 rounded-lg hover:bg-candlelight-700 disabled:opacity-50 disabled:cursor-not-allowed"
|
|
||||||
>
|
|
||||||
{{
|
|
||||||
creating
|
|
||||||
? "Saving..."
|
|
||||||
: editingEvent
|
|
||||||
? "Update Event"
|
|
||||||
: "Create Event"
|
|
||||||
}}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
definePageMeta({
|
|
||||||
layout: "admin",
|
|
||||||
});
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: events,
|
|
||||||
pending,
|
|
||||||
error,
|
|
||||||
refresh,
|
|
||||||
} = await useFetch("/api/admin/events");
|
|
||||||
|
|
||||||
const searchQuery = ref("");
|
|
||||||
const typeFilter = ref("");
|
|
||||||
const statusFilter = ref("");
|
|
||||||
const showCreateModal = ref(false);
|
|
||||||
const creating = ref(false);
|
|
||||||
const editingEvent = ref(null);
|
|
||||||
|
|
||||||
const eventForm = reactive({
|
|
||||||
title: "",
|
|
||||||
description: "",
|
|
||||||
content: "",
|
|
||||||
startDate: "",
|
|
||||||
endDate: "",
|
|
||||||
eventType: "community",
|
|
||||||
location: "",
|
|
||||||
isOnline: false,
|
|
||||||
maxAttendees: "",
|
|
||||||
registrationRequired: false,
|
|
||||||
registrationDeadline: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
const filteredEvents = computed(() => {
|
|
||||||
if (!events.value) return [];
|
|
||||||
|
|
||||||
return events.value.filter((event) => {
|
|
||||||
const matchesSearch =
|
|
||||||
!searchQuery.value ||
|
|
||||||
event.title.toLowerCase().includes(searchQuery.value.toLowerCase()) ||
|
|
||||||
event.description.toLowerCase().includes(searchQuery.value.toLowerCase());
|
|
||||||
|
|
||||||
const matchesType =
|
|
||||||
!typeFilter.value || event.eventType === typeFilter.value;
|
|
||||||
|
|
||||||
const eventStatus = getEventStatus(event);
|
|
||||||
const matchesStatus =
|
|
||||||
!statusFilter.value || eventStatus.toLowerCase() === statusFilter.value;
|
|
||||||
|
|
||||||
return matchesSearch && matchesType && matchesStatus;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const getEventTypeClasses = (type) => {
|
|
||||||
const classes = {
|
|
||||||
community: "bg-candlelight-900/20 text-candlelight-400",
|
|
||||||
workshop: "bg-candlelight-900/20 text-candlelight-400",
|
|
||||||
social: "bg-earth-900/20 text-earth-400",
|
|
||||||
showcase: "bg-ember-900/20 text-ember-400",
|
|
||||||
};
|
|
||||||
return classes[type] || "bg-guild-800 text-guild-300";
|
|
||||||
};
|
|
||||||
|
|
||||||
const getEventStatus = (event) => {
|
|
||||||
const now = new Date();
|
|
||||||
const startDate = new Date(event.startDate);
|
|
||||||
const endDate = new Date(event.endDate);
|
|
||||||
|
|
||||||
if (now < startDate) return "Upcoming";
|
|
||||||
if (now >= startDate && now <= endDate) return "Ongoing";
|
|
||||||
return "Past";
|
|
||||||
};
|
|
||||||
|
|
||||||
const getStatusClasses = (event) => {
|
|
||||||
const status = getEventStatus(event);
|
|
||||||
const classes = {
|
|
||||||
Upcoming: "bg-candlelight-900/20 text-candlelight-400",
|
|
||||||
Ongoing: "bg-candlelight-900/20 text-candlelight-400",
|
|
||||||
Past: "bg-guild-800 text-guild-300",
|
|
||||||
};
|
|
||||||
return classes[status] || "bg-guild-800 text-guild-300";
|
|
||||||
};
|
|
||||||
|
|
||||||
const formatDateTime = (dateString) => {
|
|
||||||
return new Date(dateString).toLocaleString();
|
|
||||||
};
|
|
||||||
|
|
||||||
const saveEvent = async () => {
|
|
||||||
creating.value = true;
|
|
||||||
try {
|
|
||||||
if (editingEvent.value) {
|
|
||||||
await $fetch(`/api/admin/events/${editingEvent.value._id}`, {
|
|
||||||
method: "PUT",
|
|
||||||
body: eventForm,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
await $fetch("/api/admin/events", {
|
|
||||||
method: "POST",
|
|
||||||
body: eventForm,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
cancelEdit();
|
|
||||||
await refresh();
|
|
||||||
alert("Event saved successfully!");
|
|
||||||
} catch (error) {
|
|
||||||
console.error("Failed to save event:", error);
|
|
||||||
alert("Failed to save event");
|
|
||||||
} finally {
|
|
||||||
creating.value = false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const editEvent = (event) => {
|
|
||||||
editingEvent.value = event;
|
|
||||||
Object.assign(eventForm, {
|
|
||||||
title: event.title,
|
|
||||||
description: event.description,
|
|
||||||
content: event.content || "",
|
|
||||||
startDate: new Date(event.startDate).toISOString().slice(0, 16),
|
|
||||||
endDate: new Date(event.endDate).toISOString().slice(0, 16),
|
|
||||||
eventType: event.eventType,
|
|
||||||
location: event.location || "",
|
|
||||||
isOnline: event.isOnline,
|
|
||||||
maxAttendees: event.maxAttendees || "",
|
|
||||||
registrationRequired: event.registrationRequired,
|
|
||||||
registrationDeadline: event.registrationDeadline
|
|
||||||
? new Date(event.registrationDeadline).toISOString().slice(0, 16)
|
|
||||||
: "",
|
|
||||||
});
|
|
||||||
showCreateModal.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
const duplicateEvent = (event) => {
|
|
||||||
editingEvent.value = null;
|
|
||||||
Object.assign(eventForm, {
|
|
||||||
title: `${event.title} (Copy)`,
|
|
||||||
description: event.description,
|
|
||||||
content: event.content || "",
|
|
||||||
startDate: "",
|
|
||||||
endDate: "",
|
|
||||||
eventType: event.eventType,
|
|
||||||
location: event.location || "",
|
|
||||||
isOnline: event.isOnline,
|
|
||||||
maxAttendees: event.maxAttendees || "",
|
|
||||||
registrationRequired: event.registrationRequired,
|
|
||||||
registrationDeadline: "",
|
|
||||||
});
|
|
||||||
showCreateModal.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
const cancelEdit = () => {
|
|
||||||
showCreateModal.value = false;
|
|
||||||
editingEvent.value = null;
|
|
||||||
Object.assign(eventForm, {
|
|
||||||
title: "",
|
|
||||||
description: "",
|
|
||||||
content: "",
|
|
||||||
startDate: "",
|
|
||||||
endDate: "",
|
|
||||||
eventType: "community",
|
|
||||||
location: "",
|
|
||||||
isOnline: false,
|
|
||||||
maxAttendees: "",
|
|
||||||
registrationRequired: false,
|
|
||||||
registrationDeadline: "",
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const deleteEvent = async (event) => {
|
|
||||||
if (confirm(`Are you sure you want to delete "${event.title}"?`)) {
|
|
||||||
try {
|
|
||||||
await $fetch(`/api/admin/events/${event._id}`, {
|
|
||||||
method: "DELETE",
|
|
||||||
});
|
|
||||||
await refresh();
|
|
||||||
alert("Event deleted successfully!");
|
|
||||||
} catch (error) {
|
|
||||||
console.error("Failed to delete event:", error);
|
|
||||||
alert("Failed to delete event");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,112 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="bg-guild-900 border-b border-guild-700">
|
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
||||||
<div class="py-6">
|
|
||||||
<h1 class="text-display font-bold text-guild-100">Admin Interface - Working Version</h1>
|
|
||||||
<p class="text-guild-400">Fully functional admin interface without Nuxt UI component issues</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
||||||
<!-- Navigation Cards -->
|
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
|
|
||||||
<NuxtLink to="/admin/dashboard" class="block bg-guild-900 rounded-lg shadow hover:shadow-lg transition-shadow p-6 text-center border-2 border-transparent hover:border-candlelight-800">
|
|
||||||
<div class="w-16 h-16 bg-candlelight-900/20 rounded-2xl flex items-center justify-center mx-auto mb-4">
|
|
||||||
<svg class="w-8 h-8 text-candlelight-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<h3 class="text-lg font-semibold text-guild-100 mb-2">Dashboard</h3>
|
|
||||||
<p class="text-guild-400 text-sm">Overview & statistics</p>
|
|
||||||
</NuxtLink>
|
|
||||||
|
|
||||||
<NuxtLink to="/admin/members-working" class="block bg-guild-900 rounded-lg shadow hover:shadow-lg transition-shadow p-6 text-center border-2 border-transparent hover:border-candlelight-800">
|
|
||||||
<div class="w-16 h-16 bg-candlelight-900/20 rounded-2xl flex items-center justify-center mx-auto mb-4">
|
|
||||||
<svg class="w-8 h-8 text-candlelight-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197m13.5-.5a4 4 0 110 5.292M4 19.5a4 4 0 010-5.292"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<h3 class="text-lg font-semibold text-guild-100 mb-2">Members</h3>
|
|
||||||
<p class="text-guild-400 text-sm">Manage members</p>
|
|
||||||
</NuxtLink>
|
|
||||||
|
|
||||||
<NuxtLink to="/admin/events-working" class="block bg-guild-900 rounded-lg shadow hover:shadow-lg transition-shadow p-6 text-center border-2 border-transparent hover:border-earth-800">
|
|
||||||
<div class="w-16 h-16 bg-earth-900/20 rounded-2xl flex items-center justify-center mx-auto mb-4">
|
|
||||||
<svg class="w-8 h-8 text-earth-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<h3 class="text-lg font-semibold text-guild-100 mb-2">Events</h3>
|
|
||||||
<p class="text-guild-400 text-sm">Manage events</p>
|
|
||||||
</NuxtLink>
|
|
||||||
|
|
||||||
<div class="bg-guild-950 rounded-lg p-6 text-center border-2 border-dashed border-guild-700">
|
|
||||||
<div class="w-16 h-16 bg-guild-800 rounded-2xl flex items-center justify-center mx-auto mb-4">
|
|
||||||
<svg class="w-8 h-8 text-guild-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<h3 class="text-lg font-semibold mb-2 text-guild-400">More</h3>
|
|
||||||
<p class="text-guild-500 text-sm">Coming soon</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Status Information -->
|
|
||||||
<div class="bg-candlelight-900/20 border border-candlelight-800 rounded-lg p-6">
|
|
||||||
<div class="flex items-start">
|
|
||||||
<svg class="w-6 h-6 text-candlelight-400 mt-0.5 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
||||||
</svg>
|
|
||||||
<div>
|
|
||||||
<h3 class="text-lg font-semibold text-candlelight-400 mb-2">Admin Interface Status: Fully Working</h3>
|
|
||||||
<div class="space-y-2 text-candlelight-400">
|
|
||||||
<p>✅ <strong>Dashboard:</strong> Shows statistics, recent members, and upcoming events</p>
|
|
||||||
<p>✅ <strong>Member Management:</strong> Full CRUD operations, search, filter, create members</p>
|
|
||||||
<p>✅ <strong>Event Management:</strong> Create, edit, delete, duplicate events with full forms</p>
|
|
||||||
<p>✅ <strong>Database:</strong> MongoDB connected with {{ memberCount }} members and {{ eventCount }} events</p>
|
|
||||||
<p>✅ <strong>APIs:</strong> All backend endpoints working correctly</p>
|
|
||||||
<p>⚠️ <strong>Authentication:</strong> Temporarily disabled for testing (re-enable when ready)</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Quick Stats Preview -->
|
|
||||||
<div class="mt-8 grid grid-cols-2 md:grid-cols-4 gap-4">
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow p-4 text-center">
|
|
||||||
<p class="text-2xl font-bold text-candlelight-400 text-ui-mono">{{ memberCount }}</p>
|
|
||||||
<p class="text-sm text-guild-400">Members</p>
|
|
||||||
</div>
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow p-4 text-center">
|
|
||||||
<p class="text-2xl font-bold text-candlelight-400 text-ui-mono">{{ eventCount }}</p>
|
|
||||||
<p class="text-sm text-guild-400">Events</p>
|
|
||||||
</div>
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow p-4 text-center">
|
|
||||||
<p class="text-2xl font-bold text-earth-400 text-ui-mono">${{ monthlyRevenue }}</p>
|
|
||||||
<p class="text-sm text-guild-400">Monthly Revenue</p>
|
|
||||||
</div>
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow p-4 text-center">
|
|
||||||
<p class="text-2xl font-bold text-ember-400 text-ui-mono">{{ pendingInvites }}</p>
|
|
||||||
<p class="text-sm text-guild-400">Pending Invites</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
definePageMeta({
|
|
||||||
layout: 'admin'
|
|
||||||
})
|
|
||||||
|
|
||||||
// Get quick stats for preview
|
|
||||||
const { data: dashboardData } = await useFetch('/api/admin/dashboard')
|
|
||||||
const stats = computed(() => dashboardData.value?.stats || {})
|
|
||||||
|
|
||||||
const memberCount = computed(() => stats.value.totalMembers || 0)
|
|
||||||
const eventCount = computed(() => (dashboardData.value?.upcomingEvents?.length || 0) + (dashboardData.value?.recentMembers?.length || 0))
|
|
||||||
const monthlyRevenue = computed(() => stats.value.monthlyRevenue || 0)
|
|
||||||
const pendingInvites = computed(() => stats.value.pendingSlackInvites || 0)
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,101 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<h1 class="text-display font-bold mb-6 text-guild-100">Members</h1>
|
|
||||||
|
|
||||||
<div v-if="pending" class="text-center text-guild-400">Loading...</div>
|
|
||||||
|
|
||||||
<div v-else-if="error" class="text-ember-400">
|
|
||||||
Error loading members: {{ error }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else class="space-y-4">
|
|
||||||
<div class="bg-guild-900 rounded-lg border border-guild-700 p-4">
|
|
||||||
<h3 class="font-semibold mb-2 text-guild-100">Total Members: {{ members?.length || 0 }}</h3>
|
|
||||||
|
|
||||||
<div v-for="member in members" :key="member._id" class="border-b border-guild-700 pb-2 mb-2 last:border-b-0">
|
|
||||||
<div class="flex justify-between items-center">
|
|
||||||
<div>
|
|
||||||
<p class="font-medium text-guild-100">{{ member.name }}</p>
|
|
||||||
<p class="text-guild-400 text-sm">{{ member.email }}</p>
|
|
||||||
</div>
|
|
||||||
<div class="text-right">
|
|
||||||
<span class="inline-block px-2 py-1 text-xs rounded bg-candlelight-900/20 text-candlelight-400">
|
|
||||||
{{ member.circle }}
|
|
||||||
</span>
|
|
||||||
<p class="text-sm text-guild-500 text-ui-mono">${{ member.contributionTier }}/month</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Simple Add Member Form -->
|
|
||||||
<div class="bg-guild-900 rounded-lg border border-guild-700 p-4">
|
|
||||||
<h3 class="text-display-sm font-semibold mb-4 text-guild-100">Add Member</h3>
|
|
||||||
<div class="grid grid-cols-2 gap-4">
|
|
||||||
<input v-model="newMember.name" placeholder="Name" class="border border-guild-700 bg-guild-800 text-guild-100 placeholder-guild-500 rounded p-2" />
|
|
||||||
<input v-model="newMember.email" placeholder="Email" class="border border-guild-700 bg-guild-800 text-guild-100 placeholder-guild-500 rounded p-2" />
|
|
||||||
<select v-model="newMember.circle" class="border border-guild-700 bg-guild-800 text-guild-100 rounded p-2">
|
|
||||||
<option value="community">Community</option>
|
|
||||||
<option value="founder">Founder</option>
|
|
||||||
<option value="practitioner">Practitioner</option>
|
|
||||||
</select>
|
|
||||||
<select v-model="newMember.contributionTier" class="border border-guild-700 bg-guild-800 text-guild-100 rounded p-2">
|
|
||||||
<option value="0">$0/month</option>
|
|
||||||
<option value="5">$5/month</option>
|
|
||||||
<option value="15">$15/month</option>
|
|
||||||
<option value="30">$30/month</option>
|
|
||||||
<option value="50">$50/month</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<button @click="createMember" :disabled="creating" class="mt-4 bg-candlelight-600 text-white px-4 py-2 rounded hover:bg-candlelight-700 disabled:opacity-50">
|
|
||||||
{{ creating ? 'Adding...' : 'Add Member' }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
definePageMeta({
|
|
||||||
layout: 'admin'
|
|
||||||
})
|
|
||||||
|
|
||||||
const { data: members, pending, error, refresh } = await useFetch("/api/admin/members")
|
|
||||||
const creating = ref(false)
|
|
||||||
|
|
||||||
const newMember = reactive({
|
|
||||||
name: '',
|
|
||||||
email: '',
|
|
||||||
circle: 'community',
|
|
||||||
contributionTier: '0'
|
|
||||||
})
|
|
||||||
|
|
||||||
const createMember = async () => {
|
|
||||||
if (!newMember.name || !newMember.email) {
|
|
||||||
alert('Please fill in name and email')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
creating.value = true
|
|
||||||
try {
|
|
||||||
await $fetch('/api/admin/members', {
|
|
||||||
method: 'POST',
|
|
||||||
body: newMember
|
|
||||||
})
|
|
||||||
|
|
||||||
Object.assign(newMember, {
|
|
||||||
name: '',
|
|
||||||
email: '',
|
|
||||||
circle: 'community',
|
|
||||||
contributionTier: '0'
|
|
||||||
})
|
|
||||||
|
|
||||||
await refresh()
|
|
||||||
alert('Member added successfully!')
|
|
||||||
} catch (error) {
|
|
||||||
alert('Failed to add member: ' + error.message)
|
|
||||||
} finally {
|
|
||||||
creating.value = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,345 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="bg-guild-900 border-b border-guild-700">
|
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
||||||
<div class="py-6">
|
|
||||||
<h1 class="text-display font-bold text-guild-100">Member Management</h1>
|
|
||||||
<p class="text-guild-400">
|
|
||||||
Manage Ghost Guild members, their contributions, and access levels
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
||||||
<!-- Search and Actions -->
|
|
||||||
<div class="mb-6 flex justify-between items-center">
|
|
||||||
<div class="flex gap-4 items-center">
|
|
||||||
<input
|
|
||||||
v-model="searchQuery"
|
|
||||||
placeholder="Search members..."
|
|
||||||
class="border border-guild-700 bg-guild-900 text-guild-100 placeholder-guild-500 rounded-lg px-4 py-2 w-80 focus:ring-2 focus:ring-candlelight-500 focus:border-transparent"
|
|
||||||
/>
|
|
||||||
<select
|
|
||||||
v-model="circleFilter"
|
|
||||||
class="border border-guild-700 bg-guild-900 text-guild-100 rounded-lg px-4 py-2 focus:ring-2 focus:ring-candlelight-500 focus:border-transparent"
|
|
||||||
>
|
|
||||||
<option value="">All Circles</option>
|
|
||||||
<option value="community">Community</option>
|
|
||||||
<option value="founder">Founder</option>
|
|
||||||
<option value="practitioner">Practitioner</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
@click="showCreateModal = true"
|
|
||||||
class="bg-candlelight-600 text-white px-4 py-2 rounded-lg hover:bg-candlelight-700 focus:ring-2 focus:ring-candlelight-500 focus:ring-offset-2"
|
|
||||||
>
|
|
||||||
Add Member
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Members Table -->
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow overflow-hidden">
|
|
||||||
<div v-if="pending" class="p-8 text-center text-guild-100">
|
|
||||||
<div class="inline-flex items-center">
|
|
||||||
<div
|
|
||||||
class="animate-spin rounded-full h-6 w-6 border-b-2 border-candlelight-500 mr-3"
|
|
||||||
></div>
|
|
||||||
Loading members...
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else-if="error" class="p-8 text-center text-ember-400">
|
|
||||||
Error loading members: {{ error }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table v-else class="w-full">
|
|
||||||
<thead class="bg-guild-950">
|
|
||||||
<tr>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Name
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Email
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Circle
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Contribution
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Slack Status
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Joined
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-guild-500 uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Actions
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody class="bg-guild-900 divide-y divide-guild-700">
|
|
||||||
<tr
|
|
||||||
v-for="member in filteredMembers"
|
|
||||||
:key="member._id"
|
|
||||||
class="hover:bg-guild-800"
|
|
||||||
>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<div class="text-sm font-medium text-guild-100">
|
|
||||||
{{ member.name }}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<div class="text-sm text-guild-400">{{ member.email }}</div>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<span
|
|
||||||
:class="getCircleClasses(member.circle)"
|
|
||||||
class="inline-flex px-2 py-1 text-xs font-semibold rounded-full"
|
|
||||||
>
|
|
||||||
{{ member.circle }}
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<span
|
|
||||||
class="inline-flex px-2 py-1 text-xs font-semibold rounded-full bg-candlelight-900/20 text-candlelight-400"
|
|
||||||
>
|
|
||||||
${{ member.contributionTier }}/month
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<span
|
|
||||||
:class="
|
|
||||||
member.slackInvited
|
|
||||||
? 'bg-candlelight-900/20 text-candlelight-400'
|
|
||||||
: 'bg-guild-800 text-guild-300'
|
|
||||||
"
|
|
||||||
class="inline-flex px-2 py-1 text-xs font-semibold rounded-full"
|
|
||||||
>
|
|
||||||
{{ member.slackInvited ? "Invited" : "Pending" }}
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-guild-400 text-ui-mono">
|
|
||||||
{{ formatDate(member.createdAt) }}
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-guild-400">
|
|
||||||
<div class="flex gap-2">
|
|
||||||
<button
|
|
||||||
@click="sendSlackInvite(member)"
|
|
||||||
class="text-candlelight-400 hover:text-candlelight-300"
|
|
||||||
>
|
|
||||||
Slack Invite
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
@click="editMember(member)"
|
|
||||||
class="text-candlelight-400 hover:text-candlelight-300"
|
|
||||||
>
|
|
||||||
Edit
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div
|
|
||||||
v-if="!pending && !error && filteredMembers.length === 0"
|
|
||||||
class="p-8 text-center text-guild-500"
|
|
||||||
>
|
|
||||||
No members found matching your criteria
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Create Member Modal -->
|
|
||||||
<div
|
|
||||||
v-if="showCreateModal"
|
|
||||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
|
||||||
>
|
|
||||||
<div class="bg-guild-900 rounded-lg shadow-xl max-w-md w-full mx-4 border border-guild-700">
|
|
||||||
<div class="px-6 py-4 border-b border-guild-700">
|
|
||||||
<h3 class="text-display-sm font-semibold text-guild-100">Add New Member</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form @submit.prevent="createMember" class="p-6 space-y-4">
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Name</label
|
|
||||||
>
|
|
||||||
<input
|
|
||||||
v-model="newMember.name"
|
|
||||||
placeholder="Full name"
|
|
||||||
required
|
|
||||||
class="w-full border border-guild-700 bg-guild-800 text-guild-100 placeholder-guild-500 rounded-lg px-3 py-2 focus:ring-2 focus:ring-candlelight-500 focus:border-transparent"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Email</label
|
|
||||||
>
|
|
||||||
<input
|
|
||||||
v-model="newMember.email"
|
|
||||||
type="email"
|
|
||||||
placeholder="email@example.com"
|
|
||||||
required
|
|
||||||
class="w-full border border-guild-700 bg-guild-800 text-guild-100 placeholder-guild-500 rounded-lg px-3 py-2 focus:ring-2 focus:ring-candlelight-500 focus:border-transparent"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Circle</label
|
|
||||||
>
|
|
||||||
<select
|
|
||||||
v-model="newMember.circle"
|
|
||||||
class="w-full border border-guild-700 bg-guild-800 text-guild-100 rounded-lg px-3 py-2 focus:ring-2 focus:ring-candlelight-500 focus:border-transparent"
|
|
||||||
>
|
|
||||||
<option value="community">Community</option>
|
|
||||||
<option value="founder">Founder</option>
|
|
||||||
<option value="practitioner">Practitioner</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label class="block text-sm font-medium text-guild-100 mb-1"
|
|
||||||
>Contribution Tier</label
|
|
||||||
>
|
|
||||||
<select
|
|
||||||
v-model="newMember.contributionTier"
|
|
||||||
class="w-full border border-guild-700 bg-guild-800 text-guild-100 rounded-lg px-3 py-2 focus:ring-2 focus:ring-candlelight-500 focus:border-transparent"
|
|
||||||
>
|
|
||||||
<option value="0">$0/month</option>
|
|
||||||
<option value="5">$5/month</option>
|
|
||||||
<option value="15">$15/month</option>
|
|
||||||
<option value="30">$30/month</option>
|
|
||||||
<option value="50">$50/month</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex justify-end gap-3 pt-4">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
@click="showCreateModal = false"
|
|
||||||
class="px-4 py-2 text-guild-400 hover:text-guild-100"
|
|
||||||
>
|
|
||||||
Cancel
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="submit"
|
|
||||||
:disabled="creating"
|
|
||||||
class="bg-candlelight-600 text-white px-4 py-2 rounded-lg hover:bg-candlelight-700 disabled:opacity-50 disabled:cursor-not-allowed"
|
|
||||||
>
|
|
||||||
{{ creating ? "Creating..." : "Create Member" }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
definePageMeta({
|
|
||||||
layout: "admin",
|
|
||||||
});
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: members,
|
|
||||||
pending,
|
|
||||||
error,
|
|
||||||
refresh,
|
|
||||||
} = await useFetch("/api/admin/members");
|
|
||||||
|
|
||||||
const searchQuery = ref("");
|
|
||||||
const circleFilter = ref("");
|
|
||||||
const showCreateModal = ref(false);
|
|
||||||
const creating = ref(false);
|
|
||||||
|
|
||||||
const newMember = reactive({
|
|
||||||
name: "",
|
|
||||||
email: "",
|
|
||||||
circle: "community",
|
|
||||||
contributionTier: "0",
|
|
||||||
});
|
|
||||||
|
|
||||||
const filteredMembers = computed(() => {
|
|
||||||
if (!members.value) return [];
|
|
||||||
|
|
||||||
return members.value.filter((member) => {
|
|
||||||
const matchesSearch =
|
|
||||||
!searchQuery.value ||
|
|
||||||
member.name.toLowerCase().includes(searchQuery.value.toLowerCase()) ||
|
|
||||||
member.email.toLowerCase().includes(searchQuery.value.toLowerCase());
|
|
||||||
|
|
||||||
const matchesCircle =
|
|
||||||
!circleFilter.value || member.circle === circleFilter.value;
|
|
||||||
|
|
||||||
return matchesSearch && matchesCircle;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const getCircleClasses = (circle) => {
|
|
||||||
const classes = {
|
|
||||||
community: "bg-candlelight-900/20 text-candlelight-400",
|
|
||||||
founder: "bg-earth-900/20 text-earth-400",
|
|
||||||
practitioner: "bg-candlelight-900/20 text-candlelight-400",
|
|
||||||
};
|
|
||||||
return classes[circle] || "bg-guild-800 text-guild-300";
|
|
||||||
};
|
|
||||||
|
|
||||||
const formatDate = (dateString) => {
|
|
||||||
return new Date(dateString).toLocaleDateString();
|
|
||||||
};
|
|
||||||
|
|
||||||
const createMember = async () => {
|
|
||||||
creating.value = true;
|
|
||||||
try {
|
|
||||||
await $fetch("/api/admin/members", {
|
|
||||||
method: "POST",
|
|
||||||
body: newMember,
|
|
||||||
});
|
|
||||||
|
|
||||||
showCreateModal.value = false;
|
|
||||||
Object.assign(newMember, {
|
|
||||||
name: "",
|
|
||||||
email: "",
|
|
||||||
circle: "community",
|
|
||||||
contributionTier: "0",
|
|
||||||
});
|
|
||||||
|
|
||||||
await refresh();
|
|
||||||
alert("Member created successfully!");
|
|
||||||
} catch (error) {
|
|
||||||
console.error("Failed to create member:", error);
|
|
||||||
alert("Failed to create member");
|
|
||||||
} finally {
|
|
||||||
creating.value = false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const sendSlackInvite = (member) => {
|
|
||||||
alert(`Slack invite functionality would send invite to ${member.email}`);
|
|
||||||
console.log("Send Slack invite to:", member.email);
|
|
||||||
};
|
|
||||||
|
|
||||||
const editMember = (member) => {
|
|
||||||
alert(`Edit functionality would open editor for ${member.name}`);
|
|
||||||
console.log("Edit member:", member._id);
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,30 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<h1>UI Component Test</h1>
|
|
||||||
|
|
||||||
<div class="space-y-4">
|
|
||||||
<!-- Basic Button Test -->
|
|
||||||
<UButton>Test Button</UButton>
|
|
||||||
|
|
||||||
<!-- Basic Card Test -->
|
|
||||||
<UCard>
|
|
||||||
<template #header>
|
|
||||||
<h3>Test Card</h3>
|
|
||||||
</template>
|
|
||||||
<p>Card content</p>
|
|
||||||
</UCard>
|
|
||||||
|
|
||||||
<!-- Basic Input Test -->
|
|
||||||
<UInput placeholder="Test input" />
|
|
||||||
|
|
||||||
<!-- Basic Table Test -->
|
|
||||||
<UTable :columns="[{key: 'name', label: 'Name'}]" :rows="[{name: 'Test'}]" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
definePageMeta({
|
|
||||||
layout: 'admin'
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,68 +0,0 @@
|
||||||
// server/api/auth/verify.get.js
|
|
||||||
import jwt from 'jsonwebtoken'
|
|
||||||
import Member from '../../models/member.js'
|
|
||||||
import { connectDB } from '../../utils/mongoose.js'
|
|
||||||
|
|
||||||
export default defineEventHandler(async (event) => {
|
|
||||||
// Connect to database
|
|
||||||
await connectDB()
|
|
||||||
|
|
||||||
const query = getQuery(event)
|
|
||||||
const { token } = query
|
|
||||||
|
|
||||||
if (!token) {
|
|
||||||
throw createError({
|
|
||||||
statusCode: 400,
|
|
||||||
statusMessage: 'Token is required'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Verify the JWT token (use runtime config for consistency with login/requireAuth)
|
|
||||||
const config = useRuntimeConfig(event)
|
|
||||||
const decoded = jwt.verify(token, config.jwtSecret)
|
|
||||||
const member = await Member.findById(decoded.memberId)
|
|
||||||
|
|
||||||
if (!member) {
|
|
||||||
throw createError({
|
|
||||||
statusCode: 404,
|
|
||||||
statusMessage: 'Member not found'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
if (member.status === 'suspended' || member.status === 'cancelled') {
|
|
||||||
throw createError({
|
|
||||||
statusCode: 403,
|
|
||||||
statusMessage: 'Account is ' + member.status
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create a new session token for the authenticated user
|
|
||||||
const sessionToken = jwt.sign(
|
|
||||||
{ memberId: member._id, email: member.email },
|
|
||||||
config.jwtSecret,
|
|
||||||
{ expiresIn: '7d' }
|
|
||||||
)
|
|
||||||
|
|
||||||
// Set the session cookie
|
|
||||||
setCookie(event, 'auth-token', sessionToken, {
|
|
||||||
httpOnly: true,
|
|
||||||
secure: process.env.NODE_ENV === 'production',
|
|
||||||
sameSite: 'lax',
|
|
||||||
maxAge: 60 * 60 * 24 * 7 // 7 days
|
|
||||||
})
|
|
||||||
|
|
||||||
// Admins go to admin dashboard, everyone else goes to coming-soon (with wiki link)
|
|
||||||
const redirectUrl = member.role === 'admin' ? '/admin' : '/coming-soon'
|
|
||||||
await sendRedirect(event, redirectUrl, 302)
|
|
||||||
|
|
||||||
} catch (err) {
|
|
||||||
if (err.statusCode && err.statusCode !== 401) {
|
|
||||||
throw err
|
|
||||||
}
|
|
||||||
throw createError({
|
|
||||||
statusCode: 401,
|
|
||||||
statusMessage: 'Invalid or expired token'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue