prs/prs.mobile/comal.timesheets/Modules/Site/JobDocuments/JobDocuments.xaml

<?xml version="1.0" encoding="utf-8" ?>
<timesheets:SitePage 
    xmlns:timesheets="clr-namespace:comal.timesheets"
    xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms"
             xmlns:treeview="clr-namespace:Syncfusion.XForms.TreeView;assembly=Syncfusion.SfTreeView.XForms" 
             xmlns:combobox="clr-namespace:Syncfusion.XForms.ComboBox;assembly=Syncfusion.SfComboBox.XForms"
             x:Class="comal.timesheets.JobDocuments"
             Title="Site Documents">
    <timesheets:SitePage.PageContent>
        <sfPopup:SfPopupLayout x:Name="popupLayout">
            <sfPopup:SfPopupLayout.Content>
                <Grid RowSpacing="0">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="65"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <Frame Grid.Row="0" x:Name="treeViewFrame" Padding="3" BorderColor="#a2006d" Margin="1, 2, 1, 1" CornerRadius="10" VerticalOptions="Start" HeightRequest="120">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="50"/>
                            </Grid.ColumnDefinitions>
                            <Image Grid.Column="1" x:Name="expandImg" HorizontalOptions="End" VerticalOptions="Start" Margin="0, 5, 5, 0"
                                   Source="expandd.png" HeightRequest="35" WidthRequest="35">
                                <Image.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="Expand_Tapped"/>
                                </Image.GestureRecognizers>
                            </Image>
                            <Image Grid.Column="1" x:Name="collapseImg" HorizontalOptions="End" VerticalOptions="Start" Margin="0, 5, 5, 0" IsVisible="false"
                                   Source="collapsee.png" HeightRequest="35" WidthRequest="35">
                                <Image.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="Collapse_Tapped"/>
                                </Image.GestureRecognizers>
                            </Image>
                            <treeview:SfTreeView Grid.Column="0" x:Name="treeView" ChildPropertyName="SubFiles" AutoExpandMode="AllNodesExpanded" NotificationSubscriptionMode="CollectionChange"
                                Indentation="20" SelectionChanged="Folder_Tapped" SelectionMode="Single" VerticalOptions="Start" 
                                 ExpandActionTarget="Node">
                                <treeview:SfTreeView.ItemTemplate>
                                    <DataTemplate>
                                        <Grid>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="auto"/>
                                            </Grid.RowDefinitions>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="auto"/>
                                                <ColumnDefinition Width="auto"/>
                                            </Grid.ColumnDefinitions>
                                            <Image Grid.Row="0" Grid.Column="0" Source="{Binding ImageIcon}" HeightRequest="25" WidthRequest="25"/>
                                            <Label Grid.Row="0" Grid.Column="1" Text="{Binding ItemName}" VerticalOptions="Center" FontSize="Medium" LineBreakMode="CharacterWrap"/>
                                        </Grid>
                                    </DataTemplate>
                                </treeview:SfTreeView.ItemTemplate>
                            </treeview:SfTreeView>
                        </Grid>
                    </Frame>

                    <Frame Grid.Row="1" Padding="5" BorderColor="#a2006d" Margin="1, 0, 1, 0" CornerRadius="10" VerticalOptions="Start">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="auto"/>
                            </Grid.ColumnDefinitions>

                            <Label Grid.Column="0" Text="Filters:" FontAttributes="Bold" FontSize="Medium" Margin="2, 0, 0, 0"
                                   HorizontalOptions="Start" VerticalOptions="Center"/>

                            <FlexLayout Grid.Column="1" x:Name="filterLayout"
                                        Wrap="Wrap"
                                        Direction="Row"
                                        JustifyContent="SpaceEvenly"
                                        AlignItems="Start"
                                        AlignContent="Start"/>

                            <Image Grid.Column="2" Source="filter.png" IsEnabled="False" x:Name="filterBtn"
                                   HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40" WidthRequest="40">
                                <Image.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="FilterButton_Tapped"/>
                                </Image.GestureRecognizers>
                            </Image>

                        </Grid>
                    </Frame>

                    <Frame Grid.Row="2" Padding="0" BorderColor="#a2006d" Margin="1, 0, 1, 0" CornerRadius="10" VerticalOptions="Start">
                        <Entry x:Name="searchEnt" Placeholder="Search" VerticalOptions="Center" FontSize="Medium" Margin="5" TextChanged="SearchEnt_Changed" HeightRequest="40"/>
                    </Frame>

                    <Frame Grid.Row="3" Padding="1, 7, 1, 7" BorderColor="#a2006d" Margin="1, 1, 1, 0" CornerRadius="10" VerticalOptions="FillAndExpand">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition x:Name="filesColumn" Width="*"/>
                                <ColumnDefinition x:Name="loadingColumn" Width="0"/>
                            </Grid.ColumnDefinitions>
                            <StackLayout Grid.Column="0" x:Name="filesLayout">
                                <Label x:Name="fileCountLbl" Text="Files" VerticalOptions="Center" HorizontalOptions="Center" FontAttributes="Bold" FontSize="Medium"/>
                                <ListView  x:Name="listView" HasUnevenRows="True" Margin="1">
                                    <ListView.ItemTemplate>
                                        <DataTemplate>
                                            <ViewCell Tapped="List_Tapped">
                                                <Frame HasShadow="False" Padding="1">
                                                    <Grid>
                                                        <Grid.ColumnDefinitions>
                                                            <ColumnDefinition Width="*"/>
                                                            <ColumnDefinition Width="*"/>
                                                        </Grid.ColumnDefinitions>
                                                        <Grid Grid.Column="0" Margin="10,3,1,5" HorizontalOptions="Center" VerticalOptions="Center">
                                                            <Grid.RowDefinitions>
                                                                <RowDefinition Height="auto"/>
                                                                <RowDefinition Height="auto"/>
                                                                <RowDefinition Height="auto"/>
                                                                <RowDefinition Height="auto"/>
                                                                <RowDefinition Height="auto"/>
                                                            </Grid.RowDefinitions>

                                                            <Label Grid.Row="0" Text="{Binding Type}" VerticalOptions="Center" LineBreakMode="WordWrap"
                                                            FontAttributes="Bold" TextColor="#a2006d"/>
                                                            <Label Grid.Row="1" Text="{Binding DocSetDescription}" VerticalOptions="Center" LineBreakMode="WordWrap"/>
                                                            <Label Grid.Row="2" Text="{Binding FileName}" VerticalOptions="Center" LineBreakMode="WordWrap"/>
                                                            <Label Grid.Row="3" Text="{Binding Issued}" VerticalOptions="Center" LineBreakMode="WordWrap"/>
                                                            <Label Grid.Row="4" Text="{Binding EmpName}" VerticalOptions="Center" LineBreakMode="WordWrap"/>
                                                        </Grid>

                                                        <Image Grid.Column="1" Source="{Binding ImageSource}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
                                                            HeightRequest="{Binding HeightRequest}" WidthRequest="{Binding WidthRequest}">
                                                            <Image.GestureRecognizers>
                                                                <TapGestureRecognizer Tapped="Image_Tapped" CommandParameter="{Binding .}"/>
                                                            </Image.GestureRecognizers>
                                                        </Image>
                                                    </Grid>

                                                </Frame>
                                            </ViewCell>
                                        </DataTemplate>
                                    </ListView.ItemTemplate>
                                </ListView>
                            </StackLayout>

                            <StackLayout Grid.Column="1" x:Name="loadingLayout" IsVisible="false" VerticalOptions="Center" HorizontalOptions="Center">
                                <Label x:Name="loadingLbl" HorizontalOptions="Center" VerticalOptions="Center"
                                    Text="Loading..." TextColor="#a2006d" FontSize="Large" FontAttributes="Bold"/>
                            </StackLayout>
                        </Grid>
                    </Frame>

                </Grid>
            </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>
    </timesheets:SitePage.PageContent>
</timesheets:SitePage>