Initial commit
This commit is contained in:
@@ -0,0 +1,250 @@
|
||||
@model PowderCoating.Application.DTOs.User.CreateCompanyUserDto
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Add New User";
|
||||
ViewData["PageIcon"] = "bi-person-plus";
|
||||
ViewData["PageHelpTitle"] = "Add New User";
|
||||
ViewData["PageHelpContent"] = "Creates a new login account for a member of your company. The email address doubles as the login username. Set a temporary password — the user can change it from their Profile page after their first login. Assign a Role, then fine-tune individual permissions below.";
|
||||
}
|
||||
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-10">
|
||||
<div class="d-flex justify-content-end mb-4">
|
||||
<a asp-action="Index" class="btn btn-outline-secondary">
|
||||
<i class="bi bi-arrow-left me-1"></i>Back to List
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<form asp-action="Create" method="post">
|
||||
<partial name="_ValidationSummary" />
|
||||
|
||||
<div class="d-flex align-items-center gap-2 mb-3 pb-2 border-bottom">
|
||||
<h5 class="card-title mb-0">Basic Information</h5>
|
||||
<a tabindex="0" class="help-icon" role="button"
|
||||
data-bs-toggle="popover" data-bs-placement="right" data-bs-trigger="focus"
|
||||
data-bs-title="Basic Information"
|
||||
data-bs-content="First Name, Last Name, and Email are required. The email is used as the login username — it must be unique across the system. Employee Number is an optional internal reference. The user can update their name and phone from their own Profile page after logging in.">
|
||||
<i class="bi bi-question-circle"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-md-6">
|
||||
<label asp-for="FirstName" class="form-label">First Name *</label>
|
||||
<input asp-for="FirstName" class="form-control" />
|
||||
<span asp-validation-for="FirstName" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label asp-for="LastName" class="form-label">Last Name *</label>
|
||||
<input asp-for="LastName" class="form-control" />
|
||||
<span asp-validation-for="LastName" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label asp-for="Email" class="form-label">Email *</label>
|
||||
<input asp-for="Email" class="form-control" type="email" />
|
||||
<span asp-validation-for="Email" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label asp-for="Password" class="form-label">Password *</label>
|
||||
<input asp-for="Password" class="form-control" type="password" />
|
||||
<span asp-validation-for="Password" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label asp-for="EmployeeNumber" class="form-label">Employee Number</label>
|
||||
<input asp-for="EmployeeNumber" class="form-control" />
|
||||
<span asp-validation-for="EmployeeNumber" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label asp-for="Phone" class="form-label">Phone</label>
|
||||
<input asp-for="Phone" class="form-control" />
|
||||
<span asp-validation-for="Phone" class="text-danger"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2 mb-3 pb-2 border-bottom">
|
||||
<h5 class="card-title mb-0">Role & Department</h5>
|
||||
<a tabindex="0" class="help-icon" role="button"
|
||||
data-bs-toggle="popover" data-bs-placement="right" data-bs-trigger="focus"
|
||||
data-bs-title="Role & Department"
|
||||
data-bs-content="Role controls default access level: Viewer = read-only, Worker = day-to-day tasks, Manager = broader access, Company Admin = full access to everything. Department and Position are informational and appear on the user's profile. Hire Date is used for record-keeping.">
|
||||
<i class="bi bi-question-circle"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-md-4">
|
||||
<label asp-for="CompanyRole" class="form-label">Role *</label>
|
||||
<select asp-for="CompanyRole" class="form-select">
|
||||
<option value="Viewer">Viewer (Read-only)</option>
|
||||
<option value="Worker">Worker</option>
|
||||
<option value="Manager">Manager</option>
|
||||
<option value="CompanyAdmin">Company Admin</option>
|
||||
</select>
|
||||
<span asp-validation-for="CompanyRole" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label asp-for="Department" class="form-label">Department</label>
|
||||
<input asp-for="Department" class="form-control" />
|
||||
<span asp-validation-for="Department" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label asp-for="Position" class="form-label">Position</label>
|
||||
<input asp-for="Position" class="form-control" />
|
||||
<span asp-validation-for="Position" class="text-danger"></span>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label asp-for="HireDate" class="form-label">Hire Date</label>
|
||||
<input asp-for="HireDate" class="form-control" type="date" />
|
||||
<span asp-validation-for="HireDate" class="text-danger"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2 mb-3 pb-2 border-bottom">
|
||||
<h5 class="card-title mb-0">Permissions</h5>
|
||||
<a tabindex="0" class="help-icon" role="button"
|
||||
data-bs-toggle="popover" data-bs-placement="right" data-bs-trigger="focus"
|
||||
data-bs-title="Permissions"
|
||||
data-bs-content="Fine-grained permissions let you grant specific capabilities beyond what the Role provides. Company Admin automatically receives all permissions and the checkboxes will be locked. For other roles, check only what this user needs. Permissions can be updated at any time from the Edit page.">
|
||||
<i class="bi bi-question-circle"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div id="companyAdminAlert" class="alert alert-info" style="display: none;">
|
||||
<i class="bi bi-info-circle me-2"></i>
|
||||
<strong>Company Admins automatically have all permissions.</strong> These checkboxes are disabled because Company Admins always have full access to all features.
|
||||
</div>
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageJobs" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageJobs" class="form-check-label">Can Manage Jobs</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageInventory" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageInventory" class="form-check-label">Can Manage Inventory</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageCustomers" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageCustomers" class="form-check-label">Can Manage Customers</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanCreateQuotes" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanCreateQuotes" class="form-check-label">Can Create Quotes</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanApproveQuotes" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanApproveQuotes" class="form-check-label">Can Approve Quotes</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageCalendar" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageCalendar" class="form-check-label">Can Manage Calendar</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanViewCalendar" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanViewCalendar" class="form-check-label">Can View Calendar</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageProducts" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageProducts" class="form-check-label">Can Manage Products</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanViewProducts" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanViewProducts" class="form-check-label">Can View Products</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageEquipment" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageEquipment" class="form-check-label">Can Manage Equipment</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageVendors" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageVendors" class="form-check-label">Can Manage Vendors</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageMaintenance" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageMaintenance" class="form-check-label">Can Manage Maintenance</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanManageInvoices" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanManageInvoices" class="form-check-label">Can Manage Invoices</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check">
|
||||
<input asp-for="CanViewReports" class="form-check-input permission-checkbox" />
|
||||
<label asp-for="CanViewReports" class="form-check-label">Can View Reports</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex gap-2 justify-content-end">
|
||||
<a asp-action="Index" class="btn btn-secondary">Cancel</a>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="bi bi-save me-1"></i>Create User
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@section Scripts {
|
||||
@{
|
||||
await Html.RenderPartialAsync("_ValidationScriptsPartial");
|
||||
}
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const roleSelect = document.getElementById('CompanyRole');
|
||||
const permissionCheckboxes = document.querySelectorAll('.permission-checkbox');
|
||||
const adminAlert = document.getElementById('companyAdminAlert');
|
||||
|
||||
function updatePermissionState() {
|
||||
const isCompanyAdmin = roleSelect.value === 'CompanyAdmin';
|
||||
|
||||
// Show/hide alert
|
||||
adminAlert.style.display = isCompanyAdmin ? 'block' : 'none';
|
||||
|
||||
// Check all and disable if Company Admin, otherwise enable
|
||||
permissionCheckboxes.forEach(checkbox => {
|
||||
if (isCompanyAdmin) {
|
||||
checkbox.checked = true;
|
||||
checkbox.disabled = true;
|
||||
} else {
|
||||
checkbox.disabled = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Run on page load
|
||||
updatePermissionState();
|
||||
|
||||
// Run when role changes
|
||||
roleSelect.addEventListener('change', updatePermissionState);
|
||||
});
|
||||
</script>
|
||||
}
|
||||
Reference in New Issue
Block a user