|
|
|
@ -2,14 +2,12 @@ |
|
|
|
@inject IHtmlLocalizer<EventHubResource> L |
|
|
|
@using EventHub.Localization |
|
|
|
@using Microsoft.AspNetCore.Mvc.Localization |
|
|
|
@using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal |
|
|
|
@model EventHub.Web.Pages.Events.NewPageModel |
|
|
|
|
|
|
|
@section scripts { |
|
|
|
<abp-script src="/Pages/Events/New.js"/> |
|
|
|
<abp-script src="/Pages/Events/New.js"/> |
|
|
|
} |
|
|
|
|
|
|
|
<h1>@L["NewEvent"]</h1> |
|
|
|
@if (!Model.Organizations.Any()) |
|
|
|
{ |
|
|
|
<abp-alert alert-type="Danger"> |
|
|
|
@ -19,31 +17,111 @@ |
|
|
|
} |
|
|
|
else |
|
|
|
{ |
|
|
|
<form method="post" enctype="multipart/form-data"> |
|
|
|
<abp-select asp-for="Event.OrganizationId" /> |
|
|
|
<abp-input asp-for="Event.Title" /> |
|
|
|
<abp-input asp-for="Event.StartTime" /> |
|
|
|
<abp-input asp-for="Event.EndTime" /> |
|
|
|
<abp-input asp-for="Event.Description" /> |
|
|
|
<abp-input asp-for="Event.CoverImageFile" /> |
|
|
|
<abp-input asp-for="Event.IsOnline" /> |
|
|
|
<div id="event-link-group" style="display: none"> |
|
|
|
<abp-input asp-for="Event.OnlineLink" /> |
|
|
|
</div> |
|
|
|
<div id="event-location-group"> |
|
|
|
<abp-select asp-for="Event.CountryId" /> |
|
|
|
<abp-input asp-for="Event.City" /> |
|
|
|
</div> |
|
|
|
<abp-select asp-for="Event.Language" /> |
|
|
|
<abp-input asp-for="Event.Capacity" /> |
|
|
|
<abp-button size="Large" button-type="Primary" type="submit" text="@L["Submit"].Value" /> |
|
|
|
</form> |
|
|
|
|
|
|
|
<abp-modal centered="true" scrollable="true" size="Small" id="cover-image-preview-modal"> |
|
|
|
<abp-modal-header title="Cover Image Preview"></abp-modal-header> |
|
|
|
<abp-modal-body> |
|
|
|
<img class="img-fluid" id="img-upload" alt="event-cover-image-preview"/> |
|
|
|
</abp-modal-body> |
|
|
|
<abp-modal-footer buttons="@(AbpModalButtons.Close)"></abp-modal-footer> |
|
|
|
</abp-modal> |
|
|
|
} |
|
|
|
<form method="post" enctype="multipart/form-data"> |
|
|
|
<div class="container pt-4"> |
|
|
|
<div class="row py-4"> |
|
|
|
<div class="col-md-9 mx-auto profile-content"> |
|
|
|
|
|
|
|
<div class="card"> |
|
|
|
<div class="card-body" style="min-height: 496px"> |
|
|
|
<h3 class="mb-4">Create New Event</h3> |
|
|
|
<div class="form"> |
|
|
|
<div class="row"> |
|
|
|
<div class="col-md-6"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<select asp-for="Event.OrganizationId" asp-items="Model.Organizations" class="form-select"> |
|
|
|
<option selected value="">Organization</option> |
|
|
|
</select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input type="text" id="inputTitle" asp-for="Event.Title" class="form-control" placeholder="Title"> |
|
|
|
<label for="inputTitle">Title</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input id="inputStartdate" asp-for="Event.StartTime" class="form-control" placeholder="Start Date"> |
|
|
|
<label for="inputStartdate">Start Date</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input id="inputEnddate" asp-for="Event.EndTime" class="form-control" placeholder="End Date"> |
|
|
|
<label for="inputEnddate">End Date</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-12"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input type="text" id="inputDescription" asp-for="Event.Description" class="form-control" placeholder="Description"> |
|
|
|
<label for="inputDescription">Description</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="col-md-12"> |
|
|
|
<h4 class="mb-4">Cover Image</h4> |
|
|
|
<div class="row"> |
|
|
|
<div class="col-5"> |
|
|
|
<div class="image-area"><img id="imageResult" src="#" alt="" class="img-fluid rounded shadow-sm mx-auto d-block"></div> |
|
|
|
</div> |
|
|
|
<div class="col-7"> |
|
|
|
<div> |
|
|
|
<p class="mb-3">For horizontal format 600x300 sized upload images.</p> |
|
|
|
<input type="file" id="Event_CoverImageFile" asp-for="Event.CoverImageFile" class="form-control border-0" hidden> |
|
|
|
<label id="upload-label" for="Event_CoverImageFile" class="btn btn-primary btn-lg text-white">Choose file</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6"> |
|
|
|
<select class="form-select" asp-for="Event.IsOnline"> |
|
|
|
<option selected="selected" value="">Event Type</option> |
|
|
|
<option value="@Boolean.TrueString">Online</option> |
|
|
|
<option value="@Boolean.FalseString">In Person</option> |
|
|
|
</select> |
|
|
|
</div> |
|
|
|
<div class="col-md-6 event-link-group" style="display: none"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input type="text" id="inputOnlineLink" asp-for="Event.OnlineLink" class="form-control" placeholder="Online Link"> |
|
|
|
<label for="inputOnlineLink">Online Link</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input type="number" id="inputCapacity" asp-for="Event.Capacity" class="form-control" placeholder="Capacity"> |
|
|
|
<label for="inputCapacity">Capacity</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6 event-location-group"> |
|
|
|
<select asp-for="Event.CountryId" asp-items="Model.Countries" class="form-select"> |
|
|
|
<option selected="" value="">Country</option> |
|
|
|
</select> |
|
|
|
</div> |
|
|
|
<div class="col-md-6 event-location-group"> |
|
|
|
<div class="form-label-group"> |
|
|
|
<input type="text" id="inputCity" asp-for="Event.City" class="form-control" placeholder="City"> |
|
|
|
<label for="inputCity">City</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-6"> |
|
|
|
<select asp-for="Event.Language" asp-items="Model.Languages" aria-label="en" class="form-select"> |
|
|
|
<option selected value="">Language</option> |
|
|
|
</select> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="col-md-12 text-right"> |
|
|
|
<button type="submit" class="btn btn-primary btn-lg"> |
|
|
|
Publish New Event |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</form> |
|
|
|
} |