@model SaxModel_Admin
@inject SaxLocaliser Localiser
@{
	// Ensure view is only included once in page.
	if (!Model.RegisterView("Views/Common/SelectItem")) return;
	// Scripts.
	Model.AdditionalFiles_JS.Add("js/sax-sel-itm.js");
}

<link rel="stylesheet" href="~/css/sax-selectItem.css?@Model.HrefVersion" />

<div id="dlgSelectItem" class="sax-dialog sax-form">

	<div class="container-fluid h-100">

		@* Selected Item *@
		<div class="SelectedItem">
			<div class="row">
				<div class="col-sm-12"><div class="sax-label">@Localiser["label.item.selected"]:</div></div>
				<div class="col-sm-12"><div class="SelectedItemName"></div></div>
			</div>
			<div class="spacer2"></div>
		</div>

		@* Item Filter *@
		<div class="ItemFilter sax-form">
			<div class="row">
				<div class="col right"><div class="sax-label">@Localiser["label.search"]</div></div>
				<div class="fixed"><input type="search" id="ifItemFilter" class="sax-input" autocomplete="off" onkeyup="sax.data.selectItem.fn.displayItems();" /></div>
			</div>
			<div class="spacer2"></div>
		</div>

		@* Available items *@
		<div class="row">
			<div class="col"><div class="sax-label bottom">@Localiser["label.items.available"]:</div></div>
		</div>

		<div class="row">

			<div class="col-sm-12 sax-selectItem-items AvailableItems"></div>

		</div>

	</div>

	<div class="sax-panel-item-template">
		<div class="sax-panel-item Item">
			<div class="ItemName"></div>
		</div>
	</div>

</div>