JobProgress 组件 — sgcHTML | eSeGeCe

JobProgress

TsgcHTMLComponent_JobProgress — 渲染一个实时的后台任务进度条列表,带有状态徽章、取消按钮和带外片段更新,适用于 Delphi、C++ Builder 和 .NET。

TsgcHTMLComponent_JobProgress

AddJob 注册任务,用 UpdateJob 推进它们,然后读取 HTML 完成初始渲染,或用 GetJobFragmentHTML 推送单行更新。

组件类

TsgcHTMLComponent_JobProgress

渲染为

Bootstrap 5 进度条列表 + 作用域 CSS

语言

Delphi, C++ Builder, .NET

添加任务、更新它、推送变更

调用 AddJob 注册一个任务,渲染初始 HTML,然后在每次进度更新时调用 UpdateJob 并广播 GetJobFragmentHTML 以仅刷新该行。

uses
  sgcHTML_Enums, sgcHTML_Component_JobProgress;

var
  oJobs: TsgcHTMLComponent_JobProgress;
begin
  oJobs := TsgcHTMLComponent_JobProgress.Create(nil);
  try
    oJobs.JobsID := 'exports';
    oJobs.Title := 'Background Exports';
    oJobs.ShowCompleted := False;

    oJobs.AddJob('exp-42', 'Export customers.csv', 'Generating CSV export');

    WebModule.Response := oJobs.HTML;   // card + progress rows + cancel-form script
  finally
    oJobs.Free;
  end;
end;

// On a later progress tick, push just that row over the WebSocket:
oJobs.UpdateJob('exp-42', 65, jsRunning);
Engine.BroadcastFragment(oJobs.GetJobFragmentHTML('exp-42'));
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_JobProgress.hpp

TsgcHTMLComponent_JobProgress *oJobs = new TsgcHTMLComponent_JobProgress(NULL);
try
{
  oJobs->JobsID = "exports";
  oJobs->Title = "Background Exports";
  oJobs->ShowCompleted = false;

  oJobs->AddJob("exp-42", "Export customers.csv", "Generating CSV export");

  String html = oJobs->HTML;   // card + progress rows + cancel-form script
}
__finally
{
  delete oJobs;
}

// On a later progress tick, push just that row over the WebSocket:
oJobs->UpdateJob("exp-42", 65, jsRunning, "");
Engine->BroadcastFragment(oJobs->GetJobFragmentHTML("exp-42"));
using esegece.sgcWebSockets;

var jobs = new TsgcHTMLComponent_JobProgress();
jobs.JobsID = "exports";
jobs.Title = "Background Exports";
jobs.ShowCompleted = false;

jobs.AddJob("exp-42", "Export customers.csv", "Generating CSV export");

string html = jobs.HTML;   // card + progress rows + cancel-form script

// On a later progress tick, push just that row over the WebSocket:
jobs.UpdateJob("exp-42", 65, TsgcHTMLJobStatus.jsRunning, "");
engine.BroadcastFragment(jobs.GetJobFragmentHTML("exp-42"));

关键属性与方法

您最常使用的成员。

添加任务

AddJob(aId, aName, aDescription) 注册一个任务并返回其 TsgcHTMLJobItemIdNameDescriptionPercentStatusStatusTextStartedAt)。

更新任务

UpdateJob(aId, aPercent, aStatus, aStatusText) 按 id 更新一个任务,并将 Percent 限制在 0–100 之间。

状态

TsgcHTMLJobStatusjsQueuedjsRunningjsCompletedjsFailedjsCancelled)驱动徽章和进度条的颜色,运行时呈条纹动画。

实时片段

GetJobFragmentHTML/GetJobAppendFragmentHTMLPushFragment/BroadcastFragment 返回带外交换片段,使一次更新只刷新一行,而非整页。

可见性

ShowCompleted 从列表中隐藏已完成的任务;AutoRemoveCompleted 会在任务完成后将其从 Jobs 中彻底移除。

取消按钮

ShowCancelButtonCancelCaptionCancelAction 控制每行的取消表单,通过与 Grid 和 Chat 相同的机制回传。

继续探索

在线帮助此组件的完整 API 参考和使用指南。
所有 sgcHTML 组件浏览 80 多个组件的完整功能矩阵。
下载免费试用版30 天试用版附带 60.HTML 演示项目。
价格Single、Team 和 Site 授权,均含完整源代码。

准备好开始了吗?

下载免费试用版,开始在 Delphi、C++ Builder 和 .NET 中构建 Web 界面。