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

feat: add initial application structure with configuration, UI components, and state management

Browse source
This commit is contained in:
Jennie Robinson Faber 2025-08-09 18:13:16 +01:00
parent fadf94002c
commit 0af6b17792
56 changed files with 6137 additions and 129 deletions
Download patch file Download diff file Expand all files Collapse all files

138
pages/settings.vue Normal file
View file

@ -0,0 +1,138 @@
<template>
<section class="py-8 space-y-6">
<div class="flex items-center justify-between">
<h2 class="text-2xl font-semibold">Policies & Privacy</h2>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<UCard>
<template #header>
<h3 class="text-lg font-medium">Wage & Costs</h3>
</template>
<div class="space-y-4">
<div>
<label class="block text-sm font-medium mb-2">Equal Hourly Wage</label>
<UInput
v-model="policies.hourlyWage"
type="number"
:ui="{ wrapper: 'relative' }"
>
<template #leading>
<span class="text-gray-500">€</span>
</template>
</UInput>
</div>
<div>
<label class="block text-sm font-medium mb-2">Payroll On-costs (%)</label>
<UInput
v-model="policies.payrollOncost"
type="number"
:ui="{ wrapper: 'relative' }"
>
<template #trailing>
<span class="text-gray-500">%</span>
</template>
</UInput>
</div>
</div>
</UCard>
<UCard>
<template #header>
<h3 class="text-lg font-medium">Cash Management</h3>
</template>
<div class="space-y-4">
<div>
<label class="block text-sm font-medium mb-2">Savings Target (months)</label>
<UInput
v-model="policies.savingsTargetMonths"
type="number"
step="0.1"
/>
</div>
<div>
<label class="block text-sm font-medium mb-2">Minimum Cash Cushion</label>
<UInput
v-model="policies.minCashCushion"
type="number"
:ui="{ wrapper: 'relative' }"
>
<template #leading>
<span class="text-gray-500">€</span>
</template>
</UInput>
</div>
</div>
</UCard>
<UCard>
<template #header>
<h3 class="text-lg font-medium">Deferred Pay Limits</h3>
</template>
<div class="space-y-4">
<div>
<label class="block text-sm font-medium mb-2">Cap (hours per quarter)</label>
<UInput
v-model="policies.deferredCapHours"
type="number"
/>
</div>
<div>
<label class="block text-sm font-medium mb-2">Sunset (months)</label>
<UInput
v-model="policies.deferredSunsetMonths"
type="number"
/>
</div>
</div>
</UCard>
<UCard>
<template #header>
<h3 class="text-lg font-medium">Distribution Order</h3>
</template>
<div class="space-y-4">
<p class="text-sm text-gray-600">
Order of surplus distribution priorities.
</p>
<div class="space-y-2">
<div v-for="(item, index) in distributionOrder" :key="item"
class="flex items-center justify-between p-2 bg-gray-50 rounded">
<span class="text-sm font-medium">{{ index + 1 }}. {{ item }}</span>
<div class="flex gap-1">
<UButton size="xs" variant="ghost" icon="i-heroicons-chevron-up" />
<UButton size="xs" variant="ghost" icon="i-heroicons-chevron-down" />
</div>
</div>
</div>
</div>
</UCard>
</div>
<div class="flex justify-end">
<UButton color="primary">
Save Policies
</UButton>
</div>
</section>
</template>
<script setup lang="ts">
const policies = ref({
hourlyWage: 20,
payrollOncost: 25,
savingsTargetMonths: 3,
minCashCushion: 3000,
deferredCapHours: 240,
deferredSunsetMonths: 12
})
const distributionOrder = ref([
'Deferred',
'Savings',
'Hardship',
'Training',
'Patronage',
'Retained'
])
</script>