335 lines
18 KiB
XML
335 lines
18 KiB
XML
<UserControl x:Class="UtopiaCanteenSystem.Views.ScannerDashboardView"
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
|
|
|
<UserControl.Resources>
|
|
<SolidColorBrush x:Key="AccentBrush" Color="#5BA3A0"/>
|
|
<SolidColorBrush x:Key="AccentBorderBrush" Color="#995BA3A0"/>
|
|
<SolidColorBrush x:Key="MutedTextBrush" Color="#718096"/>
|
|
<SolidColorBrush x:Key="TitleTextBrush" Color="#2D3748"/>
|
|
<SolidColorBrush x:Key="ErrorTextBrush" Color="#E53E3E"/>
|
|
<SolidColorBrush x:Key="ConnectedBrush" Color="#38A169"/>
|
|
<SolidColorBrush x:Key="SuccessTextBrush" Color="#38A169"/>
|
|
|
|
<Style x:Key="RoundedButtonStyle" TargetType="Button">
|
|
<Setter Property="Foreground" Value="White"/>
|
|
<Setter Property="Background" Value="{StaticResource AccentBrush}"/>
|
|
<Setter Property="BorderThickness" Value="0"/>
|
|
<Setter Property="FontSize" Value="18"/>
|
|
<Setter Property="FontWeight" Value="Bold"/>
|
|
<Setter Property="Padding" Value="24,12"/>
|
|
<Setter Property="MinHeight" Value="50"/>
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="Button">
|
|
<Border Background="{TemplateBinding Background}"
|
|
CornerRadius="8"
|
|
SnapsToDevicePixels="True">
|
|
<ContentPresenter HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"/>
|
|
</Border>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
<Style x:Key="SecondaryButtonStyle" TargetType="Button">
|
|
<Setter Property="Foreground" Value="{StaticResource TitleTextBrush}"/>
|
|
<Setter Property="Background" Value="#f4f7f7"/>
|
|
<Setter Property="BorderBrush" Value="#e2e8f0"/>
|
|
<Setter Property="BorderThickness" Value="1"/>
|
|
<Setter Property="FontSize" Value="16"/>
|
|
<Setter Property="FontWeight" Value="SemiBold"/>
|
|
<Setter Property="Padding" Value="20,12"/>
|
|
<Setter Property="MinHeight" Value="50"/>
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="Button">
|
|
<Border x:Name="ButtonBorder"
|
|
Background="{TemplateBinding Background}"
|
|
BorderBrush="{TemplateBinding BorderBrush}"
|
|
BorderThickness="{TemplateBinding BorderThickness}"
|
|
CornerRadius="8">
|
|
<ContentPresenter HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"/>
|
|
</Border>
|
|
<ControlTemplate.Triggers>
|
|
<Trigger Property="IsMouseOver" Value="True">
|
|
<Setter TargetName="ButtonBorder" Property="Background" Value="#eef2f2"/>
|
|
</Trigger>
|
|
<Trigger Property="IsPressed" Value="True">
|
|
<Setter TargetName="ButtonBorder" Property="Background" Value="#e6eded"/>
|
|
</Trigger>
|
|
</ControlTemplate.Triggers>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
<Style x:Key="LogoutLinkButtonStyle" TargetType="Button">
|
|
<Setter Property="Background" Value="Transparent"/>
|
|
<Setter Property="BorderThickness" Value="0"/>
|
|
<Setter Property="Foreground" Value="{StaticResource MutedTextBrush}"/>
|
|
<Setter Property="FontSize" Value="14"/>
|
|
<Setter Property="FontWeight" Value="SemiBold"/>
|
|
<Setter Property="Padding" Value="0"/>
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="Button">
|
|
<Border Background="{TemplateBinding Background}">
|
|
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
|
|
</Border>
|
|
<ControlTemplate.Triggers>
|
|
<Trigger Property="IsMouseOver" Value="True">
|
|
<Setter Property="Foreground" Value="{StaticResource TitleTextBrush}"/>
|
|
</Trigger>
|
|
<Trigger Property="IsPressed" Value="True">
|
|
<Setter Property="Opacity" Value="0.75"/>
|
|
</Trigger>
|
|
</ControlTemplate.Triggers>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
<Style x:Key="StatusTextStyle" TargetType="TextBlock">
|
|
<Setter Property="Foreground" Value="{StaticResource MutedTextBrush}"/>
|
|
<Setter Property="FontSize" Value="14"/>
|
|
<Setter Property="FontWeight" Value="SemiBold"/>
|
|
<Style.Triggers>
|
|
<DataTrigger Binding="{Binding ScannerStatus}" Value="Connected">
|
|
<Setter Property="Foreground" Value="{StaticResource ConnectedBrush}"/>
|
|
</DataTrigger>
|
|
</Style.Triggers>
|
|
</Style>
|
|
|
|
<Style x:Key="StatusIconStyle" TargetType="TextBlock">
|
|
<Setter Property="FontFamily" Value="Segoe MDL2 Assets"/>
|
|
<Setter Property="FontSize" Value="16"/>
|
|
<Setter Property="FontWeight" Value="SemiBold"/>
|
|
<Setter Property="VerticalAlignment" Value="Center"/>
|
|
<Setter Property="Text" Value=""/>
|
|
<Setter Property="Foreground" Value="{StaticResource ErrorTextBrush}"/>
|
|
<Style.Triggers>
|
|
<DataTrigger Binding="{Binding ScannerStatus}" Value="Connected">
|
|
<Setter Property="Foreground" Value="{StaticResource ConnectedBrush}"/>
|
|
</DataTrigger>
|
|
</Style.Triggers>
|
|
</Style>
|
|
|
|
<Style x:Key="StatusBorderStyle" TargetType="Border">
|
|
<Setter Property="Background" Value="#dcfce7"/>
|
|
<Setter Property="BorderBrush" Value="#86efac"/>
|
|
<Setter Property="BorderThickness" Value="1"/>
|
|
<Setter Property="CornerRadius" Value="8"/>
|
|
<Setter Property="Padding" Value="14"/>
|
|
<Style.Triggers>
|
|
<DataTrigger Binding="{Binding IsSuccess}" Value="False">
|
|
<Setter Property="Background" Value="#fee2e2"/>
|
|
<Setter Property="BorderBrush" Value="#fca5a5"/>
|
|
</DataTrigger>
|
|
</Style.Triggers>
|
|
</Style>
|
|
</UserControl.Resources>
|
|
|
|
<Grid Background="#F0F2F5">
|
|
<ScrollViewer VerticalScrollBarVisibility="Auto"
|
|
HorizontalScrollBarVisibility="Disabled"
|
|
Padding="40">
|
|
<Border HorizontalAlignment="Center"
|
|
VerticalAlignment="Top"
|
|
Width="{Binding RelativeSource={RelativeSource AncestorType=ScrollViewer}, Path=ViewportWidth}"
|
|
MaxWidth="900"
|
|
Padding="40"
|
|
Background="White"
|
|
CornerRadius="12">
|
|
<Border.Effect>
|
|
<DropShadowEffect BlurRadius="24"
|
|
ShadowDepth="0"
|
|
Opacity="0.08"
|
|
Color="#000000"/>
|
|
</Border.Effect>
|
|
|
|
<Grid>
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
</Grid.RowDefinitions>
|
|
|
|
<!-- Top section -->
|
|
<StackPanel Grid.Row="0" HorizontalAlignment="Center">
|
|
<Image Source="pack://siteoforigin:,,,/assets/scanner.png"
|
|
Height="120"
|
|
MaxWidth="320"
|
|
Stretch="Uniform"
|
|
Margin="0,0,0,10"/>
|
|
<TextBlock Text="Utopia Canteen System"
|
|
FontSize="32"
|
|
FontWeight="Bold"
|
|
Foreground="{StaticResource TitleTextBrush}"
|
|
HorizontalAlignment="Center"/>
|
|
<TextBlock Text="Scan your card to record"
|
|
FontSize="16"
|
|
Foreground="{StaticResource MutedTextBrush}"
|
|
HorizontalAlignment="Center"
|
|
Margin="0,8,0,0"/>
|
|
</StackPanel>
|
|
|
|
<!-- Scanner input -->
|
|
<StackPanel Grid.Row="1" Margin="0,24,0,0">
|
|
<Border MinHeight="50"
|
|
CornerRadius="8"
|
|
BorderBrush="{StaticResource AccentBorderBrush}"
|
|
BorderThickness="2">
|
|
<Grid>
|
|
<TextBox x:Name="RfidInputTextBox"
|
|
Text="{Binding CardIdInput, UpdateSourceTrigger=PropertyChanged}"
|
|
Background="Transparent"
|
|
BorderThickness="0"
|
|
FontSize="18"
|
|
MinHeight="50"
|
|
VerticalContentAlignment="Center"
|
|
HorizontalContentAlignment="Center"
|
|
Focusable="True"
|
|
KeyDown="RfidInputTextBox_OnKeyDown"
|
|
LostKeyboardFocus="RfidInputTextBox_OnLostKeyboardFocus"/>
|
|
<TextBlock Text="Scan Card ID"
|
|
Foreground="Gray"
|
|
FontSize="18"
|
|
VerticalAlignment="Center"
|
|
HorizontalAlignment="Center"
|
|
TextAlignment="Center"
|
|
IsHitTestVisible="False"
|
|
Visibility="{Binding IsWatermarkVisible, Converter={StaticResource BoolToVisibility}}"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<Button Content="SCAN"
|
|
Command="{Binding ScanCommand}"
|
|
Margin="0,16,0,0"
|
|
HorizontalAlignment="Stretch"
|
|
Style="{StaticResource RoundedButtonStyle}"/>
|
|
</StackPanel>
|
|
|
|
<!-- Status row + timestamp -->
|
|
<StackPanel Grid.Row="2" Margin="0,18,0,0" HorizontalAlignment="Center">
|
|
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
|
|
<TextBlock Style="{StaticResource StatusIconStyle}" Margin="0,0,8,0"/>
|
|
<TextBlock Text="{Binding ScannerStatusDisplay}" Style="{StaticResource StatusTextStyle}"/>
|
|
</StackPanel>
|
|
<TextBlock Text="{Binding CurrentTime}"
|
|
FontSize="14"
|
|
Foreground="{StaticResource MutedTextBrush}"
|
|
Margin="0,10,0,0"
|
|
HorizontalAlignment="Center"/>
|
|
</StackPanel>
|
|
|
|
<!-- Divider -->
|
|
<Border Grid.Row="3"
|
|
Height="1"
|
|
Background="#e2e8f0"
|
|
Margin="0,24,0,24"/>
|
|
|
|
<!-- Dashboard section -->
|
|
<Grid Grid.Row="4">
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
</Grid.RowDefinitions>
|
|
|
|
<Border Grid.Row="0" Background="#f4f7f7" CornerRadius="8" Padding="24" Margin="0,0,0,16">
|
|
<StackPanel HorizontalAlignment="Center">
|
|
<TextBlock Text="{Binding TodaysScans}"
|
|
FontSize="56"
|
|
FontWeight="Bold"
|
|
Foreground="{StaticResource TitleTextBrush}"
|
|
HorizontalAlignment="Center"/>
|
|
<TextBlock Text="Today's Scans"
|
|
FontSize="16"
|
|
Foreground="{StaticResource MutedTextBrush}"
|
|
HorizontalAlignment="Center"
|
|
Margin="0,6,0,0"/>
|
|
</StackPanel>
|
|
</Border>
|
|
|
|
<Border Grid.Row="1" BorderBrush="#e2e8f0" BorderThickness="1" CornerRadius="8" Padding="16" Margin="0,0,0,16">
|
|
<Grid>
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="Auto"/>
|
|
</Grid.RowDefinitions>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*"/>
|
|
<ColumnDefinition Width="*"/>
|
|
</Grid.ColumnDefinitions>
|
|
|
|
<StackPanel Grid.Row="0" Grid.Column="0" Margin="0,0,12,12">
|
|
<TextBlock Text="LAST CARD ID" FontSize="12" Foreground="{StaticResource MutedTextBrush}" FontWeight="SemiBold"/>
|
|
<TextBlock Text="{Binding LastCardId}" FontSize="20" FontWeight="SemiBold" Foreground="{StaticResource TitleTextBrush}" />
|
|
</StackPanel>
|
|
|
|
<StackPanel Grid.Row="0" Grid.Column="1" Margin="12,0,0,12">
|
|
<TextBlock Text="LAST SCAN TIME" FontSize="12" Foreground="{StaticResource MutedTextBrush}" FontWeight="SemiBold"/>
|
|
<TextBlock Text="{Binding LastScanTimeDisplay}" FontSize="20" FontWeight="SemiBold" Foreground="{StaticResource TitleTextBrush}" />
|
|
</StackPanel>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<Border Grid.Row="2" Style="{StaticResource StatusBorderStyle}">
|
|
<TextBlock Text="{Binding Message}"
|
|
FontSize="16"
|
|
FontWeight="SemiBold"
|
|
Foreground="{StaticResource SuccessTextBrush}">
|
|
<TextBlock.Style>
|
|
<Style TargetType="TextBlock">
|
|
<Setter Property="Foreground" Value="{StaticResource SuccessTextBrush}"/>
|
|
<Style.Triggers>
|
|
<DataTrigger Binding="{Binding IsSuccess}" Value="False">
|
|
<Setter Property="Foreground" Value="{StaticResource ErrorTextBrush}"/>
|
|
</DataTrigger>
|
|
</Style.Triggers>
|
|
</Style>
|
|
</TextBlock.Style>
|
|
</TextBlock>
|
|
</Border>
|
|
</Grid>
|
|
|
|
<!-- Bottom row -->
|
|
<Grid Grid.Row="5" Margin="0,24,0,0">
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto"/>
|
|
<ColumnDefinition Width="*"/>
|
|
<ColumnDefinition Width="Auto"/>
|
|
</Grid.ColumnDefinitions>
|
|
|
|
<Button Grid.Column="0"
|
|
Content="Settings"
|
|
Command="{Binding OpenSettingsCommand}"
|
|
Style="{StaticResource SecondaryButtonStyle}"
|
|
Visibility="{Binding IsAdminAuthenticated, Converter={StaticResource BoolToVisibility}}"
|
|
Focusable="False"
|
|
IsTabStop="False"/>
|
|
|
|
<Button Grid.Column="2"
|
|
Command="{Binding LogoutCommand}"
|
|
Style="{StaticResource LogoutLinkButtonStyle}"
|
|
Focusable="False"
|
|
IsTabStop="False">
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="⎋" FontSize="14" Margin="0,0,8,0" VerticalAlignment="Center"/>
|
|
<TextBlock Text="Logout" FontSize="14" VerticalAlignment="Center"/>
|
|
</StackPanel>
|
|
</Button>
|
|
</Grid>
|
|
</Grid>
|
|
</Border>
|
|
</ScrollViewer>
|
|
</Grid>
|
|
</UserControl>
|
|
|