Task01

Put on the ShellView a TabControl with 3 tab items:

• Dashboard (DashboardView as a Content),
• Timesheet entries (TimesheetEntriesView as a Content),
• Reports (ReportsView as a Content).

TimesheetEntriesView

In the Top-Left corner place Button 'Add'.
Place DataGrid and assign to Timesheet entries (use Database.cs and TimelyService.cs)

DataGrid should contain 8 columns:

• Date of timesheet entry (Header - Date),
• Amount of working time (Header - Time spent),
• Project name (Header - Project),
• Title of timesheet entry (Header - Title),
• Description of timesheet entry (Header - Description),
• User name (Header - User)
• Edit button (Navigates to edition window),
• Delete button (Delete existing entry).

'Date' should have format 'dd.MM.yyyy'.
'Time spent' should be bolded and aligned to right - the format is 'hh:mm'.
'Project' and 'User' should be represented by DataGridComboBoxColumn.
'Edit' and 'Delete' should be represented by DataGridTemplateColumn.

Try to use Blend for VS or Visual Studio Designer.

Hint: DataGrid columns are not represented in Visual Tree, so if you wish Bind ItemsSource to the ViewModel use something like this:

<DataGridComboBoxColumn.ElementStyle>
    <Style TargetType="{x:Type ComboBox}">
         <Setter Property="ItemsSource" 
                 Value="{Binding DataContext.Projects, 
                                 RelativeSource={RelativeSource FindAncestor, 
                                                                AncestorType={x:Type DataGrid}}}" />
    </Style>
</DataGridComboBoxColumn.ElementStyle>

TimesheetEntryView

Before you add the view, you need to install MvvmDialogs NuGet Package. After installation of this NuGet, add

• TimesheetEntryDialogViewModel (ViewModels folder),
• TimesheetEntryDialog class (Views folder),

public class TimesheetEntryDialog : IWindow
{
    private readonly TimesheetEntryView _dialog;

    public TimesheetEntryDialog()
    {
        _dialog = new TimesheetEntryView();
    }

    object IWindow.DataContext
    {
        get { return _dialog.DataContext; }
        set { _dialog.DataContext = value; }
    }

    bool? IWindow.DialogResult
    {
        get { return _dialog.DialogResult; }
        set { _dialog.DialogResult = value; }
    }

    ContentControl IWindow.Owner
    {
        get { return _dialog.Owner; }
        set { _dialog.Owner = (Window)value; }
    }

    bool? IWindow.ShowDialog()
    {
        return _dialog.ShowDialog();
    }

    void IWindow.Show()
    {
        _dialog.Show();
    }
}

• TimesheetEntryView window (Views folder)

<Window x:Class="timely.Views.TimesheetEntryView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:timely.Views"
        xmlns:vm="clr-namespace:timely.ViewModels"
        mc:Ignorable="d"
        Title="Timesheet Entry Dialog"
        WindowStartupLocation="CenterOwner"
        SizeToContent="WidthAndHeight"
        ResizeMode="NoResize"
        d:DataContext="{d:DesignInstance {x:Type vm:TimesheetEntryDialogViewModel}}">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        
        <StackPanel Grid.Row="1" 
                    Orientation="Horizontal"
                    HorizontalAlignment="Right">
            <Button Content="OK"
                    Command="{Binding OkCommand}"
                    IsDefault="True" />
            <Button Content="Cancel"
                    IsCancel="True" />
        </StackPanel>
    </Grid>
</Window>

Sample usage of MvvmDialog:

private void OnAddTimesheetEntry(object parameter)
{
    var timesheetEntryViewModel = new TimesheetEntryDialogViewModel { Entry = new TimesheetEntry() };
    bool? success = _dialogService.ShowDialog(this, timesheetEntryViewModel);

    if (success.GetValueOrDefault())
    {
                
    }
}

Please, add appropriate labels and edit controls related with TimesheetEntry properties to the TimesheetEntryView. For DateStarted, use DatePicker control and create a converter which handle conversion between DateTime and DateTime?

Lets leave TimeSpent as a TextBox - we will introduce validation in Task 2