@model Model_Organisation_Members
@inject SaxLocaliser Localiser
@{
	/* Organisation Members - Member dialog panel */
}

<script type="text/javascript">
	sax.dlg.title.createMember = '@Localiser.GetJavascriptText("caption.member.create")';
	sax.dlg.title.updateMember = '@Localiser.GetJavascriptText("caption.member.update")';
	sax.dlg.title.selectRegion = '@Localiser.GetJavascriptText("reference.caption.region.select")';
	sax.dlg.title.selectSport = '@Localiser.GetJavascriptText("reference.caption.sport.select")';
	sax.data.userRoleCodeDelim = '@Model.MemberRoleCodeDelim';
</script>
@using (@Html.BeginForm(FormMethod.Post, new { @id = "frmMemberId", @class = "sax-form" }))
{
	<input type="hidden" name="MemberId" class="MemberId" />
}
<div id="dlgMember" class="sax-dialog" title="">
	<div class="spacer2"></div>

	@using (@Html.BeginForm(FormMethod.Post, new { @id = "frmMember", @class = "sax-form", @onSubmit = "return false;" }))
	{
		<input type="hidden" name="MemberId" class="MemberId" />
		<input type="hidden" name="MemberExists" class="MemberExists" />
		<input type="hidden" name="MemberNameSupplied" class="MemberNameSupplied" />
		<input type="hidden" class="MemberOrganisationId" name="MemberOrganisationId" value="@(Model.Filter.OrganisationId)" />

		@* Member Email Address *@
		<div class="sax-form-control MemberEmailAddress">
			<div class="row">
				<div class="col-sm-3">
					<div class="sax-label">
						<label for="ifMemberEmailAddress"><span>@Localiser["label.email"]</span><span class="required">&nbsp;*</span></label>
					</div>
				</div>
				<div class="col-sm">
					<div class="sax-control">
						<input type="text" name="MemberEmailAddress" class="MemberEmailAddress sax-input" autocomplete="off" readonly="readonly" maxlength="@(Model.GetControlMaxLength(SaxDbDfn_Core.ColumnIdx.UserAccount_EmailAddress))" />
					</div>
					<div class="sax-message"></div>
				</div>
			</div>
		</div>

		@* Member Display Name *@
		<div class="sax-form-control MemberDisplayName">
			<div class="row">
				<div class="col-sm-3">
					<div class="sax-label">
						<label for="ifMemberDisplayName"><span>@Localiser["label.name"]</span></label>
					</div>
				</div>
				<div class="col-sm">
					<div class="sax-control">
						<input type="text" if="ifMemberDisplayName" class="MemberDisplayName sax-input" readonly="readonly" />
					</div>
					<div class="sax-message"></div>
				</div>
			</div>
		</div>

		@* Member Name *@
		<div class="row">
			<div class="col-sm-3"></div>
			<div class="col-sm">
				<div class="row">

					<div class="col-sm-4">
						@* User Title *@
						<div class="sax-form-control MemberTitle pr-sm-1">
							<div class="sax-label">
								<label for="cbMemberTitle"><span>@Localiser["label.title"]</span></label>
							</div>
							<div class="sax-control">
								<select id="cbMemberTitle" name="MemberTitle" class="MemberTitle sax-input"></select>
							</div>
							<div class="sax-message"></div>
						</div>
					</div>

					<div class="col-sm-4">
						@* User First Name *@
						<div class="sax-form-control MemberFirstName pr-sm-1">
							<div class="sax-label">
								<label for="ifMemberFirstName"><span>@Localiser["label.first.name"]</span><span class="required">&nbsp;*</span></label>
							</div>
							<div class="sax-control">
								<input type="text" id="ifMemberFirstName" name="MemberFirstName" class="MemberFirstName sax-input" autocomplete="off" maxlength="@(Model.GetControlMaxLength(SaxDbDfn_Core.ColumnIdx.UserAccount_FirstName))" />
							</div>
							<div class="sax-message"></div>
						</div>
					</div>

					<div class="col-sm-4">
						@* User Last Name *@
						<div class="sax-form-control MemberLastName">
							<div class="sax-label">
								<label for="ifMemberLastName"><span>@Localiser["label.last.name"]</span><span class="required">&nbsp;*</span></label>
							</div>
							<div class="sax-control">
								<input type="text" id="ifMemberLastName" name="MemberLastName" class="MemberLastName sax-input" autocomplete="off" maxlength="@(Model.GetControlMaxLength(SaxDbDfn_Core.ColumnIdx.UserAccount_LastName))" />
							</div>
							<div class="sax-message"></div>
						</div>
					</div>

				</div>
			</div>
		</div>

		@* Member roles *@
		<div class="sax-form-control MemberRoleCodes">
			<div class="row">
				<div class="col-sm-3">
					<div class="sax-label">
						<label for="ifMemberRoles"><span>@Localiser["label.roles"]</span></label>
					</div>
				</div>
				<div class="col-sm">
					<div class="sax-control row">
						<input type="hidden" name="MemberRoleCodes" class="MemberRoleCodes sax-input" />
						<div class="col"><textarea class="MemberRoles sax-input" rows="4" readonly="readonly"></textarea></div>
						<div class="fixed"><button class="sax-button SelectMemberRoles" style="min-width:auto;margin-left:4px;padding:4px 6px">@Localiser["label.select"]</button></div>
					</div>
					<div class="sax-message"></div>
				</div>
			</div>
		</div>

		@* Admin Comment *@
		<div class="sax-form-control MemberAdminComment">
			<div class="row">
				<div class="col-sm-3">
					<div class="sax-label">
						<label for="ifMemberAdminComment"><span>@Localiser["label.comment"]</span></label>
					</div>
				</div>
				<div class="col-sm">
					<div class="sax-control">
						<textarea type="text" id="ifMemberAdminComment" name="MemberAdminComment" class="MemberAdminComment sax-textarea" rows="6" autocomplete="off" maxlength="@(Model.GetControlMaxLength(SaxDbDfn_Core.ColumnIdx.UserOrganisation_AdminComment))"></textarea>
					</div>
					<div class="sax-message"></div>
				</div>
			</div>
		</div>

	}

</div>