You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
201 lines
10 KiB
201 lines
10 KiB
<reactive:ReactiveUserControl xmlns="https://github.com/avaloniaui"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
|
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
|
xmlns:vm="using:MyAvaloniaApp.ViewModels.Pages"
|
|
xmlns:converters="using:MyAvaloniaApp.Converters"
|
|
xmlns:reactive="clr-namespace:Avalonia.ReactiveUI;assembly=Avalonia.ReactiveUI"
|
|
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="600"
|
|
x:Class="MyAvaloniaApp.Views.Pages.UsersPageView"
|
|
x:DataType="vm:UsersPageViewModel">
|
|
|
|
<Design.DataContext>
|
|
<vm:UsersPageViewModel />
|
|
</Design.DataContext>
|
|
|
|
<Grid>
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="*"/>
|
|
</Grid.RowDefinitions>
|
|
|
|
<!-- 操作按钮 -->
|
|
<StackPanel Grid.Row="0"
|
|
Orientation="Horizontal"
|
|
Spacing="10"
|
|
Margin="0,0,0,20">
|
|
<Button Background="#27AE60"
|
|
Foreground="White"
|
|
BorderThickness="0"
|
|
CornerRadius="5"
|
|
Padding="15,10">
|
|
<StackPanel Orientation="Horizontal" Spacing="5">
|
|
<TextBlock Text="➕" FontSize="14"/>
|
|
<TextBlock Text="添加用户" FontSize="14"/>
|
|
</StackPanel>
|
|
</Button>
|
|
<Button Background="#3498DB"
|
|
Foreground="White"
|
|
BorderThickness="0"
|
|
CornerRadius="5"
|
|
Padding="15,10">
|
|
<StackPanel Orientation="Horizontal" Spacing="5">
|
|
<TextBlock Text="📝" FontSize="14"/>
|
|
<TextBlock Text="批量导入" FontSize="14"/>
|
|
</StackPanel>
|
|
</Button>
|
|
<Button Background="#95A5A6"
|
|
Foreground="White"
|
|
BorderThickness="0"
|
|
CornerRadius="5"
|
|
Padding="15,10">
|
|
<StackPanel Orientation="Horizontal" Spacing="5">
|
|
<TextBlock Text="🔄" FontSize="14"/>
|
|
<TextBlock Text="刷新列表" FontSize="14"/>
|
|
</StackPanel>
|
|
</Button>
|
|
</StackPanel>
|
|
|
|
<!-- 用户列表 -->
|
|
<Border Grid.Row="1"
|
|
Background="White"
|
|
CornerRadius="10"
|
|
BorderBrush="#DEE2E6"
|
|
BorderThickness="1">
|
|
<Grid>
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="Auto"/>
|
|
<RowDefinition Height="*"/>
|
|
</Grid.RowDefinitions>
|
|
|
|
<!-- 表头 -->
|
|
<Border Grid.Row="0"
|
|
Background="#F8F9FA"
|
|
CornerRadius="10,10,0,0"
|
|
Padding="20,15">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="60"/>
|
|
<ColumnDefinition Width="*"/>
|
|
<ColumnDefinition Width="200"/>
|
|
<ColumnDefinition Width="120"/>
|
|
<ColumnDefinition Width="100"/>
|
|
<ColumnDefinition Width="120"/>
|
|
</Grid.ColumnDefinitions>
|
|
|
|
<TextBlock Grid.Column="0"
|
|
Text="ID"
|
|
FontWeight="Bold"
|
|
Foreground="#2C3E50"/>
|
|
<TextBlock Grid.Column="1"
|
|
Text="姓名"
|
|
FontWeight="Bold"
|
|
Foreground="#2C3E50"/>
|
|
<TextBlock Grid.Column="2"
|
|
Text="邮箱"
|
|
FontWeight="Bold"
|
|
Foreground="#2C3E50"/>
|
|
<TextBlock Grid.Column="3"
|
|
Text="角色"
|
|
FontWeight="Bold"
|
|
Foreground="#2C3E50"/>
|
|
<TextBlock Grid.Column="4"
|
|
Text="状态"
|
|
FontWeight="Bold"
|
|
Foreground="#2C3E50"/>
|
|
<TextBlock Grid.Column="5"
|
|
Text="操作"
|
|
FontWeight="Bold"
|
|
Foreground="#2C3E50"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<!-- 用户数据 -->
|
|
<ListBox Grid.Row="1"
|
|
ItemsSource="{Binding Users}"
|
|
Background="Transparent"
|
|
BorderThickness="0">
|
|
<ListBox.ItemTemplate>
|
|
<DataTemplate>
|
|
<Border Background="White"
|
|
BorderBrush="#E9ECEF"
|
|
BorderThickness="0,0,0,1"
|
|
Padding="20,15">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="60"/>
|
|
<ColumnDefinition Width="*"/>
|
|
<ColumnDefinition Width="200"/>
|
|
<ColumnDefinition Width="120"/>
|
|
<ColumnDefinition Width="100"/>
|
|
<ColumnDefinition Width="120"/>
|
|
</Grid.ColumnDefinitions>
|
|
|
|
<TextBlock Grid.Column="0"
|
|
Text="{Binding Id}"
|
|
Foreground="#6C757D"
|
|
VerticalAlignment="Center"/>
|
|
<TextBlock Grid.Column="1"
|
|
Text="{Binding Name}"
|
|
Foreground="#2C3E50"
|
|
FontWeight="SemiBold"
|
|
VerticalAlignment="Center"/>
|
|
<TextBlock Grid.Column="2"
|
|
Text="{Binding Email}"
|
|
Foreground="#6C757D"
|
|
VerticalAlignment="Center"/>
|
|
|
|
<!-- 角色标签 -->
|
|
<Border Grid.Column="3"
|
|
Background="{Binding Role, Converter={x:Static converters:StringConverters.RoleToColorConverter}}"
|
|
CornerRadius="12"
|
|
Padding="8,4"
|
|
HorizontalAlignment="Left">
|
|
<TextBlock Text="{Binding Role}"
|
|
Foreground="White"
|
|
FontSize="12"
|
|
FontWeight="SemiBold"/>
|
|
</Border>
|
|
|
|
<!-- 状态标签 -->
|
|
<Border Grid.Column="4"
|
|
Background="{Binding Status, Converter={x:Static converters:StringConverters.StatusToColorConverter}}"
|
|
CornerRadius="12"
|
|
Padding="8,4"
|
|
HorizontalAlignment="Left">
|
|
<TextBlock Text="{Binding Status}"
|
|
Foreground="White"
|
|
FontSize="12"
|
|
FontWeight="SemiBold"/>
|
|
</Border>
|
|
|
|
<!-- 操作按钮 -->
|
|
<StackPanel Grid.Column="5"
|
|
Orientation="Horizontal"
|
|
Spacing="5">
|
|
<Button Width="30" Height="30"
|
|
Background="#3498DB"
|
|
Foreground="White"
|
|
BorderThickness="0"
|
|
CornerRadius="15"
|
|
ToolTip.Tip="编辑">
|
|
<TextBlock Text="✏️" FontSize="12"/>
|
|
</Button>
|
|
<Button Width="30" Height="30"
|
|
Background="#E74C3C"
|
|
Foreground="White"
|
|
BorderThickness="0"
|
|
CornerRadius="15"
|
|
ToolTip.Tip="删除">
|
|
<TextBlock Text="🗑️" FontSize="12"/>
|
|
</Button>
|
|
</StackPanel>
|
|
</Grid>
|
|
</Border>
|
|
</DataTemplate>
|
|
</ListBox.ItemTemplate>
|
|
</ListBox>
|
|
</Grid>
|
|
</Border>
|
|
</Grid>
|
|
</reactive:ReactiveUserControl>
|
|
|