最近通过WPF开发项目,为了对WPF知识点进行总结,所以利用业余时间,开发一个学生信息管理系统【Student Information Management System】。前三篇文章进行了框架搭建和模块划分,后台WebApi接口编写,以及课程管理模块开发,本文在前三篇基础之上,继续深入开发学生信息管理系统的班级管理和学生管理模块,通过本篇文章,将继续巩固之前的知识点,本文仅供学习分享使用,如有不足之处,还请指正。
涉及知识点
由于班级管理和学生管理的服务端开发,在第二篇文章中以后介绍,所以本篇专注介绍客户端功能的开发。涉及知识点如下:
- WPF开发中TextBlock,TextBox,DataGrid,Combox等控件的基础使用以及数据绑定等操作。
- MAH样式的使用,在本示例中MAH主要用于统一页面风格,提高用户体验。
- HttpClient使用,主要用于访问服务端提供的接口。
业务逻辑
首先班级管理和学生管理既有关联,又相互独立,不像课程管理模块独立存在,不与其他模块存在依赖。所以两个模块一起放在一篇文章进行讲解。关系如下:
- 学生属于某一班级之学生,所以学生中包含班级信息。
- 班级中存在班长,班长又属于学生的一个实体。
班级管理
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. 客户端页面视图
班级管理的客户端页面视图共两个,一个查询列表页面,一个新增编辑页面,共同组成了班级管理的增删改查。
查询班级列表页面,涉及知识点如下所示:
- 查询条件或者列表中数据列展示,通过数据绑定Binding的方式与ViewModel进行交互,即点击查询按钮,不再传递参数,因为ViewModel中的属性已经同步更新。
- ViewModel中并非所有属性都可实现双向绑定,必须是实现具有通知功能的属性才可以。在Prism框架中,通过BindableBase的SetProperty方法可以快速实现。
- View视图中如果控件存在Command命令,则可以直接绑定,如果不存在,则可以i:Interaction.Triggers将事件转换为命令,如Load事件等。
- 在列表中,如果需要添加按钮,可以通过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>
新增编辑页面
班级的新增功能和编辑功能,共用一个页面,涉及知识点如下所示:
- 在新增编辑的ViewModel中,班级实体是一个属性,所以在视图控件中进行数据绑定时,需要带上属性名,如:Classes.Name 。
- 班长列表在新增班级时尚无对应学生,可为空,待维护学生后,可通过学生列表进行选择即可。
- 班长列表为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页面代码分为三部分:
- 属性和构造函数,主要用于数据绑定,如查询条件,列表等。所有属性的set赋值时,均采用SetProperty进行赋值。
- 命令Command,如查询,新增,编辑,删除命令等。所有命令可以定义成DelegateCommand类型。
- 分页部分,因分页功能代码大同小异,所以此处略去。
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代码同样分为三部分:
- 属性和构造函数,主要用于数据绑定,如页面文本框,下拉选择框等。
- 命令Command,主要用于响应事件,如保存,取消等。
- 对话框接口,因为新增编辑是以弹出框的形式呈现,所以根据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. 客户端页面视图
学生管理模块的客户端视图页面,也分为两个:学生列表查询,新增编辑学生信息页面。
学生列表查询页面
学生信息列表页面设计知识点,和班级管理差不多,只有一点差异:
- 在数据库中,性别保存的是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>
新增编辑页面
新增编辑页面涉及知识点和班级新增页面差不多,仅有一处差异:
- 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代码分为三部分:
- 属性和构造函数,主要用于数据绑定,如查询条件,列表等。所有属性的set赋值时,均采用SetProperty进行赋值。
- 命令Command,如查询,新增,编辑,删除命令等。所有命令可以定义成DelegateCommand类型。
- 分页部分,因分页功能代码大同小异,所以此处略去。
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代码同样分为三部分:
- 属性和构造函数,主要用于数据绑定,如页面文本框,下拉选择框等。
- 命令Command,主要用于响应事件,如保存,取消等。
- 对话框接口,因为新增编辑是以弹出框的形式呈现,所以根据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. 示例截图
学生管理示例截图,如下所示:
文章来源:https://www.toymoban.com/news/detail-445154.html
总结
通过本篇文章的班级管理模块,学生管理模块,以及上一篇文章中的课程管理模块,不难发现,每一个模块的开发都是由列表DataGrid,文本框TextBox,下拉框Combox,单选按钮RadioButton,按钮Button等组成的,虽功能略有差异,但总归万变不离其宗。开发方法也大同小异,复杂的功能都是普通的功能累加起来的。这也是本系列文章由浅入深的渐进安排。希望能够抛砖引玉,不局限于某一功能,而是能够举一反三,自我理解,以达到自我开发的能力。文章来源地址https://www.toymoban.com/news/detail-445154.html
到了这里,关于WPF开发学生信息管理系统【WPF+Prism+MAH+WebApi】(四)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!