jennie/app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: update application configuration and UI components for improved styling and functionality

Browse source
This commit is contained in:
Jennie Robinson Faber 2025-08-16 08:13:35 +01:00
parent 0af6b17792
commit 37ab8d7bab
54 changed files with 23293 additions and 1666 deletions
Download patch file Download diff file Expand all files Collapse all files

114
pages/session.vue
View file

@ -36,16 +36,22 @@
</template>
<div class="space-y-3">
<div class="flex justify-between text-sm">
<span class="text-gray-600">Surplus</span>
<span class="font-medium text-green-600">€1,200</span>
<span class="text-neutral-600">Surplus</span>
<span class="font-medium text-green-600"
>€{{ availableAmounts.surplus.toLocaleString() }}</span
>
</div>
<div class="flex justify-between text-sm">
<span class="text-gray-600">Deferred owed</span>
<span class="font-medium text-orange-600">€800</span>
<span class="text-neutral-600">Deferred owed</span>
<span class="font-medium text-orange-600"
>€{{ availableAmounts.deferredOwed.toLocaleString() }}</span
>
</div>
<div class="flex justify-between text-sm">
<span class="text-gray-600">Savings target</span>
<span class="font-medium text-blue-600">€2,000</span>
<span class="text-neutral-600">Savings gap</span>
<span class="font-medium text-blue-600"
>€{{ availableAmounts.savingsNeeded.toLocaleString() }}</span
>
</div>
</div>
</UCard>
@ -57,19 +63,32 @@
<div class="space-y-4">
<div>
<label class="block text-xs font-medium mb-1">Deferred Repay</label>
<UInput v-model="distribution.deferred" type="number" size="sm" />
<UInput
v-model.number="draftAllocations.deferredRepay"
type="number"
size="sm" />
</div>
<div>
<label class="block text-xs font-medium mb-1">Savings</label>
<UInput v-model="distribution.savings" type="number" size="sm" />
<UInput
v-model.number="draftAllocations.savings"
type="number"
size="sm" />
</div>
<div>
<label class="block text-xs font-medium mb-1">Training</label>
<UInput v-model="distribution.training" type="number" size="sm" />
<UInput
v-model.number="draftAllocations.training"
type="number"
size="sm" />
</div>
<div>
<label class="block text-xs font-medium mb-1">Retained</label>
<UInput v-model="distribution.retained" type="number" size="sm" readonly />
<UInput
v-model.number="draftAllocations.retained"
type="number"
size="sm"
readonly />
</div>
</div>
</UCard>
@ -83,12 +102,9 @@
<UTextarea
v-model="rationale"
placeholder="Brief rationale for this month's distribution decisions..."
rows="3"
/>
rows="3" />
<div class="flex justify-end gap-3">
<UButton variant="ghost">
Save Draft
</UButton>
<UButton variant="ghost"> Save Draft </UButton>
<UButton color="primary" :disabled="!allChecklistComplete">
Complete Session
</UButton>
@ -99,23 +115,59 @@
</template>
<script setup lang="ts">
const checklist = ref({
monthClosed: false,
contributionsLogged: false,
surplusCalculated: false,
needsReviewed: false
})
// Use stores
const sessionStore = useSessionStore();
const membersStore = useMembersStore();
const policiesStore = usePoliciesStore();
const budgetStore = useBudgetStore();
const streamsStore = useStreamsStore();
const distribution = ref({
deferred: 800,
savings: 400,
training: 0,
retained: 0
})
const rationale = ref('')
// Use store refs
const { checklist, draftAllocations, rationale, availableAmounts } =
storeToRefs(sessionStore);
const allChecklistComplete = computed(() => {
return Object.values(checklist.value).every(Boolean)
})
return Object.values(checklist.value).every(Boolean);
});
// Calculate available amounts from real data
const calculatedAvailableAmounts = computed(() => {
// Calculate surplus from budget metrics
const totalRevenue = streamsStore.totalMonthlyAmount || 0;
const totalHours = membersStore.capacityTotals.targetHours || 0;
const hourlyWage = policiesStore.equalHourlyWage || 0;
const oncostPct = policiesStore.payrollOncostPct || 0;
const totalPayroll = totalHours * hourlyWage * (1 + oncostPct / 100);
const totalOverhead = budgetStore.overheadCosts.reduce(
(sum, cost) => sum + (cost.amount || 0),
0
);
const surplus = Math.max(0, totalRevenue - totalPayroll - totalOverhead);
// Calculate deferred owed
const deferredOwed = membersStore.members.reduce((sum, member) => {
return sum + (member.deferredHours || 0) * hourlyWage;
}, 0);
// Calculate savings gap
const savingsTarget =
(policiesStore.savingsTargetMonths || 0) * (totalPayroll + totalOverhead);
const savingsNeeded = Math.max(0, savingsTarget);
return {
surplus,
deferredOwed,
savingsNeeded,
};
});
// Update store available amounts when calculated values change
watch(
calculatedAvailableAmounts,
(newAmounts) => {
sessionStore.updateAvailableAmounts(newAmounts);
},
{ immediate: true }
);
</script>