<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="GMCabsDriverAssistantSolution.Views.ImeiNumberInstallPage"
             xmlns:models="clr-namespace:GMCabsDriverAssistant.Models"
             xmlns:vm="clr-namespace:GMCabsDriverAssistantSolution.ViewModels" x:DataType="vm:ImeiNumberInstallViewModel"
             xmlns:custom="clr-namespace:GMCabsDriverAssistantSolution.CustomControls"
             Shell.FlyoutBehavior="Disabled"
             Shell.BackgroundColor="{StaticResource Primary}"
             Title="{Binding Title}">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Style x:Key="EntryStyle" TargetType="Entry">
                <Setter Property="TextColor" Value="#000"></Setter>
                <Setter Property="PlaceholderColor" Value="#9999"></Setter>
                <Setter Property="TranslationY"  Value="1" />
                <Setter Property="MinimumHeightRequest" Value="36" />
            </Style>
            <Style x:Key="NoUnderlineEntryFrameStyle" TargetType="Frame">
                <Setter Property="Padding">
                    <OnPlatform x:TypeArguments="Thickness">
                        <On Platform="Android">16,4</On>
                        <On Platform="iOS">16</On>
                    </OnPlatform>
                </Setter>
                <Setter Property="CornerRadius" Value="12"></Setter>
                <Setter Property="Margin" Value="4,8,4,4"></Setter>
                <Setter Property="HasShadow" Value="True"></Setter>
                <Setter Property="MinimumHeightRequest" Value="50" />
                <Setter Property="BackgroundColor" Value="White" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Orientation="Horizontal" 
                     BackgroundColor="#DCDCDC">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <StackLayout Grid.Row="0" Grid.Column="0" 
                     Orientation="Vertical"
                     Padding="50,5,20,5"
                     BackgroundColor="#DCDCDC">
                    <StackLayout.Padding>
                        <OnPlatform x:TypeArguments="Thickness">
                            <On Platform="Android">20</On>
                            <On Platform="iOS">20,60</On>
                        </OnPlatform>
                    </StackLayout.Padding>
                    <Frame Style="{StaticResource NoUnderlineEntryFrameStyle}">
                        <Grid MinimumHeightRequest="50">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <custom:NoUnderlineEntry x:Name="Pin"
                                             Grid.Column="0"                                             
                                             FontSize="20"
                                             Keyboard="Numeric"   
                                             Placeholder="Imei No Installed To"
                                             IsPassword="False"
                                             TextChanged="EntryTextChanged"
                                             Style="{StaticResource EntryStyle}"/>
                        </Grid>
                    </Frame>
                    <StackLayout Orientation="Horizontal" Margin="0,50,0,0" VerticalOptions="StartAndExpand" x:DataType="vm:ImeiNumberInstallViewModel">
                        <CollectionView ItemsSource="{Binding ImeiNumberLists}">
                            <CollectionView.ItemsLayout>
                                <LinearItemsLayout Orientation="Vertical" ItemSpacing="10" />
                            </CollectionView.ItemsLayout>
                            <CollectionView.ItemTemplate>
                                <DataTemplate>
                                    <StackLayout x:DataType="models:ImeiDto" Orientation="Vertical">
                                        <Button
                                                    WidthRequest="430"
                                                    HorizontalOptions="StartAndExpand"
                                                    FontSize="20"
                                                    Text="{Binding ImeiNumber}"
                                                    TextColor="White"
                                                    Command="{Binding Source={RelativeSource AncestorType={x:Type vm:ImeiNumberInstallViewModel}}, Path=SelectImei}"
                                                    CommandParameter="{Binding .}"/>
                                    </StackLayout>
                                </DataTemplate>
                            </CollectionView.ItemTemplate>
                        </CollectionView>
                    </StackLayout>

                </StackLayout>
                <StackLayout Grid.Row="0" Grid.Column="1" 
                             Orientation="Vertical" BackgroundColor="#DCDCDC">

                    <StackLayout Orientation="Horizontal" VerticalOptions="EndAndExpand" Margin="90,0,50,20" IsVisible="{Binding IsSelectImeiDetailsVisisble}">
                        <Label Text="Selected IMEI" 
                               VerticalTextAlignment="Center"
                               HorizontalOptions="CenterAndExpand"
                               FontSize="35"/>
                    </StackLayout>
                    <StackLayout Margin="90,0,50,20" IsVisible="{Binding IsSelectImeiDetailsVisisble}">
                        <Label Text="{Binding SelectedImei}" 
                               VerticalTextAlignment="Center"
                               HorizontalOptions="CenterAndExpand"
                               FontSize="28"/>
                    </StackLayout>
                    <StackLayout Margin="90,0,50,20" IsVisible="{Binding IsSelectImeiDetailsVisisble}">
                        <Button 
                               HorizontalOptions="CenterAndExpand"
                               FontSize="18"
                               Text="Completed Installation"
                               TextColor="White" 
                               Clicked="CompleteImeiInstallation_Clicked"/>
                    </StackLayout>

                    <FlexLayout Direction="Row" VerticalOptions="EndAndExpand" Margin="-20,0,20,20" AlignItems="End" AlignContent="Center">
                        <FlexLayout FlexLayout.Grow="1" Wrap="Wrap" Padding="10,10,10,10" Margin="0,0,20,0">
                            <FlexLayout FlexLayout.Grow="1" Direction="Column">
                                <Label Text="Installed Imei" 
                                   VerticalTextAlignment="Start"
                                   FontSize="16"
                                   Margin="0,0,10,0"/>
                                <Label Text="{Binding InstalledImei}" 
                                   VerticalTextAlignment="Start"
                                   FontSize="20"/>
                            </FlexLayout>
                            <Button Text="Clear" WidthRequest="100" HeightRequest="45" Clicked="ClearImeiButton_Clicked" IsVisible="{Binding InstalledImeiExists}"/>
                        </FlexLayout>
                        <Image HeightRequest="60"
                               Margin="20,0,0,0"
                               Source="gmlogo_tablet.png" 
                               Scale="1.0"/>
                    </FlexLayout>
                </StackLayout>
            </Grid>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>