wpf企业应用之主从结构列表

2021-11-08 22:12:13

　　主从结构在企业级应用中相当常见，这里结合我的例子谈一下wpf中主从结构列表展示的常用做法，具体效果见 wpf企业级开发中的几种常见业务场景。

　　首先，Model有两种，主表对应model（假设为modelA），从表对应的model（假设为modelB），两种model分别用于绑定列表，就是普通列表的绑定。

　　其次，由于要实现联动效果（即选择主表中的一条记录显示从表的记录），故而我们的ViewModel里面必须设计一个SelectedModelA用来绑定选中项，SelectedModelA变化时去更新modelB列表的数据源（通常SelectedModelA中会包含一个集合，不过我这里由于其他原因单独弄了个集合，逻辑其实大同小异）。

　　下面是我的代码，由于夹杂着一些业务，仅供参考，其实读者只需明白主表的选中项作为从表UI的数据源即可。

　　UI部分，可先直接看下具体效果 wpf企业级开发中的几种常见业务场景，绑定部分主要看两个DataGrid即可。

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <HeaderedContentControl>
            <HeaderedContentControl.Header>
                <DockPanel>
                    <TextBlock VerticalAlignment="Center" Text="{DynamicResource ProductClassify_Header_Classify}" DockPanel.Dock="Left"/>
                    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Right" Orientation="Horizontal">
                        <Button Name="Button_RefreshClassify" Style="{StaticResource RefreshIconButton}" Content="{DynamicResource Common_Refresh}" Command="{Binding TreeVM.RefreshCommand}"/>
                    </StackPanel>
                </DockPanel>
            </HeaderedContentControl.Header>
            <local:ClassifyTreeControl DataContext="{Binding TreeVM}"/>
        </HeaderedContentControl>

        <HeaderedContentControl Name="Header_Product" Grid.Column="1">
            <HeaderedContentControl.Header>
                <DockPanel>
                    <TextBlock VerticalAlignment="Center" Text="{DynamicResource ProductList_Header_Product}" DockPanel.Dock="Left"/>
                    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Right" Orientation="Horizontal">
                        <Button Name="Button_RefreshClassify2" Style="{StaticResource RefreshIconButton}" Content="{DynamicResource Common_Refresh}" Command="{Binding RefreshCommand}"/>
                        <Button Name="Button_AddProduct" Visibility="{Binding AddButtonVisibility}" IsEnabled="{Binding CanAdd}" Style="{StaticResource AddIconButton}" Content="{DynamicResource Common_Add}" Click="Button_AddProduct_Click"/>
                        <Button Name="Button_ModifyProduct" Visibility="{Binding ModifyButtonVisibility}" IsEnabled="{Binding CanModify}" Style="{StaticResource ModifyIconButton}" Content="{DynamicResource Common_Modify}" Click="Button_ModifyProduct_Click"/>
                        <Button Name="Button_DeleteProduct" Visibility="{Binding DeleteButtonVisibility}" Style="{StaticResource DeleteIconButton}" Content="{DynamicResource Common_Delete}" Command="{Binding DeleteCommand}"/>
                    </StackPanel>
                </DockPanel>
            </HeaderedContentControl.Header>
            <DataGrid Name="DataGrid_Product" ItemsSource="{Binding Products}" SelectedItem="{Binding SelectedProduct}" SelectionMode="Single" AutoGenerateColumns="False" IsReadOnly="True">
                <DataGrid.Columns>
                    <DataGridTextColumn Header="{DynamicResource Product_Num}" Binding="{Binding Num}" Width="120"/>
                    <DataGridTextColumn Header="{DynamicResource Product_Name_CH}" Binding="{Binding Name_CH}" Width="100"/>
                    <DataGridTextColumn Header="{DynamicResource Product_Name_EN}" Binding="{Binding Name_EN}" Width="100"/>
                    <DataGridTextColumn Header="{DynamicResource Product_Unit}" Binding="{Binding Unit}" Width="50"/>
                    <DataGridTextColumn Header="{DynamicResource Product_Weight}" Binding="{Binding Weight}" Width="100"/>
                    <DataGridTextColumn Header="{DynamicResource Product_Size}" Binding="{Binding Size}" Width="100"/>
                    <DataGridTemplateColumn Header="{DynamicResource Product_CanSale}">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <CheckBox IsThreeState="False" IsChecked="{Binding CanSale}" IsEnabled="False" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" HorizontalAlignment="Center" Width="50"/>
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                    <DataGridTextColumn Header="{DynamicResource Product_ReferencePrice}" Binding="{Binding ReferencePrice}" Width="100"/>
                    <DataGridTemplateColumn Header="{DynamicResource Product_StopProduction}">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <CheckBox IsThreeState="False" IsChecked="{Binding StopProduction}" IsEnabled="False" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" HorizontalAlignment="Center" Width="50"/>
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                    <DataGridTextColumn Header="{DynamicResource Product_MinSaleCount}" Binding="{Binding MinSaleCount}" Width="80"/>
                    <DataGridTextColumn Header="{DynamicResource Product_PackageCount}" Binding="{Binding PackageCount}" Width="80"/>
                    <DataGridTextColumn Header="{DynamicResource Product_Remark}" Binding="{Binding Remark}" Width="200"/>
                </DataGrid.Columns>
                <DataGrid.RowStyle>
                    <Style TargetType="DataGridRow" BasedOn="{StaticResource {x:Type DataGridRow}}">
                        <Setter Property="ToolTip">
                            <Setter.Value>
                                <Border Width="100" Height="100" BorderBrush="#FF7DB6D8" BorderThickness="1" Padding="1">
                                    <Border.Resources>
                                        <product:PicUrlConverter x:Key="urlConverter"/>
                                    </Border.Resources>
                                    <Image Source="{Binding ProductPic, Converter={StaticResource urlConverter}}"/>
                                </Border>
                            </Setter.Value>
                        </Setter>
                        <EventSetter Event="MouseDoubleClick" Handler="Button_ModifyProduct_Click"/>
                    </Style>
                </DataGrid.RowStyle>
            </DataGrid>
        </HeaderedContentControl>
    </Grid>

　　ViewModel中相关代码

    public class ProductListVM : ViewModelBase
    {
        public ProductListVM()
        {
            LoadData();
            TreeVM.SelectedChanged += (s, e) =>
            {
                LoadData();
                if (TreeVM.SelectedModel != null && !string.IsNullOrEmpty(TreeVM.SelectedModel.ID))
                    CanAdd = true;
                else
                    CanAdd = false;
            };
        }

        private ClassifyTreeVM _treeVM;
        public ClassifyTreeVM TreeVM
        {
            get
            {
                return _treeVM ?? (_treeVM = new ClassifyTreeVM());
            }
        }

        private tb_product _selectedProduct;
        public tb_product SelectedProduct
        {
            get
            {
                return _selectedProduct;
            }
            set
            {
                _selectedProduct = value;
                OnPropertyChanged("SelectedProduct");
                if (value != null)
                    CanModify = true;
                else
                    CanModify = false;
                RaiseCanExecute();
            }
        }

        private List<tb_product> _products;
        public List<tb_product> Products
        {
            get
            {
                return _products;
            }
            set
            {
                _products = value;
                OnPropertyChanged("Products");
            }
        }

        protected override void LoadData()
        {
            if (TreeVM.SelectedModel != null && !string.IsNullOrEmpty(TreeVM.SelectedModel.ID))
                Products = XDBContext.tb_product.Where(p => p.ClassifyID == TreeVM.SelectedModel.ID).AsNoTracking().ToList();
            else
                Products = XDBContext.tb_product.AsNoTracking().ToList();
        }

    }

　　public class ClassifyTreeVM : ViewModelBase
    {
        public ClassifyTreeVM()
        {
            LoadData();
        }

        private BindingList<TB_ClassifyTreeModel> _classifyModels;
        public BindingList<TB_ClassifyTreeModel> ClassifyModels
        {
            get
            {
                return _classifyModels;
            }
            set
            {
                _classifyModels = value;
                OnPropertyChanged("ClassifyModels");
            }
        }

        public event EventHandler SelectedChanged;

        private TB_ClassifyTreeModel _selectedModel;
        public TB_ClassifyTreeModel SelectedModel
        {
            get
            {
                return _selectedModel;
            }
            set
            {
                _selectedModel = value;
                OnPropertyChanged("SelectedModeld");
                if (SelectedChanged != null)
                    SelectedChanged(SelectedModel, null);
            }
        }

        protected override void LoadData()
        {
            ClassifyModels = new BindingList<TB_ClassifyTreeModel>();
            ClassifyModels.Add(new TB_ClassifyTreeModel(XDBContext)
            {
                ClassifyName = "All",
                ID = string.Empty
            });
        }
    }

　　关于主从结构编辑的保存,UI绑定就是一个主表model（包含从表集合），没什么特别的。只是在保存的时候一起保存从表信息即可（从表中可能有增删改，具体如何操作取决于数据操作层，数据少懒惰点的做法可以一股脑先将相关从表记录全删掉然后添加，这样就不用区分哪些记录是删除的、哪些是修改的及哪些是新添加的；通常有时候会在model中设计一个状态属性，以方便区分model的状态）

wpf企业应用之主从结构列表

码农公寓

相关文章