6a65281850
Some checks failed
TechAct / explore-gitea-actions (push) Failing after 13s
- 重构AppMainStruct、AssignmentQuestion、Question等实体模型 - 更新相关DTO以匹配新的数据结构 - 优化前端页面布局和组件 - 添加全局信息和笔记功能相关代码 - 更新数据库迁移和程序配置
79 lines
2.8 KiB
Plaintext
79 lines
2.8 KiB
Plaintext
@using MudBlazor
|
||
@using System.Collections.Generic
|
||
|
||
<MudDataGrid Items="@Elements.Take(4)" Hover="@_hover" Dense="@_dense" Striped="@_striped" Bordered="@_bordered"
|
||
RowStyleFunc="@_rowStyleFunc" RowClass="my-2 rounded-xl">
|
||
<Columns >
|
||
<PropertyColumn Property="x => x.Number" Title="Nr" />
|
||
<PropertyColumn Property="x => x.Sign" />
|
||
<PropertyColumn Property="x => x.Name" CellStyleFunc="@_cellStyleFunc" />
|
||
<PropertyColumn Property="x => x.Position" />
|
||
<PropertyColumn Property="x => x.Molar" Title="Molar mass" />
|
||
</Columns>
|
||
</MudDataGrid>
|
||
|
||
<div class="d-flex flex-wrap mt-4">
|
||
<MudSwitch @bind-Value="_hover" Color="Color.Primary">Hover</MudSwitch>
|
||
<MudSwitch @bind-Value="_dense" Color="Color.Secondary">Dense</MudSwitch>
|
||
<MudSwitch @bind-Value="_striped" Color="Color.Tertiary">Striped</MudSwitch>
|
||
<MudSwitch @bind-Value="_bordered" Color="Color.Warning">Bordered</MudSwitch>
|
||
</div>
|
||
|
||
@code {
|
||
// Element类定义
|
||
public class Element
|
||
{
|
||
public int Number { get; set; }
|
||
public string Sign { get; set; }
|
||
public string Name { get; set; }
|
||
public int Position { get; set; }
|
||
public decimal Molar { get; set; }
|
||
}
|
||
|
||
// 示例数据
|
||
private IEnumerable<Element> Elements = new List<Element>
|
||
{
|
||
new Element { Number = 1, Sign = "H", Name = "Hydrogen", Position = 1, Molar = 1.008m },
|
||
new Element { Number = 2, Sign = "He", Name = "Helium", Position = 0, Molar = 4.0026m },
|
||
new Element { Number = 3, Sign = "Li", Name = "Lithium", Position = 1, Molar = 6.94m },
|
||
new Element { Number = 4, Sign = "Be", Name = "Beryllium", Position = 2, Molar = 9.0122m },
|
||
new Element { Number = 5, Sign = "B", Name = "Boron", Position = 13, Molar = 10.81m }
|
||
};
|
||
|
||
private bool _hover;
|
||
private bool _dense;
|
||
private bool _striped;
|
||
private bool _bordered;
|
||
|
||
// 行样式函数：Position为0的行显示为斜体
|
||
private Func<Element, int, string> _rowStyleFunc => (x, i) =>
|
||
{
|
||
if (x.Position == 0)
|
||
return "font-style:italic";
|
||
|
||
return "";
|
||
};
|
||
|
||
// 单元格样式函数：根据元素编号设置背景色，根据摩尔质量设置字体粗细
|
||
private Func<Element, string> _cellStyleFunc => x =>
|
||
{
|
||
string style = "";
|
||
|
||
if (x.Number == 1)
|
||
style += "background-color:#8CED8C"; // 浅绿色
|
||
|
||
else if (x.Number == 2)
|
||
style += "background-color:#E5BDE5"; // 浅紫色
|
||
|
||
else if (x.Number == 3)
|
||
style += "background-color:#EACE5D"; // 浅黄色
|
||
|
||
else if (x.Number == 4)
|
||
style += "background-color:#F1F165"; // 浅黄色
|
||
|
||
if (x.Molar > 5)
|
||
style += ";font-weight:bold";
|
||
|
||
return style;
|
||
};
|
||
} |