XFEEDToolBox

<Page x:Class="XFEEDToolBox.Views.RefitModulePickerPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:controls="using:XFEEDToolBox.Controls" xmlns:fit="using:XFEEDToolBox.Core.Outfitting">
    <Grid RowSpacing="16" Padding="0,8,8,16">
        <Grid.RowDefinitions><RowDefinition Height="Auto"/><RowDefinition Height="Auto"/><RowDefinition Height="*"/><RowDefinition Height="Auto"/></Grid.RowDefinitions>
        <Grid ColumnSpacing="16"><Grid.ColumnDefinitions><ColumnDefinition Width="Auto"/><ColumnDefinition Width="*"/></Grid.ColumnDefinitions>
            <Button x:Name="PickerBackButton" Click="Back" VerticalAlignment="Center" AutomationProperties.Name="返回"><FontIcon Glyph="&#xE72B;"/></Button>
            <StackPanel Grid.Column="1" Spacing="5"><TextBlock Text="选择模块" Style="{StaticResource PageTitle}"/><controls:BilingualText Text="{x:Bind ViewModel.RefitSlotCaption,Mode=OneWay}" Original="{x:Bind ViewModel.RefitSlotOriginal,Mode=OneWay}"/><TextBlock Text="{x:Bind ViewModel.RefitSelectedModuleType.Name,Mode=OneWay}" FontSize="18" Foreground="{StaticResource AccentBrush}"/></StackPanel>
        </Grid>
        <Grid Grid.Row="1" ColumnSpacing="16"><Grid.ColumnDefinitions><ColumnDefinition Width="*"/><ColumnDefinition Width="Auto"/></Grid.ColumnDefinitions>
            <TextBox PlaceholderText="搜索适合此槽位的模块…" Text="{x:Bind ViewModel.RefitModuleSearch,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" AutomationProperties.Name="搜索兼容模块" VerticalAlignment="Center"/>
            <ToggleSwitch Grid.Column="1" Header="仅显示已拥有的模块" IsOn="{x:Bind ViewModel.RefitOwnedOnly,Mode=TwoWay}"/>
        </Grid>
        <Grid Grid.Row="2">
            <GridView x:Name="ModuleTypes" ItemsSource="{x:Bind ViewModel.RefitModuleTypes,Mode=OneWay}" ItemContainerStyle="{StaticResource ModuleCardStyle}" SelectionMode="None" IsItemClickEnabled="True" ItemClick="ChooseType" SizeChanged="ResizeCards" Visibility="{x:Bind ViewModel.RefitChoosingType,Mode=OneWay,Converter={StaticResource BoolVisibility}}" AutomationProperties.Name="兼容模块类型">
                <GridView.ItemsPanel><ItemsPanelTemplate><ItemsWrapGrid Orientation="Horizontal" ItemWidth="240" ItemHeight="220"/></ItemsPanelTemplate></GridView.ItemsPanel>
                <GridView.ItemTemplate><DataTemplate x:DataType="fit:RefitModuleType">
                    <Grid Padding="16" RowSpacing="8"><Grid.RowDefinitions><RowDefinition Height="*"/><RowDefinition Height="Auto"/></Grid.RowDefinitions>
                        <controls:ModuleIcon Item="{x:Bind IconItem}" MaxHeight="130" HorizontalAlignment="Stretch"/>
                        <StackPanel Grid.Row="1" Spacing="5"><TextBlock Text="{x:Bind Name}" FontWeight="SemiBold" TextWrapping="Wrap"/><TextBlock Text="{x:Bind OriginalName}" Style="{StaticResource MutedText}" FontSize="11" TextWrapping="Wrap"/><TextBlock Text="{x:Bind Detail}" Style="{StaticResource MutedText}" FontSize="11"/></StackPanel>
                    </Grid>
                </DataTemplate></GridView.ItemTemplate>
            </GridView>
            <GridView x:Name="ModuleModels" ItemsSource="{x:Bind ViewModel.RefitTypeModels,Mode=OneWay}" SelectedItem="{x:Bind ViewModel.RefitInstallModule,Mode=TwoWay}" ItemContainerStyle="{StaticResource ModuleCardStyle}" SelectionMode="Single" SizeChanged="ResizeCards" Visibility="{x:Bind ViewModel.RefitChoosingModel,Mode=OneWay,Converter={StaticResource BoolVisibility}}" AutomationProperties.Name="兼容模块具体型号">
                <GridView.ItemsPanel><ItemsPanelTemplate><ItemsWrapGrid Orientation="Horizontal" ItemWidth="240" ItemHeight="250"/></ItemsPanelTemplate></GridView.ItemsPanel>
                <GridView.ItemTemplate><DataTemplate x:DataType="fit:RefitModuleChoice">
                    <Grid Padding="16" RowSpacing="6"><Grid.RowDefinitions><RowDefinition Height="Auto"/><RowDefinition Height="*"/><RowDefinition Height="Auto"/></Grid.RowDefinitions>
                        <TextBlock Text="{x:Bind SlotSize}" FontSize="20" Foreground="{StaticResource AccentBrush}"/><TextBlock Text="{x:Bind CurrentGrade}" HorizontalAlignment="Right" Foreground="{StaticResource AccentBrush}"/>
                        <controls:ModuleIcon Grid.Row="1" Item="{x:Bind IconItem}" MaxHeight="125" HorizontalAlignment="Stretch"/>
                        <StackPanel Grid.Row="2" Spacing="4"><TextBlock Text="{x:Bind CardName}" FontWeight="SemiBold" TextWrapping="Wrap"/><TextBlock Text="{x:Bind CardOriginal}" Style="{StaticResource MutedText}" FontSize="11" TextWrapping="Wrap"/><TextBlock Text="{x:Bind Origin}" Style="{StaticResource MutedText}" FontSize="11" TextWrapping="Wrap"/></StackPanel>
                    </Grid>
                </DataTemplate></GridView.ItemTemplate>
            </GridView>
        </Grid>
        <Grid Grid.Row="3" ColumnSpacing="12"><Grid.ColumnDefinitions><ColumnDefinition Width="*"/><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/></Grid.ColumnDefinitions>
            <TextBlock x:Name="PickerMessage" Text="先选择模块类型，再选择具体型号。" TextWrapping="Wrap" Foreground="{StaticResource MutedBrush}" VerticalAlignment="Center"/>
            <Button Grid.Column="1" Content="卸下此模块" Click="RemoveModule"/>
            <Button x:Name="InstallButton" Grid.Column="2" Content="装入此槽位" Click="Install" Style="{StaticResource PrimaryButton}" Visibility="{x:Bind ViewModel.RefitChoosingModel,Mode=OneWay,Converter={StaticResource BoolVisibility}}"/>
        </Grid>
    </Grid>
</Page>