WPF开发学生信息管理系统【WPF+Prism+MAH+WebApi】（四）

最近通过WPF开发项目，为了对WPF知识点进行总结，所以利用业余时间，开发一个学生信息管理系统【Student Information Management System】。前三篇文章进行了框架搭建和模块划分，后台WebApi接口编写，以及课程管理模块开发，本文在前三篇基础之上，继续深入开发学生信息管理系统的班级管理和学生管理模块，通过本篇文章，将继续巩固之前的知识点，本文仅供学习分享使用，如有不足之处，还请指正。

涉及知识点

由于班级管理和学生管理的服务端开发，在第二篇文章中以后介绍，所以本篇专注介绍客户端功能的开发。涉及知识点如下：

1. WPF开发中TextBlock，TextBox，DataGrid，Combox等控件的基础使用以及数据绑定等操作。
2. MAH样式的使用，在本示例中MAH主要用于统一页面风格，提高用户体验。
3. HttpClient使用，主要用于访问服务端提供的接口。

业务逻辑

首先班级管理和学生管理既有关联，又相互独立，不像课程管理模块独立存在，不与其他模块存在依赖。所以两个模块一起放在一篇文章进行讲解。关系如下：

1. 学生属于某一班级之学生，所以学生中包含班级信息。
2. 班级中存在班长，班长又属于学生的一个实体。

班级管理

1. 接口访问类ClassesHttpUtil

班级数据表结构和服务接口，在第二篇文章中已有介绍，如有疑问，可前往参考。接口访问类用于封装访问服务端提供的接口。如下所示：

namespace SIMS.Utils.Http
{
    public class ClassesHttpUtil:HttpUtil
    {
        /// <summary>
        /// 通过id查询学生信息
        /// </summary>
        /// <param name="id"></param>
        /// <returns></returns>
        public static ClassesEntity GetClasses(int id)
        {
            Dictionary<string, object> data = new Dictionary<string, object>();
            data["id"] = id;
            var str = Get(UrlConfig.CLASSES_GETCLASSES, data);
            var classes = StrToObject<ClassesEntity>(str);
            return classes;
        }

        public static PagedRequest<ClassesEntity> GetClassess(string? dept, string? grade, int pageNum, int pageSize)
        {
            Dictionary<string, object> data = new Dictionary<string, object>();
            data["dept"] = dept;
            data["grade"] = grade;
            data["pageNum"] = pageNum;
            data["pageSize"] = pageSize;
            var str = Get(UrlConfig.CLASSES_GETCLASSESS, data);
            var classess = StrToObject<PagedRequest<ClassesEntity>>(str);
            return classess;
        }

        public static bool AddClasses(ClassesEntity classes) {
            var ret = Post<ClassesEntity>(UrlConfig.CLASSES_ADDCLASSES, classes);
            return int.Parse(ret)==0;
        }

        public static bool UpdateClasses(ClassesEntity classes) {
            var ret = Put<ClassesEntity>(UrlConfig.CLASSES_UPDATECLASSES, classes);
            return int.Parse(ret) == 0;
        }

        public static bool DeleteClasses(int Id)
        {
            Dictionary<string,  string> data = new Dictionary<string, string>();
            data["Id"] = Id.ToString();
            var ret = Delete(UrlConfig.CLASSES_DELETECLASSES, data);
            return int.Parse(ret) == 0;
        }
    }
}

2. 客户端页面视图

班级管理的客户端页面视图共两个，一个查询列表页面，一个新增编辑页面，共同组成了班级管理的增删改查。

查询班级列表页面，涉及知识点如下所示：

1. 查询条件或者列表中数据列展示，通过数据绑定Binding的方式与ViewModel进行交互，即点击查询按钮，不再传递参数，因为ViewModel中的属性已经同步更新。
2. ViewModel中并非所有属性都可实现双向绑定，必须是实现具有通知功能的属性才可以。在Prism框架中，通过BindableBase的SetProperty方法可以快速实现。
3. View视图中如果控件存在Command命令，则可以直接绑定，如果不存在，则可以i:Interaction.Triggers将事件转换为命令，如Load事件等。
4. 在列表中，如果需要添加按钮，可以通过DataTemplate进行数据定制。

查询班级页面代码，如下所示：

<UserControl x:Class="SIMS.ClassesModule.Views.Classes"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:SIMS.ClassesModule.Views"
             xmlns:prism="http://prismlibrary.com/"
             xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
             xmlns:mahApps="http://metro.mahapps.com/winfx/xaml/controls"
             xmlns:ctrls ="clr-namespace:SIMS.Utils.Controls;assembly=SIMS.Utils"
             prism:ViewModelLocator.AutoWireViewModel="True"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
                <ResourceDictionary>
                    <Style x:Key="LinkButton" TargetType="Button">
                        <Setter Property="Background" Value="White"></Setter>
                        <Setter Property="Cursor" Value="Hand"></Setter>
                        <Setter Property="Margin" Value="3"></Setter>
                        <Setter Property="MinWidth" Value="80"></Setter>
                        <Setter Property="MinHeight" Value="25"></Setter>
                        <Setter Property="BorderThickness" Value="0 0 0 0"></Setter>
                    </Style>
                </ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding LoadedCommand}"></i:InvokeCommandAction>
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>
        <TextBlock Text="班级信息" FontSize="20" Background="AliceBlue" Margin="2"></TextBlock>
        <StackPanel Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center">
            <TextBlock Text="专业" VerticalAlignment="Center" Margin="2"></TextBlock>
            <TextBox Margin="4" MinWidth="120" Height="30"
                     Text="{Binding Dept}"
                             HorizontalContentAlignment="Stretch"
                             mahApps:TextBoxHelper.ClearTextButton="True"
                             mahApps:TextBoxHelper.Watermark="专业"
                             mahApps:TextBoxHelper.WatermarkAlignment="Left"
                             SpellCheck.IsEnabled="True" />
            <TextBlock Text="年级" VerticalAlignment="Center" Margin="2"></TextBlock>
            <TextBox Margin="4" MinWidth="120" Height="30"
                     Text="{Binding Grade}"
                             HorizontalContentAlignment="Stretch"
                             mahApps:TextBoxHelper.ClearTextButton="True"
                             mahApps:TextBoxHelper.Watermark="年级"
                             mahApps:TextBoxHelper.WatermarkAlignment="Left"
                             SpellCheck.IsEnabled="True" />
            <Button Content="查询" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Width="120" Height="30" Margin="3" Command="{Binding QueryCommand}"></Button>
            <Button Content="新增" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Width="120" Height="30" Margin="3" Command="{Binding AddCommand}"></Button>
        </StackPanel>
        <DataGrid x:Name="dgClasses"
                  Grid.Row="2"
                  Grid.Column="0"
                  Margin="2"
                  AutoGenerateColumns="False"
                  CanUserAddRows="False"
                  CanUserDeleteRows="False"
                  ItemsSource="{Binding Classes}"
                  RowHeaderWidth="0">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Dept}" Header="专业" Width="*" />
                <DataGridTextColumn Binding="{Binding Grade}" Header="年级" Width="*"/>
                <DataGridTextColumn Binding="{Binding Name}" Header="班级" Width="*"/>
                <DataGridTextColumn Binding="{Binding HeadTeacher}" Header="班主任" Width="*"/>
                <DataGridTextColumn Binding="{Binding MonitorName}" Header="班长" Width="*" />
                <DataGridTemplateColumn Header="操作" Width="*">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal">
                                <Button  Content="Edit" Style="{StaticResource LinkButton}" Command="{Binding RelativeSource={RelativeSource  AncestorType=DataGrid,  Mode=FindAncestor}, Path=DataContext.EditCommand}" CommandParameter="{Binding Id}">
                                    <Button.Template>
                                        <ControlTemplate TargetType="Button">
                                            <TextBlock TextDecorations="Underline" HorizontalAlignment="Center">
                                                <ContentPresenter />
                                            </TextBlock>
                                        </ControlTemplate>
                                    </Button.Template>
                                </Button>
                                <Button Content="Delete" Style="{StaticResource LinkButton}" Command="{Binding RelativeSource={RelativeSource  AncestorType=DataGrid,  Mode=FindAncestor}, Path=DataContext.DeleteCommand}" CommandParameter="{Binding Id}">
                                    <Button.Template>
                                        <ControlTemplate TargetType="Button">
                                            <TextBlock TextDecorations="Underline" HorizontalAlignment="Center">
                                                <ContentPresenter />
                                            </TextBlock>
                                        </ControlTemplate>
                                    </Button.Template>
                                </Button>
                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
        <ctrls:PageControl Grid.Row="3" DataContext="{Binding}" ></ctrls:PageControl>
    </Grid>
</UserControl>

新增编辑页面

班级的新增功能和编辑功能，共用一个页面，涉及知识点如下所示：

1. 在新增编辑的ViewModel中，班级实体是一个属性，所以在视图控件中进行数据绑定时，需要带上属性名，如：Classes.Name 。
2. 班长列表在新增班级时尚无对应学生，可为空，待维护学生后，可通过学生列表进行选择即可。
3. 班长列表为Combox下拉框，绑定的是学生实体列表，但客户端只需看到学生姓名即可，所以需要重写DataTemplate，只显示学生姓名。

新增班级信息视图，具体代码如下所示：

<UserControl x:Class="SIMS.ClassesModule.Views.AddEditClasses"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:SIMS.ClassesModule.Views"
             mc:Ignorable="d"
             xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
             xmlns:mahApps ="http://metro.mahapps.com/winfx/xaml/controls"
             xmlns:prism="http://prismlibrary.com/"      
             d:DesignHeight="400" d:DesignWidth="600">
    <prism:Dialog.WindowStyle>
        <Style TargetType="Window">
            <Setter Property="Width" Value="600"></Setter>
            <Setter Property="Height" Value="400"></Setter>
        </Style>
    </prism:Dialog.WindowStyle>
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding LoadedCommand}"></i:InvokeCommandAction>
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.2*"></ColumnDefinition>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="0.2*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>


        <TextBlock Text="专业" Grid.Row="0" Grid.Column="1" VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="0" Grid.Column="2" MinWidth="120" Height="35"  VerticalAlignment="Center" Margin="3" Text="{Binding Classes.Dept}"></TextBox>
        <TextBlock Text="年级" Grid.Row="1" Grid.Column="1"  VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="1" Grid.Column="2" MinWidth="120" Height="35"   VerticalAlignment="Center" Margin="3" Text="{Binding Classes.Grade}"></TextBox>
        <TextBlock Text="班级" Grid.Row="2" Grid.Column="1"   VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="2" Grid.Column="2" MinWidth="120" Height="35"   VerticalAlignment="Center" Margin="3" Text="{Binding Classes.Name}"></TextBox>
        <TextBlock Text="班主任" Grid.Row="3" Grid.Column="1"   VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="3" Grid.Column="2" MinWidth="120" Height="35"   VerticalAlignment="Center" Margin="3" Text="{Binding Classes.HeadTeacher}"></TextBox>
        <TextBlock Text="班长" Grid.Row="4" Grid.Column="1"   VerticalAlignment="Center" Margin="3"></TextBlock>
        <ComboBox Grid.Row="4" Grid.Column="2" MinWidth="120" Height="35" ItemsSource="{Binding Monitors}" mahApps:TextBoxHelper.ClearTextButton="True" SelectedItem="{Binding Monitor}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}"></TextBlock>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
        <StackPanel Grid.Row="5" Grid.Column="1" Grid.ColumnSpan="2" Orientation="Horizontal" HorizontalAlignment="Center" Margin="3">
            <Button Content="取消" Margin="5" MinWidth="120" Height="35" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Command="{Binding CancelCommand}"></Button>
            <Button Content="保存" Margin="5" MinWidth="120" Height="35" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Command="{Binding SaveCommand}"></Button>
        </StackPanel>
        <TextBlock Grid.Row="6" Grid.Column="1" Grid.ColumnSpan="2" Text="注意：新增班级时，班长可空，等维护学生后，再设置班长。" Foreground="Red"></TextBlock>
    </Grid>
</UserControl>

3. 客户端ViewModel

班级管理模块，ViewModel和视图对应，也分为查询列表ViewModel和新增编辑ViewModel，如下所示：

ClassesViewModel页面代码分为三部分：

1. 属性和构造函数，主要用于数据绑定，如查询条件，列表等。所有属性的set赋值时，均采用SetProperty进行赋值。
2. 命令Command，如查询，新增，编辑，删除命令等。所有命令可以定义成DelegateCommand类型。
3. 分页部分，因分页功能代码大同小异，所以此处略去。

ClassesViewModel具体代码如下所示：

namespace SIMS.ClassesModule.ViewModels
{
    public class ClassesViewModel :BindableBase
    {
        #region 属性及构造函数

        /// <summary>
        /// 专业
        /// </summary>
        private string dept;

        public string Dept
        {
            get { return dept; }
            set { SetProperty(ref dept , value); }
        }

        /// <summary>
        /// 年级
        /// </summary>
        private string grade;

        public string Grade
        {
            get { return grade; }
            set { SetProperty(ref grade , value); }
        }



        private ObservableCollection<ClassesInfo> classes;

        public ObservableCollection<ClassesInfo> Classes
        {
            get { return classes; }
            set { SetProperty(ref classes, value); }
        }

        private IDialogService dialogService;

        public ClassesViewModel(IDialogService dialogService)
        {
            this.dialogService = dialogService;
            this.pageNum = 1;
            this.pageSize = 20;
        }

        private void InitInfo()
        {
            Classes = new ObservableCollection<ClassesInfo>();
            var pagedRequst = ClassesHttpUtil.GetClassess(this.Dept,this.Grade, this.pageNum, this.pageSize);
            var entities = pagedRequst.items;
            Classes.AddRange(entities.Select(r=>new ClassesInfo(r)));
            //
            this.TotalCount = pagedRequst.count;
            this.TotalPage = ((int)Math.Ceiling(this.TotalCount * 1.0 / this.pageSize));
        }

        #endregion

        #region 事件

        private DelegateCommand loadedCommand;

        public DelegateCommand LoadedCommand
        {
            get
            {
                if (loadedCommand == null)
                {
                    loadedCommand = new DelegateCommand(Loaded);
                }
                return loadedCommand;
            }
        }

        private void Loaded()
        {
            InitInfo();
        }

        private DelegateCommand queryCommand;

        public DelegateCommand QueryCommand
        {
            get
            {
                if (queryCommand == null)
                {
                    queryCommand = new DelegateCommand(Query);
                }
                return queryCommand;
            }
        }

        private void Query() { 
            this.pageNum = 1;
            this.InitInfo();
        }

        /// <summary>
        /// 新增命令
        /// </summary>
        private DelegateCommand addCommand;

        public DelegateCommand AddCommand
        {
            get
            {
                if (addCommand == null)
                {
                    addCommand = new DelegateCommand(Add);
                }
                return addCommand;
            }
        }

        private void Add()
        {
            this.dialogService.ShowDialog("addEditClasses",null, AddEditCallBack, "MetroDialogWindow");
        }

        private void AddEditCallBack(IDialogResult dialogResult) {
            if (dialogResult != null && dialogResult.Result == ButtonResult.OK) {
                //刷新列表
                this.pageNum = 1;
                this.InitInfo();
            }
        }

        /// <summary>
        /// 编辑命令
        /// </summary>
        private DelegateCommand<object> editCommand;

        public DelegateCommand<object> EditCommand
        {
            get
            {
                if (editCommand == null)
                {
                    editCommand = new DelegateCommand<object>(Edit);
                }
                return editCommand;
            }
        }

        private void Edit(object obj)
        {
            if (obj == null) {
                return;
            }
            var Id = int.Parse(obj.ToString());
            var classes = this.Classes.FirstOrDefault(r => r.Id == Id);
            if (classes == null)
            {
                MessageBox.Show("无效的班级ID");
                return;
            }
            if (MessageBoxResult.Yes != MessageBox.Show("Are you sure to delete?", "Confirm", MessageBoxButton.YesNo))
            {
                return;
            }
            IDialogParameters dialogParameters = new DialogParameters();
            dialogParameters.Add("classes",classes);
            this.dialogService.ShowDialog("addEditClasses", dialogParameters, AddEditCallBack, "MetroDialogWindow");
        }

        /// <summary>
        /// 编辑命令
        /// </summary>
        private DelegateCommand<object> deleteCommand;

        public DelegateCommand<object> DeleteCommand
        {
            get
            {
                if (deleteCommand == null)
                {
                    deleteCommand = new DelegateCommand<object>(Delete);
                }
                return deleteCommand;
            }
        }

        private void Delete(object obj)
        {
            if (obj == null)
            {
                return;
            }
            var Id = int.Parse(obj.ToString());
            var classes = this.Classes.FirstOrDefault(r => r.Id == Id);
            if (classes == null)
            {
                MessageBox.Show("无效的班级ID");
                return;
            }
            bool flag = ClassesHttpUtil.DeleteClasses(Id);
            if (flag) {
                this.pageNum = 1;
                this.InitInfo();
            }
        }

        #endregion

    }
}

AddEditClassesViewModel代码同样分为三部分：

1. 属性和构造函数，主要用于数据绑定，如页面文本框，下拉选择框等。
2. 命令Command，主要用于响应事件，如保存，取消等。
3. 对话框接口，因为新增编辑是以弹出框的形式呈现，所以根据Prism框架的 要求，需要实现IDialogAware接口。

AddEditClassesViewModel具体代码如下所示：

namespace SIMS.ClassesModule.ViewModels
{
    public class AddEditClassesViewModel : BindableBase, IDialogAware
    {
        #region 属性和构造函数

        /// <summary>
        /// 班级实体
        /// </summary>
        private ClassesInfo classes;
    
        public ClassesInfo Classes
        {
            get { return classes; }
            set { SetProperty(ref classes ,value); }
        }

        private List<StudentEntity> monitors;

        public List<StudentEntity> Monitors
        {
            get { return monitors; }
            set { SetProperty(ref monitors , value); }
        }

        private StudentEntity monitor;

        public StudentEntity Monitor
        {
            get { return monitor; }
            set { SetProperty(ref monitor, value); }
        }

        public AddEditClassesViewModel() { 
        
        }

        #endregion

        #region Command

        private DelegateCommand loadedCommand;

        public DelegateCommand LoadedCommand
        {
            get
            {
                if (loadedCommand == null)
                {
                    loadedCommand = new DelegateCommand(Loaded);
                }
                return loadedCommand;
            }
        }

        private void Loaded()
        {
            this.Monitors= new List<StudentEntity>();
            if (Classes?.Id>0) { 
                var pagedRequst = StudentHttpUtil.GetStudentsByClasses(Classes.Id);
                var entities = pagedRequst.items;
                Monitors.AddRange(entities);
                //如果有班长，则为班长赋值
                if (Classes.Monitor > 0) { 
                    this.Monitor= this.Monitors?.FirstOrDefault(r=>r.Id==Classes.Monitor);
                }
            }
            
        }

        private DelegateCommand cancelCommand;

        public DelegateCommand CancelCommand
        {
            get
            {
                if (cancelCommand == null)
                {
                    cancelCommand = new DelegateCommand(Cancel);
                }
                return cancelCommand;
            }
        }

        private void Cancel()
        {
            RequestClose?.Invoke((new DialogResult(ButtonResult.Cancel)));
        }

        private DelegateCommand  saveCommand;

        public DelegateCommand SaveCommand
        {
            get
            {
                if (saveCommand == null)
                {
                    saveCommand = new DelegateCommand(Save);
                }
                return saveCommand;
            }
        }

        private void Save() {
            if (Classes != null) {
                Classes.CreateTime = DateTime.Now;
                Classes.LastEditTime = DateTime.Now;
                if (Monitor != null) {
                    Classes.Monitor = Monitor.Id;
                }
                bool flag=false;
                if (Classes.Id > 0) {
                   flag = ClassesHttpUtil.UpdateClasses(Classes);
                }
                else { 
                   flag = ClassesHttpUtil.AddClasses(Classes);
                }
                if (flag)
                {
                    RequestClose?.Invoke((new DialogResult(ButtonResult.OK)));
                }
            }
        }


        #endregion

        #region 对话框

        public string Title =>  "新增或编辑班级信息";

        public event Action<IDialogResult> RequestClose;

        public bool CanCloseDialog()
        {
            return true;
        }

        public void OnDialogClosed()
        {
            
        }

        public void OnDialogOpened(IDialogParameters parameters)
        {
            if (parameters != null && parameters.ContainsKey("classes"))
            {
                this.Classes = parameters.GetValue<ClassesInfo>("classes");
            }
            else { 
                this.Classes = new ClassesInfo();
            }
        }

        #endregion

    }
}

4. 示例截图

班级管理示例截图，如下所示：

 

学生管理

1. 接口访问类StudentHttpUtil

学生数据表结构和服务接口，在第二篇文章中已有介绍，如有疑问，可前往参考。接口访问类用于封装访问服务端提供的接口。如下所示：

namespace SIMS.Utils.Http
{
    /// <summary>
    /// 学生类Http访问通用类
    /// </summary>
    public class StudentHttpUtil:HttpUtil
    {
        /// <summary>
        /// 通过id查询学生信息
        /// </summary>
        /// <param name="id"></param>
        /// <returns></returns>
        public static StudentEntity GetStudent(int id)
        {
            Dictionary<string, object> data = new Dictionary<string, object>();
            data["id"] = id;
            var str = Get(UrlConfig.STUDENT_GETSTUDENT, data);
            var student = StrToObject<StudentEntity>(str);
            return student;
        }

        public static PagedRequest<StudentEntity> GetStudents(string no,string name, int pageNum, int pageSize) {
            Dictionary<string, object> data = new Dictionary<string, object>();
            data["no"] = no;
            data["name"] = name;
            data["pageNum"] = pageNum;
            data["pageSize"] = pageSize;
            var str = Get(UrlConfig.STUDENT_GETSTUDENTS, data);
            var students = StrToObject<PagedRequest<StudentEntity>>(str);
            return students;
        }

        public static PagedRequest<StudentEntity> GetStudentsByClasses(int classId)
        {
            Dictionary<string, object> data = new Dictionary<string, object>();
            data["classId"] = classId;
            var str = Get(UrlConfig.STUDENT_GETSTUDENTSBYCLASSES, data);
            var students = StrToObject<PagedRequest<StudentEntity>>(str);
            return students;
        }

        public static bool AddStudent(StudentEntity student)
        {
            var ret = Post<StudentEntity>(UrlConfig.STUDENT_ADDSTUDENT, student);
            return int.Parse(ret) == 0;
        }

        public static bool UpdateStudent(StudentEntity student)
        {
            var ret = Put<StudentEntity>(UrlConfig.STUDENT_UPDATESTUDENT, student);
            return int.Parse(ret) == 0;
        }

        public static bool DeleteStudent(int Id)
        {
            Dictionary<string, string> data = new Dictionary<string, string>();
            data["Id"] = Id.ToString();
            var ret = Delete(UrlConfig.STUDENT_DELETESTUDENT, data);
            return int.Parse(ret) == 0;
        }
    }
}

2. 客户端页面视图

学生管理模块的客户端视图页面，也分为两个：学生列表查询，新增编辑学生信息页面。

学生列表查询页面

学生信息列表页面设计知识点，和班级管理差不多，只有一点差异：

1. 在数据库中，性别保存的是bit类型，在C#中，数据类型为bool，但是在列表中需要转换成男或女显示，所以需要用到Converter进行转换。

学生信息查询页面，具体代码如下所示：

<UserControl x:Class="SIMS.StudentModule.Views.Student"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:SIMS.StudentModule.Views"
      xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
      xmlns:mahApps ="http://metro.mahapps.com/winfx/xaml/controls"
      xmlns:prism="http://prismlibrary.com/"      
      xmlns:ctrls ="clr-namespace:SIMS.Utils.Controls;assembly=SIMS.Utils"
      xmlns:conv="clr-namespace:SIMS.Utils.Converter;assembly=SIMS.Utils"
      mc:Ignorable="d" 
      prism:ViewModelLocator.AutoWireViewModel="True"
      d:DesignHeight="450" d:DesignWidth="800">
    
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
                <ResourceDictionary>
                    <conv:SexConverter x:Key="SexConverter"></conv:SexConverter>
                    <Style x:Key="LinkButton" TargetType="Button">
                        <Setter Property="Background" Value="White"></Setter>
                        <Setter Property="Cursor" Value="Hand"></Setter>
                        <Setter Property="Margin" Value="3"></Setter>
                        <Setter Property="MinWidth" Value="80"></Setter>
                        <Setter Property="MinHeight" Value="25"></Setter>
                        <Setter Property="BorderThickness" Value="0 0 0 0"></Setter>
                    </Style>
                </ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding LoadedCommand}"></i:InvokeCommandAction>
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>
        <TextBlock Text="学生信息" FontSize="20" Background="AliceBlue" Margin="2"></TextBlock>
        <StackPanel Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center">
            <TextBlock Text="学号" VerticalAlignment="Center" Margin="2"></TextBlock>
            <TextBox Margin="4" MinWidth="120" Height="30"
                     Text="{Binding No}"
                             HorizontalContentAlignment="Stretch"
                             mahApps:TextBoxHelper.ClearTextButton="True"
                             mahApps:TextBoxHelper.Watermark="学号"
                             mahApps:TextBoxHelper.WatermarkAlignment="Left"
                             SpellCheck.IsEnabled="True" />
            <TextBlock Text="姓名" VerticalAlignment="Center" Margin="2"></TextBlock>
            <TextBox Margin="4" MinWidth="120" Height="30"
                     Text="{Binding Name}"
                             HorizontalContentAlignment="Stretch"
                             mahApps:TextBoxHelper.ClearTextButton="True"
                             mahApps:TextBoxHelper.Watermark="学生姓名"
                             mahApps:TextBoxHelper.WatermarkAlignment="Left"
                             SpellCheck.IsEnabled="True" />
            <Button Content="查询" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Width="120" Height="30" Margin="3" Command="{Binding QueryCommand}"></Button>
            <Button Content="新增" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Width="120" Height="30" Margin="3" Command="{Binding AddCommand}"></Button>
        </StackPanel>
        <DataGrid x:Name="dgStudent"
                  Grid.Row="2"
                  Grid.Column="0"
                  Margin="2"
                  AutoGenerateColumns="False"
                  CanUserAddRows="False"
                  CanUserDeleteRows="False"
                  ItemsSource="{Binding Students}"
                  RowHeaderWidth="0">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding No}" Header="学号" Width="*" />
                <DataGridTextColumn Binding="{Binding Name}" Header="姓名" Width="*"/>
                <DataGridTextColumn Binding="{Binding Age}" Header="年龄" Width="*"/>
                <DataGridTextColumn Binding="{Binding Sex, Converter={StaticResource SexConverter}}" Header="性别" Width="*"/>
                <DataGridTextColumn Binding="{Binding ClassesName}" Header="班级" Width="*" />
                <DataGridTemplateColumn Header="操作" Width="*">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal">
                                <Button Content="Edit" Style="{StaticResource LinkButton}" Command="{Binding RelativeSource={RelativeSource  AncestorType=DataGrid,  Mode=FindAncestor}, Path=DataContext.EditCommand}" CommandParameter="{Binding Id}"  >
                                    <Button.Template>
                                        <ControlTemplate TargetType="Button">
                                            <TextBlock TextDecorations="Underline" HorizontalAlignment="Center">
                                                <ContentPresenter />
                                            </TextBlock>
                                        </ControlTemplate>
                                    </Button.Template>
                                </Button>
                                <Button Content="Delete" Style="{StaticResource LinkButton}" Command="{Binding RelativeSource={RelativeSource  AncestorType=DataGrid,  Mode=FindAncestor}, Path=DataContext.DeleteCommand}" CommandParameter="{Binding Id}">
                                    <Button.Template>
                                        <ControlTemplate TargetType="Button">
                                            <TextBlock TextDecorations="Underline" HorizontalAlignment="Center">
                                                <ContentPresenter />
                                            </TextBlock>
                                        </ControlTemplate>
                                    </Button.Template>
                                </Button>
                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
        <ctrls:PageControl Grid.Row="3" DataContext="{Binding}" ></ctrls:PageControl>
    </Grid>
</UserControl>

新增编辑页面

新增编辑页面涉及知识点和班级新增页面差不多，仅有一处差异：

1. C#中的bool类型，需要绑定到两个单选按钮上，以表示男，女，所以需要扩展。

新增编辑页面，具体代码如下所示：

<UserControl x:Class="SIMS.StudentModule.Views.AddEditStudent"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:SIMS.StudentModule.Views"
             xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
             xmlns:mahApps ="http://metro.mahapps.com/winfx/xaml/controls"
             xmlns:prism="http://prismlibrary.com/"      
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="600">
    <prism:Dialog.WindowStyle>
        <Style TargetType="Window">
            <Setter Property="Width" Value="600"></Setter>
            <Setter Property="Height" Value="400"></Setter>
        </Style>
    </prism:Dialog.WindowStyle>
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding LoadedCommand}"></i:InvokeCommandAction>
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.2*"></ColumnDefinition>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="0.2*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>


        <TextBlock Text="学号" Grid.Row="0" Grid.Column="1" VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="0" Grid.Column="2" MinWidth="120" Height="35"   VerticalAlignment="Center" Margin="3" Text="{Binding Student.No}"></TextBox>
        <TextBlock Text="姓名" Grid.Row="1" Grid.Column="1"  VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="1" Grid.Column="2" MinWidth="120" Height="35"   VerticalAlignment="Center" Margin="3" Text="{Binding Student.Name}"></TextBox>
        <TextBlock Text="年龄" Grid.Row="2" Grid.Column="1"   VerticalAlignment="Center" Margin="3"></TextBlock>
        <TextBox Grid.Row="2" Grid.Column="2" MinWidth="120" Height="35"   VerticalAlignment="Center" Margin="3" Text="{Binding Student.Age}"></TextBox>
        <TextBlock Text="性别" Grid.Row="3" Grid.Column="1"   VerticalAlignment="Center" Margin="3"></TextBlock>
        <StackPanel Grid.Row="3" Grid.Column="2" Orientation="Horizontal" >
            <RadioButton Content="男" IsChecked="{Binding Student.IsBoy}"></RadioButton>
            <RadioButton Content="女" IsChecked="{Binding Student.IsGirl}"></RadioButton>
        </StackPanel>
        
        <TextBlock Text="班级" Grid.Row="4" Grid.Column="1"   VerticalAlignment="Center" Margin="3"></TextBlock>
        <ComboBox Grid.Row="4" Grid.Column="2" MinWidth="120" Height="35" ItemsSource="{Binding Classess}" mahApps:TextBoxHelper.ClearTextButton="True" SelectedItem="{Binding Classes}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Dept}"></TextBlock>
                        <TextBlock Text="{Binding Grade}"></TextBlock>
                        <TextBlock Text="{Binding Name}"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
        <StackPanel Grid.Row="5" Grid.Column="1" Grid.ColumnSpan="2" Orientation="Horizontal" HorizontalAlignment="Center" Margin="3">
            <Button Content="取消" Margin="5" MinWidth="120" Height="35" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Command="{Binding CancelCommand}" ></Button>
            <Button Content="保存" Margin="5" MinWidth="120" Height="35" Style="{DynamicResource MahApps.Styles.Button.Square.Accent}" Command="{Binding SaveCommand}"></Button>
        </StackPanel>
    </Grid>
</UserControl>

3. 客户端ViewModel

学生管理客户端ViewModel，与页面视图对应，也分为两个部分

StudentViewModel代码分为三部分：

1. 属性和构造函数，主要用于数据绑定，如查询条件，列表等。所有属性的set赋值时，均采用SetProperty进行赋值。
2. 命令Command，如查询，新增，编辑，删除命令等。所有命令可以定义成DelegateCommand类型。
3. 分页部分，因分页功能代码大同小异，所以此处略去。

StudentViewModel具体代码如下所示：

namespace SIMS.StudentModule.ViewModels
{
    public class StudentViewModel:BindableBase
    {
        #region 属性及构造函数

        /// <summary>
        /// 学号
        /// </summary>
        private string no;

        public string No
        {
            get { return no; }
            set { SetProperty(ref no , value); }
        }

        /// <summary>
        /// 学生姓名
        /// </summary>
        private string name;

        public string Name
        {
            get { return name; }
            set { SetProperty(ref name, value); }
        }

        private ObservableCollection<StudentInfo> students;

        public ObservableCollection<StudentInfo> Students
        {
            get { return students; }
            set { SetProperty(ref students, value); }
        }

        private IDialogService dialogService;

        public StudentViewModel(IDialogService dialogService) {
            this.dialogService = dialogService;
            this.pageNum = 1;
            this.pageSize = 20;
        }

        private void InitInfo() {
            Students = new ObservableCollection<StudentInfo>();
            var pagedRequst = StudentHttpUtil.GetStudents(this.No,this.Name, this.pageNum, this.pageSize);
            var entities = pagedRequst.items;
            Students.AddRange(entities.Select(r=>new StudentInfo(r)));
            //
            this.TotalCount = pagedRequst.count;
            this.TotalPage=((int)Math.Ceiling(this.TotalCount*1.0/this.pageSize));
        }

        #endregion

        #region 事件

        private DelegateCommand loadedCommand;

        public DelegateCommand LoadedCommand
        {
            get
            {
                if (loadedCommand == null)
                {
                    loadedCommand = new DelegateCommand(Loaded);
                }
                return loadedCommand;
            }
        }

        private void Loaded()
        {
            InitInfo();
        }

        /// <summary>
        /// 新增命令
        /// </summary>
        private DelegateCommand addCommand;

        public DelegateCommand AddCommand
        {
            get
            {
                if (addCommand == null)
                {
                    addCommand = new DelegateCommand(Add);
                }
                return addCommand;
            }
        }

        private void Add()
        {
            this.dialogService.ShowDialog("addEditStudent", null, AddEditCallBack, "MetroDialogWindow");
        }

        private void AddEditCallBack(IDialogResult dialogResult)
        {
            if (dialogResult != null && dialogResult.Result == ButtonResult.OK)
            {
                //刷新列表
                this.pageNum = 1;
                this.InitInfo();
            }
        }

        /// <summary>
        /// 编辑命令
        /// </summary>
        private DelegateCommand<object> editCommand;

        public DelegateCommand<object> EditCommand
        {
            get
            {
                if (editCommand == null)
                {
                    editCommand = new DelegateCommand<object>(Edit);
                }
                return editCommand;
            }
        }

        private void Edit(object obj) {
            if (obj == null)
            {
                return;
            }
            var Id = int.Parse(obj.ToString());
            var student = this.Students.FirstOrDefault(r => r.Id == Id);
            if (student == null)
            {
                MessageBox.Show("无效的学生ID");
                return;
            }
            if (MessageBoxResult.Yes != MessageBox.Show("Are you sure to delete?", "Confirm", MessageBoxButton.YesNo))
            {
                return;
            }
            IDialogParameters dialogParameters = new DialogParameters();
            dialogParameters.Add("student", student);
            this.dialogService.ShowDialog("addEditStudent", dialogParameters, AddEditCallBack, "MetroDialogWindow");
        }

        /// <summary>
        /// 编辑命令
        /// </summary>
        private DelegateCommand<object> deleteCommand;

        public DelegateCommand<object> DeleteCommand
        {
            get
            {
                if (deleteCommand == null)
                {
                    deleteCommand = new DelegateCommand<object>(Delete);
                }
                return deleteCommand;
            }
        }

        private void Delete(object obj)
        {
            if (obj == null)
            {
                return;
            }
            var Id = int.Parse(obj.ToString());
            var classes = this.Students.FirstOrDefault(r => r.Id == Id);
            if (classes == null)
            {
                MessageBox.Show("无效的学生ID");
                return;
            }
            bool flag = StudentHttpUtil.DeleteStudent(Id);
            if (flag)
            {
                this.pageNum = 1;
                this.InitInfo();
            }
        }

        #endregion

    }
}

AddEditStudentViewModel代码同样分为三部分：

1. 属性和构造函数，主要用于数据绑定，如页面文本框，下拉选择框等。
2. 命令Command，主要用于响应事件，如保存，取消等。
3. 对话框接口，因为新增编辑是以弹出框的形式呈现，所以根据Prism框架的 要求，需要实现IDialogAware接口。(实现接口代码大同小异，在此略去)

AddEditStudentViewModel具体代码如下所示：

namespace SIMS.StudentModule.ViewModels
{
    public class AddEditStudentViewModel : BindableBase, IDialogAware
    {

        /// <summary>
        /// 班级实体
        /// </summary>
        private ClassesEntity classes;

        public ClassesEntity Classes
        {
            get { return classes; }
            set { SetProperty(ref classes, value); }
        }

        /// <summary>
        /// 班级列表
        /// </summary>
        private List<ClassesEntity> classess;

        public List<ClassesEntity> Classess
        {
            get { return classess; }
            set { SetProperty(ref classess, value); }
        }

        private StudentInfo student;

        public StudentInfo Student
        {
            get { return student; }
            set { student = value; }
        }

        public AddEditStudentViewModel() { 
        
        }

        #region Command

        private DelegateCommand loadedCommand;

        public DelegateCommand LoadedCommand
        {
            get
            {
                if (loadedCommand == null)
                {
                    loadedCommand = new DelegateCommand(Loaded);
                }
                return loadedCommand;
            }
        }

        private void Loaded()
        {
            this.Classess = new List<ClassesEntity>();
            var pagedRequst = ClassesHttpUtil.GetClassess(null,null,1,0);//0表示所有班级
            var entities = pagedRequst.items;
            Classess.AddRange(entities);
        }

        private DelegateCommand cancelCommand;

        public DelegateCommand CancelCommand
        {
            get
            {
                if (cancelCommand == null)
                {
                    cancelCommand = new DelegateCommand(Cancel);
                }
                return cancelCommand;
            }
        }

        private void Cancel() {
            RequestClose?.Invoke((new DialogResult(ButtonResult.Cancel)));
        }

        private DelegateCommand saveCommand;

        public DelegateCommand SaveCommand
        {
            get
            {
                if (saveCommand == null)
                {
                    saveCommand = new DelegateCommand(Save);
                }
                return saveCommand;
            }
        }

        private void Save()
        {
            if (Student != null)
            {
                Student.CreateTime = DateTime.Now;
                Student.LastEditTime = DateTime.Now;
                bool flag = false;
                if (Classes != null) { 
                    Student.ClassesId = Classes.Id;
                }
                if (Student.Id > 0)
                {
                    flag = StudentHttpUtil.UpdateStudent(Student);
                }
                else
                {
                    flag = StudentHttpUtil.AddStudent(Student);
                }
                if (flag)
                {
                    RequestClose?.Invoke((new DialogResult(ButtonResult.OK)));
                }
            }
        }

        #endregion
    }
}

4. 示例截图

学生管理示例截图，如下所示：

总结

通过本篇文章的班级管理模块，学生管理模块，以及上一篇文章中的课程管理模块，不难发现，每一个模块的开发都是由列表DataGrid，文本框TextBox，下拉框Combox，单选按钮RadioButton，按钮Button等组成的，虽功能略有差异，但总归万变不离其宗。开发方法也大同小异，复杂的功能都是普通的功能累加起来的。这也是本系列文章由浅入深的渐进安排。希望能够抛砖引玉，不局限于某一功能，而是能够举一反三，自我理解，以达到自我开发的能力。