{"version":3,"file":"po-ui-ng-templates.mjs","sources":["../../../projects/templates/src/lib/components/enums/po-page-components-size.enum.ts","../../../projects/templates/src/lib/utils/util.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/enums/po-modal-password-recovery-modal-content.enum.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/enums/po-modal-password-recovery-type.enum.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/literals/i18n/po-modal-password-recovery-literals.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery-base.component.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery.service.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery-error-message/po-modal-password-recovery-error-message.component.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery-error-message/po-modal-password-recovery-error-message.component.html","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery.component.ts","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery.component.html","../../../projects/templates/src/lib/components/po-modal-password-recovery/po-modal-password-recovery.module.ts","../../../projects/templates/src/lib/components/po-page-background/po-page-background.component.ts","../../../projects/templates/src/lib/components/po-page-background/po-page-background.component.html","../../../projects/templates/src/lib/components/po-page-background/po-page-background.module.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/enums/po-page-blocked-user-reason.enum.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user-base.component.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user-contacts/po-page-blocked-user-contacts.component.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user-contacts/po-page-blocked-user-contacts.component.html","../../../projects/templates/src/lib/components/po-page-blocked-user/literals/i18n/po-page-blocked-user-literals.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user-reason/po-page-blocked-user-reason.component.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user-reason/po-page-blocked-user-reason.component.html","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user.component.ts","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user.component.html","../../../projects/templates/src/lib/components/po-page-blocked-user/po-page-blocked-user.module.ts","../../../projects/templates/src/lib/components/po-page-change-password/literals/i18n/po-page-change-password-literals.ts","../../../projects/templates/src/lib/components/po-page-change-password/po-page-change-password-base.component.ts","../../../projects/templates/src/lib/components/po-page-change-password/po-page-change-password.service.ts","../../../projects/templates/src/lib/components/po-page-change-password/po-page-change-password.component.ts","../../../projects/templates/src/lib/components/po-page-change-password/po-page-change-password.component.html","../../../projects/templates/src/lib/components/po-page-change-password/po-page-change-password.module.ts","../../../projects/templates/src/lib/services/po-page-dynamic/po-page-dynamic.service.ts","../../../projects/templates/src/lib/services/po-page-customization/po-page-customization.service.ts","../../../projects/templates/src/lib/components/po-page-dynamic-detail/po-page-dynamic-detail-actions.service.ts","../../../projects/templates/src/lib/components/po-page-dynamic-detail/po-page-dynamic-detail.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-detail/po-page-dynamic-detail.component.html","../../../projects/templates/src/lib/services/po-page-dynamic/po-page-dynamic.module.ts","../../../projects/templates/src/lib/components/po-page-dynamic-detail/po-page-dynamic-detail.module.ts","../../../projects/templates/src/lib/components/po-page-dynamic-edit/po-page-dynamic-edit-actions.service.ts","../../../projects/templates/src/lib/components/po-page-dynamic-edit/po-page-dynamic-edit.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-edit/po-page-dynamic-edit.component.html","../../../projects/templates/src/lib/components/po-page-dynamic-edit/po-page-dynamic-edit.module.ts","../../../projects/templates/src/lib/services/po-page-customization/po-page-customization.module.ts","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-advanced-filter/po-advanced-filter-base.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-advanced-filter/po-advanced-filter.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-advanced-filter/po-advanced-filter.component.html","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search-base.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search.component.html","../../../projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search.module.ts","../../../projects/templates/src/lib/components/po-page-dynamic-table/po-page-dynamic-list-base.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-table/po-page-dynamic-table-actions.service.ts","../../../projects/templates/src/lib/components/po-page-dynamic-table/po-page-dynamic-table-literals.ts","../../../projects/templates/src/lib/components/po-page-dynamic-table/po-page-dynamic-table.component.ts","../../../projects/templates/src/lib/components/po-page-dynamic-table/po-page-dynamic-table.component.html","../../../projects/templates/src/lib/components/po-page-dynamic-table/po-page-dynamic-table.module.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-internal.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler.service.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-base.component.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-literals.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-lookup.service.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-parameters/po-job-scheduler-parameters-template/po-job-scheduler-parameters-template.directive.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-summary/po-job-scheduler-summary-template/po-job-scheduler-summary-template.directive.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-execution/po-page-job-scheduler-execution.component.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-execution/po-page-job-scheduler-execution.component.html","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-parameters/po-page-job-scheduler-parameters.component.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-parameters/po-page-job-scheduler-parameters.component.html","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-summary/po-page-job-scheduler-summary.component.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler-summary/po-page-job-scheduler-summary.component.html","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler.component.ts","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler.component.html","../../../projects/templates/src/lib/components/po-page-job-scheduler/po-page-job-scheduler.module.ts","../../../projects/templates/src/lib/components/po-page-login/enums/po-page-login-authentication-type.enum.ts","../../../projects/templates/src/lib/components/po-page-login/po-page-login.service.ts","../../../projects/templates/src/lib/components/po-page-login/po-page-login-base.component.ts","../../../projects/templates/src/lib/components/po-page-login/po-page-login-popover/po-page-login-popover.component.ts","../../../projects/templates/src/lib/components/po-page-login/po-page-login-popover/po-page-login-popover.component.html","../../../projects/templates/src/lib/components/po-page-login/po-page-login.component.ts","../../../projects/templates/src/lib/components/po-page-login/po-page-login.component.html","../../../projects/templates/src/lib/components/po-page-login/po-page-login.module.ts","../../../projects/templates/src/lib/components/components.module.ts","../../../projects/templates/src/lib/services/services.module.ts","../../../projects/templates/src/lib/po-templates.module.ts","../../../projects/templates/src/po-ui-ng-templates.ts"],"sourcesContent":["/**\n * @description\n *\n * Tamanhos da propriedade `p-components-size` para componentes de formulário no template. A medida `small` está\n * disponível apenas para acessibilidade AA.\n */\nexport enum PoPageComponentsSize {\n /** Aplica a medida `small` do componente. */\n Small = 'small',\n\n /** Aplica a medida `medium` do componente. */\n Medium = 'medium'\n}\n","import { poLocaleDefault, poLocales, PoThemeA11yEnum, PoThemeService } from '@po-ui/ng-components';\nimport { PoPageComponentsSize } from '../components/enums/po-page-components-size.enum';\n\n/**\n * Retorna o idioma atual do navegador\n */\nexport function getBrowserLanguage(): string {\n // navigator.userLanguage is the value for IE10\n return navigator.language || navigator['userLanguage'];\n}\n\n/**\n * Retorna o idioma do navegador, com somente as duas primeiras letras. Por exemplo: \"pt\" ou \"es\".\n *\n * Caso o valor retornado pelo navegador não estiver dentro dos idiomas suportados pelo PO,\n * será retornado a linguagem padrão (poLocaleDefault).\n */\nexport function getShortBrowserLanguage(): string {\n const language = (getBrowserLanguage() || poLocaleDefault).toLowerCase().substring(0, 2);\n\n if (!poLocales.includes(language)) {\n return poLocaleDefault;\n }\n\n return language;\n}\n\nexport function convertToBoolean(val: any): boolean {\n if (typeof val === 'string') {\n val = val.toLowerCase().trim();\n return val === 'true' || val === 'on' || val === '';\n }\n\n if (typeof val === 'number') {\n return val === 1;\n }\n\n return !!val;\n}\n\nexport function convertToInt(value: any, valueDefault?: any): number {\n const validNumber = parseInt(value, 10);\n const validDefaultValue = parseInt(valueDefault, 10);\n const defaultValue = validDefaultValue || validDefaultValue === 0 ? validDefaultValue : undefined;\n\n return validNumber || validNumber === 0 ? validNumber : defaultValue;\n}\n\nexport function isTypeof(object: any, type: any) {\n return typeof object === type;\n}\n\n/**\n *\n * @param fn Função que será executada dentro do contexto. Podendo ser o nome da função\n * ou a referência da mesma.\n *\n * @param context Contexto do qual a função será executada.\n */\nexport function callFunction(fn: any, context: any, param?): void {\n if (isTypeof(fn, 'function')) {\n fn.call(context, param);\n } else {\n context[fn](param);\n }\n}\n\nexport function convertIsoToDate(value: string, start: boolean, end: boolean) {\n if (value) {\n const day = parseInt(value.substring(8, 10), 10);\n const month = parseInt(value.substring(5, 7), 10);\n const year = parseInt(value.substring(0, 4), 10);\n if (start) {\n const date = new Date(year, month - 1, day, 0, 0, 0);\n\n setYearFrom0To100(date, year);\n\n return date;\n } else if (end) {\n const date = new Date(year, month - 1, day, 23, 59, 59);\n\n setYearFrom0To100(date, year);\n\n return date;\n } else {\n const milliseconds = Date.parse(value);\n const timezone = new Date().getTimezoneOffset() * 60000;\n return new Date(milliseconds + timezone);\n }\n }\n}\n\nexport function convertDateToISOExtended(date: Date, time?: string) {\n if (date) {\n const getMonth = date.getMonth() + 1;\n const day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();\n const month = getMonth < 10 ? '0' + getMonth : getMonth;\n const year = formatYear(date.getFullYear());\n\n const dateString = date.toString();\n\n if (time) {\n return year + '-' + month + '-' + day + time;\n } else {\n return (\n year +\n '-' +\n month +\n '-' +\n day +\n 'T' +\n dateString.substring(16, 24) +\n dateString.substring(28, 31) +\n ':' +\n dateString.substring(31, 33)\n );\n }\n } else {\n return null;\n }\n}\n\n/**\n * Transforma o ano em uma string no formato yyyy e caso o ano seja menor que 1000 preenche com zeros a esquerda.\n *\n * @param year Ano\n */\nexport function formatYear(year: number) {\n if (year >= 1000) {\n return year.toString();\n }\n\n if (year > 99 && year < 1000) {\n return `0${year}`;\n }\n\n if (year > 9 && year < 100) {\n return `00${year}`;\n }\n\n if (year >= 0 && year < 10) {\n return `000${year}`;\n }\n}\n\n/**\n * @deprecated use getDefaultSizeFn\n *\n * Retorna o tamanho padrão dos componentes conforme o nível de acessibilidade.\n */\nexport function getDefaultSize(poThemeService: PoThemeService): string {\n return poThemeService.getA11yDefaultSize() === 'small' ? PoPageComponentsSize.Small : PoPageComponentsSize.Medium;\n}\n\n/**\n * Retorna o tamanho padrão dos componentes conforme o nível de acessibilidade.\n */\nexport function getDefaultSizeFn(): string {\n return getA11yDefaultSize() === 'small' ? PoPageComponentsSize.Small : PoPageComponentsSize.Medium;\n}\n\nexport function isEquals(value, comparedValue) {\n return JSON.stringify(value) === JSON.stringify(comparedValue);\n}\n\n/**\n * Caso o ano original da data seja entre 0 e 100 atribui esse valor ao ano, pois o `new Date` do javascript transforma o ano para 190X.\n *\n * @param date Data\n * @param year Ano original\n */\nexport function setYearFrom0To100(date: Date, year: number) {\n if (year >= 0 && year < 100) {\n date.setFullYear(year);\n }\n}\n\nexport function sortOptionsByProperty(options: Array, property: string) {\n options.sort((optionA, optionB) => {\n optionA = optionA[property].toString().toLowerCase();\n optionB = optionB[property].toString().toLowerCase();\n\n if (optionA < optionB) {\n return -1;\n }\n if (optionA > optionB) {\n return 1;\n }\n return 0;\n });\n}\n\nexport function removeDuplicatedOptions(list: Array) {\n for (let i = 0; i < list.length; i++) {\n if (i === 0) {\n continue;\n }\n\n if (list.findIndex(op => op.value === list[i].value) !== i) {\n list.splice(i, 1);\n i--;\n }\n }\n}\n\nexport function removeUndefinedAndNullOptions(list: Array) {\n for (let i = 0; i < list.length; i++) {\n if (list[i].value === undefined || list[i].value === null) {\n list.splice(i, 1);\n i--;\n }\n }\n}\n\nexport function validValue(value: any) {\n return (value !== null && value !== undefined && value !== '') || value === false;\n}\n\nexport function isExternalLink(url): boolean {\n return url ? url.startsWith('http') : false;\n}\n\nexport function openExternalLink(url): void {\n window.open(url, '_blank');\n}\n\nexport function getFormattedLink(link: string): string {\n let formattedLink = '';\n // Retira todos os pontos no começo da URL.\n if (link) {\n formattedLink = link.replace(/^(\\.)+/g, '');\n }\n // Verifica se foi utilizado uma rota que não comece com barra.\n if (!formattedLink.startsWith('/')) {\n formattedLink = '/'.concat(formattedLink);\n }\n return formattedLink;\n}\n\n/**\n * Método responsável por ordenar dois valores.\n *\n * @param leftSide Primeiro valor a ser comparado.\n * @param rightSide Segundo valor a ser comparado.\n * @param ascending Determina se será em ordem ascendente ou descendente.\n */\nexport function sortValues(leftSide: string, rightSide: string, ascending: boolean = true): number {\n if (ascending) {\n if (leftSide < rightSide) {\n return -1;\n } else if (leftSide > rightSide) {\n return 1;\n }\n } else if (ascending === false) {\n if (leftSide < rightSide) {\n return 1;\n } else if (leftSide > rightSide) {\n return -1;\n }\n }\n return 0;\n}\n\nexport function validateDateRange(date: Date, dateStart: Date, dateEnd: Date) {\n if (dateStart && dateEnd) {\n return date >= dateStart && date <= dateEnd;\n } else if (dateStart && !dateEnd) {\n return date >= dateStart;\n } else if (!dateStart && dateEnd) {\n return date <= dateEnd;\n } else {\n return true;\n }\n}\n\nexport function capitalizeFirstLetter(text: string): string {\n return `${text.charAt(0).toUpperCase()}${text.slice(1)}`;\n}\n\n/**\n * Mapeia um novo array apenas com as propriedades definidas pelo desenvolvedor baseado em um array de\n * origem.\n *\n * Exemplo:\n *\n * ```\n * const people = [\n * { id: 1, name: 'Fulano', birthdate: '1980-11-01', genre: 'Male', city: 'São Paulo', dependents: 2 },\n * { id: 2, name: 'Beltrano', birthdate: '1997-01-21', genre: 'Female', city: 'Joinville', dependents: 0 },\n * { id: 3, name: 'Siclano', birthdate: '1995-07-15', genre: 'Male', city: 'Joinville', dependents: 0 }\n * ];\n *\n * const properties = ['id', 'name'];\n *\n * const idAndName = mapArrayByProperties(people, properties);\n *\n * console.log(idAndName); // [{ id: 1, name: 'Fulano' }, { id: 2, name: 'Beltrano' }, { id: 3, name: 'Siclano' }]\n * ```\n *\n * Um outro uso para o método é \"parear\" todos os objetos do array com as mesmas propriedades.\n *\n * ```\n * const customers = [\n * { id: 1, name: 'Fulano', city: 'São Paulo', dependents: 2 }, // sem genre\n * { id: 2, name: 'Beltrano', genre: 'Female', city: 'Joinville' }, // sem dependents\n * { id: 3, name: 'Siclano', genre: 'Male', city: 'Joinville', dependents: 0 }\n * ];\n * const properties = ['id', 'name', 'city', 'genre', 'dependents'];\n *\n * const pattern = mapArrayByProperties(customers, properties);\n * console.log(pattern);\n *\n * // [\n * // { id: 1, name: 'Fulano', city: 'São Paulo', genre: undefined, dependents: 2 },\n * // { id: 2, name: 'Beltrano', city: 'Joinville', genre: 'Female', dependents: undefined },\n * // { id: 3, name: 'Siclano', city: 'Joinville', genre: 'Male', dependents: 0 }\n * // ]\n * ```\n *\n * @param items {Array} Array de items original.\n * @param properties {Array} Array de string com a lista de propriedades que devem ser retornadas.\n *\n * @returns Array\n */\nexport function mapArrayByProperties(items: Array = [], properties: Array = []): Array {\n return items.map(item => mapObjectByProperties(item, properties));\n}\n\n/**\n * Mapeia um novo objeto apenas com as propriedades definidas pelo desenvolvedor.\n *\n * Exemplo:\n *\n * ```\n * const person = { id: 1, name: 'Fulano', birthdate: '1980-11-01', genre: 'Male', city: 'São Paulo', dependents: 2 };\n *\n * const properties = ['id', 'name'];\n *\n * const idAndName = mapObjectByProperties(person, properties);\n *\n * console.log(idAndName); // { id: 1, name: 'Fulano' }\n * ```\n *\n * @param object {Array} Array de items original.\n * @param properties {Array} Array de string com a lista de propriedades que devem ser retornadas.\n *\n * @returns Array\n */\nexport function mapObjectByProperties(object: any = {}, properties: Array = []) {\n const getSelectedProperties = (selectedProperties, property) => ({\n ...selectedProperties,\n [property]: object[property]\n });\n\n return properties.reduce(getSelectedProperties, {});\n}\n\n/**\n * Retorna os valores de um objeto dentro de um array.\n *\n * > Simula o Object.values(obj), o mesmo deve ser removido assim que a versão typescrit for atualizada.\n *\n * @param object Objeto de onde será pego os valores.\n */\nexport function valuesFromObject(object: any = {}): Array {\n return Object.keys(object).map(property => object[property]);\n}\n\n/**\n * adiciona 0 no tempo informado, caso menor q 10\n *\n * @param time\n */\nexport function addZero(time: number) {\n if (!time) {\n return '00';\n }\n\n if (time < 10) {\n return `0${time}`;\n }\n\n return time;\n}\n\n/**\n * Remove do objeto as propriedades especificadas.\n *\n * Exemplo:\n *\n * ```\n * key: ['id', 'cpf']\n * newItemValue: { id: '123', cpf: '456', name: 'Test' }\n * Resultado: { name: 'Test' }\n * ```\n *\n * @param keys lista de propriedades para ser removida do objeto.\n * @param newItemValue objeto que se deseja remover as propriedades.\n * @returns objeto sem as propriedades especificadas.\n */\nexport function removeKeysProperties(keys: Array, newItemValue: any) {\n keys.forEach(key => delete newItemValue[key]);\n return newItemValue;\n}\n\n/**\n * Remove objetos duplicados.\n *\n * Exemplo:\n *\n * ```\n * item: [{country: 'japao'}, {country: 'brasil'} , {country: 'china'}]\n * item2: [{country: 'chile'}, {country: 'brasil'}, {country: 'canada'}]\n * key: 'country'\n * Resultado:\n * item2 = [{country: 'chile'}, {country: 'canada'} ]\n * ```\n *\n * @param item lista comparada.\n * @param item2 lista para remover items duplicados.\n * @param key propriedade que será utilizada para realizar a comparação.\n */\nexport function removeDuplicateItems(item, item2, key) {\n const uniqueValues = new Set(item.map(entry => entry[key]));\n item2.splice(0, item2.length, ...item2.filter(entry => !uniqueValues.has(entry[key])));\n}\n\n/**\n * Recebe dois arrays de objetos e remove os itens duplicados utilizando uma propriedade(key) para comparação.\n *\n * Exemplo:\n *\n * ```\n * item: [{country: 'japao'}, {country: 'brasil'} , {country: 'china'}]\n * item2: [{country: 'chile'}, {country: 'brasil'}, {country: 'canada'}]\n * key: '[country]'\n * Resultado do retorno:\n * [{country: 'chile'}, {country: 'canada'}, {country: 'japao'}, {country: 'china'}]\n * ```\n *\n *\n * @param item : primeira lista de itens.\n * @param item2 : segunda lista de itens.\n * @param key : um array de propriedades que vão ser utilizadas para a comparação.\n */\nexport function removeDuplicateItemsWithArrayKey(item, item2, keys) {\n const newKey = keys.length ? keys : ['id'];\n\n const combinedArray = item.concat(item2);\n return combinedArray.filter(\n (obj, index) => index === combinedArray.findIndex(innerObj => newKey.every(key => innerObj[key] === obj[key]))\n );\n}\n\n/**\n * Recebe um array de objetos para ordenação utilizando chave como comparativo e\n * se a order é crescente(true) ou descrescente(false)\n *\n * Exemplo:\n *\n * ```\n * items: [{country: 'japao'}, {country: 'brasil'} , {country: 'china'}]\n * key: 'country'\n * isAscendingOrder: true\n * Resultado do retorno:\n * [{country: 'brasil'}, {country: 'china'} , {country: 'japao'}]\n * ```\n *\n *\n * @param items : lista de itens.\n * @param key : propriedade utilizada na comparação.\n * @param isAscendingOrder : ordenação crescente ou descrescente.\n */\nexport function sortArrayOfObjects(items, key, isAscendingOrder) {\n return items.sort((a, b) => {\n const valueA = a[key];\n const valueB = b[key];\n\n if (typeof valueA === 'number' && typeof valueB === 'number') {\n return isAscendingOrder ? valueA - valueB : valueB - valueA;\n } else {\n const compareResult = valueA.toString().localeCompare(valueB.toString());\n return isAscendingOrder ? compareResult : -compareResult;\n }\n });\n}\n\n/**\n * @deprecated use validateSizeFn\n *\n * Valida e retorna um tamanho permitido para os componentes, considerando a acessibilidade.\n */\nexport function validateSize(value: string, poThemeService: PoThemeService): string {\n if (value && Object.values(PoPageComponentsSize).includes(value as PoPageComponentsSize)) {\n if (value === PoPageComponentsSize.Small && poThemeService.getA11yLevel() !== 'AA') {\n return PoPageComponentsSize.Medium;\n }\n return value;\n }\n return getDefaultSize(poThemeService);\n}\n\n/**\n * Valida e retorna um tamanho permitido para os componentes, considerando a acessibilidade.\n */\nexport function validateSizeFn(value: string): string {\n if (value && Object.values(PoPageComponentsSize).includes(value as PoPageComponentsSize)) {\n if (value === PoPageComponentsSize.Small && getA11yLevel() !== 'AA') {\n return PoPageComponentsSize.Medium;\n }\n return value;\n }\n return getDefaultSizeFn();\n}\n\n/**\n * Retorna a preferência global de tamanho dos componentes.\n *\n * @returns `'small'` ou `'medium'`.\n */\nexport function getA11yDefaultSize(): string {\n const defaultSize =\n document.documentElement.getAttribute('data-default-size') || localStorage.getItem('po-default-size');\n const a11yLevel = document.documentElement.getAttribute('data-a11y');\n\n return defaultSize === 'small' && a11yLevel === 'AA' ? 'small' : 'medium';\n}\n\n/**\n * Retorna o nível de acessibilidade configurado no tema.\n * Se não estiver configurado, retorna `AAA` como padrão.\n * @returns {PoThemeA11yEnum} O nível de acessibilidade, que pode ser `AA` ou `AAA`.\n */\nexport function getA11yLevel(): PoThemeA11yEnum {\n const a11yLevel = document.documentElement.getAttribute('data-a11y');\n\n return a11yLevel === 'AA' ? PoThemeA11yEnum.AA : PoThemeA11yEnum.AAA;\n}\n\nexport const PoUtils = {\n convertDateToISOExtended,\n convertToBoolean,\n convertToInt,\n getShortBrowserLanguage,\n isExternalLink,\n mapArrayByProperties,\n mapObjectByProperties,\n openExternalLink,\n removeDuplicateItemsWithArrayKey,\n removeKeysProperties,\n sortArrayOfObjects,\n valuesFromObject\n};\n","/**\n * @docsPrivate\n *\n * @description\n *\n * Enum para definição do tipo de conteúdo exibido na modal.\n */\nexport enum PoModalPasswordRecoveryModalContent {\n /** Exibição de modal contendo campo para preenchimento de email ou número de telefone */\n Email = 'email',\n\n /** Exibição de modal contendo campo para inserção de código enviado por SMS */\n SMSCode = 'smsCode',\n\n /** Exibição de modal de confirmação de envio */\n Confirmation = 'confirmation'\n}\n","/**\n * @usedBy PoModalPasswordRecoveryComponent\n *\n * @description\n *\n * *Enum* para especificação do tipo de recuperação de senha.\n */\nexport enum PoModalPasswordRecoveryType {\n /** Possibilita ao usuário optar por envio via email ou SMS */\n All = 'all',\n\n /** Definição para recuperação apenas por email */\n Email = 'email',\n\n /** Definição para recuperação apenas por SMS */\n SMS = 'sms'\n}\n","export const poModalPasswordRecoveryLiterals = {\n en: {\n cancelButton: 'Cancel',\n closeButton: 'Close',\n continueButton: 'Continue',\n email: 'e-mail',\n emailErrorMessagePhrase: 'Invalid e-mail format',\n emailSentConfirmationPhrase: `We have sent the instructions and new password creation link to your e-mail.\n If you did not receive it after a few minutes, check your spam box or click Resend.`,\n emailSentTitle: 'E-mail sent',\n forgotPasswordTitle: 'Forgot your password?',\n insertCode: 'Type the code',\n insertEmail: 'Enter your e-mail',\n insertPhone: 'Enter your mobile number',\n phoneErrorMessagePhrase: 'Invalid phone number',\n prepositionIn: 'in',\n prepositionOr: 'or',\n recoveryPasswordPhrase: 'To recover your password we will send you a {0} with instructions.',\n resendEmailButton: 'Resend',\n resendSmsCodePhrase: 'If the code does not arrive within a few minutes, please send it again.',\n sendAgainPhrase: 'If the code does not arrive within a few minutes',\n sendAgain: 'send again.',\n sendButton: 'Submit',\n sentSmsCodePhrase: 'We sent a code for your mobile phone.',\n sms: 'SMS',\n smsCodeErrorMessagePhrase: 'Invalid code. Please re-enter or contact support',\n supportContact: 'If you do not have access to {0} contact support',\n telephone: 'telephone',\n typeCodeTitle: 'Enter sent code'\n },\n es: {\n cancelButton: 'Cancelar',\n closeButton: 'Cerrar',\n continueButton: 'Continuar',\n email: 'e-mail',\n emailErrorMessagePhrase: 'Formato de correo electrónico no válido',\n emailSentConfirmationPhrase: `Enviamos las instrucciones y enlace de creación de nueva contraseña para su correo electrónico.\n Si no ha recibido después de unos minutos, compruebe su caja de spam o haga clic en Reenviar`,\n emailSentTitle: 'E-mail enviado',\n forgotPasswordTitle: 'Olvidaste tu contraseña?',\n insertCode: 'Introduzca el código',\n insertEmail: 'Introduce tu e-mail',\n insertPhone: 'Introduce tu número de celular',\n phoneErrorMessagePhrase: 'Número de teléfono no válido',\n prepositionIn: 'en',\n prepositionOr: 'u',\n recoveryPasswordPhrase: 'Para recuperar su contraseña vamos a enviar un {0} con instrucciones.',\n resendEmailButton: 'Reenviar',\n resendSmsCodePhrase: 'Si el código no llega dentro de unos minutos, vuelva a enviar.',\n sendAgain: 'envíe de nuevo.',\n sendAgainPhrase: 'Si el código no llega dentro de unos minutos',\n sendButton: 'Enviar',\n sentSmsCodePhrase: 'Enviamos un código para su celular.',\n sms: 'SMS',\n smsCodeErrorMessagePhrase: 'Código no válido. Escriba de nuevo o póngase en contacto con el soporte',\n supportContact: 'Si no tiene acceso a {0} póngase en contacto con el soporte',\n telephone: 'teléfono',\n typeCodeTitle: 'Escribir código enviado'\n },\n pt: {\n cancelButton: 'Cancelar',\n closeButton: 'Fechar',\n continueButton: 'Continuar',\n email: 'e-mail',\n emailErrorMessagePhrase: 'Formato de e-mail inválido',\n emailSentConfirmationPhrase: `Enviamos as instruções e link de criação de nova senha para o seu e-mail.\n Caso não tenha recebido após alguns minutos, verifique sua caixa de spam ou clique em Reenviar.`,\n emailSentTitle: 'E-mail enviado',\n forgotPasswordTitle: 'Esqueceu sua senha?',\n insertCode: 'Digite o código',\n insertEmail: 'Insira seu e-mail',\n insertPhone: 'Insira seu número de celular',\n phoneErrorMessagePhrase: 'Número de telefone inválido',\n prepositionIn: 'em',\n prepositionOr: 'ou',\n recoveryPasswordPhrase: 'Para recuperar sua senha vamos enviar um {0} com instruções.',\n resendEmailButton: 'Reenviar',\n resendSmsCodePhrase: 'Se o código não chegar dentro de alguns minutos envie novamente',\n sendAgain: 'envie novamente.',\n sendAgainPhrase: 'Se o código não chegar dentro de alguns minutos',\n sendButton: 'Enviar',\n sentSmsCodePhrase: 'Enviamos um código para seu celular cadastrado.',\n sms: 'SMS',\n smsCodeErrorMessagePhrase: 'Código inválido. Digite novamente ou contacte o suporte',\n supportContact: 'Se não tiver acesso ao {0} contacte o suporte',\n telephone: 'telefone',\n typeCodeTitle: 'Digitar código enviado'\n },\n ru: {\n cancelButton: 'отменить',\n closeButton: 'близко',\n continueButton: 'близко',\n email: 'по электронной почте',\n emailErrorMessagePhrase: 'Неверный формат электронной почты',\n emailSentConfirmationPhrase: `Мы отправили инструкции и новую ссылку для создания пароля для вашей электронной почты.\nЕсли вы не получили его в течение нескольких минут, установите флажок Спам или нажмите Далее.`,\n emailSentTitle: 'Письмо отправлено',\n forgotPasswordTitle: 'Забыли пароль?',\n insertCode: 'Введите код',\n insertEmail: 'Введите адрес электронной почты',\n insertPhone: 'Введите номер вашего мобильного телефона',\n phoneErrorMessagePhrase: 'Неверный номер телефона',\n prepositionIn: 'в',\n prepositionOr: 'или',\n recoveryPasswordPhrase: 'Для восстановления вашего пароля мы вышлем {0} с инструкциями.',\n resendEmailButton: 'Отправить еще раз',\n resendSmsCodePhrase: 'Если код не приходит через несколько минут, попробуйте еще раз.',\n sendAgain: 'отправить снова.',\n sendAgainPhrase: 'Если код не приходит через несколько минут',\n sendButton: 'послать',\n sentSmsCodePhrase: 'Мы отправляем код на ваш зарегистрированный мобильный телефон.',\n sms: 'SMS',\n smsCodeErrorMessagePhrase: 'Неверный код. Повторите или обратитесь в службу поддержки',\n supportContact: 'Если у вас нет доступа к {0}, обратитесь в службу поддержки',\n telephone: 'телефон',\n typeCodeTitle: 'Введите отправленный код'\n }\n};\n","import { Directive, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core';\n\nimport { PoLanguageService, poLocaleDefault } from '@po-ui/ng-components';\n\nimport { getDefaultSizeFn, validateSizeFn } from '../../utils/util';\nimport { PoModalPasswordRecoveryType } from './enums/po-modal-password-recovery-type.enum';\nimport { poModalPasswordRecoveryLiterals } from './literals/i18n/po-modal-password-recovery-literals';\n\nconst PoModalPasswordRecoveryDefaultMaxLength = 15;\nconst PoModalPasswordRecoveryDefaultMinLength = 15;\nconst PoModalPasswordRecoveryDefaultPhone = '(99) 99999-9999';\nconst PoModalPasswordRecoveryTypeDefault: PoModalPasswordRecoveryType = PoModalPasswordRecoveryType.Email;\n\n/**\n * @description\n *\n * O componente `po-modal-password-recovery` é utilizado como template para solicitação de troca de senha.\n *\n * É composto por uma modal que possui três telas, cada uma com as seguintes características:\n *\n * - A primeira possui campos para preenchimento de email ou número de telefone;\n * - Tela com campo para preenchimento de código SMS enviado para o número de telefone enviado;\n * - A terceira se trata de uma confirmação de envio de link para a caixa de email do usuário.\n *\n *\n * A propriedade `p-url-recovery` automatiza a rotina do componente e simplifica o processo\n * para recuperação de senha, bastando definir uma url para requisição dos recursos.\n * Seu detalhamento para uso pode ser visto logo abaixo em *propriedades*.\n * Caso julgue necessário, pode-se também definir manualmente a rotina do componente.\n *\n *\n * Para a modal de digitação de código SMS, é possível definir uma mensagem de erro\n * customizada com a propriedade `p-code-error` e há um link para\n * reenvio de código por SMS. Ao reenviar, o evento `p-code-submit` envia um objeto com o telefone do usuário e a quantidade\n * de vezes em que o usuário fez a solicitação de reenvio.\n *\n * > É indicada a utilização da tela de digitação para envio de código SMS apenas\n * se a opção por envio SMS for disponibilizada para o usuário.\n *\n *\n * A modal de confirmação contém uma ação de reenvio e o evento `p-submit`\n * é quem passa o objeto contendo o email em conjunto com a quantidade de tentativas de reenvio.\n *\n * > A tela de confirmação é indicada para quando o usuário solicitar a troca através do email.\n *\n * > Os textos das modals são pré-definidos, imutáveis e são traduzidos de acordo com o idioma do *browser* (pt, en e es)\n *\n * Para que as imagens sejam exibidas corretamente, é necessário incluir o caminho delas ao projeto. Para isso, edite\n * o *assets* no arquivo **angular.json** da aplicação na seguinte ordem:\n * ```\n * \"assets\": [\n * \"src/assets\",\n * \"src/favicon.ico\",\n * {\n * \"glob\": \"**\\/*\",\n * \"input\": \"node_modules/@po-ui/style/images\",\n * \"output\": \"assets/images\"\n * }\n * ]\n * ```\n */\n@Directive()\nexport abstract class PoModalPasswordRecoveryBaseComponent {\n /**\n * @optional\n *\n * @description\n *\n * Definição de mensagem de erro customizada para quando o usuário passar um código SMS inválido ou errado.\n */\n @Input('p-code-error') codeError: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Endpoint usado pelo template para requisição do recurso. Quando preenchido,\n * o métodos `p-submit` e `p-submit-code` serão ignorados e o componente adquirirá automatização\n * para o processo de solicitação de troca de senha.\n *\n * ### Processos\n * Ao digitar um valor válido no campo de email/telefone e pressionar **enviar**,\n * o componente fará uma requisição `POST` na url especificada nesta propriedade passando o objeto contendo o valor definido pelo usuário.\n *\n * ```\n * body {\n * email: email,\n * retry?: retry\n * }\n * ```\n *\n *\n * #### Recuperação por email\n * Para a recuperação de senha por **email**, o código de resposta HTTP de status esperado é `204`.\n *\n * Em caso de **sucesso**, será exibida a modal de confirmação de e-mail para o usuário.\n *\n *\n * > A ação **Reenviar** na tela de confirmação efetua uma nova requisição\n * passando-se o objeto com incremento para o valor da propriedade **retry**.\n *\n * *Processo finalizado.*\n *\n *\n * #### Recuperação por SMS\n * Se a opção de recuperação for por **SMS**, o código de status de sucesso deve ser `200`.\n * Em caso de **sucesso**, abre-se a modal de digitação de código SMS e a resposta\n * desta requisição deve retornar uma definição de dados abaixo:\n *\n * ```\n * 200:\n * {\n * hash: hash,\n * urlValidationCode?: url\n * }\n * ```\n *\n *\n * - O **hash** será o código de validação da solicitação do SMS para ser enviado juntamente com o código de verificação do SMS;\n * - **urlValidationCode** é a url usada para validação do código enviado por SMS.\n *\n *\n * > Caso não seja passado urlValidationCode, o endpoint usado para validação do código será `/validation`.\n *\n *\n * #### Validação do código SMS\n * Ao digitar um valor válido no campo de código SMS e pressionar **continuar**, o componente fará uma requisição `POST` contendo:\n *\n * ```\n * POST //validation OU /\n * Body {\n * hash: hash,\n * code: code\n * }\n * ```\n *\n *\n * O código de resposta HTTP de status esperado é `200`.\n *\n * Em caso de **erro** na validação do código SMS, a modal se mantém com o campo para digitação\n * de código SMS\n *\n *\n * > Pode-se atribuir a mensagem de erro (message) para o atributo `p-code-error` conforme retorno abaixo:\n *\n * ```\n * 400\n * {\n * error {\n * message: 'Error Message'\n * }\n * }\n * ```\n *\n *\n * Em caso de **sucesso**, espera-se a resposta desta requisição retornando a seguinte definição:\n *\n * ```\n * 200:\n * {\n * token: token,\n * urlChangePassword?: url\n * }\n * ```\n *\n *\n * - **token**: Token de alteração de senha;\n * - **urlChangePassword**: url para o formulário de alteração de senha.\n *\n *\n * O componente está configurado para redirecionar para a url estabelecida em `urlChangePassword`.\n *\n * > Caso não seja passado valor para urlChangePassword,\n * a url usada para validação será a `/changePassword?token=`.\n *\n * *Processo finalizado.*\n */\n @Input('p-url-recovery') urlRecovery?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Ação contendo como parâmetro o código enviado por SMS e digitado pelo usuário.\n *\n * > Esta propriedade será ignorada se for definido valor para a propriedade `p-url-recovery`.\n */\n @Output('p-code-submit') codeSubmit = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Ação contendo o email como parâmetro e que é executada quando o usuário clica sobres os botões de 'enviar' e 'reenviar' e-mail.\n *\n * > Esta propriedade será ignorada se for definido valor para a propriedade `p-url-recovery`.\n */\n @Output('p-submit') submit = new EventEmitter();\n\n email: string;\n maxLength = PoModalPasswordRecoveryDefaultMaxLength;\n minLength = PoModalPasswordRecoveryDefaultMinLength;\n modalPasswordRecoveryTypeAll: boolean;\n phone: string;\n smsCode: string;\n smsCodeErrorMessage: string;\n\n literals: {\n cancelButton: string;\n closeButton: string;\n continueButton: string;\n email: string;\n emailErrorMessagePhrase: string;\n emailSentConfirmationPhrase: string;\n emailSentTitle: string;\n forgotPasswordTitle: string;\n insertCode: string;\n insertEmail: string;\n insertPhone: string;\n phoneErrorMessagePhrase: string;\n prepositionIn: string;\n prepositionOr: string;\n recoveryPasswordPhrase: string;\n resendEmailButton: string;\n resendSmsCodePhrase: string;\n sendAgain: string;\n sendAgainPhrase: string;\n sendButton: string;\n sms: string;\n smsCode: string;\n smsCodeErrorMessagePhrase: string;\n sentSmsCodePhrase: string;\n supportContact: string;\n telephone: string;\n typeCodeTitle: string;\n } = poModalPasswordRecoveryLiterals[poLocaleDefault];\n\n private _componentsSize?: string;\n private _initialComponentsSize?: string;\n private _contactEmail: string;\n private _phoneMask = PoModalPasswordRecoveryDefaultPhone;\n private _type: PoModalPasswordRecoveryType = PoModalPasswordRecoveryTypeDefault;\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no modal:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Definição do e-mail que é exibido na mensagem para contato de suporte.\n */\n @Input('p-contact-email') set contactEmail(value: string) {\n this._contactEmail = value;\n\n this.smsCodeErrorMessage = this.concatenateSMSErrorMessage(value);\n }\n\n get contactEmail() {\n return this._contactEmail;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Definição da mascara do campo de telefone.\n *\n * @default `(99) 99999-9999`\n */\n @Input('p-phone-mask') set phoneMask(value: string) {\n this._phoneMask = value || PoModalPasswordRecoveryDefaultPhone;\n this.minLength = this.maxLength = this._phoneMask.length;\n }\n\n get phoneMask() {\n return this._phoneMask;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tipo de recuperação de senha que será exibido.\n *\n * @default `PoModalPasswordRecoveryType.Email`\n *\n */\n @Input('p-type') set type(value: PoModalPasswordRecoveryType) {\n this._type = (Object).values(PoModalPasswordRecoveryType).includes(value)\n ? value\n : PoModalPasswordRecoveryTypeDefault;\n }\n\n get type() {\n return this._type;\n }\n\n constructor(languageService: PoLanguageService) {\n this.literals = {\n ...this.literals,\n ...poModalPasswordRecoveryLiterals[languageService.getShortLanguage()]\n };\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n private concatenateSMSErrorMessage(value: string) {\n const literalCodeErrorMessage = this.literals.smsCodeErrorMessagePhrase;\n\n return value && value !== ''\n ? `${literalCodeErrorMessage} ${this.literals.prepositionIn} ${value}.`\n : literalCodeErrorMessage;\n }\n\n /**\n * Acão para conclusão de processo e fechamento da modal. Indica-se sua utilização\n * para após o envio e validação do código SMS enviado pelo usuário.\n *\n * > Nas modals em que há a ação de 'cancelar' dispensa-se o uso desta ação pois o componente já trata o fechamento da modal.\n */\n abstract completed(): void;\n\n /**\n * Abre a modal de preenchimento de email ou número de telefone para solicitação de troca de senha.\n */\n abstract open(): void;\n\n /**\n * Abre a modal de confirmação de envio de email.\n */\n abstract openConfirmation(): void;\n\n /**\n * Abre a modal de preenchimento do código SMS enviado ao usuário.\n */\n abstract openSmsCode(): void;\n}\n","import { HttpClient, HttpParams, HttpResponse } from '@angular/common/http';\nimport { Injectable, inject } from '@angular/core';\nimport { Observable } from 'rxjs';\n\nimport { PoModalPasswordRecovery } from './interfaces/po-modal-password-recovery.interface';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoModalPasswordRecoveryService {\n private readonly http = inject(HttpClient);\n\n post(\n urlRecovery: string,\n item: PoModalPasswordRecovery,\n params?: HttpParams | { [param: string]: string | Array }\n ): Observable> {\n return this.http.post(urlRecovery, item, { observe: 'response', params: params });\n }\n}\n","import { Component, Input } from '@angular/core';\n\n/**\n * @docsPrivate\n *\n * @description\n *\n * Componente utilizado para exibição da mensagem customizada de erro em um campo de formulário.\n */\n@Component({\n selector: 'po-modal-password-recovery-error-message',\n templateUrl: './po-modal-password-recovery-error-message.component.html',\n standalone: false\n})\nexport class PoModalPasswordRecoveryErrorMessageComponent {\n /** Texto exibido na mensagem de erro. */\n @Input('p-text') text: string;\n}\n","
\n \n {{ text }}\n
\n","import { Component, OnDestroy, ViewChild, inject } from '@angular/core';\nimport { AbstractControl, NgForm } from '@angular/forms';\nimport { Router } from '@angular/router';\nimport { Subscription } from 'rxjs';\n\nimport {\n PoI18nPipe,\n PoLanguageService,\n PoModalAction,\n PoModalComponent,\n PoRadioGroupOption\n} from '@po-ui/ng-components';\n\nimport { PoUtils } from '../../utils/util';\n\nimport { PoModalPasswordRecoveryModalContent } from './enums/po-modal-password-recovery-modal-content.enum';\nimport { PoModalPasswordRecoveryType } from './enums/po-modal-password-recovery-type.enum';\nimport { PoModalPasswordRecovery } from './interfaces/po-modal-password-recovery.interface';\nimport { PoModalPasswordRecoveryBaseComponent } from './po-modal-password-recovery-base.component';\nimport { PoModalPasswordRecoveryService } from './po-modal-password-recovery.service';\n\n/**\n * @docsExtends PoModalPasswordRecoveryBaseComponent\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n */\n\n@Component({\n selector: 'po-modal-password-recovery',\n templateUrl: './po-modal-password-recovery.component.html',\n standalone: false\n})\nexport class PoModalPasswordRecoveryComponent extends PoModalPasswordRecoveryBaseComponent implements OnDestroy {\n private readonly router = inject(Router);\n private readonly poI18nPipe = inject(PoI18nPipe);\n private readonly poModalPasswordRecoveryService = inject(PoModalPasswordRecoveryService);\n\n @ViewChild('emailForm') emailForm: NgForm;\n\n @ViewChild('recoveryModal', { static: true }) recoveryModalElement: PoModalComponent;\n\n @ViewChild('smsCodeForm') smsCodeForm: NgForm;\n\n chosenTypeFormOption: string = PoModalPasswordRecoveryType.Email;\n codeMask: string = '9 9 9 9 9 9';\n control: AbstractControl;\n emailModal: boolean = true;\n emailModalPhrases = { firstPhrase: null as string, secondPhrase: null as string };\n endpoint: string = '.';\n invalidCode: boolean = false;\n invalidEmail: boolean = false;\n modalTitle: string;\n modalType: PoModalPasswordRecoveryModalContent = PoModalPasswordRecoveryModalContent.Email;\n showCustomCodeError: boolean;\n smsCodeErrorMessagePhrase: string;\n submittedCodeValue = {} as PoModalPasswordRecovery;\n submittedContactValue = {} as PoModalPasswordRecovery;\n\n primaryAction: PoModalAction = { label: undefined, action: () => {} };\n\n secondaryAction: PoModalAction = { label: undefined, action: () => {} };\n\n typeFormOptions: Array = [\n { label: 'e-mail', value: PoModalPasswordRecoveryType.Email },\n { label: 'SMS', value: PoModalPasswordRecoveryType.SMS }\n ];\n\n private passwordRecoverySubscription: Subscription;\n private smsBodyResponse;\n private smsCodeSubscription: Subscription;\n\n constructor() {\n const poLanguageService = inject(PoLanguageService);\n\n super(poLanguageService);\n }\n\n ngOnDestroy() {\n if (this.passwordRecoverySubscription) {\n this.passwordRecoverySubscription.unsubscribe();\n }\n\n if (this.smsCodeSubscription) {\n this.smsCodeSubscription.unsubscribe();\n }\n }\n\n completed() {\n this.cancelAction();\n }\n\n formModelChangesCheck(form: NgForm) {\n const invalidForm = form.invalid;\n this.invalidEmail = invalidForm && form.dirty;\n this.primaryAction.disabled = invalidForm;\n\n if (this.modalType === PoModalPasswordRecoveryModalContent.SMSCode) {\n const codeError: boolean = this.codeError !== undefined && this.codeError !== '';\n this.showCustomCodeError = codeError && form.pristine;\n }\n }\n\n getInputType(type) {\n this.type = type;\n this.pipeModalPhrases();\n setTimeout(() => {\n this.control = this.emailForm.controls[type];\n this.formModelChangesCheck(this.emailForm);\n this.resetFormFields(this.control);\n });\n }\n\n open() {\n const control = this.checkFormType(this.type);\n this.control = this.emailForm.controls[control];\n this.setEmailModalPhrasesAndActions();\n this.formModelChangesCheck(this.emailForm);\n this.recoveryModalElement.open();\n }\n\n openConfirmation() {\n this.modalTitle = this.literals.emailSentTitle;\n this.modalType = PoModalPasswordRecoveryModalContent.Confirmation;\n this.setActions(\n this.cancelAction,\n this.literals.closeButton,\n this.submitAction,\n this.literals.resendEmailButton,\n this.componentsSize,\n false\n );\n }\n\n openSmsCode() {\n this.modalTitle = this.literals.typeCodeTitle;\n this.modalType = PoModalPasswordRecoveryModalContent.SMSCode;\n this.setActions(\n this.submitSmsCodeAction,\n this.literals.continueButton,\n this.cancelAction,\n this.literals.cancelButton,\n this.componentsSize,\n true\n );\n\n setTimeout(() => {\n this.control = this.smsCodeForm.controls['sms'];\n this.formModelChangesCheck(this.smsCodeForm);\n });\n }\n\n resendSmsCode() {\n this.incrementRetryAttempts();\n if (this.urlRecovery) {\n this.submitActionRequest(this.submittedContactValue, this.type);\n } else {\n this.submit.emit(this.submittedContactValue);\n }\n }\n\n private assignSmsResponse(responseObj) {\n this.smsBodyResponse = Object.assign({}, { hash: responseObj.hash });\n if (responseObj.urlValidationCode) {\n this.smsBodyResponse = Object.assign(this.smsBodyResponse, { urlValidationCode: responseObj.urlValidationCode });\n }\n }\n\n private cancelAction() {\n this.resetFormFields(this.control);\n this.submittedContactValue = {};\n\n this.chosenTypeFormOption = PoModalPasswordRecoveryType.Email;\n this.modalType = PoModalPasswordRecoveryModalContent.Email;\n this.type = this.modalPasswordRecoveryTypeAll ? PoModalPasswordRecoveryType.All : this.type;\n this.recoveryModalElement.close();\n }\n\n private checkFormType(type: PoModalPasswordRecoveryType) {\n return type !== PoModalPasswordRecoveryType.All ? type : PoModalPasswordRecoveryType.Email;\n }\n\n private formReset(control: AbstractControl) {\n control.markAsPristine();\n control.markAsUntouched();\n control.updateValueAndValidity();\n }\n\n private getEmitValue(type: PoModalPasswordRecoveryType) {\n return type === PoModalPasswordRecoveryType.SMS ? this.phone : this.email;\n }\n\n private incrementRetryAttempts() {\n this.submittedContactValue.retry = this.submittedContactValue.retry + 1 || 1;\n }\n\n private openExternalLink(url, queryParam) {\n window.open(`${url}?token=${queryParam}`, '_self');\n }\n\n private openInternalLink(url, endpoint, queryParam) {\n this.router.navigate([`${url}/${endpoint}`], { queryParams: { token: queryParam } });\n }\n\n private pipeModalPhrases() {\n if (this.type === PoModalPasswordRecoveryType.SMS) {\n this.emailModalPhrases.firstPhrase = this.setPipeArguments(\n this.literals.recoveryPasswordPhrase,\n this.literals.sms\n );\n this.emailModalPhrases.secondPhrase = this.setPipeArguments(\n this.literals.supportContact,\n this.literals.telephone\n );\n } else {\n this.emailModalPhrases.firstPhrase = this.setPipeArguments(\n this.literals.recoveryPasswordPhrase,\n this.literals.email\n );\n this.emailModalPhrases.secondPhrase = this.setPipeArguments(this.literals.supportContact, this.literals.email);\n }\n }\n\n private redirectToChangePassword(recoveryToken: PoModalPasswordRecovery) {\n const urlChangePassword = recoveryToken.urlChangePassword;\n if (urlChangePassword) {\n PoUtils.isExternalLink(urlChangePassword)\n ? this.openExternalLink(urlChangePassword, recoveryToken.token)\n : this.openInternalLink(this.urlRecovery, urlChangePassword, recoveryToken.token);\n } else {\n const changePasswordEndpoint = 'changePassword';\n this.openInternalLink(this.urlRecovery, changePasswordEndpoint, recoveryToken.token);\n }\n }\n\n private resetFormFields(control) {\n this.formReset(control);\n this.email = undefined;\n this.phone = undefined;\n this.smsCode = undefined;\n }\n\n private setActions(primaryAction, primarylabel, secondaryAction, secondaryLabel, componentsSize, disabled) {\n this.primaryAction.action = () => primaryAction.call(this);\n this.primaryAction.label = primarylabel;\n this.secondaryAction.action = () => secondaryAction.call(this);\n this.secondaryAction.label = secondaryLabel;\n this.componentsSize = componentsSize;\n this.primaryAction.disabled = disabled;\n }\n\n private setEmailModalPhrasesAndActions() {\n this.modalTitle = this.literals.forgotPasswordTitle;\n this.pipeModalPhrases();\n this.modalPasswordRecoveryTypeAll = this.type === PoModalPasswordRecoveryType.All;\n this.setActions(\n this.submitAction,\n this.literals.sendButton,\n this.cancelAction,\n this.literals.cancelButton,\n this.componentsSize,\n true\n );\n }\n\n private setRequestEndpoint(urlValidationCode?: string) {\n const endpoint = urlValidationCode || 'validation';\n\n return `${this.urlRecovery}/${endpoint}`;\n }\n\n private setPipeArguments(literalAttr: string, arg: string) {\n return this.poI18nPipe.transform(literalAttr, arg);\n }\n\n private submitAction() {\n this.modalType === PoModalPasswordRecoveryModalContent.Confirmation\n ? this.incrementRetryAttempts()\n : this.formReset(this.control);\n this.submittedContactValue[this.checkFormType(this.type)] = this.getEmitValue(this.type);\n if (this.urlRecovery) {\n this.submitActionRequest(this.submittedContactValue, this.type);\n } else {\n this.submit.emit(this.submittedContactValue);\n }\n }\n\n private submitActionRequest(data: PoModalPasswordRecovery, modalType: PoModalPasswordRecoveryType) {\n const params = modalType === PoModalPasswordRecoveryType.SMS ? { type: 'sms' } : undefined;\n\n this.passwordRecoverySubscription = this.poModalPasswordRecoveryService\n .post(this.urlRecovery, data, params)\n .subscribe(response => {\n if (\n (modalType === PoModalPasswordRecoveryType.Email || modalType === PoModalPasswordRecoveryType.All) &&\n response.status === 204\n ) {\n this.openConfirmation();\n } else if (modalType === PoModalPasswordRecoveryType.SMS && response.status === 200) {\n this.assignSmsResponse(response.body);\n this.openSmsCode();\n }\n });\n }\n\n private submitSmsCodeAction() {\n this.submittedCodeValue.code = this.smsCode;\n\n if (this.urlRecovery) {\n this.submittedCodeValue = Object.assign(this.submittedCodeValue, { hash: this.smsBodyResponse.hash });\n this.submitSmsCodeRequest(this.submittedCodeValue);\n } else {\n this.codeSubmit.emit(this.submittedCodeValue);\n }\n this.resetFormFields(this.control);\n }\n\n private submitSmsCodeRequest(data: PoModalPasswordRecovery) {\n this.smsCodeSubscription = this.poModalPasswordRecoveryService\n .post(this.setRequestEndpoint(this.smsBodyResponse.urlValidationCode), data)\n .subscribe(\n response => {\n const successStatus = response.status === 200;\n if (successStatus) {\n this.completed();\n this.redirectToChangePassword(response.body);\n }\n },\n error => {\n this.codeError = error.error.message;\n this.openSmsCode();\n }\n );\n }\n}\n","\n
\n
\n
\n {{ emailModalPhrases.firstPhrase }}\n
\n
\n
\n
\n \n \n
\n\n
\n \n \n\n \n \n
\n\n
\n \n \n
\n
\n
\n
\n {{ emailModalPhrases.secondPhrase }}\n \n {{ literals.prepositionIn }}\n \n {{ contactEmail }}\n \n \n {{ endpoint }}\n
\n
\n\n
\n
{{ literals.sentSmsCodePhrase }}
\n
\n
\n \n \n
\n \n \n \n \n
\n \n
\n
\n {{ literals.sendAgainPhrase }}\n {{ literals.sendAgain }}\n
\n
\n\n
\n \n
\n {{ literals.emailSentConfirmationPhrase }}\n
\n
\n
\n\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule } from '@angular/core';\n\nimport { PoFieldModule, PoI18nPipe, PoModalModule, PoIconModule } from '@po-ui/ng-components';\n\nimport { PoModalPasswordRecoveryComponent } from './po-modal-password-recovery.component';\nimport { PoModalPasswordRecoveryErrorMessageComponent } from './po-modal-password-recovery-error-message/po-modal-password-recovery-error-message.component';\nimport { PoModalPasswordRecoveryService } from './po-modal-password-recovery.service';\n\n/**\n * @description\n *\n * Módulo do template do po-modal-password-recovery.\n */\n@NgModule({\n imports: [CommonModule, FormsModule, PoFieldModule, PoModalModule, PoIconModule],\n declarations: [PoModalPasswordRecoveryComponent, PoModalPasswordRecoveryErrorMessageComponent],\n exports: [PoModalPasswordRecoveryComponent, PoModalPasswordRecoveryErrorMessageComponent],\n providers: [PoI18nPipe, PoModalPasswordRecoveryService]\n})\nexport class PoModalPasswordRecoveryModule {}\n","import { Component, EventEmitter, HostBinding, HostListener, Input, OnInit, Output, inject } from '@angular/core';\n\nimport { PoLanguage, poLanguageDefault, PoLanguageService, PoSelectOption } from '@po-ui/ng-components';\n\nimport { convertToBoolean, getDefaultSizeFn, validateSizeFn } from './../../utils/util';\n\n@Component({\n selector: 'po-page-background',\n templateUrl: './po-page-background.component.html',\n standalone: false\n})\n\n/**\n * @docsPrivate\n *\n * @description\n *\n * Componente para definição de cor de fundo e dos logotipos primário e secundário para os templates\n * de `po-page-login` e demais templates de login.\n */\nexport class PoPageBackgroundComponent implements OnInit {\n poLanguageService = inject(PoLanguageService);\n\n /** Insere uma imagem de destaque ao lado direito do container. */\n @Input('p-background') background?: string;\n\n /** Idioma inicial selecionado no combo */\n @Input('p-initial-language') initialSelectLanguage?: string;\n\n /** Designa se o logotipo deve desaparecer em resoluções menores. */\n @Input('p-hide-logo') hideLogo?: boolean;\n\n /** Texto de destaque sobreposto à imagem de destaque. Essa opção é utilizada em conjunto com o atributo `p-background`. */\n @Input('p-highlight-info') highlightInfo?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado ao selecionar alguma opção no seletor de idiomas.\n * Para este evento será passado como parâmetro o valor de idioma selecionado.\n */\n @Output('p-selected-language') selectedLanguage: EventEmitter = new EventEmitter();\n\n selectedLanguageOption: string;\n\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _showSelectLanguage?: boolean = false;\n private _languagesList: Array;\n private _selectLanguageOptions: Array;\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /** Lista de idiomas para o combo box */\n @Input('p-languages') set languagesList(value: Array) {\n this._languagesList = value;\n this.setLanguageOptions();\n }\n\n get languagesList(): Array {\n if (this._languagesList?.length) {\n return this._languagesList;\n }\n return poLanguageDefault;\n }\n\n /** Caminho para a logomarca localizada na parte superior. */\n @Input('p-logo') logo?: string;\n\n /** Texto alternativo para a logomarca. */\n @Input('p-logo-alt') logoAlt?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Caminho para a logomarca localizada no rodapé.\n */\n @Input('p-secondary-logo') secondaryLogo: string;\n\n /** Define se o seletor de idiomas deve ser exibido. */\n @Input('p-show-select-language') set showSelectLanguage(showSelectLanguage: boolean) {\n this._showSelectLanguage = convertToBoolean(showSelectLanguage);\n }\n get showSelectLanguage() {\n return this._showSelectLanguage;\n }\n\n ngOnInit() {\n this.selectedLanguageOption = this.initialSelectLanguage || this.poLanguageService.getShortLanguage();\n }\n\n onChangeLanguage() {\n this.selectedLanguage.emit(this.selectedLanguageOption);\n }\n\n get selectLanguageOptions(): Array {\n return this._selectLanguageOptions;\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private setLanguageOptions() {\n this._selectLanguageOptions = this.languagesList.map(language => ({\n label: language.description,\n value: language.language\n }));\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n}\n","\n\n @if (background) {\n \n \n \n }\n\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { RouterModule } from '@angular/router';\n\nimport { PoDividerModule, PoFieldModule, PoLogoModule } from '@po-ui/ng-components';\n\nimport { PoPageBackgroundComponent } from './po-page-background.component';\n\n/**\n * @description\n *\n * Módulo do template do po-page-background.\n */\n@NgModule({\n imports: [CommonModule, FormsModule, RouterModule, PoDividerModule, PoFieldModule, PoLogoModule],\n declarations: [PoPageBackgroundComponent],\n exports: [PoPageBackgroundComponent]\n})\nexport class PoPageBackgroundModule {}\n","/**\n * @usedBy PoPageBlockedUserComponent\n *\n * @description\n *\n * *Enum* para os tipos de motivo de bloqueio de usuário. As informações modificam conforme o motivo selecionado pelo desenvolvedor.\n */\nexport enum PoPageBlockedUserReason {\n /** Sem definição; a tela exibirá conteúdo de bloqueio genérico. */\n None = 'none',\n\n /** Definição para tentativas de acesso esgotadas. */\n ExceededAttempts = 'exceededAttempts',\n\n /** Definição para senha expirada. */\n ExpiredPassword = 'expiredPassword'\n}\n","import { Directive, HostBinding, HostListener, Input } from '@angular/core';\n\nimport { getDefaultSizeFn, validateSizeFn } from '../../utils/util';\nimport { PoPageBlockedUserReason } from './enums/po-page-blocked-user-reason.enum';\nimport { PoPageBlockedUserReasonParams } from './interfaces/po-page-blocked-user-reason-params.interface';\n\nconst PoPageBlockedUserReasonDefault: PoPageBlockedUserReason = PoPageBlockedUserReason.None;\nconst PoPageBlockedUserParamsDefault: PoPageBlockedUserReasonParams = { attempts: 5, days: 90, hours: 24 };\n\n/**\n * @description\n *\n * O componente `po-page-blocked-user` é utilizado como template para tela de bloqueio de usuário.\n * É possível definir entre três tipos de telas para alertar o usuário sobre um eventual bloqueio de login.\n *\n * Cada modelo de bloqueio possui uma imagem e texto adequados à situação.\n * Os textos das telas são pré-definidos e imutáveis, porém,\n * é possível estipular parâmetros como dias, horas e tentativas de acesso esgotadas.\n *\n * Por fim, há propriedades para adição de telefone e/ou email para contato e também a definição para a url de retorno.\n *\n * Para que as imagens sejam exibidas corretamente, é necessário incluir o caminho delas ao projeto. Para isso, edite\n * o *assets* no arquivo **angular.json** da aplicação na seguinte ordem:\n * ```\n * \"assets\": [\n * \"src/assets\",\n * \"src/favicon.ico\",\n * {\n * \"glob\": \"**\\/*\",\n * \"input\": \"node_modules/@po-ui/style/images\",\n * \"output\": \"assets/images\"\n * }\n * ]\n * ```\n *\n * _______________\n *\n * #### Praticidade\n * O `po-page-blocked-user`, assim como suas propriedades, pode também ser transmitido diretamente pelas configuraçãos de rota e,\n * desta maneira, dispensa-se qualquer menção e/ou importação no restante da aplicação. O exemplo abaixo exemplifica\n * a forma dinâmica com a qual o template pode ser gerado se navegasse para uma rota denominada como `/access-denied`:\n *\n *\n * ```\n * import { PoPageBlockedUserComponent, PoPageBlockedUserReason } from '@po-ui/ng-templates';\n *\n * ...\n * const routes: Routes = [\n * {\n * path: 'access-denied', component: PoPageBlockedUserComponent, data: {\n * contactEmail: 'dev.po@po-ui.com',\n * contactPhone: '0800 1234 000',\n * reason: PoPageBlockedUserReason.ExpiredPassword,\n * urlBack: '/home'\n * }\n * }\n * ...\n * ];\n *\n * @NgModule({\n * imports: [RouterModule.forRoot(routes)],\n * exports: [RouterModule]\n * })\n * export class AppRoutingModule { }\n * ```\n *\n * > É essencial que siga a nomenclatura dos atributos exemplificados acima para sua efetiva funcionalidade.\n *\n */\n@Directive()\nexport class PoPageBlockedUserBaseComponent {\n /**\n * @optional\n *\n * @description\n *\n * Valor para o email de contato que deve ser exibido. A ação está de acordo com o protocolo MAILTO e é possível definir\n * tanto rotas internas quanto externas.\n */\n @Input('p-contact-email') contactEmail: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Valor para o telefone de contato que deve ser exibido. A ação está de acordo com o protocolo TEL.\n *\n * > A propriedade não contem tratamento de máscara, fica a critério do desenvolvedor defini-la.\n */\n @Input('p-contact-phone') contactPhone: string;\n\n /** Caminho para a logomarca localizada na parte superior, caso não seja definida ou seja inválida assume a logo padrão do PO UI. */\n @Input('p-logo') logo?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Caminho para a logomarca localizada no rodapé.\n */\n @Input('p-secondary-logo') secondaryLogo?: string;\n\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _params: PoPageBlockedUserReasonParams = { ...PoPageBlockedUserParamsDefault };\n private _reason: PoPageBlockedUserReason = PoPageBlockedUserReason.None;\n private _urlBack: string = '/';\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Designação de valores usados para a customização da mensagem de bloqueio.\n * Confira abaixo os valores pré-definidos.\n *\n * ```\n * const customLiterals: PoPageBlockedUserReasonParams = {\n * attempts: 5,\n * days: 90,\n * hours: 24\n * };\n * ```\n *\n * > Salientamos a importância e atenção para configuração desses valores conforme definidos no projeto.\n *\n * > Veja os parâmetros customizáveis na interface `PoPageBlockedUserReasonParams`.\n *\n */\n @Input('p-params') set params(value: PoPageBlockedUserReasonParams) {\n if (value instanceof Object) {\n const keys = Object.keys(value);\n const newParams = { ...PoPageBlockedUserParamsDefault };\n\n keys.forEach(key => {\n newParams[key] = value[key];\n });\n\n this._params = newParams;\n } else {\n this._params = { ...PoPageBlockedUserParamsDefault };\n }\n }\n\n get params() {\n return this._params;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Definição de motivo de bloqueio de usuário. As informações modificam conforme o motivo selecionado.\n *\n * > Veja os valores válidos no *enum* `PoPageBlockedUserReason`.\n *\n * @default `PoPageBlockedUserReason.None`\n */\n @Input('p-reason') set reason(value: PoPageBlockedUserReason) {\n this._reason = (Object).values(PoPageBlockedUserReason).includes(value)\n ? value\n : PoPageBlockedUserReasonDefault;\n }\n\n get reason() {\n return this._reason;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * URL para a ação de retorno da página.\n *\n * @default `/`\n */\n @Input('p-url-back') set urlBack(url: string) {\n this._urlBack = url;\n }\n\n get urlBack() {\n return this._urlBack;\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n}\n","import {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n Input,\n ViewChild,\n inject\n} from '@angular/core';\n\nconst poPageBlockedUserContactItemMargin = 16;\n\n@Component({\n selector: 'po-page-blocked-user-contacts',\n templateUrl: './po-page-blocked-user-contacts.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false\n})\nexport class PoPageBlockedUserContactsComponent {\n private readonly changeDetector = inject(ChangeDetectorRef);\n\n @ViewChild('contactGroup', { static: true }) contactGroup: ElementRef;\n\n @ViewChild('mailItem', { static: true }) mailItem: ElementRef;\n\n @ViewChild('phoneItem', { static: true }) phoneItem: ElementRef;\n\n overflowItem: boolean = true;\n\n private _email: string;\n private _phone: string;\n\n @Input('p-email') set email(value: string) {\n this._email = value;\n\n this.checkContactItemWidth();\n }\n\n get email() {\n return this._email;\n }\n\n @Input('p-phone') set phone(value: string) {\n this._phone = value;\n\n this.checkContactItemWidth();\n }\n\n get phone() {\n return this._phone;\n }\n\n private checkContactItemWidth() {\n this.overflowItem = true;\n\n if (this.phone && this.email) {\n this.changeDetector.detectChanges();\n\n const phoneWidth = this.phoneItem.nativeElement.offsetWidth;\n const mailWidth = this.mailItem.nativeElement.offsetWidth;\n const contactGroupHalfWidth =\n this.contactGroup.nativeElement.offsetWidth / 2 - poPageBlockedUserContactItemMargin;\n\n this.overflowItem =\n phoneWidth > contactGroupHalfWidth || mailWidth > contactGroupHalfWidth - poPageBlockedUserContactItemMargin;\n }\n }\n}\n","
\n \n \n
\n \n
{{ phone }}
\n
\n \n
\n \n \n
\n \n
{{ email }}
\n
\n \n \n\n","export const poPageBlockedUserLiterals = {\n none: {\n pt: {\n title: 'Opa!',\n firstPhrase: 'Tivemos que bloquear essa tela temporariamente.',\n secondPhrase: 'Mas não se preocupe! Basta fazer seu login novamente.'\n },\n en: {\n title: 'Oops!',\n firstPhrase: 'We had to temporarily block this screen.',\n secondPhrase: 'But do not worry! Just sign in again.'\n },\n es: {\n title: 'Opa!',\n firstPhrase: 'Tuvimos que bloquear esta pantalla temporalmente.',\n secondPhrase: '¡Pero no se preocupe! Sólo tienes que iniciar sesión de nuevo.'\n },\n ru: {\n title: 'Ой!',\n firstPhrase: 'Нам пришлось временно заблокировать этот раздел.',\n secondPhrase: 'Но не волнуйтесь! Просто войдите в систему еще раз.'\n }\n },\n exceededAttempts: {\n pt: {\n title: 'Opa!',\n firstPhrase: `Para sua segurança, após {0} tentativa(s) de senha seu usuário fica bloqueado e não pode ser acessado em {1} hora(s) :( `,\n secondPhrase: 'Isso é para evitar que hackers invadam sua conta.',\n thirdPhrase:\n 'Mas não se preocupe! Se você for o dono da conta e apenas esqueceu sua senha, basta entrar em contato com o suporte.'\n },\n en: {\n title: 'Oops!',\n firstPhrase: `For your security, after {0} attempt(s) of password\n your user gets blocked and can not be accessed in {1} hour(s) :(`,\n secondPhrase: 'This is to prevent hackers from hacking into your account.',\n thirdPhrase:\n 'But do not worry! If you are the owner of the account and just forgot your password, just contact support.'\n },\n es: {\n title: 'Opa!',\n firstPhrase: `Para su seguridad, después de {0} intento(s) de contraseña\n su usuario queda bloqueado y no puede ser accedido en {1} hora(s) :(`,\n secondPhrase: 'Esto es para evitar que los hackers invadan su cuenta.',\n thirdPhrase: `¡Pero no se preocupe! Si usted es el dueño de la cuenta\n y acaba de olvidar su contraseña, simplemente póngase en contacto con el soporte.`\n },\n ru: {\n title: 'Ой!',\n firstPhrase:\n 'Для вашей безопасности, после {0} попыток ввода пароля\\r\\nваш пользователь блокируется и не сможет авторизоваться в течение {1} часа(ов) :(',\n secondPhrase: 'Это делается для того, чтобы хакеры не могли взломать ваш аккаунт.',\n thirdPhrase:\n 'Но не волнуйтесь! Если вы являетесь владельцем учетной записи и просто забыли свой пароль, обратитесь в службу поддержки.'\n }\n },\n expiredPassword: {\n pt: {\n title: 'Opa! Sua senha expirou',\n firstPhrase: `A cada {0} dia(s) é preciso criar uma nova senha por questão de segurança. Após esses {0} dia(s) seu acesso é bloqueado :(`,\n secondPhrase: 'Mas não se preocupe! Basta entrar em contato com o administrador do sistema.'\n },\n en: {\n title: 'Oops! Your Password has expired',\n firstPhrase: `Every {0} day(s) you need to create a new password for security reasons.\n After these {0} day(s) your access is blocked :(`,\n secondPhrase: 'But do not worry! Just contact your system administrator.'\n },\n es: {\n title: 'Opa! Su contraseña ha caducado',\n firstPhrase: `Cada {0} día(s) es necesario crear una nueva contraseña por razones de seguridad.\n Después de estos {0} día(s) su acceso está bloqueado :(`,\n secondPhrase: '¡Pero no se preocupe! Sólo tienes que ponerse en contacto con el administrador del sistema.'\n },\n ru: {\n title: 'Ой! Срок действия вашего пароля истек',\n firstPhrase:\n 'Каждые {0} дней вам необходимо создавать новый пароль в целях безопасности.\\r\\nПосле {0} дней ваш доступ будет заблокирован :(',\n secondPhrase: 'Но не волнуйтесь! Просто обратитесь к своему системному администратору.'\n }\n }\n};\n","import { ChangeDetectorRef, Component, Input, OnChanges, OnInit, SimpleChanges, inject } from '@angular/core';\n\nimport { PoLanguageService, poLocaleDefault } from '@po-ui/ng-components';\n\nimport { poPageBlockedUserLiterals } from './../literals/i18n/po-page-blocked-user-literals';\nimport { PoPageBlockedUserReason } from '../enums/po-page-blocked-user-reason.enum';\nimport { PoPageBlockedUserReasonParams } from '../interfaces/po-page-blocked-user-reason-params.interface';\n\n@Component({\n selector: 'po-page-blocked-user-reason',\n templateUrl: './po-page-blocked-user-reason.component.html',\n standalone: false\n})\nexport class PoPageBlockedUserReasonComponent implements OnChanges, OnInit {\n private readonly changeDetector = inject(ChangeDetectorRef);\n\n @Input('p-params') params: PoPageBlockedUserReasonParams;\n\n @Input('p-reason') reason: PoPageBlockedUserReason;\n\n literalParams;\n literals: { title: string; firstPhrase: string; secondPhrase: string; thirdPhrase: string };\n\n private readonly language: string;\n\n constructor() {\n const languageService = inject(PoLanguageService);\n\n this.language = languageService.getShortLanguage();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes.reason || changes.params) {\n this.getLiterals();\n }\n }\n\n ngOnInit() {\n this.getLiterals();\n }\n\n getImageByReasonType() {\n let reasonImage;\n\n switch (this.reason) {\n case 'none': {\n reasonImage = 'big-lock';\n break;\n }\n case 'exceededAttempts': {\n reasonImage = 'blocked-user';\n break;\n }\n case 'expiredPassword': {\n reasonImage = 'expired';\n break;\n }\n }\n return `./assets/images/${reasonImage}.svg`;\n }\n\n getParams() {\n this.literalParams =\n this.reason === 'expiredPassword'\n ? [this.params.days, this.params.days]\n : [this.params.attempts, this.params.hours];\n }\n\n private getLiterals() {\n this.getParams();\n\n this.literals = {\n ...poPageBlockedUserLiterals[this.reason][poLocaleDefault],\n ...poPageBlockedUserLiterals[this.reason][this.language]\n };\n\n this.changeDetector.detectChanges();\n }\n}\n","
\n \n
\n
{{ literals?.title }}
\n
\n
\n
\n {{ literals?.firstPhrase | poI18n: literalParams }}\n
\n
{{ literals?.secondPhrase }}
\n @if (literals?.thirdPhrase) {\n
{{ literals?.thirdPhrase }}
\n }\n
\n
\n","import { Component, OnInit, inject } from '@angular/core';\nimport { ActivatedRoute, Router } from '@angular/router';\n\nimport { PoLanguageService, poLocaleDefault } from '@po-ui/ng-components';\n\nimport { PoUtils } from '../../utils/util';\n\nimport { PoPageBlockedUserBaseComponent } from './po-page-blocked-user-base.component';\n\nexport const poPageBlockedUserButtonLiterals: object = {\n en: {\n primaryButton: 'Back to home screen'\n },\n es: {\n primaryButton: 'Volver al inicio'\n },\n pt: {\n primaryButton: 'Voltar para o início'\n },\n ru: {\n primaryButton: 'Перейти к началу страницы'\n }\n};\n\n/**\n * @docsExtends PoPageBlockedUserBaseComponent\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n */\n\n@Component({\n selector: 'po-page-blocked-user',\n templateUrl: './po-page-blocked-user.component.html',\n standalone: false\n})\nexport class PoPageBlockedUserComponent extends PoPageBlockedUserBaseComponent implements OnInit {\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly router = inject(Router);\n\n literals;\n\n constructor() {\n const languageService = inject(PoLanguageService);\n\n super();\n\n const language = languageService.getShortLanguage();\n\n this.literals = {\n ...poPageBlockedUserButtonLiterals[poLocaleDefault],\n ...poPageBlockedUserButtonLiterals[language]\n };\n }\n\n ngOnInit() {\n this.checkingForRouteMetadata(this.activatedRoute.snapshot.data);\n }\n\n navigateTo(url: string) {\n PoUtils.isExternalLink(url) ? window.open(url) : this.router.navigate([url || '/']);\n }\n\n private checkingForMetadataProperty(object, property) {\n if (Object.prototype.hasOwnProperty.call(object, property)) {\n return object[property];\n }\n }\n\n private checkingForRouteMetadata(data) {\n if (Object.keys(data).length !== 0) {\n this.contactEmail = this.checkingForMetadataProperty(data, 'contactEmail') || this.contactEmail;\n this.contactPhone = this.checkingForMetadataProperty(data, 'contactPhone') || this.contactPhone;\n this.reason = this.checkingForMetadataProperty(data, 'reason') || this.reason;\n this.urlBack = this.checkingForMetadataProperty(data, 'urlBack') || this.urlBack;\n }\n }\n}\n","
\n
\n \n \n\n
\n \n \n\n
\n \n \n
\n
\n \n
\n
\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport { PoModule } from '@po-ui/ng-components';\n\nimport { PoPageBackgroundModule } from '../po-page-background/index';\nimport { PoPageBlockedUserComponent } from './po-page-blocked-user.component';\nimport { PoPageBlockedUserContactsComponent } from './po-page-blocked-user-contacts/po-page-blocked-user-contacts.component';\nimport { PoPageBlockedUserReasonComponent } from './po-page-blocked-user-reason/po-page-blocked-user-reason.component';\n\n/**\n * @description\n *\n * Módulo do template do po-page-blocked-user.\n */\n@NgModule({\n imports: [CommonModule, RouterModule, PoModule, PoPageBackgroundModule],\n declarations: [PoPageBlockedUserComponent, PoPageBlockedUserContactsComponent, PoPageBlockedUserReasonComponent],\n exports: [PoPageBlockedUserComponent, PoPageBlockedUserContactsComponent, PoPageBlockedUserReasonComponent]\n})\nexport class PoPageBlockedUserModule {}\n","export const poPageChangePasswordLiterals = {\n en: {\n backButton: 'Back',\n confirmPassword: 'Confirm password',\n createNewPassword: 'Create new password',\n createNewPasswordPhrase: 'Protect your account with a personal password created by you',\n currentPassword: 'Current password',\n enterSystemButton: 'Enter the system',\n forgotPassword: 'Forgot your password?',\n newPassword: 'New password',\n passwordSuccessfullyCreated: 'Password successfully created!',\n passwordSuccessfullyUpdated: 'Password successfully updated!',\n requirements: 'Password requirements',\n safetyTips: 'Safety tips!',\n safetyTipsFirst: 'is used in other accounts;',\n safetyTipsPhrase: 'Avoid a password that:',\n safetyTipsSecond: 'has personal information like your name, nickname or family names;',\n safetyTipsThird: 'that uses obvious sequences like \"123\" or obvious words like \"password\";',\n saveButton: 'Save'\n },\n es: {\n backButton: 'Volver',\n confirmPassword: 'Confirmar seña',\n createNewPassword: 'Crear nueva contraseña',\n createNewPasswordPhrase: 'Proteger su cuenta con una contraseña personal creada por usted',\n currentPassword: 'Contraseña actual',\n enterSystemButton: 'Entrar en el sistema',\n forgotPassword: '¿Olvidaste tu contraseña?',\n newPassword: 'Nueva contraseña',\n passwordSuccessfullyCreated: 'Contraseña creada correctamente!',\n passwordSuccessfullyUpdated: 'Contraseña correctamente actualizada!',\n requirements: 'Requisitos de contraseña',\n safetyTips: 'Consejos de seguridad!',\n safetyTipsFirst: 'se utilice en otras cuentas;',\n safetyTipsPhrase: 'Evite una contraseña que:',\n safetyTipsSecond: 'utiliza información personal como su nombre, apellido o nombre de familia;',\n safetyTipsThird: 'utilice secuencias muy obvias como \"1234\" o \"abcd\" o palabras obvias como \"contraseña\";',\n saveButton: 'Guardar'\n },\n pt: {\n backButton: 'Voltar',\n confirmPassword: 'Confirmar senha',\n createNewPassword: 'Criar nova senha',\n createNewPasswordPhrase: 'Proteja sua conta com uma senha pessoal criada por você',\n currentPassword: 'Senha atual',\n enterSystemButton: 'Entrar no sistema',\n forgotPassword: 'Esqueceu sua senha?',\n newPassword: 'Nova senha',\n passwordSuccessfullyCreated: 'Senha criada com sucesso!',\n passwordSuccessfullyUpdated: 'Senha alterada com sucesso!',\n requirements: 'Requisitos de senha',\n safetyTips: 'Dicas de segurança!',\n safetyTipsFirst: 'seja usada em outras contas;',\n safetyTipsPhrase: 'Evite uma senha que:',\n safetyTipsSecond: 'usa informações pessoais como seu nome, apelido ou nome de familiares;',\n safetyTipsThird: 'use sequências muito óbvias como \"1234\" ou \"abcd\" ou palavras óbvias como “senha”;',\n saveButton: 'Salvar'\n },\n ru: {\n backButton: 'возвращение',\n confirmPassword: 'Подтвердите пароль',\n createNewPassword: 'Создать новый пароль',\n createNewPasswordPhrase: 'Защитите свой аккаунт с помощью личного пароля.',\n currentPassword: 'Текущий пароль',\n enterSystemButton: 'Вход в систему',\n forgotPassword: 'Забыли пароль?',\n newPassword: 'Новый пароль',\n passwordSuccessfullyCreated: 'Пароль успешно создан!',\n passwordSuccessfullyUpdated: 'Пароль успешно изменен!',\n requirements: 'Требования к паролю',\n safetyTips: 'Советы по безопасности!',\n safetyTipsFirst: 'использоваться на других счетах;',\n safetyTipsPhrase: 'Избегайте пароля, который:',\n safetyTipsSecond: 'использует личную информацию, такую ​​как ваше имя, фамилию или фамилию;',\n safetyTipsThird:\n 'используйте очень очевидные строки, такие как \"1234\" или \"abcd\", или такие очевидные слова, как \"пароль\";',\n saveButton: 'экономить'\n }\n};\n","import { Directive, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core';\n\nimport { PoModalAction } from '@po-ui/ng-components';\n\nimport { convertToBoolean, getDefaultSizeFn, isExternalLink, isTypeof, validateSizeFn } from '../../utils/util';\n\nimport { PoPageChangePasswordRecovery } from './interfaces/po-page-change-password-recovery.interface';\nimport { PoPageChangePasswordRequirement } from './interfaces/po-page-change-password-requirement.interface';\n\n/**\n * @description\n *\n * O componente `po-page-change-password` é utilizado como template para tela de cadastro ou alteração de senha.\n *\n * Apresenta dicas e regras para senhas mais seguras e também possibilidade de personalizar o redirecionamento para as telas\n * 'esqueceu a senha', 'voltar' e 'entrar no sistema'. Os textos das telas são pré-definidos e imutáveis.\n *\n * A propriedade `p-url-new-password` automatiza a rotina do template e simplifica o processo de cadastro/alteração de senha, bastando\n * definir uma url para POST das informações digitadas pelo usuário. A flexibilidade e praticidade podem chegar a um nível em que o\n * desenvolvimento da aplicação no *client side* é desprovida de qualquer código-fonte relacionado à rotina de cadastro/alteração de senha.\n * Seu detalhamento para uso pode ser visto logo abaixo em *propriedades*.\n * Caso julgue necessário, pode-se também definir manualmente a rotina do componente.\n *\n * Para que as imagens sejam exibidas corretamente, é necessário incluir o caminho delas ao projeto. Para isso, edite\n * o *assets* no arquivo **angular.json** da aplicação na seguinte ordem:\n * ```\n * \"assets\": [\n * \"src/assets\",\n * \"src/favicon.ico\",\n * {\n * \"glob\": \"**\\/*\",\n * \"input\": \"node_modules/@po-ui/style/images\",\n * \"output\": \"assets/images\"\n * }\n * ]\n * ```\n */\n@Directive()\nexport abstract class PoPageChangePasswordBaseComponent {\n /**\n * @optional\n *\n * @description\n *\n * Caminho para a logomarca localizada na parte superior.\n *\n * > Caso seja indefinida o espaço se mantém preservado porém vazio.\n */\n @Input('p-logo') logo?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Caminho para a logomarca localizada no rodapé.\n */\n @Input('p-secondary-logo') secondaryLogo?: string;\n\n /**\n * Token para solicitação de troca/recuperação de senha.\n *\n * > Esta propriedade será ignorada caso exista um token como parâmetro na URL inicial do template.\n */\n @Input('p-token') token?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * URL para a ação de retorno da página.\n *\n * > O botão `Voltar` aparece apenas para telas de alteração de senha, ou seja, só aparece se a propriedade `p-hide-current-password` for\n * falsa.\n *\n * @default `/`\n */\n @Input('p-url-back') urlBack: string = '/';\n\n /**\n * Endpoint usado pelo template para realizar um POST. Quando preenchido, o método `p-submit` será ignorado e o componente adquirirá\n * automatização para o processo de cadastro/troca de senha.\n *\n * ### Processo\n * Ao digitar um valor válido nos campos de senha e pressionar **salvar**,\n * o componente fará uma requisição `POST` na url especificada nesta propriedade passando o objeto contendo os valores definidos pelo\n * usuário.\n *\n * ```\n * body {\n * token?: token,\n * oldPassword?: oldPassword,\n * newPassword: newPassword\n * }\n * ```\n *\n * O código de resposta HTTP de status esperado é `204`.\n *\n * Em caso de **sucesso**, será exibida a modal de confirmação de senha alterada.\n *\n * > O token será informado pela propriedade `p-token`do componente ou por um *query parameter* na URL do template.\n *\n * *Processo finalizado.*\n *\n * _______________\n *\n * #### Praticidade\n * As informações do serviço de autenticação também podem ser transmitidas diretamente pelas configuraçãos de rota e, desta maneira,\n * dispensa-se qualquer menção e/ou importação do componente `po-page-change-password` no restante da aplicação. O exemplo abaixo\n * exemplifica a forma dinâmica com a qual o template de tela de troca de senha pode ser gerado ao navegar para rota `/change-password`, e\n * também como ele se comunica com o serviço para efetuação do processo de troca de senha do usuário e solicitação de nova senha.\n * Basta definir nas configurações de rota:\n *\n *\n * ```\n * import { PoModalPasswordRecoveryType, PoPageChangePasswordComponent } from '@po-ui/ng-templates';\n *\n * ...\n * const routes: Routes = [\n * {\n * path: 'change-password', component: PoPageChangePasswordComponent, data: {\n * serviceApi: 'https://po-ui.io/sample/api/new-password',\n * recovery: {\n * url: 'https://po-ui.io/sample/api/users',\n * type: PoModalPasswordRecoveryType.All,\n * contactMail: 'dev.po@po-ui.com',\n * phoneMask: '9-999-999-9999'\n * }\n * }\n * }\n * ...\n * ];\n *\n * @NgModule({\n * imports: [RouterModule.forRoot(routes)],\n * exports: [RouterModule]\n * })\n * export class AppRoutingModule { }\n * ```\n *\n *\n * O metadado `serviceApi` deve ser a **url** para requisição dos recursos de troca de senha. E `recovery` é a interface\n * `PoPageChangePasswordRecovery` responsável pelas especificações contidas na modal de recuperação de senha.\n *\n * > É essencial que siga a nomenclatura dos atributos exemplificados acima para sua efetiva funcionalidade.\n *\n */\n @Input('p-url-new-password') urlNewPassword?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Função executada ao submeter o form pelo botão salvar.\n *\n * Caso definida essa função, a modal de confirmação não aparece, mas pode ser chamada pelo\n * método `openConfirmation`. Exemplo:\n *\n * ```\n * @ViewChild(PoPageChangePasswordComponent) changePassword: PoPageChangePasswordComponent;\n *\n * onSubmit() {\n * this.changePassword.openConfirmation();\n * }\n *\n * ```\n * > Esta propriedade será ignorada se for definido valor para a propriedade `p-url-new-password`.\n */\n @Output('p-submit') submit: EventEmitter = new EventEmitter();\n\n confirmPassword: string;\n currentPassword: string;\n modalAction: PoModalAction;\n newPassword: string;\n recoveryUrlType: string;\n showRequirements: boolean;\n\n protected validatorChange: any;\n\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _hideCurrentPassword: boolean = false;\n private _recovery: string | PoPageChangePasswordRecovery | Function;\n private _requirements: Array = [];\n private _urlHome: string = '/';\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Esconde o campo `Senha atual` para que o template seja para criação de senha.\n *\n * @default `false`\n */\n @Input('p-hide-current-password') set hideCurrentPassword(value: boolean) {\n this._hideCurrentPassword = convertToBoolean(value);\n }\n\n get hideCurrentPassword(): boolean {\n return this._hideCurrentPassword;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * URL para a ação do link `Esqueceu a senha`.\n *\n * A propriedade aceita os seguintes tipos:\n *\n * - **String**: informe uma url externa ou uma rota válida;\n * - **Function**: pode-se customizar a ação. Para esta possilidade basta atribuir:\n * ```\n * \n * [recovery]=\"this.myFunc.bind(this)\";\n * \n * ```\n *\n * - **PoPageChangePasswordRecovery**: cria-se vínculo automático com o template **po-modal-password-recovery**.\n * O objeto deve conter a **url** para requisição dos recursos e pode-se definir o **tipo** de modal para recuperação de senha,\n * **email** para contato e **máscara** do campo de telefone.\n *\n * > Caso não tenha valor o link `Esqueceu a senha` desaparece.\n */\n @Input('p-recovery') set recovery(value: string | Function | PoPageChangePasswordRecovery) {\n this._recovery = value;\n\n if (isTypeof(value, 'string')) {\n this.recoveryUrlType = isExternalLink(value) ? 'externalLink' : 'internalLink';\n }\n }\n\n get recovery() {\n return this._recovery;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista de regras para criação e alteração de senha.\n */\n @Input('p-requirements') set requirements(value: Array) {\n this._requirements = value || [];\n this.showRequirements = this._requirements.length > 0;\n }\n get requirements() {\n return this._requirements;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * URL para a ação do botão `Entrar no sistema` da modal de confirmação que aparece após salvar a senha ou se chamada pelo método\n * `openConfirmation`.\n *\n * @default `/`\n */\n @Input('p-url-home') set urlHome(value: string) {\n this._urlHome = value;\n this.modalAction.action = this.navigateTo.bind(this, this.urlHome);\n }\n get urlHome() {\n return this._urlHome;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define a propriedade nativa `autocomplete` do campo como `off`.\n *\n * > No input de senha(`po-password`) será definido como `new-password`.\n *\n * @default `true`\n */\n @Input('p-no-autocomplete-password') noAutocompletePassword: boolean = true;\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n abstract navigateTo(url: string): void;\n}\n","import { Injectable, inject } from '@angular/core';\n\nimport { Observable } from 'rxjs';\n\nimport { HttpClient, HttpResponse } from '@angular/common/http';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageChangePasswordService {\n private readonly http = inject(HttpClient);\n\n post(url: string, item: any): Observable> {\n return this.http.post(url, item, { observe: 'response' });\n }\n}\n","import {\n AfterViewInit,\n Component,\n ComponentRef,\n OnDestroy,\n OnInit,\n ViewChild,\n ViewContainerRef,\n inject\n} from '@angular/core';\nimport { NgForm } from '@angular/forms';\nimport { ActivatedRoute, Router } from '@angular/router';\n\nimport { Subscription } from 'rxjs';\n\nimport {\n PoComponentInjectorService,\n PoLanguageService,\n PoModalAction,\n PoModalComponent,\n poLocaleDefault\n} from '@po-ui/ng-components';\n\nimport { isTypeof, PoUtils } from '../../utils/util';\n\nimport { PoModalPasswordRecoveryType } from '../po-modal-password-recovery/enums/po-modal-password-recovery-type.enum';\nimport { PoModalPasswordRecoveryComponent } from '../po-modal-password-recovery/po-modal-password-recovery.component';\nimport { PoPageChangePasswordRecovery } from './interfaces/po-page-change-password-recovery.interface';\nimport { PoPageChangePasswordRequirement } from './interfaces/po-page-change-password-requirement.interface';\nimport { PoPageChangePassword } from './interfaces/po-page-change-password.interface';\nimport { poPageChangePasswordLiterals } from './literals/i18n/po-page-change-password-literals';\nimport { PoPageChangePasswordBaseComponent } from './po-page-change-password-base.component';\nimport { PoPageChangePasswordService } from './po-page-change-password.service';\n\n/**\n * @docsExtends PoPageChangePasswordBaseComponent\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n */\n@Component({\n selector: 'po-page-change-password',\n templateUrl: './po-page-change-password.component.html',\n standalone: false\n})\nexport class PoPageChangePasswordComponent\n extends PoPageChangePasswordBaseComponent\n implements AfterViewInit, OnDestroy, OnInit\n{\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly route = inject(ActivatedRoute);\n private readonly router = inject(Router);\n private readonly service = inject(PoPageChangePasswordService);\n private readonly poComponentInjector = inject(PoComponentInjectorService);\n\n @ViewChild(PoModalComponent, { static: true }) modal: PoModalComponent;\n @ViewChild('pageChangePassword', { read: ViewContainerRef, static: true }) pageChangePassword: ViewContainerRef;\n @ViewChild('passwordForm', { read: NgForm, static: true }) passwordForm: NgForm;\n\n literals: {\n backButton: string;\n confirmPassword: string;\n createNewPassword: string;\n createNewPasswordPhrase: string;\n currentPassword: string;\n enterSystemButton: string;\n forgotPassword: string;\n newPassword: string;\n passwordSuccessfullyCreated: string;\n passwordSuccessfullyUpdated: string;\n requirements: string;\n safetyTips: string;\n safetyTipsPhrase: string;\n safetyTipsFirst: string;\n safetyTipsSecond: string;\n safetyTipsThird: string;\n saveButton: string;\n } = poPageChangePasswordLiterals[poLocaleDefault];\n\n modalAction: PoModalAction = {\n action: this.navigateTo.bind(this, this.urlHome),\n label: this.literals.enterSystemButton\n };\n\n private readonly newPasswordSubscription: Subscription;\n private componentRef: ComponentRef = null;\n\n constructor() {\n const languageService = inject(PoLanguageService);\n\n super();\n\n const language = languageService.getShortLanguage();\n\n this.literals = {\n ...poPageChangePasswordLiterals[poLocaleDefault],\n ...poPageChangePasswordLiterals[language]\n };\n }\n\n ngAfterViewInit() {\n if (this.urlNewPassword) {\n this.subscribeToTokenParameter();\n }\n }\n\n ngOnDestroy() {\n if (this.newPasswordSubscription) {\n this.newPasswordSubscription.unsubscribe();\n }\n }\n\n ngOnInit() {\n this.checkingForRouteMetadata(this.activatedRoute.snapshot.data);\n }\n\n navigateTo(url: string) {\n PoUtils.isExternalLink(url) ? window.open(url) : this.router.navigate([url || '/']);\n }\n\n onForgotPasswordClick(recovery): void {\n if (isTypeof(recovery, 'function')) {\n recovery();\n } else {\n this.createModalPasswordRecoveryComponent(recovery);\n }\n }\n\n onLoginSubmit(): void {\n const form = this.getLoginForm();\n\n if (this.urlNewPassword) {\n this.postUrlNewPassword(form);\n } else if (this.submit && this.submit.observers.length) {\n this.emitSubmit(form);\n }\n }\n\n /**\n * Abre uma modal de confirmação com texto, imagem e botão que redireciona para o link definido na propriedade `p-url-home`\u001c\n */\n openConfirmation() {\n this.modal.open();\n }\n\n validatePassword() {\n const controls = this.passwordForm.form.controls;\n const controlConfirmPassword = controls['confirmPassword'];\n const controlNewPassword = controls['newPassword'];\n\n if (!this.newPassword) {\n this.setFormErrors({ 'required': true }, [controlNewPassword]);\n } else if (!this.confirmPassword) {\n this.setFormErrors({ 'required': true }, [controlConfirmPassword]);\n } else if (this.newPassword && this.confirmPassword && this.newPassword !== this.confirmPassword) {\n this.setFormErrors({ 'equalPassword': true }, [controlNewPassword, controlConfirmPassword]);\n } else {\n this.setFormErrors(null, [controlConfirmPassword, controlNewPassword]);\n }\n\n if (\n this.requirements.length &&\n this.requirements.find(requirement => this.validateRequirement(requirement) === false)\n ) {\n this.setFormErrors({ 'requirement': true }, [controlNewPassword]);\n }\n }\n\n validateRequirement(requirement: PoPageChangePasswordRequirement) {\n return typeof requirement.status === 'function' ? requirement.status(this.newPassword) : requirement.status;\n }\n\n private checkingForMetadataProperty(object, property) {\n if (Object.prototype.hasOwnProperty.call(object, property)) {\n return object[property];\n }\n }\n\n private checkingForRouteMetadata(data) {\n if (Object.keys(data).length !== 0) {\n this.urlNewPassword = this.checkingForMetadataProperty(data, 'serviceApi') || this.urlNewPassword;\n this.recovery = this.checkingForMetadataProperty(data, 'recovery') || this.recovery;\n this.hideCurrentPassword =\n this.checkingForMetadataProperty(data, 'hideCurrentPassword') || this.hideCurrentPassword;\n }\n }\n\n private createModalPasswordRecoveryComponent(recovery: PoPageChangePasswordRecovery) {\n if (this.componentRef) {\n this.poComponentInjector.destroyComponentInApplication(this.componentRef);\n }\n\n this.componentRef = this.poComponentInjector.createComponentInApplication(PoModalPasswordRecoveryComponent);\n this.componentRef.instance.recovery = recovery.url;\n this.componentRef.instance.contactEmail = recovery.contactMail;\n this.componentRef.instance.phoneMask = recovery.phoneMask;\n this.componentRef.instance.type = recovery.type || PoModalPasswordRecoveryType.Email;\n this.componentRef.changeDetectorRef.detectChanges();\n setTimeout(() => {\n this.componentRef.instance.open();\n });\n }\n\n private emitSubmit(form: PoPageChangePassword) {\n this.submit.emit(form);\n }\n\n private getLoginForm(): PoPageChangePassword {\n return {\n currentPassword: this.currentPassword,\n newPassword: this.newPassword\n };\n }\n\n private postUrlNewPassword(form: PoPageChangePassword) {\n form['token'] = this.token;\n\n this.service.post(this.urlNewPassword, form).subscribe(response => {\n if (response.status === 204) {\n this.openConfirmation();\n }\n });\n }\n\n private setFormErrors(error: any, controls?: Array) {\n controls.forEach(control => {\n control.setErrors(error);\n });\n }\n\n private subscribeToTokenParameter() {\n this.route.queryParams.subscribe(params => {\n const token = params['token'];\n\n if (token) {\n this.token = token;\n }\n });\n }\n}\n","
\n
\n \n
\n
{{ literals.createNewPassword }}
\n
\n {{ literals.createNewPasswordPhrase }}\n
\n
\n\n
\n
\n
\n @if (!hideCurrentPassword) {\n
\n \n \n
\n }\n @if (!hideCurrentPassword && recovery) {\n
\n @if (recoveryUrlType === 'internalLink') {\n \n {{ literals.forgotPassword }}\n \n }\n @if (recoveryUrlType === 'externalLink') {\n \n {{ literals.forgotPassword }}\n \n }\n @if (!recoveryUrlType) {\n \n {{ literals.forgotPassword }}\n \n }\n
\n }\n
\n \n \n
\n
\n \n \n
\n
\n @if (showRequirements) {\n
\n \n
    \n
  • \n

    \n {{ literals?.requirements }}\n

    \n
    • \n @for (requirement of requirements; track requirement) {\n
  • \n \n \n

    \n {{ requirement.requirement }}\n

    \n
    • \n }\n
\n \n
\n }\n
\n
\n\n \n\n
\n
\n \n
\n
\n
{{ literals.safetyTips }}
\n
\n
{{ literals.safetyTipsPhrase }}
\n
• {{ literals.safetyTipsFirst }}
\n
• {{ literals.safetyTipsSecond }}
\n
• {{ literals.safetyTipsThird }}
\n
\n
\n
\n\n
\n \n\n @if (!hideCurrentPassword) {\n \n \n }\n\n \n \n
\n \n
\n
\n\n\n
\n \n
\n\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { RouterModule } from '@angular/router';\n\nimport { PoModule } from '@po-ui/ng-components';\n\nimport { PoPageBackgroundModule } from '../po-page-background/index';\nimport { PoPageChangePasswordComponent } from './po-page-change-password.component';\nimport { PoPageChangePasswordService } from './po-page-change-password.service';\n\n/**\n * @description\n *\n * Módulo do template do po-page-change-password.\n */\n@NgModule({\n imports: [CommonModule, FormsModule, RouterModule, PoModule, PoPageBackgroundModule],\n declarations: [PoPageChangePasswordComponent],\n providers: [PoPageChangePasswordService],\n exports: [PoPageChangePasswordComponent]\n})\nexport class PoPageChangePasswordModule {}\n","import { Injectable, inject } from '@angular/core';\nimport { HttpClient, HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';\n\nimport { merge, Observable, of, throwError } from 'rxjs';\nimport { map, catchError } from 'rxjs/operators';\n\nimport { PoLanguageService, PoNotificationService } from '@po-ui/ng-components';\n\nimport { PoPageDynamicLiterals } from './po-page-dynamic-literals.interface';\n\nexport const poPageDynamicLiterals: { [key: string]: PoPageDynamicLiterals } = {\n en: {\n errorRenderPage: 'Error loading page',\n notPossibleLoadMetadataPage: 'The page metadata could not be loaded'\n },\n es: {\n errorRenderPage: 'Error al cargar la página',\n notPossibleLoadMetadataPage: 'No se pudieron cargar los metadatos de la página.'\n },\n pt: {\n errorRenderPage: 'Erro ao carregar a página',\n notPossibleLoadMetadataPage: 'Não foi possível carregar os metadados da página'\n },\n ru: {\n errorRenderPage: 'Ошибка загрузки страницы',\n notPossibleLoadMetadataPage: 'Не удалось загрузить метаданные страницы'\n }\n};\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageDynamicService {\n private readonly http = inject(HttpClient);\n private readonly notification = inject(PoNotificationService);\n\n readonly headers: HttpHeaders = new HttpHeaders({\n 'X-PO-SCREEN-LOCK': 'true'\n });\n\n private endpoint = '/';\n private readonly language: string;\n private metadata: string;\n\n constructor() {\n const languageService = inject(PoLanguageService);\n\n this.language = languageService.getShortLanguage();\n }\n\n configServiceApi(config: { endpoint?: string; metadata?: string } = {}) {\n this.endpoint = config.endpoint;\n this.metadata = config.metadata || this.metadata;\n }\n\n getMetadata(type: string = 'list'): Observable {\n const key = `${this.endpoint}-${type}-metadata`;\n const cache = JSON.parse(localStorage.getItem(key)) || {};\n const metadataUrlBase = this.metadata || `${this.endpoint}/metadata`;\n\n const url = `${metadataUrlBase}?type=${type}&version=${cache.version || ''}`;\n\n return this.http.get(url).pipe(\n map((response: any) => {\n if (response.version !== undefined && response.version === cache.version) {\n return cache;\n }\n\n localStorage.setItem(key, JSON.stringify(response));\n\n return { ...cache, ...response };\n }),\n catchError((error: HttpErrorResponse) => {\n if (Object.keys(cache).length) {\n return of(cache);\n }\n\n const { errorRenderPage, notPossibleLoadMetadataPage } = poPageDynamicLiterals[this.language];\n\n this.notification.warning(notPossibleLoadMetadataPage);\n\n return merge(of({ title: errorRenderPage }), throwError(error));\n })\n );\n }\n\n // Deleta um único recurso\n deleteResource(id?, endpoint?: string): Observable {\n const localEndPoint = this.getLocalEndPoint(endpoint, true);\n const url = id ? `${localEndPoint}/${id}` : localEndPoint;\n return this.http.delete(url, { headers: this.headers });\n }\n\n // Deleta recursos em lote\n deleteResources(ids: Array, endpoint?: string): Observable {\n return this.http.request('delete', `${this.getLocalEndPoint(endpoint)}`, { headers: this.headers, body: ids });\n }\n\n // Busca uma lista de recursos\n getResources(params?: HttpParams, endpoint?: string): Observable {\n return this.http.get(this.getLocalEndPoint(endpoint), { headers: this.headers, params });\n }\n\n // Busca um único recurso\n getResource(id, endpoint?: string): Observable {\n return this.http.get(`${this.getLocalEndPoint(endpoint, true)}/${id}`, { headers: this.headers });\n }\n\n // Cria um recurso\n createResource(resource, endpoint?: string): Observable {\n return this.http.post(`${this.getLocalEndPoint(endpoint)}`, resource, { headers: this.headers });\n }\n\n // Atualiza um recurso\n updateResource(id, resource, endpoint?: string): Observable {\n return this.http.put(`${this.getLocalEndPoint(endpoint, true)}/${id}`, resource, { headers: this.headers });\n }\n\n private getLocalEndPoint(endpoint?: string, checkSingleBar = false) {\n endpoint = endpoint ?? this.endpoint;\n if (checkSingleBar) {\n endpoint = endpoint === '/' ? '' : endpoint;\n }\n return endpoint;\n }\n}\n","import { HttpClient } from '@angular/common/http';\nimport { Injectable, inject } from '@angular/core';\n\nimport { Observable, from } from 'rxjs';\nimport { map } from 'rxjs/operators';\n\nimport { PoPageDynamicOptionsSchema, PoPageDynamicOptionsProp } from './po-page-dynamic-options.interface';\n\ntype urlOrFunction = string | Function;\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageCustomizationService {\n private readonly http = inject(HttpClient);\n\n getCustomOptions(\n origin: urlOrFunction,\n originalOption: T,\n optionSchema: PoPageDynamicOptionsSchema\n ): Observable {\n return this.createObservable(origin).pipe(\n map(newPageOptions => this.mergePageOptions(originalOption, newPageOptions, optionSchema))\n );\n }\n\n changeOriginalOptionsToNewOptions(objectToChange: T, newOptions: K) {\n Object.keys(newOptions).forEach(key => {\n const value = newOptions[key];\n if (key in objectToChange) {\n if (Array.isArray(value)) {\n objectToChange[key] = [...value];\n return;\n }\n if (typeof value === 'number' || typeof value === 'string' || typeof value === 'boolean') {\n objectToChange[key] = value;\n return;\n }\n if (value !== null && typeof value === 'object') {\n objectToChange[key] = { ...value };\n }\n }\n });\n }\n\n private createObservable(origin: urlOrFunction): Observable {\n if (typeof origin === 'string') {\n return this.http.post(origin, {});\n }\n return from(Promise.resolve(origin()));\n }\n\n private mergePageOptions(originalOption: T, newPageOptions: T, optionSchema: PoPageDynamicOptionsSchema) {\n const mergePageOptions: T = optionSchema.schema.reduce(\n (objWithNewProp, prop) => ({\n ...objWithNewProp,\n [prop.nameProp]: this.createNewProp(prop, originalOption, newPageOptions)\n }),\n {} as T\n );\n\n Object.keys(mergePageOptions).forEach(key => mergePageOptions[key] === undefined && delete mergePageOptions[key]);\n\n return mergePageOptions;\n }\n\n private createNewProp(prop: PoPageDynamicOptionsProp, originalOption: T, newPageOptions: T) {\n if (prop.merge) {\n return this.mergeOptions(originalOption[prop.nameProp], newPageOptions[prop.nameProp], prop.keyForMerge);\n } else {\n return newPageOptions[prop.nameProp] ?? originalOption[prop.nameProp];\n }\n }\n\n private mergeOptions(originalOptions: Array | T, newOptions: Array | T, filterProp?: keyof T) {\n if (!originalOptions && !newOptions) {\n return;\n }\n if (!newOptions) {\n return originalOptions;\n }\n if (!originalOptions) {\n return newOptions;\n }\n\n if (originalOptions instanceof Array && newOptions instanceof Array) {\n return this.mergeOptionsArray(originalOptions, newOptions, filterProp);\n }\n\n return { ...originalOptions, ...newOptions };\n }\n\n private mergeOptionsArray(originalOptions: Array, newOptions: Array, filterProp: keyof T) {\n const deduplicateNewOptions = newOptions.filter(\n newItem => !originalOptions.find(originalItem => originalItem[filterProp] === newItem[filterProp])\n );\n const mergedOriginalOptions = originalOptions.map(originalItem => {\n const newItem =\n newOptions.find(newOptionsItem => originalItem[filterProp] === newOptionsItem[filterProp]) || originalItem;\n return { ...originalItem, ...newItem };\n });\n return [...mergedOriginalOptions, ...deduplicateNewOptions];\n }\n}\n","import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable, inject } from '@angular/core';\nimport { Observable, of } from 'rxjs';\n\nimport { PoPageDynamicDetailActions } from './interfaces/po-page-dynamic-detail-actions.interface';\nimport { PoPageDynamicDetailBeforeBack } from './interfaces/po-page-dynamic-detail-before-back.interface';\nimport { PoPageDynamicDetailBeforeRemove } from './interfaces/po-page-dynamic-detail-before-remove.interface';\nimport { PoPageDynamicDetailBeforeEdit } from './interfaces/po-page-dynamic-detail-before-edit.interface';\n\ninterface ExecuteActionParameter {\n action: string | Function;\n resource?: any;\n id?: string | number;\n}\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageDynamicDetailActionsService {\n private readonly http = inject(HttpClient);\n\n readonly headers: HttpHeaders = new HttpHeaders({\n 'X-PO-SCREEN-LOCK': 'true'\n });\n\n beforeBack(action?: PoPageDynamicDetailActions['beforeBack']): Observable {\n return this.executeAction({ action });\n }\n\n beforeEdit(\n action: PoPageDynamicDetailActions['beforeEdit'],\n id: any,\n body: any\n ): Observable {\n const resource = body ?? {};\n\n return this.executeAction({ action, resource, id });\n }\n\n beforeRemove(\n action: PoPageDynamicDetailActions['beforeRemove'],\n id: any,\n body: any\n ): Observable {\n const resource = body ?? {};\n\n return this.executeAction({ action, resource, id });\n }\n\n private executeAction({ action, resource = {}, id }: ExecuteActionParameter): Observable {\n if (!action) {\n return of({});\n }\n\n if (typeof action === 'string') {\n const url = id ? `${action}/${id}` : action;\n\n return this.http.post(url, resource, { headers: this.headers });\n }\n\n return of(action(id, resource));\n }\n}\n","import { Component, HostBinding, HostListener, Input, OnDestroy, OnInit, inject } from '@angular/core';\nimport { ActivatedRoute, Route, Router } from '@angular/router';\n\nimport { EMPTY, Observable, Subscription, concat, of, throwError } from 'rxjs';\nimport { catchError, map, switchMap, tap } from 'rxjs/operators';\n\nimport {\n PoBreadcrumb,\n PoDialogConfirmOptions,\n PoDialogService,\n PoLanguageService,\n PoNotificationService,\n PoPageAction,\n poLocaleDefault\n} from '@po-ui/ng-components';\n\nimport { convertToBoolean, getDefaultSizeFn, validateSizeFn, valuesFromObject, PoUtils } from '../../utils/util';\n\nimport { PoPageDynamicService } from '../../services/po-page-dynamic/po-page-dynamic.service';\nimport { PoPageCustomizationService } from './../../services/po-page-customization/po-page-customization.service';\nimport { PoPageDynamicOptionsSchema } from './../../services/po-page-customization/po-page-dynamic-options.interface';\nimport { PoPageDynamicDetailActions } from './interfaces/po-page-dynamic-detail-actions.interface';\nimport { PoPageDynamicDetailBeforeBack } from './interfaces/po-page-dynamic-detail-before-back.interface';\nimport { PoPageDynamicDetailBeforeEdit } from './interfaces/po-page-dynamic-detail-before-edit.interface';\nimport { PoPageDynamicDetailBeforeRemove } from './interfaces/po-page-dynamic-detail-before-remove.interface';\nimport { PoPageDynamicDetailField } from './interfaces/po-page-dynamic-detail-field.interface';\nimport { PoPageDynamicDetailMetaData } from './interfaces/po-page-dynamic-detail-metadata.interface';\nimport { PoPageDynamicDetailOptions } from './interfaces/po-page-dynamic-detail-options.interface';\nimport { PoPageDynamicDetailActionsService } from './po-page-dynamic-detail-actions.service';\n\ntype UrlOrPoCustomizationFunction = string | (() => PoPageDynamicDetailOptions);\n\nexport const poPageDynamicDetailLiteralsDefault = {\n en: {\n pageActionEdit: 'Edit',\n pageActionRemove: 'Delete',\n pageActionBack: 'Back',\n confirmRemoveTitle: 'Confirm delete',\n confirmRemoveMessage: 'Are you sure you want to delete this record? You can not undo this action.',\n removeNotificationSuccess: 'Item deleted successfully.',\n registerNotFound: 'Register not found.'\n },\n es: {\n pageActionEdit: 'Editar',\n pageActionRemove: 'Borrar',\n pageActionBack: 'Regreso',\n confirmRemoveTitle: 'Confirmar la exclusión',\n confirmRemoveMessage: '¿Está seguro de que desea eliminar este registro? No puede deshacer esta acción.',\n removeNotificationSuccess: 'Elemento eliminado con éxito.',\n registerNotFound: 'Registro no encontrado.'\n },\n pt: {\n pageActionEdit: 'Editar',\n pageActionRemove: 'Excluir',\n pageActionBack: 'Voltar',\n confirmRemoveTitle: 'Confirmar exclusão',\n confirmRemoveMessage: 'Tem certeza de que deseja excluir esse registro? Você não poderá desfazer essa ação.',\n removeNotificationSuccess: 'Item excluído com sucesso.',\n registerNotFound: 'Registro não encontrado.'\n },\n ru: {\n pageActionEdit: 'Редактировать',\n pageActionRemove: 'Удалить',\n pageActionBack: 'Назад',\n confirmRemoveTitle: 'Подтверждение удаления',\n confirmRemoveMessage: 'Вы уверены, что хотите удалить эту запись? Вы не можете отменить это действие.',\n removeNotificationSuccess: 'Элемент успешно удален.',\n registerNotFound: 'Запись не найдена.'\n }\n};\n\n/**\n * @description\n *\n * O `po-page-dynamic-detail` é uma página que serve para exibir registros em detalhes,\n * o mesmo também suporta metadados conforme especificado na documentação.\n *\n *\n * ### Utilização via rota\n *\n * Ao utilizar as rotas para inicializar o template, o `page-dynamic-detail` disponibiliza propriedades que devem ser fornecidas no arquivo de configuração de rotas da aplicação, para\n * poder especificar o endpoint dos dados e dos metadados que serão carregados na inicialização.\n *\n * Exemplo de utilização:\n *\n * Arquivo de configuração de rotas da aplicação: `app-routing.module.ts`\n * ```\n * const routes: Routes = [\n * {\n * path: 'people/:id',\n * component: PoPageDynamicDetailComponent,\n * data: {\n * serviceApi: 'http://localhost:3000/v1/people', // endpoint dos dados\n * serviceMetadataApi: 'http://localhost:3000/v1/metadata', // endpoint dos metadados utilizando o método HTTP Get\n * serviceLoadApi: 'http://localhost:3000/load-metadata' // endpoint de customizações dos metadados utilizando o método HTTP Post\n * }\n * },\n * {\n * path: 'home',\n * component: HomeExampleComponent\n * }\n * ];\n *\n * ```\n * O componente primeiro irá carregar o metadado da rota definida na propriedade serviceMetadataApi\n * e depois irá buscar da rota definida na propriedade serviceLoadApi.\n *\n * A requisição dos metadados é feita na inicialização do template para buscar os metadados da página passando o\n * tipo do metadado esperado e a versão cacheada pelo browser.\n *\n * > Caso o servidor retornar um erro ao recuperar os metadados, serão repassados os metadados salvos em cache,\n * se o cache não existir será disparada uma notificação.\n *\n * O formato esperado na resposta da requisição está especificado na interface\n * [PoPageDynamicDetailMetadata](/documentation/po-page-dynamic-detail#po-page-dynamic-detail-metadata). Por exemplo:\n *\n * ```\n * {\n * version: 1,\n * title: 'Person Detail',\n * fields: [\n * { property: 'id', key: true, disabled: true },\n * { property: 'status' },\n * { property: 'name' },\n * { property: 'nickname' },\n * { property: 'birthdate', label: 'Birth date' },\n * { property: 'genre' },\n * { property: 'city' },\n * { property: 'country' }\n * ]\n * }\n * ```\n *\n * > Caso o endpoint dos metadados não seja especificado, será feito uma requisição utilizando o `serviceApi` da seguinte forma:\n * ```\n * GET {end-point}/metadata?type=detail&version={version}\n * ```\n *\n * #### Tokens customizáveis\n *\n * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).\n *\n * | Propriedade | Descrição | Valor Padrão |\n * |---------------------|---------------------------------------------|---------------------------------------|\n * | **Header** | | |\n * | `--padding` | Espaçamento do header | `var(--spacing-xs) var(--spacing-md)` |\n * | `--gap` | Espaçamento entre os breadcrumbs e o título | `var(--spacing-md)` |\n * | `--gap-actions` | Espaçamento entre as ações | `var(--spacing-xs)` |\n * | `--font-family` | Família tipográfica do título | `var(--font-family-theme)` |\n * | **Content** | | |\n * | `--padding-content` | Espaçamento do conteúdo | `var(--spacing-xs) var(--spacing-sm)` |\n *\n * @example\n *\n * \n * \n * \n * \n */\n@Component({\n selector: 'po-page-dynamic-detail',\n templateUrl: './po-page-dynamic-detail.component.html',\n providers: [PoPageDynamicService, PoPageDynamicDetailActionsService],\n standalone: false\n})\nexport class PoPageDynamicDetailComponent implements OnInit, OnDestroy {\n private readonly router = inject(Router);\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly poNotification = inject(PoNotificationService);\n private readonly poDialogService = inject(PoDialogService);\n private readonly poPageDynamicService = inject(PoPageDynamicService);\n private readonly poPageDynamicDetailActionsService = inject(PoPageDynamicDetailActionsService);\n private readonly poPageCustomizationService = inject(PoPageCustomizationService);\n\n /** Objeto com propriedades do breadcrumb. */\n @Input('p-breadcrumb') breadcrumb?: PoBreadcrumb = { items: [] };\n\n /**\n * Função ou serviço que será executado na inicialização do componente.\n *\n * A propriedade aceita os seguintes tipos:\n * - `string`: *Endpoint* usado pelo componente para requisição via `POST`.\n * - `function`: Método que será executado.\n *\n * O retorno desta função deve ser do tipo `PoPageDynamicDetailOptions`,\n * onde o usuário poderá customizar novos campos, breadcrumb, title e actions\n *\n * Por exemplo:\n *\n * ```\n * getPageOptions(): PoPageDynamicDetailOptions {\n * return {\n * actions:\n * { new: 'new', edit: 'edit/:id', remove: true },\n * fields: [\n * { property: 'idCard', gridColumns: 6 }\n * ]\n * };\n * }\n *\n * ```\n * Para referenciar a sua função utilize a propriedade `bind`, por exemplo:\n * ```\n * [p-load]=\"onLoadOptions.bind(this)\"\n * ```\n */\n @Input('p-load') onLoad: string | (() => PoPageDynamicDetailOptions);\n\n /** Título da página. */\n @Input('p-title') title: string;\n\n /**\n * @description\n *\n * Endpoint usado pelo template para requisição do recurso que serão exibido.\n *\n * Caso a ação `remove` estiver configurada, será feito uma requisição de exclusão nesse mesmo endpoint passando os campos\n * setados como `key: true`.\n *\n * > `DELETE {end-point}/{keys}`\n *\n * ```\n * \n * \n * ```\n *\n * Resquisição disparada, onde a propriedade `id` é igual a 2:\n *\n * ```\n * DELETE /api/po-samples/v1/people/2 HTTP/1.1\n * Host: localhost:4000\n * Connection: keep-alive\n * Accept: application/json, text/plain\n * ...\n * ```\n *\n * > Caso esteja usando metadados com o template, será disparado uma requisição na inicialização do template para buscar\n * > os metadados da página passando o tipo do metadado esperado e a versão cacheada pelo browser.\n * >\n * > `GET {end-point}/metadata?type=detail&version={version}`\n */\n @Input('p-service-api') serviceApi: string;\n\n literals;\n model: any = {};\n\n private readonly subscriptions: Array = [];\n\n private _actions: PoPageDynamicDetailActions = {};\n private _autoRouter: boolean = false;\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _duplicates: Array = [];\n private _fields: Array = [];\n private _keys: Array = [];\n private _pageActions: Array = [];\n\n /**\n * @optional\n *\n * @description\n *\n * Define as ações da página de acordo com a interface `PoPageDynamicDetailActions`.\n */\n @Input('p-actions') set actions(value: PoPageDynamicDetailActions) {\n this._actions = this.isObject(value) ? value : {};\n\n this._pageActions = this.getPageActions(this._actions);\n }\n\n get actions() {\n return { ...this._actions };\n }\n\n /**\n * @todo Validar rotas na mão pois se existir uma rota '**' o catch do navigation não funciona.\n *\n * @optional\n *\n * @description\n *\n * Cria automaticamente as rotas de edição (novo/duplicate) e detalhes caso as ações\n * estejam definidas nas ações.\n *\n * > Para o correto funcionamento não pode haver nenhum rota coringa (`**`) especificada.\n *\n * @default false\n */\n @Input('p-auto-router') set autoRouter(value: boolean) {\n this._autoRouter = convertToBoolean(value);\n }\n\n get autoRouter(): boolean {\n return this._autoRouter;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /** Lista dos campos exibidos na página. */\n @Input('p-fields') set fields(value: Array) {\n this._fields = Array.isArray(value) ? [...value] : [];\n\n this._keys = this.getKeysByFields(this.fields);\n this._duplicates = this.getDuplicatesByFields(this.fields);\n }\n\n get fields(): Array {\n return this._fields;\n }\n\n /* eslint-disable max-params */\n constructor() {\n const languageService = inject(PoLanguageService);\n\n const language = languageService.getShortLanguage();\n\n this.literals = {\n ...poPageDynamicDetailLiteralsDefault[poLocaleDefault],\n ...poPageDynamicDetailLiteralsDefault[language]\n };\n }\n /* eslint-enable max-params */\n\n ngOnInit(): void {\n this.loadDataFromAPI();\n }\n\n ngOnDestroy() {\n if (this.subscriptions) {\n this.subscriptions.forEach(subscription => {\n subscription.unsubscribe();\n });\n }\n }\n\n get duplicates() {\n return [...this._duplicates];\n }\n\n get keys() {\n return [...this._keys];\n }\n\n get pageActions() {\n return [...this._pageActions];\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n private remove(\n actionRemove: PoPageDynamicDetailActions['remove'],\n actionBeforeRemove?: PoPageDynamicDetailActions['beforeRemove']\n ) {\n const uniqueKey = this.formatUniqueKey(this.model);\n\n this.subscriptions.push(\n this.poPageDynamicDetailActionsService\n .beforeRemove(actionBeforeRemove, uniqueKey, { ...this.model })\n .pipe(\n switchMap((beforeRemoveResult: PoPageDynamicDetailBeforeRemove) => {\n const newRemoveAction = beforeRemoveResult?.newUrl ?? actionRemove;\n const allowAction = beforeRemoveResult?.allowAction ?? true;\n\n if (!allowAction) {\n return of({});\n }\n\n if (typeof newRemoveAction === 'string') {\n return this.executeRemove(newRemoveAction, uniqueKey);\n } else {\n newRemoveAction(uniqueKey, { ...this.model });\n return EMPTY;\n }\n })\n )\n .subscribe()\n );\n }\n\n private confirmRemove(\n actionRemove: PoPageDynamicDetailActions['remove'],\n actionBeforeRemove: PoPageDynamicDetailActions['beforeRemove']\n ) {\n const confirmOptions: PoDialogConfirmOptions = {\n title: this.literals.confirmRemoveTitle,\n message: this.literals.confirmRemoveMessage,\n confirm: this.remove.bind(this, actionRemove, actionBeforeRemove)\n };\n\n this.poDialogService.confirm(confirmOptions);\n }\n\n private executeRemove(path, uniqueKey: any) {\n return this.poPageDynamicService.deleteResource(uniqueKey).pipe(\n map(() => {\n this.poNotification.success(this.literals.removeNotificationSuccess);\n this.navigateTo({ path: path });\n })\n );\n }\n\n private formatUniqueKey(item) {\n const keys = PoUtils.mapObjectByProperties(item, this.keys);\n\n return valuesFromObject(keys).join('|');\n }\n\n private goBack(actionBack: PoPageDynamicDetailActions['back']) {\n this.subscriptions.push(\n this.poPageDynamicDetailActionsService\n .beforeBack(this.actions.beforeBack)\n .subscribe((beforeBackResult: PoPageDynamicDetailBeforeBack) =>\n this.executeBackAction(actionBack, beforeBackResult?.allowAction, beforeBackResult?.newUrl)\n )\n );\n }\n\n private executeBackAction(actionBack: PoPageDynamicDetailActions['back'], allowAction?, newUrl?: string) {\n const isAllowedAction = typeof allowAction === 'boolean' ? allowAction : true;\n\n if (isAllowedAction) {\n if (actionBack === undefined || typeof actionBack === 'boolean') {\n return window.history.back();\n }\n\n if (typeof actionBack === 'string' || newUrl) {\n return this.router.navigate([newUrl || actionBack]);\n }\n\n return actionBack();\n }\n }\n\n private loadData(id) {\n return this.poPageDynamicService.getResource(id).pipe(\n tap(response => {\n if (!response) {\n this.setUndefinedToModelAndActions();\n } else {\n this.model = response;\n }\n }),\n catchError(error => {\n this.setUndefinedToModelAndActions();\n return throwError(error);\n })\n );\n }\n\n private setUndefinedToModelAndActions() {\n this.model = undefined;\n this.actions = undefined;\n }\n\n private getMetadata(\n serviceApiFromRoute: string,\n onLoad: UrlOrPoCustomizationFunction\n ): Observable {\n if (serviceApiFromRoute) {\n return this.poPageDynamicService.getMetadata('detail').pipe(\n tap(response => {\n this.autoRouter = response.autoRouter || this.autoRouter;\n this.actions = response.actions || this.actions;\n this.breadcrumb = response.breadcrumb || this.breadcrumb;\n this.fields = response.fields || this.fields;\n this.title = response.title || this.title;\n }),\n switchMap(() => this.loadOptionsOnInitialize(onLoad))\n );\n }\n\n return this.loadOptionsOnInitialize(onLoad);\n }\n\n // @todo Validar rotas na mão pois se existir uma rota '**' o catch do navigation não funciona.\n private navigateTo(\n route: { path: string; component?; url?: string; params?: any },\n forceStopAutoRouter: boolean = false\n ) {\n this.router.navigate([route.url || route.path], { queryParams: route.params }).catch(() => {\n if (forceStopAutoRouter || !this.autoRouter) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n this.router.config.unshift({\n path: route.path,\n component: route.component,\n data: { serviceApi: this.serviceApi, autoRouter: true }\n });\n\n this.navigateTo(route, true);\n });\n }\n\n private openEdit(action: PoPageDynamicDetailActions['edit']) {\n const id = this.formatUniqueKey(this.model);\n\n this.subscriptions.push(\n this.poPageDynamicDetailActionsService\n .beforeEdit(this.actions.beforeEdit, id, this.model)\n .pipe(\n switchMap((beforeEditResult: PoPageDynamicDetailBeforeEdit) =>\n this.executeEditAction(action, beforeEditResult, id)\n )\n )\n .subscribe()\n );\n }\n\n private executeEditAction(\n action: PoPageDynamicDetailActions['edit'],\n beforeEditResult: PoPageDynamicDetailBeforeEdit,\n id: any\n ) {\n const newEditAction = beforeEditResult?.newUrl ?? action;\n const allowAction = beforeEditResult?.allowAction ?? true;\n\n if (!allowAction) {\n return of({});\n }\n\n if (typeof newEditAction === 'string') {\n this.openEditUrl(newEditAction);\n } else {\n newEditAction(id, { ...this.model });\n }\n\n return EMPTY;\n }\n\n private openEditUrl(path: string) {\n const url = this.resolveUrl(this.model, path);\n this.navigateTo({ path, url });\n }\n\n private resolveUrl(item: any, path: string) {\n const uniqueKey = this.formatUniqueKey(item);\n\n return path.replace(/:id/g, uniqueKey);\n }\n\n private getPageActions(actions: PoPageDynamicDetailActions = {}): Array {\n const pageActions = [];\n\n if (actions.edit) {\n pageActions.push({ label: this.literals.pageActionEdit, action: this.openEdit.bind(this, actions.edit) });\n }\n\n if (actions.remove) {\n pageActions.push({\n label: this.literals.pageActionRemove,\n action: this.confirmRemove.bind(this, actions.remove, this.actions.beforeRemove),\n type: 'danger'\n });\n }\n\n if (actions.back === undefined || actions.back) {\n pageActions.push({ label: this.literals.pageActionBack, action: this.goBack.bind(this, actions.back) });\n }\n\n return pageActions;\n }\n\n private getKeysByFields(fields: Array = []) {\n return fields.filter(field => field.key === true).map(field => field.property);\n }\n\n private getDuplicatesByFields(fields: Array = []) {\n return fields.filter(field => field.duplicate === true).map(field => field.property);\n }\n\n private isObject(value: any): boolean {\n return !!value && typeof value === 'object' && !Array.isArray(value);\n }\n\n private loadDataFromAPI() {\n const { serviceApi: serviceApiFromRoute, serviceMetadataApi, serviceLoadApi } = this.activatedRoute.snapshot.data;\n const { id } = this.activatedRoute.snapshot.params;\n\n const onLoad = serviceLoadApi || this.onLoad;\n this.serviceApi = serviceApiFromRoute || this.serviceApi;\n\n this.poPageDynamicService.configServiceApi({ endpoint: this.serviceApi, metadata: serviceMetadataApi });\n\n const metadata$ = this.getMetadata(serviceApiFromRoute, onLoad);\n const data$ = this.loadData(id);\n\n this.subscriptions.push(concat(metadata$, data$).subscribe());\n }\n\n private loadOptionsOnInitialize(onLoad: UrlOrPoCustomizationFunction) {\n if (onLoad) {\n return this.getPoDynamicPageOptions(onLoad).pipe(\n tap(responsePoOption =>\n this.poPageCustomizationService.changeOriginalOptionsToNewOptions(this, responsePoOption)\n )\n );\n }\n\n return EMPTY;\n }\n\n private getPoDynamicPageOptions(onLoad: UrlOrPoCustomizationFunction): Observable {\n const originalOption: PoPageDynamicDetailOptions = {\n fields: this.fields,\n actions: this.actions,\n breadcrumb: this.breadcrumb,\n title: this.title\n };\n\n const pageOptionSchema: PoPageDynamicOptionsSchema = {\n schema: [\n {\n nameProp: 'fields',\n merge: true,\n keyForMerge: 'property'\n },\n {\n nameProp: 'actions',\n merge: true\n },\n {\n nameProp: 'breadcrumb'\n },\n {\n nameProp: 'title'\n }\n ]\n };\n\n return this.poPageCustomizationService.getCustomOptions(onLoad, originalOption, pageOptionSchema);\n }\n}\n","\n @if (model) {\n \n } @else {\n \n \n \n {{ literals.registerNotFound }}\n \n \n }\n\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { PoPageDynamicService } from './po-page-dynamic.service';\n/**\n * @description\n *\n * Módulo do serviço do po-page-dynamic-service.\n */\n@NgModule({\n imports: [CommonModule],\n providers: [PoPageDynamicService]\n})\nexport class PoPageDynamicModule {}\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport { PoDynamicModule, PoIconModule, PoModalModule, PoPageModule, PoWidgetModule } from '@po-ui/ng-components';\n\nimport { PoPageDynamicDetailComponent } from './po-page-dynamic-detail.component';\nimport { PoPageDynamicModule } from '../../services/po-page-dynamic/po-page-dynamic.module';\n\n/**\n * @description\n *\n * Módulo do template do po-page-dynamic-detail.\n */\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n RouterModule,\n PoDynamicModule,\n PoIconModule,\n PoModalModule,\n PoPageModule,\n PoWidgetModule,\n PoPageDynamicModule\n ],\n declarations: [PoPageDynamicDetailComponent],\n exports: [PoPageDynamicDetailComponent]\n})\nexport class PoPageDynamicDetailModule {}\n","import { Injectable, inject } from '@angular/core';\nimport { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { of, Observable } from 'rxjs';\n\nimport { PoPageDynamicEditActions } from './interfaces/po-page-dynamic-edit-actions.interface';\nimport { PoPageDynamicEditBeforeCancel } from './interfaces/po-page-dynamic-edit-before-cancel.interface';\nimport { PoPageDynamicEditBeforeSave } from './interfaces/po-page-dynamic-edit-before-save.interface';\nimport { PoPageDynamicEditBeforeSaveNew } from './interfaces/po-page-dynamic-edit-before-save-new.interface';\n\ninterface ExecuteActionParameter {\n action: string | Function;\n id?: string | number;\n resource?: any;\n}\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageDynamicEditActionsService {\n private readonly http = inject(HttpClient);\n\n readonly headers: HttpHeaders = new HttpHeaders({\n 'X-PO-SCREEN-LOCK': 'true'\n });\n\n beforeCancel(action: PoPageDynamicEditActions['beforeCancel']): Observable {\n return this.executeAction({ action });\n }\n\n beforeSave(\n action: PoPageDynamicEditActions['beforeSave'],\n id: string,\n body: any\n ): Observable {\n const resource = body ?? {};\n return this.executeAction({ action, resource, id });\n }\n\n beforeSaveNew(\n action: PoPageDynamicEditActions['beforeSaveNew'],\n id: string,\n body: any\n ): Observable {\n const resource = body ?? {};\n return this.executeAction({ action, resource, id });\n }\n\n private executeAction({ action, resource = {}, id }: ExecuteActionParameter): Observable {\n if (!action) {\n return of({});\n }\n\n if (typeof action === 'string') {\n const url = id ? `${action}/${id}` : action;\n\n return this.http.post(url, resource, { headers: this.headers });\n }\n\n return of(action(resource, id));\n }\n}\n","import { Component, HostBinding, HostListener, Input, OnDestroy, OnInit, ViewChild, inject } from '@angular/core';\nimport { ActivatedRoute, Router } from '@angular/router';\n\nimport { concat, EMPTY, Observable, of, Subscription, throwError } from 'rxjs';\nimport { catchError, map, switchMap, tap } from 'rxjs/operators';\n\nimport {\n PoBreadcrumb,\n PoDialogService,\n PoDynamicFormComponent,\n PoGridComponent,\n PoGridRowActions,\n PoLanguageService,\n poLocaleDefault,\n PoNotificationService,\n PoPageAction\n} from '@po-ui/ng-components';\n\nimport {\n convertToBoolean,\n getDefaultSizeFn,\n removeKeysProperties,\n validateSizeFn,\n valuesFromObject,\n PoUtils\n} from './../../utils/util';\n\nimport { PoPageCustomizationService } from '../../services/po-page-customization/po-page-customization.service';\nimport { PoPageDynamicOptionsSchema } from '../../services/po-page-customization/po-page-dynamic-options.interface';\nimport { PoPageDynamicService } from '../../services/po-page-dynamic/po-page-dynamic.service';\nimport { PoPageDynamicEditActions } from './interfaces/po-page-dynamic-edit-actions.interface';\nimport { PoPageDynamicEditBeforeCancel } from './interfaces/po-page-dynamic-edit-before-cancel.interface';\nimport { PoPageDynamicEditField } from './interfaces/po-page-dynamic-edit-field.interface';\nimport { PoPageDynamicEditLiterals } from './interfaces/po-page-dynamic-edit-literals.interface';\nimport { PoPageDynamicEditMetadata } from './interfaces/po-page-dynamic-edit-metadata.interface';\nimport { PoPageDynamicEditOptions } from './interfaces/po-page-dynamic-edit-options.interface';\nimport { PoPageDynamicEditActionsService } from './po-page-dynamic-edit-actions.service';\n\ntype UrlOrPoCustomizationFunction = string | (() => PoPageDynamicEditOptions);\ntype SaveAction = PoPageDynamicEditActions['save'] | PoPageDynamicEditActions['saveNew'];\n\nexport const poNotificationType = ['error', 'warning'];\nexport const poNotificationTypeDefault = 'warning';\n\nexport const poPageDynamicEditLiteralsDefault = {\n en: {\n cancelConfirmMessage: 'Are you sure you want to cancel this operation?',\n detailActionNew: 'New',\n pageActionCancel: 'Cancel',\n pageActionSave: 'Save',\n pageActionSaveNew: 'Save and new',\n registerNotFound: 'Register not found.',\n saveNotificationError: 'Mandatory field(s) not filled.',\n saveNotificationSuccessSave: 'Resource successfully saved.',\n saveNotificationSuccessUpdate: 'Resource successfully updated.',\n saveNotificationWarning: 'Form must be filled out correctly.'\n },\n es: {\n cancelConfirmMessage: 'Está seguro de que desea cancelar esta operación?',\n detailActionNew: 'Nuevo',\n pageActionCancel: 'Cancelar',\n pageActionSave: 'Guardar',\n pageActionSaveNew: 'Guardar y nuevo',\n registerNotFound: 'Registro no encontrado.',\n saveNotificationError: 'Campo(s) obligatorio(s) no completado(s).',\n saveNotificationSuccessSave: 'Recurso salvo con éxito.',\n saveNotificationSuccessUpdate: 'Recurso actualizado con éxito.',\n saveNotificationWarning: 'El formulario debe llenarse correctamente.'\n },\n pt: {\n cancelConfirmMessage: 'Tem certeza que deseja cancelar esta operação?',\n detailActionNew: 'Novo',\n pageActionCancel: 'Cancelar',\n pageActionSave: 'Salvar',\n pageActionSaveNew: 'Salvar e novo',\n registerNotFound: 'Registro não encontrado.',\n saveNotificationError: 'Campo(s) obrigatório(s) sem preenchimento.',\n saveNotificationSuccessSave: 'Recurso salvo com sucesso.',\n saveNotificationSuccessUpdate: 'Recurso atualizado com sucesso.',\n saveNotificationWarning: 'Formulário precisa ser preenchido corretamente.'\n },\n ru: {\n cancelConfirmMessage: 'Вы уверены, что хотите отменить эту операцию?',\n detailActionNew: 'Новый',\n pageActionCancel: 'Отменить',\n pageActionSave: 'Сохранить',\n pageActionSaveNew: 'Сохранить и создать',\n registerNotFound: 'Запись не найдена.',\n saveNotificationError: 'Обязательное поле(я) не заполнено.',\n saveNotificationSuccessSave: 'Ресурс успешно сохранен.',\n saveNotificationSuccessUpdate: 'Ресурс успешно обновлен.',\n saveNotificationWarning: 'Форма должна быть заполнена правильно.'\n }\n};\n\n/**\n * @description\n *\n * O `po-page-dynamic-edit` é uma página que pode servir para editar ou criar novos registros,\n * o mesmo também suporta metadados conforme especificado na documentação.\n *\n * ### Utilização via rota\n *\n * Ao utilizar as rotas para inicializar o template, o `page-dynamic-edit` disponibiliza propriedades que devem ser fornecidas no arquivo de configuração de rotas da aplicação, para\n * poder especificar o endpoint dos dados e dos metadados que serão carregados na inicialização.\n *\n * Exemplo de utilização:\n *\n * Arquivo de configuração de rotas da aplicação: `app-routing.module.ts`\n * ```\n * const routes: Routes = [\n * {\n * path: 'people',\n * component: PoPageDynamicEditComponent,\n * data: {\n * serviceApi: 'http://localhost:3000/v1/people', // endpoint dos dados\n * serviceMetadataApi: 'http://localhost:3000/v1/metadata', // endpoint dos metadados utilizando o método HTTP Get\n * serviceLoadApi: 'http://localhost:3000/load-metadata' // endpoint de customizações dos metadados utilizando o método HTTP Post\n * }\n * },\n * {\n * path: 'home',\n * component: HomeExampleComponent\n * }\n * ];\n *\n * ```\n * O componente primeiro irá carregar o metadado da rota definida na propriedade serviceMetadataApi\n * e depois irá buscar da rota definida na propriedade serviceLoadApi.\n *\n * A requisição dos metadados é feita na inicialização do template para buscar os metadados da página passando o\n * tipo do metadado esperado e a versão cacheada pelo browser.\n *\n * > Caso o servidor retornar um erro ao recuperar os metadados, serão repassados os metadados salvos em cache,\n * se o cache não existir será disparada uma notificação.\n *\n * Para carregar com um recurso já existente, deve-se ser incluído um parâmetro na rota chamado `id`:\n *\n * ```\n * {\n * path: 'people/:id',\n * component: PoPageDynamicEditComponent,\n * data: {\n * serviceApi: 'http://localhost:3000/v1/people', // endpoint dos dados\n * serviceMetadataApi: 'http://localhost:3000/v1/metadata', // endpoint dos metadados\n * serviceLoadApi: 'http://localhost:3000/load-metadata' // endpoint de customizações dos metadados\n * }\n * }\n * ```\n *\n * A requisição dos metadados é feita na inicialização do template para buscar os metadados da página passando o\n * tipo do metadado esperado e a versão cacheada pelo browser.\n *\n * O formato esperado na resposta da requisição está especificado na interface\n * [PoPageDynamicEditMetadata](/documentation/po-page-dynamic-edit#po-page-dynamic-edit-metadata). Por exemplo:\n *\n * ```\n * {\n * version: 1,\n * title: 'Person edit',\n * fields: [\n * { property: 'id', key: true, disabled: true },\n * { property: 'status' },\n * { property: 'name' },\n * { property: 'nickname' },\n * { property: 'birthdate', label: 'Birth date' },\n * { property: 'genre' },\n * { property: 'city' },\n * { property: 'country' }\n * ]\n * }\n * ```\n *\n * > Caso o endpoint dos metadados não seja especificado, será feito uma requisição utilizando o `serviceApi` da seguinte forma:\n * ```\n * GET {end-point}/metadata?type=edit&version={version}\n * ```\n *\n * #### Tokens customizáveis\n *\n * | Propriedade | Descrição | Valor Padrão |\n * |---------------------|---------------------------------------------|---------------------------------------|\n * | **Header** | | |\n * | `--padding` | Espaçamento do header | `var(--spacing-xs) var(--spacing-md)` |\n * | `--gap` | Espaçamento entre os breadcrumbs e o título | `var(--spacing-md)` |\n * | `--gap-actions` | Espaçamento entre as ações | `var(--spacing-xs)` |\n * | `--font-family` | Família tipográfica do título | `var(--font-family-theme)` |\n * | **Content** | | |\n * | `--padding-content` | Espaçamento do conteúdo | `var(--spacing-xs) var(--spacing-sm)` |\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n */\n@Component({\n selector: 'po-page-dynamic-edit',\n templateUrl: './po-page-dynamic-edit.component.html',\n providers: [PoPageDynamicService],\n standalone: false\n})\nexport class PoPageDynamicEditComponent implements OnInit, OnDestroy {\n private readonly router = inject(Router);\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly poNotification = inject(PoNotificationService);\n private readonly poDialogService = inject(PoDialogService);\n private readonly poPageDynamicService = inject(PoPageDynamicService);\n private readonly poPageCustomizationService = inject(PoPageCustomizationService);\n private readonly poPageDynamicEditActionsService = inject(PoPageDynamicEditActionsService);\n\n @ViewChild('dynamicForm') dynamicForm: PoDynamicFormComponent;\n @ViewChild('gridDetail') gridDetail: PoGridComponent;\n\n /** Objeto com propriedades do breadcrumb. */\n @Input('p-breadcrumb') breadcrumb?: PoBreadcrumb = { items: [] };\n\n /**\n * @description\n *\n * Endpoint usado pelo template para requisição do recurso que será exibido para edição.\n *\n * Para as ações de `save` e `saveNew`, será feito uma requisição de criação nesse mesmo endpoint passando os valores\n * preenchidos pelo usuário via payload.\n *\n * > `POST {end-point}`\n *\n * ```\n * \n * \n * ```\n *\n * Resquisição disparada, onde a propriedade `name` e `city` foram preenchidas:\n *\n * ```\n * POST /api/po-samples/v1/people HTTP/1.1\n * Host: localhost:4000\n * Connection: keep-alive\n * Accept: application/json, text/plain\n * ...\n * ```\n *\n * Request payload:\n *\n * ```\n * { \"name\": \"Fulano\", \"city\": \"Smallville\" }\n * ```\n *\n * Caso queira que o template carregue um recurso já existente, deve-se ser incluído um parametro na rota chamado `id`.\n *\n * Exemplo de configuração de rota:\n *\n * ```\n * RouterModule.forRoot([\n * ...\n * { path: 'edit/:id', component: PersonEditComponent },\n * ...\n * ],\n * ```\n *\n * Baseado nisso, na inicialização do template, será disparado uma requisição para buscar o recurso que será editado.\n *\n * > `GET {end-point}/{id}`\n *\n * Nos métodos de `save` e `saveNew`, ao invés de um `POST`, será disparado um `PUT`.\n *\n * Resquisição disparada, onde a propriedade `name` e `city` foram preenchidas / atualizadas, e o `id` da url é 2:\n *\n * ```\n * PUT /api/po-samples/v1/people/2 HTTP/1.1\n * Host: localhost:4000\n * Connection: keep-alive\n * Accept: application/json, text/plain\n * ...\n * ```\n *\n * Request payload:\n *\n * ```\n * { \"name\": \"Fulano\", \"city\": \"Metropolis\" }\n * ```\n */\n @Input('p-service-api') serviceApi: string;\n\n /** Título da página. */\n @Input('p-title') title: string;\n\n /**\n * Função ou serviço que será executado na inicialização do componente.\n *\n * A propriedade aceita os seguintes tipos:\n * - `string`: *Endpoint* usado pelo componente para requisição via `POST`.\n * - `function`: Método que será executado.\n *\n * O retorno desta função deve ser do tipo `PoPageDynamicEditOptions`,\n * onde o usuário poderá customizar novos campos, breadcrumb, title e actions\n *\n * Por exemplo:\n *\n * ```\n * getPageOptions(): PoPageDynamicEditOptions {\n * return {\n * actions:\n * { cancel: false, save: 'save/:id', saveNew: 'saveNew' },\n * fields: [\n * { property: 'idCard', gridColumns: 6 }\n * ]\n * };\n * }\n *\n * ```\n * Para referenciar a sua função utilize a propriedade `bind`, por exemplo:\n * ```\n * [p-load]=\"onLoadOptions.bind(this)\"\n * ```\n */\n @Input('p-load') onLoad: string | (() => PoPageDynamicEditOptions);\n\n /**\n * @optional\n *\n * @description\n *\n * Função que será executada após ser realizada a busca dos dados.\n *\n * A propriedade aceita os seguintes tipos:\n * - `function`: Método que será executado.\n *\n * Esta função passa por parâmetro o model e deve recebê-lo de volta com as alterações.\n * Também aceita o retorno de um Observable com o novo model.\n *\n * Por exemplo:\n *\n * ```\n * onLoadCustom(model) {\n * return { ...model, customField: 'newValue' };\n * }\n *\n * ```\n * Para referenciar a sua função utilize a propriedade `bind`, por exemplo:\n * ```\n * [p-load-data]=\"onLoadCustom.bind(this)\"\n * ```\n */\n @Input('p-load-data') onLoadData: ((model: any) => any) | ((model: any) => Observable);\n\n model: any = {};\n\n // beforeSave: return boolean\n // afterSave\n // beforeRemove: return boolean\n // afterRemove\n // beforeInsert: : return boolean\n readonly detailActions: PoGridRowActions = {};\n\n private indexFocus = 0;\n private readonly language: string;\n private readonly subscriptions: Array = [];\n private _actions: PoPageDynamicEditActions = {};\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _literals: PoPageDynamicEditLiterals;\n private _autoRouter: boolean = false;\n private _controlFields: Array = [];\n private _detailFields: Array = [];\n private _duplicates: Array = [];\n private _fields: Array = [];\n private _keys: Array = [];\n private _pageActions: Array = [];\n private _notificationType?: string = poNotificationTypeDefault;\n /**\n * @optional\n *\n * @description\n *\n * Ações da página.\n */\n @Input('p-actions') set actions(value: PoPageDynamicEditActions) {\n this._actions = this.isObject(value) ? value : {};\n\n this._pageActions = this.getPageActions(this._actions);\n }\n\n get actions() {\n return { ...this._actions };\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Objeto com as literais usadas no `po-page-dynamic-edit`.\n *\n * É possivel customizar passando um objeto com todas as literais disponíveis\n * ou passando apenas as literais que deseja customizar\n *\n * ```\n * const customLiterals: PoPageDynamicEditLiterals = {\n * detailActionNew: 'Incluir',\n * pageActionCancel: 'Descartar',\n * pageActionSave: 'Gravar',\n * pageActionSaveNew: 'Gravar e incluir',\n * registerNotFound: 'Nenhum registro encontrado.',\n * saveNotificationError: 'Campo(s) obrigatório(s) sem preenchimento.',\n * saveNotificationSuccessSave: 'Item salvo com sucesso.',\n * saveNotificationSuccessUpdate: 'Item atualizado com sucesso.',\n * saveNotificationWarning: 'Necessário preencher o formulário corretamente.'\n * };\n * ```\n *\n * E para carregar as literais customizadas, basta apenas passar o objeto para o componente.\n *\n * ```\n * \n * \n * ```\n *\n * > O valor padrão será traduzido de acordo com o idioma configurado no [`PoI18nService`](/documentation/po-i18n) ou *browser*.\n */\n @Input('p-literals') set literals(value: PoPageDynamicEditLiterals) {\n if (value instanceof Object && !(value instanceof Array)) {\n this._literals = {\n ...poPageDynamicEditLiteralsDefault[poLocaleDefault],\n ...poPageDynamicEditLiteralsDefault[this.language],\n ...value\n };\n } else {\n this._literals = poPageDynamicEditLiteralsDefault[this.language];\n }\n\n this._pageActions = this.getPageActions(this._actions);\n }\n\n get literals() {\n return this._literals || poPageDynamicEditLiteralsDefault[this.language];\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Tipo da notificação.\n *\n * É possivel definir o tipo de notificação que será exibido quando houver algum campo inválido no formulário.\n *\n * ```\n * \n * \n * ```\n *\n * > Os valores aceitos são 'warning' e 'error'.\n * @default warning\n */\n @Input('p-notification-type') set notificationType(value: string) {\n this._notificationType = poNotificationType.includes(value) ? value : poNotificationTypeDefault;\n }\n\n get notificationType() {\n return this._notificationType;\n }\n\n /**\n * @todo Validar rotas na mão pois se existir uma rota '**' o catch do navigation não funciona.\n *\n * @optional\n *\n * @description\n *\n * Cria automaticamente as rotas de edição (novo/duplicate) e detalhes caso as ações\n * estejam definidas nas ações.\n *\n * > Para o correto funcionamento não pode haver nenhum rota coringa (`**`) especificada.\n *\n * @default false\n */\n @Input('p-auto-router') set autoRouter(value: boolean) {\n this._autoRouter = convertToBoolean(value);\n }\n\n get autoRouter(): boolean {\n return this._autoRouter;\n }\n\n /** Lista dos campos usados na tabela e busca avançada. */\n @Input('p-fields') set fields(value: Array) {\n this._fields = Array.isArray(value) ? [...value] : [];\n\n this._keys = this.getKeysByFields(this._fields);\n this._duplicates = this.getDuplicatesByFields(this._fields);\n\n this._controlFields = this.getControlFields(this._fields);\n this._detailFields = this.getDetailFields(this._fields);\n }\n\n get fields(): Array {\n return this._fields;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /* eslint-disable max-params */\n constructor() {\n const languageService = inject(PoLanguageService);\n\n this.language = languageService.getShortLanguage();\n }\n /* eslint-enable max-params */\n\n ngOnInit(): void {\n this.loadDataFromAPI();\n }\n\n ngOnDestroy() {\n if (this.subscriptions) {\n this.subscriptions.forEach(subscription => {\n subscription.unsubscribe();\n });\n }\n }\n\n detailActionNew() {\n this.gridDetail.insertRow();\n }\n\n /**\n * Método que exibe `p-helper` ou executa a ação definida em `p-helper{eventOnClick}` ou em `p-additionalHelp`.\n * Para isso, será necessário configurar uma tecla de atalho utilizando o evento `keydown`.\n *\n * ```\n * import { PoPageDynamicEditModule } from '@po-ui/ng-templates';\n * ...\n * @ViewChild('dynamicEdit', { static: true }) dynamicEdit: PoPageDynamicEditComponent;\n *\n * fields: Array = [\n * {\n * property: 'name',\n * ...\n * help: 'Mensagem de ajuda.',\n * helper: 'Mensagem de ajuda complementar com o componente po-helper implementado.',\n * keydown: this.onKeyDown.bind(this, 'name')\n * },\n * ]\n *\n * onKeyDown(property: string, event: KeyboardEvent): void {\n * if (event.code === 'F9') {\n * this.dynamicEdit.showAdditionalHelp(property);\n * }\n * }\n * ```\n *\n * @param { string } property Identificador da coluna.\n */\n showAdditionalHelp(property: string) {\n this.dynamicForm.showAdditionalHelp(property);\n }\n\n get duplicates() {\n return [...this._duplicates];\n }\n\n get keys() {\n return [...this._keys];\n }\n\n get pageActions() {\n return [...this._pageActions];\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n get controlFields() {\n return this._controlFields;\n }\n\n get detailFields() {\n return this._detailFields;\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private loadDataFromAPI() {\n const { serviceApi: serviceApiFromRoute, serviceMetadataApi, serviceLoadApi } = this.activatedRoute.snapshot.data;\n const { id } = this.activatedRoute.snapshot.params;\n const { duplicate } = this.activatedRoute.snapshot.queryParams;\n\n const onLoad = serviceLoadApi || this.onLoad;\n this.serviceApi = serviceApiFromRoute || this.serviceApi;\n\n this.poPageDynamicService.configServiceApi({ endpoint: this.serviceApi, metadata: serviceMetadataApi });\n\n const metadata$ = this.getMetadata(serviceApiFromRoute, id, onLoad);\n const data$ = this.loadData(id, duplicate);\n\n this.subscriptions.push(concat(metadata$, data$).subscribe());\n }\n\n private cancel(\n actionCancel: PoPageDynamicEditActions['cancel'],\n actionBeforeCancel: PoPageDynamicEditActions['beforeCancel']\n ) {\n if (this.dynamicForm && this.dynamicForm.form.dirty) {\n this.poDialogService.confirm({\n message: this.literals.cancelConfirmMessage,\n title: this.literals.pageActionCancel,\n confirm: this.goBack.bind(this, actionCancel, actionBeforeCancel)\n });\n } else {\n this.goBack(actionCancel, actionBeforeCancel);\n }\n }\n\n private formatUniqueKey(item) {\n const keys = PoUtils.mapObjectByProperties(item, this.keys);\n\n return valuesFromObject(keys).join('|');\n }\n\n private goBack(\n actionCancel: PoPageDynamicEditActions['cancel'],\n actionBeforeCancel: PoPageDynamicEditActions['beforeCancel']\n ) {\n this.subscriptions.push(\n this.poPageDynamicEditActionsService\n .beforeCancel(actionBeforeCancel)\n .subscribe((beforeCancelResult: PoPageDynamicEditBeforeCancel) => {\n this.executeBackAction(actionCancel, beforeCancelResult?.allowAction, beforeCancelResult?.newUrl);\n })\n );\n }\n\n private executeBackAction(\n actionCancel: PoPageDynamicEditActions['cancel'],\n allowAction?: PoPageDynamicEditBeforeCancel['allowAction'],\n newUrl?: PoPageDynamicEditBeforeCancel['newUrl']\n ) {\n const isAllowedAction = typeof allowAction === 'boolean' ? allowAction : true;\n\n if (isAllowedAction) {\n if (actionCancel === undefined || typeof actionCancel === 'boolean') {\n return window.history.back();\n }\n\n if (typeof actionCancel === 'string' || newUrl) {\n return this.router.navigate([newUrl || actionCancel]);\n }\n\n return actionCancel();\n }\n }\n\n private loadData(id, duplicate?) {\n if (!id) {\n try {\n this.model = duplicate ? JSON.parse(duplicate) : {};\n } catch {\n this.model = {};\n }\n\n return EMPTY;\n }\n\n return this.poPageDynamicService.getResource(id).pipe(\n tap(response => {\n this.beforeSetModel(response);\n }),\n catchError(error => {\n this.model = undefined;\n this.actions = undefined;\n this._pageActions = [];\n return throwError(error);\n })\n );\n }\n\n private beforeSetModel(response: any) {\n if (!this.onLoadData) {\n this.model = response;\n return;\n }\n\n const onLoadDataExecution = this.onLoadData(response);\n const onLoadData$ = onLoadDataExecution instanceof Observable ? onLoadDataExecution : of(onLoadDataExecution);\n\n onLoadData$.subscribe({\n next: customModel => {\n this.model = customModel;\n },\n error: () => {\n this.model = response;\n }\n });\n }\n\n private loadOptionsOnInitialize(onLoad: UrlOrPoCustomizationFunction) {\n if (onLoad) {\n return this.getPoDynamicPageOptions(onLoad).pipe(\n tap(responsePoOption =>\n this.poPageCustomizationService.changeOriginalOptionsToNewOptions(this, responsePoOption)\n )\n );\n }\n\n return EMPTY;\n }\n\n private focusCheckboxInput(control: string): void {\n const checkboxGroup = document.querySelector(`po-checkbox-group[ng-reflect-name=${control}]`);\n if (checkboxGroup) {\n const checkBoxComponent = checkboxGroup.querySelector('po-checkbox[ng-reflect-disabled=false]');\n const labelInput: HTMLInputElement = checkBoxComponent?.querySelector('.po-checkbox-outline');\n if (labelInput) {\n labelInput.focus();\n } else {\n this.indexFocus--;\n }\n }\n }\n\n private focusControl(control: string): void {\n const inputElement: HTMLInputElement = document.querySelector(`[name=${control}]`);\n if (inputElement) {\n if (inputElement.tagName === 'INPUT') {\n inputElement.focus();\n } else {\n this.focusRadioInput(inputElement, control);\n }\n } else {\n this.focusCheckboxInput(control);\n }\n }\n\n private focusRadioInput(inputElement: Element, control: string): void {\n const radioComponent = inputElement.querySelector(\n `po-radio[ng-reflect-name=${control}][ng-reflect-disabled=false]`\n );\n if (radioComponent) {\n const radioInput = radioComponent.querySelector('input');\n radioInput.focus();\n radioInput.parentElement.parentElement.classList.add('po-radio-focus');\n } else {\n this.indexFocus--;\n }\n }\n\n private getPoDynamicPageOptions(onLoad: UrlOrPoCustomizationFunction): Observable {\n const originalOption: PoPageDynamicEditOptions = {\n fields: this.fields,\n actions: this.actions,\n breadcrumb: this.breadcrumb,\n title: this.title\n };\n\n const pageOptionSchema: PoPageDynamicOptionsSchema = {\n schema: [\n {\n nameProp: 'fields',\n merge: true,\n keyForMerge: 'property'\n },\n {\n nameProp: 'actions',\n merge: true\n },\n {\n nameProp: 'breadcrumb'\n },\n {\n nameProp: 'title'\n }\n ]\n };\n\n return this.poPageCustomizationService.getCustomOptions(onLoad, originalOption, pageOptionSchema);\n }\n\n private getMetadata(serviceApiFromRoute: string, paramId: string | number, onLoad: UrlOrPoCustomizationFunction) {\n const typeMetadata = paramId ? 'edit' : 'create';\n\n if (serviceApiFromRoute) {\n return this.poPageDynamicService.getMetadata(typeMetadata).pipe(\n tap(response => {\n this.autoRouter = response.autoRouter || this.autoRouter;\n this.actions = response.actions || this.actions;\n this.breadcrumb = response.breadcrumb || this.breadcrumb;\n this.fields = response.fields || this.fields;\n this.title = response.title || this.title;\n }),\n switchMap(() => this.loadOptionsOnInitialize(onLoad))\n );\n }\n\n return this.loadOptionsOnInitialize(onLoad);\n }\n\n private markControlsAsDirtyAndFocusFirstInvalid(): void {\n this.indexFocus = 0;\n const controls = Object.keys(this.dynamicForm.form.controls);\n\n controls.forEach(control => {\n this.dynamicForm.form.controls[control].markAsDirty();\n if (this.dynamicForm.form.controls[control].hasError('required') && this.indexFocus === 0) {\n this.focusControl(control);\n this.indexFocus++;\n }\n });\n }\n\n private navigateTo(path: string) {\n if (path) {\n const url = this.resolveUrl(this.model, path);\n\n this.router.navigate([url]);\n } else {\n window.history.back();\n }\n }\n\n private resolveUniqueKey(item: any) {\n return this.activatedRoute.snapshot.params['id'] ? this.formatUniqueKey(item) : undefined;\n }\n\n private resolveUrl(item: any, path: string) {\n const uniqueKey = this.formatUniqueKey(item);\n\n return path.replace(/:id/g, uniqueKey);\n }\n\n private executeSave(saveRedirectPath: string) {\n const saveOperation$ = this.saveOperation();\n\n return saveOperation$.pipe(\n tap(message => {\n this.poNotification.success(message);\n this.navigateTo(saveRedirectPath);\n })\n );\n }\n\n private updateModel(newResource: any = {}) {\n if (typeof newResource !== 'undefined' && Object.keys(newResource).length !== 0) {\n const dynamicNgForm = this.dynamicForm.form;\n\n removeKeysProperties(this.keys, newResource);\n\n this.model = { ...this.model, ...newResource };\n\n dynamicNgForm.form.patchValue(this.model);\n }\n }\n\n private showNotification(type: string) {\n switch (type) {\n case 'warning':\n this.poNotification.warning(this.literals.saveNotificationWarning);\n break;\n case 'error':\n this.poNotification.error(this.literals.saveNotificationError);\n break;\n }\n }\n\n private saveOperation() {\n if (this.dynamicForm.form.invalid) {\n this.markControlsAsDirtyAndFocusFirstInvalid();\n this.showNotification(this._notificationType);\n return EMPTY;\n }\n\n const paramId = this.activatedRoute.snapshot.params['id'];\n const successMsg = paramId\n ? this.literals.saveNotificationSuccessUpdate\n : this.literals.saveNotificationSuccessSave;\n\n const saveOperation$ = paramId\n ? this.poPageDynamicService.updateResource(paramId, this.model)\n : this.poPageDynamicService.createResource(this.model);\n\n return saveOperation$.pipe(map(() => successMsg));\n }\n\n private save(action: SaveAction, before: 'beforeSave' | 'beforeSaveNew' = 'beforeSave') {\n const executeOperation = {\n beforeSave: this.executeSave.bind(this),\n beforeSaveNew: this.executeSaveNew.bind(this)\n };\n\n const uniqueKey = this.resolveUniqueKey(this.model);\n\n this.subscriptions.push(\n this.poPageDynamicEditActionsService[before](this.actions[before], uniqueKey, { ...this.model })\n .pipe(\n switchMap(returnBefore => {\n const newAction = returnBefore?.newUrl ?? action;\n const allowAction = returnBefore?.allowAction ?? true;\n\n this.updateModel(returnBefore?.resource);\n\n if (!allowAction) {\n return of({});\n }\n\n if (typeof newAction === 'string') {\n return executeOperation[before](newAction);\n } else {\n newAction({ ...this.model }, uniqueKey);\n return EMPTY;\n }\n })\n )\n .subscribe()\n );\n }\n\n private executeSaveNew(path: string) {\n const paramId = this.activatedRoute.snapshot.params['id'];\n const saveOperation$ = this.saveOperation();\n\n return saveOperation$.pipe(\n tap(message => {\n if (paramId) {\n this.poNotification.success(message);\n\n this.navigateTo(path);\n } else {\n this.poNotification.success(message);\n\n this.model = {};\n this.dynamicForm.form.reset();\n }\n })\n );\n }\n\n private getKeysByFields(fields: Array = []) {\n return fields.filter(field => field.key === true).map(field => field.property);\n }\n\n private getControlFields(fields: Array = []) {\n return fields.filter(field => field.type !== 'detail');\n }\n\n private getDetailFields(fields: Array = []) {\n return fields.filter(field => field.type === 'detail');\n }\n\n private getDuplicatesByFields(fields: Array = []) {\n return fields.filter(field => field.duplicate === true).map(field => field.property);\n }\n\n private getPageActions(actions: PoPageDynamicEditActions = {}): Array {\n const pageActions: Array = [\n { label: this.literals.pageActionSave, action: this.save.bind(this, actions.save) }\n ];\n\n if (actions.saveNew) {\n pageActions.push({\n label: this.literals.pageActionSaveNew,\n action: this.save.bind(this, actions.saveNew, 'beforeSaveNew')\n });\n }\n\n if (actions.cancel === undefined || actions.cancel) {\n pageActions.push({\n label: this.literals.pageActionCancel,\n action: this.cancel.bind(this, actions.cancel, this.actions.beforeCancel)\n });\n }\n\n return pageActions;\n }\n\n private isObject(value: any): boolean {\n return !!value && typeof value === 'object' && !Array.isArray(value);\n }\n}\n","\n @if (model) {\n \n \n @if (detailFields.length > 0) {\n
\n \n
\n \n
\n \n \n
\n }\n } @else {\n \n \n \n {{ literals.registerNotFound }}\n \n \n }\n\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport {\n PoButtonModule,\n PoDividerModule,\n PoDynamicModule,\n PoGridModule,\n PoIconModule,\n PoPageModule,\n PoWidgetModule\n} from '@po-ui/ng-components';\n\nimport { PoPageDynamicEditComponent } from './po-page-dynamic-edit.component';\nimport { PoPageDynamicModule } from '../../services/po-page-dynamic/po-page-dynamic.module';\n\n/**\n * @description\n *\n * Módulo do template do po-page-dynamic-detail.\n */\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n RouterModule,\n PoButtonModule,\n PoDividerModule,\n PoDynamicModule,\n PoGridModule,\n PoIconModule,\n PoPageModule,\n PoWidgetModule,\n PoPageDynamicModule\n ],\n declarations: [PoPageDynamicEditComponent],\n exports: [PoPageDynamicEditComponent]\n})\nexport class PoPageDynamicEditModule {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { PoPageCustomizationService } from './po-page-customization.service';\n\n/**\n * @description\n *\n * Módulo do serviço do po-page-customization-service.\n */\n@NgModule({\n imports: [CommonModule],\n providers: [PoPageCustomizationService]\n})\nexport class PoPageCustomizationModule {}\n","import { Directive, EventEmitter, HostBinding, HostListener, Input, Output, ViewChild } from '@angular/core';\n\nimport {\n PoComboOption,\n PoDynamicFormField,\n PoLanguageService,\n PoModalAction,\n PoModalComponent,\n poLocaleDefault\n} from '@po-ui/ng-components';\n\nimport { convertToBoolean, getDefaultSizeFn, validateSizeFn } from '../../../utils/util';\nimport { PoPageDynamicSearchFilters } from '../interfaces/po-page-dynamic-search-filters.interface';\nimport { PoAdvancedFilterLiterals } from './po-advanced-filter-literals.interface';\n\nexport const poAdvancedFiltersLiteralsDefault = {\n en: {\n title: 'Advanced search',\n cancelLabel: 'Cancel',\n confirmLabel: 'Apply filters'\n },\n es: {\n title: 'Búsqueda avanzada',\n cancelLabel: 'Cancelar',\n confirmLabel: 'Aplicar filtros'\n },\n pt: {\n title: 'Busca avançada',\n cancelLabel: 'Cancelar',\n confirmLabel: 'Aplicar filtros'\n },\n ru: {\n title: 'Расширенный поиск',\n cancelLabel: 'отменить',\n confirmLabel: 'Применить фильтры'\n }\n};\n\n/**\n * @docsPrivate\n *\n * @description\n *\n * Filtro de busca avançada criado a partir de um formulário dinâmico.\n * Componente de uso interno.\n */\n@Directive()\nexport class PoAdvancedFilterBaseComponent {\n @ViewChild(PoModalComponent, { static: true }) poModal: PoModalComponent;\n\n /**\n * Mantém na modal de busca avançada os valores preenchidos do último filtro realizado pelo usuário.\n */\n @Input({ alias: 'p-keep-filters', transform: convertToBoolean }) keepFilters: boolean = false;\n\n /** Função que será disparada e receberá os valores do formulário ao ser clicado no botão buscar. */\n @Output('p-search-event') searchEvent = new EventEmitter();\n\n filter = {};\n language: string = poLocaleDefault;\n\n primaryAction: PoModalAction = {\n action: () => {\n const models = this.getValuesFromForm();\n\n this.searchEvent.emit(models);\n this.poModal.close();\n },\n label: this.literals.confirmLabel\n };\n\n secondaryAction: PoModalAction = {\n action: () => {\n this.poModal.close();\n },\n label: this.literals.cancelLabel\n };\n\n protected optionsServiceChosenOptions: Array = [];\n\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _filters: Array = [];\n private _literals: PoAdvancedFilterLiterals;\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * Coleção de objetos que implementam a interface PoPageDynamicSearchFilters, para definição dos campos que serão criados\n * dinamicamente.\n */\n @Input('p-filters') set filters(filters: Array) {\n this._filters = Array.isArray(filters) ? [...filters] : [];\n }\n\n get filters(): Array {\n return this._filters;\n }\n\n /** Objeto com as literais usadas no `po-advanced-filter`. */\n @Input('p-literals') set literals(value: PoAdvancedFilterLiterals) {\n if (value instanceof Object && !(value instanceof Array)) {\n this._literals = {\n ...poAdvancedFiltersLiteralsDefault[poLocaleDefault],\n ...poAdvancedFiltersLiteralsDefault[this.language],\n ...value\n };\n } else {\n this._literals = poAdvancedFiltersLiteralsDefault[this.language];\n }\n\n this.primaryAction.label = this.literals.confirmLabel;\n this.secondaryAction.label = this.literals.cancelLabel;\n }\n\n get literals() {\n return this._literals || poAdvancedFiltersLiteralsDefault[this.language];\n }\n\n constructor(languageService: PoLanguageService) {\n this.language = languageService.getShortLanguage();\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n // Retorna os models dos campos preenchidos\n private getValuesFromForm() {\n let optionServiceOptions: Array;\n\n Object.keys(this.filter).forEach(property => {\n if (this.filter[property] === undefined || this.filter[property] === '') {\n delete this.filter[property];\n }\n });\n\n if (this.optionsServiceChosenOptions.length) {\n optionServiceOptions = this.optionsServiceChosenOptions.filter((optionItem: PoComboOption) =>\n Object.values(this.filter).includes(optionItem.value)\n );\n }\n\n return { filter: this.filter, optionsService: optionServiceOptions };\n }\n}\n","import { Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core';\nimport { Subscription } from 'rxjs';\n\nimport { PoComboOption, PoDynamicFormComponent, PoLanguageService } from '@po-ui/ng-components';\n\nimport { PoPageDynamicSearchFilters } from '../interfaces/po-page-dynamic-search-filters.interface';\nimport { PoAdvancedFilterBaseComponent } from './po-advanced-filter-base.component';\n\n/**\n * @docsPrivate\n *\n * @docsExtends PoAdvancedFilterBaseComponent\n *\n * @examplePrivate\n *\n * \n * \n * \n * \n */\n@Component({\n selector: 'po-advanced-filter',\n templateUrl: './po-advanced-filter.component.html',\n standalone: false\n})\nexport class PoAdvancedFilterComponent extends PoAdvancedFilterBaseComponent implements OnDestroy, OnInit {\n @ViewChild(PoDynamicFormComponent, { static: true }) poDynamicForm: PoDynamicFormComponent;\n\n private readonly subscription = new Subscription();\n\n constructor() {\n const languageService = inject(PoLanguageService);\n\n super(languageService);\n }\n\n ngOnInit() {\n this.optionsServiceSubscribe();\n }\n\n ngOnDestroy() {\n this.subscription.unsubscribe();\n }\n\n open() {\n this.filter = this.keepFilters ? this.getInitialValuesFromFilter(this.filters) : {};\n\n this.poModal.open();\n }\n\n private getOptionsServiceItem(optionServiceObject: PoComboOption) {\n const objectItem = this.optionsServiceChosenOptions.map(option => option.value).indexOf(optionServiceObject.value);\n\n if (objectItem === -1) {\n this.optionsServiceChosenOptions = [...this.optionsServiceChosenOptions, optionServiceObject];\n }\n }\n\n private getInitialValuesFromFilter(filters: Array) {\n return filters.reduce((result, item) => Object.assign(result, { [item.property]: item.initValue }), {});\n }\n\n // Se inscreve para receber valores referentes a campos do tipo combo.\n private optionsServiceSubscribe() {\n this.subscription.add(\n this.poDynamicForm.getObjectValue().subscribe(optionServiceObject => {\n if (optionServiceObject) {\n this.getOptionsServiceItem(optionServiceObject);\n }\n })\n );\n }\n}\n","\n \n\n","import { Directive, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core';\n\nimport {\n PoBreadcrumb,\n PoDynamicFormField,\n PoLanguageService,\n PoPageAction,\n poLocaleDefault\n} from '@po-ui/ng-components';\n\nimport { convertToBoolean, convertToInt, getDefaultSizeFn, validateSizeFn } from '../../utils/util';\n\nimport { PoPageDynamicSearchFilters } from './interfaces/po-page-dynamic-search-filters.interface';\nimport { PoPageDynamicSearchLiterals } from './interfaces/po-page-dynamic-search-literals.interface';\nimport { PoPageDynamicSearchOptions } from './interfaces/po-page-dynamic-search-options.interface';\nimport { poAdvancedFiltersLiteralsDefault } from './po-advanced-filter/po-advanced-filter-base.component';\nimport { PoAdvancedFilterLiterals } from './po-advanced-filter/po-advanced-filter-literals.interface';\n\nexport const poPageDynamicSearchLiteralsDefault = {\n en: {\n disclaimerBooleanFalse: 'No',\n disclaimerBooleanTrue: 'Yes',\n disclaimerGroupTitle: 'Displaying results filtered by:',\n filterTitle: poAdvancedFiltersLiteralsDefault.en.title,\n filterCancelLabel: poAdvancedFiltersLiteralsDefault.en.cancelLabel,\n filterConfirmLabel: poAdvancedFiltersLiteralsDefault.en.confirmLabel,\n quickSearchLabel: 'Quick search:',\n searchPlaceholder: 'Search'\n },\n es: {\n disclaimerBooleanFalse: 'No',\n disclaimerBooleanTrue: 'Sí',\n disclaimerGroupTitle: 'Presentando resultados filtrados por:',\n filterTitle: poAdvancedFiltersLiteralsDefault.es.title,\n filterCancelLabel: poAdvancedFiltersLiteralsDefault.es.cancelLabel,\n filterConfirmLabel: poAdvancedFiltersLiteralsDefault.es.confirmLabel,\n quickSearchLabel: 'Búsqueda rápida:',\n searchPlaceholder: 'Buscar'\n },\n pt: {\n disclaimerBooleanFalse: 'Não',\n disclaimerBooleanTrue: 'Sim',\n disclaimerGroupTitle: 'Apresentando resultados filtrados por:',\n filterTitle: poAdvancedFiltersLiteralsDefault.pt.title,\n filterCancelLabel: poAdvancedFiltersLiteralsDefault.pt.cancelLabel,\n filterConfirmLabel: poAdvancedFiltersLiteralsDefault.pt.confirmLabel,\n quickSearchLabel: 'Pesquisa rápida:',\n searchPlaceholder: 'Pesquisar'\n },\n ru: {\n disclaimerBooleanFalse: 'Нет',\n disclaimerBooleanTrue: 'Да',\n disclaimerGroupTitle: 'Отображение результатов, отфильтрованных по:',\n filterTitle: poAdvancedFiltersLiteralsDefault.ru.title,\n filterCancelLabel: poAdvancedFiltersLiteralsDefault.ru.cancelLabel,\n filterConfirmLabel: poAdvancedFiltersLiteralsDefault.ru.confirmLabel,\n quickSearchLabel: 'Быстрый поиск:',\n searchPlaceholder: 'исследование'\n }\n};\n\n/**\n * @description\n *\n * Componente com as ações de pesquisa já definidas, bastando que o desenvolvedor implemente apenas a chamada para as APIs\n * e exiba as informações.\n *\n * #### Tokens customizáveis\n *\n * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).\n *\n * | Propriedade | Descrição | Valor Padrão |\n * |---------------------|---------------------------------------------|---------------------------------------|\n * | **Header** | | |\n * | `--padding` | Espaçamento do header | `var(--spacing-xs) var(--spacing-md)` |\n * | `--gap` | Espaçamento entre os breadcrumbs e o título | `var(--spacing-md)` |\n * | `--gap-actions` | Espaçamento entre as ações | `var(--spacing-xs)` |\n * | `--font-family` | Família tipográfica do título | `var(--font-family-theme)` |\n * | **Content** | | |\n * | `--padding-content` | Espaçamento do conteúdo | `var(--spacing-xs) var(--spacing-sm)` |\n */\n@Directive()\nexport abstract class PoPageDynamicSearchBaseComponent {\n /** Nesta propriedade deve ser definido um array de objetos que implementam a interface `PoPageAction`. */\n @Input('p-actions') actions?: Array = [];\n\n /** Objeto com propriedades do breadcrumb. */\n @Input('p-breadcrumb') breadcrumb?: PoBreadcrumb = { items: [] };\n\n /**\n * @optional\n *\n * @description\n *\n * Mantém na busca avançada os valores preenchidos do último filtro realizado pelo usuário.\n *\n * @default `false`\n */\n @Input({ alias: 'p-keep-filters', transform: convertToBoolean }) keepFilters: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Permite a utilização da pesquisa rápida junto com a pesquisa avançada.\n *\n * Desta forma, ao ter uma pesquisa avançada estabelecida e ser\n * preenchido a pesquisa rápida, o filtro será concatenado adicionando a pesquisa\n * rápida também na lista de `disclaimers`.\n *\n * > Os valores que são emitidos no `p-quick-search` e no `p-advanced-search`\n * permanecem separados durante a emissão dos valores alterados. A concatenação\n * é apenas nos `disclaimers`.\n *\n * @default `false`\n */\n @Input({ alias: 'p-concat-filters', transform: convertToBoolean }) concatFilters: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Oculta o botão para remover todos os *disclaimers* do grupo.\n *\n * > Por padrão, o mesmo é exibido à partir de dois ou mais *disclaimers* com a opção `hideClose` habilitada.\n *\n * @default `false`\n */\n @Input({ alias: 'p-hide-remove-all-disclaimer', transform: convertToBoolean })\n hideRemoveAllDisclaimer: boolean = false;\n\n /**\n * Função ou serviço que será executado na inicialização do componente.\n *\n * A propriedade aceita os seguintes tipos:\n * - `string`: *Endpoint* usado pelo componente para requisição via `POST`.\n * - `function`: Método que será executado.\n *\n * O retorno desta função deve ser do tipo `PoPageDynamicSearchOptions`,\n * onde o usuário poderá customizar novos filtros, breadcrumb, title e actions\n *\n * Por exemplo:\n *\n * ```\n * getPageOptions(): PoPageDynamicSearchOptions {\n * return {\n * actions: [\n * { label: 'Find on Google' },\n * ],\n * filters: [\n * { property: 'idCard', gridColumns: 6 }\n * ]\n * };\n * }\n *\n * ```\n * Para referenciar a sua função utilize a propriedade `bind`, por exemplo:\n * ```\n * [p-load]=\"onLoadOptions.bind(this)\"\n * ```\n */\n @Input('p-load') onLoad: string | (() => PoPageDynamicSearchOptions);\n\n /** Título da página. */\n @Input('p-title') title: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Valor padrão na busca rápida ao inicializar o componente\n *\n */\n @Input('p-quick-search-value') quickSearchValue: string;\n\n _visibleFixedFilters = true;\n\n /**\n * @optional\n *\n * @description\n *\n * Controla a visibilidade dos filtros fixos na página.\n *\n * - Quando `true` (default), todos os filtros, incluindo os fixos, são exibidos, permitindo que o usuário visualize os filtros aplicados.\n * - Quando `false`, os filtros fixos são ocultados, não sendo exibidos na interface, mas ainda sendo aplicados como filtros nas requisições.\n *\n * Esta propriedade trabalha em conjunto com a propriedade `fixed` dos filtros individuais. Filtros marcados como `fixed: true` não serão exibidos na interface do filtro avançado quando `visibleFixedFilters` for `false`, mas continuarão a ser aplicados de forma transparente ao usuário. Dessa forma, permite-se maior flexibilidade no controle de quais filtros devem ser visíveis ao usuário ou devem ser aplicados permanentemente sem interferência.\n *\n * **Exemplo de uso:**\n * ```html\n * \n * \n * ```\n */\n @Input('p-visible-fixed-filters') set visibleFixedFilters(visible: boolean) {\n this._visibleFixedFilters = visible;\n }\n\n get visibleFixedFilters(): boolean {\n return this._visibleFixedFilters;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado ao executar a pesquisa avançada, o mesmo irá repassar um objeto com os valores preenchidos no modal de pesquisa.\n *\n * > Campos não preenchidos não irão aparecer no objeto passado por parâmetro.\n */\n @Output('p-advanced-search') advancedSearch: EventEmitter = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado ao remover um ou todos os disclaimers pelo usuário.\n */\n @Output('p-change-disclaimers') changeDisclaimers: EventEmitter = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado ao realizar uma busca pelo campo de pesquisa rápida, o mesmo será chamado repassando o valor digitado.\n */\n @Output('p-quick-search') quickSearch: EventEmitter = new EventEmitter();\n\n advancedFilterLiterals: PoAdvancedFilterLiterals;\n\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _filters: Array = [];\n private _hideCloseDisclaimers: Array = [];\n private _literals: PoPageDynamicSearchLiterals;\n private _quickSearchWidth: number;\n private readonly language: string;\n\n previousFilters: Array;\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Objeto com as literais usadas no `po-page-dynamic-search`.\n *\n * Existem duas maneiras de customizar o componente, passando um objeto com todas as literais disponíveis:\n *\n * ```\n * const customLiterals: PoPageDynamicSearchLiterals = {\n * disclaimerBooleanFalse: 'Inativo',\n * disclaimerBooleanTrue: 'Ativo',\n * disclaimerGroupTitle: 'Filtros aplicados:',\n * filterTitle: 'Filtro avançado',\n * filterCancelLabel: 'Fechar',\n * filterConfirmLabel: 'Aplicar',\n * quickSearchLabel: 'Valor pesquisado:',\n * searchPlaceholder: 'Pesquise aqui'\n * };\n * ```\n *\n * Ou passando apenas as literais que deseja customizar:\n *\n * ```\n * const customLiterals: PoPageDynamicSearchLiterals = {\n * filterTitle: 'Filtro avançado'\n * };\n * ```\n *\n * E para carregar as literais customizadas, basta apenas passar o objeto para o componente.\n *\n * ```\n * \n * \n * ```\n *\n * > O valor padrão será traduzido de acordo com o idioma configurado no [`PoI18nService`](/documentation/po-i18n) ou *browser*.\n */\n @Input('p-literals') set literals(value: PoPageDynamicSearchLiterals) {\n if (value instanceof Object && !(value instanceof Array)) {\n this._literals = {\n ...poPageDynamicSearchLiteralsDefault[poLocaleDefault],\n ...poPageDynamicSearchLiteralsDefault[this.language],\n ...value\n };\n } else {\n this._literals = poPageDynamicSearchLiteralsDefault[this.language];\n }\n\n this.setAdvancedFilterLiterals(this.literals);\n }\n\n get literals() {\n return this._literals || poPageDynamicSearchLiteralsDefault[this.language];\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista dos campos usados na busca avançada. Caso o mesmo não seja passado a busca avançada não será exibida.\n */\n @Input('p-filters') set filters(filters: Array) {\n this._filters = Array.isArray(filters) ? [...filters] : [];\n }\n\n get filters(): Array {\n return this._filters;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Largura do campo de busca, utilizando o *Grid System*,\n * e limitado ao máximo de 6 colunas. O tamanho mínimo é controlado\n * conforme resolução de tela para manter a consistência do layout.\n */\n @Input('p-quick-search-width') set quickSearchWidth(value: number) {\n this._quickSearchWidth = convertToInt(value);\n }\n\n get quickSearchWidth(): number {\n return this._quickSearchWidth;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista de filtros que terão a opção de fechar ocultada\n * em seu respectivo disclaimer. Utilizar o atributo `property` do filtro.\n *\n * Exemplo de utilização:\n * ```\n * ['city','name'];\n * ```\n */\n @Input('p-hide-close-disclaimers') set hideCloseDisclaimers(value: Array) {\n this._hideCloseDisclaimers = Array.isArray(value) ? value : [];\n }\n\n get hideCloseDisclaimers(): Array {\n return this._hideCloseDisclaimers;\n }\n\n constructor(languageService: PoLanguageService) {\n this.language = languageService.getShortLanguage();\n }\n\n protected setAdvancedFilterLiterals(literals: PoPageDynamicSearchLiterals) {\n this.advancedFilterLiterals = {\n cancelLabel: literals.filterCancelLabel,\n confirmLabel: literals.filterConfirmLabel,\n title: literals.filterTitle\n };\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n stringify(columns: Array) {\n // não faz o stringify da propriedade searchService, pois pode conter objeto complexo e disparar um erro.\n return JSON.stringify(columns, (key, value) => {\n if (key !== 'searchService') {\n return value;\n }\n });\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n abstract onChangeFilters(filters: Array);\n}\n","import {\n AfterViewInit,\n ChangeDetectorRef,\n Component,\n OnChanges,\n OnDestroy,\n OnInit,\n SimpleChanges,\n ViewChild,\n inject\n} from '@angular/core';\n\nimport {\n PoComboOption,\n PoDisclaimerGroup,\n PoDisclaimerGroupRemoveAction,\n PoDynamicFieldType,\n PoDynamicFormField,\n PoLanguageService,\n PoPageFilter,\n PoPageListComponent,\n poLocaleDefault\n} from '@po-ui/ng-components';\nimport { Observable, Subscription } from 'rxjs';\n\nimport { PoPageCustomizationService } from '../../services/po-page-customization/po-page-customization.service';\nimport { capitalizeFirstLetter, getBrowserLanguage } from '../../utils/util';\n\nimport { PoPageDynamicOptionsSchema } from '../../services';\nimport { PoPageDynamicSearchFilters } from './interfaces/po-page-dynamic-search-filters.interface';\nimport { PoPageDynamicSearchOptions } from './interfaces/po-page-dynamic-search-options.interface';\nimport { PoAdvancedFilterComponent } from './po-advanced-filter/po-advanced-filter.component';\nimport {\n PoPageDynamicSearchBaseComponent,\n poPageDynamicSearchLiteralsDefault\n} from './po-page-dynamic-search-base.component';\n\ntype UrlOrPoCustomizationFunction = string | (() => PoPageDynamicSearchOptions);\n\n/**\n * @docsExtends PoPageDynamicSearchBaseComponent\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n * \n */\n@Component({\n selector: 'po-page-dynamic-search',\n templateUrl: './po-page-dynamic-search.component.html',\n standalone: false\n})\nexport class PoPageDynamicSearchComponent\n extends PoPageDynamicSearchBaseComponent\n implements OnInit, OnDestroy, AfterViewInit, OnChanges\n{\n private readonly languageService: PoLanguageService;\n private readonly poPageCustomizationService = inject(PoPageCustomizationService);\n private readonly changeDetector = inject(ChangeDetectorRef);\n\n @ViewChild(PoAdvancedFilterComponent, { static: true }) poAdvancedFilter: PoAdvancedFilterComponent;\n @ViewChild(PoPageListComponent, { static: true }) poPageList: PoPageListComponent;\n\n private loadSubscription: Subscription;\n\n private readonly _disclaimerGroup: PoDisclaimerGroup = {\n remove: this.onRemoveDisclaimer.bind(this),\n removeAll: this.onRemoveAllDisclaimers.bind(this),\n disclaimers: [],\n title: this.literals.disclaimerGroupTitle,\n hideRemoveAll: this.hideRemoveAllDisclaimer\n };\n\n private readonly _filterSettings: PoPageFilter = {\n action: this.onAction.bind(this),\n advancedAction: this.onAdvancedAction.bind(this),\n placeholder: this.literals.searchPlaceholder,\n width: this.quickSearchWidth\n };\n\n constructor() {\n const languageService = inject(PoLanguageService);\n\n super(languageService);\n\n this.languageService = languageService;\n }\n\n get disclaimerGroup() {\n return Object.assign({}, this._disclaimerGroup, {\n title: this.literals.disclaimerGroupTitle,\n hideRemoveAll: this.hideRemoveAllDisclaimer\n });\n }\n\n get filterSettings() {\n const thereAreValidFilters =\n this.filters.length > 0 && this.filters.some(filter => filter.visible === true || filter.visible === undefined);\n this._filterSettings.advancedAction = thereAreValidFilters ? this.onAdvancedAction.bind(this) : undefined;\n\n return Object.assign({}, this._filterSettings, {\n placeholder: this.literals.searchPlaceholder,\n width: this.quickSearchWidth\n });\n }\n\n ngOnInit() {\n this.setAdvancedFilterLiterals(this.literals);\n if (this.onLoad) {\n this.loadOptionsOnInitialize(this.onLoad);\n }\n //coloca o disclaimer inicial caso envie p-quick-search-value\n if (this.quickSearchValue) {\n this.onAction(this.quickSearchValue, true);\n }\n }\n\n ngOnDestroy() {\n if (this.loadSubscription) {\n this.loadSubscription.unsubscribe();\n }\n }\n\n ngAfterViewInit(): void {\n if (this.stringify(this.filters) !== this.stringify(this.previousFilters)) {\n this.onChangeFilters(this.filters);\n\n this.previousFilters = [...this.filters];\n }\n }\n\n ngOnChanges(changes: SimpleChanges) {\n const visibleFixedFilters = changes.visibleFixedFilters;\n\n if (\n visibleFixedFilters &&\n visibleFixedFilters.currentValue !== visibleFixedFilters.previousValue &&\n this.filters.some(filter => filter.fixed)\n ) {\n this.onChangeFilters(this.filters);\n this.previousFilters = [...this.filters];\n }\n }\n\n onChangeFilters(filters: Array) {\n const filterObjectWithValue = filters\n .filter(filter => filter.initValue)\n .reduce((prev, current) => ({ ...prev, ...{ [current.property]: current.initValue } }), {});\n\n if (Object.keys(filterObjectWithValue).length) {\n this.onAdvancedSearch({ filter: filterObjectWithValue });\n }\n }\n\n onAction(quickFilter: string, quickSearchValue?: boolean) {\n const disclaimerQuickSearchUpdated = {\n property: 'search',\n label: `${this.literals.quickSearchLabel} ${quickFilter}`,\n value: quickFilter,\n hideClose: this.hideCloseDisclaimers.some(hideCloseDisclaimer => hideCloseDisclaimer === 'search') || false\n };\n\n const getDisclaimersWithConcatFilters = () => [\n ...this.getDisclaimersWithoutQuickSearch(),\n disclaimerQuickSearchUpdated\n ];\n\n this._disclaimerGroup.disclaimers = this.concatFilters\n ? getDisclaimersWithConcatFilters()\n : [disclaimerQuickSearchUpdated];\n\n if (this.quickSearch.observers && this.quickSearch.observers.length > 0 && !quickSearchValue) {\n this.quickSearch.emit(quickFilter);\n }\n\n if (this.keepFilters && !this.concatFilters) {\n this.filters.forEach(element => delete element.initValue);\n }\n\n this.changeDetector.detectChanges();\n }\n\n onAdvancedAction() {\n this.poAdvancedFilter.open();\n }\n\n onAdvancedSearch(filteredItems, isAdvancedSearch?) {\n const { optionsService } = filteredItems;\n let { filter } = filteredItems;\n\n const visibleFilters =\n this.visibleFixedFilters === false\n ? this.filters.filter(filter => !('fixed' in filter) || !filter.fixed)\n : this.filters;\n\n this._disclaimerGroup.disclaimers = this.setDisclaimers(filter, optionsService, visibleFilters);\n\n this.setFilters(filter);\n\n filter = this.addComplexFilter(filter);\n\n this.advancedSearch.emit(filter);\n\n if (isAdvancedSearch) {\n this.poPageList.clearInputSearch();\n }\n }\n\n private getDisclaimersWithoutQuickSearch() {\n const quickSearchProperty = 'search';\n return this._disclaimerGroup.disclaimers.filter(item => item.property !== quickSearchProperty);\n }\n\n private setFilters(filters) {\n const formattedFilters = this.convertToFilters(filters);\n\n this.filters.forEach(element => {\n const compatibleObject = formattedFilters.find(item => item.property === element.property);\n\n if (compatibleObject) {\n element.initValue = compatibleObject.value;\n } else {\n delete element.initValue;\n }\n });\n }\n\n private convertToFilters(filters) {\n return Object.entries(filters).map(([property, value]) => ({ property, value }));\n }\n\n private optionsServiceDisclaimerLabel(value: any, optionsServiceObjectsList: Array) {\n const optionServiceMatch = optionsServiceObjectsList.find(option => option.value === value);\n\n return optionServiceMatch.label || optionServiceMatch.value;\n }\n\n private applyDisclaimerLabelValue(field: any, filterValue: any) {\n const values = Array.isArray(filterValue) ? filterValue : [filterValue];\n\n const labels = values.map(value => {\n const filteredField = field.options.find(option => option.value === value || option === value);\n\n if (filteredField) {\n return filteredField.label || filteredField.value || filteredField;\n }\n });\n\n return labels.join(', ');\n }\n\n private formatDate(date: string) {\n const year = parseInt(date.substr(0, 4), 10);\n const month = parseInt(date.substr(5, 2), 10);\n const day = parseInt(date.substr(8, 2), 10);\n\n return new Date(year, month - 1, day).toLocaleDateString(getBrowserLanguage());\n }\n\n private formatArrayToObjectKeyValue(filters: Array<{ property: string; value?: any; initValue?: any }>): {\n [key: string]: any;\n } {\n const formattedObject = filters.reduce(\n (result, item) => Object.assign(result, { [item.property]: item.value || item.initValue }),\n {}\n );\n\n Object.keys(formattedObject).forEach(key => {\n if (!formattedObject[key]) {\n delete formattedObject[key];\n }\n });\n\n return formattedObject;\n }\n\n private formatValueToCurrency(field: any, value: any) {\n const language = this.languageService.getLanguage();\n return new Intl.NumberFormat(field.locale ? field.locale : language, {\n minimumFractionDigits: 2\n }).format(value);\n }\n\n private getFieldByProperty(fields: Array, fieldName: string) {\n return fields.find((field: PoDynamicFormField) => field.property === fieldName);\n }\n\n private getFilterValueToDisclaimer(field: any, value: any, optionsServiceObjectsList?: Array) {\n if (field.optionsService && optionsServiceObjectsList) {\n return this.optionsServiceDisclaimerLabel(value, optionsServiceObjectsList);\n }\n\n if (field.type === PoDynamicFieldType.Currency && value) {\n return this.formatValueToCurrency(field, value);\n }\n\n if (field.type === PoDynamicFieldType.Date || field.type?.toLowerCase() === PoDynamicFieldType.DateTime) {\n return field.range ? this.formatDate(value.start) + ' - ' + this.formatDate(value.end) : this.formatDate(value);\n }\n\n if (field.type === PoDynamicFieldType.Boolean && typeof value === 'boolean') {\n return this.formatValueToBoolean(field, value);\n }\n\n if (field.options && value) {\n return this.applyDisclaimerLabelValue(field, value);\n }\n\n return value;\n }\n\n private formatValueToBoolean(field: PoDynamicFormField, value: boolean): string {\n if (value && field.booleanTrue) {\n return field.booleanTrue;\n }\n\n if (!value && field.booleanFalse) {\n return field.booleanFalse;\n }\n\n const language = this.languageService.getShortLanguage();\n const fallbackLiterals =\n poPageDynamicSearchLiteralsDefault[language] ?? poPageDynamicSearchLiteralsDefault[poLocaleDefault];\n\n const customLiterals = this['_literals'];\n const trueLabel = customLiterals?.disclaimerBooleanTrue ?? fallbackLiterals.disclaimerBooleanTrue;\n const falseLabel = customLiterals?.disclaimerBooleanFalse ?? fallbackLiterals.disclaimerBooleanFalse;\n\n return value ? trueLabel : falseLabel;\n }\n\n private emitChangesDisclaimers(currentDisclaimers: any) {\n this.changeDisclaimers.emit(currentDisclaimers);\n this.setFilters(this.formatArrayToObjectKeyValue(currentDisclaimers));\n }\n\n private onRemoveAllDisclaimers() {\n const disclaimersToKeep = this.getFixedFiltersDisclaimers();\n this.emitChangesDisclaimers(disclaimersToKeep);\n }\n\n private onRemoveDisclaimer(removeData: PoDisclaimerGroupRemoveAction) {\n const { currentDisclaimers } = removeData;\n\n const updatedDisclaimers = [...currentDisclaimers, ...this.getFixedFiltersDisclaimers(currentDisclaimers)];\n\n this.emitChangesDisclaimers(updatedDisclaimers);\n }\n\n private getFixedFiltersDisclaimers(currentDisclaimers?: Array): Array {\n const fixedFilters = this.filters.filter(\n filter =>\n filter.fixed === true &&\n filter.hasOwnProperty('initValue') &&\n filter.initValue !== undefined &&\n filter.initValue !== null\n );\n\n return fixedFilters\n .map(filter => ({\n property: filter.property,\n value: filter.initValue,\n label: `${filter.label}: ${filter.initValue}`,\n hideClose: true\n }))\n .filter(\n fixedFilter =>\n !currentDisclaimers || !currentDisclaimers.some(disclaimer => disclaimer.property === fixedFilter.property)\n );\n }\n\n private setDisclaimers(\n filters,\n optionsServiceObjects?: Array,\n visibleFilters?: Array\n ) {\n const disclaimers = [];\n const properties = Object.keys(filters);\n const visibleProperties = visibleFilters ? visibleFilters.map(filter => filter.property) : properties;\n\n properties.forEach(property => {\n if (visibleProperties.includes(property)) {\n const field = this.getFieldByProperty(this.filters, property);\n const label = field.label || capitalizeFirstLetter(field.property);\n const value = filters[property];\n const hideClose =\n this.hideCloseDisclaimers.some(hideCloseDisclaimer => hideCloseDisclaimer === property) || false;\n\n const valueDisplayedOnTheDisclaimerLabel = this.getFilterValueToDisclaimer(field, value, optionsServiceObjects);\n\n if (valueDisplayedOnTheDisclaimerLabel !== '') {\n disclaimers.push({\n label: `${label}: ${valueDisplayedOnTheDisclaimerLabel}`,\n property,\n value,\n hideClose\n });\n }\n }\n });\n\n return disclaimers;\n }\n\n private loadOptionsOnInitialize(onLoad: UrlOrPoCustomizationFunction) {\n this.loadSubscription = this.getPoDynamicPageOptions(onLoad).subscribe(responsePoOption =>\n this.poPageCustomizationService.changeOriginalOptionsToNewOptions(this, responsePoOption)\n );\n }\n\n private getPoDynamicPageOptions(onLoad: UrlOrPoCustomizationFunction): Observable {\n const originalOption: PoPageDynamicSearchOptions = {\n title: this.title,\n actions: this.actions,\n breadcrumb: this.breadcrumb,\n filters: this.filters,\n keepFilters: this.keepFilters,\n concatFilters: this.concatFilters,\n hideRemoveAllDisclaimer: this.hideRemoveAllDisclaimer,\n hideCloseDisclaimers: this.hideCloseDisclaimers,\n quickSearchWidth: this.quickSearchWidth\n };\n\n const pageOptionSchema: PoPageDynamicOptionsSchema = {\n schema: [\n {\n nameProp: 'filters',\n merge: true,\n keyForMerge: 'property'\n },\n {\n nameProp: 'actions',\n merge: true,\n keyForMerge: 'label'\n },\n {\n nameProp: 'breadcrumb'\n },\n {\n nameProp: 'title'\n },\n {\n nameProp: 'keepFilters'\n },\n {\n nameProp: 'concatFilters'\n },\n {\n nameProp: 'hideRemoveAllDisclaimer'\n },\n {\n nameProp: 'hideCloseDisclaimers'\n },\n {\n nameProp: 'quickSearchWidth'\n }\n ]\n };\n\n return this.poPageCustomizationService.getCustomOptions(onLoad, originalOption, pageOptionSchema);\n }\n\n private addComplexFilter(filter: object): object {\n let complexFilter;\n\n Object.keys(filter).forEach(property => {\n if (filter[property].start && filter[property].end) {\n if (!complexFilter) {\n complexFilter = '';\n } else {\n complexFilter += ' and ';\n }\n complexFilter += `${property} ge '${filter[property].start}' and ${property} le '${filter[property].end}'`;\n delete filter[property];\n }\n });\n\n if (complexFilter) {\n filter = Object.assign(filter, { $filter: complexFilter });\n }\n\n return filter;\n }\n}\n","\n \n \n\n \n\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport { PoDynamicModule, PoLanguageModule, PoModalModule, PoPageModule } from '@po-ui/ng-components';\n\nimport { PoPageCustomizationModule } from '../../services/po-page-customization/po-page-customization.module';\n\nimport { PoAdvancedFilterComponent } from './po-advanced-filter/po-advanced-filter.component';\nimport { PoPageDynamicSearchComponent } from './po-page-dynamic-search.component';\n\n/**\n * @description\n *\n * Módulo do template do po-page-dynamic-search.\n */\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n RouterModule,\n\n PoDynamicModule,\n PoLanguageModule,\n PoModalModule,\n PoPageModule,\n PoPageCustomizationModule\n ],\n declarations: [PoAdvancedFilterComponent, PoPageDynamicSearchComponent],\n exports: [PoPageDynamicSearchComponent]\n})\nexport class PoPageDynamicSearchModule {}\n","import { Input, Directive, Output, EventEmitter, output } from '@angular/core';\n\nimport { InputBoolean, PoBreadcrumb, PoTableColumnSort } from '@po-ui/ng-components';\n\nimport { convertToBoolean } from '../../utils/util';\n\nimport { PoPageDynamicTableFilters } from './interfaces/po-page-dynamic-table-filters.interface';\n\n@Directive()\nexport class PoPageDynamicListBaseComponent {\n /** Objeto com propriedades do breadcrumb. */\n @Input('p-breadcrumb') breadcrumb?: PoBreadcrumb = { items: [] };\n\n /** Endpoint da API dos recursos que serão exibidos. */\n /**\n * @description\n *\n * Endpoint usado pelo template para requisição dos recursos que serão exibidos.\n *\n * Ao realizar requisições de busca, podem ser enviados os parâmetros (caso possuam valor): `page`, `pageSize`, `search` e `order`.\n *\n * Caso a coluna estiver ordenada descendentemente será enviada da seguinte forma: `-name`, se for ordenada\n * ascendentemente será enviada apenas com o nome da coluna, por exemplo: `name`.\n *\n * Exemplo de uma requisição de busca:\n *\n * > `GET {end-point}/{resource}?page=1&pageSize=10&search=components&order=-name`\n *\n * Caso a ação `remove` estiver configurada, será feito uma requisição de exclusão nesse mesmo endpoint passando os campos\n * setados como `key: true`.\n *\n * > `DELETE {end-point}/{keys}`\n *\n * ```\n * \n * \n * ```\n *\n * Resquisição disparada, onde a propriedade `id` é igual a 2:\n *\n * ```\n * DELETE /api/po-samples/v1/people/2 HTTP/1.1\n * Host: localhost:4000\n * Connection: keep-alive\n * Accept: application/json, text/plain\n * ...\n * ```\n *\n * Para a ação `removeAll`, será feito uma requisição de exclusão em lote para esse mesmo endpoint passando, uma lista\n * de objetos com os campos setados como `key: true` via `payload`.\n *\n * > `DELETE {end-point}`\n *\n * > `Payload: [ {key}, {key} ... {key} ]`\n *\n * ```\n * \n * \n * ```\n *\n * Resquisição disparada, onde foram selecionados 3 itens para serem removidos:\n *\n * ```\n * DELETE /api/po-samples/v1/people HTTP/1.1\n * Host: localhost:4000\n * Connection: keep-alive\n * Accept: application/json, text/plain\n * ...\n * ```\n *\n * Request payload:\n *\n * ```\n * [{\"id\":2},{\"id\":4},{\"id\":5}]\n * ```\n *\n * > Caso esteja usando metadados com o template, será disparado uma requisição na inicialização do template para buscar\n * > os metadados da página passando o tipo do metadado esperado e a versão cacheada pelo browser.\n * >\n * > `GET {end-point}/metadata?type=list&version={version}`\n */\n @Input('p-service-api') serviceApi: string;\n\n /** Título da página. */\n @Input('p-title') title: string;\n\n /**\n * @optional\n *\n * @description\n * Evento disparado ao fechar o popover do gerenciador de colunas após alterar as colunas visíveis.\n *\n * O componente envia como parâmetro um array de string com as colunas visíveis atualizadas.\n * Por exemplo: [\"idCard\", \"name\", \"hireStatus\", \"age\"].\n */\n @Output('p-change-visible-columns') changeVisibleColumns = new EventEmitter>();\n\n /**\n * @optional\n *\n * @description\n * Evento disparado ao alterar o estado de fixação de uma coluna no gerenciador de colunas.\n *\n * O componente envia como parâmetro um array de string com as propriedades das colunas fixas.\n * Por exemplo: [\"name\", \"age\"].\n *\n * > Incompatível com `p-hide-action-fixed-columns`. Quando esta propriedade estiver ativa, o evento não será disparado.\n */\n changeFixedColumns = output>({ alias: 'p-change-fixed-columns' });\n\n /**\n * @optional\n *\n * @description\n * Evento disparado ao clicar no botão de restaurar padrão no gerenciador de colunas.\n *\n * O componente envia como parâmetro um array de string com as colunas configuradas inicialmente.\n * Por exemplo: [\"idCard\", \"name\", \"hireStatus\", \"age\"].\n */\n @Output('p-restore-column-manager') columnRestoreManager = new EventEmitter>();\n\n /**\n * @optional\n *\n * @description\n *\n * Evento executado ao ordenar colunas da tabela.\n *\n * Recebe um objeto `{ column, type }` onde:\n *\n * - column (`PoTableColumn`): objeto da coluna que foi clicada/ordenada.\n * - type (`PoTableColumnSortType`): tipo da ordenação.\n */\n @Output('p-sort-by') sortBy: EventEmitter = new EventEmitter();\n\n private _autoRouter: boolean = false;\n private _columns: Array = [];\n private _duplicates: Array = [];\n private _fields: Array = [];\n private _filters: Array = [];\n private _keys: Array = [];\n\n /**\n * @optional\n *\n * @description\n *\n * Cria automaticamente as rotas de edição (novo/duplicate) e detalhes caso sejam definidas ações na propriedade `p-actions`\n *\n * As rotas criadas serão baseadas na propriedade `p-actions`.\n *\n * > Para o correto funcionamento não pode haver nenhuma rota coringa (`**`) especificada.\n *\n * @default false\n */\n @Input('p-auto-router') set autoRouter(value: boolean) {\n this._autoRouter = convertToBoolean(value);\n }\n\n get autoRouter(): boolean {\n return this._autoRouter;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista dos campos usados na tabela e busca avançada.\n *\n *\n * > Caso não seja definido fields a tabela assumirá o comportamento padrão.\n */\n @Input('p-fields') set fields(fields: Array) {\n this._fields = Array.isArray(fields) ? [...fields] : [];\n\n this.setFieldsProperties(this.fields);\n }\n\n get fields(): Array {\n return this._fields;\n }\n\n set columns(value) {\n this._columns = [...(this._columns = this.sortColumnsByOrder(value))];\n }\n\n get columns() {\n return this._columns;\n }\n\n set duplicates(value: Array) {\n this._duplicates = [...value];\n }\n\n get duplicates() {\n return this._duplicates;\n }\n\n set filters(value: Array) {\n this._filters = [...value];\n }\n\n get filters() {\n return this._filters;\n }\n\n set keys(value: Array) {\n this._keys = [...value];\n }\n\n get keys() {\n return this._keys;\n }\n\n private setFieldsProperties(fields: Array) {\n let visibleFilter: boolean;\n this.filters = fields\n .filter(field => field.filter === true)\n .map(filterField => {\n visibleFilter = !(filterField.initValue && filterField.fixed);\n return { ...filterField, visible: visibleFilter };\n });\n this.columns = fields.filter(\n field => field.visible === undefined || field.visible === true || field.allowColumnsManager === true\n );\n this.keys = fields.filter(field => field.key === true).map(field => field.property);\n this.duplicates = fields.filter(field => field.duplicate === true).map(field => field.property);\n }\n\n /**\n * Ordena um array de colunas com base na propriedade `order` de cada coluna.\n *\n * Este método é utilizado para organizar as colunas de uma tabela ou qualquer coleção similar\n * que necessite de ordenação baseada em um critério numérico definido pela propriedade `order`.\n * A ordenação segue as seguintes regras:\n *\n * 1. Colunas que possuem a propriedade `order` com um valor numérico válido e maior que zero\n * são ordenadas em ordem crescente de acordo com este valor.\n *\n * 2. Colunas que não possuem a propriedade `order` ou que possuem um valor inválido ou não numérico\n * para esta propriedade são consideradas iguais em termos de ordenação e mantêm a ordem original\n * em que apareceram no array fornecido.\n *\n * 3. No caso de duas colunas com valores de `order` válidos e idênticos, a ordem entre essas duas colunas\n * é determinada pela sua ordem original no array fornecido.\n *\n * @param columns Array de colunas a ser ordenado. Cada coluna é um objeto que pode conter uma propriedade `order`.\n * O tipo `Array` é utilizado aqui para permitir flexibilidade nos objetos de coluna que podem ser passados,\n * mas espera-se que cada objeto tenha pelo menos uma propriedade `order` para a ordenação adequada.\n *\n * @returns Um novo array de colunas ordenado com base na propriedade `order`.\n */\n private sortColumnsByOrder(columns: Array): Array {\n return columns.sort((a, b) => {\n // Checa se 'order' existe e é um número válido em ambos os objetos\n const hasValidOrderA = 'order' in a && typeof a.order === 'number' && a.order > 0;\n const hasValidOrderB = 'order' in b && typeof b.order === 'number' && b.order > 0;\n\n // Se ambos têm 'order' válido, compara diretamente\n if (hasValidOrderA && hasValidOrderB) {\n return a.order - b.order;\n }\n\n // Se apenas A tem 'order' válido, A vem antes de B\n if (hasValidOrderA) {\n return -1;\n }\n\n // Se apenas B tem 'order' válido, B vem antes de A\n if (hasValidOrderB) {\n return 1;\n }\n\n // Se nenhum dos dois tem 'order' válido, mantém a ordem original (considerando como iguais neste contexto)\n return 0;\n });\n }\n}\n","import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable, inject } from '@angular/core';\n\nimport { Observable, of } from 'rxjs';\n\nimport { PoPageDynamicTableActions } from './interfaces/po-page-dynamic-table-actions.interface';\nimport { PoPageDynamicTableBeforeDuplicate } from './interfaces/po-page-dynamic-table-before-duplicate.interface';\nimport { PoPageDynamicTableBeforeEdit } from './interfaces/po-page-dynamic-table-before-edit.interface';\nimport { PoPageDynamicTableBeforeNew } from './interfaces/po-page-dynamic-table-before-new.interface';\nimport { PoPageDynamicTableBeforeRemove } from './interfaces/po-page-dynamic-table-before-remove.interface';\nimport { PoPageDynamicTableBeforeDetail } from './interfaces/po-page-dynamic-table-before-detail.interface';\nimport { PoPageDynamicTableBeforeRemoveAll } from './interfaces/po-page-dynamic-table-before-remove-all.interface';\nimport { PoPageDynamicTableCustomAction } from './interfaces/po-page-dynamic-table-custom-action.interface';\n\ninterface ExecuteActionParameter {\n action: string | Function;\n resource?: any;\n id?: string | number;\n}\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageDynamicTableActionsService {\n private readonly http = inject(HttpClient);\n\n readonly headers: HttpHeaders = new HttpHeaders({\n 'X-PO-SCREEN-LOCK': 'true'\n });\n\n beforeDuplicate(\n action: PoPageDynamicTableActions['beforeDuplicate'],\n id: any,\n body: any\n ): Observable {\n const resource = body ?? {};\n\n return this.executeAction({ action, resource, id });\n }\n\n beforeEdit(\n action: PoPageDynamicTableActions['beforeEdit'],\n id: any,\n body: any\n ): Observable {\n const resource = body ?? {};\n\n return this.executeAction({ action, resource, id });\n }\n\n beforeNew(action?: PoPageDynamicTableActions['beforeNew']): Observable {\n return this.executeAction({ action });\n }\n\n beforeRemove(\n action: PoPageDynamicTableActions['beforeRemove'],\n id: string,\n resource: any\n ): Observable {\n return this.executeAction({ action, id, resource });\n }\n\n beforeRemoveAll(\n action: PoPageDynamicTableActions['beforeRemoveAll'],\n resources: Array\n ): Observable {\n return this.executeAction({ action, resource: resources });\n }\n\n beforeDetail(\n action: PoPageDynamicTableActions['beforeDetail'],\n id: string,\n resource: any\n ): Observable {\n return this.executeAction({ action, id, resource });\n }\n\n customAction(action: PoPageDynamicTableCustomAction['action'], resource: any = []) {\n return this.executeAction({ action, resource });\n }\n\n private executeAction({ action, resource = {}, id }: ExecuteActionParameter): Observable {\n if (!action) {\n return of({});\n }\n\n if (typeof action === 'string') {\n const url = id ? `${action}/${id}` : action;\n\n return this.http.post(url, resource, { headers: this.headers });\n }\n if (id) {\n return of(action(id, resource));\n }\n return of(action(resource));\n }\n}\n","export const poPageDynamicTableLiteralsDefault = {\n en: {\n pageAction: 'New',\n pageActionRemoveAll: 'Delete',\n tableActionView: 'View',\n tableActionEdit: 'Edit',\n tableActionDuplicate: 'Duplicate',\n tableActionDelete: 'Delete',\n confirmRemoveTitle: 'Confirm delete',\n confirmRemoveMessage: 'Are you sure you want to delete this record? You can not undo this action.',\n confirmRemoveAllTitle: 'Confirm batch deletion',\n confirmRemoveAllMessage: 'Are you sure you want to delete all these records? You can not undo this action.',\n loadDataErrorNotification: 'Service not found',\n removeSuccessNotification: 'Item deleted successfully',\n removeAllSuccessNotification: 'Items deleted successfully'\n },\n es: {\n pageAction: 'Nuevo',\n pageActionRemoveAll: 'Borrar',\n tableActionView: 'Visualizar',\n tableActionEdit: 'Editar',\n tableActionDuplicate: 'Duplicar',\n tableActionDelete: 'Borrar',\n confirmRemoveTitle: 'Confirmar la exclusión',\n confirmRemoveMessage: '¿Está seguro de que desea eliminar este registro? No puede deshacer esta acción.',\n confirmRemoveAllTitle: 'Confirmar la exclusión por lotes',\n confirmRemoveAllMessage: '¿Está seguro de que desea eliminar todos estos registros? No puede deshacer esta acción.',\n loadDataErrorNotification: 'Servicio no informado.',\n removeSuccessNotification: 'Elemento eliminado con éxito',\n removeAllSuccessNotification: 'Elementos eliminados con éxito'\n },\n pt: {\n pageAction: 'Novo',\n pageActionRemoveAll: 'Excluir',\n tableActionView: 'Visualizar',\n tableActionEdit: 'Editar',\n tableActionDuplicate: 'Duplicar',\n tableActionDelete: 'Excluir',\n confirmRemoveTitle: 'Confirmar exclusão',\n confirmRemoveMessage: 'Tem certeza de que deseja excluir esse registro? Você não poderá desfazer essa ação.',\n confirmRemoveAllTitle: 'Confirmar exclusão em lote',\n confirmRemoveAllMessage:\n 'Tem certeza de que deseja excluir todos esses registros? Você não poderá desfazer essa ação.',\n loadDataErrorNotification: 'Serviço não informado.',\n removeSuccessNotification: 'Item excluido com sucesso',\n removeAllSuccessNotification: 'Items excluidos com sucesso'\n },\n ru: {\n pageAction: 'Новый',\n pageActionRemoveAll: 'Удалить',\n tableActionView: 'Просмотр',\n tableActionEdit: 'Редактировать',\n tableActionDuplicate: 'Дублировать',\n tableActionDelete: 'Удалить',\n confirmRemoveTitle: 'Подтверждение удаления',\n confirmRemoveMessage: 'Вы уверены, что хотите удалить эту запись? Вы не можете отменить это действие.',\n confirmRemoveAllTitle: 'Подтвердите удаление пакета',\n confirmRemoveAllMessage: 'Вы уверены, что хотите удалить все эти записи? Вы не можете отменить это действие.',\n loadDataErrorNotification: 'Сервис не найден',\n removeSuccessNotification: 'Элемент успешно удален',\n removeAllSuccessNotification: 'Элементы успешно удалены'\n }\n};\n","import { Component, HostBinding, HostListener, Input, OnDestroy, OnInit, inject } from '@angular/core';\nimport { ActivatedRoute, Route, Router } from '@angular/router';\n\nimport { EMPTY, Observable, Subscription, of } from 'rxjs';\nimport { map, switchMap, tap } from 'rxjs/operators';\n\nimport {\n PoDialogConfirmOptions,\n PoDialogService,\n PoLanguageService,\n PoNotificationService,\n PoPageAction,\n PoTableAction,\n PoTableColumnSort,\n PoTableColumnSortType,\n PoTableColumnSpacing,\n poLocaleDefault\n} from '@po-ui/ng-components';\n\nimport { convertToBoolean, getDefaultSizeFn, validateSizeFn, PoUtils as util } from '../../utils/util';\n\nimport { PoPageDynamicDetailComponent } from '../po-page-dynamic-detail/po-page-dynamic-detail.component';\n\nimport { PoPageDynamicService } from '../../services/po-page-dynamic/po-page-dynamic.service';\nimport { isExternalLink, removeDuplicateItemsWithArrayKey, PoUtils } from '../../utils/util';\nimport { PoPageDynamicSearchLiterals } from '../po-page-dynamic-search/interfaces/po-page-dynamic-search-literals.interface';\nimport { PoPageCustomizationService } from './../../services/po-page-customization/po-page-customization.service';\nimport { PoPageDynamicOptionsSchema } from './../../services/po-page-customization/po-page-dynamic-options.interface';\nimport { PoPageDynamicTableActions } from './interfaces/po-page-dynamic-table-actions.interface';\nimport { PoPageDynamicTableBeforeDetail } from './interfaces/po-page-dynamic-table-before-detail.interface';\nimport { PoPageDynamicTableBeforeDuplicate } from './interfaces/po-page-dynamic-table-before-duplicate.interface';\nimport { PoPageDynamicTableBeforeEdit } from './interfaces/po-page-dynamic-table-before-edit.interface';\nimport { PoPageDynamicTableBeforeNew } from './interfaces/po-page-dynamic-table-before-new.interface';\nimport { PoPageDynamicTableBeforeRemoveAll } from './interfaces/po-page-dynamic-table-before-remove-all.interface';\nimport { PoPageDynamicTableBeforeRemove } from './interfaces/po-page-dynamic-table-before-remove.interface';\nimport { PoPageDynamicTableCustomAction } from './interfaces/po-page-dynamic-table-custom-action.interface';\nimport { PoPageDynamicTableCustomTableAction } from './interfaces/po-page-dynamic-table-custom-table-action.interface';\nimport { PoPageDynamicTableMetaData } from './interfaces/po-page-dynamic-table-metadata.interface';\nimport { PoPageDynamicTableOptions } from './interfaces/po-page-dynamic-table-options.interface';\nimport { PoPageDynamicListBaseComponent } from './po-page-dynamic-list-base.component';\nimport { PoPageDynamicTableActionsService } from './po-page-dynamic-table-actions.service';\nimport { poPageDynamicTableLiteralsDefault } from './po-page-dynamic-table-literals';\n\nconst PAGE_SIZE_DEFAULT = 10;\n\ntype UrlOrPoCustomizationFunction = string | (() => PoPageDynamicTableOptions);\n\n/**\n * @docsExtends PoPageDynamicListBaseComponent\n *\n * @description\n *\n * O `po-page-dynamic-table` é uma página que exibe uma lista de registros em uma tabela baseado em uma lista de fields,\n * o mesmo também suporta metadados conforme especificado na documentação.\n *\n * ### Utilização via rota\n *\n * Ao utilizar as rotas para inicializar o template, o `page-dynamic-table` disponibiliza propriedades que devem ser fornecidas no arquivo de configuração de rotas da aplicação, para\n * poder especificar o endpoint dos dados e dos metadados que serão carregados na inicialização.\n *\n * Exemplo de utilização:\n *\n * Arquivo de configuração de rotas da aplicação: `app-routing.module.ts`\n * ```\n * const routes: Routes = [\n * {\n * path: 'people',\n * component: PoPageDynamicTableComponent,\n * data: {\n * serviceApi: 'http://localhost:3000/v1/people', // endpoint dos dados\n * serviceMetadataApi: 'http://localhost:3000/v1/metadata', // endpoint dos metadados utilizando o método HTTP Get\n * serviceLoadApi: 'http://localhost:3000/load-metadata' // endpoint de customizações dos metadados utilizando o método HTTP Post\n * }\n * },\n * {\n * path: 'home',\n * component: HomeExampleComponent\n * }\n * ];\n *\n * ```\n * O componente primeiro irá carregar o metadado da rota definida na propriedade serviceMetadataApi\n * e depois irá buscar da rota definida na propriedade serviceLoadApi.\n *\n * A requisição dos metadados é feita na inicialização do template para buscar os metadados da página passando o\n * tipo do metadado esperado e a versão cacheada pelo browser.\n *\n * > Caso o servidor retornar um erro ao recuperar os metadados, serão repassados os metadados salvos em cache,\n * se o cache não existir será disparada uma notificação.\n *\n * O formato esperado na resposta da requisição está especificado na interface\n * [PoPageDynamicTableMetadata](/documentation/po-page-dynamic-table#po-page-dynamic-table-metadata). Por exemplo:\n *\n * ```\n * {\n * version: 1,\n * title: 'Person Table',\n * fields: [\n * { property: 'id', key: true, disabled: true },\n * { property: 'status' },\n * { property: 'name' },\n * { property: 'nickname' },\n * { property: 'birthdate', label: 'Birth date' },\n * { property: 'genre' },\n * { property: 'city' },\n * { property: 'country' }\n * ],\n * keepFilters: true\n * }\n * ```\n *\n * > Caso o endpoint dos metadados não seja especificado, será feito uma requisição utilizando o `serviceApi` da seguinte forma:\n * ```\n * GET {end-point}/metadata?type=list&version={version}\n * ```\n *\n * #### Tokens customizáveis\n *\n * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).\n *\n * | Propriedade | Descrição | Valor Padrão |\n * |---------------------|---------------------------------------------|---------------------------------------|\n * | **Header** | | |\n * | `--padding` | Espaçamento do header | `var(--spacing-xs) var(--spacing-md)` |\n * | `--gap` | Espaçamento entre os breadcrumbs e o título | `var(--spacing-md)` |\n * | `--gap-actions` | Espaçamento entre as ações | `var(--spacing-xs)` |\n * | `--font-family` | Família tipográfica do título | `var(--font-family-theme)` |\n * | **Content** | | |\n * | `--padding-content` | Espaçamento do conteúdo | `var(--spacing-xs) var(--spacing-sm)` |\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n */\n@Component({\n selector: 'po-page-dynamic-table',\n templateUrl: './po-page-dynamic-table.component.html',\n providers: [PoPageDynamicService],\n standalone: false\n})\nexport class PoPageDynamicTableComponent extends PoPageDynamicListBaseComponent implements OnInit, OnDestroy {\n private readonly router = inject(Router);\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly poDialogService = inject(PoDialogService);\n private readonly poNotification = inject(PoNotificationService);\n private readonly poPageDynamicService = inject(PoPageDynamicService);\n private readonly poPageCustomizationService = inject(PoPageCustomizationService);\n private readonly poPageDynamicTableActionsService = inject(PoPageDynamicTableActionsService);\n\n /**\n * Função ou serviço que será executado na inicialização do componente.\n *\n * A propriedade aceita os seguintes tipos:\n * - `string`: *Endpoint* usado pelo componente para requisição via `POST`.\n * - `function`: Método que será executado.\n *\n * O retorno desta função deve ser do tipo `PoPageDynamicTableOptions`,\n * onde o usuário poderá customizar novos campos, breadcrumb, title e actions\n *\n * Por exemplo:\n *\n * ```\n * getPageOptions(): PoPageDynamicTableOptions {\n * return {\n * actions:\n * { new: 'new', edit: 'edit/:id', remove: true },\n * fields: [\n * { property: 'idCard', gridColumns: 6 }\n * ]\n * };\n * }\n *\n * ```\n * Para referenciar a sua função utilize a propriedade `bind`, por exemplo:\n * ```\n * [p-load]=\"onLoadOptions.bind(this)\"\n * ```\n */\n @Input('p-load') onLoad: string | (() => PoPageDynamicTableOptions);\n\n /**\n * @optional\n *\n * @description\n *\n * Mantém na modal de `Busca Avançada` os valores preenchidos do último filtro realizado pelo usuário.\n *\n * @default `false`\n */\n @Input({ alias: 'p-keep-filters', transform: convertToBoolean }) keepFilters: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Define que a coluna de ações ficará no lado direito da tabela.\n *\n * @default `false`\n */\n @Input({ alias: 'p-actions-right', transform: convertToBoolean }) actionRight: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Permite a utilização da pesquisa rápida junto com a pesquisa avançada.\n *\n * Desta forma, ao ter uma pesquisa avançada estabelecida e ser\n * preenchido a pesquisa rápida, o filtro será concatenado adicionando a pesquisa\n * rápida também na lista de `disclaimers` a aplicando uma nova busca com a concatenação.\n *\n * Por exemplo, com os seguintes filtros aplicados:\n * - filtro avançado: `{ name: 'Mike', age: '12' }`\n * - filtro rápido: `{ search: 'paper' }`\n *\n * A requisição dos dados na API ficará com os parâmetros:\n * ```\n * page=1&pageSize=10&name=Mike&age=12&search=paper\n * ```\n *\n * @default `false`\n */\n @Input({ alias: 'p-concat-filters', transform: convertToBoolean }) concatFilters: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Permite que o gerenciador de colunas, responsável pela definição de quais colunas serão exibidas, seja escondido.\n *\n * @default `false`\n */\n @Input({ alias: 'p-hide-columns-manager', transform: convertToBoolean })\n hideColumnsManager: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Oculta o botão para remover todos os *disclaimers* do grupo.\n *\n * > Por padrão, o mesmo é exibido à partir de dois ou mais *disclaimers* com a opção `hideClose` habilitada.\n *\n * @default `false`\n */\n @Input({ alias: 'p-hide-remove-all-disclaimer', transform: convertToBoolean })\n hideRemoveAllDisclaimer: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Se verdadeiro, ativa a funcionalidade de scroll infinito para a tabela e o botão \"Carregar Mais\" deixará de ser exibido. Ao chegar no fim da tabela\n * executará a função `p-show-more`.\n *\n * **Regras de utilização:**\n * - O scroll infinito só funciona para tabelas que utilizam a propriedade `p-height` e que possuem o scroll já na carga inicial dos dados.\n *\n * @default `false`\n */\n @Input({ alias: 'p-infinite-scroll', transform: convertToBoolean }) infiniteScroll: boolean = false;\n\n hasNext = false;\n items = [];\n literals;\n pageActions: Array = [];\n tableActions: Array = [];\n\n private _actions: PoPageDynamicTableActions = {};\n private _pageCustomActions: Array = [];\n private _height: number;\n private _oldQuickSearchParam: string;\n private _quickSearchParam: string = 'search';\n private _quickSearchValue: string;\n private _quickSearchWidth: number;\n private _tableCustomActions: Array = [];\n\n private page: number = 1;\n private currentPage: number = 1;\n private itemSelectedAction;\n private params = {};\n private sortedColumn: PoTableColumnSort;\n private readonly subscriptions = new Subscription();\n private hasCustomActionWithSelectable = false;\n\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _customPageListActions: Array = [];\n private _customTableActions: Array = [];\n private _defaultPageActions: Array = [];\n private _defaultTableActions: Array = [];\n private _hideCloseDisclaimers: Array = [];\n private _draggable = false;\n private _virtualScroll?: boolean = true;\n\n private set defaultPageActions(value: Array) {\n this._defaultPageActions = value;\n this.updatePageActions();\n }\n\n private set defaultTableActions(value: Array) {\n this._defaultTableActions = value;\n this.updateTableActions();\n }\n\n private set customPageListActions(value: Array) {\n this._customPageListActions = value;\n this.updatePageActions();\n }\n\n private set customTableActions(value: Array) {\n this._customTableActions = value;\n this.updateTableActions();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Ações da página e da tabela.\n * > Caso utilizar a ação padrão de excluir, a mesma será exibida por último na tabela.\n */\n @Input('p-actions') set actions(value: PoPageDynamicTableActions) {\n this._actions = value && typeof value === 'object' && Object.keys(value).length > 0 ? value : {};\n\n this.setPageActions(this.actions);\n this.setRemoveAllAction();\n this.setTableActions(this.actions);\n }\n\n get actions(): PoPageDynamicTableActions {\n return this._actions;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista de ações customizadas da página que serão incorporadas às ações\n * informadas através da propriedade `p-actions`.\n *\n * Essas ações ficam localizadas na parte superior da página em botões com ações.\n *\n * Exemplo de utilização:\n * ```\n * [\n * { label: 'Export', action: this.export.bind(this) },\n * { label: 'Print', action: this.print.bind(this) }\n * ];\n * ```\n */\n @Input('p-page-custom-actions') set pageCustomActions(value: Array) {\n this._pageCustomActions = Array.isArray(value) ? value : [];\n\n this.customPageListActions = this.transformCustomActionsToPageListAction(this.pageCustomActions);\n this.hasCustomActionWithSelectable = this.pageCustomActions.some(customAction => customAction.selectable);\n }\n\n get pageCustomActions(): Array {\n return this._pageCustomActions;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista de ações customizadas na tabela da página que serão incorporadas às ações\n * informadas através da propriedade `p-actions`.\n *\n * Exemplo de utilização:\n * ```\n * [\n * { label: 'Apply discount', action: this.applyDiscount.bind(this) },\n * { label: 'Details', action: this.details.bind(this) }\n * ];\n * ```\n * > Caso utilizar a ação padrão de excluir, a mesma será exibida por último na tabela.\n */\n @Input('p-table-custom-actions') set tableCustomActions(value: Array) {\n this._tableCustomActions = Array.isArray(value) ? value : [];\n\n this.customTableActions = this.transformTableCustomActionsToTableActions(this.tableCustomActions);\n }\n\n get tableCustomActions(): Array {\n return this._tableCustomActions;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Largura do campo de busca, utilizando o *Grid System*,\n * e limitado ao máximo de 6 colunas. O tamanho mínimo é controlado\n * conforme resolução de tela para manter a consistência do layout.\n */\n @Input('p-quick-search-width') set quickSearchWidth(value: number) {\n this._quickSearchWidth = util.convertToInt(value);\n }\n\n get quickSearchWidth(): number {\n return this._quickSearchWidth;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define a altura da tabela em *pixels* e fixa o cabeçalho.\n */\n @Input('p-height') set height(value: number) {\n this._height = util.convertToInt(value);\n }\n\n get height(): number {\n return this._height;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Lista de filtros que terão a opção de fechar ocultada\n * em seu respectivo disclaimer. Utilizar o atributo `property` do campo.\n *\n * Exemplo de utilização:\n * ```\n * ['city','name'];\n * ```\n */\n @Input('p-hide-close-disclaimers') set hideCloseDisclaimers(value: Array) {\n this._hideCloseDisclaimers = Array.isArray(value) ? value : [];\n }\n\n get hideCloseDisclaimers(): Array {\n return this._hideCloseDisclaimers;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Identificador do parâmetro enviado ao serviço ao realizar uma busca rápida.\n *\n * @default 'search'\n */\n @Input('p-quick-search-param') set quickSearchParam(value: string) {\n this._quickSearchParam = value ?? 'search';\n }\n\n get quickSearchParam(): string {\n return this._quickSearchParam;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Valor padrão na busca rápida ao inicializar o componente\n *\n */\n @Input('p-quick-search-value') set quickSearchValue(value: string) {\n this._quickSearchValue = value;\n }\n\n get quickSearchValue(): string {\n return this._quickSearchValue;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Objeto com as literais usadas no `po-page-dynamic-table`.\n *\n * Existem duas maneiras de customizar o componente, passando um objeto com todas as literais disponíveis:\n *\n * ```\n * const customLiterals: PoPageDynamicSearchLiterals = {\n * disclaimerBooleanFalse: 'Inativo',\n * disclaimerBooleanTrue: 'Ativo',\n * disclaimerGroupTitle: 'Filtros aplicados:',\n * filterTitle: 'Filtro avançado',\n * filterCancelLabel: 'Fechar',\n * filterConfirmLabel: 'Aplicar',\n * quickSearchLabel: 'Valor pesquisado:',\n * searchPlaceholder: 'Pesquise aqui'\n * };\n * ```\n *\n * Ou passando apenas as literais que deseja customizar:\n *\n * ```\n * const customLiterals: PoPageDynamicSearchLiterals = {\n * filterTitle: 'Filtro avançado'\n * };\n * ```\n *\n * E para carregar as literais customizadas, basta apenas passar o objeto para o componente.\n *\n * ```\n * \n * \n * ```\n *\n * > O valor padrão será traduzido de acordo com o idioma configurado no [`PoI18nService`](/documentation/po-i18n) ou *browser*.\n */\n @Input('p-literals') searchLiterals: PoPageDynamicSearchLiterals;\n\n /**\n * @optional\n *\n * @description\n *\n * Define o espaçamento interno das células, impactando diretamente na altura das linhas do table. Os valores\n * permitidos são definidos pelo enum **PoTableColumnSpacing**.\n *\n * > Em nível de acessibilidade **AA**, caso o valor de `p-spacing` não seja definido, o valor padrão será\n * > `extraSmall` nos seguintes cenários:\n * > - Quando o valor de `p-components-size` for `small`;\n * > - Quando o valor padrão dos componentes for configurado como `small` no\n * > [serviço de tema](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n @Input('p-spacing') spacing: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Habilita ou desabilita a quebra automática de texto. Quando ativada, o texto que excede\n * o espaço disponível é transferido para a próxima linha em pontos apropriados para uma\n * leitura clara.\n *\n * > Incompatível com `virtual-scroll`, que requer altura fixa nas linhas.\n *\n * @default `false`\n */\n @Input({ alias: 'p-text-wrap', transform: convertToBoolean }) textWrap?: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Habilita o modo drag and drop para as colunas da tabela.\n *\n */\n @Input('p-draggable') set draggable(value: boolean) {\n this._draggable = value;\n }\n\n get draggable(): boolean {\n return this._draggable;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Habilita o `virtual-scroll` na tabela para melhorar a performance com grandes volumes de dados.\n * Requer altura (`p-height`) para funcionar corretamente.\n *\n * > Incompatível com `p-text-wrap` e `master-detail`, pois o `virtual-scroll` exige altura fixa nas linhas.\n *\n * @default `true`\n */\n @Input('p-virtual-scroll') set virtualScroll(value: boolean) {\n this._virtualScroll = convertToBoolean(value && this.height > 0);\n }\n\n get virtualScroll() {\n return this._virtualScroll;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Controla a visibilidade dos filtros fixos na página.\n *\n * - Quando `true` (default), todos os filtros, incluindo os fixos, são exibidos, permitindo que o usuário visualize os filtros aplicados.\n * - Quando `false`, os filtros fixos são ocultados, não sendo exibidos na interface, mas ainda sendo aplicados como filtros nas requisições.\n *\n * Esta propriedade trabalha em conjunto com a propriedade `fixed` dos filtros individuais. Filtros marcados como `fixed: true` não serão exibidos na interface do filtro avançado quando `visibleFixedFilters` for `false`, mas continuarão a ser aplicados de forma transparente ao usuário. Dessa forma, permite-se maior flexibilidade no controle de quais filtros devem ser visíveis ao usuário ou devem ser aplicados permanentemente sem interferência.\n *\n * **Exemplo de uso:**\n * ```html\n * \n * \n * ```\n */\n @Input('p-visible-fixed-filters') visibleFixedFilters: boolean = true;\n\n /* eslint-disable max-params */\n constructor() {\n const languageService = inject(PoLanguageService);\n\n super();\n\n const language = languageService.getShortLanguage();\n\n this.literals = {\n ...poPageDynamicTableLiteralsDefault[poLocaleDefault],\n ...poPageDynamicTableLiteralsDefault[language]\n };\n }\n /* eslint-enable max-params */\n\n ngOnInit(): void {\n this.loadDataFromAPI();\n }\n\n ngOnDestroy() {\n this.subscriptions.unsubscribe();\n }\n\n onAdvancedSearch(filter) {\n this.subscriptions.add(this.loadData({ page: 1, ...filter }).subscribe());\n this.params = filter;\n\n if (this.keepFilters) {\n this.updateFilterValue(filter);\n }\n }\n\n onChangeDisclaimers(disclaimers) {\n const filter = {};\n\n disclaimers.forEach(disclaimer => {\n filter[disclaimer.property] = disclaimer.value;\n });\n\n this.onAdvancedSearch(filter);\n }\n\n onQuickSearch(termTypedInQuickSearch) {\n const quickSearchParam = termTypedInQuickSearch ? { [this.quickSearchParam]: termTypedInQuickSearch } : {};\n this.params = this.concatFilters ? { ...this.params, ...quickSearchParam } : { ...quickSearchParam };\n\n if (this._oldQuickSearchParam in this.params && this._oldQuickSearchParam !== this.quickSearchParam) {\n delete this.params[this._oldQuickSearchParam];\n }\n\n this._oldQuickSearchParam = this.quickSearchParam;\n this.subscriptions.add(this.loadData(termTypedInQuickSearch ? { page: 1, ...this.params } : undefined).subscribe());\n }\n\n onSort(sortedColumn: PoTableColumnSort) {\n if (this.height) {\n const order = sortedColumn.type === 'ascending' ? true : false;\n util.sortArrayOfObjects(this.items, sortedColumn.column.property, order);\n }\n this.sortedColumn = sortedColumn;\n }\n\n onChangeVisibleColumns(value) {\n this.changeVisibleColumns.emit(value);\n }\n\n onChangeFixedColumns(value: Array) {\n this.changeFixedColumns.emit(value);\n }\n\n onColumnRestoreManager(value: Array) {\n this.columnRestoreManager.emit(value);\n }\n\n onSortBy(sortedColumn: PoTableColumnSort) {\n this.sortBy.emit(sortedColumn);\n }\n\n showMore() {\n this.subscriptions.add(this.loadData({ page: ++this.page, ...this.params }).subscribe());\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n get enableSelectionTable() {\n return this.hasActionRemoveAll || this.hasCustomActionWithSelectable;\n }\n\n get hasActionRemoveAll() {\n return !!this.actions.removeAll;\n }\n\n /**\n * Função que realiza a atualização dos dados da tabela.\n *\n * Para utilizá-la é necessário capturar a instância do `page dynamic table`, como por exemplo:\n *\n * ``` html\n * \n * ```\n *\n * ``` javascript\n * import { PoPageDynamicTableComponent, PoDynamicFormField } from '@po-ui/ng-components';\n *\n * ...\n *\n * @ViewChild('dynamicTable', { static: true }) dynamicTable: PoPageDynamicTableComponent;\n *\n * pageCustomActions: Array = [\n * {\n * label: 'Update',\n * action: this.updateTable.bind(this),\n * icon: 'an-arrows-clockwise'\n * }]\n *\n * updateTable() {\n * this.dynamicTable.updateDataTable();\n * }\n * ```\n *\n *\n * @param {{page: number, key: value }} filter Propriedade para envio de um filtro customizado.\n * Exemplo de envio:\n *\n *```\n * this.dynamicTable.updateDataTable({page: 3, search: 'Brasil'});\n * ```\n * Caso não seja passado um filtro customizado para o método `updateDataTable` a tabela será atualizada conforme a página do ultimo item modificado.\n */\n public updateDataTable(filter?: any) {\n const indexItemSelected = this.items.findIndex(item => item === this.itemSelectedAction);\n const pageNumber = Math.floor(indexItemSelected / PAGE_SIZE_DEFAULT);\n this.currentPage = pageNumber < 0 ? this.currentPage : pageNumber + 1;\n if (this.currentPage === undefined) {\n this.currentPage = 1;\n }\n\n if (filter) {\n this.subscriptions.add(this.loadData(filter).subscribe());\n } else {\n this.subscriptions.add(this.loadData({ page: this.currentPage, ...this.params }).subscribe());\n }\n }\n\n private confirmRemove(\n actionRemove: PoPageDynamicTableActions['remove'],\n actionBeforeRemove: PoPageDynamicTableActions['beforeRemove'],\n item\n ) {\n const confirmOptions: PoDialogConfirmOptions = {\n title: this.literals.confirmRemoveTitle,\n message: this.literals.confirmRemoveMessage,\n componentsSize: this.componentsSize,\n confirm: this.remove.bind(this, item, actionRemove, actionBeforeRemove)\n };\n\n this.poDialogService.confirm(confirmOptions);\n }\n\n private confirmRemoveAll(\n actionRemoveAll: PoPageDynamicTableActions['remove'],\n actionBeforeRemoveAll: PoPageDynamicTableActions['beforeRemove']\n ) {\n const confirmOptions: PoDialogConfirmOptions = {\n title: this.literals.confirmRemoveAllTitle,\n message: this.literals.confirmRemoveAllMessage,\n confirm: this.removeAll.bind(this, actionRemoveAll, actionBeforeRemoveAll)\n };\n\n this.poDialogService.confirm(confirmOptions);\n }\n\n private formatUniqueKey(item) {\n const keys = util.mapObjectByProperties(item, this.keys);\n\n return util.valuesFromObject(keys).join('|');\n }\n\n private getOrderParam(sortedColumn: PoTableColumnSort = { type: undefined }) {\n const { column, type } = sortedColumn;\n\n if (!column) {\n return {};\n }\n\n if (type === PoTableColumnSortType.Descending) {\n return { order: `-${column.property}` };\n }\n\n return { order: `${column.property}` };\n }\n\n private loadData(params: { page?: number; search?: string } = {}) {\n if (!this.serviceApi) {\n this.poNotification.error(this.literals.loadDataErrorNotification);\n return EMPTY;\n }\n\n const orderParam = this.getOrderParam(this.sortedColumn);\n const defaultParams: any = { page: 1, pageSize: PAGE_SIZE_DEFAULT };\n const fullParams: any = { ...defaultParams, ...params, ...orderParam };\n\n return this.poPageDynamicService.getResources(fullParams).pipe(\n tap(response => {\n let newArray;\n if (fullParams.page === 1) {\n newArray = removeDuplicateItemsWithArrayKey(response.items, response.items, this.keys);\n } else {\n newArray = removeDuplicateItemsWithArrayKey(this.items, response.items, this.keys);\n }\n this.items = newArray ? [...newArray] : this.items;\n this.page = fullParams.page;\n this.hasNext = response.hasNext;\n })\n );\n }\n\n private getMetadata(\n serviceApiFromRoute: string,\n onLoad: UrlOrPoCustomizationFunction\n ): Observable {\n if (serviceApiFromRoute) {\n return this.poPageDynamicService.getMetadata().pipe(\n tap(response => {\n this.autoRouter = response.autoRouter || this.autoRouter;\n this.actions = response.actions || this.actions;\n this.breadcrumb = response.breadcrumb || this.breadcrumb;\n this.fields = response.fields || this.fields;\n this.title = response.title || this.title;\n this.pageCustomActions = response.pageCustomActions || this.pageCustomActions;\n this.tableCustomActions = response.tableCustomActions || this.tableCustomActions;\n this.keepFilters = response.keepFilters || this.keepFilters;\n this.concatFilters = response.concatFilters || this.concatFilters;\n this.hideRemoveAllDisclaimer = response.hideRemoveAllDisclaimer || this.hideRemoveAllDisclaimer;\n this.hideCloseDisclaimers = response.hideCloseDisclaimers || this.hideCloseDisclaimers;\n this.quickSearchWidth = response.quickSearchWidth || this.quickSearchWidth;\n }),\n switchMap(() => this.loadOptionsOnInitialize(onLoad))\n );\n }\n\n return this.loadOptionsOnInitialize(onLoad);\n }\n\n // @todo Validar rotas na mão pois se existir uma rota '**' o catch do navigation não funciona.\n private navigateTo(\n route: { path: string; component?; url?: string; params?: any },\n forceStopAutoRouter: boolean = false\n ) {\n if (isExternalLink(route.path)) {\n return PoUtils.openExternalLink(route.path);\n }\n\n this.router.navigate([route.url || route.path], { queryParams: route.params }).catch(() => {\n if (forceStopAutoRouter || !this.autoRouter) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n this.router.config.unshift({\n path: route.path,\n component: route.component,\n data: { serviceApi: this.serviceApi, autoRouter: true }\n });\n\n this.navigateTo(route, true);\n });\n }\n\n private createConcatenatedUrl(concatKeys: boolean, url: string, selectedItem): string {\n const keys = this.keys.map(key => encodeURIComponent(selectedItem[key])).join();\n return concatKeys ? `${url}/${keys}` : url;\n }\n\n private openDetail(action: PoPageDynamicTableActions['detail'], item) {\n const id = this.formatUniqueKey(item);\n this.subscriptions.add(\n this.poPageDynamicTableActionsService\n .beforeDetail(this.actions.beforeDetail, id, item)\n .subscribe((beforeDetailResult: PoPageDynamicTableBeforeDetail) =>\n this.executeDetail(action, beforeDetailResult, id, item)\n )\n );\n }\n\n private executeDetail(\n action: PoPageDynamicTableActions['detail'],\n beforeDetailResult?: PoPageDynamicTableBeforeNew,\n id?: string,\n item?: any\n ) {\n const before = beforeDetailResult ?? {};\n const allowAction = typeof before.allowAction === 'boolean' ? before.allowAction : true;\n const { newUrl } = before;\n\n if (allowAction && action) {\n if (newUrl) {\n const path = this.getPathFromNewUrl(newUrl, id);\n return this.navigateTo({ path });\n }\n\n if (typeof action === 'string') {\n const url = this.resolveUrl(item, action);\n this.navigateTo({ path: action, url, component: PoPageDynamicDetailComponent });\n } else {\n action(id, item);\n }\n }\n }\n\n private getPathFromNewUrl(newUrl: string, id: string): string {\n if (newUrl.includes(':id')) {\n return newUrl.replace(/:id/g, id);\n }\n return newUrl;\n }\n\n private openDuplicate(actionDuplicate: PoPageDynamicTableActions['duplicate'], item: any) {\n const id = this.formatUniqueKey(item);\n const duplicates = util.removeKeysProperties(this.keys, util.mapObjectByProperties(item, this.duplicates));\n\n this.subscriptions.add(\n this.poPageDynamicTableActionsService\n .beforeDuplicate(this.actions.beforeDuplicate, id, duplicates)\n .subscribe((beforeDuplicateResult: PoPageDynamicTableBeforeDuplicate) =>\n this.executeDuplicate(actionDuplicate, beforeDuplicateResult, duplicates)\n )\n );\n }\n\n private executeDuplicate(\n actionDuplicate: PoPageDynamicTableActions['duplicate'],\n beforeDuplicateResult: PoPageDynamicTableBeforeDuplicate,\n duplicates: any\n ) {\n const before = beforeDuplicateResult ?? {};\n const allowAction = typeof before.allowAction === 'boolean' ? before.allowAction : true;\n const beforeDuplicateResource = before.resource;\n const newAction = before.newUrl ?? actionDuplicate;\n\n if (allowAction && actionDuplicate) {\n if (typeof beforeDuplicateResource === 'object' && beforeDuplicateResource !== null) {\n duplicates = util.removeKeysProperties(this.keys, beforeDuplicateResource);\n }\n\n if (typeof newAction === 'string') {\n return this.navigateTo({ path: newAction, params: { duplicate: JSON.stringify(duplicates) } });\n }\n\n return newAction(duplicates);\n }\n }\n\n private openEdit(actionEdit: PoPageDynamicTableActions['edit'], item) {\n const id = this.formatUniqueKey(item);\n\n this.subscriptions.add(\n this.poPageDynamicTableActionsService\n .beforeEdit(this.actions.beforeEdit, id, item)\n .pipe(\n switchMap((beforeEditResult: PoPageDynamicTableBeforeEdit) =>\n this.executeEditAction(actionEdit, beforeEditResult, item, id)\n )\n )\n .subscribe()\n );\n }\n\n private executeEditAction(\n action: PoPageDynamicTableActions['edit'],\n beforeEditResult: PoPageDynamicTableBeforeEdit,\n item: any,\n id: string\n ) {\n const newEditAction = beforeEditResult?.newUrl ?? action;\n const allowAction = beforeEditResult?.allowAction ?? true;\n\n if (!allowAction) {\n return EMPTY;\n }\n\n if (typeof newEditAction === 'string') {\n this.openEditUrl(newEditAction, item);\n } else {\n const updatedItem = newEditAction(id, item);\n if (typeof updatedItem === 'object' && updatedItem !== null) {\n this.modifyUITableItem(item, util.removeKeysProperties(this.keys, updatedItem));\n }\n }\n\n return EMPTY;\n }\n\n private openEditUrl(path: string, item) {\n const url = this.resolveUrl(item, path);\n\n this.navigateTo({ path, url });\n }\n\n private modifyUITableItem(currentItem, newItemValue) {\n const tableItem = this.items.findIndex(item => item === currentItem);\n this.items[tableItem] = { ...currentItem, ...newItemValue };\n }\n\n private openNew(actionNew: PoPageDynamicTableActions['new']) {\n this.subscriptions.add(\n this.poPageDynamicTableActionsService\n .beforeNew(this.actions.beforeNew)\n .subscribe((beforeNewResult: PoPageDynamicTableBeforeNew) => this.executeNew(actionNew, beforeNewResult))\n );\n }\n\n private executeNew(actionNew: PoPageDynamicTableActions['new'], beforeNewResult?: PoPageDynamicTableBeforeNew) {\n const before = beforeNewResult ?? {};\n const allowAction = typeof before.allowAction === 'boolean' ? before.allowAction : true;\n const { newUrl } = before;\n\n if (allowAction && actionNew) {\n if (newUrl) {\n return this.navigateTo({ path: newUrl });\n }\n\n if (typeof actionNew === 'string') {\n return this.navigateTo({ path: actionNew });\n }\n\n return actionNew();\n }\n }\n\n /**\n * Caso exista mais de um identificador, será concatenado com '|'.\n *\n * Ex: { id: 1, company: 'po' }\n *\n * Para o endpoint /resources/:id será executada a url /resources/1|po\n */\n private remove(\n item,\n actionRemove: PoPageDynamicTableActions['remove'],\n actionBeforeRemove: PoPageDynamicTableActions['beforeRemove']\n ) {\n const uniqueKey = this.formatUniqueKey(item);\n\n this.subscriptions.add(\n this.poPageDynamicTableActionsService\n .beforeRemove(actionBeforeRemove, uniqueKey, item)\n .pipe(switchMap(beforeRemove => this.deleteAction(item, actionRemove, beforeRemove)))\n .subscribe()\n );\n }\n\n private deleteAction(\n item,\n actionRemove: PoPageDynamicTableActions['remove'],\n beforeRemove: PoPageDynamicTableBeforeRemove\n ): Observable {\n const { allowAction, newUrl } = beforeRemove || {};\n const allow = allowAction ?? true;\n\n if (allow) {\n let uniqueKey = this.formatUniqueKey(item);\n const resourceToRemoveKey = this.returnResourcesKeys([item]);\n\n if (typeof actionRemove === 'boolean' || newUrl) {\n uniqueKey = newUrl ? undefined : uniqueKey;\n return this.poPageDynamicService\n .deleteResource(uniqueKey, newUrl)\n .pipe(map(() => this.removeFromUI(resourceToRemoveKey, this.literals.removeSuccessNotification)));\n }\n\n return of(actionRemove(uniqueKey, item)).pipe(\n tap(remove => {\n const removeItem = remove ?? false;\n this.removeFromUI(resourceToRemoveKey, this.literals.removeSuccessNotification, removeItem);\n })\n );\n }\n\n return of({});\n }\n\n private removeFromUI(items: Array, message: string, remove = true) {\n if (remove === true && items?.length) {\n this.removeLocalItems(items);\n this.poNotification.success(message);\n }\n }\n\n private removeAll(\n actionRemoveAll: PoPageDynamicTableActions['removeAll'],\n actionBeforeRemoveAll: PoPageDynamicTableActions['beforeRemoveAll']\n ) {\n const originalResourcesKeys = this.getSelectedItemsKeys();\n this.subscriptions.add(\n this.poPageDynamicTableActionsService\n .beforeRemoveAll(actionBeforeRemoveAll, originalResourcesKeys)\n .pipe(switchMap(beforeRemove => this.deleteAllAction(actionRemoveAll, beforeRemove, originalResourcesKeys)))\n .subscribe()\n );\n }\n\n private getSelectedItemsKeys() {\n const resources = this.items.filter(item => item.$selected);\n\n if (resources.length === 0) {\n return;\n }\n return this.returnResourcesKeys(resources);\n }\n\n private returnResourcesKeys(resources) {\n return util.mapArrayByProperties(resources, this.keys);\n }\n\n private deleteAllAction(\n actionRemoveAll: PoPageDynamicTableActions['removeAll'],\n beforeRemoveAll: PoPageDynamicTableBeforeRemoveAll,\n originalResources: Array\n ) {\n const { allowAction, newUrl, resources } = beforeRemoveAll ?? {};\n const allow = allowAction ?? true;\n const resourcestoDelete = resources ?? originalResources;\n\n if (allow && Array.isArray(resourcestoDelete)) {\n if (typeof actionRemoveAll === 'boolean' || newUrl) {\n return this.poPageDynamicService.deleteResources(resourcestoDelete, newUrl).pipe(\n tap(() => {\n this.removeFromUI(resourcestoDelete, this.literals.removeAllSuccessNotification);\n })\n );\n }\n return of(actionRemoveAll(resourcestoDelete)).pipe(\n tap(removeItems => this.removeFromUI(removeItems, this.literals.removeSuccessNotification))\n );\n }\n\n return of({});\n }\n\n private removeLocalItems(itemsKeysToRemove = []) {\n if (itemsKeysToRemove.length) {\n this.items = this.items.filter(item => {\n const itemKey = this.formatUniqueKey(item);\n return !itemsKeysToRemove.find(itemKeyToRemove => util.valuesFromObject(itemKeyToRemove).join('|') === itemKey);\n });\n }\n }\n\n private resolveUrl(item: any, path: string) {\n const uniqueKey = this.formatUniqueKey(item);\n\n return path.replace(/:id/g, uniqueKey);\n }\n\n private setPageActions(actions: PoPageDynamicTableActions) {\n if (actions?.new) {\n this.defaultPageActions = [{ label: this.literals.pageAction, action: this.openNew.bind(this, actions.new) }];\n }\n }\n\n private transformCustomActionsToPageListAction(\n customActions: Array\n ): Array {\n /* istanbul ignore next */\n return customActions.map(customAction => ({\n label: customAction.label,\n action: this.callPageCustomAction.bind(this, customAction),\n disabled: this.isDisablePageCustomAction.bind(this, customAction),\n ...(customAction.icon && { icon: customAction.icon }),\n visible: customAction.visible\n }));\n }\n\n private transformTableCustomActionsToTableActions(\n tableCustomActions: Array\n ): Array {\n return tableCustomActions.map(tableCustomAction => ({\n label: tableCustomAction.label,\n icon: tableCustomAction.icon,\n action: this.callTableCustomAction.bind(this, tableCustomAction),\n disabled: tableCustomAction.disabled,\n visible: tableCustomAction.visible\n }));\n }\n\n private isDisablePageCustomAction(customAction): boolean {\n return customAction.selectable && !this.getSelectedItemsKeys();\n }\n\n private callPageCustomAction(customAction: PoPageDynamicTableCustomAction) {\n if (customAction.action) {\n const selectedItems = customAction.selectable ? this.getSelectedItemsKeys() : undefined;\n\n const sendCustomActionSubscription = this.poPageDynamicTableActionsService\n .customAction(customAction.action, selectedItems)\n .subscribe();\n\n this.subscriptions.add(sendCustomActionSubscription);\n } else if (customAction.url) {\n this.navigateTo({ path: customAction.url });\n }\n }\n\n private callTableCustomAction(customAction: PoPageDynamicTableCustomTableAction, selectedItem) {\n this.itemSelectedAction = selectedItem;\n if (customAction.action) {\n const sendCustomActionSubscription = this.poPageDynamicTableActionsService\n .customAction(customAction.action, selectedItem)\n .subscribe(updatedItem => {\n if (typeof updatedItem === 'object' && updatedItem !== null) {\n this.modifyUITableItem(selectedItem, util.removeKeysProperties(this.keys, updatedItem));\n }\n });\n\n this.subscriptions.add(sendCustomActionSubscription);\n } else if (customAction.url) {\n if (isExternalLink(customAction.url)) {\n PoUtils.openExternalLink(this.createConcatenatedUrl(customAction.concatKeys, customAction.url, selectedItem));\n } else {\n this.navigateTo({\n path: this.createConcatenatedUrl(customAction.concatKeys, customAction.url, selectedItem)\n });\n }\n }\n }\n\n private setRemoveAllAction() {\n const action = this._actions;\n if (this.showRemove(action.removeAll)) {\n this.defaultPageActions = [\n ...this._defaultPageActions,\n {\n label: this.literals.pageActionRemoveAll,\n action: this.confirmRemoveAll.bind(this, action.removeAll, action.beforeRemoveAll),\n disabled: this.disableRemoveAll.bind(this),\n type: 'danger'\n }\n ];\n }\n }\n\n private disableRemoveAll(): boolean {\n return !this.getSelectedItemsKeys();\n }\n\n private setTableActions(actions: PoPageDynamicTableActions) {\n if (actions) {\n const visibleRemove = this.showRemove(actions.remove);\n this.defaultTableActions = [\n {\n action: this.openDetail.bind(this, actions.detail),\n label: this.literals.tableActionView,\n visible: !!this._actions.detail\n },\n {\n action: this.openEdit.bind(this, actions.edit),\n label: this.literals.tableActionEdit,\n visible: !!this._actions.edit\n },\n {\n action: this.openDuplicate.bind(this, actions.duplicate),\n label: this.literals.tableActionDuplicate,\n visible: !!this._actions.duplicate\n },\n {\n action: this.confirmRemove.bind(this, actions.remove, actions.beforeRemove),\n label: this.literals.tableActionDelete,\n separator: true,\n type: 'danger',\n visible: visibleRemove\n }\n ];\n }\n }\n\n private loadDataFromAPI() {\n const { serviceApi: serviceApiFromRoute, serviceMetadataApi, serviceLoadApi } = this.activatedRoute.snapshot.data;\n\n const onLoad = serviceLoadApi || this.onLoad;\n this.serviceApi = serviceApiFromRoute || this.serviceApi;\n\n this.poPageDynamicService.configServiceApi({ endpoint: this.serviceApi, metadata: serviceMetadataApi });\n\n const metadata$ = this.getMetadata(serviceApiFromRoute, onLoad);\n let data$;\n if (this.quickSearchValue) {\n const paramsQuickSearchValue = { [this.quickSearchParam]: this.quickSearchValue };\n data$ = this.loadData(paramsQuickSearchValue);\n } else {\n data$ = this.loadData();\n }\n\n this.subscriptions.add(\n metadata$\n .pipe(\n switchMap(() => {\n const initialFilters = this.getInitialValuesFromFilter();\n\n if (!Object.keys(initialFilters).length) {\n return data$;\n }\n\n return EMPTY;\n })\n )\n .subscribe()\n );\n }\n\n private getInitialValuesFromFilter() {\n const initialFilters = this.filters.reduce(\n (result, item) => Object.assign(result, { [item.property]: item.initValue }),\n {}\n );\n\n Object.keys(initialFilters).forEach(key => {\n if (!initialFilters[key]) {\n delete initialFilters[key];\n }\n });\n\n return initialFilters;\n }\n\n private loadOptionsOnInitialize(onLoad: UrlOrPoCustomizationFunction) {\n if (onLoad) {\n return this.getPoDynamicPageOptions(onLoad).pipe(\n tap(responsePoOption =>\n this.poPageCustomizationService.changeOriginalOptionsToNewOptions(this, responsePoOption)\n )\n );\n }\n\n return of(null);\n }\n\n private getPoDynamicPageOptions(onLoad: UrlOrPoCustomizationFunction): Observable {\n const originalOption: PoPageDynamicTableOptions = {\n fields: this.fields,\n actions: this.actions,\n breadcrumb: this.breadcrumb,\n title: this.title,\n keepFilters: this.keepFilters,\n concatFilters: this.concatFilters,\n hideRemoveAllDisclaimer: this.hideRemoveAllDisclaimer,\n hideCloseDisclaimers: this.hideCloseDisclaimers,\n pageCustomActions: this.pageCustomActions,\n tableCustomActions: this.tableCustomActions,\n quickSearchWidth: this.quickSearchWidth\n };\n\n const pageOptionSchema: PoPageDynamicOptionsSchema = {\n schema: [\n {\n nameProp: 'fields',\n merge: true,\n keyForMerge: 'property'\n },\n {\n nameProp: 'actions',\n merge: true\n },\n {\n nameProp: 'breadcrumb'\n },\n {\n nameProp: 'title'\n },\n {\n nameProp: 'keepFilters'\n },\n {\n nameProp: 'quickSearchWidth'\n },\n {\n nameProp: 'concatFilters'\n },\n {\n nameProp: 'hideRemoveAllDisclaimer'\n },\n {\n nameProp: 'hideCloseDisclaimers'\n },\n {\n nameProp: 'pageCustomActions',\n merge: true,\n keyForMerge: 'label'\n },\n {\n nameProp: 'tableCustomActions',\n merge: true,\n keyForMerge: 'label'\n }\n ]\n };\n\n return this.poPageCustomizationService.getCustomOptions(onLoad, originalOption, pageOptionSchema);\n }\n\n private showRemove(actionRemove: T): boolean {\n const action = actionRemove ?? false;\n if (typeof action === 'boolean') {\n return action;\n }\n return true;\n }\n\n private updateFilterValue(filter) {\n return this.fields.map(item => {\n if (filter.hasOwnProperty(item.property)) {\n item.initValue = filter[item.property];\n }\n });\n }\n\n private updatePageActions() {\n this.pageActions = [...this._defaultPageActions, ...this._customPageListActions];\n }\n\n private updateTableActions() {\n const defaultTableActionsWithoutActionDelete = this._defaultTableActions.filter(\n tableAction => tableAction.label !== this.literals.tableActionDelete\n );\n\n const tableActionDelete = this._defaultTableActions.find(\n tableAction => tableAction.label === this.literals.tableActionDelete\n );\n\n const newTableActions = [...defaultTableActionsWithoutActionDelete, ...this._customTableActions];\n\n if (tableActionDelete) {\n newTableActions.push(tableActionDelete);\n }\n\n this.tableActions = newTableActions;\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n}\n","\n \n \n\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport { PoTableModule } from '@po-ui/ng-components';\n\nimport { PoPageDynamicSearchModule } from '../po-page-dynamic-search/po-page-dynamic-search.module';\n\nimport { PoPageDynamicTableComponent } from './po-page-dynamic-table.component';\nimport { PoPageCustomizationModule } from '../../services/po-page-customization/po-page-customization.module';\nimport { PoPageDynamicModule } from '../../services/po-page-dynamic/po-page-dynamic.module';\n\n/**\n * @description\n *\n * Módulo do template do po-page-dynamic-table.\n */\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n RouterModule,\n\n PoTableModule,\n PoPageDynamicSearchModule,\n PoPageCustomizationModule,\n PoPageDynamicModule\n ],\n declarations: [PoPageDynamicTableComponent],\n exports: [PoPageDynamicTableComponent]\n})\nexport class PoPageDynamicTableModule {}\n","import { PoJobSchedulerInternal } from './interfaces/po-job-scheduler-internal.interface';\n\nexport class PoPageJobSchedulerInternal implements PoJobSchedulerInternal {\n periodicity = 'single';\n firstExecution = new Date();\n firstExecutionHour = this.getCurrentHour(this.firstExecution);\n recurrent = true;\n frequency = {};\n\n private getCurrentHour(date: Date): string {\n const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();\n const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();\n\n return `${hours}:${minutes}`;\n }\n}\n","import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable, inject } from '@angular/core';\n\nimport { Observable } from 'rxjs';\nimport { map } from 'rxjs/operators';\n\nimport { addZero, PoUtils } from '../../utils/util';\nimport { PoDynamicFormField } from '@po-ui/ng-components';\n\nimport { PoJobScheduler } from './interfaces/po-job-scheduler.interface';\nimport { PoJobSchedulerInternal } from './interfaces/po-job-scheduler-internal.interface';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageJobSchedulerService {\n private readonly http = inject(HttpClient);\n\n readonly headers: HttpHeaders = new HttpHeaders({\n 'X-PO-SCREEN-LOCK': 'true'\n });\n\n private endpoint = '/';\n\n configServiceApi(config: { endpoint?: string } = {}) {\n this.endpoint = config.endpoint;\n }\n\n // Cria um recurso\n createResource(resource): Observable {\n const newResouce = this.convertToJobScheduler(resource);\n\n return this.http.post(`${this.endpoint}`, newResouce, { headers: this.headers });\n }\n\n getHeadProcesses() {\n const headers = { 'X-PO-No-Error': 'true' };\n\n return this.http.head(`${this.endpoint}/processes`, { headers });\n }\n\n // Busca parametros pelo processo id\n getParametersByProcess(processId: string | number): Observable {\n return this.http\n .get(`${this.endpoint}/processes/${processId}/parameters`, { headers: this.headers })\n .pipe(map((resource: { items: Array }) => resource.items));\n }\n\n // Busca um único recurso\n getProcess(id: string | number): Observable {\n return this.http.get(`${this.endpoint}/processes/${id}`, { headers: this.headers });\n }\n\n // Busca uma lista de processos\n getProcesses(params: {} = {}): Observable {\n return this.http.get(`${this.endpoint}/processes`, { params });\n }\n\n // Busca um único recurso\n getResource(id: string | number): Observable {\n return this.http\n .get(`${this.endpoint}/${id}`, { headers: this.headers })\n .pipe(map(resource => this.convertToJobSchedulerInternal(resource)));\n }\n\n // Atualiza um recurso\n updateResource(id, resource): Observable {\n const newResouce = this.convertToJobScheduler(resource);\n return this.http.put(`${this.endpoint}/${id}`, newResouce, { headers: this.headers });\n }\n\n convertToJobScheduler(jobSchedulerInternal): PoJobScheduler {\n const jobScheduler = { ...jobSchedulerInternal };\n\n if (jobSchedulerInternal.periodicity) {\n if (jobSchedulerInternal.periodicity === 'single') {\n jobScheduler.recurrent = false;\n } else {\n Object.assign(jobScheduler, this.convertToPeriodicity(jobSchedulerInternal));\n }\n }\n\n if (jobSchedulerInternal.firstExecutionHour) {\n jobScheduler.firstExecution = this.replaceHourFirstExecution(\n jobSchedulerInternal.firstExecution,\n jobSchedulerInternal.firstExecutionHour\n );\n }\n\n if (jobSchedulerInternal.frequency && jobSchedulerInternal.frequency.type) {\n jobScheduler.rangeExecutions = {\n frequency: { ...jobSchedulerInternal.frequency }\n };\n\n if (jobSchedulerInternal.rangeLimitHour) {\n const splitRangeLimitHour = jobSchedulerInternal.rangeLimitHour.split(':');\n\n jobScheduler.rangeExecutions.rangeLimit = {\n hour: parseInt(splitRangeLimitHour[0], 10),\n minute: parseInt(splitRangeLimitHour[1], 10)\n };\n }\n\n if (jobSchedulerInternal.rangeLimitDay) {\n jobScheduler.rangeExecutions.rangeLimit = {\n ...jobScheduler.rangeExecutions.rangeLimit,\n day: jobSchedulerInternal.rangeLimitDay\n };\n }\n }\n\n if (!Object.keys(this.returnValidExecutionParameter(jobScheduler.executionParameter)).length) {\n delete jobScheduler.executionParameter;\n }\n\n this.removeInvalidKeys(jobScheduler);\n\n return jobScheduler;\n }\n\n convertToJobSchedulerInternal(jobScheduler = {}): PoJobSchedulerInternal {\n const jobSchedulerInternal = { ...jobScheduler };\n\n if (jobScheduler.firstExecution) {\n jobSchedulerInternal.firstExecutionHour = this.getHourFirstExecution(jobScheduler.firstExecution);\n }\n\n Object.assign(jobSchedulerInternal, this.convertToPeriodicityInternal(jobScheduler));\n\n if (jobScheduler.rangeExecutions) {\n jobSchedulerInternal.rangeLimitHour = `${\n jobScheduler.rangeExecutions.rangeLimit.hour < 10\n ? '0' + jobScheduler.rangeExecutions.rangeLimit.hour\n : jobScheduler.rangeExecutions.rangeLimit.hour\n }:${\n jobScheduler.rangeExecutions.rangeLimit.minute < 10\n ? '0' + jobScheduler.rangeExecutions.rangeLimit.minute\n : jobScheduler.rangeExecutions.rangeLimit.minute\n }`;\n jobSchedulerInternal.rangeLimitDay = jobScheduler.rangeExecutions.rangeLimit.day;\n jobSchedulerInternal.frequency = {\n type: jobScheduler.rangeExecutions.frequency.type,\n value: jobScheduler.rangeExecutions.frequency.value\n };\n }\n\n this.removeInvalidKeys(jobSchedulerInternal, ['weekly', 'monthly', 'daily']);\n\n return jobSchedulerInternal;\n }\n\n private convertToPeriodicity(value: {\n periodicity: string;\n dayOfMonth?: string;\n daysOfWeek?: number;\n hour?: string;\n }) {\n const newValue = {};\n const valuePeriodicity = value.periodicity;\n\n if (valuePeriodicity) {\n newValue[valuePeriodicity] = {};\n\n if (valuePeriodicity === 'monthly') {\n newValue[valuePeriodicity].day = value.dayOfMonth ? parseInt(value.dayOfMonth, 10) : 0;\n } else if (valuePeriodicity === 'weekly') {\n newValue[valuePeriodicity].daysOfWeek = value.daysOfWeek;\n }\n\n newValue[valuePeriodicity].hour = value.hour ? parseInt(value.hour.split(':')[0], 10) : 0;\n newValue[valuePeriodicity].minute = value.hour ? parseInt(value.hour.split(':')[1], 10) : 0;\n }\n\n return newValue;\n }\n\n private convertToPeriodicityInternal(value = {}) {\n if (value.monthly) {\n return {\n periodicity: 'monthly',\n hour: `${addZero(value.monthly.hour)}:${addZero(value.monthly.minute)}`,\n dayOfMonth: value.monthly.day\n };\n } else if (value.daily) {\n return {\n periodicity: 'daily',\n hour: `${addZero(value.daily.hour)}:${addZero(value.daily.minute)}`\n };\n } else if (value.weekly) {\n return {\n periodicity: 'weekly',\n hour: `${addZero(value.weekly.hour)}:${addZero(value.weekly.minute)}`,\n daysOfWeek: [...value.weekly.daysOfWeek]\n };\n } else {\n return {\n periodicity: 'single'\n };\n }\n }\n\n private getCurrentHour(date: Date): string {\n const hours = addZero(date.getHours());\n const minutes = addZero(date.getMinutes());\n\n return `${hours}:${minutes}`;\n }\n\n private getHourFirstExecution(firstExecutionDate: string): string {\n return this.getCurrentHour(new Date(firstExecutionDate));\n }\n\n private removeInvalidKeys(value: object, keys?: Array) {\n const invalidKeys = keys || [\n 'periodicity',\n 'hour',\n 'minute',\n 'day',\n 'daysOfWeek',\n 'dayOfMonth',\n 'firstExecutionHour',\n 'frequency',\n 'rangeLimitHour',\n 'rangeLimitDay'\n ];\n\n Object.keys(value).forEach(key => {\n if (invalidKeys.includes(key)) {\n delete value[key];\n } else if (key === 'rangeExecutions' && value['periodicity'] === 'single') {\n delete value[key];\n }\n });\n }\n\n private replaceHourFirstExecution(date: string, time: string): string {\n try {\n if (!date) {\n return date;\n }\n\n const dateSplited = date.split('-');\n const timeSplited = time.split(':');\n\n if (dateSplited.length < 2 || timeSplited.length < 1) {\n return date;\n }\n\n const year = parseInt(dateSplited[0]);\n const monthIndex = parseInt(dateSplited[1]) - 1;\n const day = parseInt(dateSplited[2]);\n\n const hours = parseInt(timeSplited[0], 10);\n const minutes = parseInt(timeSplited[1], 10);\n\n const firstExecutionDate = new Date(year, monthIndex, day, hours, minutes);\n\n if (!(firstExecutionDate instanceof Date && !isNaN(firstExecutionDate.getTime()))) {\n return date;\n }\n\n return PoUtils.convertDateToISOExtended(firstExecutionDate);\n } catch {\n return date;\n }\n }\n\n private returnValidExecutionParameter(parameter: object) {\n const newParameter = { ...parameter };\n\n for (const key in newParameter) {\n if (newParameter.hasOwnProperty(key) && newParameter[key] === undefined) {\n delete newParameter[key];\n }\n }\n\n return newParameter;\n }\n}\n","import { Directive, EventEmitter, HostBinding, HostListener, Input, OnDestroy, Output } from '@angular/core';\nimport { AbstractControl } from '@angular/forms';\n\nimport { PoBreadcrumb, PoDynamicFormField, PoStepperOrientation } from '@po-ui/ng-components';\n\nimport { Subscription } from 'rxjs';\nimport { getDefaultSizeFn, validateSizeFn } from '../../utils/util';\nimport { PoJobSchedulerInternal } from './interfaces/po-job-scheduler-internal.interface';\nimport { PoPageJobSchedulerInternal } from './po-page-job-scheduler-internal';\nimport { PoPageJobSchedulerService } from './po-page-job-scheduler.service';\n\n/**\n * @description\n *\n * O `po-page-job-scheduler` é uma página para criação e atualização de agendamentos da execução de processos (Job Scheduler),\n * como por exemplo: a geração da folha de pagamento dos funcionários.\n *\n * Para utilizar esta página, basta informar o serviço (endpoint) para consumo,\n * sem a necessidade de criar componentes e tratamentos dos dados.\n *\n * Veja mais sobre os padrões utilizados nas requisições no [Guia de implementação de APIs](guides/api).\n *\n * #### Tokens customizáveis\n *\n * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).\n *\n * | Propriedade | Descrição | Valor Padrão |\n * |---------------------|---------------------------------------------|---------------------------------------|\n * | **Header** | | |\n * | `--padding` | Espaçamento do header | `var(--spacing-xs) var(--spacing-md)` |\n * | `--gap` | Espaçamento entre os breadcrumbs e o título | `var(--spacing-md)` |\n * | `--gap-actions` | Espaçamento entre as ações | `var(--spacing-xs)` |\n * | `--font-family` | Família tipográfica do título | `var(--font-family-theme)` |\n * | **Content** | | |\n * | `--padding-content` | Espaçamento do conteúdo | `var(--spacing-xs) var(--spacing-sm)` |\n */\n@Directive()\nexport class PoPageJobSchedulerBaseComponent implements OnDestroy {\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n\n /** Objeto com as propriedades do breadcrumb. */\n @Input('p-breadcrumb') breadcrumb?: PoBreadcrumb = { items: [] };\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * Endpoint usado pelo componente para busca dos processos e parâmetros que serão utilizados para criação e edição dos agendamentos.\n *\n * #### Processos\n *\n * Os processos são as tarefas que estarão disponíveis para o usuário poder fazer os agendamentos.\n * Ao inicializar o componente, será feito uma requisição `GET` para o endpoint `{service-api}/processes`, para buscar\n * essa lista de processos.\n *\n * Este endpoint `{service-api}/processes` deve retornar uma lista de objetos que seguem a definição de dados abaixo:\n *\n * ```\n * GET {service-api}/processes\n * ```\n *\n * ```\n * {\n * items: [\n * { \"processID\": \"ac4f\", \"description\": \"Gerar folha de pagamento\" },\n * { \"processID\": \"df6l\", \"description\": \"Relatório de imposto a recolher\" },\n * { \"processID\": \"dk3p\", \"description\": \"Títulos em aberto\" },\n * ]\n * }\n * ```\n *\n * Desta forma será renderizado um componente para selecionar o processo e/ou filtrá-los.\n *\n * Para realizar o filtro de busca do processo, será feita uma requisição enviando o conteúdo digitado na busca através do\n * parâmetro `search`. Da seguinte forma:\n *\n * ```\n * GET {service-api}/processes?search=relatorio\n * ```\n *\n * > Veja mais sobre paginação e filtros no [Guia de implementação de APIs](guides/api).\n * Caso seja informada a propriedade `p-parameters` não serão realizadas as requisições de processos e nem de parametros automaticamente.\n *\n * Também é possível fazer um agendamento de um processo específico, sem que seja necessário um endpoint para busca desses\n * processos. Então, caso o endpoint `{service-api}/processes` não seja válido, será apresentado um campo de entrada de\n * texto para o usuário informar diretamente\n * o **identificador do processo - `processID`** e ao salvar será enviado um `POST` para o endpoint difinido `serviceApi` conforme abaixo:\n *\n * ```\n * POST {service-api}\n * ```\n *\n * *Request payload* - estrutura de dados enviada no corpo da requisição conforme interface `PoJobScheduler`:\n *\n * ```\n * {\n * \"daily\": { \"hour\": 10, \"minute\": 12 },\n * \"firstExecution\": \"2018-12-07T00:00:01-00:00\",\n * \"recurrent\": true,\n * \"processID\": \"ac0405\"\n * ...\n * }\n * ```\n *\n * Caso seja necessário informar parâmetros e adicionar configurações no processo selecionado, será realizado um `GET`\n * como exemplificado abaixo. Os parâmetros devem retornar uma lista de objetos que seguem a interface\n * [PoDynamicFormField](/documentation/po-dynamic-form). Porém, caso utilizar a propriedade `p-parameters` o componente não\n * realizará a busca automática e o campo de processos não será exibido.\n *\n * ```\n * GET {service-api}/processes/:id/parameters\n * ...\n * {\n * items: [\n * { \"property\": \"vencimento\", type: \"date\" },\n * { \"property\": \"imposto-retido\", \"label\": \"Imposto Retido\", type: \"boolean\" }\n * ]\n * }\n * ```\n *\n * #### Salvar e Atualizar\n *\n * Para salvar o agendamento, será feita uma requisição de criação, passando os valores preenchidos pelo usuário via *payload*.\n * Abaixo uma requisição `POST` disparada, onde as propriedades do *Job Scheduler* foram preenchidas:\n *\n * ```\n * POST {service-api}\n * ```\n *\n * *Request payload* - estrutura de dados enviada no corpo da requisição conforme interface `PoJobScheduler`:\n *\n * ```\n * {\n * \"firstExecution\": \"2018-12-07T00:00:01-00:00\",\n * \"recurrent\": true,\n * \"monthly\": { \"day\": 1, \"hour\": 10, \"minute\": 0 },\n * \"processID\": \"ac0405\",\n * \"rangeExecutions: { \"frequency\": { \"type\": \"hour\", \"value\": 2 }, \"rangeLimit\": { \"hour\": 18, \"minute\": 0, \"day\": 20 } }\n * }\n * ```\n *\n * Caso queira que o componente carregue um agendamento já existente, deve ser incluído um parâmetro na rota chamado `id`.\n *\n * Exemplo de configuração de rota:\n *\n * ```\n * RouterModule.forRoot([\n * ...\n * { path: 'edit/:id', component: ExampleJobSchedulerComponent },\n * ...\n * ],\n * ```\n *\n * Baseado nisso, na inicialização do template será disparado uma requisição para buscar o recurso que será editado.\n *\n * ```\n * GET {service-api}/{id}\n * ```\n *\n * Ao atualizar o agendamento, será disparado um `PUT` com os dados preenchidos.\n * Veja abaixo uma requisição `PUT` disparada, onde a propriedade *recurrent* e *daily* foram atualizadas:\n *\n * ```\n * PUT {service-api}/{id}\n * ```\n *\n * *Request payload* - estrutura de dados enviada no corpo da requisição conforme interface `PoJobScheduler`:\n *\n * ```\n * {\n * \"firstExecution\": \"2018-12-07T00:00:01-00:00\",\n * \"recurrent\": true,\n * \"processID\": \"ac0405\",\n * \"monthly\": { \"day\": 1, \"hour\": 10, \"minute\": 0 },\n * \"processID\": \"ac0405\",\n * \"rangeExecutions: { \"frequency\": { \"type\": \"hour\", \"value\": 2 }, \"rangeLimit\": { \"hour\": 18, \"minute\": 0, \"day\": 20 } }\n * }\n * ```\n */\n @Input('p-service-api') serviceApi: string;\n\n /** Título da página. */\n @Input('p-title') title: string;\n\n /**\n * Parâmetros que serão utilizados para criação e edição dos agendamentos.\n *\n * Ao utilizar esta propriedade, o componente não buscará automaticamente os parâmetros da API e o campo para preenchimento do processo não será exibido.\n *\n */\n @Input('p-parameters') parameters: Array = [];\n\n @Input('p-value') set value(value: any) {\n this.model = this.poPageJobSchedulerService.convertToJobSchedulerInternal(value);\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Define a orientação de exibição do `po-stepper`.\n *\n * > Quando não utilizada, segue o comportamento com base nas dimensões da tela.\n *\n * > Veja os valores válidos no *enum* [PoStepperOrientation](documentation/po-stepper#stepperOrientation).\n *\n */\n\n @Input('p-orientation') set stepperDefaultOrientation(value: PoStepperOrientation) {\n this._orientation = (Object).values(PoStepperOrientation).includes(value) ? value : undefined;\n }\n\n get stepperDefaultOrientation(): PoStepperOrientation {\n return this._orientation;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Função chamada após realizar a confirmação da execução no PoPageJobScheduler.\n * Permite alterar os valores do model do PoPageJobScheduler antes de realizar o envio para a Api.\n *\n * > Deve retornar um objeto do tipo `PoPageJobScheduler` para ser adicionado ao model do PoPageJobScheduler.\n *\n * > Ao ser disparada, a mesma receberá por parâmetro o model do PoPageJobScheduler de interface `PoJobSchedulerInternal`.\n *\n * O contexto da função que será chamada, será o mesmo que o do `PoPageJobScheduler`, então para poder alterar\n * para o contexto do componente que o está utilizando, pode ser utilizado a propriedade `bind` do Javascript.\n * Por exemplo, para a função `beforeSend`:\n *\n * ```\n * \n * ...\n * \n * ```\n */\n @Input('p-before-send') beforeSendAction: (model: PoJobSchedulerInternal) => PoJobSchedulerInternal;\n\n /**\n * @optional\n *\n * @description\n *\n * Define se o step `Agendamento` deve ser exibido como o último na sequência de steps\n *\n * > Aplicável apenas quando utilizado `PoJobSchedulerParametersTemplateDirective`\n */\n @Input('p-step-execution-last') stepExecutionLast: boolean;\n\n /**\n * @optional\n *\n * @description\n *\n * Permite a navegação direta ao clicar em um step (passo) previamente preenchido e validado,\n * sem a necessidade de retornar passo a passo utilizando o botão \"Voltar\".\n *\n * Quando habilitado (`true`), o usuário pode clicar diretamente em qualquer step anterior\n * que já tenha sido concluído para retornar a ele imediatamente.\n *\n * > Steps futuros (ainda não preenchidos) permanecerão bloqueados para clique,\n * independentemente do valor desta propriedade.\n *\n * @default `false`\n */\n @Input('p-allow-direct-navigation') allowDirectNavigation: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado ao concluir o processo de agendamento com sucesso.\n */\n @Output('p-success') success = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado ao ocorrer um erro impossibilitando a conclusão do agendamento.\n * Para este evento será passado como parâmetro os detalhes do erro.\n */\n @Output('p-error') error = new EventEmitter();\n\n model: PoJobSchedulerInternal = new PoPageJobSchedulerInternal();\n\n private readonly _subscription = new Subscription();\n private _orientation;\n\n constructor(protected poPageJobSchedulerService: PoPageJobSchedulerService) {}\n\n ngOnDestroy() {\n this._subscription.unsubscribe();\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n protected loadData(id: string | number) {\n if (!id) {\n this.model = this.model || new PoPageJobSchedulerInternal();\n return;\n }\n\n this._subscription.add(\n this.poPageJobSchedulerService.getResource(id).subscribe(\n (response: PoJobSchedulerInternal) => {\n this.model = response;\n },\n () => {\n this.model = new PoPageJobSchedulerInternal();\n }\n )\n );\n }\n\n protected markAsDirtyInvalidControls(controls: { [key: string]: AbstractControl }) {\n for (const key in controls) {\n if (controls.hasOwnProperty(key)) {\n const control = controls[key];\n\n if (control.invalid) {\n control.markAsDirty();\n }\n }\n }\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n}\n","export const poPageJobSchedulerLiteralsDefault = {\n en: {\n at: 'at',\n back: 'Back',\n next: 'Next',\n periodicity: 'Periodicity',\n execution: 'Execution',\n process: 'Process',\n enterProcess: 'Enter a process',\n recurrent: 'Recurrent',\n single: 'Single',\n daily: 'Daily',\n weekly: 'Weekly',\n monthly: 'Monthly',\n scheduling: 'Scheduling',\n parameterization: 'Parameterization',\n conclude: 'Conclude',\n firstExecution: 'First Execution',\n startTime: 'Start time',\n endTime: 'End time',\n time: 'Time',\n hour: 'Hour',\n minute: 'Minute',\n day: 'Day',\n endDay: 'End day',\n startDay: 'Start day',\n weekDays: 'Week days',\n sunday: 'Sunday',\n monday: 'Monday',\n tuesday: 'Tuesday',\n wednesday: 'Wednesday',\n thursday: 'Thursday',\n friday: 'Friday',\n saturday: 'Saturday',\n parameters: 'Parameters',\n yes: 'Yes',\n no: 'No',\n notReported: 'Not reported',\n periodicityData: 'Periodicity data',\n confirmation: 'Confirmation',\n confirmSaveMessage: 'Are you sure you want to complete this schedule?',\n confirmUpdateMessage: 'Are you sure you want to update this schedule?',\n saveNotificationSuccessUpdate: 'Successfully updated scheduling',\n saveNotificationSuccessSave: 'Successfully saved scheduling',\n parametersNotFound: 'Parameters not found.',\n frequency: 'Frequency',\n to: 'to',\n from: 'from'\n },\n es: {\n at: 'a las',\n back: 'Volver',\n next: 'Avanzar',\n periodicity: 'Periodicidad',\n execution: 'Ejecución',\n process: 'Proceso',\n enterProcess: 'Informe un proceso',\n recurrent: 'Recurrente',\n single: 'Única',\n daily: 'Diaria',\n weekly: 'Semanal',\n monthly: 'Mensual',\n scheduling: 'Programación',\n parameterization: 'Parametrización',\n conclude: 'Completar',\n firstExecution: 'Primera ejecución',\n startTime: 'Hora de inicio',\n endTime: 'Hora de finalización',\n time: 'Horário',\n hour: 'Hora',\n minute: 'Minute',\n day: 'Día',\n endDay: 'Último Día',\n startDay: 'Día de inicio',\n weekDays: 'Dias de la semana',\n sunday: 'Domingo',\n monday: 'Lunes',\n tuesday: 'Martes',\n wednesday: 'Miércoles',\n thursday: 'Jueves',\n friday: 'Viernes',\n saturday: 'Sábado',\n parameters: 'Parámetros',\n yes: 'Sí',\n no: 'No',\n notReported: 'No informado',\n periodicityData: 'Dados da periodicidade',\n confirmation: 'Confirmación',\n confirmSaveMessage: '¿Está seguro de que desea completar esta programación de proceso?',\n confirmUpdateMessage: '¿Está seguro de que desea cambiar esta programación de proceso?',\n saveNotificationSuccessUpdate: 'Programación de proceso actualizada con éxito.',\n saveNotificationSuccessSave: 'Programación de proceso salvo con éxito.',\n parametersNotFound: 'No se encontraron parámetros.',\n frequency: 'Frecuencia',\n to: 'de',\n from: 'a'\n },\n pt: {\n at: 'às',\n back: 'Voltar',\n next: 'Avançar',\n periodicity: 'Periodicidade',\n execution: 'Execução',\n process: 'Processo',\n enterProcess: 'Informe um processo',\n recurrent: 'Recorrente',\n single: 'Única',\n daily: 'Diária',\n weekly: 'Semanal',\n monthly: 'Mensal',\n scheduling: 'Agendamento',\n parameterization: 'Parametrização',\n conclude: 'Concluir',\n firstExecution: 'Primeira execução',\n startTime: 'Horário inicial',\n endTime: 'Horário final',\n time: 'Horário',\n hour: 'Hora',\n minute: 'Minuto',\n day: 'Dia',\n endDay: 'Dia final',\n startDay: 'Dia inicial',\n weekDays: 'Dias de semana',\n sunday: 'Domingo',\n monday: 'Segunda-feira',\n tuesday: 'Terça-feira',\n wednesday: 'Quarta-feira',\n thursday: 'Quinta-feira',\n friday: 'Sexta-feira',\n saturday: 'Sábado',\n parameters: 'Parâmetros',\n yes: 'Sim',\n no: 'Não',\n notReported: 'Não informado',\n periodicityData: 'Dados da periodicidade',\n confirmation: 'Confirmação',\n confirmSaveMessage: 'Tem certeza que deseja concluir este agendamento de processo?',\n confirmUpdateMessage: 'Tem certeza que deseja alterar este agendamento de processo?',\n saveNotificationSuccessUpdate: 'Agendamento de processo atualizado com sucesso.',\n saveNotificationSuccessSave: 'Agendamento de processo salvo com sucesso.',\n parametersNotFound: 'Parâmetros não foram encontrados.',\n frequency: 'Frequência',\n to: 'das',\n from: 'até'\n },\n ru: {\n at: 'в',\n back: 'Назад',\n next: 'Следующий',\n periodicity: 'Периодичность',\n execution: 'Выполнение',\n process: 'Процесс',\n enterProcess: 'Укажите процесс',\n recurrent: 'Периодически',\n single: 'Одиночный',\n daily: 'Ежедневно',\n weekly: 'Еженедельно',\n monthly: 'Ежемесячно',\n scheduling: 'Планирование',\n parameterization: 'Параметризация',\n conclude: 'Завершить',\n firstExecution: 'Первичное выполнение',\n startTime: 'начальное время',\n endTime: 'время окончания',\n time: 'расписание',\n hour: 'Час',\n day: 'День',\n minute: 'минута',\n endDay: 'последний день',\n startDay: 'день начала',\n weekDays: 'Рабочие дни',\n sunday: 'Воскресенье',\n monday: 'Понедельник',\n tuesday: 'Вторник',\n wednesday: 'Среда',\n thursday: 'Четверг',\n friday: 'Пятница',\n saturday: 'Суббота',\n parameters: 'Параметры',\n yes: 'Да',\n no: 'Нет',\n notReported: 'Не сообщается',\n periodicityData: 'Данные о периодичности',\n confirmation: 'Подтверждение',\n confirmSaveMessage: 'Вы уверены, что хотите завершить это расписание?',\n confirmUpdateMessage: 'Вы уверены, что хотите обновить это расписание?',\n saveNotificationSuccessUpdate: 'Расписание успешно обновлено',\n saveNotificationSuccessSave: 'Расписание успешно сохранено ',\n parametersNotFound: 'Параметры не найдены',\n frequency: 'Частота',\n to: 'с',\n from: 'до'\n }\n};\n","import { Injectable, inject } from '@angular/core';\n\nimport { Observable } from 'rxjs';\n\nimport { PoLookupFilter } from '@po-ui/ng-components';\n\nimport { PoPageJobSchedulerService } from './po-page-job-scheduler.service';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageJobSchedulerLookupService implements PoLookupFilter {\n private readonly poPageJobSchedulerService = inject(PoPageJobSchedulerService);\n\n getFilteredItems({ filter, page, pageSize }): Observable {\n const params = { page, pageSize, search: filter };\n\n return this.poPageJobSchedulerService.getProcesses(params);\n }\n\n getObjectByValue(processId: string): Observable {\n return this.poPageJobSchedulerService.getProcess(processId);\n }\n}\n","import { Directive, Input, TemplateRef } from '@angular/core';\n\n/**\n * @usedBy PoPageJobScheduler\n *\n * @description\n *\n * Esta diretiva permite personalizar o conteúdo da uma ou várias etapa(s) de parametrização do componente de PoPageJobScheduler.\n *\n * Para repassar as alterações realizadas no componente customizado ao model do PoPageJobScheduler, deve\n * ser atualizado os valores através da propriedade p-execution-parameter. Dessa forma as alterações serão adicionadas ao\n * atributo executionParameter do objeto de envio a Api.\n * É possível também controlar a permissão de avançar, fazendo uso da propriedade p-disable-advance.\n *\n * ```\n * ...\n * \n * \n * ...\n * \n * \n * ...\n * \n * \n * ...\n * ```\n *\n */\n@Directive({\n selector: '[p-job-scheduler-parameters-template]',\n standalone: false\n})\nexport class PoJobSchedulerParametersTemplateDirective {\n /**\n * @optional\n *\n * @description\n *\n * Objeto que deve conter as alterações feitas pelo componente de template que serão repassadas dentro do atributo\n * `executionParameter` para envio na api.\n *\n * > O componente deve manter essa propriedade atualizada. É chamada após o avançar da etapa de parametrização.\n */\n @Input('p-execution-parameter') executionParameter: object;\n\n /**\n * @optional\n *\n * @default false\n *\n * @description\n *\n * Determina se deve desabilitar o botão de avançar para a próxima etapa\n *\n * > Pode ser utilizado para validar campos antes de avançar.\n */\n @Input('p-disable-advance') disabledAdvance: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Determina o label do step\n */\n @Input('p-label-step') title: string;\n\n // Necessário manter templateRef para o funcionamento do row template.\n constructor(public templateRef: TemplateRef) {}\n}\n","import { Directive, TemplateRef } from '@angular/core';\n\n/**\n * @usedBy PoPageJobScheduler\n *\n * @description\n *\n * Esta diretiva permite personalizar o conteúdo de resumo das informações de parâmetro na etapa de conclusão do componente de PoPageJobScheduler.\n *\n * Essa funcionalidade costuma ser útil em casos onde a propriedade parameters não tem valor e mesmo assim é necessário exibir\n * as informações de resumo na etapa de conclusão.\n *\n * ```\n * ...\n * \n * \n * ...\n * \n * \n * \n * ...\n * ```\n *\n */\n@Directive({\n selector: '[p-job-scheduler-summary-template]',\n standalone: false\n})\nexport class PoJobSchedulerSummaryTemplateDirective {\n // Necessário manter templateRef para o funcionamento do row template.\n constructor(public templateRef: TemplateRef) {}\n}\n","import {\n AfterViewInit,\n Component,\n EventEmitter,\n Input,\n OnInit,\n Output,\n TemplateRef,\n ViewChild,\n inject\n} from '@angular/core';\nimport { NgForm } from '@angular/forms';\n\nimport { PoCheckboxGroupOption, PoRadioGroupOption } from '@po-ui/ng-components';\n\nimport { isTypeof } from '../../../utils/util';\n\nimport { PoPageJobSchedulerLookupService } from '../po-page-job-scheduler-lookup.service';\nimport { PoPageJobSchedulerService } from '../po-page-job-scheduler.service';\n\n@Component({\n selector: 'po-page-job-scheduler-execution',\n templateUrl: 'po-page-job-scheduler-execution.component.html',\n standalone: false\n})\nexport class PoPageJobSchedulerExecutionComponent implements OnInit, AfterViewInit {\n private readonly poPageJobSchedulerService = inject(PoPageJobSchedulerService);\n poPageJobSchedulerLookup = inject(PoPageJobSchedulerLookupService);\n\n @ViewChild('formExecution', { static: true }) form: NgForm;\n\n // templates\n @ViewChild('dailyTemplate', { static: true }) dailyTemplate;\n @ViewChild('monthlyTemplate', { static: true }) monthlyTemplate;\n @ViewChild('weeklyTemplate', { static: true }) weeklyTempalte;\n\n @Input('p-components-size') componentsSize: string;\n\n @Input('p-is-edit') isEdit: boolean = false;\n\n @Input('p-literals') literals = {};\n\n @Input('p-no-parameters') noParameters: boolean = true;\n @Input('p-no-custom-params-component') noCustomParamsComponent: boolean = true;\n\n @Output('p-change-process') changeProcess: EventEmitter = new EventEmitter();\n\n dayPattern = '^(3[0-1]|[0-2][0-9]|[1-9]|0[1-9])$';\n existProcessAPI = true;\n minDateFirstExecution = new Date();\n periodicityOptions: Array = [];\n periodicityTemplates: { daily: TemplateRef; weekly: TemplateRef; monthly: TemplateRef };\n timePattern = '^(2[0-3]|[01][0-9]):?([0-5][0-9])$';\n weekDays: Array = [];\n frequencyOptions: Array = [];\n containsFrequency = false;\n frequency: string = 'hour';\n rangeLimitHour: string;\n\n private _value: any = {};\n\n @Input('p-value') set value(value: any) {\n this._value = value && isTypeof(value, 'object') ? value : {};\n\n this.containsFrequency = this._value.frequency && this._value.frequency.value ? true : false;\n }\n\n get value() {\n return this._value;\n }\n\n get startDateFirstExecution() {\n return this.isEdit ? undefined : this.minDateFirstExecution;\n }\n\n get hourLabel() {\n return this.containsFrequency ? this.literals.startTime : this.literals.time;\n }\n\n get dayLabel() {\n return this.containsFrequency ? this.literals.startDay : this.literals.day;\n }\n\n ngAfterViewInit() {\n setTimeout(() => {\n this.subscribeProcessIdValueChanges();\n\n if (this.value.periodicity) {\n this.frequencyOptions = this.frequencyOptions.map(frequencyOption => ({\n ...frequencyOption,\n disabled: frequencyOption.value === 'day' && this.value.periodicity !== 'monthly'\n }));\n }\n });\n }\n\n ngOnInit() {\n this.periodicityTemplates = {\n daily: this.dailyTemplate,\n monthly: this.monthlyTemplate,\n weekly: this.weeklyTempalte\n };\n\n if (this.noParameters && this.noCustomParamsComponent) {\n this.checkExistsProcessesAPI();\n }\n\n this.periodicityOptions = this.getPeriodicityOptions();\n this.weekDays = this.getWeekDays();\n this.frequencyOptions = this.getFrequencyOptions();\n }\n\n onChangeContainsFrequency(containsFrequency) {\n if (containsFrequency) {\n this.value.frequency = { type: 'hour', value: null };\n } else {\n this.value.frequency = {};\n }\n\n this.value.rangeLimitHour = null;\n this.value.rangeLimitDay = null;\n this.value.dayOfMonth = null;\n }\n\n onChangePeriodicityOptions(periodicity) {\n this.frequencyOptions = this.frequencyOptions.map(frequencyOption => ({\n ...frequencyOption,\n disabled: frequencyOption.value === 'day' && periodicity !== 'monthly'\n }));\n\n this.value.frequency.type = null;\n }\n\n onChangeFrequencyOptions() {\n this.value.rangeLimitHour = null;\n }\n\n private checkExistsProcessesAPI() {\n this.poPageJobSchedulerService.getHeadProcesses().subscribe(undefined, error => {\n this.existProcessAPI = false;\n });\n }\n\n private getPeriodicityOptions() {\n return [\n { label: this.literals.single, value: 'single' },\n { label: this.literals.daily, value: 'daily' },\n { label: this.literals.weekly, value: 'weekly' },\n { label: this.literals.monthly, value: 'monthly' }\n ];\n }\n\n private getFrequencyOptions() {\n return [\n { label: this.literals.day, value: 'day' },\n { label: this.literals.hour, value: 'hour' },\n { label: this.literals.minute, value: 'minute' }\n ];\n }\n\n private getWeekDays() {\n return [\n { label: this.literals.sunday, value: 'Sunday' },\n { label: this.literals.monday, value: 'Monday' },\n { label: this.literals.tuesday, value: 'Tuesday' },\n { label: this.literals.wednesday, value: 'Wednesday' },\n { label: this.literals.thursday, value: 'Thursday' },\n { label: this.literals.friday, value: 'Friday' },\n { label: this.literals.saturday, value: 'Saturday' }\n ];\n }\n\n private subscribeProcessIdValueChanges() {\n this.form.controls['processID']?.valueChanges.subscribe(processId => {\n this.changeProcess.emit({ processId, existAPI: this.existProcessAPI });\n });\n }\n}\n","
\n
\n @if (existProcessAPI) {\n @if (noParameters && noCustomParamsComponent) {\n \n \n }\n } @else {\n \n \n }\n
\n\n
\n \n\n \n \n\n \n \n
\n\n
\n\n
\n \n \n\n @if (value.periodicity !== 'single') {\n
\n \n \n @if (containsFrequency) {\n \n \n \n \n }\n
\n
\n \n \n
\n
\n \n \n
\n }\n
\n\n \n \n \n\n \n
\n \n
\n\n \n \n \n\n \n \n \n\n @if (containsFrequency) {\n \n \n }\n\n \n \n\n \n \n \n\n @if (containsFrequency && value.frequency.type !== 'day') {\n \n \n }\n \n
\n","import { AfterViewInit, Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';\nimport { NgForm } from '@angular/forms';\n\nimport { PoDynamicFormField } from '@po-ui/ng-components';\n\n@Component({\n selector: 'po-page-job-scheduler-parameters',\n templateUrl: 'po-page-job-scheduler-parameters.component.html',\n standalone: false\n})\nexport class PoPageJobSchedulerParametersComponent implements AfterViewInit {\n @ViewChild('parametersForm') form: NgForm;\n\n @Input('p-components-size') componentsSize: string;\n\n @Input('p-literals') literals = {};\n\n @Input('p-parameters') parameters: Array = [];\n\n @Input('p-value') value;\n\n @Output('p-valueChange') valueChange: EventEmitter = new EventEmitter();\n\n ngAfterViewInit() {\n if (this.form) {\n setTimeout(() => {\n this.form.valueChanges.subscribe(value => {\n this.valueChange.emit(value);\n });\n });\n }\n }\n}\n","@if (parameters && parameters.length) {\n
\n \n \n
\n} @else {\n
\n \n \n {{ literals.parametersNotFound }}\n \n
\n}\n","import { DatePipe } from '@angular/common';\nimport { Component, Input, OnInit, inject } from '@angular/core';\n\nimport { PoDynamicViewField, PoInfoOrientation } from '@po-ui/ng-components';\n\nimport { PoJobSchedulerInternal } from '../interfaces/po-job-scheduler-internal.interface';\n\n@Component({\n selector: 'po-page-job-scheduler-summary',\n templateUrl: 'po-page-job-scheduler-summary.component.html',\n standalone: false\n})\nexport class PoPageJobSchedulerSummaryComponent implements OnInit {\n private readonly datePipe = inject(DatePipe);\n\n @Input('p-components-size') componentsSize: string;\n\n @Input('p-literals') literals = {};\n\n @Input('p-parameters') parameters: Array = [];\n\n @Input('p-value') value: PoJobSchedulerInternal = {};\n\n @Input('p-no-parameters') noParameters: boolean = true;\n\n @Input('p-summary-template') jobSchedulerSummaryTemplate;\n\n executionValue = '';\n firstExecutionValue = '';\n infoOrientation = PoInfoOrientation.Horizontal;\n periodicityValue = '';\n frequencyValue = '';\n rangeLimitHour = '';\n rangeLimitDay = '';\n recurrentValue = '';\n\n ngOnInit() {\n const {\n periodicity,\n hour,\n dayOfMonth,\n daysOfWeek,\n recurrent,\n firstExecution,\n firstExecutionHour,\n frequency,\n rangeLimitHour,\n rangeLimitDay\n } = this.value;\n\n this.periodicityValue = this.getPeriodicityLabel(periodicity);\n if (frequency) {\n this.frequencyValue = this.getFrequencyValue(frequency, periodicity);\n }\n this.executionValue = this.getExecutionValue(\n periodicity,\n hour,\n daysOfWeek,\n dayOfMonth,\n rangeLimitHour,\n rangeLimitDay\n );\n this.firstExecutionValue = this.getFirstExecutionLabel(firstExecution, firstExecutionHour);\n this.recurrentValue = this.getRecurrentValue(recurrent);\n }\n\n private getFrequencyValue(frequency, periodicity) {\n return frequency['value'] && frequency['type'] && periodicity !== 'single'\n ? `${frequency['value']} - ${frequency['type']}`\n : '';\n }\n\n private getExecutionValue(\n periodicity: string,\n hour?: string,\n daysOfWeek?: Array,\n dayOfMonth?: number,\n rangeLimitHour?: string,\n rangeLimitDay?: number\n ) {\n switch (periodicity) {\n case 'daily':\n return this.getHourLabel(hour, rangeLimitHour);\n case 'monthly':\n return this.getMonthlyLabelExecution(dayOfMonth, hour, rangeLimitHour, rangeLimitDay);\n case 'weekly':\n return this.getWeeklyLabelExecution(daysOfWeek, hour, rangeLimitHour);\n default:\n return this.literals.notReported;\n }\n }\n\n private getFirstExecutionLabel(firstExecution: Date, firstExecutionHour?: string): string {\n if (firstExecution) {\n const date = this.datePipe.transform(firstExecution, 'dd/MM/yyyy', '-0200');\n\n return `${date} ${this.getHourLabel(firstExecutionHour)}`;\n } else {\n return this.literals.notReported;\n }\n }\n\n private getHourLabel(hour: string, rangeLimitHour?) {\n return `${rangeLimitHour ? this.literals.from : this.literals.at} ${hour || '00:00'} ${\n rangeLimitHour ? this.literals.to + ' ' + rangeLimitHour : ''\n }`;\n }\n\n private getMonthlyLabelExecution(dayOfMonth: number, hour: string, rangeLimitHour?: string, rangeLimitDay?: number) {\n const hourLabel = this.getHourLabel(hour, rangeLimitHour);\n\n return `${rangeLimitDay ? this.literals.from : ''} ${dayOfMonth} ${rangeLimitDay ? this.literals.to : ''} ${\n rangeLimitDay ? rangeLimitDay : ''\n } ${hourLabel}`;\n }\n\n private getPeriodicityLabel(periodicity) {\n switch (periodicity) {\n case 'daily':\n return this.literals.daily;\n case 'monthly':\n return this.literals.monthly;\n case 'weekly':\n return this.literals.weekly;\n default:\n return this.literals.single;\n }\n }\n\n private getRecurrentValue(recurrent: boolean): string {\n return recurrent ? this.literals.yes : this.literals.no;\n }\n\n private getSorterWeekDays() {\n return {\n 'sunday': 0,\n 'monday': 1,\n 'tuesday': 2,\n 'wednesday': 3,\n 'thursday': 4,\n 'friday': 5,\n 'saturday': 6\n };\n }\n\n private getTranslateWeekDay(day: string): string {\n const days = {\n Sunday: this.literals.sunday,\n Monday: this.literals.monday,\n Tuesday: this.literals.tuesday,\n Wednesday: this.literals.wednesday,\n Thursday: this.literals.thursday,\n Friday: this.literals.friday,\n Saturday: this.literals.saturday\n };\n\n return days[day] || '';\n }\n\n private getWeekDaysLabel(days: Array = []): string {\n const weekDaysSorted = this.sortWeekDays(days);\n\n return weekDaysSorted.map(day => this.getTranslateWeekDay(day)).join(', ');\n }\n\n private getWeeklyLabelExecution(daysOfWeek: Array, hour: string, rangeLimitHour?: string) {\n if (daysOfWeek && Array.isArray(daysOfWeek)) {\n return `${this.getWeekDaysLabel(daysOfWeek)} ${this.getHourLabel(hour, rangeLimitHour)}`;\n } else {\n return this.literals.notReported;\n }\n }\n\n private sortWeekDays(days: Array = []) {\n const sorterWeekDays = this.getSorterWeekDays();\n\n return days.sort((a: string, b: string) => {\n const currDay = a.toLowerCase();\n const nextDay = b.toLowerCase();\n\n return sorterWeekDays[currDay] > sorterWeekDays[nextDay] ? 1 : -1;\n });\n }\n}\n","
\n @if (!noParameters) {\n \n \n }\n\n \n \n\n @if (frequencyValue !== '') {\n \n \n }\n\n @if (value.periodicity !== 'single') {\n \n \n }\n\n \n \n\n \n \n
\n@if (parameters && parameters.length && !jobSchedulerSummaryTemplate) {\n \n \n \n \n}\n@if (jobSchedulerSummaryTemplate) {\n
\n \n
\n}\n","import {\n AfterContentInit,\n Component,\n ContentChild,\n ContentChildren,\n OnInit,\n QueryList,\n ViewChild,\n ViewEncapsulation,\n inject\n} from '@angular/core';\nimport { NgForm } from '@angular/forms';\nimport { ActivatedRoute } from '@angular/router';\n\nimport { Observable } from 'rxjs';\n\nimport {\n PoDialogService,\n PoDynamicFormField,\n PoLanguageService,\n PoNotificationService,\n PoPageAction,\n PoStepperItem,\n PoStepperStatus,\n poLocaleDefault\n} from '@po-ui/ng-components';\n\nimport { PoJobSchedulerInternal } from './interfaces/po-job-scheduler-internal.interface';\nimport { PoPageJobSchedulerBaseComponent } from './po-page-job-scheduler-base.component';\nimport { PoPageJobSchedulerInternal } from './po-page-job-scheduler-internal';\nimport { poPageJobSchedulerLiteralsDefault } from './po-page-job-scheduler-literals';\nimport { PoPageJobSchedulerLookupService } from './po-page-job-scheduler-lookup.service';\nimport { PoJobSchedulerParametersTemplateDirective } from './po-page-job-scheduler-parameters';\nimport { PoJobSchedulerSummaryTemplateDirective } from './po-page-job-scheduler-summary';\nimport { PoPageJobSchedulerService } from './po-page-job-scheduler.service';\n\n/**\n * @docsExtends PoPageJobSchedulerBaseComponent\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n */\n@Component({\n selector: 'po-page-job-scheduler',\n templateUrl: './po-page-job-scheduler.component.html',\n encapsulation: ViewEncapsulation.None,\n styles: [],\n standalone: false\n})\nexport class PoPageJobSchedulerComponent extends PoPageJobSchedulerBaseComponent implements OnInit, AfterContentInit {\n poPageDynamicLookupService = inject(PoPageJobSchedulerLookupService);\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly poDialogService = inject(PoDialogService);\n private readonly poNotification = inject(PoNotificationService);\n\n @ViewChild('schedulerExecution', { static: true }) schedulerExecution: { form: NgForm };\n @ViewChild('schedulerParameters') schedulerParameters: { form: NgForm };\n @ContentChildren(PoJobSchedulerParametersTemplateDirective)\n parametersTemplate: QueryList;\n\n @ContentChild(PoJobSchedulerSummaryTemplateDirective)\n jobSchedulerSummaryTemplate: PoJobSchedulerSummaryTemplateDirective;\n\n isEdit = false;\n literals = {\n ...poPageJobSchedulerLiteralsDefault[poLocaleDefault]\n };\n\n publicValues: PoJobSchedulerInternal;\n saveOperation: Observable;\n step: number = 1;\n parametersEmpty: boolean = true;\n\n stepParametersInitialized = false;\n\n protected steps: Array = [];\n\n private readonly backPageAction: PoPageAction = {\n label: this.literals.back,\n action: this.nextStepOperation.bind(this, 'back'),\n disabled: this.isDisabledBack.bind(this)\n };\n\n private readonly concludePageAction: PoPageAction = {\n label: this.literals.conclude,\n action: this.confirmJobScheduler.bind(this)\n };\n\n private readonly nextPageAction: PoPageAction = {\n label: this.literals.next,\n action: this.nextStepOperation.bind(this, 'next'),\n disabled: this.isDisabledAdvance.bind(this)\n };\n\n private readonly concludePageActions: Array = [this.concludePageAction, this.backPageAction];\n\n private readonly nextPageActions: Array = [this.nextPageAction, this.backPageAction];\n\n // eslint-disable-next-line @typescript-eslint/member-ordering\n jobSchedulerActions: Array = [...this.nextPageActions];\n\n protected stepExecution = 1;\n protected stepParameters = 2;\n protected stepSummary = 3;\n protected _stepExecutionLast: boolean;\n\n constructor() {\n const poPageJobSchedulerService = inject(PoPageJobSchedulerService);\n const languageService = inject(PoLanguageService);\n\n super(poPageJobSchedulerService);\n this.poPageJobSchedulerService = poPageJobSchedulerService;\n\n const language = languageService.getShortLanguage();\n\n this.literals = {\n ...this.literals,\n ...poPageJobSchedulerLiteralsDefault[language]\n };\n\n this.backPageAction.label = this.literals.back;\n this.concludePageAction.label = this.literals.conclude;\n this.nextPageAction.label = this.literals.next;\n }\n\n get stepperOrientation(): 'horizontal' | 'vertical' {\n return (\n this.stepperDefaultOrientation || (window.innerWidth > 481 && window.innerWidth < 960 ? 'horizontal' : 'vertical')\n );\n }\n\n ngOnInit() {\n const paramId = this.activatedRoute.snapshot.params['id'];\n\n this.isEdit = !!paramId;\n\n this.poPageJobSchedulerService.configServiceApi({ endpoint: this.serviceApi });\n\n if (this.parameters.length) {\n this.parametersEmpty = false;\n }\n\n this.loadData(paramId);\n }\n\n ngAfterContentInit(): void {\n this.checkStepExecutionLast();\n this.getSteps();\n }\n\n changePageActionsBySteps(currentStep: number, nextStep: number) {\n const stepsLength = this.steps.length;\n\n if (nextStep === stepsLength) {\n this.jobSchedulerActions = [...this.concludePageActions];\n } else if (currentStep === stepsLength && nextStep < currentStep) {\n this.jobSchedulerActions = [...this.nextPageActions];\n }\n }\n\n nextStep(stepNumber: number) {\n const operation: 'back' | 'next' = stepNumber > this.step ? 'next' : 'back';\n\n if (!this.canNavigate(stepNumber, operation)) return;\n\n this.prepareNavigation(operation, stepNumber);\n this.applyStep(stepNumber, operation);\n }\n\n private canNavigate(stepNumber: number, operation: 'back' | 'next'): boolean {\n const jumpStep = Math.abs(stepNumber - this.step);\n\n if (operation === 'next' && jumpStep > 1) return false;\n\n if (operation === 'back' && jumpStep > 1 && !this.allowDirectNavigation) {\n return false;\n }\n\n return (\n this.validateStepExecution() && this.validateStepSchedulerParameters() && this.validateStepTemplateParameters()\n );\n }\n\n private prepareNavigation(operation: 'back' | 'next', stepNumber: number): void {\n if (operation === 'back') {\n this.resetStepsStatus(stepNumber);\n }\n\n if (this.step === this.stepExecution) {\n this.setModelRecurrent();\n }\n\n this.setPropertiesFromTemplate();\n }\n\n private applyStep(stepNumber: number, operation: 'back' | 'next'): void {\n if (stepNumber === this.steps.length) {\n const model = JSON.parse(JSON.stringify(this.model));\n this.publicValues = this.hidesSecretValues(model);\n }\n\n this.steps[this.step - 1].status = operation === 'next' ? PoStepperStatus.Done : PoStepperStatus.Default;\n\n this.changePageActionsBySteps(this.step, stepNumber);\n this.step = stepNumber;\n\n this.stepParametersInitialized = this.stepParametersInitialized || stepNumber === this.stepParameters;\n }\n\n private resetStepsStatus(fromStep: number): void {\n for (let i = fromStep; i < this.step; i++) {\n this.steps[i].status = PoStepperStatus.Default;\n }\n }\n\n onChangeProcess(process: { processId: string; existAPI: boolean }) {\n if (process.existAPI && process.processId && this.parametersEmpty && !this.parametersTemplate.length) {\n this.getParametersByProcess(process.processId);\n if (!this.isEdit) {\n this.model.executionParameter = {};\n }\n }\n }\n\n private checkStepExecutionLast() {\n if (!this.parametersTemplate.length) {\n this._stepExecutionLast = false;\n return;\n }\n\n this._stepExecutionLast = this.stepExecutionLast;\n }\n\n private confirmJobScheduler() {\n const paramId = this.activatedRoute.snapshot.params['id'];\n\n const confirmMessage = paramId ? this.literals.confirmUpdateMessage : this.literals.confirmSaveMessage;\n\n this.poDialogService.confirm({\n title: this.literals.confirmation,\n message: confirmMessage,\n confirm: () => {\n const beforeSendModel = this.beforeSendAction ? this.beforeSendAction(this.model) : undefined;\n\n const model = { ...(beforeSendModel || this.model) };\n\n this.save(model, paramId);\n }\n });\n }\n\n private emitSuccessMessage(msgSuccess: any, saveOperation: Observable) {\n saveOperation.subscribe({\n next: () => {\n this.success.emit();\n this.poNotification.success(msgSuccess);\n this.resetJobSchedulerForm();\n },\n error: e => this.error.emit(e)\n });\n }\n\n private getParametersByProcess(process: any) {\n this.poPageJobSchedulerService.getParametersByProcess(process).subscribe(parameters => {\n this.parameters = parameters;\n });\n }\n\n private hidesSecretValues(model: PoJobSchedulerInternal): PoJobSchedulerInternal {\n const hiddenSecretValue = '**********';\n this.parameters.forEach(parameter => {\n if (this.isSecretParameter(model, parameter)) {\n model.executionParameter[parameter.property] = hiddenSecretValue;\n }\n });\n return model;\n }\n\n private getSteps() {\n const templateArray: Array = [];\n\n this.parametersTemplate.toArray().forEach((value, index, array) => {\n templateArray.push({\n label: value.title || `${this.literals.parameterization} ${array.length > 1 ? index + 1 : ''}`\n });\n });\n\n let _steps = [];\n\n if (!this._stepExecutionLast) {\n _steps.push({ label: this.literals.scheduling });\n }\n\n if (!templateArray.length) {\n _steps.push({ label: this.literals.parameterization });\n } else {\n _steps = [..._steps, ...templateArray];\n }\n\n if (this._stepExecutionLast) {\n _steps.push({ label: this.literals.scheduling });\n }\n\n _steps.push({ label: this.literals.conclude });\n\n this.steps = _steps;\n\n this.stepSummary = this.steps.length;\n if (this._stepExecutionLast) {\n this.stepExecution = this.stepSummary - 1;\n }\n }\n\n private getTemplateCurrent() {\n const indexTemplate = this.step - (this.stepExecutionLast ? 1 : 2);\n return this.parametersTemplate.toArray()[indexTemplate];\n }\n\n private templateHasDisable(): boolean {\n const template = this.getTemplateCurrent();\n\n return !template?.disabledAdvance;\n }\n\n private isDisabledAdvance(): boolean {\n if (this.step === this.stepExecution) {\n return this.schedulerExecution?.form?.invalid;\n }\n\n if (this.schedulerParameters) {\n return this.schedulerParameters?.form?.invalid;\n }\n\n const templateCurrent = this.getTemplateCurrent();\n\n if (templateCurrent) {\n return templateCurrent.disabledAdvance;\n }\n\n return false;\n }\n\n private isDisabledBack(): boolean {\n return this.step === 1;\n }\n\n private isSecretParameter(model: PoJobSchedulerInternal, parameter: PoDynamicFormField): boolean {\n return (\n model.executionParameter &&\n parameter.hasOwnProperty('secret') &&\n parameter['secret'] === true &&\n model.executionParameter.hasOwnProperty(parameter.property)\n );\n }\n\n private nextStepOperation(operation?: 'back' | 'next') {\n const stepNumber = operation === 'back' ? this.step - 1 : this.step + 1;\n\n this.nextStep(stepNumber);\n }\n\n private resetJobSchedulerForm() {\n this.schedulerExecution.form.reset();\n\n setTimeout(() => {\n this.model = new PoPageJobSchedulerInternal();\n\n this.step = 1;\n this.steps.forEach(step => {\n step.status = PoStepperStatus.Default;\n });\n\n this.jobSchedulerActions = [...this.nextPageActions];\n });\n }\n\n private save(model: PoJobSchedulerInternal, paramId) {\n const saveOperation = paramId\n ? this.poPageJobSchedulerService.updateResource(paramId, model)\n : this.poPageJobSchedulerService.createResource(model);\n\n const msgSuccess = paramId\n ? this.literals.saveNotificationSuccessUpdate\n : this.literals.saveNotificationSuccessSave;\n\n this.emitSuccessMessage(msgSuccess, saveOperation);\n }\n\n private setModelRecurrent() {\n this.model.recurrent = this.model.periodicity === 'single' ? false : this.model.recurrent;\n }\n\n private setPropertiesFromTemplate() {\n const templateCurrent = this.getTemplateCurrent();\n\n if (!templateCurrent) {\n return;\n }\n\n this.model = {\n ...this.model,\n executionParameter: { ...this.model.executionParameter, ...templateCurrent.executionParameter }\n };\n }\n\n private validateStepExecution(): boolean {\n const stepCurrent = this.step;\n\n if (stepCurrent == this.stepExecution && this.schedulerExecution.form.invalid) {\n this.markAsDirtyInvalidControls(this.schedulerExecution.form.controls);\n return false;\n }\n\n return true;\n }\n\n private validateStepSchedulerParameters(): boolean {\n if (this.step === this.stepExecution || this.step === this.stepSummary) {\n return true;\n }\n\n if (this.schedulerParameters && this.schedulerParameters.form && this.schedulerParameters.form.invalid) {\n this.markAsDirtyInvalidControls(this.schedulerParameters.form.controls);\n return false;\n }\n\n return true;\n }\n\n private validateStepTemplateParameters(): boolean {\n if (this.step === this.stepExecution || this.step === this.stepSummary) {\n return true;\n }\n\n if (!this.parametersTemplate.length) {\n return true;\n }\n\n return this.templateHasDisable();\n }\n}\n","\n
\n \n \n\n \n
\n
\n \n \n\n @if (stepParametersInitialized && !parametersTemplate.length) {\n \n \n }\n\n @if (step === stepSummary) {\n \n \n }\n
\n
\n\n @for (template of parametersTemplate; track template; let index = $index) {\n
\n \n
\n }\n \n
\n\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule } from '@angular/core';\n\nimport {\n PoButtonModule,\n PoContainerModule,\n PoDialogModule,\n PoDividerModule,\n PoDynamicModule,\n PoFieldModule,\n PoIconModule,\n PoInfoModule,\n PoPageModule,\n PoStepperModule,\n PoWidgetModule\n} from '@po-ui/ng-components';\n\nimport { PoPageJobSchedulerComponent } from './po-page-job-scheduler.component';\nimport { PoPageJobSchedulerExecutionComponent } from './po-page-job-scheduler-execution/po-page-job-scheduler-execution.component';\nimport { PoPageJobSchedulerLookupService } from './po-page-job-scheduler-lookup.service';\nimport { PoPageJobSchedulerParametersComponent } from './po-page-job-scheduler-parameters/po-page-job-scheduler-parameters.component';\nimport { PoPageJobSchedulerService } from './po-page-job-scheduler.service';\nimport { PoPageJobSchedulerSummaryComponent } from './po-page-job-scheduler-summary/po-page-job-scheduler-summary.component';\nimport { PoJobSchedulerParametersTemplateDirective } from './po-page-job-scheduler-parameters';\nimport { PoJobSchedulerSummaryTemplateDirective } from './po-page-job-scheduler-summary/po-job-scheduler-summary-template';\n\n@NgModule({\n declarations: [\n PoPageJobSchedulerComponent,\n PoPageJobSchedulerExecutionComponent,\n PoPageJobSchedulerParametersComponent,\n PoPageJobSchedulerSummaryComponent,\n PoJobSchedulerParametersTemplateDirective,\n PoJobSchedulerSummaryTemplateDirective\n ],\n exports: [\n PoPageJobSchedulerComponent,\n PoJobSchedulerParametersTemplateDirective,\n PoJobSchedulerSummaryTemplateDirective\n ],\n imports: [\n CommonModule,\n FormsModule,\n PoButtonModule,\n PoContainerModule,\n PoDialogModule,\n PoDividerModule,\n PoDynamicModule,\n PoFieldModule,\n PoIconModule,\n PoInfoModule,\n PoPageModule,\n PoStepperModule,\n PoWidgetModule\n ],\n providers: [PoPageJobSchedulerService, PoPageJobSchedulerLookupService]\n})\nexport class PoPageJobSchedulerModule {}\n","/**\n * @usedBy PoPageLoginComponent\n *\n * @description\n *\n * *Enum* para definição do tipo de autenticação.\n */\nexport enum PoPageLoginAuthenticationType {\n /** Autenticação Basic */\n Basic = 'Basic',\n\n /** Autenticação Bearer */\n Bearer = 'Bearer'\n}\n","import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable } from '@angular/core';\n\nimport { Observable } from 'rxjs';\n\nimport { PoPageLogin } from './interfaces/po-page-login.interface';\nimport { PoPageLoginAuthenticationType } from './enums/po-page-login-authentication-type.enum';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PoPageLoginService {\n constructor(private readonly http: HttpClient) {}\n\n onLogin(url: string, type: PoPageLoginAuthenticationType, loginForm: PoPageLogin): Observable {\n if (type === PoPageLoginAuthenticationType.Bearer) {\n loginForm.password = btoa(loginForm.password);\n return this.http.post(url, loginForm);\n } else {\n const user = `(${loginForm.login}:${loginForm.password})`;\n const headers = new HttpHeaders({\n 'Authorization': `${type} ` + btoa(user)\n });\n delete loginForm.login;\n delete loginForm.password;\n return this.http.post(url, loginForm, { headers });\n }\n }\n}\n","import { Directive, EventEmitter, HostBinding, HostListener, Input, OnDestroy, Output } from '@angular/core';\nimport { Router } from '@angular/router';\nimport { Subscription } from 'rxjs';\n\nimport { convertToBoolean, getDefaultSizeFn, isTypeof, validateSizeFn, PoUtils } from './../../utils/util';\n\nimport { PoLanguage, poLanguageDefault, PoLanguageService, poLocaleDefault } from '@po-ui/ng-components';\n\nimport { PoPageLoginAuthenticationType } from './enums/po-page-login-authentication-type.enum';\nimport { PoPageLoginCustomField } from './interfaces/po-page-login-custom-field.interface';\nimport { PoPageLoginLiterals } from './interfaces/po-page-login-literals.interface';\nimport { PoPageLoginRecovery } from './interfaces/po-page-login-recovery.interface';\nimport { PoPageLogin } from './interfaces/po-page-login.interface';\nimport { PoPageLoginService } from './po-page-login.service';\n\nconst poPageLoginContentMaxLength = 40;\n\nexport const poPageLoginLiteralsDefault = {\n en: {\n title: 'Welcome',\n loginErrorPattern: 'Invalid Login',\n loginHint: `Your login user was given to you at your first day.\n If you don't have this information contact support`,\n loginPlaceholder: 'Insert your e-mail',\n passwordErrorPattern: 'Invalid Password',\n passwordPlaceholder: 'Insert your password',\n customFieldErrorPattern: 'Invalid value',\n customFieldPlaceholder: 'Please enter a value',\n rememberUser: 'Automatic login',\n rememberUserHint: 'You can disable this option in system configuration',\n submitLabel: 'Enter',\n submittedLabel: 'Loading...',\n forgotPassword: 'Forgot your Password?',\n highlightInfo: '',\n registerUrl: 'New register',\n titlePopover: 'Oops!',\n forgotYourPassword: 'Forgot your password?',\n ifYouTryHarder: 'If you try ',\n attempts: '{0} more time(s) ',\n yourUserWillBeBlocked:\n 'without success your user will be blocked and you will be left 24 hours without being able to access :(',\n createANewPasswordNow: 'Better create a new password now! You will be able to log into the system right away.',\n iForgotMyPassword: 'I forgot my password',\n welcome: 'Welcome',\n support: 'Support'\n },\n es: {\n title: 'Bienvenido',\n loginErrorPattern: 'Login inválido',\n loginHint: `Su usuario ha sido entregado para usted en su primer día.\n Si no tiene esta información, póngase en contacto con el soporte técnico`,\n loginPlaceholder: 'Inserte su e-mail',\n passwordErrorPattern: 'Contraseña inválida',\n passwordPlaceholder: 'Inserte su contraseña',\n customFieldErrorPattern: 'Valor no válido.',\n customFieldPlaceholder: 'Por favor introduzca un valor',\n rememberUser: 'Inicio de sesión automáticamente',\n rememberUserHint: 'Puede deshabilitar esta opción en el menú del sistema.',\n submitLabel: 'Entrar',\n submittedLabel: 'Cargando...',\n forgotPassword: 'Olvidaste tu contraseña?',\n highlightInfo: '',\n registerUrl: 'Nuevo registro',\n titlePopover: 'Opa!',\n forgotYourPassword: 'Olvidaste tu contraseña?',\n ifYouTryHarder: 'Si intenta más ',\n attempts: '{0} vez/veces ',\n yourUserWillBeBlocked: 'sin éxito su usuario sera bloqueado y usted vás permanecer 24 horas sin poder acceder a :(',\n createANewPasswordNow:\n '¡Mejor crear una nueva contraseña ahora! Usted podrá entrar en el sistema inmediatamente después.',\n iForgotMyPassword: 'Olvide mi contraseña',\n welcome: 'Bienvenido',\n support: 'Soporte'\n },\n pt: {\n title: 'Bem-vindo',\n loginErrorPattern: 'Login inválido',\n loginHint: `Seu usuário foi entregue a você no seu primeiro dia.\n Caso não tenha mais essa informação contacte o suporte`,\n loginPlaceholder: 'Insira seu e-mail',\n passwordErrorPattern: 'Senha inválida',\n passwordPlaceholder: 'Insira sua senha',\n customFieldErrorPattern: 'Valor inválido.',\n customFieldPlaceholder: 'Por favor insira um valor',\n rememberUser: 'Logar automaticamente',\n rememberUserHint: 'Você pode desabilitar essa opção no menu do sistema',\n submitLabel: 'Entrar',\n submittedLabel: 'Carregando...',\n forgotPassword: 'Esqueceu sua senha?',\n highlightInfo: '',\n registerUrl: 'Novo registro',\n titlePopover: 'Opa!',\n forgotYourPassword: 'Esqueceu sua senha?',\n ifYouTryHarder: 'Se tentar mais ',\n attempts: '{0} vez(es) ',\n yourUserWillBeBlocked: 'sem sucesso seu usuário será bloqueado e você fica 24 horas sem poder acessar :(',\n createANewPasswordNow: 'Melhor criar uma senha nova agora! Você vai poder entrar no sistema logo em seguida.',\n iForgotMyPassword: 'Esqueci minha senha',\n welcome: 'Boas-vindas',\n support: 'Suporte'\n },\n ru: {\n title: 'Добро пожаловать!',\n loginErrorPattern: 'Неверный логин',\n loginHint: `Ваш логин был предоставлен вам в первый день.\n Если у вас нет этой информации, обратитесь в службу поддержки`,\n loginPlaceholder: 'Вставьте свой адрес электронной почты',\n passwordErrorPattern: 'Неверный пароль',\n passwordPlaceholder: 'Введите свой пароль',\n customFieldErrorPattern: 'Неверное значение.',\n customFieldPlaceholder: 'Пожалуйста, введите значение',\n rememberUser: 'Автоматический вход',\n rememberUserHint: 'Вы можете отключить эту опцию в конфигурации системы',\n submitLabel: 'Войти',\n submittedLabel: '3агрузка...',\n forgotPassword: 'Забыли пароль?',\n highlightInfo: '',\n registerUrl: 'Новый регистр',\n titlePopover: 'Ой!',\n forgotYourPassword: 'Забыли пароль?',\n ifYouTryHarder: 'Если вы безуспешно попытаетесь войти еще ',\n attempts: '{0} раз(а) ',\n yourUserWillBeBlocked: 'Ваш пользователь будет заблокирован, и Вы останетесь на 24 часа без возможности доступа :(',\n createANewPasswordNow: 'Лучше создайте новый пароль сейчас! Вы сможете сразу войти в систему.',\n iForgotMyPassword: 'Я забыл свой пароль',\n welcome: 'добро пожаловать',\n support: 'Поддержка'\n }\n};\n\nexport const poPageLoginLiteralIn = {\n en: 'in',\n es: 'en',\n pt: 'em',\n ru: 'в'\n};\n\n/**\n * @description\n *\n * O componente `po-page-login` é utilizado como template para tela de login.\n * Com ele é possível definirmos valores para usuário, senha e definir ações para recuperação de senha e gravação de dados do usuário.\n * Também é possível inserir uma imagem em conjunto com um texto de destaque.\n *\n *\n * A propriedade `p-authentication-url` automatiza a rotina do componente e simplifica o processo para autenticação do usuário, bastando\n * definir uma url para requisição da autenticação. A flexibilidade e praticidade podem chegar a um nível em que o desenvolvimento\n * da aplicação no *client side* é desprovida de qualquer código-fonte relacionado à rotina de login de usuário.\n * Seu detalhamento para uso pode ser visto logo abaixo em *propriedades*.\n * Caso julgue necessário, pode-se também definir manualmente a rotina do componente.\n *\n *\n * Para que as imagens sejam exibidas corretamente, é necessário incluir o caminho delas ao projeto. Para isso, edite\n * o *assets* no arquivo **angular.json** da aplicação na seguinte ordem:\n * ```\n * \"assets\": [\n * \"src/assets\",\n * \"src/favicon.ico\",\n * {\n * \"glob\": \"**\\/*\",\n * \"input\": \"node_modules/@po-ui/style/images\",\n * \"output\": \"assets/images\"\n * }\n * ]\n * ```\n */\n@Directive()\nexport abstract class PoPageLoginBaseComponent implements OnDestroy {\n /**\n * O `p-background` permite inserir uma imagem de destaque ao lado direito do formulário de login, caso a propriedade\n * não seja preenchida o formulário será centralizado no espaço disponível.\n *\n * A fonte da imagem pode ser de um caminho local ou uma url de um servidor externo.\n *\n * Além da imagem, é possível adicionar um texto informativo por cima da imagem da imagem de destaque, para isso informe\n * um valor para a literal `highlightInfo`.\n *\n * > Veja mais sobre as literais na propriedade `p-literals`.\n *\n * Exemplos de valores válidos:\n * - **local**: `./assets/images/login-background.png`\n * - **url externa**: `https://po-ui.io/assets/images/login-background.png`\n *\n * > Essa propriedade é ignorada para aplicações mobile.\n */\n @Input('p-background') background?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Caminho para a logomarca localizada na parte superior.\n *\n * > Caso seja indefinida o espaço se mantém preservado porém vazio.\n */\n @Input('p-logo') logo?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Expressão regular para validar o campo de login, caso a expressão não seja atentida, a literal `loginErrorPattern`\n * será exibida.\n *\n * Exemplos de valores válidos:\n * - email: `[expressao-regular-email]`\n * - cpf: `[expressao-regular-cpf]`\n *\n * > Veja a propriedade `p-literals` para customizar a literal `loginErrorPattern`.\n */\n @Input('p-login-pattern') loginPattern?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Expressão regular para validar o campo de password, caso a expressão não seja atentida, a literal `passwordErrorPattern`\n * será exibida.\n *\n * Exemplos de valores válidos:\n * - Apenas números: `\\d?`\n * - Letras mínusculas: `\\z?`\n *\n * > Veja a propriedade `p-literals` para customizar a literal `passwordErrorPattern`.\n */\n @Input('p-password-pattern') passwordPattern?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Caminho para a logomarca localizada no rodapé.\n */\n @Input('p-secondary-logo') secondaryLogo?: string;\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado quando o usuário alterar o input do campo login.\n *\n * Esse evento receberá como parâmetro uma variável do tipo `string` com o texto informado no campo.\n *\n * > Esta propriedade será ignorada se for definido valor para a propriedade `p-authentication-url`.\n */\n @Output('p-login-change') loginChange: EventEmitter = new EventEmitter();\n\n /**\n * Evento disparado ao submeter o formulário de login (apertando `Enter` dentro dos campos ou pressionando o botão de confirmação).\n *\n * Esse evento receberá como parâmetro um objeto do tipo `PoPageLogin` com os dados informados no formulário.\n *\n * > Esta propriedade será ignorada se for definido valor para a propriedade `p-url-recovery`.\n *\n * > Para mais detalhes consulte a documentação sobre a interface `PoPageLogin` mais abaixo.\n */\n @Output('p-login-submit') loginSubmit = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado quando o usuário alterar o input do campo password.\n *\n * Esse evento receberá como parâmetro uma variável do tipo `string` com o texto informado no campo.\n *\n * > Esta propriedade será ignorada se for definido valor para a propriedade `p-authentication-url`.\n */\n @Output('p-password-change') passwordChange: EventEmitter = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Evento disparado quando o usuário alterar o idioma da página.\n *\n * Esse evento receberá como parâmetro um objeto do tipo `PoLanguage` com a linguagem selecionada.\n *\n */\n @Output('p-language-change') languageChange: EventEmitter = new EventEmitter();\n\n /**\n * @optional\n *\n * @description\n *\n * Define a propriedade nativa `autocomplete` do campo como `off`.\n *\n * @default `true`\n */\n @Input('p-no-autocomplete-login') noAutocompleteLogin: boolean = true;\n\n /**\n * @optional\n *\n * @description\n *\n * Define a propriedade nativa `autocomplete` do campo como `off`.\n *\n * > No componente `po-password` será definido como `new-password`.\n *\n * @default `true`\n */\n @Input('p-no-autocomplete-password') noAutocompletePassword: boolean = true;\n\n /**\n * @optional\n *\n * @description\n *\n * Indica se o status do `model` do switch de lembrar o usuário será escondido visualmente.\n *\n * > Por padrão será atribuído `false`.\n * @default `false`\n */\n @Input({ alias: 'p-hide-label-status', transform: convertToBoolean }) hideLabelStatus: boolean = false;\n\n /**\n * @optional\n *\n * @description\n *\n * Permite esconder a função de espiar a senha digitada.\n *\n * @default `false`\n */\n @Input('p-hide-password-peek') hidePasswordPeek: boolean;\n\n allLoginErrors: Array = [];\n allPasswordErrors: Array = [];\n customFieldObject: PoPageLoginCustomField;\n customFieldType: string;\n loginSubscription: Subscription;\n password: string;\n rememberUser: boolean = false;\n selectedLanguage: string;\n showExceededAttemptsWarning = false;\n\n private _authenticationType: PoPageLoginAuthenticationType = PoPageLoginAuthenticationType.Basic;\n private _authenticationUrl: string;\n private _blockedUrl: string;\n private _componentsSize?: string = undefined;\n private _initialComponentsSize?: string = undefined;\n private _contactEmail: string;\n private _customField: string | PoPageLoginCustomField;\n private _environment?: string;\n private _exceededAttemptsWarning?: number;\n private _hideRememberUser: boolean = false;\n private _literals: PoPageLoginLiterals;\n private _loading?: boolean = false;\n private _login: string;\n private _loginErrors: Array = [];\n private _passwordErrors: Array = [];\n private _productName: string;\n private _recovery: string | PoPageLoginRecovery | Function;\n private _registerUrl: string;\n private _support: string | Function;\n private _languagesList: Array;\n\n /**\n * @optional\n *\n * @description\n *\n * Define o tamanho dos componentes de formulário no template:\n * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA).\n * - `medium`: aplica a medida medium de cada componente.\n *\n * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.\n * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).\n *\n * @default `medium`\n */\n set componentsSize(value: string) {\n this._initialComponentsSize = value;\n this.applySizeBasedOnA11y();\n }\n\n @Input('p-components-size')\n @HostBinding('attr.p-components-size')\n get componentsSize(): string {\n return this._componentsSize ?? getDefaultSizeFn();\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Ao informar um valor do tipo `string`, o mesmo será aplicado como a chave do campo customizado e utilizará\n * os valores padrões contidos na propriedade `literals` como `customFieldErrorPattern` e `customFieldPlaceholder`.\n *\n * Existe a possibilidade de informar um objeto que segue a definição da interface `PoPageLoginCustomField`, onde\n * através dos parâmetros enviados pode gerar um `po-input`, `po-combo` especificamente para serviços\n * ou `po-select` para valores fixos.\n *\n * Abaixo seguem os exemplos de cada tipo de campo.\n *\n * `po-input`:\n *\n * ```\n * {\n * property: 'domain',\n * value: 'jv01',\n * placeholder: 'Enter your domain',\n * pattern: '[a-z]',\n * errorPattern: 'Invalid value'\n * }\n * ```\n *\n * `po-combo`:\n *\n * ```\n * {\n * property: 'domain',\n * value: 'jv01',\n * placeholder: 'Enter your domain',\n * url: 'https://po-ui.io/sample/api/comboOption/domains',\n * fieldValue: 'nickname'\n * }\n * ```\n *\n * `po-select`:\n *\n * ```\n * {\n * property: 'domain',\n * value: 'jv01',\n * placeholder: 'Enter your domain',\n * options: [{label: 'Domain 1', value: '1'}, {label: 'Domain 2', value: '2'}]\n * }\n * ```\n *\n * Caso o customField possua options, url e fieldValue preenchidos, será priorizado o po-select\n * utilizando o options.\n *\n */\n @Input('p-custom-field') set customField(value: string | PoPageLoginCustomField) {\n if (value) {\n if (isTypeof(value, 'string')) {\n this.customFieldType = 'input';\n this._customField = value;\n this.customFieldObject = this.getDefaultCustomFieldObject(value);\n return;\n }\n\n if (isTypeof(value, 'object') && !Array.isArray(value) && value['property']) {\n this._customField = value;\n this.customFieldObject = value;\n\n if (!this.customFieldObject.options && !this.customFieldObject.url) {\n this.customFieldType = 'input';\n } else {\n this.customFieldType = this.customFieldObject.options ? 'select' : 'combo';\n }\n\n return;\n }\n }\n\n this._customField = undefined;\n this.customFieldObject = undefined;\n }\n\n get customField(): string | PoPageLoginCustomField {\n return this._customField;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Personaliza o e-mail que é exibido na mensagem de dica de login padrão para contato de suporte.\n */\n @Input('p-contact-email') set contactEmail(value: string) {\n this._contactEmail = value;\n }\n get contactEmail() {\n return this._contactEmail;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Texto customizado que fica entre a logo e a mensagem de boas-vindas.\n */\n @Input('p-product-name') set productName(value: string) {\n this._productName = value;\n }\n get productName() {\n return this._productName;\n }\n\n /**\n * @optional\n *\n * @description\n * Adiciona uma `tag` abaixo do título que especifica o ambiente que o usuário está fazendo o login.\n *\n * > Essa propriedade limita o texto em 40 caracteres.\n */\n @Input('p-environment') set environment(environment: string) {\n if (environment && environment.length > poPageLoginContentMaxLength) {\n this._environment = environment.substring(0, poPageLoginContentMaxLength);\n } else {\n this._environment = environment;\n }\n }\n get environment() {\n return this._environment;\n }\n\n /**\n * @optional\n *\n * @description\n * Exibe um aviso de bloqueio de acordo com a quantidade restante de tentativas.\n * O aviso será exibido somente se a quantidade for maior que zero.\n *\n * > Caso tenha algum valor atribuído para o atributo `p-authentication-url` e o retorno da requisição estiver atribuindo valor\n * para o `p-exceeded-attempts-warning`, o valor considerado será o do retorno da requisição.\n *\n * @default `0`\n */\n @Input('p-exceeded-attempts-warning') set exceededAttemptsWarning(value: number) {\n this._exceededAttemptsWarning = PoUtils.convertToInt(value);\n this.showExceededAttemptsWarning = this.exceededAttemptsWarning > 0;\n }\n\n get exceededAttemptsWarning(): number {\n return this._exceededAttemptsWarning;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Esconde a função \"Lembrar usuário\" do formulário de login.\n *\n * Quando essa propriedade é setada com `true` a propriedade `rememberUser` enviada no evento `p-login-submit` será sempre\n * `false`.\n *\n * > Veja a propriedade `p-literals` para customizar a literal `rememberUser`.\n *\n * @default `false`\n */\n @Input('p-hide-remember-user') set hideRememberUser(value: boolean) {\n this._hideRememberUser = value === '' ? true : convertToBoolean(value);\n\n if (this._hideRememberUser) {\n this.rememberUser = false;\n }\n }\n get hideRememberUser(): boolean {\n return this._hideRememberUser;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Objeto com as literais usadas no `po-page-login`.\n *\n * Existem duas maneiras de customizar o componente, passando um objeto com todas as literais disponíveis:\n *\n * ```\n * const customLiterals: PoPageLoginLiterals = {\n * attempts: '{0} vez(es) ',\n * createANewPasswordNow: 'Melhor criar uma senha nova agora! Você vai poder entrar no sistema logo em seguida.',\n * forgotPassword: 'Esqueceu sua senha?',\n * forgotYourPassword: 'Esqueceu sua senha?',\n * highlightInfo: '',\n * iForgotMyPassword: 'Esqueci minha senha',\n * ifYouTryHarder: 'Se tentar mais ',\n * welcome: 'Boas-vindas',\n * loginErrorPattern: 'Login obrigatório',\n * loginHint: 'Caso não possua usuário entre em contato com o suporte',\n * loginLabel: 'Insira seu usuário',\n * loginPlaceholder: 'Insira seu usuário de acesso',\n * passwordErrorPattern: 'Senha obrigatória',\n * passwordLabel: 'Insira sua senha',\n * passwordPlaceholder: 'Insira sua senha de acesso',\n * customFieldErrorPattern: 'Campo customizado inválido',\n * customFieldPlaceholder: 'Por favor insira um valor',\n * registerUrl: 'Novo registro',\n * rememberUser: 'Lembrar usuário',\n * rememberUserHint: 'Esta opção pode ser desabilitada nas configurações do sistema',\n * submitLabel: 'Acessar sistema',\n * submittedLabel: 'Carregando...',\n * titlePopover: 'Opa!',\n * yourUserWillBeBlocked: 'sem sucesso seu usuário será bloqueado e você fica 24 horas sem poder acessar :('\n * };\n * ```\n *\n * Ou passando apenas as literais que deseja customizar:\n *\n * ```\n * const customLiterals: PoPageLoginLiterals = {\n * loginPlaceholder: 'Insira seu usuário de acesso',\n * passwordPlaceholder: 'Insira sua senha de acesso',\n * submitLabel: 'Acessar sistema'\n * };\n * ```\n *\n * E para carregar as literais customizadas, basta apenas passar o objeto para o componente.\n *\n * ```\n * \n * \n * ```\n *\n * > O objeto padrão de literais será traduzido de acordo com o idioma do browser (pt, en, es).\n * > É também possível alternar o objeto padrão de literais através do seletor de idiomas localizado na parte inferior do template,\n * nesse caso, há também a opção do idioma russo.\n */\n @Input('p-literals') set literals(value: PoPageLoginLiterals) {\n this._literals = value;\n }\n\n get literals() {\n return this._literals;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Habilita um estado de carregamento ao botão de *login*.\n *\n * > É necessário atribuir `true` à esta propriedade na função definida em `p-login-submit`.\n *\n * @default `false`\n */\n @Input('p-loading') set loading(value: boolean) {\n this._loading = convertToBoolean(value);\n }\n\n get loading(): boolean {\n return this._loading;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Valor do modelo do campo de login.\n */\n @Input('p-login') set login(value: string) {\n this._login = value;\n\n if (!this.authenticationUrl) {\n this.loginChange.emit(this._login);\n }\n }\n\n get login(): string {\n return this._login;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Atributo que recebe uma lista de erros e exibe abaixo do campo de login.\n */\n @Input('p-login-errors') set loginErrors(value: Array) {\n this._loginErrors = value || [];\n this.setLoginErrors(this._loginErrors);\n }\n get loginErrors() {\n return this._loginErrors;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Atributo que recebe uma lista de erros e exibe abaixo do campo de password.\n */\n @Input('p-password-errors') set passwordErrors(value: Array) {\n this._passwordErrors = value || [];\n this.setPasswordErrors(this._passwordErrors);\n }\n get passwordErrors() {\n return this._passwordErrors;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Exibe um link abaixo do formulário de login para que os usuários da aplicação façam a recuperação dos dados de autenticação.\n *\n * A propriedade aceita os seguintes tipos:\n *\n * - **String**: informe uma url externa ou uma rota válida;\n * - **Function**: pode-se customizar a ação. Para esta possilidade basta atribuir:\n * ```\n * \n * [recovery]=\"this.myRecovery.bind(this)\">\n * \n * ```\n *\n * - **PoPageLoginRecovery**: cria-se vínculo automático com o template **po-modal-password-recovery**.\n * O objeto deve conter a **url** para requisição dos recursos e pode-se definir o **tipo** de modal para recuperação de senha,\n * **email** para contato e **máscara** do campo de telefone.\n */\n @Input('p-recovery') set recovery(value: string | Function | PoPageLoginRecovery) {\n this._recovery = value;\n }\n\n get recovery() {\n return this._recovery;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Caso a aplicação tenha um link para novos cadastros, informe uma url externa ou uma rota válida, dessa\n * forma será exibido um link abaixo do formulário de login para os usuários da aplicação.\n *\n * Exemplos de valores válidos:\n * - **local**: `/home`\n * - **url externa**: `https://po-ui.io`\n *\n * > Veja a propriedade `p-literals` para customizar a literal `registerUrl`.\n */\n @Input('p-register-url') set registerUrl(value: string) {\n this._registerUrl = isTypeof(value, 'string') ? value : undefined;\n }\n\n get registerUrl(): string {\n return this._registerUrl;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Atributo que recebe o tipo de esquema da autenticação, sendo suportados apenas os valores `Basic` e `Bearer`.\n *\n * > Caso o tipo definido seja `Basic`, o componente fará uma requisição `POST` contendo:\n *\n * ```\n * headers {\n * Authorization: Basic base64(login:password)\n * }\n *\n * body {\n * rememberUser: rememberUser\n * }\n * ```\n *\n * > Caso o tipo definido seja `Bearer`, o componente fará uma requisição `POST` contendo:\n *\n * ```\n * body {\n * login: login,\n * password: base64(password),\n * rememberUser: rememberUser\n * }\n * ```\n *\n * @default `PoPageLoginAuthenticationType.Basic`\n */\n @Input('p-authentication-type') set authenticationType(value: PoPageLoginAuthenticationType) {\n this._authenticationType = (Object).values(PoPageLoginAuthenticationType).includes(value)\n ? value\n : PoPageLoginAuthenticationType.Basic;\n }\n\n get authenticationType(): PoPageLoginAuthenticationType {\n return this._authenticationType;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Endpoint usado pelo template para requisição do recurso. Quando preenchido, o método `p-login-submit` será ignorado e o\n * componente adquirirá automatização para o processo de autenticação.\n *\n * ### Processos\n * Ao digitar um valor válido no campo de login/password e pressionar **Enter**, o componente fará uma requisição `POST`\n * na url especificada nesta propriedade passando o objeto contendo o valor definido pelo usuário:\n *\n * ```\n * headers {\n * Authorization: Basic base64(login:password)\n * }\n *\n * body {\n * rememberUser: rememberUser\n * }\n * ```\n *\n * Em caso de **sucesso**, o objeto de retorno é armazenado no `sessionStorage` e o usuário é redirecionado para a página inicial da\n * aplicação `/`.\n *\n * ```\n * 200:\n * {\n * user: user\n * }\n * ```\n *\n * Em caso de **erro** na autenticação, espera-se o seguinte retorno:\n *\n * ```\n * 400/401\n * {\n * code: 400/401,\n * message: message,\n * detailedMessage: detailedMessage,\n * helpUrl?: helpUrl\n * }\n * ```\n *\n * > Pode-se atribuir uma quantidade máxima de tentativas restantes (maxAttemptsRemaining) para o atributo `p-exceeded-attempts-warning`,\n * assim como os avisos relacionados aos campos login e password (loginWarnings, passwordWarnings) para os atributos `p-login-errors` e\n * `p-password-errors` conforme retorno abaixo:\n *\n * ```\n * 400\n * {\n * code: 400/401,\n * message: message,\n * detailedMessage: detailedMessage,\n * helpUrl?: helpUrl,\n * maxAttemptsRemaining?: maxAttemptsRemaining,\n * loginWarnings?: [loginWarnings],\n * passwordWarnings?: [passwordWarnings]\n * }\n * ```\n *\n * > Caso o valor atribuído para `p-exceeded-attempts-warning` seja igual a 0(zero), poderá ser passado um valor para o\n * atributo `p-blocked-url` e o usuário será redirecionado para uma tela de bloqueio.\n *\n * *Processo finalizado.*\n *\n * _______________\n *\n * #### Praticidade\n * As informações do serviço de autenticação também podem ser transmitidas diretamente pelas configuraçãos de rota e, desta maneira,\n * dispensa-se qualquer menção e/ou importação do componente `po-page-login` no restante da aplicação. O exemplo abaixo exemplifica\n * a forma dinâmica com a qual o template de tela de login pode ser gerado ao navegar para rota `/login`, e também como ele se comunica\n * com o serviço para efetuação do processo de autenticação do usuário e solicitação de nova senha.\n * Basta definir nas configurações de rota:\n *\n *\n * ```\n * import { PoPageLoginComponent, PoPageLoginAthenticationType } from '@po-ui/ng-templates';\n *\n * ...\n * const routes: Routes = [\n * {\n * path: 'login', component: PoPageLoginComponent, data: {\n * serviceApi: 'https://po-ui.io/sample/api/users/authentication',\n * environment: 'development',\n * recovery: {\n * url: 'https://po-ui.io/sample/api/users',\n * type: PoModalPasswordRecoveryType.All,\n * contactMail: 'dev.po@po-ui.com',\n * phoneMask: '9-999-999-9999'\n * },\n * registerUrl: '/new-password',\n * authenticationType: PoPageLoginAthenticationType.Basic\n * }\n * }\n * ...\n * ];\n *\n * @NgModule({\n * imports: [RouterModule.forRoot(routes)],\n * exports: [RouterModule]\n * })\n * export class AppRoutingModule { }\n * ```\n *\n *\n * O metadado `serviceApi` deve ser a **url** para requisição dos recursos de autenticação, o `environment` alimenta a propriedade\n * `p-environment`, `recovery` é a interface `PoPageLoginRecovery` responsável pelas especificações contidas na modal de recuperação de\n * senha, `registerUrl` alimenta a propriedade `p-register-url` e `authenticationType` que define a propriedade `p-authentication-type`.\n *\n * > É essencial que siga a nomenclatura dos atributos exemplificados acima para sua efetiva funcionalidade.\n *\n */\n @Input('p-authentication-url') set authenticationUrl(value: string) {\n this._authenticationUrl = isTypeof(value, 'string') ? value : undefined;\n }\n\n get authenticationUrl(): string {\n return this._authenticationUrl;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Caso o valor atribuído para `p-exceeded-attempts-warning` seja igual a 0(zero) e a aplicação tenha um link de bloqueio de usuário,\n * informe uma url externa ou uma rota válida, dessa forma em caso de bloqueio o usuário será redirecionado.\n */\n @Input('p-blocked-url') set blockedUrl(value: string) {\n this._blockedUrl = isTypeof(value, 'string') ? value : undefined;\n }\n\n get blockedUrl(): string {\n return this._blockedUrl;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Exibe um botão para suporte.\n *\n * A propriedade aceita os seguintes tipos:\n *\n * - **String**: URL externa ou uma rota válida;\n * - **Function**: Função a ser disparada ao clicar no botão de suporte;\n * ```\n * \n * [p-support]=\"this.mySupport.bind(this)\">\n * \n * ```\n *\n */\n @Input('p-support') set support(value: string | Function) {\n this._support = value;\n }\n\n get support() {\n return this._support;\n }\n\n /**\n * @optional\n *\n * @description\n *\n * Coleção de idiomas que o componente irá tratar e disponibilizará para o usuário escolher.\n *\n * Caso essa propriedade não seja utilizada o componente mostrará no combo os idiomas que ele suporta por padrão.\n *\n * Caso a coleção tenha um idioma, a página estará nesse idioma e não mostrará o combo.\n *\n * Caso seja passado um array vazio, a página terá o idioma configurado no `i18n` e não mostrará o combo de seleção.\n *\n * > Se for passado um idioma não suportado, será preciso passar as literais pela propriedade `p-literals`.\n *\n *\n */\n @Input('p-languages') set languagesList(languagesList: Array) {\n if (languagesList) {\n if (languagesList.length) {\n this._languagesList = languagesList;\n } else {\n this._languagesList = poLanguageDefault.filter(language => language.language === this.language);\n }\n }\n }\n\n get languagesList(): Array {\n if (this._languagesList) {\n return this._languagesList;\n }\n return poLanguageDefault;\n }\n\n get showLanguage() {\n return this.languagesList.length > 1;\n }\n\n get language(): string {\n return this.selectedLanguage || PoUtils.getShortBrowserLanguage();\n }\n\n get pageLoginLiterals(): PoPageLoginLiterals {\n const loginHintWithContactEmail = this.contactEmail\n ? this.concatenateLoginHintWithContactEmail(this.contactEmail)\n : undefined;\n\n return {\n ...poPageLoginLiteralsDefault[poLocaleDefault],\n ...poPageLoginLiteralsDefault[this.language],\n ...loginHintWithContactEmail,\n ...this.literals\n };\n }\n\n constructor(\n private readonly loginService: PoPageLoginService,\n public router: Router,\n public poLanguageService: PoLanguageService\n ) {\n this.selectedLanguage = this.poLanguageService.getShortLanguage();\n }\n\n ngOnDestroy() {\n if (this.loginSubscription) {\n this.loginSubscription.unsubscribe();\n }\n }\n\n closePopover() {\n this.showExceededAttemptsWarning = false;\n }\n\n onLoginSubmit(): void {\n const loginForm: PoPageLogin = {\n login: this.login,\n password: this.password,\n rememberUser: this.rememberUser\n };\n\n if (this.customField) {\n loginForm[this.customFieldObject.property] = this.customFieldObject.value;\n }\n\n if (this.authenticationUrl) {\n this.loading = true;\n this.loginSubscription = this.loginService\n .onLogin(this.authenticationUrl, this.authenticationType, loginForm)\n .subscribe(\n data => {\n this.setValuesToProperties();\n sessionStorage.setItem('PO_USER_LOGIN', JSON.stringify(data));\n this.openInternalLink('/');\n this.loading = false;\n },\n error => {\n if (error.error.code === '400' || error.error.code === '401') {\n this.setValuesToProperties(error);\n this.redirectBlockedUrl(this.exceededAttemptsWarning, this.blockedUrl);\n }\n this.loading = false;\n }\n );\n } else {\n this.loginSubmit.emit(loginForm);\n this.showExceededAttemptsWarning = this.exceededAttemptsWarning > 0;\n }\n }\n\n @HostListener('window:PoUiThemeChange')\n protected onThemeChange(): void {\n this.applySizeBasedOnA11y();\n }\n\n private getDefaultCustomFieldObject(property): PoPageLoginCustomField {\n return { property };\n }\n\n private openExternalLink(url: string) {\n window.open(url, '_blank');\n }\n\n private openInternalLink(url: string) {\n this.router.navigate([url]);\n }\n\n private redirectBlockedUrl(attempts: number, blockedUrl: string) {\n if (attempts === 0 && blockedUrl) {\n this.showExceededAttemptsWarning = false;\n PoUtils.isExternalLink(blockedUrl) ? this.openExternalLink(blockedUrl) : this.openInternalLink(blockedUrl);\n }\n }\n\n private setValuesToProperties(result?) {\n if (result) {\n this.exceededAttemptsWarning = result.error.maxAttemptsRemaining;\n this.loginErrors = result.error.loginWarnings;\n this.passwordErrors = result.error.passwordWarnings;\n this.blockedUrl = result.error.blockedUrl;\n } else {\n this.exceededAttemptsWarning = 0;\n this.loginErrors = [];\n this.passwordErrors = [];\n this.blockedUrl = '';\n }\n }\n\n private applySizeBasedOnA11y(): void {\n this._componentsSize = validateSizeFn(this._initialComponentsSize);\n }\n\n protected abstract concatenateLoginHintWithContactEmail(contactEmail: string);\n\n protected abstract setLoginErrors(value: Array): void;\n\n protected abstract setPasswordErrors(value: Array): void;\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\n\nimport { isExternalLink, isTypeof } from '../../../utils/util';\n\nimport { PoPageLoginLiterals } from '../interfaces/po-page-login-literals.interface';\nimport { PoPageLoginRecovery } from '../interfaces/po-page-login-recovery.interface';\n\n@Component({\n selector: 'po-page-login-popover',\n templateUrl: './po-page-login-popover.component.html',\n standalone: false\n})\n\n/**\n * @docsPrivate\n *\n * @description\n *\n * Componente para definição da mensagem de aviso de bloqueio do `po-page-login`.\n */\nexport class PoPageLoginPopoverComponent {\n @Input('p-literals') literals: PoPageLoginLiterals;\n\n /** exibe o link de 'esqueci minha senha' e verifica se o valor é um link interno ou externo */\n @Input('p-recovery') set recovery(value: string | Function | PoPageLoginRecovery) {\n this._recovery = value;\n\n if (isTypeof(value, 'string')) {\n this.recoveryType = isExternalLink(value) ? 'externalLink' : 'internalLink';\n }\n }\n\n get recovery() {\n return this._recovery;\n }\n\n /** define se a mensagem deverá ser exibida caso seja maior que 0(zero) */\n @Input('p-remaining-attempts') remainingAttempts: number;\n\n /** se 'p-recovery' for do tipo Function ou PoPageLoginRecovery, emite para o método 'openUrl' do componente 'po-page-login' */\n @Output('p-forgot-password') forgotPassword = new EventEmitter();\n\n recoveryType: string;\n\n private _recovery: string | Function | PoPageLoginRecovery;\n\n onForgotPasswordClick(recovery) {\n this.forgotPassword.emit(recovery);\n }\n}\n","\n","import {\n AfterViewChecked,\n ChangeDetectorRef,\n Component,\n ComponentRef,\n IterableDiffers,\n OnInit,\n ViewChild,\n ViewContainerRef,\n inject\n} from '@angular/core';\nimport { AbstractControl, NgForm } from '@angular/forms';\nimport { ActivatedRoute, Router } from '@angular/router';\n\nimport { PoLanguageService } from '@po-ui/ng-components';\n\nimport { PoComponentInjectorService } from '@po-ui/ng-components';\nimport { isExternalLink } from '../../utils/util';\n\nimport { PoModalPasswordRecoveryType } from '../po-modal-password-recovery/enums/po-modal-password-recovery-type.enum';\nimport { PoModalPasswordRecoveryComponent } from '../po-modal-password-recovery/po-modal-password-recovery.component';\nimport { PoPageLoginRecovery } from './interfaces/po-page-login-recovery.interface';\nimport {\n PoPageLoginBaseComponent,\n poPageLoginLiteralIn,\n poPageLoginLiteralsDefault\n} from './po-page-login-base.component';\nimport { PoPageLoginService } from './po-page-login.service';\n\n/**\n * @docsExtends PoPageLoginBaseComponent\n *\n * @example\n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n *\n * \n * \n * \n * \n * \n *\n * \n * \n * \n * \n */\n\n@Component({\n selector: 'po-page-login',\n templateUrl: './po-page-login.component.html',\n standalone: false\n})\nexport class PoPageLoginComponent extends PoPageLoginBaseComponent implements AfterViewChecked, OnInit {\n changeDetector = inject(ChangeDetectorRef);\n private readonly activatedRoute = inject(ActivatedRoute);\n private readonly poComponentInjector = inject(PoComponentInjectorService);\n\n @ViewChild('loginForm', { read: NgForm, static: true }) loginForm: NgForm;\n @ViewChild('pageLogin', { read: ViewContainerRef, static: true }) pageLogin: ViewContainerRef;\n\n initialSelectLanguage: string;\n\n private componentRef: ComponentRef = null;\n private readonly differ: any;\n private readonly customPasswordError = { custom: false };\n\n constructor() {\n const differs = inject(IterableDiffers);\n const loginService = inject(PoPageLoginService);\n const router = inject(Router);\n const poLanguageService = inject(PoLanguageService);\n\n super(loginService, router, poLanguageService);\n this.differ = differs.find([]).create(null);\n }\n\n ngAfterViewChecked() {\n if (this.differ) {\n this.validateArrayChanges(this.differ, [\n { array: this.loginErrors, callback: this.generateLoginError.bind(this) },\n { array: this.passwordErrors, callback: this.generatePasswordError.bind(this) }\n ]);\n }\n }\n\n ngOnInit() {\n this.checkingForRouteMetadata(this.activatedRoute.snapshot.data);\n this.selectedLanguage = this.initializeLanguage();\n this.initialSelectLanguage = this.selectedLanguage;\n }\n\n activateSupport() {\n switch (typeof this.support) {\n case 'string': {\n this.setUrlRedirect(this.support);\n break;\n }\n case 'function': {\n this.support();\n break;\n }\n }\n }\n\n changeLoginModel() {\n if (this.authenticationUrl) {\n this.loginErrors = [];\n } else {\n this.setLoginErrors(this.loginErrors);\n this.loginChange.emit(this.login);\n }\n }\n\n changePasswordModel() {\n if (this.authenticationUrl) {\n this.passwordErrors = [];\n } else {\n this.setPasswordErrors(this.passwordErrors);\n this.passwordChange.emit(this.password);\n }\n }\n\n onSelectedLanguage(language: string) {\n this.languageChange.emit(this.languagesList.find(languageItem => languageItem.language === language));\n this.selectedLanguage = language;\n }\n\n openUrl(recovery: any): void {\n switch (typeof recovery) {\n case 'string': {\n this.setUrlRedirect(recovery);\n break;\n }\n case 'function': {\n recovery();\n break;\n }\n case 'object': {\n this.createModalPasswordRecoveryComponent(recovery);\n break;\n }\n }\n }\n\n protected concatenateLoginHintWithContactEmail(contactEmail: string) {\n const defaultLoginHintLiteral = poPageLoginLiteralsDefault[this.language].loginHint;\n const prepositionLiteral = poPageLoginLiteralIn[this.language];\n\n return this.concatenateLiteral(contactEmail, 'loginHint', defaultLoginHintLiteral, prepositionLiteral);\n }\n\n protected setLoginErrors(errors: Array) {\n const control = this.loginForm.form.controls['login'];\n this.setControlErrors('allLoginErrors', control, errors, this.pageLoginLiterals.loginErrorPattern);\n }\n\n protected setPasswordErrors(errors: Array) {\n const control = this.loginForm.form.controls['password'];\n this.setControlErrors('allPasswordErrors', control, errors, this.pageLoginLiterals.passwordErrorPattern);\n }\n\n private checkingForMetadataProperty(object, property) {\n if (Object.prototype.hasOwnProperty.call(object, property)) {\n return object[property];\n }\n }\n\n private checkingForRouteMetadata(data) {\n if (Object.keys(data).length !== 0) {\n this.authenticationUrl = this.checkingForMetadataProperty(data, 'serviceApi') || this.authenticationUrl;\n this.authenticationType = this.checkingForMetadataProperty(data, 'authenticationType') || this.authenticationType;\n this.environment = this.checkingForMetadataProperty(data, 'environment') || this.environment;\n this.recovery = this.checkingForMetadataProperty(data, 'recovery') || this.recovery;\n this.registerUrl = this.checkingForMetadataProperty(data, 'registerUrl') || this.registerUrl;\n }\n }\n\n private concatenate(defaultLiteral: string, prefixLiteral: string, value: string) {\n return `${defaultLiteral} ${prefixLiteral} ${value}`;\n }\n\n private concatenateLiteral(value: string, literal: string, defaultLiteral: string, prepositionLiteral: string) {\n return { [literal]: this.concatenate(defaultLiteral, prepositionLiteral, value) };\n }\n\n private createModalPasswordRecoveryComponent(poPageLoginRecovery: PoPageLoginRecovery) {\n if (this.componentRef) {\n this.poComponentInjector.destroyComponentInApplication(this.componentRef);\n }\n\n this.componentRef = this.poComponentInjector.createComponentInApplication(PoModalPasswordRecoveryComponent);\n this.componentRef.instance.urlRecovery = poPageLoginRecovery.url;\n this.componentRef.instance.contactEmail = poPageLoginRecovery.contactMail;\n this.componentRef.instance.phoneMask = poPageLoginRecovery.phoneMask;\n this.componentRef.instance.type = poPageLoginRecovery.type || PoModalPasswordRecoveryType.Email;\n this.componentRef.changeDetectorRef.detectChanges();\n setTimeout(() => {\n this.componentRef.instance.open();\n });\n }\n\n private generateLoginError() {\n if (this.loginErrors && this.loginErrors.length) {\n this.setLoginErrors(this.loginErrors);\n } else {\n const control = this.loginForm.form.controls['login'];\n if (control) {\n this.resetControl(control);\n }\n }\n }\n\n private generatePasswordError() {\n if (this.passwordErrors && this.passwordErrors.length) {\n this.setPasswordErrors(this.passwordErrors);\n } else {\n const control = this.loginForm.form.controls['password'];\n\n if (control) {\n this.resetControl(control);\n }\n }\n }\n\n private resetControl(control: AbstractControl) {\n control.markAsPristine();\n control.markAsUntouched();\n control.updateValueAndValidity();\n }\n\n private setControlErrors(allErrors: string, control: AbstractControl, errors: Array, patternError: string) {\n if (control) {\n this[allErrors] = control.hasError('pattern') ? [...errors, ...[patternError]] : [...errors];\n\n if (errors && errors.length && (control.valid || control.pristine)) {\n control.markAsTouched();\n control.markAsDirty();\n control.setErrors(this.customPasswordError);\n }\n }\n }\n\n private setUrlRedirect(url) {\n isExternalLink(url) ? window.open(url, '_blank') : this.router.navigate([url]);\n }\n\n private validateArrayChanges(differ: any, array: Array<{ array: Array; callback: any }>) {\n array.forEach(element => {\n const changes = differ.diff(element.array);\n if (changes) {\n element.callback();\n this.changeDetector.detectChanges();\n }\n });\n }\n\n private initializeLanguage() {\n const language = this.languagesList.find(languageItem => languageItem.language === this.language);\n return language?.language || this.languagesList[0].language;\n }\n}\n","\n\n\n \n\n