Identification Document Editor

This commit is contained in:
jojo aquino 2024-12-16 17:31:30 +00:00
parent 729f91a183
commit 4e757fccc3
5 changed files with 322 additions and 0 deletions

View File

@ -0,0 +1,34 @@
using EnotaryoPH.Data.Entities;
using Microsoft.AspNetCore.Mvc.Rendering;
namespace EnotaryoPH.Web.Common.Models
{
public class IdentificationDocumentModel
{
public IdentificationDocumentModel()
{ }
public IdentificationDocumentModel(IdentificationDocument document)
{
using var stream = new MemoryStream(document.File);
File = new FormFile(stream, 0, stream.Length, document.Filename, document.Filename);
ExpirationDate = document.ExpirationDate;
DateIssued = document.DateIssued;
PlaceIssued = document.PlaceIssued;
IdNumber = document.IdNumber;
Filename = document.Filename;
ImageBase64Url = File.ToBase64StringUrl();
IdentificationType = document.Type;
}
public DateTime? DateIssued { get; set; }
public DateTime? ExpirationDate { get; set; }
public IFormFile File { get; set; }
public string Filename { get; set; }
public string IdentificationType { get; set; }
public List<SelectListItem>? IdentificationTypes { get; set; }
public string IdNumber { get; set; }
public string? ImageBase64Url { get; set; }
public string PlaceIssued { get; set; }
}
}

View File

@ -0,0 +1,25 @@
@page "{IdentificationDocument_UID?}"
@model EnotaryoPH.Web.Pages.Principal.IdentificationDocument.IdentificationDocumentModel
@section Head {
<link href="~/lib/fontawesome-free-6.7.1-web/css/all.min.css" rel="stylesheet" />
}
<section class="mt-5 mb-2">
<div class="container">
<h1>Identification Document</h1>
<form method="post" enctype="multipart/form-data">
@Html.EditorFor(m => m.IdentificationDocument)
<div class="mt-4">
<button type="submit" class="btn btn-primary btn-lg" role="button">
<i class="far fa-save me-2"></i>
SAVE
</button>
</div>
</form>
</div>
</section>
@section Scripts {
<script src="~/js/identification-document.js"></script>
}

View File

@ -0,0 +1,139 @@
using EnotaryoPH.Data;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.EntityFrameworkCore;
using NsEntities = EnotaryoPH.Data.Entities;
namespace EnotaryoPH.Web.Pages.Principal.IdentificationDocument
{
public class IdentificationDocumentModel : PageModel
{
private readonly ICurrentUserService _currentUserService;
private readonly NotaryoDBContext _notaryoDBContext;
private readonly IWebHostEnvironment _webHostEnvironment;
public IdentificationDocumentModel(IWebHostEnvironment webHostEnvironment, NotaryoDBContext notaryoDBContext, ICurrentUserService currentUserService)
{
_webHostEnvironment = webHostEnvironment;
_notaryoDBContext = notaryoDBContext;
_currentUserService = currentUserService;
}
public IActionResult OnGet()
{
if (IdentificationDocument_UID != Guid.Empty)
{
var user = _notaryoDBContext.Users.AsNoTracking().FirstOrDefault(u => u.User_UID == _currentUserService.GetUser_UID());
var document = _notaryoDBContext.IdentificationDocuments.AsNoTracking().FirstOrDefault(d => d.IdentificationDocument_UID == IdentificationDocument_UID && d.UserID == user.UserID);
if (document == null)
{
return NotFound();
}
IdentificationDocument = new Common.Models.IdentificationDocumentModel(document);
}
else
{
var defaultImageFilename = $"{_webHostEnvironment.WebRootPath}/images/image-white-on-gray-400x300.jpg";
using var stream = new MemoryStream(System.IO.File.ReadAllBytes(defaultImageFilename));
var formFile = new FormFile(stream, 0, stream.Length, "Untitled.jpg", "Untitled.jpg");
IdentificationDocument = new Common.Models.IdentificationDocumentModel
{
File = formFile,
ImageBase64Url = formFile.ToBase64StringUrl()
};
}
LoadIdentificationDocumentTypes();
return Page();
}
public async Task<IActionResult> OnPostAsync()
{
if (!ModelState.IsValid)
{
return PostbackPage();
}
if (IdentificationDocument.ExpirationDate <= DateTime.Now)
{
ModelState.AddModelError(FullName.Of(IdentificationDocument.ExpirationDate), "Your Identification Document has expired");
return PostbackPage();
}
if (IdentificationDocument.DateIssued > DateTime.Now)
{
ModelState.AddModelError(FullName.Of(IdentificationDocument.DateIssued), "Your Identification Document has not yet been issued");
return PostbackPage();
}
var user = _notaryoDBContext.Users.AsNoTracking().FirstOrDefault(u => u.User_UID == _currentUserService.GetUser_UID());
var entity = new NsEntities.IdentificationDocument();
if (IdentificationDocument_UID != Guid.Empty)
{
entity = _notaryoDBContext.IdentificationDocuments.FirstOrDefault(e => e.IdentificationDocument_UID == IdentificationDocument_UID && e.UserID == user.UserID);
if (entity == null)
{
return BadRequest();
}
}
entity.ExpirationDate = IdentificationDocument.ExpirationDate.ToUTC();
entity.DateIssued = IdentificationDocument.DateIssued.ToUTC();
entity.PlaceIssued = IdentificationDocument.PlaceIssued;
entity.IdNumber = IdentificationDocument.IdNumber;
entity.Type = IdentificationDocument.IdentificationType;
entity.UploadedOn = DateTime.UtcNow;
entity.UserID = user.UserID;
var file = IdentificationDocument.File;
var stream = new MemoryStream((int)file.Length);
file.CopyTo(stream);
entity.Filename = file.FileName;
entity.File = stream.ToArray();
if (entity.IdentificationDocumentID > 0)
{
_notaryoDBContext.Update(entity);
}
else
{
entity.CreatedOn = DateTime.UtcNow;
entity.IdentificationDocument_UID = Guid.NewGuid();
_notaryoDBContext.Add(entity);
}
_notaryoDBContext.SaveChanges();
return RedirectToPage("/Principal/Dashboard/Dashboard");
}
private IActionResult PostbackPage()
{
if (IdentificationDocument.File != null)
{
IdentificationDocument.ImageBase64Url = IdentificationDocument.File.ToBase64StringUrl();
//using var stream = IdentificationDocument.File.OpenReadStream();
//IdentificationDocument.File = new FormFile(stream, 0, stream.Length, IdentificationDocument.File.Name, IdentificationDocument.File.Name);
}
LoadIdentificationDocumentTypes();
return Page();
}
private void LoadIdentificationDocumentTypes()
{
var lookupIdentificationTypes = _notaryoDBContext.LookupData.AsNoTracking().Include(e => e.LookupDataValues).FirstOrDefault(e => e.Name == "Identification Types");
IdentificationDocument.IdentificationTypes = lookupIdentificationTypes.LookupDataValues
.ConvertAll(m => new SelectListItem
{
Text = m.Title.DefaultIfEmpty(m.Value),
Value = m.Value
});
}
[BindProperty]
public Common.Models.IdentificationDocumentModel IdentificationDocument { get; set; }
[BindProperty(SupportsGet = true)]
public Guid IdentificationDocument_UID { get; set; }
}
}

View File

@ -0,0 +1,66 @@
@model EnotaryoPH.Web.Common.Models.IdentificationDocumentModel
@section Head {
<link href="/lib/fontawesome-free-6.7.1-web/css/all.min.css" rel="stylesheet" />
}
<div class="row">
<div class="col-12 col-lg-4">
<div class="card">
<a href="#" target="_self" class="identification-document__a"><img id="identification-document__a__img" class="identification-document__a__img card-img w-100 d-block fit-cover identification-document__upload__image" src="@Model.ImageBase64Url" style="height: 300px;" /></a>
<div class="card-body p-2">
<input type="hidden" asp-for="ImageBase64Url" class="identification-document__base64" />
<input type="text" asp-for="Filename" class="card-text mb-1 form-control-plaintext identification-document__filename" />
<div>
<input class="identification-document__upload__file" type="file" style="display:none;" asp-for="File" accept="image/*" />
@Html.ValidationMessageFor(m => m.File)
<button class="btn btn-secondary btn-sm me-1 identification-document__upload__button" type="button">Upload Photo<i class="fas fa-upload ms-1"></i></button>
</div>
</div>
</div>
</div>
<div class="col">
<div class="row">
<div class="col-12 col-lg-7">
<div class="mb-3">
<label class="form-label">Type</label>
<select class="form-select form-select" required asp-for="IdentificationType" asp-items="Model.IdentificationTypes">
<option value="" selected>Choose an option</option>
</select>
@Html.ValidationMessageFor(m => m.IdentificationType)
</div>
</div>
<div class="col-12 col-lg-7">
<div class="mb-3">
<label class="form-label">ID Number</label>
<input class="form-control form-control" type="text" required asp-for="IdNumber" />
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-lg-7">
<div class="mb-3">
<label class="form-label">Place Issued</label>
<input class="form-control form-control" type="text" required asp-for="PlaceIssued" />
</div>
</div>
<div class="col-12 col-lg-7">
<div class="row">
<div class="col-12 col-sm-6">
<div class="mb-3">
<label class="form-label" asp-for="ExpirationDate">Expiration Date</label>
<input class="form-control form-control" type="date" required asp-for="ExpirationDate" />
@Html.ValidationMessageFor(m => m.ExpirationDate)
</div>
</div>
<div class="col-12 col-sm-6">
<div class="mb-3">
<label class="form-label" asp-for="DateIssued">Date Issued</label>
<input class="form-control form-control" type="date" required asp-for="DateIssued" />
@Html.ValidationMessageFor(m => m.DateIssued)
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,58 @@
"use strict";
(function () {
let
control_fileInput = document.querySelector(".identification-document__upload__file"),
control_uploadButton = document.querySelector(".identification-document__upload__button"),
control_filename = document.querySelector(".identification-document__filename"),
control_imageLink = document.querySelector(".identification-document__a"),
control_image = document.querySelector(".identification-document__a__img"),
control_imageBase64Url = document.querySelector(".identification-document__base64"),
x = 1;
function _bindEvents() {
control_uploadButton.addEventListener("click", function () {
control_fileInput.click();
});
control_fileInput.addEventListener("change", function (event) {
const file = event.target.files[0];
if(file) {
console.log('File name:', file.name);
console.log('File size:', file.size);
console.log('File type:', file.type);
control_filename.value = file.name;
const reader = new FileReader();
reader.onload = function (e) {
debugger;
const base64StringUrl = e.target.result;
control_imageLink.href = base64StringUrl;
control_image.src = base64StringUrl;
console.log('Base64 String:', base64String);
};
reader.readAsDataURL(file);
} else {
console.log('No file selected');
}
});
}
function _init() {
_bindEvents();
_initFiles();
}
function _initFiles() {
if (control_imageBase64Url.value) {
debugger;
const fileContent = control_imageBase64Url.value;
const filename = control_filename.value;
const file = new File([fileContent], filename);
const dataTransfer = new DataTransfer();
dataTransfer.items.add(file);
const fileList = dataTransfer.files;
control_fileInput.files = fileList;
}
}
_init();
})();