@posiwise/admin-module 0.0.248 → 0.0.251
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -4985,7 +4985,7 @@ var DomainConfigCoreComponent = class DomainConfigCoreComponent extends AppBaseC
|
|
|
4985
4985
|
selector: "pw-domain-config-core",
|
|
4986
4986
|
usesInheritance: true,
|
|
4987
4987
|
ngImport: i0,
|
|
4988
|
-
template: "<h3>Core Configuration</h3>\n<div>\n <p class=\"mb-5\">The following details are required to correctly set up your domain.<br/>\n Make sure each field is completed accurately to ensure smooth operation and full feature access.\n </p>\n</div>\n@if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n}\n@if (!isLoading) {\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyName' | transloco\" name=\"company_name\" controlId=\"domain-core-company_name\">\n <input type=\"text\" id=\"domain-core-company_name\" class=\"form-control\" formControlName=\"company_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_name'].errors }\" name=\"input_company_name_1\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyEmail' | transloco\" name=\"company_email\" controlId=\"domain-core-company_email\">\n <input type=\"text\" id=\"domain-core-company_email\" class=\"form-control\" formControlName=\"company_email\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyEmail' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_email'].errors }\" name=\"input_company_email_2\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyUrl' | transloco\" name=\"company_url\" controlId=\"domain-core-company_url\">\n <input type=\"text\" id=\"domain-core-company_url\" class=\"form-control\" formControlName=\"company_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" name=\"input_company_url_3\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\" *rbacAllow=\"'Pages.SuperAdmin'\">\n <pw-input-container\n [label]=\"'Admin.DomainConfig.DashboardLayout' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.DashboardLayout' | transloco\"\n name=\"layout\" controlId=\"domain-core-layout\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-core-layout-label'\"\n formControlName=\"layout\"\n [options]=\"layoutOptions\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"'Admin.DomainConfig.Placeholder.Layout' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['layout'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.HostName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.HostName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.HostName' | transloco\"\n name=\"host_name\" controlId=\"domain-core-host_name\">\n <input type=\"text\"\n id=\"domain-core-host_name\"\n class=\"form-control\"\n formControlName=\"host_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.HostName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['host_name'].errors }\" name=\"input_host_name_4\"\n [attr.aria-label]=\"'Admin.DomainConfig.HostName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.InternalPath' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.InternalPath' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.InternalPath' | transloco\"\n name=\"internal_path\" controlId=\"domain-core-internal_path\">\n <input type=\"text\"\n id=\"domain-core-internal_path\"\n class=\"form-control\"\n formControlName=\"internal_path\" [placeholder]=\"'Admin.DomainConfig.Placeholder.InternalPath' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['internal_path'].errors }\" name=\"input_internal_path_5\"\n [attr.aria-label]=\"'Admin.DomainConfig.InternalPath' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.LoginDefaultRoute' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.LoginDefaultRoute' | transloco\"\n name=\"login_default_route\" controlId=\"domain-core-login_default_route\">\n <input type=\"text\"\n id=\"domain-core-login_default_route\"\n class=\"form-control\"\n formControlName=\"login_default_route\"\n [placeholder]=\"'Admin.DomainConfig.Placeholder.LoginDefaultRoute' | transloco\"\n name=\"input_login_default_route_6\"\n [attr.aria-label]=\"'Admin.DomainConfig.LoginDefaultRoute' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.Description' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Description'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.Description' | transloco\" name=\"description\" controlId=\"domain-core-description\">\n <input type=\"text\" id=\"domain-core-description\" class=\"form-control\" formControlName=\"description\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\" name=\"input_description_6\"\n [attr.aria-label]=\"'Admin.DomainConfig.Description' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.FrontendRepoName'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.FrontendRepoName' | transloco\" name=\"frontend_repo_name\" controlId=\"domain-core-frontend_repo_name\">\n <input type=\"text\" id=\"domain-core-frontend_repo_name\" class=\"form-control\" formControlName=\"frontend_repo_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.FrontendRepoName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['frontend_repo_name'].errors }\" name=\"input_frontend_repo_name_7\"\n [attr.aria-label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"/>\n </pw-input-container>\n </div>\n <ng-container>\n <h3 class=\"mt-4\">Database and Webhook Configuration</h3>\n <p class=\"mb-5\">These settings control database and webhook integrations.<br/>\n Do not modify them unless you’re confident in what you’re doing — incorrect changes may disrupt system functionality.</p>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardName' | transloco\"\n name=\"shard_name\" controlId=\"domain-core-shard_name\">\n <input type=\"text\"\n id=\"domain-core-shard_name\"\n class=\"form-control\"\n formControlName=\"shard_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.ShardName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_name'].errors }\" name=\"input_shard_name_8\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardUrl' | transloco\"\n name=\"shard_url\" controlId=\"domain-core-shard_url\">\n <input type=\"text\"\n id=\"domain-core-shard_url\"\n class=\"form-control\"\n formControlName=\"shard_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_url'].errors }\" name=\"input_shard_url_9\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IntraServicesToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.IntraServicesToken' | transloco\"\n name=\"intraservices_token\" controlId=\"domain-core-intraservices_token\">\n <input type=\"text\"\n id=\"domain-core-intraservices_token\"\n class=\"form-control\"\n formControlName=\"intraservices_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.IntraServicesToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['intraservices_token'].errors }\" name=\"input_intraservices_token_10\"\n [attr.aria-label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.WebhookToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.WebhookToken' | transloco\"\n name=\"webhook_token\" controlId=\"domain-core-webhook_token\">\n <input type=\"text\"\n id=\"domain-core-webhook_token\"\n class=\"form-control\"\n formControlName=\"webhook_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.WebhookToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['webhook_token'].errors }\" name=\"input_webhook_token_11\"\n [attr.aria-label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"/>\n </pw-input-container>\n </div>\n </ng-container>\n </div>\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n}\n",
|
|
4988
|
+
template: "<h3>Core Configuration</h3>\n<div>\n <p class=\"mb-5\">The following details are required to correctly set up your domain.<br/>\n Make sure each field is completed accurately to ensure smooth operation and full feature access.\n </p>\n</div>\n@if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n}\n@if (!isLoading) {\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyName' | transloco\" name=\"company_name\" controlId=\"domain-core-company_name\">\n <input type=\"text\" id=\"domain-core-company_name\" class=\"form-control\" formControlName=\"company_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_name'].errors }\" name=\"input_company_name_1\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyEmail' | transloco\" name=\"company_email\" controlId=\"domain-core-company_email\">\n <input type=\"text\" id=\"domain-core-company_email\" class=\"form-control\" formControlName=\"company_email\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyEmail' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_email'].errors }\" name=\"input_company_email_2\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyUrl' | transloco\" name=\"company_url\" controlId=\"domain-core-company_url\">\n <input type=\"text\" id=\"domain-core-company_url\" class=\"form-control\" formControlName=\"company_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" name=\"input_company_url_3\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\" *rbacAllow=\"'Pages.SuperAdmin'\">\n <pw-input-container\n [label]=\"'Admin.DomainConfig.DashboardLayout' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.DashboardLayout' | transloco\"\n name=\"layout\" controlId=\"domain-core-layout\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-core-layout-label'\"\n formControlName=\"layout\"\n [options]=\"layoutOptions\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"'Admin.DomainConfig.Placeholder.Layout' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['layout'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.HostName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.HostName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.HostName' | transloco\"\n name=\"host_name\" controlId=\"domain-core-host_name\">\n <input type=\"text\"\n id=\"domain-core-host_name\"\n class=\"form-control\"\n formControlName=\"host_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.HostName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['host_name'].errors }\" name=\"input_host_name_4\"\n [attr.aria-label]=\"'Admin.DomainConfig.HostName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.InternalPath' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.InternalPath' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.InternalPath' | transloco\"\n name=\"internal_path\" controlId=\"domain-core-internal_path\">\n <input type=\"text\"\n id=\"domain-core-internal_path\"\n class=\"form-control\"\n formControlName=\"internal_path\" [placeholder]=\"'Admin.DomainConfig.Placeholder.InternalPath' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['internal_path'].errors }\" name=\"input_internal_path_5\"\n [attr.aria-label]=\"'Admin.DomainConfig.InternalPath' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.Description' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Description'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.Description' | transloco\" name=\"description\" controlId=\"domain-core-description\">\n <input type=\"text\" id=\"domain-core-description\" class=\"form-control\" formControlName=\"description\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\" name=\"input_description_6\"\n [attr.aria-label]=\"'Admin.DomainConfig.Description' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.FrontendRepoName'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.FrontendRepoName' | transloco\" name=\"frontend_repo_name\" controlId=\"domain-core-frontend_repo_name\">\n <input type=\"text\" id=\"domain-core-frontend_repo_name\" class=\"form-control\" formControlName=\"frontend_repo_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.FrontendRepoName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['frontend_repo_name'].errors }\" name=\"input_frontend_repo_name_7\"\n [attr.aria-label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"/>\n </pw-input-container>\n </div>\n <ng-container>\n <h3 class=\"mt-4\">Database and Webhook Configuration</h3>\n <p class=\"mb-5\">These settings control database and webhook integrations.<br/>\n Do not modify them unless you’re confident in what you’re doing — incorrect changes may disrupt system functionality.</p>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardName' | transloco\"\n name=\"shard_name\" controlId=\"domain-core-shard_name\">\n <input type=\"text\"\n id=\"domain-core-shard_name\"\n class=\"form-control\"\n formControlName=\"shard_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.ShardName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_name'].errors }\" name=\"input_shard_name_8\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardUrl' | transloco\"\n name=\"shard_url\" controlId=\"domain-core-shard_url\">\n <input type=\"text\"\n id=\"domain-core-shard_url\"\n class=\"form-control\"\n formControlName=\"shard_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_url'].errors }\" name=\"input_shard_url_9\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IntraServicesToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.IntraServicesToken' | transloco\"\n name=\"intraservices_token\" controlId=\"domain-core-intraservices_token\">\n <input type=\"text\"\n id=\"domain-core-intraservices_token\"\n class=\"form-control\"\n formControlName=\"intraservices_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.IntraServicesToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['intraservices_token'].errors }\" name=\"input_intraservices_token_10\"\n [attr.aria-label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.WebhookToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.WebhookToken' | transloco\"\n name=\"webhook_token\" controlId=\"domain-core-webhook_token\">\n <input type=\"text\"\n id=\"domain-core-webhook_token\"\n class=\"form-control\"\n formControlName=\"webhook_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.WebhookToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['webhook_token'].errors }\" name=\"input_webhook_token_11\"\n [attr.aria-label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"/>\n </pw-input-container>\n </div>\n </ng-container>\n </div>\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n}\n",
|
|
4989
4989
|
dependencies: [
|
|
4990
4990
|
{
|
|
4991
4991
|
kind: "component",
|
|
@@ -5171,7 +5171,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
5171
5171
|
args: [{
|
|
5172
5172
|
selector: "pw-domain-config-core",
|
|
5173
5173
|
standalone: false,
|
|
5174
|
-
template: "<h3>Core Configuration</h3>\n<div>\n <p class=\"mb-5\">The following details are required to correctly set up your domain.<br/>\n Make sure each field is completed accurately to ensure smooth operation and full feature access.\n </p>\n</div>\n@if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n}\n@if (!isLoading) {\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyName' | transloco\" name=\"company_name\" controlId=\"domain-core-company_name\">\n <input type=\"text\" id=\"domain-core-company_name\" class=\"form-control\" formControlName=\"company_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_name'].errors }\" name=\"input_company_name_1\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyEmail' | transloco\" name=\"company_email\" controlId=\"domain-core-company_email\">\n <input type=\"text\" id=\"domain-core-company_email\" class=\"form-control\" formControlName=\"company_email\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyEmail' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_email'].errors }\" name=\"input_company_email_2\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyUrl' | transloco\" name=\"company_url\" controlId=\"domain-core-company_url\">\n <input type=\"text\" id=\"domain-core-company_url\" class=\"form-control\" formControlName=\"company_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" name=\"input_company_url_3\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\" *rbacAllow=\"'Pages.SuperAdmin'\">\n <pw-input-container\n [label]=\"'Admin.DomainConfig.DashboardLayout' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.DashboardLayout' | transloco\"\n name=\"layout\" controlId=\"domain-core-layout\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-core-layout-label'\"\n formControlName=\"layout\"\n [options]=\"layoutOptions\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"'Admin.DomainConfig.Placeholder.Layout' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['layout'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.HostName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.HostName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.HostName' | transloco\"\n name=\"host_name\" controlId=\"domain-core-host_name\">\n <input type=\"text\"\n id=\"domain-core-host_name\"\n class=\"form-control\"\n formControlName=\"host_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.HostName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['host_name'].errors }\" name=\"input_host_name_4\"\n [attr.aria-label]=\"'Admin.DomainConfig.HostName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.InternalPath' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.InternalPath' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.InternalPath' | transloco\"\n name=\"internal_path\" controlId=\"domain-core-internal_path\">\n <input type=\"text\"\n id=\"domain-core-internal_path\"\n class=\"form-control\"\n formControlName=\"internal_path\" [placeholder]=\"'Admin.DomainConfig.Placeholder.InternalPath' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['internal_path'].errors }\" name=\"input_internal_path_5\"\n [attr.aria-label]=\"'Admin.DomainConfig.InternalPath' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.LoginDefaultRoute' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.LoginDefaultRoute' | transloco\"\n name=\"login_default_route\" controlId=\"domain-core-login_default_route\">\n <input type=\"text\"\n id=\"domain-core-login_default_route\"\n class=\"form-control\"\n formControlName=\"login_default_route\"\n [placeholder]=\"'Admin.DomainConfig.Placeholder.LoginDefaultRoute' | transloco\"\n name=\"input_login_default_route_6\"\n [attr.aria-label]=\"'Admin.DomainConfig.LoginDefaultRoute' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.Description' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Description'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.Description' | transloco\" name=\"description\" controlId=\"domain-core-description\">\n <input type=\"text\" id=\"domain-core-description\" class=\"form-control\" formControlName=\"description\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\" name=\"input_description_6\"\n [attr.aria-label]=\"'Admin.DomainConfig.Description' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.FrontendRepoName'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.FrontendRepoName' | transloco\" name=\"frontend_repo_name\" controlId=\"domain-core-frontend_repo_name\">\n <input type=\"text\" id=\"domain-core-frontend_repo_name\" class=\"form-control\" formControlName=\"frontend_repo_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.FrontendRepoName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['frontend_repo_name'].errors }\" name=\"input_frontend_repo_name_7\"\n [attr.aria-label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"/>\n </pw-input-container>\n </div>\n <ng-container>\n <h3 class=\"mt-4\">Database and Webhook Configuration</h3>\n <p class=\"mb-5\">These settings control database and webhook integrations.<br/>\n Do not modify them unless you’re confident in what you’re doing — incorrect changes may disrupt system functionality.</p>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardName' | transloco\"\n name=\"shard_name\" controlId=\"domain-core-shard_name\">\n <input type=\"text\"\n id=\"domain-core-shard_name\"\n class=\"form-control\"\n formControlName=\"shard_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.ShardName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_name'].errors }\" name=\"input_shard_name_8\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardUrl' | transloco\"\n name=\"shard_url\" controlId=\"domain-core-shard_url\">\n <input type=\"text\"\n id=\"domain-core-shard_url\"\n class=\"form-control\"\n formControlName=\"shard_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_url'].errors }\" name=\"input_shard_url_9\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IntraServicesToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.IntraServicesToken' | transloco\"\n name=\"intraservices_token\" controlId=\"domain-core-intraservices_token\">\n <input type=\"text\"\n id=\"domain-core-intraservices_token\"\n class=\"form-control\"\n formControlName=\"intraservices_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.IntraServicesToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['intraservices_token'].errors }\" name=\"input_intraservices_token_10\"\n [attr.aria-label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.WebhookToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.WebhookToken' | transloco\"\n name=\"webhook_token\" controlId=\"domain-core-webhook_token\">\n <input type=\"text\"\n id=\"domain-core-webhook_token\"\n class=\"form-control\"\n formControlName=\"webhook_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.WebhookToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['webhook_token'].errors }\" name=\"input_webhook_token_11\"\n [attr.aria-label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"/>\n </pw-input-container>\n </div>\n </ng-container>\n </div>\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n}\n"
|
|
5174
|
+
template: "<h3>Core Configuration</h3>\n<div>\n <p class=\"mb-5\">The following details are required to correctly set up your domain.<br/>\n Make sure each field is completed accurately to ensure smooth operation and full feature access.\n </p>\n</div>\n@if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n}\n@if (!isLoading) {\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyName' | transloco\" name=\"company_name\" controlId=\"domain-core-company_name\">\n <input type=\"text\" id=\"domain-core-company_name\" class=\"form-control\" formControlName=\"company_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_name'].errors }\" name=\"input_company_name_1\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyEmail' | transloco\" name=\"company_email\" controlId=\"domain-core-company_email\">\n <input type=\"text\" id=\"domain-core-company_email\" class=\"form-control\" formControlName=\"company_email\" [placeholder]=\"'Admin.DomainConfig.Placeholder.CompanyEmail' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_email'].errors }\" name=\"input_company_email_2\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyUrl' | transloco\" name=\"company_url\" controlId=\"domain-core-company_url\">\n <input type=\"text\" id=\"domain-core-company_url\" class=\"form-control\" formControlName=\"company_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" name=\"input_company_url_3\"\n [attr.aria-label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\" *rbacAllow=\"'Pages.SuperAdmin'\">\n <pw-input-container\n [label]=\"'Admin.DomainConfig.DashboardLayout' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.DashboardLayout' | transloco\"\n name=\"layout\" controlId=\"domain-core-layout\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-core-layout-label'\"\n formControlName=\"layout\"\n [options]=\"layoutOptions\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"'Admin.DomainConfig.Placeholder.Layout' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['layout'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.HostName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.HostName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.HostName' | transloco\"\n name=\"host_name\" controlId=\"domain-core-host_name\">\n <input type=\"text\"\n id=\"domain-core-host_name\"\n class=\"form-control\"\n formControlName=\"host_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.HostName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['host_name'].errors }\" name=\"input_host_name_4\"\n [attr.aria-label]=\"'Admin.DomainConfig.HostName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.InternalPath' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.InternalPath' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.InternalPath' | transloco\"\n name=\"internal_path\" controlId=\"domain-core-internal_path\">\n <input type=\"text\"\n id=\"domain-core-internal_path\"\n class=\"form-control\"\n formControlName=\"internal_path\" [placeholder]=\"'Admin.DomainConfig.Placeholder.InternalPath' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['internal_path'].errors }\" name=\"input_internal_path_5\"\n [attr.aria-label]=\"'Admin.DomainConfig.InternalPath' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.Description' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Description'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.Description' | transloco\" name=\"description\" controlId=\"domain-core-description\">\n <input type=\"text\" id=\"domain-core-description\" class=\"form-control\" formControlName=\"description\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\" name=\"input_description_6\"\n [attr.aria-label]=\"'Admin.DomainConfig.Description' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.FrontendRepoName'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.FrontendRepoName' | transloco\" name=\"frontend_repo_name\" controlId=\"domain-core-frontend_repo_name\">\n <input type=\"text\" id=\"domain-core-frontend_repo_name\" class=\"form-control\" formControlName=\"frontend_repo_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.FrontendRepoName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['frontend_repo_name'].errors }\" name=\"input_frontend_repo_name_7\"\n [attr.aria-label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"/>\n </pw-input-container>\n </div>\n <ng-container>\n <h3 class=\"mt-4\">Database and Webhook Configuration</h3>\n <p class=\"mb-5\">These settings control database and webhook integrations.<br/>\n Do not modify them unless you’re confident in what you’re doing — incorrect changes may disrupt system functionality.</p>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardName' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardName' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardName' | transloco\"\n name=\"shard_name\" controlId=\"domain-core-shard_name\">\n <input type=\"text\"\n id=\"domain-core-shard_name\"\n class=\"form-control\"\n formControlName=\"shard_name\" [placeholder]=\"'Admin.DomainConfig.Placeholder.ShardName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_name'].errors }\" name=\"input_shard_name_8\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardName' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardUrl' | transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.ShardUrl' | transloco\"\n name=\"shard_url\" controlId=\"domain-core-shard_url\">\n <input type=\"text\"\n id=\"domain-core-shard_url\"\n class=\"form-control\"\n formControlName=\"shard_url\" [placeholder]=\"'Admin.DomainConfig.Placeholder.Url' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['shard_url'].errors }\" name=\"input_shard_url_9\"\n [attr.aria-label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IntraServicesToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.IntraServicesToken' | transloco\"\n name=\"intraservices_token\" controlId=\"domain-core-intraservices_token\">\n <input type=\"text\"\n id=\"domain-core-intraservices_token\"\n class=\"form-control\"\n formControlName=\"intraservices_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.IntraServicesToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['intraservices_token'].errors }\" name=\"input_intraservices_token_10\"\n [attr.aria-label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"/>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [showTooltip]=\"true\"\n [label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.WebhookToken'| transloco\"\n [errorMsg]=\"'Admin.DomainConfig.Validation.WebhookToken' | transloco\"\n name=\"webhook_token\" controlId=\"domain-core-webhook_token\">\n <input type=\"text\"\n id=\"domain-core-webhook_token\"\n class=\"form-control\"\n formControlName=\"webhook_token\" [placeholder]=\"'Admin.DomainConfig.Placeholder.WebhookToken' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['webhook_token'].errors }\" name=\"input_webhook_token_11\"\n [attr.aria-label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"/>\n </pw-input-container>\n </div>\n </ng-container>\n </div>\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n}\n"
|
|
5175
5175
|
}]
|
|
5176
5176
|
}],
|
|
5177
5177
|
ctorParameters: () => [
|
|
@@ -14235,7 +14235,7 @@ var NewsletterUsersListComponent = class NewsletterUsersListComponent extends Ap
|
|
|
14235
14235
|
selector: "pw-newsletter-users-list",
|
|
14236
14236
|
usesInheritance: true,
|
|
14237
14237
|
ngImport: i0,
|
|
14238
|
-
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">Newsletter recipients</h3>\n </div>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n\n <div class=\"primeng-datatable-container actions-collapsed table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.newsletter_users\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"newsletter-users-list-search\" class=\"visually-hidden\">Search users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"newsletter-users-list-search\"\n name=\"newsletter-users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Lable.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Lable.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.NewsletterItem.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.NewsletterItem.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_opened\">\n {{ 'Admin.NewsletterItem.LastOpened' | transloco }}\n <p-sort-icon field=\"last_opened\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"open_count\">\n {{ 'Admin.NewsletterItem.OpenCount' | transloco }}\n <p-sort-icon field=\"open_count\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_at\">\n {{ 'Admin.NewsletterItem.ClickedAt' | transloco }}\n <p-sort-icon field=\"clicked_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_count\">\n {{ 'Admin.NewsletterItem.ClickedCount' | transloco }}\n <p-sort-icon field=\"clicked_count\"></p-sort-icon>\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', user?.slug]\">{{ user?.first_name }} {{ user?.last_name }}</a>\n </td>\n <td data-head=\"Email\">{{ user?.email }}</td>\n <td data-head=\"Joined At\">{{ user?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\"
|
|
14238
|
+
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">Newsletter recipients</h3>\n </div>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n\n <div class=\"primeng-datatable-container actions-collapsed table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.newsletter_users\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"newsletter-users-list-search\" class=\"visually-hidden\">Search users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"newsletter-users-list-search\"\n name=\"newsletter-users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Lable.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Lable.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.NewsletterItem.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.NewsletterItem.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_opened\">\n {{ 'Admin.NewsletterItem.LastOpened' | transloco }}\n <p-sort-icon field=\"last_opened\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"open_count\">\n {{ 'Admin.NewsletterItem.OpenCount' | transloco }}\n <p-sort-icon field=\"open_count\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_at\">\n {{ 'Admin.NewsletterItem.ClickedAt' | transloco }}\n <p-sort-icon field=\"clicked_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_count\">\n {{ 'Admin.NewsletterItem.ClickedCount' | transloco }}\n <p-sort-icon field=\"clicked_count\"></p-sort-icon>\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', user?.slug]\">{{ user?.first_name }} {{ user?.last_name }}</a>\n \n </td>\n <td data-head=\"Email\">{{ user?.email }}</td>\n <td data-head=\"Joined At\">{{ user?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\">\n @if (user?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"user.current_sign_in_at\" />\n } @else {\n {{ user?.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Last Opened\">{{ user?.last_opened }}</td>\n <td data-head=\"Open Count\">{{ user?.open_count }}</td>\n <td data-head=\"Clicked At\">{{ user?.clicked_at }}</td>\n <td data-head=\"Clicked Count\">{{ user?.clicked_count }}</td>\n </tr>\n </ng-template>\n </p-table>\n @if (data.object_count === 0 && data.unfiltered_count !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (data.object_count !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"data.object_count\" />\n }\n </div>\n @if (data.unfiltered_count === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.NewsletterItem.NewsLetterRecipientsNoDataMessage' | transloco\">\n </pw-no-data>\n </div>\n }\n",
|
|
14239
14239
|
dependencies: [
|
|
14240
14240
|
{
|
|
14241
14241
|
kind: "component",
|
|
@@ -14425,6 +14425,12 @@ var NewsletterUsersListComponent = class NewsletterUsersListComponent extends Ap
|
|
|
14425
14425
|
"fill"
|
|
14426
14426
|
]
|
|
14427
14427
|
},
|
|
14428
|
+
{
|
|
14429
|
+
kind: "component",
|
|
14430
|
+
type: i6$2.OnlineIndicatorComponent,
|
|
14431
|
+
selector: "pw-online-indicator",
|
|
14432
|
+
inputs: ["lastSeen"]
|
|
14433
|
+
},
|
|
14428
14434
|
{
|
|
14429
14435
|
kind: "component",
|
|
14430
14436
|
type: i6$2.NoDataComponent,
|
|
@@ -14469,6 +14475,11 @@ var NewsletterUsersListComponent = class NewsletterUsersListComponent extends Ap
|
|
|
14469
14475
|
kind: "pipe",
|
|
14470
14476
|
type: i9.DateFormatPipe,
|
|
14471
14477
|
name: "dateFormat"
|
|
14478
|
+
},
|
|
14479
|
+
{
|
|
14480
|
+
kind: "pipe",
|
|
14481
|
+
type: i9.IsOnlinePipe,
|
|
14482
|
+
name: "isOnline"
|
|
14472
14483
|
}
|
|
14473
14484
|
]
|
|
14474
14485
|
});
|
|
@@ -14484,7 +14495,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
14484
14495
|
args: [{
|
|
14485
14496
|
selector: "pw-newsletter-users-list",
|
|
14486
14497
|
standalone: false,
|
|
14487
|
-
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">Newsletter recipients</h3>\n </div>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n\n <div class=\"primeng-datatable-container actions-collapsed table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.newsletter_users\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"newsletter-users-list-search\" class=\"visually-hidden\">Search users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"newsletter-users-list-search\"\n name=\"newsletter-users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Lable.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Lable.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.NewsletterItem.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.NewsletterItem.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_opened\">\n {{ 'Admin.NewsletterItem.LastOpened' | transloco }}\n <p-sort-icon field=\"last_opened\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"open_count\">\n {{ 'Admin.NewsletterItem.OpenCount' | transloco }}\n <p-sort-icon field=\"open_count\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_at\">\n {{ 'Admin.NewsletterItem.ClickedAt' | transloco }}\n <p-sort-icon field=\"clicked_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_count\">\n {{ 'Admin.NewsletterItem.ClickedCount' | transloco }}\n <p-sort-icon field=\"clicked_count\"></p-sort-icon>\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', user?.slug]\">{{ user?.first_name }} {{ user?.last_name }}</a>\n </td>\n <td data-head=\"Email\">{{ user?.email }}</td>\n <td data-head=\"Joined At\">{{ user?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\"
|
|
14498
|
+
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">Newsletter recipients</h3>\n </div>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n\n <div class=\"primeng-datatable-container actions-collapsed table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.newsletter_users\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"newsletter-users-list-search\" class=\"visually-hidden\">Search users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"newsletter-users-list-search\"\n name=\"newsletter-users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Lable.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Lable.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.NewsletterItem.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.NewsletterItem.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_opened\">\n {{ 'Admin.NewsletterItem.LastOpened' | transloco }}\n <p-sort-icon field=\"last_opened\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"open_count\">\n {{ 'Admin.NewsletterItem.OpenCount' | transloco }}\n <p-sort-icon field=\"open_count\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_at\">\n {{ 'Admin.NewsletterItem.ClickedAt' | transloco }}\n <p-sort-icon field=\"clicked_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"clicked_count\">\n {{ 'Admin.NewsletterItem.ClickedCount' | transloco }}\n <p-sort-icon field=\"clicked_count\"></p-sort-icon>\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', user?.slug]\">{{ user?.first_name }} {{ user?.last_name }}</a>\n \n </td>\n <td data-head=\"Email\">{{ user?.email }}</td>\n <td data-head=\"Joined At\">{{ user?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\">\n @if (user?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"user.current_sign_in_at\" />\n } @else {\n {{ user?.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Last Opened\">{{ user?.last_opened }}</td>\n <td data-head=\"Open Count\">{{ user?.open_count }}</td>\n <td data-head=\"Clicked At\">{{ user?.clicked_at }}</td>\n <td data-head=\"Clicked Count\">{{ user?.clicked_count }}</td>\n </tr>\n </ng-template>\n </p-table>\n @if (data.object_count === 0 && data.unfiltered_count !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (data.object_count !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"data.object_count\" />\n }\n </div>\n @if (data.unfiltered_count === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.NewsletterItem.NewsLetterRecipientsNoDataMessage' | transloco\">\n </pw-no-data>\n </div>\n }\n"
|
|
14488
14499
|
}]
|
|
14489
14500
|
}],
|
|
14490
14501
|
ctorParameters: () => [
|
|
@@ -18136,7 +18147,7 @@ var ProductDetailsComponent = class ProductDetailsComponent extends AppBaseCompo
|
|
|
18136
18147
|
selector: "pw-product-details",
|
|
18137
18148
|
usesInheritance: true,
|
|
18138
18149
|
ngImport: i0,
|
|
18139
|
-
template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a (click)=\"back()\" class=\"previous\" aria-label=\"Back\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n @if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n @if (!isLoading) {\n <div class=\"my-4\">\n <div class=\"mb-5\">\n <p-accordion class=\"pw-accordion-info\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>\n <i class=\"far fa-circle-info me-2 text-muted\"></i> How to configure a product\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"row g-4 product-howto\">\n <div class=\"col-12 col-lg-7\">\n <h6 class=\"howto-title\">Product / feature binding</h6>\n <dl class=\"howto-defs\">\n <dt><code>category</code></dt>\n <dd>The product type — e.g. <code>seat_pricing</code> or <code>item_pricing</code>.</dd>\n <dt><code>feature_key</code></dt>\n <dd>Describes the main feature.</dd>\n <dt><code>permission_key</code></dt>\n <dd>A user can be subscribed to only one product per <code>permission_key</code>.</dd>\n <dt><code>product_key</code></dt>\n <dd>Unique per product; drives the frontend permission binding.</dd>\n </dl>\n <p class=\"howto-note\">\n Resulting permission key:\n <code>{{ 'Pages.Product.{permission_key}.{product_key}' }}</code>.\n For a feature tied to an existing product, set its <strong>dependency product</strong> accordingly.\n </p>\n </div>\n <div class=\"col-12 col-lg-5\">\n <h6 class=\"howto-title\">Setting up a free product</h6>\n <ul class=\"howto-list\">\n <li>Leave <code>Stripe Plan</code> empty.</li>\n <li>Set <code>Price per unit</code> to <code>0</code>.</li>\n <li>Set <code>Trial days</code> to a large value (e.g. <code>99999</code>).</li>\n <li>Turn <code>Visible</code> off.</li>\n </ul>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <h3>{{ 'Admin.Products.Section.Identity' | transloco }}</h3>\n @if (id) {\n <div class=\"row\">\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (fullLogo && !fullLogo.includes('no_image_uploaded') && !fullLogoBroken) {\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo\"\n role=\"presentation\" (error)=\"fullLogoBroken = true\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone full-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload full logo\" (keydown.enter)=\"openModal(content)\" (click)=\"openModal(content)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (squaredLogo && !squaredLogo.includes('no_image_uploaded') && !squaredLogoBroken) {\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" class=\"squared_logo\"\n role=\"presentation\" (error)=\"squaredLogoBroken = true\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone squared-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload squared logo\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [placeholder]=\"'Admin.Products.Placeholder.Name' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\"\n [attr.aria-label]=\"'Label.Name' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" name=\"nickname\" controlId=\"product-nickname\"\n [errorMsg]=\"'Admin.Products.Validation.NickName' | transloco\">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\"\n [placeholder]=\"'Admin.Products.Placeholder.NickName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['nickname'].errors }\"\n [attr.aria-label]=\"'Admin.Products.NickName' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\"\n [placeholder]=\"'Admin.Products.Placeholder.DocumentationUrl' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.DocumentationUrl' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Pricing & Billing -->\n <h3>{{ 'Admin.Products.Section.Pricing' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\"\n [placeholder]=\"'Admin.Products.Placeholder.Price' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.Price' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n @if (supportedCurrency$ | async; as currency) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Currency' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n @if (supportedRegions$ | async; as region) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Region' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select inputId=\"product-billing_frequency\"\n [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [placeholder]=\"'Admin.Products.Placeholder.BillingFrequency' | transloco\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MinUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\"\n [placeholder]=\"'Admin.Products.Placeholder.StripePlan' | transloco\"\n [attr.aria-label]=\"'Admin.Products.StripePlan' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.ProrationBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.UnsubscribeBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SecondPaymentRequired' | transloco\"\n [label]=\"'Admin.Products.SecondPaymentRequired' | transloco\" name=\"second_payment_required\" controlId=\"product-second_payment_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"second_payment_required\" name=\"second_payment_required\"\n [attr.aria-labelledby]=\"'product-second_payment_required-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['second_payment_required'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Trial -->\n <h3>{{ 'Admin.Products.Section.Trial' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.TrialDays' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxTrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\"\n [attr.aria-label]=\"'Admin.Products.TrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Feature & Permission Binding -->\n <h3>{{ 'Admin.Products.Section.Binding' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select inputId=\"product-category\"\n [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [placeholder]=\"'Admin.Products.Placeholder.Category' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.FeatureKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\"\n [attr.aria-label]=\"'Admin.Products.FeatureKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\"\n [errorMsg]=\"'Admin.Products.Validation.PermissionKey' | transloco\">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.PermissionKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\"\n [attr.aria-label]=\"'Admin.Products.PermissionKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\"\n [placeholder]=\"'Admin.Products.Placeholder.ProductKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.ProductKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-dependency_products-label\" [pTooltip]=\"'Admin.Products.Tooltip.DependencyProducts' | transloco\" tooltipPosition=\"top\" appendTo=\"body\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [placeholder]=\"'Admin.Products.Placeholder.DependencyProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Products.AssignedRoles' | transloco }} <i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [placeholder]=\"'Admin.Products.Placeholder.Roles' | transloco\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Admin.Products.Placeholder.MasterProduct' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_master_product'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['multiple_allowed'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Onboarding & Signup -->\n <h3>{{ 'Admin.Products.Section.Signup' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructions' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructionEmployees' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Visibility, Support & Compliance -->\n <h3>{{ 'Admin.Products.Section.Visibility' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['members_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['chat_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Admin.Products.Placeholder.PrivacyService' | transloco\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\"\n [placeholder]=\"'Admin.Products.Placeholder.GitlabServiceDeskEmail' | transloco\"\n [attr.aria-label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiselect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [placeholder]=\"'Admin.Products.Placeholder.PartnerProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n",
|
|
18150
|
+
template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a (click)=\"back()\" class=\"previous\" aria-label=\"Back\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n @if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n @if (!isLoading) {\n <div class=\"my-4\">\n <div class=\"mb-5\">\n <p-accordion class=\"pw-accordion-info\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>\n <i class=\"far fa-circle-info me-2 text-muted\"></i> How to configure a product\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"row g-4 product-howto\">\n <div class=\"col-12 col-lg-7\">\n <h6 class=\"howto-title\">Product / feature binding</h6>\n <dl class=\"howto-defs\">\n <dt><code>category</code></dt>\n <dd>The product type — e.g. <code>seat_pricing</code> or <code>item_pricing</code>.</dd>\n <dt><code>feature_key</code></dt>\n <dd>Describes the main feature.</dd>\n <dt><code>permission_key</code></dt>\n <dd>A user can be subscribed to only one product per <code>permission_key</code>.</dd>\n <dt><code>product_key</code></dt>\n <dd>Unique per product; drives the frontend permission binding.</dd>\n </dl>\n <p class=\"howto-note\">\n Resulting permission key:\n <code>{{ 'Pages.Product.{permission_key}.{product_key}' }}</code>.\n For a feature tied to an existing product, set its <strong>dependency product</strong> accordingly.\n </p>\n </div>\n <div class=\"col-12 col-lg-5\">\n <h6 class=\"howto-title\">Setting up a free product</h6>\n <ul class=\"howto-list\">\n <li>Leave <code>Stripe Plan</code> empty.</li>\n <li>Set <code>Price per unit</code> to <code>0</code>.</li>\n <li>Set <code>Trial days</code> to a large value (e.g. <code>99999</code>).</li>\n <li>Turn <code>Visible</code> off.</li>\n </ul>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <h3>{{ 'Admin.Products.Section.Identity' | transloco }}</h3>\n @if (id) {\n <div class=\"row\">\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (fullLogo && !fullLogo.includes('no_image_uploaded') && !fullLogoBroken) {\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo\"\n role=\"presentation\" (error)=\"fullLogoBroken = true\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone full-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload full logo\" (keydown.enter)=\"openModal(content)\" (click)=\"openModal(content)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (squaredLogo && !squaredLogo.includes('no_image_uploaded') && !squaredLogoBroken) {\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" class=\"squared_logo\"\n role=\"presentation\" (error)=\"squaredLogoBroken = true\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone squared-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload squared logo\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [placeholder]=\"'Admin.Products.Placeholder.Name' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\"\n [attr.aria-label]=\"'Label.Name' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" name=\"nickname\" controlId=\"product-nickname\"\n [errorMsg]=\"'Admin.Products.Validation.NickName' | transloco\">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\"\n [placeholder]=\"'Admin.Products.Placeholder.NickName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['nickname'].errors }\"\n [attr.aria-label]=\"'Admin.Products.NickName' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\"\n [placeholder]=\"'Admin.Products.Placeholder.DocumentationUrl' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.DocumentationUrl' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Pricing & Billing -->\n <h3>{{ 'Admin.Products.Section.Pricing' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\"\n [placeholder]=\"'Admin.Products.Placeholder.Price' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.Price' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n @if (supportedCurrency$ | async; as currency) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Currency' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n @if (supportedRegions$ | async; as region) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Region' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select inputId=\"product-billing_frequency\"\n [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [placeholder]=\"'Admin.Products.Placeholder.BillingFrequency' | transloco\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MinUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\"\n [placeholder]=\"'Admin.Products.Placeholder.StripePlan' | transloco\"\n [attr.aria-label]=\"'Admin.Products.StripePlan' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.ProrationBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.UnsubscribeBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SecondPaymentRequired' | transloco\"\n [label]=\"'Admin.Products.SecondPaymentRequired' | transloco\" name=\"second_payment_required\" controlId=\"product-second_payment_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"second_payment_required\" name=\"second_payment_required\"\n [attr.aria-labelledby]=\"'product-second_payment_required-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['second_payment_required'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Trial -->\n <h3>{{ 'Admin.Products.Section.Trial' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.TrialDays' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxTrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\"\n [attr.aria-label]=\"'Admin.Products.TrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Feature & Permission Binding -->\n <h3>{{ 'Admin.Products.Section.Binding' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select inputId=\"product-category\"\n [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [placeholder]=\"'Admin.Products.Placeholder.Category' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.FeatureKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\"\n [attr.aria-label]=\"'Admin.Products.FeatureKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\"\n [errorMsg]=\"'Admin.Products.Validation.PermissionKey' | transloco\">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.PermissionKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\"\n [attr.aria-label]=\"'Admin.Products.PermissionKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\"\n [placeholder]=\"'Admin.Products.Placeholder.ProductKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.ProductKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-dependency_products-label\" [pTooltip]=\"'Admin.Products.Tooltip.DependencyProducts' | transloco\" tooltipPosition=\"top\" appendTo=\"body\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [placeholder]=\"'Admin.Products.Placeholder.DependencyProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Products.AssignedRoles' | transloco }} <i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [placeholder]=\"'Admin.Products.Placeholder.Roles' | transloco\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Admin.Products.Placeholder.MasterProduct' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_master_product'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['multiple_allowed'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Onboarding & Signup -->\n <h3>{{ 'Admin.Products.Section.Signup' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructions' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructionEmployees' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Visibility, Support & Compliance -->\n <h3>{{ 'Admin.Products.Section.Visibility' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['members_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['chat_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Admin.Products.Placeholder.PrivacyService' | transloco\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\"\n [placeholder]=\"'Admin.Products.Placeholder.GitlabServiceDeskEmail' | transloco\"\n [attr.aria-label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.LoginDefaultRoute' | transloco\"\n [label]=\"'Admin.Products.LoginDefaultRoute' | transloco\" name=\"login_default_route\" controlId=\"product-login_default_route\">\n <input type=\"text\" id=\"product-login_default_route\" class=\"form-control\" formControlName=\"login_default_route\"\n [placeholder]=\"'Admin.Products.Placeholder.LoginDefaultRoute' | transloco\"\n [attr.aria-label]=\"'Admin.Products.LoginDefaultRoute' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiselect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [placeholder]=\"'Admin.Products.Placeholder.PartnerProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n",
|
|
18140
18151
|
styles: [".pw-label-style.info-circle{display:inline-block;line-height:1.5}.pw-label-style.info-circle:after{top:-7px}.nowrap{white-space:nowrap}textarea{height:180px}:host .full-logo,:host .squared_logo{background:#f7f8fa;border:1px solid #e2e5ea;border-radius:8px;object-fit:contain;padding:12px}:host .full-logo{height:120px;width:280px}:host .squared_logo{height:150px;width:150px}:host .overlay{cursor:pointer;margin-top:8px}:host .overlay-text a{color:var(--first, #1769e1);cursor:pointer;font-weight:600}:host .overlay-text a:hover{text-decoration:underline}:host .image-container>h4{color:var(--titles, #222);font-size:14px;font-weight:600}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}:host .product-howto{font-size:.9rem}:host .howto-title{font-weight:700;margin-bottom:.85rem}:host .howto-defs{margin:0}:host .howto-defs dt{font-weight:600;margin-top:.55rem}:host .howto-defs dd{margin:.1rem 0 0;color:var(--bs-secondary-color, #6c757d)}:host .howto-list{margin:0;padding-left:1.1rem}:host .howto-list li{margin-bottom:.45rem}:host .howto-note{margin-top:1rem;color:var(--bs-secondary-color, #6c757d)}:host .product-howto code{background:#1769e114;color:var(--first, #1769e1);padding:.1rem .4rem;border-radius:4px;font-size:.85em}\n"],
|
|
18141
18152
|
dependencies: [
|
|
18142
18153
|
{
|
|
@@ -18560,7 +18571,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
18560
18571
|
args: [{
|
|
18561
18572
|
selector: "pw-product-details",
|
|
18562
18573
|
standalone: false,
|
|
18563
|
-
template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a (click)=\"back()\" class=\"previous\" aria-label=\"Back\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n @if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n @if (!isLoading) {\n <div class=\"my-4\">\n <div class=\"mb-5\">\n <p-accordion class=\"pw-accordion-info\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>\n <i class=\"far fa-circle-info me-2 text-muted\"></i> How to configure a product\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"row g-4 product-howto\">\n <div class=\"col-12 col-lg-7\">\n <h6 class=\"howto-title\">Product / feature binding</h6>\n <dl class=\"howto-defs\">\n <dt><code>category</code></dt>\n <dd>The product type — e.g. <code>seat_pricing</code> or <code>item_pricing</code>.</dd>\n <dt><code>feature_key</code></dt>\n <dd>Describes the main feature.</dd>\n <dt><code>permission_key</code></dt>\n <dd>A user can be subscribed to only one product per <code>permission_key</code>.</dd>\n <dt><code>product_key</code></dt>\n <dd>Unique per product; drives the frontend permission binding.</dd>\n </dl>\n <p class=\"howto-note\">\n Resulting permission key:\n <code>{{ 'Pages.Product.{permission_key}.{product_key}' }}</code>.\n For a feature tied to an existing product, set its <strong>dependency product</strong> accordingly.\n </p>\n </div>\n <div class=\"col-12 col-lg-5\">\n <h6 class=\"howto-title\">Setting up a free product</h6>\n <ul class=\"howto-list\">\n <li>Leave <code>Stripe Plan</code> empty.</li>\n <li>Set <code>Price per unit</code> to <code>0</code>.</li>\n <li>Set <code>Trial days</code> to a large value (e.g. <code>99999</code>).</li>\n <li>Turn <code>Visible</code> off.</li>\n </ul>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <h3>{{ 'Admin.Products.Section.Identity' | transloco }}</h3>\n @if (id) {\n <div class=\"row\">\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (fullLogo && !fullLogo.includes('no_image_uploaded') && !fullLogoBroken) {\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo\"\n role=\"presentation\" (error)=\"fullLogoBroken = true\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone full-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload full logo\" (keydown.enter)=\"openModal(content)\" (click)=\"openModal(content)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (squaredLogo && !squaredLogo.includes('no_image_uploaded') && !squaredLogoBroken) {\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" class=\"squared_logo\"\n role=\"presentation\" (error)=\"squaredLogoBroken = true\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone squared-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload squared logo\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [placeholder]=\"'Admin.Products.Placeholder.Name' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\"\n [attr.aria-label]=\"'Label.Name' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" name=\"nickname\" controlId=\"product-nickname\"\n [errorMsg]=\"'Admin.Products.Validation.NickName' | transloco\">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\"\n [placeholder]=\"'Admin.Products.Placeholder.NickName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['nickname'].errors }\"\n [attr.aria-label]=\"'Admin.Products.NickName' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\"\n [placeholder]=\"'Admin.Products.Placeholder.DocumentationUrl' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.DocumentationUrl' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Pricing & Billing -->\n <h3>{{ 'Admin.Products.Section.Pricing' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\"\n [placeholder]=\"'Admin.Products.Placeholder.Price' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.Price' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n @if (supportedCurrency$ | async; as currency) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Currency' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n @if (supportedRegions$ | async; as region) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Region' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select inputId=\"product-billing_frequency\"\n [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [placeholder]=\"'Admin.Products.Placeholder.BillingFrequency' | transloco\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MinUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\"\n [placeholder]=\"'Admin.Products.Placeholder.StripePlan' | transloco\"\n [attr.aria-label]=\"'Admin.Products.StripePlan' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.ProrationBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.UnsubscribeBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SecondPaymentRequired' | transloco\"\n [label]=\"'Admin.Products.SecondPaymentRequired' | transloco\" name=\"second_payment_required\" controlId=\"product-second_payment_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"second_payment_required\" name=\"second_payment_required\"\n [attr.aria-labelledby]=\"'product-second_payment_required-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['second_payment_required'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Trial -->\n <h3>{{ 'Admin.Products.Section.Trial' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.TrialDays' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxTrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\"\n [attr.aria-label]=\"'Admin.Products.TrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Feature & Permission Binding -->\n <h3>{{ 'Admin.Products.Section.Binding' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select inputId=\"product-category\"\n [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [placeholder]=\"'Admin.Products.Placeholder.Category' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.FeatureKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\"\n [attr.aria-label]=\"'Admin.Products.FeatureKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\"\n [errorMsg]=\"'Admin.Products.Validation.PermissionKey' | transloco\">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.PermissionKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\"\n [attr.aria-label]=\"'Admin.Products.PermissionKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\"\n [placeholder]=\"'Admin.Products.Placeholder.ProductKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.ProductKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-dependency_products-label\" [pTooltip]=\"'Admin.Products.Tooltip.DependencyProducts' | transloco\" tooltipPosition=\"top\" appendTo=\"body\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [placeholder]=\"'Admin.Products.Placeholder.DependencyProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Products.AssignedRoles' | transloco }} <i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [placeholder]=\"'Admin.Products.Placeholder.Roles' | transloco\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Admin.Products.Placeholder.MasterProduct' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_master_product'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['multiple_allowed'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Onboarding & Signup -->\n <h3>{{ 'Admin.Products.Section.Signup' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructions' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructionEmployees' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Visibility, Support & Compliance -->\n <h3>{{ 'Admin.Products.Section.Visibility' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['members_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['chat_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Admin.Products.Placeholder.PrivacyService' | transloco\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\"\n [placeholder]=\"'Admin.Products.Placeholder.GitlabServiceDeskEmail' | transloco\"\n [attr.aria-label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiselect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [placeholder]=\"'Admin.Products.Placeholder.PartnerProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n",
|
|
18574
|
+
template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a (click)=\"back()\" class=\"previous\" aria-label=\"Back\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n @if (isLoading) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n </div>\n }\n @if (!isLoading) {\n <div class=\"my-4\">\n <div class=\"mb-5\">\n <p-accordion class=\"pw-accordion-info\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>\n <i class=\"far fa-circle-info me-2 text-muted\"></i> How to configure a product\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"row g-4 product-howto\">\n <div class=\"col-12 col-lg-7\">\n <h6 class=\"howto-title\">Product / feature binding</h6>\n <dl class=\"howto-defs\">\n <dt><code>category</code></dt>\n <dd>The product type — e.g. <code>seat_pricing</code> or <code>item_pricing</code>.</dd>\n <dt><code>feature_key</code></dt>\n <dd>Describes the main feature.</dd>\n <dt><code>permission_key</code></dt>\n <dd>A user can be subscribed to only one product per <code>permission_key</code>.</dd>\n <dt><code>product_key</code></dt>\n <dd>Unique per product; drives the frontend permission binding.</dd>\n </dl>\n <p class=\"howto-note\">\n Resulting permission key:\n <code>{{ 'Pages.Product.{permission_key}.{product_key}' }}</code>.\n For a feature tied to an existing product, set its <strong>dependency product</strong> accordingly.\n </p>\n </div>\n <div class=\"col-12 col-lg-5\">\n <h6 class=\"howto-title\">Setting up a free product</h6>\n <ul class=\"howto-list\">\n <li>Leave <code>Stripe Plan</code> empty.</li>\n <li>Set <code>Price per unit</code> to <code>0</code>.</li>\n <li>Set <code>Trial days</code> to a large value (e.g. <code>99999</code>).</li>\n <li>Turn <code>Visible</code> off.</li>\n </ul>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <h3>{{ 'Admin.Products.Section.Identity' | transloco }}</h3>\n @if (id) {\n <div class=\"row\">\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (fullLogo && !fullLogo.includes('no_image_uploaded') && !fullLogoBroken) {\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo\"\n role=\"presentation\" (error)=\"fullLogoBroken = true\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone full-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload full logo\" (keydown.enter)=\"openModal(content)\" (click)=\"openModal(content)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-start mt-3\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"far fa-info-circle text-muted\"></i>\n </span>\n </h4>\n @if (squaredLogo && !squaredLogo.includes('no_image_uploaded') && !squaredLogoBroken) {\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" class=\"squared_logo\"\n role=\"presentation\" (error)=\"squaredLogoBroken = true\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a>{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n } @else {\n <div class=\"logo-dropzone squared-dropzone\" role=\"button\" tabindex=\"0\"\n aria-label=\"Upload squared logo\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <i class=\"fas fa-upload\"></i>\n <span class=\"dropzone-title\">Upload a logo</span>\n <span class=\"dropzone-hint\">PNG or JPG</span>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [placeholder]=\"'Admin.Products.Placeholder.Name' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\"\n [attr.aria-label]=\"'Label.Name' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" name=\"nickname\" controlId=\"product-nickname\"\n [errorMsg]=\"'Admin.Products.Validation.NickName' | transloco\">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\"\n [placeholder]=\"'Admin.Products.Placeholder.NickName' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['nickname'].errors }\"\n [attr.aria-label]=\"'Admin.Products.NickName' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\"\n [placeholder]=\"'Admin.Products.Placeholder.DocumentationUrl' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.DocumentationUrl' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.Description' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Pricing & Billing -->\n <h3>{{ 'Admin.Products.Section.Pricing' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\"\n [placeholder]=\"'Admin.Products.Placeholder.Price' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.Price' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n @if (supportedCurrency$ | async; as currency) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Currency' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n @if (supportedRegions$ | async; as region) {\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Admin.Products.Placeholder.Region' | transloco\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n }\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select inputId=\"product-billing_frequency\"\n [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [placeholder]=\"'Admin.Products.Placeholder.BillingFrequency' | transloco\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MinUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxUnit' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\"\n [placeholder]=\"'Admin.Products.Placeholder.StripePlan' | transloco\"\n [attr.aria-label]=\"'Admin.Products.StripePlan' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.ProrationBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Admin.Products.Placeholder.UnsubscribeBehavior' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SecondPaymentRequired' | transloco\"\n [label]=\"'Admin.Products.SecondPaymentRequired' | transloco\" name=\"second_payment_required\" controlId=\"product-second_payment_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"second_payment_required\" name=\"second_payment_required\"\n [attr.aria-labelledby]=\"'product-second_payment_required-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['second_payment_required'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Trial -->\n <h3>{{ 'Admin.Products.Section.Trial' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.TrialDays' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.MaxTrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\"\n [attr.aria-label]=\"'Admin.Products.TrialHits' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Feature & Permission Binding -->\n <h3>{{ 'Admin.Products.Section.Binding' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select inputId=\"product-category\"\n [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [placeholder]=\"'Admin.Products.Placeholder.Category' | transloco\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.FeatureKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\"\n [attr.aria-label]=\"'Admin.Products.FeatureKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\"\n [errorMsg]=\"'Admin.Products.Validation.PermissionKey' | transloco\">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\"\n [placeholder]=\"'Admin.Products.Placeholder.PermissionKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\"\n [attr.aria-label]=\"'Admin.Products.PermissionKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\"\n [placeholder]=\"'Admin.Products.Placeholder.ProductKey' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\"\n [attr.aria-label]=\"'Admin.Products.ProductKey' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-dependency_products-label\" [pTooltip]=\"'Admin.Products.Tooltip.DependencyProducts' | transloco\" tooltipPosition=\"top\" appendTo=\"body\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [placeholder]=\"'Admin.Products.Placeholder.DependencyProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <span class=\"pw-label-style\" id=\"product-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Products.AssignedRoles' | transloco }} <i class=\"far fa-info-circle\" aria-hidden=\"true\"></i>\n </span>\n <p-multiselect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [placeholder]=\"'Admin.Products.Placeholder.Roles' | transloco\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiselect>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Admin.Products.Placeholder.MasterProduct' | transloco\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_master_product'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['multiple_allowed'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <!-- Section: Onboarding & Signup -->\n <h3>{{ 'Admin.Products.Section.Signup' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructions' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [placeholder]=\"'Admin.Products.Placeholder.SignupInstructionEmployees' | transloco\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n </div>\n\n <!-- Section: Visibility, Support & Compliance -->\n <h3>{{ 'Admin.Products.Section.Visibility' | transloco }}</h3>\n <div class=\"row\">\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['members_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-6 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['chat_visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Admin.Products.Placeholder.PrivacyService' | transloco\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\"\n [placeholder]=\"'Admin.Products.Placeholder.GitlabServiceDeskEmail' | transloco\"\n [attr.aria-label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.LoginDefaultRoute' | transloco\"\n [label]=\"'Admin.Products.LoginDefaultRoute' | transloco\" name=\"login_default_route\" controlId=\"product-login_default_route\">\n <input type=\"text\" id=\"product-login_default_route\" class=\"form-control\" formControlName=\"login_default_route\"\n [placeholder]=\"'Admin.Products.Placeholder.LoginDefaultRoute' | transloco\"\n [attr.aria-label]=\"'Admin.Products.LoginDefaultRoute' | transloco\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiselect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [placeholder]=\"'Admin.Products.Placeholder.PartnerProducts' | transloco\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiselect>\n </pw-input-container>\n </div>\n </div>\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n",
|
|
18564
18575
|
styles: [".pw-label-style.info-circle{display:inline-block;line-height:1.5}.pw-label-style.info-circle:after{top:-7px}.nowrap{white-space:nowrap}textarea{height:180px}:host .full-logo,:host .squared_logo{background:#f7f8fa;border:1px solid #e2e5ea;border-radius:8px;object-fit:contain;padding:12px}:host .full-logo{height:120px;width:280px}:host .squared_logo{height:150px;width:150px}:host .overlay{cursor:pointer;margin-top:8px}:host .overlay-text a{color:var(--first, #1769e1);cursor:pointer;font-weight:600}:host .overlay-text a:hover{text-decoration:underline}:host .image-container>h4{color:var(--titles, #222);font-size:14px;font-weight:600}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}:host .product-howto{font-size:.9rem}:host .howto-title{font-weight:700;margin-bottom:.85rem}:host .howto-defs{margin:0}:host .howto-defs dt{font-weight:600;margin-top:.55rem}:host .howto-defs dd{margin:.1rem 0 0;color:var(--bs-secondary-color, #6c757d)}:host .howto-list{margin:0;padding-left:1.1rem}:host .howto-list li{margin-bottom:.45rem}:host .howto-note{margin-top:1rem;color:var(--bs-secondary-color, #6c757d)}:host .product-howto code{background:#1769e114;color:var(--first, #1769e1);padding:.1rem .4rem;border-radius:4px;font-size:.85em}\n"]
|
|
18565
18576
|
}]
|
|
18566
18577
|
}],
|
|
@@ -19389,7 +19400,7 @@ var UsersListForProductComponent = class UsersListForProductComponent extends Ap
|
|
|
19389
19400
|
selector: "pw-users-list-for-product",
|
|
19390
19401
|
usesInheritance: true,
|
|
19391
19402
|
ngImport: i0,
|
|
19392
|
-
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n Users list for Product ({{ productName }})\n </h3>\n </div>\n </div>\n </div>\n <div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [globalFilterFields]=\"['first_name', 'email']\"\n [loading]=\"loading\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"users-list-for-product-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-for-product-search\"\n name=\"users-list-for-product-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr class=\"head\">\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.Products.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Products.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template #body\n let-item>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', item?.slug]\">{{ item?.first_name }} {{ item?.last_name }}</a>\n </td>\n <td data-head=\"Email\">{{ item.email }}</td>\n <td data-head=\"Joined At\">{{ item?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\"
|
|
19403
|
+
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n Users list for Product ({{ productName }})\n </h3>\n </div>\n </div>\n </div>\n <div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [globalFilterFields]=\"['first_name', 'email']\"\n [loading]=\"loading\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"users-list-for-product-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-for-product-search\"\n name=\"users-list-for-product-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr class=\"head\">\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.Products.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Products.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template #body\n let-item>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', item?.slug]\">{{ item?.first_name }} {{ item?.last_name }}</a>\n \n </td>\n <td data-head=\"Email\">{{ item.email }}</td>\n <td data-head=\"Joined At\">{{ item?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\">\n @if (item?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"item.current_sign_in_at\" />\n } @else {\n {{ item?.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n @if (currentUser && item.id !== currentUser.id) {\n <li pTooltip=\"Message\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Chat'\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/message']\"\n [fragment]=\"item.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (!loading && (dt?.value?.length ?? 0) === 0) {\n <div>\n <pw-no-data [withImage]=\"true\"\n [message]=\"'Search.NoDataMessage' | transloco\"\n [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n",
|
|
19393
19404
|
dependencies: [
|
|
19394
19405
|
{
|
|
19395
19406
|
kind: "component",
|
|
@@ -19593,6 +19604,12 @@ var UsersListForProductComponent = class UsersListForProductComponent extends Ap
|
|
|
19593
19604
|
outputs: ["ngModelChange"],
|
|
19594
19605
|
exportAs: ["ngModel"]
|
|
19595
19606
|
},
|
|
19607
|
+
{
|
|
19608
|
+
kind: "component",
|
|
19609
|
+
type: i6$2.OnlineIndicatorComponent,
|
|
19610
|
+
selector: "pw-online-indicator",
|
|
19611
|
+
inputs: ["lastSeen"]
|
|
19612
|
+
},
|
|
19596
19613
|
{
|
|
19597
19614
|
kind: "component",
|
|
19598
19615
|
type: i6$2.NoDataComponent,
|
|
@@ -19643,6 +19660,11 @@ var UsersListForProductComponent = class UsersListForProductComponent extends Ap
|
|
|
19643
19660
|
kind: "pipe",
|
|
19644
19661
|
type: i9.DateFormatPipe,
|
|
19645
19662
|
name: "dateFormat"
|
|
19663
|
+
},
|
|
19664
|
+
{
|
|
19665
|
+
kind: "pipe",
|
|
19666
|
+
type: i9.IsOnlinePipe,
|
|
19667
|
+
name: "isOnline"
|
|
19646
19668
|
}
|
|
19647
19669
|
]
|
|
19648
19670
|
});
|
|
@@ -19658,7 +19680,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
19658
19680
|
args: [{
|
|
19659
19681
|
selector: "pw-users-list-for-product",
|
|
19660
19682
|
standalone: false,
|
|
19661
|
-
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n Users list for Product ({{ productName }})\n </h3>\n </div>\n </div>\n </div>\n <div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [globalFilterFields]=\"['first_name', 'email']\"\n [loading]=\"loading\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"users-list-for-product-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-for-product-search\"\n name=\"users-list-for-product-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr class=\"head\">\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.Products.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Products.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template #body\n let-item>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', item?.slug]\">{{ item?.first_name }} {{ item?.last_name }}</a>\n </td>\n <td data-head=\"Email\">{{ item.email }}</td>\n <td data-head=\"Joined At\">{{ item?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\"
|
|
19683
|
+
template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n Users list for Product ({{ productName }})\n </h3>\n </div>\n </div>\n </div>\n <div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [globalFilterFields]=\"['first_name', 'email']\"\n [loading]=\"loading\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"users-list-for-product-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-for-product-search\"\n name=\"users-list-for-product-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr class=\"head\">\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"joined_at\">\n {{ 'Admin.Products.JoinedAt' | transloco }}\n <p-sort-icon field=\"joined_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Products.LastSignInAt' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template #body\n let-item>\n <tr>\n <td data-head=\"Name\">\n <a [routerLink]=\"['/members', item?.slug]\">{{ item?.first_name }} {{ item?.last_name }}</a>\n \n </td>\n <td data-head=\"Email\">{{ item.email }}</td>\n <td data-head=\"Joined At\">{{ item?.joined_at | dateFormat }}</td>\n <td data-head=\"Last Sign In At\">\n @if (item?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"item.current_sign_in_at\" />\n } @else {\n {{ item?.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n @if (currentUser && item.id !== currentUser.id) {\n <li pTooltip=\"Message\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Chat'\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/message']\"\n [fragment]=\"item.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (!loading && (dt?.value?.length ?? 0) === 0) {\n <div>\n <pw-no-data [withImage]=\"true\"\n [message]=\"'Search.NoDataMessage' | transloco\"\n [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n"
|
|
19662
19684
|
}]
|
|
19663
19685
|
}],
|
|
19664
19686
|
ctorParameters: () => [
|
|
@@ -22823,7 +22845,7 @@ var SubscriptionUsersComponent = class SubscriptionUsersComponent extends AppBas
|
|
|
22823
22845
|
],
|
|
22824
22846
|
usesInheritance: true,
|
|
22825
22847
|
ngImport: i0,
|
|
22826
|
-
template: "<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner></p-progress-spinner>\n }\n</div>\n@if (!isAddEnabled && canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <div class=\"text-end mb-2\">\n <button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n </div>\n}\n@if (!isAddEnabled) {\n <section id=\"members\"\n >\n <div [class.hideTable]=\"totalUnfilteredCount === 0\"\n class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"subscriptionMembers\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n [customSort]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"subscription-users-search\" class=\"visually-hidden\">Search subscription users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input id=\"subscription-users-search\"\n name=\"subscription-users-search\"\n [(ngModel)]=\"searchText\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n type=\"text\"\n pInputText\n placeholder=\"Search subscription users...\"\n aria-label=\"Search subscription users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Subscriptions.NickName' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"has_password\">\n {{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n <p-sort-icon field=\"has_password\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Subscriptions.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Id\">{{ user.id }}</td>\n <td data-head=\"First Name\">\n <span class=\"first-name\">{{ user.first_name }}</span>\n @if (subscriptionOwnerUserId === user.id) {\n <span *rbacAllow=\"'Pages.Alpha'\" class=\"badge bg-primary mx-1\"> Owner </span>\n }\n @if (subscriptionAdmins?.includes(user?.id)) {\n <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n }\n </td>\n <td data-head=\"Last Name\">\n {{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Nick Name\">\n <a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n </td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ user?.has_password ? 'Yes' : 'No' }}\n </span>\n @if (user?.blocked) {\n <span\n [pTooltip]=\"'This user has been blocked'\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at) {\n <span>\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n @if (user.current_sign_in_at) {\n <span>\n ({{ user.current_sign_in_at | sinceAgo }})\n </span>\n }\n </span>\n } @else {\n <span>\n <span>\n {{ user.last_sign_in_at | dateFormat }}\n </span>\n @if (user.last_sign_in_at) {\n <span>\n ({{ user.last_sign_in_at | sinceAgo }})\n </span>\n }\n </span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\" class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n </li>\n @if (subscriptionOwnerUserId !== user.id) {\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Set this user as new owner\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\" class=\"fa fa-key warning fa-lg\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (user?.enable_two_factor_authenticator) {\n <li *rbacAllow=\"'Pages.Alpha'\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n pTooltip=\"Disable 2FA\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 success\">\n <i class=\"fa fa-lock\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <!-- Make Admin -->\n @if (!subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Make Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(user, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n <li></li>\n <!-- Remove Admin -->\n @if (subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Remove Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(user, false)\"\n (click)=\"makeAdmin(user, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n } @else {\n <li class=\"mx-3\"></li>\n }\n @if (canShowSubscriptionActions) {\n <li\n [routerLink]=\"[routers.usersDetails + user.id]\"\n pTooltip=\"Edit\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isGranted('Pages.Admin.Users.Delete')) {\n <li\n pTooltip=\"Remove user from subscription\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i (click)=\"onDelete(user)\"\n (keydown.enter)=\"onDelete(user)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalUnfilteredCount !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalUnfilteredCount === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n </pw-no-data>\n </div>\n }\n </section>\n}\n\n\n@if (isAddEnabled) {\n <section id=\"manage-members\"\n >\n <pw-add-members (membersAdded)=\"onMembersAdded()\"\n ></pw-add-members>\n </section>\n}\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
22848
|
+
template: "<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner></p-progress-spinner>\n }\n</div>\n@if (!isAddEnabled && canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <div class=\"text-end mb-2\">\n <button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n </div>\n}\n@if (!isAddEnabled) {\n <section id=\"members\"\n >\n <div [class.hideTable]=\"totalUnfilteredCount === 0\"\n class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"subscriptionMembers\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n [customSort]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"subscription-users-search\" class=\"visually-hidden\">Search subscription users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input id=\"subscription-users-search\"\n name=\"subscription-users-search\"\n [(ngModel)]=\"searchText\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n type=\"text\"\n pInputText\n placeholder=\"Search subscription users...\"\n aria-label=\"Search subscription users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Subscriptions.NickName' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"has_password\">\n {{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n <p-sort-icon field=\"has_password\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Subscriptions.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Id\">{{ user.id }}</td>\n <td data-head=\"First Name\">\n <span class=\"first-name\">{{ user.first_name }}</span>\n @if (subscriptionOwnerUserId === user.id) {\n <span *rbacAllow=\"'Pages.Alpha'\" class=\"badge bg-primary mx-1\"> Owner </span>\n }\n @if (subscriptionAdmins?.includes(user?.id)) {\n <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n }\n \n </td>\n <td data-head=\"Last Name\">\n {{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Nick Name\">\n <a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n </td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ user?.has_password ? 'Yes' : 'No' }}\n </span>\n @if (user?.blocked) {\n <span\n [pTooltip]=\"'This user has been blocked'\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"user.current_sign_in_at\" />\n } @else if (user?.current_sign_in_at) {\n <span>\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n <span>\n ({{ user.current_sign_in_at | sinceAgo }})\n </span>\n </span>\n } @else {\n <span>\n <span>\n {{ user.last_sign_in_at | dateFormat }}\n </span>\n @if (user.last_sign_in_at) {\n <span>\n ({{ user.last_sign_in_at | sinceAgo }})\n </span>\n }\n </span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\" class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n </li>\n @if (subscriptionOwnerUserId !== user.id) {\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Set this user as new owner\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\" class=\"fa fa-key warning fa-lg\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (user?.enable_two_factor_authenticator) {\n <li *rbacAllow=\"'Pages.Alpha'\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n pTooltip=\"Disable 2FA\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 success\">\n <i class=\"fa fa-lock\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <!-- Make Admin -->\n @if (!subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Make Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(user, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n <li></li>\n <!-- Remove Admin -->\n @if (subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Remove Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(user, false)\"\n (click)=\"makeAdmin(user, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n } @else {\n <li class=\"mx-3\"></li>\n }\n @if (canShowSubscriptionActions) {\n <li\n [routerLink]=\"[routers.usersDetails + user.id]\"\n pTooltip=\"Edit\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isGranted('Pages.Admin.Users.Delete')) {\n <li\n pTooltip=\"Remove user from subscription\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i (click)=\"onDelete(user)\"\n (keydown.enter)=\"onDelete(user)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalUnfilteredCount !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalUnfilteredCount === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n </pw-no-data>\n </div>\n }\n </section>\n}\n\n@if (isAddEnabled) {\n <section id=\"manage-members\"\n >\n <pw-add-members (membersAdded)=\"onMembersAdded()\"\n ></pw-add-members>\n </section>\n}\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
22827
22849
|
styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"],
|
|
22828
22850
|
dependencies: [
|
|
22829
22851
|
{
|
|
@@ -23049,6 +23071,12 @@ var SubscriptionUsersComponent = class SubscriptionUsersComponent extends AppBas
|
|
|
23049
23071
|
"fill"
|
|
23050
23072
|
]
|
|
23051
23073
|
},
|
|
23074
|
+
{
|
|
23075
|
+
kind: "component",
|
|
23076
|
+
type: i6$2.OnlineIndicatorComponent,
|
|
23077
|
+
selector: "pw-online-indicator",
|
|
23078
|
+
inputs: ["lastSeen"]
|
|
23079
|
+
},
|
|
23052
23080
|
{
|
|
23053
23081
|
kind: "component",
|
|
23054
23082
|
type: i6$2.NoDataComponent,
|
|
@@ -23121,6 +23149,11 @@ var SubscriptionUsersComponent = class SubscriptionUsersComponent extends AppBas
|
|
|
23121
23149
|
kind: "pipe",
|
|
23122
23150
|
type: i9.SinceAgoPipe,
|
|
23123
23151
|
name: "sinceAgo"
|
|
23152
|
+
},
|
|
23153
|
+
{
|
|
23154
|
+
kind: "pipe",
|
|
23155
|
+
type: i9.IsOnlinePipe,
|
|
23156
|
+
name: "isOnline"
|
|
23124
23157
|
}
|
|
23125
23158
|
]
|
|
23126
23159
|
});
|
|
@@ -23136,7 +23169,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
23136
23169
|
args: [{
|
|
23137
23170
|
selector: "pw-subscription-users",
|
|
23138
23171
|
standalone: false,
|
|
23139
|
-
template: "<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner></p-progress-spinner>\n }\n</div>\n@if (!isAddEnabled && canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <div class=\"text-end mb-2\">\n <button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n </div>\n}\n@if (!isAddEnabled) {\n <section id=\"members\"\n >\n <div [class.hideTable]=\"totalUnfilteredCount === 0\"\n class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"subscriptionMembers\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n [customSort]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"subscription-users-search\" class=\"visually-hidden\">Search subscription users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input id=\"subscription-users-search\"\n name=\"subscription-users-search\"\n [(ngModel)]=\"searchText\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n type=\"text\"\n pInputText\n placeholder=\"Search subscription users...\"\n aria-label=\"Search subscription users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Subscriptions.NickName' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"has_password\">\n {{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n <p-sort-icon field=\"has_password\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Subscriptions.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Id\">{{ user.id }}</td>\n <td data-head=\"First Name\">\n <span class=\"first-name\">{{ user.first_name }}</span>\n @if (subscriptionOwnerUserId === user.id) {\n <span *rbacAllow=\"'Pages.Alpha'\" class=\"badge bg-primary mx-1\"> Owner </span>\n }\n @if (subscriptionAdmins?.includes(user?.id)) {\n <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n }\n </td>\n <td data-head=\"Last Name\">\n {{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Nick Name\">\n <a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n </td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ user?.has_password ? 'Yes' : 'No' }}\n </span>\n @if (user?.blocked) {\n <span\n [pTooltip]=\"'This user has been blocked'\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at) {\n <span>\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n @if (user.current_sign_in_at) {\n <span>\n ({{ user.current_sign_in_at | sinceAgo }})\n </span>\n }\n </span>\n } @else {\n <span>\n <span>\n {{ user.last_sign_in_at | dateFormat }}\n </span>\n @if (user.last_sign_in_at) {\n <span>\n ({{ user.last_sign_in_at | sinceAgo }})\n </span>\n }\n </span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\" class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n </li>\n @if (subscriptionOwnerUserId !== user.id) {\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Set this user as new owner\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\" class=\"fa fa-key warning fa-lg\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (user?.enable_two_factor_authenticator) {\n <li *rbacAllow=\"'Pages.Alpha'\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n pTooltip=\"Disable 2FA\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 success\">\n <i class=\"fa fa-lock\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <!-- Make Admin -->\n @if (!subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Make Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(user, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n <li></li>\n <!-- Remove Admin -->\n @if (subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Remove Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(user, false)\"\n (click)=\"makeAdmin(user, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n } @else {\n <li class=\"mx-3\"></li>\n }\n @if (canShowSubscriptionActions) {\n <li\n [routerLink]=\"[routers.usersDetails + user.id]\"\n pTooltip=\"Edit\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isGranted('Pages.Admin.Users.Delete')) {\n <li\n pTooltip=\"Remove user from subscription\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i (click)=\"onDelete(user)\"\n (keydown.enter)=\"onDelete(user)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalUnfilteredCount !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalUnfilteredCount === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n </pw-no-data>\n </div>\n }\n </section>\n}\n\n\n@if (isAddEnabled) {\n <section id=\"manage-members\"\n >\n <pw-add-members (membersAdded)=\"onMembersAdded()\"\n ></pw-add-members>\n </section>\n}\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
23172
|
+
template: "<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner></p-progress-spinner>\n }\n</div>\n@if (!isAddEnabled && canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <div class=\"text-end mb-2\">\n <button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n </div>\n}\n@if (!isAddEnabled) {\n <section id=\"members\"\n >\n <div [class.hideTable]=\"totalUnfilteredCount === 0\"\n class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n <p-table #dt\n [value]=\"subscriptionMembers\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n [customSort]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template #caption>\n <div class=\"text-end\">\n <label for=\"subscription-users-search\" class=\"visually-hidden\">Search subscription users</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input id=\"subscription-users-search\"\n name=\"subscription-users-search\"\n [(ngModel)]=\"searchText\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n type=\"text\"\n pInputText\n placeholder=\"Search subscription users...\"\n aria-label=\"Search subscription users...\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Subscriptions.NickName' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"has_password\">\n {{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n <p-sort-icon field=\"has_password\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Subscriptions.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\" class=\"actions-list-two\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"Id\">{{ user.id }}</td>\n <td data-head=\"First Name\">\n <span class=\"first-name\">{{ user.first_name }}</span>\n @if (subscriptionOwnerUserId === user.id) {\n <span *rbacAllow=\"'Pages.Alpha'\" class=\"badge bg-primary mx-1\"> Owner </span>\n }\n @if (subscriptionAdmins?.includes(user?.id)) {\n <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n }\n \n </td>\n <td data-head=\"Last Name\">\n {{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Nick Name\">\n <a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n </td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ user?.has_password ? 'Yes' : 'No' }}\n </span>\n @if (user?.blocked) {\n <span\n [pTooltip]=\"'This user has been blocked'\"\n class=\"ms-2\"\n tooltipPosition=\"top\"\n appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"user.current_sign_in_at\" />\n } @else if (user?.current_sign_in_at) {\n <span>\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n <span>\n ({{ user.current_sign_in_at | sinceAgo }})\n </span>\n </span>\n } @else {\n <span>\n <span>\n {{ user.last_sign_in_at | dateFormat }}\n </span>\n @if (user.last_sign_in_at) {\n <span>\n ({{ user.last_sign_in_at | sinceAgo }})\n </span>\n }\n </span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\" class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n </li>\n @if (subscriptionOwnerUserId !== user.id) {\n <li *rbacAllow=\"'Pages.Alpha'\" pTooltip=\"Set this user as new owner\" tooltipPosition=\"top\" appendTo=\"body\" class=\"me-2 me-sm-3\">\n <i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\" class=\"fa fa-key warning fa-lg\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (user?.enable_two_factor_authenticator) {\n <li *rbacAllow=\"'Pages.Alpha'\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n pTooltip=\"Disable 2FA\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 success\">\n <i class=\"fa fa-lock\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n <!-- Make Admin -->\n @if (!subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Make Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(user, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n <li></li>\n <!-- Remove Admin -->\n @if (subscriptionAdmins?.includes(user.id)) {\n <li pTooltip=\"Remove Admin\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(user, false)\"\n (click)=\"makeAdmin(user, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n } @else {\n <li class=\"mx-3\"></li>\n }\n @if (canShowSubscriptionActions) {\n <li\n [routerLink]=\"[routers.usersDetails + user.id]\"\n pTooltip=\"Edit\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n @if (canShowSubscriptionActions && isGranted('Pages.Admin.Users.Delete')) {\n <li\n pTooltip=\"Remove user from subscription\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n class=\"me-2 me-sm-3\">\n <i (click)=\"onDelete(user)\"\n (keydown.enter)=\"onDelete(user)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"></i>\n </li>\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalUnfilteredCount !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalUnfilteredCount === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n </pw-no-data>\n </div>\n }\n </section>\n}\n\n@if (isAddEnabled) {\n <section id=\"manage-members\"\n >\n <pw-add-members (membersAdded)=\"onMembersAdded()\"\n ></pw-add-members>\n </section>\n}\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
23140
23173
|
styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"]
|
|
23141
23174
|
}]
|
|
23142
23175
|
}],
|
|
@@ -35377,7 +35410,7 @@ var UserListComponent = class UserListComponent extends UsersListBaseComponent {
|
|
|
35377
35410
|
],
|
|
35378
35411
|
usesInheritance: true,
|
|
35379
35412
|
ngImport: i0,
|
|
35380
|
-
template: "<div class=\"row\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-baseline\">\n <h2 class=\"card-title p-0\">Users</h2>\n <a class=\"btn btn-sm btn-outline-primary\"\n id=\"btn-create\"\n *rbacAllow=\"'SuperAdmin'\"\n [routerLink]=\"[routers.usersDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner> </p-progress-spinner>\n }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"search-filter\">\n <div class=\"col-sm-4\">\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-role-product\"\n [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter users by role, product, or feature\"\n [selectionLimit]=\"1\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n @if (selectedOption) {\n <div class=\"col-4\"\n >\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-criteria\"\n [options]=\"searchDataSource\"\n (onChange)=\"onSearchCriteria($event)\"\n [showToggleAll]=\"true\"\n [(ngModel)]=\"criteria\"\n [showHeader]=\"true\"\n placeholder=\"Filter by {{ selectedOption.value }}s\"\n maxSelectedLabels=\"2\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n }\n <div class=\"col-auto d-flex align-items-center\">\n <span class=\"ambassadors-only-toggle\"\n [pTooltip]=\"'Admin.Users.AmbassadorsOnly' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <ui-switch\n [checked]=\"showAmbassadorsOnly\"\n (change)=\"showAmbassadorsOnly = $event; onAmbassadorsOnlyToggle()\"\n [attr.aria-label]=\"'Admin.Users.AmbassadorsOnly' | transloco\">\n </ui-switch>\n </span>\n </div>\n <div class=\"text-end\">\n <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-search\"\n name=\"users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n data-cy=\"user-search\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"wd-90\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Users.Slug' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"encrypted_password\">\n {{ 'Admin.Users.EmailConfirm' | transloco }}\n <p-sort-icon field=\"encrypted_password\"></p-sort-icon>\n </th>\n\n <th scope=\"true\"\n pSortableColumn=\"sessions_last_month\">\n {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n <p-sort-icon field=\"sessions_last_month\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Users.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"signed_up_at\">\n {{ 'Admin.Users.RegisteredOn' | transloco }}\n <p-sort-icon field=\"signed_up_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-four\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"id\"> {{ user.id }}</td>\n <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n <td data-head=\"Last Name\">{{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n @if (user?.ambassador_count > 0) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Ambassador' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-handshake alpha-beta text-primary\" aria-hidden=\"true\"></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Slug\">{{ user.slug }}</td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: user?.has_password\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n @if (user?.blocked) {\n <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"S/m #\">\n <span [ngClass]=\"{\n 'text-danger fw-bold': user?.sessions_last_month < 3\n }\">{{ user?.sessions_last_month }}</span>\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at) {\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n } @else {\n {{ user.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fas fa-people-arrows fa-lg\"\n (click)=\"onImpersonate(user)\"\n (keydown.enter)=\"onImpersonate(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n @if (user?.enable_two_factor_authenticator) {\n <li pTooltip=\"Disable 2FA\" tooltipPosition=\"top\" appendTo=\"body\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (currentUser && user.id !== currentUser.id) {\n <li pTooltip=\"Message\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"chatPermission\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/message']\"\n [fragment]=\"user.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n }\n <li pTooltip=\"Edit\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.usersDetails + user.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li pTooltip=\"Delete\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(user)\"\n (keydown.space)=\"onDelete(user)\"\n (click)=\"onDelete(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n [destructive]=\"true\"\n (successEvent)=\"deleteUser($event)\">\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
35413
|
+
template: "<div class=\"row\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-baseline\">\n <h2 class=\"card-title p-0\">Users</h2>\n <a class=\"btn btn-sm btn-outline-primary\"\n id=\"btn-create\"\n *rbacAllow=\"'SuperAdmin'\"\n [routerLink]=\"[routers.usersDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner> </p-progress-spinner>\n }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"search-filter\">\n <div class=\"col-sm-4\">\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-role-product\"\n [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter users by role, product, or feature\"\n [selectionLimit]=\"1\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n @if (selectedOption) {\n <div class=\"col-4\"\n >\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-criteria\"\n [options]=\"searchDataSource\"\n (onChange)=\"onSearchCriteria($event)\"\n [showToggleAll]=\"true\"\n [(ngModel)]=\"criteria\"\n [showHeader]=\"true\"\n placeholder=\"Filter by {{ selectedOption.value }}s\"\n maxSelectedLabels=\"2\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n }\n <div class=\"col-auto d-flex align-items-center\">\n <span class=\"ambassadors-only-toggle\"\n [pTooltip]=\"'Admin.Users.AmbassadorsOnly' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <ui-switch\n [checked]=\"showAmbassadorsOnly\"\n (change)=\"showAmbassadorsOnly = $event; onAmbassadorsOnlyToggle()\"\n [attr.aria-label]=\"'Admin.Users.AmbassadorsOnly' | transloco\">\n </ui-switch>\n </span>\n </div>\n <div class=\"text-end\">\n <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-search\"\n name=\"users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n data-cy=\"user-search\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"wd-90\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Users.Slug' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"encrypted_password\">\n {{ 'Admin.Users.EmailConfirm' | transloco }}\n <p-sort-icon field=\"encrypted_password\"></p-sort-icon>\n </th>\n\n <th scope=\"true\"\n pSortableColumn=\"sessions_last_month\">\n {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n <p-sort-icon field=\"sessions_last_month\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Users.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"signed_up_at\">\n {{ 'Admin.Users.RegisteredOn' | transloco }}\n <p-sort-icon field=\"signed_up_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-four\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"id\"> {{ user.id }}</td>\n <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n <td data-head=\"Last Name\">{{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n @if (user?.ambassador_count > 0) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Ambassador' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-handshake alpha-beta text-primary\" aria-hidden=\"true\"></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Slug\">{{ user.slug }}</td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: user?.has_password\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n @if (user?.blocked) {\n <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"S/m #\">\n <span [ngClass]=\"{\n 'text-danger fw-bold': user?.sessions_last_month < 3\n }\">{{ user?.sessions_last_month }}</span>\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"user.current_sign_in_at\" />\n } @else if (user?.current_sign_in_at) {\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n } @else {\n {{ user.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fas fa-people-arrows fa-lg\"\n (click)=\"onImpersonate(user)\"\n (keydown.enter)=\"onImpersonate(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n @if (user?.enable_two_factor_authenticator) {\n <li pTooltip=\"Disable 2FA\" tooltipPosition=\"top\" appendTo=\"body\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (currentUser && user.id !== currentUser.id) {\n <li pTooltip=\"Message\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"chatPermission\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/message']\"\n [fragment]=\"user.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n }\n <li pTooltip=\"Edit\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.usersDetails + user.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li pTooltip=\"Delete\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(user)\"\n (keydown.space)=\"onDelete(user)\"\n (click)=\"onDelete(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n [destructive]=\"true\"\n (successEvent)=\"deleteUser($event)\">\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
35381
35414
|
styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: color-mix(in srgb, var(--first, rgb(23 105 225)) 85%, #000000);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255);--dashboard_bg: rgb(255 255 255);--public-btn-radius: 24px}.search-input input{width:100%}.w-150{width:150px}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.ambassadors-only-toggle{display:inline-flex;align-items:center}.ambassadors-only-toggle ::ng-deep .switch small{display:flex;align-items:center;justify-content:center}.ambassadors-only-toggle ::ng-deep .switch small:after{content:\"\\f2b5\";font-family:\"Font Awesome 6 Pro\",sans-serif;font-weight:900;font-size:12px;line-height:1;color:var(--first)}\n"],
|
|
35382
35415
|
dependencies: [
|
|
35383
35416
|
{
|
|
@@ -35722,6 +35755,12 @@ var UserListComponent = class UserListComponent extends UsersListBaseComponent {
|
|
|
35722
35755
|
"fill"
|
|
35723
35756
|
]
|
|
35724
35757
|
},
|
|
35758
|
+
{
|
|
35759
|
+
kind: "component",
|
|
35760
|
+
type: i6$2.OnlineIndicatorComponent,
|
|
35761
|
+
selector: "pw-online-indicator",
|
|
35762
|
+
inputs: ["lastSeen"]
|
|
35763
|
+
},
|
|
35725
35764
|
{
|
|
35726
35765
|
kind: "component",
|
|
35727
35766
|
type: i6$2.NoDataComponent,
|
|
@@ -35783,6 +35822,11 @@ var UserListComponent = class UserListComponent extends UsersListBaseComponent {
|
|
|
35783
35822
|
kind: "pipe",
|
|
35784
35823
|
type: i9.DateFormatPipe,
|
|
35785
35824
|
name: "dateFormat"
|
|
35825
|
+
},
|
|
35826
|
+
{
|
|
35827
|
+
kind: "pipe",
|
|
35828
|
+
type: i9.IsOnlinePipe,
|
|
35829
|
+
name: "isOnline"
|
|
35786
35830
|
}
|
|
35787
35831
|
]
|
|
35788
35832
|
});
|
|
@@ -35798,7 +35842,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
35798
35842
|
args: [{
|
|
35799
35843
|
selector: "pw-admin-user-list",
|
|
35800
35844
|
standalone: false,
|
|
35801
|
-
template: "<div class=\"row\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-baseline\">\n <h2 class=\"card-title p-0\">Users</h2>\n <a class=\"btn btn-sm btn-outline-primary\"\n id=\"btn-create\"\n *rbacAllow=\"'SuperAdmin'\"\n [routerLink]=\"[routers.usersDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner> </p-progress-spinner>\n }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"search-filter\">\n <div class=\"col-sm-4\">\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-role-product\"\n [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter users by role, product, or feature\"\n [selectionLimit]=\"1\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n @if (selectedOption) {\n <div class=\"col-4\"\n >\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-criteria\"\n [options]=\"searchDataSource\"\n (onChange)=\"onSearchCriteria($event)\"\n [showToggleAll]=\"true\"\n [(ngModel)]=\"criteria\"\n [showHeader]=\"true\"\n placeholder=\"Filter by {{ selectedOption.value }}s\"\n maxSelectedLabels=\"2\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n }\n <div class=\"col-auto d-flex align-items-center\">\n <span class=\"ambassadors-only-toggle\"\n [pTooltip]=\"'Admin.Users.AmbassadorsOnly' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <ui-switch\n [checked]=\"showAmbassadorsOnly\"\n (change)=\"showAmbassadorsOnly = $event; onAmbassadorsOnlyToggle()\"\n [attr.aria-label]=\"'Admin.Users.AmbassadorsOnly' | transloco\">\n </ui-switch>\n </span>\n </div>\n <div class=\"text-end\">\n <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-search\"\n name=\"users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n data-cy=\"user-search\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"wd-90\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Users.Slug' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"encrypted_password\">\n {{ 'Admin.Users.EmailConfirm' | transloco }}\n <p-sort-icon field=\"encrypted_password\"></p-sort-icon>\n </th>\n\n <th scope=\"true\"\n pSortableColumn=\"sessions_last_month\">\n {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n <p-sort-icon field=\"sessions_last_month\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Users.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"signed_up_at\">\n {{ 'Admin.Users.RegisteredOn' | transloco }}\n <p-sort-icon field=\"signed_up_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-four\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"id\"> {{ user.id }}</td>\n <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n <td data-head=\"Last Name\">{{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n @if (user?.ambassador_count > 0) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Ambassador' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-handshake alpha-beta text-primary\" aria-hidden=\"true\"></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Slug\">{{ user.slug }}</td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: user?.has_password\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n @if (user?.blocked) {\n <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"S/m #\">\n <span [ngClass]=\"{\n 'text-danger fw-bold': user?.sessions_last_month < 3\n }\">{{ user?.sessions_last_month }}</span>\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at) {\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n } @else {\n {{ user.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fas fa-people-arrows fa-lg\"\n (click)=\"onImpersonate(user)\"\n (keydown.enter)=\"onImpersonate(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n @if (user?.enable_two_factor_authenticator) {\n <li pTooltip=\"Disable 2FA\" tooltipPosition=\"top\" appendTo=\"body\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (currentUser && user.id !== currentUser.id) {\n <li pTooltip=\"Message\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"chatPermission\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/message']\"\n [fragment]=\"user.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n }\n <li pTooltip=\"Edit\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.usersDetails + user.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li pTooltip=\"Delete\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(user)\"\n (keydown.space)=\"onDelete(user)\"\n (click)=\"onDelete(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n [destructive]=\"true\"\n (successEvent)=\"deleteUser($event)\">\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
35845
|
+
template: "<div class=\"row\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-baseline\">\n <h2 class=\"card-title p-0\">Users</h2>\n <a class=\"btn btn-sm btn-outline-primary\"\n id=\"btn-create\"\n *rbacAllow=\"'SuperAdmin'\"\n [routerLink]=\"[routers.usersDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n @if (!isLoaded) {\n <p-progress-spinner> </p-progress-spinner>\n }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"users\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template #caption>\n <div class=\"search-filter\">\n <div class=\"col-sm-4\">\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-role-product\"\n [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter users by role, product, or feature\"\n [selectionLimit]=\"1\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n @if (selectedOption) {\n <div class=\"col-4\"\n >\n <p-multiselect class=\"pw-filter-select\" inputId=\"users-list-filter-criteria\"\n [options]=\"searchDataSource\"\n (onChange)=\"onSearchCriteria($event)\"\n [showToggleAll]=\"true\"\n [(ngModel)]=\"criteria\"\n [showHeader]=\"true\"\n placeholder=\"Filter by {{ selectedOption.value }}s\"\n maxSelectedLabels=\"2\"\n appendTo=\"body\">\n </p-multiselect>\n </div>\n }\n <div class=\"col-auto d-flex align-items-center\">\n <span class=\"ambassadors-only-toggle\"\n [pTooltip]=\"'Admin.Users.AmbassadorsOnly' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <ui-switch\n [checked]=\"showAmbassadorsOnly\"\n (change)=\"showAmbassadorsOnly = $event; onAmbassadorsOnlyToggle()\"\n [attr.aria-label]=\"'Admin.Users.AmbassadorsOnly' | transloco\">\n </ui-switch>\n </span>\n </div>\n <div class=\"text-end\">\n <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"users-list-search\"\n name=\"users-list-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search users...\"\n data-cy=\"user-search\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"wd-90\"\n aria-label=\"Search users...\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template #header>\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"id\">\n {{ 'Admin.Users.Id' | transloco }}\n <p-sort-icon field=\"id\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.FirstName' | transloco }}\n <p-sort-icon field=\"first_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_name\">\n {{ 'Label.LastName' | transloco }}\n <p-sort-icon field=\"last_name\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Label.Email' | transloco }}\n <p-sort-icon field=\"email\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"slug\">\n {{ 'Admin.Users.Slug' | transloco }}\n <p-sort-icon field=\"slug\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"encrypted_password\">\n {{ 'Admin.Users.EmailConfirm' | transloco }}\n <p-sort-icon field=\"encrypted_password\"></p-sort-icon>\n </th>\n\n <th scope=\"true\"\n pSortableColumn=\"sessions_last_month\">\n {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n <p-sort-icon field=\"sessions_last_month\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"last_sign_in_at\">\n {{ 'Admin.Users.LastLogin' | transloco }}\n <p-sort-icon field=\"last_sign_in_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"signed_up_at\">\n {{ 'Admin.Users.RegisteredOn' | transloco }}\n <p-sort-icon field=\"signed_up_at\"></p-sort-icon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-four\">\n {{ 'Label.Actions' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template #body\n let-user>\n <tr>\n <td data-head=\"id\"> {{ user.id }}</td>\n <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n <td data-head=\"Last Name\">{{ user.last_name }}\n @if (user?.alpha) {\n <span\n [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n </span>\n }\n @if (user?.beta) {\n <span class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n </span>\n }\n @if (user?.cognito_sso_activated) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-cloud success\" ></i>\n </span>\n }\n @if (user?.ambassador_count > 0) {\n <span\n class=\"ms-2\"\n [pTooltip]=\"'Admin.Users.Tooltip.Ambassador' | transloco\"\n tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa fa-handshake alpha-beta text-primary\" aria-hidden=\"true\"></i>\n </span>\n }\n </td>\n <td data-head=\"Email\">{{ user.email }}</td>\n <td data-head=\"Slug\">{{ user.slug }}</td>\n <td data-head=\"Email Confirm\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: user?.has_password\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n @if (user?.blocked) {\n <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\" appendTo=\"body\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n </span>\n }\n </td>\n <td data-head=\"S/m #\">\n <span [ngClass]=\"{\n 'text-danger fw-bold': user?.sessions_last_month < 3\n }\">{{ user?.sessions_last_month }}</span>\n </td>\n <td data-head=\"Last Login\">\n @if (user?.current_sign_in_at | isOnline) {\n <pw-online-indicator [lastSeen]=\"user.current_sign_in_at\" />\n } @else if (user?.current_sign_in_at) {\n <span>\n {{ user.current_sign_in_at | dateFormat }}\n </span>\n } @else {\n {{ user.last_sign_in_at | dateFormat }}\n }\n </td>\n <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li pTooltip=\"Impersonate this user\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fas fa-people-arrows fa-lg\"\n (click)=\"onImpersonate(user)\"\n (keydown.enter)=\"onImpersonate(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n @if (user?.enable_two_factor_authenticator) {\n <li pTooltip=\"Disable 2FA\" tooltipPosition=\"top\" appendTo=\"body\"\n (click)=\"disable2fa(user?.id)\"\n (keydown.enter)=\"disable2fa(user?.id)\"\n *rbacAllow=\"'Pages.Alpha'\"\n class=\"me-2 me-sm-3\">\n <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n </li>\n }\n @if (currentUser && user.id !== currentUser.id) {\n <li pTooltip=\"Message\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"chatPermission\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/message']\"\n [fragment]=\"user.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n }\n <li pTooltip=\"Edit\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.usersDetails + user.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li pTooltip=\"Delete\" tooltipPosition=\"top\" appendTo=\"body\"\n *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(user)\"\n (keydown.space)=\"onDelete(user)\"\n (click)=\"onDelete(user)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n [destructive]=\"true\"\n (successEvent)=\"deleteUser($event)\">\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n",
|
|
35802
35846
|
styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: color-mix(in srgb, var(--first, rgb(23 105 225)) 85%, #000000);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255);--dashboard_bg: rgb(255 255 255);--public-btn-radius: 24px}.search-input input{width:100%}.w-150{width:150px}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.ambassadors-only-toggle{display:inline-flex;align-items:center}.ambassadors-only-toggle ::ng-deep .switch small{display:flex;align-items:center;justify-content:center}.ambassadors-only-toggle ::ng-deep .switch small:after{content:\"\\f2b5\";font-family:\"Font Awesome 6 Pro\",sans-serif;font-weight:900;font-size:12px;line-height:1;color:var(--first)}\n"]
|
|
35803
35847
|
}]
|
|
35804
35848
|
}],
|