兼容win7版应用
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

549 lines
31 KiB

<UserControl x:Class="AIK.Views.MenuPages.TirePressure.TirePressurePage"
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:AIK.Views.MenuPages.TirePressure"
xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
xmlns:behaviors="clr-namespace:AIK.Behaviors;assembly=AIK.Behaviors"
xmlns:convert="clr-namespace:AIK.Views.Converters"
xmlns:commonPage="clr-namespace:AIK.Views.MenuPages.CommonPage"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<i:Interaction.Behaviors>
<behaviors:ViewModelInitializationBehavior/>
</i:Interaction.Behaviors>
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/AIK.Assets;component/Styles/ScrollViewerStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
<convert:SelectedToBackgroundConverter x:Key="SelectedToBackgroundConverter"/>
<convert:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter"/>
<ControlTemplate x:Key="FilletTextBox" TargetType="{x:Type TextBox}">
<Border>
<ScrollViewer x:Name="PART_ContentHost" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
<!-- 添加加载动画样式 -->
<Style x:Key="LoadingIndicatorStyle" TargetType="Control">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Control">
<Border Background="#80FFFFFF"
CornerRadius="8"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Padding="20">
<StackPanel Orientation="Vertical"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<ProgressBar IsIndeterminate="True"
Width="60"
Height="6"
Background="#E0E0E0"
Foreground="#0078D7"
Margin="0,0,0,10"/>
<TextBlock Text="加载中..."
HorizontalAlignment="Center"
Foreground="#666666"
FontSize="14"/>
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="CustomFilletTextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="Template" Value="{StaticResource FilletTextBox}"/>
<Setter Property="BorderBrush" Value="#FFE9ECEF"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Background" Value="White"/>
<Setter Property="Padding" Value="10,5"/>
<Setter Property="Tag" Value="10"/>
<!-- 使用 Tag 存储圆角值 -->
</Style>
<!-- 本地样式定义 -->
<Style x:Key="LetterHeaderStyle" TargetType="TextBlock">
<Setter Property="FontSize" Value="18"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="Foreground" Value="#FF333333"/>
<Setter Property="Margin" Value="10,15,0,5"/>
<Setter Property="Padding" Value="5,0,0,0"/>
<Setter Property="Background" Value="#FFF8F8F8"/>
</Style>
<Style x:Key="WordItemStyle" TargetType="Button">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="Padding" Value="25,8,0,8"/>
<Setter Property="Margin" Value="0,0,0,0"/>
<Setter Property="FontSize" Value="16"/>
<Setter Property="Foreground" Value="#FF444444"/>
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="Transparent"
CornerRadius="4"
Padding="{TemplateBinding Padding}">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="#FF0078D7"/>
<Setter Property="Background" Value="#FFF5F5F5"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" Value="#FFE0E0E0"/>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="NoResultsStyle" TargetType="TextBlock">
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="FontSize" Value="16"/>
<Setter Property="Foreground" Value="#FF888888"/>
<Setter Property="Margin" Value="0,40,0,0"/>
</Style>
<!-- 搜索框样式 -->
<Style x:Key="ModernSearchTextBoxStyle" TargetType="TextBox">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderBrush" Value="#FFE9ECEF"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="Foreground" Value="#2D3748"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Height" Value="36"/>
<!--<Setter Property="CaretBrush" Value="#0078D7"/>-->
<!--<Setter Property="SelectionOpacity" Value="0.3"/>-->
<Style.Triggers>
<Trigger Property="IsFocused" Value="True">
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="1.5"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Background" Value="Transparent"/>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="240"/>
<ColumnDefinition Width="360"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<!-- 搜索区域 -->
<Border Grid.Row="0"
Grid.Column="0"
Background="White"
CornerRadius="10"
BorderBrush="#FFE0E0E0"
BorderThickness="1"
Margin="20,20,20,10">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<!-- 搜索输入框 -->
<TextBox x:Name="SearchTextBox"
behaviors:PlaceholderBehavior.PlaceholderText="{DynamicResource SearchCarBrand}"
Grid.Column="0"
Style="{StaticResource CustomFilletTextBoxStyle}"
Text="{Binding SearchText, UpdateSourceTrigger=PropertyChanged}"
Margin="0,0,0,0"
>
<TextBox.InputBindings>
<KeyBinding Key="Enter" Command="{Binding SearchCommand}"/>
</TextBox.InputBindings>
</TextBox>
</Grid>
</Border>
<!-- 内容区域 -->
<Border Grid.Row="1"
Grid.Column="0"
Background="White"
CornerRadius="8"
BorderBrush="#FFE0E0E0"
BorderThickness="1"
Margin="20,0,20,20">
<ScrollViewer Template="{StaticResource MyScrollViewer}"
VerticalAlignment="Top"
x:Name="scrList"
Margin="0"
VerticalScrollBarVisibility="Auto" >
<ItemsControl ItemsSource="{Binding FilteredGroups}">
<ItemsControl.Style>
<Style TargetType="ItemsControl">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ItemsControl">
<ItemsPresenter/>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding FilteredGroups.Count}" Value="0">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock Text="{DynamicResource TryOtherBrands}"
Style="{StaticResource NoResultsStyle}" TextWrapping="Wrap"/>
<TextBlock Text="{DynamicResource TryOtherKeywords}"
TextWrapping="Wrap"
Style="{StaticResource NoResultsStyle}"
FontSize="14"
Margin="0,10,0,0"/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</ItemsControl.Style>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,5">
<!-- 字母标题 -->
<TextBlock Text="{Binding Letter}"
Style="{StaticResource LetterHeaderStyle}"/>
<!-- 单词列表 -->
<ItemsControl ItemsSource="{Binding Items}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border Background="{Binding IsSelected, Converter={StaticResource SelectedToBackgroundConverter}}"
BorderThickness="1"
CornerRadius="4"
Margin="5,2">
<Button Content="{Binding name}"
Style="{StaticResource WordItemStyle}"
Command="{Binding DataContext.WordClickedCommand,RelativeSource={RelativeSource AncestorType=UserControl}}"
CommandParameter="{Binding}"/>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Border>
<!-- 添加加载遮罩层 -->
<!--<Border x:Name="LoadingOverlay"
Grid.Row="1" Grid.RowSpan="2"
Grid.Column="0" Grid.ColumnSpan="2"
Background="#40FFFFFF"
Visibility="{Binding IsLoading, Converter={StaticResource BoolToVisibilityConverter}}"
Panel.ZIndex="999">
<Control Style="{StaticResource LoadingIndicatorStyle}"/>
</Border>-->
<Border Grid.Column="1" Grid.Row="0" Grid.RowSpan="2" Margin="-10,20,0,20"
Background="White"
CornerRadius="8"
BorderBrush="#FFE0E0E0"
BorderThickness="1">
<ScrollViewer Template="{StaticResource MyScrollViewer}"
VerticalAlignment="Top"
x:Name="brandList"
Margin="0"
VerticalScrollBarVisibility="Auto" >
<!-- 主列表区域 -->
<ListBox Name="CarListBox"
Margin="0,10,0,0"
BorderBrush="Transparent"
Background="Transparent"
ItemsSource="{Binding DetailGroups}"
ScrollViewer.VerticalScrollBarVisibility="Disabled"
PreviewMouseWheel="CarListBox_PreviewMouseWheel">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="1"/>
</Grid.RowDefinitions>
<!-- Expander 手风琴 -->
<Expander Grid.Row="0"
IsExpanded="False"
Background="White"
BorderBrush="#E0E0E0"
BorderThickness="0,0,0,1"
Margin="0,2,0,0"
HorizontalContentAlignment="Stretch"
Expanded="Expander_Expanded">
<Expander.Template>
<ControlTemplate TargetType="Expander">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ToggleButton Grid.Row="0"
Background="Transparent"
BorderThickness="0"
HorizontalContentAlignment="Stretch"
Content="{TemplateBinding Header}"
IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}">
<ToggleButton.Template>
<ControlTemplate TargetType="ToggleButton">
<Grid Height="40" Background="Transparent" HorizontalAlignment="Stretch">
<!-- 父项标题 -->
<ContentPresenter
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="10,0,0,0"/>
<Path x:Name="ArrowIcon"
Fill="Gray"
Width="8" Height="8"
VerticalAlignment="Center"
HorizontalAlignment="Right"
Margin="0,0,15,0"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="False">
<Setter TargetName="ArrowIcon" Property="Data" Value="M0,4 L5,0 L5,8 Z"/>
</Trigger>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="ArrowIcon" Property="Data" Value="M0,0 L8,0 L4,5 Z"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ToggleButton.Template>
</ToggleButton>
<ContentPresenter x:Name="ExpandSite" Grid.Row="1" Visibility="Collapsed"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True">
<Setter TargetName="ExpandSite" Property="Visibility" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Expander.Template>
<!-- 父项标题(正确绑定高亮) -->
<Expander.Header>
<TextBlock Text="{Binding name}" FontSize="16">
<TextBlock.Style>
<Style TargetType="TextBlock">
<Setter Property="Foreground" Value="Black"/>
<Style.Triggers>
<!-- 父项展开 → 高亮蓝色+加粗 -->
<DataTrigger Binding="{Binding IsExpanded, RelativeSource={RelativeSource AncestorType=Expander}}" Value="True">
<Setter Property="Foreground" Value="#007AFF"/>
<Setter Property="FontWeight" Value="Bold"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
</Expander.Header>
<!-- 子项全局单选 -->
<ItemsControl ItemsSource="{Binding children}"
Background="Transparent"
BorderThickness="0"
Margin="0,5,0,10">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border CornerRadius="6"
BorderBrush="#E0E0E0"
BorderThickness="1"
Height="45"
Margin="5,3,5,3"
Background="White"
x:Name="ItemBorder"
MouseLeftButtonUp="ItemBorder_MouseLeftButtonUp"
Tag="{Binding}">
<TextBlock Text="{Binding name}"
VerticalAlignment="Center"
Margin="15,0,0,0"/>
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseLeftButtonUp">
<i:InvokeCommandAction
Command="{Binding DataContext.SubItemClickCommand,
RelativeSource={RelativeSource AncestorType=UserControl,Mode=FindAncestor}}"
CommandParameter="{Binding}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</Border>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding IsSelected}" Value="True">
<Setter TargetName="ItemBorder" Property="Background" Value="#E3F2FD"/>
<Setter TargetName="ItemBorder" Property="BorderBrush" Value="#007AFF"/>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Expander>
<!-- 父项分割线 -->
<Border Grid.Row="1"
Height="1"
Background="#E0E0E0"
Margin="10,0,10,0"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
<!-- 父项样式 -->
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<ContentPresenter />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
</ScrollViewer>
</Border>
<Border Grid.Column="2" Grid.Row="0" Grid.RowSpan="2" Margin="10,20,10,20" Background="White" CornerRadius="8" BorderBrush="#FFE0E0E0" BorderThickness="1">
<Grid Margin="20">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<!-- 新增:用于放置设备提示区域 -->
<RowDefinition Height="Auto"/>
<!-- 原传感器类型卡片 -->
<RowDefinition Height="*"/>
<!-- 原匹配步骤指引 -->
</Grid.RowDefinitions>
<!-- 标题 -->
<TextBlock Text="操作指引" FontSize="18" FontWeight="SemiBold" Margin="0,0,0,20" Foreground="#333333"/>
<Border Grid.Row="1" Grid.RowSpan="3" Margin="0,0,0,20" Padding="15" CornerRadius="6" BorderBrush="#BBDEFB" BorderThickness="1">
<!-- 改用水平布局 Grid → 图片左 + 文字右 -->
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<!-- 图片列 -->
<ColumnDefinition Width="*"/>
<!-- 文字列 -->
</Grid.ColumnDefinitions>
<!-- 设备图片 左侧 -->
<Grid Grid.Column="0"
Margin="0,0,15,0">
<Image Source="/AIK.Assets;component/Images/k3-tpms.png"
Stretch="Uniform"
RenderOptions.BitmapScalingMode="HighQuality"
SnapsToDevicePixels="True"
UseLayoutRounding="True"/>
</Grid>
<!-- 右边留间距 -->
<!-- 提示文字 右侧(垂直居中) -->
<TextBlock Grid.Column="1"
Text="请在 AIK K3-TPMS 设备上操作"
Foreground="#1565C0"
FontWeight="Bold"
FontSize="18"
VerticalAlignment="Center"
TextWrapping="Wrap"/>
</Grid>
</Border>
<!--<Border Grid.Row="1" Grid.RowSpan="3" Margin="0,0,0,20" Padding="15" CornerRadius="6" BorderBrush="#BBDEFB" BorderThickness="1">
--><!-- 改用水平布局 Grid → 图片左 + 文字右 --><!--
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
--><!-- 图片列 --><!--
<ColumnDefinition Width="*"/>
--><!-- 文字列 --><!--
</Grid.ColumnDefinitions>
--><!-- 设备图片 左侧 --><!--
<Grid Grid.Column="0"
Width="120"
Height="100"
Margin="0,0,15,0">
<Image Source="/AIK.Assets;component/Images/k3-tpms.png"
Stretch="Uniform"
RenderOptions.BitmapScalingMode="HighQuality"
SnapsToDevicePixels="True"
UseLayoutRounding="True"/>
</Grid>
--><!-- 右边留间距 -->
<!-- 提示文字 右侧(垂直居中) --><!--
<TextBlock Grid.Column="1"
Text="请在 AIK K3-TPMS 设备上操作"
Foreground="#1565C0"
FontWeight="Bold"
FontSize="18"
VerticalAlignment="Center"
TextWrapping="Wrap"/>
</Grid>
</Border>-->
<!-- 1. 传感器类型卡片 (原 Grid.Row="1" 改为 Grid.Row="2") -->
<!--<Border Grid.Row="2" Background="#F8F9FA" BorderBrush="#E9ECEF" BorderThickness="1" CornerRadius="6" Padding="15">
<StackPanel>
<TextBlock Text="🔧 传感器类型" FontWeight="Bold" Foreground="#0078D7" Margin="0,0,0,10"/>
<TextBlock Text="{Binding SelectedSensorType, StringFormat='当前车型传感器:{0}'}" Margin="0,2,0,2" Foreground="#555"/>
<TextBlock Text="{Binding SelectedFrequency, StringFormat='工作频率:{0}'}" Margin="0,2,0,2" Foreground="#555"/>
</StackPanel>
</Border>-->
<!-- 2. 匹配步骤指引 (原 Grid.Row="2" 改为 Grid.Row="3") -->
<!--<Border Grid.Row="3" Background="#F8F9FA" BorderBrush="#E9ECEF" BorderThickness="1" CornerRadius="6" Padding="15" Margin="0,15,0,0">
<StackPanel>
<TextBlock Text="📝 匹配方法提示" FontWeight="Bold" Foreground="#D83B01" Margin="0,0,0,10"/>
<StackPanel Orientation="Horizontal" Margin="0,5,0,5">
<TextBlock Text="1." FontWeight="Bold" Width="20"/>
<TextBlock Text="{Binding Step1, Mode=OneWay}" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="0,5,0,5">
<TextBlock Text="2." FontWeight="Bold" Width="20"/>
<TextBlock Text="{Binding Step2, Mode=OneWay}" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="0,5,0,5">
<TextBlock Text="3." FontWeight="Bold" Width="20"/>
<TextBlock Text="{Binding Step3, Mode=OneWay}" TextWrapping="Wrap"/>
</StackPanel>
</StackPanel>
</Border>-->
</Grid>
</Border>
</Grid>
</UserControl>