\r\n
\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n
\r\n \r\n {{$t('backToHome')}}\r\n \r\n
\r\n
\r\n\r\n","import { Component, Prop, Vue } from 'vue-property-decorator';\r\nimport WithRender from './preview.html';\r\n// Components\r\nimport CancelRequestBtn from '@/components/CancelRequestBtn/cancelRequestBtn';\r\n// Models\r\nimport { CancellationRequestModel } from '@/models/request';\r\n\r\n@WithRender\r\n@Component({\r\n components: {\r\n CancelRequestBtn,\r\n },\r\n})\r\nexport default class CancellationForm extends Vue {\r\n @Prop({ default: () => ({} as CancellationRequestModel) })\r\n public data!: CancellationRequestModel;\r\n\r\n @Prop({ default: true })\r\n public action!:boolean;\r\n\r\n @Prop({ default: false })\r\n public isLoading!: boolean;\r\n\r\n public onNavigateToRequests() {\r\n this.$router.push('/');\r\n }\r\n}\r\n","import { Inject } from 'vue-di-container';\r\nimport {\r\n Component, Prop, Vue,\r\n} from 'vue-property-decorator';\r\nimport WithRender from './requestReview.html';\r\n// Components\r\nimport QualificationCard from '@/components/QualificationCard/qualificationCard';\r\nimport CancelRequestBtn from '@/components/CancelRequestBtn/cancelRequestBtn';\r\n// Services\r\nimport LookupsService from '@/services/lookups';\r\nimport { testIds } from '@/services/testAutomation';\r\nimport {\r\n AttachmentTypeIds, AttachmentNamesByIds, RequestStatuses, RequestTypesIds,\r\n} from '@/services/staticLookups';\r\n// Models\r\nimport { Lookup } from '@/models/lookup';\r\nimport { CountryModel } from '@/models/countriesLookup';\r\nimport { StepperProps } from '@/models/stepper';\r\nimport { isRequired } from '@/services/formValidators';\r\nimport { RequestsAndLicensesTab } from '@/enums/tabs';\r\nimport { valueWithDefault } from '@/utils/global';\r\nimport {\r\n RequestDetailsDataModel, RequestHistorySteps, TimelineStep, TimelineStepFooter,\r\n} from '@/models/request-details';\r\nimport SharePointService from '@/services/attachments';\r\nimport './request-review.scss';\r\nimport { CancellationRequestModel } from '@/models/request';\r\nimport CancellationPreview from '@/views/CancelRequest/components/Preview/preview';\r\n\r\n@WithRender\r\n@Component({\r\n components: {\r\n QualificationCard,\r\n CancelRequestBtn,\r\n CancellationPreview,\r\n },\r\n diProvide: [\r\n LookupsService,\r\n SharePointService,\r\n ],\r\n})\r\nexport default class RequestReview extends Vue {\r\n @Inject(LookupsService) public lookupsService!: LookupsService;\r\n @Inject(SharePointService) public sharepointService!: SharePointService;\r\n\r\n @Prop()\r\n public actionsProps!:StepperProps;\r\n\r\n @Prop()\r\n public requestDetails!: RequestDetailsDataModel;\r\n\r\n @Prop({ default: false })\r\n public isLoading!: boolean;\r\n\r\n @Prop({ default: false })\r\n public readOnlyMode!: boolean;\r\n\r\n @Prop({ default: () => [] })\r\n public requestHistory!:RequestHistorySteps[]\r\n @Prop({ default: () => {} })\r\n public cancellationRequestData!:CancellationRequestModel;\r\n\r\n public degreeLookup: Lookup[]= [];\r\n public countryLookup: CountryModel[] = [];\r\n\r\n public testIds = testIds.requestPreview;\r\n\r\n public attachmentTypeIds = AttachmentTypeIds;\r\n public isFormValid = false;\r\n public readAgreement = false;\r\n public readAgreementValidator = [isRequired];\r\n\r\n public get isEditMode(): boolean {\r\n const { params } = this.$route;\r\n const requestId = params.id || '';\r\n\r\n return Boolean(requestId);\r\n }\r\n\r\n public get personalPicture() {\r\n const { requestAttachments } = this.requestDetails;\r\n\r\n return requestAttachments.find((attachment) => attachment.attachmentTypeId === this.attachmentTypeIds.personalPicture);\r\n }\r\n\r\n public get requestAttachments() {\r\n const { requestAttachments } = this.requestDetails;\r\n\r\n return requestAttachments.filter((attachment) => attachment.attachmentTypeId !== this.attachmentTypeIds.personalPicture);\r\n }\r\n\r\n async mounted() {\r\n await this.loadLookups();\r\n }\r\n\r\n public get imgAttachment() {\r\n return this.requestDetails.requestAttachments.find((attachment) => attachment.attachmentTypeId === AttachmentTypeIds.personalPicture);\r\n }\r\n\r\n public get requestHistorySteps():TimelineStep[] {\r\n const timeline:TimelineStep[] = [];\r\n this.requestHistory.forEach((historyStep, i) => {\r\n timeline[historyStep.stepOrder - 1] = {\r\n head: historyStep.stepName,\r\n body: historyStep.stepDescription || '',\r\n status: historyStep.stepProgress,\r\n footer: {\r\n class: historyStep.attachment ? 'n-cursor-pointer step-footer-font' : 'step-footer-font',\r\n content: historyStep.rejectReasons.length\r\n ? historyStep.rejectReasons[0].text\r\n : this.getFormattedDate(historyStep.stepDate),\r\n prepend: historyStep.attachment ? 'PDF' : '',\r\n prependClass: historyStep.attachment ? 'n-bg-danger-bg-icon n-px-2 n-py-1 n-radius-sm ml-1 step-footer-font' : 'n-icon-calendar-2 n-icon n-icon-size-14 ml-1',\r\n downloadLink: historyStep.attachment ? historyStep.attachment.sharepointId : '',\r\n },\r\n current: this.requestHistory.length - 1 === i,\r\n };\r\n });\r\n return timeline;\r\n }\r\n\r\n public getDegreeName(qualificationId: number) {\r\n return this.degreeLookup.find((degree) => degree.id === qualificationId)?.name || '';\r\n }\r\n\r\n public onProgressBarFooterClick(step: TimelineStep) {\r\n if ((step.footer as TimelineStepFooter).downloadLink) {\r\n this.sharepointService.downloadRejectedFileRequest((step.footer as TimelineStepFooter).downloadLink as string);\r\n }\r\n }\r\n public async loadLookups() {\r\n this.degreeLookup = await this.lookupsService.getDegree();\r\n this.countryLookup = await this.lookupsService.getCountries();\r\n }\r\n getCountryNameById(countryId:number) {\r\n return this.countryLookup.find((country) => country.id === countryId)?.name;\r\n }\r\n public valueWithDefault(value: string, suffix = '') {\r\n return valueWithDefault(value, this.$t('unAvailable') as string, suffix);\r\n }\r\n\r\n public getAttachmentLabel(id: number): string {\r\n return AttachmentNamesByIds[id] as string;\r\n }\r\n public getFormattedDate(date:string) {\r\n if (!date) { return date; }\r\n return new Date(Date.parse(date)).toLocaleDateString();\r\n }\r\n public onNavigateToRequests() {\r\n this.$router.push({ path: '/requests&licenses', hash: RequestsAndLicensesTab.requests.toString() });\r\n }\r\n\r\n // TODO validate rejection request and cancelRequest\r\n public get isRejectedRequest(): boolean {\r\n return this.cancellationRequestData.requestStatus.id === RequestStatuses.rejected || this.cancellationRequestData.requestStatus.id === RequestStatuses.returnToComplete;\r\n }\r\n public get isCancelRequest(): boolean {\r\n return this.requestDetails.requestType.id === RequestTypesIds.cancelRequest;\r\n }\r\n}\r\n","import { StepperHeaderMetaObject } from '@/models/object';\r\nimport { StepperHeaderMeta } from '@/models/stepper';\r\nimport i18n from '@/plugins/i18n';\r\nimport { RequestsTypesLinks } from '@/services/staticLookups';\r\n\r\nconst getStepperHeaderMeta = (url: string): StepperHeaderMeta => {\r\n let mode = 'new';\r\n\r\n const metaSet: StepperHeaderMetaObject = {\r\n new: {\r\n newText: i18n.t('requestNewAuthorizedLicense') as string,\r\n editText: i18n.t('editNewAuthorizedLicenseRequest') as string,\r\n previewText: i18n.t('previewNewAuthorizedLicenseRequest') as string,\r\n },\r\n renew: {\r\n newText: i18n.t('renewLicenseRequest') as string,\r\n editText: i18n.t('editRenewLicenseRequest') as string,\r\n previewText: i18n.t('previewRenewLicenseRequest') as string,\r\n },\r\n reregister: {\r\n newText: i18n.t('reregisterLicenseRequest') as string,\r\n editText: i18n.t('editReregisterLicenseRequest') as string,\r\n previewText: i18n.t('previewReregisterLicenseRequest') as string,\r\n },\r\n reissue: {\r\n newText: i18n.t('reissueLicenseRequest') as string,\r\n editText: i18n.t('editReissueLicenseRequest') as string,\r\n previewText: i18n.t('previewReissueLicenseRequest') as string,\r\n },\r\n };\r\n\r\n const isRenewMode = url.includes(RequestsTypesLinks.renew);\r\n const isReregisterMode = url.includes(RequestsTypesLinks.reregister);\r\n const isReissueMode = url.includes(RequestsTypesLinks.reissueLink);\r\n\r\n if (isRenewMode) {\r\n mode = 'renew';\r\n }\r\n\r\n if (isReregisterMode) {\r\n mode = 'reregister';\r\n }\r\n\r\n if (isReissueMode) {\r\n mode = 'reissue';\r\n }\r\n\r\n return metaSet[mode] || metaSet.new;\r\n};\r\n\r\nexport {\r\n getStepperHeaderMeta,\r\n};\r\n","import { Inject } from 'vue-di-container';\r\nimport {\r\n Component, Prop, Vue,\r\n} from 'vue-property-decorator';\r\nimport moment from 'moment-hijri';\r\n\r\nimport WithRender from './request.html';\r\n// components\r\nimport RequestLoader from '@/components/RequestLoader/requestLoader';\r\nimport RequestReview from './steps/RequestReview/requestReview';\r\nimport RequestStatus from '@/components/RequestStatus/requestStatus';\r\n// Services\r\nimport RequestsApiService from '@/services/requests';\r\nimport UserService from '@/services/user';\r\nimport TelemetryService from '@/services/TelemetryService';\r\nimport { failedEvent, successfullEvent } from '@/utils/telemetry';\r\n// Models\r\nimport { UserModel } from '@/models/user';\r\nimport { RequestDetailsDataModel, RequestHistorySteps } from '@/models/request-details';\r\nimport { AttachmentTypeIds } from '@/services/staticLookups';\r\nimport { getStepperHeaderMeta } from './utils';\r\nimport { StepperHeaderMeta } from '@/models/stepper';\r\nimport { holidayConfigs } from '@/utils/global';\r\nimport { HolidayConfigs } from '@/models/holidayConfigs';\r\nimport { CancellationRequestModel } from '@/models/request';\r\n\r\nmoment.locale('en');\r\n\r\n@WithRender\r\n@Component({\r\n components: {\r\n RequestStatus,\r\n RequestReview,\r\n RequestLoader,\r\n },\r\n diProvide: [\r\n UserService,\r\n RequestsApiService,\r\n TelemetryService,\r\n ],\r\n})\r\n\r\nexport default class BaseRequest extends Vue {\r\n @Inject(UserService) public userService!: UserService;\r\n @Inject(RequestsApiService) public requestsApiService!: RequestsApiService;\r\n @Inject(TelemetryService) public telemetryService!: TelemetryService;\r\n\r\n @Prop({ default: () => ({} as UserModel) })\r\n public user!: UserModel;\r\n\r\n @Prop({ default: true })\r\n public isFetchingUserInfo!: boolean;\r\n\r\n public holidayConfigs: HolidayConfigs = holidayConfigs();\r\n public isNewRequest = true;\r\n public isEditMode = false;\r\n public isFetchingRequestDetails = false;\r\n public isFetchingRequestHistory = false;\r\n public isFetchingCancellationRequest = false;\r\n public requestDetails = {} as RequestDetailsDataModel;\r\n public attachmentTypeIds = AttachmentTypeIds;\r\n public requestHistory: RequestHistorySteps[] = [];\r\n\r\n public cancellationRequestData = {\r\n requestId: '',\r\n note: '',\r\n licenseNumber: 0,\r\n requestNumber: 0,\r\n requestAttachments: [],\r\n incompleteReasons: [],\r\n requestStatus: {\r\n id: 0,\r\n name: '',\r\n statusOnNajiz: '',\r\n },\r\n } as CancellationRequestModel;\r\n\r\n public get isLoading(): boolean {\r\n return this.isFetchingRequestDetails || this.isFetchingUserInfo || this.isFetchingRequestHistory || this.isFetchingCancellationRequest;\r\n }\r\n\r\n public get isPreviewMode(): boolean {\r\n return !this.isEditMode && !this.isNewRequest;\r\n }\r\n\r\n public get stepperHeaderMeta(): StepperHeaderMeta {\r\n const { path } = this.$route;\r\n\r\n return getStepperHeaderMeta(path);\r\n }\r\n\r\n public get pageTitle() {\r\n const { previewText } = this.stepperHeaderMeta;\r\n const requestNum = this.requestDetails.requestNumber;\r\n return `${previewText} ${!requestNum ? '' : this.$t('number')}${this.requestDetails.requestNumber}`;\r\n }\r\n\r\n public get showStepperHeader() {\r\n return this.isNewRequest || this.isEditMode;\r\n }\r\n\r\n public get requestDetailsViewModel() {\r\n return this.requestDetails;\r\n }\r\n async mounted() {\r\n const { params } = this.$route;\r\n const requestId = params.id || '';\r\n if (requestId && this.user) {\r\n this.fetchRequestDetails(requestId);\r\n this.fetchRequestHistory(requestId);\r\n this.fetchCancellationRequestDetails(requestId);\r\n }\r\n }\r\n\r\n public async fetchRequestDetails(requestId: string) {\r\n this.isFetchingRequestDetails = true;\r\n\r\n const {\r\n isSuccess, data,\r\n } = await this.requestsApiService.getRequestDetails(requestId);\r\n\r\n if (isSuccess) {\r\n this.pushSuccessfullTelemetryEvent(this.$t('telemetry.fetchRequestDetails') as string);\r\n this.requestDetails = data;\r\n } else {\r\n this.pushFailureTelemetryEvent(this.$t('telemetry.fetchRequestDetails') as string);\r\n\r\n this.$nToaster.error({ message: this.$t('serverErrors.NOT_FOUND').toString() });\r\n }\r\n\r\n this.isFetchingRequestDetails = false;\r\n }\r\n public async fetchRequestHistory(requestId: string) {\r\n this.isFetchingRequestHistory = true;\r\n\r\n const {\r\n isSuccess, data,\r\n\r\n } = await this.requestsApiService.getRequestHistory(requestId);\r\n\r\n if (isSuccess) {\r\n this.requestHistory = data;\r\n } else {\r\n this.$nToaster.error({ message: this.$t('serverErrors.NOT_FOUND').toString() });\r\n }\r\n\r\n this.isFetchingRequestHistory = false;\r\n }\r\n public async fetchCancellationRequestDetails(requestNumber:string) {\r\n this.isFetchingCancellationRequest = true;\r\n\r\n const { data, isSuccess, errors } = await this.requestsApiService.getCancellationRequestDetails(requestNumber);\r\n if (isSuccess) {\r\n this.cancellationRequestData = data;\r\n this.pushSuccessfullTelemetryEvent(this.$t('telemetry.licenseCancellationPreview') as string);\r\n } else {\r\n this.$nToaster.error({ message: errors[0] });\r\n }\r\n\r\n this.pushFailureTelemetryEvent(this.$t('telemetry.licenseCancellationPreview') as string);\r\n this.isFetchingCancellationRequest = false;\r\n }\r\n private pushSuccessfullTelemetryEvent(eventName: string) {\r\n this.telemetryService.trackEvent({\r\n ...successfullEvent,\r\n serviceType: 'Transaction',\r\n eventName,\r\n userInfo: this.user,\r\n });\r\n }\r\n\r\n private pushFailureTelemetryEvent(eventName: string) {\r\n this.telemetryService.trackEvent({\r\n ...failedEvent,\r\n eventName,\r\n serviceType: 'Transaction',\r\n userInfo: this.user,\r\n });\r\n }\r\n}\r\n","import { Inject } from 'vue-di-container';\r\nimport { Component, Vue } from 'vue-property-decorator';\r\n\r\nimport WithRender from './viewRequest.html';\r\n\r\n// components\r\nimport Request from './components/Request/request';\r\n// Services\r\nimport RequestsApiService from '@/services/requests';\r\nimport UserService from '@/services/user';\r\nimport TelemetryService from '@/services/TelemetryService';\r\n// Models\r\nimport { UserModel } from '@/models/user';\r\n\r\n@WithRender\r\n@Component({\r\n components: {\r\n Request,\r\n },\r\n diProvide: [\r\n UserService,\r\n RequestsApiService,\r\n TelemetryService,\r\n ],\r\n})\r\n\r\nexport default class NewRequest extends Vue {\r\n @Inject(UserService) public userService!: UserService;\r\n @Inject(RequestsApiService) public requestsApiService!: RequestsApiService;\r\n @Inject(TelemetryService) public telemetryService!: TelemetryService;\r\n\r\n public isSubmitting = false;\r\n public isFetchingUserInfo = true;\r\n public user: UserModel = {} as UserModel;\r\n\r\n async mounted() {\r\n this.user = await this.userService.getUser();\r\n\r\n this.isFetchingUserInfo = false;\r\n }\r\n}\r\n","