UserWindow.xaml

<Window x:Class="QLBH.UserWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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:local="clr-namespace:QLBH"
        mc:Ignorable="d"
        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
        xmlns:uc="clr-namespace:QLBH.UserControlQ"
        xmlns:rules="clr-namespace:QLBH.ValidationRules"
        TextElement.Foreground="{DynamicResource MaterialDesignBody}"
        TextElement.FontWeight="Regular"
        TextElement.FontSize="13"
        TextOptions.TextFormattingMode="Ideal" 
        TextOptions.TextRenderingMode="Auto"        
        Background="{DynamicResource MaterialDesignPaper}"
        FontFamily="{DynamicResource MaterialDesignFont}"
        DataContext="{StaticResource UserVM}"
        WindowStyle="None"
        ResizeMode="NoResize"
        WindowStartupLocation="CenterScreen"
        Name="Window"
        Title="Người dùng" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <uc:ControlBarUC Tag="{Binding Title,ElementName=Window}"></uc:ControlBarUC>
        </Grid>
        <Grid Grid.Row="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"></RowDefinition>
                <RowDefinition Height="auto"></RowDefinition>
                <RowDefinition></RowDefinition>
            </Grid.RowDefinitions>
            <materialDesign:Card Grid.Row="0" Margin="5">
                <WrapPanel>
                    <TextBox
                        Margin="5 5 15 10"
                        materialDesign:HintAssist.Hint="Tên đăng nhập"
                        Style="{StaticResource MaterialDesignFloatingHintTextBox}"
                        rules:ValidationBehavior.HasError="{Binding ValidateErrorUserName}"
                    >
                        <TextBox.Text>
                            <Binding Path="UserName"  UpdateSourceTrigger="PropertyChanged" >
                                <Binding.ValidationRules>
                                    <rules:NotEmptyRule ValidatesOnTargetUpdated="True"></rules:NotEmptyRule>

                                </Binding.ValidationRules>
                            </Binding>
                        </TextBox.Text>
                    </TextBox>
                    <ComboBox
                        Margin="5 5 15 -4"
                        materialDesign:HintAssist.Hint="Chức vụ"
                        IsEditable="False"
                        ItemsSource="{Binding ListUserRole}" 
                        DisplayMemberPath="DisplayName"
                        SelectedItem="{Binding SelectedUserRole , Mode=TwoWay , UpdateSourceTrigger=PropertyChanged}">
                        <ComboBox.Text>
                            <Binding Path="SelectedUserRoleText" UpdateSourceTrigger="PropertyChanged">
                                <Binding.ValidationRules>
                                    <rules:NotEmptyRule  ValidatesOnTargetUpdated="True"></rules:NotEmptyRule>
                                </Binding.ValidationRules>
                            </Binding>
                        </ComboBox.Text>
                    </ComboBox>
                    <TextBox
                        IsReadOnly="False"
                        Margin="5 5 15 10"
                        materialDesign:HintAssist.Hint="Tên hiển thị"
                        Style="{StaticResource MaterialDesignFloatingHintTextBox}"
                        
                        rules:ValidationBehavior.HasError="{Binding ValidateErrorDisplayName}"
                    >
                        <TextBox.Text>
                            <Binding Path="DisplayName" UpdateSourceTrigger="PropertyChanged">
                                <Binding.ValidationRules>
                                    <rules:NotEmptyRule ValidatesOnTargetUpdated="True"></rules:NotEmptyRule>
                                </Binding.ValidationRules>
                            </Binding>
                        </TextBox.Text>
                    </TextBox>
                    <TextBox Margin="5 15 5 5" VerticalAlignment="Center" Text="Ảnh đại diện"></TextBox>

                    <Rectangle Visibility="{Binding Avatar,UpdateSourceTrigger=PropertyChanged}" Stroke="Green" x:Name="Avatar" Margin="0 0 0 0" HorizontalAlignment="Center" Height="50" Width="50" >
                        <Rectangle.Fill>
                            <ImageBrush x:Name="Image" ImageSource="{Binding FileName}"/>
                        </Rectangle.Fill>
                        
                    </Rectangle>
                    <Rectangle Visibility="{Binding NoImage,UpdateSourceTrigger=PropertyChanged}" Stroke="Green" Margin="0 0 0 0" HorizontalAlignment="Center" Height="50" Width="50" >
                        <Rectangle.Fill>
                            <ImageBrush x:Name="NoImage" ImageSource="/Images/noimage.jpg"/>
                        </Rectangle.Fill>

                    </Rectangle>
                    <StackPanel>
                        <Button x:Name="CloseImageButton" HorizontalAlignment="Left" Margin="-10 5 0 0"  Width="10" Height="10" Content=""
                            Command="{Binding CloseImageCommand}"
                            CommandParameter="{Binding ElementName=CloseImageButton}"
                            Visibility="{Binding CloseButtonVisibility, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
                            >
                            <Button.Template>
                                <ControlTemplate TargetType="{x:Type Button}">
                                    <Grid>
                                        <Ellipse Fill="Red"/>
                                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center">
                                            <ContentPresenter.Content>
                                                <materialDesign:PackIcon Width="10" Height="10" Kind="CloseCircle" />
                                            </ContentPresenter.Content>
                                        </ContentPresenter>
                                    </Grid>
                                </ControlTemplate>
                            </Button.Template>
                        </Button>
                        <Button
                        Width="80"
                        Height="25"
                        Margin="5 10 0 0"
                        Style="{StaticResource MaterialDesignRaisedAccentButton}"
                        ToolTip="Resource name: MaterialDesignRaisedAccentButton"
                        FontSize="12"
                        Content="Chọn file" 
                        
                        Command="{Binding ImageCommand}"
                        CommandParameter="{Binding ElementName=Image}"
                        />
                    </StackPanel>
                </WrapPanel>
            </materialDesign:Card>
            <materialDesign:Card Grid.Row="1" Margin="5">
                <WrapPanel>
                    <Button
                        Width="100"
                        Margin="5"
                        Style="{StaticResource MaterialDesignRaisedAccentButton}"
                        ToolTip="Resource name: MaterialDesignRaisedAccentButton"
                        Content="Thêm" 
                        Command="{Binding AddCommand}"
                        CommandParameter="{Binding ElementName=List}"
                    />
                    <Button
                        Width="100"
                        Margin="5"
                        Style="{StaticResource MaterialDesignRaisedAccentButton}"
                        ToolTip="Resource name: MaterialDesignRaisedAccentButton"
                        Content="Sửa"
                        Command="{Binding EditCommand}"
                        CommandParameter="{Binding ElementName=List}"
                    />
                    <Button
                        Width="100"
                        Margin="5"
                        Style="{StaticResource MaterialDesignRaisedAccentButton}"
                        ToolTip="Resource name: MaterialDesignRaisedAccentButton"
                        Content="Xóa"
                        Command="{Binding DeleteCommand}"
                    />
                    <Button
                        Width="150"
                        Margin="5"
                        Style="{StaticResource MaterialDesignRaisedAccentButton}"
                        ToolTip="Resource name: MaterialDesignRaisedAccentButton"
                        Content="Đổi mật khẩu"
                        Command="{Binding ChangePasswordCommand}"
                    />
                </WrapPanel>

            </materialDesign:Card>
            <materialDesign:Card Margin="5" Grid.Row="2" VerticalAlignment="Stretch">

                <ListView x:Name="List" ItemsSource="{Binding List}" SelectedItem="{Binding SelectedItem,Mode=OneWayToSource}">
                    <ListView.View>
                        <GridView>
                            <GridViewColumn DisplayMemberBinding="{Binding ID}">
                                <GridViewColumnHeader  Content="ID" Width="40" Padding="7"/>
                            </GridViewColumn>
                            <GridViewColumn DisplayMemberBinding="{Binding UserName}">
                                <GridViewColumnHeader   Content="Tên đăng nhập" Width="120" Padding="7"/>
                            </GridViewColumn>
                            <GridViewColumn DisplayMemberBinding="{Binding UserRole.DisplayName}">
                                <GridViewColumnHeader  Content="Chức vụ" Width="90" Padding="7"/>
                            </GridViewColumn>
                            <GridViewColumn DisplayMemberBinding="{Binding DisplayName}">
                                <GridViewColumnHeader  Content="Tên hiển thị" Width="120" Padding="7"/>
                            </GridViewColumn>
                            <GridViewColumn>
                                <GridViewColumnHeader  Content="Ảnh chân dung" Width="120" Padding="7"/>
                                <GridViewColumn.CellTemplate>
                                    <DataTemplate>
                                        <Rectangle x:Name="Avatar" Margin="0 0 0 0" HorizontalAlignment="Center" Height="50" Width="50" >
                                            <Rectangle.Fill>
                                                <ImageBrush ImageSource="{Binding Image}"/>
                                            </Rectangle.Fill>
                                        </Rectangle>
                                    </DataTemplate>
                                </GridViewColumn.CellTemplate>
                            </GridViewColumn>
                            <GridViewColumn DisplayMemberBinding="{Binding Note}">
                                <GridViewColumnHeader Foreground="Red"  Content="Chú ý" Width="378" Padding="7"/>
                                <GridViewColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock Foreground="Red">

                                        </TextBlock>
                                    </DataTemplate>
                                </GridViewColumn.CellTemplate>
                            </GridViewColumn>
                        </GridView>
                    </ListView.View>
                </ListView>

            </materialDesign:Card>
        </Grid>
    </Grid>
</Window>