<UserControl x:Class="MainShell.DeviceMaintance.View.DeviceIoView"
             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"
             mc:Ignorable="d"
             d:DesignHeight="450" d:DesignWidth="900">
    <UserControl.Resources>
        <Style x:Key="IoCardStyle" TargetType="Border">
            <Setter Property="Background" Value="#F8FAFD"/>
            <Setter Property="BorderBrush" Value="#D4DCE8"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="CornerRadius" Value="8"/>
            <Setter Property="Margin" Value="0,0,0,12"/>
            <Setter Property="Padding" Value="14"/>
        </Style>

        <Style x:Key="StatusBadgeBorderStyle" TargetType="Border">
            <Setter Property="CornerRadius" Value="12"/>
            <Setter Property="Padding" Value="10,4"/>
            <Setter Property="Margin" Value="0,0,8,0"/>
            <Setter Property="Background" Value="#E2E8F0"/>
        </Style>

        <Style x:Key="InputStatusDotStyle" TargetType="Ellipse">
            <Setter Property="Width" Value="10"/>
            <Setter Property="Height" Value="10"/>
            <Setter Property="Fill" Value="#93C5FD"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsOn}" Value="True">
                    <Setter Property="Fill" Value="#2563EB"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>

        <Style x:Key="OutputStatusDotStyle" TargetType="Ellipse">
            <Setter Property="Width" Value="10"/>
            <Setter Property="Height" Value="10"/>
            <Setter Property="Fill" Value="#FCD34D"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsOn}" Value="True">
                    <Setter Property="Fill" Value="#F97316"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>

        <Style x:Key="InputItemBorderStyle" TargetType="Border">
            <Setter Property="Background" Value="#EFF6FF"/>
            <Setter Property="BorderBrush" Value="#DBEAFE"/>
            <Setter Property="BorderThickness" Value="0,0,0,1"/>
            <Setter Property="Padding" Value="8,6"/>
            <Setter Property="Margin" Value="0,0,0,4"/>
            <Setter Property="CornerRadius" Value="4"/>
        </Style>

        <Style x:Key="OutputItemBorderStyle" TargetType="Border">
            <Setter Property="Background" Value="#FFF7ED"/>
            <Setter Property="BorderBrush" Value="#FED7AA"/>
            <Setter Property="BorderThickness" Value="0,0,0,1"/>
            <Setter Property="Padding" Value="8,6"/>
            <Setter Property="Margin" Value="0,0,0,4"/>
            <Setter Property="CornerRadius" Value="4"/>
        </Style>

        <Style x:Key="IoSectionBorderStyle" TargetType="Border">
            <Setter Property="CornerRadius" Value="6"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Padding" Value="10"/>
        </Style>

        <Style x:Key="IoOutputToggleButtonStyle" TargetType="ToggleButton">
            <Setter Property="Width" Value="90"/>
            <Setter Property="Height" Value="30"/>
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Border x:Name="Root" Background="#CBD5E1" BorderBrush="#94A3B8" BorderThickness="1" CornerRadius="15">
                            <Grid Margin="2">
                                <Border x:Name="Knob" Width="24" Height="24" Background="White" CornerRadius="12" HorizontalAlignment="Left"/>
                                <TextBlock x:Name="ToggleLabel" Text="OFF" Foreground="#334155" FontWeight="Bold" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="0,0,10,0"/>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="True">
                                <Setter TargetName="Root" Property="Background" Value="#16A34A"/>
                                <Setter TargetName="Root" Property="BorderBrush" Value="#16A34A"/>
                                <Setter TargetName="Knob" Property="HorizontalAlignment" Value="Right"/>
                                <Setter TargetName="ToggleLabel" Property="Text" Value="ON"/>
                                <Setter TargetName="ToggleLabel" Property="Foreground" Value="White"/>
                                <Setter TargetName="ToggleLabel" Property="HorizontalAlignment" Value="Left"/>
                                <Setter TargetName="ToggleLabel" Property="Margin" Value="10,0,0,0"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Root" Property="Opacity" Value="0.45"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid Background="#EDF1F7">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <StackPanel Margin="10,10,10,8">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <TextBlock Text="DEVICE IO MONITOR / 设备IO监控" FontSize="20" FontWeight="Bold" Foreground="#0F3B7A"/>
                <StackPanel Grid.Column="1" Orientation="Horizontal" VerticalAlignment="Center">
                    <Border Style="{StaticResource StatusBadgeBorderStyle}">
                        <TextBlock Text="{Binding PageState.LastRefreshTime, StringFormat=刷新：{0:HH:mm:ss}}" Foreground="#475569"/>
                    </Border>
                    <Border>
                        <Border.Style>
                            <Style TargetType="Border" BasedOn="{StaticResource StatusBadgeBorderStyle}">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding PageState.IsOnline}" Value="True">
                                        <Setter Property="Background" Value="#DCFCE7"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding PageState.IsOnline}" Value="False">
                                        <Setter Property="Background" Value="#FEE2E2"/>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Border.Style>
                        <TextBlock Text="{Binding PageState.OnlineText}">
                            <TextBlock.Style>
                                <Style TargetType="TextBlock">
                                    <Setter Property="Foreground" Value="#B91C1C"/>
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding PageState.IsOnline}" Value="True">
                                            <Setter Property="Foreground" Value="#166534"/>
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </Border>
                </StackPanel>
            </Grid>

            <Border Margin="0,8,0,0" Padding="12,6">
                <Border.Style>
                    <Style TargetType="Border" BasedOn="{StaticResource StatusBadgeBorderStyle}">
                        <Setter Property="Background" Value="#EFF6FF"/>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding PageState.IsWriteSuccess}" Value="True">
                                <Setter Property="Background" Value="#DCFCE7"/>
                            </DataTrigger>
                            <DataTrigger Binding="{Binding PageState.IsWriteSuccess}" Value="False">
                                <Setter Property="Background" Value="#FEF3C7"/>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Border.Style>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding PageState.LastWriteTime, StringFormat=写入时间：{0:HH:mm:ss}}" Foreground="#475569" Margin="0,0,14,0"/>
                    <TextBlock Text="{Binding PageState.LastWriteMessage}" FontWeight="SemiBold" TextWrapping="Wrap"/>
                </StackPanel>
            </Border>
        </StackPanel>

        <ScrollViewer Grid.Row="1" Margin="10,0,10,10" VerticalScrollBarVisibility="Auto">
            <ItemsControl ItemsSource="{Binding PageState.Modules}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Border Style="{StaticResource IoCardStyle}">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <TextBlock Text="{Binding Name}" FontSize="18" FontWeight="Bold" Foreground="#0F3B7A"/>

                                <Grid Grid.Row="1" Margin="0,10,0,0">
                                    <Grid.ColumnDefinitions>
                                         <ColumnDefinition>
                                             <ColumnDefinition.Style>
                                                 <Style TargetType="ColumnDefinition">
                                                     <Setter Property="Width" Value="*"/>
                                                     <Style.Triggers>
                                                         <DataTrigger Binding="{Binding HasInputs}" Value="False">
                                                             <Setter Property="Width" Value="0"/>
                                                         </DataTrigger>
                                                     </Style.Triggers>
                                                 </Style>
                                             </ColumnDefinition.Style>
                                         </ColumnDefinition>
                                         <ColumnDefinition>
                                             <ColumnDefinition.Style>
                                                 <Style TargetType="ColumnDefinition">
                                                     <Setter Property="Width" Value="*"/>
                                                     <Style.Triggers>
                                                         <DataTrigger Binding="{Binding HasOutputs}" Value="False">
                                                             <Setter Property="Width" Value="0"/>
                                                         </DataTrigger>
                                                     </Style.Triggers>
                                                 </Style>
                                             </ColumnDefinition.Style>
                                         </ColumnDefinition>
                                    </Grid.ColumnDefinitions>

                                     <Border BorderBrush="#BFDBFE" Background="#F8FBFF">
                                         <Border.Style>
                                             <Style TargetType="Border" BasedOn="{StaticResource IoSectionBorderStyle}">
                                                 <Setter Property="Margin" Value="0,0,6,0"/>
                                                 <Style.Triggers>
                                                     <DataTrigger Binding="{Binding HasInputs}" Value="False">
                                                         <Setter Property="Visibility" Value="Collapsed"/>
                                                     </DataTrigger>
                                                     <DataTrigger Binding="{Binding HasOutputs}" Value="False">
                                                         <Setter Property="Margin" Value="0"/>
                                                     </DataTrigger>
                                                 </Style.Triggers>
                                             </Style>
                                         </Border.Style>
                                        <StackPanel>
                                            <TextBlock Text="输入 IO" Foreground="#1D4ED8" FontWeight="Bold" Margin="0,0,0,8"/>
                                            <ItemsControl ItemsSource="{Binding InputPoints}">
                                                <ItemsControl.ItemTemplate>
                                                    <DataTemplate>
                                                        <Border Style="{StaticResource InputItemBorderStyle}">
                                                            <Grid>
                                                                <Grid.ColumnDefinitions>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                    <ColumnDefinition Width="*"/>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                </Grid.ColumnDefinitions>
                                                                <Ellipse Style="{StaticResource InputStatusDotStyle}" VerticalAlignment="Center" Margin="0,0,8,0"/>
                                                                <StackPanel Grid.Column="1">
                                                                    <TextBlock Text="{Binding Description}" Foreground="#1E3A8A" FontWeight="SemiBold"/>
                                                                    <TextBlock Text="{Binding StationNo, StringFormat=站号：{0}}" Foreground="#1D4ED8" FontSize="11"/>
                                                                    <TextBlock Text="{Binding LineNo, StringFormat=线标：{0}}" Foreground="#1D4ED8" FontSize="11"/>
                                                                    <TextBlock Text="{Binding Name}" Foreground="#64748B" FontSize="11" TextWrapping="Wrap"/>
                                                                </StackPanel>
                                                                <TextBlock Grid.Column="2" Text="{Binding StateText}" VerticalAlignment="Center" Foreground="#1E40AF" FontWeight="Bold"/>
                                                            </Grid>
                                                        </Border>
                                                    </DataTemplate>
                                                </ItemsControl.ItemTemplate>
                                            </ItemsControl>
                                        </StackPanel>
                                    </Border>

                                     <Border Grid.Column="1" BorderBrush="#FDBA74" Background="#FFF9F2">
                                         <Border.Style>
                                             <Style TargetType="Border" BasedOn="{StaticResource IoSectionBorderStyle}">
                                                 <Setter Property="Margin" Value="6,0,0,0"/>
                                                 <Style.Triggers>
                                                     <DataTrigger Binding="{Binding HasOutputs}" Value="False">
                                                         <Setter Property="Visibility" Value="Collapsed"/>
                                                     </DataTrigger>
                                                     <DataTrigger Binding="{Binding HasInputs}" Value="False">
                                                         <Setter Property="Margin" Value="0"/>
                                                     </DataTrigger>
                                                 </Style.Triggers>
                                             </Style>
                                         </Border.Style>
                                        <StackPanel>
                                            <TextBlock Text="输出 IO" Foreground="#C2410C" FontWeight="Bold" Margin="0,0,0,8"/>
                                            <ItemsControl ItemsSource="{Binding OutputPoints}">
                                                <ItemsControl.ItemTemplate>
                                                    <DataTemplate>
                                                        <Border Style="{StaticResource OutputItemBorderStyle}">
                                                            <Grid>
                                                                <Grid.ColumnDefinitions>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                    <ColumnDefinition Width="*"/>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                </Grid.ColumnDefinitions>
                                                                <Ellipse Style="{StaticResource OutputStatusDotStyle}" VerticalAlignment="Center" Margin="0,0,8,0"/>
                                                                <StackPanel Grid.Column="1">
                                                                    <TextBlock Text="{Binding Description}" Foreground="#9A3412" FontWeight="SemiBold"/>
                                                                    <TextBlock Text="{Binding StationNo, StringFormat=站号：{0}}" Foreground="#C2410C" FontSize="11"/>
                                                                    <TextBlock Text="{Binding LineNo, StringFormat=线标：{0}}" Foreground="#C2410C" FontSize="11"/>
                                                                    <TextBlock Text="{Binding Name}" Foreground="#7C2D12" FontSize="11" TextWrapping="Wrap"/>
                                                                </StackPanel>
                                                                <TextBlock Grid.Column="2" Text="{Binding StateText}" Margin="0,0,10,0" VerticalAlignment="Center" Foreground="#C2410C" FontWeight="Bold"/>
                                                                <ToggleButton Grid.Column="3"
                                                                              Style="{StaticResource IoOutputToggleButtonStyle}"
                                                                              IsChecked="{Binding IsOn, Mode=OneWay}"
                                                                              Command="{Binding ToggleCommand}"
                                                                              IsEnabled="{Binding CanWrite}"/>
                                                            </Grid>
                                                        </Border>
                                                    </DataTemplate>
                                                </ItemsControl.ItemTemplate>
                                            </ItemsControl>
                                        </StackPanel>
                                    </Border>
                                </Grid>
                            </Grid>
                        </Border>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</UserControl>
