diff --git a/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptCatalyzerPlugin.cs b/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptCatalyzerPlugin.cs index 3e72d3bcc..4870f7ce5 100644 --- a/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptCatalyzerPlugin.cs +++ b/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptCatalyzerPlugin.cs @@ -1,6 +1,4 @@ -using Microsoft.Extensions.DependencyInjection; using Microsoft.SemanticKernel; -using Senparc.CO2NET; using Senparc.Xncf.PromptRange.Abstractions.Events; using System.ComponentModel; using System.Threading.Tasks; @@ -11,12 +9,9 @@ public class PromptCatalyzerPlugin { private readonly PromptOptimizationService _optimizationService; - public PromptCatalyzerPlugin() + public PromptCatalyzerPlugin(PromptOptimizationService optimizationService) { - // 尝试从 DI 容器获取服务，确保在调用时 ServiceProvider 已就绪 - // 注意：Constructor 注入在 Kernel.Plugins.AddFromType() 时可能需要 Kernel 自身配置了 DI - // 这里为了保险起见，使用 ServiceLocator 作为 backup - _optimizationService = Senparc.CO2NET.SenparcDI.GetServiceProvider().GetRequiredService(); + _optimizationService = optimizationService; } [KernelFunction, Description("Optimize the given prompt code based on user requirement")] diff --git a/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptOptimizationPlugin.cs b/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptOptimizationPlugin.cs index 59ab71341..4639c29b6 100644 --- a/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptOptimizationPlugin.cs +++ b/src/Extensions/Senparc.Xncf.AgentsManager/Domain/Services/AIPlugins/PromptOptimizationPlugin.cs @@ -1,6 +1,4 @@ -using Microsoft.Extensions.DependencyInjection; using Microsoft.SemanticKernel; -using Senparc.CO2NET; using Senparc.Xncf.PromptRange.Abstractions.Events; using Senparc.Xncf.PromptRange.Domain.Services; using Senparc.Xncf.PromptRange.OHS.Local.PL.Request; @@ -23,13 +21,16 @@ public class PromptOptimizationPlugin private readonly PromptRangeService _promptRangeService; private readonly PromptResultService _promptResultService; - public PromptOptimizationPlugin(PromptOptimizationAgentBridge bridge) + public PromptOptimizationPlugin( + PromptOptimizationAgentBridge bridge, + PromptItemService promptItemService, + PromptRangeService promptRangeService, + PromptResultService promptResultService) { _bridge = bridge; - var serviceProvider = SenparcDI.GetServiceProvider(); - _promptItemService = serviceProvider.GetRequiredService(); - _promptRangeService = serviceProvider.GetRequiredService(); - _promptResultService = serviceProvider.GetRequiredService(); + _promptItemService = promptItemService; + _promptRangeService = promptRangeService; + _promptResultService = promptResultService; } private static string UnescapeJsonString(string value) diff --git a/src/Extensions/Senparc.Xncf.AgentsManager/OHS/Remote/Controllers/PromptOptimizationController.cs b/src/Extensions/Senparc.Xncf.AgentsManager/OHS/Remote/Controllers/PromptOptimizationController.cs index 519b76fde..1980bdd10 100644 --- a/src/Extensions/Senparc.Xncf.AgentsManager/OHS/Remote/Controllers/PromptOptimizationController.cs +++ b/src/Extensions/Senparc.Xncf.AgentsManager/OHS/Remote/Controllers/PromptOptimizationController.cs @@ -5,6 +5,7 @@ using Senparc.Ncf.Core.AppServices; using Senparc.Ncf.Core.Exceptions; using Senparc.Xncf.AgentsManager.Domain.Services; +using Senparc.Xncf.AgentsManager.OHS.Local.AppService; using Senparc.Xncf.PromptRange.Abstractions.Events; namespace Senparc.Xncf.AgentsManager.OHS.Remote.Controllers @@ -77,12 +78,7 @@ public async Task OptimizeAsync([FromBody] PromptOptimizationRequ request.Context.CurrentTopP, request.Context.CurrentMaxTokens); - // 🔥 关键修复：确保 Agent 和 ChatGroup 已初始化 - _logger.LogInformation(" 开始确保初始化状态..."); - await _promptOptimizationService.EnsureInitializedAsync(); - _logger.LogInformation(" ✅ 初始化状态确认完成"); - - // 调用优化服务 + // 调用优化服务（内部已包含 EnsureInitializedAsync） _logger.LogInformation(" 开始调用 OptimizePromptAsync..."); var result = await _promptOptimizationService.OptimizePromptAsync( request.PromptCode, @@ -126,19 +122,4 @@ public async Task OptimizeAsync([FromBody] PromptOptimizationRequ } } } - - #region DTOs - - /// - /// Prompt 优化请求 DTO - /// - public class PromptOptimizationRequestDto - { - public string PromptCode { get; set; } - public string PromptContent { get; set; } - public string UserRequirement { get; set; } - public OptimizationContext Context { get; set; } - } - - #endregion } diff --git a/src/Extensions/Senparc.Xncf.XncfBuilder/Senparc.Xncf.XncfBuilder/Generated/Senparc.Xncf.XncfBuilder.DynamicContentGenerator/MultiFileCodeGenerator/BuildXncfAppService.Generated.cs b/src/Extensions/Senparc.Xncf.XncfBuilder/Senparc.Xncf.XncfBuilder/Generated/Senparc.Xncf.XncfBuilder.DynamicContentGenerator/MultiFileCodeGenerator/BuildXncfAppService.Generated.cs index fbd7b9527..f09d62519 100644 --- a/src/Extensions/Senparc.Xncf.XncfBuilder/Senparc.Xncf.XncfBuilder/Generated/Senparc.Xncf.XncfBuilder.DynamicContentGenerator/MultiFileCodeGenerator/BuildXncfAppService.Generated.cs +++ b/src/Extensions/Senparc.Xncf.XncfBuilder/Senparc.Xncf.XncfBuilder/Generated/Senparc.Xncf.XncfBuilder.DynamicContentGenerator/MultiFileCodeGenerator/BuildXncfAppService.Generated.cs @@ -14,73 +14,73 @@ namespace Senparc.Xncf.XncfBuilder.OHS.Local /// public partial class BuildXncfAppService { -public const string BackendTemplate = @$" -## Database EntityFramework DbContext class sample -File Name: Template_XncfNameSenparcEntities.cs -File Path: /Domain/Models/DatabaseModel -Code: -```csharp -{SenparcEntitiesTemplate} -``` - -## Database Entity class sample -File Name: Color.cs -File Path: /Domain/Models/DatabaseModel -Code: -```csharp -{ColorModelTemplate} -``` - -## Database Entity DTO class sample -File Name: ColorDto.cs -File Path: /Domain/Models/DatabaseModel/Dto -Code: -```csharp -{ColorDtoTemplate} -``` - -## Service class sample -File Name: Template_XncfNameService.cs -File Path: /Domain/Services -Code: -```csharp -{ColorServiceTemplate} -``` -"; - -public const string FrontendTemplate = @$" -## Page UI sample (front-end) -File Name: DatabaseSampleIndex.cshtml -File Path: < ModuleRootPath >/ Areas / Admin / Pages / Template_XncfName -Code: -```razorpage -{DatabaseSampleIndexViewTemplate} -``` - -## Page UI sample (back-end) -File Name: DatabaseSampleIndex.cshtml.cs -File Path: < ModuleRootPath >/ Areas / Admin / Pages / Template_XncfName -Code: -```csharp -{DatabaseSampleIndexCodeBehindTemplate} -``` - -## Page JavaScript file sample -File Name: databaseSampleIndex.js -File Path: < ModuleRootPath >/ wwwroot / js / Admin / Template_XncfName -Code: -```javascript -{DatabaseSampleIndexJsTemplate} -``` - -## Page CSS file sample -File Name: databaseSampleIndex.css -File Path: < ModuleRootPath >/ wwwroot / css / Admin / Template_XncfName -Code: -```css -{DatabaseSampleIndexCssTemplate} -``` -"; +public const string BackendTemplate = @$" +## Database EntityFramework DbContext class sample +File Name: Template_XncfNameSenparcEntities.cs +File Path: /Domain/Models/DatabaseModel +Code: +```csharp +{SenparcEntitiesTemplate} +``` + +## Database Entity class sample +File Name: Color.cs +File Path: /Domain/Models/DatabaseModel +Code: +```csharp +{ColorModelTemplate} +``` + +## Database Entity DTO class sample +File Name: ColorDto.cs +File Path: /Domain/Models/DatabaseModel/Dto +Code: +```csharp +{ColorDtoTemplate} +``` + +## Service class sample +File Name: Template_XncfNameService.cs +File Path: /Domain/Services +Code: +```csharp +{ColorServiceTemplate} +``` +"; + +public const string FrontendTemplate = @$" +## Page UI sample (front-end) +File Name: DatabaseSampleIndex.cshtml +File Path: < ModuleRootPath >/ Areas / Admin / Pages / Template_XncfName +Code: +```razorpage +{DatabaseSampleIndexViewTemplate} +``` + +## Page UI sample (back-end) +File Name: DatabaseSampleIndex.cshtml.cs +File Path: < ModuleRootPath >/ Areas / Admin / Pages / Template_XncfName +Code: +```csharp +{DatabaseSampleIndexCodeBehindTemplate} +``` + +## Page JavaScript file sample +File Name: databaseSampleIndex.js +File Path: < ModuleRootPath >/ wwwroot / js / Admin / Template_XncfName +Code: +```javascript +{DatabaseSampleIndexJsTemplate} +``` + +## Page CSS file sample +File Name: databaseSampleIndex.css +File Path: < ModuleRootPath >/ wwwroot / css / Admin / Template_XncfName +Code: +```css +{DatabaseSampleIndexCssTemplate} +``` +"; #region CODE Templates @@ -89,26 +89,26 @@ public partial class BuildXncfAppService /// 请求类代码 /// 类型: code /// - public const string RequestCode = @"using System; -using System.Collections.Generic; -using System.Linq; -using System.Text; -using System.Threading.Tasks; - -namespace Senparc.Xncf.XncfBuilder -{ - public class Request - { - public string? Method { get; set; } - public string? Path { get; set; } - public string? Body { get; set; } - - // 新增字段测试动态更新 - public Dictionary? Headers { get; set; } - public DateTime Timestamp { get; set; } = DateTime.Now; - } - -} + public const string RequestCode = @"using System; +using System.Collections.Generic; +using System.Linq; +using System.Text; +using System.Threading.Tasks; + +namespace Senparc.Xncf.XncfBuilder +{ + public class Request + { + public string? Method { get; set; } + public string? Path { get; set; } + public string? Body { get; set; } + + // 新增字段测试动态更新 + public Dictionary? Headers { get; set; } + public DateTime Timestamp { get; set; } = DateTime.Now; + } + +} "; #endregion @@ -119,237 +119,237 @@ public class Request /// Senparc实体类模板 /// 类型: backend_template /// - public const string SenparcEntitiesTemplate = @"using Microsoft.EntityFrameworkCore; -using Senparc.Ncf.Database; -using Senparc.Ncf.Core.Models; -using Senparc.Ncf.XncfBase.Database; - -namespace Template_OrgName.Xncf.Template_XncfName.Models -{ - public class Template_XncfNameSenparcEntities : XncfDatabaseDbContext - { - public Template_XncfNameSenparcEntities(DbContextOptions dbContextOptions) : base(dbContextOptions) - { - } - - public DbSet Colors { get; set; } - - //DOT REMOVE OR MODIFY THIS LINE 请勿移除或修改本行 - Entities Point - //ex. public DbSet Colors { get; set; } - - //如无特殊需需要，OnModelCreating 方法可以不用写，已经在 Register 中要求注册 - //protected override void OnModelCreating(ModelBuilder modelBuilder) - //{ - //} - } -} + public const string SenparcEntitiesTemplate = @"using Microsoft.EntityFrameworkCore; +using Senparc.Ncf.Database; +using Senparc.Ncf.Core.Models; +using Senparc.Ncf.XncfBase.Database; + +namespace Template_OrgName.Xncf.Template_XncfName.Models +{ + public class Template_XncfNameSenparcEntities : XncfDatabaseDbContext + { + public Template_XncfNameSenparcEntities(DbContextOptions dbContextOptions) : base(dbContextOptions) + { + } + + public DbSet Colors { get; set; } + + //DOT REMOVE OR MODIFY THIS LINE 请勿移除或修改本行 - Entities Point + //ex. public DbSet Colors { get; set; } + + //如无特殊需需要，OnModelCreating 方法可以不用写，已经在 Register 中要求注册 + //protected override void OnModelCreating(ModelBuilder modelBuilder) + //{ + //} + } +} "; /// /// 颜色模型模板 /// 类型: backend_template /// - public const string ColorModelTemplate = @"using Senparc.Ncf.Core.Models; -using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; -using System; -using System.ComponentModel.DataAnnotations.Schema; -using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; - -namespace Template_OrgName.Xncf.Template_XncfName -{ - /// - /// Color 实体类 - /// - [Table(Register.DATABASE_PREFIX + nameof(Color))]//必须添加前缀，防止全系统中发生冲突 - [Serializable] - public class Color : EntityBase - { - /// - /// 颜色码，0-255 - /// - public int Red { get; private set; } - /// - /// 颜色码，0-255 - /// - public int Green { get; private set; } - - /// - /// 颜色码，0-255 - /// - public int Blue { get; private set; } - - /// - /// 附加列，测试多次数据库 Migrate - /// - public string AdditionNote { get; private set; } - - private Color() { } - - public Color(int red, int green, int blue) - { - if (red < 0 || green < 0 || blue < 0) - { - Random();//随机 - } - else - { - Red = red; - Green = green; - Blue = blue; - } - } - - public Color(int red, int green, int blue, string additionNote) : this(red, green, blue) - { - AdditionNote = additionNote; - } - - public Color(ColorDto colorDto) - { - Red = colorDto.Red; - Green = colorDto.Green; - Blue = colorDto.Blue; - } - - public void Random() - { - //随机产生颜色代码 - var radom = new Random(); - Func getRadomColorCode = () => radom.Next(0, 255); - Red = getRadomColorCode(); - Green = getRadomColorCode(); - Blue = getRadomColorCode(); - } - - public void Brighten() - { - Red = Math.Min(255, Red + 10); - Green = Math.Min(255, Green + 10); - Blue = Math.Min(255, Blue + 10); - } - - public void Darken() - { - Red = Math.Max(0, Red - 10); - Green = Math.Max(0, Green - 10); - Blue = Math.Max(0, Blue - 10); - } - - public void Update(UpdateColorRequestDto dto) - { - Red = dto.Red; - Green = dto.Green; - Blue = dto.Blue; - AdditionNote = dto.AdditionNote; - } - } -} + public const string ColorModelTemplate = @"using Senparc.Ncf.Core.Models; +using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; +using System; +using System.ComponentModel.DataAnnotations.Schema; +using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; + +namespace Template_OrgName.Xncf.Template_XncfName +{ + /// + /// Color 实体类 + /// + [Table(Register.DATABASE_PREFIX + nameof(Color))]//必须添加前缀，防止全系统中发生冲突 + [Serializable] + public class Color : EntityBase + { + /// + /// 颜色码，0-255 + /// + public int Red { get; private set; } + /// + /// 颜色码，0-255 + /// + public int Green { get; private set; } + + /// + /// 颜色码，0-255 + /// + public int Blue { get; private set; } + + /// + /// 附加列，测试多次数据库 Migrate + /// + public string AdditionNote { get; private set; } + + private Color() { } + + public Color(int red, int green, int blue) + { + if (red < 0 || green < 0 || blue < 0) + { + Random();//随机 + } + else + { + Red = red; + Green = green; + Blue = blue; + } + } + + public Color(int red, int green, int blue, string additionNote) : this(red, green, blue) + { + AdditionNote = additionNote; + } + + public Color(ColorDto colorDto) + { + Red = colorDto.Red; + Green = colorDto.Green; + Blue = colorDto.Blue; + } + + public void Random() + { + //随机产生颜色代码 + var radom = new Random(); + Func getRadomColorCode = () => radom.Next(0, 255); + Red = getRadomColorCode(); + Green = getRadomColorCode(); + Blue = getRadomColorCode(); + } + + public void Brighten() + { + Red = Math.Min(255, Red + 10); + Green = Math.Min(255, Green + 10); + Blue = Math.Min(255, Blue + 10); + } + + public void Darken() + { + Red = Math.Max(0, Red - 10); + Green = Math.Max(0, Green - 10); + Blue = Math.Max(0, Blue - 10); + } + + public void Update(UpdateColorRequestDto dto) + { + Red = dto.Red; + Green = dto.Green; + Blue = dto.Blue; + AdditionNote = dto.AdditionNote; + } + } +} "; /// /// 颜色DTO模板 /// 类型: backend_template /// - public const string ColorDtoTemplate = @"using Senparc.Ncf.Core.Models; - -namespace Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto -{ - public class ColorDto : DtoBase - { - /// - /// 颜色码，0-255 - /// - public int Red { get; set; } - /// - /// 颜色码，0-255 - /// - public int Green { get; set; } - /// - /// 颜色码，0-255 - /// - public int Blue { get; set; } - - /// - /// 附加列，测试多次数据库 Migrate - /// - public string AdditionNote { get; set; } - - public ColorDto() { } - } -} + public const string ColorDtoTemplate = @"using Senparc.Ncf.Core.Models; + +namespace Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto +{ + public class ColorDto : DtoBase + { + /// + /// 颜色码，0-255 + /// + public int Red { get; set; } + /// + /// 颜色码，0-255 + /// + public int Green { get; set; } + /// + /// 颜色码，0-255 + /// + public int Blue { get; set; } + + /// + /// 附加列，测试多次数据库 Migrate + /// + public string AdditionNote { get; set; } + + public ColorDto() { } + } +} "; /// /// 颜色服务模板 /// 类型: backend_template /// - public const string ColorServiceTemplate = @"using Senparc.Ncf.Core.Enums; -using Senparc.Ncf.Repository; -using Senparc.Ncf.Service; -using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; -using System; -using System.Threading.Tasks; - -namespace Template_OrgName.Xncf.Template_XncfName.Domain.Services -{ - public class ColorService : ServiceBase - { - public ColorService(IRepositoryBase repo, IServiceProvider serviceProvider) - : base(repo, serviceProvider) - { - } - - public async Task CreateNewColor() - { - Color color = new Color(-1, -1, -1); - await base.SaveObjectAsync(color).ConfigureAwait(false); - ColorDto colorDto = base.Mapper.Map(color); - return colorDto; - } - - public async Task GetOrInitColor() - { - var color = await base.GetObjectAsync(z => true); - if (color == null)//如果是纯第一次安装，理论上不会有残留数据 - { - //创建默认颜色 - ColorDto colorDto = await this.CreateNewColor().ConfigureAwait(false); - return colorDto; - } - - return base.Mapper.Map(color); - } - - public async Task Brighten() - { - //TODO:异步方法需要添加排序功能 - var obj = await this.GetObjectAsync(z => true, z => z.Id, OrderingType.Descending); - obj.Brighten(); - await base.SaveObjectAsync(obj).ConfigureAwait(false); - return base.Mapper.Map(obj); - } - - public async Task Darken() - { - //TODO:异步方法需要添加排序功能 - var obj = await this.GetObjectAsync(z => true, z => z.Id, OrderingType.Descending); - obj.Darken(); - await base.SaveObjectAsync(obj).ConfigureAwait(false); - return base.Mapper.Map(obj); - } - - public async Task Random() - { - //TODO:异步方法需要添加排序功能 - var obj = await this.GetObjectAsync(z => true, z => z.Id, OrderingType.Descending); - obj.Random(); - await base.SaveObjectAsync(obj).ConfigureAwait(false); - return base.Mapper.Map(obj); - } - - //TODO: 更多业务方法可以写到这里 - } -} + public const string ColorServiceTemplate = @"using Senparc.Ncf.Core.Enums; +using Senparc.Ncf.Repository; +using Senparc.Ncf.Service; +using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; +using System; +using System.Threading.Tasks; + +namespace Template_OrgName.Xncf.Template_XncfName.Domain.Services +{ + public class ColorService : ServiceBase + { + public ColorService(IRepositoryBase repo, IServiceProvider serviceProvider) + : base(repo, serviceProvider) + { + } + + public async Task CreateNewColor() + { + Color color = new Color(-1, -1, -1); + await base.SaveObjectAsync(color).ConfigureAwait(false); + ColorDto colorDto = base.Mapper.Map(color); + return colorDto; + } + + public async Task GetOrInitColor() + { + var color = await base.GetObjectAsync(z => true); + if (color == null)//如果是纯第一次安装，理论上不会有残留数据 + { + //创建默认颜色 + ColorDto colorDto = await this.CreateNewColor().ConfigureAwait(false); + return colorDto; + } + + return base.Mapper.Map(color); + } + + public async Task Brighten() + { + //TODO:异步方法需要添加排序功能 + var obj = await this.GetObjectAsync(z => true, z => z.Id, OrderingType.Descending); + obj.Brighten(); + await base.SaveObjectAsync(obj).ConfigureAwait(false); + return base.Mapper.Map(obj); + } + + public async Task Darken() + { + //TODO:异步方法需要添加排序功能 + var obj = await this.GetObjectAsync(z => true, z => z.Id, OrderingType.Descending); + obj.Darken(); + await base.SaveObjectAsync(obj).ConfigureAwait(false); + return base.Mapper.Map(obj); + } + + public async Task Random() + { + //TODO:异步方法需要添加排序功能 + var obj = await this.GetObjectAsync(z => true, z => z.Id, OrderingType.Descending); + obj.Random(); + await base.SaveObjectAsync(obj).ConfigureAwait(false); + return base.Mapper.Map(obj); + } + + //TODO: 更多业务方法可以写到这里 + } +} "; #endregion @@ -360,431 +360,431 @@ public async Task Random() /// 数据库示例索引页面视图模板 /// 类型: frontend_template /// - public const string DatabaseSampleIndexViewTemplate = @"@page -@model Template_OrgName.Xncf.Template_XncfName.Areas.Template_XncfName.Pages.DatabaseSampleIndex -@{ - ViewData[""Title""] = ""Color 数据库管理""; - Layout = ""_Layout_Vue""; -} - -@section Style { - -} - -@section breadcrumbs { - 扩展模块 - Template_MenuName - Color 数据库管理 -} - -
-
- 添加颜色 - 刷新 - 调试信息 -
- - -
-

调试信息：

-

tableData长度: {{ tableData ? tableData.length : 'null/undefined' }}

-

total: {{ total }}

-

tableLoading: {{ tableLoading }}

-

Vue实例是否正常: {{ $el ? '是' : '否' }}

-
0""> - 第一条数据: - 
{{ JSON.stringify(tableData[0], null, 2) }}
-
- - -
-
简化数据显示测试:
-
- ID: {{item.id}} | - RGB: {{item.red}},{{item.green}},{{item.blue}} | - 时间: {{item.addTime}} -
-

- 没有数据显示！ -

-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - -
- - -
- - @* dialog for 添加颜色 *@ - - - - - - - - - - - - -
- RGB({{addForm.red}}, {{addForm.green}}, {{addForm.blue}}) -
- - - - - - 随机颜色 - - - - 取 消 - 确 定 - - - - @* dialog for 编辑颜色 *@ - - - - - - - - - - - - -
- RGB({{editForm.red}}, {{editForm.green}}, {{editForm.blue}}) -
- - - - - - 随机颜色 - - - - 取 消 - 确 定 - - -
- -@section scripts{ - + public const string DatabaseSampleIndexViewTemplate = @"@page +@model Template_OrgName.Xncf.Template_XncfName.Areas.Template_XncfName.Pages.DatabaseSampleIndex +@{ + ViewData[""Title""] = ""Color 数据库管理""; + Layout = ""_Layout_Vue""; +} + +@section Style { + +} + +@section breadcrumbs { + 扩展模块 + Template_MenuName + Color 数据库管理 +} + +
+
+ 添加颜色 + 刷新 + 调试信息 +
+ + +
+

调试信息：

+

tableData长度: {{ tableData ? tableData.length : 'null/undefined' }}

+

total: {{ total }}

+

tableLoading: {{ tableLoading }}

+

Vue实例是否正常: {{ $el ? '是' : '否' }}

+
0""> + 第一条数据: + 
{{ JSON.stringify(tableData[0], null, 2) }}
+
+ + +
+
简化数据显示测试:
+
+ ID: {{item.id}} | + RGB: {{item.red}},{{item.green}},{{item.blue}} | + 时间: {{item.addTime}} +
+

+ 没有数据显示！ +

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + @* dialog for 添加颜色 *@ + + + + + + + + + + + + +
+ RGB({{addForm.red}}, {{addForm.green}}, {{addForm.blue}}) +
+ + + + + + 随机颜色 + + + + 取 消 + 确 定 + + + + @* dialog for 编辑颜色 *@ + + + + + + + + + + + + +
+ RGB({{editForm.red}}, {{editForm.green}}, {{editForm.blue}}) +
+ + + + + + 随机颜色 + + + + 取 消 + 确 定 + + +
+ +@section scripts{ + } "; /// /// 数据库示例索引页面代码后置模板 /// 类型: frontend_template /// - public const string DatabaseSampleIndexCodeBehindTemplate = @"using Microsoft.AspNetCore.Mvc; -using Senparc.Ncf.Service; -using Senparc.Ncf.Utility; -using Template_OrgName.Xncf.Template_XncfName.Domain.Services; -using System; -using System.Linq; -using System.Threading.Tasks; -using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; - -namespace Template_OrgName.Xncf.Template_XncfName.Areas.Template_XncfName.Pages -{ - public class DatabaseSampleIndex : Senparc.Ncf.AreaBase.Admin.AdminXncfModulePageModelBase - { - private readonly ColorService _colorService; - - public DatabaseSampleIndex(Lazy xncfModuleService, ColorService colorService) : base(xncfModuleService) - { - _colorService = colorService; - } - - public void OnGet() - { - } - - /// - /// 获取颜色列表（分页） - /// - /// 关键词 - /// 排序字段 - /// 页码 - /// 页大小 - /// - public async Task OnGetColorListAsync(string keyword, string orderField, int pageIndex, int pageSize) - { - try - { - // 调试信息 - System.Diagnostics.Debug.WriteLine($""ColorList API Called - PageIndex: {pageIndex}, PageSize: {pageSize}, OrderField: {orderField}""); - - var seh = new SenparcExpressionHelper(); - // 可以根据需要添加搜索条件 - // seh.ValueCompare.AndAlso(!string.IsNullOrEmpty(keyword), _ => _.Remark.Contains(keyword)); - var where = seh.BuildWhereExpression(); - var response = await _colorService.GetObjectListAsync(pageIndex, pageSize, where, orderField ?? ""Id desc""); - - // 调试信息 - System.Diagnostics.Debug.WriteLine($""Database Query Result - TotalCount: {response.TotalCount}, ItemCount: {response.Count()}""); - - var result = new - { - success = true, - message = ""数据获取成功"", - data = new { - totalCount = response.TotalCount, - pageIndex = response.PageIndex, - list = response.Select(_ => new - { - id = _.Id, - red = _.Red, - green = _.Green, - blue = _.Blue, - additionNote = _.AdditionNote, - addTime = _.AddTime, - lastUpdateTime = _.LastUpdateTime, - remark = _.Remark - }).ToList() - } - }; - - // 调试信息 - System.Diagnostics.Debug.WriteLine($""API Response - ListCount: {result.data.list.Count}""); - - return Ok(result); - } - catch (Exception ex) - { - System.Diagnostics.Debug.WriteLine($""ColorList API Error: {ex.Message}""); - return Ok(new { - success = false, - message = ""获取数据失败: "" + ex.Message, - totalCount = 0, - pageIndex = pageIndex, - list = new object[0] - }); - } - } - - /// - /// 创建新颜色 - /// - /// 创建颜色请求 - /// - public async Task OnPostCreateColorAsync([FromBody] CreateColorRequestDto request) - { - try - { - // 调试信息 - System.Diagnostics.Debug.WriteLine($""CreateColor API Called - Red: {request.Red}, Green: {request.Green}, Blue: {request.Blue}, AdditionNote: {request.AdditionNote}""); - - if (request == null) - { - return Ok(new { success = false, message = ""请求参数不能为空"" }); - } - - var color = new Color(request.Red, request.Green, request.Blue, request.AdditionNote); - await _colorService.SaveObjectAsync(color); - - return Ok(new { success = true, message = ""颜色创建成功"", data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.AddTime, color.LastUpdateTime } }); - } - catch (Exception ex) - { - System.Diagnostics.Debug.WriteLine($""CreateColor API Error: {ex.Message}""); - return Ok(new { success = false, message = ""创建失败："" + ex.Message }); - } - } - - /// - /// 更新颜色 - /// - /// 更新颜色请求 - /// - public async Task OnPostUpdateColorAsync([FromBody] UpdateColorRequestDto request) - { - try - { - // 调试信息 - System.Diagnostics.Debug.WriteLine($""UpdateColor API Called - Id: {request.Id}, Red: {request.Red}, Green: {request.Green}, Blue: {request.Blue}, AdditionNote: {request.AdditionNote}""); - - if (request == null) - { - return Ok(new { success = false, message = ""请求参数不能为空"" }); - } - - var color = await _colorService.GetObjectAsync(c => c.Id == request.Id); - if (color == null) - { - return Ok(new { success = false, message = ""颜色不存在"" }); - } - - // 更新 - color.Update(request); - - await _colorService.SaveObjectAsync(color); - - return Ok(new { success = true, message = ""颜色更新成功"", data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.LastUpdateTime } }); - } - catch (Exception ex) - { - System.Diagnostics.Debug.WriteLine($""UpdateColor API Error: {ex.Message}""); - return Ok(new { success = false, message = ""更新失败："" + ex.Message }); - } - } - - /// - /// 删除颜色 - /// - /// 删除颜色请求 - /// - public async Task OnPostDeleteColorAsync([FromBody] DeleteColorRequestDto request) - { - try - { - // 调试信息 - System.Diagnostics.Debug.WriteLine($""DeleteColor API Called - Id: {request.Id}""); - - if (request == null) - { - return Ok(new { success = false, message = ""请求参数不能为空"" }); - } - - var color = await _colorService.GetObjectAsync(c => c.Id == request.Id); - if (color == null) - { - return Ok(new { success = false, message = ""颜色不存在"" }); - } - - await _colorService.DeleteObjectAsync(color); - return Ok(new { success = true, message = ""颜色删除成功"" }); - } - catch (Exception ex) - { - System.Diagnostics.Debug.WriteLine($""DeleteColor API Error: {ex.Message}""); - return Ok(new { success = false, message = ""删除失败："" + ex.Message }); - } - } - - /// - /// 随机化指定颜色 - /// - /// 随机化颜色请求 - /// - public async Task OnPostRandomizeColorAsync([FromBody] RandomizeColorRequestDto request) - { - try - { - // 调试信息 - System.Diagnostics.Debug.WriteLine($""RandomizeColor API Called - Id: {request.Id}""); - - if (request == null) - { - return Ok(new { success = false, message = ""请求参数不能为空"" }); - } - - var color = await _colorService.GetObjectAsync(c => c.Id == request.Id); - if (color == null) - { - return Ok(new { success = false, message = ""颜色不存在"" }); - } - - color.Random(); - await _colorService.SaveObjectAsync(color); - - return Ok(new { success = true, message = ""颜色随机化成功"", data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.LastUpdateTime } }); - } - catch (Exception ex) - { - System.Diagnostics.Debug.WriteLine($""RandomizeColor API Error: {ex.Message}""); - return Ok(new { success = false, message = ""随机化失败："" + ex.Message }); - } - } - - /// - /// 获取颜色详情 - /// - /// 颜色ID - /// - public async Task OnGetColorDetailAsync(int id) - { - try - { - var color = await _colorService.GetObjectAsync(c => c.Id == id); - if (color == null) - { - return Ok(new { success = false, message = ""颜色不存在"" }); - } - - return Ok(new { success = true, data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.AddTime, color.LastUpdateTime, color.Remark } }); - } - catch (Exception ex) - { - return Ok(new { success = false, message = ""获取失败："" + ex.Message }); - } - } - } + public const string DatabaseSampleIndexCodeBehindTemplate = @"using Microsoft.AspNetCore.Mvc; +using Senparc.Ncf.Service; +using Senparc.Ncf.Utility; +using Template_OrgName.Xncf.Template_XncfName.Domain.Services; +using System; +using System.Linq; +using System.Threading.Tasks; +using Template_OrgName.Xncf.Template_XncfName.Domain.Models.DatabaseModel.Dto; + +namespace Template_OrgName.Xncf.Template_XncfName.Areas.Template_XncfName.Pages +{ + public class DatabaseSampleIndex : Senparc.Ncf.AreaBase.Admin.AdminXncfModulePageModelBase + { + private readonly ColorService _colorService; + + public DatabaseSampleIndex(Lazy xncfModuleService, ColorService colorService) : base(xncfModuleService) + { + _colorService = colorService; + } + + public void OnGet() + { + } + + /// + /// 获取颜色列表（分页） + /// + /// 关键词 + /// 排序字段 + /// 页码 + /// 页大小 + /// + public async Task OnGetColorListAsync(string keyword, string orderField, int pageIndex, int pageSize) + { + try + { + // 调试信息 + System.Diagnostics.Debug.WriteLine($""ColorList API Called - PageIndex: {pageIndex}, PageSize: {pageSize}, OrderField: {orderField}""); + + var seh = new SenparcExpressionHelper(); + // 可以根据需要添加搜索条件 + // seh.ValueCompare.AndAlso(!string.IsNullOrEmpty(keyword), _ => _.Remark.Contains(keyword)); + var where = seh.BuildWhereExpression(); + var response = await _colorService.GetObjectListAsync(pageIndex, pageSize, where, orderField ?? ""Id desc""); + + // 调试信息 + System.Diagnostics.Debug.WriteLine($""Database Query Result - TotalCount: {response.TotalCount}, ItemCount: {response.Count()}""); + + var result = new + { + success = true, + message = ""数据获取成功"", + data = new { + totalCount = response.TotalCount, + pageIndex = response.PageIndex, + list = response.Select(_ => new + { + id = _.Id, + red = _.Red, + green = _.Green, + blue = _.Blue, + additionNote = _.AdditionNote, + addTime = _.AddTime, + lastUpdateTime = _.LastUpdateTime, + remark = _.Remark + }).ToList() + } + }; + + // 调试信息 + System.Diagnostics.Debug.WriteLine($""API Response - ListCount: {result.data.list.Count}""); + + return Ok(result); + } + catch (Exception ex) + { + System.Diagnostics.Debug.WriteLine($""ColorList API Error: {ex.Message}""); + return Ok(new { + success = false, + message = ""获取数据失败: "" + ex.Message, + totalCount = 0, + pageIndex = pageIndex, + list = new object[0] + }); + } + } + + /// + /// 创建新颜色 + /// + /// 创建颜色请求 + /// + public async Task OnPostCreateColorAsync([FromBody] CreateColorRequestDto request) + { + try + { + // 调试信息 + System.Diagnostics.Debug.WriteLine($""CreateColor API Called - Red: {request.Red}, Green: {request.Green}, Blue: {request.Blue}, AdditionNote: {request.AdditionNote}""); + + if (request == null) + { + return Ok(new { success = false, message = ""请求参数不能为空"" }); + } + + var color = new Color(request.Red, request.Green, request.Blue, request.AdditionNote); + await _colorService.SaveObjectAsync(color); + + return Ok(new { success = true, message = ""颜色创建成功"", data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.AddTime, color.LastUpdateTime } }); + } + catch (Exception ex) + { + System.Diagnostics.Debug.WriteLine($""CreateColor API Error: {ex.Message}""); + return Ok(new { success = false, message = ""创建失败："" + ex.Message }); + } + } + + /// + /// 更新颜色 + /// + /// 更新颜色请求 + /// + public async Task OnPostUpdateColorAsync([FromBody] UpdateColorRequestDto request) + { + try + { + // 调试信息 + System.Diagnostics.Debug.WriteLine($""UpdateColor API Called - Id: {request.Id}, Red: {request.Red}, Green: {request.Green}, Blue: {request.Blue}, AdditionNote: {request.AdditionNote}""); + + if (request == null) + { + return Ok(new { success = false, message = ""请求参数不能为空"" }); + } + + var color = await _colorService.GetObjectAsync(c => c.Id == request.Id); + if (color == null) + { + return Ok(new { success = false, message = ""颜色不存在"" }); + } + + // 更新 + color.Update(request); + + await _colorService.SaveObjectAsync(color); + + return Ok(new { success = true, message = ""颜色更新成功"", data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.LastUpdateTime } }); + } + catch (Exception ex) + { + System.Diagnostics.Debug.WriteLine($""UpdateColor API Error: {ex.Message}""); + return Ok(new { success = false, message = ""更新失败："" + ex.Message }); + } + } + + /// + /// 删除颜色 + /// + /// 删除颜色请求 + /// + public async Task OnPostDeleteColorAsync([FromBody] DeleteColorRequestDto request) + { + try + { + // 调试信息 + System.Diagnostics.Debug.WriteLine($""DeleteColor API Called - Id: {request.Id}""); + + if (request == null) + { + return Ok(new { success = false, message = ""请求参数不能为空"" }); + } + + var color = await _colorService.GetObjectAsync(c => c.Id == request.Id); + if (color == null) + { + return Ok(new { success = false, message = ""颜色不存在"" }); + } + + await _colorService.DeleteObjectAsync(color); + return Ok(new { success = true, message = ""颜色删除成功"" }); + } + catch (Exception ex) + { + System.Diagnostics.Debug.WriteLine($""DeleteColor API Error: {ex.Message}""); + return Ok(new { success = false, message = ""删除失败："" + ex.Message }); + } + } + + /// + /// 随机化指定颜色 + /// + /// 随机化颜色请求 + /// + public async Task OnPostRandomizeColorAsync([FromBody] RandomizeColorRequestDto request) + { + try + { + // 调试信息 + System.Diagnostics.Debug.WriteLine($""RandomizeColor API Called - Id: {request.Id}""); + + if (request == null) + { + return Ok(new { success = false, message = ""请求参数不能为空"" }); + } + + var color = await _colorService.GetObjectAsync(c => c.Id == request.Id); + if (color == null) + { + return Ok(new { success = false, message = ""颜色不存在"" }); + } + + color.Random(); + await _colorService.SaveObjectAsync(color); + + return Ok(new { success = true, message = ""颜色随机化成功"", data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.LastUpdateTime } }); + } + catch (Exception ex) + { + System.Diagnostics.Debug.WriteLine($""RandomizeColor API Error: {ex.Message}""); + return Ok(new { success = false, message = ""随机化失败："" + ex.Message }); + } + } + + /// + /// 获取颜色详情 + /// + /// 颜色ID + /// + public async Task OnGetColorDetailAsync(int id) + { + try + { + var color = await _colorService.GetObjectAsync(c => c.Id == id); + if (color == null) + { + return Ok(new { success = false, message = ""颜色不存在"" }); + } + + return Ok(new { success = true, data = new { color.Id, color.Red, color.Green, color.Blue, color.AdditionNote, color.AddTime, color.LastUpdateTime, color.Remark } }); + } + catch (Exception ex) + { + return Ok(new { success = false, message = ""获取失败："" + ex.Message }); + } + } + } } "; #endregion @@ -795,433 +795,433 @@ public async Task OnGetColorDetailAsync(int id) /// 数据库示例索引页面JavaScript模板 /// 类型: frontend_script /// - public const string DatabaseSampleIndexJsTemplate = @"var app = new Vue({ - el: ""#app"", - data() { - return { - page: { - page: 1, - size: 10 - }, - tableLoading: true, - tableData: [], - showDebug: false, - addFormDialogVisible: false, - addForm: { - red: 128, - green: 128, - blue: 128, - additionNote: '' - }, - editFormDialogVisible: false, - editForm: { - id: 0, - red: 128, - green: 128, - blue: 128, - additionNote: '' - }, - total: 0, - addRules: { - red: [ - { required: true, message: '请设置红色值', trigger: 'change' }, - { type: 'number', min: 0, max: 255, message: '红色值范围为0-255', trigger: 'change' } - ], - green: [ - { required: true, message: '请设置绿色值', trigger: 'change' }, - { type: 'number', min: 0, max: 255, message: '绿色值范围为0-255', trigger: 'change' } - ], - blue: [ - { required: true, message: '请设置蓝色值', trigger: 'change' }, - { type: 'number', min: 0, max: 255, message: '蓝色值范围为0-255', trigger: 'change' } - ] - }, - editRules: { - red: [ - { required: true, message: '请设置红色值', trigger: 'change' }, - { type: 'number', min: 0, max: 255, message: '红色值范围为0-255', trigger: 'change' } - ], - green: [ - { required: true, message: '请设置绿色值', trigger: 'change' }, - { type: 'number', min: 0, max: 255, message: '绿色值范围为0-255', trigger: 'change' } - ], - blue: [ - { required: true, message: '请设置蓝色值', trigger: 'change' }, - { type: 'number', min: 0, max: 255, message: '蓝色值范围为0-255', trigger: 'change' } - ] - } - } - }, - mounted() { - //wait page load - setTimeout(async () => { - await this.init(); - }, 100) - }, - methods: { - async init() { - await this.getDataList(); - }, - async handleSizeChange(val) { - this.page.size = val; - await this.getDataList(); - }, - async handleCurrentChange(val) { - this.page.page = val; - await this.getDataList(); - }, - async getDataList() { - this.tableLoading = true - await service.get('/Admin/Template_XncfName/DatabaseSampleIndex?handler=ColorList', { - params: { - pageIndex: this.page.page, - pageSize: this.page.size, - orderField: ""Id desc"", - keyword: """" - } - }) - .then(res => { - console.log('=== API Response Debug ==='); - console.log('Complete Response:', res); - console.log('Response Data:', res.data); - console.log('Response Data Type:', typeof res.data); - console.log('Has res.data.data?:', res.data && res.data.data); - console.log('Has res.data.data.list?:', res.data && res.data.data && res.data.data.list); - console.log('res.data.data.list value:', res.data && res.data.data ? res.data.data.list : 'nested data not found'); - console.log('=================='); - - // 尝试多种可能的数据结构 - let dataList = null; - let totalCount = 0; - let dataSource = ''; - - if (res.data && res.data.data && res.data.data.data && res.data.data.data.list) { - // NCF框架标准格式 + 新的API格式: {data: {data: {success, message, data: {list, totalCount}}}} - dataList = res.data.data.data.list; - totalCount = res.data.data.data.totalCount || 0; - dataSource = 'NCF标准格式: res.data.data.data.list'; - console.log('✅ 使用NCF标准格式: res.data.data.data.list'); - console.log('✅ List数据:', dataList); - console.log('✅ TotalCount:', totalCount); - } else if (res.data && res.data.data && res.data.data.list) { - // 简单格式: {data: {list, totalCount}} - dataList = res.data.data.list; - totalCount = res.data.data.totalCount || 0; - dataSource = '简单格式: res.data.data.list'; - console.log('✅ 使用简单格式: res.data.data.list'); - } else if (res.data && Array.isArray(res.data)) { - // 如果data直接是数组 - dataList = res.data; - totalCount = res.data.length; - dataSource = '数组格式: res.data (array)'; - console.log('✅ 使用数组格式: res.data (array)'); - } else if (res && res.list) { - // 如果list在顶层 - dataList = res.list; - totalCount = res.totalCount || 0; - dataSource = '顶层格式: res.list'; - console.log('✅ 使用顶层格式: res.list'); - } else { - console.error('❌ 无法识别的数据格式:', res); - console.log('🔍 尝试的路径:'); - console.log('- res.data.data.list:', res.data && res.data.data ? res.data.data.list : 'not found'); - console.log('- res.data.list:', res.data ? res.data.list : 'not found'); - console.log('- res.data (array):', res.data && Array.isArray(res.data) ? 'is array' : 'not array'); - console.log('- res.list:', res.list ? res.list : 'not found'); - dataList = []; - totalCount = 0; - dataSource = '无法识别格式'; - } - - console.log('🎯 Final dataList:', dataList); - console.log('🎯 Final totalCount:', totalCount); - console.log('🎯 Data source:', dataSource); - - // 数据赋值前的状态 - console.log('📋 赋值前 tableData:', this.tableData); - console.log('📋 赋值前 total:', this.total); - - this.tableData = dataList || []; - this.total = totalCount; - - // 数据赋值后的状态 - console.log('📋 赋值后 tableData:', this.tableData); - console.log('📋 赋值后 tableData.length:', this.tableData.length); - console.log('📋 赋值后 total:', this.total); - - // 强制Vue更新 - this.$forceUpdate(); - console.log('🔄 Vue已强制更新'); - - // 延迟检查数据是否正确绑定 - setTimeout(() => { - console.log('⏰ 延迟检查 tableData:', this.tableData); - console.log('⏰ 延迟检查 tableData.length:', this.tableData ? this.tableData.length : 'null'); - }, 100); - - this.tableLoading = false - }) - .catch(error => { - console.error('获取数据失败:', error); - this.tableLoading = false; - this.$message.error('获取数据失败: ' + (error.message || error)); - }); - }, - addColor() { - this.addFormDialogVisible = true; - }, - refreshList() { - this.getDataList(); - }, - async addColorSubmit() { - this.$refs.addForm.validate(async (valid) => { - if (valid) { - console.log('📤 发送创建请求:', { - red: this.addForm.red, - green: this.addForm.green, - blue: this.addForm.blue, - additionNote: this.addForm.additionNote - }); - - await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=CreateColor', { - red: this.addForm.red, - green: this.addForm.green, - blue: this.addForm.blue, - additionNote: this.addForm.additionNote - }, { - headers: { - 'Content-Type': 'application/json' - } - }) - .then(res => { - console.log('📥 创建响应:', res); - // 兼容NCF框架的嵌套响应格式 - const responseData = res.data.data || res.data; - this.$message({ - type: responseData.success ? 'success' : 'error', - message: responseData.message || '操作完成' - }); - if (responseData.success) { - this.getDataList() - this.clearAddForm() - this.addFormDialogVisible = false; - } - }) - .catch(error => { - console.error('创建失败:', error); - this.$message.error('创建失败'); - }); - } else { - return false; - } - }); - }, - clearAddForm() { - this.addForm = { - red: 128, - green: 128, - blue: 128, - additionNote: '' - }; - if (this.$refs.addForm) { - this.$refs.addForm.resetFields(); - } - }, - clearEditForm() { - this.editForm = { - id: 0, - red: 128, - green: 128, - blue: 128, - additionNote: '' - }; - if (this.$refs.editForm) { - this.$refs.editForm.resetFields(); - } - }, - async editColorSubmit() { - this.$refs.editForm.validate(async (valid) => { - if (valid) { - console.log('📤 发送更新请求:', { - id: this.editForm.id, - red: this.editForm.red, - green: this.editForm.green, - blue: this.editForm.blue, - additionNote: this.editForm.additionNote - }); - - await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=UpdateColor', { - id: this.editForm.id, - red: this.editForm.red, - green: this.editForm.green, - blue: this.editForm.blue, - additionNote: this.editForm.additionNote - }, { - headers: { - 'Content-Type': 'application/json' - } - }) - .then(res => { - console.log('📥 更新响应:', res); - // 兼容NCF框架的嵌套响应格式 - const responseData = res.data.data || res.data; - this.$message({ - type: responseData.success ? 'success' : 'error', - message: responseData.message || '操作完成' - }); - if (responseData.success) { - this.getDataList() - this.clearEditForm() - this.editFormDialogVisible = false; - } - }) - .catch(error => { - console.error('更新失败:', error); - this.$message.error('更新失败'); - }); - } else { - return false; - } - }); - }, - dateformatter(date) { - if (!date) return ''; - - try { - // 使用原生JavaScript格式化日期 - const d = new Date(date); - - // 检查日期是否有效 - if (isNaN(d.getTime())) { - return date; // 如果无法解析，返回原始值 - } - - // 格式化为 YYYY-MM-DD HH:mm:ss - const year = d.getFullYear(); - const month = String(d.getMonth() + 1).padStart(2, '0'); - const day = String(d.getDate()).padStart(2, '0'); - const hours = String(d.getHours()).padStart(2, '0'); - const minutes = String(d.getMinutes()).padStart(2, '0'); - const seconds = String(d.getSeconds()).padStart(2, '0'); - - return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; - } catch (error) { - console.warn('日期格式化错误:', error, '原始值:', date); - return date; // 如果格式化失败，返回原始值 - } - }, - editColor(row) { - this.editForm = { - id: row.id, - red: row.red, - green: row.green, - blue: row.blue, - additionNote: row.additionNote || '' - }; - this.editFormDialogVisible = true; - }, - deleteColor(row) { - this.$confirm('此操作将永久删除该颜色, 是否继续?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' - }).then(async () => { - console.log('📤 发送删除请求:', { id: row.id }); - - await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=DeleteColor', { - id: row.id - }, { - headers: { - 'Content-Type': 'application/json' - } - }) - .then(res => { - console.log('📥 删除响应:', res); - // 兼容NCF框架的嵌套响应格式 - const responseData = res.data.data || res.data; - this.$message({ - type: responseData.success ? 'success' : 'error', - message: responseData.message || '操作完成' - }); - if (responseData.success) { - this.getDataList(); - } - }) - .catch(error => { - console.error('删除失败:', error); - this.$message.error('删除失败'); - }); - }).catch(() => { - this.$message({ - type: 'info', - message: '已取消删除' - }); - }); - }, - async randomizeColor(row) { - console.log('📤 发送随机化请求:', { id: row.id }); - - await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=RandomizeColor', { - id: row.id - }, { - headers: { - 'Content-Type': 'application/json' - } - }) - .then(res => { - console.log('📥 随机化响应:', res); - // 兼容NCF框架的嵌套响应格式 - const responseData = res.data.data || res.data; - this.$message({ - type: responseData.success ? 'success' : 'error', - message: responseData.message || '操作完成' - }); - if (responseData.success) { - this.getDataList(); - } - }) - .catch(error => { - console.error('随机化失败:', error); - this.$message.error('随机化失败'); - }); - }, - randomizeForm() { - this.addForm.red = Math.floor(Math.random() * 256); - this.addForm.green = Math.floor(Math.random() * 256); - this.addForm.blue = Math.floor(Math.random() * 256); - }, - randomizeEditForm() { - this.editForm.red = Math.floor(Math.random() * 256); - this.editForm.green = Math.floor(Math.random() * 256); - this.editForm.blue = Math.floor(Math.random() * 256); - }, - debugInfo() { - this.showDebug = !this.showDebug; - console.log('=== Vue Component Debug Info ==='); - console.log('Current tableData:', this.tableData); - console.log('tableData length:', this.tableData ? this.tableData.length : 'null/undefined'); - console.log('Total:', this.total); - console.log('Page:', this.page); - console.log('Table Loading:', this.tableLoading); - console.log('Show Debug:', this.showDebug); - console.log('Vue instance $el:', this.$el); - console.log('================================'); - - // 测试Vue响应性 - if (this.tableData && this.tableData.length === 0) { - console.log('测试：添加假数据'); - this.tableData = [ - {id: 999, red: 255, green: 0, blue: 0, addTime: new Date().toISOString(), lastUpdateTime: new Date().toISOString(), remark: 'test'} - ]; - this.total = 1; - setTimeout(() => { - console.log('2秒后清除假数据'); - this.tableData = []; - this.total = 0; - }, 2000); - } - } - } + public const string DatabaseSampleIndexJsTemplate = @"var app = new Vue({ + el: ""#app"", + data() { + return { + page: { + page: 1, + size: 10 + }, + tableLoading: true, + tableData: [], + showDebug: false, + addFormDialogVisible: false, + addForm: { + red: 128, + green: 128, + blue: 128, + additionNote: '' + }, + editFormDialogVisible: false, + editForm: { + id: 0, + red: 128, + green: 128, + blue: 128, + additionNote: '' + }, + total: 0, + addRules: { + red: [ + { required: true, message: '请设置红色值', trigger: 'change' }, + { type: 'number', min: 0, max: 255, message: '红色值范围为0-255', trigger: 'change' } + ], + green: [ + { required: true, message: '请设置绿色值', trigger: 'change' }, + { type: 'number', min: 0, max: 255, message: '绿色值范围为0-255', trigger: 'change' } + ], + blue: [ + { required: true, message: '请设置蓝色值', trigger: 'change' }, + { type: 'number', min: 0, max: 255, message: '蓝色值范围为0-255', trigger: 'change' } + ] + }, + editRules: { + red: [ + { required: true, message: '请设置红色值', trigger: 'change' }, + { type: 'number', min: 0, max: 255, message: '红色值范围为0-255', trigger: 'change' } + ], + green: [ + { required: true, message: '请设置绿色值', trigger: 'change' }, + { type: 'number', min: 0, max: 255, message: '绿色值范围为0-255', trigger: 'change' } + ], + blue: [ + { required: true, message: '请设置蓝色值', trigger: 'change' }, + { type: 'number', min: 0, max: 255, message: '蓝色值范围为0-255', trigger: 'change' } + ] + } + } + }, + mounted() { + //wait page load + setTimeout(async () => { + await this.init(); + }, 100) + }, + methods: { + async init() { + await this.getDataList(); + }, + async handleSizeChange(val) { + this.page.size = val; + await this.getDataList(); + }, + async handleCurrentChange(val) { + this.page.page = val; + await this.getDataList(); + }, + async getDataList() { + this.tableLoading = true + await service.get('/Admin/Template_XncfName/DatabaseSampleIndex?handler=ColorList', { + params: { + pageIndex: this.page.page, + pageSize: this.page.size, + orderField: ""Id desc"", + keyword: """" + } + }) + .then(res => { + console.log('=== API Response Debug ==='); + console.log('Complete Response:', res); + console.log('Response Data:', res.data); + console.log('Response Data Type:', typeof res.data); + console.log('Has res.data.data?:', res.data && res.data.data); + console.log('Has res.data.data.list?:', res.data && res.data.data && res.data.data.list); + console.log('res.data.data.list value:', res.data && res.data.data ? res.data.data.list : 'nested data not found'); + console.log('=================='); + + // 尝试多种可能的数据结构 + let dataList = null; + let totalCount = 0; + let dataSource = ''; + + if (res.data && res.data.data && res.data.data.data && res.data.data.data.list) { + // NCF框架标准格式 + 新的API格式: {data: {data: {success, message, data: {list, totalCount}}}} + dataList = res.data.data.data.list; + totalCount = res.data.data.data.totalCount || 0; + dataSource = 'NCF标准格式: res.data.data.data.list'; + console.log('✅ 使用NCF标准格式: res.data.data.data.list'); + console.log('✅ List数据:', dataList); + console.log('✅ TotalCount:', totalCount); + } else if (res.data && res.data.data && res.data.data.list) { + // 简单格式: {data: {list, totalCount}} + dataList = res.data.data.list; + totalCount = res.data.data.totalCount || 0; + dataSource = '简单格式: res.data.data.list'; + console.log('✅ 使用简单格式: res.data.data.list'); + } else if (res.data && Array.isArray(res.data)) { + // 如果data直接是数组 + dataList = res.data; + totalCount = res.data.length; + dataSource = '数组格式: res.data (array)'; + console.log('✅ 使用数组格式: res.data (array)'); + } else if (res && res.list) { + // 如果list在顶层 + dataList = res.list; + totalCount = res.totalCount || 0; + dataSource = '顶层格式: res.list'; + console.log('✅ 使用顶层格式: res.list'); + } else { + console.error('❌ 无法识别的数据格式:', res); + console.log('🔍 尝试的路径:'); + console.log('- res.data.data.list:', res.data && res.data.data ? res.data.data.list : 'not found'); + console.log('- res.data.list:', res.data ? res.data.list : 'not found'); + console.log('- res.data (array):', res.data && Array.isArray(res.data) ? 'is array' : 'not array'); + console.log('- res.list:', res.list ? res.list : 'not found'); + dataList = []; + totalCount = 0; + dataSource = '无法识别格式'; + } + + console.log('🎯 Final dataList:', dataList); + console.log('🎯 Final totalCount:', totalCount); + console.log('🎯 Data source:', dataSource); + + // 数据赋值前的状态 + console.log('📋 赋值前 tableData:', this.tableData); + console.log('📋 赋值前 total:', this.total); + + this.tableData = dataList || []; + this.total = totalCount; + + // 数据赋值后的状态 + console.log('📋 赋值后 tableData:', this.tableData); + console.log('📋 赋值后 tableData.length:', this.tableData.length); + console.log('📋 赋值后 total:', this.total); + + // 强制Vue更新 + this.$forceUpdate(); + console.log('🔄 Vue已强制更新'); + + // 延迟检查数据是否正确绑定 + setTimeout(() => { + console.log('⏰ 延迟检查 tableData:', this.tableData); + console.log('⏰ 延迟检查 tableData.length:', this.tableData ? this.tableData.length : 'null'); + }, 100); + + this.tableLoading = false + }) + .catch(error => { + console.error('获取数据失败:', error); + this.tableLoading = false; + this.$message.error('获取数据失败: ' + (error.message || error)); + }); + }, + addColor() { + this.addFormDialogVisible = true; + }, + refreshList() { + this.getDataList(); + }, + async addColorSubmit() { + this.$refs.addForm.validate(async (valid) => { + if (valid) { + console.log('📤 发送创建请求:', { + red: this.addForm.red, + green: this.addForm.green, + blue: this.addForm.blue, + additionNote: this.addForm.additionNote + }); + + await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=CreateColor', { + red: this.addForm.red, + green: this.addForm.green, + blue: this.addForm.blue, + additionNote: this.addForm.additionNote + }, { + headers: { + 'Content-Type': 'application/json' + } + }) + .then(res => { + console.log('📥 创建响应:', res); + // 兼容NCF框架的嵌套响应格式 + const responseData = res.data.data || res.data; + this.$message({ + type: responseData.success ? 'success' : 'error', + message: responseData.message || '操作完成' + }); + if (responseData.success) { + this.getDataList() + this.clearAddForm() + this.addFormDialogVisible = false; + } + }) + .catch(error => { + console.error('创建失败:', error); + this.$message.error('创建失败'); + }); + } else { + return false; + } + }); + }, + clearAddForm() { + this.addForm = { + red: 128, + green: 128, + blue: 128, + additionNote: '' + }; + if (this.$refs.addForm) { + this.$refs.addForm.resetFields(); + } + }, + clearEditForm() { + this.editForm = { + id: 0, + red: 128, + green: 128, + blue: 128, + additionNote: '' + }; + if (this.$refs.editForm) { + this.$refs.editForm.resetFields(); + } + }, + async editColorSubmit() { + this.$refs.editForm.validate(async (valid) => { + if (valid) { + console.log('📤 发送更新请求:', { + id: this.editForm.id, + red: this.editForm.red, + green: this.editForm.green, + blue: this.editForm.blue, + additionNote: this.editForm.additionNote + }); + + await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=UpdateColor', { + id: this.editForm.id, + red: this.editForm.red, + green: this.editForm.green, + blue: this.editForm.blue, + additionNote: this.editForm.additionNote + }, { + headers: { + 'Content-Type': 'application/json' + } + }) + .then(res => { + console.log('📥 更新响应:', res); + // 兼容NCF框架的嵌套响应格式 + const responseData = res.data.data || res.data; + this.$message({ + type: responseData.success ? 'success' : 'error', + message: responseData.message || '操作完成' + }); + if (responseData.success) { + this.getDataList() + this.clearEditForm() + this.editFormDialogVisible = false; + } + }) + .catch(error => { + console.error('更新失败:', error); + this.$message.error('更新失败'); + }); + } else { + return false; + } + }); + }, + dateformatter(date) { + if (!date) return ''; + + try { + // 使用原生JavaScript格式化日期 + const d = new Date(date); + + // 检查日期是否有效 + if (isNaN(d.getTime())) { + return date; // 如果无法解析，返回原始值 + } + + // 格式化为 YYYY-MM-DD HH:mm:ss + const year = d.getFullYear(); + const month = String(d.getMonth() + 1).padStart(2, '0'); + const day = String(d.getDate()).padStart(2, '0'); + const hours = String(d.getHours()).padStart(2, '0'); + const minutes = String(d.getMinutes()).padStart(2, '0'); + const seconds = String(d.getSeconds()).padStart(2, '0'); + + return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; + } catch (error) { + console.warn('日期格式化错误:', error, '原始值:', date); + return date; // 如果格式化失败，返回原始值 + } + }, + editColor(row) { + this.editForm = { + id: row.id, + red: row.red, + green: row.green, + blue: row.blue, + additionNote: row.additionNote || '' + }; + this.editFormDialogVisible = true; + }, + deleteColor(row) { + this.$confirm('此操作将永久删除该颜色, 是否继续?', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning' + }).then(async () => { + console.log('📤 发送删除请求:', { id: row.id }); + + await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=DeleteColor', { + id: row.id + }, { + headers: { + 'Content-Type': 'application/json' + } + }) + .then(res => { + console.log('📥 删除响应:', res); + // 兼容NCF框架的嵌套响应格式 + const responseData = res.data.data || res.data; + this.$message({ + type: responseData.success ? 'success' : 'error', + message: responseData.message || '操作完成' + }); + if (responseData.success) { + this.getDataList(); + } + }) + .catch(error => { + console.error('删除失败:', error); + this.$message.error('删除失败'); + }); + }).catch(() => { + this.$message({ + type: 'info', + message: '已取消删除' + }); + }); + }, + async randomizeColor(row) { + console.log('📤 发送随机化请求:', { id: row.id }); + + await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=RandomizeColor', { + id: row.id + }, { + headers: { + 'Content-Type': 'application/json' + } + }) + .then(res => { + console.log('📥 随机化响应:', res); + // 兼容NCF框架的嵌套响应格式 + const responseData = res.data.data || res.data; + this.$message({ + type: responseData.success ? 'success' : 'error', + message: responseData.message || '操作完成' + }); + if (responseData.success) { + this.getDataList(); + } + }) + .catch(error => { + console.error('随机化失败:', error); + this.$message.error('随机化失败'); + }); + }, + randomizeForm() { + this.addForm.red = Math.floor(Math.random() * 256); + this.addForm.green = Math.floor(Math.random() * 256); + this.addForm.blue = Math.floor(Math.random() * 256); + }, + randomizeEditForm() { + this.editForm.red = Math.floor(Math.random() * 256); + this.editForm.green = Math.floor(Math.random() * 256); + this.editForm.blue = Math.floor(Math.random() * 256); + }, + debugInfo() { + this.showDebug = !this.showDebug; + console.log('=== Vue Component Debug Info ==='); + console.log('Current tableData:', this.tableData); + console.log('tableData length:', this.tableData ? this.tableData.length : 'null/undefined'); + console.log('Total:', this.total); + console.log('Page:', this.page); + console.log('Table Loading:', this.tableLoading); + console.log('Show Debug:', this.showDebug); + console.log('Vue instance $el:', this.$el); + console.log('================================'); + + // 测试Vue响应性 + if (this.tableData && this.tableData.length === 0) { + console.log('测试：添加假数据'); + this.tableData = [ + {id: 999, red: 255, green: 0, blue: 0, addTime: new Date().toISOString(), lastUpdateTime: new Date().toISOString(), remark: 'test'} + ]; + this.total = 1; + setTimeout(() => { + console.log('2秒后清除假数据'); + this.tableData = []; + this.total = 0; + }, 2000); + } + } + } }); "; #endregion @@ -1232,224 +1232,224 @@ await service.post('/Admin/Template_XncfName/DatabaseSampleIndex?handler=Randomi /// 数据库示例索引页面CSS模板 /// 类型: frontend_style /// - public const string DatabaseSampleIndexCssTemplate = @"/* 通用样式 */ -.d-flex{ - display: flex; -} -.justify-content-between{ - justify-content: space-between; -} -.align-items-center{ - align-items: center; -} - -/* 过滤器容器样式 */ -.filter-container { - margin-bottom: 20px; - padding: 10px 0; -} - -.filter-container .el-button { - margin-right: 10px; -} - -/* 颜色预览样式 */ -.color-preview { - width: 100%; - height: 40px; - border-radius: 4px; - border: 1px solid #dcdfe6; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 12px; - font-weight: bold; - text-shadow: 1px 1px 2px rgba(0,0,0,0.5); -} - -.color-preview-large { - width: 100%; - height: 80px; - border-radius: 8px; - border: 2px solid #dcdfe6; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 16px; - font-weight: bold; - text-shadow: 2px 2px 4px rgba(0,0,0,0.7); - margin: 10px 0; - transition: all 0.3s ease; -} - -.color-preview-large:hover { - transform: scale(1.02); - box-shadow: 0 4px 12px rgba(0,0,0,0.15); -} - -/* 分页容器样式 */ -.pagination-container { - margin-top: 20px; - text-align: center; -} - -/* 表格样式增强 */ -.el-table { - border-radius: 8px; - overflow: hidden; - box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1); -} - -.el-table th { - background-color: #fafafa; - color: #333; - font-weight: 600; -} - -/* 颜色标签样式 */ -.el-tag { - min-width: 50px; - text-align: center; - font-weight: bold; - border: none !important; - text-shadow: 1px 1px 2px rgba(0,0,0,0.5); -} - -/* 对话框样式 */ -.el-dialog { - border-radius: 12px; - overflow: hidden; -} - -.el-dialog__header { - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); - color: white; - padding: 20px 20px 0 20px; -} - -.el-dialog__title { - color: white; - font-weight: 600; -} - -.el-dialog__body { - padding: 30px 20px; -} - -/* 滑块样式 */ -.el-slider { - margin: 20px 0; -} - -.el-slider__runway { - height: 6px; - background-color: #e4e7ed; - border-radius: 3px; -} - -.el-slider__button { - width: 20px; - height: 20px; - border: 2px solid #409eff; -} - -/* 按钮样式增强 */ -.el-button--mini { - padding: 5px 10px; - font-size: 12px; - border-radius: 4px; -} - -.el-button--primary { - background: linear-gradient(135deg, #409eff 0%, #3a8ee6 100%); - border: none; -} - -.el-button--success { - background: linear-gradient(135deg, #67c23a 0%, #5daf34 100%); - border: none; -} - -.el-button--warning { - background: linear-gradient(135deg, #e6a23c 0%, #cf9236 100%); - border: none; -} - -.el-button--danger { - background: linear-gradient(135deg, #f56c6c 0%, #f25c5c 100%); - border: none; -} - -.el-button--info { - background: linear-gradient(135deg, #909399 0%, #82848a 100%); - border: none; -} - -/* 表单项样式 */ -.el-form-item { - margin-bottom: 22px; -} - -.el-form-item__label { - font-weight: 600; - color: #333; -} - -/* 加载动画样式 */ -.el-loading-mask { - background-color: rgba(255, 255, 255, 0.9); -} - -/* 响应式设计 */ -@media (max-width: 768px) { - .filter-container { - text-align: center; - } - - .filter-container .el-button { - margin: 5px; - width: auto; - } - - .color-preview { - height: 30px; - font-size: 10px; - } - - .color-preview-large { - height: 60px; - font-size: 14px; - } -} - -/* 动画效果 */ -@keyframes fadeIn { - from { - opacity: 0; - transform: translateY(20px); - } - to { - opacity: 1; - transform: translateY(0); - } -} - -.el-table tbody tr { - animation: fadeIn 0.3s ease-out; -} - -/* 鼠标悬停效果 */ -.el-table tbody tr:hover { - background-color: #f5f7fa !important; - transition: background-color 0.3s ease; -} - -.el-button:hover { - transform: translateY(-1px); - box-shadow: 0 4px 8px rgba(0,0,0,0.15); - transition: all 0.3s ease; + public const string DatabaseSampleIndexCssTemplate = @"/* 通用样式 */ +.d-flex{ + display: flex; +} +.justify-content-between{ + justify-content: space-between; +} +.align-items-center{ + align-items: center; +} + +/* 过滤器容器样式 */ +.filter-container { + margin-bottom: 20px; + padding: 10px 0; +} + +.filter-container .el-button { + margin-right: 10px; +} + +/* 颜色预览样式 */ +.color-preview { + width: 100%; + height: 40px; + border-radius: 4px; + border: 1px solid #dcdfe6; + display: flex; + align-items: center; + justify-content: center; + color: white; + font-size: 12px; + font-weight: bold; + text-shadow: 1px 1px 2px rgba(0,0,0,0.5); +} + +.color-preview-large { + width: 100%; + height: 80px; + border-radius: 8px; + border: 2px solid #dcdfe6; + display: flex; + align-items: center; + justify-content: center; + color: white; + font-size: 16px; + font-weight: bold; + text-shadow: 2px 2px 4px rgba(0,0,0,0.7); + margin: 10px 0; + transition: all 0.3s ease; +} + +.color-preview-large:hover { + transform: scale(1.02); + box-shadow: 0 4px 12px rgba(0,0,0,0.15); +} + +/* 分页容器样式 */ +.pagination-container { + margin-top: 20px; + text-align: center; +} + +/* 表格样式增强 */ +.el-table { + border-radius: 8px; + overflow: hidden; + box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1); +} + +.el-table th { + background-color: #fafafa; + color: #333; + font-weight: 600; +} + +/* 颜色标签样式 */ +.el-tag { + min-width: 50px; + text-align: center; + font-weight: bold; + border: none !important; + text-shadow: 1px 1px 2px rgba(0,0,0,0.5); +} + +/* 对话框样式 */ +.el-dialog { + border-radius: 12px; + overflow: hidden; +} + +.el-dialog__header { + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + color: white; + padding: 20px 20px 0 20px; +} + +.el-dialog__title { + color: white; + font-weight: 600; +} + +.el-dialog__body { + padding: 30px 20px; +} + +/* 滑块样式 */ +.el-slider { + margin: 20px 0; +} + +.el-slider__runway { + height: 6px; + background-color: #e4e7ed; + border-radius: 3px; +} + +.el-slider__button { + width: 20px; + height: 20px; + border: 2px solid #409eff; +} + +/* 按钮样式增强 */ +.el-button--mini { + padding: 5px 10px; + font-size: 12px; + border-radius: 4px; +} + +.el-button--primary { + background: linear-gradient(135deg, #409eff 0%, #3a8ee6 100%); + border: none; +} + +.el-button--success { + background: linear-gradient(135deg, #67c23a 0%, #5daf34 100%); + border: none; +} + +.el-button--warning { + background: linear-gradient(135deg, #e6a23c 0%, #cf9236 100%); + border: none; +} + +.el-button--danger { + background: linear-gradient(135deg, #f56c6c 0%, #f25c5c 100%); + border: none; +} + +.el-button--info { + background: linear-gradient(135deg, #909399 0%, #82848a 100%); + border: none; +} + +/* 表单项样式 */ +.el-form-item { + margin-bottom: 22px; +} + +.el-form-item__label { + font-weight: 600; + color: #333; +} + +/* 加载动画样式 */ +.el-loading-mask { + background-color: rgba(255, 255, 255, 0.9); +} + +/* 响应式设计 */ +@media (max-width: 768px) { + .filter-container { + text-align: center; + } + + .filter-container .el-button { + margin: 5px; + width: auto; + } + + .color-preview { + height: 30px; + font-size: 10px; + } + + .color-preview-large { + height: 60px; + font-size: 14px; + } +} + +/* 动画效果 */ +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +.el-table tbody tr { + animation: fadeIn 0.3s ease-out; +} + +/* 鼠标悬停效果 */ +.el-table tbody tr:hover { + background-color: #f5f7fa !important; + transition: background-color 0.3s ease; +} + +.el-button:hover { + transform: translateY(-1px); + box-shadow: 0 4px 8px rgba(0,0,0,0.15); + transition: all 0.3s ease; } "; #endregion