From baa4b88622fc757b9e6c74511f54cd0a9d103e68 Mon Sep 17 00:00:00 2001
From: Lightczx <1686188646@qq.com>
Date: Wed, 6 Mar 2024 17:11:23 +0800
Subject: [PATCH] refine spiralabyss team ui

---
 .../Snap.Hutao/Resource/Localization/SH.resx  |   6 +
 .../View/Page/SpiralAbyssRecordPage.xaml      | 115 ++++++++++++------
 .../Snap.Hutao/ViewModel/Complex/Team.cs      |   5 +-
 .../ViewModel/Complex/TeamAppearanceView.cs   |   4 +-
 4 files changed, 87 insertions(+), 43 deletions(-)

diff --git a/src/Snap.Hutao/Snap.Hutao/Resource/Localization/SH.resx b/src/Snap.Hutao/Snap.Hutao/Resource/Localization/SH.resx
index eb7bdfde..2450ca89 100644
--- a/src/Snap.Hutao/Snap.Hutao/Resource/Localization/SH.resx
+++ b/src/Snap.Hutao/Snap.Hutao/Resource/Localization/SH.resx
@@ -2636,6 +2636,12 @@
   <data name="ViewPageSettingWebview2Header" xml:space="preserve">
     <value>Webview2 运行时</value>
   </data>
+  <data name="ViewPageSpiralAbyssTeamAppearanceDownHeader" xml:space="preserve">
+    <value>下半</value>
+  </data>
+  <data name="ViewPageSpiralAbyssTeamAppearanceUpHeader" xml:space="preserve">
+    <value>上半</value>
+  </data>
   <data name="ViewPageWiKiAvatarArtifactSetCombinationHeader" xml:space="preserve">
     <value>搭配圣遗物</value>
   </data>
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Page/SpiralAbyssRecordPage.xaml b/src/Snap.Hutao/Snap.Hutao/View/Page/SpiralAbyssRecordPage.xaml
index 6feefaea..e7af33c6 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Page/SpiralAbyssRecordPage.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Page/SpiralAbyssRecordPage.xaml
@@ -532,14 +532,30 @@
                                     <Border
                                         Grid.Row="1"
                                         Background="{ThemeResource SolidBackgroundFillColorBaseBrush}"
+                                        BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
+                                        BorderThickness="0,1,0,0"
                                         CornerRadius="{ThemeResource ControlCornerRadiusBottom}"
                                         Opacity="0.7"/>
-                                    <TextBlock
-                                        Grid.Row="1"
-                                        Margin="4"
-                                        HorizontalAlignment="Center"
-                                        VerticalAlignment="Center"
-                                        Text="{Binding Rate}"/>
+                                    <Grid Grid.Row="1">
+                                        <Grid.ColumnDefinitions>
+                                            <ColumnDefinition Width="1*"/>
+                                            <ColumnDefinition Width="auto"/>
+                                            <ColumnDefinition Width="5*"/>
+                                        </Grid.ColumnDefinitions>
+                                        <TextBlock
+                                            Grid.Column="0"
+                                            Margin="4"
+                                            HorizontalAlignment="Center"
+                                            VerticalAlignment="Center"
+                                            Text="{Binding Rank}"/>
+                                        <AppBarSeparator Grid.Column="1" Margin="-64,-2"/>
+                                        <TextBlock
+                                            Grid.Column="2"
+                                            Margin="4"
+                                            HorizontalAlignment="Center"
+                                            VerticalAlignment="Center"
+                                            Text="{Binding Rate}"/>
+                                    </Grid>
                                 </Grid>
                             </Border>
                         </DataTemplate>
@@ -691,40 +707,59 @@
                                             <ColumnDefinition/>
                                             <ColumnDefinition/>
                                         </Grid.ColumnDefinitions>
-                                        <ListView
-                                            Grid.Column="0"
-                                            Padding="0"
-                                            ItemContainerStyle="{ThemeResource NoneSelectionListViewItemStyle}"
-                                            ItemTemplate="{StaticResource TeamItemTemplate}"
-                                            ItemsSource="{Binding Up}"
-                                            SelectionMode="None">
-                                            <ListView.ItemsPanel>
-                                                <ItemsPanelTemplate>
-                                                    <shcp:UniformPanel
-                                                        Padding="0,0,16,0"
-                                                        ColumnSpacing="6"
-                                                        MinItemWidth="240"
-                                                        RowSpacing="2"/>
-                                                </ItemsPanelTemplate>
-                                            </ListView.ItemsPanel>
-                                        </ListView>
-                                        <ListView
-                                            Grid.Column="1"
-                                            Padding="0"
-                                            ItemContainerStyle="{ThemeResource NoneSelectionListViewItemStyle}"
-                                            ItemTemplate="{StaticResource TeamItemTemplate}"
-                                            ItemsSource="{Binding Down}"
-                                            SelectionMode="None">
-                                            <ListView.ItemsPanel>
-                                                <ItemsPanelTemplate>
-                                                    <shcp:UniformPanel
-                                                        Padding="0,0,16,0"
-                                                        ColumnSpacing="6"
-                                                        MinItemWidth="240"
-                                                        RowSpacing="2"/>
-                                                </ItemsPanelTemplate>
-                                            </ListView.ItemsPanel>
-                                        </ListView>
+                                        <cwc:HeaderedContentControl Grid.Column="0">
+                                            <cwc:HeaderedContentControl.Header>
+                                                <Border Margin="0,0,16,0" Style="{ThemeResource BorderCardStyle}">
+                                                    <TextBlock
+                                                        Margin="0,8"
+                                                        HorizontalAlignment="Center"
+                                                        Text="{shcm:ResourceString Name=ViewPageSpiralAbyssTeamAppearanceUpHeader}"/>
+                                                </Border>
+                                            </cwc:HeaderedContentControl.Header>
+                                            <ListView
+                                                Padding="0"
+                                                ItemContainerStyle="{ThemeResource NoneSelectionListViewItemStyle}"
+                                                ItemTemplate="{StaticResource TeamItemTemplate}"
+                                                ItemsSource="{Binding Up}"
+                                                SelectionMode="None">
+                                                <ListView.ItemsPanel>
+                                                    <ItemsPanelTemplate>
+                                                        <shcp:UniformPanel
+                                                            Padding="0,0,16,0"
+                                                            ColumnSpacing="6"
+                                                            MinItemWidth="240"
+                                                            RowSpacing="2"/>
+                                                    </ItemsPanelTemplate>
+                                                </ListView.ItemsPanel>
+                                            </ListView>
+                                        </cwc:HeaderedContentControl>
+
+                                        <cwc:HeaderedContentControl Grid.Column="1">
+                                            <cwc:HeaderedContentControl.Header>
+                                                <Border Margin="0,0,16,0" Style="{ThemeResource BorderCardStyle}">
+                                                    <TextBlock
+                                                        Margin="0,8"
+                                                        HorizontalAlignment="Center"
+                                                        Text="{shcm:ResourceString Name=ViewPageSpiralAbyssTeamAppearanceDownHeader}"/>
+                                                </Border>
+                                            </cwc:HeaderedContentControl.Header>
+                                            <ListView
+                                                Padding="0"
+                                                ItemContainerStyle="{ThemeResource NoneSelectionListViewItemStyle}"
+                                                ItemTemplate="{StaticResource TeamItemTemplate}"
+                                                ItemsSource="{Binding Down}"
+                                                SelectionMode="None">
+                                                <ListView.ItemsPanel>
+                                                    <ItemsPanelTemplate>
+                                                        <shcp:UniformPanel
+                                                            Padding="0,0,16,0"
+                                                            ColumnSpacing="6"
+                                                            MinItemWidth="240"
+                                                            RowSpacing="2"/>
+                                                    </ItemsPanelTemplate>
+                                                </ListView.ItemsPanel>
+                                            </ListView>
+                                        </cwc:HeaderedContentControl>
                                     </Grid>
                                 </Grid>
                             </Border>
diff --git a/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/Team.cs b/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/Team.cs
index 19a7e5bc..f1cec9d8 100644
--- a/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/Team.cs
+++ b/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/Team.cs
@@ -21,7 +21,7 @@ internal sealed class Team : List<AvatarView>
     /// </summary>
     /// <param name="team">队伍</param>
     /// <param name="idAvatarMap">映射</param>
-    public Team(ItemRate<string, int> team, Dictionary<AvatarId, Avatar> idAvatarMap)
+    public Team(ItemRate<string, int> team, Dictionary<AvatarId, Avatar> idAvatarMap, int rank)
         : base(4)
     {
         foreach (StringSegment item in new StringTokenizer(team.Item, [',']))
@@ -33,10 +33,13 @@ internal sealed class Team : List<AvatarView>
         AddRange(new AvatarView[4 - Count]);
 
         Rate = SH.FormatModelBindingHutaoTeamUpCountFormat(team.Rate);
+        Rank = rank;
     }
 
     /// <summary>
     /// 上场次数
     /// </summary>
     public string Rate { get; }
+
+    public int Rank { get; set; }
 }
\ No newline at end of file
diff --git a/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/TeamAppearanceView.cs b/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/TeamAppearanceView.cs
index 58ff9c2c..8cdd1f1e 100644
--- a/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/TeamAppearanceView.cs
+++ b/src/Snap.Hutao/Snap.Hutao/ViewModel/Complex/TeamAppearanceView.cs
@@ -21,8 +21,8 @@ internal sealed class TeamAppearanceView
     public TeamAppearanceView(TeamAppearance teamRank, Dictionary<AvatarId, Avatar> idAvatarMap)
     {
         Floor = SH.FormatModelBindingHutaoComplexRankFloor(teamRank.Floor);
-        Up = teamRank.Up.SelectList(teamRate => new Team(teamRate, idAvatarMap));
-        Down = teamRank.Down.SelectList(teamRate => new Team(teamRate, idAvatarMap));
+        Up = teamRank.Up.SelectList((teamRate, index) => new Team(teamRate, idAvatarMap, index + 1));
+        Down = teamRank.Down.SelectList((teamRate, index) => new Team(teamRate, idAvatarMap, index + 1));
     }
 
     /// <summary>