Ищу совета о том, как мне это сделать. Я пошел вперед и сделал поиск, который принимает входные данные формы и ищет мою базу данных. Единственная проблема заключается в том, что если вы выполняете поиск во второй раз, поиск добавляется к первым результатам, а не очищается сначала. Я предполагаю, что мой вопрос заключается в том, должен ли я очищать результаты с помощью jsinterop или есть способ, которым я могу очистить эти результаты в Blazor c# через привязку данных? Я не мог найти примеры в Интернете. Любой совет будет оценен!
Редактировать: Вот мой компонент бритвы
@page "/search"
@using TranactionJournalV4.Models;
@using TranactionJournalV4.Data;
@using TranactionJournalV4.Controllers;
@inject SearchService searchService
@inject SearchDropDownService searchDropDownService
@inject IJSRuntime JsRuntime
@implements IDisposable
<div class="row">
<div class="col-12 text-center pb-4">
<MatDatePicker @bind-Value="@startDate" EnableTime="true"></MatDatePicker>
<MatButton OnClick="@(_ =>
{
startDate = DateTime.Now;
})">
Now
</MatButton>
</div>
<div class="col-4">
<MatSelect Label="Region" @bind-Value="@Region">
@foreach (var region in Regions)
{
<MatOptionString Value="@region.RegionCode.ToString()">@region.RegionName</MatOptionString>
}
</MatSelect>
</div>
<div class="col-4">
<MatSelect Label="MCC" @bind-Value="@Mcc">
@foreach (var MCode in MCCs)
{
<MatOptionString Value="@MCode.Mcc">@MCode.Mcc - @MCode.Description</MatOptionString>
}
</MatSelect>
</div>
<div class="col-4">
<MatTextField @bind-Value="@MerchantID" Label="MerchantID"></MatTextField>
</div>
<div class="col-4">
<MatSelect Label="Transaction Currency" @bind-Value="@CurrencyCode">
@foreach (var CCode in CurrencyCodes)
{
<MatOptionString Value="@CCode.Numeric">@CCode.Numeric - @CCode.ShortName</MatOptionString>
}
</MatSelect>
</div>
<div class="col-4">
<MatTextField @bind-Value="@TerminalID" Label="TerminalID"></MatTextField>
</div>
<div class="col-4">
<MatTextField @bind-Value="@TxnAmount" Label="Transaction Amount"></MatTextField>
</div>
<div class="col-4">
<MatTextField @bind-Value="@BIN" Label="BIN"></MatTextField>
</div>
<div class="col-4">
<MatSelect Label="Message Type" @bind-Value="@MessageType">
@foreach (var MType in MessageTypes)
{
<MatOptionString Value="@MType.MessageType">@MType.MessageType - @MType.Description</MatOptionString>
}
</MatSelect>
</div>
<div class="col-4">
<MatTextField @bind-Value="@MaskedPan" Label="Masked PAN"></MatTextField>
</div>
<div class="col-4">
<MatSelect Label="Processing Code" @bind-Value="@ProcessingCode">
@foreach (var procCode in ProcessingCodes)
{
<MatOptionString Value="@procCode.ProcessingCode"> @procCode.ProcessingCode - @procCode.Description</MatOptionString>
}
</MatSelect>
</div>
<div class="col-4">
<MatTextField @bind-Value="@ClearPan" Label="Clear PAN"></MatTextField>
</div>
<div class="col-4">
<MatSelect Label="Response Code" @bind-Value="@ResponseCode">
@foreach (var ResCode in ResponseCodes)
{
<MatOptionString Value="@ResCode.ResponseCode">@ResCode.ResponseCode - @ResCode.Description</MatOptionString>
}
</MatSelect>
</div>
<div class="col-4">
<MatTextField @bind-Value="@AuthCode" Label="Authorization Code"></MatTextField>
</div>
<div class="col-4">
<MatSelect Label="Entry Code" @bind-Value="@EntryCode">
@foreach (var entryCode in EntryModes)
{
<MatOptionString Value="@entryCode.EntryCode">@entryCode.EntryModeDescription</MatOptionString>
}
</MatSelect>
</div>
</div>
<MatButton Outlined="true" @onclick="@SearchTransactions">Search</MatButton>
@if (transactions == null)
{
}
else
{
<table class="table">
<thead>
<tr>
<th>Transaction Date</th>
<th>Merchant ID</th>
<th>Terminal ID</th>
<th>Trace Amount</th>
<th>Currency</th>
<th>Authorization Code</th>
<th>Response Code</th>
<th>Masked PAN</th>
</tr>
</thead>
<tbody>
@foreach (var transaction in NextTransactions)
{
<tr class="tableInfo">
<td>@transaction.TransactionDateTime</td>
<td>@transaction.MerchantID</td>
<td>@transaction.TerminalID</td>
<td>@transaction.SystemTrace</td>
<td>@transaction.Currency</td>
<td>@transaction.AuthorizationCode</td>
<td>@transaction.ResponseCode</td>
<td>@transaction.PANM</td>
</tr>
}
</tbody>
</table>
@if (StopLoading)
{
<div>
<h4>End Of List</h4>
</div>
}
<div id="list-end" class="mt-5 mb-5 p-5">
<p></p>
@if (IsLoading)
{
<div class="d-flex justify-content-center">
<div class="spinner-grow" style="width: 3rem; height: 3rem;" role="status">
<span class="sr-only">Loading...</span>
</div>
</div>
}
</div>
@*<input type="button" value="More Results" @onclick="@MoreResults" />*@
}
@code {
private DateTime startDate;
private string Region;
private List<TransactionModel> transactions;
private PaginationDTO pagination = new PaginationDTO();
private List<TransactionModel> NextTransactions = new List<TransactionModel>();
private string Mcc;
private string MerchantID;
private string TerminalID;
private decimal TxnAmount;
private string BIN;
private string MaskedPan;
private string ClearPan;
private string AuthCode;
private string CurrencyCode;
private string MessageType;
private string ProcessingCode;
private string ResponseCode;
private string EntryCode;
public List<CommonMerchantCatagoryCodes> MCCs;
public List<CommonCurrencyCodes> CurrencyCodes;
public List<CommonPosmessageTypeRecords> MessageTypes;
public List<CommonPosprocessingCodeRecords> ProcessingCodes;
public List<CommonResponseCodeRecords> ResponseCodes;
public List<EntryModes> EntryModes = new List<EntryModes>
{
new EntryModes{EntryCode= "05", EntryModeDescription = "Chip Card"},
new EntryModes{EntryCode= "92", EntryModeDescription = "Chip Card - Fallback"},
new EntryModes{EntryCode= "02", EntryModeDescription = "Magnetic Stripe"},
new EntryModes{EntryCode= "94", EntryModeDescription = "Magnetic Stripe - No AID"},
new EntryModes{EntryCode= "01", EntryModeDescription = "Manually Keyed"},
new EntryModes{EntryCode= "07", EntryModeDescription = "NFC"}
};
public List<Regions> Regions = new List<Regions>
{
new Regions{RegionCode = "419733", RegionName = "Antigua and Barbuda (05)"},
new Regions{RegionCode = "457947", RegionName = "Aruba (16)"},
new Regions{RegionCode = "457944", RegionName = "Bahamas (02)"},
new Regions{RegionCode = "457944", RegionName = "Bahamas - Agency (32)"},
new Regions{RegionCode = "483172", RegionName = "Barbados (15)"},
new Regions{RegionCode = "419640", RegionName = "Bonaire (17)"},
new Regions{RegionCode = "457946", RegionName = "Cayman Islands (07)"},
new Regions{RegionCode = "419639", RegionName = "Curaçao (13)"},
new Regions{RegionCode = "483174", RegionName = "Grenada (09)"},
new Regions{RegionCode = "419641", RegionName = "Saba (18)"},
new Regions{RegionCode = "419735", RegionName = "Saint Kitts and Nevis (11)"},
new Regions{RegionCode = "419736", RegionName = "Saint Lucia (12)"},
new Regions{RegionCode = "483173", RegionName = "Saint Vincent (20)"},
new Regions{RegionCode = "419638", RegionName = "Sint Maarten (Dutch part) (19)"},
new Regions{RegionCode = "415536", RegionName = "Trinidad and Tobago (03)"},
new Regions{RegionCode = "457945", RegionName = "Turks and Caicos Islands (14)"},
};
protected override async Task OnInitializedAsync()
{
MCCs = searchDropDownService.GetAllMCCs().ToList();
CurrencyCodes = searchDropDownService.GetAllCurrencies().ToList();
MessageTypes = searchDropDownService.GetAllMessages().ToList();
ProcessingCodes = searchDropDownService.GetAllProcessingCodes().ToList();
ResponseCodes = searchDropDownService.GetAllResponseCodes().ToList();
}
async Task SearchTransactions()
{
//transactions = await searchService.SearchTransactionsAsync(searchTerm, pagination);
//foreach(var txn in transactions)
//{
// NextTransactions.Add(txn);
//}
await LoadMore();
await InitJsListenerAsync();
}
//async Task MoreResults()
//{
// transactions = await searchService.SearchNextResults(searchTerm, pagination);
//}
bool IsLoading { get; set; } = false;
//int PageSize = 30;
int PageNumber = 0;
bool StopLoading = false;
protected async Task ClearResults()
{
}
protected async Task InitJsListenerAsync()
{
await JsRuntime.InvokeVoidAsync("ScrollList.Init", "list-end", DotNetObjectReference.Create(this));
}
[JSInvokable]
public async Task LoadMore()
{
if (!IsLoading)
{
IsLoading = true;
StateHasChanged();
await Task.Delay(1000);
//for (int i = 0; i < pagination.Page; i++)
transactions = await searchService.SearchNextResults(startDate, Region, Mcc, MerchantID, CurrencyCode, TerminalID, TxnAmount, BIN, MessageType, MaskedPan, ProcessingCode, ClearPan, ResponseCode, AuthCode, EntryCode, pagination);
//}
pagination.Page++;
foreach (var txn in transactions)
{
NextTransactions.Add(txn);
}
PageNumber++;
IsLoading = false;
StateHasChanged();
//at the end of pages or results stop loading anymore
if (PageNumber > 50)
{
await StopListener();
}
}
}
public async Task StopListener()
{
StopLoading = true;
IsLoading = false;
await JsRuntime.InvokeVoidAsync("ScrollList.RemoveListener");
StateHasChanged();
}
public void Dispose()
{
JsRuntime.InvokeVoidAsync("ScrollList.RemoveListener");
}
}
Вот мой сервис поиска:
public async Task<List<TransactionModel>> SearchNextResults(DateTime transactionDate, string Region, string MCC, string MerchantID, string TxnCurrency, string TerminalID, decimal TxnAmount, string BIN, string MsgType, string MaskedPan, string ProcessingCode, string ClearPan, string ResponseCode, string AuthorizationCode, string EntryMode, [FromQuery] PaginationDTO pagination)
{
var queryable = context.TransactionJournal.Where(s => s.LocalDateTime <= transactionDate)
.Where(s => Region == null || Region == s.AcquirerID)
.Where(s => MCC == null || MCC == s.MerchantCategoryCode)
.Where(s => MerchantID == null || MerchantID == (s.MerchantID))
.Where(s => TxnCurrency == null || TxnCurrency == (s.Currency))
.Where(s => TerminalID == null || TerminalID == (s.TerminalID))
.Where(s => TxnAmount == 0 || TxnAmount == s.TransactionAmount)
.Where(s => BIN == null || BIN == s.Bin)
.Where(s => MsgType == null || MsgType.Trim() == s.MessageType)
.Where(s => ProcessingCode == null || ProcessingCode == s.ProcessingCode)
.Where(s => MaskedPan == null || MaskedPan == s.PANM)
.Where(s => ClearPan == null || ClearPan == s.PAN)
.Where(s => ResponseCode == null || ResponseCode == s.ResponseCode)
.Where(s => AuthorizationCode == null || AuthorizationCode == s.AuthorizationCode)
.Where(s => EntryMode == null || s.PosEntryMode.Contains(EntryMode))
.AsQueryable();
var orderedQuery = queryable.OrderByDescending(x => x.LocalDateTime);
await HttpContextExtensions.GetPage<TransactionModel>(orderedQuery, pagination.Page, pagination.QuantityPerPage);
return await orderedQuery.Paginate(pagination).ToListAsync();
}