Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 17 additions & 10 deletions src/BootstrapBlazor.Server/Components/Samples/BaiduOcr.razor
Original file line number Diff line number Diff line change
@@ -1,22 +1,29 @@
@page "/ocr"
@inject IBaiduOcr OcrService
@inject IStringLocalizer<BaiduOcr> Localizer
@inject ToastService ToastService

<h3>@Localizer["Title"]</h3>

<h4>@Localizer["SubTitle"]</h4>

<Tips>@Localizer["BaiduOcrDesc"]</Tips>
<PackageTips Name="BootstrapBlazor.BaiduOcr" />
<p><b>@Localizer["BaiduOcrIntro"]</b></p>
<p class="code-label">@((MarkupString)Localizer["BaiduOcrStep1"].Value)</p>
<p>@((MarkupString)Localizer["BaiduOcrStep1Desc"].Value)</p>
<Pre>{
"BaiduOcrOption": {
"AppId": "",
"ApiKey": "",
"Secret": ""
}
}</Pre>
<p class="code-label">@((MarkupString)Localizer["BaiduOcrStep2"].Value)</p>
<Pre>[Inject, NotNull]
private IBaiduOcr? OcrService { get; set; }</Pre>

<PackageTips Name="BootstrapBlazor.BaiduOcr" />

<p><b>@Localizer["BaiduOcrIntro"]</b></p>
<p>@((MarkupString)Localizer["BaiduOcrStep1"].Value)</p>
<p>@((MarkupString)Localizer["BaiduOcrStep2"].Value)</p>
<p class="code-label">@((MarkupString)Localizer["BaiduOcrStep3"].Value)</p>

<DemoBlock Title="@Localizer["VatInvoiceTitle"]" Introduction="@Localizer["VatInvoiceIntro"]" Name="VatInvoice">
<ButtonUpload TValue="string" OnChange="@OnClickToUploadBlock" BrowserButtonText="VATInvoice" ShowUploadFileList="false" IsDisabled="IsLoading" BrowserButtonIcon="@Icon"></ButtonUpload>
<ButtonUpload TValue="string" OnChange="@OnClickToUploadBlock" BrowserButtonText="VATInvoice" ShowUploadFileList="false" IsDisabled="_isLoading" BrowserButtonIcon="@Icon"></ButtonUpload>
@if (Invoice != null)
{
<div class="row form-inline g-3 mt-0">
Expand Down Expand Up @@ -128,7 +135,7 @@
<EditorItem @bind-Field="@context.TotalAmount" Text="金额" PlaceHolder="可为空" />
</FieldItems>
<Buttons>
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-check" Text="Verify" />
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-check" Text="Verify"></Button>
</Buttons>
</EditorForm>
</ValidateForm>
Expand Down
23 changes: 14 additions & 9 deletions src/BootstrapBlazor.Server/Components/Samples/BaiduOcr.razor.cs
Original file line number Diff line number Diff line change
Expand Up @@ -12,16 +12,21 @@ namespace BootstrapBlazor.Server.Components.Samples;
/// </summary>
public partial class BaiduOcr : IDisposable
{
private InvoiceEntity? Invoice { get; set; }
[Inject, NotNull]
private IBaiduOcr? OcrService { get; set; }

/*以下示例为本站特殊处理逻辑可不参考*/
private bool IsLoading { get; set; }
[Inject, NotNull]
private IStringLocalizer<BaiduOcr>? Localizer { get; set; }

private string ButtonIcon { get; } = "fa-solid fa-cloud-arrow-up";
[Inject, NotNull]
private ToastService? ToastService { get; set; }

private string LoadingIcon { get; } = "fa-solid fa-spinner fa-spin-pulse";
private InvoiceEntity? Invoice { get; set; }

/*以下示例为本站特殊处理逻辑可不参考*/
private bool _isLoading;

private string Icon => IsLoading ? LoadingIcon : ButtonIcon;
private string Icon => _isLoading ? "fa-solid fa-spinner fa-spin-pulse" : "fa-solid fa-cloud-arrow-up";

/// <summary>
/// 取消请求令牌
Expand All @@ -33,12 +38,12 @@ private async Task OnClickToUploadBlock(UploadFile file)
if (file.File != null)
{
// 设置 按钮禁用
IsLoading = true;
_isLoading = true;
StateHasChanged();

// 获得上传文件
var payload = await file.GetBytesAsync(file.File.Size);
if (payload != null && payload.Length > 0)
if (payload is { Length: > 0 })
{
try
{
Expand All @@ -60,7 +65,7 @@ private async Task OnClickToUploadBlock(UploadFile file)
}
}

IsLoading = false;
_isLoading = false;
StateHasChanged();
}
}
Expand Down
4 changes: 3 additions & 1 deletion src/BootstrapBlazor.Server/Locales/en-US.json
Original file line number Diff line number Diff line change
Expand Up @@ -650,7 +650,9 @@
"BaiduOcrDesc": "本组件通过调用 Baidu AI 平台文字识别接口进行增值税发票文字识别。支持对增值税普票、专票、全电发票(新版全国统一电子发票,专票/普票)、卷票、区块链发票的所有字段进行结构化识别,包括发票基本信息、销售方及购买方信息、商品信息、价税信息等,其中五要素字段的识别准确率超过 99.9%; 同时,支持对增值税卷票的 21 个关键字段进行识别,包括发票类型、发票代码、发票号码、机打号码、机器编号、收款人、销售方名称、销售方纳税人识别号、开票日期、购买方名称、购买方纳税人识别号、项目、单价、数量、金额、税额、合计金额(小写)、合计金额(大写)、校验码、省、市,四要素字段的识别准确率可达95%。上传图片不能超过 4M",
"BaiduOcrIntro": "Usage",
"BaiduOcrStep1": "1. Get <code>IBaiduOcr</code> instance by inject service",
"BaiduOcrStep2": "2. Call <code>IBaiduOcr</code> instance method",
"BaiduOcrStep1Desc": "Update the <code>appsettings.json</code> file with the following configuration. Please register on <a href=\"https://ai.baidu.com/ai-doc/index/OCR\" target=\"\">Baidu AI Open Platform</a> and apply for relevant parameter values.",
"BaiduOcrStep2": "2. Get <code>IBaiduOcr</code> instance by inject service",
"BaiduOcrStep3": "3. Call <code>IBaiduOcr</code> instance method",
"VerifyVatInvoiceTitle": "增值税验真",
"VerifyVatInvoiceIntro": "通过调用 <code>IBaiduOcr</code> 服务实例的发票验真方法 <code>VerifyInvoiceAsync</code> 返回 <code>InvoiceVerifyResult</code> 其属性 <code>Valid</code> 为 <code>true</code> 时为真"
},
Expand Down
7 changes: 4 additions & 3 deletions src/BootstrapBlazor.Server/Locales/zh-CN.json
Original file line number Diff line number Diff line change
Expand Up @@ -465,7 +465,6 @@
"MultipleMaskContainerDesc": "组件内自己设置 <code>Mask</code> 组件,调用 <code>MaskService</code> 实例方法 <code>Show</code> 时,通过第二个参数指定 <code>Mask</code> 实例即可",
"MaskCloseTitle": "代码关闭弹窗",
"MaskCloseIntro": "通过使用 <code>DialogCloseButton</code> 组件或者级联参数关闭弹窗"

},
"BootstrapBlazor.Server.Components.Samples.Messages": {
"MessagesTitle": "Message 消息提示",
Expand Down Expand Up @@ -650,8 +649,10 @@
"VatInvoiceIntro": "通过上传增值税发票图片调用百度 Ocr 接口进行文字识别",
"BaiduOcrDesc": "本组件通过调用 Baidu AI 平台文字识别接口进行增值税发票文字识别。支持对增值税普票、专票、全电发票(新版全国统一电子发票,专票/普票)、卷票、区块链发票的所有字段进行结构化识别,包括发票基本信息、销售方及购买方信息、商品信息、价税信息等,其中五要素字段的识别准确率超过 99.9%; 同时,支持对增值税卷票的 21 个关键字段进行识别,包括发票类型、发票代码、发票号码、机打号码、机器编号、收款人、销售方名称、销售方纳税人识别号、开票日期、购买方名称、购买方纳税人识别号、项目、单价、数量、金额、税额、合计金额(小写)、合计金额(大写)、校验码、省、市,四要素字段的识别准确率可达95%。上传图片不能超过 4M",
"BaiduOcrIntro": "使用方法",
"BaiduOcrStep1": "1. 通过注入服务获得 <code>IBaiduOcr</code> 实例",
"BaiduOcrStep2": "2. 调用服务相对应的识别方法即可",
"BaiduOcrStep1": "1. 配置 <code>BaiduOcrOption</code>",
"BaiduOcrStep1Desc": "更新 <code>appsettings.json</code> 文件,配置如下:相关参数值请在 <a href=\"https://ai.baidu.com/ai-doc/index/OCR\" target=\"\">百度 AI 开放平台</a> 注册后开通申请",
"BaiduOcrStep2": "2. 通过注入服务获得 <code>IBaiduOcr</code> 实例",
"BaiduOcrStep3": "3. 调用服务相对应的识别方法即可",
"VerifyVatInvoiceTitle": "增值税验真",
"VerifyVatInvoiceIntro": "通过调用 <code>IBaiduOcr</code> 服务实例的发票验真方法 <code>VerifyInvoiceAsync</code> 返回 <code>InvoiceVerifyResult</code> 其属性 <code>Valid</code> 为 <code>true</code> 时为真"
},
Expand Down
Loading