Readying for design
This commit is contained in:
parent
d73256ca2b
commit
fadf473dde
50 changed files with 1478 additions and 1259 deletions
|
|
@ -1,45 +1,45 @@
|
|||
<template>
|
||||
<div>
|
||||
<h1 class="text-2xl font-bold mb-6">Members</h1>
|
||||
|
||||
<div v-if="pending" class="text-center">Loading...</div>
|
||||
|
||||
<div v-else-if="error" class="text-red-600">
|
||||
<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-white rounded-lg border p-4">
|
||||
<h3 class="font-semibold mb-2">Total Members: {{ members?.length || 0 }}</h3>
|
||||
|
||||
<div v-for="member in members" :key="member._id" class="border-b pb-2 mb-2 last:border-b-0">
|
||||
<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">{{ member.name }}</p>
|
||||
<p class="text-gray-600 text-sm">{{ member.email }}</p>
|
||||
<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-blue-100 text-blue-800">
|
||||
<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-gray-500">${{ member.contributionTier }}/month</p>
|
||||
<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-white rounded-lg border p-4">
|
||||
<h3 class="font-semibold mb-4">Add Member</h3>
|
||||
<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 rounded p-2" />
|
||||
<input v-model="newMember.email" placeholder="Email" class="border rounded p-2" />
|
||||
<select v-model="newMember.circle" class="border rounded p-2">
|
||||
<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 rounded p-2">
|
||||
<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>
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
<option value="50">$50/month</option>
|
||||
</select>
|
||||
</div>
|
||||
<button @click="createMember" :disabled="creating" class="mt-4 bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 disabled:opacity-50">
|
||||
<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>
|
||||
|
|
@ -75,21 +75,21 @@ const createMember = async () => {
|
|||
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) {
|
||||
|
|
@ -98,4 +98,4 @@ const createMember = async () => {
|
|||
creating.value = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue