CoolFace
Apppublic

modish10/timekeeper-wizard

sourceHugging Faceupdated 11mo agoView on Hugging Face
0likes
Index.razor68 linesDownload Raw Back to Pages
1@page "/"2 3<div class="container mx-auto p-4">4    <div class="flex gap-4">5        <button @onclick="() => TimeFormModal.Open()" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-lg shadow">6            Time Form7        </button>8        <button @onclick="() => TermsModal.Open()" class="bg-green-500 hover:bg-green-600 text-white px-4 py-2 rounded-lg shadow">9            Terms & Conditions10        </button>11    </div>12</div>13 14<ModalForm @ref="TimeFormModal">15    <EditForm Model="@formModel" OnValidSubmit="HandleSubmit">16        <div class="space-y-4">17            <div>18                <label for="prefix" class="block text-sm font-medium text-gray-700">Prefix</label>19                <InputText @bind-Value="formModel.Prefix" id="prefix" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" />20            </div>21            <div>22                <label for="startTime" class="block text-sm font-medium text-gray-700">Start Time</label>23                <InputTime @bind-Value="formModel.StartTime" id="startTime" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" />24            </div>25            <div>26                <label for="endTime" class="block text-sm font-medium text-gray-700">End Time</label>27                <InputTime @bind-Value="formModel.EndTime" id="endTime" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" />28            </div>29            <div class="flex justify-end space-x-3 pt-4">30                <button type="button" @onclick="() => TimeFormModal.Close()" class="px-4 py-2 bg-gray-300 hover:bg-gray-400 rounded-md">31                    Cancel32                </button>33                <button type="submit" class="px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded-md">34                    Submit35                </button>36            </div>37        </div>38    </EditForm>39</ModalForm>40 41<TermsModal @ref="TermsModal" OnSubmit="HandleTermsSubmit" />42 43@code {44    private ModalForm TimeFormModal { get; set; }45    private TermsModal TermsModal { get; set; }46 47    private FormModel formModel = new();48 49    private void HandleSubmit()50    {51        Console.WriteLine($"Form submitted: {formModel.Prefix}, {formModel.StartTime}, {formModel.EndTime}");52        TimeFormModal.Close();53        // Show alert or process form data54    }55 56    private void HandleTermsSubmit(List<string> terms)57    {58        Console.WriteLine("Terms submitted: " + string.Join(", ", terms));59        // Show alert or process terms60    }61 62    private class FormModel63    {64        public string Prefix { get; set; }65        public TimeSpan? StartTime { get; set; }66        public TimeSpan? EndTime { get; set; }67    }68}