From d1fbd0b5f036b3cb0f5129b62c27f728c62d069c Mon Sep 17 00:00:00 2001
From: umasoodch <umasoodch@gmail.com>
Date: Wed, 8 Jun 2022 10:33:24 +0300
Subject: [PATCH] first push of mohemm q3

---
 .../absence-confirm.component.ts              |  116 +-
 .../absence-replacement-list.component.ts     |    2 +-
 .../submit-absence.component.html             |   13 +-
 .../submit-absence.component.ts               |   59 +-
 Mohem/src/app/app-routing.module.ts           |    7 +-
 Mohem/src/app/app.component.html              |   58 +-
 Mohem/src/app/app.component.ts                |   26 +-
 Mohem/src/app/app.scss                        |    3 +
 .../authentication/authentication.module.ts   |   14 +-
 .../business-card.component.html              |   51 +-
 .../business-card.component.scss              |   50 +-
 .../business-card/business-card.component.ts  |   22 +-
 .../change-password.component.html            |  134 +-
 .../change-password.component.scss            |    4 +
 .../change-password.component.ts              |  363 ++-
 .../check-user/check-user.component.html      |    2 +-
 .../check-user/check-user.component.ts        |   27 +-
 .../confirm-login/confirm-login.component.ts  |  120 +-
 .../forgot/forgot.component.html              |   59 +-
 .../forgot/forgot.component.scss              |    8 +-
 .../authentication/forgot/forgot.component.ts |  231 +-
 .../models/sendActivationByType.ts            |   41 +-
 .../sms-page/sms-page.page.html               |  184 +-
 .../authentication/sms-page/sms-page.page.ts  |  522 +++-
 .../app/eit/add-cei/add-cei.component.html    |   24 +
 .../app/eit/add-cei/add-cei.component.scss    |   45 +
 .../app/eit/add-cei/add-cei.component.spec.ts |   27 +
 .../src/app/eit/add-cei/add-cei.component.ts  | 1561 ++++++++++++
 .../cei-homepage/cei-homepage.component.html  |   69 +
 .../cei-homepage/cei-homepage.component.scss  |   40 +
 .../cei-homepage.component.spec.ts            |   27 +
 .../cei-homepage/cei-homepage.component.ts    |   51 +
 .../app/eit/cei-list/cei-list.component.html  |   42 +
 .../app/eit/cei-list/cei-list.component.scss  |  330 +++
 .../eit/cei-list/cei-list.component.spec.ts   |   27 +
 .../app/eit/cei-list/cei-list.component.ts    |  127 +
 .../confirm-add-cei.component.html            |  127 +
 .../confirm-add-cei.component.scss            |  263 ++
 .../confirm-add-cei.component.spec.ts         |   27 +
 .../confirm-add-cei.component.ts              |  445 ++++
 .../confirm-add-eit.component.ts              |   28 +-
 Mohem/src/app/eit/eit.module.ts               |   29 +-
 Mohem/src/app/eit/home/home.component.ts      |   17 +-
 Mohem/src/app/eit/models/add.cei.response.ts  |    8 +
 Mohem/src/app/eit/models/add.eit.response.ts  |    1 +
 Mohem/src/app/eit/models/cei.request.ts       |   12 +
 Mohem/src/app/eit/models/eit.request.ts       |    1 -
 Mohem/src/app/eit/services/eit.service.ts     |   44 +
 .../app/erm-channel/home/home.component.ts    |   11 +-
 .../erm-channel/survey/survey.component.ts    |   11 +-
 Mohem/src/app/hmg-common/hmg-common.module.ts |   44 +-
 .../attend-services/attend-scan.service.ts    |    2 +-
 .../authentication/authentication.service.ts  |   18 +-
 .../models/smscheck.response.ts               |    1 +
 .../services/common/common.service.ts         |  224 +-
 .../services/connector/connector.service.ts   |    4 +-
 .../services/menu/models/menu-response.ts     |   15 +-
 .../app/hmg-common/services/models/request.ts |    2 +
 .../hmg-common/services/rate/rate.service.ts  |    8 +-
 .../file-uploader.component.html              |   51 +-
 .../file-uploader.component.scss              |   17 +
 .../file-uploader/file-uploader.component.ts  |  324 ++-
 .../generic-header.component.html             |   16 +
 .../generic-header.component.scss             |    4 +
 .../generic-header.component.ts               |   62 +-
 .../hmg-common/ui/smsdialog/smsdialog.page.ts |  113 +-
 .../stats-button/stats-button.component.scss  |   10 +
 Mohem/src/app/home/home.page.html             |    5 +-
 Mohem/src/app/home/home.page.scss             |   11 +
 Mohem/src/app/home/home.page.ts               |   88 +-
 .../home/wifi-model/wifi-modal.component.ts   |    7 +
 .../itemforsale/filter/filter.component.html  |   31 +
 .../itemforsale/filter/filter.component.scss  |   38 +
 .../filter/filter.component.spec.ts           |   27 +
 .../itemforsale/filter/filter.component.ts    |   56 +
 .../app/itemforsale/home/home.component.html  |  207 +-
 .../app/itemforsale/home/home.component.scss  |   62 +-
 .../app/itemforsale/home/home.component.ts    |  298 ++-
 .../item-details/item-details.component.html  |   47 +-
 .../item-details/item-details.component.scss  |    5 +
 .../item-details/item-details.component.ts    |   32 +-
 .../src/app/itemforsale/itemforsale.module.ts |   10 +-
 .../itemforsale/items/items.component.html    |  137 +-
 .../itemforsale/items/items.component.scss    |   71 +-
 .../app/itemforsale/items/items.component.ts  |  154 +-
 Mohem/src/app/itemforsale/services/domsafe.ts |   15 +
 .../services/service.service.spec.ts          |   12 +
 .../itemforsale/services/service.service.ts   |   87 +
 .../hr-request-form.component.scss            |    3 +
 .../hr-request-form.component.ts              |  151 +-
 .../hr-request/hr-request.component.scss      |    1 +
 Mohem/src/app/mowadhafi/mowadhafi.service.ts  |   19 +-
 .../app/my-team/details/details.component.ts  |    3 +-
 .../src/app/my-team/home/home.component.html  |    1 +
 Mohem/src/app/my-team/my-team.module.ts       |   12 +-
 .../app/my-team/service/my-team.service.ts    |    8 +
 .../subordinate-leave.component.html          |   89 +
 .../subordinate-leave.component.scss          |  199 ++
 .../subordinate-leave.component.spec.ts       |   27 +
 .../subordinate-leave.component.ts            |   57 +
 .../app/notification/home/home.component.html |   24 +-
 .../app/notification/home/home.component.scss |    8 +-
 .../app/notification/home/home.component.ts   |  396 +--
 .../src/app/notification/models/COCRequest.ts |    8 +
 .../models/userItemTypeRequest.ts             |    6 +
 .../app/notification/notification.module.ts   |    5 +
 .../service/work-list.main.service.ts         |  153 ++
 .../notification/service/worklist.service.ts  |   16 +
 .../work-list-main-itg.component.html         |   11 +-
 .../work-list-main-itg.component.ts           |   88 +-
 .../work-list-replacement-itg.component.html  |  135 +-
 .../work-list-replacement-itg.component.scss  |  589 ++---
 .../work-list-replacement-itg.component.ts    |  133 +-
 .../work-list-replacement-roll.component.html |  105 +-
 .../work-list-replacement-roll.component.scss |  185 +-
 .../work-list-replacement-roll.component.ts   |  147 +-
 .../work-list-rfc/work-list-rfc.component.ts  |   14 +-
 .../worklist-advanced-search.component.html   |    1 +
 .../worklist-advanced-search.component.ts     |    2 +-
 .../worklist-main-ic.component.html           |    2 +-
 .../worklist-main-ic.component.ts             |   58 +-
 .../worklist-main-mr.component.html           |    2 +-
 .../worklist-main-mr.component.ts             |   53 +-
 .../worklist-main-po.component.html           |    2 +-
 .../worklist-main-po.component.ts             |   78 +-
 .../worklist-main-pr.component.html           |    2 +-
 .../worklist-main-pr.component.ts             |   54 +-
 .../worklist-main.component.html              |  296 ++-
 .../worklist-main.component.scss              |    9 +
 .../worklist-main/worklist-main.component.ts  |  207 +-
 .../worklist-setting.component.html           |   41 +
 .../worklist-setting.component.scss           |    7 +
 .../worklist-setting.component.spec.ts        |   27 +
 .../worklist-setting.component.ts             |   86 +
 .../filter/filter.component.html              |    2 +-
 .../offersdiscount/home/home.component.html   |    2 +-
 .../app/offersdiscount/home/home.component.ts |   66 +-
 .../location/location.component.html          |    7 +
 .../location/location.component.scss          |    4 +
 .../location/location.component.spec.ts       |   27 +
 .../location/location.component.ts            |   79 +
 .../offer-details.component.html              |   16 +-
 .../offer-details.component.scss              |    5 +
 .../offer-details/offer-details.component.ts  |   16 +-
 .../offersdiscount/offersdiscount.module.ts   |   13 +-
 .../app/offersdiscount/services/service.ts    |   11 +-
 .../src/app/payslip/home/home.component.scss  |    1 +
 .../home/home.component.html                  |  102 +
 .../home/home.component.scss                  |  117 +
 .../home/home.component.spec.ts               |   27 +
 .../home/home.component.ts                    |   56 +
 .../pending-transaction.module.ts             |   36 +
 .../pending-transaction.page.html             |    4 +
 .../pending-transaction.page.scss             |    0
 .../pending-transaction.page.spec.ts          |   27 +
 .../pending-transaction.page.ts               |   15 +
 .../service/service.service.spec.ts           |   12 +
 .../service/service.service.ts                |   44 +
 .../add-address/add-address.component.html    |    2 +-
 .../add-basic-details.component.html          |    2 +-
 .../add-update-contact.component.html         |   34 +
 .../add-update-contact.component.scss         |   52 +
 .../add-update-contact.component.spec.ts      |   27 +
 .../add-update-contact.component.ts           | 2134 +++++++++++++++++
 .../confirm-address.component.ts              |   54 +-
 .../confirm-basic-details.component.ts        |   17 +-
 .../confirm-contact.component.html            |  128 +
 .../confirm-contact.component.scss            |  263 ++
 .../confirm-contact.component.spec.ts         |   27 +
 .../confirm-contact.component.ts              |  438 ++++
 .../profile/contact/contact.component.html    |   53 +
 .../profile/contact/contact.component.scss    |  119 +
 .../profile/contact/contact.component.spec.ts |   27 +
 .../app/profile/contact/contact.component.ts  |  120 +
 .../edit-profile/edit-profile.component.html  |    1 +
 .../src/app/profile/home/home.component.html  |  148 +-
 .../src/app/profile/home/home.component.scss  |   69 +-
 Mohem/src/app/profile/home/home.component.ts  |  190 +-
 .../src/app/profile/models/contact.request.ts |   12 +
 .../performance-evaluation.component.html     |   15 -
 .../performance-evaluation.component.scss     |    9 +-
 .../performance-evaluation.component.ts       |   57 +-
 Mohem/src/app/profile/profile.module.ts       |   23 +-
 .../app/profile/service/profile.service.ts    |   83 +
 .../concurrent-report.component.html          |   31 +
 .../concurrent-report.component.scss          |   56 +
 .../concurrent-report.component.spec.ts       |   27 +
 .../concurrent-report.component.ts            | 1300 ++++++++++
 .../reports/report-service.service.spec.ts    |   12 +
 .../src/app/reports/report-service.service.ts |   76 +
 Mohem/src/app/reports/reports.module.ts       |   43 +
 Mohem/src/app/reports/reports.page.html       |    3 +
 Mohem/src/app/reports/reports.page.scss       |    0
 Mohem/src/app/reports/reports.page.spec.ts    |   27 +
 Mohem/src/app/reports/reports.page.ts         |   15 +
 .../transaction-list.component.html           |   48 +
 .../transaction-list.component.scss           |  146 ++
 .../transaction-list.component.spec.ts        |   27 +
 .../transaction-list.component.ts             |  103 +
 .../confirm-termination.component.html        |  123 +
 .../confirm-termination.component.scss        |  263 ++
 .../confirm-termination.component.spec.ts     |   27 +
 .../confirm-termination.component.ts          |  433 ++++
 .../termination-service.service.spec.ts       |   12 +
 .../service/termination-service.service.ts    |   63 +
 .../termination-form.component.html           |   19 +
 .../termination-form.component.scss           |   44 +
 .../termination-form.component.spec.ts        |   27 +
 .../termination-form.component.ts             | 1465 +++++++++++
 .../src/app/termination/termination.module.ts |   46 +
 .../src/app/termination/termination.page.html |    3 +
 .../src/app/termination/termination.page.scss |    0
 .../app/termination/termination.page.spec.ts  |   27 +
 Mohem/src/app/termination/termination.page.ts |   15 +
 .../time-card-details.component.scss          |    2 +-
 .../time-card-details.component.ts            |    2 +-
 .../vacation-type.component.html              |    6 +-
 .../vacation-type/vacation-type.component.ts  |   13 +-
 Mohem/src/assets/icon/bar-chart-outline.svg   |    1 +
 Mohem/src/assets/icon/bar-chart.svg           |    1 +
 Mohem/src/assets/icon/blank.svg               |    6 +
 Mohem/src/assets/icon/green.svg               |    3 +
 Mohem/src/assets/icon/select-all.svg          |    1 +
 Mohem/src/assets/icon/settings-not.svg        |   10 +
 Mohem/src/assets/icon/yellow.svg              |    3 +
 Mohem/src/assets/imgs/hr-request.png          |  Bin 0 -> 10488 bytes
 .../assets/imgs/mohemm-action/Doable-old.png  |  Bin 0 -> 1441 bytes
 .../src/assets/imgs/mohemm-action/Doable.png  |  Bin 0 -> 1371 bytes
 .../src/assets/imgs/mohemm-action/More-2.png  |  Bin 0 -> 914 bytes
 Mohem/src/assets/imgs/mohemm-action/More.png  |  Bin 914 -> 1161 bytes
 .../src/assets/imgs/mohemm-action/Skip-2.png  |  Bin 0 -> 888 bytes
 Mohem/src/assets/imgs/mohemm-action/Skip.png  |  Bin 888 -> 1316 bytes
 .../src/assets/imgs/mohemm-action/answer.png  |  Bin 0 -> 1940 bytes
 .../imgs/mohemm-action/data-corrected (2).png |  Bin 0 -> 1818 bytes
 .../imgs/mohemm-action/data-corrected (3).png |  Bin 0 -> 1824 bytes
 .../imgs/mohemm-action/data-corrected.png     |  Bin 0 -> 1560 bytes
 .../imgs/mohemm-action/doable-2-old.png       |  Bin 0 -> 1371 bytes
 .../assets/imgs/mohemm-action/info-old.png    |  Bin 0 -> 1053 bytes
 Mohem/src/assets/imgs/mohemm-action/info.png  |  Bin 1053 -> 1293 bytes
 .../imgs/mohemm-action/notDoable-old.png      |  Bin 0 -> 1478 bytes
 .../assets/imgs/mohemm-action/notDoable.png   |  Bin 0 -> 1461 bytes
 Mohem/src/assets/imgs/my-request.png          |  Bin 0 -> 4055 bytes
 Mohem/src/assets/imgs/no-images.png           |  Bin 0 -> 38816 bytes
 Mohem/src/assets/imgs/pending-transaction.png |  Bin 0 -> 11004 bytes
 .../assets/imgs/profile-icons/family-g.svg    |    6 +
 .../src/assets/imgs/profile-icons/family.svg  |    6 +
 Mohem/src/assets/localization/i18n.json       |  365 ++-
 Mohem/src/index.html                          |    2 +
 Mohem/src/theme/styles.scss                   |   35 +-
 249 files changed, 19048 insertions(+), 2033 deletions(-)
 create mode 100644 Mohem/src/app/eit/add-cei/add-cei.component.html
 create mode 100644 Mohem/src/app/eit/add-cei/add-cei.component.scss
 create mode 100644 Mohem/src/app/eit/add-cei/add-cei.component.spec.ts
 create mode 100644 Mohem/src/app/eit/add-cei/add-cei.component.ts
 create mode 100644 Mohem/src/app/eit/cei-homepage/cei-homepage.component.html
 create mode 100644 Mohem/src/app/eit/cei-homepage/cei-homepage.component.scss
 create mode 100644 Mohem/src/app/eit/cei-homepage/cei-homepage.component.spec.ts
 create mode 100644 Mohem/src/app/eit/cei-homepage/cei-homepage.component.ts
 create mode 100644 Mohem/src/app/eit/cei-list/cei-list.component.html
 create mode 100644 Mohem/src/app/eit/cei-list/cei-list.component.scss
 create mode 100644 Mohem/src/app/eit/cei-list/cei-list.component.spec.ts
 create mode 100644 Mohem/src/app/eit/cei-list/cei-list.component.ts
 create mode 100644 Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.html
 create mode 100644 Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss
 create mode 100644 Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.spec.ts
 create mode 100644 Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.ts
 create mode 100644 Mohem/src/app/eit/models/add.cei.response.ts
 create mode 100644 Mohem/src/app/eit/models/cei.request.ts
 create mode 100644 Mohem/src/app/itemforsale/filter/filter.component.html
 create mode 100644 Mohem/src/app/itemforsale/filter/filter.component.scss
 create mode 100644 Mohem/src/app/itemforsale/filter/filter.component.spec.ts
 create mode 100644 Mohem/src/app/itemforsale/filter/filter.component.ts
 create mode 100644 Mohem/src/app/itemforsale/services/domsafe.ts
 create mode 100644 Mohem/src/app/itemforsale/services/service.service.spec.ts
 create mode 100644 Mohem/src/app/itemforsale/services/service.service.ts
 create mode 100644 Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.html
 create mode 100644 Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss
 create mode 100644 Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.spec.ts
 create mode 100644 Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.ts
 create mode 100644 Mohem/src/app/notification/models/COCRequest.ts
 create mode 100644 Mohem/src/app/notification/models/userItemTypeRequest.ts
 create mode 100644 Mohem/src/app/notification/worklist-setting/worklist-setting.component.html
 create mode 100644 Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss
 create mode 100644 Mohem/src/app/notification/worklist-setting/worklist-setting.component.spec.ts
 create mode 100644 Mohem/src/app/notification/worklist-setting/worklist-setting.component.ts
 create mode 100644 Mohem/src/app/offersdiscount/location/location.component.html
 create mode 100644 Mohem/src/app/offersdiscount/location/location.component.scss
 create mode 100644 Mohem/src/app/offersdiscount/location/location.component.spec.ts
 create mode 100644 Mohem/src/app/offersdiscount/location/location.component.ts
 create mode 100644 Mohem/src/app/pending-transaction/home/home.component.html
 create mode 100644 Mohem/src/app/pending-transaction/home/home.component.scss
 create mode 100644 Mohem/src/app/pending-transaction/home/home.component.spec.ts
 create mode 100644 Mohem/src/app/pending-transaction/home/home.component.ts
 create mode 100644 Mohem/src/app/pending-transaction/pending-transaction.module.ts
 create mode 100644 Mohem/src/app/pending-transaction/pending-transaction.page.html
 create mode 100644 Mohem/src/app/pending-transaction/pending-transaction.page.scss
 create mode 100644 Mohem/src/app/pending-transaction/pending-transaction.page.spec.ts
 create mode 100644 Mohem/src/app/pending-transaction/pending-transaction.page.ts
 create mode 100644 Mohem/src/app/pending-transaction/service/service.service.spec.ts
 create mode 100644 Mohem/src/app/pending-transaction/service/service.service.ts
 create mode 100644 Mohem/src/app/profile/add-update-contact/add-update-contact.component.html
 create mode 100644 Mohem/src/app/profile/add-update-contact/add-update-contact.component.scss
 create mode 100644 Mohem/src/app/profile/add-update-contact/add-update-contact.component.spec.ts
 create mode 100644 Mohem/src/app/profile/add-update-contact/add-update-contact.component.ts
 create mode 100644 Mohem/src/app/profile/confirm-contact/confirm-contact.component.html
 create mode 100644 Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss
 create mode 100644 Mohem/src/app/profile/confirm-contact/confirm-contact.component.spec.ts
 create mode 100644 Mohem/src/app/profile/confirm-contact/confirm-contact.component.ts
 create mode 100644 Mohem/src/app/profile/contact/contact.component.html
 create mode 100644 Mohem/src/app/profile/contact/contact.component.scss
 create mode 100644 Mohem/src/app/profile/contact/contact.component.spec.ts
 create mode 100644 Mohem/src/app/profile/contact/contact.component.ts
 create mode 100644 Mohem/src/app/profile/models/contact.request.ts
 create mode 100644 Mohem/src/app/reports/concurrent-report/concurrent-report.component.html
 create mode 100644 Mohem/src/app/reports/concurrent-report/concurrent-report.component.scss
 create mode 100644 Mohem/src/app/reports/concurrent-report/concurrent-report.component.spec.ts
 create mode 100644 Mohem/src/app/reports/concurrent-report/concurrent-report.component.ts
 create mode 100644 Mohem/src/app/reports/report-service.service.spec.ts
 create mode 100644 Mohem/src/app/reports/report-service.service.ts
 create mode 100644 Mohem/src/app/reports/reports.module.ts
 create mode 100644 Mohem/src/app/reports/reports.page.html
 create mode 100644 Mohem/src/app/reports/reports.page.scss
 create mode 100644 Mohem/src/app/reports/reports.page.spec.ts
 create mode 100644 Mohem/src/app/reports/reports.page.ts
 create mode 100644 Mohem/src/app/reports/transaction-list/transaction-list.component.html
 create mode 100644 Mohem/src/app/reports/transaction-list/transaction-list.component.scss
 create mode 100644 Mohem/src/app/reports/transaction-list/transaction-list.component.spec.ts
 create mode 100644 Mohem/src/app/reports/transaction-list/transaction-list.component.ts
 create mode 100644 Mohem/src/app/termination/confirm-termination/confirm-termination.component.html
 create mode 100644 Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss
 create mode 100644 Mohem/src/app/termination/confirm-termination/confirm-termination.component.spec.ts
 create mode 100644 Mohem/src/app/termination/confirm-termination/confirm-termination.component.ts
 create mode 100644 Mohem/src/app/termination/service/termination-service.service.spec.ts
 create mode 100644 Mohem/src/app/termination/service/termination-service.service.ts
 create mode 100644 Mohem/src/app/termination/termination-form/termination-form.component.html
 create mode 100644 Mohem/src/app/termination/termination-form/termination-form.component.scss
 create mode 100644 Mohem/src/app/termination/termination-form/termination-form.component.spec.ts
 create mode 100644 Mohem/src/app/termination/termination-form/termination-form.component.ts
 create mode 100644 Mohem/src/app/termination/termination.module.ts
 create mode 100644 Mohem/src/app/termination/termination.page.html
 create mode 100644 Mohem/src/app/termination/termination.page.scss
 create mode 100644 Mohem/src/app/termination/termination.page.spec.ts
 create mode 100644 Mohem/src/app/termination/termination.page.ts
 create mode 100644 Mohem/src/assets/icon/bar-chart-outline.svg
 create mode 100644 Mohem/src/assets/icon/bar-chart.svg
 create mode 100644 Mohem/src/assets/icon/blank.svg
 create mode 100644 Mohem/src/assets/icon/green.svg
 create mode 100644 Mohem/src/assets/icon/select-all.svg
 create mode 100644 Mohem/src/assets/icon/settings-not.svg
 create mode 100644 Mohem/src/assets/icon/yellow.svg
 create mode 100644 Mohem/src/assets/imgs/hr-request.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/Doable-old.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/Doable.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/More-2.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/Skip-2.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/answer.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/data-corrected (2).png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/data-corrected (3).png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/data-corrected.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/doable-2-old.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/info-old.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/notDoable-old.png
 create mode 100644 Mohem/src/assets/imgs/mohemm-action/notDoable.png
 create mode 100644 Mohem/src/assets/imgs/my-request.png
 create mode 100644 Mohem/src/assets/imgs/no-images.png
 create mode 100644 Mohem/src/assets/imgs/pending-transaction.png
 create mode 100644 Mohem/src/assets/imgs/profile-icons/family-g.svg
 create mode 100644 Mohem/src/assets/imgs/profile-icons/family.svg

diff --git a/Mohem/src/app/absence/absence-confirm/absence-confirm.component.ts b/Mohem/src/app/absence/absence-confirm/absence-confirm.component.ts
index d4a765a3..40dc3dd3 100644
--- a/Mohem/src/app/absence/absence-confirm/absence-confirm.component.ts
+++ b/Mohem/src/app/absence/absence-confirm/absence-confirm.component.ts
@@ -15,13 +15,14 @@ import { AbsenceAttachmentComponent } from '../absence-attachment/absence-attach
 import { WorkListAttachViewComponent } from 'src/app/notification/work-list-attach-view/work-list-attach-view.component';
 import { FileUploader } from 'ng2-file-upload';
 import { SubmitAbsenceModalComponent } from '../submit-absence-modal/submit-absence-modal.component';
+import { HomeComponent } from "src/app/notification/home/home.component";
 @Component({
   selector: 'app-absence-confirm',
   templateUrl: './absence-confirm.component.html',
   styleUrls: ['./absence-confirm.component.scss']
 })
 export class AbsenceConfirmComponent implements OnInit {
-  direction:string;
+  direction: string;
   P_TransactionID: number;
   approversList = [];
   selEmp: string = '';
@@ -58,7 +59,7 @@ export class AbsenceConfirmComponent implements OnInit {
       this.P_TransactionID = this.common.sharedService.getSharedData(
         AbsenceResponse.SHARED_DATA
       );
-      this.getPassNotificationDetails =this.common.sharedService.getSharedData(
+      this.getPassNotificationDetails = this.common.sharedService.getSharedData(
         AbsenceNotificatonBodyResponse.NOT_WORKLIST,
         true
       );
@@ -89,7 +90,7 @@ export class AbsenceConfirmComponent implements OnInit {
     this.getApproversList();
   }
 
-  ngOnInit() {}
+  ngOnInit() { }
   startAbApproval() {
     if (this.attachListOver) {
       //first call add attach inside success call submit
@@ -126,12 +127,12 @@ export class AbsenceConfirmComponent implements OnInit {
         this.startAbsApprovalProcess();
       } else {
         //stope
-        let filtered = this.attachListOver.filter(function(el) {
+        let filtered = this.attachListOver.filter(function (el) {
           return el.isSuccess == true;
         });
         this.attachListOver = filtered;
         let msg: string = '';
-       // msg = this.translate.translate("addAttach.errorMsg");
+        // msg = this.translate.translate("addAttach.errorMsg");
         //this.common.showAlert(msg);
       }
     }
@@ -168,11 +169,12 @@ export class AbsenceConfirmComponent implements OnInit {
     if (this.common.validResponse(result)) {
       this.isSubmitBtnClicked = true;
       //if(this.isResubmitAbs==false){
-     let msg: string = this.ts.trPK('general', 'messageSuccess');
-     this.common.presentAlert(msg);
-    
+      //  let msg: string = this.ts.trPK('general', 'messageSuccess');
+      //  this.common.presentAlert(msg);
+      this.common.greenToastPK("eit", "approval-message-success")
       // }
       // this.navCtrl.popToRoot();
+      this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       this.common.openNotificationPage();
     }
   }
@@ -204,61 +206,61 @@ export class AbsenceConfirmComponent implements OnInit {
     // });
     const modal = await this.modalCtrl.create({
       component: AbsenceAttachmentComponent,
-      componentProps:{  indexLastObj: this.attachListOver.length, TransactionID: this.P_TransactionID},
+      componentProps: { indexLastObj: this.attachListOver.length, TransactionID: this.P_TransactionID },
       keyboardClose: true,
       animated: false
-    }); 
+    });
     modal.onDidDismiss()
-    .then((data) => {
-      if (data == 'cancel' || data == 'undefined') {
-        return;
-      } else {
-        if (!str) {
-          this.updateFile(data, attachDocID);
+      .then((data) => {
+        if (data == 'cancel' || data == 'undefined') {
+          return;
         } else {
-          this.attachListDisplay = data.data;
-          this.attachItems = this.attachListDisplay.map(function (el) {
-            var o = Object.assign({}, el);
-            o.isSuccess = false;
-            return o;
-          });
-          this.attachListOver = this.attachListOver ? this.attachListOver.concat(this.attachItems) : this.attachItems;
+          if (!str) {
+            this.updateFile(data, attachDocID);
+          } else {
+            this.attachListDisplay = data.data;
+            this.attachItems = this.attachListDisplay.map(function (el) {
+              var o = Object.assign({}, el);
+              o.isSuccess = false;
+              return o;
+            });
+            this.attachListOver = this.attachListOver ? this.attachListOver.concat(this.attachItems) : this.attachItems;
+          }
         }
-      }
-    });
+      });
     return await modal.present();
 
   }
 
 
-/*****submit modal********/
-async openSubmitModal() {
-  this.common.sharedService.setSharedData( this.attachListOver, 'submitAbsAttachmentList');
-  this.common.sharedService.setSharedData(this.absComments, 'absComments');
-  const modal = await this.modalCtrl.create({
-    component: SubmitAbsenceModalComponent,
-    backdropDismiss: false,
+  /*****submit modal********/
+  async openSubmitModal() {
+    this.common.sharedService.setSharedData(this.attachListOver, 'submitAbsAttachmentList');
+    this.common.sharedService.setSharedData(this.absComments, 'absComments');
+    const modal = await this.modalCtrl.create({
+      component: SubmitAbsenceModalComponent,
+      backdropDismiss: false,
 
-  });
-  modal.cssClass = 'note-modal';
+    });
+    modal.cssClass = 'note-modal';
 
-  modal.onDidDismiss()
-    .then((data) => {
-      console.log(data.data);
+    modal.onDidDismiss()
+      .then((data) => {
+        console.log(data.data);
 
-      if (data.data == 'cancel' || data.data == undefined) {
-        return;
-      } else {
-         this.startAbApproval();
-      }
-    });
+        if (data.data == 'cancel' || data.data == undefined) {
+          return;
+        } else {
+          this.startAbApproval();
+        }
+      });
 
-  return await modal.present();
+    return await modal.present();
 
 
 
 
-}
+  }
 
 
 
@@ -266,7 +268,7 @@ async openSubmitModal() {
 
 
   removeFile(objectitem) {
-   
+
     if (this.attachListOver) {
       let index2 = this.attachListOver.findIndex(item => item == objectitem);
       if (index2 > -1) {
@@ -300,12 +302,12 @@ async openSubmitModal() {
     } // valid it
   }
 
- async OpenAttachFiles(value, Type) {
+  async OpenAttachFiles(value, Type) {
     this.common.sharedService.setSharedData({ displayData: value, TypeData: Type }, 'WorkListAttachViewPage');
     const modal = await this.modalCtrl.create({
       component: WorkListAttachViewComponent
     });
-    
+
     modal.onDidDismiss()
       .then((data) => {
       });
@@ -314,7 +316,7 @@ async openSubmitModal() {
   }
 
   updateFile(attachList, attachDocID) {
-  
+
     let req = {
       P_ATTACHED_DOCUMENT_ID: attachDocID,
       P_FILE_DATA: attachList[0].P_FILE_DATA,
@@ -327,7 +329,7 @@ async openSubmitModal() {
           let msg: string = '';
           // msg = this.translate.translate("addAttach.attachUpdate");
           // this.common.showAlert(msg);
-        
+
           this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
         }
       } // val
@@ -345,7 +347,7 @@ async openSubmitModal() {
     // });
   }
   continueDelete(attach) {
-   
+
     let req = {
       P_ATTACHED_DOCUMENT_ID: attach.ATTACHED_DOCUMENT_ID
     };
@@ -367,9 +369,9 @@ async openSubmitModal() {
 
 
 
-   /*******************Add attchement Functions*************/
+  /*******************Add attchement Functions*************/
 
-   public uploader: FileUploader = new FileUploader({
+  public uploader: FileUploader = new FileUploader({
     allowedMimeType: ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
     maxFileSize: 10 * 1024 * 1024,
     formatDataFunctionIsAsync: true,
@@ -386,7 +388,7 @@ async openSubmitModal() {
   });
 
 
-  onFileSelectedclick(event){
+  onFileSelectedclick(event) {
     event.target.value = '';
   }
 
@@ -430,7 +432,7 @@ async openSubmitModal() {
 
   pushObject(fileData, name, type) {
 
-     console.log('before push: '+ this.index);
+    console.log('before push: ' + this.index);
     //this.attachListOver.length++;
     try {
       let array = name.split('.');
@@ -438,11 +440,11 @@ async openSubmitModal() {
 
       this.attachListOver.push(
         {
-          AttachmentID:  this.attachListOver.length,
+          AttachmentID: this.attachListOver.length,
           P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
           P_FILE_DATA: fileData.split(',')[1],
           P_FILE_NAME: name,//.split('.')[0],
-          P_TRANSACTION_ID:  this.P_TransactionID
+          P_TRANSACTION_ID: this.P_TransactionID
         })
 
     } catch (e) {
diff --git a/Mohem/src/app/absence/absence-replacement-list/absence-replacement-list.component.ts b/Mohem/src/app/absence/absence-replacement-list/absence-replacement-list.component.ts
index 0fcacdb7..d2ef54b6 100644
--- a/Mohem/src/app/absence/absence-replacement-list/absence-replacement-list.component.ts
+++ b/Mohem/src/app/absence/absence-replacement-list/absence-replacement-list.component.ts
@@ -32,7 +32,7 @@ export class AbsenceReplacementListComponent implements OnInit {
   P_PAGE_NUM: number;
   P_PAGE_LIMIT: number;
   ReplacementList: any = [];
-  searchBy: string = "";
+  searchBy: string = "2";
   IsReachEnd: boolean = false;
   ReplacmentListRes: WorKListReplacmentEmployeeResponse;
   private WorkListReplacmentEmployeeObj: WorkListReplacmentEmployeeRequest = new WorkListReplacmentEmployeeRequest();
diff --git a/Mohem/src/app/absence/submit-absence/submit-absence.component.html b/Mohem/src/app/absence/submit-absence/submit-absence.component.html
index 9a17288e..f3ffe7d4 100644
--- a/Mohem/src/app/absence/submit-absence/submit-absence.component.html
+++ b/Mohem/src/app/absence/submit-absence/submit-absence.component.html
@@ -5,19 +5,20 @@
 
 <ion-content padding>
 
-  <!-- <div [ngClass]=" direction === 'en' ?  'custom-text-area-element Field-en' : 'custom-text-area-element Field-ar'" >
+  <div [ngClass]=" direction === 'en' ?  'custom-text-area-element Field-en' : 'custom-text-area-element Field-ar'" >
       <label class="label" position='floating'  class="colBold requiredClass">{{ts.trPK('submitAbsence','absenceType')}} </label>
-      <select class="label-Select"  [(ngModel)]="absenceType"  (change)="onTypeAbsenceChange()" required> 
+      <select name="selectAbsenceType" class="label-Select"  #selectAbsenceType="ngModel" [(ngModel)]="absenceType"  (change)="onTypeAbsenceChange()" required> 
+        <option value="noType" selected hidden selected><p>{{ts.trPK('absenceList','selectType')}}</p></option>
           <option   value= "{{item.ABSENCE_ATTENDANCE_TYPE_ID}}" *ngFor="let item of absenceTypeList; let i=index;">{{item.ABSENCE_ATTENDANCE_TYPE_NAME}} </option>
       </select>
-  </div> -->
-  <ion-item class='dynamicField'>
+  </div>
+  <!-- <ion-item class='dynamicField'>
     <ion-label position='floating' class="colBold requiredClass">{{ts.trPK('submitAbsence','absenceType')}} </ion-label>
     <ion-select  (ionChange)="calcDay()" okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}" [(ngModel)]="absenceType"  (ionChange)="onTypeAbsenceChange()" required>
-        <!-- let item of AbsenceType; let i=index; -->
+         let item of AbsenceType; let i=index; 
         <ion-select-option value= "{{item.ABSENCE_ATTENDANCE_TYPE_ID}}" *ngFor="let item of absenceTypeList; let i=index;">{{item.ABSENCE_ATTENDANCE_TYPE_NAME}} </ion-select-option>
     </ion-select>
-  </ion-item>
+  </ion-item> -->
   
   <ion-item class='dynamicField'>
     <ion-label position='floating' class="colBold requiredClass">{{ts.trPK('submitAbsence','startDate')}} </ion-label>
diff --git a/Mohem/src/app/absence/submit-absence/submit-absence.component.ts b/Mohem/src/app/absence/submit-absence/submit-absence.component.ts
index 360a5175..159c4842 100644
--- a/Mohem/src/app/absence/submit-absence/submit-absence.component.ts
+++ b/Mohem/src/app/absence/submit-absence/submit-absence.component.ts
@@ -3,7 +3,7 @@ import { CommonService } from "src/app/hmg-common/services/common/common.service
 import { TranslatorService } from "src/app/hmg-common/services/translator/translator.service";
 import { MenuService } from "src/app/hmg-common/services/menu/menuservice.service";
 import { MenuResponse } from "src/app/hmg-common/services/menu/models/menu-response";
-import { ModalController ,IonSelectOption ,IonSelect  } from "@ionic/angular";
+import { ModalController, IonSelectOption, IonSelect } from "@ionic/angular";
 import { SubmitAbsenceService } from "../service/submit.absence.service";
 import { AbsenceAttahcmentResponse } from "../models/abs.attach.response";
 import { AbsenceListService } from "../service/service.service";
@@ -23,8 +23,8 @@ import { DatePicker } from "@ionic-native/date-picker/ngx";
 import { Request } from '../../hmg-common/services/models/request';
 // import { Request } from "../models/request";
 import * as moment from "moment";
-import {ReplacementListComponent} from "../../vacation-rule/replacement-list/replacement-list.component";
-import {ReplacmentResponse} from "../models/replacment-response";
+import { ReplacementListComponent } from "../../vacation-rule/replacement-list/replacement-list.component";
+import { ReplacmentResponse } from "../models/replacment-response";
 import { AbsenceResponse } from '../models/absence.response';
 import { AbsenceReplacementListComponent } from '../absence-replacement-list/absence-replacement-list.component';
 import { AbsenceNotificatonBodyResponse } from 'src/app/notification/models/AbsenceNotificationBodyRes';
@@ -51,7 +51,7 @@ export class SubmitAbsenceComponent implements OnInit {
   private modalFlag: any = false;
   menuType: any;
   employeeSel: any;
-  absenceType: any;
+  absenceType = 'noType';
   absenceTypeName: string = null;
   absenceTypeList: any;
   startDate: any;
@@ -99,8 +99,8 @@ export class SubmitAbsenceComponent implements OnInit {
     this.direction = TranslatorService.getCurrentLanguageName();
     ////*new add*/////
     /**********resubmit************ */
-      this.getPassNotificationDetails = this.common.sharedService.getSharedData(AbsenceNotificatonBodyResponse.NOT_WORKLIST, true);
-     this.getPassdirfromNotifiPage = this.common.sharedService.getSharedData('dirfromNotificationPage');
+    this.getPassNotificationDetails = this.common.sharedService.getSharedData(AbsenceNotificatonBodyResponse.NOT_WORKLIST, true);
+    this.getPassdirfromNotifiPage = this.common.sharedService.getSharedData('dirfromNotificationPage');
     //this.getPassNotificationDetails = this.common.sharedService.getSharedData(AbsenceNotificatonBodyResponse.NOT_WORKLIST, true);
     //  this.getPassdirfromNotifiPage = this.navParams.get('dirfromNotificationPage');
     if (this.getPassdirfromNotifiPage) {
@@ -110,8 +110,8 @@ export class SubmitAbsenceComponent implements OnInit {
       this.notificationId = this.getPassNotificationDetails.NOTIFICATION_ID;
       this.selEmp = this.getPassNotificationDetails.SELECTED_EMPLOYEE_NUMBER;
       this.respID = -999;
-     this.submitAbsObjList = this.common.sharedService.getSharedData('submitAbsObjList');
-     console.log()
+      this.submitAbsObjList = this.common.sharedService.getSharedData('submitAbsObjList');
+      console.log()
     } else {
       this.action = "CREATE";
       this.selEmp = this.common.sharedService.getSharedData(
@@ -185,7 +185,7 @@ export class SubmitAbsenceComponent implements OnInit {
     }
   }
   calcDay() {
-    console.log("calcDay" );
+    console.log("calcDay");
     let msg: string = "";
     if (
       this.startDate == undefined ||
@@ -233,7 +233,7 @@ export class SubmitAbsenceComponent implements OnInit {
       this.totalDays = result.CalculateAbsenceDuration.P_ABSENCE_DAYS;
     }
   }
-  async openSearch(){
+  async openSearch() {
     const modal = await this.modalCtrl.create({
       component: ReplacementListComponent,
       keyboardClose: true,
@@ -259,7 +259,7 @@ export class SubmitAbsenceComponent implements OnInit {
         console.log(data)
         console.log(user);
         if (data) {
-          this.employeeName  = user.EMPLOYEE_DISPLAY_NAME;
+          this.employeeName = user.EMPLOYEE_DISPLAY_NAME;
           this.employeeID = user.USER_NAME;
           this.employeeSel = this.employeeName + "," + this.employeeID;
         }
@@ -278,12 +278,12 @@ export class SubmitAbsenceComponent implements OnInit {
   }
 
   public onTypeAbsenceChange() {
-    
+
     if (this.absenceType) {
       let obj: any = this.absenceTypeList.find(
         s => s.ABSENCE_ATTENDANCE_TYPE_ID == this.absenceType
       );
-     
+
 
       if (obj) this.absenceTypeName = obj.DESC_FLEX_CONTEXT_CODE;
       else this.absenceTypeName = null;
@@ -443,7 +443,7 @@ export class SubmitAbsenceComponent implements OnInit {
             this.textInput = new TextInput(
               feildsList[i].SEGMENT_PROMPT,
               feildsList[i].APPLICATION_COLUMN_NAME,
-               defaultVal,
+              defaultVal,
               containerId,
               defaultValText,
               feildsList[i].MOBILE_ENABLED,
@@ -492,9 +492,9 @@ export class SubmitAbsenceComponent implements OnInit {
       this.fillAbsStructure();
     }
   }
- 
+
   bindHtmlElemEvents(id, obj) {
- 
+
     const elem = document.getElementById(id);
     elem.addEventListener("change", e => {
       elem.classList.remove("requiredClassElm");
@@ -1039,20 +1039,20 @@ export class SubmitAbsenceComponent implements OnInit {
           let elem = document.getElementById(
             this.absenceDffresponse[i].APPLICATION_COLUMN_NAME
           ) as HTMLInputElement;
-          let elemVal="";
+          let elemVal = "";
           if (elem.classList.contains('onic-date')) {
-             elemVal = (document.getElementById(
+            elemVal = (document.getElementById(
               this.absenceDffresponse[i].APPLICATION_COLUMN_NAME
             ) as HTMLInputElement).value;
-            if(elemVal){
+            if (elemVal) {
               elemVal = moment(elemVal).format("YYYY/MM/DD hh:mm:ss");
             }
-           
-        }else{
-           elemVal = (document.getElementById(
-            this.absenceDffresponse[i].APPLICATION_COLUMN_NAME
-          ) as HTMLInputElement).value;
-        }
+
+          } else {
+            elemVal = (document.getElementById(
+              this.absenceDffresponse[i].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement).value;
+          }
           textValue = elemVal;
 
           if (
@@ -1060,7 +1060,7 @@ export class SubmitAbsenceComponent implements OnInit {
             this.absenceDffresponse[i].DISPLAY_FLAG != "N"
           ) {
             //date
-               elemVal = this.common.formatDate(elemVal);
+            elemVal = this.common.formatDate(elemVal);
           } else if (
             this.absenceDffresponse[i].FORMAT_TYPE == "Y" &&
             this.absenceDffresponse[i].DISPLAY_FLAG != "N"
@@ -1323,6 +1323,7 @@ export class SubmitAbsenceComponent implements OnInit {
     }
     return isSt;
   }
+
   validateAbcenseTransaction() {
     (this.elementRef.nativeElement.querySelectorAll(
       "ion-item"
@@ -1447,9 +1448,9 @@ export class SubmitAbsenceComponent implements OnInit {
   private handleSubmitAbsence(result) {
     if (this.common.validResponse(result)) {
       if (this.getPassdirfromNotifiPage) {
-         this.common.sharedService.setSharedData(result.ResubmitAbsenceTransactionList.P_TRANSACTION_ID, AbsenceResponse.SHARED_DATA);
-          this.common.openConfirmAbsece();
-         //  this.navCtrl.push("SubmitAbsenceConfirmPage", { isResubmit: true });
+        this.common.sharedService.setSharedData(result.ResubmitAbsenceTransactionList.P_TRANSACTION_ID, AbsenceResponse.SHARED_DATA);
+        this.common.openConfirmAbsece();
+        //  this.navCtrl.push("SubmitAbsenceConfirmPage", { isResubmit: true });
       } else {
         this.common.sharedService.setSharedData(result.SumbitAbsenceTransactionList.P_TRANSACTION_ID, AbsenceResponse.SHARED_DATA);
         this.common.openConfirmAbsece();
diff --git a/Mohem/src/app/app-routing.module.ts b/Mohem/src/app/app-routing.module.ts
index b4b5da86..c6a651c9 100644
--- a/Mohem/src/app/app-routing.module.ts
+++ b/Mohem/src/app/app-routing.module.ts
@@ -25,7 +25,12 @@ const routes: Routes = [
   { path: 'offersdiscount', loadChildren: './offersdiscount/offersdiscount.module#OffersdiscountPageModule' },
   { path: 'mowadhafi', loadChildren: './mowadhafi/mowadhafi.module#MowadhafiPageModule' },
   { path: 'erm-channel', loadChildren: './erm-channel/erm-channel.module#ErmChannelPageModule' },
-  { path: 'backend-integrations', loadChildren: './backend-integrations/backend-integrations.module#BackendIntegrationsPageModule' }
+  { path: 'backend-integrations', loadChildren: './backend-integrations/backend-integrations.module#BackendIntegrationsPageModule' },
+  { path: 'reports', loadChildren: './reports/reports.module#ReportsPageModule' },
+
+  { path: 'termination', loadChildren: './termination/termination.module#TerminationPageModule' },
+  { path: 'pending-transaction', loadChildren: './pending-transaction/pending-transaction.module#PendingTransactionPageModule' }
+
 
 
 
diff --git a/Mohem/src/app/app.component.html b/Mohem/src/app/app.component.html
index 5b40ba6e..f4f782cc 100644
--- a/Mohem/src/app/app.component.html
+++ b/Mohem/src/app/app.component.html
@@ -35,7 +35,14 @@
                 {{ts.trPK('userProfile','title')}}
               </ion-label>
             </ion-item>
-  
+            <ion-item (click)="performanceEvaluation()">
+              <ion-thumbnail slot="start" class="menu-thumb">
+                <img style= "height: 24px !important;"  src="../assets/icon/bar-chart.svg" item-left>
+              </ion-thumbnail>
+              <ion-label class="profile">
+                {{ts.trPK('userProfile','performance-evaluation')}}
+              </ion-label>
+            </ion-item>
             <ion-item [hidden]="TeamFlag!='true'" (click)="openMyTeamPage()">
               <ion-thumbnail slot="start" class="menu-thumb">
                 <img style= "height: 14px !important;"  src="../assets/imgs/my_team_icon.png" item-left>
@@ -47,13 +54,32 @@
 
             <ion-item  (click)="openMyRequestPage()">
               <ion-thumbnail slot="start" class="menu-thumb">
-                <img style= "height: 14px !important;"  src="../assets/imgs/my_team_icon.png" item-left>
+                <img style= "height: 20px !important;"  src="../assets/imgs/hr-request.png" item-left>
               </ion-thumbnail>
               <ion-label class="profile">
                 {{ts.trPK('userProfile','HR-Request')}}
               </ion-label>
             </ion-item>
+            <div *ngFor="let menu of menuList">
+            
+            <ion-item (click)="oepnMyRequest(menu)"  *ngIf="menu.REQUEST_GROUP_NAME =='MBL_RG_01' && menu.MENU_TYPE =='E'">
+              <ion-thumbnail slot="start" class="menu-thumb">
+                <img style= "height: 20px !important;"  src="../assets/imgs/my-request.png" item-left>
+              </ion-thumbnail>
+              <ion-label class="profile">
+                {{menu.MENU_NAME}}
+              </ion-label>
+            </ion-item>
+          </div>
 
+          <ion-item (click)="oepnTransaction()">
+            <ion-thumbnail slot="start" class="menu-thumb">
+              <img style= "height: 20px !important;"  src="../assets/imgs/pending-transaction.png" item-left>
+            </ion-thumbnail>
+            <ion-label class="profile">
+              {{ts.trPK('general','pending-transaction')}}
+            </ion-label>
+          </ion-item>
 
             <!-- <ion-item (click)="openChangePassword()"> -->
               <ion-item (click)="openChangePassword()"> 
@@ -133,6 +159,14 @@
                 {{ts.trPK('userProfile','title')}}
               </ion-label>
             </ion-item>
+            <ion-item (click)="performanceEvaluation()">
+              <ion-thumbnail slot="start" class="menu-thumb">
+                <img style= "height: 24px !important;"  src="../assets/icon/bar-chart.svg" item-left>
+              </ion-thumbnail>
+              <ion-label class="profile">
+                {{ts.trPK('userProfile','performance-evaluation')}}
+              </ion-label>
+            </ion-item>
             <ion-item [hidden]="TeamFlag!='true'" (click)="openMyTeamPage()">
               <ion-thumbnail slot="start" class="menu-thumb">
                 <img style= "height: 14px !important;"  src="../assets/imgs/my_team_icon.png" item-left>
@@ -149,6 +183,26 @@
                 {{ts.trPK('userProfile','HR-Request')}}
               </ion-label>
             </ion-item>
+            <div *ngFor="let menu of menuList">
+            
+              <ion-item (click)="oepnMyRequest(menu)"  *ngIf="menu.REQUEST_GROUP_NAME =='MBL_RG_01' && menu.MENU_TYPE =='E'">
+                <ion-thumbnail slot="start" class="menu-thumb">
+                  <img style= "height: 20px !important;"  src="../assets/imgs/my-request.png" item-left>
+                </ion-thumbnail>
+                <ion-label class="profile">
+                  {{menu.MENU_NAME}}
+                </ion-label>
+              </ion-item>
+            </div>
+  
+            <ion-item (click)="oepnTransaction()">
+              <ion-thumbnail slot="start" class="menu-thumb">
+                <img style= "height: 20px !important;"  src="../assets/imgs/pending-transaction.png" item-left>
+              </ion-thumbnail>
+              <ion-label class="profile">
+                {{ts.trPK('general','pending-transaction')}}
+              </ion-label>
+            </ion-item>
             <ion-item (click)="openChangePassword()"> 
             <ion-thumbnail slot="start" class="menu-thumb">
               <img style= "height: 25px !important;" src="../assets/imgs/lock_icon.png" item-left>
diff --git a/Mohem/src/app/app.component.ts b/Mohem/src/app/app.component.ts
index 47934fec..676501d7 100644
--- a/Mohem/src/app/app.component.ts
+++ b/Mohem/src/app/app.component.ts
@@ -14,6 +14,7 @@ import { DigitalIdComponent } from './authentication/digital-id/digital-id.compo
 import { checkAndUpdatePureExpressionInline } from '@angular/core/src/view/pure_expression';
 import { FirebaseX } from '@ionic-native/firebase-x/ngx';
 import { BusinessCardComponent } from './authentication/business-card/business-card.component';
+import { MenuResponse } from './hmg-common/services/menu/models/menu-response';
 
 @Component({
   selector: 'app-root',
@@ -122,7 +123,7 @@ export class AppComponent implements OnInit {
 
   public setScreenNameAnalytics(currentPageName: string) {
     try {
-      this.firebasex.setScreenName(currentPageName).then((result)=>{
+      this.firebasex.setScreenName(currentPageName).then((result) => {
         console.log(result);
       });
     } catch (Error) { }
@@ -208,7 +209,7 @@ export class AppComponent implements OnInit {
           let jobTitle = user.POSITION_NAME.split('.');
           if (jobTitle && jobTitle.length > 1) {
             this.User_Job_name = jobTitle[0] + " " + jobTitle[1];
-          }​
+          }
           //erm channel
           // if (!CommonService.SKIP)
           //   this.cs.navigateForward('/erm-channel/survey');
@@ -218,7 +219,10 @@ export class AppComponent implements OnInit {
       });
     });
     this.events.subscribe('getNotCount', badge => { this.notBadge = badge; });
-    this.events.subscribe('myTeamFlag', myTeamFlag => { this.TeamFlag = myTeamFlag; });
+    this.events.subscribe('myTeamFlag', myTeamFlag => {
+      this.TeamFlag = myTeamFlag;
+      this.menuList = this.cs.sharedService.getSharedData(MenuResponse.MENU_LIST, false);
+    });
   }
 
   private initializeDirection() {
@@ -267,7 +271,10 @@ export class AppComponent implements OnInit {
     this.cs.openProfile('sideMenu');
     this.menu.toggle();
   }
-
+  public performanceEvaluation() {
+    this.cs.openPerformanceevaluation();
+    this.menu.toggle();
+  }
   public openNotification() {
     this.cs.openNotificationPage();
     this.menu.toggle();
@@ -294,7 +301,7 @@ export class AppComponent implements OnInit {
     //this.userInfo = this.cs.sharedService.getSharedData('bussiness-card-info', false);
     const modal = await this.modalController.create({
       component: BusinessCardComponent,
-      cssClass: 'digital-id-modal-css',
+      cssClass: 'business-card-modal-css',
       componentProps: {
         'userInfo': this.userInfo
       }
@@ -348,4 +355,13 @@ export class AppComponent implements OnInit {
       } else { }
     });
   }
+  oepnMyRequest(menu) {
+    this.cs.sharedService.setSharedData(menu, MenuResponse.SELECTED_MENU);
+    this.cs.openConcurrentReport();
+    this.menu.toggle();
+  }
+  oepnTransaction() {
+    this.cs.openTransactions();
+    this.menu.toggle();
+  }
 }
diff --git a/Mohem/src/app/app.scss b/Mohem/src/app/app.scss
index e91e3666..057206e1 100644
--- a/Mohem/src/app/app.scss
+++ b/Mohem/src/app/app.scss
@@ -35,4 +35,7 @@
 .my-custom-modal-css .modal-wrapper {
   width: 95%;
   height: 60%;
+}
+.dependent-title .ion-title{
+  font-size:0.4cm !important;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/authentication/authentication.module.ts b/Mohem/src/app/authentication/authentication.module.ts
index 0e5e953e..1cdb0ea9 100644
--- a/Mohem/src/app/authentication/authentication.module.ts
+++ b/Mohem/src/app/authentication/authentication.module.ts
@@ -14,14 +14,15 @@ import { Device } from '@ionic-native/device/ngx';
 import { SplashScreen } from '@ionic-native/splash-screen/ngx';
 
 import { SearchableOptionsModule } from '../hmg-common/ui/searchable-select/searchable-options.module';
-import {  MobileNumberModule } from 'src/app/hmg-common/ui/mobile-number/mobile-number.module';
+import { MobileNumberModule } from 'src/app/hmg-common/ui/mobile-number/mobile-number.module';
 import { SmsdialogPageModule } from 'src/app/hmg-common/ui/smsdialog/smsdialog.module';
 import { SmsPageModule } from 'src/app/hmg-common/ui/sms/sms.module';
 import { SmsPageComponent } from './sms-page/sms-page.page';
 import { CheckUserComponent } from './check-user/check-user.component';
 import { ChangePasswordComponent } from './change-password/change-password.component';
-import {ConfirmLoginComponent} from '../authentication/confirm-login/confirm-login.component'
-import {WelcomeComponent} from '../authentication/welcome/welcome.component'
+import { ConfirmLoginComponent } from '../authentication/confirm-login/confirm-login.component'
+import { WelcomeComponent } from '../authentication/welcome/welcome.component'
+import { SmsRetriever } from '@ionic-native/sms-retriever/ngx';
 
 const routes: Routes = [
     {
@@ -84,11 +85,12 @@ const routes: Routes = [
         // ConfirmLoginComponent,
         WelcomeComponent,
     ],
-    providers:[
+    providers: [
         FingerprintAIO,
         Device,
-        SplashScreen
+        SplashScreen,
+        SmsRetriever
     ],
-    entryComponents:[]
+    entryComponents: []
 })
 export class AuthenticationPageModule { }
diff --git a/Mohem/src/app/authentication/business-card/business-card.component.html b/Mohem/src/app/authentication/business-card/business-card.component.html
index 6cabace2..efa14208 100644
--- a/Mohem/src/app/authentication/business-card/business-card.component.html
+++ b/Mohem/src/app/authentication/business-card/business-card.component.html
@@ -1,5 +1,5 @@
 <ion-content dir="ltr" *ngIf="userInfo.company_type == 'CS'">
-  <ion-grid class="card-size">
+  <!-- <ion-grid class="card-size">
     <ion-row>
       <ion-col size='6'>
         <img class="logo-img-style" [src]='userInfo.company_logo' alt="https://hmgwebservices.com/images/Moheem/CS.jpg"/>
@@ -9,16 +9,11 @@
       </ion-col>
     </ion-row>
     <ion-row>
-      <ion-col size='6'>
+      <ion-col size='12'>
         <ion-label>
           <h1 class='font-text-style' style="font-size: 20px !important; width: 200%;">{{userInfo.name_en}}</h1>
         </ion-label>
       </ion-col>
-      <ion-col size='6'>
-        <ion-label>
-          <h1 class='font-text-style name-ar-style'>{{userInfo.name_ar}}</h1>
-        </ion-label>
-      </ion-col>
     </ion-row>
     <ion-row>
       <ion-col>
@@ -53,17 +48,25 @@
         </ion-label>
       </ion-col>
     </ion-row>
-  </ion-grid>
-</ion-content> 
+  </ion-grid> -->
+  <div style="height: 320px; width: 320px; transform: rotate(90deg) !important;">
+    <img style="width: 100px; margin-left: 20px; margin-top: 26px;" [src]='userInfo.company_logo' alt="https://hmgwebservices.com/images/Moheem/CS.jpg"/>
+    <h1 *ngIf="direction === 'en'" class='font-text-style' style="font-size: 25px !important; margin-left: 20px; margin-top: 5px; margin-bottom: 0px;">{{userInfo.name_en}}</h1>
+    <h1 *ngIf="direction === 'ar'" class='font-text-style' style="font-size: 25px !important; margin-left: 20px; margin-top: 5px; margin-bottom: 0px;">{{userInfo.name_ar}}</h1>
+    <h5 class='font-text-style' style="margin-left: 20px; margin-top: 0px; ">{{jobName}}</h5>
+    <h5 class='font-text-style' style="margin-left: 20px; font-size: 18px; margin-bottom: 0px;">{{userInfo.mobile}}</h5>
+    <h5 class='font-text-style' style="margin-left: 20px; margin-top: 5px; font-size: 12px; margin-bottom: 5px; white-space: nowrap;">{{userInfo.email}}</h5>
+    <h5 class='font-text-style' style="margin-left: 20px; margin-top: 0px;">{{userInfo.company_url}}</h5>
+  </div>
 
-<!-- <ion-footer>
-  <div class="centerDiv" style="margin-top: 20px !important;">
-    <ion-button class="button-login" (click)="dismiss()"><b>{{ts.trPK('general','close')}}</b></ion-button>
+  <div style="height: 150px; width: 300px;">
+    <img style="width: 140px; margin-left: 145px; margin-top: 26px;" [src]="userInfo.qr"/>
   </div>
-</ion-footer> -->
+</ion-content> 
+
 
 <ion-content dir="ltr" *ngIf="userInfo.company_type != 'CS'">
-  <ion-grid class="cs-card-size">
+  <!-- <ion-grid class="cs-card-size">
     <ion-row>
       <ion-col style="padding-left: 315px;">
         <img class="logo-img-hmg-style" [alt]='userInfo.company_logo' src="../assets/icon/HMG_LOGO.png"/>
@@ -79,7 +82,7 @@
         </ion-label>
       </ion-col>
     </ion-row>
-    <ion-row>
+    <ion-row class="name-div">
       <ion-col>
         <ion-label>
           <h5 class='font-text-style'>{{userInfo.job_en}}</h5>
@@ -107,5 +110,19 @@
         </ion-label>
       </ion-col>
     </ion-row>
-  </ion-grid>
-</ion-content>
\ No newline at end of file
+  </ion-grid> -->
+  <div style="height: 300px; width: 300px; transform: rotate(90deg) !important;">
+    <img style="width: 300px; margin-left: 185px; margin-top: 26px;" [alt]='userInfo.company_logo' src="../assets/icon/HMG_LOGO.png"/>
+    <div style="margin-top: 30px;">
+      <h1 class='font-text-style' style="font-size: 25px !important; margin-left: 20px; margin-top: 5px; margin-bottom: 0px;">{{userInfo.name_en}}</h1>
+      <h5 class='font-text-style' style="margin-left: 20px; margin-top: 0px; ">{{jobName}}</h5>
+      <h5 class='font-text-style' style="margin-left: 20px; font-size: 18px; margin-bottom: 0px;">{{userInfo.mobile}}</h5>
+      <h5 class='font-text-style' style="margin-left: 20px; margin-top: 5px; font-size: 12px; margin-bottom: 5px;">{{userInfo.email}}</h5>
+      <h5 class='font-text-style' style="margin-left: 20px; margin-top: 0px;">{{userInfo.company_url}}</h5>
+    </div>
+  </div>
+
+  <div style="height: 150px; width: 300px;">
+    <img style="width: 140px; margin-left: 10px; margin-top: 50px;" [src]="userInfo.qr"/>
+  </div>
+</ion-content>
diff --git a/Mohem/src/app/authentication/business-card/business-card.component.scss b/Mohem/src/app/authentication/business-card/business-card.component.scss
index f85bbad2..f2ee7250 100644
--- a/Mohem/src/app/authentication/business-card/business-card.component.scss
+++ b/Mohem/src/app/authentication/business-card/business-card.component.scss
@@ -38,10 +38,9 @@
     // CS
     .card-size{
         transform: rotate(90deg) !important;
-        // padding: 5% !important;
-        // padding-right: 0px !important;
         padding-right: 0px !important;
         padding-left: 15% !important;
+        padding: 8% !important;
     }
     .qr-style{
         left: 260% !important;
@@ -57,6 +56,9 @@
     .qr-img-hmg-style{
         left: 580px !important;
     }
+    .cs-card-size{
+        padding: 15px !important;
+    }
 }
 
 @media screen and (min-width: 400px) and (min-height:700px) and (max-height: 799px){
@@ -81,6 +83,9 @@
     .qr-img-hmg-style{
         left: 495px !important;
     }
+    .cs-card-size{
+        padding: 20px !important;
+    }
 }
 
 @media screen and (min-width: 325px) and (max-width:399px) and (max-height: 812px){
@@ -103,6 +108,9 @@
         .qr-img-hmg-style{
             left: 550px !important;
         }
+        .cs-card-size{
+            padding: 10px !important;
+        }
 }
 
 @media screen and (min-width: 325px) and (max-width:399px) and (max-height: 700px){
@@ -140,18 +148,25 @@
     }
       // HMG
       .logo-img-hmg-style{
-        left: 245px !important;
+        left: 225px !important;
     }
     .qr-img-hmg-style{
         left: 430px !important;
     }
+    .cs-card-size{
+        padding:5px !important;
+    }
+    .name-div{
+        padding: 3px !important;
+    }
 }
 @media screen and (min-width: 1px) and (max-width:320px) {
     .card-size{
         transform: rotate(90deg) !important;
         position: relative;
-        bottom: 3%;
+        bottom: 10%;
         left: 8%;
+        padding: 10% !important
     }
     .qr-style{
         width: 70% !important;
@@ -176,34 +191,47 @@
     .logo-img-hmg-style{
         width: 380px !important;
         position: fixed !important;
-        left: 200px !important;
+        left: 240px !important;
         height: 81px !important;
-        bottom: 205px !important;
+        bottom: 175px !important;
     }
     .qr-img-hmg-style{
         width: 105px !important;
         margin-top: 0px !important;
         position: relative !important;
         left: 390px !important;
-        top: 160px !important;
+        top: 150px !important;
     }
     .cs-card-size{
-        padding: 15px !important;
+        padding: 0px !important;
         padding-top: 0px !important;
         padding-left: 1px !important;
     }
 }
 
+@media screen and (min-width: 200px) and (max-width: 300px) and (max-height: 700px){
+    .font-text-style{
+        font-size: 11px !important;
+    }
+    .card-size{
+        padding: 0% !important;
+        left: 7% !important;
+        bottom: 0% !important;
+        position: relative;
+    }
+
+}
+
 
 .card-size{
     transform: rotate(90deg);
-    padding: 6%;
+    padding: 18%;
 }
 .qr-style{
     width: 70%;
     margin-top: 0px;
     position: relative;
-    left: 200%;
+    left: 135%;
 }
 .name-ar-style{
     font-size: 20px; 
@@ -234,5 +262,5 @@
 
 .cs-card-size{
     transform: rotate(90deg); 
-    padding: 25px;
+    padding: 0px;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/authentication/business-card/business-card.component.ts b/Mohem/src/app/authentication/business-card/business-card.component.ts
index 28a3bde3..0785bfb1 100644
--- a/Mohem/src/app/authentication/business-card/business-card.component.ts
+++ b/Mohem/src/app/authentication/business-card/business-card.component.ts
@@ -2,6 +2,8 @@ import { Component, OnInit, Input } from '@angular/core';
 import { ModalController } from '@ionic/angular';
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
+import { AuthenticatedUser } from 'src/app/hmg-common/services/authentication/models/authenticated-user';
 
 @Component({
   selector: 'app-business-card',
@@ -12,15 +14,29 @@ export class BusinessCardComponent implements OnInit {
 
   public userInfo: any;
   public userJobName: any;
+  public jobName: any;
+  direction: string;
   constructor(
     public modalCtrl: ModalController,
     public ts: TranslatorService,
-    public common: CommonService
+    public common: CommonService,
+    public authService: AuthenticationService,
   ) { }
 
   ngOnInit() {
     this.userInfo = JSON.parse(localStorage.getItem('bussiness-card-info'));
-    console.log(this.userInfo);
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.authService
+      .loadAuthenticatedUser()
+      .subscribe((user: AuthenticatedUser) => {
+        console.log(user);
+        if (user) {
+          let jobTitle = user.POSITION_NAME.split('.');
+          if (jobTitle && jobTitle.length > 1) {
+            this.jobName = jobTitle[0] + " " + jobTitle[1];
+          }
+        }
+      });
   }
 
 
@@ -30,4 +46,4 @@ export class BusinessCardComponent implements OnInit {
     });
   }
 
-}
+}
\ No newline at end of file
diff --git a/Mohem/src/app/authentication/change-password/change-password.component.html b/Mohem/src/app/authentication/change-password/change-password.component.html
index b758a8ce..43e2b34a 100644
--- a/Mohem/src/app/authentication/change-password/change-password.component.html
+++ b/Mohem/src/app/authentication/change-password/change-password.component.html
@@ -1,64 +1,106 @@
-<app-generic-header
-  showBack="true"
-  [headerText]="'changePassword,changePassword' | translate">
+<app-generic-header showBack="true" [headerText]="'changePassword,changePassword' | translate">
 </app-generic-header>
 
 
 
 <ion-content padding>
- 
-        <ion-grid>
 
-                <ion-row >
-                        <ion-col [size]="4">
-                          <img [src]="logo" class="logoHeader" />
-                        </ion-col>
-                </ion-row>
-          
-                <br/>
-                <br/>
-                <p class="headerTxt" color="light" > {{'changePassword,changePassword' | translate}}</p>
+    <ion-grid>
+        <ion-row>
+            <ion-col [size]="4">
+                <img [src]="logo" class="logoHeader" />
+            </ion-col>
+        </ion-row>
 
-              <ion-item class="item-input-login" >
+        <p class="headerTxt" color="light"> {{'changePassword,changePassword' | translate}}</p>
 
-                  <img class="item-icon" src="assets/imgs/password.png" item-start />
-                  <!-- <ion-label>{{'changePassword,currentPassword' | translate}}</ion-label> -->
-                  <ion-input class="login-input" required type="password"  
-                  placeholder="{{ts.trPK('changePassword','currentPassword')}}"
-                  [(ngModel)]="P_OLD_PASSWORD"
-                  minLength="8"  min="8"
-                  (ionChange)="onChangeOP()"
-                  ></ion-input>
-              </ion-item>
-              <p class="headerTxt" color="light" > {{'changePassword,newPassword' | translate}}</p>
+        <ion-item class="item-input-login">
+            <img class="item-icon" src="assets/imgs/password.png" item-start />
+            <!-- <ion-label>{{'changePassword,currentPassword' | translate}}</ion-label> -->
+            <ion-input class="login-input" required [type]="currentPasswordIcon"
+                placeholder="{{ts.trPK('changePassword','currentPassword')}}" [(ngModel)]="P_OLD_PASSWORD" minLength="8"
+                min="8" (ionChange)="onChangeOP()"></ion-input>
+                <ion-icon *ngIf='currentPasswordIcon === "text"' name="ios-eye" (click)="showPassword(3)"></ion-icon>
+                <ion-icon *ngIf='currentPasswordIcon === "password"' name="ios-eye-off" (click)="hidePassword(3)"></ion-icon>
+        </ion-item>
 
-              <ion-item class="item-input-login" >
-                    <img class="item-icon" src="assets/imgs/password.png" item-start />
-                    <!-- <ion-label>{{'changePassword,newPassword' | translate}}</ion-label> -->
-                    <ion-input (ionChange)="onChangeNP()" class="login-input" required type="password" placeholder="{{ts.trPK('changePassword','newPassword')}}"
-                        [(ngModel)]="P_NEW_PASSWORD" minLength="8"  min="8" >
-                    </ion-input>
-                </ion-item>
-                    
-                <ion-item class="item-input-login" >
-                        <img class="item-icon" src="assets/imgs/password.png" item-start />
-                    <!-- <ion-label>{{'changePassword,confirmPassword' | translate}}</ion-label> -->
-                    <ion-input (ionChange)="onChangeCNP()" class="login-input" required type="password" placeholder="{{ts.trPK('changePassword','confirmPassword')}}"
-                        [(ngModel)]="P_Confirm_NEW_PASSWORD"  minLength="8"  min="8">
-                    </ion-input>
-                </ion-item>
+        <p class="headerTxt" color="light"> {{'changePassword,newPassword' | translate}}</p>
 
+        <ion-item class="item-input-login">
+            <img class="item-icon" src="assets/imgs/password.png" item-start />
+            <!-- <ion-label>{{'changePassword,newPassword' | translate}}</ion-label> -->
+            <ion-input (ionChange)="onChangeNP()" class="login-input" required [type]="newPasswordIcon"
+                placeholder="{{ts.trPK('changePassword','newPassword')}}" [(ngModel)]="P_NEW_PASSWORD" minLength="8"
+                min="8">
+            </ion-input>
+            <ion-icon *ngIf='newPasswordIcon === "text"' name="ios-eye" (click)="showPassword(1)"></ion-icon>
+            <ion-icon *ngIf='newPasswordIcon === "password"' name="ios-eye-off" (click)="hidePassword(1)"></ion-icon>
+        </ion-item>
 
+        <ion-item class="item-input-login">
+            <img class="item-icon" src="assets/imgs/password.png" item-start />
+            <!-- <ion-label>{{'changePassword,confirmPassword' | translate}}</ion-label> -->
+            <ion-input (ionChange)="onChangeCNP()" class="login-input" required [type]="confirmPasswordIcon"
+                placeholder="{{ts.trPK('changePassword','confirmPassword')}}" [(ngModel)]="P_Confirm_NEW_PASSWORD"
+                minLength="8" min="8">
+            </ion-input>
+            <ion-icon *ngIf='confirmPasswordIcon === "text"' name="ios-eye" (click)="showPassword(2)"></ion-icon>
+            <ion-icon *ngIf='confirmPasswordIcon === "password"' name="ios-eye-off" (click)="hidePassword(2)"></ion-icon>
+        </ion-item>
+      
+        <ion-item lines='none'>
+            <img class="item-icon "  src="../assets/imgs/req info.svg"  item-start />
+            <ion-label><p class="info">{{recentPasswordNote.text}}</p></ion-label>
+        </ion-item>
+        <!-- <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(1)" item-start />
+            <ion-label><p>{{isLowerCase.text}}</p></ion-label>
+        </ion-item>
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(2)" item-start />
+            <ion-label><p>{{isUpperCase.text}}</p></ion-label>
+        </ion-item> -->
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(1)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{isLetterCase.text}}</p></ion-label>
+        </ion-item>
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(3)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{isHasDigit.text}}</p></ion-label>
+        </ion-item>
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(4)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{isMinLength.text}}</p></ion-label>
+        </ion-item>
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(5)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{isRepeatedLetter.text}}</p></ion-label>
+        </ion-item>
+        <!-- <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(6)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{isContainSpecialChar.text}}</p></ion-label>
+        </ion-item> -->
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(7)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{confirmMatchNew.text}}</p></ion-label>
+        </ion-item>
+        <ion-item lines='none'>
+            <img class="item-icon" [src]="checkerFuncation(8)" item-start />
+            <ion-label><p style="white-space: pre-wrap;">{{userNameMatchNew.text}}</p></ion-label>
+        </ion-item>
+
+    </ion-grid>
+
+    <page-trailer [small]="true"></page-trailer>
+
+    <!-- [disabled]="NEW_PASSWORD && Confirm_NEW_PASSWORD" [disabled]="true"-->
 
-        </ion-grid>
-        <page-trailer [small]="true"></page-trailer>
-  
-        <!-- [disabled]="NEW_PASSWORD && Confirm_NEW_PASSWORD" [disabled]="true"-->
-        
 </ion-content>
 <ion-footer>
     <div class="centerDiv">
 
-        <button [disabled]="!(NEW_PASSWORD && Confirm_NEW_PASSWORD && OLD_PASSWORD)" [ngClass]=" !(NEW_PASSWORD && Confirm_NEW_PASSWORD && OLD_PASSWORD) ? 'disabledButton' : '' " class="button-login"  ion-button  (click)="submit()">{{ts.trPK('login','changepassword')}}</button>
+        <button [disabled]="disabledSubmitBtn()"
+        [ngClass]=" disabledSubmitBtn() ? 'disabledButton' : '' "
+            class="button-login" ion-button (click)="submit()">{{ts.trPK('login','changepassword')}}</button>
     </div>
 </ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/authentication/change-password/change-password.component.scss b/Mohem/src/app/authentication/change-password/change-password.component.scss
index 727737ed..a05e7a94 100644
--- a/Mohem/src/app/authentication/change-password/change-password.component.scss
+++ b/Mohem/src/app/authentication/change-password/change-password.component.scss
@@ -33,3 +33,7 @@
     opacity:.5;
 
 }
+.info{
+    color: #000;
+    font-weight: bold;
+}
diff --git a/Mohem/src/app/authentication/change-password/change-password.component.ts b/Mohem/src/app/authentication/change-password/change-password.component.ts
index 6ad7b9be..4b2a9f6a 100644
--- a/Mohem/src/app/authentication/change-password/change-password.component.ts
+++ b/Mohem/src/app/authentication/change-password/change-password.component.ts
@@ -9,7 +9,7 @@ import { SmsReaderService } from 'src/app/hmg-common/services/sms/sms-reader.ser
 import { ForgetPassword } from '../models/forget.password';
 import { LoginModel } from '../models/LoginModel';
 import { SharedDataService } from 'src/app/hmg-common/services/shared-data-service/shared-data.service';
-import {LoginComponent} from "src/app/authentication/login/login.component";
+import { LoginComponent } from "src/app/authentication/login/login.component";
 import { Password } from '../models/password';
 import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/models/authenticated-user";
 //import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -22,17 +22,89 @@ import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/mo
 export class ChangePasswordComponent implements OnInit {
   private loginData = new LoginModel();
   public P_NEW_PASSWORD: string = "";
-  public P_Confirm_NEW_PASSWORD : string = "";
-  public P_OLD_PASSWORD : string = "";
-  public P_USER_NAME : string;
+  public P_Confirm_NEW_PASSWORD: string = "";
+  public P_OLD_PASSWORD: string = "";
+  public P_USER_NAME: string;
   public logo = "assets/icon/login/lock.png";
+  public testy = 'a123';
 
   userData: any = {};
   public isExpiredPwd: boolean = false;
   public NEW_PASSWORD: boolean = false;
   public Confirm_NEW_PASSWORD: boolean = false;
   public OLD_PASSWORD: boolean = false;
-  //public profile_form: FormGroup;
+  public currentPasswordIcon = 'password';
+  public newPasswordIcon = 'password';
+  public confirmPasswordIcon = 'password';
+
+  public recentPasswordNote = {
+    yellowImg: '../assets/imgs/mohemm-action/info.png',
+    text: this.ts.trPK('login', 'current-password-validation')
+  };
+  public isLowerCase = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'lowercase-password-validation'),
+    isMatch: false
+  };
+  public isUpperCase = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'uppercase-password-validation'),
+    isMatch: false
+  };
+  public isLetterCase = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'letter-password-validation'),
+    isMatch: false
+  };
+  public isHasDigit = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'numerica-password-validation'),
+    isMatch: false
+  };
+  public isMinLength = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'min-password-validation'),
+    isMatch: false
+  };
+  public isRepeatedLetter = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'repeating-password-validation'),
+    isMatch: false
+  };
+  // public isContainSpecialChar = {
+  //   blankImg: '../assets/icon/blank.svg',
+  //   greenImg: '../assets/icon/green.svg',
+  //   redImg: '../assets/imgs/close.svg',
+  //   text: this.ts.trPK('login', 'special-character-password-validation'),
+  //   isMatch: false
+  // };
+  public confirmMatchNew = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'not-match-password-validation'),
+    isMatch: false
+  };
+  public userNameMatchNew = {
+    blankImg: '../assets/icon/blank.svg',
+    greenImg: '../assets/icon/green.svg',
+    redImg: '../assets/imgs/close.svg',
+    text: this.ts.trPK('login', 'contain-username-password-validation'),
+    isMatch: false
+  };
+  public userId: string;
 
   constructor(
     public cs: CommonService,
@@ -43,24 +115,24 @@ export class ChangePasswordComponent implements OnInit {
     public smsService: SmsReaderService,
     public changeDetector: ChangeDetectorRef,
     public sharedData: SharedDataService,
-   // public formBuilder: FormBuilder,
-    ) { 
-      console.log("change password constructor");
-    }
+    // public formBuilder: FormBuilder,
+  ) {
+    console.log("change password constructor");
+  }
 
   ngOnInit() {
     console.log("change password oninit");
     this.isExpiredPwd =
-        this.sharedData.getSharedData(Password.IS_EXPIRED_PSW) || false;
+      this.sharedData.getSharedData(Password.IS_EXPIRED_PSW) || false;
     const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
-    this.P_USER_NAME =data.P_USER_NAME;
+    this.P_USER_NAME = data.P_USER_NAME;
     console.log(this.isExpiredPwd);
     console.log(this.P_USER_NAME);
 
 
-  //   this.profile_form = this.formBuilder.group({
-  //     password: ['', Validators.compose([Validators.minLength(8)])]
-  //  });
+    //   this.profile_form = this.formBuilder.group({
+    //     password: ['', Validators.compose([Validators.minLength(8)])]
+    //  });
     // this.authService
     //   .loadAuthenticatedUser()
     //   .subscribe((user: AuthenticatedUser) => {
@@ -78,97 +150,228 @@ export class ChangePasswordComponent implements OnInit {
   private checkUserResult: CheckUserAuthenticationResponse;
 
 
-  submit(){
+  submit() {
     console.log(this.isExpiredPwd);
-    if(this.isExpiredPwd){
+    if (this.isExpiredPwd) {
       this.expiredPassword();
-    }else{
+    } else {
       this.changePassword();
     }
   }
 
-  public expiredPassword(){
+  public expiredPassword() {
     const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
     //this.loginData.P_USER_NAME = this.P_USER_NAME;
-    let request:Password = new Password();
-    request.P_OLD_PASSWORD=this.P_OLD_PASSWORD;
-    request.P_Confirm_NEW_PASSWORD=this.P_NEW_PASSWORD;
-    request.P_NEW_PASSWORD=this.P_Confirm_NEW_PASSWORD;
+    let request: Password = new Password();
+    request.P_OLD_PASSWORD = this.P_OLD_PASSWORD;
+    request.P_Confirm_NEW_PASSWORD = this.P_NEW_PASSWORD;
+    request.P_NEW_PASSWORD = this.P_Confirm_NEW_PASSWORD;
     request.P_USER_NAME = this.P_USER_NAME;
 
     this.authService.submitExpiredPassword(
-        request,
-        () => {
-            //this.sendSMSForForgotPassword();
-        }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
-            if (this.cs.validResponse(result)) {
-                this.checkUserResult = result;
-                console.log(result);
-                this.cs.toastPK("changePassword","successChange");
-                this.sharedData.setSharedData(false,Password.IS_EXPIRED_PSW);
-                this.cs.openLogin();
-            }
-        });
+      request,
+      () => {
+        //this.sendSMSForForgotPassword();
+      }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
+        if (this.cs.validResponse(result)) {
+          this.checkUserResult = result;
+          console.log(result);
+          this.cs.greenToastPK("changePassword", "successChange");
+          this.sharedData.setSharedData(false, Password.IS_EXPIRED_PSW);
+          // this.cs.sharedService.getSharedData( AuthenticationService.IMEI_USER_DATA);
+          localStorage.setItem('password', this.P_NEW_PASSWORD);
+          this.cs.openLogin();
+        }
+      });
   }
-  public changePassword(){
+  public changePassword() {
     const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
     //this.loginData.P_USER_NAME = this.P_USER_NAME;
-    let request:Password = new Password();
-    request.P_OLD_PASSWORD=this.P_OLD_PASSWORD;
-    request.P_Confirm_NEW_PASSWORD=this.P_NEW_PASSWORD;
-    request.P_NEW_PASSWORD=this.P_Confirm_NEW_PASSWORD;
+    let request: Password = new Password();
+    request.P_OLD_PASSWORD = this.P_OLD_PASSWORD;
+    request.P_Confirm_NEW_PASSWORD = this.P_NEW_PASSWORD;
+    request.P_NEW_PASSWORD = this.P_Confirm_NEW_PASSWORD;
     request.P_USER_NAME = this.P_USER_NAME;
 
     this.authService.submitChangePassword(
-        request,
-        () => {
-            //this.sendSMSForForgotPassword();
-        }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
-            if (this.cs.validResponse(result)) {
-                this.checkUserResult = result;
-                console.log(result);
-                this.cs.toastPK("changePassword","successChange");
-                this.cs.openHome();
-            }
-        });
+      request,
+      () => {
+        //this.sendSMSForForgotPassword();
+      }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
+        if (this.cs.validResponse(result)) {
+          this.checkUserResult = result;
+          localStorage.setItem('password', this.P_NEW_PASSWORD);
+          console.log(result);
+          this.cs.greenToastPK("changePassword", "successChange");
+          localStorage.setItem('password', this.P_NEW_PASSWORD);
+          this.cs.openHome();
+        }
+      });
   }
-  onChangeCNP(){
-// in UAT Alow to the length of password less than 8 
-// so if we ready to go life change it to >= 8
+  onChangeCNP() {
+    // in UAT Alow to the length of password less than 8 
+    // so if we ready to go life change it to >= 8
     if (this.P_Confirm_NEW_PASSWORD.length >= 3) {
-     this.Confirm_NEW_PASSWORD=true;
+      this.Confirm_NEW_PASSWORD = true;
+
+
+    } else {
+      this.Confirm_NEW_PASSWORD = false;
+
+    }
 
-      
-  }else{
-    this.Confirm_NEW_PASSWORD=false;
-  
   }
-  
-}
 
-onChangeNP(){
-// in UAT Alow to the length of password less than 8 
-// so if we ready to go life change it to >= 8
-  if (this.P_NEW_PASSWORD.length >= 3) {
-   this.NEW_PASSWORD=true;
-    
-}else{
-  this.NEW_PASSWORD=false;
+  onChangeNP() {
+    // in UAT Alow to the length of password less than 8 
+    // so if we ready to go life change it to >= 8
+    if (this.P_NEW_PASSWORD.length >= 3) {
+      this.NEW_PASSWORD = true;
 
-}
+    } else {
+      this.NEW_PASSWORD = false;
 
-}
-onChangeOP(){
-// in UAT Alow to the length of password less than 8 
-// so if we ready to go life change it to >= 8
-  if (this.P_OLD_PASSWORD.length >= 3) {
-   this.OLD_PASSWORD=true;
-    
-}else{
-  this.OLD_PASSWORD=false;
+    }
 
-}
+  }
+  onChangeOP() {
+    // in UAT Alow to the length of password less than 8 
+    // so if we ready to go life change it to >= 8
+    if (this.P_OLD_PASSWORD.length >= 3) {
+      this.OLD_PASSWORD = true;
 
-}
+    } else {
+      this.OLD_PASSWORD = false;
+
+    }
+
+  }
+
+  checkerFuncation(val) {
+    if (this.P_NEW_PASSWORD === '') {
+      switch (val) {
+        case 1:
+          return this.isLetterCase.blankImg;
+        case 3:
+          return this.isHasDigit.blankImg;
+        case 4:
+          return this.isMinLength.blankImg;
+        case 5:
+          return this.isRepeatedLetter.blankImg;
+        // case 6:
+        //   return this.isContainSpecialChar.blankImg;
+        case 7:
+          return this.confirmMatchNew.blankImg;
+        case 8:
+          return this.userNameMatchNew.blankImg;
+      }
+    } else {
+      switch (val) {
+        // case 1:
+        //     if (/[a-z]/.test(this.P_NEW_PASSWORD)) {
+        //         this.isLowerCase.isMatch = true;
+        //         return this.isLowerCase.greenImg;
+        //     } else {
+        //         this.isLowerCase.isMatch = false;
+        //         return this.isLowerCase.redImg;
+        //     }
+        // case 2:
+        //     if (/[A-Z]/.test(this.P_NEW_PASSWORD)) {
+        //         this.isUpperCase.isMatch = true;
+        //         return this.isUpperCase.greenImg;
+        //     } else {
+        //         this.isUpperCase.isMatch = false;
+        //         return this.isUpperCase.redImg;
+        //     }
+        case 1:
+          if (/[a-zA-Z]/.test(this.P_NEW_PASSWORD)) {
+            this.isLetterCase.isMatch = true;
+            return this.isLetterCase.greenImg;
+          } else {
+            this.isLetterCase.isMatch = false;
+            return this.isLetterCase.redImg;
+          }
+        case 3:
+          if (/[0-9]/.test(this.P_NEW_PASSWORD)) {
+            this.isHasDigit.isMatch = true;
+            return this.isHasDigit.greenImg;
+          } else {
+            this.isHasDigit.isMatch = false;
+            return this.isHasDigit.redImg;
+          }
+        case 4:
+          if (this.P_NEW_PASSWORD.length >= 8) {
+            this.isMinLength.isMatch = true;
+            return this.isMinLength.greenImg;
+          } else {
+            this.isMinLength.isMatch = false;
+            return this.isMinLength.redImg;
+          }
+        case 5:
+          if (/([a-z])\1/i.test(this.P_NEW_PASSWORD)) {
+            this.isRepeatedLetter.isMatch = false;
+            return this.isRepeatedLetter.redImg;
+          } else {
+            this.isRepeatedLetter.isMatch = true;
+            return this.isRepeatedLetter.greenImg;
+          }
+        // case 6:
+        //   if (/[ `!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/.test(this.P_NEW_PASSWORD)) {
+        //     this.isContainSpecialChar.isMatch = true;
+        //     return this.isContainSpecialChar.greenImg;
+        //   } else {
+        //     this.isContainSpecialChar.isMatch = false;
+        //     return this.isContainSpecialChar.redImg;
+        //   }
+        case 7:
+          if (this.P_NEW_PASSWORD !== this.P_Confirm_NEW_PASSWORD) {
+            this.confirmMatchNew.isMatch = false;
+            return this.confirmMatchNew.redImg;
+          } else {
+            this.confirmMatchNew.isMatch = true;
+            return this.confirmMatchNew.greenImg;
+          }
+        case 8:
+          if (!this.P_NEW_PASSWORD.includes(this.P_USER_NAME)) {
+            this.userNameMatchNew.isMatch = true;
+            return this.userNameMatchNew.greenImg;
+          } else {
+            this.userNameMatchNew.isMatch = false;
+            return this.userNameMatchNew.redImg;
+          }
+      }
+    }
+  }
+
+
+  disabledSubmitBtn() {
+    if (this.isLetterCase.isMatch && this.isHasDigit.isMatch && this.isMinLength.isMatch
+      && this.isRepeatedLetter.isMatch && this.P_NEW_PASSWORD !== '' && this.NEW_PASSWORD
+      && this.Confirm_NEW_PASSWORD && this.OLD_PASSWORD && this.confirmMatchNew.isMatch) {
+      return false;
+    } else { return true; }
+  }
+
+  showPassword(val) {
+    if (val === 1)
+      this.newPasswordIcon = 'password';
+    else if (val === 2) {
+      this.confirmPasswordIcon = 'password'
+    }
+    else {
+      this.currentPasswordIcon = 'password';
+    }
+  }
+
+  hidePassword(val) {
+    if (val === 1)
+      this.newPasswordIcon = 'text';
+    else if (val === 2) {
+      this.confirmPasswordIcon = 'text'
+    }
+    else {
+      this.currentPasswordIcon = 'text';
+    }
+  }
 
 }
diff --git a/Mohem/src/app/authentication/check-user/check-user.component.html b/Mohem/src/app/authentication/check-user/check-user.component.html
index 35bde363..e99fae9a 100644
--- a/Mohem/src/app/authentication/check-user/check-user.component.html
+++ b/Mohem/src/app/authentication/check-user/check-user.component.html
@@ -32,6 +32,6 @@
 </ion-content>
 <ion-footer>
   <div class="centerDiv">
-      <ion-button  [ngClass]="{'disable-button-opacity': isValidForm()}" class="button-login"  ion-button (click)=" userCheck()" [disabled]="isValidForm()">{{ts.trPK('login','changepassword')}}</ion-button>
+      <ion-button  [ngClass]="{'disable-button-opacity': isValidForm()}" class="button-login"  ion-button (click)=" sendSMSForForgotPassword()" [disabled]="isValidForm()">{{ts.trPK('login','changepassword')}}</ion-button>
   </div>
 </ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/authentication/check-user/check-user.component.ts b/Mohem/src/app/authentication/check-user/check-user.component.ts
index fcaed803..2b74c986 100644
--- a/Mohem/src/app/authentication/check-user/check-user.component.ts
+++ b/Mohem/src/app/authentication/check-user/check-user.component.ts
@@ -46,32 +46,27 @@ export class CheckUserComponent implements OnInit {
     return true;
 }
 
-  public userCheck()
-  {
+  public userCheck() {
     this.cs.startLoading();
     const request = new CheckUserAuthenticationRequest();
     request.P_USER_NAME = this.P_USER_NAME; 
-    this.authService.checkUserAuthentication(
-      request,
-      () => {
-            /* Write code for error */
-            }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
-                if (this.cs.validResponse(result)) {
-                    this.checkUserResult = result;
-                    this.cs.stopLoading();
-                    this.sendSMSForForgotPassword();
-                }
-            });
+    this.authService.checkUserAuthentication(request, () => {}, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
+        if (this.cs.validResponse(result)) {
+            this.checkUserResult = result;
+            this.cs.stopLoading();
+            this.sendSMSForForgotPassword();
+        }
+    });
   }
 
   private checkUserResult: CheckUserAuthenticationResponse;
 
-    private sendSMSForForgotPassword() {
+    public sendSMSForForgotPassword() {
       this.cs.startLoading();
       let changePwdObj= new LoginRequest();
-      changePwdObj.MobileNumber= this.checkUserResult.BasicMemberInformation.P_MOBILE_NUMBER;
+      // changePwdObj.MobileNumber= this.checkUserResult.BasicMemberInformation.P_MOBILE_NUMBER;
       changePwdObj.P_USER_NAME=this.P_USER_NAME;
-      changePwdObj.P_MOBILE_NUMBER=this.checkUserResult.BasicMemberInformation.P_MOBILE_NUMBER;
+      // changePwdObj.P_MOBILE_NUMBER=this.checkUserResult.BasicMemberInformation.P_MOBILE_NUMBER;
       
       this.authService.sendPublicSMS(
         changePwdObj,
diff --git a/Mohem/src/app/authentication/confirm-login/confirm-login.component.ts b/Mohem/src/app/authentication/confirm-login/confirm-login.component.ts
index 2e345b5c..fe0ba645 100644
--- a/Mohem/src/app/authentication/confirm-login/confirm-login.component.ts
+++ b/Mohem/src/app/authentication/confirm-login/confirm-login.component.ts
@@ -12,7 +12,7 @@ import { GetLoginInfoResponse } from '../../hmg-common/services/authentication/m
 import { SMSCheckRequest } from 'src/app/hmg-common/services/authentication/models/smscheck.request';
 import { SMSCheckResponse } from 'src/app/hmg-common/services/authentication/models/smscheck.response';
 import { PushService } from 'src/app/hmg-common/services/push/push.service';
-import { ModalController, Platform } from '@ionic/angular';
+import { ModalController, Platform, AlertController } from '@ionic/angular';
 import { CheckUserAuthenticationResponse } from 'src/app/hmg-common/services/authentication/models/check-user-auth.response';
 import { LoginModel } from '../models/LoginModel';
 import * as moment from 'moment';
@@ -20,6 +20,9 @@ import { CheckAppVersionResponse } from 'src/app/hmg-common/services/authenticat
 import { NFC } from "@ionic-native/nfc/ngx";
 import { DigitalIdComponent } from '../digital-id/digital-id.component';
 import { AppUpdateComponent } from '../app-update/app-update.component';
+import { Password } from '../models/password';
+import { CheckUserAuthenticationRequest } from 'src/app/hmg-common/services/authentication/models/check-user-auth.request';
+import { SmsRetriever } from '@ionic-native/sms-retriever/ngx';
 
 @Component({
   selector: 'app-confirm-login',
@@ -53,7 +56,9 @@ export class ConfirmLoginComponent implements OnInit {
   public isNFCAvailable = false;
   direction: string;
   userInfo: any;
-
+  public businessInfo: object;
+  private checkUserResult: CheckUserAuthenticationResponse;
+  private signature: string;
   constructor(
     public ts: TranslatorService,
     public cs: CommonService,
@@ -63,7 +68,9 @@ export class ConfirmLoginComponent implements OnInit {
     public pushService: PushService,
     public platform: Platform,
     public modalController: ModalController,
-    private nfc: NFC
+    public alertController: AlertController,
+    private nfc: NFC,
+    private smsRetriever: SmsRetriever
   ) {
     this.loginData = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
     this.deviceToken = this.cs.sharedService.getSharedData(AuthenticationService.DEVICE_TOKEN, false);
@@ -83,6 +90,7 @@ export class ConfirmLoginComponent implements OnInit {
     this.direction = TranslatorService.getCurrentLanguageName();
     this.userInfo = JSON.parse(localStorage.getItem('digitalIDUser'));
     this.checkNFCStatus();
+    this.generateSMSsignature();
     // **checkIfAvailable FAIO **//
     this.checkIfAvailable();
     // **getSharedData of IMEI_USER_DATA and REGISTER_DATA_FOR_LOGIIN to set defult value **//
@@ -224,13 +232,18 @@ export class ConfirmLoginComponent implements OnInit {
   }
 
 
-
+  public generateSMSsignature() {
+    this.smsRetriever.getAppHash()
+      .then((res: any) => this.signature = res)
+      .catch((error: any) => console.error(error));
+  }
   public sendActivationCode(type: number) {
+    console.log(this.signature);
     const request = new SendActivationByType();
     this.authService.setPublicFields(request);
     request.OTP_SendType = type;
     request.MobileNumber = this.loginData.MobileNumber;
-
+    request.smsSignature = this.signature;
     request.IsMobileFingerPrint = 0;
 
     request.P_USER_NAME = this.loginData.P_USER_NAME;
@@ -294,7 +307,7 @@ export class ConfirmLoginComponent implements OnInit {
   private presentBiometricDialog() {
     this.faio.show({
       title: 'Biometric Authetnciation', // (Android Only) | optional | Default: "<APP_NAME> Biometric Sign On"
-      subtitle: 'Coolest Plugin ever', // (Android Only) | optional | Default: null
+      subtitle: 'Mohemm', // (Android Only) | optional | Default: null
       description: this.ts.trPK('general', 'auth-please'), // optional | Default: null
       fallbackButtonTitle: this.ts.trPK('general', 'use-pin'), // optional | When disableBackup is false defaults to "Use Pin".
       disableBackup: true,  // optional | default: false
@@ -367,10 +380,24 @@ export class ConfirmLoginComponent implements OnInit {
     this.authService.checkSMS(request, () => { }, this.ts.trPK('general', 'ok'))
       .subscribe((result: SMSCheckResponse) => {
         if (this.cs.validResponse(result)) {
+          this.businessInfo = {
+            show_business: result.BusinessCardPrivilege,
+            name_en: result.MemberInformationList[0].EMPLOYEE_NAME_En,
+            job_en: result.MemberInformationList[0].JOB_NAME_En,
+            name_ar: result.MemberInformationList[0].EMPLOYEE_NAME_Ar,
+            job_ar: result.MemberInformationList[0].JOB_NAME_Ar,
+            mobile: result.MemberInformationList[0].MobileNumberWithZipCode,
+            qr: result.MemberInformationList[0].BusinessCardQR,
+            company_logo: result.BC_Logo ? result.BC_Logo : result.CompanyImageURL,
+            company_url: result.BC_Domain,
+            company_type: result.CompanyMainCompany,
+            email: result.MemberInformationList[0].EMPLOYEE_EMAIL_ADDRESS
+          }
 
           // Wifi Credientials
           CommonService.MOHEMM_WIFI_SSID = result.Mohemm_Wifi_SSID;
           CommonService.MOHEMM_WIFI_PASSWORD = result.Mohemm_Wifi_Password;
+          localStorage.setItem('bussiness-card-info', JSON.stringify(this.businessInfo));
 
           AuthenticationService.servicePrivilage = result.Privilege_List;
           this.authService.setAuthenticatedUser(result).subscribe(() => {
@@ -412,7 +439,7 @@ export class ConfirmLoginComponent implements OnInit {
     const request = new LoginRequest();
     request.P_USER_NAME = this.username;
     request.P_LANGUAGE = 'US'; // this.language;
-    request.P_PASSWORD = this.password;
+    request.P_PASSWORD = localStorage.getItem('password');
     this.authService
       .login(request, () => {
         console.log('error here');
@@ -431,13 +458,78 @@ export class ConfirmLoginComponent implements OnInit {
           this.confirm(this.loginType);
         } else {
           if (result.IsPasswordExpired) {
-            // alert("dont forget to handelpresentPasswordExpiredDialog() ");
-            // this.presentPasswordExpiredDialog(); *****
+            this.presentPasswordExpiredDialog();
           }
         }
       });
   }
 
+  async presentPasswordExpiredDialog() {
+    const alert = await this.alertController.create({
+      header: this.ts.trPK('general', 'confirm'),
+      message: this.ts.trPK('login', 'password-expired'),
+      buttons: [
+        {
+          text: this.ts.trPK('general', 'ok'),
+          handler: () => {
+            console.log('Confirm Okay');
+            this.sharedData.setSharedData(true, Password.IS_EXPIRED_PSW);
+            this.userCheck();
+          }
+        }
+      ]
+    });
+    await alert.present();
+  }
+
+  public userCheck() {
+    this.cs.startLoading();
+    const request = new CheckUserAuthenticationRequest();
+    request.P_USER_NAME = this.username;
+    this.authService.checkUserAuthentication(
+      request,
+      () => {
+        /* Write code for error */
+      }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
+        if (this.cs.validResponse(result)) {
+          this.checkUserResult = result;
+          this.cs.stopLoading();
+          this.sendSMSForForgotPassword();
+        }
+      });
+  }
+
+
+  private sendSMSForForgotPassword() {
+    this.cs.startLoading();
+    const changePwdObj = new LoginRequest();
+    changePwdObj.MobileNumber = this.checkUserResult.BasicMemberInformation.P_MOBILE_NUMBER;
+    changePwdObj.P_USER_NAME = this.username;
+    changePwdObj.P_MOBILE_NUMBER = this.checkUserResult.BasicMemberInformation.P_MOBILE_NUMBER;
+    this.authService.sendPublicSMS(
+      changePwdObj,
+      () => {
+        // this.sendSMSForForgotPassword();
+        /* Write code for error */
+      }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
+        if (this.cs.validResponse(result)) {
+          this.checkUserResult = result;
+
+          console.log(result);
+
+          this.loginData = new LoginModel();
+          this.loginData.LogInTokenID = result.LogInTokenID;
+          this.loginData.P_USER_NAME = this.username;
+
+          this.cs.sharedService.setSharedData(this.loginData.P_USER_NAME, LoginRequest.SHARED_DATA);
+          this.sharedData.setSharedData(this.loginData, AuthenticationService.LOGIN_DATA);
+          this.sharedData.setSharedData(true, Password.IS_FORGET_PSW);
+          this.cs.stopLoading();
+          this.cs.openSMSPage();
+        }
+      });
+  }
+
   private handleAppUpdate(result) {
     this.iosLink = result.IOSLink;
     this.androidLink = result.AndroidLink;
@@ -463,14 +555,14 @@ export class ConfirmLoginComponent implements OnInit {
     });
   }
 
-  async appUpdate(msg, result) { 
+  async appUpdate(msg, result) {
     const modal = await this.modalController.create({
       component: AppUpdateComponent,
       cssClass: 'app-update-modal-css',
-      componentProps: {'msg':msg}
+      componentProps: { 'msg': msg }
     });
     modal.onDidDismiss().then((data) => {
-        this.handleAppUpdate(result);
+      this.handleAppUpdate(result);
     });
     return await modal.present();
   }
@@ -502,9 +594,9 @@ export class ConfirmLoginComponent implements OnInit {
     let buttonSelected;
     this.buttons.forEach(element => {
       element.forEach(elementValue => {
-        if(typeNumber === elementValue.value){
+        if (typeNumber === elementValue.value) {
           buttonSelected = elementValue;
-        }else{
+        } else {
           elementValue.visible = false;
         }
       });
diff --git a/Mohem/src/app/authentication/forgot/forgot.component.html b/Mohem/src/app/authentication/forgot/forgot.component.html
index f363261d..fc00d176 100644
--- a/Mohem/src/app/authentication/forgot/forgot.component.html
+++ b/Mohem/src/app/authentication/forgot/forgot.component.html
@@ -24,18 +24,65 @@
 
                 <ion-item  class="item-input-login">
                     <img class="item-icon" src="assets/imgs/password.png" item-start />
-                    <ion-label>{{'changePassword,newPassword' | translate}}</ion-label>
-                    <ion-input class="login-input" required type="password" 
+                    <!-- <ion-label>{{'changePassword,newPassword' | translate}}</ion-label> -->
+                    <ion-input class="login-input" required [type]="newPasswordIcon"
+                        placeholder="{{ts.trPK('changePassword','newPassword')}}"
                         [(ngModel)]="P_NEW_PASSWORD">
                     </ion-input>
+                    <ion-icon *ngIf='newPasswordIcon === "text"' name="ios-eye" (click)="showPassword(1)"></ion-icon>
+                    <ion-icon *ngIf='newPasswordIcon === "password"' name="ios-eye-off" (click)="hidePassword(1)"></ion-icon>
                 </ion-item>
                     
                 <ion-item  class="item-input-login">
                     <img class="item-icon" src="assets/imgs/password.png" item-start />
-                    <ion-label>{{'changePassword,confirmPassword' | translate}}</ion-label>
-                    <ion-input class="login-input" required type="password" 
+                    <!-- <ion-label>{{'changePassword,confirmPassword' | translate}}</ion-label> -->
+                    <ion-input class="login-input" required [type]="confirmPasswordIcon" 
+                        placeholder="{{ts.trPK('changePassword','confirmPassword')}}"
                         [(ngModel)]="P_Confirm_NEW_PASSWORD">
                     </ion-input>
+                    <ion-icon *ngIf='confirmPasswordIcon === "text"' name="ios-eye" (click)="showPassword(2)"></ion-icon>
+                    <ion-icon *ngIf='confirmPasswordIcon === "password"' name="ios-eye-off" (click)="hidePassword(2)"></ion-icon>
+                </ion-item>
+
+                <ion-item lines='none'>
+                    <img class="item-icon" src="../assets/imgs/req info.svg" item-start />
+                    <ion-label><p class="info">{{recentPasswordNote.text}}</p></ion-label>
+                </ion-item>
+                <!-- <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(1)" item-start />
+                    <ion-label><p>{{isLowerCase.text}}</p></ion-label>
+                </ion-item>
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(2)" item-start />
+                    <ion-label><p>{{isUpperCase.text}}</p></ion-label>
+                </ion-item> -->
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(1)" item-start />
+                    <ion-label><p>{{isLetterCase.text}}</p></ion-label>
+                </ion-item>
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(3)" item-start />
+                    <ion-label><p style="white-space: pre-wrap;">{{isHasDigit.text}}</p></ion-label>
+                </ion-item>
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(4)" item-start />
+                    <ion-label><p style="white-space: pre-wrap;">{{isMinLength.text}}</p></ion-label>
+                </ion-item>
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(5)" item-start />
+                    <ion-label><p style="white-space: pre-wrap;">{{isRepeatedLetter.text}}</p></ion-label>
+                </ion-item>
+                <!-- <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(6)" item-start />
+                    <ion-label><p style="white-space: pre-wrap;">{{isContainSpecialChar.text}}</p></ion-label>
+                </ion-item> -->
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(7)" item-start />
+                    <ion-label><p style="white-space: pre-wrap;">{{confirmMatchNew.text}}</p></ion-label>
+                </ion-item>
+                <ion-item lines='none'>
+                    <img class="item-icon" [src]="checkerFuncation(8)" item-start />
+                    <ion-label><p style="white-space: pre-wrap;">{{userNameMatchNew.text}}</p></ion-label>
                 </ion-item>
         </ion-grid>
         <page-trailer [small]="true"></page-trailer>
@@ -45,6 +92,8 @@
 </ion-content>
 <ion-footer>
     <div class="centerDiv">
-        <ion-button  class="button-login"  ion-button  (click)=" forgotpassword()">{{ts.trPK('login','changepassword')}}</ion-button>
+        <button [disabled]="disabledSubmitBtn()"
+        [ngClass]="disabledSubmitBtn() ? 'disabledButton' : 'enable' "
+            class="button-login" ion-button (click)="forgotpassword()">{{ts.trPK('login','changepassword')}}</button>
     </div>
 </ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/authentication/forgot/forgot.component.scss b/Mohem/src/app/authentication/forgot/forgot.component.scss
index 139597f9..55589cb9 100644
--- a/Mohem/src/app/authentication/forgot/forgot.component.scss
+++ b/Mohem/src/app/authentication/forgot/forgot.component.scss
@@ -1,2 +1,8 @@
+.disabledButton{
+    opacity:.5;
 
-
+}
+.info{
+    color: #000;
+    font-weight: bold;
+}
diff --git a/Mohem/src/app/authentication/forgot/forgot.component.ts b/Mohem/src/app/authentication/forgot/forgot.component.ts
index 8e76d97a..51cc3e09 100644
--- a/Mohem/src/app/authentication/forgot/forgot.component.ts
+++ b/Mohem/src/app/authentication/forgot/forgot.component.ts
@@ -9,7 +9,6 @@ import { SmsReaderService } from 'src/app/hmg-common/services/sms/sms-reader.ser
 import { ForgetPassword } from '../models/forget.password';
 import { LoginModel } from '../models/LoginModel';
 import { SharedDataService } from 'src/app/hmg-common/services/shared-data-service/shared-data.service';
-import {LoginComponent} from "src/app/authentication/login/login.component";
 @Component({
     selector: 'app-forgot',
     templateUrl: './forgot.component.html',
@@ -18,10 +17,81 @@ import {LoginComponent} from "src/app/authentication/login/login.component";
 export class ForgotComponent implements OnInit {
 
     private loginData = new LoginModel();
-    public P_NEW_PASSWORD: string;
-    public P_Confirm_NEW_PASSWORD : string;
-    public P_USER_NAME : string;
-    public logo = "assets/icon/login/lock.png";
+    public P_NEW_PASSWORD = '';
+    // tslint:disable-next-line: variable-name
+    public P_Confirm_NEW_PASSWORD = '';
+    public P_USER_NAME: string;
+    public logo = 'assets/icon/login/lock.png';
+    public newPasswordIcon = "password";
+    public confirmPasswordIcon = "password";
+    public recentPasswordNote = {
+        yellowImg: '../assets/imgs/mohemm-action/info.png',
+        text: this.ts.trPK('login', 'current-password-validation')
+    };
+    public isLowerCase = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'lowercase-password-validation'),
+        isMatch: false
+    };
+    public isUpperCase = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'uppercase-password-validation'),
+        isMatch: false
+    };
+    public isLetterCase = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'letter-password-validation'),
+        isMatch: false
+    };
+    public isHasDigit = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'numerica-password-validation'),
+        isMatch: false
+    };
+    public isMinLength = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'min-password-validation'),
+        isMatch: false
+    };
+    public isRepeatedLetter = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'repeating-password-validation'),
+        isMatch: false
+    };
+    // public isContainSpecialChar = {
+    //     blankImg: '../assets/icon/blank.svg',
+    //     greenImg: '../assets/icon/green.svg',
+    //     redImg: '../assets/imgs/close.svg',
+    //     text: this.ts.trPK('login', 'special-character-password-validation'),
+    //     isMatch: false
+    // };
+    public confirmMatchNew = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'not-match-password-validation'),
+        isMatch: false
+    };
+    public userNameMatchNew = {
+        blankImg: '../assets/icon/blank.svg',
+        greenImg: '../assets/icon/green.svg',
+        redImg: '../assets/imgs/close.svg',
+        text: this.ts.trPK('login', 'contain-username-password-validation'),
+        isMatch: false
+    };
+    public userId: string;
 
     constructor(
         public cs: CommonService,
@@ -35,16 +105,22 @@ export class ForgotComponent implements OnInit {
     ) {
     }
 
-    ngOnInit() {}
+    ngOnInit() {
+        console.log('ENAD >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>');
+        this.userId = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false).P_USER_NAME;
+        console.log(this.userId);
+    }
 
     public onForgot() {
         this.sendSMSForForgotPassword();
     }
 
+    // tslint:disable-next-line: member-ordering
     private checkUserResult: CheckUserAuthenticationResponse;
 
     private sendSMSForForgotPassword() {
         const request = new ForgetPassword();
+        console.log(request);
         this.authService.sendForgetPassword(
             request,
             () => {
@@ -56,7 +132,7 @@ export class ForgotComponent implements OnInit {
             });
     }
 
-    public forgotpassword(){
+    public forgotpassword() {
         const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
         const forgetPasswordTokenResult = this.sharedData.getSharedData('checkSMSResponse', false);
         let forgetPasswordTokenID = '';
@@ -64,24 +140,149 @@ export class ForgotComponent implements OnInit {
             forgetPasswordTokenID = forgetPasswordTokenResult.ForgetPasswordTokenID;
         }
         this.loginData.P_USER_NAME = this.P_USER_NAME;
-        let request: any = {};
-        request.P_Confirm_NEW_PASSWORD=this.P_NEW_PASSWORD;
-        request.P_NEW_PASSWORD=this.P_Confirm_NEW_PASSWORD;
+        const request: any = {};
+        request.P_Confirm_NEW_PASSWORD = this.P_NEW_PASSWORD;
+        request.P_NEW_PASSWORD = this.P_Confirm_NEW_PASSWORD;
         request.P_USER_NAME = data.P_USER_NAME;
-        request.ForgetPasswordTokenID = forgetPasswordTokenID; 
-  
+        request.ForgetPasswordTokenID = forgetPasswordTokenID;
+
         this.authService.submitForgetPassword(
             request,
             () => {
-                //this.sendSMSForForgotPassword();
             }, this.ts.trPK('general', 'ok')).subscribe((result: CheckUserAuthenticationResponse) => {
                 if (this.cs.validResponse(result)) {
                     this.checkUserResult = result;
                     console.log(result);
-                    this.cs.toastPK("changePassword","successChange");
+                    this.cs.greenToastPK("changePassword", "successChange");
+                    localStorage.setItem('password', this.P_NEW_PASSWORD);
                     this.cs.openLogin();
                 }
             });
-        
+
+    }
+
+    checkerFuncation(val) {
+        if (this.P_NEW_PASSWORD === '') {
+            switch (val) {
+                // case 1:
+                //     return this.isLowerCase.blankImg;
+                // case 2:
+                //     return this.isUpperCase.blankImg;
+                case 1:
+                    return this.isLetterCase.blankImg;
+                case 3:
+                    return this.isHasDigit.blankImg;
+                case 4:
+                    return this.isMinLength.blankImg;
+                case 5:
+                    return this.isRepeatedLetter.blankImg;
+                // case 6:
+                //     return this.isContainSpecialChar.blankImg;
+                case 7:
+                    return this.confirmMatchNew.blankImg;
+                case 8:
+                    return this.userNameMatchNew.blankImg;
+            }
+        } else {
+            switch (val) {
+                // case 1:
+                //     if (/[a-z]/.test(this.P_NEW_PASSWORD)) {
+                //         this.isLowerCase.isMatch = true;
+                //         return this.isLowerCase.greenImg;
+                //     } else {
+                //         this.isLowerCase.isMatch = false;
+                //         return this.isLowerCase.redImg;
+                //     }
+                // case 2:
+                //     if (/[A-Z]/.test(this.P_NEW_PASSWORD)) {
+                //         this.isUpperCase.isMatch = true;
+                //         return this.isUpperCase.greenImg;
+                //     } else {
+                //         this.isUpperCase.isMatch = false;
+                //         return this.isUpperCase.redImg;
+                //     }
+                case 1:
+                    if (/[a-zA-Z]/.test(this.P_NEW_PASSWORD)) {
+                        this.isLetterCase.isMatch = true;
+                        return this.isLetterCase.greenImg;
+                    } else {
+                        this.isLetterCase.isMatch = false;
+                        return this.isLetterCase.redImg;
+                    }
+                case 3:
+                    if (/[0-9]/.test(this.P_NEW_PASSWORD)) {
+                        this.isHasDigit.isMatch = true;
+                        return this.isHasDigit.greenImg;
+                    } else {
+                        this.isHasDigit.isMatch = false;
+                        return this.isHasDigit.redImg;
+                    }
+                case 4:
+                    if (this.P_NEW_PASSWORD.length >= 8) {
+                        this.isMinLength.isMatch = true;
+                        return this.isMinLength.greenImg;
+                    } else {
+                        this.isMinLength.isMatch = false;
+                        return this.isMinLength.redImg;
+                    }
+                case 5:
+                    if (/([a-z])\1/i.test(this.P_NEW_PASSWORD)) {
+                        this.isRepeatedLetter.isMatch = false;
+                        return this.isRepeatedLetter.redImg;
+                    } else {
+                        this.isRepeatedLetter.isMatch = true;
+                        return this.isRepeatedLetter.greenImg;
+                    }
+                // case 6:
+                //     if (/[ `!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/.test(this.P_NEW_PASSWORD)) {
+                //         this.isContainSpecialChar.isMatch = true;
+                //         return this.isContainSpecialChar.greenImg;
+                //     } else {
+                //         this.isContainSpecialChar.isMatch = false;
+                //         return this.isContainSpecialChar.redImg;
+                //     }
+                case 7:
+                    if (this.P_NEW_PASSWORD !== this.P_Confirm_NEW_PASSWORD) {
+                        this.confirmMatchNew.isMatch = false;
+                        return this.confirmMatchNew.redImg;
+                    } else {
+                        this.confirmMatchNew.isMatch = true;
+                        return this.confirmMatchNew.greenImg;
+                    }
+                case 8:
+                    if (!this.P_NEW_PASSWORD.includes(this.userId)) {
+                        this.userNameMatchNew.isMatch = true;
+                        return this.userNameMatchNew.greenImg;
+                    } else {
+                        this.userNameMatchNew.isMatch = false;
+                        return this.userNameMatchNew.redImg;
+                    }
+            }
+        }
+    }
+
+    disabledSubmitBtn() {
+        if (this.isLetterCase.isMatch && this.isHasDigit.isMatch && this.isMinLength.isMatch
+            && this.isRepeatedLetter.isMatch && this.P_NEW_PASSWORD !== '' && this.P_NEW_PASSWORD
+            && this.P_Confirm_NEW_PASSWORD && this.confirmMatchNew.isMatch) {
+            return false;
+        } else { return true; }
     }
+
+    showPassword(val) {
+        if (val == 1)
+            this.newPasswordIcon = 'password';
+        else {
+            this.confirmPasswordIcon = 'password'
+        }
+    }
+
+    hidePassword(val) {
+        if (val == 1)
+            this.newPasswordIcon = 'text';
+        else {
+            this.confirmPasswordIcon = 'text'
+        }
+    }
+
 }
diff --git a/Mohem/src/app/authentication/models/sendActivationByType.ts b/Mohem/src/app/authentication/models/sendActivationByType.ts
index 76d2f29e..6d1447c5 100644
--- a/Mohem/src/app/authentication/models/sendActivationByType.ts
+++ b/Mohem/src/app/authentication/models/sendActivationByType.ts
@@ -2,30 +2,31 @@ import { Request } from 'src/app/hmg-common/services/models/request';
 
 export class SendActivationByType extends Request {
     P_USER_NAME: string; // id
-    UserName:string;
+    UserName: string;
     MobileNumber: string; // phone number
     ZipCode: string;
     LogInTokenID: string;
-    OTP_SendType:number;
-    IsMobileFingerPrint:number;
-    P_LEGISLATION_CODE:string;
+    OTP_SendType: number;
+    IsMobileFingerPrint: number;
+    P_LEGISLATION_CODE: string;
+    smsSignature: string;
     // VersionID:string;
-    
-
-
-//     Test
-//{
-//     "Channel":31,
-//     "LanguageID":2,
-//     "LogInTokenID":"Wfm9uDlWhEi3vFsQMqUz3w==",
-//     "MobileNumber":"0508079569",
-//     "P_USER_NAME":"191817",
-//     "UserName":"191817",
-//     "VersionID":2.0,
-//     "P_LEGISLATION_CODE":"SA",
-//     "IsMobileFingerPrint":0,
-//     "OTP_SendType":1
-// }
+
+
+
+    //     Test
+    //{
+    //     "Channel":31,
+    //     "LanguageID":2,
+    //     "LogInTokenID":"Wfm9uDlWhEi3vFsQMqUz3w==",
+    //     "MobileNumber":"0508079569",
+    //     "P_USER_NAME":"191817",
+    //     "UserName":"191817",
+    //     "VersionID":2.0,
+    //     "P_LEGISLATION_CODE":"SA",
+    //     "IsMobileFingerPrint":0,
+    //     "OTP_SendType":1
+    // }
 
 
 
diff --git a/Mohem/src/app/authentication/sms-page/sms-page.page.html b/Mohem/src/app/authentication/sms-page/sms-page.page.html
index 1fa9de7b..854ab267 100644
--- a/Mohem/src/app/authentication/sms-page/sms-page.page.html
+++ b/Mohem/src/app/authentication/sms-page/sms-page.page.html
@@ -1,70 +1,142 @@
+
+
+
+
 <app-generic-header
-  showBack="true"
-  [headerText]="'verificationcode,verificationcode' | translate">
+
+showBack="true"
+
+[headerText]="'verificationcode,verificationcode' | translate">
+
 </app-generic-header>
 
+
+
 <ion-content padding>
-  <ion-grid>
-    <!-- <ion-row>
-      <ion-col [size]="4">
-          <img [src]="logo" class="logo" />
-
-        <ion-img class="centerDiv" src="../assets/imgs/CS.png"></ion-img>
-      </ion-col>
-    </ion-row> -->
-      <br/>
-      <br/>
-    <ion-row>
-      <ion-col>
-          <p class="headerTxt"  > {{'verificationcode,verificationcode' | translate}}</p>
-        <br/>
-        <p class="leftDiv">{{'verificationcode,title' | translate}}
-            <span class="boldTxtNav">{{'verificationcode,verificationcode' | translate}}</span>
-             {{'verificationcode,by' | translate}}
-             <span *ngIf="loginType == 1 || activeType == 1" class="boldTxtNav">{{'verificationcode , sms' | translate}}, </span>
-             <span *ngIf="loginType == 4 || activeType == 4" class="boldTxtNav">{{'verificationcode , whatsapp' | translate}}, </span>
-
-             {{'verificationcode,instruct' | translate}}
-             <span class="boldTxtNav">{{'general,submit' | translate}}</span
-              ></p>
-        <!-- <p class="leftDiv">{{'verificationcode,title' | translate}}<span class="boldTxtNav">{{'verificationcode,verificationcode' | translate}}</span> {{'verificationcode,by' | translate}}<span class="boldTxtNav">{{'verificationcode,sms' | translate}}</span>{{'verificationcode,instruct' | translate}}<span class="boldTxtNav">{{'general,submit' | translate}}</span></p> -->
-      </ion-col>
-    </ion-row>
-  </ion-grid>
-  <br/><br/>
-  <!-- <p style="color: #c0c0c0; margin-left: 32%">{{'verificationcode.verificationcode' | translate}}</p> -->
-  <div>
-    <h1 text-center>{{displayTime}}</h1>
-    <br/><br/>
-    <!-- <ion-item>
-       //<ion-label>{{'verificationcode,verificationcode' | translate}}</ion-label>
-      // <img class="item-icon" src="assets/imgs/password.png" item-start /> 
-      <ion-input required type="tel" maxlength="4" (keyup)="checkOTPLength()"  placeholder="{{translate.trPK('verificationcode','verificationcode')}}"  [(ngModel)]="activationCode"></ion-input>
- </ion-item> -->
-
-  <ion-row class="sms_code" dir="ltr">
-    <ion-col [size]="12">
-       <ion-input type="tel" [(ngModel)]="smc_code[0]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
-    inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()" #ref autofocus="true">
-  </ion-input>
-  
-  <ion-input type="tel" [(ngModel)]="smc_code[1]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
-    inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
-  <ion-input type="tel" [(ngModel)]="smc_code[2]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
-    inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
-  <ion-input type="tel" [(ngModel)]="smc_code[3]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
-    inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
+
+<ion-grid>
+
+<!-- <ion-row>
+
+<ion-col [size]="4">
+
+<img [src]="logo" class="logo" />
+
+
+
+<ion-img class="centerDiv" src="../assets/imgs/CS.png"></ion-img>
+
+</ion-col>
+
+</ion-row> -->
+
+<br/>
+
+<br/>
+
+<ion-row>
+
+<ion-col>
+
+<p class="headerTxt" > {{'verificationcode,verificationcode' | translate}}</p>
+
+<br/>
+
+<p class="leftDiv">{{'verificationcode,title' | translate}}
+
+<span class="boldTxtNav">{{'verificationcode,verificationcode' | translate}}</span>
+
+{{'verificationcode,by' | translate}}
+
+<span *ngIf="loginType == 1 || activeType == 1" class="boldTxtNav">{{'verificationcode , sms' | translate}}, </span>
+
+<span *ngIf="loginType == 4 || activeType == 4" class="boldTxtNav">{{'verificationcode , whatsapp' | translate}}, </span>
+
+
+
+{{'verificationcode,instruct' | translate}}
+
+<span class="boldTxtNav">{{'general,submit' | translate}}</span
+
+></p>
+
+<!-- <p class="leftDiv">{{'verificationcode,title' | translate}}<span class="boldTxtNav">{{'verificationcode,verificationcode' | translate}}</span> {{'verificationcode,by' | translate}}<span class="boldTxtNav">{{'verificationcode,sms' | translate}}</span>{{'verificationcode,instruct' | translate}}<span class="boldTxtNav">{{'general,submit' | translate}}</span></p> -->
 
 </ion-col>
+
+</ion-row>
+
+</ion-grid>
+
+<br/><br/>
+
+<!-- <p style="color: #c0c0c0; margin-left: 32%">{{'verificationcode.verificationcode' | translate}}</p> -->
+
+<div>
+
+<h1 text-center>{{displayTime}}</h1>
+
+<br/><br/>
+
+<!-- <ion-item>
+
+//<ion-label>{{'verificationcode,verificationcode' | translate}}</ion-label>
+
+// <img class="item-icon" src="assets/imgs/password.png" item-start /> 
+
+<ion-input required type="tel" maxlength="4" (keyup)="checkOTPLength()" placeholder="{{translate.trPK('verificationcode','verificationcode')}}" [(ngModel)]="activationCode"></ion-input>
+
+</ion-item> -->
+
+
+
+<ion-row class="sms_code" dir="ltr">
+
+<ion-col [size]="12">
+
+<ion-input type="tel" [(ngModel)]="smc_code[0]" maxLength="4" size="4" min="0" max="9" pattern="[0-9]{1}"
+
+inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()" #ref autofocus="true">
+
+</ion-input>
+
+
+<ion-input type="tel" [(ngModel)]="smc_code[1]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
+
+inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
+
+<ion-input type="tel" [(ngModel)]="smc_code[2]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
+
+inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
+
+<ion-input type="tel" [(ngModel)]="smc_code[3]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
+
+inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
+
+
+
+</ion-col>
+
 </ion-row> 
 
+
+
 <div *ngIf="showErrorMessage"><p style="color: red; font-weight: bold; font-size: 14px; text-align: center;">{{messageValue}}</p></div>
 
+
+
 </div>
 
+
+
 </ion-content>
+
 <ion-footer>
-    <div class="centerDiv">
-        <ion-button class="button-login"  ion-button  (click)="checkVerificationCode()">{{'general,submit' | translate}}</ion-button>
-      </div>
-</ion-footer>
\ No newline at end of file
+
+<div class="centerDiv">
+
+<ion-button class="button-login" ion-button (click)="checkVerificationCode()">{{'general,submit' | translate}}</ion-button>
+
+</div>
+
+</ion-footer>​
diff --git a/Mohem/src/app/authentication/sms-page/sms-page.page.ts b/Mohem/src/app/authentication/sms-page/sms-page.page.ts
index 0bc5507f..aa9bf3b6 100644
--- a/Mohem/src/app/authentication/sms-page/sms-page.page.ts
+++ b/Mohem/src/app/authentication/sms-page/sms-page.page.ts
@@ -1,306 +1,629 @@
-
 import { Component, OnInit } from '@angular/core';
+
 import { ElementRef } from '@angular/core';
+
 import { NavController, Platform } from '@ionic/angular';
+
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+
 import { SharedDataService } from 'src/app/hmg-common/services/shared-data-service/shared-data.service';
+
 import { SMSCheckRequest } from 'src/app/hmg-common/services/authentication/models/smscheck.request';
+
 import { LoginModel } from '../models/LoginModel';
+
 import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
+
 import { SMSCheckResponse } from 'src/app/hmg-common/services/authentication/models/smscheck.response';
+
 import { Password } from '../models/password';
+
 import { GetLoginInfoRequest } from 'src/app/hmg-common/services/authentication/models/get-login-info.request';
+
 import * as moment from 'moment';
+
 import { NFC } from "@ionic-native/nfc/ngx";
 
+import { SmsRetriever } from '@ionic-native/sms-retriever/ngx';
+
 @Component({
+
   selector: 'app-sms-page',
+
   templateUrl: './sms-page.page.html',
+
   styleUrls: ['./sms-page.page.scss']
+
 })
 
+
+
 export class SmsPageComponent implements OnInit {
+
   public static LOGIN_DATA = 'LOGIN_DATA';
+
   Channel = 0;
+
   activationCode: string;
+
   P_SESSION_ID: number;
+
   P_USER_NAME: string;
+
   timeInSeconds: any;
+
   time: any;
+
   runTimer: any;
+
   hasStarted: any;
+
   hasFinished: any;
+
   remainingTime: any;
+
   displayTime: any;
+
   loginTokenID: string;
+
   public isForgetPwd = false;
+
   public isExpiredPwd = false;
+
   public count = 0;
+
   private loginData = new LoginModel();
+
   public deviceToken: any;
+
   public loginTypeData: any;
+
   public logo = 'assets/icon/login/password.png';
+
   // tslint:disable-next-line: variable-name
+
   public smc_code: any = [];
+
   code: any;
+
   // tslint:disable-next-line: variable-name
+
   user_name: string;
+
   public isPostNoLoad = true;
+
   loginType: any;
+
   activeType: any;
+
   public isNFCAvailable = false;
+
   public showErrorMessage = false;
+
   public messageValue: string;
+
   public businessInfo: object;
 
+  public isAutoRead: boolean = false;
+
   constructor(
+
     public navCtrl: NavController,
+
     public translate: TranslatorService,
+
     public common: CommonService,
+
     private elementRef: ElementRef,
+
     public authService: AuthenticationService,
+
     public sharedData: SharedDataService,
+
     public platform: Platform,
-    private nfc: NFC
-  ) {}
+
+    private nfc: NFC,
+
+    private smsRetriever: SmsRetriever
+
+  ) { }
+
+
 
   ngOnInit() {
+
     this.checkNFCStatus();
-    this.activeType=this.common.getActiveTypeLogin();
-    console.log("active "+ this.common.sharedService.getSharedData('active-type',true));
 
-    console.log("activeType :"+this.activeType);
+    this.activeType = this.common.getActiveTypeLogin();
+
+    console.log("active " + this.common.sharedService.getSharedData('active-type', true));
+
+
+
+    console.log("activeType :" + this.activeType);
+
     this.count = 0;
+
     this.initTimer();
+
     this.startTimer();
+
     this.isForgetPwd = this.sharedData.getSharedData(Password.IS_FORGET_PSW) || false;
+
     this.isExpiredPwd = this.sharedData.getSharedData(Password.IS_EXPIRED_PSW) || false;
+
     this.loginData = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
+
     this.deviceToken = this.common.sharedService.getSharedData(AuthenticationService.DEVICE_TOKEN, false);
+
     // tslint:disable-next-line: triple-equals
+
     if (this.deviceToken == undefined) {
+
       this.deviceToken = localStorage.getItem('deviceToken');
+
     }
+
     console.log('deviceToken :' + this.deviceToken);
+
     this.loginTypeData = this.common.sharedService.getSharedData(SMSCheckRequest.SHARED_DATA, false);
-    if( this.loginTypeData){
-      this.loginType=this.loginTypeData.loginType;
 
-     console.log("loginType :"+this.loginTypeData.loginType);
-      }else{
-       this.loginType=1;
-      }
+    if (this.loginTypeData) {
+
+      this.loginType = this.loginTypeData.loginType;
+
+
+
+      console.log("loginType :" + this.loginTypeData.loginType);
+
+    } else {
+
+      this.loginType = 1;
+
+    }
+
+    this.smsRetriever.startWatching()
+
+      .then((res: any) => this.checkActivation(res, true))
+
+      .catch((error: any) => console.error(error));
+
+  }
+
+  checkActivation(res, isAndroid) {
+
+    this.isAutoRead = true;
+
+    var pattern = /\d+/g;
+
+    if (isAndroid)
+
+      var code = res.Message.match(pattern)[0];
+
+    else
+
+      var code = res;
+
+
+    this.activationCode = code
+
+    this.smc_code = code.split('');
+
+    this.checkVerificationCode();
 
   }
 
   initTimer() {
+
     if (!this.timeInSeconds) {
-      this.timeInSeconds = 600;
+
+      this.timeInSeconds = 120;
+
     }
+
     this.time = this.timeInSeconds;
+
     this.runTimer = false;
+
     this.hasStarted = false;
+
     this.hasFinished = false;
+
     this.remainingTime = this.timeInSeconds;
+
     this.displayTime = this.common.getSecondsAsDigitalClock(this.remainingTime);
+
   }
 
+
+
   startTimer() {
+
     this.runTimer = true;
+
     this.hasStarted = true;
+
     this.timerTick();
+
   }
 
+
+
   pauseTimer() {
+
     this.runTimer = false;
+
   }
 
+
+
   resumeTimer() {
+
     this.startTimer();
+
   }
 
+
+
   timerTick() {
+
     setTimeout(() => {
+
       if (!this.runTimer) {
+
         return;
+
       }
+
       this.remainingTime--;
+
       this.displayTime = this.common.getSecondsAsDigitalClock(this.remainingTime);
+
       if (this.remainingTime > 0) {
+
         this.timerTick();
+
       } else {
+
         this.hasFinished = true;
+
         this.pauseTimer();
+
         this.navCtrl.pop();
+
       }
+
     }, 1000);
+
   }
 
+
+
   ionViewWillLeave() {
+
     this.pauseTimer();
+
   }
 
+
+
   checkOTPLength() {
+
     // tslint:disable-next-line: triple-equals
+
     if (this.activationCode.length == 4) {
+
       this.checkVerificationCode();
+
     }
+
   }
 
+
+
   checkVerificationCode() {
+
     this.code = this.smc_code.join('');
+
     if (this.count < 3) {
+
       // tslint:disable-next-line: triple-equals
+
       if (this.code == undefined || this.code == null || this.code == '') {
-        //  this.common.showAlert(this.translate.translate('verificationcode.emptyCode'));
+
+        // this.common.showAlert(this.translate.translate('verificationcode.emptyCode'));
+
       } else {
+
         this.count = this.count + 1;
+
         if (this.isForgetPwd || this.isExpiredPwd) {
+
           this.checkForgetPwdSMS();
+
         } else {
+
           this.checkSMS();
+
         }
+
       }
+
     } else {
+
       const msg: string = this.translate.trPK('general', 'noOfTriesLogin');
+
       this.common.JustAlertDialog(this.translate.trPK('general', 'ok'), msg);
+
     }
+
   }
 
+
+
   async checkNFCStatus() {
+
     try {
+
       let nfcStatus = await this.nfc.enabled();
+
       console.log("nfc status >>>>>>>>>>" + nfcStatus);
+
       this.isNFCAvailable = true;
+
     } catch (err) {
+
       console.log("Error reading tag", err);
+
       if (err === "NO_NFC") {
+
         this.isNFCAvailable = false;
+
       } else if (err === "NFC_DISABLED") {
-        this.isNFCAvailable = true;       
+
+        this.isNFCAvailable = true;
+
       } else {
+
         this.isNFCAvailable = false;
+
       }
+
     }
+
   }
 
+
+
   public checkSMS() {
-      this.showErrorMessage = false;
-      const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
-      const request = new SMSCheckRequest();
-      request.LogInTokenID = data.LogInTokenID;
-      request.activationCode = this.code; // code;this.activationCode;
-      request.P_USER_NAME = data.P_USER_NAME;
-      request.MobileNumber = data.MobileNumber;
-      request.IsDeviceNFC = this.isNFCAvailable;
-      this.authService.checkSMS(request, () => {}, this.translate.trPK('general', 'ok'), true).subscribe((result: SMSCheckResponse) => {
-        if (this.common.validResponse(result)) {          
-
-          //save business card info
-          this.businessInfo = {
-            show_business: result.BusinessCardPrivilege,
-            name_en: result.MemberInformationList[0].EMPLOYEE_NAME_En,
-            job_en: result.MemberInformationList[0].JOB_NAME_En,
-            name_ar: result.MemberInformationList[0].EMPLOYEE_NAME_Ar,
-            job_ar: result.MemberInformationList[0].JOB_NAME_Ar,
-            mobile: result.MemberInformationList[0].MobileNumberWithZipCode,
-            qr: result.MemberInformationList[0].BusinessCardQR,
-            company_logo: result.BC_Logo ? result.BC_Logo: result.CompanyImageURL,
-            company_url: result.BC_Domain,
-            company_type: result.CompanyMainCompany,
-            email: result.MemberInformationList[0].EMPLOYEE_EMAIL_ADDRESS
-          }
 
-          // Wifi Credientials
-          CommonService.MOHEMM_WIFI_SSID = result.Mohemm_Wifi_SSID;
-          CommonService.MOHEMM_WIFI_PASSWORD = result.Mohemm_Wifi_Password;
-          localStorage.setItem('bussiness-card-info', JSON.stringify(this.businessInfo));
-          // this.common.sharedService.setSharedData(this.businessInfo,'bussiness-card-info');
-
-          AuthenticationService.servicePrivilage = result.Privilege_List;
-          this.authService.setAuthenticatedUser(result).subscribe(() => {
-            localStorage.setItem('emp-name', result.MemberInformationList[0].EMPLOYEE_NAME);
-            this.user_name = result.MemberInformationList[0].EMPLOYEE_NAME;
-            const currDateTime =  moment().format('MMM DD , YYYY HH:mm');
-            localStorage.setItem('login-at', currDateTime);
-            if (this.platform.is('cordova')) {
-              this.insertMobileLogin();
-            }
-            this.common.sharedService.setSharedData(result.MemberInformationList[0].PAYROLL_CODE, "projcet-code");
-            this.activeType =this.common.setActiveTypeLogin(0);
-            this.common.openHome();
-          });
-        } else {
-          let errorResult: any;
-          errorResult = result;
-          this.showErrorMessage = true;
-          this.messageValue = errorResult.ErrorEndUserMessage;
-          this.smc_code = [];
-          (document.activeElement as HTMLElement).blur();
-          setTimeout(() => {
-            this.showErrorMessage = false;
-          }, 5000);
+    this.showErrorMessage = false;
+
+    const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
+
+    const request = new SMSCheckRequest();
+
+    request.LogInTokenID = data.LogInTokenID;
+
+    request.activationCode = this.code; // code;this.activationCode;
+
+    request.P_USER_NAME = data.P_USER_NAME;
+
+    request.MobileNumber = data.MobileNumber;
+
+    request.IsDeviceNFC = this.isNFCAvailable;
+
+    this.authService.checkSMS(request, () => { }, this.translate.trPK('general', 'ok'), true).subscribe((result: SMSCheckResponse) => {
+
+      if (this.common.validResponse(result)) {
+
+
+
+        //save business card info
+
+        this.businessInfo = {
+
+          show_business: result.BusinessCardPrivilege,
+
+          name_en: result.MemberInformationList[0].EMPLOYEE_NAME_En,
+
+          job_en: result.MemberInformationList[0].JOB_NAME_En,
+
+          name_ar: result.MemberInformationList[0].EMPLOYEE_NAME_Ar,
+
+          job_ar: result.MemberInformationList[0].JOB_NAME_Ar,
+
+          mobile: result.MemberInformationList[0].MobileNumberWithZipCode,
+
+          qr: result.MemberInformationList[0].BusinessCardQR,
+
+          company_logo: result.BC_Logo ? result.BC_Logo : result.CompanyImageURL,
+
+          company_url: result.BC_Domain,
+
+          company_type: result.CompanyMainCompany,
+
+          email: result.MemberInformationList[0].EMPLOYEE_EMAIL_ADDRESS
+
         }
-      });
+
+
+
+        // Wifi Credientials
+
+        CommonService.MOHEMM_WIFI_SSID = result.Mohemm_Wifi_SSID;
+
+        CommonService.MOHEMM_WIFI_PASSWORD = result.Mohemm_Wifi_Password;
+
+        localStorage.setItem('bussiness-card-info', JSON.stringify(this.businessInfo));
+
+        // this.common.sharedService.setSharedData(this.businessInfo,'bussiness-card-info');
+
+
+
+        AuthenticationService.servicePrivilage = result.Privilege_List;
+
+        this.authService.setAuthenticatedUser(result).subscribe(() => {
+
+          localStorage.setItem('emp-name', result.MemberInformationList[0].EMPLOYEE_NAME);
+
+          this.user_name = result.MemberInformationList[0].EMPLOYEE_NAME;
+
+          const currDateTime = moment().format('MMM DD , YYYY HH:mm');
+
+          localStorage.setItem('login-at', currDateTime);
+
+          if (this.platform.is('cordova')) {
+
+            this.insertMobileLogin();
+
+          }
+
+          this.common.sharedService.setSharedData(result.MemberInformationList[0].PAYROLL_CODE, "projcet-code");
+          this.common.sharedService.setSharedData(result.BasicMemberInformation.P_LEGISLATION_CODE, "legislation-code");
+
+          this.activeType = this.common.setActiveTypeLogin(0);
+
+          this.common.openHome();
+
+        });
+
+      } else {
+
+        let errorResult: any;
+
+        errorResult = result;
+
+        this.showErrorMessage = true;
+
+        this.messageValue = errorResult.ErrorEndUserMessage;
+
+        this.smc_code = [];
+
+        (document.activeElement as HTMLElement).blur();
+
+        setTimeout(() => {
+
+          this.showErrorMessage = false;
+
+        }, 5000);
+
+      }
+
+    });
+
   }
 
+
+
   public insertMobileLogin() {
-        const request = new GetLoginInfoRequest();
-        this.authService.setPublicFields(request);
-        request.MobileNumber = this.loginData.MobileNumber;
-        request.P_USER_NAME = this.loginData.P_USER_NAME;
-        request.UserName = this.loginData.P_USER_NAME;
-        request.LogInTokenID = this.loginData.LogInTokenID;
-        request.CompanyID = 1; // CompanyID
-        request.DeviceType = this.common.getDeviceType();
-        request.DeviceToken = this.deviceToken; // "5ca8a69cf1804db55264c349edffb99b9d63acd9fa9b6b18956bcb2ad3f2ba36";//this.deviceToken;
-        request.LoginType = this.loginTypeData.loginType;
-        request.EmployeeName = this.user_name;
-        this.authService.insertMobileLoginInfo(request, () => { }, this.translate.trPK('general', 'ok'), this.isPostNoLoad)
-        .subscribe((result: any) => {
-            console.log('successful insertMobileLogin' );
-        });
+
+    const request = new GetLoginInfoRequest();
+
+    this.authService.setPublicFields(request);
+
+    request.MobileNumber = this.loginData.MobileNumber;
+
+    request.P_USER_NAME = this.loginData.P_USER_NAME;
+
+    request.UserName = this.loginData.P_USER_NAME;
+
+    request.LogInTokenID = this.loginData.LogInTokenID;
+
+    request.CompanyID = 1; // CompanyID
+
+    request.DeviceType = this.common.getDeviceType();
+
+    request.DeviceToken = this.deviceToken; // "5ca8a69cf1804db55264c349edffb99b9d63acd9fa9b6b18956bcb2ad3f2ba36";//this.deviceToken;
+
+    request.LoginType = this.loginTypeData.loginType;
+
+    request.EmployeeName = this.user_name;
+
+    this.authService.insertMobileLoginInfo(request, () => { }, this.translate.trPK('general', 'ok'), this.isPostNoLoad)
+
+      .subscribe((result: any) => {
+
+        console.log('successful insertMobileLogin');
+
+      });
+
   }
 
+
+
   public checkForgetPwdSMS() {
+
     const data = this.sharedData.getSharedData(AuthenticationService.LOGIN_DATA, false);
+
     const request = new SMSCheckRequest();
+
     request.LogInTokenID = data.LogInTokenID;
+
     request.activationCode = this.code; // this.activationCode;
+
     request.P_USER_NAME = data.P_USER_NAME;
-    this.authService.checkForgetSMS(request, () => {}, this.translate.trPK('general', 'ok')).subscribe((result: SMSCheckResponse) => {
-        if (this.common.validResponse(result)) {
-          this.sharedData.setSharedData(result, 'checkSMSResponse');
-          if (this.isForgetPwd) {
-            this.common.openForgotPassword();
-          }
-          if (this.isExpiredPwd) {
-            this.sharedData.setSharedData(true, Password.IS_EXPIRED_PSW);
-            this.common.openChangePassword();
-          }
+
+    this.authService.checkForgetSMS(request, () => { }, this.translate.trPK('general', 'ok')).subscribe((result: SMSCheckResponse) => {
+
+      if (this.common.validResponse(result)) {
+
+        this.sharedData.setSharedData(result, 'checkSMSResponse');
+
+        if (this.isForgetPwd) {
+
+          this.common.openForgotPassword();
+
         }
-      });
+
+        if (this.isExpiredPwd) {
+
+          this.sharedData.setSharedData(true, Password.IS_EXPIRED_PSW);
+
+          this.common.openChangePassword();
+
+        }
+
+      }
+
+    });
+
   }
 
+
+
   onChange() {
     // tslint:disable-next-line: only-arrow-functions
-    const filtered = this.smc_code.filter(function(el) {
+    const filtered = this.smc_code.filter(function (el) {
       if (el) {
         return el;
       }
     });
-    if (filtered.length === 4) {
+
+    if (filtered.length === 4 && !this.isAutoRead) {
       this.checkVerificationCode();
     }
   }
 
+
+
+
+
+
+
   goToNextInput(e) {
     const key = e.which;
     const t = e.target;
     const sib = t.nextElementSibling;
     const sibPre = t.previousElementSibling;
 
+
+    if (key === undefined && e.target.value.length==4 && (this.platform.is('ios') && !this.platform.is('mobileweb'))) {
+      this.checkActivation(e.target.value, false);
+    }
+
     if (key !== 9 && (key < 48 || key > 57)) {
       if (key === 8 || key === 46) {
         return true;
@@ -309,7 +632,6 @@ export class SmsPageComponent implements OnInit {
         return false;
       }
     }
-
     if (key === 9) {
       return true;
     }
@@ -322,4 +644,6 @@ export class SmsPageComponent implements OnInit {
       }
     }
   }
+
+
 }
diff --git a/Mohem/src/app/eit/add-cei/add-cei.component.html b/Mohem/src/app/eit/add-cei/add-cei.component.html
new file mode 100644
index 00000000..6a1c1bc0
--- /dev/null
+++ b/Mohem/src/app/eit/add-cei/add-cei.component.html
@@ -0,0 +1,24 @@
+<app-generic-header
+  showBack="!getPassdirfromNotifiPage"
+  [updateDirection]="getPassdirfromNotifiPage" 
+  [headerText]="headerTitle"
+  (trigger)="closeModal()"
+  >
+</app-generic-header>
+
+
+<ion-content padding>
+  <ion-item  class="country dynamicField" lines="none" *ngIf="showEffectiveDate"> 
+    <ion-label>{{'vacation-rule, effectiveDate' | translate}}</ion-label>
+    <ion-label>{{showEffectiveDate}}</ion-label>
+  </ion-item>
+  <div #containerDiv id="containerDiv">
+  </div>
+</ion-content>
+
+<ion-footer>
+  <div class="centerDiv">
+    <ion-button class="addEitOkButton" color="customnavy" ion-button (click)="submitChildEducationTransaction()">
+      {{'vacation-rule, next-label' | translate}}</ion-button>
+  </div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/eit/add-cei/add-cei.component.scss b/Mohem/src/app/eit/add-cei/add-cei.component.scss
new file mode 100644
index 00000000..a6dbf815
--- /dev/null
+++ b/Mohem/src/app/eit/add-cei/add-cei.component.scss
@@ -0,0 +1,45 @@
+.footer-button {
+    border-radius: 2px;
+    padding: 0 1.1em;
+    min-height: 45px;
+    min-width: 200px;
+  }
+  
+  ion-label {
+    color: var(--customnavy) !important;
+  }
+  
+  .daynamicForm-Label {
+    font-size: 16px;
+    color: #a2a5a6 !important;
+    display: block;
+    overflow: hidden;
+    -webkit-flex: 1;
+    flex: 1;
+    font-size: inherit;
+    white-space: normal;
+    padding: 5px 0px;
+    margin: 10px auto;
+    padding-left: 10px;
+  }
+  
+  
+  .header-toolbar-new{
+    --background: #269DB8;
+  }
+  .addEitOkButton{
+    white-space: normal !important;
+    text-transform: capitalize !important;
+    min-height: 45px !important;
+    min-width: 5px !important;
+    margin: 8px !important;
+    background-color: #269DB8;
+    width: 80% !important;
+    color: white!important;
+    border-radius: 16px !important;
+  }
+
+  .country{
+    margin-top: 10px;
+    padding: 10px;
+  }
\ No newline at end of file
diff --git a/Mohem/src/app/eit/add-cei/add-cei.component.spec.ts b/Mohem/src/app/eit/add-cei/add-cei.component.spec.ts
new file mode 100644
index 00000000..fa819bbd
--- /dev/null
+++ b/Mohem/src/app/eit/add-cei/add-cei.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddCeiComponent } from './add-cei.component';
+
+describe('AddCeiComponent', () => {
+  let component: AddCeiComponent;
+  let fixture: ComponentFixture<AddCeiComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AddCeiComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AddCeiComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/eit/add-cei/add-cei.component.ts b/Mohem/src/app/eit/add-cei/add-cei.component.ts
new file mode 100644
index 00000000..8d9ef1f6
--- /dev/null
+++ b/Mohem/src/app/eit/add-cei/add-cei.component.ts
@@ -0,0 +1,1561 @@
+import { CommonService } from "src/app/hmg-common/services/common/common.service";
+import { Component, OnInit, ViewChild, ElementRef } from "@angular/core";
+import { MenuEntry } from "src/app/hmg-common/services/menu/models/menu.entry";
+import { MenuResponse } from "src/app/hmg-common/services/menu/models/menu-response";
+import { CeiRequest } from "../models/cei.request";
+import { ModalController } from "@ionic/angular";
+import { TranslatorService } from "src/app/hmg-common/services/translator/translator.service";
+import { EITTransactionsRequest } from "../models/EITTransactionsReq";
+import { EitService } from "../services/eit.service";
+import { TextAreaInput } from "src/app/uI-elements/text-area.input";
+import { NumberInput } from "src/app/uI-elements/number.input";
+import { TextInput } from "src/app/uI-elements/text.input";
+import { SelectInput } from "src/app/uI-elements/select.input";
+import { DateInput } from "src/app/uI-elements/date.input";
+import { TimeInput } from "src/app/uI-elements/time.input";
+import { DateTimeInput } from "src/app/uI-elements/date-time.input";
+import { ButtonInput } from "src/app/uI-elements/button.input";
+import { HiddenInput } from "src/app/uI-elements/hidden.input";
+import * as moment from "moment";
+import { DatePicker } from "@ionic-native/date-picker/ngx";
+import { EIT_ACTION } from "../models/submit.eit.action";
+import { AddCeiResponse } from "../models/add.cei.response";
+import { EITNotificatonBodyResponse } from "../models/EITNotificationBodyRes";
+@Component({
+  selector: 'app-add-cei',
+  templateUrl: './add-cei.component.html',
+  styleUrls: ['./add-cei.component.scss'],
+})
+export class AddCeiComponent implements OnInit {
+  @ViewChild("containerDiv") containerDiv: ElementRef;
+
+  ////*new add*/////
+  getPassNotificationDetails: any;
+  getPassdirfromNotifiPage: boolean = false;
+  functionName: string = "";
+  menuType: any;
+  /////////////////
+
+  private textArea: TextAreaInput;
+  private numberInput: NumberInput;
+  private textInput: TextInput;
+  private selectInput: SelectInput;
+  private dateInput: DateInput;
+  private timeInput: TimeInput;
+  private datetimeInput: DateTimeInput;
+  private buttonInput: ButtonInput;
+  private hiddenInput: HiddenInput;
+  private ceiResponse: any;
+
+  private eitVALSettoCall: any = [];
+  private comtransNo: number = 0;
+  // private parentChilds: any[];
+  getPassMnuEntryObj: MenuEntry;
+  selMenu: MenuResponse;
+  eitSubmitAction: number = 0; //not submit
+  private ceiRequest: CeiRequest;
+  private validateEitObj: any = [];
+  private ExtraObj: any = {};
+  private arrValues: any = [];
+  selEmp: string;
+  respID: number;
+  headerTitle: string = "";
+  isResubmit: boolean = false;
+  private updatedValues: any = [];
+  addEITData: any;
+  direction:string;
+  public showEffectiveDate: string = moment(new Date).format("DD-MM-YYYY");
+  public selectedContactData: any;
+  
+
+  constructor(
+    public modalController: ModalController,
+    public cs: CommonService,
+    private ts: TranslatorService,
+    private eitService: EitService,
+    public datePicker: DatePicker
+  ) {
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.selectedContactData = this.cs.sharedService.getSharedData('selectedContactFORChildEducation', false);
+    this.selEmp = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_SEL_EMP,
+      false
+    );
+    this.respID = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_SEL_RESP_ID,
+      false
+    );
+    this.selMenu = new MenuResponse();
+    this.selMenu = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_DATA,
+      false
+    );
+    this.addEITData = this.cs.sharedService.getSharedData("AddEITData", false);
+    console.log("addEITData: " + this.addEITData);
+    console.log("dirfromNotificationPage: " +    this.addEITData.dirfromNotificationPage);
+
+    this.ceiRequest = new CeiRequest();
+
+
+    ////*new add*/////
+    /**********resubmit************ */
+    this.getPassNotificationDetails = this.cs.sharedService.getSharedData(EITNotificatonBodyResponse.NOT_WORKLIST, false);//WARINING
+    this.getPassdirfromNotifiPage = this.addEITData.dirfromNotificationPage;
+    if (this.getPassdirfromNotifiPage) {
+      this.functionName = this.getPassNotificationDetails.FUNCTION_NAME; //;this.getPassNotificationDetails.NOTIFICATION_NAME;
+      this.menuType = "E";
+      this.selEmp = this.getPassNotificationDetails.SELECTED_EMPLOYEE_NUMBER;
+      this.respID = -999;
+      this.validateEitObj = this.addEITData.submitEITObjList;
+      //  this.eitSubmitAction=this.getPassNotificationDetails.EIT_ACTION;
+      let msg: string = "";
+      msg = this.ts.trPK("eit", "update-title");
+      this.headerTitle = msg;
+    } else {
+      this.getPassMnuEntryObj = this.selMenu.GetMenuEntriesList;
+      this.comtransNo = this.addEITData.transNo;
+      this.functionName = this.getPassMnuEntryObj.FUNCTION_NAME;
+      this.menuType = this.selMenu.List_Menu.MENU_TYPE;
+      this.validateEitObj = this.addEITData.submitEITObjList;
+      this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+      this.eitSubmitAction = this.cs.sharedService.getSharedData(
+        EITTransactionsRequest.SUBMIT_EIT_ACTION
+      );
+    }
+  }
+
+  ngOnInit() {}
+
+  ngAfterViewInit() {
+    this.getCEIDffStructure();
+  }
+
+  private getCEIDffStructure() {
+    const body = {
+      P_FUNCTION_NAME: this.functionName,
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID
+    };
+    this.eitService.getCEIDFFStrutre(body).subscribe((result: any) => {
+      this.handleCEIDffStructureResult(result);
+    });
+  }
+
+  handleCEIDffStructureResult(result) {
+    if (result.GetCEIDFFStructureList != null) {
+      this.ceiResponse = result.GetCEIDFFStructureList;
+      this.drawCEIFields(result.GetCEIDFFStructureList);
+    }
+  }
+
+  private drawCEIFields(feildsList) {
+    const containerId = "containerDiv";
+    this.eitVALSettoCall = [];
+    for (let i = 0; i < feildsList.length; i++) {
+      let defaultVal: string = "";
+      let defaultValText: string = "";
+      defaultVal = feildsList[i].E_SERVICES_DV.P_ID_COLUMN_NAME
+        ? feildsList[i].E_SERVICES_DV.P_ID_COLUMN_NAME
+        : "";
+      defaultValText = feildsList[i].E_SERVICES_DV.P_VALUE_COLUMN_NAME
+        ? feildsList[i].E_SERVICES_DV.P_VALUE_COLUMN_NAME
+        : "";
+
+      if (feildsList[i].DISPLAY_FLAG != "N") {
+        //check if the field should be displayed
+        if (feildsList[i].VALIDATION_TYPE == "N") {
+          //text , date , time
+          if (feildsList[i].FORMAT_TYPE == "C") {
+            // character
+            // if(feildsList[i].DEFAULT_TYPE=="C"||feildsList[i].DEFAULT_TYPE==""){// default type constant
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+            // }else if(feildsList[i].DEFAULT_TYPE=="P"||feildsList[i].DEFAULT_TYPE=="S"){// profile/ sql
+            //   this.textInput = new TextInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,this.getDefaultValue(feildsList[i].DESC_FLEX_NAME,feildsList[i].DESC_FLEX_CONTEXT_CODE,feildsList[i].SEGMENT_NAME,feildsList[i].PARENT_SEGMENTS_VS_SplitedVS,feildsList[i].PARENT_SEGMENTS_DV_Splited),containerId,feildsList[i].MOBILE_ENABLED);
+            // }
+          } else if (feildsList[i].FORMAT_TYPE == "N") {
+            // number
+            // if(feildsList[i].DEFAULT_TYPE=="C"||feildsList[i].DEFAULT_TYPE==""){
+            this.numberInput = new NumberInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+            // }else if(feildsList[i].DEFAULT_TYPE=="P"||feildsList[i].DEFAULT_TYPE=="S"){
+            //   this.numberInput = new NumberInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,this.getDefaultValue(feildsList[i].DESC_FLEX_NAME,feildsList[i].DESC_FLEX_CONTEXT_CODE,feildsList[i].SEGMENT_NAME,feildsList[i].PARENT_SEGMENTS_VS_SplitedVS,feildsList[i].PARENT_SEGMENTS_DV_Splited),containerId,feildsList[i].MOBILE_ENABLED);
+            // }
+          } else if (feildsList[i].FORMAT_TYPE == "X") {
+            // standard date
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              //constant
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+            // else if(feildsList[i].DEFAULT_TYPE=="D"){//current date
+            //  // this.dateInput = new DateInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,"currentDate",containerId,feildsList[i].MOBILE_ENABLED);
+            //  this.dateInput = new DateInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,defaultVal,containerId,feildsList[i].MOBILE_ENABLED);
+
+            // }else if(feildsList[i].DEFAULT_TYPE=="P"||feildsList[i].DEFAULT_TYPE=="S"){// sql and profile
+            //   this.dateInput = new DateInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,this.getDefaultValue(feildsList[i].DESC_FLEX_NAME,feildsList[i].DESC_FLEX_CONTEXT_CODE,feildsList[i].SEGMENT_NAME,feildsList[i].PARENT_SEGMENTS_VS_SplitedVS,feildsList[i].PARENT_SEGMENTS_DV_Splited),containerId,feildsList[i].MOBILE_ENABLED);
+            // }
+          } else if (feildsList[i].FORMAT_TYPE == "Y") {
+            // standard date time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatStandardDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+            const elem = document.getElementById(
+              feildsList[i].APPLICATION_COLUMN_NAME
+            );
+            // elem.addEventListener("click", e => {
+            //   if (feildsList[i].MOBILE_ENABLED != "Y") return false;
+            //   this.showDateTimePicker(
+            //     feildsList[i].APPLICATION_COLUMN_NAME,
+            //     feildsList[i].MAXIMUM_SIZE
+            //   );
+            //   e.stopImmediatePropagation();
+            // });
+            // else if(feildsList[i].DEFAULT_TYPE=="D"){
+            //   this.datetimeInput = new DateTimeInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,"currentDateTime",containerId,feildsList[i].MOBILE_ENABLED);
+            // }else if(feildsList[i].DEFAULT_TYPE=="P"||feildsList[i].DEFAULT_TYPE=="S"){
+            //   this.datetimeInput = new DateTimeInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,this.getDefaultValue(feildsList[i].DESC_FLEX_NAME,feildsList[i].DESC_FLEX_CONTEXT_CODE,feildsList[i].SEGMENT_NAME,feildsList[i].PARENT_SEGMENTS_VS_SplitedVS,feildsList[i].PARENT_SEGMENTS_DV_Splited),containerId,feildsList[i].MOBILE_ENABLED);
+            // }
+          } else if (feildsList[i].FORMAT_TYPE == "I") {
+            //time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          }
+        } else {
+          if (feildsList[i].READ_ONLY == "Y") {
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else {
+            // dropdown list missing open in differnt page
+            //check this validation since he doesnt check the other default_type
+            //if(feildsList[i].DEFAULT_TYPE=="P" || feildsList[i].DEFAULT_TYPE=="S"){
+            this.selectInput = new SelectInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+            // }else{
+            //   this.selectInput = new SelectInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,"",containerId,feildsList[i].MOBILE_ENABLED);
+            // }
+            // this.getValueSet(feildsList[i].SEGMENT_NAME);
+            this.fillDropdownList(
+              feildsList[i].SEGMENT_NAME,
+              feildsList[i].E_SERVICES_VS,
+              feildsList[i].E_SERVICES_DV
+            );
+            //  this.eitVALSettoCall.push(feildsList[i]);
+          }
+        }
+        //const elem = document.getElementById(feildsList[i].APPLICATION_COLUMN_NAME);
+        //elem.addEventListener("click", (e) => {
+        // this.getValueSet(feildsList[i].SEGMENT_NAME);
+        //  e.stopImmediatePropagation();
+        // });
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      } else {
+        //  if(feildsList[i].VALIDATION_TYPE=="N"){
+        this.hiddenInput = new HiddenInput(
+          defaultVal,
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          defaultValText,
+          containerId
+        );
+        // }else{
+        //   this.selectInput = new SelectInput(feildsList[i].SEGMENT_PROMPT,feildsList[i].APPLICATION_COLUMN_NAME,defaultVal,containerId,feildsList[i].MOBILE_ENABLED,feildsList[i].DISPLAY_FLAG);
+        //   this.fillDropdownList(feildsList[i].SEGMENT_NAME,feildsList[i].E_SERVICES_VS,feildsList[i].E_SERVICES_DV);
+        // }
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      }
+    }
+    // this.callValueSet();
+    // let msg:string="";
+    // msg=this.translate.translate("confirmAddEit.start");
+    // this.buttonInput = new ButtonInput("EIT_Btn_Submit", this.translate.translate('general.submit'), containerId, "");
+    // const elem = document.getElementById("EIT_Btn_Submit");
+    // elem.addEventListener("click", (e) => {
+    //   this.validateEITTransaction();
+    // });
+    if (this.validateEitObj && this.validateEitObj.length > 0) {
+      this.fillEITStructure();
+    }
+  }
+
+  addFieldToDOM(
+    fieldObject: any,
+    fieldId: any,
+    clickListenerEvent: any,
+    hasClickListener: boolean
+  ) {
+    console.log("AddFieldToDOM");
+    const elemDiv = document.createElement("div");
+    elemDiv.className = "";
+    elemDiv.innerHTML = fieldObject.getTemplate();
+    console.log(this.containerDiv.nativeElement);
+
+    this.containerDiv.nativeElement.appendChild(elemDiv);
+    // document.getElementById('containerDiv').appendChild(elemDiv);
+
+    if (hasClickListener) {
+      let elem = document.getElementById(fieldId);
+      elem.addEventListener("click", e => {
+        clickListenerEvent(e);
+        e.stopImmediatePropagation();
+      });
+    }
+  }
+
+  closeModal() {
+    console.log("closeModal");
+    this.updatedValues = [];
+    this.modalController.dismiss();
+  }
+
+  public showDateTimePicker(elemID, maxSize) {
+    let elem = document.getElementById(elemID) as HTMLDivElement;
+    let date: any;
+    let value = elem.innerHTML;
+    if (value) date = moment(value, "YYYY/MM/DD HH:mm:ss").toDate();
+    else date = new Date();
+    this.datePicker
+      .show({
+        date: date,
+        is24Hour: true,
+        mode: "datetime"
+      })
+      .then(
+        date => {
+          let dateString: string = moment(date).format("YYYY/MM/DD HH:mm:ss");
+          //remove seconds if the maximum size is 17
+          if (maxSize == 17) {
+            elem.innerHTML = dateString.substring(0, 16);
+            elem.dataset.dtvalue = dateString.substring(0, 16);
+          } else {
+            elem.innerHTML = dateString;
+            elem.dataset.dtvalue = dateString;
+          }
+          //elem.innerHTML = dateString;
+          // elem.dataset.dtvalue = dateString;
+        },
+        err => console.log("Error occurred while getting date: ", err)
+      );
+  }
+  public showTimePicker(elemID, maxSize) {
+    let elem = document.getElementById(elemID) as HTMLDivElement;
+    let date: any;
+    let value = elem.innerHTML;
+    if (value) {
+      let nowDate = moment().format("YYYY/MM/DD") + " " + value;
+      date = moment(nowDate, "YYYY/MM/DD HH:mm:ss").toDate();
+    } else {
+      date = new Date();
+    }
+    this.datePicker
+      .show({
+        date: date,
+        is24Hour: true,
+        mode: "time"
+      })
+      .then(
+        date => {
+          let dateString: string = moment(date).format("HH:mm:ss");
+          //remove seconds if the maximum size is 5
+          if (maxSize == 5) {
+            elem.innerHTML = dateString.substring(0, 5);
+            elem.dataset.dtvalue = dateString.substring(0, 5);
+          } else {
+            elem.innerHTML = dateString;
+            elem.dataset.dtvalue = dateString;
+          }
+        },
+        err => console.log("Error occurred while getting date: ", err)
+      );
+  }
+
+  fillDropdownList(segmentName, optionList: any = [], DV: any = "") {
+    let elemID: any = "";
+    let eitObj: any;
+    if (optionList.length > 0) {
+      for (let i = 0; i < this.ceiResponse.length; i++) {
+        if (this.ceiResponse[i].SEGMENT_NAME == segmentName) {
+          eitObj = this.ceiResponse[i];
+          if (
+            this.ceiResponse[i].READ_ONLY == "Y" ||
+            this.ceiResponse[i].DISPLAY_FLAG == "N"
+          ) {
+            return false;
+          }
+          elemID = this.ceiResponse[i].APPLICATION_COLUMN_NAME;
+          break;
+        }
+      }
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+
+      // for(let i = select.options.length - 1 ; i >= 0 ; i--)
+      // {
+      //   select.remove(i);
+      // }
+      if (eitObj.IsEmptyOption && eitObj.REQUIRED_FLAG == "N") {
+        var firstoption = document.createElement("option");
+        firstoption.text = this.ts.trPK("general", "choose");
+        firstoption.value = "";
+        select.add(firstoption);
+      }
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].VALUE_COLUMN_NAME;
+        option.value = optionList[i].ID_COLUMN_NAME;
+        select.add(option);
+      }
+      if (select.dataset.hiddenval) {
+        select.value = select.dataset.hiddenval;
+        //select.dataset.hiddenval="";
+      } else {
+        select.value = DV.P_ID_COLUMN_NAME;
+      }
+      select.disabled = false;
+    }
+  }
+
+  bindHtmlElemEvents(id, obj) {
+    const elem = document.getElementById(id);
+    console.log(elem);
+    console.log(obj);
+    const elemType = elem.tagName;
+    let changeEvent = "ionChange";
+
+    if (elemType == "SELECT") changeEvent = "change";
+
+    try {
+      // elem.addEventListener("change", (e) => {
+      elem.addEventListener(changeEvent, e => {
+        //console.log("elem change "+elem.id);
+        //let x=e.currentTarget  as HTMLInputElement;
+        //let isEmpty:boolean=false;
+        //  if(!x.value)
+        //   isEmpty=true;
+        //emptyChildElement
+        elem.classList.remove("requiredClassElm");
+        if (
+          obj.CHILD_SEGMENTS_VS_Splited &&
+          obj.CHILD_SEGMENTS_VS_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_VS_Splited;
+          listArray.forEach(element => {
+            //if(isEmpty)
+            this.emptyChildElement(element);
+            // else
+            this.getValueSet(element);
+          });
+        }
+        if (
+          obj.CHILD_SEGMENTS_DV_Splited &&
+          obj.CHILD_SEGMENTS_DV_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_DV_Splited;
+          listArray.forEach(element => {
+            // if(isEmpty){
+            this.emptyChildElement(element);
+            // }else{
+            for (let i = 0; i < this.ceiResponse.length; i++) {
+              if (this.ceiResponse[i].SEGMENT_NAME == element) {
+                this.getDefaultValue(
+                  this.ceiResponse[i],
+                  this.ceiResponse[i].DESC_FLEX_NAME,
+                  this.ceiResponse[i].DESC_FLEX_CONTEXT_CODE,
+                  this.ceiResponse[i].SEGMENT_NAME,
+                  this.ceiResponse[i].PARENT_SEGMENTS_VS_SplitedVS,
+                  this.ceiResponse[i].PARENT_SEGMENTS_DV_Splited
+                );
+              }
+            }
+            // }
+          });
+        }
+        return false;
+        // e.stopImmediatePropagation();
+      });
+    } catch (e) {
+      console.log(e.status);
+    }
+  }
+
+  public getDefaultValue(
+    obj,
+    descFlexName,
+    descFlexContextCode,
+    segmentName,
+    parentValue,
+    ParentsList
+  ) {
+    let dependenciesList: any = [];
+    let parentVal: any = null;
+    let isStandardDate: boolean = false;
+    let isStandardTimeDate: boolean = false;
+    let isStandardTime: boolean = false;
+    let isHidden: boolean = false;
+    let isReadOnlyList: boolean = false;
+    let isSelectElement: boolean = false;
+    isStandardDate = this.isStandardDate(obj);
+    isStandardTimeDate = this.isStandardDateTime(obj);
+    isStandardTime = this.isStandardTime(obj);
+    if (obj.DISPLAY_FLAG == "N") isHidden = true;
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "Y") {
+      isReadOnlyList = true;
+    }
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "N") {
+      isSelectElement = true;
+    }
+    //if(parentValue!=""){ parentVal= this.getDependenciesParams(parentValue)[0].ID_COLUMN_NAME;}
+    //if(ParentsList!=""){dependenciesList =this.getDependenciesParams(ParentsList); }
+
+    if (
+      parentValue != "" &&
+      (obj.VALIDATION_TYPE == "D" || obj.VALIDATION_TYPE == "Y")
+    ) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      if (parentValue) ParentsList.concat(parentValue);
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+
+    //if (dependenciesList==false){return false};
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList
+    };
+
+    this.eitService.getDefaultValue(body).subscribe((result: any) => {
+      let elem = this.getElementByName(segmentName);
+     // console.log(elem);
+      //   if(elem.dataset.hiddenval){
+      //   elem.dataset.hiddenval="";
+      // return false;
+      //  }
+      let obj = this.handleDefaultValueResult(result);
+      let val = obj.value;
+      let text = obj.text;
+      if (val==null){val="";}
+      if (text==null){text="";}
+      if (isStandardDate) {
+        console.log("isStandardDate");
+        elem.value = this.cs.reverseFormatDate(val);
+      } else if (isStandardTimeDate) {
+        console.log("isStandardTimeDate");
+        if (val) {
+          elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+          elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else if (isStandardTime) {
+        console.log("isStandardTime");
+        if (val) {
+          elem.dataset.dtvalue = val;
+          elem.innerHTML = val;
+          elem.value=val;
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else {
+        if (isSelectElement) {
+          let elem = this.getSelectElementByName(segmentName);
+          elem = document.getElementById(elem),
+          //alert(elem.length);
+          // var firstoption = document.createElement("option");
+          // firstoption.text = text;
+          // firstoption.value = val;
+          // elem.add(firstoption);
+          elem.value = val;
+          //elem.text=text; 
+          
+        }else{
+       // console.log("else - " + elem.value);
+        elem.value = val;
+        elem.innerText = text;
+        elem.setAttribute("value", val);
+       // console.log("else - " + elem.value);
+        }
+      }
+      if (isHidden || isReadOnlyList) {
+        if (val) elem.dataset.colmText = val;
+        else elem.dataset.colmText = "";
+        elem.value = text;
+      }
+      var event = new Event("ionChange");
+      elem.dispatchEvent(event);
+    });
+  }
+
+  handleDefaultValueResult(result) {
+    let data = {
+      text: result.GetDefaultValueList.P_VALUE_COLUMN_NAME,
+      value: result.GetDefaultValueList.P_ID_COLUMN_NAME
+    };
+    return data;
+  }
+
+  callValueSet() {
+    for (var i = 0; i < this.eitVALSettoCall.length; i++) {
+      this.getValueSet(this.eitVALSettoCall[i].SEGMENT_NAME);
+    }
+  }
+
+  getParentValue(parentValue) {
+    if (parentValue.length == 0) {
+      for (let i = 0; i < this.ceiResponse.length; i++) {
+        if (this.ceiResponse[i].SEGMENT_NAME == parentValue[0].Name) {
+          if (this.ceiResponse[i].VALIDATION_TYPE == "N") {
+            let val = (document.getElementById(
+              this.ceiResponse[i].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement).value;
+            return val;
+          } else {
+            let x = document.getElementById(
+              this.ceiResponse[i].APPLICATION_COLUMN_NAME
+            ) as HTMLSelectElement;
+            if (x.options.length > 0) {
+              let val = x.options[x.selectedIndex]
+                ? x.options[x.selectedIndex].value
+                : null;
+              return val;
+            } else {
+              return "";
+            }
+          }
+        }
+      }
+    } else {
+      return "";
+    }
+  }
+
+  public getValueSet(segmentName) {
+    let descFlexName: any = "";
+    let descFlexContextCode: any = "";
+    let parentValue: any = [];
+    let ParentsList: any = [];
+    let parentVal: any = null;
+    let dependenciesList: any = [];
+    let validationType: string = "";
+
+    for (let i = 0; i < this.ceiResponse.length; i++) {
+      if (this.ceiResponse[i].SEGMENT_NAME == segmentName) {
+        descFlexName = this.ceiResponse[i].DESC_FLEX_NAME;
+        descFlexContextCode = this.ceiResponse[i].DESC_FLEX_CONTEXT_CODE;
+        parentValue = this.ceiResponse[i].PARENT_SEGMENTS_VS_SplitedVS;
+        ParentsList = this.ceiResponse[i].PARENT_SEGMENTS_VS_SplitedVS;
+        validationType = this.ceiResponse[i].VALIDATION_TYPE;
+        break;
+      }
+    }
+    if (parentValue != "" && (validationType == "D" || validationType == "Y")) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList,
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    };
+
+    this.eitService.getSetValue(body).subscribe((result: any) => {
+      if (result.GetValueSetValuesList != null) {
+        this.fillDropdownList(segmentName, result.GetValueSetValuesList);
+      }
+    });
+    let arr: any = [];
+    return arr;
+  }
+
+  getDependenciesParams(parentsList) {
+    let parentArr: any = [];
+    for (let i = 0; i < parentsList.length; i++) {
+      for (let j = 0; j < this.ceiResponse.length; j++) {
+        if (this.ceiResponse[j].SEGMENT_NAME == parentsList[i].Name) {
+          if (this.ceiResponse[j].DISPLAY_FLAG != "N") {
+            if (this.ceiResponse[j].VALIDATION_TYPE == "N") {
+              let idColName: string;
+              let val: any;
+              if (
+                this.ceiResponse[j].FORMAT_TYPE == "Y" ||
+                this.ceiResponse[j].FORMAT_TYPE == "I"
+              ) {
+                //standard date time or //time
+                let elem = document.getElementById(
+                  this.ceiResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLDivElement;
+                val = elem.dataset.dtvalue;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.ceiResponse[j].FORMAT_TYPE == "Y")
+                  idColName = this.cs.formatStandardDate(val);
+              } else {
+                val = (document.getElementById(
+                  this.ceiResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement).value;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.ceiResponse[j].FORMAT_TYPE == "X") {
+                  //date
+                  // idColName = this.cs.formatDate(val);
+                  idColName = this.cs.formatDateNew(val);
+                }
+              }
+              parentArr.push({
+                SEGMENT_NAME: this.ceiResponse[j].SEGMENT_NAME,
+                VALUE_COLUMN_NAME: val,
+                DESCRIPTION: "",
+                ID_COLUMN_NAME: idColName,
+                FLEX_VALUE_SET_NAME: this.ceiResponse[j].FLEX_VALUE_SET_NAME
+              });
+              break;
+            } else {
+              if (this.ceiResponse[j].READ_ONLY != "Y") {
+                let x = document.getElementById(
+                  this.ceiResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLSelectElement;
+                let text = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].text
+                  : "";
+                let val = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].value
+                  : undefined;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.ceiResponse[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.ceiResponse[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              } else {
+                let x = document.getElementById(
+                  this.ceiResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement;
+                let text = x.value;
+                let val = x.dataset.colmText;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.ceiResponse[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.ceiResponse[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              }
+            }
+          } else {
+            let x = document.getElementById(
+              this.ceiResponse[j].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement;
+            let text = x.value;
+            let val = x.dataset.colmText;
+            if (
+              (val == undefined || val == "") &&
+              parentsList[i].IsRequired == "REQUIRED"
+            ) {
+              //alert(parentsList[i].Name +" Is required");
+              return false;
+            } else {
+            }
+            if (text == undefined) {
+              text = "";
+            }
+            parentArr.push({
+              SEGMENT_NAME: this.ceiResponse[j].SEGMENT_NAME,
+              VALUE_COLUMN_NAME: text,
+              DESCRIPTION: "",
+              ID_COLUMN_NAME: val,
+              FLEX_VALUE_SET_NAME: this.ceiResponse[j].FLEX_VALUE_SET_NAME
+            });
+            break;
+          }
+        }
+      }
+    }
+    return parentArr;
+  }
+
+  emptyChildElement(segmentName) {
+    let elem = this.getElementByName(segmentName);
+    elem.value = null;
+    elem.innerHTML = "";
+    if ("dtvalue" in elem.dataset) {
+      elem.dataset.dtvalue = "";
+    }
+    if ("colmText" in elem.dataset) {
+      elem.dataset.colmText = "";
+    }
+    var event = new Event("change");
+    elem.dispatchEvent(event);
+    elem.classList.remove("requiredClassElm");
+  }
+
+  getRequiredFilds() {
+    for (let i = 0; i < this.ceiResponse.length; i++) {
+      if (this.ceiResponse[i].REQUIRED_FLAG == "Y") {
+        let elemVal = (document.getElementById(
+          this.ceiResponse[i].APPLICATION_COLUMN_NAME
+        ) as HTMLInputElement).value;
+        if (elemVal == "") {
+          //alert(this.ceiResponse[i].SEGMENT_NAME+" is required");
+          break;
+        }
+      }
+    }
+  }
+
+  getElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.ceiResponse.length; i++) {
+      if (this.ceiResponse[i].SEGMENT_NAME == segmentName) {
+        elemID = this.ceiResponse[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return document.getElementById(elemID) as HTMLInputElement;
+  }
+
+  getSelectElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.ceiResponse.length; i++) {
+      if (this.ceiResponse[i].SEGMENT_NAME == segmentName) {
+        elemID = this.ceiResponse[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return elemID;
+  }
+
+  isStandardDate(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+      // standard date
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+  isStandardDateTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+  isStandardTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  isStandardDateVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+      // standard date
+      //  if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      // }
+    }
+    return isSt;
+  }
+  isStandardDateTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      //if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      //}
+    }
+    return isSt;
+  }
+  isStandardTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard  time
+      //if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      //}
+    }
+    return isSt;
+  }
+
+  fillEITStructure() {
+    var obj = { peiObjVer: null, peiExtraInfoID: null };
+    for (let i = 0; i < this.validateEitObj.length; i++) {
+      let val: any;
+      if (this.validateEitObj[i].VARCHAR2_VALUE)
+        val = this.validateEitObj[i].VARCHAR2_VALUE;
+      else if (this.validateEitObj[i].DATE_VALUE)
+        val = this.validateEitObj[i].DATE_VALUE;
+      else if (this.validateEitObj[i].NUMBER_VALUE)
+        val = this.validateEitObj[i].NUMBER_VALUE;
+      const elem = document.getElementById(
+        this.validateEitObj[i].APPLICATION_COLUMN_NAME
+      ) as HTMLInputElement;
+      //obj.transactionNo=this.validateEitObj[i].TRANSACTION_NUMBER;
+      if (elem) {
+        if (val) {
+          let feldDetails = this.ceiResponse.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.validateEitObj[i].APPLICATION_COLUMN_NAME
+          );
+          if (feldDetails) {
+            let isStandardDate = this.isStandardDateVal(feldDetails);
+            let isStandardDateTime = this.isStandardDateTimeVal(feldDetails);
+            let isStandardTime = this.isStandardTimeVal(feldDetails);
+            if (isStandardDate) {
+              elem.value = this.cs.reverseFormatDate(val);
+            } else if (isStandardDateTime) {
+              elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+              elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+            } else if (isStandardTime) {
+              elem.innerHTML = val;
+              elem.dataset.dtvalue = val;
+            } else {
+              elem.value = val;
+              elem.setAttribute("value", elem.value);
+            }
+            if (
+              feldDetails.DISPLAY_FLAG == "N" ||
+              (feldDetails.VALIDATION_TYPE != "N" &&
+                feldDetails.READ_ONLY == "Y")
+            ) {
+              elem.dataset.colmText = val;
+              elem.value = this.validateEitObj[i].SEGMENT_VALUE_DSP;
+              elem.setAttribute("value", elem.value);
+            }
+          }
+          elem.dataset.hiddenval = val; //hide the value to set it after calling get value set
+          if (
+            feldDetails.CHILD_SEGMENTS_VS_Splited &&
+            feldDetails.CHILD_SEGMENTS_VS_Splited.length > 0
+          ) {
+            let listArray: any = feldDetails.CHILD_SEGMENTS_VS_Splited;
+            listArray.forEach(element => {
+              this.getValueSet(element);
+            });
+          }
+          //  var event = new Event('change');
+          // elem.dispatchEvent(event);
+        }
+      } else {
+        if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME ==
+          "CEI_OBJECT_VERSION_NUMBER"
+        )
+          obj.peiObjVer = this.validateEitObj[i].NUMBER_VALUE;
+        else if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME == "CONTACT_EXTRA_INFO_ID"
+        )
+          obj.peiExtraInfoID = this.validateEitObj[i].NUMBER_VALUE;
+      }
+    }
+    this.ExtraObj = obj;
+  }
+
+  public getElementsValues(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = this.comtransNo;
+    let textValue : any;
+    // if(this.ExtraObj.transactionNo)
+    // transNo=this.ExtraObj.transactionNo;
+    for (let i = 0; i < this.ceiResponse.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+      /*********set transaction No of the updated object ********/
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.ceiResponse[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+      }
+      if (this.ceiResponse[i].DISPLAY_FLAG != "N") {
+        if (this.ceiResponse[i].VALIDATION_TYPE == "N") {
+          let elem = document.getElementById(
+            this.ceiResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement;
+          let elemVal = (document.getElementById(
+            this.ceiResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement).value;
+          textValue = elemVal;
+          //let elemVal= (<HTMLInputElement>document.getElementById(this.ceiResponse[i].APPLICATION_COLUMN_NAME)).value;
+          if (
+            this.ceiResponse[i].FORMAT_TYPE == "X" &&
+            this.ceiResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //date
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.ceiResponse[i].FORMAT_TYPE == "Y" &&
+            this.ceiResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //standard date time
+            // elemVal = elem.dataset.dtvalue;
+            // elemVal = this.cs.formatStandardDate(elemVal);
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.ceiResponse[i].FORMAT_TYPE == "I" &&
+            this.ceiResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //time
+            if(elemVal.length>5){
+            elemVal = elemVal.substring(11, 16);
+          }else{
+            elemVal = elemVal;
+          }
+          }
+          if (this.ceiResponse[i].REQUIRED_FLAG == "Y" && !elemVal) {
+            elem.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            elem.classList.remove("requiredClassElm");
+          }
+         // if (elemVal != 'null'){
+            varcharValue = elemVal;
+          //} else{
+         //   elemVal = null;
+        //  }
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.ceiResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(
+            this.ceiResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLSelectElement;
+          if (this.ceiResponse[i].READ_ONLY == "Y") {
+            let text = x.value;
+            let val = x.dataset.colmText;
+            varcharValue = val;
+            textValue = text;
+          } else {
+            let val = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].value
+              : null;
+            let txt = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].text
+              : null;
+            varcharValue = val;
+            textValue = txt;
+          }
+          if (this.ceiResponse[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+            x.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.ceiResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } //end else
+      } else {
+        let x = document.getElementById(
+          this.ceiResponse[i].APPLICATION_COLUMN_NAME
+        ) as HTMLSelectElement;
+        let val = x.dataset.colmText;
+        textValue = x.value;
+        if (this.ceiResponse[i].REQUIRED_FLAG == "Y" && !val) {
+          x.classList.add("requiredClassElm");
+          //this.common.showRequiredMsg();
+          return false;
+        } else {
+          x.classList.remove("requiredClassElm");
+        }
+        if (val) varcharValue = val;
+        valuseArr.push({
+          TRANSACTION_NUMBER: transNo,
+          NAME: this.ceiResponse[i].APPLICATION_COLUMN_NAME,
+          VARCHAR2_VALUE: varcharValue,
+          NUMBER_VALUE: numbervalue,
+          DATE_VALUE: dateValue
+        });
+      }
+
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.ceiResponse[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        y.VARCHAR2_VALUE = varcharValue;
+        y.NUMBER_VALUE = numbervalue;
+        y.DATE_VALUE = dateValue;
+        y.SEGMENT_VALUE_DSP = textValue;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+        this.updatedValues.push(y);
+      } else {
+        if (this.validateEitObj && this.eitSubmitAction == EIT_ACTION.UPDATE) {
+          let updatedObj = this.validateEitObj.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.ceiResponse[i].APPLICATION_COLUMN_NAME
+          );
+          let y = updatedObj;
+          y.VARCHAR2_VALUE = varcharValue;
+          y.NUMBER_VALUE = numbervalue;
+          y.DATE_VALUE = dateValue;
+          y.SEGMENT_VALUE_DSP = textValue;
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        } else {
+          let y = {
+            TRANSACTION_NUMBER: transNo,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue,
+            SEGMENT_VALUE_DSP: textValue,
+            APPLICATION_COLUMN_NAME: this.ceiResponse[i]
+              .APPLICATION_COLUMN_NAME,
+            DATATYPE: this.ceiResponse[i].DATATYPE,
+            DESC_FLEX_CONTEXT_CODE: this.ceiResponse[i].DESC_FLEX_CONTEXT_CODE,
+            DESC_FLEX_NAME: this.ceiResponse[i].DESC_FLEX_NAME,
+            DISPLAY_FLAG: this.ceiResponse[i].DISPLAY_FLAG,
+            SEGMENT_NAME: this.ceiResponse[i].SEGMENT_NAME,
+            SEGMENT_PROMPT: this.ceiResponse[i].SEGMENT_PROMPT
+          };
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        }
+      }
+    } // end for
+
+    if (this.getPassdirfromNotifiPage) {
+      let updatedObj1 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_ACTION"
+      );
+      let updatedObj2 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "CONTACT_EXTRA_INFO_ID"
+      );
+      let updatedObj3 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "CEI_OBJECT_VERSION_NUMBER"
+      );
+      this.updatedValues.push(updatedObj1);
+      this.updatedValues.push(updatedObj2);
+      this.updatedValues.push(updatedObj3);
+      valuseArr = this.fillExtraInformation(
+        valuseArr,
+        updatedObj1.VARCHAR2_VALUE,
+        updatedObj2.NUMBER_VALUE,
+        updatedObj3.NUMBER_VALUE,
+        transNo
+      );
+    } else {
+      if (this.eitSubmitAction == EIT_ACTION.ADD) {
+        this.updatedValues = this.fillExtraValuesUpdated(
+          this.updatedValues,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.UPDATE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "UPDATE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.DELETE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "DELETE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      }
+    }
+    return valuseArr;
+  } // end getElementsValues
+
+  fillExtraValuesUpdated(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    let obj1 = {
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null,
+      SEGMENT_VALUE_DSP: "",
+      APPLICATION_COLUMN_NAME: "PEI_ACTION",
+      DATATYPE: "VARCHAR2",
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj2 = {
+      TRANSACTION_NUMBER: 1,
+      APPLICATION_COLUMN_NAME: "CEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATATYPE: "NUMBER",
+      SEGMENT_VALUE_DSP: "",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj3 = {
+      APPLICATION_COLUMN_NAME: "CONTACT_EXTRA_INFO_ID",
+      DATATYPE: "NUMBER",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      NUMBER_VALUE: peiExtraInfoID,
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: "",
+      SEGMENT_VALUE_DSP: "",
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: null
+    };
+    values.push(obj1);
+    values.push(obj2);
+    values.push(obj3);
+    return values;
+  }
+  fillExtraInformation(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_ACTION",
+      VARCHAR2_VALUE: 'NEW_ROW',
+      NUMBER_VALUE: null,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "CONTACT_EXTRA_INFO_ID",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: 0,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "CEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: 0,
+      DATE_VALUE: null
+    });
+    return values;
+  }
+
+  submitEit() {
+    let list = this.ceiRequest.EITTransactionTBL;
+    this.ceiRequest.EITTransactionTBL = this.fixTransactionNo(list);
+    this.eitService
+      .submitChildEducation(this.ceiRequest)
+      .subscribe((result: AddCeiResponse) => {
+        this.handleSubmitEitResult(result);
+      });
+  }
+
+  fixTransactionNo(transactionTBL: any): any[] {
+    let list: any = [];
+    let newIndex: number = 1;
+    let length: number = transactionTBL.length;
+    if (length > 0) {
+      for (let i = 0; i < length; i++) {
+        //  let item :any={};
+        const item = Object.assign({}, transactionTBL[i]);
+        let transNo: number = item.TRANSACTION_NUMBER;
+        let obj: any = item;
+        if (i == 0) {
+          obj.TRANSACTION_NUMBER = newIndex;
+          list.push(obj);
+        } else {
+          let prevEl: any = transactionTBL[i - 1].TRANSACTION_NUMBER;
+          if (transNo == prevEl) {
+            obj.TRANSACTION_NUMBER = newIndex;
+            list.push(obj);
+          } else {
+            newIndex++;
+            obj.TRANSACTION_NUMBER = newIndex;
+            list.push(obj);
+          }
+        }
+      }
+    }
+    return list;
+  }
+
+
+  public handleSubmitEitResult(result) {
+    if (this.cs.validResponse(result)) {
+      this.cs.sharedService.setSharedData(this.ceiRequest, CeiRequest.SHARED_DATA);
+      this.cs.sharedService.setSharedData(result, AddCeiResponse.SHARED_DATA);
+      this.cs.openConfirmCEIPage();
+    }
+  }
+
+  public submitChildEducationTransaction() {
+    this.arrValues = this.getElementsValues();
+    if (this.arrValues) {
+      this.ceiRequest = {
+        P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+        P_MENU_TYPE: this.menuType,
+        P_SELECTED_RESP_ID: this.respID,
+        P_FUNCTION_NAME: this.functionName,
+        P_CONTACT_RELATIONSHIP_ID: this.selectedContactData.CONTACT_RELATIONSHIP_ID,
+        P_DESC_FLEX_CONTEXT_CODE: this.ceiResponse[0].DESC_FLEX_CONTEXT_CODE,
+        EITTransactionTBL: this.arrValues
+      };
+
+      this.eitService.submitChildEducation(this.ceiRequest).subscribe((result: any) => {
+          this.handleSubmitEitResult(result);
+      });
+    }
+  }
+}
+
diff --git a/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html
new file mode 100644
index 00000000..55aeadb4
--- /dev/null
+++ b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html
@@ -0,0 +1,69 @@
+<app-generic-header
+  showImage="false"
+  showBack="true"
+  [headerText]="'eit,cei' | translate">
+</app-generic-header>
+
+<ion-content style="--background: #f5f5f5;">
+  <!-- <div class="head-title">
+
+  </div> -->
+
+  <div padding>
+    <ion-radio-group [(ngModel)]="selectedServiceType">
+      <ion-item *ngFor="let user of familyMemberData" lines='none'
+        style="padding-bottom: 10px; border-radius: 10px 10px 25px 25px;">
+        <ion-grid>
+          <ion-row>
+            <ion-col size='6'>
+              <h2 style="font-weight: bold; font-size: 15px;">{{user.CONTACT_NAME}}</h2>
+            </ion-col>
+            <ion-col size='6'>
+              <div class='family-member-button'>
+                <ion-label>
+                  <p style="white-space: pre-line; font-size: 11px;">{{ts.trPK('eit','relationship-start-date')}}</p>
+                </ion-label>
+                <ion-label>
+                  <p style="color: black;">12/31/2022</p>
+                </ion-label>
+              </div>
+            </ion-col>
+          </ion-row>
+          <ion-row>
+            <ion-col size='6'>
+              <ion-label>
+                <p style="font-weight: bold; font-size: 14px; white-space:pre-wrap">{{user.RELATIONSHIP}}</p>
+              </ion-label>
+            </ion-col>
+            <ion-col size='6'>
+              <div class='family-member-button'>
+                <ion-label>
+                  <p style="white-space: pre-line; font-size: 11px;">{{ts.trPK('eit','relationship-end-date')}}</p>
+                </ion-label>
+                <ion-label>
+                  <p style="color: black;">12/31/2022</p>
+                </ion-label>
+              </div>
+            </ion-col>
+          </ion-row>
+        </ion-grid>
+        <ion-radio mode="md" slot="start" [value]="user" [color]="myColor" (click)='selectedUser(user)'></ion-radio>
+      </ion-item>
+    </ion-radio-group>
+  </div>
+
+</ion-content>
+
+
+<ion-footer class="footer">
+  <div class="Btn">
+  <ion-button  class="CreateBtn" (click)="gotoTransactionsPage()" >{{'vacation-rule, next-label' | translate}}</ion-button>
+</div>
+</ion-footer>
+
+<!-- <ion-footer style="background: #f5f5f5 !important;">
+  <div class="centerDiv" (click)="gotoTransactionsPage()">
+    <ion-button  ion-button style="background: #269db8 !important; --background: #269db8">
+      {{'vacation-rule, next-label' | translate}}</ion-button>
+  </div>
+</ion-footer> -->
\ No newline at end of file
diff --git a/Mohem/src/app/eit/cei-homepage/cei-homepage.component.scss b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.scss
new file mode 100644
index 00000000..9bcdab44
--- /dev/null
+++ b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.scss
@@ -0,0 +1,40 @@
+@media screen and (min-width: 300px){
+    .CreateBtn{
+--background: var(--newgreen) !important;
+background: var(--newgreen) !important;
+white-space: normal;
+color: var(--light);
+text-transform: capitalize;
+min-height: 1.0cm;
+--border-radius: 7px !important;
+border-radius: 7px !important;
+--min-height: 1.6cm !important;
+width: 315px;
+font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+}}
+
+@media screen and (min-width: 1px) and (max-width:290px) {
+.CreateBtn{
+--background: var(--newgreen) !important;
+background: var(--newgreen) !important;
+white-space: normal;
+color: var(--light);
+text-transform: capitalize;
+min-height: 1.0cm;
+--border-radius: 7px !important;
+border-radius: 7px !important;
+--min-height: 1.6cm !important;
+width: 257px;
+font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+}}
+
+.footer{
+padding: 15px 0px;
+background-color: var(--light) !important;
+border: 0px !important;
+box-shadow: none !important;
+-webkit-box-shadow: none;
+}
+.Btn{
+margin: auto; text-align: center; display: block;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/eit/cei-homepage/cei-homepage.component.spec.ts b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.spec.ts
new file mode 100644
index 00000000..3ebdf92c
--- /dev/null
+++ b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CeiHomepageComponent } from './cei-homepage.component';
+
+describe('CeiHomepageComponent', () => {
+  let component: CeiHomepageComponent;
+  let fixture: ComponentFixture<CeiHomepageComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ CeiHomepageComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CeiHomepageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/eit/cei-homepage/cei-homepage.component.ts b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.ts
new file mode 100644
index 00000000..4db964a0
--- /dev/null
+++ b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.ts
@@ -0,0 +1,51 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { EitService } from '../services/eit.service';
+
+@Component({
+  selector: 'app-cei-homepage',
+  templateUrl: './cei-homepage.component.html',
+  styleUrls: ['./cei-homepage.component.scss'],
+})
+export class CeiHomepageComponent implements OnInit {
+
+  public familyMemberData;
+  public selectedServiceType;
+  public direction: string;
+  myColor: string = 'secondary';
+  constructor(
+    private eitService: EitService,
+    public ts: TranslatorService,
+    public cs: CommonService
+    ) {}
+
+
+  ngOnInit() {
+    this.getContactInfo();
+  }
+
+  public getContactInfo () {
+    this.eitService.getContactInfo({
+      P_MENU_TYPE: 'E',
+      P_SELECTED_RESP_ID: -999
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      if (this.cs.validResponse(response)) {
+        this.familyMemberData = response['GetEmployeeContactsList'];
+        this.selectedServiceType = this.familyMemberData[0];
+        console.log(this.familyMemberData);
+      }
+    });
+  }
+
+  public gotoTransactionsPage() {
+    console.log(this.selectedServiceType);
+    this.cs.sharedService.setSharedData(this.selectedServiceType, 'selectedContactFORChildEducation');
+    this.cs.openCEIListPage();
+  }
+
+  public selectedUser(user){
+    this.selectedServiceType = user;
+  }
+
+}
diff --git a/Mohem/src/app/eit/cei-list/cei-list.component.html b/Mohem/src/app/eit/cei-list/cei-list.component.html
new file mode 100644
index 00000000..31f62243
--- /dev/null
+++ b/Mohem/src/app/eit/cei-list/cei-list.component.html
@@ -0,0 +1,42 @@
+<app-generic-header
+  showBack="true"
+  [headerText]="headerTitle">
+</app-generic-header>
+
+  <ion-content>
+    <div>
+        <div class="no-dataDiv"
+          *ngIf="!getResCEITransactionList || getResCEITransactionList[0]?.Collection_Transaction.length <= 0">
+          <ion-row>
+            <img class="empty-data" src="../assets/imgs/box.png" />
+          </ion-row>
+          <h4> {{'general, noData' | translate}}</h4>
+        </div>
+
+        <div *ngIf="getResCEITransactionList && getResCEITransactionList[0]?.Collection_Transaction.length > 0 ">
+          <div *ngFor="let EITTransactionList of getResCEITransactionList; let i=index ">
+              <ion-grid>
+                <div>
+                </div>
+                <ion-grid class="grids">
+                <div *ngFor="let item of EITTransactionList.Collection_Transaction">
+                    <ion-row  *ngIf="item.DISPLAY_FLAG != 'N' " class="">
+                        <ion-col class="" *ngIf="item.SEGMENT_PROMPT!=''">
+                            <label style="color:#269DB8;font-weight: bold;" class="label" for="">{{item.SEGMENT_PROMPT}} </label>
+                            <br>
+                            <label  class="label" style="color:black;" for="">{{item.SEGMENT_VALUE_DSP}} </label>
+                            <br>
+                            <hr style="background-color: grey;height: 1px">
+                        </ion-col>
+                    </ion-row>
+                </div>
+              </ion-grid>
+              </ion-grid>
+          </div>
+        <div>
+      
+    </div>
+        </div>
+    </div>
+  </ion-content>
+<ion-icon class="addClass" name="add" (click)="addCEIRrq()"></ion-icon>
diff --git a/Mohem/src/app/eit/cei-list/cei-list.component.scss b/Mohem/src/app/eit/cei-list/cei-list.component.scss
new file mode 100644
index 00000000..28b2905f
--- /dev/null
+++ b/Mohem/src/app/eit/cei-list/cei-list.component.scss
@@ -0,0 +1,330 @@
+.footer-button {
+    border-radius: 2px;
+    padding: 0 1.1em;
+    min-height: 45px;
+    min-width: 200px;
+  }
+  
+  .datetime{
+    text-align: center;
+    font-family: WorkSans-Bold;
+    margin-left: 47px;
+    margin-top: -19px;
+  
+   } 
+  .iconCalendar{
+    margin-left: 30px !important;
+    width: 22% !important;
+    height: 26px !important;
+    margin-top: -69px !important;
+    margin-bottom: 20px !important;
+   } 
+  h4 {
+    font-size: 2.2rem;
+    text-align: center;
+    color: #000000;
+  }
+  .grids{
+    border-radius: 20px !important;
+    background: white;
+    padding-left: 1px;
+    padding-right: 1px;
+    margin: 13px;
+    padding-top: 0px;
+    padding-bottom: 3px;
+    padding-left: 13px;
+    padding-right: 13px;
+    border: 1px solid #cac8c8;
+   }
+  
+   .bgcolor {
+  
+    color: white;
+    border-top-right-radius: 19px;
+    border-top-left-radius: 15px;
+    padding-top: 1;
+    padding-bottom: 0;
+    margin-top: 0;
+    margin-bottom: 0;
+    /* border-radius: 12px !important; */
+    background: #269DB8;
+    border-bottom: 1px solid #a7a4a4;
+    border-top: 1px solid #cac8c8;
+    margin-left: -13px;
+    margin-right: -13px;
+  }
+  .colEit{
+    border-right: 1px solid #cac8c8;
+      border-bottom-left-radius: -10px !important;
+      padding-top: 8px;
+      padding-bottom: 8px;
+      margin-left: 18px;
+      font-size: 12px !important;
+  }
+  
+  .header-div {
+    
+    background-color: #269DB8;
+    text-transform: capitalize;
+    height: 160px;
+    // position: relative;
+    display: block;
+    margin-bottom: -28px;
+  }
+  
+  .header-toolbar-new{
+    --background: #269DB8;
+  }
+  
+  .addClass{
+    background-color: #269DB8;
+        width: 80px;
+        height: 80px;
+        right: 8%;
+        position: fixed;
+        color: white;
+        bottom: 5%;
+        border-radius: 50%;
+        z-index: 999;
+        -webkit-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59);
+        -moz-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59);
+        box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59);
+  }
+  
+  .contentEit:before {
+    position: absolute;
+  content: "";
+  // background: #269DB8;
+  height: 140px;
+  width: 100%;
+  left: 0;
+  top: 0px;
+  z-index: 1;
+  }
+  
+  .hrClass{
+    border-width: 0;
+      box-sizing: content-box;
+      border-bottom: 1px solid #e6e6e6;
+      background: #fff !important;
+      height: 1px;
+  }
+  
+  ////////////////////////////////
+  .content:before {
+    position: absolute;
+  content: "";
+  background: #269DB8;
+  height: 140px;
+  width: 100%;
+  left: 0;
+  top: 0px;
+  z-index: 1;
+  }
+  
+  
+  .colorBG{
+    --background: #f0efef;
+   }
+  
+  .Title{
+    text-align: center;
+    color: white;
+    margin-top: -33px;
+    font-size: 17px;
+  }
+  .title{
+    text-align: center;
+    color: black;
+    margin-top: 5px;
+    font-size: 17px;
+  }
+  .today-graph{
+    display: block !important;
+    height: 196px;
+    width: 365px;
+    /* padding-left: 51px; */
+    margin-left: 28px !important;
+  }
+  
+     .headerGrid{
+      background-color: white !important;
+      border: 1px solid #cac8c8 !important;
+      padding-bottom: 53px;
+      padding-top: -30px;
+      margin-left: 13px;
+      margin-right: 13px;
+      margin-bottom: 10px;
+      position: relative;
+      z-index: 1;
+      border-radius: 20px;
+      margin-top: 17px;
+     }
+     .result-graph{
+      font-size: 14px;
+      margin-left: -48px;
+      margin-right: 3px;
+      margin-bottom: -30px;
+  
+  
+  
+     }
+  
+     .green-label{
+      font-size: 15px !important;
+      margin-left: 7px !important;
+      margin-right: 42px;
+      }
+      .green-label-ar{
+        font-size: 15px !important;
+        margin-left: 7px !important;
+        margin-right: 15px;
+      }
+      .blue-label{
+        font-size: 15px !important;
+        margin-left: 7px !important;
+        margin-right: 13px;
+        }
+        .light-label{
+          font-size: 15px !important;
+          margin-left: 7px !important;
+          margin-right: -26px;
+          }
+        .light-label-ar{
+          font-size: 15px !important;
+          margin-right: 7px !important;
+          margin-left: -26px;
+        }  
+  
+        .light-dote{ 
+          background-color: #3CB9D5;
+          width: 12px;
+          height: 12px;
+          border-radius: 50% !important;
+          display: inline-block;
+        }
+        .blue-dote{
+        
+                  background-color: #269DB8;
+                  width: 12px;
+                  height: 12px;
+                  border-radius: 50% !important;
+                  display: inline-block;
+        }
+        .green-dote{
+          background-color: #1FA269;
+          width: 12px;
+          height: 12px;
+          border-radius: 50% !important;
+          display: inline-block;
+          margin-right: -1px;
+        }
+        .col{
+          text-align: right;
+        }
+    
+        .gridService{
+      
+            /* margin-top: 87px; */
+      border-radius: 10px;
+      /* margin-bottom: -49px; */
+      margin-left: 14px;
+      margin-right: 14px;
+         
+        }
+        .columns{
+          margin: 3px;
+          margin-bottom: 13px;
+          background: white;
+          border-radius: 27px;
+          padding-left: 30px;
+          padding-right: 6px;
+          padding-top: 19px;
+          padding-bottom: 8px;
+          border: 1px solid #cac8c8 !important;
+        }
+       
+      
+        .service{
+          font-size: 22px;
+          color: black;
+          letter-spacing: 1px;
+          font-weight: bold;
+        }
+        .services{
+      
+          font-size: 12px;
+          color: black;
+        }
+  
+        .adult-dote{
+          background-color: #3CB9D5;
+          width: 15px;
+          height: 15px;
+          border-radius: 50% !important;
+          display: inline-block;
+          margin-left: -17px;
+          margin-right: 5px;
+        }
+  
+        .adult-dote-ar{
+          background-color: #3CB9D5;
+          width: 15px;
+          height: 15px;
+          border-radius: 50% !important;
+          display: inline-block;
+          margin-right: 0px;
+          margin-left: 5px;
+        }
+        .child-dote{
+        
+                  background-color: #269DB8;
+                  width: 15px;
+                  height: 15px;
+                  border-radius: 50% !important;
+                  display: inline-block;
+                  margin-left: -17px;
+                  margin-right: 5px;
+        }
+        .child-dote-ar{
+          background-color: #269DB8;
+          width: 15px;
+          height: 15px;
+          border-radius: 50% !important;
+          display: inline-block;
+          margin-right: 1px;
+          margin-left: 5px;
+        }
+        .infants-dote{
+          background-color: #1FA269;
+          width: 15px;
+          height: 15px;
+          border-radius: 50% !important;
+          display: inline-block;
+          margin-left: -17px;
+          margin-right: 5px;
+          // margin-bottom: 6px;
+        }
+  
+        .infants-dote-ar{
+          background-color: #1FA269;
+          width: 15px;
+          height: 15px;
+          border-radius: 50% !important;
+          display: inline-block;
+          margin-right: 1px;
+          margin-left: 5px;
+        }
+        .addEitOkButton{
+          white-space: normal !important;
+          text-transform: capitalize !important;
+          min-height: 45px !important;
+          min-width: 5px !important;
+          margin: 8px !important;
+          background-color: #269DB8;
+          width: 80% !important;
+          color: white!important;
+          border-radius: 16px !important;
+        }
+       
+  
\ No newline at end of file
diff --git a/Mohem/src/app/eit/cei-list/cei-list.component.spec.ts b/Mohem/src/app/eit/cei-list/cei-list.component.spec.ts
new file mode 100644
index 00000000..ef47a3a9
--- /dev/null
+++ b/Mohem/src/app/eit/cei-list/cei-list.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CeiListComponent } from './cei-list.component';
+
+describe('CeiListComponent', () => {
+  let component: CeiListComponent;
+  let fixture: ComponentFixture<CeiListComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ CeiListComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CeiListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/eit/cei-list/cei-list.component.ts b/Mohem/src/app/eit/cei-list/cei-list.component.ts
new file mode 100644
index 00000000..2b7aeec3
--- /dev/null
+++ b/Mohem/src/app/eit/cei-list/cei-list.component.ts
@@ -0,0 +1,127 @@
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { EITTransactionsRequest } from './../models/EITTransactionsReq';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { Component, OnInit } from '@angular/core';
+import { EitService } from '../services/eit.service';
+import { EIT_ACTION } from '../models/submit.eit.action';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
+
+@Component({
+  selector: 'app-cei-list',
+  templateUrl: './cei-list.component.html',
+  styleUrls: ['./cei-list.component.scss'],
+})
+export class CeiListComponent implements OnInit {
+  Sdate: any;
+  emp_no: any;
+  balance:any;
+  P_PAGE_NUM: number;
+  P_PAGE_LIMIT: number;
+  IsReachEnd = false;
+  userName: any;
+  isDelete = false;
+  getResCEITransactionList: any = [];
+  eitAddedList: any = [];
+  getPassMnuEntryObj: any;
+  selMenu: MenuResponse = new MenuResponse();
+  CEITransactionsListObj: EITTransactionsRequest = new EITTransactionsRequest();
+  selEmp: string;
+  respID: number;
+  transactionNo = 0;
+  menuType = '';
+  public functionName = '';
+  private pAction = 0;
+  public headerTitle = '';
+  data: any;
+  accrualNetInfants: any;
+  accrualUNetChild: any;
+  accrualNetAdult: any;
+
+  public options = {
+    cutoutPercentage: 80,
+    tooltips: { enabled: false },
+    legend: { display: false }};
+    gaugeType = 'full';
+  accrualBalancesList: any;
+  common: any;
+  direction: string;
+
+  constructor(
+    private cs: CommonService,
+    private EITService: EitService,
+    public ts: TranslatorService,
+    public authService:AuthenticationService,) {
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
+    this.selEmp = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false);
+    this.respID = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_RESP_ID, false);
+    this.getPassMnuEntryObj = this.selMenu.GetMenuEntriesList;
+    this.menuType = this.selMenu.List_Menu.MENU_TYPE;
+    this.transactionNo = 0;
+    this.functionName = this.getPassMnuEntryObj.FUNCTION_NAME;
+    this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+    this.P_PAGE_NUM = 1;
+    this.P_PAGE_LIMIT = 100;
+  }
+
+  ngOnInit() {
+    this.getCEITransactions();
+  }
+
+
+  public getCEITransactions() {
+    this.IsReachEnd = false;
+    this.CEITransactionsListObj.P_PAGE_LIMIT = this.P_PAGE_LIMIT;
+    this.CEITransactionsListObj.P_PAGE_NUM = this.P_PAGE_NUM;
+    this.CEITransactionsListObj.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp;
+    this.CEITransactionsListObj.P_SELECTED_RESP_ID = this.respID;
+    this.CEITransactionsListObj.P_MENU_TYPE = this.selMenu.List_Menu.MENU_TYPE;
+    this.CEITransactionsListObj.P_FUNCTION_NAME = this.getPassMnuEntryObj.FUNCTION_NAME;
+    this.EITService.getCEITransactionsList(this.CEITransactionsListObj).
+      subscribe((result: any) => {
+        this.handleCEITransactionsResult(result);
+      });
+  }
+
+  public handleCEITransactionsResult(result) {
+    if (this.cs.validResponse(result)) {
+      if (this.cs.hasData(result.GetEITTransactionList)) {
+        this.getResCEITransactionList = result.GetEITTransactionList;
+        this.P_PAGE_NUM++;
+        this.CEITransactionsListObj.P_PAGE_NUM = this.P_PAGE_NUM;
+        const lastItemIndex = this.getResCEITransactionList.length - 1;
+        if (result.GetEITTransactionList[lastItemIndex] && result.GetEITTransactionList[lastItemIndex].Collection_Transaction[0]) {
+          const lastitem = result.GetEITTransactionList[lastItemIndex].Collection_Transaction[0];
+          // tslint:disable-next-line: triple-equals
+          if (lastitem.NO_OF_ROWS == lastitem.ROW_NUM) {
+            this.IsReachEnd = true;
+          } else {
+            this.IsReachEnd = false;
+          }
+        }
+      }
+    }
+  }
+
+  public addCEIRrq(i?) {
+    this.pAction = EIT_ACTION.ADD;
+    this.cs.sharedService.setSharedData(this.pAction, EITTransactionsRequest.SUBMIT_EIT_ACTION);
+    this.openCEINew(i);
+  }
+
+  openCEINew(index) {
+    let item: any = [];
+    if (this.pAction == EIT_ACTION.UPDATE) {
+      item = this.getResCEITransactionList[index].Collection_Transaction;
+    }
+    this.transactionNo++;
+    // tslint:disable-next-line: max-line-length
+    this.cs.sharedService.setSharedData({ dirfromNotificationPage: false, submitEITObjList: undefined, transNo: this.transactionNo }, 'AddEITData');
+    this.cs.openAddCEIPage();
+  }
+
+}
+
+
+
diff --git a/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.html b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.html
new file mode 100644
index 00000000..6c5d2842
--- /dev/null
+++ b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.html
@@ -0,0 +1,127 @@
+<ion-header>
+  <ion-toolbar class="header-toolbar-new">
+    <nav-buttons></nav-buttons>
+    <ion-title [ngClass]=" direction === 'en' ?  'title' : 'title-ar'"  color="light">{{headerTitle}}</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+
+<ion-content>
+<!-------------------------------Start New design ---------------------------------------->
+<ion-grid>
+  <ion-row style="margin-top: 20px;margin-left: 12px;">
+  <ion-col>
+  <div size="10" [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'" >{{'general, addAttach' | translate}}</div>
+  </ion-col>
+  <ion-col style="padding-left: 7%;" size="2">
+    <div class="fileDiv">
+       <input end class="inputfile" style="margin-top: 10px;z-index: 99999;position: absolute;opacity: 0;" type="file" ng2FileSelect [uploader]="uploader"
+        (change)="onFileSelected($event)" (click)="onFileSelectedclick($event)" />
+      <label end for="file" class="attachLable">
+        <ion-icon style="font-size: 22px;" name="add"></ion-icon>
+      </label></div>
+  </ion-col>
+</ion-row>
+  <ion-item class="attachmentDiv" *ngIf="attachListOver?.length == 0">
+      <ion-img style="height: 26px;width:100%;margin-top:12px" src="../assets/imgs/attach-icon.png"></ion-img>
+      <ion-label style="margin-top: -24px;" position="floating" class="boldTxtNav">{{ 'general, notAttch' | translate}}</ion-label>
+  </ion-item>
+</ion-grid>
+
+<ion-grid class="attachmentDiv" *ngIf="attachListOver?.length > 0">
+  <div *ngFor="let attachList of attachListOver ; let i = index">
+    <ion-row>
+      <ion-col size="1">
+        <ion-label style="color: black !important;">
+          {{attachList.AttachmentID +1 }} .
+         </ion-label>
+      </ion-col>
+      <ion-col style="text-align: left;" size="10">
+        <ion-label style="color: blue !important;" (click)="OpenAttachFiles(attachList.P_FILE_DATA,attachList.P_FILE_CONTENT_TYPE)">
+          {{attachList.P_FILE_NAME }}
+         </ion-label>
+      </ion-col>
+      <ion-col size="1">
+        <button float-end [disabled]="attachList.isSuccess" class="attachImgBtn removeLable"
+          (click)="removeFile(attachList)">
+          <ion-icon style="font-size:22px;margin-left:-7px;margin-top:-2px;" name="close"></ion-icon>
+        </button>
+         
+        </ion-col>
+    </ion-row>
+  </div>
+
+</ion-grid>
+<ion-grid *ngIf="attachmentRes?.length > 0">
+  <div *ngFor="let attachRes of attachmentRes">
+    <ion-row>
+      <ion-col col-8>
+        <div> <img float-start class="attachImg" src="../assets/imgs/file.png">
+        </div>
+        <ion-label>
+          {{attachRes.FILE_NAME }} </ion-label>
+
+      </ion-col>
+      <ion-col col-4>
+        <button float-end class="attachImgBtn"
+          (click)="OpenAttachFiles(attachRes.FILE_DATA,attachRes.FILE_CONTENT_TYPE)">
+          <img class="attachImg" src="../assets/imgs/view.png">
+        </button>
+        <button float-end [disabled]="!isResubmitEIT" class="attachImgBtn" (click)="delelteFile(attachRes)"><img
+            class="attachImg" src="../assets/imgs/deletegray.png"></button>
+      </ion-col>
+    </ion-row>
+  </div>
+
+</ion-grid>
+
+
+<ion-grid class="">
+  <div  [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'">{{'confirmAddEit, comment' | translate}}</div>
+ <ion-item class="submitNote" lines="none">
+   <ion-textarea type="text"  [(ngModel)]="eitComments"></ion-textarea>
+ </ion-item>
+</ion-grid>
+
+<ion-grid class="approvalList">
+ <div  [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'">{{'confirmAddEit, approverList' | translate}}</div>
+ <div class="noDataDiv" *ngIf="approversList?.length == 0">
+   <p>{{ 'general, empty' | translate}}</p>
+</div>
+<div style="background-color: white;border-radius: 32px;border: 1px solid #c8c4c4;"  *ngIf="approversList?.length > 0">
+   <ion-list class="notification-list ">
+       <div class="timeline">
+           <ion-item style="padding-left: 4%;" *ngFor="let employee of approversList">
+
+               <div class="timeline-item" slot="start">
+                   <div [class]="direction == 'en'? 'timeline-thumb-en  timeline-icon': 'timeline-thumb-ar  timeline-icon'">
+                       <img *ngIf="employee.EMPLOYEE_IMAGE" class="empImge"
+                           [src]="'data:image/png;base64,'+employee.EMPLOYEE_IMAGE">
+                       <img *ngIf="employee.EMPLOYEE_IMAGE == null" class="empImge"
+                           src="../assets/imgs/profile.png"> </div>
+               </div>
+               <ion-col>
+                   <ion-label style="color:black !important ;font-weight: bold;padding-top: 0%;">
+                       {{employee.APPROVER}}
+                   </ion-label>
+                   <ion-label style="color:black !important ;padding-top: 4%;">
+                     {{employee.POSITION_TITLE}}
+                 </ion-label>
+                  
+               </ion-col>
+               <div class="line"></div>
+           </ion-item>
+       </div>
+   </ion-list>
+</div>
+
+</ion-grid>
+
+</ion-content>
+
+<ion-footer>
+  <div class="centerDiv">
+    <ion-button class="confirmEitOkButton" color="customnavy" ion-button (click)="openSubmitModal()">
+      {{ (isDelete ? 'general, delete' : 'general, submit') | translate }}</ion-button>
+  </div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss
new file mode 100644
index 00000000..2ed98379
--- /dev/null
+++ b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss
@@ -0,0 +1,263 @@
+.footer-button {
+    border-radius: 2px;
+    padding: 0 1.1em;
+    min-height: 45px;
+    min-width: 200px;
+  }
+  
+  .imgSize {
+    width: 22px;
+    height: 22px;
+  }
+  
+  .Header {
+    font-weight: bold;
+    color: #1a586d !important;
+    font-size: 10px;
+  }
+  
+  .tbData {
+    font-size: 10px;
+  }
+  
+  .btnBack {
+    background: transparent;
+    float: right;
+  }
+  
+  .attachmentDiv{
+    background: #ffffff;
+    height: auto;
+    text-align: center;
+    padding-top: 1px;
+    margin: 10px;
+    border-radius: 15px;
+    border: 1px solid grey;
+  }
+  
+  .noDataDiv{
+    background: #ffffff;
+    height: 11%;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 10px;
+    margin: 10px;
+    border-radius: 5px;
+  }
+  .submitNote{
+    background: #ffffff;
+    height: 80px;
+    padding-top: 1px;
+    margin: 10px;
+    border-radius: 15px;
+    border: 1px solid grey;
+  }
+  
+  .approvalList{
+    --background: #f0efef;
+    height: auto;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 10px;
+    margin: 10px;
+    border-radius: 5px;
+  }
+  
+  /************************New Design**********************************/
+  .notification-list{
+    background: none;
+    background: none;
+    border-radius: 32px;
+    ion-item{
+        // margin-top: 5px;
+        // margin-bottom: 5px;
+      
+        background-color: transparent;
+        .item-date{
+            width: 100%;
+            font-size: 16px;
+            font-weight: bold;
+         
+            text-align: start;
+            padding: 0;
+            margin: 0;
+         
+            position: absolute;
+            left: 0;
+            top: 12%;
+        }
+        ion-label , [item-end]{
+        
+            white-space: normal;
+            font-size: 14px;
+            padding-top: 15%;
+            // :root[dir="ltr"]{
+            //     margin-left: 10px;
+            // }
+            // :root[dir="rtl"]{
+            //     margin-right: 10px;
+            // }
+            
+        }
+  
+    }
+  }
+  
+  
+  
+  
+  
+  
+  .timeline {
+      position: relative;
+      margin: 15px 0 0 0;
+    //   border-bottom: solid 1px var(--cusgray);
+  }
+  
+  .timeline:before {
+   
+    content: '';
+    position: inherit !important;
+    top: 0;
+    bottom: 0;
+    width: 4px;
+    // background: #e4e4e4;
+    z-index: 1;
+    left: 35px;
+    /* margin-left: -10px; */
+    /* z-index: 1; */
+  }
+  
+  .timeline .timeline-thumb {
+   
+    border-radius: 500px;
+    width: 70px !important;
+    z-index: 2;
+    position: absolute;
+    left: 0px;
+    // :root[dir="ltr"]{
+    //    left: 37px;
+    // }
+    // :root[dir="rtl"]{
+    //     right: 37px;
+    // }
+    float: right;
+    top: 9px;
+  }
+  
+  .timeline .timeline-thumb.timeline-icon {
+      height: 70px;
+    //   text-align: center;
+    //   color: white;
+    //   border: 5px solid #CBD0D3;
+    //   transform: scale(0.2);
+  }
+  
+  
+  
+  .timeline .timeline-item {
+    width: 40px;
+  
+  }
+  
+  .timeline .timeline-stats {
+      position: relative;
+      font-size: 12px;
+      color: var(--darkgray);
+    
+  }
+  
+  .empImge{
+    border-radius: 50%;
+    width:100%;
+    height: 100%;
+    border: #dedede solid 1px;
+  
+  }
+  .empImgeRep {
+    border-radius: 50% !important;
+    width: 80px;
+    height: 80px;
+    border: #dedede solid 1px;
+  }
+  
+  .line{
+    padding-bottom:87px;
+  }
+  
+  .attachLable{
+    position: absolute;
+      top: 0px;
+      z-index: 0;
+      background: #30b8c6;
+      color: #fff;
+      border-radius: 50%;
+      border: 0px;
+      width: 24px;
+      height: 24px;
+      text-align: center;
+      font-size: 5px;
+  }
+  
+  .removeLable{
+    top: 0px;
+    z-index: 0;
+    background: #d8252d;
+    color: #fff;
+    border-radius: 50%;
+    border: 0px;
+    width: 20px;
+    height: 20px;
+    text-align: center;
+    font-size: 5px;
+  }
+  
+  .note-modal {
+    // width: 90%;
+    // height: 50%;
+    // top: 20%;
+    // left: 5%;
+    // right: 5%;
+    // bottom: 5%;
+    background: rgba(0, 0, 0, 0.5) !important;
+    padding: 30% 10% !important;
+    --height: 12cm !important;
+    // --width: 80% !important;
+    --border-radius:20px;
+    
+  }
+  .header-toolbar-new{
+    --background: #269DB8;
+  }
+  .title{
+    margin-top: -37px;
+    margin-left: 85px;
+  }
+  .title-ar{
+    margin-top: -37px;
+      margin-right: 101px;
+  }
+  .confirmEitOkButton{
+    white-space: normal !important;
+    text-transform: capitalize !important;
+    min-height: 45px !important;
+    min-width: 5px !important;
+    margin: 8px !important;
+    background-color: #269DB8;
+    width: 80% !important;
+    color: white!important;
+    border-radius: 16px !important;
+  }
+  
+  .approvalTitle-ar{
+    font-weight: bold;
+    font-size: 16px;
+    text-align: right;
+  
+  }
+  .approvalTitle{
+    font-weight: bold;
+    font-size: 16px;
+    text-align: left;
+  }
+  
\ No newline at end of file
diff --git a/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.spec.ts b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.spec.ts
new file mode 100644
index 00000000..2cf5f990
--- /dev/null
+++ b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConfirmAddCeiComponent } from './confirm-add-cei.component';
+
+describe('ConfirmAddCeiComponent', () => {
+  let component: ConfirmAddCeiComponent;
+  let fixture: ComponentFixture<ConfirmAddCeiComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ConfirmAddCeiComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConfirmAddCeiComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.ts b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.ts
new file mode 100644
index 00000000..9235b0d8
--- /dev/null
+++ b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.ts
@@ -0,0 +1,445 @@
+import { WorkListAttachViewComponent } from './../../notification/work-list-attach-view/work-list-attach-view.component';
+import { AddAttachComponent } from './../add-attach/add-attach.component';
+import { NotificationGetAttachResponse } from './../models/NotificationGetAttachRes';
+import { EITNotificatonBodyResponse } from './../models/EITNotificationBodyRes';
+import { WorkListButtonRequest } from './../models/NotificationButtonReq';
+import { ApproversList } from './../../absence/models/approvers';
+import { CeiRequest } from './../models/cei.request';
+import { Component, OnInit } from '@angular/core';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { ModalController } from '@ionic/angular';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { EitService } from '../services/eit.service';
+import { AddCeiResponse } from '../models/add.cei.response';
+import { FileUploader } from 'ng2-file-upload';
+import { SubmitEitModalComponent } from '../submit-eit-modal/submit-eit-modal.component';
+
+@Component({
+  selector: 'app-confirm-add-cei',
+  templateUrl: './confirm-add-cei.component.html',
+  styleUrls: ['./confirm-add-cei.component.scss'],
+})
+export class ConfirmAddCeiComponent implements OnInit {
+
+  private P_TransactionID: number;
+  private ceiRequest: CeiRequest;
+  approversList = [];
+  addrespList: any;
+  eitComments: string = "";
+  menuType: string = "";
+  selEmp: string = "";
+  respID: number;
+  selMenu: MenuResponse;
+  getAttachList: any;
+  attachListDisplay: any = [];
+  headerTitle: string = "";
+  isTrue: any = 0;
+  attachItems: any;
+  public isResubmitEIT: boolean = false;
+  private itemKey: string = "";
+  private pActionMode: string = "SUBMIT";
+  attachReqObj: WorkListButtonRequest = new WorkListButtonRequest();
+  attachmentRes: any;
+  objIndex1: any;
+  attachListOver: any = [];
+  index: any = 0;
+  getPassNotificationDetails: any;
+  isSubmitBtnClicked: boolean;
+  isDelete: boolean = false;
+
+  isUpload: boolean = false;
+  inQueue: boolean = false;
+  addAttachmentListReq: any;
+  attachmentID: number = 0;
+  addAttachRequest: any = [];
+  fileData: any;
+  fileType: any;
+  dirPage: any;
+  TransactionID: any;
+  indexLastObj: any = 0;
+  filterAllowedType: any = ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
+  direction: string;
+
+  
+  constructor(public modalController: ModalController, public cs: CommonService, private ts: TranslatorService, private eitService: EitService) {
+    this.direction = TranslatorService.getCurrentLanguageName()
+    this.isSubmitBtnClicked = false;
+    this.ceiRequest = new CeiRequest();
+  }
+
+  ngOnInit() {
+    this.selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
+    this.selEmp = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false);
+    this.respID = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_RESP_ID, false);
+    this.ceiRequest = this.cs.sharedService.getSharedData(CeiRequest.SHARED_DATA, false);
+    // this.isResubmitEIT = this.cs.sharedService.getSharedData('confirmAddEITData', false).isResubmit;
+    if (this.isResubmitEIT) {
+      this.getPassNotificationDetails = this.cs.sharedService.getSharedData(EITNotificatonBodyResponse.NOT_WORKLIST, false); //WARINING ** 
+      this.P_TransactionID = this.cs.sharedService.getSharedData("TransactionIDResubmit", true);     
+      this.itemKey = this.getPassNotificationDetails.ITEM_KEY;
+      this.pActionMode = "RESUBMIT";
+      this.menuType = "E";
+      this.respID = -999;
+      this.selEmp = this.ceiRequest.P_SELECTED_EMPLOYEE_NUMBER;
+      this.getApproversList();
+      this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+      let msg: string = "";
+      msg = this.ts.trPK("eit", "update-title");
+      this.headerTitle = msg;
+    } else {
+      this.menuType = this.selMenu.List_Menu.MENU_TYPE;
+      this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+      this.addrespList = this.cs.sharedService.getSharedData(AddCeiResponse.SHARED_DATA);
+      this.itemKey = this.addrespList.SubmitCEITransactionList.P_ITEM_KEY;
+      this.P_TransactionID = this.addrespList.SubmitCEITransactionList.P_TRANSACTION_ID;
+      // this.isDelete = this.isResubmitEIT = this.cs.sharedService.getSharedData('confirmAddEITData', false).isDelete;
+      this.getApproversList();
+    }
+  }
+
+  getApproversList() {
+    let body: any = {
+      P_TRANSACTION_ID: this.P_TransactionID,
+      P_AME_TRANSACTION_TYPE: "SSHRMS",
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    }
+    this.eitService.getApproversList(
+      body).
+      subscribe((result: any) => {
+        this.handleApproversResult(result);
+      });
+  }
+
+  handleApproversResult(result) {
+    if (this.cs.validResponse(result)) {
+      this.approversList = result.GetApprovesList;
+    }
+  }
+
+  startCeiApproval() {
+    if (this.attachListOver) {
+      let request = {
+        AddAttachmentList: this.attachListOver
+      }
+      this.eitService.addAttachment(
+        request).
+        subscribe((result: any) => {
+          this.handleAddAttachmentResults(result);
+        });
+    } else {
+      this.startCeiApprovalProcess();
+    }
+  }
+
+
+  handleAddAttachmentResults(result) {
+    if (this.cs.validResponse(result)) {
+      //this.isUpload=true;
+      this.isTrue = 0;
+      for (let i = 0; i < result.AddAttSuccessList.length; i++) {
+        if (!result.AddAttSuccessList[i].AddSuccess) {
+          this.attachListOver[i].isSuccess = false;
+          // if false display cancel button with waring icon or design
+        }// end if
+        else {
+          // if true remove cancel and set isSuccess = true
+          this.attachListOver[i].isSuccess = true;
+          this.isTrue = this.isTrue + 1; //count flag of attach status
+        } //  end else
+      } // end for
+
+      if (this.isTrue == result.AddAttSuccessList.length) {
+        this.startCeiApprovalProcess();
+      }
+      else {
+        //stope
+        let filtered = this.attachListOver.filter(function (el) { return el.isSuccess == true; });
+        this.attachListOver = filtered;
+        let msg: string = "";
+        msg = this.ts.trPK("eit", "attach-errorMsg");
+        this.cs.presentAlert(msg);
+      }
+    }
+  }
+
+  startCeiApprovalProcess() {
+    let request: any = {};
+    request.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp;
+    request.P_MENU_TYPE = this.menuType;
+    request.P_SELECTED_RESP_ID = this.respID;
+    request.P_TRANSACTION_ID = this.P_TransactionID;
+    request.P_ITEM_KEY = this.itemKey;
+    request.P_ACTION_MODE = this.pActionMode;
+    request.P_COMMENTS = this.eitComments;
+    this.eitService.startCeiApprovalProcess(
+      request).
+      subscribe((result: any) => {
+        this.handleResults(result);
+      });
+  }
+  cancelEitProcess() {
+    let body: any = {
+      P_TRANSACTION_ID: this.P_TransactionID
+    }
+    this.eitService.cancelHRTransaction(
+      body).
+      subscribe((result: any) => {
+        this.handleCancelResults(result);
+      });
+
+  }
+  handleCancelResults(result) {
+    if (this.cs.validResponse(result)) {
+      this.isSubmitBtnClicked = false;
+    }
+  }
+  handleResults(result) {
+    if (this.cs.validResponse(result)) {
+      this.isSubmitBtnClicked = true;
+      // let msg: string = this.ts.trPK("eit", "approval-message-success");
+      // this.cs.presentAlert(msg);
+      this.cs.greenToastPK("eit", "approval-message-success")
+      this.cs.openNotificationPage();
+    }
+  }
+
+  async addAttachment(str: boolean, attachItems: any) {
+    let attachDocID = attachItems.ATTACHED_DOCUMENT_ID;
+
+    this.cs.sharedService.setSharedData( this.P_TransactionID, 'TransactionID');
+    this.cs.sharedService.setSharedData(this.attachListOver.length, 'indexLastObj');
+
+    const modal = await this.modalController.create({
+      component: AddAttachComponent
+    });
+
+    modal.onDidDismiss()
+      .then((data) => {
+        if (data == "cancel" || data == "undefined") {
+          return;
+        } else {
+          if (!str) {
+            this.updateFile(data, attachDocID);
+          } else {
+            console.log(data);
+            this.attachListDisplay = data.data;
+            this.attachItems = this.attachListDisplay.map(function (el) {
+              var o = Object.assign({}, el);
+              o.isSuccess = false;
+              return o;
+            });
+
+            this.attachListOver = this.attachListOver ? this.attachListOver.concat(this.attachItems) : this.attachItems;
+          }
+        }
+      });
+
+    return await modal.present();
+  }
+
+  /*****submit modal********/
+  async openSubmitModal() {
+    this.cs.sharedService.setSharedData( this.attachListOver, 'submitAttachmentList');
+    this.cs.sharedService.setSharedData(this.eitComments, 'eitComments');
+    const modal = await this.modalController.create({
+      component: SubmitEitModalComponent,
+      backdropDismiss: false,
+
+    });
+    modal.cssClass = 'note-modal';
+
+    modal.onDidDismiss()
+      .then((data) => {
+        console.log(data.data);
+
+        if (data.data == "cancel" || data.data == undefined) {
+          return;
+        } else {
+           this.startCeiApproval();
+        }
+      });
+
+    return await modal.present();
+
+  }
+
+
+
+  removeFile(objectitem) {
+    if (this.attachListOver) {
+      let index2 = this.attachListOver.findIndex(item => item == objectitem);
+      if (index2 > -1) {
+        this.attachListOver.splice(index2, 1);
+      }
+    }
+    if (this.attachmentRes) {
+
+      let index3 = this.attachmentRes.findIndex(item => item == objectitem);
+      if (index3 > -1) {
+
+        this.attachmentRes.splice(index3, 1);
+      }
+    }
+
+  }
+
+
+  getAttachment(NotificationID) {
+
+    this.attachReqObj.P_NOTIFICATION_ID = NotificationID;
+
+    this.eitService.getAttach(this.attachReqObj).
+      subscribe((result: NotificationGetAttachResponse) => {
+        this.handleWorkListAttachResult(result);
+      });
+  }
+
+  handleWorkListAttachResult(result) {
+    if (this.cs.validResponse(result)) {
+      // this.sharedData.setSharedData(result, WorKListResponse.SHARED_DATA);
+      if (result.GetAttachementList != null) {
+        this.attachmentRes = result.GetAttachementList;
+      } // if result == null
+    } // valid it
+
+  }
+
+  async OpenAttachFiles(value, Type) {
+
+    this.cs.sharedService.setSharedData({ displayData: value, TypeData: Type }, 'WorkListAttachViewPage');
+    const modal = await this.modalController.create({
+      component: WorkListAttachViewComponent
+    });
+
+    modal.onDidDismiss()
+      .then((data) => {
+      });
+
+    return await modal.present();
+  }
+
+
+  delelteFile(attach) {
+    this.cs.confirmAlertDialog((data) => {
+      if (data == true) {
+        this.continueDelete(attach);
+      }
+    }, this.ts.trPK('general', 'ok'), () => {
+
+    }, this.ts.trPK('general', 'cancel'), this.ts.trPK('general', 'alert'), this.ts.trPK('eit', 'delete-perm'));
+  }
+  continueDelete(attach) {
+    let req = {
+      P_ATTACHED_DOCUMENT_ID: attach.ATTACHED_DOCUMENT_ID
+    }
+    this.eitService.deleteAttach(req).
+      subscribe((result: any) => {
+        if (this.cs.validResponse(result)) {
+          if (result.DeleteAttachmentList.P_RETURN_STATUS === "S") {
+            this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+            let msg: string = "";
+            msg = this.ts.trPK("eit", "deleteAttach");
+            this.cs.presentAlert(msg);
+          }
+        }
+      });
+  }
+
+  updateFile(attachList, attachDocID) {
+    let req = {
+      P_ATTACHED_DOCUMENT_ID: attachDocID,
+      P_FILE_DATA: attachList[0].P_FILE_DATA,
+      P_FILE_NAME: attachList[0].P_FILE_NAME,
+      P_FILE_CONTENT_TYPE: attachList[0].P_FILE_CONTENT_TYPE
+    }
+    this.eitService.updateAttach(req).
+      subscribe((result: any) => {
+        if (this.cs.validResponse(result)) {
+          if (result.MessageStatus == 1) {
+            let msg: string = "";
+            msg = this.ts.trPK("eit", "attachUpdate");
+            this.cs.presentAlert(msg);
+            this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+          }
+        } // val
+      });
+  }
+
+
+  ionViewWillLeave() {
+    if (this.P_TransactionID && this.isSubmitBtnClicked == false)
+      this.cancelEitProcess();
+  }
+
+  public uploader: FileUploader = new FileUploader({
+    allowedMimeType: ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
+    maxFileSize: 10 * 1024 * 1024,
+    formatDataFunctionIsAsync: true,
+    formatDataFunction: async (item) => {
+      return new Promise((resolve, reject) => {
+        resolve({
+          name: item._file.name,
+          length: item._file.size,
+          contentType: item._file.type,
+          date: new Date()
+        });
+      });
+    }
+  });
+
+
+  onFileSelectedclick(event){
+    event.target.value = '';
+  }
+
+
+
+  onFileSelected(input) {
+    if (!(this.filterAllowedType.indexOf(input.target.files[0].type) > -1)) {
+      let msg: string = "";
+      msg = this.ts.trPK("general", "notSupport");
+      this.cs.presentAlert(msg);
+      return
+    }    // todo: show alert that you tried uploading wrong files
+
+    else {
+      const file = input.target.files[0];
+      this.getBase64(file).then(
+        data => this.pushObject(data, file.name, file.type)
+      );
+    }
+  }
+
+
+  getBase64(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.readAsDataURL(file);
+      reader.onload = () => resolve(reader.result);
+      reader.onerror = error => reject(error);
+    });
+  }
+
+
+  pushObject(fileData, name, type) {
+    try {
+      let array = name.split('.');
+      let attachType: string = array[array.length - 1];
+
+      this.attachListOver.push(
+        {
+          AttachmentID:  this.attachListOver.length,
+          P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
+          P_FILE_DATA: fileData.split(',')[1],
+          P_FILE_NAME: name,//.split('.')[0],
+          P_TRANSACTION_ID:  this.P_TransactionID
+        })
+
+    } catch (e) {
+
+    }
+  }
+}
+
diff --git a/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.ts b/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.ts
index 72cf9af1..35abae8a 100644
--- a/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.ts
+++ b/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.ts
@@ -14,6 +14,7 @@ import { EitService } from '../services/eit.service';
 import { AddEitResponse } from '../models/add.eit.response';
 import { FileUploader } from 'ng2-file-upload';
 import { SubmitEitModalComponent } from '../submit-eit-modal/submit-eit-modal.component';
+import { HomeComponent } from 'src/app/notification/home/home.component';
 
 @Component({
   selector: 'app-confirm-add-eit',
@@ -62,7 +63,7 @@ export class ConfirmAddEitComponent implements OnInit {
   filterAllowedType: any = ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
   direction: string;
 
-  
+
   constructor(public modalController: ModalController, public cs: CommonService, private ts: TranslatorService, private eitService: EitService) {
     this.direction = TranslatorService.getCurrentLanguageName()
     this.isSubmitBtnClicked = false;
@@ -81,8 +82,8 @@ export class ConfirmAddEitComponent implements OnInit {
       this.getPassNotificationDetails = this.cs.sharedService.getSharedData(EITNotificatonBodyResponse.NOT_WORKLIST, false); //WARINING ** 
       // console.log("this.getPassNotificationDetails: " + this.getPassNotificationDetails);
       this.P_TransactionID = this.cs.sharedService.getSharedData("TransactionIDResubmit", true);
-     // let notification = this.cs.sharedService.getSharedData(EITNotificatonBodyResponse.NOT_WORKLIST, true);
-     
+      // let notification = this.cs.sharedService.getSharedData(EITNotificatonBodyResponse.NOT_WORKLIST, true);
+
       this.itemKey = this.getPassNotificationDetails.ITEM_KEY;
       this.pActionMode = "RESUBMIT";
       this.menuType = "E";
@@ -228,12 +229,15 @@ export class ConfirmAddEitComponent implements OnInit {
     if (this.cs.validResponse(result)) {
       this.isSubmitBtnClicked = true;
       //if(this.isResubmitEIT==false){
-      let msg: string = this.ts.trPK("eit", "approval-message-success");
-      this.cs.presentAlert(msg);
+      // let msg: string = this.ts.trPK("eit", "approval-message-success");
+      // this.cs.presentAlert(msg);
+      this.cs.greenToastPK("eit", "approval-message-success")
       // }
       // this.navCtrl.popToRoot();
 
       // this.cs.openHome();
+      this.cs.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
+      //this.cs.setTotalNumberOfWorklistRequest(true);
       this.cs.openNotificationPage();
     }
   }
@@ -249,7 +253,7 @@ export class ConfirmAddEitComponent implements OnInit {
     //open the modal with return data
     let attachDocID = attachItems.ATTACHED_DOCUMENT_ID;
 
-    this.cs.sharedService.setSharedData( this.P_TransactionID, 'TransactionID');
+    this.cs.sharedService.setSharedData(this.P_TransactionID, 'TransactionID');
     this.cs.sharedService.setSharedData(this.attachListOver.length, 'indexLastObj');
 
     const modal = await this.modalController.create({
@@ -298,7 +302,7 @@ export class ConfirmAddEitComponent implements OnInit {
 
   /*****submit modal********/
   async openSubmitModal() {
-    this.cs.sharedService.setSharedData( this.attachListOver, 'submitAttachmentList');
+    this.cs.sharedService.setSharedData(this.attachListOver, 'submitAttachmentList');
     this.cs.sharedService.setSharedData(this.eitComments, 'eitComments');
     const modal = await this.modalController.create({
       component: SubmitEitModalComponent,
@@ -314,7 +318,7 @@ export class ConfirmAddEitComponent implements OnInit {
         if (data.data == "cancel" || data.data == undefined) {
           return;
         } else {
-           this.startEitApproval();
+          this.startEitApproval();
         }
       });
 
@@ -482,7 +486,7 @@ export class ConfirmAddEitComponent implements OnInit {
   });
 
 
-  onFileSelectedclick(event){
+  onFileSelectedclick(event) {
     event.target.value = '';
   }
 
@@ -529,7 +533,7 @@ export class ConfirmAddEitComponent implements OnInit {
 
   pushObject(fileData, name, type) {
 
-     console.log("before push: "+ this.index);
+    console.log("before push: " + this.index);
     //this.attachListOver.length++;
     try {
       let array = name.split('.');
@@ -537,11 +541,11 @@ export class ConfirmAddEitComponent implements OnInit {
 
       this.attachListOver.push(
         {
-          AttachmentID:  this.attachListOver.length,
+          AttachmentID: this.attachListOver.length,
           P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
           P_FILE_DATA: fileData.split(',')[1],
           P_FILE_NAME: name,//.split('.')[0],
-          P_TRANSACTION_ID:  this.P_TransactionID
+          P_TRANSACTION_ID: this.P_TransactionID
         })
 
     } catch (e) {
diff --git a/Mohem/src/app/eit/eit.module.ts b/Mohem/src/app/eit/eit.module.ts
index 98d5bde0..a42eebc6 100644
--- a/Mohem/src/app/eit/eit.module.ts
+++ b/Mohem/src/app/eit/eit.module.ts
@@ -14,7 +14,10 @@ import { DatePicker } from '@ionic-native/date-picker/ngx';
 import { WorkListAttachViewComponent } from '../notification/work-list-attach-view/work-list-attach-view.component';
 import { EitUpdateListComponent } from './eit-update-list/eit-update-list.component';
 import { SubmitEitModalComponent } from './submit-eit-modal/submit-eit-modal.component';
-
+import { CeiHomepageComponent } from './cei-homepage/cei-homepage.component';
+import { CeiListComponent } from './cei-list/cei-list.component';
+import { AddCeiComponent } from './add-cei/add-cei.component';
+import { ConfirmAddCeiComponent } from './confirm-add-cei/confirm-add-cei.component';
 
 const routes: Routes = [
   {
@@ -48,7 +51,23 @@ const routes: Routes = [
       {
         path: 'eit-submit-modal',
         component: SubmitEitModalComponent
-      }
+      },
+      {
+        path: 'cei-homepage',
+        component: CeiHomepageComponent
+      },
+      {
+        path: 'cei-list',
+        component: CeiListComponent
+      },
+      {
+        path: 'add-cei',
+        component: AddCeiComponent
+      },
+      {
+        path: 'confirm-cei',
+        component: ConfirmAddCeiComponent
+      },
     ]
   }
 ];
@@ -69,7 +88,11 @@ const routes: Routes = [
     ConfirmAddEitComponent,
     AddAttachComponent,
     EitUpdateListComponent,
-    SubmitEitModalComponent
+    SubmitEitModalComponent,
+    CeiHomepageComponent,
+    CeiListComponent,
+    AddCeiComponent,
+    ConfirmAddCeiComponent
   ],
   entryComponents: [
     WorkListAttachViewComponent
diff --git a/Mohem/src/app/eit/home/home.component.ts b/Mohem/src/app/eit/home/home.component.ts
index 7402a672..b3fd95e5 100644
--- a/Mohem/src/app/eit/home/home.component.ts
+++ b/Mohem/src/app/eit/home/home.component.ts
@@ -2,6 +2,7 @@ import { CommonService } from 'src/app/hmg-common/services/common/common.service
 import { Component, OnInit } from '@angular/core';
 import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { TerminationServiceService } from 'src/app/termination/service/termination-service.service';
 
 @Component({
   selector: 'app-home',
@@ -19,7 +20,7 @@ export class HomeComponent implements OnInit {
   direction: string;
   pageType: string;
 
-  constructor(private cs: CommonService, private ts: TranslatorService) {
+  constructor(private cs: CommonService, private ts: TranslatorService, public terminationService: TerminationServiceService) {
     this.direction = TranslatorService.getCurrentLanguageName();
     this.menu = this.cs.sharedService.getSharedData('menuEntries', false);
     this.pageType = this.cs.sharedService.getSharedData('homemenuentries', false);
@@ -45,6 +46,11 @@ export class HomeComponent implements OnInit {
         this.selectedMenu = index;
       }
     }
+    if (page['FUNCTION_NAME'] == 'HR_TERM_SS' || page['FUNCTION_NAME'] == 'HR_TERM_EMP_SS') {
+      this.cs.sharedService.setSharedData(page, TerminationServiceService.TERMINATION_PAGE);
+
+      this.cs.openTermination();
+    }
     console.log('selected>>>>>>>' + this.selectedMenu);
   }
 
@@ -59,8 +65,10 @@ export class HomeComponent implements OnInit {
       this.cs.openEitListPage();
     } else if (menuEntry.REQUEST_TYPE === 'BASIC_DETAILS') {
       this.cs.openProfile('basicDetails');
-    } else if (menuEntry.REQUEST_TYPE === 'ADDRESS') {
-      this.cs.openProfile('address');
+    } else if (menuEntry.REQUEST_TYPE === 'ADDRESS' || menuEntry.REQUEST_TYPE === 'PHONE_NUMBERS') {
+      this.cs.openProfile('contact');
+    } else if (menuEntry.REQUEST_TYPE === 'CONTACT') {
+      this.cs.openProfile('family');
     }
     if (menuEntry.REQUEST_TYPE === 'PAYSLIP') {
       this.cs.openPayslipPage();
@@ -68,6 +76,9 @@ export class HomeComponent implements OnInit {
     if (menuEntry.REQUEST_TYPE === 'TIME_CARD') {
       this.cs.openTimeCardPage();
     }
+    if (menuEntry.REQUEST_TYPE === 'CEI') {
+      this.cs.openCEIPage();
+    }
   }
 
 }
diff --git a/Mohem/src/app/eit/models/add.cei.response.ts b/Mohem/src/app/eit/models/add.cei.response.ts
new file mode 100644
index 00000000..070c330a
--- /dev/null
+++ b/Mohem/src/app/eit/models/add.cei.response.ts
@@ -0,0 +1,8 @@
+import { Response } from '../../hmg-common/services/models/response';
+import { EitRespModel } from './eit.response.model'
+
+export class AddCeiResponse extends Response {
+    public static SHARED_DATA = 'add-cei-response';
+    SubmitCEITransactionList: EitRespModel;
+}
+
diff --git a/Mohem/src/app/eit/models/add.eit.response.ts b/Mohem/src/app/eit/models/add.eit.response.ts
index b54537a7..c7a18133 100755
--- a/Mohem/src/app/eit/models/add.eit.response.ts
+++ b/Mohem/src/app/eit/models/add.eit.response.ts
@@ -3,6 +3,7 @@ import { EitRespModel } from './eit.response.model'
 
 export class AddEitResponse extends Response {
     public static SHARED_DATA = 'add-eit-response';
+    public static isContact = 'isContact';
     SubmitEITTransactionList: EitRespModel;
 }
 
diff --git a/Mohem/src/app/eit/models/cei.request.ts b/Mohem/src/app/eit/models/cei.request.ts
new file mode 100644
index 00000000..7b06f904
--- /dev/null
+++ b/Mohem/src/app/eit/models/cei.request.ts
@@ -0,0 +1,12 @@
+import { EitTransactionModel } from './eit.transaction.model';
+
+export class CeiRequest {
+    public static SHARED_DATA = 'cei-request';
+    public P_MENU_TYPE: string;
+    public P_SELECTED_EMPLOYEE_NUMBER: string;
+    public P_FUNCTION_NAME: string;
+    public P_SELECTED_RESP_ID: Number;
+    P_CONTACT_RELATIONSHIP_ID: Number;
+    P_DESC_FLEX_CONTEXT_CODE: string;
+    EITTransactionTBL: EitTransactionModel[];
+}
\ No newline at end of file
diff --git a/Mohem/src/app/eit/models/eit.request.ts b/Mohem/src/app/eit/models/eit.request.ts
index 51e746a5..cc9d4311 100755
--- a/Mohem/src/app/eit/models/eit.request.ts
+++ b/Mohem/src/app/eit/models/eit.request.ts
@@ -8,5 +8,4 @@ export class EitRequest {
     public P_SELECTED_RESP_ID: Number;
     P_DESC_FLEX_CONTEXT_CODE: string;
     EITTransactionTBL: EitTransactionModel[];
-
 }
\ No newline at end of file
diff --git a/Mohem/src/app/eit/services/eit.service.ts b/Mohem/src/app/eit/services/eit.service.ts
index 9063a6ff..4b95bdda 100644
--- a/Mohem/src/app/eit/services/eit.service.ts
+++ b/Mohem/src/app/eit/services/eit.service.ts
@@ -5,6 +5,7 @@ import { Injectable } from '@angular/core';
 import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
 import { ConnectorService } from 'src/app/hmg-common/services/connector/connector.service';
 import { AddEitResponse } from '../models/add.eit.response';
+import { AddCeiResponse } from '../models/add.cei.response';
 import { ApproversList } from 'src/app/absence/models/approvers';
 import { WorkListButtonRequest } from '../models/NotificationButtonReq';
 
@@ -16,19 +17,24 @@ export class EitService {
   /*  EIT Services URLs  */
   public static getMenuEntries = 'Services/ERP.svc/REST/GET_MENU_ENTRIES';
   public static getEITTransctions = 'Services/ERP.svc/REST/GET_EIT_TRANSACTIONS';
+  public static getCEITransctions = 'Services/ERP.svc/REST/GET_CEI_TRANSACTIONS';
   public static getEITDFFStrutre = 'Services/ERP.svc/REST/GET_EIT_DFF_STRUCTURE';
+  public static getCEIDFFStrutre = 'Services/ERP.svc/REST/GET_CEI_DFF_STRUCTURE';
   public static getSetValue = 'Services/ERP.svc/REST/GET_VALUE_SET_VALUES';
   public static getDefaultValue = 'Services/ERP.svc/REST/GET_DEFAULT_VALUE';
   public static validateEITTransctions = 'Services/ERP.svc/REST/VALIDATE_EIT_TRANSACTION';
   public static submitEit = 'Services/ERP.svc/REST/SUBMIT_EIT_TRANSACTION';
+  public static submitCEI = 'Services/ERP.svc/REST/SUBMIT_CEI_TRANSACTION';
   public static resubmitEit = 'Services/ERP.svc/REST/RESUBMIT_EIT_TRANSACTION';
   public static startEitProcess = 'Services/ERP.svc/REST/START_EIT_APPROVAL_PROCESS';
+  public static startCeiProcess = 'Services/ERP.svc/REST/START_CEI_APPROVAL_PROCESS';
   public static updateAttach = 'Services/ERP.svc/REST/UPDATE_ATTACHMENT';
   public static deleteAttach = 'Services/ERP.svc/REST/DELETE_ATTACHMENT';
   public static getApproversList = 'Services/ERP.svc/REST/GET_APPROVERS_LIST';
   public static addAttachment = 'Services/ERP.svc/REST/ADD_ATTACHMENT';
   public static cancelHRTransaction = 'Services/ERP.svc/REST/CANCEL_HR_TRANSACTION';
   public static getAttach = 'Services/ERP.svc/REST/GET_ATTACHMENTS';
+  public static getContactInfo = 'Services/ERP.svc/REST/GET_EMPLOYEE_CONTACTS';
 
   constructor(public authService: AuthenticationService, public con: ConnectorService) { }
 
@@ -49,6 +55,13 @@ export class EitService {
     return this.con.post(EitService.getEITTransctions, request, onError, errorLabel);
   }
 
+    // tslint:disable-next-line: no-shadowed-variable
+    public getCEITransactionsList(EITTransactionsRequest: EITTransactionsRequest, onError?: any, errorLabel?: string): Observable<any> {
+      const request = EITTransactionsRequest;
+      this.authService.authenticateRequest(request);
+      return this.con.post(EitService.getCEITransctions, request, onError, errorLabel);
+    }
+
   public submitEit(eit: any, onError?: any, errorLabel?: string): Observable<AddEitResponse> {
     const request = eit;
     request.EITTransactionTBLModel = eit.EITTransactionTBL;
@@ -56,6 +69,20 @@ export class EitService {
     return this.con.post(EitService.submitEit, request, onError, errorLabel);
   }
 
+  public submitChildEducation(cei: any, onError?: any, errorLabel?: string): Observable<AddCeiResponse> {
+    const request = cei;
+    request.EITTransactionTBL = cei.EITTransactionTBL;
+    this.authService.authenticateRequest(request);
+    return this.con.post(EitService.submitCEI, request, onError, errorLabel);
+  }
+
+  public submitCEI(eit: any, onError?: any, errorLabel?: string): Observable<AddEitResponse> {
+    const request = eit;
+    request.EITTransactionTBLModel = eit.EITTransactionTBL;
+    this.authService.authenticateRequest(request);
+    return this.con.post(EitService.submitEit, request, onError, errorLabel);
+  }
+
   public validateEITTransaction(validateEITTransactionReq: any, onError?: any, errorLabel?: string): Observable<any> {
     const request = validateEITTransactionReq;
     this.authService.authenticateRequest(request);
@@ -68,6 +95,12 @@ export class EitService {
     return this.con.post(EitService.getEITDFFStrutre, request, onError, errorLabel);
   }
 
+  public getCEIDFFStrutre(EITDFFStrutreReq: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = EITDFFStrutreReq;
+    this.authService.authenticateRequest(request);
+    return this.con.post(EitService.getCEIDFFStrutre, request, onError, errorLabel);
+  }
+
   public getSetValue(SetValueReq: any, onError?: any, errorLabel?: string): Observable<any> {
     const request = SetValueReq;
     this.authService.authenticateRequest(request);
@@ -101,6 +134,12 @@ export class EitService {
     return this.con.post(EitService.startEitProcess, request, onError, errorLabel);
   }
 
+  public startCeiApprovalProcess(eitProcess: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = eitProcess;
+    this.authService.authenticateRequest(request);
+    return this.con.post(EitService.startCeiProcess, request, onError, errorLabel);
+  }
+
   public cancelHRTransaction(transactionID: any, onError?: any, errorLabel?: string): Observable<any> {
     const request = transactionID;
     this.authService.authenticateRequest(request);
@@ -131,4 +170,9 @@ export class EitService {
     return this.con.post(EitService.resubmitEit, request, onError, errorLabel);
   }
 
+  public getContactInfo(request: any, onError?: any, errorLabel?: string): Observable<any> {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.P_USER_NAME;
+    return this.con.post(EitService.getContactInfo, request, onError, errorLabel);
+  }
 }
diff --git a/Mohem/src/app/erm-channel/home/home.component.ts b/Mohem/src/app/erm-channel/home/home.component.ts
index 5bec5386..6d621078 100644
--- a/Mohem/src/app/erm-channel/home/home.component.ts
+++ b/Mohem/src/app/erm-channel/home/home.component.ts
@@ -60,9 +60,14 @@ export class HomeComponent implements OnInit {
     }, (
 
     ) => { }, this.ts.trPK('general', 'ok')).subscribe((result) => {
-      CommonService.SKIP = true;
-      this.cs.openHome();
-    })
+      if (this.cs.validResponse(result)){
+        this.cs.greenToastPK("erm-channel", "viedo-success");
+        CommonService.SKIP = true;
+        this.cs.openHome();
+      }else{
+        this.cs.redToastPK("erm-channel", "erm-failed");
+      }
+    });
   }
 
 }
diff --git a/Mohem/src/app/erm-channel/survey/survey.component.ts b/Mohem/src/app/erm-channel/survey/survey.component.ts
index b547457b..a5a6d759 100644
--- a/Mohem/src/app/erm-channel/survey/survey.component.ts
+++ b/Mohem/src/app/erm-channel/survey/survey.component.ts
@@ -52,9 +52,14 @@ export class SurveyComponent implements OnInit {
 
 
     this.authService.saveAdsStatus(request, () => { }, this.ts.trPK('general', 'ok')).subscribe((result) => {
-      CommonService.SKIP = true;
-      this.cs.openHome();
-    })
+      if (this.cs.validResponse(result)){
+        this.cs.greenToastPK("erm-channel", "survey-success");
+        CommonService.SKIP = true;
+        this.cs.openHome();
+      }else{
+        this.cs.redToastPK("erm-channel", "erm-failed");
+      }
+    });
   }
   select(rating) {
     this.satisfied = rating;
diff --git a/Mohem/src/app/hmg-common/hmg-common.module.ts b/Mohem/src/app/hmg-common/hmg-common.module.ts
index c0d8c8f9..2b8da3ac 100644
--- a/Mohem/src/app/hmg-common/hmg-common.module.ts
+++ b/Mohem/src/app/hmg-common/hmg-common.module.ts
@@ -85,32 +85,39 @@ import { ReplacementListComponent } from '../vacation-rule/replacement-list/repl
 import { FileUploadModule } from 'ng2-file-upload';
 import { PdfViewerModule } from 'ng2-pdf-viewer';
 import { WorkListAttachViewComponent } from '../notification/work-list-attach-view/work-list-attach-view.component';
-import {Camera} from '@ionic-native/Camera/ngx';
-import {File} from '@ionic-native/file/ngx';
-import {FileUploderProfileComponent} from './ui/file-uploder-profile/file-uploder-profile.component';
+import { Camera } from '@ionic-native/Camera/ngx';
+import { File } from '@ionic-native/file/ngx';
+import { FileUploderProfileComponent } from './ui/file-uploder-profile/file-uploder-profile.component';
 import { OpenNativeSettings } from '@ionic-native/open-native-settings/ngx';
 import { AccordinCustomComponent } from './ui/accordin-custom/accordin-custom.component';
-import { AccordinTabCustomComponent} from './ui/accordin-custom/accordin-tab-custom/accordin-tab-custom.component'
-import {DashboredService} from './services/dashbored/dashbored.service';
-import {NgxGaugeModule} from 'ngx-gauge';
+import { AccordinTabCustomComponent } from './ui/accordin-custom/accordin-tab-custom/accordin-tab-custom.component'
+import { DashboredService } from './services/dashbored/dashbored.service';
+import { NgxGaugeModule } from 'ngx-gauge';
 import { StatsButtonComponent } from './ui/stats-button/stats-button.component';
 import { ServicesButtonComponent } from './ui/services-button/services-button.component';
-import {ConfirmLoginComponent} from '../authentication/confirm-login/confirm-login.component'
-import {WelcomeComponent} from './ui/welcome-login/welcome.component'
-import {FabButtonComponent} from './ui/fab-button/fab-button.component'
+import { ConfirmLoginComponent } from '../authentication/confirm-login/confirm-login.component'
+import { WelcomeComponent } from './ui/welcome-login/welcome.component'
+import { FabButtonComponent } from './ui/fab-button/fab-button.component'
 import { AttendScanService } from './services/attend-services/attend-scan.service';
 import { BarcodeScanner } from '@ionic-native/barcode-scanner/ngx';
 import { NgCircleProgressModule } from 'ng-circle-progress';
 import { CardFilterComponent } from './ui/card-filter/card-filter.component';
 import { EmployeeInformationComponent } from './ui/employee-information/employee-information.component';
 import { CircleCalendarComponent } from './ui/circle-calendar/circle-calendar.component';
-import { NgCalendarModule  } from 'ionic2-calendar';
+import { NgCalendarModule } from 'ionic2-calendar';
 import { DateInfoModalComponent } from './ui/circle-calendar/date-info-modal/date-info-modal.component';
 import { ChartModule } from 'primeng/chart';
 import { GenericHeaderComponent } from './ui/generic-header/generic-header.component';
 import { BackgroundGeolocation } from '@ionic-native/background-geolocation/ngx';
 import { AttendanceOptionsComponent } from '../home/attendance-options/attendance-options.component';
 import { CardCalendarComponent } from './ui/card-calendar/card-calendar.component';
+import { WorklistSettingComponent } from '../notification/worklist-setting/worklist-setting.component';
+import { SubmitAddressModalComponent } from '../profile/submit-eit-modal/submit-address-modal.component';
+import { FileOpener } from '@ionic-native/file-opener/ngx';
+import { FilePath } from '@ionic-native/file-path/ngx';
+import { FileChooser } from "@ionic-native/file-chooser/ngx";
+import { IOSFilePicker } from '@ionic-native/file-picker/ngx';
+import { SanitizeHtmlPipe } from '../itemforsale/services/domsafe';
 
 @NgModule({
     imports: [
@@ -130,6 +137,7 @@ import { CardCalendarComponent } from './ui/card-calendar/card-calendar.componen
     ],
     declarations: [
         FabButtonComponent,
+        SanitizeHtmlPipe,
         WelcomeComponent,
         NumberRangeComponent,
         SSpacerComponent,
@@ -194,7 +202,9 @@ import { CardCalendarComponent } from './ui/card-calendar/card-calendar.componen
         Modal,
         GenericHeaderComponent,
         AttendanceOptionsComponent,
-        CardCalendarComponent
+        CardCalendarComponent,
+        WorklistSettingComponent,
+        SubmitAddressModalComponent
     ],
     exports: [
         FabButtonComponent,
@@ -265,7 +275,9 @@ import { CardCalendarComponent } from './ui/card-calendar/card-calendar.componen
         Modal,
         GenericHeaderComponent,
         AttendanceOptionsComponent,
-        CardCalendarComponent
+        CardCalendarComponent,
+        SubmitAddressModalComponent,
+        SanitizeHtmlPipe,
     ],
     providers: [
         AttendScanService,
@@ -304,9 +316,13 @@ import { CardCalendarComponent } from './ui/card-calendar/card-calendar.componen
         MenuService,
         OpenNativeSettings,
         BarcodeScanner,
-        BackgroundGeolocation
+        BackgroundGeolocation,
+        FileOpener,
+        FilePath,
+        FileChooser,
+        IOSFilePicker
     ],
-    entryComponents: [DateInfoModalComponent],
+    entryComponents: [DateInfoModalComponent, WorklistSettingComponent],
 })
 export class HmgCommonModule { }
 
diff --git a/Mohem/src/app/hmg-common/services/attend-services/attend-scan.service.ts b/Mohem/src/app/hmg-common/services/attend-services/attend-scan.service.ts
index 30002b70..29c24f36 100644
--- a/Mohem/src/app/hmg-common/services/attend-services/attend-scan.service.ts
+++ b/Mohem/src/app/hmg-common/services/attend-services/attend-scan.service.ts
@@ -34,7 +34,7 @@ export class AttendScanService {
   userData: any = {};
   public isFakeLocationUsed = false;
   public isGpsRequired = false;
-  public collection = 'HMG';
+  public collection = 'CS';
 
   constructor(private device: Device,
               private zbar: ZBar,
diff --git a/Mohem/src/app/hmg-common/services/authentication/authentication.service.ts b/Mohem/src/app/hmg-common/services/authentication/authentication.service.ts
index a8eb8067..55367138 100644
--- a/Mohem/src/app/hmg-common/services/authentication/authentication.service.ts
+++ b/Mohem/src/app/hmg-common/services/authentication/authentication.service.ts
@@ -134,6 +134,9 @@ export class AuthenticationService {
   public setPublicFields(request: Request): Request {
     const isAndroid = this.platform.is('android');
     const isIOS = this.platform.is('ios');
+    // const userData = this.cs.sharedService.getSharedData(AuthenticatedUser.SHARED_DATA, false);
+    const userPayrollCode = this.cs.sharedService.getSharedData("projcet-code", false);
+    const userLegislationCode = this.cs.sharedService.getSharedData("legislation-code", false);
     let mobileType = '';
     if (isAndroid) {
       mobileType = 'android';
@@ -142,11 +145,18 @@ export class AuthenticationService {
     } else {
       mobileType = 'android';
     }
-    request.VersionID = 3.2;
-    request.Channel = 33;
+    request.VersionID = 3.6;
+    request.Channel = 31;
     request.LanguageID = TranslatorService.getCurrentLanguageCode();
     request.MobileType = mobileType;
 
+    if (userPayrollCode) {
+      request.PayrollCodeStr = userPayrollCode;
+    }
+    if (userLegislationCode) {
+      request.LegislationCodeStr = userLegislationCode
+    }
+
     return request;
   }
   public authenticateAndSetPersonalInformation(
@@ -218,7 +228,7 @@ export class AuthenticationService {
 
   public login(request: LoginRequest, onError: any, errorLabel: string): Observable<Response> {
     this.setPublicFields(request);
-    request.P_APP_VERSION = "HMG";
+    request.P_APP_VERSION = "CS";
     return this.con.post(AuthenticationService.login, request, onError, errorLabel);
 
   }
@@ -475,7 +485,7 @@ export class AuthenticationService {
   public checkUserAuthentication(request: CheckUserAuthenticationRequest, onError: any, errorLabel: string)
     : Observable<CheckUserAuthenticationResponse> {
     this.setPublicFields(request);
-    request.P_APP_VERSION = "HMG";
+    request.P_APP_VERSION = "CS";
     return this.con.post(AuthenticationService.userChecking, request, onError, errorLabel);
   }
 
diff --git a/Mohem/src/app/hmg-common/services/authentication/models/smscheck.response.ts b/Mohem/src/app/hmg-common/services/authentication/models/smscheck.response.ts
index 387a7d73..68ca3ab7 100644
--- a/Mohem/src/app/hmg-common/services/authentication/models/smscheck.response.ts
+++ b/Mohem/src/app/hmg-common/services/authentication/models/smscheck.response.ts
@@ -3,6 +3,7 @@ import { Response } from 'src/app/hmg-common/services/models/response';
 import { AuthenticatedUser } from './authenticated-user';
 import { PrivilageModel } from './privilage-model';
 export class SMSCheckResponse extends Response {
+    BasicMemberInformation: any = {};
     AuthenticationTokenID: string;
     MemberInformationList:AuthenticatedUser[];
     Privilege_List:PrivilageModel[];
diff --git a/Mohem/src/app/hmg-common/services/common/common.service.ts b/Mohem/src/app/hmg-common/services/common/common.service.ts
index cac80b88..2a8ae0fd 100644
--- a/Mohem/src/app/hmg-common/services/common/common.service.ts
+++ b/Mohem/src/app/hmg-common/services/common/common.service.ts
@@ -78,6 +78,16 @@ export class CommonService {
     'نوفمبر',
     'ديسمبر'
   ];
+  public filterKeys = {
+    'HRSSA': 0,
+    'INVMOA': 0,
+    'REQAPPRV': 0,
+    'POAPPRV': 0,
+    'INVITEM': 0,
+    "STAMP": 0,
+    'ITG': 0,
+    'COC': 0
+  }
 
   private progressLoaders: any[] = [];
   private loadingProgress: any;
@@ -207,7 +217,7 @@ export class CommonService {
     const toast = await this.toastController.create({
       message: message,
       showCloseButton: true,
-      position: 'middle',
+      position: 'top',
       duration: 2000,
       closeButtonText: this.ts.trPK('general', 'close')
     });
@@ -226,7 +236,7 @@ export class CommonService {
     const toast = await this.toastController.create({
       message: message,
       showCloseButton: true,
-      position: 'middle',
+      position: 'top',
       duration: 2000,
       color: 'danger',
       closeButtonText: this.ts.trPK('general', 'close')
@@ -237,7 +247,7 @@ export class CommonService {
     const toast = await this.toastController.create({
       message: message,
       showCloseButton: true,
-      position: 'middle',
+      position: 'top',
       duration: 2000,
       color: 'success',
       closeButtonText: this.ts.trPK('general', 'close')
@@ -819,6 +829,11 @@ export class CommonService {
     return '/Date(' + date.getTime() + ')/';
   }
 
+  public convertDateToJsonDateUpdated(date: Date): string {
+    const newDate = new Date(date);
+    return '/Date(' + newDate.getTime() + ')/';
+  }
+
   /*
     date iso format
     and time is 24 format hh:mm:ss 
@@ -888,6 +903,11 @@ export class CommonService {
     return this.getDateTimeISO(date) + ' ' + this.getTimeISO(date);
   }
 
+  public getDateTimeISOFromStringUpdated(dateStr: string): string {
+    const date = this.evaluteDateAsObject(dateStr);
+    return this.getDateTimeISO(date);
+  }
+
   public getCurrentTimeISO(): string {
     return this.getTimeISO(new Date());
   }
@@ -1119,9 +1139,15 @@ export class CommonService {
   public openAddEitPage() {
     this.nav.navigateForward(['/eit/add-eit']);
   }
+  public openAddCEIPage() {
+    this.nav.navigateForward(['/eit/add-cei']);
+  }
   public openConfirmEitPage() {
     this.nav.navigateForward(['/eit/confirm-add-eit']);
   }
+  public openConfirmCEIPage() {
+    this.nav.navigateForward(['/eit/confirm-cei']);
+  }
   public openConfirmBasicDetailsPage() {
     this.nav.navigateForward(['/profile/confirm-basic']);
   }
@@ -1172,6 +1198,9 @@ export class CommonService {
   public openMyTeamDetailPage() {
     this.nav.navigateForward(['/my-team/details']);
   }
+  public openSubordinateLeavePage() {
+    this.nav.navigateForward(['/my-team/subordinate-leave']);
+  }
   public openMyRequestPage() {
     this.nav.navigateForward(['/mowadhafi/my-request']);
   }
@@ -1216,6 +1245,9 @@ export class CommonService {
   public openWorklistMainPage() {
     this.nav.navigateForward(['/notification/worklist-main']);
   }
+  public openWorklistSettingsPage() {
+    this.nav.navigateForward(['/notification/worklist-settings']);
+  }
   public openWorklistMainPRPage() {
     this.nav.navigateForward(['/notification/worklist-main-PR']);
   }
@@ -1290,6 +1322,16 @@ export class CommonService {
   public openAddAddress() {
     this.nav.navigateForward(['/profile/add-address']);
   }
+  public openAddContact() {
+    this.nav.navigateForward(['/profile/contact']);
+  }
+  public openAddUpdateContact() {
+    this.nav.navigateForward(['/profile/add-update-contact']);
+  }
+  public confirmContact() {
+    this.nav.navigateForward(['/profile/confirm-contact']);
+  }
+
   public openConfirmAddAddress() {
     this.nav.navigateForward(['/profile/confirm-add-address']);
   }
@@ -1299,12 +1341,45 @@ export class CommonService {
   public eitUpdate() {
     this.nav.navigateForward(['/eit/eit-update-list']);
   }
+  public openCEIPage() {
+    this.nav.navigateForward(['/eit/cei-homepage']);
+  }
+  public openCEIListPage() {
+    this.nav.navigateForward(['/eit/cei-list']);
+  }
   public openAnnouncement() {
     this.nav.navigateForward(['/backend-integrations/announcement']);
   }
+  public openConcurrentReport() {
 
+    this.nav.navigateForward(['/reports/concurrent-report']);
+  }
+  public openConcurrentTransaction() {
 
+    this.nav.navigateForward(['/reports/transaction-list']);
+  }
+  public openTermination() {
 
+    this.nav.navigateForward(['/termination/termination-form']);
+  }
+  public confirmTermination() {
+
+    this.nav.navigateForward(['/termination/confirm-termination']);
+  }
+  public openTransactions() {
+
+    this.nav.navigateForward(['/pending-transaction/home']);
+  }
+
+  public openItemForSale() {
+    this.nav.navigateForward('/itemforsale/items');
+  }
+  public openCreateitems() {
+    this.nav.navigateForward('/itemforsale/home');
+  }
+  public filterItemforSale() {
+    this.nav.navigateForward('/itemforsale/filter');
+  }
   public navigatePage(path) {
     this.nav.navigateForward([path]);
   }
@@ -1507,4 +1582,147 @@ export class CommonService {
     return this.activeType;
   }
 
+  public totalCounter = 0;
+  getTotalNumberOfWorklistRequest() {
+    this.totalCounter = parseInt(this.sharedService.getSharedData('total-count', false));
+    return this.totalCounter ? this.totalCounter : 0;
+  }
+  setTotalNumberOfWorklistRequest() {
+    if (this.totalCounter > 0) {
+      this.totalCounter -= 1;
+    }
+    this.sharedService.setSharedData(this.totalCounter, 'total-count');
+  }
+
+  public setFilterValues(data) {
+    for (const notification of data) {
+
+      this.filterKeys[notification.ITEM_TYPE] = notification.OPEN_NTF_NUMBER
+    }
+  }
+
+
+  public filters = [
+    {
+      value: 0,
+      name: 'HR',
+      active: false,
+      color: '#18a169',
+      key: 'HRSSA',
+      disable: false,
+      total: 0
+    },
+    {
+      value: 0,
+      name: 'MR',
+      active: false,
+      color: '#3cb9d5',
+      key: 'INVMOA',
+      disable: false,
+      total: 0
+    },
+    {
+      value: 0,
+      name: 'PR',
+      active: false,
+      color: '#114475',
+      key: 'REQAPPRV',
+      disable: false,
+      total: 0
+    },
+    {
+      value: 0,
+      name: 'PO',
+      active: false,
+      color: '#38c9b3',
+      key: 'POAPPRV',
+      disable: false,
+      total: 0
+    },
+    {
+      value: 0,
+      name: 'ITG',
+      active: false,
+      color: '#cc3232',
+      key: 'ITG',
+      disable: false,
+      total: 0
+    },
+    {
+      value: 0,
+      name: 'IC',
+      active: false,
+      color: '#9e7e97',
+      key: 'INVITEM',
+      disable: false,
+      total: 0
+    },
+    {
+      value: 0,
+      name: 'STAMP',
+      active: false,
+      color: '#ff9800',
+      key: 'STAMP',
+      disable: false,
+      total: 0,
+    },
+    {
+      value: 0,
+      name: 'COC',
+      active: false,
+      color: '#787299',
+      key: 'COC',
+      disable: true,
+      total: 0,
+    }
+  ];
+
+  public data = {
+    datasets: [
+      {
+        data: [0, 0, 0, 0, 0, 0, 0, 0],
+        backgroundColor: [
+          '#18a169',
+          '#3cb9d5',
+          '#114475',
+          '#38c9b3',
+          '#cc3232',
+          '#9e7e97',
+          '#ff9800',
+          '#787299'
+        ],
+        borderWidth: 6
+      }]
+  };
+
+  getFiltersData() {
+    // for (const notification of openNotificationsArray) {
+    //   if (notification.ITEM_TYPE === 'HRSSA') {
+    this.filters[0].value = this.filterKeys['HRSSA'];
+    this.data.datasets[0].data[0] = this.filterKeys['HRSSA'];
+    // } else if (notification.ITEM_TYPE === 'INVMOA') {
+    this.filters[1].value = this.filterKeys['INVMOA'];
+    this.data.datasets[0].data[1] = this.filterKeys['INVMOA'];
+    // } else if (notification.ITEM_TYPE === 'REQAPPRV') {
+    this.filters[2].value = this.filterKeys['REQAPPRV'];
+    this.data.datasets[0].data[2] = this.filterKeys['REQAPPRV'];
+    // } else if (notification.ITEM_TYPE === 'POAPPRV') {
+    this.filters[3].value = this.filterKeys['POAPPRV'];
+    this.data.datasets[0].data[3] = this.filterKeys['POAPPRV'];
+    // } else if (notification.ITEM_TYPE === 'INVITEM') {
+    this.filters[5].value = this.filterKeys['INVITEM'];
+    this.data.datasets[0].data[5] = this.filterKeys['INVITEM'];
+    // } else if (notification.ITEM_TYPE === 'STAMP') {
+    this.filters[6].value = this.filterKeys['STAMP'];
+    this.data.datasets[0].data[6] = this.filterKeys['STAMP'];
+
+    this.filters[7].value = this.filterKeys['COC'];
+    this.data.datasets[0].data[7] = this.filterKeys['COC'];
+
+    let val = { 'filters': [], 'data': {} };
+    val.filters = this.filters;
+    val.data = this.data;
+    return val;
+  }
+
 }
diff --git a/Mohem/src/app/hmg-common/services/connector/connector.service.ts b/Mohem/src/app/hmg-common/services/connector/connector.service.ts
index dc119ce4..5a1959c6 100644
--- a/Mohem/src/app/hmg-common/services/connector/connector.service.ts
+++ b/Mohem/src/app/hmg-common/services/connector/connector.service.ts
@@ -25,7 +25,7 @@ export class ConnectorService {
     headers: new HttpHeaders({ 'Content-Type': 'application/json' })
   };
   public static retryTimes = 0;
-  public static timeOut = 120 * 1000;
+  public static timeOut = 180 * 1000;
 
   // public static host = 'https://uat.hmgwebservices.com/';
   public static host = 'https://hmgwebservices.com/';
@@ -235,7 +235,7 @@ export class ConnectorService {
         }
         return false;
       } else if (result.ErrorType === 2 || result.ErrorType === 4) {
-        this.cs.stopLoading(); 
+        this.cs.stopLoading();
       } else {
         this.cs.stopLoading();
         if (!fromSMS) {
diff --git a/Mohem/src/app/hmg-common/services/menu/models/menu-response.ts b/Mohem/src/app/hmg-common/services/menu/models/menu-response.ts
index 1c7a2e1d..0a7cd754 100644
--- a/Mohem/src/app/hmg-common/services/menu/models/menu-response.ts
+++ b/Mohem/src/app/hmg-common/services/menu/models/menu-response.ts
@@ -2,10 +2,13 @@ import { ListMenu } from './list.menu';
 import { MenuEntry } from './menu.entry';
 export class MenuResponse {
     public static SHARED_DATA = 'menu_response';
-    public static SHARED_SEL_EMP= 'sel_empolyee';
-    public static SHARED_SEL_RESP_ID= 'sel_resp_id';
-    public userid:string;
-    public search:boolean;
-    public List_Menu:ListMenu;
-    public GetMenuEntriesList:MenuEntry;
+    public static MENU_LIST = 'menu_list';
+    public static SELECTED_MENU = 'selected_menu';
+    public static SHARED_SEL_EMP = 'sel_empolyee';
+    public static SHARED_SEL_RESP_ID = 'sel_resp_id';
+    public static ITG_COUNTS = 'itg-counts';
+    public userid: string;
+    public search: boolean;
+    public List_Menu: ListMenu;
+    public GetMenuEntriesList: MenuEntry;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/hmg-common/services/models/request.ts b/Mohem/src/app/hmg-common/services/models/request.ts
index 1a9e8fd2..6a16ec13 100644
--- a/Mohem/src/app/hmg-common/services/models/request.ts
+++ b/Mohem/src/app/hmg-common/services/models/request.ts
@@ -18,6 +18,8 @@ export class Request {
     public P_MOBILE_NUMBER: string;
     public P_EMAIL_ADDRESS: string;
     public P_NOTIFICATION_ID: number;
+    public PayrollCodeStr: string;
+    public LegislationCodeStr: string;
 
     // public P_LEGISLATION_CODE: string;
     // public OTP_SendType: number;
diff --git a/Mohem/src/app/hmg-common/services/rate/rate.service.ts b/Mohem/src/app/hmg-common/services/rate/rate.service.ts
index f9fef5d7..9176bf13 100644
--- a/Mohem/src/app/hmg-common/services/rate/rate.service.ts
+++ b/Mohem/src/app/hmg-common/services/rate/rate.service.ts
@@ -20,13 +20,13 @@ export class RateService {
 
   }
 
-  public rateFeature(ratedFeedBack?: any , featureKey: string = RateService.app , delay: number = 2000) {
+  public rateFeature(ratedFeedBack?: any, featureKey: string = RateService.app, delay: number = 2000) {
     if (this.isRated(featureKey)) {
       if (ratedFeedBack) {
         ratedFeedBack(true);
       }
     } else {
-      setTimeout( () => {
+      setTimeout(() => {
         this.startRating(featureKey, ratedFeedBack);
       }, delay);
     }
@@ -38,7 +38,7 @@ export class RateService {
         this.appRate.preferences = {
           displayAppName: this.ts.trPK('general', 'app-name'),
           promptAgainForEachNewVersion: true,
-          inAppReview: true,
+          // inAppReview: true,
           storeAppURL: {
             ios: 'com.ejada.hmg',
             android: 'market://details?id=com.ejada.hmg',
@@ -47,7 +47,7 @@ export class RateService {
           callbacks: {
             handleNegativeFeedback: () => {
               this.setAsRated(featureKey);
-            //this.cs.openFeedback();
+              //this.cs.openFeedback();
             },
             onButtonClicked: (buttonIndex) => {
               // when user click rate
diff --git a/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.html b/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.html
index 5e4d2dac..f91aece1 100644
--- a/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.html
+++ b/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.html
@@ -1,13 +1,40 @@
-<input [id]="attachmentname" type="file" name="attachment" style="display:none" (change)='loadAttachment($event)'
-  accept="image/*,video/*,audio/*">
-<ion-button (click)="openFile()" slot="end" expand="block" fill="outline">
-  <ion-icon name="attach" slot="start"></ion-icon>
-  {{'general,select-attachment' | translate}}
-</ion-button>
+<!-- <two-option-select (selected)="switchOptions($event)" [option1]="ts.trPK('settings','file')" [option2]="ts.trPK('settings','camera')"
+                    [isOption1]="true"></two-option-select> -->
 
-<div *ngIf="inputFiles.length>0" class="uploader-icons">
-  <ion-item *ngFor="let file of inputFiles; let i = index" lines="none">
-      <p slot="start"> <img [src]="attachmentImg" /> {{file.name}}</p>
-      <p slot="end"><img [src]="deleteImg" (click)="deleteFiles(i)"></p>
-  </ion-item>
-</div>
\ No newline at end of file
+<!-- <input [id]="attachmentname" type="file" name="attachment" style="display:none" (change)='loadAttachment($event)'
+  accept="jpg, jpeg, png, gif, pdf, doc, docx"> -->
+  <ion-button (click)="openFile()" slot="end" expand="block" fill="outline" class="uploader">
+    <ion-icon name="attach" slot="start" ></ion-icon>
+    {{'general,select-attachment' | translate}}
+  </ion-button>
+  
+  <!-- <div  class="uploader-icons">
+    <ion-item  lines="none">
+        <p slot="start" class="file-name"> <img [src]="attachmentImg" /> {{file.name}}</p>
+        <p slot="end" class="delete-cont"><img [src]="deleteImg" (click)="deleteFiles(i)"></p>
+    </ion-item>
+  </div> -->
+
+  <ion-slides>
+    <ion-slide>
+      <ion-grid class=" gridAH" *ngIf="inputFiles.length>0">
+      
+        <ion-row> 
+          <ion-col lines="none" size="3" *ngFor="let file of inputFiles; let i = index">
+          <div class="image-container">
+            <div class="uploaded">
+              <div class="closed" (click)="deleteFiles(i)">X</div>
+              <img [src]="getImgContent(file.data) " />
+          </div>
+         
+        </div>
+        </ion-col>
+        
+        </ion-row>
+      </ion-grid>
+      </ion-slide>
+    </ion-slides>
+
+  <div *ngIf="errorMsg" class="error">
+    {{errorMsg}}
+  </div>
\ No newline at end of file
diff --git a/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.scss b/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.scss
index 56325173..6b308e7b 100644
--- a/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.scss
+++ b/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.scss
@@ -2,4 +2,21 @@
     width: .7cm;
     height: .6cm;
     vertical-align: middle;
+}
+.closed{
+    position: absolute;
+    right: 0;
+    font-size: 14px;
+    color: #fff;
+    top: -5px;
+    right: -10px;
+    font-weight: bolder;
+    background: red;
+    padding: 6px;
+    border-radius: 50%;
+    text-align: center;
+    line-height: .7;
+}
+.image-container{
+    margin-top: 10px;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.ts b/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.ts
index 9df5a0c8..fe573455 100644
--- a/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.ts
+++ b/Mohem/src/app/hmg-common/ui/file-uploader/file-uploader.component.ts
@@ -1,100 +1,288 @@
-import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
-import { CommonService } from 'src/app/hmg-common/services/common/common.service';
-import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
-import { AlertController } from '@ionic/angular';
+import { Component, OnInit, Input, Output, EventEmitter, NgZone } from "@angular/core";
+import { CommonService } from "src/app/hmg-common/services/common/common.service";
+import { TranslatorService } from "src/app/hmg-common/services/translator/translator.service";
+import { AlertController, ActionSheetController, Platform } from "@ionic/angular";
+import {
+  Camera,
+  CameraOptions,
+  PictureSourceType
+} from "@ionic-native/Camera/ngx";
+import { FileChooser } from "@ionic-native/file-chooser/ngx";
+import { File } from "@ionic-native/file/ngx";
+import { FilePath } from "@ionic-native/file-path/ngx";
+import { Base64 } from "@ionic-native/base64/ngx";
+import { IOSFilePicker } from '@ionic-native/file-picker/ngx';
+import { Location } from '@angular/common';
+import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 
 
-export interface CustomWindow extends Window {
-  File: any;
-  FileReader: any;
-}
-declare let window: CustomWindow;
-
 @Component({
-  selector: 'file-uploader',
-  templateUrl: './file-uploader.component.html',
-  styleUrls: ['./file-uploader.component.scss']
+  selector: "file-uploader",
+  templateUrl: "./file-uploader.component.html",
+  styleUrls: ["./file-uploader.component.scss"]
 })
 export class FileUploaderComponent implements OnInit {
   @Input() multiupload = false;
-  @Input() attachmentname = 'attachment-loader';
+  @Input() attachmentname = "attachment-loader";
   public attachmentData: string;
-  @Input() maxFileSize = 10 * 1024 * 1024;
+  public errorMsg: string;
+  public selectedOpn: number = 1;
+  public allowdType: any = ["jpg", "jpeg", "png", "gif", "pdf", "doc", "docx"];
+  @Input() maxFileSize = 5 * 1024 * 1024;
   @Output() fileSelected = new EventEmitter();
   public inputFiles: any = [];
-  public attachmentImg = 'assets/icon/attachment.png';
-  public deleteImg = 'assets/icon/delete.png';
+  public attachmentImg = "assets/icon/attachment.png";
+  public deleteImg = "assets/icon/delete.png";
+  public nativePath: any;
+  public actionSheet: any;
+  public isActionSheetShown: boolean = false;
+  @Input() selectedAttachment = [];
   constructor(
     public cs: CommonService,
     public ts: TranslatorService,
-    public alertController: AlertController
-  ) {
-  }
+    public alertController: AlertController,
+    private cameraController: Camera,
+    private actionSheetController: ActionSheetController,
+    private fileChooser: FileChooser,
+    private file: File,
+    private filePath: FilePath,
+    public base64: Base64,
+    public platform: Platform,
+    private iOSfilePicker: IOSFilePicker,
+    public ngzone: NgZone,
+    public loc: Location,
+    public sanitizer: DomSanitizer
+  ) { }
 
   ngOnInit() {
+    this.platform.backButton.subscribeWithPriority(9999, () => {
+      // You decide what happens 
+      if (this.isActionSheetShown)
+        this.actionSheet.dismiss();
+      else
+        this.loc.back();
+    });
+    this.inputFiles = this.selectedAttachment;
   }
 
-
-  public loadAttachment(changeEvent) {
-    const fileInput = this.getFileElement();
-    if (this.isFileSupported()) {
-      if (fileInput.files != null && fileInput.files.length > 0) {
-        const file = fileInput.files[0];
-        const reader = new FileReader();
-        if (file.size <= this.maxFileSize) {
-          reader.onload = (data) => {
-            if (this.multiupload) {
-              this.inputFiles.push({name: file.name, data: data.target['result']});
-              } else {
-                this.inputFiles = [{name: file.name, data: data.target['result']}];
-              }
-            this.fileSelected.emit( {
-              name: file.name ,
-              data: data.target['result'],
-              inputFiles: this.inputFiles
-            });
-          };
-          reader.readAsDataURL(file);
-        } else {
-          this.attachmentData = null;
-          changeEvent.target.value = ''; //  remove current selection
-          this.showFileExceededMaxSize();
-        }
-      } else {
-        this.attachmentData = null;
-      }
-    }
+  ngOnDestroy(): void {
   }
+  async openFile() {
+    if (this.platform.is('ios'))
+      this.openiOSActionSheet();
+    else
+      this.openAndroidActionSheet();
+    //this.openiOSActionSheet();
 
-  private isFileSupported() {
-    return (window.FileReader && window.File);
   }
+  async openAndroidActionSheet() {
+    this.actionSheet = await this.actionSheetController.create({
+      header: this.ts.trPK("itemforsale", "slect-source-file"), //"Select Image file",
 
-  private showFileExceededMaxSize() {
-    this.cs.presentConfirmDialog(
-      this.ts.trPK('general', 'large-file'),
-      () => {
-        this.openFile();
-      },
-      () => {
-      }
-    );
+      buttons: [
+        {
+          text: this.ts.trPK("itemforsale", "from-library"),
+          handler: () => {
+            this.takePictureiOS();
+          }
+        },
+        {
+          text: this.ts.trPK("itemforsale", "from-camera"),
+          handler: () => {
+            this.takePicture(this.cameraController.PictureSourceType.CAMERA);
+          }
+        },
+        {
+          text: this.ts.trPK("general", "cancel"),
+          role: "cancel"
+        }
+      ]
+    });
+    this.isActionSheetShown = true;
+    await this.actionSheet.present();
   }
 
-  private getFileElement(): HTMLInputElement {
-    return document.getElementById(this.attachmentname) as HTMLInputElement;
+  async openiOSActionSheet() {
+    this.actionSheet = await this.actionSheetController.create({
+      header: this.ts.trPK("itemforsale", "slect-source-file"), //"Select Image file",
+      buttons: [
+        {
+          text: this.ts.trPK("itemforsale", "from-library"),
+          handler: () => {
+            this.takePictureiOS();
+          }
+        },
+        {
+          text: this.ts.trPK("itemforsale", "from-camera"),
+          handler: () => {
+            this.takePicture(this.cameraController.PictureSourceType.CAMERA);
+          }
+        },
+
+        {
+          text: this.ts.trPK("itemforsale", "from-icloud"),
+          handler: () => {
+            this.takePicture(this.cameraController.PictureSourceType.PHOTOLIBRARY);
+          }
+        },
+        {
+          text: this.ts.trPK("general", "cancel"),
+          role: "cancel"
+        }
+      ]
+    });
+    this.isActionSheetShown = true;
+    await this.actionSheet.present();
   }
 
-  public openFile() {
-    const fileInput = this.getFileElement();
-    fileInput.click();
+  public takePictureiOS() {
+    const options: CameraOptions = {
+      quality: 60,
+      sourceType: this.cameraController.PictureSourceType.PHOTOLIBRARY,
+      destinationType: this.cameraController.DestinationType.DATA_URL,
+      encodingType: this.cameraController.EncodingType.JPEG,
+      mediaType: this.cameraController.MediaType.PICTURE,
+      correctOrientation: true,
+    }
+    this.cameraController.getPicture(options).then((imageData) => {
+      const data = "data:image/jpeg;base64," + imageData;
+      this.pushFiles(this.getFileName(), data);
+    }, (err) => {
+    });
   }
+
   public deleteFiles(index: number) {
     this.inputFiles.splice(index, 1);
-    this.fileSelected.emit( {
+    this.fileSelected.emit({
       name: null,
-      data: '',
+      data: "",
       inputFiles: this.inputFiles
     });
+    this.errorMsg = null;
+  }
+  public switchOptions($event) {
+    this.selectedOpn = $event;
+  }
+  public takePicture(sourceType: PictureSourceType) {
+    const options: CameraOptions = {
+      quality: 50,
+      destinationType: this.cameraController.DestinationType.DATA_URL,
+      encodingType: this.cameraController.EncodingType.JPEG,
+      sourceType: sourceType,
+      mediaType: this.cameraController.MediaType.PICTURE,
+      correctOrientation: true
+    };
+    if (sourceType === this.cameraController.PictureSourceType.PHOTOLIBRARY) {
+      if (this.platform.is('android')) {
+        this.fileChooser
+          .open()
+          .then(uri => {
+            this.readFile(uri);
+          })
+          .catch(e => { });
+      } else {
+        this.iOSfilePicker.pickFile(['public.content']).then(uri => {
+
+          let correctPath = uri.substr(0, uri.lastIndexOf('/') + 1);
+          let currentName = uri.substring(uri.lastIndexOf('/') + 1);
+          this.nativePath = uri;
+
+          this.file.readAsDataURL("file:///" + correctPath, currentName).then(result => {
+            this.pushFiles(currentName, result);
+          }).catch(e => { });
+        }).catch(e => { });
+      }
+    } else {
+      this.cameraController.getPicture(options).then(imageData => {
+        const data = "data:image/jpeg;base64," + imageData;
+        this.pushFiles(this.getFileName(), data);
+      });
+    }
+  }
+  pushFiles(name, files) {
+    this.ngzone.run(() => {
+      if (this.multiupload) {
+        this.inputFiles.push({ name: name, data: files });
+      } else {
+        this.inputFiles = [{ name: name, data: files }];
+      }
+      this.fileSelected.emit({
+        name: name,
+        data: files,
+        inputFiles: this.inputFiles
+      });
+    });
+  }
+  readFile(fileUrl: any) {
+    this.filePath.resolveNativePath(fileUrl).then(filePathResult => {
+      this.nativePath = filePathResult;
+      this.file.resolveLocalFilesystemUrl(this.nativePath).then(entry => {
+        entry.getMetadata(metadata => {
+          if (metadata.size <= this.maxFileSize) {
+            this.errorMsg = null;
+            this.encodeFiles(entry);
+          } else {
+            this.errorMsg = this.ts.trPK("general", "large-file");
+          }
+        }, (error) => {
+          console.log(error)
+        });
+      });
+    });
+  }
+  getImgContent(imgFile): SafeUrl {
+    console.log(imgFile);
+    return this.sanitizer.bypassSecurityTrustUrl(imgFile);
+  }
+
+  checkDuplicate(name: string) {
+    return this.inputFiles.filter(a => {
+      return a.name === name;
+    });
+  }
+  encodeFiles(entry) {
+    let fileName = entry.nativeURL.split('/').pop();
+    let path = entry.nativeURL.substring(0, entry.nativeURL.lastIndexOf("/") + 1);
+
+    this.file.readAsDataURL(path, fileName)
+      .then(base64File => {
+      })
+      .catch((err) => {
+        console.log('Error reading file', err);
+      })
+    this.base64.encodeFile(this.nativePath).then(
+      (base64File: string) => {
+        const type = this.nativePath.substr(
+          this.nativePath.lastIndexOf(".") + 1
+        );
+        if (this.allowdType.includes(type.toLowerCase())) {
+          if (this.checkDuplicate(entry.name).length === 0) {
+            this.pushFiles(entry.name, base64File);
+            this.errorMsg = null;
+          } else {
+            this.errorMsg = this.ts.trPK("general", "file-name-exist");
+          }
+        } else {
+          this.attachmentData = null;
+          this.errorMsg = this.ts.trPK("general", "not-supported");
+        }
+      },
+      err => {
+        console.log(err);
+      }
+    );
+  }
+  getFileName() {
+    const date = new Date().valueOf();
+    let text = "";
+    const possibleText =
+      "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+    for (let i = 0; i < 5; i++) {
+      text += possibleText.charAt(
+        Math.floor(Math.random() * possibleText.length)
+      );
+    }
+    const imageName = date + "." + text + ".jpeg";
+    return imageName;
   }
 }
diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html
index 7d62b3c5..40d6516a 100644
--- a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html
+++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html
@@ -30,6 +30,22 @@
             </ion-buttons> -->
             </ion-col>
 
+            <ion-col *ngIf="worklistSetting"  [size]="2" style="padding: 0;" (click)="openNotifictionSetting()">
+              <div class="profile-image-container setting-conatainer">
+                  <ion-icon src="../assets/icon/settings-not.svg" style="width: 30px;height: 30px;margin-top: 5px; color: white;"></ion-icon>
+                </div>
+            </ion-col>
+
+            <ion-col *ngIf="performanceEvaluation"  [size]="2" style="padding: 0;" (click)="openPerormance()">
+              <div class="profile-image-container">
+                  <ion-icon src='../assets/icon/bar-chart.svg' style="width: 30px;height: 25px;margin-top: 5px; color: white;"></ion-icon>
+                </div>
+            </ion-col>
+            <ion-col *ngIf="subordinateLeave"  [size]="2" style="padding: 0;" (click)="openSubordinateLeavePage()">
+              <div class="profile-image-container">
+                  <ion-icon name='people' style="width: 30px;height: 30px;margin-top: 5px; color: white;"></ion-icon>
+                </div>
+            </ion-col>
     </ion-row>
   </ion-toolbar>
 </ion-header>
\ No newline at end of file
diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss
index a8495839..60f1d786 100644
--- a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss
+++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss
@@ -23,4 +23,8 @@
 }
 .header-toolbar-new {
     --background: #269DB8;
+}
+.setting-conatainer{
+    height: 40px !important;
+    width: 40px !important;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts
index 75dc2703..404710f4 100644
--- a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts
+++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts
@@ -1,5 +1,11 @@
 import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { WorklistSettingComponent } from 'src/app/notification/worklist-setting/worklist-setting.component';
 import { CommonService } from '../../services/common/common.service';
+import { DashboredService } from '../../services/dashbored/dashbored.service';
+import { PerformanceAppraisalResponse } from '../../services/dashbored/performance-appraisal.response';
+import { SharedDataService } from '../../services/shared-data-service/shared-data.service';
+import { TranslatorService } from '../../services/translator/translator.service';
 
 @Component({
   selector: 'app-generic-header',
@@ -16,10 +22,21 @@ export class GenericHeaderComponent implements OnInit {
   @Input() updateDirection = false;
   @Input() headerText = '';
   @Input() backLink: string;
+  @Input() worklistSetting = false;
+  @Input() performanceEvaluation = false;
+  @Input() subordinateLeave = false;
   @Output() trigger = new EventEmitter();
 
+  public appraisalArr: any = [];
+  public performanceData: any = [];
+
   public close = 'assets/imgs/cancel.png';
-  constructor(public common: CommonService) { }
+  constructor(
+    public common: CommonService,
+    public DS: DashboredService,
+    public sharedData: SharedDataService,
+    public ts: TranslatorService,
+    public modalController: ModalController) { }
 
   ngOnInit() {
     if (this.updateDirection) {
@@ -35,4 +52,47 @@ export class GenericHeaderComponent implements OnInit {
     this.trigger.emit();
   }
 
+  async openNotifictionSetting() {
+    // const modal = await this.modalController.create({
+    //   component: WorklistSettingComponent,
+    //   cssClass: 'app-update-modal-css',
+    // });
+    // return await modal.present();
+    this.common.openWorklistSettingsPage();
+  }
+
+
+  public openPerormance() {
+    this.showPerformanceAppraisal();
+  }
+
+  public showPerformanceAppraisal() {
+    this.DS.getPerformanceAppraisal(() => {
+      this.showPerformanceAppraisal();
+    }).subscribe((result: PerformanceAppraisalResponse) => {
+      this.handlePerformanceAppraisalResult(result);
+    });
+  }
+
+  private handlePerformanceAppraisalResult(result) {
+    if (this.common.validResponse(result)) {
+      if (this.common.hasData(result.GetPerformanceAppraisalList)) {
+        this.appraisalArr = result.GetPerformanceAppraisalList;
+        this.performanceData = [];
+        for (let i = 0; i < this.appraisalArr.length; i++) {
+          this.performanceData.push({ name: this.appraisalArr[i].APPRAISAL_YEAR, value: parseInt(this.appraisalArr[i].APPRAISAL_SCORE).toFixed() });
+        }
+        console.log('PerformanceAppraisalResponse');
+        this.sharedData.setSharedData(this.performanceData, PerformanceAppraisalResponse.PERFORMANCE_DATA);
+        this.common.openPerformanceevaluation();
+      } else {
+        let msg: string = this.ts.trPK("userProfile", "no-appraisal");
+        this.common.presentAlert(msg);
+      }
+    }
+  }
+
+  public openSubordinateLeavePage() {
+    this.common.openSubordinateLeavePage();
+  }
 }
diff --git a/Mohem/src/app/hmg-common/ui/smsdialog/smsdialog.page.ts b/Mohem/src/app/hmg-common/ui/smsdialog/smsdialog.page.ts
index 24cc3e4f..64e9872c 100644
--- a/Mohem/src/app/hmg-common/ui/smsdialog/smsdialog.page.ts
+++ b/Mohem/src/app/hmg-common/ui/smsdialog/smsdialog.page.ts
@@ -18,57 +18,56 @@ import { AlertController } from '@ionic/angular';
   styleUrls: ['./smsdialog.page.scss'],
 })
 export class SmsdialogPage implements OnInit {
-  public timeInSeconds : number ;
-  public time : number;
-  public runTimer : boolean;
+  public timeInSeconds: number;
+  public time: number;
+  public runTimer: boolean;
   public static SHARED_DATA = 'h2o-login-details';
-  public hasStarted : boolean;
+  public hasStarted: boolean;
   public countryCode: CountryCode;
-  public hasFinished : boolean;
-  public remainingTime : number;
-  public displayTime : string = "";
+  public hasFinished: boolean;
+  public remainingTime: number;
+  public displayTime: string = "";
   // public userData: UserDetailsModel;
-  public mobile : string;
-  public country_code : string;
-  public id : string;
-  public MobileNumber : string;
-  public token : string;
-  public resend : boolean = false;
-  public smc_code : any;
+  public mobile: string;
+  public country_code: string;
+  public id: string;
+  public MobileNumber: string;
+  public token: string;
+  public resend: boolean = false;
+  public smc_code: any;
   constructor(public cs: CommonService,
     public ts: TranslatorService,
     public alertController: AlertController,
     public smsService: SmsReaderService,
     public sharedData: SharedDataService,
-    private modalCtrl:ModalController,
+    private modalCtrl: ModalController,
     // private navParams: NavParams,
-    public smsservice: SMSDialogService) { 
-      // this.country_code = this.navParams.get("c_code");
-      // this.MobileNumber = this.navParams.get('mobile');
-      // this.mobile = this.navParams.get('mobile');
-      // this.id = this.navParams.get('id');
-      // this.smsservice.sendActivationCode(this.id, this.mobile,
-      //   this.country_code, () => { },
-      //       this.ts.trPK('general', 'ok')).subscribe((result: SendValidationResponse) => {
-      //           if (this.cs.validResponse(result)) {
-      //               if (result.isSMSSent) {
-      //                   this.token = result.LogInTokenID;
-      //                   this.initTimer();
-      //                   this.startTimer();
-      //               } else {
-      //                   this.stopSMSMonitoring();
-      //               }
-      //           } else {
-      //               this.stopSMSMonitoring();
-      //           }
-      //       });
-    }
+    public smsservice: SMSDialogService) {
+    // this.country_code = this.navParams.get("c_code");
+    // this.MobileNumber = this.navParams.get('mobile');
+    // this.mobile = this.navParams.get('mobile');
+    // this.id = this.navParams.get('id');
+    // this.smsservice.sendActivationCode(this.id, this.mobile,
+    //   this.country_code, () => { },
+    //       this.ts.trPK('general', 'ok')).subscribe((result: SendValidationResponse) => {
+    //           if (this.cs.validResponse(result)) {
+    //               if (result.isSMSSent) {
+    //                   this.token = result.LogInTokenID;
+    //                   this.initTimer();
+    //                   this.startTimer();
+    //               } else {
+    //                   this.stopSMSMonitoring();
+    //               }
+    //           } else {
+    //               this.stopSMSMonitoring();
+    //           }
+    //       });
+  }
 
   ngOnInit() {
   }
 
-  closeModal()
-  {
+  closeModal() {
     this.modalCtrl.dismiss();
   }
 
@@ -77,8 +76,8 @@ export class SmsdialogPage implements OnInit {
   }
 
   initTimer() {
-    if (!this.timeInSeconds) { 
-      this.timeInSeconds = 60; 
+    if (!this.timeInSeconds) {
+      this.timeInSeconds = 60;
     }
     this.time = this.timeInSeconds;
     this.runTimer = false;
@@ -87,22 +86,22 @@ export class SmsdialogPage implements OnInit {
     this.remainingTime = this.timeInSeconds;
     this.displayTime = this.getSecondsAsDigitalClock(this.remainingTime);
   }
- 
+
   startTimer() {
     this.runTimer = true;
     this.hasStarted = true;
     this.resend = false;
     this.timerTick();
   }
-  
+
   pauseTimer() {
     this.runTimer = false;
   }
-  
+
   resumeTimer() {
     this.startTimer();
   }
- 
+
   timerTick() {
     setTimeout(() => {
       if (!this.runTimer) { return; }
@@ -117,7 +116,7 @@ export class SmsdialogPage implements OnInit {
       }
     }, 1000);
   }
- 
+
   getSecondsAsDigitalClock(inputSeconds: number) {
     var sec_num = parseInt(inputSeconds.toString(), 10); // don't forget the second param
     var hours = Math.floor(sec_num / 3600);
@@ -132,13 +131,12 @@ export class SmsdialogPage implements OnInit {
     return minutesString + ':' + secondsString;
   }
 
-  validate()
-  {
+  validate() {
     this.checkSMSActivationCode(this.smc_code);
   }
 
   public presentSMSPasswordDialog() {
-    
+
   }
 
   async presentAlert() {
@@ -153,21 +151,20 @@ export class SmsdialogPage implements OnInit {
 
   private checkSMSActivationCode(smsCode: string) {
     this.smsservice.validateActivationCode(this.token, smsCode,
-        () => {}, this.ts.trPK('settings', 'incorrect_otp')).subscribe((result: Response) => {
-            if (this.cs.validResponse(result)) {
-                this.stopSMSMonitoring();
-                this.modalCtrl.dismiss();
-                SMSDialogService.modal_success = true;
-            }
-        });
+      () => { }, this.ts.trPK('settings', 'incorrect_otp')).subscribe((result: Response) => {
+        if (this.cs.validResponse(result)) {
+          //this.stopSMSMonitoring();
+          this.modalCtrl.dismiss();
+          SMSDialogService.modal_success = true;
+        }
+      });
   }
 
   public stopSMSMonitoring() {
-      this.smsService.stopSMSMonitoring();
+    this.smsService.stopSMSMonitoring();
   }
 
-  public ResendOTP()
-  {
+  public ResendOTP() {
     // this.smsservice.sendActivationCode(this.id, this.mobile,
     //   this.country_code, () => { },
     //   this.ts.trPK('general', 'ok')).subscribe((result: SendValidationResponse) => {
diff --git a/Mohem/src/app/hmg-common/ui/stats-button/stats-button.component.scss b/Mohem/src/app/hmg-common/ui/stats-button/stats-button.component.scss
index 0663997a..6895ceb4 100644
--- a/Mohem/src/app/hmg-common/ui/stats-button/stats-button.component.scss
+++ b/Mohem/src/app/hmg-common/ui/stats-button/stats-button.component.scss
@@ -53,3 +53,13 @@
     width: 100px;
     height: 70px;
 }
+
+.loader {
+    position: absolute;
+    width: 100%;
+    top: 70px;
+    left: 2px;
+    img {
+        width: 25px;
+    }
+}
diff --git a/Mohem/src/app/home/home.page.html b/Mohem/src/app/home/home.page.html
index b323351c..f189e43a 100644
--- a/Mohem/src/app/home/home.page.html
+++ b/Mohem/src/app/home/home.page.html
@@ -10,6 +10,9 @@
     <ion-row *ngIf="showStaticServices" class="slideFullWidth">
       <ion-slides [options]="slideOptsOne" class="padding-slide slide">
         <ion-slide *ngFor="let button of statsButtons; let i=index;">
+          <div class="loader" *ngIf="i === 1 && showLoader">
+            <img  src="../assets/icon/progress-loading.gif" />
+          </div>
               <app-stats-button 
                 [title]="button.title"
                 [statsValue]="button.statsValue"
@@ -63,7 +66,7 @@
       <ion-label>    {{'general,other-services' | translate}}  </ion-label>
       </ion-col>
       <ion-slides [options]="slideOptsTwo" >
-        <ion-slide style="pointer-events: none; opacity: .3"> 
+        <ion-slide > 
           <app-services-button  (click)="itemForSale()" [title]="'general,items-sales' | translate" >
           </app-services-button>
         </ion-slide>
diff --git a/Mohem/src/app/home/home.page.scss b/Mohem/src/app/home/home.page.scss
index ba5d461a..f74783fe 100644
--- a/Mohem/src/app/home/home.page.scss
+++ b/Mohem/src/app/home/home.page.scss
@@ -156,3 +156,14 @@ ion-label{
 //         text-transform: uppercase;
 //     }
 // }
+
+
+.loader {
+    position: absolute;
+    width: 100%;
+    top: 70px;
+    left: 2px;
+    img {
+        width: 25px;
+    }
+}
\ No newline at end of file
diff --git a/Mohem/src/app/home/home.page.ts b/Mohem/src/app/home/home.page.ts
index 0a882f0f..98b422d6 100644
--- a/Mohem/src/app/home/home.page.ts
+++ b/Mohem/src/app/home/home.page.ts
@@ -11,6 +11,7 @@ import { Geolocation } from '@ionic-native/geolocation/ngx';
 import { BarcodeScanner } from '@ionic-native/barcode-scanner/ngx';
 import { Device } from '@ionic-native/device/ngx';
 import { attendanceSwipeScannerRequest } from './models/attendanceSwipe.Request';
+import { COCRequest } from 'src/app/notification/models/COCRequest';
 import { Response } from 'src/app/hmg-common/services/models/response';
 import { AttendanceService } from './services/attendance.services';
 import { LoginRequest } from '../hmg-common/services/authentication/models/login.request';
@@ -41,7 +42,9 @@ import { NFC, Ndef } from "@ionic-native/nfc/ngx"
 import { DigitalIdComponent } from '../authentication/digital-id/digital-id.component';
 import { FirebaseX } from '@ionic-native/firebase-x/ngx';
 import { BusinessCardComponent } from "src/app/authentication/business-card/business-card.component";
-
+import * as moment from "moment";
+import { count } from 'console';
+import { HomeComponent } from "src/app/notification/home/home.component";
 @Component({
   selector: 'app-home',
   templateUrl: './home.page.html',
@@ -68,6 +71,7 @@ export class HomePage implements OnInit {
   public showVcationRule = false;
   public isFakeLocationUsed = false;
   public intervalCountdown: any;
+  public showLoader = true;
   public statsButtons = [
     {
       title: this.ts.trPK('attendance-tracking', 'title'),
@@ -192,11 +196,11 @@ export class HomePage implements OnInit {
       spaceBetween: 10
     };
     this.slideOptsTwo = {
-        slidesPerView: width > 320 ? 3.2 : 2.5,
-        spaceBetween: width > 320 ? 10 : 5
+      slidesPerView: width > 320 ? 3.2 : 2.5,
+      spaceBetween: width > 320 ? 10 : 5
     };
     this.showStaticServices = true;
-}
+  }
   ionViewWillEnter() {
     this.common.startLoading();
     this.slideSettingsTwo();
@@ -369,10 +373,18 @@ export class HomePage implements OnInit {
   callDashboardServices() {
     this.getMenu();
     this.setServicesPrivilage();
-    this.openNotificationsDashbored();
+    if (this.common.getTotalNumberOfWorklistRequest()) {
+      this.statsButtons[1].statsValue = this.common.getTotalNumberOfWorklistRequest();
+      this.showLoader = false;
+    } else {
+      this.openNotificationsDashbored();
+    }
+
     this.showOpenMissingSwipes();
     this.showAttendanceTracking();
-    this.getAccrualBalance();
+    var accrualBalance = this.common.sharedService.getSharedData('leaveAccrualBalance', false);
+    if (!accrualBalance)
+      this.getAccrualBalance();
   }
 
   public Vacation_Rule() {
@@ -408,6 +420,7 @@ export class HomePage implements OnInit {
     selMenu.List_Menu = item;
     selMenu.userid = this.userData.EMPLOYEE_NUMBER;
     this.common.sharedService.setSharedData(selMenu, MenuResponse.SHARED_DATA);
+    this.common.sharedService.setSharedData(this.menuList, MenuResponse.MENU_LIST);
     this.getMenuEntries(item);
     // tslint:disable-next-line: prefer-for-of
     for (let i = 0; i < this.menuList.length; i++) {
@@ -657,14 +670,64 @@ export class HomePage implements OnInit {
           result,
           'worklistNotifications'
         );
+        this.common.setFilterValues(result['GetOpenNotificationsList']);
+      } else {
+        this.showLoader = false;
+        this.common.stopLoading();
       }
+    }, (error) => {
+      this.showLoader = false;
+      this.common.stopLoading();
     });
   }
 
   ITGCountAllNotification() {
     this.workListService.getITGDetails('', '', this.isPostNoLoad).subscribe((result: any) => {
-      this.statsButtons[1].statsValue =
-        Math.floor(this.countAllNotification + result.TotalCount);
+      if (this.common.validResponse(result)) {
+        this.common.sharedService.setSharedData(result, MenuResponse.ITG_COUNTS);
+        this.common.filterKeys['ITG'] = result.TotalCount;
+        this.statsButtons[1].statsValue = Math.floor(this.countAllNotification + result.TotalCount);
+        this.common.sharedService.setSharedData(this.statsButtons[1].statsValue, 'total-count');
+        this.getCOCNotificationCount();
+        this.common.stopLoading();
+      } else {
+        this.showLoader = false;
+        this.common.stopLoading();
+      }
+    }, (error) => {
+      this.showLoader = false;
+      this.common.stopLoading();
+    });
+  }
+
+  getCOCNotificationCount() {
+    const request = new COCRequest();
+    request.ItgPageSize = 1;
+    request.ItgPageNo = 1;
+    request.Date = moment(new Date()).format("YYYY-MM-DD");
+
+    this.workListService.getCOCCount(request, '', '', this.isPostNoLoad).subscribe((result: any) => {
+      console.log(result);
+      if (this.common.validResponse(result)) {
+        const countResult = result.Mohemm_ITG_Pending_Task_ResponseItem;
+        const totalCount = countResult.escalation + countResult.waitingToClose + countResult.waitingForAcceptance + countResult.extendTATRequest;
+        this.common.filterKeys['COC'] = totalCount;
+  
+  
+        this.statsButtons[1].statsValue = Math.floor(this.statsButtons[1].statsValue + totalCount);
+  
+        this.common.sharedService.setSharedData(this.statsButtons[1].statsValue, 'total-count');
+
+        this.showLoader = false;
+        this.common.stopLoading();
+      } else {
+        this.showLoader = false;
+        this.common.stopLoading();
+      }
+
+
+    }, (error) => {
+      this.showLoader = false;
       this.common.stopLoading();
     });
   }
@@ -749,7 +812,7 @@ export class HomePage implements OnInit {
             totalTicketsLeft = totalTicketsLeft + accrualBalance.ACCRUAL_NET_ENTITLEMENT;
           }
         }
-        this.statsButtons[4].statsValue = Number(totalTicketsLeft.toFixed(2)); 
+        this.statsButtons[4].statsValue = Number(totalTicketsLeft.toFixed(2));
       }
     });
   }
@@ -769,7 +832,8 @@ export class HomePage implements OnInit {
       // this.getDeviceLocation();
       this.showAttendanceOptions();
       // tslint:disable-next-line: triple-equals
-    } else if (link == '1') {
+    } else if (link == '1' && this.showLoader === false) {
+      this.common.sharedService.setSharedData(this.statsButtons[1].statsValue, 'total-count');
       this.common.startLoading();
       this.common.openNotificationPage();
       // tslint:disable-next-line: triple-equals
@@ -795,14 +859,14 @@ export class HomePage implements OnInit {
   async openBusinessCard() {
     const modal = await this.modalController.create({
       component: BusinessCardComponent,
-      cssClass: 'digital-id-modal-css'
+      cssClass: 'business-card-modal-css'
     });
     return await modal.present();
   }
 
 
   itemForSale() {
-    this.common.navigateForward('/itemforsale/items');
+    this.common.openItemForSale();
   }
   offersDiscount() {
     this.common.navigateForward('/offersdiscount/home');
diff --git a/Mohem/src/app/home/wifi-model/wifi-modal.component.ts b/Mohem/src/app/home/wifi-model/wifi-modal.component.ts
index cd90f7ce..a7b722b4 100644
--- a/Mohem/src/app/home/wifi-model/wifi-modal.component.ts
+++ b/Mohem/src/app/home/wifi-model/wifi-modal.component.ts
@@ -55,6 +55,13 @@ export class WifiModalComponent implements OnInit {
     }, 1000);
   }
 
+
+
+  async getConnectedBSSID(ssid:string){
+    let avaialbleSSID = await this.wifiWizard2.getConnectedBSSID(); 
+    console.log(avaialbleSSID);
+  }
+
   async startWifiConnection() {
     const isAndroid = this.platform.is("android");
     const isIOS = this.platform.is("ios");
diff --git a/Mohem/src/app/itemforsale/filter/filter.component.html b/Mohem/src/app/itemforsale/filter/filter.component.html
new file mode 100644
index 00000000..0e0d674c
--- /dev/null
+++ b/Mohem/src/app/itemforsale/filter/filter.component.html
@@ -0,0 +1,31 @@
+  <app-generic-header
+    showImage="false"
+    showBack="false"
+    navigate="false"
+    backlink="false"
+    [headerText]="'general,filter-offers' | translate">
+  </app-generic-header>  
+  <ion-content>
+<div class="container-icon" *ngIf="categories.length>0">
+  
+  <ion-item lines="none" *ngFor="let key of categories" (click)="filterOffers(key)" [ngClass]="{'active':activeClass==key.title }">
+    <ion-label *ngIf="direction =='ltr'">
+      {{key.title}}
+    </ion-label>
+    <ion-label *ngIf="direction =='rtl'">
+      {{key.title_Ar}}
+    </ion-label>
+    <ion-thumbnail slot="start">
+      <div class="top-filter" [innerHTML]="key.content | sanitizeHTMLPipe"></div>
+    </ion-thumbnail>
+  </ion-item>
+</div>
+
+<ion-footer >
+  <div class="centerDiv">
+    <ion-button  class="footer-button" ion-button (click)="applyFilters()">
+      {{ts.trPK('general','apply-filters')}}  </ion-button>
+  
+  </div>
+  </ion-footer>
+</ion-content>
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/filter/filter.component.scss b/Mohem/src/app/itemforsale/filter/filter.component.scss
new file mode 100644
index 00000000..2375e2ef
--- /dev/null
+++ b/Mohem/src/app/itemforsale/filter/filter.component.scss
@@ -0,0 +1,38 @@
+ion-label{
+    font-size: 14px !important;
+}
+ion-thumbnail img{
+    width: 40px;
+    height: 40px;
+    margin: 10px;
+}
+.active::before{
+    position: absolute;
+    right: 10px;
+    top: 15px;
+    padding: 0px;
+    background: #3cc353;
+    padding: 3px 2px 1px 3px;
+    border-radius: 60%;
+    font-size: 12px;
+    color: #fff;
+    content: '✓';
+    width: 20px;
+    height: 20px;
+    text-align: center;
+    z-index: 2;
+}
+ion-item{
+    border-bottom: 1px solid #ccc;
+    --padding-start: 0px;
+    margin: 0 20px 4px 20px;
+}
+
+.footer-button{
+    background: var(--newgreen)!important;border-radius: 10px;    --background: transparent; 
+    width: 80%;
+}
+ion-footer{
+    position: fixed;
+    bottom: 0;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/filter/filter.component.spec.ts b/Mohem/src/app/itemforsale/filter/filter.component.spec.ts
new file mode 100644
index 00000000..ff6002ba
--- /dev/null
+++ b/Mohem/src/app/itemforsale/filter/filter.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FilterComponent } from './filter.component';
+
+describe('FilterComponent', () => {
+  let component: FilterComponent;
+  let fixture: ComponentFixture<FilterComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ FilterComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FilterComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/itemforsale/filter/filter.component.ts b/Mohem/src/app/itemforsale/filter/filter.component.ts
new file mode 100644
index 00000000..ddfdc0ce
--- /dev/null
+++ b/Mohem/src/app/itemforsale/filter/filter.component.ts
@@ -0,0 +1,56 @@
+import { AfterViewInit, Component, OnInit } from '@angular/core';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { ModalController } from '@ionic/angular';
+import { OfferDiscountService } from 'src/app/offersdiscount/services/service';
+import { ItemForSaleService } from '../services/service.service';
+@Component({
+  selector: 'app-filter',
+  templateUrl: './filter.component.html',
+  styleUrls: ['./filter.component.scss'],
+})
+export class FilterComponent implements AfterViewInit {
+
+  segment: any = '1';
+  categoriesObj: any;
+  categories: any = [];
+  offersData: any = [];
+  activeClass: any;
+  tempSearch: any = [];
+  searchText: String;
+  public activeKey = {}
+  direction: any;
+
+  constructor(public ts: TranslatorService, public modalController: ModalController, public cs: CommonService, public offersService: OfferDiscountService) { }
+
+  ngAfterViewInit(): void {
+    this.direction = TranslatorService.getCurrentDirection();
+    this.categories = this.cs.sharedService.getSharedData(OfferDiscountService.categories, false);
+
+
+    // this.getOfferDiscount();
+  }
+
+
+  openDetails(offer) {
+    // this.cs.sharedService.setSharedData(offer, OfferDiscountService.selected_offers);
+
+    // var related = this.offersData.filter((res) => res.rowID != offer.rowID);
+    // this.cs.sharedService.setSharedData(related, OfferDiscountService.related_offers);
+
+    // this.cs.navigateForward('/offersdiscount/offer-details');
+  }
+
+
+  filterOffers(key) {
+    this.activeKey = key
+    this.activeClass = key.title;
+
+  }
+
+
+  applyFilters() {
+    this.cs.sharedService.setSharedData(this.activeKey, ItemForSaleService.selected_filters);
+    this.cs.back();
+  }
+}
diff --git a/Mohem/src/app/itemforsale/home/home.component.html b/Mohem/src/app/itemforsale/home/home.component.html
index 4086bfe6..0c53582e 100644
--- a/Mohem/src/app/itemforsale/home/home.component.html
+++ b/Mohem/src/app/itemforsale/home/home.component.html
@@ -22,7 +22,7 @@
       <div class="md-step-circle"><span style="content: url(/assets/imgs/check-white.svg)"></span></div>
       <div class="md-step-title">{{ts.trPK('itemforsale','select-category')}}</div>
       <div class="md-step-optional">{{ts.trPK('itemforsale','completed')}}</div>
-      <div class="md-step-bar-left"></div>
+      <div [class]="direction == 'ltr' ? 'md-step-bar-left' : 'md-step-bar-right'"  ></div>
       <!-- <div class="md-step-bar-right" [ngClass]="step ==1 ? 'orange-border' : 'green-border'"></div> -->
     </div>
   </ion-col>
@@ -34,7 +34,7 @@
       </div>
       <div class="md-step-title">{{ts.trPK('itemforsale','add-details')}}</div>
       
-      <div class="md-step-optional">{{step >2 ? "Completed" : "Locked"}}</div>
+      <div class="md-step-optional">{{step >2 ? ts.trPK('itemforsale','completed') :ts.trPK('itemforsale','locked')}}</div>
       <div class="md-step-bar-left"></div>
       
     </div></ion-col>
@@ -42,9 +42,9 @@
       <div class="md-step-circle"><span *ngIf="step==1 || step==2" style="content: url(/assets/imgs/check.svg)"></span>
         <span *ngIf="step>=3" style="content: url(/assets/imgs/check-white.svg)"></span></div>
       <div class="md-step-title">{{ts.trPK('itemforsale','review-sell')}}</div>
-      <div class="md-step-optional">{{step >3 ? "Completed" : "Locked"}}</div>
+      <div class="md-step-optional">{{step >3 ? ts.trPK('itemforsale','completed') : ts.trPK('itemforsale','locked')}}</div>
       <div class="md-step-bar-left"></div>
-      
+     
     </div></ion-col>
   </ion-row>
     </div>
@@ -53,85 +53,34 @@
     
 
  <div class="offering" *ngIf="step==1">
-  <h2>What are you offering?</h2>
+  <h2>{{ts.trPK('itemforsale','offering')}}</h2>
  </div>
  <ion-grid *ngIf="step==1">
  <ion-row>
-   <ion-col size="4">
-     <div class="sale-icon" (click)="nextStep()">
+ <ion-col size="4" *ngFor="let category of categories">
+     <div class="sale-icon" (click)="nextStep(category)">
      <div class="top">
-      <img src="/assets/imgs/itemsforsale/mobile.svg">
+      <div class="top-icon"  [innerHTML]="category.content | sanitizeHTMLPipe"  >
      </div>
      <div class="bottom-icon">
-       <p>Mobile & Tablets</p>
+         <p *ngIf="direction == 'ltr'">{{category.title}}</p>
+            <p *ngIf="direction =='rtl'">{{category.title_Ar}}</p>
      </div>
     </div>
-   </ion-col>
-   <ion-col size="4">
-    <div class="sale-icon" (click)="openItem()">
-    <div class="top">
-      <img src="/assets/imgs/itemsforsale/cars.svg">
-    </div>
-    <div class="bottom-icon">
-      <p>Cars & Vehicles</p>
-    </div>
-   </div>
-  </ion-col>
-  <ion-col size="4">
-    <div class="sale-icon">
-    <div class="top">
-      <img src="/assets/imgs/itemsforsale/electronic_appliances.svg">
-    </div>
-    <div class="bottom-icon">
-      <p>Electronic Applicance</p>
     </div>
-   </div>
-  </ion-col>
+   </ion-col>
  </ion-row>
-
- <ion-row>
-  <ion-col size="4">
-    <div class="sale-icon">
-    <div class="top">
-      <img src="/assets/imgs/itemsforsale/furniture.svg">
-    </div>
-    <div class="bottom-icon">
-      <p>Furniture & Home Decor</p>
-    </div>
-   </div>
-  </ion-col>
-  <ion-col size="4">
-   <div class="sale-icon">
-   <div class="top">
-    <img src="/assets/imgs/itemsforsale/fashion.svg">
-   </div>
-   <div class="bottom-icon">
-     <p>Fashion & beauty</p>
-   </div>
-  </div>
- </ion-col>
- <ion-col size="4">
-   <div class="sale-icon">
-   <div class="top">
-    <img src="/assets/imgs/itemsforsale/book and sports.svg">
-   </div>
-   <div class="bottom-icon">
-     <p>Books, Sports & Hobbies</p>
-   </div>
-  </div>
- </ion-col>
-</ion-row>
-</ion-grid>
+ </ion-grid>
 <div class="offering" *ngIf="step==2">
-  <h2>Add Details</h2>
+  <h2>{{ts.trPK('itemforsale','add-details')}}</h2>
  </div>
 <div class="add-details" *ngIf="step==2">
 <ion-grid>
   <ion-row>
-    <p>Item Info</p>
+    <p>{{ts.trPK('itemforsale','item-info')}}</p>
     <ion-col size="12">
      <ion-item lines="none">
-      <ion-input placeholder="Item Info"></ion-input>
+      <ion-input [placeholder]="ts.trPK('itemforsale','item-info')" [(ngModel)]="itemInfo"></ion-input>
      </ion-item>
     </ion-col>
   </ion-row>
@@ -142,77 +91,63 @@
       <ion-item lines="none">
      
         
-        <ion-textarea rows="6" cols="20" placeholder="Description"></ion-textarea>
+        <ion-textarea rows="6" cols="20" [placeholder]="ts.trPK('worklist','item-description')" [(ngModel)]="itemDescription"></ion-textarea>
       </ion-item>
     </ion-col>
   </ion-row>
 
 <ion-row>
   <ion-col>
-    <p>Item Condition</p>
-    <ion-radio-group value="new">
-     
-  
-   
+    <p>{{ts.trPK('itemforsale','item-condition')}}</p>
+    <ion-radio-group value="new" [(ngModel)]="itemCondition">
        <ion-col>
         <ion-radio value="new"></ion-radio>
-        <ion-label>New</ion-label>
+        <ion-label>{{ts.trPK('itemforsale','new')}}</ion-label>
          </ion-col>
          <ion-col>
         <ion-radio  value="used"></ion-radio>
-        <ion-label>Used</ion-label>
+        <ion-label>{{ts.trPK('itemforsale','used')}}</ion-label>
       </ion-col>
   
      
       </ion-radio-group>
   </ion-col>
 </ion-row>
-
+<ion-row>
+  <ion-col>
+    <p class="boldTxtNav" >{{ts.trPK('itemforsale','region')}}</p>
+    <ion-select okText='{{"general, ok" | translate }}' cancelText='{{"general, cancel" | translate }}'
+    [(ngModel)]="regionID">
+    <ion-select-option *ngFor="let region of regions" [value]="region.regionID" >{{region.regionName}}</ion-select-option>
+  
+  </ion-select>
+  </ion-col>
+</ion-row>
 <ion-row>
  
   <ion-col size="12">
-    <p>Item Price</p>
+    <p>{{ts.trPK('itemforsale','item-price')}}</p>
     <ion-item lines="none">
-    <ion-input placeholder="Item Price"></ion-input>
+    <ion-input [placeholder]="ts.trPK('itemforsale','item-price')" type="number" [(ngModel)]="itemPrice"></ion-input>
    </ion-item>
   </ion-col>
 </ion-row>
  <ion-row>
   
-    <p>Item Photos</p>
+    <p>{{ts.trPK('itemforsale','item-photos')}}</p>
  </ion-row>
- <ion-row>
-    <ion-col lines="none" size="3">
-      <div class="image-container">
-      <div class="uploaded">
-        <div class="closed">X</div>
-      <img src="assets/imgs/itemsforsale/fashion.svg" />
-    </div>
-   
-  </div>
-   </ion-col>
-   <ion-col lines="none" size="3">
-    <div class="image-container">
-    <div class="uploaded">
-      <div class="closed">X</div>
-    <img src="assets/imgs/itemsforsale/fashion.svg" />
+ <div>
+  <div class="fileUpload btn btn-primary">
+    <!-- <img  slot="start" style=" height: 55px;"src="../assets/imgs/add-photo.svg"> -->
+    <!-- <input end class="upload" type="file" ng2FileSelect [uploader]="uploader" 
+    (change)="onFileSelected($event)" (click)="onFileSelectedclick($event)" /> -->
+    <file-uploader (fileSelected)="attachmentSelected($event)" 
+    [multiupload]="true" [selectedAttachment]="selectedPicture">
+</file-uploader>
   </div>
- 
-</div>
- </ion-col>
- <ion-col lines="none" size="3">
-  <div class="image-container uploader-box">
-  <div class="uploaded">
-    <ion-icon name="camera" class="camera-icon"></ion-icon>
-   
-</div>
-
+  
 </div>
-</ion-col>
-</ion-row>
-
-
-
+ 
 </ion-grid>
 </div>
 
@@ -222,25 +157,48 @@
 
 
   <div class="add-details" *ngIf="step==3">
-    <h2 class="review-title">Furniture Table</h2>
+    <h2 class="review-title" *ngIf="direction =='rtl'">
+      {{selectedCategory.title_Ar}}
+      </h2>
+      <h2 class="review-title" *ngIf="direction =='ltr'">
+        {{selectedCategory.title}}
+        </h2>
+      
 
-     
+        <p style="font-weight: 600;">  {{itemInfo}}</p>
       
         <p>
-          Consectetur adipiscing elit. Donec blandit diam nulla, non euismod eros efficitur imperdiet. Fusce erat enim, volutpat at enim in, venenatis iaculis risus.
+         {{itemDescription}}
         </p>
         <div class="description-details">
-    <p class="orange">Used</p>
+    <p class="orange">{{itemCondition}}</p>
 
-    <img src="assets/imgs/itemsforsale/fashion.svg" />
-    <img src="assets/imgs/itemsforsale/fashion.svg" />
+    <ion-slides>
+      <ion-slide>
+        <ion-grid class=" gridAH" *ngIf="addAttachRequest.length>0">
+        
+          <ion-row> 
+            <ion-col lines="none" size="3" *ngFor="let obj of addAttachRequest">
+            <div class="image-container">
+              <div class="uploaded">
+                <!-- <div class="closed" (click)="deletePhoto(item)">X</div> -->
+              <img [src]="getImgContent('data:image/png;base64, ' +obj.Base64Data) " />
+            </div>
+           
+          </div>
+          </ion-col>
+          
+          </ion-row>
+        </ion-grid>
+        </ion-slide>
+      </ion-slides>
    <div class="selling">
 
 
-    <strong>Selling for </strong> <h2>500 SAR</h2>
+    <strong>{{ts.trPK('itemforsale','selling-for')}} </strong> <h2>{{itemPrice}} SAR</h2>
   </div>
   <div class="waring">
-    <img src="/assets/imgs/itemsforsale/alert.svg"> <label>This ad will be valid for 2 week after approval</label>
+    <img src="/assets/imgs/itemsforsale/alert.svg"> <label>{{ts.trPK('itemforsale','warning')}}</label>
   </div>
   </div>
 
@@ -250,8 +208,8 @@
 
 <ion-footer  *ngIf="step==1">
   <div class="centerDiv">
-    <ion-button  class="footer-button red-button" ion-button>
-    cancel </ion-button>
+    <ion-button  class="footer-button red-button" (click)="cancelItem()" ion-button>
+      {{ts.trPK('general','cancel')}}  </ion-button>
   
     
   </div>
@@ -260,13 +218,16 @@
 
 <ion-footer  *ngIf="step>1">
 <div class="centerDiv">
-  <ion-button  class="footer-button  red-button small-btn" ion-button (click)="step =3" *ngIf="step ==2 || step ==3">
-    cancel </ion-button>
-  <ion-button  class="footer-button  small-btn" ion-button (click)="step =3" *ngIf="step ==2">
+  <ion-button  class="footer-button  red-button small-btn" ion-button (click)="cancelItem()" *ngIf="step ==2 || step ==3">
+    {{ts.trPK('general','cancel')}}  </ion-button>
+  <ion-button  class="footer-button  small-btn" ion-button (click)="step =3" *ngIf="step ==2" [disabled]="!validate()">
     {{ts.trPK('general','next')}} </ion-button>
    
-    <ion-button  class="footer-button small-btn"  ion-button (click)="openItem()" *ngIf="step ==3">
-      Confirm </ion-button>
+    <ion-button  class="footer-button small-btn"  ion-button (click)="createItemForSale()" *ngIf="step ==3 && !editItem">
+      {{ts.trPK('general','confirm')}} </ion-button>
+      <ion-button  class="footer-button small-btn"  ion-button (click)="updateItemForSale()" *ngIf="step ==3 && editItem">
+        {{ts.trPK('general','update')}} </ion-button>
+      
 </div>
 </ion-footer>
 
diff --git a/Mohem/src/app/itemforsale/home/home.component.scss b/Mohem/src/app/itemforsale/home/home.component.scss
index da69d29b..ff52efa4 100644
--- a/Mohem/src/app/itemforsale/home/home.component.scss
+++ b/Mohem/src/app/itemforsale/home/home.component.scss
@@ -117,6 +117,10 @@ margin-left:0px
     margin-right: 0px;
     left: 40%;
 }
+.md-stepper-horizontal .md-step .md-step-bar-right {
+    margin-right: 0px;
+    right: 40%;
+}
 .orange .md-step-bar-left {
 background:#CC9B14 !important;
 font-weight: bold;
@@ -214,7 +218,7 @@ margin-bottom: 70px;
     background: #fff;
     margin: 15px;
     padding: 10px;
-    box-shadow: 3px 4px 3px -1px #ccc;
+    box-shadow: 0px 0px 2px 1px #ccc;
     border-radius: 20px;
 }
 .add-details ion-item{
@@ -246,7 +250,7 @@ position: relative;
     right: 0;
     font-size: 14px;
     color: #fff;
-    top: -15px;
+    top: -10px;
     right: -10px;
     font-weight: bolder;
     background: red;
@@ -341,3 +345,57 @@ ion-footer{
     position: absolute;
     top: 15px;
 }
+.upload-container{
+    display: inline-block;
+}
+@media screen and (min-width: 325px){
+    .fileUpload {
+        position: relative;
+        overflow: hidden;
+        margin: 10px;
+    
+    }}
+    @media screen and (min-width: 1px) and (max-width:320px){
+    .fileUpload {
+        position: relative;
+        overflow: hidden;
+        margin: 10px;
+    
+
+    }}
+
+    .fileUpload input.upload {
+        position: absolute;
+        top: 0;
+        right: 0;
+        margin: 0;
+        padding: 0;
+        font-size: 20px;
+        cursor: pointer;
+        opacity: 0;
+        filter: alpha(opacity=0);
+    }
+
+    .iconButton .imgSize{
+        width: 10px !important;
+        height: 10px;
+        }
+.close-btn{
+    color: red;
+    font-size: 22px;
+    position: relative;
+    top: 5px;
+}
+ion-radio{
+    border: 1px solid;
+    border-radius: 5px;
+    color: gray;
+    height: 20px;
+    width: 21px;
+    margin-top: 5px;
+
+}
+.sale-icon .top-icon{
+    position: relative;
+    margin: 5px 8px;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/home/home.component.ts b/Mohem/src/app/itemforsale/home/home.component.ts
index ace51a36..bdff62ff 100644
--- a/Mohem/src/app/itemforsale/home/home.component.ts
+++ b/Mohem/src/app/itemforsale/home/home.component.ts
@@ -1,6 +1,10 @@
 import { Component, OnInit } from '@angular/core';
+import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
+import { FileUploader } from 'ng2-file-upload';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { ItemForSaleService } from '../services/service.service';
 
 @Component({
   selector: 'app-home',
@@ -9,19 +13,303 @@ import { TranslatorService } from 'src/app/hmg-common/services/translator/transl
 })
 export class HomeComponent implements OnInit {
   step: any = 1;
-  constructor(public ts: TranslatorService, public cs: CommonService,) { }
+  categories: any = [];
+  direction: string;
+  uploaded: any = [];
+  public selectedFile: any;
+  indexLastObj: any = 0;
+  addAttachRequest: any = [];
+  selectedPicture = [];
+  selectedCategory: any;
+  filterAllowedType: any = [
+    "image/jpeg",
+    "image/png",
+    "image/jpg",
+  ];
+  itemInfo: string;
+  itemDescription: string;
+  itemCondition: string;
+  itemPrice: any;
+  regions: any = [];
+  regionID: any = 1;
+  editItem: any;
+  constructor(public ts: TranslatorService, private authService: AuthenticationService, private sanitizer: DomSanitizer, public cs: CommonService, private itemService: ItemForSaleService) { }
 
-  ngOnInit() { }
+  ngOnInit() {
+    this.direction = TranslatorService.getCurrentDirection();
+    this.categories = this.cs.sharedService.getSharedData(ItemForSaleService.CATEGORIES, false);
+    this.categories.shift();
+    this.getRegion();
+    this.editItem = this.cs.sharedService.getSharedData(ItemForSaleService.EDIT_ITEMS);
+    if (this.editItem) {
+      this.setEditPage();
+    }
+  }
+  getRegion() {
+    this.itemService.getRegion({}, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.regions = this.itemService.parser(result);
+      console.log(this.regions);
+    })
+  }
   openItem() {
-
-
     this.cs.navigateForward('/itemforsale/items');
   }
-  nextStep() {
+  nextStep(category) {
+    this.selectedCategory = category;
     this.step = 2;
   }
   openMyAds() {
     this.cs.navigateForward('/itemforsale/my-ads');
   }
 
+  onFileSelectedclick(event) {
+    event.target.value = '';
+  }
+  public uploader: FileUploader = new FileUploader({
+    allowedMimeType: [
+      "image/jpeg",
+      "image/png",
+      "image/jpg",
+    ],
+    maxFileSize: 10 * 1024 * 1024,
+    formatDataFunctionIsAsync: true,
+    formatDataFunction: async item => {
+      return new Promise((resolve, reject) => {
+        resolve({
+          name: item._file.name,
+          length: item._file.size,
+          contentType: item._file.type,
+          date: new Date()
+        });
+      });
+    }
+  });
+
+
+
+
+  // onFileSelected(input) {
+  //   if (!(this.filterAllowedType.indexOf(input.target.files[0].type) > -1)) {
+  //     let msg: string = "";
+  //     msg = this.ts.trPK("general", "notSupportFile");
+  //     this.cs.presentAlert(msg);
+  //     return;
+  //   } // todo: show alert that you tried uploading wrong files
+  //   else {
+  //     const file = input.target.files[0];
+  //     this.selectedFile = input.target.files;
+
+
+  //     this.getBase64(file).then(data =>
+  //       this.pushObject(data, file.name, file.type)
+  //     );
+  //   }
+  // }
+
+  // getBase64(file) {
+  //   return new Promise((resolve, reject) => {
+  //     const reader = new FileReader();
+  //     reader.readAsDataURL(file);
+  //     reader.onload = () => resolve(reader.result);
+  //     reader.onerror = error => reject(error);
+  //   });
+  // }
+
+  // pushObject(fileData, name, type) {
+
+  //   this.indexLastObj++;
+  //   try {
+  //     let array = name.split(".");
+  //     let attachType: string = array[array.length - 1];
+
+  //     this.addAttachRequest.push({
+  //       AttachmentID: this.indexLastObj,
+  //       ContentType: 'image/' + attachType, //type.split('/')[1],
+  //       Base64Data: fileData.split(",")[1],
+  //       FileName: name, //.split('.')[0],
+
+  //     });
+  //   } catch (e) { }
+  // }
+
+  removeFile(objectitem) {
+
+    let objIndex = this.addAttachRequest.findIndex(
+      item => item.AttachmentID == objectitem.AttachmentID
+    );
+    this.addAttachRequest.splice(objIndex, 1);
+  }
+  getImgContent(imgFile): SafeUrl {
+
+    return this.sanitizer.bypassSecurityTrustUrl(imgFile);
+  }
+
+  createItemForSale() {
+
+    var authUser = this.authService.getAuthenticatedRequest();
+    this.cs.startLoading();
+    // var request = new FormData();
+    // request.append('title', this.itemInfo);
+    // request.append('title_Ar', this.itemInfo);
+    // request.append('categoryID', this.selectedCategory.categoryID);
+    // request.append('description', this.itemDescription);
+    // request.append('description_Ar', this.itemDescription);
+    // request.append('employeeNumber', authUser.P_USER_NAME);
+    // request.append('quotePrice', this.itemPrice);
+    // request.append('isActive', 'true');
+    // request.append('regionID', this.regionID);
+    // request.append('status', this.itemCondition);
+    // console.log(this.selectedFile);
+    // if (this.selectedFile && this.selectedFile !== undefined) {
+    //   request.append('fileColl', this.addAttachRequest.toString());
+    // }
+    // request.append('Channel', authUser.Channel.toString());
+    // request.append('LogInToken', authUser.LogInTokenID);
+    // request.append('Token', authUser.TokenID);
+    // request.append('EmployeeNumber', authUser.P_USER_NAME);
+    // request.append('MobileNo', authUser.MobileNumber);
+    var request = {
+      "TokenID": authUser.LogInTokenID, "EmployeeNumber": authUser.P_USER_NAME, "ItgImageCollList": this.addAttachRequest,
+      "ItgTitle": this.itemInfo,
+      "ItgTitleAr": this.itemInfo,
+      "ItgCategoryID": this.selectedCategory.categoryID,
+      "ItgDescription": this.itemDescription,
+      "ItgDescriptionAr": this.itemDescription,
+      "ItgQuotePrice": this.itemPrice,
+      "RegionID": this.regionID,
+      "ItgIsActive": true,
+      "ItgStatus": this.itemCondition
+    }
+
+    this.itemService.createItemForSale(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
+      if (this.cs.validResponse(result)) {
+        this.cs.stopLoading();
+
+        this.cs.greenToastPK("general", "success-create");
+        this.openItem();
+      } else {
+        this.cs.stopLoading();
+        this.cs.redToastPK("general", "try-again");
+      }
+
+
+    })
+  }
+  setEditPage() {
+    this.step = 2;
+    this.selectedCategory = {
+      categoryID: this.editItem.categoryID,
+      title: this.editItem.categoryTitle,
+      title_Ar: this.editItem.categoryTitle
+    }
+    this.itemInfo = this.editItem.title;
+    this.itemDescription = this.editItem.description;
+    this.itemPrice = this.editItem.quotePrice;
+    this.regionID = this.editItem.regionID;
+    this.itemCondition = this.editItem.status.toLowerCase();
+    this.selectedPicture = this.getAttachment(this.editItem.itemAttachments);
+  }
+  getAttachment(itemsArray) {
+    let item = [];
+    itemsArray.forEach(element => {
+
+      item.push({
+        // attachmentId: element.attachmentId,
+        // ContentType: element.contentType,
+        data: 'data:image/png;base64,' + element.content,
+        name: element.fileName,
+
+      });
+    });
+    return item;
+  }
+  updateItemForSale() {
+
+    var authUser = this.authService.getAuthenticatedRequest();
+    this.cs.startLoading();
+    var request = new FormData();
+    request.append('itemSaleID', this.editItem.itemSaleID);
+    request.append('title', this.itemInfo);
+    request.append('title_Ar', this.itemInfo);
+    request.append('categoryID', this.selectedCategory.categoryID);
+    request.append('description', this.itemDescription);
+    request.append('description_Ar', this.itemDescription);
+    request.append('employeeNumber', authUser.P_USER_NAME);
+    request.append('quotePrice', this.itemPrice);
+    request.append('isActive', 'true');
+    request.append('regionID', this.regionID);
+    request.append('status', this.itemCondition);
+    // console.log(this.selectedFile);
+    // if (this.selectedFile && this.selectedFile !== undefined) {
+    //   request.append('fileColl', this.selectedFile[0], this.selectedFile[0].name);
+    // }
+    request.append('Channel', authUser.Channel.toString());
+    request.append('LogInToken', authUser.LogInTokenID);
+    request.append('Token', authUser.TokenID);
+    request.append('EmployeeNumber', authUser.P_USER_NAME);
+    request.append('MobileNo', authUser.MobileNumber);
+
+
+    this.itemService.updateItemForSale(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
+      if (this.cs.validResponse(result)) {
+        this.cs.stopLoading();
+
+        this.cs.greenToastPK("general", "success-create");
+        this.openItem();
+      } else {
+        this.cs.stopLoading();
+        this.cs.redToastPK("general", "try-again");
+      }
+
+
+    })
+  }
+  cancelItem() {
+    if (this.step == 2 || this.step == 3) {
+      this.step = 1;
+    } else {
+      this.cs.back();
+    }
+
+  }
+  validate() {
+    if (!this.validateChar(this.itemInfo) || !this.itemDescription || !this.itemPrice || !this.itemCondition || this.addAttachRequest.length == 0) {
+      return false;
+    } else {
+      return true;
+    }
+  }
+  validateChar(text) {
+    var regExp = /^[a-zA-Z]*$/
+    if ((!regExp.test(text) && !this.hasArabicCharacters(text)) || !text) {
+      return false;
+    }
+    else {
+      return true;
+    }
+  }
+  hasArabicCharacters(text) {
+    var regex = new RegExp("[\u0600-\u06ff]|[\u0750-\u077f]|[\ufb50-\ufc3f]|[\ufe70-\ufefc]");
+    return regex.test(text);
+  }
+  public attachmentSelected(event: any) {
+    try {
+      this.addAttachRequest = event.inputFiles.map((res: any) => {
+        let array = res.name.split(".");
+        let attachType: string = array[array.length - 1];
+        this.indexLastObj++;
+        return { AttachmentID: this.indexLastObj, FileName: res.name, Base64Data: res.data.split(",")[1], ContentType: 'image/' + attachType };
+      });
+
+
+
+
+
+
+
+
+
+
+    } catch (e) { }
+  }
 }
diff --git a/Mohem/src/app/itemforsale/item-details/item-details.component.html b/Mohem/src/app/itemforsale/item-details/item-details.component.html
index add7aca6..279a4fc8 100644
--- a/Mohem/src/app/itemforsale/item-details/item-details.component.html
+++ b/Mohem/src/app/itemforsale/item-details/item-details.component.html
@@ -1,4 +1,4 @@
-<ion-content>
+<ion-content *ngIf="itemDetails">
   <div class="head-title">
    
     <app-generic-header
@@ -9,21 +9,29 @@
   </div>
   <div class="header"></div>
   <div class="bottom"></div>
-  <div>
+  <div >
     <ion-card>
       <ion-card-header>
-        <img src="https://ii1.pepperfry.com/media/catalog/product/r/o/568x625/royal-wing-chair-in-blue-color-by-dreamzz-furniture-royal-wing-chair-in-blue-color-by-dreamzz-furnit-6hcjya.jpg" />
-      
-      
-        <ion-card-title>Furniture Table</ion-card-title>
+        <img  *ngIf="!itemDetails.itemAttachments[0] || !itemDetails.itemAttachments[0].content" src="assets/imgs/no-images.png" /> 
+        <!-- <img  *ngIf="itemDetails.itemAttachments[0]" [src]="item.itemAttachments[0]" />
+        <img  *ngIf="!itemDetails.itemAttachments[0]" src="assets/imgs/no-images.png" /> -->
+        <ion-slides *ngIf="itemDetails.itemAttachments.length>0">
+          <ion-slide *ngFor="let slide of itemDetails.itemAttachments">
+            <img   [src]="getImgContent('data:image/png;base64, ' +slide.content)" />
+          </ion-slide>
+            </ion-slides>
+        <ion-card-title *ngIf="direction == 'ltr'">{{itemDetails.title}}</ion-card-title>
+        <ion-card-title *ngIf="direction =='rtl'">{{itemDetails.title_Ar}}</ion-card-title>
       </ion-card-header>
     
       <ion-card-content>
-        Keep close to Nature's heart... and break clear away, once in awhile,
-        and climb a mountain or spend a week in the woods. Wash your spirit clean.
+        <span *ngIf="direction == 'ltr'">{{itemDetails.description}}</span>
+        <span *ngIf="direction =='rtl'">{{itemDetails.description_Ar}}</span>
         <div class="content-bottom">
-        <p class="green">New</p>
-        <h1>500 SAR</h1>
+          <p [class]="itemDetails.status=='Approved' ? 'green' : 'yellow'">{{itemDetails.status}}</p>
+        <h1> <strong>
+          {{itemDetails.quotePrice}} {{itemDetails.currencyCode}}
+        </strong></h1>
       </div>
     
       
@@ -33,9 +41,9 @@
             <img class="profile-img" src="/assets/imgs/S.png">
           </ion-avatar>
           <ion-label>
-            <p class="profile-title">Mohammed Imran</p>
-            <p>Posted on 22 April 2020</p>
-            <p><a href="">View Profile</a></p>  
+            <p class="profile-title">{{itemDetails.fullName}}</p>
+            <p>{{getDate(itemDetails.created) }}</p>
+            <!-- <p><a href="">View Profile</a></p>   -->
           </ion-label>
         
         </ion-item>
@@ -50,14 +58,15 @@
   
 <ion-footer  >
   <div class="centerDiv details-button" >
- 
+    <a [href]="'mail:' + itemDetails.emailAddress"> 
     <ion-button  class="footer-button" ion-button>
-      <img class="icon-footer" src="/assets/imgs/itemsforsale/sms.svg">
-      {{ts.trPK('sms','title')}} </ion-button>
-     
+    <img [class]="direction == 'ltr' ? 'icon-footer' : 'icon-footer-ar'" src="/assets/imgs/itemsforsale/sms.svg">
+      {{ts.trPK('general','email')}} </ion-button></a>
+
+      <a [href]="'tel:' + itemDetails.mobileNumber">
       <ion-button  class="footer-button" ion-button>
-        <img class="icon-footer" src="/assets/imgs/itemsforsale/call.svg">
-        {{ts.trPK('vacation-rule','call')}} </ion-button>
+        <img [class]="direction == 'ltr' ? 'icon-footer' : 'icon-footer-ar'" src="/assets/imgs/itemsforsale/call.svg ">
+        {{ts.trPK('vacation-rule','call')}} </ion-button></a>
   </div>
   </ion-footer>
   </ion-content>
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/item-details/item-details.component.scss b/Mohem/src/app/itemforsale/item-details/item-details.component.scss
index bcd3e47a..6bcb6c6e 100644
--- a/Mohem/src/app/itemforsale/item-details/item-details.component.scss
+++ b/Mohem/src/app/itemforsale/item-details/item-details.component.scss
@@ -76,4 +76,9 @@ ion-footer{
     margin: 0px;
     position: relative;
     left: -10px;
+}
+.icon-footer-ar{
+    margin: 0px;
+    position: relative;
+    left: 5px;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/item-details/item-details.component.ts b/Mohem/src/app/itemforsale/item-details/item-details.component.ts
index cae7ea97..c5257bfb 100644
--- a/Mohem/src/app/itemforsale/item-details/item-details.component.ts
+++ b/Mohem/src/app/itemforsale/item-details/item-details.component.ts
@@ -1,15 +1,41 @@
 import { Component, OnInit } from '@angular/core';
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
-
+import { ItemForSaleService } from '../services/service.service';
+import * as moment from 'moment';
+import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
+import { ActivatedRoute } from '@angular/router';
 @Component({
   selector: 'app-item-details',
   templateUrl: './item-details.component.html',
   styleUrls: ['./item-details.component.scss'],
 })
 export class ItemDetailsComponent implements OnInit {
-  constructor(public ts: TranslatorService, public cs: CommonService,) { }
+  itemDetails: any;
+  direction: any;
+
+  constructor(public ts: TranslatorService, public itemService: ItemForSaleService, public route: ActivatedRoute, public cs: CommonService, private sanitizer: DomSanitizer,) {
+    this.route
+      .params.subscribe(val => {
+        setTimeout(() => {
+          this.ionEnter();
+        }, 100);
+      });
+  }
+
+  ngOnInit() {
+
+  }
+  ionEnter() {
+    this.direction = TranslatorService.getCurrentDirection();
+    this.itemDetails = this.cs.sharedService.getSharedData(ItemForSaleService.ITEMS_SELECTED, false);
 
-  ngOnInit() { }
+  }
+  getDate(date) {
+    return moment(date, "YYYY-MM-DD HH:mm:ss").format("DD-MMM-YYYY");
+  }
+  getImgContent(imgFile): SafeUrl {
+    return this.sanitizer.bypassSecurityTrustUrl(imgFile);
+  }
 
 }
diff --git a/Mohem/src/app/itemforsale/itemforsale.module.ts b/Mohem/src/app/itemforsale/itemforsale.module.ts
index 6a7aea24..7a868eb0 100644
--- a/Mohem/src/app/itemforsale/itemforsale.module.ts
+++ b/Mohem/src/app/itemforsale/itemforsale.module.ts
@@ -11,6 +11,8 @@ import { ItemsComponent } from './items/items.component';
 import { ItemDetailsComponent } from './item-details/item-details.component';
 import { MyAdsComponent } from './my-ads/my-ads.component';
 import { HmgCommonModule } from '../hmg-common/hmg-common.module';
+import { ItemForSaleService } from './services/service.service';
+import { FilterComponent } from './filter/filter.component';
 
 const routes: Routes = [
   {
@@ -32,6 +34,10 @@ const routes: Routes = [
       {
         path: 'my-ads',
         component: MyAdsComponent
+      },
+      {
+        path: 'filter',
+        component: FilterComponent
       }
     ],
   }
@@ -45,6 +51,8 @@ const routes: Routes = [
     HmgCommonModule,
     RouterModule.forChild(routes)
   ],
-  declarations: [ItemforsalePage, HomeComponent, ItemsComponent, ItemDetailsComponent, MyAdsComponent]
+  declarations: [ItemforsalePage, HomeComponent, ItemsComponent, ItemDetailsComponent, MyAdsComponent, FilterComponent],
+  providers: [ItemForSaleService],
+
 })
 export class ItemforsalePageModule { }
diff --git a/Mohem/src/app/itemforsale/items/items.component.html b/Mohem/src/app/itemforsale/items/items.component.html
index bab28e0c..e17dacd4 100644
--- a/Mohem/src/app/itemforsale/items/items.component.html
+++ b/Mohem/src/app/itemforsale/items/items.component.html
@@ -28,7 +28,7 @@
      
       <ion-col size="12">
        <ion-item lines="none"  class="SearchtextBox">
-        <ion-input [placeholder]="'itemforsale,search-items'| translate"></ion-input>
+        <ion-input [placeholder]="'itemforsale,search-items'| translate" (input)="search($event.target.value)"></ion-input>
        </ion-item>
       </ion-col>
     </ion-row>
@@ -37,73 +37,49 @@
         <p class="filterText"> {{ts.trPK('itemforsale','browse-categories')}} </p>
       </ion-col>
       <ion-col size="2">
-        <img class="filter-icon" src="assets/imgs/itemsforsale/filter.svg">
+        <img class="filter-icon" src="assets/imgs/itemsforsale/filter.svg" (click)="openModel()">
       </ion-col>
     </ion-row>
     </ion-grid>
 
     <div class="container-icon">
-      <div class="box-icon">
-        <div class="sale-icon">
-          <div class="top">
-         <img src="assets/imgs/itemsforsale/mobile.svg">
-          </div>
-          <div class="bottom-icon">
-            <p>Mobile & Tablets</p>
-          </div>
-         </div>
-      </div>
-      <div class="box-icon">
-        <div class="sale-icon">
-          <div class="top">
-            <img src="assets/imgs/itemsforsale/cars.svg">
-          </div>
-          <div class="bottom-icon">
-            <p>Cars & Vehicle</p>
-          </div>
-         </div>
-      </div>
-      <div class="box-icon">
-        <div class="sale-icon">
-          <div class="top">
-            <img src="assets/imgs/itemsforsale/electronic_appliances.svg">
-          </div>
-          <div class="bottom-icon">
-            <p>Electronic Appliance</p>
-          </div>
-         </div>
-      </div>
-      <div class="box-icon">
-        <div class="sale-icon">
-          <div class="top">
-            <img src="assets/imgs/itemsforsale/fashion.svg">
+      <div class="box-icon" *ngFor="let category of categories" >
+        <div class="sale-icon" [ngClass]="{'active':activeClass==category.categoryID }" (click)="selectCategory(category)">
+          <div class="top"  [innerHTML]="category.content | sanitizeHTMLPipe"  >
+      
           </div>
           <div class="bottom-icon">
-            <p>Fashion & Beauty</p>
+            <p *ngIf="direction == 'ltr'">{{category.title}}</p>
+            <p *ngIf="direction =='rtl'">{{category.title_Ar}}</p>
           </div>
          </div>
       </div>
+    
       
     </div>
 <div class="grid-row">
-<ion-row >
-  <ion-col size="6" (click)="openDetails()">
-    <ion-card>
+  <div class="loader" *ngIf="!items ">
+    <img  src="../assets/icon/progress-loading.gif" />
+  </div>
+<ion-row  *ngIf="items">
+  <ion-col size="6" (click)="openDetails(item)" *ngFor="let item of items">
+    <ion-card *ngIf="item.status.toLowerCase() =='approved'">
       <ion-card-header>
-        <img src="https://ii1.pepperfry.com/media/catalog/product/r/o/568x625/royal-wing-chair-in-blue-color-by-dreamzz-furniture-royal-wing-chair-in-blue-color-by-dreamzz-furnit-6hcjya.jpg" />
-      
-        <ion-card-title>Furniture Table</ion-card-title>
+        <img  *ngIf="item.itemAttachments[0] && item.itemAttachments[0].content" [src]="getImgContent('data:image/png;base64, ' +item.itemAttachments[0].content)" />
+        <img  *ngIf="!item.itemAttachments[0] || !item.itemAttachments[0].content" src="/assets/imgs/no-images.png" />
+        <ion-card-title *ngIf="direction == 'ltr'">{{item.title}}</ion-card-title>
+        <ion-card-title *ngIf="direction =='rtl'">{{item.title_Ar}}</ion-card-title>
+   
       </ion-card-header>
     
       <ion-card-content>
-        Keep close to Nature's heart... and break
-        <p class="orange">
-          Used
-        </p>
+        <div class="description-cont" *ngIf="direction == 'ltr'">{{getDotted(item.description, 60)}}</div>
+        <div class="description-cont" *ngIf="direction =='rtl'">{{getDotted(item.description_Ar, 60)}}</div>
+        <p [class]="item.status=='Approved' ? 'green' : 'yellow'">{{item.status}}</p>
         <ion-row>
           <ion-col size="10">
             <strong>
-              500 SAR
+              {{item.quotePrice}} {{item.currencyCode}}
             </strong>
           </ion-col>
           <ion-col size="2">
@@ -114,62 +90,55 @@
       </ion-card-content>
      </ion-card>
   </ion-col>
-  <ion-col size="6" (click)="openDetails()">
-    <ion-card>
-      <ion-card-header>
-        <img src="https://ii1.pepperfry.com/media/catalog/product/r/o/568x625/royal-wing-chair-in-blue-color-by-dreamzz-furniture-royal-wing-chair-in-blue-color-by-dreamzz-furnit-6hcjya.jpg" />
+ 
+  <div class="no-dataDiv" *ngIf="items.length == 0" >
+    <ion-row>
+            <img class="empty-data" src="../assets/imgs/box.png"/>
+
       
-        <ion-card-title>Furniture Table</ion-card-title>
-      </ion-card-header>
-    
-      <ion-card-content>
-        Keep close to Nature's heart... and break
-        <p class="green">
-          New
-        </p>
-        <ion-row>
-          <ion-col size="10">
-            <strong>
-              500 SAR
-            </strong>
-          </ion-col>
-          <ion-col size="2">
-            <img src="assets/imgs/itemsforsale/arrow.svg">
-          </ion-col>
-        </ion-row>
-         
-      </ion-card-content>
-     </ion-card>
-  </ion-col>
+    </ion-row>
+    <h4>  {{ts.trPK('general','empty')}}</h4>
+  </div>
 </ion-row>
+<ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)">
+  <ion-infinite-scroll-content
+    loadingSpinner="bubbles"
+    loadingText="Loading more data...">
+  </ion-infinite-scroll-content>
+</ion-infinite-scroll>
 </div>
 </div>
 
 <div class="my-ads" *ngIf="segment =='2'">
   <ion-row>
-  <ion-item button detail="false">
+  <ion-item button detail="false" *ngFor="let item of itemsByEmployee">
     <ion-thumbnail slot="start">
-      <img src="https://ii1.pepperfry.com/media/catalog/product/r/o/568x625/royal-wing-chair-in-blue-color-by-dreamzz-furniture-royal-wing-chair-in-blue-color-by-dreamzz-furnit-6hcjya.jpg" />
+      <img  *ngIf="item.itemAttachments[0] && item.itemAttachments[0].content"  [src]="getImgContent('data:image/png;base64, ' +item.itemAttachments[0].content)"  />
+      <img  *ngIf="!item.itemAttachments[0] || !item.itemAttachments[0].content" src="assets/imgs/no-images.png" />
     </ion-thumbnail>
     <ion-label class="label-thumb">
 
-      <h3>Furniture Table</h3>
-      <p class="posted-on">
-        Posted on 24 April 2021
-      </p>
-      <p class="details-text">good condition only 6th month used </p>
+      <h3 *ngIf="direction == 'ltr'">{{item.title}}</h3>
+      <h3 *ngIf="direction =='rtl'">{{item.title_Ar}}</h3>
+     
+        <p class="posted-on">{{getDate(item.created) }}</p>
+     
+      <p class="details-text" *ngIf="direction == 'ltr'"> {{getDotted(item.description, 30)}}</p>
+        <p  *ngIf="direction =='rtl'">{{getDotted(item.description_Ar, 30)}}</p>
       <ion-row>
         <ion-col size="8">
-          <p class="yellow">Pending Review</p>
+          <p [class]="item.status=='Approved' ? 'green' : 'yellow'">{{item.status}}</p>
+          
         </ion-col>
         <ion-col>
-          <img class="icon" src="assets/imgs/itemsforsale/delete.svg" />
-          <img class="icon edit" src="assets/imgs/itemsforsale/edit.svg" />  
+          <img class="icon" *ngIf="item.status!='Approved'" src="assets/imgs/itemsforsale/delete.svg" (click)="deleteItems(item)"/>
+          <img [class]="direction =='ltr' ? 'icon edit' : 'icon edit-ar'" src="assets/imgs/itemsforsale/edit.svg" (click)="editItems(item)" />  
         </ion-col>
       </ion-row>
     </ion-label>
   
   </ion-item>
+  <div class="space"></div>
 </ion-row>
 
 </div>
diff --git a/Mohem/src/app/itemforsale/items/items.component.scss b/Mohem/src/app/itemforsale/items/items.component.scss
index bcba7e10..f8c6c061 100644
--- a/Mohem/src/app/itemforsale/items/items.component.scss
+++ b/Mohem/src/app/itemforsale/items/items.component.scss
@@ -7,9 +7,20 @@
     background: #259CB8;
     top: 0;
 }
+.no-dataDiv{
+    position: absolute;
+    left: 0;
+    right: 0;
+    margin: auto;
+}
 .header-toolbar{
     --background: #259CB8  !important;
 }
+.top{
+    position: relative;
+    margin: 5px 10px;
+
+}
 .bottom{
     height: 100%;
     width: 100%;
@@ -51,7 +62,10 @@
     margin-top: 5px;
     margin-bottom: 5px;
     margin-left: 5px;
-    font-size: 14px;
+    font-size: 12px;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
 }
 .bottom-icon{
     text-overflow: clip;
@@ -69,7 +83,8 @@ ion-card-title{
   
     font-weight: bold;
     font-size: 14px;
-    padding: 5px
+    padding: 5px;
+    height: 40px;
 }
 .orange{
     color: #CC9B14;
@@ -88,9 +103,9 @@ ion-card-content p{
     font-weight: bold;
 }
 .my-ads ion-item{
-    margin: 10px;
+    margin:0px 10px;
     --border-radius: 10px;
-    padding: 15px 10px 0px 10px;
+    padding: 10px 10px 0px 10px;
     width: 100%;
 }
 .my-ads ion-thumbnail img{
@@ -112,9 +127,10 @@ ion-segment-button{
 }
 ion-segment-button ion-label{
     padding: 0;
-    font-size: 16px;
+    font-size: 14px;
     white-space: normal;
     font-weight: bold;
+    line-height: 1.1;
 }
 .segment-button-checked ion-label{
 color: #fff  !important;
@@ -132,6 +148,7 @@ ion-item h3{
     color: #000;
     font-weight: bold;
     font-size: 14px;
+    margin-top:10px;
 }
 .yellow{
     color:#CC9B14;
@@ -145,6 +162,10 @@ ion-item .icon{
     position: absolute;
     right: 0px;
 }
+.edit-ar{
+    position: absolute;
+    left: 0px;
+}
 .fab-button{
     position: fixed;
     bottom: 5%;
@@ -155,7 +176,7 @@ ion-item .icon{
     --background: #259CB8;
 }
 ion-footer{
-    position: absolute;
+    position: fixed;
     bottom: 0;
 }
 ion-footer .footer-button{
@@ -219,4 +240,42 @@ ion-fab-button{
 }
 .grid-row{
     margin:10px;
+}
+
+.active .top::before{
+    position: absolute;
+    right: 0px;
+    top: 2px;
+    padding: 0px;
+    background: #3cc353;
+    padding: 2px 3px 4px 3px;
+    border-radius: 60%;
+    font-size: 10px;
+    color: #fff;
+    content: '✓';
+    width: 12px;
+    height: 12px;
+    text-align: center;
+}
+.space{
+    height:100px;
+}
+.loader{
+    display: block;
+    position: absolute;
+    margin: auto;
+    text-align: center;
+    width: 100%;
+}
+.loader img{
+    display: inline-block;
+    margin: auto;
+    width: 25px;
+  
+}
+.description-cont{
+    min-height: 60px;
+    height: 65px;
+    overflow: hidden;
+    font-size: 14px;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/items/items.component.ts b/Mohem/src/app/itemforsale/items/items.component.ts
index 73fc2398..a98e1105 100644
--- a/Mohem/src/app/itemforsale/items/items.component.ts
+++ b/Mohem/src/app/itemforsale/items/items.component.ts
@@ -1,6 +1,12 @@
 import { Component, OnInit } from '@angular/core';
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { ItemForSaleService } from '../services/service.service';
+import { deepCopy } from '@angular-devkit/core/src/utils/object';
+import * as moment from 'moment';
+import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
+import { ActivatedRoute } from '@angular/router';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
 
 @Component({
   selector: 'app-items',
@@ -9,17 +15,157 @@ import { TranslatorService } from 'src/app/hmg-common/services/translator/transl
 })
 export class ItemsComponent implements OnInit {
   segment: any = '1';
-  constructor(public ts: TranslatorService, public cs: CommonService,) { }
+  items: any;
+  categories: any = [];
+  direction: string;
+  activeClass: any;
+  pageNo: number = 1;
+  tempSearch: any = [];
+  itemsByEmployee: any = [];
+  allCategory = {
+    categoryID: 0,
+    content: '<svg xmlns="http://www.w3.org/2000/svg" width="33.925" height="25.841" viewBox="0 0 33.925 25.841"><g id="More_Select" data-name="More Select"><path d="m30 1h-24a1 1 0 0 0 -1 1v1h21a3 3 0 0 1 3 3v21h1a1 1 0 0 0 1-1v-24a1 1 0 0 0 -1-1z"/><path d="m26 5h-24a1 1 0 0 0 -1 1v24a1 1 0 0 0 1 1h24a1 1 0 0 0 1-1v-24a1 1 0 0 0 -1-1zm-4.747 9.344-8.728 8.726a1 1 0 0 1 -1.414 0l-4.364-4.363a1 1 0 0 1 1.414-1.414l3.657 3.656 8.021-8.019a1 1 0 0 1 1.414 1.414z"/></g></svg>',
+    isActive: true,
+    title: "All",
+    title_Ar: "الجميع",
+  }
+  constructor(public ts: TranslatorService, public route: ActivatedRoute, private sanitizer: DomSanitizer, public cs: CommonService, private itemService: ItemForSaleService, private authService: AuthenticationService) {
+    this.route
+      .params.subscribe(val => {
+        setTimeout(() => {
+          this.cs.startLoading();
+          var selectedFilter = this.cs.sharedService.getSharedData(ItemForSaleService.selected_filters);
+          if (selectedFilter) {
+            this.selectCategory(selectedFilter);
+          }
+          else {
+            this.getItemsCategories();
+            this.getItemsByEmployee();
+          }
+
+
+        }, 100);
+      });
+
+  }
+
 
-  ngOnInit() { }
-  openDetails() {
+  ngOnInit() {
+    this.direction = TranslatorService.getCurrentDirection();
+
+  }
+  getItemsCategories() {
+
+    this.itemService.getCategories({}, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.categories = this.itemService.parser(result);
+      this.categories.unshift(this.allCategory);
+      this.cs.sharedService.setSharedData(this.categories, ItemForSaleService.CATEGORIES);
+    })
+    this.itemService.getItems({ pageNo: this.pageNo }, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.items = [];
+      this.items = this.itemService.parser(result);
+      this.tempSearch = deepCopy(this.items);
+      console.log(this.tempSearch);
+      this.cs.stopLoading();
+    })
+  }
+  openDetails(selected) {
+    this.cs.sharedService.setSharedData(selected, ItemForSaleService.ITEMS_SELECTED);
     this.cs.navigateForward('/itemforsale/items-details');
   }
   segmentChanged(value) {
     this.segment = value.detail.value;
   }
   openSale() {
-    this.cs.navigateForward('/itemforsale/home');
+    this.cs.openCreateitems();
+  }
+  selectCategory(item) {
+    this.cs.startLoading();
+    this.activeClass = item.categoryID;
+    this.pageNo = 1;
+    this.itemService.getItems({ pageNo: this.pageNo, ItgCategoryID: item.categoryID }, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.items = [];
+      this.items = this.itemService.parser(result);
+      this.tempSearch = deepCopy(this.items);
+      this.cs.stopLoading();
+    })
+  }
+  getDotted(temp: string, valueCount: number) {
+    temp = this.stripHtml(temp);
+    return temp.substring(0, valueCount) + " ...";
+  }
+  stripHtml(html) {
+    var temporalDivElement = document.createElement("div");
+
+    temporalDivElement.innerHTML = html;
+
+    return temporalDivElement.textContent || temporalDivElement.innerText || "";
   }
+  loadData(event) {
+    this.pageNo = this.pageNo + 1;
+    this.itemService.getItems({ pageNo: this.pageNo, categoryID: this.activeClass }, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.items.concat(this.itemService.parser(result));
+      this.tempSearch = deepCopy(this.items);
+      event.target.complete();
 
+    })
+  }
+  search(t) {
+    if (t === '') {
+      this.items = this.tempSearch;
+    } else {
+      this.items = this.tempSearch.filter((post) => {
+        if (this.direction == 'ltr')
+          return (post.title.toLowerCase().indexOf(t.toLowerCase()) > -1);
+        else
+          return (post.title_Ar.indexOf(t) > -1);
+      });
+    }
+
+  }
+  getItemsByEmployee() {
+
+    this.cs.startLoading();
+    this.itemService.getItemsByEmployee({}, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.itemsByEmployee = this.itemService.parser(result);
+
+      this.cs.stopLoading();
+      console.log(this.itemsByEmployee);
+    })
+  }
+
+  getDate(date) {
+    return moment(date, "YYYY-MM-DD HH:mm:ss").format("DD-MMM-YYYY");
+  }
+
+  getImgContent(imgFile): SafeUrl {
+    return this.sanitizer.bypassSecurityTrustUrl(imgFile);
+  }
+  editItems(items) {
+    this.cs.sharedService.setSharedData(items, ItemForSaleService.EDIT_ITEMS);
+    this.cs.openCreateitems();
+  }
+  deleteItems(item) {
+    var authUser = this.authService.getAuthenticatedRequest();
+    this.cs.startLoading();
+    var request = new FormData();
+    request.append('itemSaleID', item.itemSaleID);
+    request.append('isActive', 'false');
+    request.append('Channel', authUser.Channel.toString());
+    request.append('LogInToken', authUser.LogInTokenID);
+    request.append('Token', authUser.TokenID);
+    request.append('EmployeeNumber', authUser.P_USER_NAME);
+    request.append('MobileNo', authUser.MobileNumber);
+    request.append('employeeNumber', authUser.P_USER_NAME);
+    this.itemService.updateItemForSale(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
+      if (this.cs.validResponse(result)) {
+        this.cs.greenToastPK('itemforsale', 'item-deleted');
+        this.getItemsByEmployee();
+
+      }
+    })
+  }
+  openModel() {
+    this.cs.filterItemforSale();
+  }
 }
diff --git a/Mohem/src/app/itemforsale/services/domsafe.ts b/Mohem/src/app/itemforsale/services/domsafe.ts
new file mode 100644
index 00000000..79b677ac
--- /dev/null
+++ b/Mohem/src/app/itemforsale/services/domsafe.ts
@@ -0,0 +1,15 @@
+import { Pipe, PipeTransform } from "@angular/core";
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
+
+@Pipe({
+    name: 'sanitizeHTMLPipe'
+})
+export class SanitizeHtmlPipe implements PipeTransform {
+
+    constructor(private _sanitizer: DomSanitizer) {
+    }
+
+    transform(v: string): SafeHtml {
+        return this._sanitizer.bypassSecurityTrustHtml(v);
+    }
+}
\ No newline at end of file
diff --git a/Mohem/src/app/itemforsale/services/service.service.spec.ts b/Mohem/src/app/itemforsale/services/service.service.spec.ts
new file mode 100644
index 00000000..99221043
--- /dev/null
+++ b/Mohem/src/app/itemforsale/services/service.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ItemForSaleService } from './service.service';
+
+describe('ServiceService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: ItemForSaleService = TestBed.get(ItemForSaleService);
+    expect(service).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/itemforsale/services/service.service.ts b/Mohem/src/app/itemforsale/services/service.service.ts
new file mode 100644
index 00000000..222e776c
--- /dev/null
+++ b/Mohem/src/app/itemforsale/services/service.service.ts
@@ -0,0 +1,87 @@
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
+import { ConnectorService } from 'src/app/hmg-common/services/connector/connector.service';
+import { MowadhafiService } from 'src/app/mowadhafi/mowadhafi.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ItemForSaleService {
+  public static getItemForSale = 'Services/COCWS.svc/REST/Mohemm_ITG_GetItemForSale';
+  public static getItemForSaleByEmployee = 'Services/COCWS.svc/REST/Mohemm_ITG_GetItemForSaleByEmployee';
+  public static getCategories = 'Services/COCWS.svc/REST/Mohemm_ITG_GetItemSaleCategory';
+  public static createItemForSale = 'Services/COCWS.svc/REST/Mohemm_ITG_AddItemForSaleMobile';
+  public static updateItemForSale = 'Services/COCWS.svc/REST/Mohemm_ITG_UpdateItemForSale';
+  public static getRegion = 'Services/COCWS.svc/REST/Mohemm_ITG_GetRegion';
+  public static ITEMS_SELECTED = 'item-selected';
+  public static CATEGORIES = 'categories';
+  public static EDIT_ITEMS = 'edit-items';
+  public static selected_filters = 'selected_filter';
+  constructor(
+    public con: ConnectorService,
+    private authService: AuthenticationService,
+    private http: HttpClient
+  ) { }
+  public getItems(request: any, onError?: any, errorLabel?: string) {
+    this.authService.authenticateRequest(request);
+    request.EmployeeNumber = request.UserName;
+    request.ItgPageNo = request.pageNo;
+    request.ItgPageSize = 10;
+    request.ItgStatus = "Approved";
+    return this.con.postNoLoad(ItemForSaleService.getItemForSale, request, onError, errorLabel);
+  }
+
+  public getCategories(request: any, onError?: any, errorLabel?: string) {
+    this.authService.authenticateRequest(request);
+    request.EmployeeNumber = request.UserName;
+
+    return this.con.postNoLoad(ItemForSaleService.getCategories, request, onError, errorLabel);
+  }
+
+
+
+  parser(response: any) {
+    try {
+      var result = JSON.parse(response.Mohemm_ITG_ResponseItem);
+      if (result.result)
+        return result.result.data
+      else
+        return {}
+    } catch (res) {
+      console.log(res);
+    }
+  }
+
+  getItemsByEmployee(request: any, onError?: any, errorLabel?: string) {
+    this.authService.authenticateRequest(request);
+    request.EmployeeNumber = request.UserName;
+    request.ItgEmployeeNumber = request.UserName; //request.UserName;
+    return this.con.post(ItemForSaleService.getItemForSaleByEmployee, request, onError, errorLabel);
+  }
+  getRegion(request: any, onError?: any, errorLabel?: string) {
+    this.authService.authenticateRequest(request);
+    request.EmployeeNumber = request.UserName;
+    request.ItgEmployeeNumber = request.UserName; //request.UserName;
+    return this.con.post(ItemForSaleService.getRegion, request, onError, errorLabel);
+  }
+
+  createItemForSale(itemRequest: any, onError?: any, errorLabel?: string) {
+    const request = itemRequest;
+    this.authService.authenticateRequest(request);
+    request.employeeNumber = request.P_USER_NAME;
+    //return this.http.post(ConnectorService.host + ItemForSaleService.createItemForSale, itemRequest, {
+    return this.con.post(ItemForSaleService.createItemForSale, request, onError, errorLabel);
+    //}    
+    //)
+  }
+  updateItemForSale(itemRequest: any, onError?: any, errorLabel?: string) {
+    const request = itemRequest;
+    this.authService.authenticateRequest(request);
+    request.employeeNumber = request.P_USER_NAME;
+    return this.http.post(ConnectorService.host + ItemForSaleService.updateItemForSale, itemRequest, {
+
+    }
+    )
+  }
+}
diff --git a/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss b/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss
index c0f5006c..60613fd8 100644
--- a/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss
+++ b/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss
@@ -526,4 +526,7 @@ select option[data-default] {
 
   .button-native {
       box-shadow: none!important;
+  }
+  .gridAH{
+      text-align: justify;
   }
\ No newline at end of file
diff --git a/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.ts b/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.ts
index 70c5c7e0..1ec8c7ed 100644
--- a/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.ts
+++ b/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.ts
@@ -35,7 +35,7 @@ export class HrRequestFormComponent implements OnInit {
   public searchKeySelect = 'Complaints';
   myColor: string = 'secondary';
   public showRequestDetails = false;
-  public proID = "HMG"
+  public proID = "CS"
   public inquiry: string;
   public HR: string;
   public complaints: string;
@@ -54,9 +54,9 @@ export class HrRequestFormComponent implements OnInit {
   public sectionDep: any;
   public projectCode;
   public SelectedServiceType: any;
-  public depType: any ="";
-  public secType: any ="";
-  public topicType: any ="";
+  public depType: any = "";
+  public secType: any = "";
+  public topicType: any = "";
   indexLastObj: any;
   addAttachRequest: any = [];
   TransactionID: any;
@@ -73,17 +73,17 @@ export class HrRequestFormComponent implements OnInit {
     "application/vnd.ms-excel",
     "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
   ];
-  projctid:any;
-  employeeNumber:any;
- ticketType: any =[];
+  projctid: any;
+  employeeNumber: any;
+  ticketType: any = [];
   public direction: string;
   HRServices = '';
-  Complaints='';
-  Inquiry='';
-  input = document.getElementById ("firstLabel");
-  
- 
- 
+  Complaints = '';
+  Inquiry = '';
+  input = document.getElementById("firstLabel");
+
+
+
   constructor(
     public ts: TranslatorService,
     public cs: CommonService,
@@ -100,20 +100,20 @@ export class HrRequestFormComponent implements OnInit {
   }
 
   ngOnInit() {
-    this.projectCode = this.cs.sharedService.getSharedData("projcet-code",false);
+    this.projectCode = this.cs.sharedService.getSharedData("projcet-code", false);
     this.getTicketTypes();
     this.getProject();
 
-   
+
   }
 
-  
+
   public isValidForm(): boolean {
     if (this.depType && this.SelectedServiceType && this.secType && this.topicType) {
-        return false;
+      return false;
     }
     return true;
-}
+  }
 
 
   onSelectChange(event, type) {
@@ -121,20 +121,20 @@ export class HrRequestFormComponent implements OnInit {
     console.log(value);
     // this.topicTypeList =[];
     // this.sectionTypeList =[];
-    if(type==1){
+    if (type == 1) {
       this.depType = value;
-      this.sectionTypeList =[];
-      this.topicTypeList =[];
+      this.sectionTypeList = [];
+      this.topicTypeList = [];
       this.getDepartmentSections(value);
-     
-    }else if(type==2){
+
+    } else if (type == 2) {
       this.getSectionTopics(value);
-       this.topicTypeList =[];
+      this.topicTypeList = [];
     }
-    
- }
 
-  onFileSelectedclick(event){
+  }
+
+  onFileSelectedclick(event) {
     event.target.value = '';
   }
 
@@ -158,8 +158,8 @@ export class HrRequestFormComponent implements OnInit {
     })
   }
   handlegetTicketTypesResult(result) {
-    this.ticketType =result.Mohemm_Itg_TicketTypesList;
-  
+    this.ticketType = result.Mohemm_Itg_TicketTypesList;
+
   }
 
   /////////////////////////////////////////////////
@@ -177,11 +177,11 @@ export class HrRequestFormComponent implements OnInit {
   }
   handlegetProjectResult(result) {
     this.Projectresult = result.Mohemm_Itg_ProjectsList;
-    this.projctid=this.Projectresult[0].projectId;
+    this.projctid = this.Projectresult[0].projectId;
     this.getProjectDepartments();
   }
 
-////////////////////////////////////////////////////
+  ////////////////////////////////////////////////////
   getProjectDepartments() {
     const request = {
       EmployeeNumber: "",
@@ -204,7 +204,7 @@ export class HrRequestFormComponent implements OnInit {
   getDepartmentSections(value) {
     const request = {
       EmployeeNumber: "",
-      ItgProjectDepartmentId: value ?value : this.departTypeList.projectDepartmentId,
+      ItgProjectDepartmentId: value ? value : this.departTypeList.projectDepartmentId,
 
 
     };
@@ -218,11 +218,11 @@ export class HrRequestFormComponent implements OnInit {
     //  this.getSectionTopics();
   }
 
-  getSectionTopics(value=null) {
+  getSectionTopics(value = null) {
     const request = {
       EmployeeNumber: "",
       // ItgDepartmentSectionId: this.sectionTypeList.departmentSectionId,
-      ItgDepartmentSectionId: value ?value : this.sectionTypeList.departmentSectionId,
+      ItgDepartmentSectionId: value ? value : this.sectionTypeList.departmentSectionId,
 
     };
     this.MowadhafiService.getSectionTopics(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
@@ -238,41 +238,57 @@ export class HrRequestFormComponent implements OnInit {
   }
 
 
- /*******************Create Ticket Function*************/
+  /*******************Create Ticket Function*************/
 
   CreateTicket() {
-   
-    var authUser =this.authService.getAuthenticatedRequest();
+
+    var authUser = this.authService.getAuthenticatedRequest();
     this.cs.startLoading();
-    var request = new FormData();
-    request.append('ticketTypeId', this.SelectedServiceType);
-    request.append('projectId', this.projctid);
-    request.append('departmentId', this.depType);
-    request.append('sectionId', this.secType);
-    request.append('sectionTopicId', this.topicType);
-    request.append('description', this.Description);
-    console.log("TEST:______")
-    console.log(this.selectedFile);
-    if(this.selectedFile && this.selectedFile !== undefined){
-      request.append('fileColl', this.selectedFile[0], this.selectedFile[0].name);
-    }
-    request.append('employeeNumber', authUser.P_USER_NAME);
-    request.append('ticketStatus', 'new');
-    request.append('channelId', '3');
-    request.append('Channel', authUser.Channel.toString());
-    request.append('LogInToken', authUser.LogInTokenID);
-    request.append('Token', authUser.TokenID);
-    request.append('EmployeeNumber', authUser.P_USER_NAME);
-    request.append('MobileNo', authUser.MobileNumber);
+    // var request = new FormData();
+    // request.append('ticketTypeId', this.SelectedServiceType);
+    // request.append('projectId', this.projctid);
+    // request.append('departmentId', this.depType);
+    // request.append('sectionId', this.secType);
+    // request.append('sectionTopicId', this.topicType);
+    // request.append('description', this.Description);
+
+    // if(this.selectedFile && this.selectedFile !== undefined){
+    //   request.append('fileColl', this.selectedFile[0], this.selectedFile[0].name);
+    // }
+    // request.append('employeeNumber', authUser.P_USER_NAME);
+    // request.append('ticketStatus', 'new');
+    // request.append('channelId', '3');
+    // request.append('Channel', authUser.Channel.toString());
+    // request.append('LogInToken', authUser.LogInTokenID);
+    // request.append('Token', authUser.TokenID);
+    // request.append('EmployeeNumber', authUser.P_USER_NAME);
+    // request.append('MobileNo', authUser.MobileNumber);
+
+    var request = {
+      "TokenID": authUser.LogInTokenID, "EmployeeNumber": authUser.P_USER_NAME, "ItgImageCollList": this.addAttachRequest,
+      "ticketTypeId": this.SelectedServiceType,
+      "projectId": this.projctid,
+      "departmentId": this.depType,
+      "sectionId": this.secType,
+      "sectionTopicId": this.topicType,
+      "description": this.Description,
+      "employeeNumber": authUser.P_USER_NAME,
+      "ticketStatus": "new",
+      "channelId": 3,
+      "Channel": authUser.Channel.toString(),
+      "LogInToken": authUser.LogInTokenID,
+      "Token": authUser.TokenID,
+      "MobileNo": authUser.MobileNumber,
 
+    }
 
     this.MowadhafiService.getCreateTicket(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
-      if(this.cs.validResponse(result)){
+      if (this.cs.validResponse(result)) {
         this.cs.stopLoading();
         this.checkERM('After Service Submission');
         this.cs.greenToastPK("general", "success-create");
         this.cs.openMyRequestPage();
-      }else{
+      } else {
         this.cs.stopLoading();
         this.cs.redToastPK("general", "try-again");
       }
@@ -329,7 +345,7 @@ export class HrRequestFormComponent implements OnInit {
     else {
       const file = input.target.files[0];
       this.selectedFile = input.target.files;
-     
+
 
       this.getBase64(file).then(data =>
         this.pushObject(data, file.name, file.type)
@@ -348,18 +364,21 @@ export class HrRequestFormComponent implements OnInit {
   }
 
   pushObject(fileData, name, type) {
-   
+
     this.indexLastObj++;
     try {
       let array = name.split(".");
       let attachType: string = array[array.length - 1];
 
       this.addAttachRequest.push({
-        AttachmentID: this.indexLastObj,
-        P_FILE_CONTENT_TYPE: attachType, //type.split('/')[1],
-        P_FILE_DATA: fileData.split(",")[1],
-        P_FILE_NAME: name, //.split('.')[0],
-        P_TRANSACTION_ID: this.TransactionID
+        // AttachmentID: this.indexLastObj,
+        // P_FILE_CONTENT_TYPE: attachType, //type.split('/')[1],
+        // P_FILE_DATA: fileData.split(",")[1],
+        // P_FILE_NAME: name, //.split('.')[0],
+        // P_TRANSACTION_ID: this.TransactionID
+        Base64Data: fileData.split(",")[1],
+        FileName: name,
+        ContentType: 'image/' + attachType
       });
     } catch (e) { }
   }
diff --git a/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss b/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss
index 3999867e..9a786617 100644
--- a/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss
+++ b/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss
@@ -176,6 +176,7 @@
                 letter-spacing: -0.64px;
                 color: #2B353E;
                 opacity: 1;
+                line-height: 20px;
                 
                
             }
diff --git a/Mohem/src/app/mowadhafi/mowadhafi.service.ts b/Mohem/src/app/mowadhafi/mowadhafi.service.ts
index 8976393b..2a34d1d8 100644
--- a/Mohem/src/app/mowadhafi/mowadhafi.service.ts
+++ b/Mohem/src/app/mowadhafi/mowadhafi.service.ts
@@ -19,7 +19,7 @@ export class MowadhafiService {
   public static getTicketStatisticsByEmp = 'Services/COCWS.svc/REST/Mohemm_ITG_GetTicketStatisticsByEmployee';
   public static getTicketTransaction = 'Services/COCWS.svc/REST/Mohemm_ITG_GetTicketTransaction';
   public static getTicketDetails = 'Services/COCWS.svc/REST/Mohemm_ITG_GetTicketDetails';
-  public static getCreateTicket = 'Services/COCWS.svc/REST/Mohemm_ITG_CreateTicket';
+  public static getCreateTicket = 'Services/COCWS.svc/REST/Mohemm_ITG_CreateTicketMobile';
 
   constructor(
     public con: ConnectorService,
@@ -108,16 +108,17 @@ export class MowadhafiService {
     const request = absence;
     this.authService.authenticateRequest(request);
     request.employeeNumber = request.P_USER_NAME;
-    const HttpUploadOptions = {
-      headers: new HttpHeaders({ "Content-Type": "multipart/form-data", })
-    }
+    return this.con.post(MowadhafiService.getCreateTicket, request, onError, errorLabel);
+    // const HttpUploadOptions = {
+    //   headers: new HttpHeaders({ "Content-Type": "multipart/form-data", })
+    // }
     // return this.con.post(MowadhafiService.getCreateTicket, request, onError, errorLabel);
 
-    return this.http.post(ConnectorService.host + MowadhafiService.getCreateTicket, absence, {
-      // reportProgress: true,
-      // observe: 'events'
-    }
-    )
+    //return this.http.post(ConnectorService.host + MowadhafiService.getCreateTicket, absence, {
+    // reportProgress: true,
+    // observe: 'events'
+    //}
+    // )
   }
 
 }
\ No newline at end of file
diff --git a/Mohem/src/app/my-team/details/details.component.ts b/Mohem/src/app/my-team/details/details.component.ts
index 4469f7ec..98955dfd 100644
--- a/Mohem/src/app/my-team/details/details.component.ts
+++ b/Mohem/src/app/my-team/details/details.component.ts
@@ -235,7 +235,7 @@ export class DetailsComponent implements OnInit {
   ngOnInit() {
     this.common.startLoading();
     this.intializeMemberDetail();
-    this.showAttendanceTracking();
+    // this.showAttendanceTracking();
     // tslint:disable-next-line: max-line-length
     this.currentMonthName = this.direction === 'en' ? this.common.getMonthName(this.monthIndex) : this.common.getMonthNameAr(this.monthIndex);
   }
@@ -266,6 +266,7 @@ export class DetailsComponent implements OnInit {
     if (this.activeSegment === 'Attendance') {
       this.common.startLoading();
       this.initAttendance();
+      this.showAttendanceTracking();
     }
     else if (this.activeSegment != 'Attendance' && this.activeSegment != 'TeamMembers') {
       this.activeSegment = 'About';
diff --git a/Mohem/src/app/my-team/home/home.component.html b/Mohem/src/app/my-team/home/home.component.html
index 2280064d..0cbb0cef 100644
--- a/Mohem/src/app/my-team/home/home.component.html
+++ b/Mohem/src/app/my-team/home/home.component.html
@@ -1,5 +1,6 @@
 <app-generic-header
   showBack="true"
+  subordinateLeave='true'
   backLink="/home"
   [headerText]="'myTeam, myTeam-header' | translate">
 </app-generic-header>
diff --git a/Mohem/src/app/my-team/my-team.module.ts b/Mohem/src/app/my-team/my-team.module.ts
index 49925b71..17fa5ede 100644
--- a/Mohem/src/app/my-team/my-team.module.ts
+++ b/Mohem/src/app/my-team/my-team.module.ts
@@ -10,6 +10,7 @@ import { MyTeamPage } from './my-team.page';
 import { HmgCommonModule } from '../hmg-common/hmg-common.module';
 import { from } from 'rxjs';
 import { WorklistService } from '../notification/service/worklist.service';
+import { SubordinateLeaveComponent } from './subordinate-leave/subordinate-leave.component';
 
 
 const routes: Routes = [
@@ -28,7 +29,10 @@ const routes: Routes = [
       path: 'details-2',
       component: DetailsComponent
     },
-
+    {
+      path: 'subordinate-leave',
+      component: SubordinateLeaveComponent
+    }
 
     ]
   }
@@ -44,7 +48,11 @@ const routes: Routes = [
 
   ],
   providers: [WorklistService],
-  declarations: [MyTeamPage, HomeComponent, DetailsComponent,
+  declarations: [
+    MyTeamPage,
+    HomeComponent,
+    DetailsComponent,
+    SubordinateLeaveComponent
   ]
 })
 export class MyTeamPageModule { }
diff --git a/Mohem/src/app/my-team/service/my-team.service.ts b/Mohem/src/app/my-team/service/my-team.service.ts
index 87507d70..81149b41 100644
--- a/Mohem/src/app/my-team/service/my-team.service.ts
+++ b/Mohem/src/app/my-team/service/my-team.service.ts
@@ -7,6 +7,7 @@ import { AuthenticationService } from "src/app/hmg-common/services/authenticatio
 export class MyTeamService {
   public static EMPLOYEE_SHARED_DATA = 'employee';
   public static getMyTeam = 'Services/ERP.svc/REST/GET_EMPLOYEE_SUBORDINATES';
+  public static getSubordintesLeaves = 'Services/ERP.svc/REST/GET_SUBORDINATES_LEAVES_TOTAL_VACATIONS';
   // public static getSuborinateStatus = 'Services/ERP.svc/REST/GET_SUBORDINATES_ATTD_STATUS';
 
   
@@ -20,6 +21,13 @@ export class MyTeamService {
     return this.con.post(MyTeamService.getMyTeam, request, onError, errorLabel);
   }
 
+  public getEmployeeSubordinatesLeave(absence: any, onError?: any, errorLabel?: string){
+    const request = absence;
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.post(MyTeamService.getSubordintesLeaves, request, onError, errorLabel);
+  }
+
   // public getSuborinatesAttStatus(absence: any, onError?: any, errorLabel?: string){
   //   const request = absence;
   //   this.authService.authenticateRequest(request);
diff --git a/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.html b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.html
new file mode 100644
index 00000000..8adf1dde
--- /dev/null
+++ b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.html
@@ -0,0 +1,89 @@
+<app-generic-header
+  showBack="true"
+  [headerText]="'myTeam, subordinate-leave' | translate">
+</app-generic-header>
+
+
+<ion-content padding style="--background: #f5f5f5">
+  <div class="team-member-container">
+    <ion-label>
+      <ion-item lines='none'>
+        <p style="font-size: 18px; font-weight: bold;">{{ts.trPK('myTeam','select-duration')}}</p>
+      </ion-item>
+    </ion-label>
+    <ion-grid>
+      <ion-row>
+        <ion-col size='6'>
+          <ion-label position='floating' style="margin-left: 15px;" class="colBold">{{ts.trPK('general','from')}} </ion-label>
+          
+          <ion-item class='dynamicField' lines='none'>
+            <ion-datetime style="padding: 0px" [(ngModel)]="startDate"  min="1900" max="2100" displayFormat="MMM/DD/YYYY"  placeholder="MM/DD/YYYY" required
+            cancelText="{{ts.trPK('general','cancel')}}" doneText="{{ts.trPK('general','done')}}"></ion-datetime>
+            &nbsp;
+            <ion-icon style="width: 20px;" name="calendar"></ion-icon>
+          </ion-item>
+        </ion-col>
+        <ion-col size='6'>
+          <ion-label position='floating' style="margin-left: 15px;" class="colBold">{{ts.trPK('general','to')}} </ion-label>
+          <ion-item class='dynamicField' lines='none'>
+            <ion-datetime style="padding: 0px" [(ngModel)]="endDate"  min="1900" max="2100" displayFormat="MMM/DD/YYYY"  placeholder="MM/DD/YYYY" required
+            cancelText="{{ts.trPK('general','cancel')}}"
+            doneText="{{ts.trPK('general','done')}}"></ion-datetime>
+            &nbsp;
+            <ion-icon style="width: 20px;" name="calendar"></ion-icon>
+        </ion-item>
+        </ion-col>
+      </ion-row>
+    </ion-grid>
+  </div>
+
+  <div *ngIf='noData'></div>
+
+  <div *ngIf='!noData'>
+    <div *ngIf='list.length === 0'>
+      <div class="team-member-container" style="text-align: center;">
+        <h2 style="margin-top: 5px !important; font-size: 20px;" class="name">
+          {{ts.trPK('general','empty')}}
+        </h2>
+      </div>
+  
+    </div>
+    <div *ngIf='list.length > 0'>
+      <div class="team-member-container" *ngFor='let user of list'>
+        <ion-row>
+          <ion-col [size]="3">
+            <div class="user-image-container">
+              <div class="user-image">
+                <img *ngIf='user.image' [src]="user.image"/>
+                <img *ngIf='!user.image' src="../assets/imgs/profile.png"/>
+              </div>
+            </div>
+          </ion-col>
+          <ion-col [size]="9">
+              <div>
+                <span>
+                    <h2 style="margin-top: 0px !important; font-size: 20px;" class="name">{{user.EMPLOYEE_NAME}}</h2>
+                    <span class="title"><ion-label>{{ts.trPK('general','from')}}: </ion-label><b style="font-size: 12px;">{{getDate(user.DATE_START)}} &nbsp; &nbsp;</b></span>
+                    <span class="title"><ion-label>{{ts.trPK('general','to')}}: </ion-label><b style="font-size: 12px;">{{getDate(user.DATE_END)}}</b></span>
+                    <br>
+                    <span class="title"><ion-label>{{ts.trPK('myTeam','no-of-days')}}: </ion-label><b style="font-size: 12px;">{{diffDays(user)}}</b></span>
+                </span>
+              </div>
+          </ion-col> 
+        </ion-row>
+      </div>
+    </div>
+  </div>
+ 
+</ion-content> 
+
+<ion-footer>
+  <div  class="centerDiv">
+    <ion-button class="confirmEitOkButton" [disabled]='checkDate()'  (click)="subordinateLeaveList()">{{ts.trPK('general','submit')}}</ion-button>
+    </div> 
+</ion-footer>
+
+
+
+ 
+ 
\ No newline at end of file
diff --git a/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss
new file mode 100644
index 00000000..6a147428
--- /dev/null
+++ b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss
@@ -0,0 +1,199 @@
+.confirmEitOkButton{
+    white-space: normal !important;
+    text-transform: capitalize !important;
+    min-height: 45px !important;
+    min-width: 5px !important;
+    margin: 8px !important;
+    --background: #269DB8;
+    width: 80% !important;
+    color: white!important;
+    border-radius: 16px !important;
+  }
+
+  .team-member-container{
+    // background: white;
+    // border-radius: 100px 20px 20px 100px;
+    // margin-top: 15px;
+    // font-family: WorkSans-Regular;
+    // border: 1px solid #ccc;
+    // border-radius: 15px;
+    // padding-bottom: 8px;
+    background: white;
+    /* margin-top: 2px; */
+    font-family: WorkSans-Regular;
+    border: 1px solid #ccc;
+    border-radius: 15px;
+    padding-bottom: 8px;
+    padding-top: 9px;
+    margin-bottom: 7px;
+}
+
+// .user-image-container{
+//     position: relative;
+//     width: 70px;
+//     height: 70px;
+//     display: block;
+//     margin: 0 auto;
+//     &:before{
+//       position: absolute;
+//       content: "";
+//       width: 20px;
+//       height: 20px;
+//       border-radius: 20px;
+//       border: 1px solid white;
+//       top: 0;
+//       right: 0;
+//       background-color: red;
+//       z-index: 9;
+//   }
+//   &.present:before{
+//       background-color: green !important;
+//   }
+// }
+.user-image{
+    // overflow: hidden;
+    // position: relative;
+    // display: block;
+    //  width: 100%;
+    //  height: 100%;
+    // border-radius: 80px;
+    // border: 1px solid #ccc;
+    //  margin: 0px auto 6px;
+
+    img {
+        // width: 100%;
+        // max-height: 100%;
+        width: 74%;
+        max-height: 74%;
+        margin-top: 7px;
+        margin-left: 6px;
+    }
+}
+
+.employee-name{
+    display: inline-block;
+    width: 80%;
+    .name{
+        // font-size: 16px;
+        // color: black;
+        // // margin: 0;
+        // width: 100%;
+        // text-overflow: ellipsis;
+        // white-space: nowrap;
+        // overflow: hidden;
+        // margin-left: -10px;
+        // margin-top: -5px;
+        // font-family: 'WorkSans-Bold';
+    font-size: 16px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    margin-left: -10px;
+    margin-top: -5px;
+    text-align: left;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+    line-height: 25px;
+    letter-spacing: -0.64px;
+    color: #2B353E;
+    opacity: 1;
+    }
+    
+    .title{
+    //     font-size: 13px;
+    //     color: #888;
+    //     width: 100%;
+    //     text-overflow: ellipsis;
+    //     white-space: nowrap;
+    //     overflow: hidden;
+    //     display: block;
+    //     margin-left: -10px;
+    // margin-top: -6px;
+    // color: black;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+    line-height: 12px;
+    letter-spacing: -0.56px;
+    color: #575757;
+    opacity: 1;
+    font-size: 14px;
+    width: 100%;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    display: block;
+    margin-left: -10px;
+    margin-top: -10px;
+    }
+}
+
+.employee-name-ar{
+    display: inline-block;
+    width: 80%;
+    .name{
+        // font-size: 16px;
+        // color: black;
+        // // margin: 0;
+        // width: 100%;
+        // text-overflow: ellipsis;
+        // white-space: nowrap;
+        // overflow: hidden;
+        // margin-left: -10px;
+        // margin-top: -5px;
+        // font-family: 'WorkSans-Bold';
+    font-size: 16px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    margin-left: -10px;
+    margin-top: -5px;
+    text-align: right;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+    line-height: 25px;
+    letter-spacing: -0.64px;
+    color: #2B353E;
+    opacity: 1;
+    }
+    
+    .title{
+    //     font-size: 13px;
+    //     color: #888;
+    //     width: 100%;
+    //     text-overflow: ellipsis;
+    //     white-space: nowrap;
+    //     overflow: hidden;
+    //     display: block;
+    //     margin-left: -10px;
+    // margin-top: -6px;
+    // color: black;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+    line-height: 12px;
+    letter-spacing: -0.56px;
+    color: #575757;
+    opacity: 1;
+    font-size: 14px;
+    width: 100%;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    display: block;
+    margin-left: -10px;
+    margin-top: -10px;
+    }
+}
+.image-container{
+    width: 20%;
+    display: inline-block;
+    text-align: center;
+    vertical-align: top;
+    margin-top: 5px;
+}
+.swipe-information{
+    color: #888;
+    font-size: 12px;
+    border-top: 1px solid #ccc;
+    padding-top: 6px;
+    margin-top: 6px;
+    .check-in {
+        font-size: 12px;
+                margin-right: 15px;
+    }
+}
\ No newline at end of file
diff --git a/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.spec.ts b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.spec.ts
new file mode 100644
index 00000000..8b69962b
--- /dev/null
+++ b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SubordinateLeaveComponent } from './subordinate-leave.component';
+
+describe('SubordinateLeaveComponent', () => {
+  let component: SubordinateLeaveComponent;
+  let fixture: ComponentFixture<SubordinateLeaveComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SubordinateLeaveComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SubordinateLeaveComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.ts b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.ts
new file mode 100644
index 00000000..cdcbd788
--- /dev/null
+++ b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.ts
@@ -0,0 +1,57 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { MyTeamService } from '../service/my-team.service';
+import * as moment from 'moment';
+
+@Component({
+  selector: 'app-subordinate-leave',
+  templateUrl: './subordinate-leave.component.html',
+  styleUrls: ['./subordinate-leave.component.scss'],
+})
+export class SubordinateLeaveComponent implements OnInit {
+  public startDate: any;
+  public endDate: any;
+  public list = [];
+  public noData = true;
+
+  constructor(
+    public ts: TranslatorService,
+    public common: CommonService,
+    public myTeamService: MyTeamService,
+  ) { }
+
+  ngOnInit() {}
+
+  subordinateLeaveList() {
+    const Sdata = this.common.convertDateToJsonDateUpdated(this.startDate);
+    const Edata = this.common.convertDateToJsonDateUpdated(this.endDate);
+    this.myTeamService.getEmployeeSubordinatesLeave({
+      P_DATE_FROM: Sdata,
+      P_DATE_TO: Edata
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      if (this.common.validResponse(result)) {
+        this.list = result.GetSubordinatesLeavesTotalVacationsList;
+        this.noData = false;
+      }
+    });
+  }
+
+  getDate(date) {
+    const newDate = this.common.localizeDate(new Date(this.common.getDateTimeISOFromStringUpdated(date).split(' ')[0]));
+    return newDate;
+  }
+  diffDays(date) {
+    const date1 = new Date(this.common.getDateTimeISOFromStringUpdated(date.DATE_START).split(' ')[0]);
+    const date2 = new Date(this.common.getDateTimeISOFromStringUpdated(date.DATE_END).split(' ')[0]);
+    const diff = Math.abs(date1.getTime() - date2.getTime());
+    const diffDays = Math.ceil(diff / (1000 * 3600 * 24));
+    return diffDays;
+  }
+
+  checkDate() {
+    if (this.startDate && this.endDate) {
+      return false;
+    } else { return true; }
+  }
+}
diff --git a/Mohem/src/app/notification/home/home.component.html b/Mohem/src/app/notification/home/home.component.html
index fe0b6141..31eda5f2 100644
--- a/Mohem/src/app/notification/home/home.component.html
+++ b/Mohem/src/app/notification/home/home.component.html
@@ -1,6 +1,7 @@
 <app-generic-header
   showBack="true"
   backLink="/home"
+  [worklistSetting] ='true'
   [headerText]="'home, worklist' | translate">
 </app-generic-header>
 
@@ -10,19 +11,20 @@
       <div class="request-heading">
         <span>{{ts.trPK('work-list','open-analysis')}}</span>
       </div>
-      <div class="result-text-container" [ngStyle]="showChart === false || receivedITGCount === false ? {'visibility': 'hidden'} : {}">
-          <span *ngIf="selectedFilter === 'ALL'">{{newWorkListResponse.length + ITGCount}} {{ts.trPK('work-list','of')}} </span>
-          <span *ngIf="showSearchButton && newWorkListResponse.length > 0 && selectedFilter !== 'ALL' && itemType !== ''">{{newWorkListResponse.length}} {{ts.trPK('work-list','of')}} </span>
-          <h2 *ngIf="!showSearchButton">{{totalRequestCount}}</h2>
-          <h2 *ngIf="showSearchButton && newWorkListResponse.length > 0 && itemType === ''">{{newWorkListResponse[0].NO_OF_ROWS + ITGCount}}</h2>
-          <h2 *ngIf="showSearchButton && newWorkListResponse.length > 0 && selectedFilter !== 'ALL' && itemType !== ''">{{newWorkListResponse[0].NO_OF_ROWS}}</h2>
+      <div class="result-text-container" >
+          <h2>{{totalRequestCount}}</h2>
+          <!-- <h2 *ngIf="showSearchButton && newWorkListResponse.length > 0 && itemType === ''">{{newWorkListResponse[0].NO_OF_ROWS + ITGCount}}</h2> -->
+          <!-- <h2 *ngIf="showSearchButton && newWorkListResponse.length > 0 && selectedFilter !== 'ALL' && itemType !== ''">{{newWorkListResponse[0].NO_OF_ROWS}}</h2> -->
           <span>{{ts.trPK('work-list','total')}} <br> {{ts.trPK('work-list','open-reqest')}}</span>
       </div>
+      <!-- <div *ngIf="!showChart || !receivedITGCount" class="spinner-custom-class">
+        <ion-spinner class="spinner" name="lines"></ion-spinner>
+      </div> -->
       <p-chart *ngIf="!showChart || !receivedITGCount" class="today-graph" type="doughnut" [data]="data" [options]="options"></p-chart>
-      <p-chart *ngIf="checkLoadingStatus()" class="today-graph" type="doughnut" [data]="data" [options]="options"></p-chart>
+      <p-chart *ngIf="showChart && receivedITGCount" class="today-graph" type="doughnut" [data]="data" [options]="options"></p-chart>
     </div>
 
-    <ion-row class="filters-row" *ngIf="showChart && receivedITGCount">
+    <ion-row class="filters-row">
       <ion-slides [options]="slideOptsOne">
           <ion-slide *ngFor="let filter of filters;  let i=index" [ngClass]="filter.disable === true ? 'disable-filter' : ''">
               <app-card-filter
@@ -41,7 +43,7 @@
             <span style="margin-left: 5px;">{{ts.trPK('work-list','clear-search')}}</span>
             <ion-icon name="close" ></ion-icon>
         </ion-col>
-        <ion-col style="float: right;" size=[6] (click)="openSearchModal()" *ngIf="selectedFilter === 'ALL'">
+        <ion-col style="float: right;" size=[6] (click)="openSearchModal()" *ngIf="selectedFilter !== 'ITG' && !showSearchButton">
             <ion-icon name="search" ></ion-icon>
             <span>{{ts.trPK('work-list','advanced-search')}}</span>
         </ion-col> 
@@ -70,7 +72,6 @@
         </div>
       </div>
       <div [ngClass]="ITGItem.length > 0 ? 'work-list-container' : ''" *ngIf="selectedFilter == 'ITG'" >
-          <!-- <div  *ngFor='let segmentInfo of ITGItem[0]; let i= index' (click)='openITG(segmentInfo)'> -->
           <div  *ngFor='let segmentInfo of ITGItem[0]; let i= index' >
           
           <div *ngIf="activeSegment !== 'All'" (click)='openITG(segmentInfo)'>
@@ -99,9 +100,8 @@
         </div>
       </div>
       </div>
-  <!-- </div> -->
   
-  <ion-infinite-scroll (ionInfinite)="doInfinite($event)" *ngIf="selectedFilter === 'ALL' || itemType !== ''">
+  <ion-infinite-scroll (ionInfinite)="doInfinite($event)" *ngIf="itemType !== ''">
     <ion-infinite-scroll-content></ion-infinite-scroll-content>
   </ion-infinite-scroll>
 </ion-content>
diff --git a/Mohem/src/app/notification/home/home.component.scss b/Mohem/src/app/notification/home/home.component.scss
index c1faeb72..b7444c88 100644
--- a/Mohem/src/app/notification/home/home.component.scss
+++ b/Mohem/src/app/notification/home/home.component.scss
@@ -355,7 +355,7 @@ z-index: 99;
 ion-col{
     background: white;
     border-radius: 12px;
-    padding-right: 30px;
+    // padding-right: 30px;
     flex: none;
     ion-icon{
         margin-right: 3px;
@@ -459,4 +459,10 @@ padding: 10px 30px;
 }
 .slideCss{
 width: auto !important;
+}
+
+.spinner-custom-class{
+    position: absolute;
+    right: 160px;
+    top: 100px;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/notification/home/home.component.ts b/Mohem/src/app/notification/home/home.component.ts
index 89200ab2..0ec194c5 100644
--- a/Mohem/src/app/notification/home/home.component.ts
+++ b/Mohem/src/app/notification/home/home.component.ts
@@ -11,6 +11,8 @@ import { WorklistAdvancedSearchComponent } from '../worklist-advanced-search/wor
 import { DatePipe } from '@angular/common';
 import { GetOpenNotificationsResponse } from 'src/app/hmg-common/services/dashbored/models/GetOpenNotificationsResponse';
 import { DashboredService } from 'src/app/hmg-common/services/dashbored/dashbored.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { COCRequest } from '../models/COCRequest';
 
 @Component({
   selector: 'app-home',
@@ -22,6 +24,7 @@ export class HomeComponent implements OnInit {
   public static REQUSET_INFO = 'requset_info';
   public static ALL_REQUEST = 'all_request';
   public static NOTIFICATION_DATA = 'notification_data';
+  public static COUNT_CHANGED = 'count_changed';
   public static NOTIFICATION_ARR = 'notification_arr';
   public static NAMES_ALL_iTEMS = 'names-all-items';
   public static IS_ALL_NAME = 'is_all_names';
@@ -66,16 +69,17 @@ export class HomeComponent implements OnInit {
   public newWorkListResponse = [];
   public showFormattedData = [];
   public allFormattedData = [];
-  public selectedFilter = 'ALL';
+  public selectedFilter = 'HR';
   public showSearchButton = false;
-  public itemType = '';
+  public itemType = 'HRSSA';
   public receivedITGCount = false;
-
+  public countChanged: any = false;
   public totalHR = 0;
   public totalPO = 0;
   public totalPR = 0;
   public totalMR = 0;
   public totalIC = 0;
+  public totalStamp = 0;
 
 
   public showChart = false;
@@ -85,30 +89,24 @@ export class HomeComponent implements OnInit {
     tooltips: { enabled: false },
     legend: { display: false }
   };
-  public data = {
-    datasets: [
-      {
-        data: [0, 0, 0, 0, 0, 0],
-        backgroundColor: [
-          '#18a169',
-          '#3cb9d5',
-          '#114475',
-          '#38c9b3',
-          '#cc3232',
-          '#9e7e97'
-        ],
-        borderWidth: 5
-      }]
-  };
+  // public data = {
+  //   datasets: [
+  //     {
+  //       data: [0, 0, 0, 0, 0, 0, 0],
+  //       backgroundColor: [
+  //         '#18a169',
+  //         '#3cb9d5',
+  //         '#114475',
+  //         '#38c9b3',
+  //         '#cc3232',
+  //         '#9e7e97',
+  //         '#ff9800'
+  //       ],
+  //       borderWidth: 6
+  //     }]
+  // };
+  public data: any;
   public filters = [
-    {
-      value: 0,
-      name: 'All',
-      active: true,
-      color: '#124375',
-      key: 'ALL',
-      disable: false
-    },
     {
       value: 0,
       name: 'HR',
@@ -156,6 +154,14 @@ export class HomeComponent implements OnInit {
       color: '#9e7e97',
       key: 'INVITEM',
       disable: false
+    },
+    {
+      value: 0,
+      name: 'STAMP',
+      active: false,
+      color: '#ff9800',
+      key: 'STAMP',
+      disable: false
     }
   ];
 
@@ -184,7 +190,7 @@ export class HomeComponent implements OnInit {
     this.WorkListObj.P_SEARCH_SENT_DATE = '';
     this.WorkListObj.P_SEARCH_ITEM_TYPE_DSP_NAME = '';
     this.WorkListObj.P_PAGE_NUM = 0;
-    this.WorkListObj.P_PAGE_LIMIT = 50;
+    this.WorkListObj.P_PAGE_LIMIT = 25;
   }
 
   ngOnInit() {
@@ -192,8 +198,14 @@ export class HomeComponent implements OnInit {
     this.isLoading = true;
   }
 
+
+
   ionViewWillEnter() {
-    console.log(this.filters);
+    this.totalRequestCount = this.common.getTotalNumberOfWorklistRequest();
+    const values = this.common.getFiltersData();
+    this.data = values.data;
+    this.filters = values.filters;
+
     const loadWorkList = this.common.sharedService.getSharedData('loadWorkList', false);
     if (loadWorkList) {
       this.receivedITGCount = false;
@@ -205,88 +217,61 @@ export class HomeComponent implements OnInit {
       }
       this.currentActiveIndex = 0;
       this.previousActiveIndex = 0;
-      this.itemType = '';
-      this.selectedFilter = 'ALL';
+      this.itemType = 'HRSSA';
+      this.selectedFilter = 'HR';
+      this.enableFilters();
+      this.filters[0].active = true;
       this.isPostNoLoad = true;
-      this.disableFilters();
       this.resetData();
       this.direction = TranslatorService.getCurrentLanguageName();
       this.worklistNotifications = this.common.sharedService.getSharedData('worklistNotifications', false);
-      this.openNotificationsDashboard();
+
+      var isWorklistChanged = this.common.sharedService.getSharedData(HomeComponent.COUNT_CHANGED);
+      if (isWorklistChanged) {
+        this.openNotificationsDashboard()
+      }
+      this.openNotificationsDashboardLocal();
     }
   }
 
   callWorkListServices() {
+    // if (this.countChanged) {
     this.Count();
+    // }
     this.getAllPushNotificationFun();
   }
 
-  openNotificationsDashboard() {
-    this.DS.getOpenNotifications('', '', this.isPostNoLoad).subscribe((result: GetOpenNotificationsResponse) => {
-      if (this.common.validResponse(result)) {
-        this.worklistNotifications = result;
-        this.totalRequestCount = this.worklistNotifications.P_OPEN_NTF_NUMBER;
-        this.common.sharedService.setSharedData(result, 'worklistNotifications');
-        this.Details();
-        this.callWorkListServices();
-      }
-    });
+  openNotificationsDashboardLocal() {
+    this.Details();
+    this.callWorkListServices();
+
   }
 
   assignDataToFilters() {
-    this.ngZone.run(() => {
-      this.filters[0].value = this.worklistNotifications.P_OPEN_NTF_NUMBER;
-      this.filters[1].value = this.totalHR;
-      this.filters[2].value = this.totalMR;
-      this.filters[3].value = this.totalPR;
-      this.filters[4].value = this.totalPO;
-      this.filters[6].value = this.totalIC;
-    });
-
-
-    if (this.totalHR === 0) {
-      this.data.datasets[0].data[0] = 0;
-    }
-
-    if (this.totalPO === 0) {
-      this.data.datasets[0].data[1] = 0;
-    }
-
-    if (this.totalPR === 0) {
-      this.data.datasets[0].data[2] = 0;
-    }
-
-    if (this.totalMR === 0) {
-      this.data.datasets[0].data[3] = 0;
-    }
-
-    if (this.totalIC === 0) {
-      this.data.datasets[0].data[5] = 0;
-    }
-
     const openNotificationsArray = this.worklistNotifications.GetOpenNotificationsList;
 
     for (const notification of openNotificationsArray) {
       if (notification.ITEM_TYPE === 'HRSSA') {
-        this.filters[1].value = this.totalHR;
+        this.filters[0].value = notification.OPEN_NTF_NUMBER;
         this.data.datasets[0].data[0] = notification.OPEN_NTF_NUMBER;
       } else if (notification.ITEM_TYPE === 'INVMOA') {
-        this.filters[2].value = this.totalMR;
+        this.filters[1].value = notification.OPEN_NTF_NUMBER;
         this.data.datasets[0].data[1] = notification.OPEN_NTF_NUMBER;
       } else if (notification.ITEM_TYPE === 'REQAPPRV') {
-        this.filters[3].value = this.totalPR;
+        this.filters[2].value = notification.OPEN_NTF_NUMBER;
         this.data.datasets[0].data[2] = notification.OPEN_NTF_NUMBER;
       } else if (notification.ITEM_TYPE === 'POAPPRV') {
-        this.filters[4].value = this.totalPO;
+        this.filters[3].value = notification.OPEN_NTF_NUMBER;
         this.data.datasets[0].data[3] = notification.OPEN_NTF_NUMBER;
       } else if (notification.ITEM_TYPE === 'INVITEM') {
-        this.filters[6].value = this.totalIC;
+        this.filters[5].value = notification.OPEN_NTF_NUMBER;
         this.data.datasets[0].data[5] = notification.OPEN_NTF_NUMBER;
+      } else if (notification.ITEM_TYPE === 'STAMP') {
+        this.filters[6].value = notification.OPEN_NTF_NUMBER;
+        this.data.datasets[0].data[6] = notification.OPEN_NTF_NUMBER;
       }
     }
-    // this.data.datasets[0].data[4] = this.ITGCount;
     this.showChart = true;
-    // this.common.stopLoading();
     this.isLoading = false;
   }
 
@@ -299,16 +284,46 @@ export class HomeComponent implements OnInit {
     }
   }
 
+  public initiateNewWorklistData(selectedFilter: any, filterValue: any) {
+    this.WorkListObj = new WorkListRequest();
+    this.WorkListObj.P_NOTIFICATION_TYPE = '1';
+    this.WorkListObj.P_SEARCH_FROM_USER = '';
+    this.WorkListObj.P_SEARCH_SUBJECT = '';
+    this.WorkListObj.P_SEARCH_SENT_DATE = '';
+    this.WorkListObj.P_SEARCH_ITEM_TYPE_DSP_NAME = '';
+    this.WorkListObj.P_PAGE_NUM = 0;
+    this.WorkListObj.P_PAGE_LIMIT = 25;
+
+    if (this.infiniteScroll) {
+      this.infiniteScroll.complete();
+    }
+    this.itemType = this.selectedFilter;
+
+    this.newWorkListResponse = [];
+    this.showFormattedData = [];
+    this.allFormattedData = [];
+
+    if (filterValue > 0) {
+      this.getAllPushNotificationFun();
+    } else {
+      this.common.stopLoading();
+    }
+
+  }
+
   activeFilter(index: number) {
-    console.log(this.filters);
-    if (this.currentActiveIndex !== index) {
+    if (index !== this.currentActiveIndex && index !== 7) {
+      if (index !== 4) {
+        this.common.startLoading();
+      }
       this.previousActiveIndex = this.currentActiveIndex;
       this.currentActiveIndex = index;
       this.filters[this.previousActiveIndex].active = false;
       this.filters[this.currentActiveIndex].active = true;
       this.selectedFilter = this.filters[this.currentActiveIndex].key;
+      const filterValue = this.filters[this.currentActiveIndex].value;
       if (this.selectedFilter !== 'ITG') {
-        this.getFilteredData(this.selectedFilter);
+        this.initiateNewWorklistData(this.selectedFilter, filterValue);
       }
     }
   }
@@ -317,12 +332,14 @@ export class HomeComponent implements OnInit {
     this.common.openProfile('sideMenu');
   }
 
-  disableFilters() {
+  configureFilters() {
     for (const filter of this.filters) {
       if (filter.key === this.itemType) {
+        const index = this.filters.map(function (e) { return e.key; }).indexOf(this.itemType);
+        this.currentActiveIndex = index;
+        this.previousActiveIndex = 0;
         filter.disable = false;
         filter.active = true;
-        filter.value = 0;
         this.selectedFilter = filter.name;
       } else if (this.itemType === '') {
         filter.disable = false;
@@ -332,17 +349,34 @@ export class HomeComponent implements OnInit {
         filter.active = false;
       }
     }
+
     if (this.itemType === '') {
       this.filters[0].active = true;
     }
   }
 
+
+  enableFilters() {
+    this.currentActiveIndex = 0;
+    this.previousActiveIndex = 0;
+    for (const filter of this.filters) {
+      filter.disable = false;
+      if (filter.key === this.itemType) {
+        filter.active = true;
+      } else {
+        filter.active = false;
+      }
+    }
+  }
+
   async openSearchModal() {
     const modal = await this.modalController.create({
       component: WorklistAdvancedSearchComponent,
       cssClass: 'advanced-search-modal-custom',
       backdropDismiss: false,
-      componentProps: {}
+      componentProps: {
+        itemType: this.itemType
+      }
     });
     modal.onDidDismiss().then(result => {
       if (result.data) {
@@ -358,13 +392,10 @@ export class HomeComponent implements OnInit {
           this.WorkListObj.P_PAGE_NUM = 1;
           this.newWorkListResponse = [];
           this.showFormattedData = [];
-          this.selectedFilter = 'ALL';
-          this.filters[this.currentActiveIndex].active = false;
-          this.currentActiveIndex = 0;
-          this.previousActiveIndex = 0;
-          this.filters[this.currentActiveIndex].active = true;
+          this.allFormattedData = [];
+
           if (this.itemType !== '') {
-            this.disableFilters();
+            this.configureFilters();
           }
           this.isPostNoLoad = false;
           this.getAllPushNotificationFun();
@@ -398,21 +429,6 @@ export class HomeComponent implements OnInit {
     );
   }
 
-  getFilteredData(filter: string) {
-    if (filter === 'ALL') {
-      this.showFormattedData = this.allFormattedData;
-    } else {
-      let arrayToFilter;
-      arrayToFilter = this.newWorkListResponse.filter((workList) => {
-        return workList.ITEM_TYPE === filter;
-      });
-      const categorizeData = this.categorizeData(arrayToFilter);
-      this.showFormattedData = this.sortArray(categorizeData);
-      // const sortData = this.sortArray(arrayToFilter);
-      // this.showFormattedData =  this.categorizeData(sortData);
-    }
-  }
-
   checkDateExistance(currentDate: any, formattedData: any) {
     let existsBefore = false;
     let index = 0;
@@ -429,33 +445,10 @@ export class HomeComponent implements OnInit {
     };
   }
 
-  addCountInFilters(workList: any) {
-    if (workList.ITEM_TYPE === 'HRSSA') {
-      this.totalHR = this.totalHR + 1;
-    } else if (workList.ITEM_TYPE === 'POAPPRV') {
-      this.totalPO = this.totalPO + 1;
-    } else if (workList.ITEM_TYPE === 'REQAPPRV') {
-      this.totalPR = this.totalPR + 1;
-    } else if (workList.ITEM_TYPE === 'INVMOA') {
-      this.totalMR = this.totalMR + 1;
-    } else if (workList.ITEM_TYPE === 'INVITEM') {
-      this.totalIC = this.totalIC + 1;
-    }
-  }
-
   categorizeData(arrayToCategorize: any) {
-    this.ngZone.run(() => {
-      this.totalHR = 0;
-      this.totalPO = 0;
-      this.totalPR = 0;
-      this.totalMR = 0;
-      this.totalIC = 0;
-    })
-
     const datePipe = new DatePipe('en-US');
     const formattedData = [];
     for (const workList of arrayToCategorize) {
-      this.addCountInFilters(workList);
       const currentDate = datePipe.transform(new Date(workList.BEGIN_DATE), 'MMMM dd, y');
       const currentObject = {
         date: '',
@@ -486,6 +479,7 @@ export class HomeComponent implements OnInit {
   }
 
   private handleWorkListResult(result: any) {
+    this.common.stopLoading();
     console.log(this.filters);
     const lastItemIndex = result.length - 1;
     const lastitem = result[lastItemIndex];
@@ -515,28 +509,25 @@ export class HomeComponent implements OnInit {
         this.showFormattedData = this.sortArray(categorizedWorkListResponse);
         this.allFormattedData = this.showFormattedData;
         this.common.sharedService.setSharedData(this.newWorkListResponse, HomeComponent.NOTIFICATION_ARR);
-        this.assignDataToFilters();
       }
     } else {
       this.newWorkListResponse = [];
-      // this.assignDataToFilters();
       if (this.showFormattedData.length === 0) {
-        this.resetFiltersUI();
+        // this.resetFiltersUI();
       }
       this.data.datasets[0].data[4] = this.ITGCount;
       this.showChart = true;
-      // this.common.stopLoading();
       this.isLoading = false;
     }
   }
 
-  public resetFiltersUI () {
+  public resetFiltersUI() {
     this.ngZone.run(() => {
       this.filters[0].value = 0;
       this.filters[1].value = 0;
       this.filters[2].value = 0;
       this.filters[3].value = 0;
-      this.filters[4].value = 0;
+      this.filters[5].value = 0;
       this.filters[6].value = 0;
 
       this.data.datasets[0].data[0] = 0;
@@ -544,11 +535,12 @@ export class HomeComponent implements OnInit {
       this.data.datasets[0].data[2] = 0;
       this.data.datasets[0].data[3] = 0;
       this.data.datasets[0].data[5] = 0;
+      this.data.datasets[0].data[6] = 0;
     });
   }
 
   openNotificationDetail(obj) {
-    this.common.sharedService.setSharedData(this.selectedFilter, 'selectedFilter');
+    this.common.sharedService.setSharedData(this.itemType, 'selectedFilter');
     this.common.sharedService.setSharedData(false, 'loadWorkList');
     this.common.sharedService.setSharedData(obj, HomeComponent.NOTIFICATION_DATA);
     if (obj.REQUEST_TYPE === 'PR') {
@@ -582,24 +574,19 @@ export class HomeComponent implements OnInit {
     this.WorkListObj.P_SEARCH_SUBJECT = '';
   }
 
-  // initializeWorkList() {
-
-  // }
-
   clearSearch() {
     this.common.startLoading();
-    this.isLoading = true;
-    this.itemType = '';
-    this.selectedFilter = 'ALL';
+    this.isLoading = false;
+    this.itemType = 'HRSSA';
+    this.selectedFilter = 'HR';
     this.isPostNoLoad = true;
-    this.disableFilters();
+    this.enableFilters();
     this.resetData();
     this.getAllPushNotificationFun();
   }
 
   doInfinite(infiniteScroll) {
     if (!this.isReachEnd && this.selectedFilter !== 'ITG') {
-      this.common.startLoading();
       this.WorklistService.getWorkList(this.WorkListObj, '', '', this.isPostNoLoad).subscribe((result) => {
         if (this.common.validResponse(result)) {
           this.handleWorkListResult(result.GetWorkList);
@@ -619,46 +606,43 @@ export class HomeComponent implements OnInit {
     this.ITGItem = [];
     this.workListService.getITGCount('', '', this.isPostNoLoad)
       .subscribe((result: any) => {
-        if (result.RequestType.length > 0) {
-          this.ITGSegment[0] = {
-            name: 'All',
-            code: 'All',
-            data: null,
-            style: false
-          };
-          this.ITGSegment[0].data = datas;
-          this.ITGSegment[0].names = names;
-          this.setActive(this.ITGSegment[0].code);
-        }
-        console.log(result.RequestType);
-        let count = 1;
-        for (let i = 0; i < result.RequestType.length; i++) {
-          console.log()
-          this.ITGSegment[count] = {
-            name: result.RequestType[i].RequestTypeName,
-            code: result.RequestType[i].RequestTypeCode,
-            data: result.RequestType[i].RequestDetails,
-            style: false
-          };
-          datas[i] = result.RequestType[i].RequestDetails;
-          names[i] = result.RequestType[i].RequestTypeCode;
-          count++;
+        if (result.RequestType) {
+          if (result.RequestType.length > 0) {
+            this.countChanged = false;
+            this.ITGSegment[0] = {
+              name: 'All',
+              code: 'All',
+              data: null,
+              style: false
+            };
+            this.ITGSegment[0].data = datas;
+            this.ITGSegment[0].names = names;
+            this.setActive(this.ITGSegment[0].code);
+          }
+          console.log(result.RequestType);
+          let count = 1;
+          for (let i = 0; i < result.RequestType.length; i++) {
+            console.log()
+            this.ITGSegment[count] = {
+              name: result.RequestType[i].RequestTypeName,
+              code: result.RequestType[i].RequestTypeCode,
+              data: result.RequestType[i].RequestDetails,
+              style: false
+            };
+            datas[i] = result.RequestType[i].RequestDetails;
+            names[i] = result.RequestType[i].RequestTypeCode;
+            count++;
+          }
         }
-        //this.sortArrayOfAll(this.ITGSegment[0].data)
-        console.log(this.ITGSegment);
 
       });
   }
 
   Details() {
-    this.workListService.getITGDetails('', '', this.isPostNoLoad)
-      .subscribe((result: any) => {
-        this.ITGCount = result.TotalCount;
-        this.totalRequestCount = this.totalRequestCount + result.TotalCount;
-        this.data.datasets[0].data[4] = this.ITGCount;
-        this.filters[5].value = result.TotalCount;
-        this.receivedITGCount = true;
-      });
+    this.ITGCount = this.common.filterKeys['ITG'];//result.TotalCount;
+    this.data.datasets[0].data[4] = this.common.filterKeys['ITG'];//this.ITGCount;
+    this.filters[4].value = this.common.filterKeys['ITG'];
+    this.receivedITGCount = true;
   }
 
   searchBtn() {
@@ -715,4 +699,58 @@ export class HomeComponent implements OnInit {
     }
     this.openITG(ITEM, NAME);
   }
+
+  openNotificationsDashboard() {
+    this.common.startLoading();
+    this.totalRequestCount = 0;
+    this.DS.getOpenNotifications('', '', false).subscribe((result: GetOpenNotificationsResponse) => {
+      if (this.common.validResponse(result)) {
+        const key = 'P_OPEN_NTF_NUMBER';
+        // this.totalRequestCount = ;
+        this.ITGCountAllNotification(result[key]);
+        this.common.sharedService.setSharedData(
+          result,
+          'worklistNotifications'
+        );
+
+        this.common.setFilterValues(result['GetOpenNotificationsList']);
+
+
+      }
+    });
+  }
+  ITGCountAllNotification(count) {
+    this.workListService.getITGDetails('', '', this.isPostNoLoad).subscribe((result: any) => {
+      this.common.sharedService.setSharedData(result, MenuResponse.ITG_COUNTS);
+      this.common.filterKeys['ITG'] = result.TotalCount;
+      const values = this.common.getFiltersData();
+      this.data = values.data;
+      this.filters = values.filters;
+      this.totalRequestCount = Math.floor(count + result.TotalCount);
+      this.common.sharedService.setSharedData(this.totalRequestCount, 'total-count');
+      this.getCOCNotificationCount();
+      this.common.stopLoading();
+    });
+  }
+  getCOCNotificationCount() {
+    const request = new COCRequest();
+    request.ItgPageSize = 1;
+    request.ItgPageNo = 1;
+    request.Date = moment(new Date()).format("YYYY-MM-DD");
+
+    this.workListService.getCOCCount(request, '', '', this.isPostNoLoad).subscribe((result: any) => {
+      console.log(result);
+      const countResult = result.Mohemm_ITG_Pending_Task_ResponseItem;
+      const totalCount = countResult.escalation + countResult.waitingToClose + countResult.waitingForAcceptance + countResult.extendTATRequest;
+      this.common.filterKeys['COC'] = totalCount;
+
+
+      this.totalRequestCount = Math.floor(this.totalRequestCount + totalCount);
+
+      this.common.sharedService.setSharedData(this.totalRequestCount, 'total-count');
+
+      this.common.stopLoading();
+    });
+  }
+
 }
diff --git a/Mohem/src/app/notification/models/COCRequest.ts b/Mohem/src/app/notification/models/COCRequest.ts
new file mode 100644
index 00000000..97e45176
--- /dev/null
+++ b/Mohem/src/app/notification/models/COCRequest.ts
@@ -0,0 +1,8 @@
+import { Request } from 'src/app/hmg-common/services/models/request';
+
+export class COCRequest extends Request {
+  public ItgPageSize: number;
+  public ItgPageNo: number;
+  public Date: string;
+  public EmployeeNumber: string;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/notification/models/userItemTypeRequest.ts b/Mohem/src/app/notification/models/userItemTypeRequest.ts
new file mode 100644
index 00000000..d6c934a2
--- /dev/null
+++ b/Mohem/src/app/notification/models/userItemTypeRequest.ts
@@ -0,0 +1,6 @@
+export class UserItemTypes extends Request {
+    public P_ITEM_TYPE: string;
+    public P_FYA_ENABLED_FALG: string;
+    public  P_FYI_ENABLED_FLAG: string;
+    public ItemID: number;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/notification/notification.module.ts b/Mohem/src/app/notification/notification.module.ts
index d9b5da73..8364c21c 100644
--- a/Mohem/src/app/notification/notification.module.ts
+++ b/Mohem/src/app/notification/notification.module.ts
@@ -32,6 +32,7 @@ import { MoreActionModalComponent } from './more-action-modal/more-action-modal.
 import { WorkListReplacementItgComponent } from './work-list-replacement-itg/work-list-replacement-itg.component';
 import { MoItemHistoryComponent } from './mo-item-history/mo-item-history.component';
 import { WorklistMainIcComponent } from './worklist-main-ic/worklist-main-ic.component';
+import { WorklistSettingComponent } from './worklist-setting/worklist-setting.component';
 
 
 const routes: Routes = [
@@ -123,6 +124,10 @@ const routes: Routes = [
       {
         path: 'item-creation-IC',
         component: WorklistMainIcComponent
+      },
+      {
+        path: 'worklist-settings',
+        component: WorklistSettingComponent
       }
     ]
   }
diff --git a/Mohem/src/app/notification/service/work-list.main.service.ts b/Mohem/src/app/notification/service/work-list.main.service.ts
index a68047d4..8c53b0bf 100644
--- a/Mohem/src/app/notification/service/work-list.main.service.ts
+++ b/Mohem/src/app/notification/service/work-list.main.service.ts
@@ -20,6 +20,9 @@ import { QuotationAnalysisResponse } from '../models/quotationAnalysisRes';
 import { Request } from 'src/app/hmg-common/services/models/request';
 import { LoginModel } from '../../authentication/models/LoginModel';
 import { itgRequest } from '../models/itgFormDetailsRequest';
+import { COCRequest } from '../models/COCRequest';
+
+import { UserItemTypes } from "../models/userItemTypeRequest";
 
 @Injectable()
 export class WorklistMainService {
@@ -30,7 +33,13 @@ export class WorklistMainService {
   public static getPRNotificationBody = "Services/ERP.svc/REST/GET_PR_NOTIFICATION_BODY";
   public static getICNotificationBody = "Services/ERP.svc/REST/GET_ITEM_CREATION_NTF_BODY";
   public static getBasicDetailNotificationBody = "Services/ERP.svc/REST/GET_BASIC_DET_NTF_BODY";
+  public static getPhoneNotificationBody = "Services/ERP.svc/REST/GET_PHONES_NOTIFICATION_BODY";
+  public static getTerminationNotificationBody = "Services/ERP.svc/REST/GET_TERM_NOTIFICATION_BODY";
+  public static getContactNotificationBody = "Services/ERP.svc/REST/GET_CONTACT_NOTIFICATION_BODY";
+  public static getStampMSNotificationBody = "Services/ERP.svc/REST/GET_STAMP_MS_NOTIFICATION_BODY";
+  public static getStampNSNotificationBody = "Services/ERP.svc/REST/GET_STAMP_NS_NOTIFICATION_BODY";
   public static getAddressNotificationBody = "Services/ERP.svc/REST/GET_ADDRESS_NOTIFICATION_BODY";
+  public static getCEINotificationBody = "Services/ERP.svc/REST/GET_CEI_NOTIFICATION_BODY";
   public static getPOItemHistory = "Services/ERP.svc/REST/GET_PO_ITEM_HISTORY";
   public static getMOItemHistory = "Services/ERP.svc/REST/GET_MO_ITEM_HISTORY";
   public static getNotificationButtons = "Services/ERP.svc/REST/GET_NOTIFICATION_BUTTONS";
@@ -40,7 +49,10 @@ export class WorklistMainService {
   public static getQutationAnalysisUrl = "Services/ERP.svc/REST/GET_QUOTATION_ANALYSIS";
   public static getITGFormTaskCount = 'Services/COCWS.svc/REST/ITGGetTaskCountRequestType';
   public static getITGFormTaskDetails = 'Services/COCWS.svc/REST/ITGFormsPendingTasks';
+  public static getCOCCount = 'Services/COCWS.svc/REST/Mohemm_ITG_ReviewerAdmin_Pending_Tasks';
   public static getITGFormDetails = 'Services/COCWS.svc/REST/ITGGetFormDetials';
+  public static getWorklistNotificationURL = 'Services/ERP.svc/REST/GET_USER_ITEM_TYPES';
+  public static updateWorklistNotificationURL = 'Services/ERP.svc/REST/UPDATE_USER_ITEM_TYPES';
 
 
 
@@ -94,6 +106,21 @@ export class WorklistMainService {
     );
   }
 
+  public getCEINotificationBody(
+    WorkListBodyRequest: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<MONotificatonBodyResponse> {
+    const request = WorkListBodyRequest;
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getCEINotificationBody,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
   public getPRNotificationBody(
     WorkListBodyRequest: any,
     onError?: any,
@@ -124,6 +151,36 @@ export class WorklistMainService {
     );
   }
 
+  public getStampMSNotificationBody(
+    WorkListBodyRequest: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<PRNotificatonBodyResponse> {
+    const request = WorkListBodyRequest;
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getStampMSNotificationBody,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+  public getStampNSNotificationBody(
+    WorkListBodyRequest: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<PRNotificatonBodyResponse> {
+    const request = WorkListBodyRequest;
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getStampNSNotificationBody,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
   public getAddressNotificationBody(
     WorkListBodyRequest: any,
     onError?: any,
@@ -154,6 +211,52 @@ export class WorklistMainService {
     );
   }
 
+  public getPhoneNotificationBody(
+    WorkListBodyRequest: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<any> {
+    const request = WorkListBodyRequest;
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getPhoneNotificationBody,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+
+  public getTerminationNotificationBody(
+    WorkListBodyRequest: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<any> {
+    const request = WorkListBodyRequest;
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getTerminationNotificationBody,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+  public getContactNotificationBody(
+    WorkListBodyRequest: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<any> {
+    const request = WorkListBodyRequest;
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getContactNotificationBody,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
   public getPOItemHistory(
     POItemHistoryReq: any,
     onError?: any,
@@ -331,6 +434,28 @@ export class WorklistMainService {
     }
   }
 
+  public getCOCCount( request: COCRequest, onError?: any, errorLabel?: string, isPostNoLoad = false): Observable<any> {
+    // const request = new Request();
+    console.log(request);
+    this.authService.authenticateRequest(request);
+    request.EmployeeNumber = request.UserName;
+    if (isPostNoLoad) {
+      return this.api.postNoLoad(
+        WorklistMainService.getCOCCount,
+        request,
+        onError,
+        errorLabel
+      );
+    } else {
+      return this.api.post(
+        WorklistMainService.getCOCCount,
+        request,
+        onError,
+        errorLabel
+      );
+    }
+  }
+
 
   public getITGActionRequest(itgrequest:itgRequest,actionURL:string, onError?: any, errorLabel?: string): Observable<any> {
     this.authService.authenticateRequest(itgrequest);
@@ -346,4 +471,32 @@ export class WorklistMainService {
   }
 
 
+  public getWorklistNotifications(
+    onError?: any,
+    errorLabel?: string
+  ): Observable<any> {
+    const request = new Request();
+    this.authService.authenticateRequest(request);
+    return this.api.post(
+      WorklistMainService.getWorklistNotificationURL,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+  public updateWorklistNotifications(
+    requestData: any,
+    onError?: any,
+    errorLabel?: string
+  ): Observable<any> {
+    this.authService.authenticateRequest(requestData);
+    return this.api.post(
+      WorklistMainService.updateWorklistNotificationURL,
+      requestData,
+      onError,
+      errorLabel
+    );
+  }
+
 }
diff --git a/Mohem/src/app/notification/service/worklist.service.ts b/Mohem/src/app/notification/service/worklist.service.ts
index 1673443f..b35b867d 100644
--- a/Mohem/src/app/notification/service/worklist.service.ts
+++ b/Mohem/src/app/notification/service/worklist.service.ts
@@ -6,6 +6,7 @@ import { WorkListReplacmentEmployeeRequest } from '../models/ReplacmentEmployeeR
 import { WorkListActionHistoryRequest } from '../models/ActionHistoryReq';
 import { WorKListRFCEmployeeResponse } from '../models/RFC-EmployeeRes';
 import { WorkListActionHistoryResponse } from '../models/ActionHistoryRes';
+import { Request } from 'src/app/hmg-common/services/models/request';
 
 
 @Injectable()
@@ -16,6 +17,7 @@ export class WorklistService {
   public static getRFCEmployeeList = 'Services/ERP.svc/REST/GET_RFC_EMPLOYEE_LIST';
   public static getActionHistory = 'Services/ERP.svc/REST/GET_ACTION_HISTORY';
   public static getFavorite = 'Services/ERP.svc/REST/Mohemm_GetFavoriteReplacements';
+  public static getFavoriteWithoutImage = 'Services/ERP.svc/REST/Mohemm_GetFavoriteReplacementsWithoutImage';
   public static saveFavorite = 'Services/ERP.svc/REST/Mohemm_ChangeFavoriteReplacements';
   constructor(
     public api: ConnectorService,
@@ -53,6 +55,15 @@ export class WorklistService {
 
   public getFavorite(req: any, onError?: any, errorLabel?: string): Observable<WorkListActionHistoryResponse> {
     this.authService.authenticateRequest(req);
+    console.log(req);
+    return this.api.post(WorklistService.getFavorite, req, onError, errorLabel);
+  }
+
+  public getFavoriteByLetter(letter: string, onError?: any, errorLabel?: string): Observable<WorkListActionHistoryResponse> {
+    const req = new Request();
+    this.authService.authenticateRequest(req);
+    req['ItgFilter'] = letter;
+    console.log(letter);
     return this.api.post(WorklistService.getFavorite, req, onError, errorLabel);
   }
   public saveFavoriteList(request: any, onError?: any, errorLabel?: string): Observable<any> {
@@ -63,6 +74,11 @@ export class WorklistService {
     return this.api.post(WorklistService.saveFavorite, req, onError, errorLabel);
   }
 
+  public getFavoriteWithoutImage(req: any, onError?: any, errorLabel?: string): Observable<WorkListActionHistoryResponse> {
+    this.authService.authenticateRequest(req);
+    return this.api.post(WorklistService.getFavoriteWithoutImage, req, onError, errorLabel);
+  }
+
   public getFavoriteMyTeam(req: any, onError?: any, errorLabel?: string): Observable<any> {
     this.authService.authenticateRequest(req);
     return this.api.post(WorklistService.getFavorite, req, onError, errorLabel);
diff --git a/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.html b/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.html
index d6286590..13606458 100644
--- a/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.html
+++ b/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.html
@@ -112,10 +112,15 @@
 
 
                   <div *ngIf="approvalInfo.Notes">
-
-                      <div class="containerNote">
+                      <div class="containerNote" *ngIf='!actionHistory'>
                           Note: {{approvalInfo.Notes}}
                       </div>
+                      <div class="containerNote" style="height: auto;" *ngIf='actionHistory'>
+                        Note: {{approvalInfo.Notes}}
+                    </div>
+                      <div *ngIf='approvalInfo.Notes.length >= 16'>
+                        <a (click)="actionHistory = !actionHistory">{{'general, show-more' | translate}}</a>
+                      </div>
 
                   </div>
               </div>
@@ -561,7 +566,7 @@
 
       </ion-tab-button>
 
-      <ion-tab-button (click)="skip()">
+      <ion-tab-button (click)="skip('skip')">
         <img src="../assets/imgs/mohemm-action/Skip.png" class="footer-btn-img">
         <ion-label style="font-size: 10px;">Skip</ion-label>
       </ion-tab-button>
diff --git a/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.ts b/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.ts
index 6ebede5e..fba4d82a 100644
--- a/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.ts
+++ b/Mohem/src/app/notification/work-list-main-itg/work-list-main-itg.component.ts
@@ -62,6 +62,7 @@ export class WorkListMainItgComponent implements OnInit {
   defaultSegment = '';
   public slideIndex = 0;
   public messageSuccess = false;
+  public actionHistory = false;
   constructor(
     public common: CommonService,
     public ts: TranslatorService,
@@ -148,28 +149,28 @@ export class WorkListMainItgComponent implements OnInit {
       return '../assets/imgs/mohemm-action/info.png';
     }
     if (actionName === 'Grant') {
-      return '../assets/imgs/mohemm-action/info.png';
+      return '../assets/imgs/mohemm-action/grant.png';
     }
     if (actionName === 'Delegate') {
       return '../assets/imgs/mohemm-action/delegate.png';
     }
     if (actionName === 'Answer') {
-      return '../assets/imgs/mohemm-action/info.png';
+      return '../assets/imgs/mohemm-action/answer.png';
     }
     if (actionName === 'Question') {
-      return '../assets/imgs/mohemm-action/info.png';
+      return '../assets/imgs/mohemm-action/question.png';
     }
     if (actionName === 'ReportGenerated') {
       return '../assets/imgs/mohemm-action/ReportGenerated.png';
     }
     if (actionName === 'Doable') {
-      return '../assets/imgs/mohemm-action/info.png';
+      return '../assets/imgs/mohemm-action/Doable.png';
     }
     if (actionName === 'NotDoable') {
-      return '../assets/imgs/mohemm-action/info.png';
+      return '../assets/imgs/mohemm-action/notDoable.png';
     }
     if (actionName === 'DataCorrected') {
-      return '../assets/imgs/mohemm-action/info.png';
+      return '../assets/imgs/mohemm-action/data-corrected.png';
     }
   }
 
@@ -192,8 +193,14 @@ export class WorkListMainItgComponent implements OnInit {
     });
   }
 
-  skip() {
+  skip(flag?) {
     // check if the user clicked on all type of request
+    if (flag != 'skip') {
+      this.common.setTotalNumberOfWorklistRequest();
+      // this.common.assignDataToFilters(this.common.sharedService.getSharedData('worklistNotifications', false), 'ITG');
+      if (this.common.filterKeys['ITG'] != 0)
+        this.common.filterKeys['ITG'] = (this.common.filterKeys['ITG'] - 1)
+    }
     if (this.is_all_items_sents) {
       for (let i = 1; i < this.all_request_names.length; i++) {
         for (let j = 0; j < this.all_request_names[i].data.length; j++) {
@@ -213,6 +220,7 @@ export class WorkListMainItgComponent implements OnInit {
             }
           } else if (this.index === this.all_request_names.length) { // if its the end request redirecte to worklist home
             this.common.sharedService.setSharedData(true, 'loadWorkList');
+            this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
             this.common.openNotificationPage();
             return false;
           }
@@ -228,6 +236,7 @@ export class WorkListMainItgComponent implements OnInit {
             return;
           } else {
             this.common.sharedService.setSharedData(true, 'loadWorkList');
+            this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
             this.common.openNotificationPage();
             return;
           }
@@ -235,6 +244,7 @@ export class WorkListMainItgComponent implements OnInit {
       }
     }
     this.common.sharedService.setSharedData(true, 'loadWorkList');
+    this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
     this.common.openNotificationPage();
     return;
   }
@@ -271,13 +281,17 @@ export class WorkListMainItgComponent implements OnInit {
                 this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
 
               } else if (result.MessageStatus === 1) {
-                this.messageSuccess = true;
+                // this.messageSuccess = true;
+                this.common.greenToastPK('worklist', 'done-successfully');
                 setTimeout(() => {
-                  this.messageSuccess = false;
+                  // this.messageSuccess = false;
                   this.common.sharedService.setSharedData(true, 'loadWorkList');
+
                   this.confirmMsg(1);
                   this.skip();
                 }, 2000);
+              } else {
+                this.common.redToastPK('worklist', 'save-error');
               }
             });
         } else if (action === 2) {// reject
@@ -291,13 +305,16 @@ export class WorkListMainItgComponent implements OnInit {
                   this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
 
                 } else if (result.MessageStatus === 1) {
+                  this.common.greenToastPK('worklist', 'done-successfully');
                   setTimeout(() => {
-                    this.messageSuccess = true;
+                    // this.messageSuccess = true;
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     this.confirmMsg(2);
                     this.skip();
-                    this.messageSuccess = false;
+                    // this.messageSuccess = false;
                   }, 2000);
+                } else {
+                  this.common.redToastPK('worklist', 'save-error');
                 }
               });
           }
@@ -315,15 +332,18 @@ export class WorkListMainItgComponent implements OnInit {
                 }
 
                 if (result.MessageStatus === 1) {
-                  this.messageSuccess = true;
+                  // this.messageSuccess = true;
+                  this.common.greenToastPK('worklist', 'done-successfully');
                   setTimeout(() => {
-                    this.messageSuccess = false;
+                    // this.messageSuccess = false;
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     // this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     this.confirmMsg(3);
                     this.skip();
                   }, 2000);
+                } else {
+                  this.common.redToastPK('worklist', 'save-error');
                 }
               });
           }
@@ -336,15 +356,18 @@ export class WorkListMainItgComponent implements OnInit {
                 this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
 
               } else if (result.MessageStatus === 1) {
-                this.messageSuccess = true;
+                // this.messageSuccess = true;
+                this.common.greenToastPK('worklist', 'done-successfully');
                 setTimeout(() => {
-                  this.messageSuccess = false;
+                  // this.messageSuccess = false;
                   this.common.sharedService.setSharedData(true, 'loadWorkList');
                   // this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
                   this.common.sharedService.setSharedData(true, 'loadWorkList');
                   this.confirmMsg(4);
                   this.skip();
                 }, 2000);
+              } else {
+                this.common.redToastPK('worklist', 'save-error');
               }
             });
         } else if (action === 5) { // answer
@@ -358,15 +381,18 @@ export class WorkListMainItgComponent implements OnInit {
                   this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
 
                 } else if (result.MessageStatus === 1) {
-                  this.messageSuccess = true;
+                  // this.messageSuccess = true;
+                  this.common.greenToastPK('worklist', 'done-successfully');
                   setTimeout(() => {
-                    this.messageSuccess = false;
+                    // this.messageSuccess = false;
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     // this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     this.confirmMsg(5);
                     this.skip();
                   }, 2000);
+                } else {
+                  this.common.redToastPK('worklist', 'save-error');
                 }
               });
           }
@@ -383,15 +409,18 @@ export class WorkListMainItgComponent implements OnInit {
                     this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
 
                   } else if (result.MessageStatus === 1) {
-                    this.messageSuccess = true;
+                    // this.messageSuccess = true;
+                    this.common.greenToastPK('worklist', 'done-successfully');
                     setTimeout(() => {
-                      this.messageSuccess = false;
+                      // this.messageSuccess = false;
                       this.common.sharedService.setSharedData(true, 'loadWorkList');
                       // this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
                       this.common.sharedService.setSharedData(true, 'loadWorkList');
                       this.confirmMsg(6);
                       this.skip();
                     }, 2000);
+                  } else {
+                    this.common.redToastPK('worklist', 'save-error');
                   }
                 });
             } else {
@@ -409,15 +438,18 @@ export class WorkListMainItgComponent implements OnInit {
                   this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
 
                 } else if (result.MessageStatus === 1) {
-                  this.messageSuccess = true;
+                  // this.messageSuccess = true;
+                  this.common.greenToastPK('worklist', 'done-successfully');
                   setTimeout(() => {
-                    this.messageSuccess = false;
+                    // this.messageSuccess = false;
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     // this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
                     this.common.sharedService.setSharedData(true, 'loadWorkList');
                     this.confirmMsg(6);
                     this.skip();
                   }, 2000);
+                } else {
+                  this.common.redToastPK('worklist', 'save-error');
                 }
               });
           } else {
@@ -470,7 +502,8 @@ export class WorkListMainItgComponent implements OnInit {
       this.actionService(1, this.commentText);
     }
     if (this.actionSelected === 'Delegate') {
-      this.common.sharedService.setSharedData(info,'selectedEmpInfo'),
+      this.common.sharedService.setSharedData(info, 'selectedEmpInfo'),
+        this.common.sharedService.setSharedData('Delegate', 'pressedBtn')
       this.presentModal(4);
     }
     if (this.actionSelected === 'Doable') {
@@ -489,6 +522,7 @@ export class WorkListMainItgComponent implements OnInit {
       this.actionService(2, this.commentText);
     }
     if (this.actionSelected === 'RequestInformation') {
+      this.common.sharedService.setSharedData('RequestInformation', 'pressedBtn')
       this.presentModal(3);
     }
     if (this.actionSelected === 'ReportGenerated') {
@@ -509,9 +543,9 @@ export class WorkListMainItgComponent implements OnInit {
     modal.cssClass = 'replaceRoll-modal';
     modal.onDidDismiss()
       .then((data) => {
-        if(data.data.empData){
+        if (data.data.empData) {
           this.replcamentID = data.data.empData.USER_NAME ? data.data.empData.USER_NAME : data.data.empData.EmployeeID;
-          this.commentText = data.data.comments ? data.data.comments: null;
+          this.commentText = data.data.comments ? data.data.comments : null;
           if (actionNumber === 3) {
             this.actionService(3, this.commentText);
           } else if (actionNumber === 4) {
@@ -542,8 +576,8 @@ export class WorkListMainItgComponent implements OnInit {
   returnDateTime(stringDate: string) {
     let allDateTime = stringDate.split(' ');
     let time = allDateTime[1].split(':', 2);
-    let dateArr= allDateTime[0].split('/')
-    let correctDate = dateArr[1]+'/'+dateArr[0]+'/'+dateArr[2];
+    let dateArr = allDateTime[0].split('/')
+    let correctDate = dateArr[1] + '/' + dateArr[0] + '/' + dateArr[2];
     let fullDate = this.transform(correctDate);
     return fullDate + ' ' + time[0] + ':' + time[1] + ' ' + allDateTime[2];
 
@@ -568,7 +602,7 @@ export class WorkListMainItgComponent implements OnInit {
     return this.locale[lang].month_names_short[month];
   }
 
-  backgroundColor(statusName: string){
+  backgroundColor(statusName: string) {
     // {'bg-blue-txt' : approvalInfo.Action === 'Submit','bg-red-txt': approvalInfo.Action == 'Not Doable' ,'bg-orange-txt' : approvalInfo.Action === 'Pending' ,'bg-red-txt' : approvalInfo.Action === 'Rejected','bg-green-txt' : approvalInfo.Action != 'Pending'  && approvalInfo.Action != 'Rejected' && approvalInfo.Action != 'Submit'}
     switch (statusName) {
       case 'Submit':
diff --git a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html
index 85e6ad39..f54b721a 100644
--- a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html
+++ b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html
@@ -1,13 +1,12 @@
 <ion-header>
-  <ion-toolbar>
-    <!-- <nav-buttons></nav-buttons> -->
+  <!-- <ion-toolbar>
     <ion-title>{{ 'worklistMain, delegate' | translate}}</ion-title>
     <ion-buttons slot="primary">
       <ion-button style="background: none !important;" (click)="closePage()">
         <ion-icon slot="icon-only" name="close"></ion-icon>
       </ion-button>
     </ion-buttons>
-  </ion-toolbar>
+  </ion-toolbar> -->
 </ion-header>
 
 <ion-content padding>
@@ -60,9 +59,15 @@
     
       </ion-radio-group> -->
     <ion-list-header>
-      <ion-label class="boldTxtNav">{{'replacementRoll, searchBy' | translate}}</ion-label>
+      <!-- <ion-label class="boldTxtNav">{{'replacementRoll, searchBy' | translate}}</ion-label> -->
+      <ion-title class="boldTxtNav" *ngIf="!isAnswer && getPassActionMode !='RequestInformation' && getPassActionMode !='Delegate'" color="dark">{{
+        'replacementRoll, title' | translate}}</ion-title>
+      <ion-title class="boldTxtNav" *ngIf="getPassActionMode =='RequestInformation'" color="dark">{{ 'worklistMain, request' | translate}}
+      </ion-title>
+      <ion-title class="boldTxtNav" *ngIf="getPassActionMode =='Delegate'" color="dark">{{ 'worklistMain, delegate' | translate}}</ion-title>
     </ion-list-header>
-    <ion-radio-group [(ngModel)]="searchKeySelect" (ionChange)="onChangeSelect($event)">
+    
+    <!-- <ion-radio-group [(ngModel)]="searchKeySelect" (ionChange)="onChangeSelect($event)">
       <ion-row class="top-radio-row" style="display: flex;">
         <ion-item lines='none'>
           <ion-radio mode="md" value="1" checked></ion-radio>
@@ -95,19 +100,49 @@
           </ion-label>
         </ion-item>
       </ion-row>
-    </ion-radio-group>
-
-
-    <ion-item lines="none" class="search-box" *ngIf='!isFilter && !userSelected'>
+    </ion-radio-group> -->
+
+    <div style="border: 1px solid lightgray; border-radius: 100px; width: 100%;">
+      <ion-grid style="height: 50px; padding: 1px 1px 1px 1px;">
+        <ion-row>
+          <ion-col size="7">
+            <div *ngIf="isFilter" style="height: 0px;">
+              <ion-searchbar style="padding-top: 1px;" class="filterClass" mode='md' (ionInput)="filterList($event)" placeholder="Filter">
+              </ion-searchbar>
+            </div>
+            <ion-input *ngIf="!isFilter" class='replacmentSearchBar' clearInput="true"
+               [(ngModel)]="searchKey" [placeholder]='"replacementRoll, searchbyname" | translate'>
+              <ion-icon style="width: 50px; height: 21px;" name="search"></ion-icon>
+            </ion-input>
+          </ion-col>
+          <ion-col size="5" style="display: flex;">
+            <div class="vl"></div>
+            <ion-item lines="none" style="display: flex;">
+              <ion-select style="min-width: 100%; height: 40px; padding-top: 5px;" [(ngModel)]="searchKeySelect" (ionChange)="onChangeSelect($event)">
+                <ion-select-option value="1" checked><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, workflow' | translate}}</p></ion-select-option>
+                <ion-select-option value="4" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, favorite' | translate}}</p></ion-select-option>
+                <ion-select-option value="2" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, employee-id' | translate}}</p></ion-select-option>
+                <ion-select-option value="3" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, employee-email' | translate}}</p></ion-select-option>
+                <ion-select-option value="5" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, employee-name' | translate}}</p></ion-select-option>
+              </ion-select>
+            </ion-item>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+    </div>
+    <ion-grid>
+      <ion-row>
+        <ion-col>
+          <div style="text-align: end;" *ngIf='searchKey && !userSelected && !isFilter'>
+            <button ion-button clear class="searchText" (click)="onChangeInput()" type="button"  item-right >
+              {{"general, search" | translate}}
+            </button>
+          </div>
+        </ion-col>
+      </ion-row>
+    </ion-grid>
 
-      <!-- <ion-input (ionInput)="onChangeInput()" [ngClass]="direction == 'ltr'? 'filterInput':'filterInput-ar'"
-        [(ngModel)]="searchKey" [placeholder]='getPlaceHolder()' clearInput="true"></ion-input> -->
-        <!-- <ion-input class='replacmentSearchBar'
-        style="height: 45px; border: 1px solid lightgray; border-radius: 50px; width: 350px;"
-        [(ngModel)]="searchKey"
-          [placeholder]='"replacementRoll, searchbyname" | translate' clearInput="true">
-          <ion-button (click)='onChangeInput()' style="--background: transparent; background: transparent; color: black"><ion-icon name="search"></ion-icon></ion-button>
-        </ion-input> -->
+    <!-- <ion-item lines="none" class="search-box" *ngIf='!isFilter && !userSelected'>
         <ion-grid>
           <ion-row style="height: 45px; border: 1px solid lightgray; border-radius: 50px;">
             <ion-col size='9'>
@@ -130,11 +165,50 @@
     <div *ngIf="isFilter && !userSelected">
       <ion-searchbar class="filterClass" mode='md' (ionInput)="filterList($event)" placeholder="Filter">
       </ion-searchbar>
-    </div>
+    </div> -->
 
 
   </ion-list>
 
+  <!-- <div style="font-weight: bold;" *ngIf="searchKeySelect === '4' && !isFavoriteLetterActive">
+    <ion-slides [options]="slideOptsOne">
+      <ion-slide *ngFor="let filter of favLetter;  let i=index">
+        <div>
+          <p (click)='selectedLetter(favLetter[i])'>{{filter}}</p>
+        </div>
+      </ion-slide>
+  </ion-slides>
+  </div> -->
+  <div class="letterDiv" *ngIf="searchKeySelect === '4' && !isFavoriteLetterActive && !userSelected">
+    <!-- <ion-slides [options]="slideOptsOne">
+      <ion-slide *ngFor="let filter of favLetter;  let i=index"> -->
+        <div *ngFor="let filter of favLetter;  let i=index" class="letterDivLoop">
+          <p (click)='selectedLetter(favLetter[i])'>{{filter}}</p>
+        </div>
+      <!-- </ion-slide>
+  </ion-slides> -->
+  </div>
+
+  <div class="letterDiv" *ngIf="searchKeySelect === '4' && isFavoriteLetterActive && !userSelected">
+    <!-- <ion-slides [options]="slideOptsOne">
+      <ion-slide *ngFor="let filter of favLetter;  let i=index"> -->
+        <div [ngClass]="returnIsActiveFunction(i)? 'isFavLetterActive':'letterDivLoop'" *ngFor="let filter of favLetter;  let i=index">
+          <p (click)='selectedLetter(favLetter[i])'>{{filter}}</p>
+        </div>
+      <!-- </ion-slide>
+  </ion-slides> -->
+  </div>
+
+  <!-- <div style="font-weight: bold;" *ngIf="searchKeySelect === '4' && isFavoriteLetterActive">
+    <ion-slides [options]="slideOptsOne">
+      <ion-slide *ngFor="let filter of favLetter;  let i=index">
+        <div [ngClass]="returnIsActiveFunction(i)? 'isFavLetterActive':''">
+          <p (click)='selectedLetter(favLetter[i])'>{{filter}}</p>
+        </div>
+      </ion-slide>
+  </ion-slides>
+  </div> -->
+
   <!-- <ion-item>
       <ion-list [(ngModel)]="selEmp" *ngIf="ReplacementList">
         <ion-item *ngFor="let employee of ReplacementList;let i=index;">
@@ -154,7 +228,7 @@
         </ion-item>
       </ion-radio-group>
     </ion-list> -->
-  <div *ngIf="!userSelected">
+  <div *ngIf="!userSelected" style="float: right;">
     <div *ngIf="ReplacementList.length>0" class="uk-margin">
       {{'replacementRoll, search-result' | translate}}
     </div>
@@ -227,8 +301,8 @@
   </div>
 
   <!-- favorite list -->
-  <div [hidden]="isAnswer==true"
-    *ngIf="favoriteUserList.length> 0 && !userSelected && ReplacementList.length ==0 && searchKeySelect == '4'">
+  <div [hidden]="isAnswer==true" style="width: 90%; float: left;" 
+    *ngIf="favoriteUserList.length> 0 && !userSelected && ReplacementList.length ==0 && searchKeySelect == '4' && isFavoriteLetterActive">
     <div class="uk-margin">
       {{'replacementRoll, favorite' | translate}}
     </div>
@@ -259,6 +333,25 @@
     </div>
   </div>
 
+  <div style="margin: 180px 15px 0px 15px !important;"  *ngIf="favLetter.length > 0 && searchKeySelect == '4' && favoriteUserList.length === 0">
+    <ion-label>
+      <p style="text-align: center;">
+        {{'general, fav-showData' | translate}}
+      </p>
+    </ion-label>
+  </div>
+  <div style="margin: -21px 15px 0px 15px !important;"  *ngIf="favoriteUserList.length === 0 && searchKeySelect == '4' && favLetter.length ===0">
+    <ion-label>
+      <p style="  margin: 15px 15px 0px 15px;
+      font-weight: bold;
+      clear: both;
+      position: relative;
+      top: 10px;">
+        {{'general, fav-noData' | translate}}
+      </p>
+    </ion-label>
+  </div>
+
   <div *ngIf='messageSuccess' class="succssfullMSG">
     <ion-col size="12">
       <ion-icon class="succssfullIcon" name="checkmark"></ion-icon>
diff --git a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss
index 9ea7dfa7..be2d6286 100644
--- a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss
+++ b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss
@@ -1,280 +1,313 @@
+.disabledButton {
+  opacity: 0.5;
+}
 
-.disabledButton{
-    opacity:.5;
-  
-  }
-  
-  .radio-label{
-    margin: 4px;
-      position: relative;
-      bottom: 4px;
-  }
-  ion-radio{
-    --color-checked: #269db8;
-   }
-  .center{text-align: center;}
-  .boldTxtNav{
-    font-weight: bold;
-  }
-  .employee-details{
-    display:inline-block;
-    margin: 10px;
-  }
-  .empImgeRep{
-    display: inline-block;
-    height: 40px;
-    width: 40px;
-  }
-  .star-fav{
-    float: right;
-    margin: 10px;
-  }
-  .star-fav-left{
-    float: left;
-    margin: 10px 5px;
-  }
-  .uk-margin{margin: 15px 15px 0px 15px;
-    font-weight: bold;
-    clear: both;
-    position: relative;
-    top: 10px;}
-  .uk-padding{ padding: 20px;}
-  .uk-padding .employee-details{
-    bottom: 10px;
-    position: relative;}
-   
-    .filterInput{
-        border: solid var(--gray) 1px;
-        border-radius: 21px;
-        padding-left: 10px !important;
-      }
-      .filterInput-ar{
-      
-        border: solid var(--gray) 1px;
-        border-radius: 21px;
-        --padding-start: 10px !important;
-        
-      }
-      .square-container{
-          width:100%;
-          clear: both;
-      }
-      .square{
-        clear: both; 
-      }
-      .top-radio-row{
-        font-size: 12px;
-      }
+.radio-label {
+  margin: 4px;
+  position: relative;
+  bottom: 4px;
+}
+ion-radio {
+  --color-checked: #269db8;
+}
+.center {
+  text-align: center;
+}
+.boldTxtNav {
+  text-align: start;
+  font-weight: bold;
+  padding: 12px;
+}
+.employee-details {
+  display: inline-block;
+  margin: 10px;
+}
+.empImgeRep {
+  display: inline-block;
+  height: 40px;
+  width: 40px;
+}
+.star-fav {
+  float: right;
+  margin: 10px;
+}
+.star-fav-left {
+  float: left;
+  margin: 10px 5px;
+}
+.uk-margin {
+  margin: 15px 15px 0px 15px;
+  font-weight: bold;
+  clear: both;
+  position: relative;
+  top: 10px;
+}
+.uk-padding {
+  padding: 20px;
+}
+.uk-padding .employee-details {
+  bottom: 10px;
+  position: relative;
+}
 
-      button.item-button.button.button-md.button-clear.button-clear-md {
-        background-color: transparent;
-      }
-      
-      .footer-button {
-        background: #dbdbdb;
-        border-radius: 10px;
-        color: black;
-        --background: transparent;
-        font-weight: bold;
-        width: 75%;
-      }
-      
-      // ion-item {
-      //   margin-top: 5%;
-      //   margin-right: 7%;
-      //   width: 100%;
-      // }
-      .ionItem{
-        border: #e4e4e4 solid;
-        /* margin: 6px; */
-        /* padding: 11px; */
-        height: 85px;
-        width: 164px;
-        border-radius: 5px;
-        text-align: center;
-        
-      }
-      
-      
-      .profileImageDiv{
-        
-        z-index: 3;
-        position: relative;
-        top: 0;
-      
-      }
-      .profileImage{
-        width:60px !important;
-      
-      }
-      
-      .activated{
-        border: #209a83 0.02cm solid ;
-      }
-      .deactivated{  border: #e4e4e4 0.02cm  solid;
-      }
-      .repContentDiv{
-        text-align: center;
-        width: 85%;
-        font-size: 14px;
-        border: #e4e4e4 solid;
-        border-radius: 5px;
-        padding: 20px 8px 8px 8px;
-        margin-top: -9px;
-        margin-right: -35px
-      
-      }
-      .selIEmpDiv{
-        text-align: right;
-        margin-bottom: -26px;
-        margin-right: 0px;
-        z-index: 3;
-        position: relative;
-        top: 0;
-      }
-      
-      .selIEmpImage{
-        width:22px !important
-      
-      }
-      
-      .noteInput{
-        border: solid var(--gray) 1px;
-        border-radius: 15px;
-        margin: 8px 17px 0px 17px;
-        padding: 10px 2px 10px 2px;
-      }
-      .filterInput{
-        border: solid var(--gray) 1px;
-        border-radius: 21px;
-        padding-left: 10px !important;
-      }
-      
-      .filterInput-ar{
-        // border: solid var(--gray) 1px;
-        // border-radius: 21px;
-        // padding-left: 10px !important;
-        border: solid var(--gray) 1px;
-        border-radius: 21px;
-        // width:250px
-        // padding-left: 145px !important;
-        //margin-left: 123px;
-        // padding-right: 129px;
-        //margin-right: -136px;
-        
-      }
-      .filterBtn{
-        background: var(--newgreen);
-        --background: var (--newgreen);
-        border-radius: 50%;
-        height: 60px;
-        width: 60px;
-      }
-      .filterBtn-ar{
-        // background: var(--newgreen);
-        // --background: var (--newgreen);
-        // border-radius: 50%;
-        // height: 60px;
-        // width: 60px;
-        background: var(--newgreen);
-        --background: var (--newgreen);
-        border-radius: 50%;
-        height: 60px;
-        width: 60px;
-        margin-left: -183px;
-        margin-right: 260px;
-      }
-      
-      
-      
-      *{
-        box-sizing: border-box;
-      }
-      
-      .square-container{
-        // padding: 8px;
-        width:100%;
-      }
-      .square{
-       // width:calc(100% / 2);
-       width:100%;
-        float:left;
-        position: relative;
-        // padding-bottom: calc(100% / 2);
-      }
-      
-      .square .content{
-        width: calc(100% - 16px) !important;
-        height: calc(100% - 16px) !important;
-        margin: 8px;
-        padding: 16px;
-        // position: absolute;
-        color: white;
-        border-radius: 9px;
-        text-align: center;
-        min-height: 92px;
-        // background-color: #0095ff;
-        // box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26);
-      }
-      
-      .disabledButton{
-        opacity:.5;
-      
-      }
-      
-      .radio-label{
-        font-size: 9px;
-          margin: 4px;
-          position: relative;
-          bottom: 4px;
-      }
-      ion-radio{
-        --color-checked: #269db8;
-       }
-      .center{text-align: center;padding: 5px;}
-      .boldTxtNav{
-        font-weight: bold;
-        padding: 5px;
-      }
-      .employee-details{
-        display:inline-block;
-        margin: 10px;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        width: 70%;
-      }
-      .empImgeRep{
-        display: inline-block;
-        height: 40px;
-        width: 40px;
-      }
-      .star-fav{
-        float: right;
-        margin: 15px 0px 0px 0px;
-      }
-      .uk-margin{margin: 15px 15px 0px 15px;
-        font-weight: bold;
-        clear: both;
-        position: relative;
-        top: 10px;}
-      .uk-padding{ padding: 20px;}
-      .uk-padding .employee-details{
-        bottom: 10px;
-        position: relative;}
-       
-        // .star-fav-left{
-        //   float: left;
-        //   margin: 10px 5px;
-        // }
-        .top-radio-row{
-          font-size: 12px;
-          display: block;
-          padding-bottom: 25px;
-          padding-top: 15px;
-        }
-        .textSearchType{
-          padding-top: 8px;
-          font-size: 12px;
-        }
-      
-      
\ No newline at end of file
+.filterInput {
+  border: solid var(--gray) 1px;
+  border-radius: 21px;
+  padding-left: 10px !important;
+}
+.filterInput-ar {
+  border: solid var(--gray) 1px;
+  border-radius: 21px;
+  --padding-start: 10px !important;
+}
+.square-container {
+  width: 100%;
+  clear: both;
+}
+.square {
+  clear: both;
+}
+.top-radio-row {
+  font-size: 12px;
+}
+
+button.item-button.button.button-md.button-clear.button-clear-md {
+  background-color: transparent;
+}
+
+.footer-button {
+  background: #dbdbdb;
+  border-radius: 10px;
+  color: black;
+  --background: transparent;
+  font-weight: bold;
+  width: 75%;
+}
+
+// ion-item {
+//   margin-top: 5%;
+//   margin-right: 7%;
+//   width: 100%;
+// }
+.ionItem {
+  border: #e4e4e4 solid;
+  /* margin: 6px; */
+  /* padding: 11px; */
+  height: 85px;
+  width: 164px;
+  border-radius: 5px;
+  text-align: center;
+}
+
+.profileImageDiv {
+  z-index: 3;
+  position: relative;
+  top: 0;
+}
+.profileImage {
+  width: 60px !important;
+}
+
+.activated {
+  border: #209a83 0.02cm solid;
+}
+.deactivated {
+  border: #e4e4e4 0.02cm solid;
+}
+.repContentDiv {
+  text-align: center;
+  width: 85%;
+  font-size: 14px;
+  border: #e4e4e4 solid;
+  border-radius: 5px;
+  padding: 20px 8px 8px 8px;
+  margin-top: -9px;
+  margin-right: -35px;
+}
+.selIEmpDiv {
+  text-align: right;
+  margin-bottom: -26px;
+  margin-right: 0px;
+  z-index: 3;
+  position: relative;
+  top: 0;
+}
+
+.selIEmpImage {
+  width: 22px !important;
+}
+
+.noteInput {
+  border: solid var(--gray) 1px;
+  border-radius: 15px;
+  margin: 8px 17px 0px 17px;
+  padding: 10px 2px 10px 2px;
+}
+.filterInput {
+  border: solid var(--gray) 1px;
+  border-radius: 21px;
+  padding-left: 10px !important;
+}
+
+.filterInput-ar {
+  // border: solid var(--gray) 1px;
+  // border-radius: 21px;
+  // padding-left: 10px !important;
+  border: solid var(--gray) 1px;
+  border-radius: 21px;
+  // width:250px
+  // padding-left: 145px !important;
+  //margin-left: 123px;
+  // padding-right: 129px;
+  //margin-right: -136px;
+}
+.filterBtn {
+  background: var(--newgreen);
+  --background: var (--newgreen);
+  border-radius: 50%;
+  height: 60px;
+  width: 60px;
+}
+.filterBtn-ar {
+  // background: var(--newgreen);
+  // --background: var (--newgreen);
+  // border-radius: 50%;
+  // height: 60px;
+  // width: 60px;
+  background: var(--newgreen);
+  --background: var (--newgreen);
+  border-radius: 50%;
+  height: 60px;
+  width: 60px;
+  margin-left: -183px;
+  margin-right: 260px;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+.square-container {
+  // padding: 8px;
+  width: 100%;
+}
+.square {
+  // width:calc(100% / 2);
+  width: 100%;
+  float: left;
+  position: relative;
+  // padding-bottom: calc(100% / 2);
+}
+
+.square .content {
+  width: calc(100% - 16px) !important;
+  height: calc(100% - 16px) !important;
+  margin: 8px;
+  padding: 16px;
+  // position: absolute;
+  color: white;
+  border-radius: 9px;
+  text-align: center;
+  min-height: 92px;
+  // background-color: #0095ff;
+  // box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26);
+}
+
+.disabledButton {
+  opacity: 0.5;
+}
+
+.radio-label {
+  font-size: 9px;
+  margin: 4px;
+  position: relative;
+  bottom: 4px;
+}
+ion-radio {
+  --color-checked: #269db8;
+}
+.center {
+  text-align: center;
+  padding: 5px;
+}
+.boldTxtNav {
+  font-weight: bold;
+  padding: 5px;
+}
+.employee-details {
+  display: inline-block;
+  margin: 10px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  width: 70%;
+}
+.empImgeRep {
+  display: inline-block;
+  height: 40px;
+  width: 40px;
+}
+.star-fav {
+  float: right;
+  margin: 15px 0px 0px 0px;
+}
+.uk-margin {
+  margin: 15px 15px 0px 15px;
+  font-weight: bold;
+  clear: both;
+  position: relative;
+  top: 10px;
+}
+.uk-padding {
+  padding: 20px;
+}
+.uk-padding .employee-details {
+  bottom: 10px;
+  position: relative;
+}
+
+// .star-fav-left{
+//   float: left;
+//   margin: 10px 5px;
+// }
+.top-radio-row {
+  font-size: 12px;
+  display: block;
+  padding-bottom: 25px;
+  padding-top: 15px;
+}
+.textSearchType {
+  padding-top: 8px;
+  font-size: 12px;
+}
+
+.isFavLetterActive {
+  color: #269db8;
+  display: block; 
+  width: 60%; 
+  float: right; 
+  transition-duration: 0ms; 
+  height: 35px;
+}
+.vl {
+  border-left: 2px solid lightgray;
+  height: 42px;
+}
+.searchText{
+  background: transparent;
+  color: #269db8;
+  font-weight: bold;
+  text-decoration: underline;
+}
+
+.letterDiv{
+  font-weight: bold; 
+  width: 10%; 
+  float: right;
+}
+.letterDivLoop{
+  display: block; 
+  width: 60%; 
+  float: right; 
+  transition-duration: 0ms; 
+  height: 35px;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.ts b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.ts
index bd1ab765..9426bf97 100644
--- a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.ts
+++ b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.ts
@@ -40,6 +40,16 @@ export class WorkListReplacementItgComponent implements OnInit {
   public direction = '';
   arr = [];
   delegtedEmp;
+  isFavoriteLetterActive = false;
+  getPassActionMode: any;
+
+  public slideOptsOne = {
+    slidesPerView: 6,
+    spaceBetween: 5
+  };
+
+  public activeSelectedLetter:string;
+
   constructor(public vacationRuleService: VacationRuleServiceService,
     public ts: TranslatorService,
     public cs: CommonService,
@@ -54,7 +64,9 @@ export class WorkListReplacementItgComponent implements OnInit {
   // }
 
   ngOnInit() {
+    this.onChangeSelect1('1');
     this.delegtedEmp = this.cs.sharedService.getSharedData('selectedEmpInfo', true);
+    this.getPassActionMode = this.cs.sharedService.getSharedData('pressedBtn', true);
     if (this.delegtedEmp === undefined) {
       if (!this.relatedList || this.relatedList.length === 0 || this.relatedList === undefined) {
         this.arr = this.cs.sharedService.getSharedData('workflow-user', false);
@@ -68,7 +80,7 @@ export class WorkListReplacementItgComponent implements OnInit {
           this.relatedList.push(lookupObject[i]);
         }
       }
-      this.getFavruite();
+      // this.getFavruite();
     } else {
       this.select(this.delegtedEmp, 1);
     }
@@ -164,9 +176,11 @@ export class WorkListReplacementItgComponent implements OnInit {
     if (this.isSave == true) {
       if (this.selEmp) {
         data = this.selEmp;
-        this.messageSuccess = true;
+        // this.messageSuccess = true;
+        // this.cs.greenToastPK('worklist', 'save-successfully');
       } else {
         data = null;
+        // this.cs.redToastPK('worklist', 'save-error');
       }
       if (typeof this.callback == 'function') {
         this.callback(data);
@@ -212,6 +226,31 @@ export class WorkListReplacementItgComponent implements OnInit {
 
     }
   }
+  onChangeSelect1(select) {
+    let selectValue = select;
+    this.searchKey = '';
+    if (selectValue == "1") {
+      this.listOfRealted = this.relatedList;
+      console.log(this.relatedList);
+      this.isSelect = true;
+      this.isFilter = true;
+      this.ReplacementList = [];
+    } else if (selectValue == "4") {
+      this.listOfFav = this.favoriteUserList;
+      this.isFilter = true;
+      this.ReplacementList = [];
+      // if(this.favoriteUserList.length === 0 || this.favoriteUserList === undefined){
+      this.getFavruite();
+      // }
+    } else if (selectValue === '2' || selectValue === '3' || selectValue === '5') {
+      this.isSelect = true;
+      this.isFilter = false;
+    }
+    else {
+      this.isSelect = false;
+
+    }
+  }
   getPlaceHolder() {
     return this.searchKeySelect == '1' ? this.ts.trPK('replacementRoll', 'searchbyname') : this.searchKeySelect == '2' ? this.ts.trPK('replacementRoll', 'searchbyusername') : this.ts.trPK('replacementRoll', 'searchbyemail');
   }
@@ -261,10 +300,10 @@ export class WorkListReplacementItgComponent implements OnInit {
     const userIndex = this.favoriteUserList.findIndex(x => x['USER_NAME'] === userID);
     console.log(userIndex);
     if (userIndex === -1) {
-      selEmp.IsFavorite = !selEmp.IsFavorite;
       this.cs.presentConfirmDialog(
         confirmBoxhtml
         , () => {
+          selEmp.IsFavorite = !selEmp.IsFavorite;
           const request =
             [
               {
@@ -306,28 +345,63 @@ export class WorkListReplacementItgComponent implements OnInit {
       }
     });
   }
+
+
+  favLetter = [];
+  favIsActive = [];
+
   getFavruite() {
     this.cs.startLoading();
-    this.worklistService.getFavorite({}, () => {
-
+    this.worklistService.getFavoriteWithoutImage({}, () => {
     }).subscribe((result) => {
       if (this.cs.validResponse(result)) {
-        this.cs.stopLoading();
-        this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
-        this.favoriteUserList.forEach((obj) => {
+        // this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
+        let favList = result['Mohemm_GetFavoriteReplacementsList'];
+        favList.forEach((obj) => {
           obj.IsFavorite = true;
+          this.favLetter.push(obj.EMPLOYEE_DISPLAY_NAME.charAt(0).toUpperCase());
         });
-        this.relatedList.forEach((obj) => {
-          if (this.favoriteUserList.some(x => x.USER_NAME === obj.EmployeeID)) {
-            obj.IsFavorite = true;
-          } else {
-            obj.IsFavorite = false;
-          }
+        this.favLetter = this.favLetter.filter((elem, index, self) => {
+          return index === self.indexOf(elem);
         });
-        console.log('enad test');
-        console.log(this.relatedList);
+        if (this.activeSelectedLetter) {
+          this.selectedLetter(this.activeSelectedLetter);
+        } else {
+          this.favLetter.forEach((obj, index) => {
+            if(this.activeSelectedLetter) {}
+            if (index === 0) {
+              // this.selectedLetter(obj);
+              this.favIsActive.push(true);
+            } else {
+              this.favIsActive.push(false);
+            }
+          });
+        }
+        console.log(this.favLetter);
+        console.log(this.favIsActive);
       }
     });
+    // this.cs.startLoading();
+    // this.worklistService.getFavorite({}, () => {
+
+    // }).subscribe((result) => {
+    //   if (this.cs.validResponse(result)) {
+    //     this.cs.stopLoading();
+    //     this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
+    //     this.favoriteUserList.forEach((obj) => {
+    //       obj.IsFavorite = true;
+    //     });
+    //     this.relatedList.forEach((obj) => {
+    //       if (this.favoriteUserList.some(x => x.USER_NAME === obj.EmployeeID)) {
+    //         obj.IsFavorite = true;
+    //       } else {
+    //         obj.IsFavorite = false;
+    //       }
+    //     });
+    //     console.log('enad test');
+    //     console.log(this.relatedList);
+    //   }
+    // });
   }
 
   listOfRealted = [];
@@ -365,4 +439,31 @@ export class WorkListReplacementItgComponent implements OnInit {
       return true;
     else { return false; }
   }
+
+  selectedLetter(el) {
+    this.isFavoriteLetterActive = true;
+    this.favLetter.forEach((letter, index) => {
+      if (letter === el) {
+        this.favIsActive[index] = true;
+        this.activeSelectedLetter = el;
+        this.worklistService.getFavoriteByLetter(letter,() => {
+        }).subscribe((result) => {
+          if (this.cs.validResponse(result)) {
+            this.cs.stopLoading();
+            this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
+            this.listOfFav = this.favoriteUserList;
+            this.favoriteUserList.forEach((obj) => {
+              obj.IsFavorite = true;
+            });
+          }
+        });
+      } else {
+        this.favIsActive[index] = false;
+      }
+    });
+  }
+
+  returnIsActiveFunction(i) {
+    return this.favIsActive[i];
+  }
 }
diff --git a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html
index cd1fb3b3..ef3ff306 100644
--- a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html
+++ b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html
@@ -1,14 +1,12 @@
-<ion-header *ngIf="!messageSuccess">
-  <ion-toolbar>
-    <!--  class="header-toolbar" <nav-buttons></nav-buttons> -->
-    <ion-title *ngIf="!isAnswer && getPassActionMode !='REQUEST_INFO' && getPassActionMode !='DELEGATE'" color="dark">{{
+<ion-header *ngIf="!messageSuccess" no-border>
+  <ion-toolbar no-border>
+    <!-- <ion-title *ngIf="!isAnswer && getPassActionMode !='REQUEST_INFO' && getPassActionMode !='DELEGATE'" color="dark">{{
       'replacementRoll, title' | translate}}</ion-title>
     <ion-title *ngIf="getPassActionMode =='REQUEST_INFO'" color="dark">{{ 'worklistMain, request' | translate}}
     </ion-title>
-    <ion-title *ngIf="getPassActionMode =='DELEGATE'" color="dark">{{ 'worklistMain, delegate' | translate}}</ion-title>
+    <ion-title *ngIf="getPassActionMode =='DELEGATE'" color="dark">{{ 'worklistMain, delegate' | translate}}</ion-title> -->
 
 
-    <!-- <ion-title *ngIf="isAnswer"  color="dark">Answer</ion-title> -->
 
   </ion-toolbar>
 </ion-header>
@@ -18,9 +16,15 @@
 
     <ion-list [hidden]="isAnswer==true">
       <ion-list-header>
-        <ion-label class="boldTxtNav">{{'replacementRoll, searchBy' | translate}}</ion-label>
+        
+        <ion-title class="boldTxtNav" *ngIf="!isAnswer && getPassActionMode !='REQUEST_INFO' && getPassActionMode !='DELEGATE'" color="dark">{{
+          'replacementRoll, title' | translate}}</ion-title>
+        <ion-title class="boldTxtNav" *ngIf="getPassActionMode =='REQUEST_INFO'" color="dark">{{ 'worklistMain, request' | translate}}
+        </ion-title>
+        <ion-title class="boldTxtNav" *ngIf="getPassActionMode =='DELEGATE'" color="dark">{{ 'worklistMain, delegate' | translate}}</ion-title>
+
       </ion-list-header>
-      <ion-radio-group [(ngModel)]="searchBy" (ionChange)="onChangeSelect($event)">
+      <!-- <ion-radio-group [(ngModel)]="searchBy" (ionChange)="onChangeSelect($event)">
         <ion-row class="top-radio-row" style="display: flex;">
           <ion-item lines='none'>
             <ion-radio mode="md" value="1" checked></ion-radio>
@@ -53,13 +57,12 @@
             </ion-label>
           </ion-item>
         </ion-row>
-      </ion-radio-group>
+      </ion-radio-group> -->
 
 
 
-      <div style="padding: 5px;" *ngIf="!isFilter">
+      <!-- <div style="padding: 5px;" *ngIf="!isFilter">
 
-        <!-- <ion-input (ionInput)="onChangeInput()" [ngClass]="direction == 'en'? 'filterInput':'filterInput-ar'" [(ngModel)]="inputSearch" [placeholder]='getPlaceHolder()' clearInput="true"></ion-input> -->
         <ion-grid>
           <ion-row style="height: 45px; border: 1px solid lightgray; border-radius: 50px;">
             <ion-col size='9'>
@@ -80,10 +83,68 @@
       <div *ngIf="isFilter">
         <ion-searchbar class="filterClass" mode='md' (ionInput)="filterList($event)" placeholder="Filter">
         </ion-searchbar>
+      </div> -->
+
+      <div style="border: 1px solid lightgray; border-radius: 100px; width: 100%;">
+        <ion-grid style="height: 54px; padding: 1px 1px 1px 1px;">
+          <ion-row>
+            <ion-col size="7">
+              <div *ngIf="isFilter" style="height: 0px;">
+                <ion-searchbar style="padding-top: 1px;" class="filterClass" mode='md' (ionInput)="filterList($event)" placeholder="Filter">
+                </ion-searchbar>
+              </div>
+              <ion-input *ngIf="!isFilter" class='replacmentSearchBar' clearInput="true"
+                 [(ngModel)]="inputSearch" [placeholder]='"replacementRoll, searchbyname" | translate'>
+                <ion-icon style="width: 50px; height: 21px;" name="search"></ion-icon>
+              </ion-input>
+            </ion-col>
+            <ion-col size="5" style="display: flex;">
+              <div class="vl"></div>
+              <ion-item lines="none" style="display: flex;">
+                <ion-select style="min-width: 100%; height: 40px; padding-top: 5px;" [(ngModel)]="searchBy" (ionChange)="onChangeSelect($event)">
+                  <ion-select-option value="1" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, workflow' | translate}}</p></ion-select-option>
+                  <ion-select-option value="4" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, favorite' | translate}}</p></ion-select-option>
+                  <ion-select-option value="2" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, employee-id' | translate}}</p></ion-select-option>
+                  <ion-select-option value="3" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, employee-email' | translate}}</p></ion-select-option>
+                  <ion-select-option value="5" ><p style="min-width: 100%; font-size: 11px; font-weight: bold;">{{'replacementRoll, employee-name' | translate}}</p></ion-select-option>
+                </ion-select>
+              </ion-item>
+            </ion-col>
+          </ion-row>
+        </ion-grid>
       </div>
-
-
+      <ion-grid>
+        <ion-row>
+          <ion-col>
+            <div style="text-align: end;" *ngIf='inputSearch && !userSelected && !isFilter'>
+              <button ion-button clear class="searchText" (click)="onChangeInput()" type="button"  item-right >
+                {{"general, search" | translate}}
+              </button>
+            </div>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
     </ion-list>
+    
+    <div class="letterDiv" *ngIf="searchBy === '4' && !isFavoriteLetterActive && !userSelected">
+      <!-- <ion-slides [options]="slideOptsOne">
+        <ion-slide *ngFor="let filter of favLetter;  let i=index"> -->
+          <div *ngFor="let filter of favLetter;  let i=index" class="letterDivLoop">
+            <p (click)='selectedLetter(favLetter[i])'>{{filter}}</p>
+          </div>
+        <!-- </ion-slide>
+    </ion-slides> -->
+    </div>
+
+    <div class="letterDiv" *ngIf="searchBy === '4' && isFavoriteLetterActive && !userSelected">
+      <!-- <ion-slides [options]="slideOptsOne">
+        <ion-slide *ngFor="let filter of favLetter;  let i=index"> -->
+          <div [ngClass]="returnIsActiveFunction(i)? 'isFavLetterActive':'letterDivLoop'" *ngFor="let filter of favLetter;  let i=index">
+            <p (click)='selectedLetter(favLetter[i])'>{{filter}}</p>
+          </div>
+        <!-- </ion-slide>
+    </ion-slides> -->
+    </div>
 
     <div class="noteInput" *ngIf="isAnswer==true">
       <ion-label class="boldTxtNav" padding>{{"replacementRoll, question" | translate}} :
@@ -130,8 +191,8 @@
     <br />
     <!-- <div [hidden]="isAnswer==true"
       *ngIf="favoriteUserList.length> 0 && !userSelected && ReplacementList.length ==0 && searchBy == '4'"> -->
-    <div [hidden]="isAnswer==true" *ngIf="favoriteUserList.length >0 && !userSelected && searchBy === '4'">
-      <div class="uk-margin">
+    <div style="width: 90%; float: left;" [hidden]="isAnswer==true" *ngIf="favoriteUserList.length >0 && !userSelected && searchBy === '4'">
+      <div class="uk-margin" style="margin: -21px 15px 0px 15px !important;">
         {{'replacementRoll, favorite' | translate}}
       </div>
 
@@ -160,10 +221,18 @@
         </div>
       </div>
     </div>
-    <div *ngIf="favoriteUserList.length === 0 && searchBy == '4'">
+    
+    <div style="padding-top: 190px;" *ngIf="favLetter.length > 0 && searchBy == '4' && favoriteUserList.length === 0">
+      <ion-label>
+        <p style="text-align: center; text-align: center; font-size: 20px; padding: 0px 35px 20px 0px;">
+          {{'general, fav-showData' | translate}}
+        </p>
+      </ion-label>
+    </div>
+    <div *ngIf="favoriteUserList.length === 0 && searchBy == '4' && favLetter.length ===0">
       <ion-label>
-        <p style="text-align: center;">
-          Sorry there is no data
+        <p style="text-align: center; font-size: 20px; padding: 0px 35px 20px 0px;">
+          {{'general, fav-noData' | translate}}
         </p>
       </ion-label>
     </div>
diff --git a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss
index 7bd616a2..ac20567e 100644
--- a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss
+++ b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss
@@ -16,7 +16,7 @@ button.item-button.button.button-md.button-clear.button-clear-md {
 //   margin-right: 7%;
 //   width: 100%;
 // }
-.ionItem{
+.ionItem {
   border: #e4e4e4 solid;
   /* margin: 6px; */
   /* padding: 11px; */
@@ -24,28 +24,24 @@ button.item-button.button.button-md.button-clear.button-clear-md {
   width: 164px;
   border-radius: 5px;
   text-align: center;
-  
 }
 
-
-.profileImageDiv{
-  
+.profileImageDiv {
   z-index: 3;
   position: relative;
   top: 0;
-
 }
-.profileImage{
-  width:60px !important;
-
+.profileImage {
+  width: 60px !important;
 }
 
-.activated{
-  border: #209a83 0.02cm solid ;
+.activated {
+  border: #209a83 0.02cm solid;
 }
-.deactivated{  border: #e4e4e4 0.02cm  solid;
+.deactivated {
+  border: #e4e4e4 0.02cm solid;
 }
-.repContentDiv{
+.repContentDiv {
   text-align: center;
   width: 85%;
   font-size: 14px;
@@ -53,10 +49,9 @@ button.item-button.button.button-md.button-clear.button-clear-md {
   border-radius: 5px;
   padding: 20px 8px 8px 8px;
   margin-top: -9px;
-  margin-right: -35px
-
+  margin-right: -35px;
 }
-.selIEmpDiv{
+.selIEmpDiv {
   text-align: right;
   margin-bottom: -26px;
   margin-right: 0px;
@@ -65,24 +60,23 @@ button.item-button.button.button-md.button-clear.button-clear-md {
   top: 0;
 }
 
-.selIEmpImage{
-  width:22px !important
-
+.selIEmpImage {
+  width: 22px !important;
 }
 
-.noteInput{
+.noteInput {
   border: solid var(--gray) 1px;
   border-radius: 15px;
   margin: 8px 17px 0px 17px;
   padding: 10px 2px 10px 2px;
 }
-.filterInput{
+.filterInput {
   border: solid var(--gray) 1px;
   border-radius: 21px;
   padding-left: 10px !important;
 }
 
-.filterInput-ar{
+.filterInput-ar {
   // border: solid var(--gray) 1px;
   // border-radius: 21px;
   // padding-left: 10px !important;
@@ -93,16 +87,15 @@ button.item-button.button.button-md.button-clear.button-clear-md {
   //margin-left: 123px;
   // padding-right: 129px;
   //margin-right: -136px;
-  
 }
-.filterBtn{
+.filterBtn {
   background: var(--newgreen);
   --background: var (--newgreen);
   border-radius: 50%;
   height: 60px;
   width: 60px;
 }
-.filterBtn-ar{
+.filterBtn-ar {
   // background: var(--newgreen);
   // --background: var (--newgreen);
   // border-radius: 50%;
@@ -117,25 +110,23 @@ button.item-button.button.button-md.button-clear.button-clear-md {
   margin-right: 260px;
 }
 
-
-
-*{
+* {
   box-sizing: border-box;
 }
 
-.square-container{
+.square-container {
   // padding: 8px;
-  width:100%;
+  width: 100%;
 }
-.square{
- // width:calc(100% / 2);
- width:100%;
-  float:left;
+.square {
+  // width:calc(100% / 2);
+  width: 100%;
+  float: left;
   position: relative;
   // padding-bottom: calc(100% / 2);
 }
 
-.square .content{
+.square .content {
   width: calc(100% - 16px) !important;
   height: calc(100% - 16px) !important;
   margin: 8px;
@@ -149,64 +140,114 @@ button.item-button.button.button-md.button-clear.button-clear-md {
   // box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26);
 }
 
-.disabledButton{
-  opacity:.5;
-
+.disabledButton {
+  opacity: 0.5;
 }
 
-.radio-label{
+.radio-label {
   font-size: 9px;
-    margin: 4px;
-    position: relative;
-    bottom: 4px;
+  margin: 4px;
+  position: relative;
+  bottom: 4px;
 }
-ion-radio{
+ion-radio {
   --color-checked: #269db8;
- }
-.center{text-align: center;padding: 5px;}
-.boldTxtNav{
-  font-weight: bold;
+}
+.center {
+  text-align: center;
   padding: 5px;
 }
-.employee-details{
-  display:inline-block;
+.boldTxtNav {
+  text-align: start;
+  font-weight: bold;
+  padding: 12px;
+}
+.employee-details {
+  display: inline-block;
   margin: 10px;
   text-overflow: ellipsis;
   white-space: nowrap;
   width: 70%;
 }
-.empImgeRep{
+.empImgeRep {
   display: inline-block;
   height: 40px;
   width: 40px;
 }
-.star-fav{
+.star-fav {
   float: right;
   margin: 15px 0px 0px 0px;
 }
-.uk-margin{margin: 15px 15px 0px 15px;
+.uk-margin {
+  margin: 15px 15px 0px 15px;
   font-weight: bold;
   clear: both;
   position: relative;
-  top: 10px;}
-.uk-padding{ padding: 20px;}
-.uk-padding .employee-details{
+  top: 10px;
+}
+.uk-padding {
+  padding: 20px;
+}
+.uk-padding .employee-details {
   bottom: 10px;
-  position: relative;}
- 
-  .star-fav-left{
-    float: left;
-    margin: 10px 5px;
-  }
-  .top-radio-row{
-    font-size: 12px;
-    display: block;
-    padding-bottom: 25px;
-    padding-top: 15px;
-  }
-  .textSearchType{
-    padding-top: 8px;
-    font-size: 12px;
-  }
+  position: relative;
+}
 
- 
+.star-fav-left {
+  float: left;
+  margin: 10px 5px;
+}
+.top-radio-row {
+  font-size: 12px;
+  display: block;
+  padding-bottom: 25px;
+  padding-top: 15px;
+}
+.textSearchType {
+  padding-top: 8px;
+  font-size: 12px;
+}
+.isFavLetterActive {
+  // background: #269db8;
+  // width: 55px;
+  // border-radius: 60px;
+  color: #269db8;
+  display: block; 
+  width: 60%; 
+  float: right; 
+  transition-duration: 0ms; 
+  height: 35px;
+}
+.vl {
+  border-left: 2px solid lightgray;
+  height: 42px;
+}
+.clearText{
+  background: transparent;
+  color: #D55D5C;
+  font-weight: bold;
+  text-decoration: underline;
+}
+.searchText{
+  background: transparent;
+  color: #269db8;
+  font-weight: bold;
+  text-decoration: underline;
+}
+.filterClass input{
+  box-shadow: none !important;
+  -webkit-box-shadow: none !important;
+}
+
+.letterDiv{
+  font-weight: bold; 
+  width: 10%; 
+  float: right;
+}
+.letterDivLoop{
+  display: block; 
+  width: 60%; 
+  float: right; 
+  transition-duration: 0ms; 
+  height: 35px;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.ts b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.ts
index f39e81c2..0e2a6346 100644
--- a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.ts
+++ b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.ts
@@ -49,11 +49,20 @@ export class WorkListReplacementRollComponent implements OnInit {
   arr = [];
   favoriteUserList: any = [];
   isFilter = true;
+  isFavoriteLetterActive = false;
+
+  public slideOptsOne = {
+    slidesPerView: 6,
+    spaceBetween: 5
+  };
+
+  public activeSelectedLetter: string;
+
   constructor(public worklistService: WorklistService, private cs: CommonService, public ts: TranslatorService, public workListMainService: WorklistMainService, public modalCtrl: ModalController) {
     this.P_PAGE_NUM = 1;
     this.P_PAGE_LIMIT = 50;
     this.getPassActionMode = this.cs.sharedService.getSharedData('passActionMode', false);
-    this.getFavruite();
+    // this.getFavruite();
     this.getPassNotificationDetails = this.cs.sharedService.getSharedData('passNotificationInfo', false);
     this.getpassResAttr = this.cs.sharedService.getSharedData('passResAttr', false);
     this.pQuestion = this.cs.sharedService.getSharedData('pQuestion', false);
@@ -352,7 +361,7 @@ export class WorkListReplacementRollComponent implements OnInit {
         // }
         // }, 5000);
 
-        this.cs.openNotificationPage();
+        // this.cs.openNotificationPage();
         // this.messageSuccess = true;
 
         // setTimeout(() => {
@@ -433,25 +442,23 @@ export class WorkListReplacementRollComponent implements OnInit {
   }
 
   selectedType;
-  counter=0;
+  counter = 0;
   onChangeSelect(select) {
     let selectValue = select.detail.value;
-
     if (selectValue == '1') {
       this.isSelect = true;
       this.isFilter = true;
       this.selectedType = 1;
       this.listOfRealted = this.actionHistory;
-      if(this.counter > 0)
-      {
-        this.actionHistory.forEach((obj, i) => {
-            if(this.favoriteUserList.find(x => x['USER_NAME'] === obj.USER_NAME)) {
-              this.actionHistory[i].IsFavorite = true;
-            }else{
-              this.actionHistory[i].IsFavorite = false;
-            }
-          });
-      }
+      // if (this.counter > 0) {
+      this.actionHistory.forEach((obj, i) => {
+        if (this.favoriteUserList.find(x => x['USER_NAME'] === obj.USER_NAME)) {
+          this.actionHistory[i].IsFavorite = true;
+        } else {
+          this.actionHistory[i].IsFavorite = false;
+        }
+      });
+      // }
       this.counter = 1;
     } else if (selectValue === '4') {
       // if (this.favoriteUserList.length === 0 || this.favoriteUserList === undefined) {
@@ -474,9 +481,9 @@ export class WorkListReplacementRollComponent implements OnInit {
     this.ReplacementList = [];
     clearTimeout(this.typingTimer);
     // this.typingTimer = setTimeout(() => {
-      // if (this.inputSearch.length > 2) {
-        this.getreplacmentemployee();
-      // }
+    // if (this.inputSearch.length > 2) {
+    this.getreplacmentemployee();
+    // }
     // }, 3000);
 
 
@@ -489,34 +496,60 @@ export class WorkListReplacementRollComponent implements OnInit {
     // }
   }
   getPlaceHolder() {
-    return this.searchBy == '1' ? this.ts.trPK('replacementRoll', 'searchbyname') : this.searchBy == '2' ? this.ts.trPK('replacementRoll', 'searchbyusername') : this.ts.trPK('replacementRoll', 'searchbyemail');
+    return this.searchBy === '1' ?
+      this.ts.trPK('replacementRoll', 'searchbyname') :
+      this.searchBy === '2' ?
+        this.ts.trPK('replacementRoll', 'searchbyusername') :
+        this.ts.trPK('replacementRoll', 'searchbyemail');
   }
+
+  favLetter = [];
+  favIsActive = [];
+
   getFavruite() {
     this.cs.startLoading();
-    this.worklistService.getFavorite({}, () => {
-
+    this.worklistService.getFavoriteWithoutImage({}, () => {
     }).subscribe((result) => {
       if (this.cs.validResponse(result)) {
-        this.cs.stopLoading();
-        this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
-        this.listOfFav = this.favoriteUserList;
-        this.favoriteUserList.forEach((obj) => {
+        // this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
+        let favList = result['Mohemm_GetFavoriteReplacementsList'];
+        favList.forEach((obj) => {
           obj.IsFavorite = true;
+          this.favLetter.push(obj.EMPLOYEE_DISPLAY_NAME.charAt(0).toUpperCase());
+        });
+        this.favLetter = this.favLetter.filter((elem, index, self) => {
+          return index === self.indexOf(elem);
         });
-        /**** THIS CODE TO CHECK STAR OF EMPLOYEE IF IT IS IN FAVORITE LIST AND SHOW IN WORKFLOW LIST****/
-        // this.actionHistory.forEach((obj, i) => {
-        //   if(this.favoriteUserList.some(x => x['USER_NAME'] === obj.USER_NAME)) {
-        //     this.actionHistory[i].isInFavorite = true;
-        //   } else {
-        //     this.actionHistory[i].isInFavorite = false;
-        //   }
-        // });
-        // console.log(this.actionHistory);
-        /**** END ****/
 
+        this.favLetter.forEach((obj, index) => {
+          if (this.activeSelectedLetter) {
+            this.selectedLetter(this.activeSelectedLetter);
+          }
+          if (index === 0) {
+            // this.selectedLetter(obj);
+            this.favIsActive.push(true);
+          } else {
+            this.favIsActive.push(false);
+          }
+        });
+        console.log(this.favLetter);
+        console.log(this.favIsActive);
       }
     });
+    // this.worklistService.getFavorite({}, () => {
+
+    // }).subscribe((result) => {
+    //   if (this.cs.validResponse(result)) {
+    //     this.cs.stopLoading();
+    //     this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
+    //     this.listOfFav = this.favoriteUserList;
+    //     this.favoriteUserList.forEach((obj) => {
+    //       obj.IsFavorite = true;
+    //     });
+    //   }
+    // });
   }
+
   saveUserFavruiteList(request, isFav: boolean) {
     this.worklistService.saveFavoriteList(request, () => {
     }).subscribe((result) => {
@@ -528,14 +561,10 @@ export class WorkListReplacementRollComponent implements OnInit {
         }
         this.getFavruite();
       }
-    })
+    });
   }
 
   setFavorite(selEmp) {
-    selEmp.EMPLOYEE_DISPLAY_NAME = selEmp.EMPLOYEE_DISPLAY_NAME ? selEmp.EMPLOYEE_DISPLAY_NAME : selEmp.NAME;
-    selEmp.EMPLOYEE_IMAGE = selEmp.EMPLOYEE_IMAGE ? selEmp.EMPLOYEE_IMAGE : '';
-    selEmp.EMAIL_ADDRESS = selEmp.EMAIL_ADDRESS ? selEmp.EMAIL_ADDRESS : '';
-    selEmp.IsFavorite = !selEmp.IsFavorite;
     let confirmBoxhtml = `<div>
     <h4>Do you want to add ` + selEmp.EMPLOYEE_DISPLAY_NAME + ` in your favorite list </h4>
     <br/>
@@ -559,6 +588,10 @@ export class WorkListReplacementRollComponent implements OnInit {
       this.cs.presentConfirmDialog(
         confirmBoxhtml
         , () => {
+          selEmp.EMPLOYEE_DISPLAY_NAME = selEmp.EMPLOYEE_DISPLAY_NAME ? selEmp.EMPLOYEE_DISPLAY_NAME : selEmp.NAME;
+          selEmp.EMPLOYEE_IMAGE = selEmp.EMPLOYEE_IMAGE ? selEmp.EMPLOYEE_IMAGE : '';
+          selEmp.EMAIL_ADDRESS = selEmp.EMAIL_ADDRESS ? selEmp.EMAIL_ADDRESS : '';
+          selEmp.IsFavorite = !selEmp.IsFavorite;
           const request =
             [
               {
@@ -573,6 +606,10 @@ export class WorkListReplacementRollComponent implements OnInit {
           this.saveUserFavruiteList(request, selEmp.IsFavorite);
         }, () => { });
     } else {
+      selEmp.EMPLOYEE_DISPLAY_NAME = selEmp.EMPLOYEE_DISPLAY_NAME ? selEmp.EMPLOYEE_DISPLAY_NAME : selEmp.NAME;
+      selEmp.EMPLOYEE_IMAGE = selEmp.EMPLOYEE_IMAGE ? selEmp.EMPLOYEE_IMAGE : '';
+      selEmp.EMAIL_ADDRESS = selEmp.EMAIL_ADDRESS ? selEmp.EMAIL_ADDRESS : '';
+      selEmp.IsFavorite = !selEmp.IsFavorite;
       const request =
         [
           {
@@ -591,6 +628,7 @@ export class WorkListReplacementRollComponent implements OnInit {
   listOfRealted: any = [];
   listOfFav: any = [];
 
+
   filterList(event) {
     const val = event.target.value;
     if (this.selectedType === 1) {
@@ -613,4 +651,35 @@ export class WorkListReplacementRollComponent implements OnInit {
       return;
     }
   }
+
+  selectedLetter(el) {
+    this.isFavoriteLetterActive = true;
+    this.favLetter.forEach((letter, index) => {
+      if (letter === el) {
+        this.favIsActive[index] = true;
+        this.activeSelectedLetter = el;
+        this.worklistService.getFavoriteByLetter(letter, () => {
+        }).subscribe((result) => {
+          if (this.cs.validResponse(result)) {
+            this.cs.stopLoading();
+            this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
+            this.listOfFav = this.favoriteUserList;
+            this.favoriteUserList.forEach((obj) => {
+              obj.IsFavorite = true;
+            });
+          }
+        });
+      } else {
+        this.favIsActive[index] = false;
+      }
+    });
+  }
+
+  returnIsActiveFunction(i) {
+    return this.favIsActive[i];
+  }
+
+  clearSearchInput() {
+    this.inputSearch = '';
+  }
 }
diff --git a/Mohem/src/app/notification/work-list-rfc/work-list-rfc.component.ts b/Mohem/src/app/notification/work-list-rfc/work-list-rfc.component.ts
index e8e41c87..b18b1bba 100644
--- a/Mohem/src/app/notification/work-list-rfc/work-list-rfc.component.ts
+++ b/Mohem/src/app/notification/work-list-rfc/work-list-rfc.component.ts
@@ -7,6 +7,7 @@ import { WorklistService } from '../service/worklist.service';
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
 import { ModalController } from '@ionic/angular';
+import { HomeComponent } from '../home/home.component';
 
 @Component({
   selector: 'app-work-list-rfc',
@@ -39,7 +40,7 @@ export class WorkListRfcComponent implements OnInit {
     public ts: TranslatorService,
     public workListMainService: WorklistMainService,
     public modalCtrl: ModalController
-    ) {
+  ) {
     this.getPassNotificationDetails = this.cs.sharedService.getSharedData('passNotificationInfo');
     this.getpassResAttr = this.cs.sharedService.getSharedData('passResAttr');
 
@@ -125,7 +126,7 @@ export class WorkListRfcComponent implements OnInit {
       if (result.MessageStatus == 1) {
         this.cs.sharedService.setSharedData(true, 'loadWorkList');
 
-      
+
         this.messageSuccess = true;
 
         setTimeout(() => {
@@ -138,6 +139,7 @@ export class WorkListRfcComponent implements OnInit {
           });
 
         }, 5000);
+        this.cs.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
         this.cs.openNotificationPage();
 
       }
@@ -178,18 +180,18 @@ export class WorkListRfcComponent implements OnInit {
     this.modalCtrl.dismiss();
   }
 
-  select(selectEmp,index){
+  select(selectEmp, index) {
     console.log(selectEmp.USER_NAME);
     console.log(selectEmp.SEQ);
 
-    this.radioButtonValue=selectEmp.USER_NAME
+    this.radioButtonValue = selectEmp.USER_NAME
     this.seqNo = selectEmp.SEQ;
-//////////////////////////////////////////////////////////////
+    //////////////////////////////////////////////////////////////
     // let emp: any = this.RFCEmployeeListListRes[v];
     // this.seqNo = emp.SEQ;
     // this.radioButtonValue = emp.USER_NAME;
 
 
-     this.active=index;
+    this.active = index;
   }
 }
diff --git a/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.html b/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.html
index 67b487cc..a185754a 100644
--- a/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.html
+++ b/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.html
@@ -54,6 +54,7 @@
           <ion-select-option value="REQAPPRV">PR</ion-select-option>
           <ion-select-option value="INVMOA">MR</ion-select-option>
           <ion-select-option value="INVITEM">IC</ion-select-option>
+          <ion-select-option value="STAMP">STAMP</ion-select-option>
         </ion-select>
       </ion-item>
 
diff --git a/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.ts b/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.ts
index 8b9db09f..319c5c60 100644
--- a/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.ts
+++ b/Mohem/src/app/notification/worklist-advanced-search/worklist-advanced-search.component.ts
@@ -15,7 +15,7 @@ export class WorklistAdvancedSearchComponent implements OnInit {
   public inputSearch = '';
   public selectedValue = '';
   public notificationType = '';
-  public itemType = '';
+  public itemType;
   public direction: string;
 
   constructor(
diff --git a/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.html b/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.html
index b22aa453..c2161ae3 100644
--- a/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.html
+++ b/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.html
@@ -435,7 +435,7 @@
         <img src="../assets/imgs/mohemm-action/info.png">
         <ion-label class="action-btn"> {{reqInfo_label}}</ion-label>
       </ion-tab-button>
-      <ion-tab-button (click)="nextNotfification()">
+      <ion-tab-button (click)="nextNotfification('skip')">
         <img src="../assets/imgs/mohemm-action/Skip.png">
         <ion-label class="action-btn"> {{'worklistMain, skip' | translate}}</ion-label>
       </ion-tab-button>
diff --git a/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.ts b/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.ts
index f5c2abec..1d08ec1f 100644
--- a/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.ts
+++ b/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.ts
@@ -381,12 +381,12 @@ export class WorklistMainIcComponent implements OnInit {
         this.common.sharedService.setSharedData(this.notificationButtonRes, "passActionMore");
         // console.log("test" + this.notificationButtonRes.length);
         for (let i = 0; i < this.notificationButtonRes.length; i++) {
-          if (this.notificationButtonRes[i].BUTTON_ACTION == "APPROVE") {
+          if (this.notificationButtonRes[i].BUTTON_ACTION == "APPROVE" || this.notificationButtonRes[i].BUTTON_ACTION == "APPROVED") {
             this.approve_label = this.notificationButtonRes[i].BUTTON_LABEL;
 
             this.approveDis = true;
           } else
-            if (this.notificationButtonRes[i].BUTTON_ACTION == "REJECT") {
+            if (this.notificationButtonRes[i].BUTTON_ACTION == "REJECT" || this.notificationButtonRes[i].BUTTON_ACTION == "REJECTED") {
               this.reject_label = this.notificationButtonRes[i].BUTTON_LABEL;
               this.rejectDis = true;
             } else
@@ -401,7 +401,7 @@ export class WorklistMainIcComponent implements OnInit {
                 this.closeDis = true;
               }
               else if (
-                this.notificationButtonRes[i].BUTTON_ACTION != "APPROVE" && this.notificationButtonRes[i].BUTTON_ACTION != "REJECT" && this.notificationButtonRes[i].BUTTON_ACTION != "REQUEST_INFO" && this.notificationButtonRes[i].BUTTON_ACTION != "CLOSE") {
+                this.notificationButtonRes[i].BUTTON_ACTION != "APPROVE" && this.notificationButtonRes[i].BUTTON_ACTION != "REJECT" && this.notificationButtonRes[i].BUTTON_ACTION != "REQUEST_INFO" && this.notificationButtonRes[i].BUTTON_ACTION != "CLOSE" && this.notificationButtonRes[i].BUTTON_ACTION != "REJECTED" && this.notificationButtonRes[i].BUTTON_ACTION != "APPROVED") {
                 this.moreDisabled = false;
 
               }
@@ -427,12 +427,15 @@ export class WorklistMainIcComponent implements OnInit {
       // tslint:disable-next-line: triple-equals
       if (result.MessageStatus == 1) {
         this.common.sharedService.setSharedData(true, 'loadWorkList');
-        this.messageSuccess = true;
+        // this.messageSuccess = true;
+        this.common.greenToastPK('worklist', 'done-successfully');
+        this.common.setTotalNumberOfWorklistRequest();
         setTimeout(() => {
-          this.messageSuccess = false;
-          // this.openNotificationsDashboard();
+
           this.nextNotfification();
-        }, 5000);
+        }, 300);
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
       }
     } // valid it
   }
@@ -458,7 +461,7 @@ export class WorklistMainIcComponent implements OnInit {
   //   }
   // }
 
-  public nextNotfification() {
+  public nextNotfification(flag?) {
     if (document.getElementById('notificationDynamicFieldsPO') != null) {
       document.getElementById('notificationDynamicFieldsPO').innerHTML = '';
     }
@@ -467,6 +470,9 @@ export class WorklistMainIcComponent implements OnInit {
     let index = this.notificationArray.findIndex(x => x.ROW_NUM === itemNo);
     let previousRequest = this.notificationArray[index].REQUEST_TYPE;
     let previousRequestType = this.notificationArray[index].ITEM_TYPE;
+    if (this.common.filterKeys[previousRequestType] != 0 && flag != 'skip')
+      this.common.filterKeys[previousRequestType] = (this.common.filterKeys[previousRequestType] - 1)
+
     index += 1;
 
     if (index < this.notificationArray.length) {
@@ -477,9 +483,13 @@ export class WorklistMainIcComponent implements OnInit {
       } else if (previousRequest === this.notificationArray[index].REQUEST_TYPE) {
         this.checkRequestType(index);
       } else {
+        //this.common.setTotalNumberOfWorklistRequest(true);
+        this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
         this.common.openNotificationPage();
       }
     } else {
+      //this.common.setTotalNumberOfWorklistRequest(true);
+      this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       this.common.openNotificationPage();
     }
   }
@@ -1210,13 +1220,17 @@ export class WorklistMainIcComponent implements OnInit {
           return;
         } else if (data.data.data == "Success") {
           // this.openNotificationsDashboard();
-          this.messageSuccess = true;
+          // this.messageSuccess = true;
+          this.common.greenToastPK('worklist', 'done-successfully');
+          this.common.setTotalNumberOfWorklistRequest();
           setTimeout(() => {
-            this.messageSuccess = false;
+
             this.nextNotfification();
-          }, 2000);
+          }, 300);
           // this.nextNotfification();
 
+        } else {
+          this.common.redToastPK('worklist', 'save-error');
         }
       });
 
@@ -1272,34 +1286,34 @@ export class WorklistMainIcComponent implements OnInit {
     this.actionButton(flag);
   }
 
-  returnDateTime(stringDate: string){
+  returnDateTime(stringDate: string) {
     let allDateTime = stringDate.split(' ');
     let time = allDateTime[1].split(':', 2);
-    let fullDate = this.transform(stringDate); 
+    let fullDate = this.transform(stringDate);
     return fullDate + ' ' + time[0] + ':' + time[1] + ' ' + allDateTime[2];
-    
+
   }
   locale = {
     en: {
-     //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-       month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+      //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
     }
-};
+  };
   transform(value: string) {
     let x = new Date(Date.parse(value));
     //return value.toLowerCase();
-    let month = this.getMonthNameShort('en',x.getMonth())
-    return ""+ x.getDate()+" "+ month +" "+x.getFullYear();
+    let month = this.getMonthNameShort('en', x.getMonth())
+    return "" + x.getDate() + " " + month + " " + x.getFullYear();
 
 
   }
-  
 
 
 
-  getMonthNameShort(lang,month) {
+
+  getMonthNameShort(lang, month) {
     lang = lang && (lang in this.locale) ? lang : 'en';
     return this.locale[lang].month_names_short[month];
-};
+  };
 
 }
diff --git a/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.html b/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.html
index 59a8ead5..de2dff5f 100644
--- a/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.html
+++ b/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.html
@@ -665,7 +665,7 @@
 
         <!-- <ion-label>  {{'worklistMain, request' | translate}}</ion-label> -->
       </ion-tab-button>
-      <ion-tab-button (click)="nextNotfification()">
+      <ion-tab-button (click)="nextNotfification('skip')">
         <img src="../assets/imgs/mohemm-action/Skip.png">
         <ion-label> {{'worklistMain, skip' | translate}}</ion-label>
 
diff --git a/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.ts b/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.ts
index c64765f5..bfdf25c6 100644
--- a/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.ts
+++ b/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.ts
@@ -368,12 +368,16 @@ export class WorklistMainMRComponent implements OnInit {
       // tslint:disable-next-line: triple-equals
       if (result.MessageStatus == 1) {
         this.common.sharedService.setSharedData(true, 'loadWorkList');
-        this.messageSuccess = true;
+        // this.messageSuccess = true;
+        this.common.greenToastPK('worklist', 'done-successfully');
         setTimeout(() => {
-          this.messageSuccess = false;
+          // this.messageSuccess = false;
           // this.openNotificationsDashboard();
+          this.common.setTotalNumberOfWorklistRequest();
           this.nextNotfification();
-        }, 5000);
+        }, 100);
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
       }
     } // valid it
   }
@@ -402,7 +406,7 @@ export class WorklistMainMRComponent implements OnInit {
   // }
 
 
-  public nextNotfification() {
+  public nextNotfification(flag?) {
     //let itemExist = false;
     if (document.getElementById("notificationDynamicFieldsMR") != null) {
       document.getElementById("notificationDynamicFieldsMR").innerHTML = "";
@@ -411,7 +415,11 @@ export class WorklistMainMRComponent implements OnInit {
     let itemNo = this.getPassNotificationDetails.ROW_NUM;
     let index = this.notificationArray.findIndex(x => x.ROW_NUM === itemNo);
     let previousRequest = this.notificationArray[index].REQUEST_TYPE;
+
     let previousRequestType = this.notificationArray[index].ITEM_TYPE;
+    if (this.common.filterKeys[previousRequestType] != 0 && flag != 'skip')
+      this.common.filterKeys[previousRequestType] = (this.common.filterKeys[previousRequestType] - 1)
+
     index += 1;
 
     if (index < this.notificationArray.length) {
@@ -422,9 +430,13 @@ export class WorklistMainMRComponent implements OnInit {
       } else if (previousRequest === this.notificationArray[index].REQUEST_TYPE) {
         this.checkRequestType(index);
       } else {
+        //this.common.setTotalNumberOfWorklistRequest(true);
+        this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
         this.common.openNotificationPage();
       }
     } else {
+      //this.common.setTotalNumberOfWorklistRequest(true);
+      this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       this.common.openNotificationPage();
     }
   }
@@ -1111,13 +1123,16 @@ export class WorklistMainMRComponent implements OnInit {
         return;
       } else if (data.data.data == 'Success') {
         // this.openNotificationsDashboard();
-        this.messageSuccess = true;
+        // this.messageSuccess = true;
+        this.common.greenToastPK('worklist', 'done-successfully');
         setTimeout(() => {
-          this.messageSuccess = false;
+          this.common.setTotalNumberOfWorklistRequest();
           this.nextNotfification();
-        }, 2000);
+        }, 100);
         // this.nextNotfification();
 
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
       }
     });
 
@@ -1147,7 +1162,7 @@ export class WorklistMainMRComponent implements OnInit {
         if (data.data == 'cancel' || data.data == undefined) {
           return;
         } else if (data.data == 'Success') {
-          // this.openNotificationsDashboard();
+          this.common.setTotalNumberOfWorklistRequest();
           this.nextNotfification();
 
         }
@@ -1218,35 +1233,35 @@ export class WorklistMainMRComponent implements OnInit {
     this.actionButton(flag);
   }
 
-  returnDateTime(stringDate: string){
+  returnDateTime(stringDate: string) {
     let allDateTime = stringDate.split(' ');
     let time = allDateTime[1].split(':', 2);
-    let fullDate = this.transform(stringDate); 
+    let fullDate = this.transform(stringDate);
     return fullDate + ' ' + time[0] + ':' + time[1] + ' ' + allDateTime[2];
-    
+
   }
   locale = {
     en: {
-     //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-       month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+      //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
     }
-};
+  };
   transform(value: string) {
     let x = new Date(Date.parse(value));
     //return value.toLowerCase();
-    let month = this.getMonthNameShort('en',x.getMonth())
-    return ""+ x.getDate()+" "+ month +" "+x.getFullYear();
+    let month = this.getMonthNameShort('en', x.getMonth())
+    return "" + x.getDate() + " " + month + " " + x.getFullYear();
 
 
   }
-  
 
 
 
-  getMonthNameShort(lang,month) {
+
+  getMonthNameShort(lang, month) {
     lang = lang && (lang in this.locale) ? lang : 'en';
     return this.locale[lang].month_names_short[month];
-};
+  };
 
 }
 
diff --git a/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.html b/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.html
index 0c4f4e38..bd933831 100644
--- a/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.html
+++ b/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.html
@@ -633,7 +633,7 @@
                 <img src="../assets/imgs/mohemm-action/info.png">
                 <ion-label class = "action-btn"> {{reqInfo_label}}</ion-label>
             </ion-tab-button>
-            <ion-tab-button (click)="nextNotfification()">
+            <ion-tab-button (click)="nextNotfification('skip')">
                 <img src="../assets/imgs/mohemm-action/Skip.png">
                 <ion-label class = "action-btn"> {{'worklistMain, skip' | translate}}</ion-label>
             </ion-tab-button>
diff --git a/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.ts b/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.ts
index 844f3af6..f2e79a55 100644
--- a/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.ts
+++ b/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.ts
@@ -404,12 +404,14 @@ export class WorklistMainPoComponent implements OnInit {
       // tslint:disable-next-line: triple-equals
       if (result.MessageStatus == 1) {
         this.common.sharedService.setSharedData(true, 'loadWorkList');
-        this.messageSuccess = true;
+        // this.messageSuccess = true;
+        this.common.greenToastPK('worklist', 'done-successfully');
         setTimeout(() => {
-          this.messageSuccess = false;
-          // this.openNotificationsDashboard();
+          this.common.setTotalNumberOfWorklistRequest();
           this.nextNotfification();
-        }, 5000);
+        }, 100);
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
       }
     } // valid it
   }
@@ -435,7 +437,7 @@ export class WorklistMainPoComponent implements OnInit {
   //   }
   // }
 
-  public nextNotfification() {
+  public nextNotfification(flag?) {
     if (document.getElementById('notificationDynamicFieldsPO') != null) {
       document.getElementById('notificationDynamicFieldsPO').innerHTML = '';
     }
@@ -443,7 +445,11 @@ export class WorklistMainPoComponent implements OnInit {
     let itemNo = this.getPassNotificationDetails.ROW_NUM;
     let index = this.notificationArray.findIndex(x => x.ROW_NUM === itemNo);
     let previousRequest = this.notificationArray[index].REQUEST_TYPE;
+
     let previousRequestType = this.notificationArray[index].ITEM_TYPE;
+    if (this.common.filterKeys[previousRequestType] != 0 && flag != 'skip')
+      this.common.filterKeys[previousRequestType] = (this.common.filterKeys[previousRequestType] - 1)
+
     index += 1;
 
     if (index < this.notificationArray.length) {
@@ -454,9 +460,13 @@ export class WorklistMainPoComponent implements OnInit {
       } else if (previousRequest === this.notificationArray[index].REQUEST_TYPE) {
         this.checkRequestType(index);
       } else {
+        //this.common.setTotalNumberOfWorklistRequest(true);
+        this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
         this.common.openNotificationPage();
       }
     } else {
+      //this.common.setTotalNumberOfWorklistRequest(true);
+      this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       this.common.openNotificationPage();
     }
   }
@@ -1168,64 +1178,44 @@ export class WorklistMainPoComponent implements OnInit {
   }
 
   async openRepRolModal() {
-
-
     this.common.sharedService.setSharedData(this.actionHistoryRes, 'actionHistoryData');
-
     const modal = await this.modalCtrl.create({
       component: WorkListReplacementRollComponent,
       backdropDismiss: false,
-
     });
     modal.cssClass = 'replaceRoll-modal';
-
     modal.onDidDismiss()
       .then((data) => {
-        console.log(data.data);
-
-        if (data.data.data == "cancel" || data.data.data == undefined) {
+        if (data.data.data === 'cancel' || data.data.data === undefined) {
           return;
-        } else if (data.data.data == "Success") {
-          // this.openNotificationsDashboard();
-          this.messageSuccess = true;
+        } else if (data.data.data === 'Success') {
+          this.common.greenToastPK('worklist', 'done-successfully');
           setTimeout(() => {
-            this.messageSuccess = false;
+            this.common.setTotalNumberOfWorklistRequest();
             this.nextNotfification();
-          }, 2000);
-          // this.nextNotfification();
-
+          }, 100);
+        } else {
+          this.common.redToastPK('worklist', 'save-error');
         }
       });
 
     return await modal.present();
 
-
-
-
   }
 
   async openRFCModal() {
-
-
-
-
     const modal = await this.modalCtrl.create({
       component: WorkListRfcComponent,
       backdropDismiss: false,
 
     });
     modal.cssClass = 'replaceRoll-modal';
-
     modal.onDidDismiss()
       .then((data) => {
         console.log(data.data);
-
         if (data.data == "cancel" || data.data == undefined) {
           return;
-        } else {
-
-
-        }
+        } else { }
       });
 
     return await modal.present();
@@ -1250,33 +1240,33 @@ export class WorklistMainPoComponent implements OnInit {
     this.actionButton(flag);
   }
 
-  returnDateTime(stringDate: string){
+  returnDateTime(stringDate: string) {
     let allDateTime = stringDate.split(' ');
     let time = allDateTime[1].split(':', 2);
-    let fullDate = this.transform(stringDate); 
+    let fullDate = this.transform(stringDate);
     return fullDate + ' ' + time[0] + ':' + time[1] + ' ' + allDateTime[2];
-    
+
   }
   locale = {
     en: {
-     //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-       month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+      //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
     }
-};
+  };
   transform(value: string) {
     let x = new Date(Date.parse(value));
     //return value.toLowerCase();
-    let month = this.getMonthNameShort('en',x.getMonth())
-    return ""+ x.getDate()+" "+ month +" "+x.getFullYear();
+    let month = this.getMonthNameShort('en', x.getMonth())
+    return "" + x.getDate() + " " + month + " " + x.getFullYear();
 
 
   }
-  
 
 
 
-  getMonthNameShort(lang,month) {
+
+  getMonthNameShort(lang, month) {
     lang = lang && (lang in this.locale) ? lang : 'en';
     return this.locale[lang].month_names_short[month];
-};
+  };
 }
diff --git a/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.html b/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.html
index ccc730ee..69de2e55 100644
--- a/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.html
+++ b/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.html
@@ -411,7 +411,7 @@
                 <ion-label class = "action-btn"> {{reqInfo_label}}</ion-label>
 
             </ion-tab-button>
-            <ion-tab-button (click)="nextNotfification()">
+            <ion-tab-button (click)="nextNotfification('skip')">
                 <img src="../assets/imgs/mohemm-action/Skip.png">
                 <ion-label class = "action-btn"> {{'worklistMain, skip' | translate}}</ion-label>
             </ion-tab-button>
diff --git a/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.ts b/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.ts
index 83f68c84..74cc53ce 100644
--- a/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.ts
+++ b/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.ts
@@ -394,13 +394,11 @@ export class WorklistMainPRComponent implements OnInit {
       // tslint:disable-next-line: triple-equals
       if (result.MessageStatus == 1) {
         this.common.sharedService.setSharedData(true, 'loadWorkList');
-        // show succsfull popup
-        this.messageSuccess = true;
-        setTimeout(() => {
-          this.messageSuccess = false;
-        }, 5000);
-        // this.openNotificationsDashboard();
+        this.common.greenToastPK('worklist', 'done-successfully');
+        this.common.setTotalNumberOfWorklistRequest();
         this.nextNotfification();
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
       }
     } // valid it
   }
@@ -427,7 +425,7 @@ export class WorklistMainPRComponent implements OnInit {
   // }
 
 
-  public nextNotfification() {
+  public nextNotfification(flag?) {
     //let itemExist = false;
     if (document.getElementById("notificationDynamicFieldsPR") != null) {
 
@@ -437,9 +435,12 @@ export class WorklistMainPRComponent implements OnInit {
     let itemNo = this.getPassNotificationDetails.ROW_NUM;
     console.log(itemNo);
     let index = this.notificationArray.findIndex(x => x.ROW_NUM === itemNo);
-    console.log(index);
-    console.log(this.notificationArray);
+
     let previousRequest = this.notificationArray[index].REQUEST_TYPE;
+    let previousRequestType = this.notificationArray[index].ITEM_TYPE;
+    if (this.common.filterKeys[previousRequestType] != 0 && flag != 'skip')
+      this.common.filterKeys[previousRequestType] = (this.common.filterKeys[previousRequestType] - 1)
+
     index += 1;
 
     if (index < this.notificationArray.length) {
@@ -450,9 +451,13 @@ export class WorklistMainPRComponent implements OnInit {
       } else if (previousRequest === this.notificationArray[index].REQUEST_TYPE) {
         this.checkRequestType(index);
       } else {
+        //this.common.setTotalNumberOfWorklistRequest(true);
+        this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
         this.common.openNotificationPage();
       }
     } else {
+      //this.common.setTotalNumberOfWorklistRequest(true);
+      this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       this.common.openNotificationPage();
     }
   }
@@ -1111,13 +1116,16 @@ export class WorklistMainPRComponent implements OnInit {
           return;
         } else if (data.data.data == 'Success') {
           // this.openNotificationsDashboard();
-          this.messageSuccess = true;
+          // this.messageSuccess = true;
+          this.common.greenToastPK('worklist', 'done-successfully');
           setTimeout(() => {
-            this.messageSuccess = false;
+            this.common.setTotalNumberOfWorklistRequest();
             this.nextNotfification();
-          }, 2000);
+          }, 100);
           // this.nextNotfification();
 
+        } else {
+          this.common.redToastPK('worklist', 'save-error');
         }
       });
 
@@ -1172,33 +1180,33 @@ export class WorklistMainPRComponent implements OnInit {
     this.actionButton(flag);
   }
 
-  returnDateTime(stringDate: string){
+  returnDateTime(stringDate: string) {
     let allDateTime = stringDate.split(' ');
     let time = allDateTime[1].split(':', 2);
-    let fullDate = this.transform(stringDate); 
+    let fullDate = this.transform(stringDate);
     return fullDate + ' ' + time[0] + ':' + time[1] + ' ' + allDateTime[2];
-    
+
   }
   locale = {
     en: {
-     //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-       month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+      //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
     }
-};
+  };
   transform(value: string) {
     let x = new Date(Date.parse(value));
     //return value.toLowerCase();
-    let month = this.getMonthNameShort('en',x.getMonth())
-    return ""+ x.getDate()+" "+ month +" "+x.getFullYear();
+    let month = this.getMonthNameShort('en', x.getMonth())
+    return "" + x.getDate() + " " + month + " " + x.getFullYear();
 
 
   }
-  
 
 
 
-  getMonthNameShort(lang,month) {
+
+  getMonthNameShort(lang, month) {
     lang = lang && (lang in this.locale) ? lang : 'en';
     return this.locale[lang].month_names_short[month];
-};
+  };
 }
\ No newline at end of file
diff --git a/Mohem/src/app/notification/worklist-main/worklist-main.component.html b/Mohem/src/app/notification/worklist-main/worklist-main.component.html
index 0d6073b6..0bc23f9c 100644
--- a/Mohem/src/app/notification/worklist-main/worklist-main.component.html
+++ b/Mohem/src/app/notification/worklist-main/worklist-main.component.html
@@ -47,9 +47,25 @@
 
                         <ion-row>
                             <!-- NOT ADDRESS & BASIC_DETAILS -->
-                            <ion-col
-                                *ngIf="getPassNotificationDetails?.REQUEST_TYPE != 'ADDRESS' && getPassNotificationDetails?.REQUEST_TYPE != 'BASIC_DETAILS' ">
-                                <div *ngIf="notificationBodyRes?.length > 0 ">
+                            <ion-col *ngIf="getPassNotificationDetails?.REQUEST_TYPE != 'ADDRESS' && 
+                                getPassNotificationDetails?.REQUEST_TYPE != 'BASIC_DETAILS' &&
+                                getPassNotificationDetails?.REQUEST_TYPE != 'CONTACT' && 
+                                getPassNotificationDetails?.REQUEST_TYPE != 'PHONE_NUMBERS' && 
+                                getPassNotificationDetails?.REQUEST_TYPE != 'TERMINATION' &&
+                                getPassNotificationDetails?.REQUEST_TYPE != 'CEI'">
+
+                                <div *ngIf="showInformation">
+                                    <p>{{'worklist, loading'| translate}} <img style="width: 3%;"
+                                            src="../assets/icon/progress-loading.gif" /></p>
+                                </div>
+
+                                <div class="no-data-div" *ngIf="notificationBodyRes?.length === 0 && 
+                                !showInformation && stampNsNotificationBodyRes?.length === 0 &&
+                                stampMsNotificationBodyRes?.length === 0">
+                                    <p>{{ 'general, empty' | translate}}</p>
+                                </div>
+
+                                <div *ngIf="notificationBodyRes?.length > 0">
                                     <ion-card *ngFor="let item of notificationBodyRes;let i=index; "
                                         style="width: 91%;">
                                         <ion-card-content *ngIf="item.Collection_Notification.length > 0">
@@ -68,6 +84,165 @@
                                         </ion-card-content>
                                     </ion-card>
                                 </div>
+
+                                <div *ngIf="stampNsNotificationBodyRes?.length > 0">
+                                    <ion-card *ngFor="let item of stampNsNotificationBodyRes;let i=index; "
+                                        style="width: 91%;">
+                                        <ion-card-content>
+                                            <div>
+                                                <ion-row>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'userProfile, empNo'| translate}} </label>
+                                                        <br />
+                                                        <label>{{item.EMPLOYEE_NUMBER}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'workList, assignment-number'| translate}}</label>
+                                                        <br />
+                                                        <label> {{item.ASSIGNMENT_NUMBER}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'userProfile, name'| translate}}</label>
+                                                        <br />
+                                                        <label> {{item.EMPLOYEE_NAME}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'workList, schedule-date'| translate}}</label>
+                                                        <br />
+                                                        <label> {{item.SCHEDULE_DATE| date}}</label>
+                                                    </ion-col>
+                                                </ion-row>
+                                            </div>
+                                        </ion-card-content>
+                                    </ion-card>
+                                </div>
+
+                                <div *ngIf="stampMsNotificationBodyRes?.length > 0">
+                                    <ion-card *ngFor="let item of stampMsNotificationBodyRes;let i=index; "
+                                        style="width: 91%;">
+                                        <ion-card-content>
+                                            <div>
+                                                <ion-row>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'userProfile, empNo'| translate}} </label>
+                                                        <br />
+                                                        <label>{{item.EMPLOYEE_NUMBER}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'worklist, assignment-number'| translate}}</label>
+                                                        <br />
+                                                        <label> {{item.ASSIGNMENT_NUMBER}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'userProfile, name'| translate}}</label>
+                                                        <br />
+                                                        <label> {{item.EMPLOYEE_NAME}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            {{'worklist, schedule-date'| translate}}</label>
+                                                        <br />
+                                                        <label> {{item.SCHEDULE_DATE| date}}</label>
+                                                    </ion-col>
+
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            Shift Type</label>
+                                                        <br />
+                                                        <label> {{item.SHT_TYPE_DESC}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            Shift</label>
+                                                        <br />
+                                                        <label> {{item.SHT_NAME}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <label class="colItemReq">
+                                                            Break</label>
+                                                        <br />
+                                                        <label> {{item.BREAK_NAME}}</label>
+                                                    </ion-col>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <ion-row>
+                                                            <label class="colItemReq">
+                                                                Actual Swipe(s)</label>
+                                                            <br />
+                                                            <ion-col size="6">
+                                                                <label class="colItemReq">
+                                                                    Start</label>
+                                                                <br />
+                                                                <label *ngIf="item.SHT_ACTUAL_START_TIME != ''">
+                                                                    {{item.SHT_ACTUAL_START_TIME}}</label>
+                                                                <label
+                                                                    *ngIf="item.SHT_ACTUAL_START_TIME == ''">--</label>
+                                                            </ion-col>
+                                                            <ion-col size="6">
+                                                                <label class="colItemReq">
+                                                                    End</label>
+                                                                <br />
+                                                                <label *ngIf='item.SHT_ACTUAL_END_TIME != ""'>
+                                                                    {{item.SHT_ACTUAL_END_TIME}}</label>
+                                                                <label *ngIf='item.SHT_ACTUAL_END_TIME == ""'>--</label>
+                                                            </ion-col>
+                                                        </ion-row>
+                                                    </ion-col>
+                                                </ion-row>
+                                                <ion-row>
+                                                    <ion-col class="rowBorder" size="6">
+                                                        <ion-row>
+                                                            <label class="colItemReq">
+                                                                Approved Swipe(s)</label>
+                                                            <br />
+                                                            <ion-col class="rowBorder" size="6">
+                                                                <label class="colItemReq">
+                                                                    Start</label>
+                                                                <br />
+                                                                <label *ngIf='item.APPROVED_START_TIME != ""'>
+                                                                    {{item.APPROVED_START_TIME}}</label>
+                                                                <label *ngIf='item.APPROVED_START_TIME == ""'>--</label>
+                                                            </ion-col>
+                                                            <ion-col class="rowBorder" size="6">
+                                                                <label class="colItemReq">
+                                                                    Start Reason</label>
+                                                                <br />
+                                                                <label *ngIf='item.APPROVED_START_REASON != ""'>
+                                                                    {{item.APPROVED_START_REASON}}</label>
+                                                                <label
+                                                                    *ngIf='item.APPROVED_START_REASON == ""'>--</label>
+                                                            </ion-col>
+                                                            <ion-col size="6">
+                                                                <label class="colItemReq">
+                                                                    End</label>
+                                                                <br />
+                                                                <label *ngIf='item.SHT_ACTUAL_END_TIME !=""'>
+                                                                    {{item.SHT_ACTUAL_END_TIME}}</label>
+                                                                <label *ngIf='item.SHT_ACTUAL_END_TIME ==""'>--</label>
+                                                            </ion-col>
+                                                            <ion-col size="6">
+                                                                <label class="colItemReq">
+                                                                    End Reason</label>
+                                                                <br />
+                                                                <label *ngIf="item.APPROVED_END_REASON_DESC != ''">
+                                                                    {{item.APPROVED_END_REASON_DESC}}</label>
+                                                                <label
+                                                                    *ngIf="item.APPROVED_END_REASON_DESC == ''">--</label>
+                                                            </ion-col>
+                                                        </ion-row>
+                                                    </ion-col>
+                                                </ion-row>
+                                            </div>
+                                        </ion-card-content>
+                                    </ion-card>
+                                </div>
+
                                 <div style="margin: 10px;font-weight: bold; "
                                     *ngIf="subordinatesleaveList != undefined && subordinatesleaveList?.length > 0">
                                     {{ts.trPK('worklistMain','employee-on-leave')}}
@@ -120,9 +295,21 @@
                                 </ion-item>
                             </ion-col>
 
-                            <!-- IF BASIC_DETAILS -->
+                            <!-- IF BASIC_DETAILS OR ADDRESS OR CONTACT -->
                             <ion-col *ngIf="getPassNotificationDetails?.REQUEST_TYPE == 'BASIC_DETAILS' || 
-                            getPassNotificationDetails?.REQUEST_TYPE == 'ADDRESS'">
+                            getPassNotificationDetails?.REQUEST_TYPE == 'ADDRESS' ||
+                            getPassNotificationDetails?.REQUEST_TYPE == 'CONTACT' &&
+                            getPassNotificationDetails?.REQUEST_TYPE != 'PHONE_NUMBERS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE != 'TERMINATION' &&
+                            getPassNotificationDetails?.REQUEST_TYPE != 'CEI'">
+                                <div *ngIf="showInformation">
+                                    <p>{{'worklist, loading'| translate}} <img style="width: 3%;"
+                                            src="../assets/icon/progress-loading.gif" /></p>
+                                </div>
+
+                                <div class="no-data-div" *ngIf="notificationBodyRes?.length === 0 && !showInformation">
+                                    <p>{{ 'general, empty' | translate}}</p>
+                                </div>
                                 <div *ngIf='notificationBodyRes.length > 0'>
                                     <ion-card style="width: 91%;">
                                         <ion-card-content>
@@ -139,7 +326,7 @@
                                                         </ion-label>
                                                     </ion-col>
                                                 </ion-row>
-                                                <ion-row  *ngFor="let item of notificationBodyRes;let i=index;">
+                                                <ion-row *ngFor="let item of notificationBodyRes;let i=index;">
                                                     <ion-col class="rowBorder" size="6"
                                                         [hidden]="item.UPDATED_FLAG == 'N'">
                                                         <label class="colItemReq">{{item.SEGMENT_PROMPT}}</label>
@@ -158,8 +345,101 @@
                                     </ion-card>
                                 </div>
                             </ion-col>
-                        </ion-row>
 
+                            <!-- IF PHONE -->
+                            <ion-col *ngIf="getPassNotificationDetails?.REQUEST_TYPE != 'BASIC_DETAILS' &&
+                            getPassNotificationDetails?.REQUEST_TYPE != 'ADDRESS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE == 'PHONE_NUMBERS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE != 'TERMINATION' &&
+                            getPassNotificationDetails?.REQUEST_TYPE != 'CEI'">
+                                <div *ngIf="showInformation">
+                                    <p>{{'worklist, loading'| translate}} <img style="width: 3%;"
+                                            src="../assets/icon/progress-loading.gif" /></p>
+                                </div>
+
+                                <div class="no-data-div" *ngIf="notificationBodyRes?.length === 0 && !showInformation">
+                                    <p>{{ 'general, empty' | translate}}</p>
+                                </div>
+                                <div *ngIf='notificationBodyRes.length > 0'>
+                                    <ion-card style="width: 91%;">
+                                        <ion-card-content>
+                                            <div>
+                                                <ion-row *ngFor="let item of notificationBodyRes;let i=index;">
+                                                    <ion-col class="rowBorder" [hidden]="item.UPDATED_FLAG == 'N'">
+                                                        <label class="colItemReq">{{item.PHONE_TYPE_MEANING}}</label>
+                                                        <br />
+                                                        <label>{{item.PROPOSED_PHONE_NUMBER}}</label>
+                                                    </ion-col>
+                                                </ion-row>
+                                            </div>
+                                        </ion-card-content>
+                                    </ion-card>
+                                </div>
+                            </ion-col>
+
+                            <!-- IF TERMINATION -->
+                            <ion-col *ngIf="getPassNotificationDetails?.REQUEST_TYPE != 'BASIC_DETAILS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE != 'ADDRESS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE != 'PHONE_NUMBERS' &&
+                            getPassNotificationDetails?.REQUEST_TYPE == 'TERMINATION' &&
+                            getPassNotificationDetails?.REQUEST_TYPE != 'CEI'">
+                                <div *ngIf="showInformation">
+                                    <p>{{'worklist, loading'| translate}} <img style="width: 3%;"
+                                            src="../assets/icon/progress-loading.gif" /></p>
+                                </div>
+
+                                <div class="no-data-div" *ngIf="notificationBodyRes?.length === 0 && !showInformation">
+                                    <p>{{ 'general, empty' | translate}}</p>
+                                </div>
+                                <div *ngIf='notificationBodyRes.length > 0'>
+                                    <ion-card style="width: 91%;">
+                                        <ion-card-content>
+                                            <div>
+                                                <ion-row *ngFor="let item of notificationBodyRes;let i=index;">
+                                                    <ion-col class="rowBorder" [hidden]="item.UPDATED_FLAG == 'N'">
+                                                        <label class="colItemReq">{{item.SEGMENT_PROMPT}}</label>
+                                                        <br />
+                                                        <label>{{item.SEGMENT_VALUE_DSP}}</label>
+                                                    </ion-col>
+                                                </ion-row>
+                                            </div>
+                                        </ion-card-content>
+                                    </ion-card>
+                                </div>
+                            </ion-col>
+
+                            <!-- IF CEI -->
+                            <ion-col *ngIf =
+                            "getPassNotificationDetails?.REQUEST_TYPE != 'BASIC_DETAILS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE != 'ADDRESS' && 
+                            getPassNotificationDetails?.REQUEST_TYPE != 'PHONE_NUMBERS' &&
+                            getPassNotificationDetails?.REQUEST_TYPE != 'TERMINATION' &&
+                            getPassNotificationDetails?.REQUEST_TYPE == 'CEI'">
+                                <div *ngIf="showInformation">
+                                    <p>{{'worklist, loading'| translate}} <img style="width: 3%;"
+                                            src="../assets/icon/progress-loading.gif" /></p>
+                                </div>
+
+                                <div class="no-data-div" *ngIf="notificationBodyRes?.length === 0 && !showInformation">
+                                    <p>{{ 'general, empty' | translate}}</p>
+                                </div>
+                                <div *ngIf='notificationBodyRes.length > 0'>
+                                    <ion-card style="width: 91%;">
+                                        <ion-card-content>
+                                            <div>
+                                                <ion-row *ngFor="let item of notificationBodyRes;let i=index;">
+                                                    <ion-col class="rowBorder" [hidden]="item.UPDATED_FLAG == 'N'">
+                                                        <label class="colItemReq">{{item.SEGMENT_PROMPT}}</label>
+                                                        <br />
+                                                        <label>{{item.SEGMENT_VALUE_DSP}}</label>
+                                                    </ion-col>
+                                                </ion-row>
+                                            </div>
+                                        </ion-card-content>
+                                    </ion-card>
+                                </div>
+                            </ion-col>
+                        </ion-row>
                     </ion-grid>
                 </ng-container>
             </ion-slide>
@@ -541,7 +821,7 @@
                     <ion-label class="action-btn"> {{reqInfo_label}}</ion-label>
 
                 </ion-tab-button>
-                <ion-tab-button (click)="nextNotfification()">
+                <ion-tab-button (click)="nextNotfification('skip')">
                     <img src="../assets/imgs/mohemm-action/Skip.png">
                     <ion-label class="action-btn"> {{'worklistMain, skip' | translate}}</ion-label>
                 </ion-tab-button>
diff --git a/Mohem/src/app/notification/worklist-main/worklist-main.component.scss b/Mohem/src/app/notification/worklist-main/worklist-main.component.scss
index a60545fb..31893558 100644
--- a/Mohem/src/app/notification/worklist-main/worklist-main.component.scss
+++ b/Mohem/src/app/notification/worklist-main/worklist-main.component.scss
@@ -137,6 +137,15 @@
       border-radius: 10px;
       margin: 10px;
     }
+
+    .no-data-div{
+      background: #ffffff;
+      height: 100%;
+      text-align: center;
+      padding-top: 1px;
+      border-radius: 10px;
+      margin: 10px;
+    }
   
     .container {
     font-size: 14px;
diff --git a/Mohem/src/app/notification/worklist-main/worklist-main.component.ts b/Mohem/src/app/notification/worklist-main/worklist-main.component.ts
index fcfaf93e..4b9560b3 100644
--- a/Mohem/src/app/notification/worklist-main/worklist-main.component.ts
+++ b/Mohem/src/app/notification/worklist-main/worklist-main.component.ts
@@ -53,6 +53,8 @@ export class WorklistMainComponent implements OnInit {
   public static PASS_RES_ATTR = "passResAttr";
   TransactionID: number = -999;
   notificationBodyRes: any = [];
+  stampNsNotificationBodyRes: any = [];
+  stampMsNotificationBodyRes: any = [];
   actionHistoryRes: any = [];
   notificationButtonRes: any;
   actionMode: any;
@@ -88,6 +90,7 @@ export class WorklistMainComponent implements OnInit {
   newArr: any = [];
   selEmp: any;
   subordinatesleaveList: any = [];
+  allSubordinatesleaveList: any = [];
   private WorkListSubmitterInfoObj: WorkListSubmitterInfoRequest;
   submitterInfoRes: any;
   approveDis: boolean = false;
@@ -107,6 +110,8 @@ export class WorklistMainComponent implements OnInit {
   closeDis: boolean = false;
   public selectedFilter: string;
   public arr_hr_req_only = [];
+  public showInformation = true;
+
 
   constructor(
     public worklistService: WorklistService,
@@ -143,6 +148,7 @@ export class WorklistMainComponent implements OnInit {
       false
     );
     this.selectedFilter = this.common.sharedService.getSharedData('selectedFilter', false);
+    console.log(this.selectedFilter);
     if (this.selEmp) { } else {
       this.authService.loadAuthenticatedUser().subscribe((user: AuthenticatedUser) => {
         if (user) {
@@ -209,6 +215,8 @@ export class WorklistMainComponent implements OnInit {
       HomeComponent.NOTIFICATION_DATA,
       false
     );
+    console.log('/////////////////////////////////////');
+    console.log(this.getPassNotificationDetails);
 
     this.notificationArray = []
     this.subordinatesleaveList = [];
@@ -217,7 +225,8 @@ export class WorklistMainComponent implements OnInit {
       false
     );
     console.log(this.selectedFilter);
-    if (this.selectedFilter === 'HRSSA') {
+    if (this.selectedFilter === 'HRSSA' || this.selectedFilter === 'STAMP') {
+      console.log("ENAD")
       this.arr_hr_req_only = [];
       this.sortRequests();
     }
@@ -276,10 +285,62 @@ export class WorklistMainComponent implements OnInit {
     } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'ADDRESS') {
       this.getAddressNotification(this.WorkListBodyObj);
     } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'BASIC_DETAILS') {
-      this.getBasicDetailsNotification(this.WorkListBodyObj)
+      this.getBasicDetailsNotification(this.WorkListBodyObj);
+    } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'STAMP_MS') {
+      this.getStampMSNotification(this.WorkListBodyObj);
+    } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'STAMP_NS') {
+      this.getStampNSNotification(this.WorkListBodyObj);
+    } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'TERMINATION') {
+      this.getTerminationNotificationDetails(this.WorkListBodyObj);
+    } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'PHONE_NUMBERS') {
+      this.getPhoneNotificationDetails(this.WorkListBodyObj);
+    } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'CONTACT') {
+      this.getContactNotificationDetails(this.WorkListBodyObj);
+    } else if (this.getPassNotificationDetails.REQUEST_TYPE === 'CEI') {
+      this.getCEINotification(this.WorkListBodyObj);
     }
   }
 
+  getStampMSNotification(notificationBodyObj) {
+    this.worklistMainService
+      .getStampMSNotificationBody(notificationBodyObj)
+      .subscribe((result: PRNotificatonBodyResponse) => {
+        this.handleWorkListBodyResult(result, "STAMP_MS");
+      });
+  }
+
+  getStampNSNotification(notificationBodyObj) {
+    this.worklistMainService
+      .getStampNSNotificationBody(notificationBodyObj)
+      .subscribe((result: PRNotificatonBodyResponse) => {
+        this.handleWorkListBodyResult(result, "STAMP_NS");
+      });
+  }
+
+  getTerminationNotificationDetails(notificationBodyObj) {
+    this.worklistMainService
+      .getTerminationNotificationBody(notificationBodyObj)
+      .subscribe((result: PRNotificatonBodyResponse) => {
+        this.handleWorkListBodyResult(result, "TERMINATION");
+      });
+  }
+
+  getPhoneNotificationDetails(notificationBodyObj) {
+    this.worklistMainService
+      .getPhoneNotificationBody(notificationBodyObj)
+      .subscribe((result: PRNotificatonBodyResponse) => {
+        this.handleWorkListBodyResult(result, "PHONE_NUMBERS");
+      });
+  }
+
+  getContactNotificationDetails(notificationBodyObj) {
+    this.worklistMainService
+      .getContactNotificationBody(notificationBodyObj)
+      .subscribe((result: PRNotificatonBodyResponse) => {
+        this.handleWorkListBodyResult(result, "CONTACT");
+      });
+  }
+
   getBasicDetailsNotification(notificationBodyObj) {
     this.worklistMainService
       .getBasicDetailNotificationBody(notificationBodyObj)
@@ -295,6 +356,14 @@ export class WorklistMainComponent implements OnInit {
       });
   }
 
+  getCEINotification(notificationBodyObj) {
+    this.worklistMainService
+      .getCEINotificationBody(notificationBodyObj)
+      .subscribe((result: MONotificatonBodyResponse) => {
+        this.handleWorkListBodyResult(result, "CEI");
+      });
+  }
+
   getPRNotificationDetails(notificationBodyObj) {
     this.worklistMainService
       .getPRNotificationBody(notificationBodyObj)
@@ -336,7 +405,7 @@ export class WorklistMainComponent implements OnInit {
   }
 
   handleWorkListBodyResult(result, Type) {
-
+    this.showInformation = false;
     if (this.common.validResponse(result)) {
       this.pInformation = result.P_INFORMATION;
       this.pQuestion = result.P_QUESTION;
@@ -367,18 +436,60 @@ export class WorklistMainComponent implements OnInit {
           this.notificationBodyRes =
             result.GetAbsenceCollectionNotificationBodyList;
         }
-      } else if (Type === "ADDRESS"){
+      } else if (Type === "ADDRESS") {
+        console.log(result.GetAddressNotificationBodyList)
         if (result.GetAddressNotificationBodyList) {
           this.notificationBodyRes =
-          result.GetAddressNotificationBodyList;
+            result.GetAddressNotificationBodyList;
           console.log(result);
         }
-      } else if (Type === "BASIC_DETAILS"){
+      } else if (Type === "BASIC_DETAILS") {
         if (result.GetBasicDetNtfBodyList) {
           this.notificationBodyRes =
             result.GetBasicDetNtfBodyList;
-            console.log(result);
-          }
+          console.log(result);
+        }
+      } else if (Type === "CEI") {
+        if (result.GetCEICollectionNotificationBodyList) {
+          this.notificationBodyRes =
+            result.GetCEICollectionNotificationBodyList[0].Collection_Notification;
+          console.log(result.GetCEICollectionNotificationBodyList[0].Collection_Notification);
+        }
+      }
+      else if (Type === "STAMP_MS") {
+        if (result.GetStampMsNotificationBodyList) {
+          this.stampMsNotificationBodyRes =
+            result.GetStampMsNotificationBodyList;
+          console.log(result);
+        }
+      }
+      else if (Type === "STAMP_NS") {
+        if (result.GetStampNsNotificationBodyList) {
+          this.stampNsNotificationBodyRes =
+            result.GetStampNsNotificationBodyList;
+          console.log(result);
+        }
+      }
+      else if (Type === "PHONE_NUMBERS") {
+        if (result.GetPhonesNotificationBodyList) {
+          this.notificationBodyRes =
+            result.GetPhonesNotificationBodyList;
+          console.log(result);
+        }
+      }
+      else if (Type === "TERMINATION") {
+        if (result.GetTermNotificationBodyList) {
+          this.notificationBodyRes =
+            result.GetTermNotificationBodyList;
+          console.log(result);
+        }
+      }
+      else if (Type === "CONTACT") {
+        if (result.GetContactNotificationBodyList) {
+          this.notificationBodyRes =
+            result.GetContactNotificationBodyList.ContactNotificationBody;
+          console.log(result);
+        }
       }
     }
   } //End handleWorkListBodyResult
@@ -448,12 +559,14 @@ export class WorklistMainComponent implements OnInit {
         //       this.notificationArray.splice(i, 1);
         //     }
         //  }
-        this.messageSuccess = true;
+        // this.messageSuccess = true;
+        this.common.greenToastPK('worklist', 'done-successfully');
+        this.common.setTotalNumberOfWorklistRequest();
         setTimeout(() => {
-          this.messageSuccess = false;
-          // this.openNotificationsDashboard();
           this.nextNotfification();
-        }, 2000);
+        }, 300);
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
       }
     } // valid it
   }
@@ -483,18 +596,27 @@ export class WorklistMainComponent implements OnInit {
   // }
 
 
-  public nextNotfification() {
+  public nextNotfification(flag?) {
     if (document.getElementById("notificationDynamicFields") != null) {
       document.getElementById("notificationDynamicFields").innerHTML = "";
     }
+
     let itemNo = this.getPassNotificationDetails.ROW_NUM;
     console.log(itemNo);
     let index = this.notificationArray.findIndex(x => x.ROW_NUM === itemNo);
     console.log(index);
     console.log(this.notificationArray);
     let previousRequest = this.notificationArray[index].REQUEST_TYPE;
-    index += 1;
+    let itemType = this.notificationArray[index].ITEM_TYPE;
+    if (previousRequest == 'STAMP_MS' || previousRequest == 'STAMP_NS') {
+      previousRequest = 'STAMP';
+    } else {
+      previousRequest = itemType;
+    }
+    if (this.common.filterKeys[previousRequest] != 0 && flag != 'skip')
+      this.common.filterKeys[previousRequest] = (this.common.filterKeys[previousRequest] - 1)
 
+    index += 1;
     if (index < this.notificationArray.length) {
       this.activeSegment = 'info';
       if (this.selectedFilter === 'ALL') {
@@ -508,11 +630,15 @@ export class WorklistMainComponent implements OnInit {
             this.common.sharedService.setSharedData(this.arr_hr_req_only[requestIndex], HomeComponent.NOTIFICATION_DATA);
             this.intializeNotificationDetail();
           } else {
+            this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
+            //this.common.setTotalNumberOfWorklistRequest(true);
             this.common.openNotificationPage();
           }
         }
       }
     } else {
+      this.common.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
+      //this.common.setTotalNumberOfWorklistRequest(true);
       this.common.openNotificationPage();
     }
 
@@ -905,7 +1031,7 @@ export class WorklistMainComponent implements OnInit {
       let jobTitle = title.split('.');
       if (jobTitle && jobTitle.length > 1) {
         jobName = jobTitle[0] + " " + jobTitle[1];
-      }​
+      }
     } else {
       jobName = '';
     }
@@ -986,7 +1112,14 @@ export class WorklistMainComponent implements OnInit {
   public handleSubordinatesLeavesResult(result) {
     if (this.common.validResponse(result)) {
       if (this.common.hasData(result.SubordinatesOnLeavesList)) {
-        this.subordinatesleaveList = result.SubordinatesOnLeavesList;
+        this.allSubordinatesleaveList = result.SubordinatesOnLeavesList;
+        // this.subordinatesleaveList.push(this.allSubordinatesleaveList.find(
+        //   el => el.EMPLOYEE_NUMBER !== this.getPassNotificationDetails.SELECTED_EMPLOYEE_NUMBER));
+        this.allSubordinatesleaveList.forEach(element => {
+          if (element.EMPLOYEE_NUMBER !== this.getPassNotificationDetails.SELECTED_EMPLOYEE_NUMBER) {
+            this.subordinatesleaveList.push(element);
+          }
+        });
       }
     }
   }
@@ -1021,12 +1154,16 @@ export class WorklistMainComponent implements OnInit {
         if (data.data.data == "cancel" || data.data.data == undefined) {
           return;
         } else if (data.data.data == "Success") {
-          this.messageSuccess = true;
+          // this.messageSuccess = true;
+          this.common.greenToastPK('worklist', 'done-successfully');
+          this.common.setTotalNumberOfWorklistRequest();
           setTimeout(() => {
-            this.messageSuccess = false;
+            // this.messageSuccess = false;
             this.nextNotfification();
-          }, 2000);
+          }, 300);
           // this.nextNotfification();
+        } else {
+          this.common.redToastPK('worklist', 'save-error');
         }
       });
     return await modal.present();
@@ -1045,6 +1182,7 @@ export class WorklistMainComponent implements OnInit {
           return;
         } else if (data.data == "Success") {
           // this.openNotificationsDashboard();
+          this.common.setTotalNumberOfWorklistRequest();
           this.nextNotfification();
         }
       });
@@ -1113,41 +1251,48 @@ export class WorklistMainComponent implements OnInit {
   }
   sortRequests() {
     for (let i = 0; i < this.notificationArray.length; i++) {
-      if (this.notificationArray[i].ITEM_TYPE === 'HRSSA') {
+      if (this.notificationArray[i].ITEM_TYPE === 'HRSSA' || this.notificationArray[i].ITEM_TYPE === 'STAMP') {
         this.arr_hr_req_only.push(this.notificationArray[i]);
       }
     }
     console.log(this.arr_hr_req_only);
   }
 
-  returnDateTime(stringDate: string){
+  returnDateTime(stringDate: string) {
     let allDateTime = stringDate.split(' ');
     let time = allDateTime[1].split(':', 2);
-    let fullDate = this.transform(stringDate); 
+    let fullDate = this.transform(stringDate);
     return fullDate + ' ' + time[0] + ':' + time[1] + ' ' + allDateTime[2];
-    
+
   }
   locale = {
     en: {
-     //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-       month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+      //  month_names: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      month_names_short: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
     }
-};
+  };
   transform(value: string) {
     let x = new Date(Date.parse(value));
     //return value.toLowerCase();
-    let month = this.getMonthNameShort('en',x.getMonth())
-    return ""+ x.getDate()+" "+ month +" "+x.getFullYear();
+    let month = this.getMonthNameShort('en', x.getMonth())
+    return "" + x.getDate() + " " + month + " " + x.getFullYear();
 
 
   }
-  
 
 
 
-  getMonthNameShort(lang,month) {
+  getMonthNameShort(lang, month) {
     lang = lang && (lang in this.locale) ? lang : 'en';
     return this.locale[lang].month_names_short[month];
-}
+  }
+
+  showLoading(notificationList) {
+    if (notificationList.length < 0) {
+      return true;
+    } else if (notificationList === []) {
+      return false;
+    } else { return true; }
+  }
 
 }
diff --git a/Mohem/src/app/notification/worklist-setting/worklist-setting.component.html b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.html
new file mode 100644
index 00000000..490f2123
--- /dev/null
+++ b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.html
@@ -0,0 +1,41 @@
+<ion-header>
+  <ion-toolbar class="header-toolbar">
+      <ion-title color="light">{{ 'worklist, worklist-setting' | translate}} </ion-title>
+      <ion-buttons slot="primary">
+          <ion-button style="background: none !important;" (click)="dismiss()">
+              <ion-icon slot="icon-only" name="close"></ion-icon>
+          </ion-button>
+      </ion-buttons>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <div style="padding: 5px;">
+    <h3 style="font-weight: bold;">{{ 'worklist, turn-on-notification' | translate}}</h3>
+  </div>
+  <br>
+
+  <ion-list>
+    <ion-item>
+      <ion-label>
+        <p style="color: black; padding: 5px; font-size: 16px; font-family: 'Poppins'; font-weight: bolder;">item type</p>
+      </ion-label>
+      <p style="color: black; padding: 5px; font-size: 16px; font-family: 'Poppins'; font-weight: bolder;">FYA</p>
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+      <p style="color: black; padding: 5px; font-size: 16px; font-family: 'Poppins'; font-weight: bolder;">FYI</p>
+    </ion-item>
+    <ion-item *ngFor="let data of notificationList">
+      <ion-label>
+        <p style="color: black; padding: 5px; font-size: 16px; font-family: 'Poppins'; padding-bottom: 10px;">{{data.ITEM_TYPE}}</p>
+      </ion-label>
+      <ion-toggle (ionChange)="chnageToggle(data, 'FYA', data.FYA_ENABLED_FALG)" [checked]="data.FYA_ENABLED_FALG === 'Y'"></ion-toggle>
+      &nbsp;&nbsp;&nbsp;
+      <ion-toggle (ionChange)="chnageToggle(data, 'FYI', data.FYI_ENABLED_FLAG)" [checked]="data.FYI_ENABLED_FLAG === 'Y'"></ion-toggle>
+    </ion-item>
+    <br>
+  </ion-list>
+</ion-content>
+
+<ion-footer>
+  <ion-button (click)="saveChanges()" style="font-size: 16px !important; width:371px; --background: #259CB8; background: white;"  expand="block">{{ 'worklist, save-changes' | translate}}</ion-button>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss
new file mode 100644
index 00000000..927b8dc3
--- /dev/null
+++ b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss
@@ -0,0 +1,7 @@
+.header-toolbar{
+    --background: #269DB8;
+}
+
+ion-toggle{
+    --background-checked: #269DB8;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/notification/worklist-setting/worklist-setting.component.spec.ts b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.spec.ts
new file mode 100644
index 00000000..627b60c6
--- /dev/null
+++ b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { WorklistSettingComponent } from './worklist-setting.component';
+
+describe('WorklistSettingComponent', () => {
+  let component: WorklistSettingComponent;
+  let fixture: ComponentFixture<WorklistSettingComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ WorklistSettingComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(WorklistSettingComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/notification/worklist-setting/worklist-setting.component.ts b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.ts
new file mode 100644
index 00000000..1521d3e6
--- /dev/null
+++ b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.ts
@@ -0,0 +1,86 @@
+import { Component, OnInit } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { UserItemTypes } from '../models/userItemTypeRequest';
+import { WorklistMainService } from '../service/work-list.main.service';
+
+@Component({
+  selector: 'app-worklist-setting',
+  templateUrl: './worklist-setting.component.html',
+  styleUrls: ['./worklist-setting.component.scss'],
+})
+export class WorklistSettingComponent implements OnInit {
+
+  notificationList = [];
+  request = [];
+  isChange = false;
+
+  public direction: string;
+
+  constructor(
+    public modalController: ModalController,
+    public ts: TranslatorService,
+    public common: CommonService,
+    public workListService: WorklistMainService) {}
+
+
+  ngOnInit() {
+    this.direction = TranslatorService.getCurrentDirection();
+    this.workListService.getWorklistNotifications()
+    .subscribe((result: any) => {
+      this.notificationList = result.GetUserItemTypesList;
+      for (let i = 0; i < this.notificationList.length; i++) {
+        this.request[i] = {
+          P_FYA_ENABLED_FALG: this.notificationList[i].FYA_ENABLED_FALG,
+          P_FYI_ENABLED_FLAG: this.notificationList[i].FYI_ENABLED_FLAG,
+          P_ITEM_TYPE: this.notificationList[i].ITEM_TYPE,
+          ItemID: i
+        };
+      }
+    });
+  }
+
+  chnageToggle(toggleValue, type, val) {
+    if ( val === 'Y') {
+      val = 'N';
+    } else if ( val  === 'N') {
+      val = 'Y';
+    }
+    this.notificationList.forEach((el, index) => {
+      if ( el.ITEM_TYPE === toggleValue.ITEM_TYPE) {
+        if (type === 'FYI') {
+          this.request[index].P_FYI_ENABLED_FLAG = val;
+        } else if (type === 'FYA') {
+          this.request[index].P_FYA_ENABLED_FALG = val;
+        }
+        this.request[index].ItemID = index;
+      }
+      this.request[index].P_ITEM_TYPE = el.ITEM_TYPE;
+    });
+  }
+
+  saveChanges() {
+    const body = {
+      UpdateItemTypeList: this.request
+    };
+    this.workListService.updateWorklistNotifications(body)
+    .subscribe((result: any) => {
+      if (result.UpdateItemTypeSuccessList) {
+        if (result.UpdateUserItemTypesList) {
+          this.common.greenToastPK('worklist', 'save-successfully');
+          this.dismiss();
+        } else {
+          this.common.redToastPK('worklist', 'save-error');
+        }
+      } else {
+        this.common.redToastPK('worklist', 'save-error');
+      }
+    });
+  }
+
+  public dismiss() {
+    this.common.sharedService.setSharedData(false, 'loadWorkList');
+    this.common.back();
+  }
+}
diff --git a/Mohem/src/app/offersdiscount/filter/filter.component.html b/Mohem/src/app/offersdiscount/filter/filter.component.html
index f8391b3b..ed6856df 100644
--- a/Mohem/src/app/offersdiscount/filter/filter.component.html
+++ b/Mohem/src/app/offersdiscount/filter/filter.component.html
@@ -18,7 +18,7 @@
       {{key.categoryName_ar}}
     </ion-label>
     <ion-thumbnail slot="start">
-      <div class="top-filter" [innerHTML]="key.content"></div>
+      <div class="top-filter" [innerHTML]="key.content | sanitizeHTMLPipe "></div>
     </ion-thumbnail>
   </ion-item>
  
diff --git a/Mohem/src/app/offersdiscount/home/home.component.html b/Mohem/src/app/offersdiscount/home/home.component.html
index 9c5cadcf..b84354f8 100644
--- a/Mohem/src/app/offersdiscount/home/home.component.html
+++ b/Mohem/src/app/offersdiscount/home/home.component.html
@@ -33,7 +33,7 @@
     <div class="container-icon" *ngIf="categories.length>0">
       <div class="box-icon" *ngFor="let key of categories">
         <div class="sale-icon" (click)="filterOffers(key)" [ngClass]="{'active':activeClass==key.categoryName_en }">
-          <div class="top" [innerHTML]="key.content">
+          <div class="top" [innerHTML]="key.content | sanitizeHTMLPipe">
             <!-- <ion-icon name="images"></ion-icon> -->
             <!-- <span [innerHTML]="key.content"></span> -->
             <!-- <img [src]="key.content" /> -->
diff --git a/Mohem/src/app/offersdiscount/home/home.component.ts b/Mohem/src/app/offersdiscount/home/home.component.ts
index b73c910c..8ee773ac 100644
--- a/Mohem/src/app/offersdiscount/home/home.component.ts
+++ b/Mohem/src/app/offersdiscount/home/home.component.ts
@@ -5,7 +5,7 @@ import { CommonService } from 'src/app/hmg-common/services/common/common.service
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
 import { OfferDiscountService } from '../services/service';
 import { IonInfiniteScroll } from '@ionic/angular';
-import { DomSanitizer} from '@angular/platform-browser';
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 @Component({
   selector: 'app-home',
   templateUrl: './home.component.html',
@@ -26,14 +26,20 @@ export class HomeComponent implements AfterViewInit {
   itemCounter = 1;
   itemType: any;
   isData = true;
-  // categories:any =  [];
+  allCategory: any = {
+    categoryID: 0,
+    content: '<svg xmlns="http://www.w3.org/2000/svg" width="33.925" height="25.841" viewBox="0 0 33.925 25.841"><g id="More_Select" data-name="More Select"><path d="m30 1h-24a1 1 0 0 0 -1 1v1h21a3 3 0 0 1 3 3v21h1a1 1 0 0 0 1-1v-24a1 1 0 0 0 -1-1z"/><path d="m26 5h-24a1 1 0 0 0 -1 1v24a1 1 0 0 0 1 1h24a1 1 0 0 0 1-1v-24a1 1 0 0 0 -1-1zm-4.747 9.344-8.728 8.726a1 1 0 0 1 -1.414 0l-4.364-4.363a1 1 0 0 1 1.414-1.414l3.657 3.656 8.021-8.019a1 1 0 0 1 1.414 1.414z"/></g></svg>',
+    isActive: true,
+    categoryName_en: "All",
+    categoryName_ar: "الجميع",
+  }
   constructor(
-    public ts: TranslatorService, 
-    public modalController: ModalController, 
-    public cs: CommonService, 
-    public offersService: OfferDiscountService, 
+    public ts: TranslatorService,
+    public modalController: ModalController,
+    public cs: CommonService,
+    public offersService: OfferDiscountService,
     public route: ActivatedRoute,
-    private sanitizer: DomSanitizer) {
+  ) {
 
     this.route
       .params.subscribe(val => {
@@ -62,9 +68,11 @@ export class HomeComponent implements AfterViewInit {
   getCategories() {
     this.offersService.getCategories({}).subscribe((result) => {
       this.categories = JSON.parse(result.Mohemm_ITG_ResponseItem).result.data; //result.result.data;
-      for (let i = 0; i < this.categories.length; i++) {
-        this.categories[i].content = this.sanitizer.bypassSecurityTrustHtml(this.categories[i].content);
-      }
+      //this.allCategory.content = this.sanitizer.bypassSecurityTrustHtml();
+      this.categories.unshift(this.allCategory);
+      // for (let i = 0; i < this.categories.length; i++) {
+      //   this.categories[i].content = this.sanitizer.bypassSecurityTrustHtml(this.categories[i].content);
+      // }
       this.cs.sharedService.setSharedData(this.categories, OfferDiscountService.categories);
     });
   }
@@ -80,13 +88,13 @@ export class HomeComponent implements AfterViewInit {
   getOfferDiscount(pageNo?, categoryId?) {
     this.cs.startLoading();
     if (categoryId) {
-      this.offersService.getOffers({}, () => { }, this.ts.trPK('general', 'retry'),pageNo, categoryId).subscribe((res) => {
+      this.offersService.getOffers({}, () => { }, this.ts.trPK('general', 'retry'), pageNo, categoryId).subscribe((res) => {
         var data = JSON.parse(res['Mohemm_ITG_ResponseItem']);
         this.cs.stopLoading();
         if (data['result']) {
           this.displayOffers(data['result']);
           this.isData = true;
-        }else{
+        } else {
           this.isData = false;
         }
       });
@@ -94,10 +102,10 @@ export class HomeComponent implements AfterViewInit {
       this.offersService.getOffers({}, () => { }, this.ts.trPK('general', 'retry')).subscribe((res) => {
         var data = JSON.parse(res['Mohemm_ITG_ResponseItem']);
         this.cs.stopLoading();
-        if (data['result']){
+        if (data['result']) {
           this.displayOffers(data['result']);
           this.isData = true;
-        } else{this.isData = false;}
+        } else { this.isData = false; }
       });
     }
 
@@ -107,19 +115,25 @@ export class HomeComponent implements AfterViewInit {
     if (data['data']) {
       var parseJSON = data['data'];
       var offers = JSON.parse(parseJSON);
-      this.offersData = offers;
+      console.log(offers);
+      this.offersData = this.filterActiveItems(offers);
+      console.log(this.offersData);
       this.tempSearch = this.offersData;
     }
   }
-
+  filterActiveItems(offers) {
+    return offers.filter((res) => {
+      return res['IsActive'] == 'True';
+    });
+  }
   filterOffers(key) {
-    if(this.direction === 'ltr') {
+    if (this.direction === 'ltr') {
       this.activeClass = key.categoryName_en;
-    }else {
+    } else {
       this.activeClass = key.categoryName_ar
     }
     this.itemType = key.id;
-    this.getOfferDiscount(1,this.itemType)
+    this.getOfferDiscount(1, this.itemType)
   }
 
   checkDate(date) {
@@ -142,9 +156,9 @@ export class HomeComponent implements AfterViewInit {
 
   search(t) {
     console.log(this.tempSearch);
-    if(t === ''){
+    if (t === '') {
       this.offersData = this.tempSearch;
-    } else{
+    } else {
       this.offersData = this.tempSearch.filter((post) => {
         return (post.Title.toLowerCase().indexOf(t.toLowerCase()) > -1);
       });
@@ -172,8 +186,9 @@ export class HomeComponent implements AfterViewInit {
         console.log(this.itemCounter);
         this.offersService.getOffers({}, () => { }, this.ts.trPK('general', 'retry'), this.itemCounter, this.itemType).subscribe((res) => {
           const data = JSON.parse(res['Mohemm_ITG_ResponseItem']);
-          if (data['result']){
-            const allItem = JSON.parse(data.result['data']);
+          if (data['result']) {
+            var allItem = JSON.parse(data.result['data']);
+            allItem = this.filterActiveItems(allItem);
             if (allItem) {
               allItem.forEach(element => {
                 this.offersData.push(element);
@@ -189,8 +204,9 @@ export class HomeComponent implements AfterViewInit {
         console.log(this.itemCounter);
         this.offersService.getOffers({}, () => { }, this.ts.trPK('general', 'retry'), this.itemCounter).subscribe((res) => {
           const data = JSON.parse(res['Mohemm_ITG_ResponseItem']);
-          if (data['result']){
-            const allItem = JSON.parse(data.result['data']);
+          if (data['result']) {
+            var allItem = JSON.parse(data.result['data']);
+            allItem = this.filterActiveItems(allItem);
             if (allItem) {
               allItem.forEach(element => {
                 this.offersData.push(element);
diff --git a/Mohem/src/app/offersdiscount/location/location.component.html b/Mohem/src/app/offersdiscount/location/location.component.html
new file mode 100644
index 00000000..c7fb1856
--- /dev/null
+++ b/Mohem/src/app/offersdiscount/location/location.component.html
@@ -0,0 +1,7 @@
+<app-generic-header showImage="false" showBack="true" [headerText]="'itemforsale,offersdiscount' | translate">
+</app-generic-header>
+<ion-content>
+  <div #map id="map">
+
+  </div>
+  </ion-content>
\ No newline at end of file
diff --git a/Mohem/src/app/offersdiscount/location/location.component.scss b/Mohem/src/app/offersdiscount/location/location.component.scss
new file mode 100644
index 00000000..70d9ad57
--- /dev/null
+++ b/Mohem/src/app/offersdiscount/location/location.component.scss
@@ -0,0 +1,4 @@
+#map {
+    width: 100%;
+    height: 100%;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/offersdiscount/location/location.component.spec.ts b/Mohem/src/app/offersdiscount/location/location.component.spec.ts
new file mode 100644
index 00000000..26caad16
--- /dev/null
+++ b/Mohem/src/app/offersdiscount/location/location.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LocationComponent } from './location.component';
+
+describe('LocationComponent', () => {
+  let component: LocationComponent;
+  let fixture: ComponentFixture<LocationComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ LocationComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(LocationComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/offersdiscount/location/location.component.ts b/Mohem/src/app/offersdiscount/location/location.component.ts
new file mode 100644
index 00000000..7c899f54
--- /dev/null
+++ b/Mohem/src/app/offersdiscount/location/location.component.ts
@@ -0,0 +1,79 @@
+import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { HMGUtils } from 'src/app/hmg-common/hmg_utils';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { OfferDiscountService } from '../services/service';
+declare var google;
+@Component({
+  selector: 'app-location',
+  templateUrl: './location.component.html',
+  styleUrls: ['./location.component.scss'],
+})
+
+export class LocationComponent implements OnInit {
+  @ViewChild('map') mapContainer: ElementRef;
+  locations: any = [];
+  map: any;
+  offerDetails: any;
+  constructor(public hmgUtils: HMGUtils, public route: ActivatedRoute, public cs: CommonService) {
+    this.route
+      .params.subscribe(val => {
+        setTimeout(() => {
+          this.ionEnter();
+        }, 100);
+      });
+  }
+  ionEnter() {
+    this.locations = this.cs.sharedService.getSharedData(OfferDiscountService.selected_offers, false);
+    this.offerDetails = this.cs.sharedService.getSharedData(OfferDiscountService.selected_offers, false);
+    this.displayMap();
+  }
+  ngOnInit() {
+
+  }
+  displayMap() {
+
+    const map = new google.maps.Map(
+      document.getElementById("map") as HTMLElement,
+      {
+        zoom: 10,
+        center: { lat: 24.7136, lng: 46.6753 },
+      }
+    );
+
+    this.setMarkers(map);
+
+  }
+  setMarkers(map) {
+
+    for (let i = 0; i < this.locations.length; i++) {
+      const loc = this.locations[i];
+      const infoWindow = new google.maps.InfoWindow();
+      var marker = new google.maps.Marker({
+        position: { lat: loc.latitude, lng: loc.longitude },
+        map,
+        // icon: image,
+        // shape: shape,
+        title: this.offerDetails.Title,
+
+      });
+      marker.addListener("click", () => {
+        this.cs.openLocation(loc.latitude, loc.longitude)
+      });
+    }
+    this.hmgUtils.getCurrentLocation((resp) => {
+      console.log(resp);
+      if (resp) {
+        const latLng = new google.maps.LatLng(resp.latitude, resp.longitude);
+        const mapOptions = {
+          center: latLng,
+          zoom: 17,
+          mapTypeId: google.maps.MapTypeId.ROADMAP,
+          myLocation: true
+        };
+
+        this.map = new google.maps.Map(this.mapContainer.nativeElement, mapOptions);
+      };
+    })
+  }
+}
diff --git a/Mohem/src/app/offersdiscount/offer-details/offer-details.component.html b/Mohem/src/app/offersdiscount/offer-details/offer-details.component.html
index f3a127c8..1d9c3d44 100644
--- a/Mohem/src/app/offersdiscount/offer-details/offer-details.component.html
+++ b/Mohem/src/app/offersdiscount/offer-details/offer-details.component.html
@@ -11,9 +11,11 @@
   <div>
     <ion-card>
       <ion-card-header>
-        <div class="header-img-main"  [ngStyle]="{'background-image': 'url(' + details.Banner_Image + ')'}" ></div>
-        
-        
+        <!-- <div class="header-img-main"  [ngStyle]="{'background-image': 'url(' + details.Banner_Image + ')'}" ></div>
+         -->
+         <image-modal size="big" fontsize="1cm"
+         [src]="details.Banner_Image">
+       </image-modal>
       
         <ion-card-title *ngIf="direction =='ltr'">{{details.Title}}</ion-card-title>
         <ion-card-title *ngIf="direction =='rtl'">{{details.Title_AR}}</ion-card-title>
@@ -44,6 +46,12 @@
           </div>
         </ion-col>
       </ion-row>  
+      <ion-row *ngIf="details.IsHasLocation" (click)="getLocation()">
+        <ion-col size="1">
+         <ion-icon name="map"></ion-icon>
+        </ion-col>
+        <ion-col><p class="location-text">{{ts.trPK('itemforsale','location')}}</p></ion-col>
+      </ion-row>
       </div>
      
     
@@ -84,7 +92,7 @@
               <img src="assets/imgs/itemsforsale/arrow.svg">
             </ion-col>
           </ion-row>
-           
+          
         </ion-card-content>
        </ion-card>
     </ion-col>
diff --git a/Mohem/src/app/offersdiscount/offer-details/offer-details.component.scss b/Mohem/src/app/offersdiscount/offer-details/offer-details.component.scss
index b487cc9b..5ea4054b 100644
--- a/Mohem/src/app/offersdiscount/offer-details/offer-details.component.scss
+++ b/Mohem/src/app/offersdiscount/offer-details/offer-details.component.scss
@@ -144,4 +144,9 @@ ion-card{
     margin: 2px 0px 5px -3px;
     font-size: 14px;
     font-weight: bold;
+}
+.location-text{
+    font-weight: bold;
+    font-size: 14px;
+    text-decoration: underline;
 }
\ No newline at end of file
diff --git a/Mohem/src/app/offersdiscount/offer-details/offer-details.component.ts b/Mohem/src/app/offersdiscount/offer-details/offer-details.component.ts
index 20a253b7..ee364abe 100644
--- a/Mohem/src/app/offersdiscount/offer-details/offer-details.component.ts
+++ b/Mohem/src/app/offersdiscount/offer-details/offer-details.component.ts
@@ -38,9 +38,9 @@ export class OfferDetailsComponent implements OnInit {
     console.log(this.details);
     const offerMessage = this.direction === 'ltr' ? this.details.Description : this.details.Description_AR;
     const offerSubject = this.direction === 'ltr' ? this.details.Title : this.details.Title_AR;
-    
+
     const options = {
-      message: this.stripHtml(offerMessage), 
+      message: this.stripHtml(offerMessage),
       subject: this.stripHtml(offerSubject),
       files: [this.details.Banner_Image]
     }
@@ -56,4 +56,16 @@ export class OfferDetailsComponent implements OnInit {
     }, 200);
 
   }
+  openLocation() {
+    this.cs.navigateForward('/offersdiscount/location');
+  }
+  getLocation() {
+    this.cs.startLoading();
+    this.offersService.getOfferLocation({ OfferId: this.details.rowID }, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => {
+      this.cs.stopLoading();
+      result = JSON.parse(result.Mohemm_ITG_ResponseItem).result.data;
+      this.cs.sharedService.setSharedData(result, OfferDiscountService.selected_offers);
+      this.openLocation();
+    })
+  }
 }
diff --git a/Mohem/src/app/offersdiscount/offersdiscount.module.ts b/Mohem/src/app/offersdiscount/offersdiscount.module.ts
index c64e20bb..fa0495d4 100644
--- a/Mohem/src/app/offersdiscount/offersdiscount.module.ts
+++ b/Mohem/src/app/offersdiscount/offersdiscount.module.ts
@@ -11,6 +11,9 @@ import { OfferDetailsComponent } from './offer-details/offer-details.component';
 import { HmgCommonModule } from '../hmg-common/hmg-common.module';
 import { OfferDiscountService } from './services/service';
 import { FilterComponent } from './filter/filter.component';
+import { LocationComponent } from './location/location.component';
+import { ImageModalModule } from '../hmg-common/ui/image-modal/image-modal.module';
+
 
 
 const routes: Routes = [
@@ -30,6 +33,10 @@ const routes: Routes = [
         path: 'filter-page',
         component: FilterComponent
       },
+      {
+        path: 'location',
+        component: LocationComponent
+      },
     ],
   }
 ];
@@ -42,10 +49,12 @@ const routes: Routes = [
     FormsModule,
     IonicModule,
     HmgCommonModule,
+    ImageModalModule,
     RouterModule.forChild(routes)
   ],
-  declarations: [OffersdiscountPage, HomeComponent, OfferDetailsComponent, FilterComponent],
+  declarations: [OffersdiscountPage, HomeComponent, OfferDetailsComponent, FilterComponent, LocationComponent],
   entryComponents: [FilterComponent],
-  providers: [OfferDiscountService, SocialSharing]
+  providers: [OfferDiscountService, SocialSharing],
+
 })
 export class OffersdiscountPageModule { }
diff --git a/Mohem/src/app/offersdiscount/services/service.ts b/Mohem/src/app/offersdiscount/services/service.ts
index b3bd357f..2a838807 100644
--- a/Mohem/src/app/offersdiscount/services/service.ts
+++ b/Mohem/src/app/offersdiscount/services/service.ts
@@ -15,8 +15,9 @@ export class OfferDiscountService {
     public static related_offers = 'related-offers';
     public static selected_filters = 'selected-filters';
     public static categories = 'categories';
+    public static offer_location = 'offer_location';
     public static getCategories = 'Services/COCWS.svc/REST/Mohemm_ITG_GetCategories';
-
+    public static offerLocation = 'Services/COCWS.svc/REST/Mohemm_ITG_OffersLocation';
     constructor(
         public con: ConnectorService,
         private authService: AuthenticationService,
@@ -39,7 +40,7 @@ export class OfferDiscountService {
         return this.con.postNoLoad(OfferDiscountService.offersDiscountData, request, onError, errorLabel);
 
     }
-    getCategories(request: any, onError?: any, errorLabel?: string): Observable<any>  {
+    getCategories(request: any, onError?: any, errorLabel?: string): Observable<any> {
         this.authService.authenticateRequest(request);
         request['EmployeeNumber'] = request.UserName;
         request['ItgChannelId'] = 3;
@@ -56,4 +57,10 @@ export class OfferDiscountService {
             errorLabel
         );
     }
+    public getOfferLocation(request: any, onError?: any, errorLabel?: string) {
+        this.authService.authenticateRequest(request);
+        request.EmployeeNumber = request.UserName;
+
+        return this.con.postNoLoad(OfferDiscountService.offerLocation, request, onError, errorLabel);
+    }
 }
\ No newline at end of file
diff --git a/Mohem/src/app/payslip/home/home.component.scss b/Mohem/src/app/payslip/home/home.component.scss
index 5b6eeb2b..1406aede 100644
--- a/Mohem/src/app/payslip/home/home.component.scss
+++ b/Mohem/src/app/payslip/home/home.component.scss
@@ -354,6 +354,7 @@
 .hrTitle{
   margin-left: 11px !important;
   font-size: 15px !important;
+  margin-right: 11px !important;
 }
 .date{
   font-size: 15px !important;
diff --git a/Mohem/src/app/pending-transaction/home/home.component.html b/Mohem/src/app/pending-transaction/home/home.component.html
new file mode 100644
index 00000000..6ac756a4
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/home/home.component.html
@@ -0,0 +1,102 @@
+
+<ion-content>
+  <div class="head-title">
+
+    <app-generic-header showImage="false" showBack="true" [headerText]="'general,pending-transaction' | translate">
+    </app-generic-header>
+  </div>
+  <div class="header"></div>
+  <div class="bottom"></div>
+  <div #containerDiv id="containerDiv">
+    <div class="search-header" *ngIf="!transactionDetails">
+    <ion-row class="ion-justify-content-center">
+      <ion-col [size]="11">
+  <div [ngClass]=" direction === 'en' ?  'custom-text-area-element Field-en' : 'custom-text-area-element Field-ar'" >
+    <label class="label" position='floating'  class="colBold requiredClass">{{ 'general,select' | translate}} </label>
+    <select name="selectAbsenceType" class="label-Select"  #selectAbsenceType="ngModel" [(ngModel)]="selectedTransaction"   required> 
+      <option value="noType" selected hidden selected><p>{{ts.trPK('absenceList','selectType')}}</p></option>
+        <option  *ngFor="let transaction of transactions" [value]="transaction.FUNCTION_ID">{{ transaction.FUNCTION_PROMPT}} </option>
+    </select>
+</div>
+  <!-- </ion-item> -->
+  </ion-col>
+    </ion-row>
+  <div class="date-container">
+    <ion-row class="ion-justify-content-center">
+      <ion-col [size]="6">
+        <ion-item [ngClass]=" direction === 'en' ?  'custom-text-area-element Field-en padding_date' : 'custom-text-area-element padding_date Field-ar'" >
+          <div class="date-time-icon date-primary"> <ion-icon name="calendar" class="date-icon"></ion-icon></div>
+         
+          <ion-label>{{ 'general,from-date' | translate}}</ion-label>
+          <ion-datetime 
+           
+            display-format="DD/MM/YYYY"
+            [min]="1900"
+            [max]="2100"
+            [(ngModel)]="dateFrom"
+            [doneText]="'general,done' | translate"
+            [cancelText]="'general,cencel' | translate"
+          ></ion-datetime>
+        </ion-item>
+      </ion-col>
+      <ion-col [size]="6">
+        <ion-item [ngClass]=" direction === 'en' ?  'custom-text-area-element padding_date Field-en' : 'custom-text-area-element padding_date Field-ar'" >
+          <div class="date-time-icon date-primary"> <ion-icon class="date-icon" name="calendar"></ion-icon></div>
+         
+          <ion-label>{{ 'general,to-date' | translate}}</ion-label>
+          <ion-datetime  
+            placeholder="Select"
+            display-format="DD/MM/YYYY"
+            [min]="1900"
+            [max]="2100"
+            [(ngModel)]="dateTo"
+            [doneText]="'general,done' | translate"
+            [cancelText]="'general,cencel' | translate"
+          ></ion-datetime>
+        </ion-item>
+      </ion-col>
+    </ion-row>
+  </div>
+
+</div>
+  <div class="data-content">
+    <div class="no-dataDiv"
+    *ngIf="transactionDetails && transactionDetails.length==0">
+    <!-- <div class="no-dataDiv"> -->
+    <ion-row>
+      <img class="empty-data" src="../assets/imgs/box.png" />
+    </ion-row>
+    <h4> {{'general, noData' | translate}}</h4>
+  </div>
+  </div>
+  <div *ngIf="transactionDetails && transactionDetails.length>0" class="transaction-list">
+    <ion-card *ngFor="let transaction of transactionDetails">
+      <div [ngClass]="direction ==='en'? 'date-en':'date-ar'">{{transaction.CREATION_DATE}}</div>
+      <ion-label class="ion-text-wrap">
+        <ion-text color="primary">
+          <p class="display-created bold" >{{'transaction, created-for' | translate}}</p>
+          <p class="display-created bold padding">{{transaction.TRANSACTION_CREATED_FOR}}</p>
+        </ion-text>
+       
+        <ion-text color="secondary">
+          <div class="">
+          <p class="color-black display-inline">{{'transaction, request-type' | translate}}</p>
+          <p class="display-inline red">{{transaction.REQUEST_TYPE}}</p>
+        </div>
+        </ion-text>
+      </ion-label>
+    </ion-card>
+
+  </div>
+  </div>
+</ion-content>
+
+<ion-footer>
+  <div class="centerDiv">
+    <ion-button *ngIf="!transactionDetails" class="footer-button" style="background: var(--newgreen)!important;border-radius: 10px;    --background: transparent; width:80%" ion-button [disabled]="!isValid()" (click)="getPendingRequestDetails()">
+      {{'general, submit' | translate}}</ion-button>
+      <ion-button *ngIf="transactionDetails && transactionDetails.length>0" class="footer-button" style="background: var(--newgreen)!important;border-radius: 10px;    --background: transparent; width:80%" ion-button  (click)="transactionDetails=null">
+        {{'general, reset' | translate}}</ion-button>
+  </div>
+</ion-footer>
+
diff --git a/Mohem/src/app/pending-transaction/home/home.component.scss b/Mohem/src/app/pending-transaction/home/home.component.scss
new file mode 100644
index 00000000..d5c8e7ac
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/home/home.component.scss
@@ -0,0 +1,117 @@
+.display-created{
+    display: inline-block;
+  
+    color:#000;
+}
+#containerDiv{
+    margin-top:20px;
+}
+.padding{
+    padding-left:5px;
+    padding-right: 5px;
+}
+.bold{
+    font-weight: bold;
+    font-size: 16px;
+}
+.color-black{
+    color:#000;
+}
+.date-en{
+    position: absolute;
+    font-size: 14px;
+    padding: 10px;
+    right:0;
+    width: 100px;
+    color:#969696;
+    margin: -8px;
+}
+.date-ar{
+    position: absolute;
+    font-size: 14px;
+    padding: 10px;
+    left: 10px;
+    width: 100px;
+    color:#969696;
+    margin: -8px;
+}
+.transaction-list{
+    margin-top:20px;
+}
+.date-container{
+    margin:0px 20px;
+}
+
+.label{
+    font-size: 16px;
+    // margin-left: 15px;
+    color: #a2a5a6 !important;
+    display: block;
+    overflow: hidden;
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    /* font-size: inherit; */
+    // text-overflow: ellipsis;
+    // white-space: nowrap;
+    white-space: normal;
+    // padding-top: 10px;
+    padding: 5px 0px;
+    padding-left: 10px !important;
+    margin: 10px auto;
+    :root[dir="ltr"]{
+        font-family: var(--fontFamilySemiBoldEN) !important;
+    }
+    :root[dir="rtl"]{
+        font-family: var(--fontFamilyIOSAR) !important;
+        font-weight: bold;
+    }
+
+
+}
+
+.Field-en{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 15px;
+  padding-left: 20px  !important; 
+  padding-top: 6px !important;
+  color: #999999 !important;
+}
+
+.Field-ar{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 20px;
+  padding-right: 20px  !important; 
+  padding-top: 6px !important;
+  color: #999999 !important;
+}
+select{
+    width: 300px !important;
+    border: none !important;
+}
+.padding_date{
+    padding-left:5px !important;
+}
+.date-icon{
+    font-size: 20px;
+    left: -1px;
+    position: relative;
+    top: 2px;
+}
+ion-card{
+    padding: 20px 10px 20px 10px;
+    border-radius: 11px;
+    box-shadow: 0px 1px 2px 1px #ccc;
+}
+.display-inline{
+    display:inline-block;
+
+}
+.red{
+color:#CA3332;
+font-weight: 600;
+margin:0px 5px;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/pending-transaction/home/home.component.spec.ts b/Mohem/src/app/pending-transaction/home/home.component.spec.ts
new file mode 100644
index 00000000..5ec1377b
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/home/home.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HomeComponent } from './home.component';
+
+describe('HomeComponent', () => {
+  let component: HomeComponent;
+  let fixture: ComponentFixture<HomeComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ HomeComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(HomeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/pending-transaction/home/home.component.ts b/Mohem/src/app/pending-transaction/home/home.component.ts
new file mode 100644
index 00000000..e722d588
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/home/home.component.ts
@@ -0,0 +1,56 @@
+import { Component, ElementRef, OnInit } from '@angular/core';
+import { EitService } from 'src/app/eit/services/eit.service';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { ServiceService } from '../service/service.service';
+
+@Component({
+  selector: 'app-home',
+  templateUrl: './home.component.html',
+  styleUrls: ['./home.component.scss'],
+})
+export class HomeComponent implements OnInit {
+  public direction: any;
+  public transactions: any = [];
+  public selectedTransaction: any;
+  public dateTo: any;
+  public dateFrom: any;
+  public transactionDetails;
+  constructor(public cs: CommonService, private elementRef: ElementRef, public trServcice: ServiceService, public ts: TranslatorService, public eitService: EitService) { }
+
+
+  ngOnInit() {
+
+
+    this.getPendingTransaction();
+    this.direction = TranslatorService.getCurrentLanguageName();
+
+  }
+  getPendingTransaction() {
+    this.cs.startLoading();
+    this.trServcice.getPendingRequests({
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      this.cs.stopLoading();
+      this.transactions = response['GetPendingReqFunctionsList'];
+    })
+  }
+  getPendingRequestDetails() {
+    this.cs.startLoading();
+    this.trServcice.getPendingRequestDetails({
+      'P_FUNCTION_ID': this.selectedTransaction,
+      'P_CREATION_DATE_FROM': "/Date(" + Date.parse(this.dateFrom) + '+0300' + ")/",
+      'P_CREATION_DATE_TO': "/Date(" + Date.parse(this.dateTo) + '+0300' + ")/",
+      'P_PAGE_NUM': 1,
+      'P_PAGE_LIMIT': 20,
+
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      this.cs.stopLoading();
+      this.transactionDetails = response['GetPendingReqDetailsList'];
+    })
+  }
+  isValid() {
+    if (this.selectedTransaction && this.dateFrom && this.dateTo)
+      return true;
+    else return false
+  }
+}
diff --git a/Mohem/src/app/pending-transaction/pending-transaction.module.ts b/Mohem/src/app/pending-transaction/pending-transaction.module.ts
new file mode 100644
index 00000000..1d95ebc2
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/pending-transaction.module.ts
@@ -0,0 +1,36 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { Routes, RouterModule } from '@angular/router';
+
+import { IonicModule } from '@ionic/angular';
+
+import { PendingTransactionPage } from './pending-transaction.page';
+import { HomeComponent } from './home/home.component';
+import { ServiceService } from './service/service.service';
+import { HmgCommonModule } from '../hmg-common/hmg-common.module';
+const routes: Routes = [
+  {
+    path: '',
+    component: PendingTransactionPage,
+    children: [
+      {
+        path: 'home',
+        component: HomeComponent
+      },
+    ]
+  }
+];
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    RouterModule.forChild(routes),
+    HmgCommonModule
+  ],
+  declarations: [PendingTransactionPage, HomeComponent],
+  providers: [ServiceService]
+})
+export class PendingTransactionPageModule { }
diff --git a/Mohem/src/app/pending-transaction/pending-transaction.page.html b/Mohem/src/app/pending-transaction/pending-transaction.page.html
new file mode 100644
index 00000000..d26b79fd
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/pending-transaction.page.html
@@ -0,0 +1,4 @@
+
+<ion-content>
+  <ion-router-outlet></ion-router-outlet>
+</ion-content>
\ No newline at end of file
diff --git a/Mohem/src/app/pending-transaction/pending-transaction.page.scss b/Mohem/src/app/pending-transaction/pending-transaction.page.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/Mohem/src/app/pending-transaction/pending-transaction.page.spec.ts b/Mohem/src/app/pending-transaction/pending-transaction.page.spec.ts
new file mode 100644
index 00000000..b6a16ed9
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/pending-transaction.page.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PendingTransactionPage } from './pending-transaction.page';
+
+describe('PendingTransactionPage', () => {
+  let component: PendingTransactionPage;
+  let fixture: ComponentFixture<PendingTransactionPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ PendingTransactionPage ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PendingTransactionPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/pending-transaction/pending-transaction.page.ts b/Mohem/src/app/pending-transaction/pending-transaction.page.ts
new file mode 100644
index 00000000..1377c463
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/pending-transaction.page.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-pending-transaction',
+  templateUrl: './pending-transaction.page.html',
+  styleUrls: ['./pending-transaction.page.scss'],
+})
+export class PendingTransactionPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}
diff --git a/Mohem/src/app/pending-transaction/service/service.service.spec.ts b/Mohem/src/app/pending-transaction/service/service.service.spec.ts
new file mode 100644
index 00000000..d2923aa3
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/service/service.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ServiceService } from './service.service';
+
+describe('ServiceService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: ServiceService = TestBed.get(ServiceService);
+    expect(service).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/pending-transaction/service/service.service.ts b/Mohem/src/app/pending-transaction/service/service.service.ts
new file mode 100644
index 00000000..f5521403
--- /dev/null
+++ b/Mohem/src/app/pending-transaction/service/service.service.ts
@@ -0,0 +1,44 @@
+import { Injectable } from '@angular/core';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { ConnectorService } from 'src/app/hmg-common/services/connector/connector.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ServiceService {
+
+
+  public static GET_PENDING_REQ_FUNCTIONS = 'Services/ERP.svc/REST/GET_PENDING_REQ_FUNCTIONS';
+  public static GET_PENDING_REQ_DETAILS = 'Services/ERP.svc/REST/GET_PENDING_REQ_DETAILS';
+  constructor(
+    public con: ConnectorService,
+    private authService: AuthenticationService,
+    public cs: CommonService
+  ) { }
+
+  getPendingRequests(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ServiceService.GET_PENDING_REQ_FUNCTIONS,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  getPendingRequestDetails(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ServiceService.GET_PENDING_REQ_DETAILS,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+
+
+
+}
diff --git a/Mohem/src/app/profile/add-address/add-address.component.html b/Mohem/src/app/profile/add-address/add-address.component.html
index b66eab09..695cd8b3 100644
--- a/Mohem/src/app/profile/add-address/add-address.component.html
+++ b/Mohem/src/app/profile/add-address/add-address.component.html
@@ -21,7 +21,7 @@
    
   </ion-item>
   <ion-item class="country dynamicField" lines="none" *ngIf="isUpdate ==false">
-    <ion-label> Effective Date</ion-label>
+    <ion-label>{{'vacation-rule, effectiveDate' | translate}}</ion-label>
     <ion-datetime [(ngModel)]="effectiveDate" min="1900" max="2100" displayFormat="DD/MM/YYYY " placeholder="MM/DD/YYYY"
    ></ion-datetime>
   </ion-item>
diff --git a/Mohem/src/app/profile/add-basic-details/add-basic-details.component.html b/Mohem/src/app/profile/add-basic-details/add-basic-details.component.html
index ce1335e8..352a55a6 100644
--- a/Mohem/src/app/profile/add-basic-details/add-basic-details.component.html
+++ b/Mohem/src/app/profile/add-basic-details/add-basic-details.component.html
@@ -10,7 +10,7 @@
 
 <ion-content padding>
   <ion-item  class="country dynamicField" lines="none" *ngIf="targetValue === 'correct' && showEffectiveDate"> 
-    <ion-label>Effective Date</ion-label>
+    <ion-label>{{'vacation-rule, effectiveDate' | translate}}</ion-label>
     <ion-label>{{showEffectiveDate}}</ion-label>
   </ion-item>
   <div #containerDiv id="containerDiv">
diff --git a/Mohem/src/app/profile/add-update-contact/add-update-contact.component.html b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.html
new file mode 100644
index 00000000..4a92fa86
--- /dev/null
+++ b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.html
@@ -0,0 +1,34 @@
+
+<app-generic-header
+showBack="!getPassdirfromNotifiPage"
+[updateDirection]="getPassdirfromNotifiPage" 
+[headerText]="headerTitle"
+(trigger)="closeModal()"
+class="dependent-title"
+>
+</app-generic-header>
+
+
+<ion-content padding>
+<ion-item  class="country dynamicField" lines="none" *ngIf="targetValue === 'correct' && showEffectiveDate"> 
+  <ion-label>Effective Date</ion-label>
+  <ion-label>{{showEffectiveDate}}</ion-label>
+</ion-item>
+<div #containerDiv id="containerDiv" *ngIf="!isDelete">
+  <div #containerDivTwo id="containerDivTwo"></div>
+</div>
+<ion-item [ngClass]=" direction === 'en' ?  'custom-text-area-element padding_date Field-en' : 'custom-text-area-element padding_date Field-ar'" *ngIf="isDelete">
+  <ion-label position='floating' class="colBold requiredClass">{{ts.trPK('submitAbsence','endDate')}} </ion-label>
+  <ion-datetime  (ionChange)="calcDay()" [(ngModel)]="endDate"  min="1900" max="2100" displayFormat="MMM/DD/YYYY"  placeholder="MM/DD/YYYY" required
+  cancelText="{{ts.trPK('general','cancel')}}"
+       doneText="{{ts.trPK('general','done')}}"></ion-datetime>
+      </ion-item>
+</ion-content>
+
+<ion-footer>
+<div class="centerDiv">
+  <ion-button class="addEitOkButton" color="customnavy" ion-button (click)="submitTransaction()">
+    {{'vacation-rule, next-label' | translate}}</ion-button>
+  
+</div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/profile/add-update-contact/add-update-contact.component.scss b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.scss
new file mode 100644
index 00000000..764fe8af
--- /dev/null
+++ b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.scss
@@ -0,0 +1,52 @@
+.date-container{
+    margin:0px 20px;
+}
+
+.label{
+    font-size: 16px;
+    // margin-left: 15px;
+    color: #a2a5a6 !important;
+    display: block;
+    overflow: hidden;
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    /* font-size: inherit; */
+    // text-overflow: ellipsis;
+    // white-space: nowrap;
+    white-space: normal;
+    // padding-top: 10px;
+    padding: 5px 0px;
+    padding-left: 10px !important;
+    margin: 10px auto;
+    :root[dir="ltr"]{
+        font-family: var(--fontFamilySemiBoldEN) !important;
+    }
+    :root[dir="rtl"]{
+        font-family: var(--fontFamilyIOSAR) !important;
+        font-weight: bold;
+    }
+
+
+}
+
+.Field-en{
+    border-radius: 30px;
+    border: 1px solid #a2a5a6 !important;
+    margin-bottom: 0px;
+    padding-left: 20px !important;
+    padding-top: 0px !important;
+    color: #999999 !important;
+    height: 80px;
+}
+
+.Field-ar{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 20px;
+  padding-right: 20px  !important; 
+  padding-top: 0px !important;
+  color: #999999 !important;
+  height:80px   
+}
\ No newline at end of file
diff --git a/Mohem/src/app/profile/add-update-contact/add-update-contact.component.spec.ts b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.spec.ts
new file mode 100644
index 00000000..d11ca101
--- /dev/null
+++ b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddUpdateContactComponent } from './add-update-contact.component';
+
+describe('AddUpdateContactComponent', () => {
+  let component: AddUpdateContactComponent;
+  let fixture: ComponentFixture<AddUpdateContactComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AddUpdateContactComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AddUpdateContactComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/profile/add-update-contact/add-update-contact.component.ts b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.ts
new file mode 100644
index 00000000..f8aaf42a
--- /dev/null
+++ b/Mohem/src/app/profile/add-update-contact/add-update-contact.component.ts
@@ -0,0 +1,2134 @@
+
+import { EITTransactionsRequest } from 'src/app/eit/models/EITTransactionsReq';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { MenuEntry } from 'src/app/hmg-common/services/menu/models/menu.entry';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { EITNotificatonBodyResponse } from 'src/app/notification/models/EITNotificationBodyRes';
+import { ButtonInput } from 'src/app/uI-elements/button.input';
+import { DateTimeInput } from 'src/app/uI-elements/date-time.input';
+import { DateInput } from 'src/app/uI-elements/date.input';
+import { HiddenInput } from 'src/app/uI-elements/hidden.input';
+import { NumberInput } from 'src/app/uI-elements/number.input';
+import { SelectInput } from 'src/app/uI-elements/select.input';
+import { TextAreaInput } from 'src/app/uI-elements/text-area.input';
+import { TextInput } from 'src/app/uI-elements/text.input';
+import { TimeInput } from 'src/app/uI-elements/time.input';
+import { BasicRequest } from '../models/basic.request';
+import { ProfileService } from '../service/profile.service';
+import * as moment from "moment";
+import { EIT_ACTION } from 'src/app/eit/models/submit.eit.action';
+import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { DatePicker } from '@ionic-native/date-picker/ngx';
+import { ActivatedRoute } from '@angular/router';
+import { ContactRequest } from '../models/contact.request';
+
+
+
+@Component({
+  selector: 'app-add-update-contact',
+  templateUrl: './add-update-contact.component.html',
+  styleUrls: ['./add-update-contact.component.scss'],
+})
+export class AddUpdateContactComponent implements OnInit {
+  @ViewChild("containerDiv") containerDiv: ElementRef;
+  @ViewChild("containerDivTwo") containerDivTwo: ElementRef;
+
+
+  getPassNotificationDetails: any;
+  getPassdirfromNotifiPage: boolean = false;
+  functionName: string = "";
+  menuType: any;
+  private textArea: TextAreaInput;
+  private numberInput: NumberInput;
+  private textInput: TextInput;
+  private selectInput: SelectInput;
+  private dateInput: DateInput;
+  private timeInput: TimeInput;
+  private datetimeInput: DateTimeInput;
+  private buttonInput: ButtonInput;
+  private hiddenInput: HiddenInput;
+  private eitResponse: any;
+  private eitDffResponse: any;
+  private eitColResponse: any;
+
+  private eitVALSettoCall: any = [];
+  private comtransNo: number = 0;
+  getPassMnuEntryObj: MenuEntry;
+  selMenu: MenuResponse;
+  eitSubmitAction: number = 0; //not submit
+  private basicRequest: ContactRequest;
+  private validateEitObj: any = [];
+  private ExtraObj: any = {};
+  private arrValues: any = [];
+  selEmp: string;
+  respID: number;
+  headerTitle: string = "";
+  isResubmit: boolean = false;
+  private updatedValues: any = [];
+  addEITData: any;
+  direction: string;
+  public targetValue: any;
+  public employeeBasicDetails: any = [];
+  public mutualBasicDetailsArray: any = [];
+  public effectiveDate: string;
+  public showEffectiveDate: string;
+  public userUpdateData: any;
+  public isDelete: boolean = false;
+  public selctedContact: any;
+  public endDate: any;
+  constructor(
+    public modalController: ModalController,
+    public cs: CommonService,
+    public ts: TranslatorService,
+    private profileService: ProfileService,
+    public datePicker: DatePicker,
+    public router: ActivatedRoute
+  ) {
+
+    this.router.queryParams.subscribe(params => {
+      this.targetValue = params.targetValue;
+      console.log(this.targetValue);
+    });
+
+    var empDetails = this.cs.sharedService.getSharedData(ProfileService.EMP_CONTACT_DETAILS);
+    this.employeeBasicDetails = empDetails ? empDetails : [];
+    var isDelete = this.cs.sharedService.getSharedData(ProfileService.REMOVE_CONTACT);
+    this.isDelete = isDelete ? isDelete : false;
+    this.selctedContact = this.cs.sharedService.getSharedData(ProfileService.SELCTED_CONTACT, false);
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.selEmp = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_SEL_EMP,
+      false
+    );
+    this.respID = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_SEL_RESP_ID,
+      false
+    );
+    this.selMenu = new MenuResponse();
+    this.selMenu = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_DATA,
+      false
+    );
+    this.addEITData = this.cs.sharedService.getSharedData("AddEITData", false);
+    console.log("addEITData: " + this.addEITData);
+
+    this.basicRequest = new ContactRequest();
+
+    ////*new add*/////
+    /**********resubmit************ */
+    this.getPassNotificationDetails = this.cs.sharedService.getSharedData(EITNotificatonBodyResponse.NOT_WORKLIST, false);//WARINING
+    this.getPassdirfromNotifiPage = this.addEITData.dirfromNotificationPage;
+    if (this.getPassdirfromNotifiPage) {
+      this.functionName = this.getPassNotificationDetails.FUNCTION_NAME; //;this.getPassNotificationDetails.NOTIFICATION_NAME;
+      this.menuType = "E";
+      this.selEmp = this.getPassNotificationDetails.SELECTED_EMPLOYEE_NUMBER;
+      this.respID = -999;
+      this.validateEitObj = this.addEITData.submitEITObjList;
+      let msg: string = "";
+      msg = this.ts.trPK("general", "update-contact");
+      this.headerTitle = msg;
+    } else {
+      this.getPassMnuEntryObj = this.selMenu.GetMenuEntriesList;
+      this.comtransNo = this.addEITData.transNo;
+      this.functionName = this.getPassMnuEntryObj.FUNCTION_NAME;
+      this.menuType = this.selMenu.List_Menu.MENU_TYPE;
+      this.validateEitObj = this.addEITData.submitEITObjList;
+      this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+      this.eitSubmitAction = this.cs.sharedService.getSharedData(
+        EITTransactionsRequest.SUBMIT_EIT_ACTION
+      );
+    }
+  }
+
+  ngOnInit() { }
+
+  ngAfterViewInit() {
+    if (!this.isDelete)
+      this.getBasicffStructure();
+  }
+
+  public getColumnStructure() {
+    const body = {
+      P_FUNCTION_NAME: this.functionName,
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_ACTION: this.employeeBasicDetails.length > 0 ? 'UPDATE' : this.isDelete ? 'REMOVE' : 'ADD'
+    };
+    this.profileService.getContactColumnStructure(body).subscribe((result: any) => {
+      this.handleBasicColStructureResult(result);
+    });
+  }
+
+  private getEitDffStructure() {
+    const body = {
+      P_FUNCTION_NAME: this.functionName,
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID,
+      'P_DESC_FLEX_CONTEXT_CODE': 'HMG_ADD_CONTACT_DETAILS'
+    };
+    this.profileService.getContactDFFStrutre(body).subscribe((result: any) => {
+      this.handleDffStructureResult(result);
+    });
+  }
+  handleDffStructureResult(result) {
+    if (result.GetContactDffStructureList != null) {
+
+      this.eitDffResponse = result.GetContactDffStructureList;
+      this.drawEitFields(result.GetContactDffStructureList, true);
+      this.fillBasicDetailsStructure();
+    }
+  }
+  private getBasicffStructure() {
+    const body = {
+      P_FUNCTION_NAME: this.functionName,
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID,
+      P_REQUEST_TYPE: this.getPassMnuEntryObj.REQUEST_TYPE
+    };
+    this.profileService.getBasicDFFStrutre(body).subscribe((result: any) => {
+      this.handleBasicDffStructureResult(result);
+    });
+  }
+
+  public handleBasicColStructureResult(result) {
+    if (result.GetContactColsStructureList != null) {
+      this.eitColResponse = result.GetContactColsStructureList;
+      //  if (this.employeeBasicDetails.length > 0) {
+      this.getEitDffStructure();
+      //}
+
+      this.drawEitFieldsStatic(result.GetContactColsStructureList);
+    }
+  }
+
+  public handleBasicDffStructureResult(result) {
+    if (result.GetBasicDetDffStructureList != null) {
+      this.getColumnStructure();
+      this.eitResponse = result.GetBasicDetDffStructureList;
+      this.drawEitFields(result.GetBasicDetDffStructureList, false);
+
+    }
+  }
+
+  private drawEitFieldsStatic(feildsList) {
+    const containerId = "containerDivTwo";
+    this.eitVALSettoCall = [];
+    for (let i = 0; i < feildsList.length; i++) {
+      let defaultVal: string = "";
+      let defaultValText: string = "";
+
+      if (feildsList[i].DISPLAY_FLAG != "N") {
+        //text , date , time
+        if (feildsList[i].DATATYPE == "VARCHAR2" && feildsList[i].ObjectValuesList === null) {
+          // character
+          this.textInput = new TextInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            defaultVal,
+            containerId,
+            defaultValText,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG
+          );
+        } else if (feildsList[i].DATATYPE == "VARCHAR2" && feildsList[i].ObjectValuesList !== null) {
+          this.selectInput = new SelectInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            defaultVal,
+            containerId,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG
+          );
+          this.fillStaticDropdownList(
+            feildsList[i].SEGMENT_NAME,
+            feildsList[i].ObjectValuesList,
+            feildsList[i].APPLICATION_COLUMN_NAME
+          );
+        } else if (feildsList[i].DATATYPE == "NUMBER") {
+          this.numberInput = new NumberInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            defaultVal,
+            containerId,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG
+          );
+        } else if (feildsList[i].DATATYPE == "DATE") {
+          this.dateInput = new DateInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            "",
+            containerId,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG,
+            this.direction
+          );
+
+        }
+      }
+    }
+
+  }
+
+  public getElementsStaticValues(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = 1;
+    let textValue: any;
+
+    for (let i = 0; i < this.eitColResponse.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+
+      if (this.eitColResponse[i].DISPLAY_FLAG != "N") {
+        if (this.eitColResponse[i].ObjectValuesList === null) {
+          let elem = document.getElementById(this.eitColResponse[i].APPLICATION_COLUMN_NAME) as HTMLInputElement;
+          let elemVal = elem !== null ? (document.getElementById(this.eitColResponse[i].APPLICATION_COLUMN_NAME) as HTMLInputElement).value : '';
+          textValue = elemVal;
+
+          if (this.eitColResponse[i].DATATYPE == "VARCHAR2" || this.eitColResponse[i].DATATYPE == "NUMBER") {
+            elemVal = elemVal;
+          } else if (this.eitColResponse[i].DATATYPE == "DATE") {
+            // date
+            elemVal = this.cs.reverseFormatDate(elemVal);
+          }
+
+          if (this.targetValue === 'new') {
+            if (this.eitColResponse[i].REQUIRED_FLAG == "Y" && !elemVal) {
+              elem.classList.add("requiredClassElm");
+              return false;
+            } else {
+              elem.classList.remove("requiredClassElm");
+            }
+          }
+
+          if (this.eitColResponse[i].DATATYPE == "DATE") {
+            dateValue = elemVal;
+          } else if (this.eitColResponse[i].DATATYPE == "NUMBER") {
+            numbervalue = elemVal;
+          } else {
+            varcharValue = elemVal;
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.eitColResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(this.eitColResponse[i].APPLICATION_COLUMN_NAME) as HTMLSelectElement;
+
+          let val = x.options[x.selectedIndex] ? x.options[x.selectedIndex].value : null;
+          let txt = x.options[x.selectedIndex] ? x.options[x.selectedIndex].text : null;
+          varcharValue = val;
+          textValue = txt;
+
+          if (x !== null) {
+            if (this.eitColResponse[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+              x.classList.add("requiredClassElm");
+              return false;
+            } else {
+              x.classList.remove("requiredClassElm");
+            }
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.eitColResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        }
+      } else {
+        let x = document.getElementById(this.eitColResponse[i].APPLICATION_COLUMN_NAME) as HTMLSelectElement;
+        let val = x !== null ? x.dataset.colmText : '';
+        textValue = x !== null ? x.value : '';
+
+        if (x !== null) {
+          if (this.eitResponse[i].REQUIRED_FLAG == "Y" && !val) {
+            x.classList.add("requiredClassElm");
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+        }
+
+
+        let staticValueBasicDetail = this.employeeBasicDetails.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitColResponse[i].APPLICATION_COLUMN_NAME
+        );
+
+        if (staticValueBasicDetail) {
+          if (this.eitColResponse[i].DATATYPE === 'VARCHAR2') {
+            varcharValue = staticValueBasicDetail.VARCHAR2_VALUE;
+          } else if (this.eitColResponse[i].DATATYPE === 'DATE') {
+            dateValue = staticValueBasicDetail.DATE_VALUE;
+          } else if (this.eitColResponse[i].DATATYPE === 'NUMBER') {
+            numbervalue = staticValueBasicDetail.NUMBER_VALUE;
+          } else {
+            varcharValue = val;
+          }
+        } else {
+          varcharValue = val;
+        }
+
+
+
+        valuseArr.push({
+          TRANSACTION_NUMBER: transNo,
+          NAME: this.eitColResponse[i].APPLICATION_COLUMN_NAME,
+          VARCHAR2_VALUE: varcharValue,
+          NUMBER_VALUE: numbervalue,
+          DATE_VALUE: dateValue
+        });
+      }
+    }
+    return valuseArr;
+  }
+
+  private drawEitFields(feildsList, isDff: boolean) {
+    const containerId = "containerDiv";
+    this.eitVALSettoCall = [];
+    for (let i = 0; i < feildsList.length; i++) {
+      let defaultVal: string = "";
+      let defaultValText: string = "";
+      // defaultVal = feildsList[i].E_SERVICES_DV.P_ID_COLUMN_NAME
+      //   ? feildsList[i].E_SERVICES_DV.P_ID_COLUMN_NAME
+      //   : "";
+      // defaultValText = feildsList[i].E_SERVICES_DV.P_VALUE_COLUMN_NAME
+      //   ? feildsList[i].E_SERVICES_DV.P_VALUE_COLUMN_NAME
+      //   : "";
+
+      if (feildsList[i].DISPLAY_FLAG != "N") {
+        //check if the field should be displayed
+        if (feildsList[i].VALIDATION_TYPE == "N") {
+          //text , date , time
+          if (feildsList[i].FORMAT_TYPE == "C") {
+            // character
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "N") {
+            this.numberInput = new NumberInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "X") {
+            // standard date
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              //constant
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          } else if (feildsList[i].FORMAT_TYPE == "Y") {
+            // standard date time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatStandardDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+            const elem = document.getElementById(
+              feildsList[i].APPLICATION_COLUMN_NAME
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "I") {
+            //time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          }
+        } else {
+          if (feildsList[i].READ_ONLY == "Y") {
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else {
+            this.selectInput = new SelectInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+            if (isDff) {
+              this.fillDropdownListDff(
+                feildsList[i].SEGMENT_NAME,
+                feildsList[i].E_SERVICES_VS,
+                feildsList[i].E_SERVICES_DV
+              );
+            } else {
+              this.fillDropdownList(
+                feildsList[i].SEGMENT_NAME,
+                feildsList[i].E_SERVICES_VS,
+                feildsList[i].E_SERVICES_DV
+              );
+            }
+          }
+
+        }
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      } else {
+        this.hiddenInput = new HiddenInput(
+          defaultVal,
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          defaultValText,
+          containerId
+        );
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      }
+    }
+    if (this.validateEitObj && this.validateEitObj.length > 0) {
+      this.fillEITStructure();
+    }
+
+  }
+
+  addFieldToDOM(
+    fieldObject: any,
+    fieldId: any,
+    clickListenerEvent: any,
+    hasClickListener: boolean
+  ) {
+    console.log("AddFieldToDOM");
+    const elemDiv = document.createElement("div");
+    elemDiv.className = "";
+    elemDiv.innerHTML = fieldObject.getTemplate();
+    console.log(this.containerDiv.nativeElement);
+
+    this.containerDiv.nativeElement.appendChild(elemDiv);
+    // document.getElementById('containerDiv').appendChild(elemDiv);
+
+    if (hasClickListener) {
+      let elem = document.getElementById(fieldId);
+      elem.addEventListener("click", e => {
+        clickListenerEvent(e);
+        e.stopImmediatePropagation();
+      });
+    }
+  }
+
+  closeModal() {
+    this.updatedValues = [];
+    this.modalController.dismiss();
+  }
+
+  public showDateTimePicker(elemID, maxSize) {
+    let elem = document.getElementById(elemID) as HTMLDivElement;
+    let date: any;
+    let value = elem.innerHTML;
+    if (value) date = moment(value, "YYYY/MM/DD HH:mm:ss").toDate();
+    else date = new Date();
+    this.datePicker
+      .show({
+        date: date,
+        is24Hour: true,
+        mode: "datetime"
+      })
+      .then(
+        date => {
+          let dateString: string = moment(date).format("YYYY/MM/DD HH:mm:ss");
+          //remove seconds if the maximum size is 17
+          if (maxSize == 17) {
+            elem.innerHTML = dateString.substring(0, 16);
+            elem.dataset.dtvalue = dateString.substring(0, 16);
+          } else {
+            elem.innerHTML = dateString;
+            elem.dataset.dtvalue = dateString;
+          }
+        },
+        err => console.log("Error occurred while getting date: ", err)
+      );
+  }
+
+  public showTimePicker(elemID, maxSize) {
+    let elem = document.getElementById(elemID) as HTMLDivElement;
+    let date: any;
+    let value = elem.innerHTML;
+    if (value) {
+      let nowDate = moment().format("YYYY/MM/DD") + " " + value;
+      date = moment(nowDate, "YYYY/MM/DD HH:mm:ss").toDate();
+    } else {
+      date = new Date();
+    }
+    this.datePicker
+      .show({
+        date: date,
+        is24Hour: true,
+        mode: "time"
+      })
+      .then(
+        date => {
+          let dateString: string = moment(date).format("HH:mm:ss");
+          //remove seconds if the maximum size is 5
+          if (maxSize == 5) {
+            elem.innerHTML = dateString.substring(0, 5);
+            elem.dataset.dtvalue = dateString.substring(0, 5);
+          } else {
+            elem.innerHTML = dateString;
+            elem.dataset.dtvalue = dateString;
+          }
+        },
+        err => console.log("Error occurred while getting date: ", err)
+      );
+  }
+
+  fillDropdownList(segmentName, optionList: any = [], DV: any = "") {
+    let elemID: any = "";
+    let eitObj: any;
+    if (optionList.length > 0) {
+      for (let i = 0; i < this.eitResponse.length; i++) {
+        if (this.eitResponse[i].SEGMENT_NAME == segmentName) {
+          eitObj = this.eitResponse[i];
+          if (
+            this.eitResponse[i].READ_ONLY == "Y" ||
+            this.eitResponse[i].DISPLAY_FLAG == "N"
+          ) {
+            return false;
+          }
+          elemID = this.eitResponse[i].APPLICATION_COLUMN_NAME;
+          break;
+        }
+      }
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+
+      if (eitObj.IsEmptyOption && eitObj.REQUIRED_FLAG == "N") {
+        var firstoption = document.createElement("option");
+        firstoption.text = this.ts.trPK("general", "choose");
+        firstoption.value = "";
+        select.add(firstoption);
+      }
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].VALUE_COLUMN_NAME;
+        option.value = optionList[i].ID_COLUMN_NAME;
+        select.add(option);
+      }
+      if (select.dataset.hiddenval) {
+        select.value = select.dataset.hiddenval;
+      } else {
+        select.value = DV.P_ID_COLUMN_NAME;
+      }
+      select.disabled = false;
+    }
+  }
+
+  fillDropdownListDff(segmentName, optionList: any = [], DV: any = "") {
+    let elemID: any = "";
+    let eitObj: any;
+    if (optionList.length > 0) {
+      for (let i = 0; i < this.eitDffResponse.length; i++) {
+        if (this.eitDffResponse[i].SEGMENT_NAME == segmentName) {
+          eitObj = this.eitDffResponse[i];
+          if (
+            this.eitDffResponse[i].READ_ONLY == "Y" ||
+            this.eitDffResponse[i].DISPLAY_FLAG == "N"
+          ) {
+            return false;
+          }
+          elemID = this.eitDffResponse[i].APPLICATION_COLUMN_NAME;
+          break;
+        }
+      }
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+
+      if (eitObj.IsEmptyOption && eitObj.REQUIRED_FLAG == "N") {
+        var firstoption = document.createElement("option");
+        firstoption.text = this.ts.trPK("general", "choose");
+        firstoption.value = "";
+        select.add(firstoption);
+      }
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].VALUE_COLUMN_NAME;
+        option.value = optionList[i].ID_COLUMN_NAME;
+        select.add(option);
+      }
+      if (select.dataset.hiddenval) {
+        select.value = select.dataset.hiddenval;
+      } else {
+        select.value = DV.P_ID_COLUMN_NAME;
+      }
+      select.disabled = false;
+    }
+  }
+  public fillStaticDropdownList(segmentName, optionList: any = [], elemID: string) {
+    let eitObj: any;
+    if (optionList.length > 0) {
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].MEANING;
+        option.value = optionList[i].CODE;
+        select.add(option);
+      }
+    }
+  }
+
+  bindHtmlElemEvents(id, obj) {
+    const elem = document.getElementById(id);
+    console.log(elem);
+    console.log(obj);
+    const elemType = elem.tagName;
+    let changeEvent = "ionChange";
+
+    if (elemType == "SELECT") changeEvent = "change";
+
+    try {
+      elem.addEventListener(changeEvent, e => {
+        elem.classList.remove("requiredClassElm");
+        if (
+          obj.CHILD_SEGMENTS_VS_Splited &&
+          obj.CHILD_SEGMENTS_VS_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_VS_Splited;
+          listArray.forEach(element => {
+            this.emptyChildElement(element);
+            this.getValueSet(element);
+          });
+        }
+        if (
+          obj.CHILD_SEGMENTS_DV_Splited &&
+          obj.CHILD_SEGMENTS_DV_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_DV_Splited;
+          listArray.forEach(element => {
+            this.emptyChildElement(element);
+            for (let i = 0; i < this.eitResponse.length; i++) {
+              if (this.eitResponse[i].SEGMENT_NAME == element) {
+                this.getDefaultValue(
+                  this.eitResponse[i],
+                  this.eitResponse[i].DESC_FLEX_NAME,
+                  this.eitResponse[i].DESC_FLEX_CONTEXT_CODE,
+                  this.eitResponse[i].SEGMENT_NAME,
+                  this.eitResponse[i].PARENT_SEGMENTS_VS_SplitedVS,
+                  this.eitResponse[i].PARENT_SEGMENTS_DV_Splited
+                );
+              }
+            }
+          });
+        }
+        return false;
+      });
+    } catch (e) {
+      console.log(e.status);
+    }
+  }
+
+  public getDefaultValue(
+    obj,
+    descFlexName,
+    descFlexContextCode,
+    segmentName,
+    parentValue,
+    ParentsList
+  ) {
+    let dependenciesList: any = [];
+    let parentVal: any = null;
+    let isStandardDate: boolean = false;
+    let isStandardTimeDate: boolean = false;
+    let isStandardTime: boolean = false;
+    let isHidden: boolean = false;
+    let isReadOnlyList: boolean = false;
+    let isSelectElement: boolean = false;
+    isStandardDate = this.isStandardDate(obj);
+    isStandardTimeDate = this.isStandardDateTime(obj);
+    isStandardTime = this.isStandardTime(obj);
+    if (obj.DISPLAY_FLAG == "N") isHidden = true;
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "Y") {
+      isReadOnlyList = true;
+    }
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "N") {
+      isSelectElement = true;
+    }
+
+    if (
+      parentValue != "" &&
+      (obj.VALIDATION_TYPE == "D" || obj.VALIDATION_TYPE == "Y")
+    ) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      if (parentValue) ParentsList.concat(parentValue);
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList
+    };
+
+    this.profileService.getDefaultValue(body).subscribe((result: any) => {
+      let elem = this.getElementByName(segmentName);
+      let obj = this.handleDefaultValueResult(result);
+      let val = obj.value;
+      let text = obj.text;
+      if (val == null) { val = ""; }
+      if (text == null) { text = ""; }
+      if (isStandardDate) {
+        console.log("isStandardDate");
+        elem.value = this.cs.reverseFormatDate(val);
+      } else if (isStandardTimeDate) {
+        console.log("isStandardTimeDate");
+        if (val) {
+          elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+          elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else if (isStandardTime) {
+        console.log("isStandardTime");
+        if (val) {
+          elem.dataset.dtvalue = val;
+          elem.innerHTML = val;
+          elem.value = val;
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else {
+        if (isSelectElement) {
+          let elem = this.getSelectElementByName(segmentName);
+          elem = document.getElementById(elem),
+            elem.value = val;
+        } else {
+          elem.value = val;
+          elem.innerText = text;
+          elem.setAttribute("value", val);
+        }
+      }
+      if (isHidden || isReadOnlyList) {
+        if (val) elem.dataset.colmText = val;
+        else elem.dataset.colmText = "";
+        elem.value = text;
+      }
+      var event = new Event("ionChange");
+      elem.dispatchEvent(event);
+    });
+  }
+
+  handleDefaultValueResult(result) {
+    let data = {
+      text: result.GetDefaultValueList.P_VALUE_COLUMN_NAME,
+      value: result.GetDefaultValueList.P_ID_COLUMN_NAME
+    };
+    return data;
+  }
+
+  callValueSet() {
+    for (var i = 0; i < this.eitVALSettoCall.length; i++) {
+      this.getValueSet(this.eitVALSettoCall[i].SEGMENT_NAME);
+    }
+  }
+
+  getParentValue(parentValue) {
+    if (parentValue.length == 0) {
+      for (let i = 0; i < this.eitResponse.length; i++) {
+        if (this.eitResponse[i].SEGMENT_NAME == parentValue[0].Name) {
+          if (this.eitResponse[i].VALIDATION_TYPE == "N") {
+            let val = (document.getElementById(
+              this.eitResponse[i].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement).value;
+            return val;
+          } else {
+            let x = document.getElementById(
+              this.eitResponse[i].APPLICATION_COLUMN_NAME
+            ) as HTMLSelectElement;
+            if (x.options.length > 0) {
+              let val = x.options[x.selectedIndex]
+                ? x.options[x.selectedIndex].value
+                : null;
+              return val;
+            } else {
+              return "";
+            }
+          }
+        }
+      }
+    } else {
+      return "";
+    }
+  }
+
+  public getValueSet(segmentName) {
+    let descFlexName: any = "";
+    let descFlexContextCode: any = "";
+    let parentValue: any = [];
+    let ParentsList: any = [];
+    let parentVal: any = null;
+    let dependenciesList: any = [];
+    let validationType: string = "";
+
+    for (let i = 0; i < this.eitResponse.length; i++) {
+      if (this.eitResponse[i].SEGMENT_NAME == segmentName) {
+        descFlexName = this.eitResponse[i].DESC_FLEX_NAME;
+        descFlexContextCode = this.eitResponse[i].DESC_FLEX_CONTEXT_CODE;
+        parentValue = this.eitResponse[i].PARENT_SEGMENTS_VS_SplitedVS;
+        ParentsList = this.eitResponse[i].PARENT_SEGMENTS_VS_SplitedVS;
+        validationType = this.eitResponse[i].VALIDATION_TYPE;
+        break;
+      }
+    }
+    if (parentValue != "" && (validationType == "D" || validationType == "Y")) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList,
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    };
+
+    this.profileService.getSetValue(body).subscribe((result: any) => {
+      if (result.GetValueSetValuesList != null) {
+        this.fillDropdownList(segmentName, result.GetValueSetValuesList);
+      }
+    });
+    let arr: any = [];
+    return arr;
+  }
+
+  getDependenciesParams(parentsList) {
+    let parentArr: any = [];
+    for (let i = 0; i < parentsList.length; i++) {
+      for (let j = 0; j < this.eitResponse.length; j++) {
+        if (this.eitResponse[j].SEGMENT_NAME == parentsList[i].Name) {
+          if (this.eitResponse[j].DISPLAY_FLAG != "N") {
+            if (this.eitResponse[j].VALIDATION_TYPE == "N") {
+              let idColName: string;
+              let val: any;
+              if (
+                this.eitResponse[j].FORMAT_TYPE == "Y" ||
+                this.eitResponse[j].FORMAT_TYPE == "I"
+              ) {
+                //standard date time or //time
+                let elem = document.getElementById(
+                  this.eitResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLDivElement;
+                val = elem.dataset.dtvalue;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.eitResponse[j].FORMAT_TYPE == "Y")
+                  idColName = this.cs.formatStandardDate(val);
+              } else {
+                val = (document.getElementById(
+                  this.eitResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement).value;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.eitResponse[j].FORMAT_TYPE == "X") {
+                  //date
+                  // idColName = this.cs.formatDate(val);
+                  idColName = this.cs.formatDateNew(val);
+                }
+              }
+              parentArr.push({
+                SEGMENT_NAME: this.eitResponse[j].SEGMENT_NAME,
+                VALUE_COLUMN_NAME: val,
+                DESCRIPTION: "",
+                ID_COLUMN_NAME: idColName,
+                FLEX_VALUE_SET_NAME: this.eitResponse[j].FLEX_VALUE_SET_NAME
+              });
+              break;
+            } else {
+              if (this.eitResponse[j].READ_ONLY != "Y") {
+                let x = document.getElementById(
+                  this.eitResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLSelectElement;
+                let text = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].text
+                  : "";
+                let val = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].value
+                  : undefined;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.eitResponse[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.eitResponse[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              } else {
+                let x = document.getElementById(
+                  this.eitResponse[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement;
+                let text = x.value;
+                let val = x.dataset.colmText;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.eitResponse[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.eitResponse[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              }
+            }
+          } else {
+            let x = document.getElementById(
+              this.eitResponse[j].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement;
+            let text = x.value;
+            let val = x.dataset.colmText;
+            if (
+              (val == undefined || val == "") &&
+              parentsList[i].IsRequired == "REQUIRED"
+            ) {
+              //alert(parentsList[i].Name +" Is required");
+              return false;
+            } else {
+            }
+            if (text == undefined) {
+              text = "";
+            }
+            parentArr.push({
+              SEGMENT_NAME: this.eitResponse[j].SEGMENT_NAME,
+              VALUE_COLUMN_NAME: text,
+              DESCRIPTION: "",
+              ID_COLUMN_NAME: val,
+              FLEX_VALUE_SET_NAME: this.eitResponse[j].FLEX_VALUE_SET_NAME
+            });
+            break;
+          }
+        }
+      }
+    }
+    return parentArr;
+  }
+
+  emptyChildElement(segmentName) {
+    let elem = this.getElementByName(segmentName);
+    elem.value = null;
+    elem.innerHTML = "";
+    if ("dtvalue" in elem.dataset) {
+      elem.dataset.dtvalue = "";
+    }
+    if ("colmText" in elem.dataset) {
+      elem.dataset.colmText = "";
+    }
+    var event = new Event("change");
+    elem.dispatchEvent(event);
+    elem.classList.remove("requiredClassElm");
+  }
+
+  getRequiredFilds() {
+    for (let i = 0; i < this.eitResponse.length; i++) {
+      if (this.eitResponse[i].REQUIRED_FLAG == "Y") {
+        let elemVal = (document.getElementById(
+          this.eitResponse[i].APPLICATION_COLUMN_NAME
+        ) as HTMLInputElement).value;
+        if (elemVal == "") {
+          //alert(this.eitResponse[i].SEGMENT_NAME+" is required");
+          break;
+        }
+      }
+    }
+  }
+
+  getElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.eitResponse.length; i++) {
+      if (this.eitResponse[i].SEGMENT_NAME == segmentName) {
+        elemID = this.eitResponse[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return document.getElementById(elemID) as HTMLInputElement;
+  }
+
+  getSelectElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.eitResponse.length; i++) {
+      if (this.eitResponse[i].SEGMENT_NAME == segmentName) {
+        elemID = this.eitResponse[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return elemID;
+  }
+
+  isStandardDate(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+      // standard date
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  isStandardDateTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  isStandardTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  isStandardDateVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+      // standard date
+      isSt = true;
+      // }
+    }
+    return isSt;
+  }
+
+  isStandardDateTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      isSt = true;
+    }
+    return isSt;
+  }
+
+  isStandardTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard  time
+      isSt = true;
+    }
+    return isSt;
+  }
+
+  public customiseDate(date: any) {
+    let formatedDate = date.slice(0, 9);
+    let newDate = formatedDate.split("/").reverse();
+    const tmp = newDate[2];
+    newDate[2] = newDate[1];
+    newDate[1] = tmp;
+    newDate = newDate.join("/");
+    newDate = newDate + ' 00:00:00';
+    return newDate;
+  }
+
+
+  public fillBasicDetailsStructure() {
+
+    this.mutualBasicDetailsArray = this.eitDffResponse.concat(this.mutualBasicDetailsArray.concat(this.eitResponse, this.eitColResponse));
+
+    for (let i = 0; i < this.employeeBasicDetails.length; i++) {
+      let val: any;
+      if (this.employeeBasicDetails[i].VARCHAR2_VALUE) {
+        val = this.employeeBasicDetails[i].VARCHAR2_VALUE;
+      } else if (this.employeeBasicDetails[i].DATE_VALUE) {
+        val = this.cs.formatDate(this.employeeBasicDetails[i].DATE_VALUE);
+        if (this.employeeBasicDetails[i].APPLICATION_COLUMN_NAME === 'EFFECTIVE_DATE') {
+          this.effectiveDate = this.employeeBasicDetails[i].DATE_VALUE;
+          this.showEffectiveDate = this.employeeBasicDetails[i].SEGMENT_VALUE_DSP;
+        }
+      } else if (this.employeeBasicDetails[i].NUMBER_VALUE) {
+        val = this.employeeBasicDetails[i].NUMBER_VALUE;
+      }
+      const elem = document.getElementById(this.employeeBasicDetails[i].APPLICATION_COLUMN_NAME) as HTMLInputElement;
+      if (elem) {
+        if (val) {
+          let feldDetails = this.mutualBasicDetailsArray.find(
+
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.employeeBasicDetails[i].APPLICATION_COLUMN_NAME
+          );
+          if (feldDetails) {
+            let isStandardTime = this.isStandardTimeVal(feldDetails);
+            if (isStandardTime) {
+              elem.innerHTML = val;
+              elem.dataset.dtvalue = val;
+            } else {
+              elem.value = val;
+              elem.setAttribute("value", elem.value);
+            }
+          }
+        }
+      }
+    }
+  }
+
+  fillEITStructure() {
+    var obj = { peiObjVer: null, peiExtraInfoID: null };
+    for (let i = 0; i < this.validateEitObj.length; i++) {
+      let val: any;
+      if (this.validateEitObj[i].VARCHAR2_VALUE)
+        val = this.validateEitObj[i].VARCHAR2_VALUE;
+      else if (this.validateEitObj[i].DATE_VALUE)
+        val = this.validateEitObj[i].DATE_VALUE;
+      else if (this.validateEitObj[i].NUMBER_VALUE)
+        val = this.validateEitObj[i].NUMBER_VALUE;
+      const elem = document.getElementById(
+        this.validateEitObj[i].APPLICATION_COLUMN_NAME
+      ) as HTMLInputElement;
+      //obj.transactionNo=this.validateEitObj[i].TRANSACTION_NUMBER;
+      if (elem) {
+        if (val) {
+          let feldDetails = this.eitResponse.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.validateEitObj[i].APPLICATION_COLUMN_NAME
+          );
+          if (feldDetails) {
+            let isStandardDate = this.isStandardDateVal(feldDetails);
+            let isStandardDateTime = this.isStandardDateTimeVal(feldDetails);
+            let isStandardTime = this.isStandardTimeVal(feldDetails);
+            if (isStandardDate) {
+              elem.value = this.cs.reverseFormatDate(val);
+            } else if (isStandardDateTime) {
+              elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+              elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+            } else if (isStandardTime) {
+              elem.innerHTML = val;
+              elem.dataset.dtvalue = val;
+            } else {
+              elem.value = val;
+              elem.setAttribute("value", elem.value);
+            }
+            if (
+              feldDetails.DISPLAY_FLAG == "N" ||
+              (feldDetails.VALIDATION_TYPE != "N" &&
+                feldDetails.READ_ONLY == "Y")
+            ) {
+              elem.dataset.colmText = val;
+              elem.value = this.validateEitObj[i].SEGMENT_VALUE_DSP;
+              elem.setAttribute("value", elem.value);
+            }
+          }
+          elem.dataset.hiddenval = val; //hide the value to set it after calling get value set
+          if (
+            feldDetails.CHILD_SEGMENTS_VS_Splited &&
+            feldDetails.CHILD_SEGMENTS_VS_Splited.length > 0
+          ) {
+            let listArray: any = feldDetails.CHILD_SEGMENTS_VS_Splited;
+            listArray.forEach(element => {
+              this.getValueSet(element);
+            });
+          }
+          //  var event = new Event('change');
+          // elem.dispatchEvent(event);
+        }
+      } else {
+        if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME ==
+          "PEI_OBJECT_VERSION_NUMBER"
+        )
+          obj.peiObjVer = this.validateEitObj[i].NUMBER_VALUE;
+        else if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME == "PEI_EXTRA_INFO_ID"
+        )
+          obj.peiExtraInfoID = this.validateEitObj[i].NUMBER_VALUE;
+      }
+    }
+    this.ExtraObj = obj;
+  }
+
+  public getElementsValues(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = 1;
+    let textValue: any;
+    // if(this.ExtraObj.transactionNo)
+    // transNo=this.ExtraObj.transactionNo;
+    for (let i = 0; i < this.eitResponse.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+      /*********set transaction No of the updated object ********/
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitResponse[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+      }
+      if (this.eitResponse[i].DISPLAY_FLAG != "N") {
+        if (this.eitResponse[i].VALIDATION_TYPE == "N") {
+          let elem = document.getElementById(
+            this.eitResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement;
+          let elemVal = (document.getElementById(
+            this.eitResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement).value;
+          textValue = elemVal;
+          //let elemVal= (<HTMLInputElement>document.getElementById(this.eitResponse[i].APPLICATION_COLUMN_NAME)).value;
+          if (
+            this.eitResponse[i].FORMAT_TYPE == "X" &&
+            this.eitResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //date
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.eitResponse[i].FORMAT_TYPE == "Y" &&
+            this.eitResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //standard date time
+            // elemVal = elem.dataset.dtvalue;
+            // elemVal = this.cs.formatStandardDate(elemVal);
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.eitResponse[i].FORMAT_TYPE == "I" &&
+            this.eitResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //time
+            if (elemVal.length > 5) {
+              elemVal = elemVal.substring(11, 16);
+            } else {
+              elemVal = elemVal;
+            }
+          }
+          if (this.eitResponse[i].REQUIRED_FLAG == "Y" && !elemVal) {
+            elem.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            elem.classList.remove("requiredClassElm");
+          }
+          // if (elemVal != 'null'){
+          varcharValue = elemVal;
+          //} else{
+          //   elemVal = null;
+          //  }
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.eitResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(
+            this.eitResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLSelectElement;
+          if (this.eitResponse[i].READ_ONLY == "Y") {
+            let text = x.value;
+            let val = x.dataset.colmText;
+            varcharValue = val;
+            textValue = text;
+          } else {
+            let val = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].value
+              : null;
+            let txt = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].text
+              : null;
+            varcharValue = val;
+            textValue = txt;
+          }
+          if (this.eitResponse[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+            x.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.eitResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } //end else
+      } else {
+        let x = document.getElementById(
+          this.eitResponse[i].APPLICATION_COLUMN_NAME
+        ) as HTMLSelectElement;
+        let val = x.dataset.colmText;
+        textValue = x.value;
+        if (this.eitResponse[i].REQUIRED_FLAG == "Y" && !val) {
+          x.classList.add("requiredClassElm");
+          //this.common.showRequiredMsg();
+          return false;
+        } else {
+          x.classList.remove("requiredClassElm");
+        }
+
+        let staticValueBasicDetail = this.employeeBasicDetails.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitResponse[i].APPLICATION_COLUMN_NAME
+        );
+
+        if (staticValueBasicDetail) {
+          if (staticValueBasicDetail.DATATYPE === 'VARCHAR2') {
+            varcharValue = staticValueBasicDetail.VARCHAR2_VALUE;
+          } else if (staticValueBasicDetail.DATATYPE === 'DATE') {
+            dateValue = staticValueBasicDetail.DATE_VALUE;
+          } else if (staticValueBasicDetail.DATATYPE === 'NUMBER') {
+            numbervalue = staticValueBasicDetail.NUMBER_VALUE;
+          } else {
+            if (val) varcharValue = val;
+          }
+        } else {
+          if (val) varcharValue = val;
+        }
+
+
+        valuseArr.push({
+          TRANSACTION_NUMBER: transNo,
+          NAME: this.eitResponse[i].APPLICATION_COLUMN_NAME,
+          VARCHAR2_VALUE: varcharValue,
+          NUMBER_VALUE: numbervalue,
+          DATE_VALUE: dateValue
+        });
+      }
+
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitResponse[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        y.VARCHAR2_VALUE = varcharValue;
+        y.NUMBER_VALUE = numbervalue;
+        y.DATE_VALUE = dateValue;
+        y.SEGMENT_VALUE_DSP = textValue;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+        this.updatedValues.push(y);
+      } else {
+        if (this.validateEitObj && this.eitSubmitAction == EIT_ACTION.UPDATE) {
+          let updatedObj = this.validateEitObj.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.eitResponse[i].APPLICATION_COLUMN_NAME
+          );
+          let y = updatedObj;
+          y.VARCHAR2_VALUE = varcharValue;
+          y.NUMBER_VALUE = numbervalue;
+          y.DATE_VALUE = dateValue;
+          y.SEGMENT_VALUE_DSP = textValue;
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        } else {
+          let y = {
+            TRANSACTION_NUMBER: transNo,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue,
+            SEGMENT_VALUE_DSP: textValue,
+            APPLICATION_COLUMN_NAME: this.eitResponse[i]
+              .APPLICATION_COLUMN_NAME,
+            DATATYPE: this.eitResponse[i].DATATYPE,
+            DESC_FLEX_CONTEXT_CODE: this.eitResponse[i].DESC_FLEX_CONTEXT_CODE,
+            DESC_FLEX_NAME: this.eitResponse[i].DESC_FLEX_NAME,
+            DISPLAY_FLAG: this.eitResponse[i].DISPLAY_FLAG,
+            SEGMENT_NAME: this.eitResponse[i].SEGMENT_NAME,
+            SEGMENT_PROMPT: this.eitResponse[i].SEGMENT_PROMPT
+          };
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        }
+      }
+    } // end for
+
+    if (this.getPassdirfromNotifiPage) {
+      let updatedObj1 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_ACTION"
+      );
+      let updatedObj2 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_EXTRA_INFO_ID"
+      );
+      let updatedObj3 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_OBJECT_VERSION_NUMBER"
+      );
+      this.updatedValues.push(updatedObj1);
+      this.updatedValues.push(updatedObj2);
+      this.updatedValues.push(updatedObj3);
+      valuseArr = this.fillExtraInformation(
+        valuseArr,
+        updatedObj1.VARCHAR2_VALUE,
+        updatedObj2.NUMBER_VALUE,
+        updatedObj3.NUMBER_VALUE,
+        transNo
+      );
+    } else {
+      if (this.eitSubmitAction == EIT_ACTION.ADD) {
+        this.updatedValues = this.fillExtraValuesUpdated(
+          this.updatedValues,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.UPDATE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "UPDATE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.DELETE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "DELETE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      }
+    }
+    return valuseArr;
+  } // end getElementsValues
+
+
+  public getElementsValuesDff(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = 1;
+    let textValue: any;
+    // if(this.ExtraObj.transactionNo)
+    // transNo=this.ExtraObj.transactionNo;
+    for (let i = 0; i < this.eitDffResponse.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+      /*********set transaction No of the updated object ********/
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+      }
+      if (this.eitDffResponse[i].DISPLAY_FLAG != "N") {
+        if (this.eitDffResponse[i].VALIDATION_TYPE == "N") {
+          let elem = document.getElementById(
+            this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement;
+          let elemVal = (document.getElementById(
+            this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement).value;
+          textValue = elemVal;
+          //let elemVal= (<HTMLInputElement>document.getElementById(this.eitResponse[i].APPLICATION_COLUMN_NAME)).value;
+          if (
+            this.eitDffResponse[i].FORMAT_TYPE == "X" &&
+            this.eitDffResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //date
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.eitDffResponse[i].FORMAT_TYPE == "Y" &&
+            this.eitDffResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //standard date time
+            // elemVal = elem.dataset.dtvalue;
+            // elemVal = this.cs.formatStandardDate(elemVal);
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.eitDffResponse[i].FORMAT_TYPE == "I" &&
+            this.eitDffResponse[i].DISPLAY_FLAG != "N"
+          ) {
+            //time
+            if (elemVal.length > 5) {
+              elemVal = elemVal.substring(11, 16);
+            } else {
+              elemVal = elemVal;
+            }
+          }
+          if (this.eitDffResponse[i].REQUIRED_FLAG == "Y" && !elemVal) {
+            elem.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            elem.classList.remove("requiredClassElm");
+          }
+          // if (elemVal != 'null'){
+          varcharValue = elemVal;
+          //} else{
+          //   elemVal = null;
+          //  }
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.eitDffResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(
+            this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+          ) as HTMLSelectElement;
+          if (this.eitDffResponse[i].READ_ONLY == "Y") {
+            let text = x.value;
+            let val = x.dataset.colmText;
+            varcharValue = val;
+            textValue = text;
+          } else {
+            let val = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].value
+              : null;
+            let txt = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].text
+              : null;
+            varcharValue = val;
+            textValue = txt;
+          }
+          if (this.eitDffResponse[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+            x.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.eitDffResponse[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } //end else
+      } else {
+        let x = document.getElementById(
+          this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+        ) as HTMLSelectElement;
+        let val = x.dataset.colmText;
+        textValue = x.value;
+        if (this.eitDffResponse[i].REQUIRED_FLAG == "Y" && !val) {
+          x.classList.add("requiredClassElm");
+          //this.common.showRequiredMsg();
+          return false;
+        } else {
+          x.classList.remove("requiredClassElm");
+        }
+
+        let staticValueBasicDetail = this.employeeBasicDetails.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+        );
+
+        if (staticValueBasicDetail) {
+          if (staticValueBasicDetail.DATATYPE === 'VARCHAR2') {
+            varcharValue = staticValueBasicDetail.VARCHAR2_VALUE;
+          } else if (staticValueBasicDetail.DATATYPE === 'DATE') {
+            dateValue = staticValueBasicDetail.DATE_VALUE;
+          } else if (staticValueBasicDetail.DATATYPE === 'NUMBER') {
+            numbervalue = staticValueBasicDetail.NUMBER_VALUE;
+          } else {
+            if (val) varcharValue = val;
+          }
+        } else {
+          if (val) varcharValue = val;
+        }
+
+
+        valuseArr.push({
+          TRANSACTION_NUMBER: transNo,
+          NAME: this.eitDffResponse[i].APPLICATION_COLUMN_NAME,
+          VARCHAR2_VALUE: varcharValue,
+          NUMBER_VALUE: numbervalue,
+          DATE_VALUE: dateValue
+        });
+      }
+
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        y.VARCHAR2_VALUE = varcharValue;
+        y.NUMBER_VALUE = numbervalue;
+        y.DATE_VALUE = dateValue;
+        y.SEGMENT_VALUE_DSP = textValue;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+        this.updatedValues.push(y);
+      } else {
+        if (this.validateEitObj && this.eitSubmitAction == EIT_ACTION.UPDATE) {
+          let updatedObj = this.validateEitObj.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.eitDffResponse[i].APPLICATION_COLUMN_NAME
+          );
+          let y = updatedObj;
+          y.VARCHAR2_VALUE = varcharValue;
+          y.NUMBER_VALUE = numbervalue;
+          y.DATE_VALUE = dateValue;
+          y.SEGMENT_VALUE_DSP = textValue;
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        } else {
+          let y = {
+            TRANSACTION_NUMBER: transNo,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue,
+            SEGMENT_VALUE_DSP: textValue,
+            APPLICATION_COLUMN_NAME: this.eitDffResponse[i]
+              .APPLICATION_COLUMN_NAME,
+            DATATYPE: this.eitDffResponse[i].DATATYPE,
+            DESC_FLEX_CONTEXT_CODE: this.eitDffResponse[i].DESC_FLEX_CONTEXT_CODE,
+            DESC_FLEX_NAME: this.eitDffResponse[i].DESC_FLEX_NAME,
+            DISPLAY_FLAG: this.eitDffResponse[i].DISPLAY_FLAG,
+            SEGMENT_NAME: this.eitDffResponse[i].SEGMENT_NAME,
+            SEGMENT_PROMPT: this.eitDffResponse[i].SEGMENT_PROMPT
+          };
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        }
+      }
+    } // end for
+
+    if (this.getPassdirfromNotifiPage) {
+      let updatedObj1 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_ACTION"
+      );
+      let updatedObj2 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_EXTRA_INFO_ID"
+      );
+      let updatedObj3 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_OBJECT_VERSION_NUMBER"
+      );
+      this.updatedValues.push(updatedObj1);
+      this.updatedValues.push(updatedObj2);
+      this.updatedValues.push(updatedObj3);
+      valuseArr = this.fillExtraInformation(
+        valuseArr,
+        updatedObj1.VARCHAR2_VALUE,
+        updatedObj2.NUMBER_VALUE,
+        updatedObj3.NUMBER_VALUE,
+        transNo
+      );
+    } else {
+      if (this.eitSubmitAction == EIT_ACTION.ADD) {
+        this.updatedValues = this.fillExtraValuesUpdated(
+          this.updatedValues,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.UPDATE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "UPDATE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.DELETE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "DELETE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      }
+    }
+    return valuseArr;
+  } // end getElementsValues
+
+  fillExtraValuesUpdated(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    let obj1 = {
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null,
+      SEGMENT_VALUE_DSP: "",
+      APPLICATION_COLUMN_NAME: "PEI_ACTION",
+      DATATYPE: "VARCHAR2",
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj2 = {
+      TRANSACTION_NUMBER: 1,
+      APPLICATION_COLUMN_NAME: "PEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATATYPE: "NUMBER",
+      SEGMENT_VALUE_DSP: "",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj3 = {
+      APPLICATION_COLUMN_NAME: "PEI_EXTRA_INFO_ID",
+      DATATYPE: "NUMBER",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      NUMBER_VALUE: peiExtraInfoID,
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: "",
+      SEGMENT_VALUE_DSP: "",
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: null
+    };
+    values.push(obj1);
+    values.push(obj2);
+    values.push(obj3);
+    return values;
+  }
+
+  fillExtraInformation(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_ACTION",
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_EXTRA_INFO_ID",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiExtraInfoID,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATE_VALUE: null
+    });
+    return values;
+  }
+
+  fixTransactionNo(transactionTBL: any): any[] {
+    let list: any = [];
+    let newIndex: number = 1;
+    let length: number = transactionTBL.length;
+    if (length > 0) {
+      for (let i = 0; i < length; i++) {
+        //  let item :any={};
+        const item = Object.assign({}, transactionTBL[i]);
+        let transNo: number = item.TRANSACTION_NUMBER;
+        let obj: any = item;
+        if (i == 0) {
+          obj.TRANSACTION_NUMBER = newIndex;
+          list.push(obj);
+        } else {
+          let prevEl: any = transactionTBL[i - 1].TRANSACTION_NUMBER;
+          if (transNo == prevEl) {
+            obj.TRANSACTION_NUMBER = newIndex;
+            list.push(obj);
+          } else {
+            newIndex++;
+            obj.TRANSACTION_NUMBER = newIndex;
+            list.push(obj);
+          }
+        }
+      }
+    }
+    return list;
+  }
+
+  public handledetailsResult(result) {
+    if (this.cs.validResponse(result)) {
+      this.cs.sharedService.setSharedData(this.basicRequest, BasicRequest.SHARED_DATA);
+      this.cs.sharedService.setSharedData(result.SubmitContactTransactionList, 'contact-details-response');
+      // this.cs.sharedService.setSharedData({ isResubmit: false },"confirmAddEITData");
+      this.cs.confirmContact();
+    }
+  }
+  public calcDay() {
+
+  }
+  public submitTransaction() {
+    var allStatisDynamicValues = [];
+
+
+    if (this.isDelete) {
+      allStatisDynamicValues.push({
+        TRANSACTION_NUMBER: 1,
+        NAME: 'DATE_END',
+        VARCHAR2_VALUE: null,
+        NUMBER_VALUE: null,
+        DATE_VALUE: this.cs.formatDate(this.endDate)
+      });
+    } else {
+      this.arrValues = this.getElementsValues();
+      var dffvalues = this.getElementsValuesDff();
+      let staticValues = this.getElementsStaticValues();
+      allStatisDynamicValues = dffvalues.concat(this.arrValues.concat(staticValues));
+    }
+    if (allStatisDynamicValues) {
+      this.basicRequest = {
+        P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+        P_MENU_TYPE: this.selMenu.List_Menu.MENU_TYPE,
+        P_SELECTED_RESP_ID: this.respID,
+        P_FUNCTION_NAME: this.selMenu.GetMenuEntriesList.FUNCTION_NAME,
+        EITTransactionTBL: allStatisDynamicValues,
+        P_CONTACT_RELATIONSHIP_ID: this.employeeBasicDetails.length > 0 || this.isDelete ? this.selctedContact['CONTACT_RELATIONSHIP_ID'] : null,
+        P_ACTION: this.employeeBasicDetails.length > 0 ? 'UPDATE' : this.isDelete ? 'DELETE' : 'ADD'
+      };
+      console.log(this.basicRequest);
+
+      this.profileService.submitContactTransaction(this.basicRequest).subscribe((result: any) => {
+        this.handledetailsResult(result);
+      });
+    }
+  }
+
+}
diff --git a/Mohem/src/app/profile/confirm-address/confirm-address.component.ts b/Mohem/src/app/profile/confirm-address/confirm-address.component.ts
index 20b0a474..fb51f580 100644
--- a/Mohem/src/app/profile/confirm-address/confirm-address.component.ts
+++ b/Mohem/src/app/profile/confirm-address/confirm-address.component.ts
@@ -10,6 +10,7 @@ import { SubmitEitModalComponent } from 'src/app/eit/submit-eit-modal/submit-eit
 import { CommonService } from 'src/app/hmg-common/services/common/common.service';
 import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
 import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { HomeComponent } from 'src/app/notification/home/home.component';
 import { EITNotificatonBodyResponse } from 'src/app/notification/models/EITNotificationBodyRes';
 import { WorkListButtonRequest } from 'src/app/notification/models/NotificationButtonReq';
 import { WorkListAttachViewComponent } from 'src/app/notification/work-list-attach-view/work-list-attach-view.component';
@@ -62,7 +63,7 @@ export class ConfirmAddressComponent implements OnInit {
   indexLastObj: any = 0;
   filterAllowedType: any = ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
   direction: string;
-
+  isContact: boolean;
 
   constructor(public modalController: ModalController, public cs: CommonService, private ts: TranslatorService, private eitService: EitService, public profileService: ProfileService) {
     this.direction = TranslatorService.getCurrentLanguageName()
@@ -98,8 +99,17 @@ export class ConfirmAddressComponent implements OnInit {
     this.menuType = this.selMenu.List_Menu.MENU_TYPE;
     this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
     this.addrespList = this.cs.sharedService.getSharedData(AddEitResponse.SHARED_DATA, false);
-    this.itemKey = this.addrespList.SubmitAddressTransactionList.P_ITEM_KEY;
-    this.P_TransactionID = this.addrespList.SubmitAddressTransactionList.P_TRANSACTION_ID;
+
+    this.isContact = this.cs.sharedService.getSharedData(AddEitResponse.isContact);
+    if (this.isContact) {
+      this.itemKey = this.addrespList.SubmitPhonesTransactionList.P_ITEM_KEY;
+      this.P_TransactionID = this.addrespList.SubmitPhonesTransactionList.P_TRANSACTION_ID;
+      this.headerTitle = this.ts.trPK('general', 'contact');
+    } else {
+      this.itemKey = this.addrespList.SubmitAddressTransactionList.P_ITEM_KEY;
+      this.P_TransactionID = this.addrespList.SubmitAddressTransactionList.P_TRANSACTION_ID;
+    }
+
     this.isDelete = this.isResubmitEIT = this.cs.sharedService.getSharedData('confirmAddEITData', false).isDelete;
 
 
@@ -153,7 +163,11 @@ export class ConfirmAddressComponent implements OnInit {
           this.handleAddAttachmentResults(result);
         });
     } else {
-      this.startEITApprovalProcess();
+      if (this.isContact) {
+        this.startEITContactApprovalProcess();
+      } else {
+        this.startEITApprovalProcess();
+      }
     }
     //  }
   }
@@ -179,7 +193,11 @@ export class ConfirmAddressComponent implements OnInit {
       } // end for
 
       if (this.isTrue == result.AddAttSuccessList.length) {
-        this.startEITApprovalProcess();
+        if (this.isContact) {
+          this.startEITContactApprovalProcess();
+        } else {
+          this.startEITApprovalProcess();
+        }
       }
       else {
         //stope
@@ -193,6 +211,24 @@ export class ConfirmAddressComponent implements OnInit {
     }
   }
 
+
+  startEITContactApprovalProcess() {
+    let request: any = {};
+    request.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp;
+    request.P_MENU_TYPE = this.menuType;
+    request.P_SELECTED_RESP_ID = this.respID;
+    request.P_TRANSACTION_ID = this.P_TransactionID;
+    request.P_ITEM_KEY = this.itemKey;
+    request.P_ACTION_MODE = this.pActionMode;
+    request.P_COMMENTS = this.eitComments;
+    this.profileService.startPhoneApprovalProcess(
+      request).
+      subscribe((result: any) => {
+        this.handleResults(result);
+      });
+  }
+
+
   startEITApprovalProcess() {
     let request: any = {};
     request.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp;
@@ -229,12 +265,14 @@ export class ConfirmAddressComponent implements OnInit {
     if (this.cs.validResponse(result)) {
       this.isSubmitBtnClicked = true;
       //if(this.isResubmitEIT==false){
-      let msg: string = this.ts.trPK("eit", "approval-message-success");
-      this.cs.presentAlert(msg);
+      // let msg: string = this.ts.trPK("eit", "approval-message-success");
+      // this.cs.presentAlert(msg);
+      this.cs.greenToastPK("eit", "approval-message-success")
       // }
       // this.navCtrl.popToRoot();
-
+      this.cs.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       // this.cs.openHome();
+      //this.cs.setTotalNumberOfWorklistRequest(true);
       this.cs.openNotificationPage();
     }
   }
diff --git a/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.ts b/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.ts
index ef49d9e4..8b34d7f4 100644
--- a/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.ts
+++ b/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.ts
@@ -15,6 +15,7 @@ import { WorkListButtonRequest } from 'src/app/notification/models/NotificationB
 import { WorkListAttachViewComponent } from 'src/app/notification/work-list-attach-view/work-list-attach-view.component';
 import { ProfileService } from '../service/profile.service';
 import { SubmitAddressModalComponent } from '../submit-eit-modal/submit-address-modal.component';
+import { HomeComponent } from 'src/app/notification/home/home.component';
 
 @Component({
   selector: 'app-confirm-basic-details',
@@ -77,7 +78,7 @@ export class ConfirmBasicDetailsComponent implements OnInit {
     this.basicRequest = this.cs.sharedService.getSharedData(BasicRequest.SHARED_DATA, false);
 
     this.selEmp = this.basicRequest.P_SELECTED_EMPLOYEE_NUMBER;
-    
+
     this.menuType = this.selMenu.List_Menu.MENU_TYPE;
     this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
     this.basicResponseList = this.cs.sharedService.getSharedData('basic-details-response', false);
@@ -87,7 +88,7 @@ export class ConfirmBasicDetailsComponent implements OnInit {
     // this.isDelete = this.isResubmitEIT = this.cs.sharedService.getSharedData('confirmAddEITData', false).isDelete;
 
     this.getApproversList();
-    
+
   }
 
   getApproversList() {
@@ -98,7 +99,7 @@ export class ConfirmBasicDetailsComponent implements OnInit {
       P_PAGE_LIMIT: 1000
     }
     this.eitService.getApproversList(body).subscribe((result: any) => {
-        this.handleApproversResult(result);
+      this.handleApproversResult(result);
     });
   }
 
@@ -191,8 +192,10 @@ export class ConfirmBasicDetailsComponent implements OnInit {
   handleResults(result) {
     if (this.cs.validResponse(result)) {
       this.isSubmitBtnClicked = true;
-      let msg: string = this.ts.trPK("eit", "approval-message-success");
-      this.cs.presentAlert(msg);
+      // let msg: string = this.ts.trPK("eit", "approval-message-success");
+      // this.cs.presentAlert(msg);
+      this.cs.greenToastPK("eit", "approval-message-success");
+      this.cs.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
       this.cs.openNotificationPage();
     }
   }
@@ -301,7 +304,7 @@ export class ConfirmBasicDetailsComponent implements OnInit {
 
     modal.onDidDismiss()
       .then((data) => {
-    });
+      });
     return await modal.present();
   }
 
@@ -430,6 +433,6 @@ export class ConfirmBasicDetailsComponent implements OnInit {
     } catch (e) {
     }
   }
-  
+
 }
 
diff --git a/Mohem/src/app/profile/confirm-contact/confirm-contact.component.html b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.html
new file mode 100644
index 00000000..0505227b
--- /dev/null
+++ b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.html
@@ -0,0 +1,128 @@
+<ion-header>
+  <ion-toolbar class="header-toolbar-new">
+    <nav-buttons></nav-buttons>
+    <ion-title [ngClass]=" direction === 'en' ?  'title' : 'title-ar'"  color="light">{{headerTitle}}</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+
+<ion-content>
+<!-------------------------------Start New design ---------------------------------------->
+<ion-grid>
+  <ion-row style="margin-top: 20px;margin-left: 12px;">
+  <ion-col>
+  <div size="10" [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'" >{{'general, addAttach' | translate}}</div>
+  </ion-col>
+  <ion-col style="padding-left: 7%;" size="2">
+    <div class="fileDiv">
+       <input end class="inputfile" style="margin-top: 10px;z-index: 99999;position: absolute;opacity: 0;" type="file" ng2FileSelect [uploader]="uploader"
+        (change)="onFileSelected($event)" (click)="onFileSelectedclick($event)" />
+      <label end for="file" class="attachLable">
+        <ion-icon style="font-size: 22px;" name="add"></ion-icon>
+      </label></div>
+  </ion-col>
+</ion-row>
+  <ion-item class="attachmentDiv" *ngIf="attachListOver?.length == 0">
+      <ion-img style="height: 26px;width:100%;margin-top:12px" src="../assets/imgs/attach-icon.png"></ion-img>
+      <ion-label style="margin-top: -24px;" position="floating" class="boldTxtNav">{{ 'general, notAttch' | translate}}</ion-label>
+  </ion-item>
+</ion-grid>
+
+<ion-grid class="attachmentDiv" *ngIf="attachListOver?.length > 0">
+  <div *ngFor="let attachList of attachListOver ; let i = index">
+    <ion-row>
+      <ion-col size="1">
+        <ion-label style="color: black !important;">
+          {{attachList.AttachmentID +1 }} .
+         </ion-label>
+      </ion-col>
+      <ion-col style="text-align: left;" size="10">
+        <ion-label style="color: blue !important;" (click)="OpenAttachFiles(attachList.P_FILE_DATA,attachList.P_FILE_CONTENT_TYPE)">
+          {{attachList.P_FILE_NAME }}
+         </ion-label>
+      </ion-col>
+      <ion-col size="1">
+        <button float-end [disabled]="attachList.isSuccess" class="attachImgBtn removeLable"
+          (click)="removeFile(attachList)">
+          <ion-icon style="font-size:22px;margin-left:-7px;margin-top:-2px;" name="close"></ion-icon>
+        </button>
+         
+        </ion-col>
+    </ion-row>
+  </div>
+
+</ion-grid>
+<ion-grid *ngIf="attachmentRes?.length > 0">
+  <div *ngFor="let attachRes of attachmentRes">
+    <ion-row>
+      <ion-col col-8>
+        <div> <img float-start class="attachImg" src="../assets/imgs/file.png">
+        </div>
+        <ion-label>
+          {{attachRes.FILE_NAME }} </ion-label>
+
+      </ion-col>
+      <ion-col col-4>
+        <button float-end class="attachImgBtn"
+          (click)="OpenAttachFiles(attachRes.FILE_DATA,attachRes.FILE_CONTENT_TYPE)">
+          <img class="attachImg" src="../assets/imgs/view.png">
+        </button>
+        <button float-end [disabled]="!isResubmitEIT" class="attachImgBtn" (click)="delelteFile(attachRes)"><img
+            class="attachImg" src="../assets/imgs/deletegray.png"></button>
+      </ion-col>
+    </ion-row>
+  </div>
+
+</ion-grid>
+
+
+<ion-grid class="">
+  <div  [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'">{{'confirmAddEit, comment' | translate}}</div>
+ <ion-item class="submitNote" lines="none">
+   <ion-textarea type="text"  [(ngModel)]="eitComments"></ion-textarea>
+ </ion-item>
+</ion-grid>
+
+<ion-grid class="approvalList">
+ <div  [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'">{{'confirmAddEit, approverList' | translate}}</div>
+ <div class="noDataDiv" *ngIf="approversList?.length == 0">
+   <p>{{ 'general, empty' | translate}}</p>
+</div>
+<div style="background-color: white;border-radius: 32px;border: 1px solid #c8c4c4;"  *ngIf="approversList?.length > 0">
+   <ion-list class="notification-list ">
+       <div class="timeline">
+           <ion-item style="padding-left: 4%;" *ngFor="let employee of approversList">
+
+               <div class="timeline-item" slot="start">
+                   <div [class]="direction == 'en'? 'timeline-thumb-en  timeline-icon': 'timeline-thumb-ar  timeline-icon'">
+                       <img *ngIf="employee.EMPLOYEE_IMAGE" class="empImge"
+                           [src]="'data:image/png;base64,'+employee.EMPLOYEE_IMAGE">
+                       <img *ngIf="employee.EMPLOYEE_IMAGE == null" class="empImge"
+                           src="../assets/imgs/profile.png"> </div>
+               </div>
+               <ion-col>
+                   <ion-label style="color:black !important ;font-weight: bold;padding-top: 0%;">
+                       {{employee.APPROVER}}
+                   </ion-label>
+                   <ion-label style="color:black !important ;padding-top: 4%;">
+                     {{employee.POSITION_TITLE}}
+                 </ion-label>
+                  
+               </ion-col>
+               <div class="line"></div>
+           </ion-item>
+       </div>
+   </ion-list>
+</div>
+
+</ion-grid>
+
+
+</ion-content>
+
+<ion-footer>
+  <div class="centerDiv">
+    <ion-button class="confirmEitOkButton" color="customnavy" ion-button (click)="openSubmitModal()">
+      {{ 'general, submit' | translate }}</ion-button>
+  </div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss
new file mode 100644
index 00000000..2ed98379
--- /dev/null
+++ b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss
@@ -0,0 +1,263 @@
+.footer-button {
+    border-radius: 2px;
+    padding: 0 1.1em;
+    min-height: 45px;
+    min-width: 200px;
+  }
+  
+  .imgSize {
+    width: 22px;
+    height: 22px;
+  }
+  
+  .Header {
+    font-weight: bold;
+    color: #1a586d !important;
+    font-size: 10px;
+  }
+  
+  .tbData {
+    font-size: 10px;
+  }
+  
+  .btnBack {
+    background: transparent;
+    float: right;
+  }
+  
+  .attachmentDiv{
+    background: #ffffff;
+    height: auto;
+    text-align: center;
+    padding-top: 1px;
+    margin: 10px;
+    border-radius: 15px;
+    border: 1px solid grey;
+  }
+  
+  .noDataDiv{
+    background: #ffffff;
+    height: 11%;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 10px;
+    margin: 10px;
+    border-radius: 5px;
+  }
+  .submitNote{
+    background: #ffffff;
+    height: 80px;
+    padding-top: 1px;
+    margin: 10px;
+    border-radius: 15px;
+    border: 1px solid grey;
+  }
+  
+  .approvalList{
+    --background: #f0efef;
+    height: auto;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 10px;
+    margin: 10px;
+    border-radius: 5px;
+  }
+  
+  /************************New Design**********************************/
+  .notification-list{
+    background: none;
+    background: none;
+    border-radius: 32px;
+    ion-item{
+        // margin-top: 5px;
+        // margin-bottom: 5px;
+      
+        background-color: transparent;
+        .item-date{
+            width: 100%;
+            font-size: 16px;
+            font-weight: bold;
+         
+            text-align: start;
+            padding: 0;
+            margin: 0;
+         
+            position: absolute;
+            left: 0;
+            top: 12%;
+        }
+        ion-label , [item-end]{
+        
+            white-space: normal;
+            font-size: 14px;
+            padding-top: 15%;
+            // :root[dir="ltr"]{
+            //     margin-left: 10px;
+            // }
+            // :root[dir="rtl"]{
+            //     margin-right: 10px;
+            // }
+            
+        }
+  
+    }
+  }
+  
+  
+  
+  
+  
+  
+  .timeline {
+      position: relative;
+      margin: 15px 0 0 0;
+    //   border-bottom: solid 1px var(--cusgray);
+  }
+  
+  .timeline:before {
+   
+    content: '';
+    position: inherit !important;
+    top: 0;
+    bottom: 0;
+    width: 4px;
+    // background: #e4e4e4;
+    z-index: 1;
+    left: 35px;
+    /* margin-left: -10px; */
+    /* z-index: 1; */
+  }
+  
+  .timeline .timeline-thumb {
+   
+    border-radius: 500px;
+    width: 70px !important;
+    z-index: 2;
+    position: absolute;
+    left: 0px;
+    // :root[dir="ltr"]{
+    //    left: 37px;
+    // }
+    // :root[dir="rtl"]{
+    //     right: 37px;
+    // }
+    float: right;
+    top: 9px;
+  }
+  
+  .timeline .timeline-thumb.timeline-icon {
+      height: 70px;
+    //   text-align: center;
+    //   color: white;
+    //   border: 5px solid #CBD0D3;
+    //   transform: scale(0.2);
+  }
+  
+  
+  
+  .timeline .timeline-item {
+    width: 40px;
+  
+  }
+  
+  .timeline .timeline-stats {
+      position: relative;
+      font-size: 12px;
+      color: var(--darkgray);
+    
+  }
+  
+  .empImge{
+    border-radius: 50%;
+    width:100%;
+    height: 100%;
+    border: #dedede solid 1px;
+  
+  }
+  .empImgeRep {
+    border-radius: 50% !important;
+    width: 80px;
+    height: 80px;
+    border: #dedede solid 1px;
+  }
+  
+  .line{
+    padding-bottom:87px;
+  }
+  
+  .attachLable{
+    position: absolute;
+      top: 0px;
+      z-index: 0;
+      background: #30b8c6;
+      color: #fff;
+      border-radius: 50%;
+      border: 0px;
+      width: 24px;
+      height: 24px;
+      text-align: center;
+      font-size: 5px;
+  }
+  
+  .removeLable{
+    top: 0px;
+    z-index: 0;
+    background: #d8252d;
+    color: #fff;
+    border-radius: 50%;
+    border: 0px;
+    width: 20px;
+    height: 20px;
+    text-align: center;
+    font-size: 5px;
+  }
+  
+  .note-modal {
+    // width: 90%;
+    // height: 50%;
+    // top: 20%;
+    // left: 5%;
+    // right: 5%;
+    // bottom: 5%;
+    background: rgba(0, 0, 0, 0.5) !important;
+    padding: 30% 10% !important;
+    --height: 12cm !important;
+    // --width: 80% !important;
+    --border-radius:20px;
+    
+  }
+  .header-toolbar-new{
+    --background: #269DB8;
+  }
+  .title{
+    margin-top: -37px;
+    margin-left: 85px;
+  }
+  .title-ar{
+    margin-top: -37px;
+      margin-right: 101px;
+  }
+  .confirmEitOkButton{
+    white-space: normal !important;
+    text-transform: capitalize !important;
+    min-height: 45px !important;
+    min-width: 5px !important;
+    margin: 8px !important;
+    background-color: #269DB8;
+    width: 80% !important;
+    color: white!important;
+    border-radius: 16px !important;
+  }
+  
+  .approvalTitle-ar{
+    font-weight: bold;
+    font-size: 16px;
+    text-align: right;
+  
+  }
+  .approvalTitle{
+    font-weight: bold;
+    font-size: 16px;
+    text-align: left;
+  }
+  
\ No newline at end of file
diff --git a/Mohem/src/app/profile/confirm-contact/confirm-contact.component.spec.ts b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.spec.ts
new file mode 100644
index 00000000..6a25647a
--- /dev/null
+++ b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConfirmContactComponent } from './confirm-contact.component';
+
+describe('ConfirmContactComponent', () => {
+  let component: ConfirmContactComponent;
+  let fixture: ComponentFixture<ConfirmContactComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ConfirmContactComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConfirmContactComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/profile/confirm-contact/confirm-contact.component.ts b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.ts
new file mode 100644
index 00000000..894fb16e
--- /dev/null
+++ b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.ts
@@ -0,0 +1,438 @@
+import { Component, OnInit } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { FileUploader } from 'ng2-file-upload';
+import { AddAttachComponent } from 'src/app/eit/add-attach/add-attach.component';
+import { AddEitResponse } from 'src/app/eit/models/add.eit.response';
+import { BasicRequest } from "../models/basic.request";
+import { NotificationGetAttachResponse } from 'src/app/eit/models/NotificationGetAttachRes';
+import { EitService } from 'src/app/eit/services/eit.service';
+import { SubmitEitModalComponent } from 'src/app/eit/submit-eit-modal/submit-eit-modal.component';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { EITNotificatonBodyResponse } from 'src/app/notification/models/EITNotificationBodyRes';
+import { WorkListButtonRequest } from 'src/app/notification/models/NotificationButtonReq';
+import { WorkListAttachViewComponent } from 'src/app/notification/work-list-attach-view/work-list-attach-view.component';
+import { ProfileService } from '../service/profile.service';
+import { SubmitAddressModalComponent } from '../submit-eit-modal/submit-address-modal.component';
+import { HomeComponent } from 'src/app/notification/home/home.component';
+
+
+@Component({
+  selector: 'app-confirm-contact',
+  templateUrl: './confirm-contact.component.html',
+  styleUrls: ['./confirm-contact.component.scss'],
+})
+export class ConfirmContactComponent implements OnInit {
+
+  private P_TransactionID: number;
+  private basicRequest: BasicRequest;
+  approversList = [];
+  basicResponseList: any;
+  eitComments: string = "";
+  menuType: string = "";
+  selEmp: string = "";
+  respID: number;
+  selMenu: MenuResponse;
+  getAttachList: any;
+  attachListDisplay: any = [];
+  headerTitle: string = "";
+  isTrue: any = 0;
+  attachItems: any;
+  public isResubmitEIT: boolean = false;
+  private itemKey: string = "";
+  private pActionMode: string = "SUBMIT";
+  attachReqObj: WorkListButtonRequest = new WorkListButtonRequest();
+  attachmentRes: any;
+  objIndex1: any;
+  attachListOver: any = [];
+  index: any = 0;
+  getPassNotificationDetails: any;
+  isSubmitBtnClicked: boolean;
+  // isDelete: boolean = false;
+
+  /***Add Attchment Vars */
+  isUpload: boolean = false;
+  inQueue: boolean = false;
+  addAttachmentListReq: any;
+  attachmentID: number = 0;
+  addAttachRequest: any = [];
+  fileData: any;
+  fileType: any;
+  dirPage: any;
+  TransactionID: any;
+  indexLastObj: any = 0;
+  filterAllowedType: any = ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
+  direction: string;
+
+
+  constructor(public modalController: ModalController, public cs: CommonService, private ts: TranslatorService, private eitService: EitService, public profileService: ProfileService) {
+    this.direction = TranslatorService.getCurrentLanguageName()
+    this.isSubmitBtnClicked = false;
+    this.basicRequest = new BasicRequest();
+  }
+
+  ngOnInit() {
+    this.selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
+    this.selEmp = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false);
+    this.respID = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_RESP_ID, false);
+    this.basicRequest = this.cs.sharedService.getSharedData(BasicRequest.SHARED_DATA, false);
+
+    this.selEmp = this.basicRequest.P_SELECTED_EMPLOYEE_NUMBER;
+
+    this.menuType = this.selMenu.List_Menu.MENU_TYPE;
+    this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+    this.basicResponseList = this.cs.sharedService.getSharedData('contact-details-response', false);
+    console.log(this.basicResponseList);
+    this.itemKey = this.basicResponseList.P_ITEM_KEY;
+    this.P_TransactionID = this.basicResponseList.P_TRANSACTION_ID;
+    // this.isDelete = this.isResubmitEIT = this.cs.sharedService.getSharedData('confirmAddEITData', false).isDelete;
+
+    this.getApproversList();
+
+  }
+
+  getApproversList() {
+    let body: any = {
+      P_TRANSACTION_ID: this.P_TransactionID,
+      P_AME_TRANSACTION_TYPE: "SSHRMS",
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    }
+    this.eitService.getApproversList(body).subscribe((result: any) => {
+      this.handleApproversResult(result);
+    });
+  }
+
+  handleApproversResult(result) {
+    if (this.cs.validResponse(result)) {
+      this.approversList = result.GetApprovesList;
+    }
+  }
+
+  startEitApproval() {
+    if (this.attachListOver) {
+      let request = {
+        AddAttachmentList: this.attachListOver
+      }
+
+      this.eitService.addAttachment(
+        request).
+        subscribe((result: any) => {
+          this.handleAddAttachmentResults(result);
+        });
+    } else {
+      this.startContactApprovalProcess();
+    }
+  }
+
+
+  handleAddAttachmentResults(result) {
+
+    if (this.cs.validResponse(result)) {
+      this.isTrue = 0;
+      for (let i = 0; i < result.AddAttSuccessList.length; i++) {
+        if (!result.AddAttSuccessList[i].AddSuccess) {
+          this.attachListOver[i].isSuccess = false;
+          //this.attachItems[i].isSuccess = false;
+          // if false display cancel button with waring icon or design
+        }// end if
+        else {
+          // if true remove cancel and set isSuccess = true
+          // this.attachItems[i].isSuccess = true;
+          this.attachListOver[i].isSuccess = true;
+          this.isTrue = this.isTrue + 1; //count flag of attach status
+        } //  end else
+      } // end for
+
+      if (this.isTrue == result.AddAttSuccessList.length) {
+        this.startContactApprovalProcess();
+      }
+      else {
+        //stope
+        let filtered = this.attachListOver.filter(function (el) { return el.isSuccess == true; });
+        this.attachListOver = filtered;
+        let msg: string = "";
+        msg = this.ts.trPK("eit", "attach-errorMsg");
+        this.cs.presentAlert(msg);
+      }
+    }
+  }
+
+  startContactApprovalProcess() {
+    let request: any = {};
+    request.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp;
+    request.P_MENU_TYPE = this.menuType;
+    request.P_SELECTED_RESP_ID = this.respID;
+    request.P_TRANSACTION_ID = this.P_TransactionID;
+    request.P_ITEM_KEY = this.itemKey;
+    request.P_ACTION_MODE = this.pActionMode;
+    request.P_COMMENTS = this.eitComments;
+    this.profileService.startContactApprovalProcess(
+      request).
+      subscribe((result: any) => {
+        this.handleResults(result);
+      });
+  }
+  cancelEitProcess() {
+    let body: any = {
+      P_TRANSACTION_ID: this.P_TransactionID
+    }
+    this.eitService.cancelHRTransaction(
+      body).
+      subscribe((result: any) => {
+        this.handleCancelResults(result);
+      });
+
+  }
+  handleCancelResults(result) {
+    if (this.cs.validResponse(result)) {
+      this.isSubmitBtnClicked = false;
+    }
+  }
+  handleResults(result) {
+    if (this.cs.validResponse(result)) {
+      this.isSubmitBtnClicked = true;
+      // let msg: string = this.ts.trPK("eit", "approval-message-success");
+      // this.cs.presentAlert(msg);
+      this.cs.greenToastPK("eit", "approval-message-success");
+      this.cs.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
+      this.cs.openNotificationPage();
+    }
+  }
+
+  async addAttachment(str: boolean, attachItems: any) {
+    //open the modal with return data
+    let attachDocID = attachItems.ATTACHED_DOCUMENT_ID;
+
+    this.cs.sharedService.setSharedData(this.P_TransactionID, 'TransactionID');
+    this.cs.sharedService.setSharedData(this.attachListOver.length, 'indexLastObj');
+
+    const modal = await this.modalController.create({
+      component: AddAttachComponent
+    });
+
+    modal.onDidDismiss()
+      .then((data) => {
+        if (data == "cancel" || data == "undefined") {
+          return;
+        } else {
+          if (!str) {
+            this.updateFile(data, attachDocID);
+          } else {
+            console.log(data);
+            this.attachListDisplay = data.data;
+            this.attachItems = this.attachListDisplay.map(function (el) {
+              var o = Object.assign({}, el);
+              o.isSuccess = false;
+              return o;
+            });
+
+            this.attachListOver = this.attachListOver ? this.attachListOver.concat(this.attachItems) : this.attachItems;
+          }
+        }
+      });
+
+    return await modal.present();
+  }
+
+  /*****submit modal********/
+  async openSubmitModal() {
+    this.cs.sharedService.setSharedData(this.attachListOver, 'submitAttachmentList');
+    this.cs.sharedService.setSharedData(this.eitComments, 'eitComments');
+    const modal = await this.modalController.create({
+      component: SubmitAddressModalComponent,
+      backdropDismiss: false,
+
+    });
+    modal.cssClass = 'note-modal';
+
+    modal.onDidDismiss()
+      .then((data) => {
+        console.log(data.data);
+
+        if (data.data == "cancel" || data.data == undefined) {
+          return;
+        } else {
+          this.startEitApproval();
+        }
+      });
+
+    return await modal.present();
+  }
+
+
+
+  removeFile(objectitem) {
+    if (this.attachListOver) {
+      let index2 = this.attachListOver.findIndex(item => item == objectitem);
+      if (index2 > -1) {
+        this.attachListOver.splice(index2, 1);
+      }
+    }
+    if (this.attachmentRes) {
+      let index3 = this.attachmentRes.findIndex(item => item == objectitem);
+      if (index3 > -1) {
+        this.attachmentRes.splice(index3, 1);
+      }
+    }
+
+  }
+
+
+  getAttachment(NotificationID) {
+    this.attachReqObj.P_NOTIFICATION_ID = NotificationID;
+    this.eitService.getAttach(this.attachReqObj).
+      subscribe((result: NotificationGetAttachResponse) => {
+        this.handleWorkListAttachResult(result);
+      });
+  }
+
+  handleWorkListAttachResult(result) {
+    if (this.cs.validResponse(result)) {
+      if (result.GetAttachementList != null) {
+        this.attachmentRes = result.GetAttachementList;
+      } // if result == null
+    } // valid it
+
+  }
+
+  async OpenAttachFiles(value, Type) {
+    this.cs.sharedService.setSharedData({ displayData: value, TypeData: Type }, 'WorkListAttachViewPage');
+    const modal = await this.modalController.create({
+      component: WorkListAttachViewComponent
+    });
+
+    modal.onDidDismiss()
+      .then((data) => {
+      });
+    return await modal.present();
+  }
+
+
+  delelteFile(attach) {
+    this.cs.confirmAlertDialog((data) => {
+      if (data == true) {
+        this.continueDelete(attach);
+      }
+    }, this.ts.trPK('general', 'ok'), () => {
+
+    }, this.ts.trPK('general', 'cancel'), this.ts.trPK('general', 'alert'), this.ts.trPK('eit', 'delete-perm'));
+  }
+
+  continueDelete(attach) {
+    let req = {
+      P_ATTACHED_DOCUMENT_ID: attach.ATTACHED_DOCUMENT_ID
+    }
+    this.eitService.deleteAttach(req).
+      subscribe((result: any) => {
+        if (this.cs.validResponse(result)) {
+          if (result.DeleteAttachmentList.P_RETURN_STATUS === "S") {
+            this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+            let msg: string = "";
+            msg = this.ts.trPK("eit", "deleteAttach");
+            this.cs.presentAlert(msg);
+          }
+        }
+      });
+  }
+
+  updateFile(attachList, attachDocID) {
+    let req = {
+      P_ATTACHED_DOCUMENT_ID: attachDocID,
+      P_FILE_DATA: attachList[0].P_FILE_DATA,
+      P_FILE_NAME: attachList[0].P_FILE_NAME,
+      P_FILE_CONTENT_TYPE: attachList[0].P_FILE_CONTENT_TYPE
+    }
+    this.eitService.updateAttach(req).
+      subscribe((result: any) => {
+        if (this.cs.validResponse(result)) {
+          if (result.MessageStatus == 1) {
+            let msg: string = "";
+            msg = this.ts.trPK("eit", "attachUpdate");
+            this.cs.presentAlert(msg);
+            this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+          }
+        }
+      });
+  }
+
+
+  ionViewWillLeave() {
+    if (this.P_TransactionID && this.isSubmitBtnClicked == false)
+      this.cancelEitProcess();
+  }
+
+  /*******************Add attchement Functions*************/
+
+  public uploader: FileUploader = new FileUploader({
+    allowedMimeType: ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
+    maxFileSize: 10 * 1024 * 1024,
+    formatDataFunctionIsAsync: true,
+    formatDataFunction: async (item) => {
+      return new Promise((resolve, reject) => {
+        resolve({
+          name: item._file.name,
+          length: item._file.size,
+          contentType: item._file.type,
+          date: new Date()
+        });
+      });
+    }
+  });
+
+
+  onFileSelectedclick(event) {
+    event.target.value = '';
+  }
+
+
+
+  onFileSelected(input) {
+
+    if (!(this.filterAllowedType.indexOf(input.target.files[0].type) > -1)) {
+      let msg: string = "";
+      msg = this.ts.trPK("general", "notSupport");
+      this.cs.presentAlert(msg);
+      return
+    }    // todo: show alert that you tried uploading wrong files
+
+    else {
+      const file = input.target.files[0];
+      this.getBase64(file).then(
+        data => this.pushObject(data, file.name, file.type)
+      );
+    }
+  }
+
+
+  getBase64(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.readAsDataURL(file);
+      reader.onload = () => resolve(reader.result);
+      reader.onerror = error => reject(error);
+    });
+  }
+
+
+  pushObject(fileData, name, type) {
+
+    console.log("before push: " + this.index);
+    try {
+      let array = name.split('.');
+      let attachType: string = array[array.length - 1];
+      this.attachListOver.push(
+        {
+          AttachmentID: this.attachListOver.length,
+          P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
+          P_FILE_DATA: fileData.split(',')[1],
+          P_FILE_NAME: name,//.split('.')[0],
+          P_TRANSACTION_ID: this.P_TransactionID
+        })
+
+    } catch (e) {
+    }
+  }
+
+}
diff --git a/Mohem/src/app/profile/contact/contact.component.html b/Mohem/src/app/profile/contact/contact.component.html
new file mode 100644
index 00000000..8fed9814
--- /dev/null
+++ b/Mohem/src/app/profile/contact/contact.component.html
@@ -0,0 +1,53 @@
+<ion-content>
+  <div class="head-title">
+
+    <app-generic-header showImage="false" showBack="true" [headerText]="'general,contact' | translate">
+    </app-generic-header>
+  </div>
+  <div class="header"></div>
+  <div class="bottom"></div>
+<div class="container" id="containerDiv">
+  <ion-card class="add-new-row-card">
+    <div class="new-row" (click)="addNewRow()"> 
+      <p>
+     <img class="add-icons" src="assets/imgs/itemsforsale/add.svg">   {{ts.trPK('general','add-new-row')}}
+    
+      </p>
+    </div>
+  </ion-card>
+  <div class="" *ngFor="let phone of phoneNumbers">
+<ion-card class="phoneContainer" *ngIf="!phone['DELETE_ROW']">
+  <ion-row >
+    <ion-col size="12">
+        <div [ngClass]=" direction === 'en' ?  'custom-text-area-element Field-en' : 'custom-text-area-element Field-ar'" >
+ 
+  <label class="label" position='floating'  class="colBold requiredClass">{{ 'general,select' | translate}} </label>
+  <select name="selectAbsenceType" class="label-Select"  #selectAbsenceType="ngModel" [(ngModel)]="phone.PHONE_TYPE"   required> 
+    <option value="noType" selected hidden selected><p>{{ts.trPK('absenceList','selectType')}}</p></option>
+      <option  *ngFor="let obj of objectValue" [value]="obj.CODE">{{ obj.MEANING}} </option>
+  </select>
+  </div>
+</ion-col>
+<ion-col size="12">
+  <div [ngClass]=" direction === 'en' ?  'custom-text-area-element Field-en' : 'custom-text-area-element Field-ar'" >
+ 
+    <ion-input  class="login-input" required type="tel"  [(ngModel)]="phone.PHONE_NUMBER">
+    </ion-input>
+    </div>
+    </ion-col>
+    <div class="delete-icon" (click)="deleteRow(phone)">
+      <p><img class="icons-delete" src="assets/imgs/itemsforsale/delete.svg">  {{ts.trPK('general','delete')}}</p>
+    </div>
+  </ion-row>
+</ion-card>
+</div>
+</div>
+  </ion-content>
+  <ion-footer>
+    <div class="centerDiv">
+      <ion-button  class="footer-button" style="background: var(--newgreen)!important;border-radius: 10px;    --background: transparent; width:80%" ion-button [disabled]="phoneNumbers.length==0" (click)="updatePhone()">
+        {{'userProfile, update' | translate}}</ion-button>
+        
+    </div>
+  </ion-footer>
+  
\ No newline at end of file
diff --git a/Mohem/src/app/profile/contact/contact.component.scss b/Mohem/src/app/profile/contact/contact.component.scss
new file mode 100644
index 00000000..d67acf74
--- /dev/null
+++ b/Mohem/src/app/profile/contact/contact.component.scss
@@ -0,0 +1,119 @@
+.bold{
+    font-weight: bold;
+    font-size: 16px;
+}
+#containerDiv{
+  
+    margin: 20px 0px;
+}
+.padding{
+    padding-left:5px;
+    padding-right: 5px;
+}
+.color-black{
+    color:#000;
+}
+.date{
+    position: absolute;
+    font-size: 14px;
+    padding: 10px;
+    right:0;
+    width: 100px;
+    color:#969696;
+}
+.transaction-list{
+    margin-top:20px;
+}
+.date-container{
+    margin:0px 20px;
+}
+.colBold{
+    font-size: 12px; 
+}
+.label{
+    font-size: 12px;
+    // margin-left: 15px;
+    color: #a2a5a6 !important;
+    display: block;
+    overflow: hidden;
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    /* font-size: inherit; */
+    // text-overflow: ellipsis;
+    // white-space: nowrap;
+    white-space: normal;
+    // padding-top: 10px;
+    padding: 5px 0px;
+    padding-left: 10px !important;
+    margin: 10px auto;
+
+}
+
+.Field-en{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 15px;
+  padding-left: 10px  !important; 
+  padding-top: 6px !important;
+  color: #999999 !important;
+}
+
+.Field-ar{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 20px;
+  padding-right: 20px  !important; 
+  padding-top: 6px !important;
+  color: #999999 !important;
+}
+select{
+   width: 85% !important;
+    border: none !important;
+    position: relative;
+    bottom: 5px;
+    background: transparent;
+}
+.delete-icon{
+    position: absolute;
+    right: 20px;
+    bottom: -10px;
+    color: #d60505;
+    font-weight: bold;
+}
+.phoneContainer{
+    position: relative;
+    margin-top: 15px;
+    padding: 20px;
+    border-radius: 10px;
+    box-shadow: 0px 0px 3px 0px #ccc
+}
+.new-row{
+  
+    text-align: center;
+    color: #259CB8;
+    font-weight: bold;
+}
+.add-new-row-card{
+    box-shadow: none;
+    background: #d6d6d652;
+    border: 1px solid #ccc;
+}
+.add-icons{
+    height: 22px;
+    width: 22px;
+    display: inline-flex;
+    background: #259CB8;
+    padding: 4px;
+    border-radius: 5px;
+    top: 5px;
+    position: relative;
+}
+.icons-delete{
+    height: 16px;
+    width: 13px;
+  
+    position: relative;
+    display: inline-block;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/profile/contact/contact.component.spec.ts b/Mohem/src/app/profile/contact/contact.component.spec.ts
new file mode 100644
index 00000000..82fb3f20
--- /dev/null
+++ b/Mohem/src/app/profile/contact/contact.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConatactComponent } from './contact.component';
+
+describe('ContactComponent', () => {
+  let component: ConatactComponent;
+  let fixture: ComponentFixture<ConatactComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ConatactComponent],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+      .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConatactComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/profile/contact/contact.component.ts b/Mohem/src/app/profile/contact/contact.component.ts
new file mode 100644
index 00000000..e137b838
--- /dev/null
+++ b/Mohem/src/app/profile/contact/contact.component.ts
@@ -0,0 +1,120 @@
+import { Component, OnInit } from '@angular/core';
+import { AddEitResponse } from 'src/app/eit/models/add.eit.response';
+import { EitRequest } from 'src/app/eit/models/eit.request';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { ProfileService } from '../service/profile.service';
+
+
+@Component({
+  selector: 'app-conatact',
+  templateUrl: './contact.component.html',
+  styleUrls: ['./contact.component.scss'],
+})
+export class ConatactComponent implements OnInit {
+  public phoneNumbers: any = [];
+  public objectValue: any = [];
+  direction: any;
+  selEmp: any;
+  respID: any;
+  selMenu: any;
+  submitrequest: any;
+  constructor(public cs: CommonService, public ts: TranslatorService, public profileService: ProfileService,) {
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.selEmp = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_SEL_EMP,
+      false
+    );
+    this.respID = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_SEL_RESP_ID,
+      false
+    );
+    this.selMenu = new MenuResponse();
+    this.selMenu = this.cs.sharedService.getSharedData(
+      MenuResponse.SHARED_DATA,
+      false
+    );
+
+  }
+
+
+  ngOnInit() {
+    this.phoneNumbers = this.cs.sharedService.getSharedData(ProfileService.EMP_PHONE, false);
+    this.setIsUpdated();
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.getObjectValue();
+  }
+  setIsUpdated() {
+    this.phoneNumbers.forEach(element => {
+      element['ACTION'] = 'UPDATE_ROW';
+    });
+  }
+
+  getObjectValue() {
+    this.profileService.getObjectValue({
+      'P_OBJECT_TYPE': 'LOOKUP',
+      'P_OBJECT_NAME': 'PHONE_TYPE'
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      if (this.cs.validResponse(response)) {
+        console.log(response);
+        this.objectValue = response['GetObjectValuesList'];
+      }
+    })
+  }
+  setIsDeletedStatus() {
+    this.phoneNumbers.forEach(element => {
+      if (element['DELETE_ROW'] == true) {
+        element['ACTION'] = 'DELETE_ROW';
+      }
+    });
+  }
+  updatePhone() {
+
+    this.setIsDeletedStatus();
+    console.log(this.phoneNumbers);
+    this.submitrequest = {
+
+      P_MENU_TYPE: this.selMenu.List_Menu.MENU_TYPE,
+      P_SELECTED_RESP_ID: this.respID, //this.selMenu.List_Menu.RESP_ID,//-999,
+      P_FUNCTION_NAME: this.selMenu.GetMenuEntriesList.FUNCTION_NAME,
+      P_MBL_PHONES_TBL: this.phoneNumbers,
+
+
+
+    };
+    this.profileService.submitPhoneTransaction(this.submitrequest, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      if (this.cs.validResponse(response)) {
+        console.log(response);
+        this.handleSubmitEitResult(response);
+      }
+    })
+    //}
+  }
+
+  addNewRow() {
+    this.phoneNumbers.push({ 'PHONE_NUMBER': '', 'PHONE_TYPE': '', 'ACTION': 'NEW_ROW', 'OBJECT_VERSION_NUMBER': null, 'PHONE_ID': null })
+  }
+  deleteRow(row) {
+    row['DELETE_ROW'] = true;
+    // this.phoneNumbers =
+    //   this.phoneNumbers.filter(item => item !== row);
+    console.log(this.phoneNumbers);
+
+  }
+  handleSubmitEitResult(result) {
+    if (this.cs.validResponse(result)) {
+      this.cs.sharedService.setSharedData(
+        this.submitrequest,
+        EitRequest.SHARED_DATA
+      );
+      this.cs.sharedService.setSharedData(result, AddEitResponse.SHARED_DATA);
+      this.cs.sharedService.setSharedData(true, AddEitResponse.isContact);
+      this.cs.sharedService.setSharedData(
+        { isResubmit: false },
+        "confirmAddEITData"
+      );
+      this.cs.openConfirmAddAddress();
+    }
+  }
+}
diff --git a/Mohem/src/app/profile/edit-profile/edit-profile.component.html b/Mohem/src/app/profile/edit-profile/edit-profile.component.html
index 86ee5a08..ff85343c 100644
--- a/Mohem/src/app/profile/edit-profile/edit-profile.component.html
+++ b/Mohem/src/app/profile/edit-profile/edit-profile.component.html
@@ -74,6 +74,7 @@
                 <label class="rowBolds">{{personalInfo.EMPLOYEE_MOBILE_NUMBER}}</label>
               </ion-row>
             </ion-col>
+        
           </ion-row>
 
           <ion-row style="border-bottom: rgb(190, 187, 187) solid 1px;">
diff --git a/Mohem/src/app/profile/home/home.component.html b/Mohem/src/app/profile/home/home.component.html
index 96b8ea1b..cd3bbece 100644
--- a/Mohem/src/app/profile/home/home.component.html
+++ b/Mohem/src/app/profile/home/home.component.html
@@ -37,25 +37,32 @@
     </div>
     <div class="user-actions">
       <ion-row class="ion-justify-content-center">
-        <ion-col [size]="4" (click)="selectedSegment('personal')">
+        <ion-col [size]="3" (click)="selectedSegment('personal')">
           <div class="action-button col-button">
             <img *ngIf="!personalInfoSegment" style="width: 40px;" src="../assets/imgs/profile-icons/info@2x.png">
             <img *ngIf="personalInfoSegment" style="width: 40px;" src="../assets/imgs/profile-icons/info-a@2x.png">
             <span class="btnTitle">{{ts.trPK('general','personal-info')}}</span>
           </div>
         </ion-col>
-        <ion-col [size]="4" (click)="selectedSegment('basic')">
+        <ion-col [size]="3" (click)="selectedSegment('basic')">
           <div class="action-button col-button">
             <img *ngIf="!basicDetailsSegment" style="width: 40px;" src="../assets/imgs/profile-icons/basic-detail@2x.png">
             <img *ngIf="basicDetailsSegment" style="width: 40px;" src="../assets/imgs/profile-icons/basic-detail@21.png">
             <span class="btnTitle">{{ts.trPK('general','basic-details')}}</span>
           </div>
         </ion-col>
-        <ion-col [size]="4" (click)="selectedSegment('address')">
+        <ion-col [size]="3" (click)="selectedSegment('contact')">
           <div class="action-button col-button">
-            <img *ngIf="!addressSegment" style="width: 40px;" src="../assets/imgs/profile-icons/main-address@2x.png">
-            <img *ngIf="addressSegment" style="width: 40px;" src="../assets/imgs/profile-icons/main address-a@2x.png">
-            <span class="btnTitle">{{ts.trPK('userProfile','address')}} </span>
+            <img *ngIf="!contactSegment" style="width: 40px;" src="../assets/imgs/profile-icons/main-address@2x.png">
+            <img *ngIf="contactSegment" style="width: 40px;" src="../assets/imgs/profile-icons/main address-a@2x.png">
+            <span class="btnTitle">{{ts.trPK('userProfile','contact-details')}} </span>
+          </div>
+        </ion-col>
+        <ion-col [size]="3" (click)="selectedSegment('family')">
+          <div class="action-button col-button">
+            <img *ngIf="!familyMemberSegment" style="width: 40px;" src="../assets/imgs/profile-icons/family.svg">
+            <img *ngIf="familyMemberSegment" style="width: 40px;" src="../assets/imgs/profile-icons/family-g.svg">
+            <span class="btnTitle">{{ts.trPK('userProfile','family-members')}}</span>
           </div>
         </ion-col>
       </ion-row>
@@ -111,6 +118,15 @@
   </div>
 
   <br>
+  <!-- <div style="display: flex; justify-content: center;">
+    <div [ngClass]='profileProgress > 0 && profileProgress >= 25 ? "profile-green":"profile-gray"'></div>
+    <div [ngClass]='profileProgress >= 25 && profileProgress >= 50 ? "profile-green":"profile-gray"'></div>
+    <div [ngClass]='profileProgress >= 50 && profileProgress >= 75? "profile-green":"profile-gray"'></div>
+    <div [ngClass]='profileProgress >= 85  ? "profile-green":"profile-gray"'></div>
+  </div> -->
+  <!-- <div [ngClass]='direction === "ltr"? "profile-compilation-en":"profile-compilation-ar"'>{{ts.trPK('userProfile','profile-compitation')}} {{profileProgress}}%</div> -->
+  <div *ngIf="familyMemberSegment" [ngClass]='direction === "ltr"? "profile-note-en":"profile-note-ar"'>{{ts.trPK('userProfile','note-part-1')}}<br>
+    {{ts.trPK('userProfile','note-part-2')}}</div>
 
   <ion-card *ngIf="personalInfoSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
     <ion-card-content>
@@ -123,10 +139,19 @@
       </ion-label>
       <h3 [ngClass]="direction === 'ltr'? 'result-label-text-form': 'result-label-text-form-ar' ">{{personalInfo.EMPLOYMENT_CATEGORY_MEANING}}</h3>
       <br>
+      <ion-row>
       <ion-label>
         <h3 [ngClass]="direction === 'ltr'? 'type-label-text-form': 'type-label-text-form-ar' ">{{ts.trPK('userProfile','phone-no')}}</h3>
       </ion-label>
+  
+      <ion-col size="11">
       <h3 [ngClass]="direction === 'ltr'? 'result-label-text-form': 'result-label-text-form-ar' ">{{personalInfo.EMPLOYEE_MOBILE_NUMBER}}</h3>
+     </ion-col>
+      <!-- <ion-col size="1" class="create-edit">
+        <ion-icon name="create" *ngIf="personalInfo.EMPLOYEE_MOBILE_NUMBER" (click)="editPhone()"></ion-icon>
+        <ion-icon name="add-circle" *ngIf="!personalInfo.EMPLOYEE_MOBILE_NUMBER" (click)="createPhone()"></ion-icon>
+      </ion-col> -->
+    </ion-row>
       <br>
       <ion-label>
         <h3 [ngClass]="direction === 'ltr'? 'type-label-text-form': 'type-label-text-form-ar' ">{{ts.trPK('userProfile','busG')}}</h3>
@@ -144,7 +169,7 @@
   <ion-card *ngIf="basicDetailsSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
     <ion-card-content *ngIf="!editBasic && employeeBasicDetails">
       <ion-grid>
-        <ion-row style="width: 113%;">
+        <ion-row [style]="direction == 'ltr' ? 'width: 113%;' : 'width:95%'">
           <ion-col size="10">
             <ion-label>
               <h1 [ngClass]="direction === 'ltr'? 'header-label-text-form': 'header-label-text-form-ar' ">{{ts.trPK('general','basic-details')}}</h1>
@@ -184,6 +209,42 @@
     </ion-card-content>
   </ion-card>
 
+  <ion-card *ngIf="contactSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
+    <ion-card-content *ngIf="!editAddress && employeeAdress">
+      <ion-grid>
+        <ion-row style="width: 113%;">
+          <ion-col size="10">
+            <ion-label>
+              <h1 [ngClass]="direction === 'ltr'? 'header-label-text-form': 'header-label-text-form-ar' ">{{ts.trPK('userProfile','phone-no')}}</h1>
+            </ion-label>
+          </ion-col>
+
+          <ion-col size="2" *ngIf="addressSubMenu && addressSubMenu.UPDATE_BUTTON === 'Y'" (click)="allowEdit('contact')">
+            <img style="width: 18px; height: 18px;" src="../assets/imgs/profile-icons/editing@2x.png">
+          </ion-col>
+          <ion-col size="2" *ngIf="addressSubMenu && addressSubMenu.ADD_BUTTON === 'Y'" (click)="allowEdit('contact')">
+            <ion-icon class="add-icon-styling" name="add"></ion-icon>
+        </ion-col>
+        </ion-row>
+      </ion-grid>
+      <br>
+      <div *ngIf="phoneNumbers.length>0">
+      <div *ngFor="let phone of phoneNumbers">
+        <div *ngIf="phone.PHONE_ID">
+        <ion-label>
+        <h3 [ngClass]="direction === 'ltr'? 'type-label-text-form': 'type-label-text-form-ar' " >{{phone.PHONE_TYPE_MEANING}}</h3>
+      </ion-label>
+      <h3 [ngClass]="direction === 'ltr'? 'result-label-text-form': 'result-label-text-form-ar' " >{{phone.PHONE_NUMBER}}</h3>
+      <br>
+      <br>
+    </div>
+    
+      </div>
+    </div>
+
+    </ion-card-content>
+  </ion-card>
+
   <ion-card *ngIf="addressSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
     <ion-card-content *ngIf="!editAddress && employeeAdress">
       <ion-grid>
@@ -235,7 +296,80 @@
       <br>
     </ion-card-content>
   </ion-card>
+  
+  <!-- <ion-card *ngIf="familyMemberSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
+    <ion-card-content>
+      <ion-grid>
+        <ion-row>
+          <ion-col size='5'>
+            <h2 style="font-weight: bold; padding-top: 15px;">ENAD, Hilal</h2>
+          </ion-col>
+          <ion-col size='3' offset='2'>
+            <div class='family-member-button'>
+                <ion-icon style="width: 20px;" name="create"></ion-icon>
+                <p>update</p>
+            </div>
+          </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col size='5'>
+            <ion-label><p style="font-weight: bold;">Father</p></ion-label>
+          </ion-col>
+          <ion-col size='3' offset='2'>
+            <div class='family-member-button'>
+                <ion-icon name="trash" style="width: 20px; height: 20px; color: #CA3332;"></ion-icon>
+                <p style="color: #CA3332;">Remove</p>
+            </div>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+    </ion-card-content>
+  </ion-card> -->
+  <div   *ngIf="familyMemberSegment">
+  <ion-card [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' " style="padding:10px;background:#fff">
+    <ion-grid>
+      <ion-row>
+        <ion-col size="10">
+          <ion-label>
+            <h1 [ngClass]="direction === 'ltr'? 'header-label-text-form': 'header-label-text-form-ar' ">{{ts.trPK('general','dependent-title')}}</h1>
+          </ion-label>
+        </ion-col>
 
+        
+        <ion-col size="2" >
+            <ion-icon class="add-icon-styling" name="add" *ngIf="dependentDetails  && dependentDetails.ADD_BUTTON === 'Y'" (click)="allowEdit('add-update-contact')" style="right:0px"></ion-icon>
+        </ion-col>
+      </ion-row>
+    </ion-grid>
+  </ion-card>
+    <br>
+    <div *ngFor='let data of familyMemberData' style="background: white; border-radius: 20px; margin-left: 15px; margin-right: 15px; margin-bottom: 15px;">
+      <ion-grid>
+        <ion-row>
+          <ion-col size='4'>
+            <h2 style="font-weight: bold; font-size: 15px;margin:0">{{data.CONTACT_NAME}}</h2>
+          </ion-col>
+          <ion-col [size]='direction === "ltr" ? 5 : 8 ' [offset]='direction === "ltr" ? 3 : 0 ' [ngClass]="dependentDetails  && dependentDetails.UPDATE_BUTTON === 'Y' ? '' :'disabledButton'"> 
+            <div class='family-member-button' style="height: 32px !important;" (click)='updateFunction(data)'>
+                <ion-icon style="width: 20px;" name="create"></ion-icon>
+                <p>{{ts.trPK('userProfile','update')}}</p>
+            </div>
+          </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col size='4'>
+            <ion-label><p style="font-weight: bold; font-size: 14px;">{{data.RELATIONSHIP}}</p></ion-label>
+          </ion-col>
+          <ion-col  [size]='direction === "ltr" ? 5 : 8 ' [offset]='direction === "ltr" ? 3 : 0 '>
+            <div class='family-member-button' style="height: 32px !important;" (click)='RemoveFunction(data)' [ngClass]="dependentDetails  && dependentDetails.DELETE_BUTTON === 'Y' ? '' :'disabledButton'">
+                <ion-icon name="trash" style="width: 20px; height: 20px; color: #CA3332;"></ion-icon>
+                <p style="color: #CA3332;">{{ts.trPK('userProfile','remove')}}</p>
+            </div>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+    </div>
+  </div>
   <!-- <ion-footer *ngIf="editBasic||editAddress">
     <ion-grid>
       <ion-row>
diff --git a/Mohem/src/app/profile/home/home.component.scss b/Mohem/src/app/profile/home/home.component.scss
index 97bbfbb6..8920347a 100644
--- a/Mohem/src/app/profile/home/home.component.scss
+++ b/Mohem/src/app/profile/home/home.component.scss
@@ -199,7 +199,7 @@ ion-thumbnail.menu-thumb {
   margin: -12px 0px 0px 25px;
 }
 .service-row-ar {
-  width: 108%;
+  width: 104%;
   margin: -12px 0px 0px 0px;
 }
 
@@ -1168,13 +1168,19 @@ $actionBtnSize: 36px;
 .card-size-info-en{
   // width: 88%;
   // left: 2%;
-  width: 89%;
-    left: 10px;
+  // width: 89%;
+  //   left: 10px;
+    width: 90%;
+    left: 5%;
+    padding-left: 0px;
+    margin-left: 0px;
 }
 
 .card-size-info-ar{
   width: 90%;
-  right: 2%;
+  right: 3%;
+  padding-right: 0px;
+  margin-left: 0px;
 }
 
 // .header-label-text-form{
@@ -1352,4 +1358,57 @@ $actionBtnSize: 36px;
   letter-spacing: -0.64px;
   color: #2B353E;
   opacity: 1;
-}
\ No newline at end of file
+}
+.create-edit{
+  font-size: 20px;
+}
+.profile-green{
+  background: #20A16A; 
+  margin-right: 5px; 
+  width: 80px; 
+  height: 8px; 
+  border-radius: 5px;
+}
+
+.profile-gray{
+  background: #D9D9D9; 
+  margin-right: 5px; 
+  width: 80px; 
+  height: 8px; 
+  border-radius: 5px;
+}
+.family-member-button{
+  width: 115px; 
+  height: 45px; 
+  background-color: #F5F5F5; 
+  display: flex; 
+  align-items: center; 
+  padding: 16px; 
+  border-radius: 20px;
+  box-shadow: 0px 0px 5px #00000029;
+}
+.profile-note-en{
+  margin-left: 20px; 
+  margin-top: 5px; 
+  font-size: 13px;
+}
+.profile-note-ar{
+  margin-right: 20px; 
+  margin-top: 5px; 
+  font-size: 13px;
+}
+
+.profile-compilation-en{
+  margin-left: 20px; 
+  margin-top: 5px; 
+  font-size: 13px;
+}
+.profile-compilation-ar{
+  margin-left: 20px; 
+  margin-top: 5px; 
+  font-size: 13px;
+}
+.disabledButton{
+  opacity:.5;
+pointer-events: none;
+}
diff --git a/Mohem/src/app/profile/home/home.component.ts b/Mohem/src/app/profile/home/home.component.ts
index 6c05dd04..e423d395 100644
--- a/Mohem/src/app/profile/home/home.component.ts
+++ b/Mohem/src/app/profile/home/home.component.ts
@@ -20,14 +20,17 @@ import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-respo
 })
 export class HomeComponent implements OnInit {
 
+  public familyMemberData = [
+
+  ]
+
   public direction: string;
   public setImage: any;
   public user_image: any = '../assets/imgs/profile.png';
   public personalInfo: any;
-  public appraisalArr: any = [];
-  public performanceData: any = [];
-  public static PERFORMANCE_DATA = 'perAppData';
+
   public personalInfoSegment = false;
+  public familyMemberSegment = false;
   public basicDetailsSegment = false;
   public addressSegment = false;
   public editBasic = false;
@@ -41,6 +44,7 @@ export class HomeComponent implements OnInit {
   public menuEntries: any;
   public basicDetailsSubMenu: any;
   public addressSubMenu: any;
+  public dependentDetails: any;
   public transactionNo = 0;
   public address: any;
   public street: any;
@@ -51,7 +55,11 @@ export class HomeComponent implements OnInit {
   public country: any;
   public employeeAdress: any = [];
   public jobName: any;
-
+  public profileProgress = 84;
+  public contactSegment: boolean = false;
+  public phoneNumbers: any = [];
+  public objectLists: any = [];
+  public familyMemberDataDetails: any = [];
   constructor(
     public ts: TranslatorService,
     public cs: CommonService,
@@ -75,28 +83,46 @@ export class HomeComponent implements OnInit {
         this.personalInfoSegment = true;
         this.basicDetailsSegment = false;
         this.addressSegment = false;
+        this.familyMemberSegment = false;
+        this.contactSegment = false;
+        this.familyMemberSegment = false;
       } else if (this.targetValue === 'basicDetails') {
         this.personalInfoSegment = false;
         this.basicDetailsSegment = true;
         this.addressSegment = false;
-      } else if (this.targetValue === 'address') {
+        this.familyMemberSegment = false;
+      } else if (this.targetValue === 'family') {
+        this.personalInfoSegment = false;
+        this.basicDetailsSegment = false;
+        this.addressSegment = false;
+        this.familyMemberSegment = true;
+      } else if (this.targetValue == 'contact') {
+
         this.personalInfoSegment = false;
         this.basicDetailsSegment = false;
         this.addressSegment = true;
-      } else {
+        this.editBasic = false;
+        this.editAddress = false;
+        this.familyMemberSegment = false;
+        this.contactSegment = true;
+      }
+      else {
         this.personalInfoSegment = true;
         this.basicDetailsSegment = false;
         this.addressSegment = false;
+        this.familyMemberSegment = false;
       }
     });
   }
 
   ngOnInit() {
     this.getProfile();
+
     this.menuEntries = this.cs.sharedService.getSharedData('menuEntries', false);
     if (this.menuEntries) {
       this.setMenuEntries();
     }
+
   }
 
   public setMenuEntries() {
@@ -117,6 +143,9 @@ export class HomeComponent implements OnInit {
                 if (personalInfoNestedChildren[k].REQUEST_TYPE === 'ADDRESS') {
                   this.addressSubMenu = personalInfoNestedChildren[k];
                 }
+                if (personalInfoNestedChildren[k].REQUEST_TYPE === 'CONTACT') {
+                  this.dependentDetails = personalInfoNestedChildren[k];
+                }
               }
             }
           }
@@ -131,6 +160,9 @@ export class HomeComponent implements OnInit {
         if (menuEntriesLocalArray[i].REQUEST_TYPE === 'ADDRESS') {
           this.addressSubMenu = menuEntriesLocalArray[i];
         }
+        if (menuEntriesLocalArray[i].REQUEST_TYPE === 'CONTACT') {
+          this.dependentDetails = menuEntriesLocalArray[i];
+        }
       }
     }
     console.log(this.basicDetailsSubMenu);
@@ -138,18 +170,19 @@ export class HomeComponent implements OnInit {
   }
 
   public getProfile() {
-    console.log('getProfile');
+
     this.authService
       .loadAuthenticatedUser()
       .subscribe((user: AuthenticatedUser) => {
         if (user) {
           console.log(user);
           this.personalInfo = user;
-
+          this.getPhoneNumbers();
+          this.getContactInfo();
           let jobTitle = user.POSITION_NAME.split('.');
           if (jobTitle && jobTitle.length > 1) {
             this.jobName = jobTitle[0] + " " + jobTitle[1];
-          }​
+          }
 
           if (this.cs.getUpdateImage().status) {
             this.user_image = this.sanitizer.bypassSecurityTrustUrl('data:image/png;base64,' + this.cs.getUpdateImage().img);
@@ -222,35 +255,8 @@ export class HomeComponent implements OnInit {
     this.cs.openProfile('sideMenu');
   }
 
-  public openPerormance() {
-    this.showPerformanceAppraisal();
-  }
 
-  public showPerformanceAppraisal() {
-    this.DS.getPerformanceAppraisal(() => {
-      this.showPerformanceAppraisal();
-    }).subscribe((result: PerformanceAppraisalResponse) => {
-      this.handlePerformanceAppraisalResult(result);
-    });
-  }
 
-  private handlePerformanceAppraisalResult(result) {
-    if (this.cs.validResponse(result)) {
-      if (this.cs.hasData(result.GetPerformanceAppraisalList)) {
-        this.appraisalArr = result.GetPerformanceAppraisalList;
-        this.performanceData = [];
-        for (let i = 0; i < this.appraisalArr.length; i++) {
-          this.performanceData.push({ name: this.appraisalArr[i].APPRAISAL_YEAR, value: parseInt(this.appraisalArr[i].APPRAISAL_SCORE).toFixed() });
-        }
-        console.log('PerformanceAppraisalResponse');
-        this.sharedData.setSharedData(this.performanceData, PerformanceAppraisalResponse.PERFORMANCE_DATA);
-        this.cs.openPerformanceevaluation();
-      } else {
-        let msg: string = this.ts.trPK("userProfile", "no-appraisal");
-        this.cs.presentAlert(msg);
-      }
-    }
-  }
 
   public selectedSegment(segmentData) {
     switch (segmentData) {
@@ -260,6 +266,8 @@ export class HomeComponent implements OnInit {
         this.addressSegment = false;
         this.editBasic = false;
         this.editAddress = false;
+        this.familyMemberSegment = false;
+        this.contactSegment = false;
         break;
       case "basic":
         this.personalInfoSegment = false;
@@ -267,6 +275,8 @@ export class HomeComponent implements OnInit {
         this.addressSegment = false;
         this.editBasic = false;
         this.editAddress = false;
+        this.familyMemberSegment = false;
+        this.contactSegment = false;
         break;
       case "address":
         this.personalInfoSegment = false;
@@ -274,6 +284,26 @@ export class HomeComponent implements OnInit {
         this.addressSegment = true;
         this.editBasic = false;
         this.editAddress = false;
+        this.familyMemberSegment = false;
+        this.contactSegment = false;
+        break;
+      case "family":
+        this.personalInfoSegment = false;
+        this.basicDetailsSegment = false;
+        this.addressSegment = false;
+        this.editBasic = false;
+        this.editAddress = false;
+        this.familyMemberSegment = true;
+        this.contactSegment = false;
+        break;
+      case "contact":
+        this.personalInfoSegment = false;
+        this.basicDetailsSegment = false;
+        this.addressSegment = true;
+        this.editBasic = false;
+        this.editAddress = false;
+        this.familyMemberSegment = false;
+        this.contactSegment = true;
         break;
     }
   }
@@ -282,7 +312,7 @@ export class HomeComponent implements OnInit {
 
     let selMenu: MenuResponse = new MenuResponse();
     selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
-    selMenu.GetMenuEntriesList = allowVal === 'basic' ? this.basicDetailsSubMenu : this.addressSubMenu;
+    selMenu.GetMenuEntriesList = allowVal === 'basic' ? this.basicDetailsSubMenu : allowVal === 'add-update-contact' ? this.dependentDetails : this.addressSubMenu;
     this.cs.sharedService.setSharedData(selMenu, MenuResponse.SHARED_DATA);
 
     if (allowVal === 'basic') {
@@ -290,6 +320,13 @@ export class HomeComponent implements OnInit {
       // tslint:disable-next-line: max-line-length
       this.cs.sharedService.setSharedData({ dirfromNotificationPage: false, submitEITObjList: undefined, transNo: this.transactionNo }, 'AddEITData');
       this.openAddBasicDetails();
+    } else if (allowVal == 'contact') {
+
+      this.openContact()
+    } else if (allowVal == 'add-update-contact') {
+      this.transactionNo++;
+      this.cs.sharedService.setSharedData({ dirfromNotificationPage: false, submitEITObjList: undefined, transNo: this.transactionNo }, 'AddEITData');
+      this.cs.openAddUpdateContact();
     } else {
       this.openAddAddress();
     }
@@ -311,7 +348,7 @@ export class HomeComponent implements OnInit {
     const modal = await this.modalController.create({
       component: EditDetailProfileComponent,
       cssClass: 'my-custom-modal-css',
-      componentProps:{ sourceName: source}
+      componentProps: { sourceName: source }
     });
 
     modal.onDidDismiss()
@@ -323,7 +360,7 @@ export class HomeComponent implements OnInit {
             this.cs.sharedService.setSharedData(this.addressSubMenu, ProfileService.ADRESS_ENTRIES);
             this.cs.sharedService.setSharedData(this.employeeAdress, ProfileService.EMP_ADDRESS);
             this.cs.sharedService.setSharedData(this.country, ProfileService.COUNTRY);
-  
+
             this.cs.openAddAddress();
           } else if (data.data && data.data.data == 2 && source === 'address') {
             this.cs.openAddAddress();
@@ -348,7 +385,9 @@ export class HomeComponent implements OnInit {
       this.cs.openAddAddress();
     }
   }
-
+  public openContact() {
+    this.cs.openAddContact();
+  }
   public openAddBasicDetails() {
     if (this.basicDetailsSubMenu && this.basicDetailsSubMenu.UPDATE_BUTTON === 'Y') {
       this.presentModal('basicDetails');
@@ -356,5 +395,76 @@ export class HomeComponent implements OnInit {
       this.cs.openAddBasicDetails('correct');
     }
   }
+
+
+  getPhoneNumbers() {
+    this.cs.startLoading();
+    this.profileService.getPhoneNumbers({
+      P_MENU_TYPE: "E",
+      P_SELECTED_RESP_ID: -999
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      if (this.cs.validResponse(response)) {
+        this.cs.stopLoading();
+        this.phoneNumbers = response['GetEmployeePhonesList'];
+        console.log(this.phoneNumbers);
+        this.cs.sharedService.setSharedData(this.phoneNumbers, ProfileService.EMP_PHONE);
+      }
+    })
+
+  }
+
+  getContactInfo() {
+    this.profileService.getContactInfo({
+      P_MENU_TYPE: "E",
+      P_SELECTED_RESP_ID: -999
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      if (this.cs.validResponse(response)) {
+        this.familyMemberData = response['GetEmployeeContactsList'];
+        this.cs.sharedService.setSharedData(this.familyMemberData, ProfileService.EMP_CONTACT);
+      }
+    })
+
+  }
+
+  updateFunction(contact) {
+    // this.cs.presentAlert(this.ts.trPK('general', 'error-itg'));
+    this.cs.presentConfirmDialog(this.ts.trPK('userProfile', 'update-msg'),
+      () => {
+        this.updateContact(contact);
+        //this.cs.greenToastPK("userProfile", "update-confirm");
+      });
+  }
+  RemoveFunction(contact) {
+    this.cs.sharedService.setSharedData(contact, ProfileService.SELCTED_CONTACT);
+    this.cs.sharedService.setSharedData({ dirfromNotificationPage: false, submitEITObjList: undefined, transNo: this.transactionNo }, 'AddEITData');
+
+
+    let selMenu: MenuResponse = new MenuResponse();
+    selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
+    selMenu.GetMenuEntriesList = this.dependentDetails;
+    this.cs.sharedService.setSharedData(selMenu, MenuResponse.SHARED_DATA);
+
+    this.cs.presentConfirmDialog(this.ts.trPK('userProfile', 'remove-msg'),
+      () => {
+        this.cs.sharedService.setSharedData(true, ProfileService.REMOVE_CONTACT);
+        this.cs.openAddUpdateContact();
+      });
+  }
+  updateContact(contact) {
+    this.profileService.getContactDetails({
+      P_MENU_TYPE: "E",
+      P_SELECTED_RESP_ID: -999,
+      P_CONTACT_RELATIONSHIP_ID: contact['CONTACT_RELATIONSHIP_ID']
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      if (this.cs.validResponse(response)) {
+        this.familyMemberDataDetails = response['GetContactDetailsList'];
+        this.cs.sharedService.setSharedData(this.familyMemberDataDetails, ProfileService.EMP_CONTACT_DETAILS);
+        this.cs.sharedService.setSharedData(contact, ProfileService.SELCTED_CONTACT);
+        this.allowEdit('add-update-contact');
+
+
+      }
+    })
+  }
 }
 
diff --git a/Mohem/src/app/profile/models/contact.request.ts b/Mohem/src/app/profile/models/contact.request.ts
new file mode 100644
index 00000000..3a62ce32
--- /dev/null
+++ b/Mohem/src/app/profile/models/contact.request.ts
@@ -0,0 +1,12 @@
+import { EitTransactionModel } from './eit.transaction.model';
+
+export class ContactRequest {
+    public static SHARED_DATA = 'basic-request';
+    public P_MENU_TYPE: string;
+    public P_SELECTED_EMPLOYEE_NUMBER: string;
+    public P_FUNCTION_NAME: string;
+    public P_SELECTED_RESP_ID: Number;
+    public P_CONTACT_RELATIONSHIP_ID: number;
+    EITTransactionTBL: EitTransactionModel[];
+    P_ACTION: string;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.html b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.html
index d90e8f6d..716539d2 100644
--- a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.html
+++ b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.html
@@ -37,21 +37,6 @@
         </ion-row>
       </div>
 
-      <!-- <div>
-        <div *ngFor="let data of performanceData">
-        <ion-row class="gridvalue">
-            <ion-col >
-              <div class="performancecolor" [style.background]="data.color"></div>
-              <br>
-              <label class="label"> Your Performance In </label>
-              <label class="labelvalue"> {{data.value}} </label>
-              <label class="label"> {{data.name}} </label>
-            </ion-col>
-        </ion-row>
-      </div>
-      </div> -->
-      <!-- class="gridvalue" -->
-    <!-- ///// -->
 
     <div>
       <div *ngIf="performanceData">
diff --git a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss
index c824c8a6..090524b4 100644
--- a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss
+++ b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss
@@ -74,7 +74,8 @@
     margin-top: 5px;
     margin-bottom: 10px;
     text-align: center;
-    margin-left: 74px;
+    // margin-left: 74px;
+    width: 100%;
   }
   .Text-ar{
     margin: 0;
@@ -167,9 +168,9 @@
 }
 
 .gauge{
-  transform: translate(-24px, -65px);
-  margin-bottom: -187px;
-  margin-top: -20px;
+  // transform: translate(-24px, -65px);
+  margin-bottom: -140px;
+  margin-top: -70px;
 
 }
 .gauge-ar{
diff --git a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts
index a755c831..a3a61872 100644
--- a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts
+++ b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts
@@ -25,7 +25,9 @@ export class PerformanceEvaluationComponent implements OnInit {
   public length;
   public direction: string;
   //  public showText:boolean =false;
+  public appraisalArr: any = [];
 
+  public static PERFORMANCE_DATA = 'perAppData';
   constructor(public ts: TranslatorService,
     public cs: CommonService,
     public DS: DashboredService,
@@ -53,21 +55,21 @@ export class PerformanceEvaluationComponent implements OnInit {
 
 
     this.getProfile();
-
-    this.performanceData = this.cs.sharedService.getSharedData(
-      PerformanceAppraisalResponse.PERFORMANCE_DATA,
-      true
-    );
-    console.log(this.performanceData.length);
-    //i % 2 == 0
-    this.length = this.performanceData.length;
-
-    for (let i = 0; i < this.performanceData.length; i++) {
-      this.performanceData[i].color = this.colorScheme.domain[i];
-      console.log(i + ' : ' + this.performanceData[i].name)
-
-    }
-    console.log(this.performanceData[0].color)
+    this.showPerformanceAppraisal()
+    // this.performanceData = this.cs.sharedService.getSharedData(
+    //   PerformanceAppraisalResponse.PERFORMANCE_DATA,
+    //   true
+    // );
+    // console.log(this.performanceData.length);
+    // //i % 2 == 0
+    // this.length = this.performanceData.length;
+
+    // for (let i = 0; i < this.performanceData.length; i++) {
+    //   this.performanceData[i].color = this.colorScheme.domain[i];
+    //   console.log(i + ' : ' + this.performanceData[i].name)
+
+    // }
+    // console.log(this.performanceData[0].color)
 
   }
 
@@ -90,5 +92,30 @@ export class PerformanceEvaluationComponent implements OnInit {
         }
       });
   }
+  public showPerformanceAppraisal() {
+    this.DS.getPerformanceAppraisal(() => {
+      this.showPerformanceAppraisal();
+    }).subscribe((result: PerformanceAppraisalResponse) => {
+      this.handlePerformanceAppraisalResult(result);
+    });
+  }
 
+
+  private handlePerformanceAppraisalResult(result) {
+    if (this.cs.validResponse(result)) {
+      if (this.cs.hasData(result.GetPerformanceAppraisalList)) {
+        this.appraisalArr = result.GetPerformanceAppraisalList;
+        this.performanceData = [];
+        for (let i = 0; i < this.appraisalArr.length; i++) {
+          this.performanceData.push({ name: this.appraisalArr[i].APPRAISAL_YEAR, value: parseInt(this.appraisalArr[i].APPRAISAL_SCORE).toFixed() });
+        }
+        console.log('PerformanceAppraisalResponse');
+        this.cs.sharedService.setSharedData(this.performanceData, PerformanceAppraisalResponse.PERFORMANCE_DATA);
+        this.cs.openPerformanceevaluation();
+      } else {
+        let msg: string = this.ts.trPK("userProfile", "no-appraisal");
+        this.cs.presentAlert(msg);
+      }
+    }
+  }
 }
diff --git a/Mohem/src/app/profile/profile.module.ts b/Mohem/src/app/profile/profile.module.ts
index 42bd13b9..46faa498 100644
--- a/Mohem/src/app/profile/profile.module.ts
+++ b/Mohem/src/app/profile/profile.module.ts
@@ -23,6 +23,9 @@ import { ConfirmAddressComponent } from './confirm-address/confirm-address.compo
 import { SubmitAddressModalComponent } from './submit-eit-modal/submit-address-modal.component';
 
 import { ConfirmBasicDetailsComponent } from './confirm-basic-details/confirm-basic-details.component';
+import { ConatactComponent } from './contact/contact.component';
+import { AddUpdateContactComponent } from './add-update-contact/add-update-contact.component';
+import { ConfirmContactComponent } from './confirm-contact/confirm-contact.component';
 const routes: Routes = [
   {
     path: '',
@@ -44,6 +47,18 @@ const routes: Routes = [
       {
         path: 'confirm-basic',
         component: ConfirmBasicDetailsComponent
+      },
+      {
+        path: 'contact',
+        component: ConatactComponent
+      },
+      {
+        path: 'add-update-contact',
+        component: AddUpdateContactComponent
+      },
+      {
+        path: 'confirm-contact',
+        component: ConfirmContactComponent
       }
     ],
   },
@@ -112,11 +127,15 @@ const routes: Routes = [
     EditProfileComponent,
     PerformanceEvaluationComponent,
     ConfirmAddressComponent,
-    SubmitAddressModalComponent,
+
     AddBasicDetailsComponent,
     ConfirmAddressComponent,
     ConfirmBasicDetailsComponent,
-    AddBasicDetailsComponent],
+    ConatactComponent,
+    AddBasicDetailsComponent,
+    AddUpdateContactComponent,
+    ConfirmContactComponent
+  ],
   entryComponents: [EditDetailProfileComponent, SubmitAddressModalComponent],
 
   providers: [DatePicker]
diff --git a/Mohem/src/app/profile/service/profile.service.ts b/Mohem/src/app/profile/service/profile.service.ts
index 0feb9512..141d8e04 100644
--- a/Mohem/src/app/profile/service/profile.service.ts
+++ b/Mohem/src/app/profile/service/profile.service.ts
@@ -19,7 +19,9 @@ export class ProfileService {
   public static submitEit = 'Services/ERP.svc/REST/SUBMIT_EIT_TRANSACTION';
   public static resubmitEit = 'Services/ERP.svc/REST/RESUBMIT_EIT_TRANSACTION';
   public static startEitProcess = 'Services/ERP.svc/REST/START_ADDRESS_APPROVAL_PROCESS';
+  public static startPhoneProcess = 'Services/ERP.svc/REST/START_PHONES_APPROVAL_PROCESS';
   public static startBasicProcess = 'Services/ERP.svc/REST/START_BASIC_DET_APPR_PROCESS';
+  public static contactApprovalProcess = 'Services/ERP.svc/REST/START_CONTACT_APPROVAL_PROCESS';
   public static updateAttach = 'Services/ERP.svc/REST/UPDATE_ATTACHMENT';
   public static deleteAttach = 'Services/ERP.svc/REST/DELETE_ATTACHMENT';
   public static getApproversList = 'Services/ERP.svc/REST/GET_APPROVERS_LIST';
@@ -32,11 +34,26 @@ export class ProfileService {
   public static getDiffStructure = "Services/ERP.svc/REST/GET_ADDRESS_DFF_STRUCTURE";
   public static submitAddressTransactions = "Services/ERP.svc/REST/SUBMIT_ADDRESS_TRANSACTION";
   public static submitBasicDetailsTransaction = "Services/ERP.svc/REST/SUBMIT_BASIC_DET_TRANSACTION";
+  public static submitContactTransaction = 'Services/ERP.svc/REST/SUBMIT_CONTACT_TRANSACTION'
+  public static getObjectValues = "Services/ERP.svc/REST/GET_OBJECT_VALUES";
+  public static getPhoneNumbers = "Services/ERP.svc/REST/GET_EMPLOYEE_PHONES";
+  public static submitPhoneTransaction = "Services/ERP.svc/REST/SUBMIT_PHONES_TRANSACTION";
+  public static getContactInfo = 'Services/ERP.svc/REST/GET_EMPLOYEE_CONTACTS';
+  public static getContactDetails = 'Services/ERP.svc/REST/GET_CONTACT_DETAILS';
+
+  public static getContactDiffStructure = 'Services/ERP.svc/REST/GET_CONTACT_DFF_STRUCTURE';
+  public static getContactCOLStructure = 'Services/ERP.svc/REST/GET_CONTACT_COLS_STRUCTURE';
+
 
   public static ADRESS_ENTRIES = 'address-entries';
   public static EMP_ADDRESS = 'emp-address';
   public static COUNTRY = 'country';
   public static SELECTED_STATUS = 'selected-status';
+  public static EMP_PHONE = 'emp-phone';
+  public static EMP_CONTACT_DETAILS = 'emp-CONTACT_DETAILS';
+  public static EMP_CONTACT = 'emp-CONTACT';
+  public static SELCTED_CONTACT = 'selcted-CONTACT';
+  public static REMOVE_CONTACT = 'remove-CONTACT';
   constructor(
     public con: ConnectorService,
     public authService: AuthenticationService
@@ -117,14 +134,80 @@ export class ProfileService {
     this.authService.authenticateRequest(request);
     return this.con.post(ProfileService.submitBasicDetailsTransaction, request, onError, errorLabel);
   }
+  public submitContactTransaction(basicDetailsRequest: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = basicDetailsRequest;
+    this.authService.authenticateRequest(request);
+    return this.con.post(ProfileService.submitContactTransaction, request, onError, errorLabel);
+  }
   public startEitApprovalProcess(eitProcess: any, onError?: any, errorLabel?: string): Observable<any> {
     const request = eitProcess;
     this.authService.authenticateRequest(request);
     return this.con.post(ProfileService.startEitProcess, request, onError, errorLabel);
   }
+  public startPhoneApprovalProcess(eitProcess: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = eitProcess;
+    this.authService.authenticateRequest(request);
+    return this.con.post(ProfileService.startPhoneProcess, request, onError, errorLabel);
+  }
+
   public startBasicDetailsApprovalProcess(basicDetailsProcess: any, onError?: any, errorLabel?: string): Observable<any> {
     const request = basicDetailsProcess;
     this.authService.authenticateRequest(request);
     return this.con.post(ProfileService.startBasicProcess, request, onError, errorLabel);
   }
+
+
+  public startContactApprovalProcess(contactRequest: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = contactRequest;
+    this.authService.authenticateRequest(request);
+    return this.con.post(ProfileService.contactApprovalProcess, request, onError, errorLabel);
+  }
+  public getObjectValue(request: any, onError?: any, errorLabel?: string): Observable<any> {
+
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.P_USER_NAME;
+    return this.con.post(ProfileService.getObjectValues, request, onError, errorLabel);
+
+  }
+  public getPhoneNumbers(request: any, onError?: any, errorLabel?: string): Observable<any> {
+
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.P_USER_NAME;
+    return this.con.post(ProfileService.getPhoneNumbers, request, onError, errorLabel);
+
+  }
+  public submitPhoneTransaction(request: any, onError?: any, errorLabel?: string): Observable<any> {
+
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.P_USER_NAME;
+    return this.con.post(ProfileService.submitPhoneTransaction, request, onError, errorLabel);
+
+  }
+
+  public getContactInfo(request: any, onError?: any, errorLabel?: string): Observable<any> {
+
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.P_USER_NAME;
+    return this.con.post(ProfileService.getContactInfo, request, onError, errorLabel);
+
+  }
+
+  public getContactDetails(request: any, onError?: any, errorLabel?: string): Observable<any> {
+
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.P_USER_NAME;
+    return this.con.post(ProfileService.getContactDetails, request, onError, errorLabel);
+
+  }
+  public getContactDFFStrutre(BASICDFFStrutreReq: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = BASICDFFStrutreReq;
+    this.authService.authenticateRequest(request);
+    return this.con.post(ProfileService.getContactDiffStructure, request, onError, errorLabel);
+  }
+
+  public getContactColumnStructure(body: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = body;
+    this.authService.authenticateRequest(request);
+    return this.con.post(ProfileService.getContactCOLStructure, request, onError, errorLabel);
+  }
 }
\ No newline at end of file
diff --git a/Mohem/src/app/reports/concurrent-report/concurrent-report.component.html b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.html
new file mode 100644
index 00000000..75fc66f0
--- /dev/null
+++ b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.html
@@ -0,0 +1,31 @@
+<ion-content>
+  <div class="head-title">
+
+    <app-generic-header showImage="false" showBack="true" [headerText]="'general,concurrent-report' | translate">
+    </app-generic-header>
+  </div>
+  <div class="header"></div>
+  <div class="bottom"></div>
+
+  <div class="main-container">
+  <ion-item>
+    <ion-label>{{ 'worklist,template-name' | translate}}</ion-label>
+  <ion-select  [(ngModel)]="template" (ionChange)="selectTemplates()" [placeholder]="'general,select' | translate"
+    [okText]="'general,ok' | translate" [cancelText]="'general,cancel' | translate" class="concorrent-select large-ion-select">
+    <ion-select-option *ngFor="let program of programList" [value]="program">
+      {{ program.USER_CONCURRENT_PROGRAM_NAME}}</ion-select-option></ion-select>
+
+</ion-item>
+<div class="divider"></div>
+  <div #containerDiv id="containerDiv">
+  </div>
+</div>
+
+</ion-content>
+
+<ion-footer class="footer">
+  <div class="Btn">
+    <ion-button class="CreateBtn" color="customnavy" ion-button (click)="submitTransaction()">
+      {{'vacation-rule, next-label' | translate}}</ion-button>
+  </div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/reports/concurrent-report/concurrent-report.component.scss b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.scss
new file mode 100644
index 00000000..cd9542a0
--- /dev/null
+++ b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.scss
@@ -0,0 +1,56 @@
+.main-container{
+    padding: 10px;
+}
+.divider{
+    height:20px
+}
+.check-status{
+    color:rgb(0, 0, 134);
+    text-decoration: underline;
+    font-weight: 600;
+}
+.status{
+    margin:20px;
+}
+
+
+@media screen and (min-width: 300px){
+    .CreateBtn{
+    --background: var(--newgreen) !important;
+    background: var(--newgreen) !important;
+    white-space: normal;
+    color: var(--light);
+    text-transform: capitalize;
+    min-height: 1.0cm;
+    --border-radius: 7px !important;
+    border-radius: 7px !important;
+    --min-height: 1.6cm !important;
+    width: 315px;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+}}
+
+@media screen and (min-width: 1px) and (max-width:290px) {
+.CreateBtn{
+    --background: var(--newgreen) !important;
+    background: var(--newgreen) !important;
+    white-space: normal;
+    color: var(--light);
+    text-transform: capitalize;
+    min-height: 1.0cm;
+    --border-radius: 7px !important;
+    border-radius: 7px !important;
+    --min-height: 1.6cm !important;
+    width: 257px;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+}}
+
+.footer{
+    padding: 15px 0px;
+    background-color: var(--light) !important;
+    border: 0px !important;
+    box-shadow: none !important;
+    -webkit-box-shadow: none;
+}
+.Btn{
+    margin: auto; text-align: center; display: block;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/reports/concurrent-report/concurrent-report.component.spec.ts b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.spec.ts
new file mode 100644
index 00000000..102199fe
--- /dev/null
+++ b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConcurrentReportComponent } from './concurrent-report.component';
+
+describe('ConcurrentReportComponent', () => {
+  let component: ConcurrentReportComponent;
+  let fixture: ComponentFixture<ConcurrentReportComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ConcurrentReportComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConcurrentReportComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/reports/concurrent-report/concurrent-report.component.ts b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.ts
new file mode 100644
index 00000000..8fb275f0
--- /dev/null
+++ b/Mohem/src/app/reports/concurrent-report/concurrent-report.component.ts
@@ -0,0 +1,1300 @@
+import { Component, ElementRef, OnInit } from '@angular/core';
+import * as moment from 'moment';
+import { EitRequest } from 'src/app/eit/models/eit.request';
+import { EIT_ACTION } from 'src/app/eit/models/submit.eit.action';
+import { EitService } from 'src/app/eit/services/eit.service';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { DateTimeInput } from 'src/app/uI-elements/date-time.input';
+import { DateInput } from 'src/app/uI-elements/date.input';
+import { HiddenInput } from 'src/app/uI-elements/hidden.input';
+import { NumberInput } from 'src/app/uI-elements/number.input';
+import { SelectInput } from 'src/app/uI-elements/select.input';
+import { TextInput } from 'src/app/uI-elements/text.input';
+import { TimeInput } from 'src/app/uI-elements/time.input';
+import { ReportServiceService } from '../report-service.service';
+
+@Component({
+  selector: 'app-concurrent-report',
+  templateUrl: './concurrent-report.component.html',
+  styleUrls: ['./concurrent-report.component.scss'],
+})
+export class ConcurrentReportComponent implements OnInit {
+  public selectedMenu;
+  public diffStructure = [];
+  public isUpdate: boolean;
+  private eitVALSettoCall: any = [];
+  private textInput;
+  private numberInput;
+  private dateInput;
+  public direction: string;
+  private datetimeInput;
+  private timeInput;
+  private selectInput;
+  private hiddenInput;
+  private validateEitObj: any = [];
+  public menuType: any;
+  public respID;
+  public selEmp;
+  public eitRequest;
+  public ExtraObj;
+
+  selMenu: MenuResponse;
+  public functionName;
+
+  public headerTitle;
+  getPassdirfromNotifiPage: boolean = false;
+  private validEitTransactionTbl: any = [];
+  eitSubmitAction: number = 0;
+  updatedValues: any = [];
+  comtransNo: any = 1;
+  programList: any = [];
+  public template: any;
+  constructor(public cs: CommonService, private elementRef: ElementRef, public reports: ReportServiceService, public ts: TranslatorService, public eitService: EitService) { }
+
+  ngOnInit() {
+    this.getPassdirfromNotifiPage = this.cs.sharedService.getSharedData('dirfromNotificationPage');
+    this.selectedMenu = this.cs.sharedService.getSharedData(MenuResponse.SELECTED_MENU, false);
+    this.getConcurrentProgram();
+    this.direction = TranslatorService.getCurrentLanguageName();
+    // this.effectiveDate = new Date();
+    this.functionName = this.selectedMenu.FUNCTION_NAME;
+    // this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+  }
+  getConcurrentProgram() {
+    this.cs.startLoading();
+    this.reports.getConcurrentProgram({
+      P_REQUEST_GROUP_ID: this.selectedMenu.REQUEST_GROUP_ID
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      this.cs.stopLoading();
+      this.programList = response.GetConcurrentProgramsList;
+
+    })
+  }
+  getCppDiffStructure(programList) {
+    this.cs.startLoading();
+    this.reports.getCPPDiffStructure({
+      P_DESC_FLEX_NAME: programList.CONCURRENT_PROGRAM_NAME
+    }, () => { }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      this.cs.stopLoading();
+      this.handleDiffStructure(response);
+    })
+  }
+  handleDiffStructure(result) {
+    if (result.GetCcpDffStructureList != null) {
+      this.diffStructure = result.GetCcpDffStructureList;
+      this.drawEitFields(result.GetCcpDffStructureList);
+      if (this.isUpdate) {
+        //this.submitAbsObjList = this.cs.sharedService.getSharedData(ProfileService.EMP_ADDRESS);
+        //this.fillAbsStructure();
+      }
+    }
+  }
+  private drawEitFields(feildsList) {
+    const containerId = "containerDiv";
+    this.eitVALSettoCall = [];
+    for (let i = 0; i < feildsList.length; i++) {
+      let defaultVal = feildsList[i].E_SERVICES_DV.P_ID_COLUMN_NAME
+        ? feildsList[i].E_SERVICES_DV.P_ID_COLUMN_NAME
+        : "";
+      let defaultValText = feildsList[i].E_SERVICES_DV.P_VALUE_COLUMN_NAME
+        ? feildsList[i].E_SERVICES_DV.P_VALUE_COLUMN_NAME
+        : "";
+
+
+      if (feildsList[i].DISPLAY_FLAG != "N") {
+        //check if the field should be displayed
+        if (feildsList[i].VALIDATION_TYPE == "N") {
+          //text , date , time
+          if (feildsList[i].FORMAT_TYPE == "C") {
+            // character
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "N") {
+            // number
+            this.numberInput = new NumberInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "X") {
+            // standard date
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              //constant
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          } else if (feildsList[i].FORMAT_TYPE == "Y") {
+            // standard date time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatStandardDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+            const elem = document.getElementById(
+              feildsList[i].APPLICATION_COLUMN_NAME
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "I") {
+            //time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          }
+        } else {
+          if (feildsList[i].READ_ONLY == "Y") {
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else {
+            this.selectInput = new SelectInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+            this.fillDropdownList(
+              feildsList[i].SEGMENT_NAME,
+              feildsList[i].E_SERVICES_VS,
+              feildsList[i].E_SERVICES_DV
+            );
+          }
+        }
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      } else {
+        this.hiddenInput = new HiddenInput(
+          defaultVal,
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          defaultValText,
+          containerId
+        );
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      }
+    }
+    if (this.validateEitObj && this.validateEitObj.length > 0) {
+      this.fillEITStructure();
+    }
+  }
+  fillDropdownList(segmentName, optionList: any = [], DV: any = "") {
+    let elemID: any = "";
+    let eitObj: any;
+    if (optionList.length > 0) {
+      for (let i = 0; i < this.diffStructure.length; i++) {
+        if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+          eitObj = this.diffStructure[i];
+          if (
+            this.diffStructure[i].READ_ONLY == "Y" ||
+            this.diffStructure[i].DISPLAY_FLAG == "N"
+          ) {
+            return false;
+          }
+          elemID = this.diffStructure[i].APPLICATION_COLUMN_NAME;
+          break;
+        }
+      }
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+      if (eitObj.IsEmptyOption && eitObj.REQUIRED_FLAG == "N") {
+        var firstoption = document.createElement("option");
+        firstoption.text = this.ts.trPK("general", "choose");
+        firstoption.value = "";
+        select.add(firstoption);
+      }
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].VALUE_COLUMN_NAME;
+        option.value = optionList[i].ID_COLUMN_NAME;
+        select.add(option);
+      }
+      if (select.dataset.hiddenval) {
+        select.value = select.dataset.hiddenval;
+      } else {
+        select.value = DV.P_ID_COLUMN_NAME;
+      }
+      select.disabled = false;
+    }
+  }
+  bindHtmlElemEvents(id, obj) {
+    const elem = document.getElementById(id);
+    console.log(elem);
+    console.log(obj);
+    const elemType = elem.tagName;
+    let changeEvent = "ionChange";
+
+    if (elemType == "SELECT") changeEvent = "change";
+
+    try {
+      elem.addEventListener(changeEvent, e => {
+        elem.classList.remove("requiredClassElm");
+        if (
+          obj.CHILD_SEGMENTS_VS_Splited &&
+          obj.CHILD_SEGMENTS_VS_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_VS_Splited;
+          listArray.forEach(element => {
+            this.emptyChildElement(element);
+            this.getValueSet(element);
+          });
+        }
+        if (
+          obj.CHILD_SEGMENTS_DV_Splited &&
+          obj.CHILD_SEGMENTS_DV_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_DV_Splited;
+          listArray.forEach(element => {
+            this.emptyChildElement(element);
+            for (let i = 0; i < this.diffStructure.length; i++) {
+              if (this.diffStructure[i].SEGMENT_NAME == element) {
+                this.getDefaultValue(
+                  this.diffStructure[i],
+                  this.diffStructure[i].DESC_FLEX_NAME,
+                  this.diffStructure[i].DESC_FLEX_CONTEXT_CODE,
+                  this.diffStructure[i].SEGMENT_NAME,
+                  this.diffStructure[i].PARENT_SEGMENTS_VS_SplitedVS,
+                  this.diffStructure[i].PARENT_SEGMENTS_DV_Splited
+                );
+              }
+            }
+          });
+        }
+        return false;
+      });
+    } catch (e) {
+      console.log(e.status);
+    }
+  }
+  public getDefaultValue(
+    obj,
+    descFlexName,
+    descFlexContextCode,
+    segmentName,
+    parentValue,
+    ParentsList
+  ) {
+    let dependenciesList: any = [];
+    let parentVal: any = null;
+    let isStandardDate: boolean = false;
+    let isStandardTimeDate: boolean = false;
+    let isStandardTime: boolean = false;
+    let isHidden: boolean = false;
+    let isReadOnlyList: boolean = false;
+    let isSelectElement: boolean = false;
+    isStandardDate = this.isStandardDate(obj);
+    isStandardTimeDate = this.isStandardDateTime(obj);
+    isStandardTime = this.isStandardTime(obj);
+    if (obj.DISPLAY_FLAG == "N") isHidden = true;
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "Y") {
+      isReadOnlyList = true;
+    }
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "N") {
+      isSelectElement = true;
+    }
+    if (
+      parentValue != "" &&
+      (obj.VALIDATION_TYPE == "D" || obj.VALIDATION_TYPE == "Y")
+    ) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      if (parentValue) ParentsList.concat(parentValue);
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList
+    };
+
+    this.eitService.getDefaultValue(body).subscribe((result: any) => {
+      let elem = this.getElementByName(segmentName);
+      let obj = this.handleDefaultValueResult(result);
+      let val = obj.value;
+      let text = obj.text;
+      if (val == null) { val = ""; }
+      if (text == null) { text = ""; }
+      if (isStandardDate) {
+        console.log("isStandardDate");
+        elem.value = this.cs.reverseFormatDate(val);
+      } else if (isStandardTimeDate) {
+        console.log("isStandardTimeDate");
+        if (val) {
+          elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+          elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else if (isStandardTime) {
+        console.log("isStandardTime");
+        if (val) {
+          elem.dataset.dtvalue = val;
+          elem.innerHTML = val;
+          elem.value = val;
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else {
+        if (isSelectElement) {
+          let elem = this.getSelectElementByName(segmentName);
+          elem = document.getElementById(elem),
+            elem.value = val;
+        } else {
+          elem.value = val;
+          elem.innerText = text;
+          elem.setAttribute("value", val);
+        }
+      }
+      if (isHidden || isReadOnlyList) {
+        if (val) elem.dataset.colmText = val;
+        else elem.dataset.colmText = "";
+        elem.value = text;
+      }
+      var event = new Event("ionChange");
+      elem.dispatchEvent(event);
+    });
+  }
+
+  handleDefaultValueResult(result) {
+    let data = {
+      text: result.GetDefaultValueList.P_VALUE_COLUMN_NAME,
+      value: result.GetDefaultValueList.P_ID_COLUMN_NAME
+    };
+    return data;
+  }
+  getSelectElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+        elemID = this.diffStructure[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return elemID;
+  }
+  getElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+        elemID = this.diffStructure[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return document.getElementById(elemID) as HTMLInputElement;
+  }
+
+  fillEITStructure() {
+    var obj = { peiObjVer: null, peiExtraInfoID: null };
+    for (let i = 0; i < this.validateEitObj.length; i++) {
+      let val: any;
+      if (this.validateEitObj[i].VARCHAR2_VALUE)
+        val = this.validateEitObj[i].VARCHAR2_VALUE;
+      else if (this.validateEitObj[i].DATE_VALUE)
+        val = this.validateEitObj[i].DATE_VALUE;
+      else if (this.validateEitObj[i].NUMBER_VALUE)
+        val = this.validateEitObj[i].NUMBER_VALUE;
+      const elem = document.getElementById(
+        this.validateEitObj[i].APPLICATION_COLUMN_NAME
+      ) as HTMLInputElement;
+      //obj.transactionNo=this.validateEitObj[i].TRANSACTION_NUMBER;
+      if (elem) {
+        if (val) {
+          let feldDetails = this.diffStructure.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.validateEitObj[i].APPLICATION_COLUMN_NAME
+          );
+          if (feldDetails) {
+            let isStandardDate = this.isStandardDateVal(feldDetails);
+            let isStandardDateTime = this.isStandardDateTimeVal(feldDetails);
+            let isStandardTime = this.isStandardTimeVal(feldDetails);
+            if (isStandardDate) {
+              elem.value = this.cs.reverseFormatDate(val);
+            } else if (isStandardDateTime) {
+              elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+              elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+            } else if (isStandardTime) {
+              elem.innerHTML = val;
+              elem.dataset.dtvalue = val;
+            } else {
+              elem.value = val;
+              elem.setAttribute("value", elem.value);
+            }
+            if (
+              feldDetails.DISPLAY_FLAG == "N" ||
+              (feldDetails.VALIDATION_TYPE != "N" &&
+                feldDetails.READ_ONLY == "Y")
+            ) {
+              elem.dataset.colmText = val;
+              elem.value = this.validateEitObj[i].SEGMENT_VALUE_DSP;
+              elem.setAttribute("value", elem.value);
+            }
+          }
+          elem.dataset.hiddenval = val; //hide the value to set it after calling get value set
+          if (
+            feldDetails.CHILD_SEGMENTS_VS_Splited &&
+            feldDetails.CHILD_SEGMENTS_VS_Splited.length > 0
+          ) {
+            let listArray: any = feldDetails.CHILD_SEGMENTS_VS_Splited;
+            listArray.forEach(element => {
+              this.getValueSet(element);
+            });
+          }
+          //  var event = new Event('change');
+          // elem.dispatchEvent(event);
+        }
+      } else {
+        if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME ==
+          "PEI_OBJECT_VERSION_NUMBER"
+        )
+          obj.peiObjVer = this.validateEitObj[i].NUMBER_VALUE;
+        else if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME == "PEI_EXTRA_INFO_ID"
+        )
+          obj.peiExtraInfoID = this.validateEitObj[i].NUMBER_VALUE;
+      }
+    }
+    this.ExtraObj = obj;
+  }
+  public getValueSet(segmentName) {
+    let descFlexName: any = "";
+    let descFlexContextCode: any = "";
+    let parentValue: any = [];
+    let ParentsList: any = [];
+    let parentVal: any = null;
+    let dependenciesList: any = [];
+    let validationType: string = "";
+
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+        descFlexName = this.diffStructure[i].DESC_FLEX_NAME;
+        descFlexContextCode = this.diffStructure[i].DESC_FLEX_CONTEXT_CODE;
+        parentValue = this.diffStructure[i].PARENT_SEGMENTS_VS_SplitedVS;
+        ParentsList = this.diffStructure[i].PARENT_SEGMENTS_VS_SplitedVS;
+        validationType = this.diffStructure[i].VALIDATION_TYPE;
+        break;
+      }
+    }
+    if (parentValue != "" && (validationType == "D" || validationType == "Y")) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList,
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    };
+
+    this.eitService.getSetValue(body).subscribe((result: any) => {
+      if (result.GetValueSetValuesList != null) {
+        this.fillDropdownList(segmentName, result.GetValueSetValuesList);
+      }
+    });
+    let arr: any = [];
+    return arr;
+  }
+  isStandardDateVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+
+      isSt = true;
+
+    }
+    return isSt;
+  }
+
+  emptyChildElement(segmentName) {
+    let elem = this.getElementByName(segmentName);
+    elem.value = null;
+    elem.innerHTML = "";
+    if ("dtvalue" in elem.dataset) {
+      elem.dataset.dtvalue = "";
+    }
+    if ("colmText" in elem.dataset) {
+      elem.dataset.colmText = "";
+    }
+    var event = new Event("change");
+    elem.dispatchEvent(event);
+    elem.classList.remove("requiredClassElm");
+  }
+  getDependenciesParams(parentsList) {
+    let parentArr: any = [];
+    for (let i = 0; i < parentsList.length; i++) {
+      for (let j = 0; j < this.diffStructure.length; j++) {
+        if (this.diffStructure[j].SEGMENT_NAME == parentsList[i].Name) {
+          if (this.diffStructure[j].DISPLAY_FLAG != "N") {
+            if (this.diffStructure[j].VALIDATION_TYPE == "N") {
+              let idColName: string;
+              let val: any;
+              if (
+                this.diffStructure[j].FORMAT_TYPE == "Y" ||
+                this.diffStructure[j].FORMAT_TYPE == "I"
+              ) {
+                //standard date time or //time
+                let elem = document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLDivElement;
+                val = elem.dataset.dtvalue;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.diffStructure[j].FORMAT_TYPE == "Y")
+                  idColName = this.cs.formatStandardDate(val);
+              } else {
+                val = (document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement).value;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.diffStructure[j].FORMAT_TYPE == "X") {
+                  //date
+                  // idColName = this.cs.formatDate(val);
+                  idColName = this.cs.formatDateNew(val);
+                }
+              }
+              parentArr.push({
+                SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+                VALUE_COLUMN_NAME: val,
+                DESCRIPTION: "",
+                ID_COLUMN_NAME: idColName,
+                FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+              });
+              break;
+            } else {
+              if (this.diffStructure[j].READ_ONLY != "Y") {
+                let x = document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLSelectElement;
+                let text = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].text
+                  : "";
+                let val = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].value
+                  : undefined;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              } else {
+                let x = document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement;
+                let text = x.value;
+                let val = x.dataset.colmText;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              }
+            }
+          } else {
+            let x = document.getElementById(
+              this.diffStructure[j].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement;
+            let text = x.value;
+            let val = x.dataset.colmText;
+            if (
+              (val == undefined || val == "") &&
+              parentsList[i].IsRequired == "REQUIRED"
+            ) {
+              //alert(parentsList[i].Name +" Is required");
+              return false;
+            } else {
+            }
+            if (text == undefined) {
+              text = "";
+            }
+            parentArr.push({
+              SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+              VALUE_COLUMN_NAME: text,
+              DESCRIPTION: "",
+              ID_COLUMN_NAME: val,
+              FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+            });
+            break;
+          }
+        }
+      }
+    }
+    return parentArr;
+  }
+
+  isStandardTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard  time
+      //if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      //}
+    }
+    return isSt;
+  }
+  isStandardDateTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      //if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      //}
+    }
+    return isSt;
+  }
+
+  isStandardDateTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+  isStandardTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  isStandardDate(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+      // standard date
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  fixTransactionNo(): any[] {
+    const list: any = [];
+    let newIndex = 1;
+    const length: number = this.validEitTransactionTbl.length;
+    for (let i = 0; i < length; i++) {
+      //  let item :any={};
+      const item = Object.assign({}, this.validEitTransactionTbl[i]);
+      const transNo: number = item.TRANSACTION_NUMBER;
+      const obj: any = item;
+      if (i == 0) {
+        obj.TRANSACTION_NUMBER = newIndex;
+        list.push(obj);
+      } else {
+        const prevEl: any = this.validEitTransactionTbl[i - 1].TRANSACTION_NUMBER;
+        if (transNo == prevEl) {
+          obj.TRANSACTION_NUMBER = newIndex;
+          list.push(obj);
+        } else {
+          newIndex++;
+          obj.TRANSACTION_NUMBER = newIndex;
+          list.push(obj);
+        }
+      }
+    }
+    return list;
+  }
+  removeItems(transNo) {
+    const list = [];
+    for (let i = 0; i < this.validEitTransactionTbl.length; i++) {
+      if (this.validEitTransactionTbl[i].TRANSACTION_NUMBER != transNo) {
+        list.push(this.validEitTransactionTbl[i]);
+      }
+    }
+    this.validEitTransactionTbl = list;
+  }
+  submitTransaction() {
+    // (this.elementRef.nativeElement.querySelectorAll(
+    //   "ion-item"
+    // ) as HTMLElement[]).forEach(x => {
+    //   x.classList.add("ng-touched");
+    //   x.classList.remove("ng-untouched");
+    // });
+
+    // let arrValues = this.getElementsValues();
+
+    // if (arrValues) {
+    //   if (!this.startDate || !this.endDate) {
+    //     //this.common.showRequiredMsg();
+    //     return false;
+    //   }
+    //   let Sdata = moment(this.startDate).format("MM/DD/YYYY");
+    //   let Edata = moment(this.endDate).format("MM/DD/YYYY");
+
+    this.eitRequest = new EitRequest();
+    const list: any = this.getElementsValues();
+    this.eitRequest.EITTransactionTBL = list;
+    this.eitRequest.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp;
+    this.eitRequest.P_MENU_TYPE = this.selectedMenu.MENU_TYPE;
+    this.eitRequest.P_SELECTED_RESP_ID = -999;// this.selectedMenu.RESP_ID; // this.selMenu.List_Menu.RESP_ID,//-999,
+    this.eitRequest.P_FUNCTION_NAME = this.functionName;
+    this.eitRequest.P_DESC_FLEX_NAME = this.template.CONCURRENT_PROGRAM_NAME;
+    // this.reportSubmitRequest = {}
+    this.cs.startLoading();
+    this.reports
+      .submitTransaction(this.eitRequest, {}, this.ts.trPK('general', 'retry'))
+      .subscribe((result: any) => {
+
+        this.handleSubmit(result);
+      });
+  }
+
+
+
+  private handleSubmit(result) {
+
+    if (this.cs.validResponse(result)) {
+      //call another API to check the response;
+      this.checkStatus(result);
+
+
+    }
+  }
+  checkStatus(result) {
+    var request: any = {};
+    request.P_USER_NAME = this.selEmp;
+    request.P_MENU_TYPE = this.selectedMenu.MENU_TYPE;
+    request.P_SELECTED_RESP_ID = -999;
+    request.P_FUNCTION_NAME = this.functionName;
+    request.P_DESC_FLEX_NAME = this.template.CONCURRENT_PROGRAM_NAME;
+
+    this.reports.getTransaction(this.eitRequest, {}, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
+      this.cs.stopLoading();
+      this.cs.sharedService.setSharedData(result['GetCcpTransactionsList_New'], ReportServiceService.TRANSACTION_LIST);
+      this.cs.sharedService.setSharedData(this.template, ReportServiceService.TEMPLATE);
+      this.cs.openConcurrentTransaction();
+    });
+  }
+  public getElementsValues(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = this.comtransNo;
+    let textValue: any;
+    // if(this.ExtraObj.transactionNo)
+    // transNo=this.ExtraObj.transactionNo;
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+      /*********set transaction No of the updated object ********/
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+      }
+      if (this.diffStructure[i].DISPLAY_FLAG != "N") {
+        if (this.diffStructure[i].VALIDATION_TYPE == "N") {
+          let elem = document.getElementById(
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement;
+          let elemVal = (document.getElementById(
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement).value;
+          textValue = elemVal;
+          //let elemVal= (<HTMLInputElement>document.getElementById(this.eitResponse[i].APPLICATION_COLUMN_NAME)).value;
+          if (
+            this.diffStructure[i].FORMAT_TYPE == "X" &&
+            this.diffStructure[i].DISPLAY_FLAG != "N"
+          ) {
+            //date
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.diffStructure[i].FORMAT_TYPE == "Y" &&
+            this.diffStructure[i].DISPLAY_FLAG != "N"
+          ) {
+            //standard date time
+            // elemVal = elem.dataset.dtvalue;
+            // elemVal = this.cs.formatStandardDate(elemVal);
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.diffStructure[i].FORMAT_TYPE == "I" &&
+            this.diffStructure[i].DISPLAY_FLAG != "N"
+          ) {
+            //time
+            if (elemVal.length > 5) {
+              elemVal = elemVal.substring(11, 16);
+            } else {
+              elemVal = elemVal;
+            }
+          }
+          if (this.diffStructure[i].REQUIRED_FLAG == "Y" && !elemVal) {
+            elem.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            elem.classList.remove("requiredClassElm");
+          }
+          // if (elemVal != 'null'){
+          varcharValue = elemVal;
+          //} else{
+          //   elemVal = null;
+          //  }
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.diffStructure[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+          ) as HTMLSelectElement;
+          if (this.diffStructure[i].READ_ONLY == "Y") {
+            let text = x.value;
+            let val = x.dataset.colmText;
+            varcharValue = val;
+            textValue = text;
+          } else {
+            let val = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].value
+              : null;
+            let txt = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].text
+              : null;
+            varcharValue = val;
+            textValue = txt;
+          }
+          if (this.diffStructure[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+            x.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.diffStructure[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } //end else
+      } else {
+        let x = document.getElementById(
+          this.diffStructure[i].APPLICATION_COLUMN_NAME
+        ) as HTMLSelectElement;
+        let val = x.dataset.colmText;
+        textValue = x.value;
+        if (this.diffStructure[i].REQUIRED_FLAG == "Y" && !val) {
+          x.classList.add("requiredClassElm");
+          //this.common.showRequiredMsg();
+          return false;
+        } else {
+          x.classList.remove("requiredClassElm");
+        }
+        if (val) varcharValue = val;
+        valuseArr.push({
+          TRANSACTION_NUMBER: transNo,
+          NAME: this.diffStructure[i].APPLICATION_COLUMN_NAME,
+          VARCHAR2_VALUE: varcharValue,
+          NUMBER_VALUE: numbervalue,
+          DATE_VALUE: dateValue
+        });
+      }
+
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        y.VARCHAR2_VALUE = varcharValue;
+        y.NUMBER_VALUE = numbervalue;
+        y.DATE_VALUE = dateValue;
+        y.SEGMENT_VALUE_DSP = textValue;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+        this.updatedValues.push(y);
+      } else {
+        if (this.validateEitObj && this.eitSubmitAction == EIT_ACTION.UPDATE) {
+          let updatedObj = this.validateEitObj.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.diffStructure[i].APPLICATION_COLUMN_NAME
+          );
+          let y = updatedObj;
+          y.VARCHAR2_VALUE = varcharValue;
+          y.NUMBER_VALUE = numbervalue;
+          y.DATE_VALUE = dateValue;
+          y.SEGMENT_VALUE_DSP = textValue;
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        } else {
+          let y = {
+            TRANSACTION_NUMBER: transNo,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue,
+            SEGMENT_VALUE_DSP: textValue,
+            APPLICATION_COLUMN_NAME: this.diffStructure[i]
+              .APPLICATION_COLUMN_NAME,
+            DATATYPE: this.diffStructure[i].DATATYPE,
+            DESC_FLEX_CONTEXT_CODE: this.diffStructure[i].DESC_FLEX_CONTEXT_CODE,
+            DESC_FLEX_NAME: this.diffStructure[i].DESC_FLEX_NAME,
+            DISPLAY_FLAG: this.diffStructure[i].DISPLAY_FLAG,
+            SEGMENT_NAME: this.diffStructure[i].SEGMENT_NAME,
+            SEGMENT_PROMPT: this.diffStructure[i].SEGMENT_PROMPT
+          };
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        }
+      }
+    } // end for
+
+    if (this.getPassdirfromNotifiPage) {
+      let updatedObj1 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_ACTION"
+      );
+      let updatedObj2 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_EXTRA_INFO_ID"
+      );
+      let updatedObj3 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_OBJECT_VERSION_NUMBER"
+      );
+      this.updatedValues.push(updatedObj1);
+      this.updatedValues.push(updatedObj2);
+      this.updatedValues.push(updatedObj3);
+      valuseArr = this.fillExtraInformation(
+        valuseArr,
+        updatedObj1.VARCHAR2_VALUE,
+        updatedObj2.NUMBER_VALUE,
+        updatedObj3.NUMBER_VALUE,
+        transNo
+      );
+    } else {
+      if (this.eitSubmitAction == EIT_ACTION.ADD) {
+        this.updatedValues = this.fillExtraValuesUpdated(
+          this.updatedValues,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.UPDATE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "UPDATE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.DELETE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "DELETE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      }
+    }
+    return valuseArr;
+  } // end getElementsValues
+  fillExtraInformation(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_ACTION",
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_EXTRA_INFO_ID",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiExtraInfoID,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATE_VALUE: null
+    });
+    return values;
+  }
+  fillExtraValuesUpdated(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    let obj1 = {
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null,
+      SEGMENT_VALUE_DSP: "",
+      APPLICATION_COLUMN_NAME: "PEI_ACTION",
+      DATATYPE: "VARCHAR2",
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj2 = {
+      TRANSACTION_NUMBER: 1,
+      APPLICATION_COLUMN_NAME: "PEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATATYPE: "NUMBER",
+      SEGMENT_VALUE_DSP: "",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj3 = {
+      APPLICATION_COLUMN_NAME: "PEI_EXTRA_INFO_ID",
+      DATATYPE: "NUMBER",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      NUMBER_VALUE: peiExtraInfoID,
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: "",
+      SEGMENT_VALUE_DSP: "",
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: null
+    };
+    values.push(obj1);
+    values.push(obj2);
+    values.push(obj3);
+    return values;
+  }
+  selectTemplates() {
+    this.elementRef
+      .nativeElement.querySelectorAll('#containerDiv')[0].innerHTML = '';
+    this.getCppDiffStructure(this.template);
+  }
+  refreshStatus() {
+
+  }
+}
diff --git a/Mohem/src/app/reports/report-service.service.spec.ts b/Mohem/src/app/reports/report-service.service.spec.ts
new file mode 100644
index 00000000..dbf6efe5
--- /dev/null
+++ b/Mohem/src/app/reports/report-service.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ReportServiceService } from './report-service.service';
+
+describe('ReportServiceService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: ReportServiceService = TestBed.get(ReportServiceService);
+    expect(service).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/reports/report-service.service.ts b/Mohem/src/app/reports/report-service.service.ts
new file mode 100644
index 00000000..9196cb2c
--- /dev/null
+++ b/Mohem/src/app/reports/report-service.service.ts
@@ -0,0 +1,76 @@
+import { Injectable } from '@angular/core';
+import { AuthenticationService } from '../hmg-common/services/authentication/authentication.service';
+import { CommonService } from '../hmg-common/services/common/common.service';
+import { ConnectorService } from '../hmg-common/services/connector/connector.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ReportServiceService {
+  public static GET_CONCURRENT_PROGRAM = 'Services/ERP.svc/REST/GET_CONCURRENT_PROGRAMS';
+  public static GET_CPP_DIFF_STRUCTURE = 'Services/ERP.svc/REST/GET_CCP_DFF_STRUCTURE';
+  public static SUBMIT_CPP_REQUEST = 'Services/ERP.svc/REST/SUBMIT_CCP_TRANSACTION';
+  public static SUBMIT_CPP_TRANSACTION = 'Services/ERP.svc/REST/GET_CCP_TRANSACTIONS';
+  public static GET_CCP_OUTPUT = 'Services/ERP.svc/REST/GET_CCP_OUTPUT';
+
+  public static TRANSACTION_LIST = 'transaction-list';
+  public static TEMPLATE = 'template';
+  constructor(
+    public con: ConnectorService,
+    private authService: AuthenticationService,
+    public cs: CommonService
+  ) { }
+
+  getConcurrentProgram(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ReportServiceService.GET_CONCURRENT_PROGRAM,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  getCPPDiffStructure(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ReportServiceService.GET_CPP_DIFF_STRUCTURE,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  submitTransaction(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ReportServiceService.SUBMIT_CPP_REQUEST,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  getTransaction(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ReportServiceService.SUBMIT_CPP_TRANSACTION,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+  getCppOutput(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      ReportServiceService.GET_CCP_OUTPUT,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+
+}
diff --git a/Mohem/src/app/reports/reports.module.ts b/Mohem/src/app/reports/reports.module.ts
new file mode 100644
index 00000000..0fc1953d
--- /dev/null
+++ b/Mohem/src/app/reports/reports.module.ts
@@ -0,0 +1,43 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { Routes, RouterModule } from '@angular/router';
+
+import { IonicModule } from '@ionic/angular';
+
+import { ReportsPage } from './reports.page';
+import { ConcurrentReportComponent } from './concurrent-report/concurrent-report.component';
+import { ReportServiceService } from './report-service.service';
+import { HmgCommonModule } from '../hmg-common/hmg-common.module';
+import { TransactionListComponent } from './transaction-list/transaction-list.component';
+
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ReportsPage,
+    children: [
+      {
+        path: 'concurrent-report',
+        component: ConcurrentReportComponent
+      },
+      {
+        path: 'transaction-list',
+        component: TransactionListComponent
+      },
+    ],
+  }
+];
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    RouterModule.forChild(routes),
+    HmgCommonModule
+  ],
+  declarations: [ReportsPage, ConcurrentReportComponent, TransactionListComponent],
+  providers: [ReportServiceService]
+})
+export class ReportsPageModule { }
diff --git a/Mohem/src/app/reports/reports.page.html b/Mohem/src/app/reports/reports.page.html
new file mode 100644
index 00000000..67cbe279
--- /dev/null
+++ b/Mohem/src/app/reports/reports.page.html
@@ -0,0 +1,3 @@
+<ion-content>
+  <ion-router-outlet></ion-router-outlet>
+</ion-content>
\ No newline at end of file
diff --git a/Mohem/src/app/reports/reports.page.scss b/Mohem/src/app/reports/reports.page.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/Mohem/src/app/reports/reports.page.spec.ts b/Mohem/src/app/reports/reports.page.spec.ts
new file mode 100644
index 00000000..94e66db4
--- /dev/null
+++ b/Mohem/src/app/reports/reports.page.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ReportsPage } from './reports.page';
+
+describe('ReportsPage', () => {
+  let component: ReportsPage;
+  let fixture: ComponentFixture<ReportsPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ReportsPage ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ReportsPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/reports/reports.page.ts b/Mohem/src/app/reports/reports.page.ts
new file mode 100644
index 00000000..13faa7bd
--- /dev/null
+++ b/Mohem/src/app/reports/reports.page.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-reports',
+  templateUrl: './reports.page.html',
+  styleUrls: ['./reports.page.scss'],
+})
+export class ReportsPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}
diff --git a/Mohem/src/app/reports/transaction-list/transaction-list.component.html b/Mohem/src/app/reports/transaction-list/transaction-list.component.html
new file mode 100644
index 00000000..cfffd088
--- /dev/null
+++ b/Mohem/src/app/reports/transaction-list/transaction-list.component.html
@@ -0,0 +1,48 @@
+<ion-content>
+  <div class="head-title">
+
+    <app-generic-header showImage="false" showBack="true" [headerText]="'general,concurrent-report' | translate">
+    </app-generic-header>
+  </div>
+  <div class="header"></div>
+  <div class="bottom"></div>
+
+  <div class="main-container">
+
+    <div *ngIf="transactionList && transactionList.length>0" class="transaction-list">
+      <ion-card *ngFor="let transaction of transactionList">
+        <div [ngClass]="direction =='rtl' ? 'date_ar' :'date'" >{{getDate(transaction.REQUEST_DATE)}}</div>
+        <ion-label class="ion-text-wrap">
+          <ion-text color="primary">
+           <div>
+            <p class="display-created" >{{'transaction, request-id' | translate}}</p> 
+            <P class="inline-display">
+              {{transaction.REQUEST_ID}}
+            </P>
+          </div>
+            <p class="display-created" >{{'transaction, phase' | translate}}</p>
+            <p class="display-created bold padding">{{transaction.CCP_PHASE}}</p>
+          </ion-text>
+         
+          <ion-text color="secondary">
+            <div class="name-container">
+            <p class="color-black display-inline">{{'transaction,program-name' | translate}}</p>
+            <p class="display-inline red">{{transaction.CONCURRENT_PROGRAM_NAME}}</p>
+          </div>
+          </ion-text>
+
+          
+            <div class="output-container" >
+            <p class="color-black display-inline">{{'transaction,output' | translate}}</p>
+            <p class="display-inline" (click)="getCppOutput(transaction)" [ngClass]="transaction.CCP_PHASE =='Running'  || transaction.CCP_PHASE =='Pending'? 'disabled-icon' : '' " ><ion-icon name="download" class="download"></ion-icon></p>
+            <p class="display-inline" (click)="refresh(transaction)" *ngIf="transaction.CCP_PHASE =='Running'  || transaction.CCP_PHASE =='Pending'"><ion-icon name="refresh" class="refresh" > </ion-icon></p>
+          </div>
+          
+        </ion-label>
+      </ion-card>
+  
+    </div>
+
+</div>
+
+</ion-content>
diff --git a/Mohem/src/app/reports/transaction-list/transaction-list.component.scss b/Mohem/src/app/reports/transaction-list/transaction-list.component.scss
new file mode 100644
index 00000000..8e18b14f
--- /dev/null
+++ b/Mohem/src/app/reports/transaction-list/transaction-list.component.scss
@@ -0,0 +1,146 @@
+.display-created{
+    display: inline-block;
+    margin:2px;
+    color:#000;
+}
+#containerDiv{
+    margin-top:20px;
+}
+.padding{
+    padding-left:5px;
+    padding-right: 5px;
+}
+.bold{
+    font-weight: bold;
+    font-size: 16px;
+}
+.color-black{
+    color:#000;
+}
+.date{
+    position: absolute;
+    font-size: 14px;
+    padding: 10px;
+    right:0;
+    width: 100px;
+    color:#969696;
+}
+.date_ar{
+    position: absolute;
+    font-size: 14px;
+    padding: 10px;
+    left:0;
+    width: 100px;
+    color:#969696; 
+}
+.transaction-list{
+    margin-top:20px;
+}
+.date-container{
+    margin:0px 20px;
+}
+
+.label{
+    font-size: 16px;
+    // margin-left: 15px;
+    color: #a2a5a6 !important;
+    display: block;
+    overflow: hidden;
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    /* font-size: inherit; */
+    // text-overflow: ellipsis;
+    // white-space: nowrap;
+    white-space: normal;
+    // padding-top: 10px;
+    padding: 5px 0px;
+    padding-left: 10px !important;
+    margin: 10px auto;
+    :root[dir="ltr"]{
+        font-family: var(--fontFamilySemiBoldEN) !important;
+    }
+    :root[dir="rtl"]{
+        font-family: var(--fontFamilyIOSAR) !important;
+        font-weight: bold;
+    }
+
+
+}
+
+.Field-en{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 15px;
+  padding-left: 20px  !important; 
+  padding-top: 6px !important;
+  color: #999999 !important;
+}
+
+.Field-ar{
+  border-radius: 30px;
+  border: 1px solid #a2a5a6!important;
+  margin-bottom: 20px;
+  padding-right: 20px  !important; 
+  padding-top: 6px !important;
+  color: #999999 !important;
+}
+select{
+    width: 300px !important;
+    border: none !important;
+}
+.padding_date{
+    padding-left:5px !important;
+}
+.date-icon{
+    font-size: 20px;
+    left: -1px;
+    position: relative;
+    top: 2px;
+}
+ion-card{
+    padding:10px;
+    border-radius: 11px;
+    box-shadow: 0px 1px 2px 1px #ccc;
+}
+.display-inline{
+    display:inline-block;
+
+}
+.red{
+color:#CA3332;
+font-weight: 600;
+margin:0px 5px;
+overflow: hidden;
+    width: 90%;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+.inline-display{
+    display: inline-block;
+    font-weight: 600;
+    padding-left:8px;
+}
+.download{
+    font-size: 26px;
+    margin: 0px 10px;
+    position: relative;
+    top: 5px;
+    color: #CA3332;
+}
+.refresh{
+    font-size: 22px;
+    margin: 0px 10px;
+    position: relative;
+    top: 5px;
+    color: #CA3332; 
+}
+.disabled-icon{
+    pointer-events: none;
+    opacity: .5;
+}
+.output-container{
+    position: relative;
+    bottom: 10px;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/reports/transaction-list/transaction-list.component.spec.ts b/Mohem/src/app/reports/transaction-list/transaction-list.component.spec.ts
new file mode 100644
index 00000000..9a3a75e7
--- /dev/null
+++ b/Mohem/src/app/reports/transaction-list/transaction-list.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TransactionListComponent } from './transaction-list.component';
+
+describe('TransactionListComponent', () => {
+  let component: TransactionListComponent;
+  let fixture: ComponentFixture<TransactionListComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TransactionListComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TransactionListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/reports/transaction-list/transaction-list.component.ts b/Mohem/src/app/reports/transaction-list/transaction-list.component.ts
new file mode 100644
index 00000000..53449f9d
--- /dev/null
+++ b/Mohem/src/app/reports/transaction-list/transaction-list.component.ts
@@ -0,0 +1,103 @@
+import { Component, ElementRef, OnInit } from '@angular/core';
+import { File } from '@ionic-native/file/ngx';
+import { Platform } from '@ionic/angular';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { ReportServiceService } from '../report-service.service';
+import { FileOpener } from '@ionic-native/file-opener/ngx';
+@Component({
+  selector: 'app-transaction-list',
+  templateUrl: './transaction-list.component.html',
+  styleUrls: ['./transaction-list.component.scss'],
+})
+export class TransactionListComponent implements OnInit {
+  transactionList: any = [];
+  selectedMenu: any;
+  template: any;
+  direction: any;
+  constructor(public cs: CommonService, private elementRef: ElementRef, public reports: ReportServiceService, public ts: TranslatorService, private platform: Platform, private file: File, private opener: FileOpener,
+  ) { }
+
+  ngOnInit() {
+    this.selectedMenu = this.cs.sharedService.getSharedData(MenuResponse.SELECTED_MENU, false);
+    this.transactionList = this.cs.sharedService.getSharedData(ReportServiceService.TRANSACTION_LIST, false);
+    this.template = this.cs.sharedService.getSharedData(ReportServiceService.TEMPLATE, false);
+    this.direction = TranslatorService.getCurrentDirection();
+  }
+  getDate(date) {
+    return this.cs.evaluteDate(date);
+  }
+  getCppOutput(transaction) {
+    var request: any = {
+      P_REQUEST_ID: transaction['REQUEST_ID']
+    };
+    this.cs.startLoading();
+    this.reports.getCppOutput(request, {}, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
+      this.saveAndOpenPdf(result.GetCcpOutputList['P_OUTPUT_FILE'], 'report.pdf');
+
+      console.log(result);
+      this.cs.stopLoading();
+
+    });
+  }
+  // saveAndOpenPdf(pdf: string, filename: string) {
+
+  //   const linkSource = `data:application/pdf;base64,${pdf}`;
+  //   const downloadLink = document.createElement("a");
+  //   const fileName = "report.pdf";
+  //   downloadLink.href = linkSource;
+  //   downloadLink.download = fileName;
+  //   downloadLink.click();
+
+  // }
+
+  saveAndOpenPdf(pdf: string, filename: string) {
+    const writeDirectory = this.platform.is('ios') ? this.file.dataDirectory : this.file.externalDataDirectory;
+    this.file.writeFile(writeDirectory, filename, this.convertBase64ToBlob(pdf, 'data:application/pdf;base64'), { replace: true })
+      .then(() => {
+        this.opener.open(writeDirectory + filename, 'application/pdf')
+          .catch(() => {
+            console.log('Error opening pdf file');
+          });
+      })
+      .catch(() => {
+        console.error('Error writing pdf file');
+      });
+  }
+
+  convertBase64ToBlob(b64Data, contentType): Blob {
+    contentType = contentType || '';
+    const sliceSize = 512;
+    b64Data = b64Data.replace(/^[^,]+,/, '');
+    b64Data = b64Data.replace(/\s/g, '');
+    const byteCharacters = window.atob(b64Data);
+    const byteArrays = [];
+    for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
+      const slice = byteCharacters.slice(offset, offset + sliceSize);
+      const byteNumbers = new Array(slice.length);
+      for (let i = 0; i < slice.length; i++) {
+        byteNumbers[i] = slice.charCodeAt(i);
+      }
+      const byteArray = new Uint8Array(byteNumbers);
+      byteArrays.push(byteArray);
+    }
+    return new Blob(byteArrays, { type: contentType });
+  }
+  refresh(transaction) {
+    var request: any = {
+      P_REQUEST_ID: transaction['REQUEST_ID']
+    };
+    this.cs.startLoading();
+    var request: any = {};
+    request.P_MENU_TYPE = this.selectedMenu.MENU_TYPE;
+    request.P_SELECTED_RESP_ID = -999;
+    request.P_FUNCTION_NAME = this.selectedMenu.FUNCTION_NAME;
+    request.P_DESC_FLEX_NAME = this.template.CONCURRENT_PROGRAM_NAME;
+
+    this.reports.getTransaction(request, {}, this.ts.trPK('general', 'retry')).subscribe((result: any) => {
+      this.cs.stopLoading();
+      this.transactionList = result['GetCcpTransactionsList_New'];
+    });
+  }
+}
diff --git a/Mohem/src/app/termination/confirm-termination/confirm-termination.component.html b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.html
new file mode 100644
index 00000000..d7e4b690
--- /dev/null
+++ b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.html
@@ -0,0 +1,123 @@
+<app-generic-header showImage="false" showBack="true" [headerText]="'general,termination' | translate">
+</app-generic-header>
+
+<ion-content>
+<!-------------------------------Start New design ---------------------------------------->
+<ion-grid>
+  <ion-row style="margin-top: 20px;margin-left: 12px;">
+  <ion-col>
+  <div size="10" [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'" >{{'general, addAttach' | translate}}</div>
+  </ion-col>
+  <ion-col style="padding-left: 7%;" size="2">
+    <div class="fileDiv">
+       <input end class="inputfile" style="margin-top: 10px;z-index: 99999;position: absolute;opacity: 0;" type="file" ng2FileSelect [uploader]="uploader"
+        (change)="onFileSelected($event)" (click)="onFileSelectedclick($event)" />
+      <label end for="file" class="attachLable">
+        <ion-icon style="font-size: 22px;" name="add"></ion-icon>
+      </label></div>
+  </ion-col>
+</ion-row>
+  <ion-item class="attachmentDiv" *ngIf="attachListOver?.length == 0">
+      <ion-img style="height: 26px;width:100%;margin-top:12px" src="../assets/imgs/attach-icon.png"></ion-img>
+      <ion-label style="margin-top: -24px;" position="floating" class="boldTxtNav">{{ 'general, notAttch' | translate}}</ion-label>
+  </ion-item>
+</ion-grid>
+
+<ion-grid class="attachmentDiv" *ngIf="attachListOver?.length > 0">
+  <div *ngFor="let attachList of attachListOver ; let i = index">
+    <ion-row>
+      <ion-col size="1">
+        <ion-label style="color: black !important;">
+          {{attachList.AttachmentID +1 }} .
+         </ion-label>
+      </ion-col>
+      <ion-col style="text-align: left;" size="10">
+        <ion-label style="color: blue !important;" (click)="OpenAttachFiles(attachList.P_FILE_DATA,attachList.P_FILE_CONTENT_TYPE)">
+          {{attachList.P_FILE_NAME }}
+         </ion-label>
+      </ion-col>
+      <ion-col size="1">
+        <button float-end [disabled]="attachList.isSuccess" class="attachImgBtn removeLable"
+          (click)="removeFile(attachList)">
+          <ion-icon style="font-size:22px;margin-left:-7px;margin-top:-2px;" name="close"></ion-icon>
+        </button>
+         
+        </ion-col>
+    </ion-row>
+  </div>
+
+</ion-grid>
+<ion-grid *ngIf="attachmentRes?.length > 0">
+  <div *ngFor="let attachRes of attachmentRes">
+    <ion-row>
+      <ion-col col-8>
+        <div> <img float-start class="attachImg" src="../assets/imgs/file.png">
+        </div>
+        <ion-label>
+          {{attachRes.FILE_NAME }} </ion-label>
+
+      </ion-col>
+      <ion-col col-4>
+        <button float-end class="attachImgBtn"
+          (click)="OpenAttachFiles(attachRes.FILE_DATA,attachRes.FILE_CONTENT_TYPE)">
+          <img class="attachImg" src="../assets/imgs/view.png">
+        </button>
+        <button float-end [disabled]="!isResubmitEIT" class="attachImgBtn" (click)="delelteFile(attachRes)"><img
+            class="attachImg" src="../assets/imgs/deletegray.png"></button>
+      </ion-col>
+    </ion-row>
+  </div>
+
+</ion-grid>
+
+
+<ion-grid class="">
+  <div  [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'">{{'confirmAddEit, comment' | translate}}</div>
+ <ion-item class="submitNote" lines="none">
+   <ion-textarea type="text"  [(ngModel)]="eitComments"></ion-textarea>
+ </ion-item>
+</ion-grid>
+
+<ion-grid class="approvalList">
+ <div  [ngClass]=" direction === 'en' ?  'approvalTitle' : 'approvalTitle-ar'">{{'confirmAddEit, approverList' | translate}}</div>
+ <div class="noDataDiv" *ngIf="approversList?.length == 0">
+   <p>{{ 'general, empty' | translate}}</p>
+</div>
+<div style="background-color: white;border-radius: 32px;border: 1px solid #c8c4c4;"  *ngIf="approversList?.length > 0">
+   <ion-list class="notification-list ">
+       <div class="timeline">
+           <ion-item style="padding-left: 4%;" *ngFor="let employee of approversList">
+
+               <div class="timeline-item" slot="start">
+                   <div [class]="direction == 'en'? 'timeline-thumb-en  timeline-icon': 'timeline-thumb-ar  timeline-icon'">
+                       <img *ngIf="employee.EMPLOYEE_IMAGE" class="empImge"
+                           [src]="'data:image/png;base64,'+employee.EMPLOYEE_IMAGE">
+                       <img *ngIf="employee.EMPLOYEE_IMAGE == null" class="empImge"
+                           src="../assets/imgs/profile.png"> </div>
+               </div>
+               <ion-col>
+                   <ion-label style="color:black !important ;font-weight: bold;padding-top: 0%;">
+                       {{employee.APPROVER}}
+                   </ion-label>
+                   <ion-label style="color:black !important ;padding-top: 4%;">
+                     {{employee.POSITION_TITLE}}
+                 </ion-label>
+                  
+               </ion-col>
+               <div class="line"></div>
+           </ion-item>
+       </div>
+   </ion-list>
+</div>
+
+</ion-grid>
+
+
+</ion-content>
+
+<ion-footer>
+  <div class="centerDiv">
+    <ion-button class="confirmEitOkButton" color="customnavy" ion-button (click)="openSubmitModal()">
+      {{ 'general, submit' | translate }}</ion-button>
+  </div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss
new file mode 100644
index 00000000..2ed98379
--- /dev/null
+++ b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss
@@ -0,0 +1,263 @@
+.footer-button {
+    border-radius: 2px;
+    padding: 0 1.1em;
+    min-height: 45px;
+    min-width: 200px;
+  }
+  
+  .imgSize {
+    width: 22px;
+    height: 22px;
+  }
+  
+  .Header {
+    font-weight: bold;
+    color: #1a586d !important;
+    font-size: 10px;
+  }
+  
+  .tbData {
+    font-size: 10px;
+  }
+  
+  .btnBack {
+    background: transparent;
+    float: right;
+  }
+  
+  .attachmentDiv{
+    background: #ffffff;
+    height: auto;
+    text-align: center;
+    padding-top: 1px;
+    margin: 10px;
+    border-radius: 15px;
+    border: 1px solid grey;
+  }
+  
+  .noDataDiv{
+    background: #ffffff;
+    height: 11%;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 10px;
+    margin: 10px;
+    border-radius: 5px;
+  }
+  .submitNote{
+    background: #ffffff;
+    height: 80px;
+    padding-top: 1px;
+    margin: 10px;
+    border-radius: 15px;
+    border: 1px solid grey;
+  }
+  
+  .approvalList{
+    --background: #f0efef;
+    height: auto;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 10px;
+    margin: 10px;
+    border-radius: 5px;
+  }
+  
+  /************************New Design**********************************/
+  .notification-list{
+    background: none;
+    background: none;
+    border-radius: 32px;
+    ion-item{
+        // margin-top: 5px;
+        // margin-bottom: 5px;
+      
+        background-color: transparent;
+        .item-date{
+            width: 100%;
+            font-size: 16px;
+            font-weight: bold;
+         
+            text-align: start;
+            padding: 0;
+            margin: 0;
+         
+            position: absolute;
+            left: 0;
+            top: 12%;
+        }
+        ion-label , [item-end]{
+        
+            white-space: normal;
+            font-size: 14px;
+            padding-top: 15%;
+            // :root[dir="ltr"]{
+            //     margin-left: 10px;
+            // }
+            // :root[dir="rtl"]{
+            //     margin-right: 10px;
+            // }
+            
+        }
+  
+    }
+  }
+  
+  
+  
+  
+  
+  
+  .timeline {
+      position: relative;
+      margin: 15px 0 0 0;
+    //   border-bottom: solid 1px var(--cusgray);
+  }
+  
+  .timeline:before {
+   
+    content: '';
+    position: inherit !important;
+    top: 0;
+    bottom: 0;
+    width: 4px;
+    // background: #e4e4e4;
+    z-index: 1;
+    left: 35px;
+    /* margin-left: -10px; */
+    /* z-index: 1; */
+  }
+  
+  .timeline .timeline-thumb {
+   
+    border-radius: 500px;
+    width: 70px !important;
+    z-index: 2;
+    position: absolute;
+    left: 0px;
+    // :root[dir="ltr"]{
+    //    left: 37px;
+    // }
+    // :root[dir="rtl"]{
+    //     right: 37px;
+    // }
+    float: right;
+    top: 9px;
+  }
+  
+  .timeline .timeline-thumb.timeline-icon {
+      height: 70px;
+    //   text-align: center;
+    //   color: white;
+    //   border: 5px solid #CBD0D3;
+    //   transform: scale(0.2);
+  }
+  
+  
+  
+  .timeline .timeline-item {
+    width: 40px;
+  
+  }
+  
+  .timeline .timeline-stats {
+      position: relative;
+      font-size: 12px;
+      color: var(--darkgray);
+    
+  }
+  
+  .empImge{
+    border-radius: 50%;
+    width:100%;
+    height: 100%;
+    border: #dedede solid 1px;
+  
+  }
+  .empImgeRep {
+    border-radius: 50% !important;
+    width: 80px;
+    height: 80px;
+    border: #dedede solid 1px;
+  }
+  
+  .line{
+    padding-bottom:87px;
+  }
+  
+  .attachLable{
+    position: absolute;
+      top: 0px;
+      z-index: 0;
+      background: #30b8c6;
+      color: #fff;
+      border-radius: 50%;
+      border: 0px;
+      width: 24px;
+      height: 24px;
+      text-align: center;
+      font-size: 5px;
+  }
+  
+  .removeLable{
+    top: 0px;
+    z-index: 0;
+    background: #d8252d;
+    color: #fff;
+    border-radius: 50%;
+    border: 0px;
+    width: 20px;
+    height: 20px;
+    text-align: center;
+    font-size: 5px;
+  }
+  
+  .note-modal {
+    // width: 90%;
+    // height: 50%;
+    // top: 20%;
+    // left: 5%;
+    // right: 5%;
+    // bottom: 5%;
+    background: rgba(0, 0, 0, 0.5) !important;
+    padding: 30% 10% !important;
+    --height: 12cm !important;
+    // --width: 80% !important;
+    --border-radius:20px;
+    
+  }
+  .header-toolbar-new{
+    --background: #269DB8;
+  }
+  .title{
+    margin-top: -37px;
+    margin-left: 85px;
+  }
+  .title-ar{
+    margin-top: -37px;
+      margin-right: 101px;
+  }
+  .confirmEitOkButton{
+    white-space: normal !important;
+    text-transform: capitalize !important;
+    min-height: 45px !important;
+    min-width: 5px !important;
+    margin: 8px !important;
+    background-color: #269DB8;
+    width: 80% !important;
+    color: white!important;
+    border-radius: 16px !important;
+  }
+  
+  .approvalTitle-ar{
+    font-weight: bold;
+    font-size: 16px;
+    text-align: right;
+  
+  }
+  .approvalTitle{
+    font-weight: bold;
+    font-size: 16px;
+    text-align: left;
+  }
+  
\ No newline at end of file
diff --git a/Mohem/src/app/termination/confirm-termination/confirm-termination.component.spec.ts b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.spec.ts
new file mode 100644
index 00000000..c9818fc1
--- /dev/null
+++ b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConfirmTerminationComponent } from './confirm-termination.component';
+
+describe('ConfirmTerminationComponent', () => {
+  let component: ConfirmTerminationComponent;
+  let fixture: ComponentFixture<ConfirmTerminationComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ConfirmTerminationComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConfirmTerminationComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/termination/confirm-termination/confirm-termination.component.ts b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.ts
new file mode 100644
index 00000000..c0de3bb0
--- /dev/null
+++ b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.ts
@@ -0,0 +1,433 @@
+import { Component, OnInit } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { FileUploader } from 'ng2-file-upload';
+import { AddAttachComponent } from 'src/app/eit/add-attach/add-attach.component';
+import { NotificationGetAttachResponse } from 'src/app/eit/models/NotificationGetAttachRes';
+import { EitService } from 'src/app/eit/services/eit.service';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { HomeComponent } from 'src/app/notification/home/home.component';
+import { WorkListButtonRequest } from 'src/app/notification/models/NotificationButtonReq';
+import { WorkListAttachViewComponent } from 'src/app/notification/work-list-attach-view/work-list-attach-view.component';
+import { BasicRequest } from 'src/app/profile/models/basic.request';
+import { SubmitAddressModalComponent } from 'src/app/profile/submit-eit-modal/submit-address-modal.component';
+import { TerminationServiceService } from '../service/termination-service.service';
+
+@Component({
+  selector: 'app-confirm-termination',
+  templateUrl: './confirm-termination.component.html',
+  styleUrls: ['./confirm-termination.component.scss'],
+})
+export class ConfirmTerminationComponent implements OnInit {
+
+
+  private P_TransactionID: number;
+
+  approversList = [];
+  responseList: any;
+  eitComments: string = "";
+  menuType: string = "";
+  selEmp: string = "";
+  respID: number;
+  selMenu: MenuResponse;
+  getAttachList: any;
+  attachListDisplay: any = [];
+  headerTitle: string = "";
+  isTrue: any = 0;
+  attachItems: any;
+  public isResubmitEIT: boolean = false;
+  private itemKey: string = "";
+  private pActionMode: string = "SUBMIT";
+  attachReqObj: WorkListButtonRequest = new WorkListButtonRequest();
+  attachmentRes: any;
+  objIndex1: any;
+  attachListOver: any = [];
+  index: any = 0;
+  getPassNotificationDetails: any;
+  isSubmitBtnClicked: boolean;
+  // isDelete: boolean = false;
+
+  /***Add Attchment Vars */
+  isUpload: boolean = false;
+  inQueue: boolean = false;
+  addAttachmentListReq: any;
+  attachmentID: number = 0;
+  addAttachRequest: any = [];
+  fileData: any;
+  fileType: any;
+  dirPage: any;
+  TransactionID: any;
+  indexLastObj: any = 0;
+  filterAllowedType: any = ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
+  direction: string;
+
+
+  constructor(public modalController: ModalController, public cs: CommonService, private ts: TranslatorService, private eitService: EitService, public terminationService: TerminationServiceService) {
+    this.direction = TranslatorService.getCurrentLanguageName()
+    this.isSubmitBtnClicked = false;
+
+  }
+
+  ngOnInit() {
+    this.selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
+    this.selEmp = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false);
+    this.respID = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_RESP_ID, false);
+
+
+    this.menuType = this.selMenu.List_Menu.MENU_TYPE;
+    this.headerTitle = this.selMenu.GetMenuEntriesList.PROMPT;
+    this.responseList = this.cs.sharedService.getSharedData(TerminationServiceService.SHARED_DATA, false);
+    this.itemKey = this.responseList.P_ITEM_KEY;
+    this.P_TransactionID = this.responseList.P_TRANSACTION_ID;
+    // this.isDelete = this.isResubmitEIT = this.cs.sharedService.getSharedData('confirmAddEITData', false).isDelete;
+
+    this.getApproversList();
+
+  }
+
+  getApproversList() {
+    let body: any = {
+      P_TRANSACTION_ID: this.P_TransactionID,
+      P_AME_TRANSACTION_TYPE: "SSHRMS",
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    }
+    this.eitService.getApproversList(body).subscribe((result: any) => {
+      this.handleApproversResult(result);
+    });
+  }
+
+  handleApproversResult(result) {
+    if (this.cs.validResponse(result)) {
+      this.approversList = result.GetApprovesList;
+    }
+  }
+
+  startEitApproval() {
+    if (this.attachListOver) {
+      let request = {
+        AddAttachmentList: this.attachListOver
+      }
+
+      this.eitService.addAttachment(
+        request).
+        subscribe((result: any) => {
+          this.handleAddAttachmentResults(result);
+        });
+    } else {
+      this.startApprovalProcess();
+    }
+  }
+
+
+  handleAddAttachmentResults(result) {
+
+    if (this.cs.validResponse(result)) {
+      this.isTrue = 0;
+      for (let i = 0; i < result.AddAttSuccessList.length; i++) {
+        if (!result.AddAttSuccessList[i].AddSuccess) {
+          this.attachListOver[i].isSuccess = false;
+          //this.attachItems[i].isSuccess = false;
+          // if false display cancel button with waring icon or design
+        }// end if
+        else {
+          // if true remove cancel and set isSuccess = true
+          // this.attachItems[i].isSuccess = true;
+          this.attachListOver[i].isSuccess = true;
+          this.isTrue = this.isTrue + 1; //count flag of attach status
+        } //  end else
+      } // end for
+
+      if (this.isTrue == result.AddAttSuccessList.length) {
+        this.startApprovalProcess();
+      }
+      else {
+        //stope
+        let filtered = this.attachListOver.filter(function (el) { return el.isSuccess == true; });
+        this.attachListOver = filtered;
+        let msg: string = "";
+        msg = this.ts.trPK("eit", "attach-errorMsg");
+        this.cs.presentAlert(msg);
+      }
+    }
+  }
+
+  startApprovalProcess() {
+    let request: any = {};
+
+    request.P_MENU_TYPE = this.menuType;
+    request.P_SELECTED_RESP_ID = this.respID;
+    request.P_TRANSACTION_ID = this.P_TransactionID;
+    request.P_ITEM_KEY = this.itemKey;
+    request.P_ACTION_MODE = this.pActionMode;
+    request.P_COMMENTS = this.eitComments;
+    this.terminationService.startApprovalProcess(
+      request).
+      subscribe((result: any) => {
+        this.handleResults(result);
+      });
+  }
+  cancelEitProcess() {
+    let body: any = {
+      P_TRANSACTION_ID: this.P_TransactionID
+    }
+    this.eitService.cancelHRTransaction(
+      body).
+      subscribe((result: any) => {
+        this.handleCancelResults(result);
+      });
+
+  }
+  handleCancelResults(result) {
+    if (this.cs.validResponse(result)) {
+      this.isSubmitBtnClicked = false;
+    }
+  }
+  handleResults(result) {
+    if (this.cs.validResponse(result)) {
+      this.isSubmitBtnClicked = true;
+      // let msg: string = this.ts.trPK("eit", "approval-message-success");
+      // this.cs.presentAlert(msg);
+      this.cs.greenToastPK("eit", "approval-message-success");
+      this.cs.sharedService.setSharedData(true, HomeComponent.COUNT_CHANGED);
+      this.cs.openNotificationPage();
+    }
+  }
+
+  async addAttachment(str: boolean, attachItems: any) {
+    //open the modal with return data
+    let attachDocID = attachItems.ATTACHED_DOCUMENT_ID;
+
+    this.cs.sharedService.setSharedData(this.P_TransactionID, 'TransactionID');
+    this.cs.sharedService.setSharedData(this.attachListOver.length, 'indexLastObj');
+
+    const modal = await this.modalController.create({
+      component: AddAttachComponent
+    });
+
+    modal.onDidDismiss()
+      .then((data) => {
+        if (data == "cancel" || data == "undefined") {
+          return;
+        } else {
+          if (!str) {
+            this.updateFile(data, attachDocID);
+          } else {
+            console.log(data);
+            this.attachListDisplay = data.data;
+            this.attachItems = this.attachListDisplay.map(function (el) {
+              var o = Object.assign({}, el);
+              o.isSuccess = false;
+              return o;
+            });
+
+            this.attachListOver = this.attachListOver ? this.attachListOver.concat(this.attachItems) : this.attachItems;
+          }
+        }
+      });
+
+    return await modal.present();
+  }
+
+  /*****submit modal********/
+  async openSubmitModal() {
+    this.cs.sharedService.setSharedData(this.attachListOver, 'submitAttachmentList');
+    this.cs.sharedService.setSharedData(this.eitComments, 'eitComments');
+    const modal = await this.modalController.create({
+      component: SubmitAddressModalComponent,
+      backdropDismiss: false,
+
+    });
+    modal.cssClass = 'note-modal';
+
+    modal.onDidDismiss()
+      .then((data) => {
+        console.log(data.data);
+
+        if (data.data == "cancel" || data.data == undefined) {
+          return;
+        } else {
+          this.startEitApproval();
+        }
+      });
+
+    return await modal.present();
+  }
+
+
+
+  removeFile(objectitem) {
+    if (this.attachListOver) {
+      let index2 = this.attachListOver.findIndex(item => item == objectitem);
+      if (index2 > -1) {
+        this.attachListOver.splice(index2, 1);
+      }
+    }
+    if (this.attachmentRes) {
+      let index3 = this.attachmentRes.findIndex(item => item == objectitem);
+      if (index3 > -1) {
+        this.attachmentRes.splice(index3, 1);
+      }
+    }
+
+  }
+
+
+  getAttachment(NotificationID) {
+    this.attachReqObj.P_NOTIFICATION_ID = NotificationID;
+    this.eitService.getAttach(this.attachReqObj).
+      subscribe((result: NotificationGetAttachResponse) => {
+        this.handleWorkListAttachResult(result);
+      });
+  }
+
+  handleWorkListAttachResult(result) {
+    if (this.cs.validResponse(result)) {
+      if (result.GetAttachementList != null) {
+        this.attachmentRes = result.GetAttachementList;
+      } // if result == null
+    } // valid it
+
+  }
+
+  async OpenAttachFiles(value, Type) {
+    this.cs.sharedService.setSharedData({ displayData: value, TypeData: Type }, 'WorkListAttachViewPage');
+    const modal = await this.modalController.create({
+      component: WorkListAttachViewComponent
+    });
+
+    modal.onDidDismiss()
+      .then((data) => {
+      });
+    return await modal.present();
+  }
+
+
+  delelteFile(attach) {
+    this.cs.confirmAlertDialog((data) => {
+      if (data == true) {
+        this.continueDelete(attach);
+      }
+    }, this.ts.trPK('general', 'ok'), () => {
+
+    }, this.ts.trPK('general', 'cancel'), this.ts.trPK('general', 'alert'), this.ts.trPK('eit', 'delete-perm'));
+  }
+
+  continueDelete(attach) {
+    let req = {
+      P_ATTACHED_DOCUMENT_ID: attach.ATTACHED_DOCUMENT_ID
+    }
+    this.eitService.deleteAttach(req).
+      subscribe((result: any) => {
+        if (this.cs.validResponse(result)) {
+          if (result.DeleteAttachmentList.P_RETURN_STATUS === "S") {
+            this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+            let msg: string = "";
+            msg = this.ts.trPK("eit", "deleteAttach");
+            this.cs.presentAlert(msg);
+          }
+        }
+      });
+  }
+
+  updateFile(attachList, attachDocID) {
+    let req = {
+      P_ATTACHED_DOCUMENT_ID: attachDocID,
+      P_FILE_DATA: attachList[0].P_FILE_DATA,
+      P_FILE_NAME: attachList[0].P_FILE_NAME,
+      P_FILE_CONTENT_TYPE: attachList[0].P_FILE_CONTENT_TYPE
+    }
+    this.eitService.updateAttach(req).
+      subscribe((result: any) => {
+        if (this.cs.validResponse(result)) {
+          if (result.MessageStatus == 1) {
+            let msg: string = "";
+            msg = this.ts.trPK("eit", "attachUpdate");
+            this.cs.presentAlert(msg);
+            this.getAttachment(this.getPassNotificationDetails.NOTIFICATION_ID);
+          }
+        }
+      });
+  }
+
+
+  ionViewWillLeave() {
+    if (this.P_TransactionID && this.isSubmitBtnClicked == false)
+      this.cancelEitProcess();
+  }
+
+  /*******************Add attchement Functions*************/
+
+  public uploader: FileUploader = new FileUploader({
+    allowedMimeType: ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
+    maxFileSize: 10 * 1024 * 1024,
+    formatDataFunctionIsAsync: true,
+    formatDataFunction: async (item) => {
+      return new Promise((resolve, reject) => {
+        resolve({
+          name: item._file.name,
+          length: item._file.size,
+          contentType: item._file.type,
+          date: new Date()
+        });
+      });
+    }
+  });
+
+
+  onFileSelectedclick(event) {
+    event.target.value = '';
+  }
+
+
+
+  onFileSelected(input) {
+
+    if (!(this.filterAllowedType.indexOf(input.target.files[0].type) > -1)) {
+      let msg: string = "";
+      msg = this.ts.trPK("general", "notSupport");
+      this.cs.presentAlert(msg);
+      return
+    }    // todo: show alert that you tried uploading wrong files
+
+    else {
+      const file = input.target.files[0];
+      this.getBase64(file).then(
+        data => this.pushObject(data, file.name, file.type)
+      );
+    }
+  }
+
+
+  getBase64(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.readAsDataURL(file);
+      reader.onload = () => resolve(reader.result);
+      reader.onerror = error => reject(error);
+    });
+  }
+
+
+  pushObject(fileData, name, type) {
+
+    console.log("before push: " + this.index);
+    try {
+      let array = name.split('.');
+      let attachType: string = array[array.length - 1];
+      this.attachListOver.push(
+        {
+          AttachmentID: this.attachListOver.length,
+          P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
+          P_FILE_DATA: fileData.split(',')[1],
+          P_FILE_NAME: name,//.split('.')[0],
+          P_TRANSACTION_ID: this.P_TransactionID
+        })
+
+    } catch (e) {
+    }
+  }
+
+
+}
diff --git a/Mohem/src/app/termination/service/termination-service.service.spec.ts b/Mohem/src/app/termination/service/termination-service.service.spec.ts
new file mode 100644
index 00000000..f9172295
--- /dev/null
+++ b/Mohem/src/app/termination/service/termination-service.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { TerminationServiceService } from './termination-service.service';
+
+describe('TerminationServiceService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: TerminationServiceService = TestBed.get(TerminationServiceService);
+    expect(service).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/termination/service/termination-service.service.ts b/Mohem/src/app/termination/service/termination-service.service.ts
new file mode 100644
index 00000000..5f2d94e1
--- /dev/null
+++ b/Mohem/src/app/termination/service/termination-service.service.ts
@@ -0,0 +1,63 @@
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { ConnectorService } from 'src/app/hmg-common/services/connector/connector.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TerminationServiceService {
+
+  public static GET_TERM_COLS_STRUCTURE = 'Services/ERP.svc/REST/GET_TERM_COLS_STRUCTURE';
+  public static GET_TERM_DIFF_STRUCTURE = 'Services/ERP.svc/REST/GET_TERM_DFF_STRUCTURE';
+  public static SUBMIT_TRANSACTION = 'Services/ERP.svc/REST/SUBMIT_TERM_TRANSACTION';
+  public static START_APPORVAL = 'Services/ERP.svc/REST/START_TERM_APPROVAL_PROCESS';
+  public static TERMINATION_PAGE = 'termination-page';
+  public static SHARED_DATA = 'termination-submit-data';
+  constructor(
+    public con: ConnectorService,
+    private authService: AuthenticationService,
+    public cs: CommonService
+  ) { }
+  getTerminationColStructure(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      TerminationServiceService.GET_TERM_COLS_STRUCTURE,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  getTermDiffStructure(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      TerminationServiceService.GET_TERM_DIFF_STRUCTURE,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  submitTransation(request, onError, errorLabel) {
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.postNoLoad(
+      TerminationServiceService.SUBMIT_TRANSACTION,
+      request,
+      onError,
+      errorLabel
+    );
+  }
+  public startApprovalProcess(basicDetailsProcess: any, onError?: any, errorLabel?: string): Observable<any> {
+    const request = basicDetailsProcess;
+    this.authService.authenticateRequest(request);
+    request.P_SELECTED_EMPLOYEE_NUMBER = request.UserName;
+    return this.con.post(TerminationServiceService.START_APPORVAL, request, onError, errorLabel);
+  }
+
+
+
+
+}
diff --git a/Mohem/src/app/termination/termination-form/termination-form.component.html b/Mohem/src/app/termination/termination-form/termination-form.component.html
new file mode 100644
index 00000000..8525da97
--- /dev/null
+++ b/Mohem/src/app/termination/termination-form/termination-form.component.html
@@ -0,0 +1,19 @@
+<ion-content>
+  <div class="head-title">
+
+    <app-generic-header showImage="false" showBack="true" [headerText]="'general,termination' | translate">
+    </app-generic-header>
+  </div>
+  <div class="header"></div>
+  <div class="bottom"></div>
+  <div #containerDiv id="containerDiv">
+    <div #containerDivTwo id="containerDivTwo"></div>
+  </div>
+</ion-content>
+
+<ion-footer class="footer">
+  <div class="Btn">
+    <ion-button class="CreateBtn" color="customnavy" ion-button (click)="validateTransaction()">
+      {{'vacation-rule, next-label' | translate}}</ion-button>
+  </div>
+</ion-footer>
\ No newline at end of file
diff --git a/Mohem/src/app/termination/termination-form/termination-form.component.scss b/Mohem/src/app/termination/termination-form/termination-form.component.scss
new file mode 100644
index 00000000..652b0f19
--- /dev/null
+++ b/Mohem/src/app/termination/termination-form/termination-form.component.scss
@@ -0,0 +1,44 @@
+#containerDiv{
+    margin:15px;
+}
+
+@media screen and (min-width: 300px){
+    .CreateBtn{
+    --background: var(--newgreen) !important;
+    background: var(--newgreen) !important;
+    white-space: normal;
+    color: var(--light);
+    text-transform: capitalize;
+    min-height: 1.0cm;
+    --border-radius: 7px !important;
+    border-radius: 7px !important;
+    --min-height: 1.6cm !important;
+    width: 315px;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+}}
+
+@media screen and (min-width: 1px) and (max-width:290px) {
+.CreateBtn{
+    --background: var(--newgreen) !important;
+    background: var(--newgreen) !important;
+    white-space: normal;
+    color: var(--light);
+    text-transform: capitalize;
+    min-height: 1.0cm;
+    --border-radius: 7px !important;
+    border-radius: 7px !important;
+    --min-height: 1.6cm !important;
+    width: 257px;
+    font-family: var(--fontFamilyPoppins-SemiBold, inherit);
+}}
+
+.footer{
+    padding: 15px 0px;
+    background-color: var(--light) !important;
+    border: 0px !important;
+    box-shadow: none !important;
+    -webkit-box-shadow: none;
+}
+.Btn{
+    margin: auto; text-align: center; display: block;
+}
\ No newline at end of file
diff --git a/Mohem/src/app/termination/termination-form/termination-form.component.spec.ts b/Mohem/src/app/termination/termination-form/termination-form.component.spec.ts
new file mode 100644
index 00000000..bb916661
--- /dev/null
+++ b/Mohem/src/app/termination/termination-form/termination-form.component.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TerminationFormComponent } from './termination-form.component';
+
+describe('TerminationFormComponent', () => {
+  let component: TerminationFormComponent;
+  let fixture: ComponentFixture<TerminationFormComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TerminationFormComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TerminationFormComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/termination/termination-form/termination-form.component.ts b/Mohem/src/app/termination/termination-form/termination-form.component.ts
new file mode 100644
index 00000000..a874077e
--- /dev/null
+++ b/Mohem/src/app/termination/termination-form/termination-form.component.ts
@@ -0,0 +1,1465 @@
+import { Component, ElementRef, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+
+import * as moment from 'moment';
+import { EITTransactionsRequest } from 'src/app/eit/models/EITTransactionsReq';
+import { EIT_ACTION } from 'src/app/eit/models/submit.eit.action';
+import { EitService } from 'src/app/eit/services/eit.service';
+import { CommonService } from 'src/app/hmg-common/services/common/common.service';
+import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
+import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
+import { DateTimeInput } from 'src/app/uI-elements/date-time.input';
+import { DateInput } from 'src/app/uI-elements/date.input';
+import { HiddenInput } from 'src/app/uI-elements/hidden.input';
+import { NumberInput } from 'src/app/uI-elements/number.input';
+import { SelectInput } from 'src/app/uI-elements/select.input';
+import { TextInput } from 'src/app/uI-elements/text.input';
+import { TimeInput } from 'src/app/uI-elements/time.input';
+
+import { TerminationServiceService } from '../service/termination-service.service';
+
+
+@Component({
+  selector: 'app-termination-form',
+  templateUrl: './termination-form.component.html',
+  styleUrls: ['./termination-form.component.scss'],
+})
+export class TerminationFormComponent implements OnInit {
+  public selectedMenu;
+  public diffStructure = [];
+  public termColStructure = [];
+  public isUpdate: boolean;
+  private eitVALSettoCall: any = [];
+  private textInput;
+  private numberInput;
+  private dateInput;
+  public direction: string;
+  private datetimeInput;
+  private timeInput;
+  private selectInput;
+  private hiddenInput;
+  private validateEitObj: any = [];
+  public menuType: any;
+  public respID;
+  public selEmp;
+  public eitRequest;
+  private ExtraObj: any = {};
+  private arrValues: any = [];
+  selMenu: MenuResponse;
+  private country;
+  private updatedValues;
+  private effectiveDate;
+  private comtransNo;
+  private reportSubmitRequest = {};
+  getPassdirfromNotifiPage: boolean = false;
+  private startDate;
+  private endDate;
+  private targetValue;
+  public eitSubmitAction;
+  constructor(public cs: CommonService, private elementRef: ElementRef, public terminationFormService: TerminationServiceService, public ts: TranslatorService, public eitService: EitService, public router: ActivatedRoute) {
+    this.router.queryParams.subscribe(params => {
+      this.targetValue = params.targetValue;
+      console.log(this.targetValue);
+    });
+
+  }
+
+  ngOnInit() {
+    this.getPassdirfromNotifiPage = this.cs.sharedService.getSharedData('dirfromNotificationPage');
+    this.selectedMenu = this.cs.sharedService.getSharedData(TerminationServiceService.TERMINATION_PAGE, false);
+    this.getTerminationCol();
+    this.direction = TranslatorService.getCurrentLanguageName();
+    this.effectiveDate = new Date();
+    this.selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
+    this.eitSubmitAction = this.cs.sharedService.getSharedData(
+      EITTransactionsRequest.SUBMIT_EIT_ACTION
+    );
+  }
+  getTerminationCol() {
+    this.cs.startLoading();
+    this.terminationFormService.getTerminationColStructure({
+      P_FUNCTION_NAME: this.selectedMenu.P_FUNCTION_NAME
+    }, () => {
+
+    }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      this.termColStructure = response['GetTermColsStructureList'];
+      this.drawEitFieldsStatic(this.termColStructure);
+      this.getTermDiffStructure();
+    })
+  }
+  getTermDiffStructure() {
+    this.terminationFormService.getTermDiffStructure({
+      P_DESC_FLEX_CONTEXT_CODE: null,
+      P_FUNCTION_NAME: this.selectedMenu.FUNCTION_NAME
+    }, () => {
+      this.cs.back();
+    }, this.ts.trPK('general', 'retry')).subscribe((response) => {
+      this.cs.stopLoading();
+      this.handleDiffStructure(response);
+    })
+  }
+  handleDiffStructure(result) {
+    if (result.GetTermDffStructureList != null) {
+      this.diffStructure = result.GetTermDffStructureList;
+      this.drawEitFields(result.GetTermDffStructureList);
+      if (this.isUpdate) {
+        //this.submitAbsObjList = this.cs.sharedService.getSharedData(ProfileService.EMP_ADDRESS);
+        //this.fillAbsStructure();
+      }
+    }
+  }
+  private drawEitFields(feildsList) {
+    const containerId = "containerDiv";
+    this.eitVALSettoCall = [];
+    for (let i = 0; i < feildsList.length; i++) {
+      let defaultVal: string = "";
+      let defaultValText: string = "";
+
+      if (feildsList[i].DISPLAY_FLAG != "N") {
+        //check if the field should be displayed
+        if (feildsList[i].VALIDATION_TYPE == "N") {
+          //text , date , time
+          if (feildsList[i].FORMAT_TYPE == "C") {
+            // character
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "N") {
+            // number
+            this.numberInput = new NumberInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "X") {
+            // standard date
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              //constant
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.dateInput = new DateInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          } else if (feildsList[i].FORMAT_TYPE == "Y") {
+            // standard date time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                this.cs.reverseFormatStandardDate(defaultVal),
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.datetimeInput = new DateTimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+            const elem = document.getElementById(
+              feildsList[i].APPLICATION_COLUMN_NAME
+            );
+          } else if (feildsList[i].FORMAT_TYPE == "I") {
+            //time
+            if (
+              feildsList[i].DEFAULT_TYPE == "C" ||
+              feildsList[i].DEFAULT_TYPE == "D" ||
+              feildsList[i].DEFAULT_TYPE == "P" ||
+              feildsList[i].DEFAULT_TYPE == "S"
+            ) {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            } else {
+              this.timeInput = new TimeInput(
+                feildsList[i].SEGMENT_PROMPT,
+                feildsList[i].APPLICATION_COLUMN_NAME,
+                "",
+                containerId,
+                feildsList[i].MOBILE_ENABLED,
+                feildsList[i].DISPLAY_FLAG,
+                feildsList[i].REQUIRED_FLAG,
+                this.direction
+              );
+            }
+          }
+        } else {
+          if (feildsList[i].READ_ONLY == "Y") {
+            this.textInput = new TextInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              defaultValText,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+          } else {
+            this.selectInput = new SelectInput(
+              feildsList[i].SEGMENT_PROMPT,
+              feildsList[i].APPLICATION_COLUMN_NAME,
+              defaultVal,
+              containerId,
+              feildsList[i].MOBILE_ENABLED,
+              feildsList[i].DISPLAY_FLAG,
+              feildsList[i].REQUIRED_FLAG
+            );
+            this.fillDropdownList(
+              feildsList[i].SEGMENT_NAME,
+              feildsList[i].E_SERVICES_VS,
+              feildsList[i].E_SERVICES_DV
+            );
+          }
+        }
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      } else {
+        this.hiddenInput = new HiddenInput(
+          defaultVal,
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          defaultValText,
+          containerId
+        );
+        this.bindHtmlElemEvents(
+          feildsList[i].APPLICATION_COLUMN_NAME,
+          feildsList[i]
+        );
+      }
+    }
+    if (this.validateEitObj && this.validateEitObj.length > 0) {
+      this.fillEITStructure();
+    }
+  }
+  fillDropdownList(segmentName, optionList: any = [], DV: any = "") {
+    let elemID: any = "";
+    let eitObj: any;
+    if (optionList.length > 0) {
+      for (let i = 0; i < this.diffStructure.length; i++) {
+        if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+          eitObj = this.diffStructure[i];
+          if (
+            this.diffStructure[i].READ_ONLY == "Y" ||
+            this.diffStructure[i].DISPLAY_FLAG == "N"
+          ) {
+            return false;
+          }
+          elemID = this.diffStructure[i].APPLICATION_COLUMN_NAME;
+          break;
+        }
+      }
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+      if (eitObj.IsEmptyOption && eitObj.REQUIRED_FLAG == "N") {
+        var firstoption = document.createElement("option");
+        firstoption.text = this.ts.trPK("general", "choose");
+        firstoption.value = "";
+        select.add(firstoption);
+      }
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].VALUE_COLUMN_NAME;
+        option.value = optionList[i].ID_COLUMN_NAME;
+        select.add(option);
+      }
+      if (select.dataset.hiddenval) {
+        select.value = select.dataset.hiddenval;
+      } else {
+        select.value = DV.P_ID_COLUMN_NAME;
+      }
+      select.disabled = false;
+    }
+  }
+  bindHtmlElemEvents(id, obj) {
+    const elem = document.getElementById(id);
+    console.log(elem);
+    console.log(obj);
+    const elemType = elem.tagName;
+    let changeEvent = "ionChange";
+
+    if (elemType == "SELECT") changeEvent = "change";
+
+    try {
+      elem.addEventListener(changeEvent, e => {
+        elem.classList.remove("requiredClassElm");
+        if (
+          obj.CHILD_SEGMENTS_VS_Splited &&
+          obj.CHILD_SEGMENTS_VS_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_VS_Splited;
+          listArray.forEach(element => {
+            this.emptyChildElement(element);
+            this.getValueSet(element);
+          });
+        }
+        if (
+          obj.CHILD_SEGMENTS_DV_Splited &&
+          obj.CHILD_SEGMENTS_DV_Splited.length > 0
+        ) {
+          let listArray: any = obj.CHILD_SEGMENTS_DV_Splited;
+          listArray.forEach(element => {
+            this.emptyChildElement(element);
+            for (let i = 0; i < this.diffStructure.length; i++) {
+              if (this.diffStructure[i].SEGMENT_NAME == element) {
+                this.getDefaultValue(
+                  this.diffStructure[i],
+                  this.diffStructure[i].DESC_FLEX_NAME,
+                  this.diffStructure[i].DESC_FLEX_CONTEXT_CODE,
+                  this.diffStructure[i].SEGMENT_NAME,
+                  this.diffStructure[i].PARENT_SEGMENTS_VS_SplitedVS,
+                  this.diffStructure[i].PARENT_SEGMENTS_DV_Splited
+                );
+              }
+            }
+          });
+        }
+        return false;
+      });
+    } catch (e) {
+      console.log(e.status);
+    }
+  }
+  public getDefaultValue(
+    obj,
+    descFlexName,
+    descFlexContextCode,
+    segmentName,
+    parentValue,
+    ParentsList
+  ) {
+    let dependenciesList: any = [];
+    let parentVal: any = null;
+    let isStandardDate: boolean = false;
+    let isStandardTimeDate: boolean = false;
+    let isStandardTime: boolean = false;
+    let isHidden: boolean = false;
+    let isReadOnlyList: boolean = false;
+    let isSelectElement: boolean = false;
+    isStandardDate = this.isStandardDate(obj);
+    isStandardTimeDate = this.isStandardDateTime(obj);
+    isStandardTime = this.isStandardTime(obj);
+    if (obj.DISPLAY_FLAG == "N") isHidden = true;
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "Y") {
+      isReadOnlyList = true;
+    }
+    if (obj.VALIDATION_TYPE != "N" && obj.READ_ONLY == "N") {
+      isSelectElement = true;
+    }
+    if (
+      parentValue != "" &&
+      (obj.VALIDATION_TYPE == "D" || obj.VALIDATION_TYPE == "Y")
+    ) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      if (parentValue) ParentsList.concat(parentValue);
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList
+    };
+
+    this.eitService.getDefaultValue(body).subscribe((result: any) => {
+      let elem = this.getElementByName(segmentName);
+      let obj = this.handleDefaultValueResult(result);
+      let val = obj.value;
+      let text = obj.text;
+      if (val == null) { val = ""; }
+      if (text == null) { text = ""; }
+      if (isStandardDate) {
+        console.log("isStandardDate");
+        elem.value = this.cs.reverseFormatDate(val);
+      } else if (isStandardTimeDate) {
+        console.log("isStandardTimeDate");
+        if (val) {
+          elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+          elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else if (isStandardTime) {
+        console.log("isStandardTime");
+        if (val) {
+          elem.dataset.dtvalue = val;
+          elem.innerHTML = val;
+          elem.value = val;
+        } else {
+          elem.dataset.dtvalue = "";
+          elem.innerHTML = "";
+        }
+      } else {
+        if (isSelectElement) {
+          let elem = this.getSelectElementByName(segmentName);
+          elem = document.getElementById(elem),
+            elem.value = val;
+        } else {
+          elem.value = val;
+          elem.innerText = text;
+          elem.setAttribute("value", val);
+        }
+      }
+      if (isHidden || isReadOnlyList) {
+        if (val) elem.dataset.colmText = val;
+        else elem.dataset.colmText = "";
+        elem.value = text;
+      }
+      var event = new Event("ionChange");
+      elem.dispatchEvent(event);
+    });
+  }
+
+  handleDefaultValueResult(result) {
+    let data = {
+      text: result.GetDefaultValueList.P_VALUE_COLUMN_NAME,
+      value: result.GetDefaultValueList.P_ID_COLUMN_NAME
+    };
+    return data;
+  }
+  getSelectElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+        elemID = this.diffStructure[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return elemID;
+  }
+  getElementByName(segmentName) {
+    let elemID: any = "";
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+        elemID = this.diffStructure[i].APPLICATION_COLUMN_NAME;
+        break;
+      }
+    }
+    return document.getElementById(elemID) as HTMLInputElement;
+  }
+
+  fillEITStructure() {
+    var obj = { peiObjVer: null, peiExtraInfoID: null };
+    for (let i = 0; i < this.validateEitObj.length; i++) {
+      let val: any;
+      if (this.validateEitObj[i].VARCHAR2_VALUE)
+        val = this.validateEitObj[i].VARCHAR2_VALUE;
+      else if (this.validateEitObj[i].DATE_VALUE)
+        val = this.validateEitObj[i].DATE_VALUE;
+      else if (this.validateEitObj[i].NUMBER_VALUE)
+        val = this.validateEitObj[i].NUMBER_VALUE;
+      const elem = document.getElementById(
+        this.validateEitObj[i].APPLICATION_COLUMN_NAME
+      ) as HTMLInputElement;
+      //obj.transactionNo=this.validateEitObj[i].TRANSACTION_NUMBER;
+      if (elem) {
+        if (val) {
+          let feldDetails = this.diffStructure.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.validateEitObj[i].APPLICATION_COLUMN_NAME
+          );
+          if (feldDetails) {
+            let isStandardDate = this.isStandardDateVal(feldDetails);
+            let isStandardDateTime = this.isStandardDateTimeVal(feldDetails);
+            let isStandardTime = this.isStandardTimeVal(feldDetails);
+            if (isStandardDate) {
+              elem.value = this.cs.reverseFormatDate(val);
+            } else if (isStandardDateTime) {
+              elem.innerHTML = this.cs.reverseFormatStandardDate(val);
+              elem.dataset.dtvalue = this.cs.reverseFormatStandardDate(val);
+            } else if (isStandardTime) {
+              elem.innerHTML = val;
+              elem.dataset.dtvalue = val;
+            } else {
+              elem.value = val;
+              elem.setAttribute("value", elem.value);
+            }
+            if (
+              feldDetails.DISPLAY_FLAG == "N" ||
+              (feldDetails.VALIDATION_TYPE != "N" &&
+                feldDetails.READ_ONLY == "Y")
+            ) {
+              elem.dataset.colmText = val;
+              elem.value = this.validateEitObj[i].SEGMENT_VALUE_DSP;
+              elem.setAttribute("value", elem.value);
+            }
+          }
+          elem.dataset.hiddenval = val; //hide the value to set it after calling get value set
+          if (
+            feldDetails.CHILD_SEGMENTS_VS_Splited &&
+            feldDetails.CHILD_SEGMENTS_VS_Splited.length > 0
+          ) {
+            let listArray: any = feldDetails.CHILD_SEGMENTS_VS_Splited;
+            listArray.forEach(element => {
+              this.getValueSet(element);
+            });
+          }
+          //  var event = new Event('change');
+          // elem.dispatchEvent(event);
+        }
+      } else {
+        if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME ==
+          "PEI_OBJECT_VERSION_NUMBER"
+        )
+          obj.peiObjVer = this.validateEitObj[i].NUMBER_VALUE;
+        else if (
+          this.validateEitObj[i].APPLICATION_COLUMN_NAME == "PEI_EXTRA_INFO_ID"
+        )
+          obj.peiExtraInfoID = this.validateEitObj[i].NUMBER_VALUE;
+      }
+    }
+    this.ExtraObj = obj;
+  }
+  public getValueSet(segmentName) {
+    let descFlexName: any = "";
+    let descFlexContextCode: any = "";
+    let parentValue: any = [];
+    let ParentsList: any = [];
+    let parentVal: any = null;
+    let dependenciesList: any = [];
+    let validationType: string = "";
+
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      if (this.diffStructure[i].SEGMENT_NAME == segmentName) {
+        descFlexName = this.diffStructure[i].DESC_FLEX_NAME;
+        descFlexContextCode = this.diffStructure[i].DESC_FLEX_CONTEXT_CODE;
+        parentValue = this.diffStructure[i].PARENT_SEGMENTS_VS_SplitedVS;
+        ParentsList = this.diffStructure[i].PARENT_SEGMENTS_VS_SplitedVS;
+        validationType = this.diffStructure[i].VALIDATION_TYPE;
+        break;
+      }
+    }
+    if (parentValue != "" && (validationType == "D" || validationType == "Y")) {
+      let parvalue = this.getDependenciesParams(parentValue);
+      if (parvalue && parvalue[0]) parentVal = parvalue[0].ID_COLUMN_NAME;
+      else {
+        parentVal = null;
+      }
+      if (!parentVal) {
+        return false;
+      }
+    }
+    if (ParentsList != "") {
+      dependenciesList = this.getDependenciesParams(ParentsList);
+      if (!dependenciesList) {
+        return false;
+      }
+    }
+    const body = {
+      P_SELECTED_EMPLOYEE_NUMBER: this.selEmp,
+      P_MENU_TYPE: this.menuType,
+      P_SELECTED_RESP_ID: this.respID, //-999,
+      P_DESC_FLEX_NAME: descFlexName,
+      P_DESC_FLEX_CONTEXT_CODE: descFlexContextCode,
+      P_SEGMENT_NAME: segmentName,
+      P_PARENT_VALUE: parentVal,
+      GetValueSetValuesTBL: dependenciesList,
+      P_PAGE_NUM: 1,
+      P_PAGE_LIMIT: 1000
+    };
+
+    this.eitService.getSetValue(body).subscribe((result: any) => {
+      if (result.GetValueSetValuesList != null) {
+        this.fillDropdownList(segmentName, result.GetValueSetValuesList);
+      }
+    });
+    let arr: any = [];
+    return arr;
+  }
+  isStandardDateVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+
+      isSt = true;
+
+    }
+    return isSt;
+  }
+
+  emptyChildElement(segmentName) {
+    let elem = this.getElementByName(segmentName);
+    elem.value = null;
+    elem.innerHTML = "";
+    if ("dtvalue" in elem.dataset) {
+      elem.dataset.dtvalue = "";
+    }
+    if ("colmText" in elem.dataset) {
+      elem.dataset.colmText = "";
+    }
+    var event = new Event("change");
+    elem.dispatchEvent(event);
+    elem.classList.remove("requiredClassElm");
+  }
+  getDependenciesParams(parentsList) {
+    let parentArr: any = [];
+    for (let i = 0; i < parentsList.length; i++) {
+      for (let j = 0; j < this.diffStructure.length; j++) {
+        if (this.diffStructure[j].SEGMENT_NAME == parentsList[i].Name) {
+          if (this.diffStructure[j].DISPLAY_FLAG != "N") {
+            if (this.diffStructure[j].VALIDATION_TYPE == "N") {
+              let idColName: string;
+              let val: any;
+              if (
+                this.diffStructure[j].FORMAT_TYPE == "Y" ||
+                this.diffStructure[j].FORMAT_TYPE == "I"
+              ) {
+                //standard date time or //time
+                let elem = document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLDivElement;
+                val = elem.dataset.dtvalue;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.diffStructure[j].FORMAT_TYPE == "Y")
+                  idColName = this.cs.formatStandardDate(val);
+              } else {
+                val = (document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement).value;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                }
+                idColName = val;
+                if (this.diffStructure[j].FORMAT_TYPE == "X") {
+                  //date
+                  // idColName = this.cs.formatDate(val);
+                  idColName = this.cs.formatDateNew(val);
+                }
+              }
+              parentArr.push({
+                SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+                VALUE_COLUMN_NAME: val,
+                DESCRIPTION: "",
+                ID_COLUMN_NAME: idColName,
+                FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+              });
+              break;
+            } else {
+              if (this.diffStructure[j].READ_ONLY != "Y") {
+                let x = document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLSelectElement;
+                let text = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].text
+                  : "";
+                let val = x.options[x.selectedIndex]
+                  ? x.options[x.selectedIndex].value
+                  : undefined;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              } else {
+                let x = document.getElementById(
+                  this.diffStructure[j].APPLICATION_COLUMN_NAME
+                ) as HTMLInputElement;
+                let text = x.value;
+                let val = x.dataset.colmText;
+                if (
+                  (val == undefined || val == "") &&
+                  parentsList[i].IsRequired == "REQUIRED"
+                ) {
+                  //alert(parentsList[i].Name +" Is required");
+                  return false;
+                } else {
+                }
+                if (text == undefined) {
+                  text = "";
+                }
+                parentArr.push({
+                  SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+                  VALUE_COLUMN_NAME: text,
+                  DESCRIPTION: "",
+                  ID_COLUMN_NAME: val,
+                  FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+                });
+                break;
+              }
+            }
+          } else {
+            let x = document.getElementById(
+              this.diffStructure[j].APPLICATION_COLUMN_NAME
+            ) as HTMLInputElement;
+            let text = x.value;
+            let val = x.dataset.colmText;
+            if (
+              (val == undefined || val == "") &&
+              parentsList[i].IsRequired == "REQUIRED"
+            ) {
+              //alert(parentsList[i].Name +" Is required");
+              return false;
+            } else {
+            }
+            if (text == undefined) {
+              text = "";
+            }
+            parentArr.push({
+              SEGMENT_NAME: this.diffStructure[j].SEGMENT_NAME,
+              VALUE_COLUMN_NAME: text,
+              DESCRIPTION: "",
+              ID_COLUMN_NAME: val,
+              FLEX_VALUE_SET_NAME: this.diffStructure[j].FLEX_VALUE_SET_NAME
+            });
+            break;
+          }
+        }
+      }
+    }
+    return parentArr;
+  }
+
+  isStandardTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard  time
+      //if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      //}
+    }
+    return isSt;
+  }
+  isStandardDateTimeVal(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      //if(obj.DEFAULT_TYPE=="C" || obj.DEFAULT_TYPE=="D" || obj.DEFAULT_TYPE=="P"||obj.DEFAULT_TYPE=="S"){//constant
+      isSt = true;
+      //}
+    }
+    return isSt;
+  }
+
+  isStandardDateTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "Y") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+  isStandardTime(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "I") {
+      // standard date time
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  isStandardDate(obj: any): boolean {
+    let isSt: boolean = false;
+    if (obj.FORMAT_TYPE == "X") {
+      // standard date
+      if (
+        obj.DEFAULT_TYPE == "C" ||
+        obj.DEFAULT_TYPE == "D" ||
+        obj.DEFAULT_TYPE == "P" ||
+        obj.DEFAULT_TYPE == "S"
+      ) {
+        //constant
+        isSt = true;
+      }
+    }
+    return isSt;
+  }
+
+  validateTransaction() {
+    (this.elementRef.nativeElement.querySelectorAll(
+      "ion-item"
+    ) as HTMLElement[]).forEach(x => {
+      x.classList.add("ng-touched");
+      x.classList.remove("ng-untouched");
+    });
+
+
+    var arrValues = this.getElementsValues();
+    let staticValues = this.getElementsStaticValues();
+    let allStatisDynamicValues = arrValues.concat(staticValues);
+    if (arrValues) {
+
+      this.reportSubmitRequest = {
+
+        P_MENU_TYPE: this.selMenu.List_Menu.MENU_TYPE,
+        P_SELECTED_RESP_ID: -999,
+        P_FUNCTION_NAME: this.selMenu.GetMenuEntriesList.FUNCTION_NAME,
+        EITTransactionTBL: allStatisDynamicValues,
+
+      };
+      this.cs.startLoading();
+      this.terminationFormService
+        .submitTransation(this.reportSubmitRequest, {}, this.ts.trPK('general', 'retry'))
+        .subscribe((result: any) => {
+          this.handleSubmit(result);
+        });
+    }
+  }
+
+
+  private handleSubmit(result) {
+    if (this.cs.validResponse(result)) {
+      this.cs.sharedService.setSharedData(result['SubmitTermTransactionList'], TerminationServiceService.SHARED_DATA);
+      this.cs.stopLoading();
+      this.cs.confirmTermination();
+    }
+  }
+
+
+  public getElementsValues(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = 1;
+    let textValue: any;
+    // if(this.ExtraObj.transactionNo)
+    // transNo=this.ExtraObj.transactionNo;
+    for (let i = 0; i < this.diffStructure.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+      /*********set transaction No of the updated object ********/
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+      }
+      if (this.diffStructure[i].DISPLAY_FLAG != "N") {
+        if (this.diffStructure[i].VALIDATION_TYPE == "N") {
+          let elem = document.getElementById(
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement;
+          let elemVal = (document.getElementById(
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+          ) as HTMLInputElement).value;
+          textValue = elemVal;
+          //let elemVal= (<HTMLInputElement>document.getElementById(this.eitResponse[i].APPLICATION_COLUMN_NAME)).value;
+          if (
+            this.diffStructure[i].FORMAT_TYPE == "X" &&
+            this.diffStructure[i].DISPLAY_FLAG != "N"
+          ) {
+            //date
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.diffStructure[i].FORMAT_TYPE == "Y" &&
+            this.diffStructure[i].DISPLAY_FLAG != "N"
+          ) {
+            //standard date time
+            // elemVal = elem.dataset.dtvalue;
+            // elemVal = this.cs.formatStandardDate(elemVal);
+            elemVal = this.cs.formatDate(elemVal);
+          } else if (
+            this.diffStructure[i].FORMAT_TYPE == "I" &&
+            this.diffStructure[i].DISPLAY_FLAG != "N"
+          ) {
+            //time
+            if (elemVal.length > 5) {
+              elemVal = elemVal.substring(11, 16);
+            } else {
+              elemVal = elemVal;
+            }
+          }
+          if (this.diffStructure[i].REQUIRED_FLAG == "Y" && !elemVal) {
+            elem.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            elem.classList.remove("requiredClassElm");
+          }
+          // if (elemVal != 'null'){
+          varcharValue = elemVal;
+          //} else{
+          //   elemVal = null;
+          //  }
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.diffStructure[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+          ) as HTMLSelectElement;
+          if (this.diffStructure[i].READ_ONLY == "Y") {
+            let text = x.value;
+            let val = x.dataset.colmText;
+            varcharValue = val;
+            textValue = text;
+          } else {
+            let val = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].value
+              : null;
+            let txt = x.options[x.selectedIndex]
+              ? x.options[x.selectedIndex].text
+              : null;
+            varcharValue = val;
+            textValue = txt;
+          }
+          if (this.diffStructure[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+            x.classList.add("requiredClassElm");
+            //this.common.showRequiredMsg();
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.diffStructure[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } //end else
+      } else {
+        let x = document.getElementById(
+          this.diffStructure[i].APPLICATION_COLUMN_NAME
+        ) as HTMLSelectElement;
+        let val = x.dataset.colmText;
+        textValue = x.value;
+        if (this.diffStructure[i].REQUIRED_FLAG == "Y" && !val) {
+          x.classList.add("requiredClassElm");
+          //this.common.showRequiredMsg();
+          return false;
+        } else {
+          x.classList.remove("requiredClassElm");
+        }
+      }
+
+      if (this.getPassdirfromNotifiPage) {
+        let updatedObj = this.validateEitObj.find(
+          x =>
+            x.APPLICATION_COLUMN_NAME ==
+            this.diffStructure[i].APPLICATION_COLUMN_NAME
+        );
+        let y = updatedObj;
+        y.VARCHAR2_VALUE = varcharValue;
+        y.NUMBER_VALUE = numbervalue;
+        y.DATE_VALUE = dateValue;
+        y.SEGMENT_VALUE_DSP = textValue;
+        transNo = y.TRANSACTION_NUMBER; // set the transaction number for all items in the updated loop
+        this.updatedValues.push(y);
+      } else {
+        if (this.validateEitObj && this.eitSubmitAction == EIT_ACTION.UPDATE) {
+          let updatedObj = this.validateEitObj.find(
+            x =>
+              x.APPLICATION_COLUMN_NAME ==
+              this.diffStructure[i].APPLICATION_COLUMN_NAME
+          );
+          let y = updatedObj;
+          y.VARCHAR2_VALUE = varcharValue;
+          y.NUMBER_VALUE = numbervalue;
+          y.DATE_VALUE = dateValue;
+          y.SEGMENT_VALUE_DSP = textValue;
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        } else {
+          let y = {
+            TRANSACTION_NUMBER: transNo,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue,
+            SEGMENT_VALUE_DSP: textValue,
+            APPLICATION_COLUMN_NAME: this.diffStructure[i]
+              .APPLICATION_COLUMN_NAME,
+            DATATYPE: this.diffStructure[i].DATATYPE,
+            DESC_FLEX_CONTEXT_CODE: this.diffStructure[i].DESC_FLEX_CONTEXT_CODE,
+            DESC_FLEX_NAME: this.diffStructure[i].DESC_FLEX_NAME,
+            DISPLAY_FLAG: this.diffStructure[i].DISPLAY_FLAG,
+            SEGMENT_NAME: this.diffStructure[i].SEGMENT_NAME,
+            SEGMENT_PROMPT: this.diffStructure[i].SEGMENT_PROMPT
+          };
+          transNo = transNo; // set the transaction number for all items in the updated loop
+          this.updatedValues.push(y);
+        }
+      }
+    } // end for
+
+    if (this.getPassdirfromNotifiPage) {
+      let updatedObj1 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_ACTION"
+      );
+      let updatedObj2 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_EXTRA_INFO_ID"
+      );
+      let updatedObj3 = this.validateEitObj.find(
+        x => x.APPLICATION_COLUMN_NAME === "PEI_OBJECT_VERSION_NUMBER"
+      );
+      this.updatedValues.push(updatedObj1);
+      this.updatedValues.push(updatedObj2);
+      this.updatedValues.push(updatedObj3);
+      valuseArr = this.fillExtraInformation(
+        valuseArr,
+        updatedObj1.VARCHAR2_VALUE,
+        updatedObj2.NUMBER_VALUE,
+        updatedObj3.NUMBER_VALUE,
+        transNo
+      );
+    } else {
+      if (this.eitSubmitAction == EIT_ACTION.ADD) {
+        this.updatedValues = this.fillExtraValuesUpdated(
+          this.updatedValues,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "NEW_ROW",
+          -1,
+          0,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.UPDATE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "UPDATE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      } else if (this.eitSubmitAction == EIT_ACTION.DELETE) {
+        valuseArr = this.fillExtraInformation(
+          valuseArr,
+          "DELETE_ROW",
+          this.ExtraObj.peiExtraInfoID,
+          this.ExtraObj.peiObjVer,
+          transNo
+        );
+      }
+    }
+    return valuseArr;
+  } // end getElementsValues
+
+  fillExtraValuesUpdated(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    let obj1 = {
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null,
+      SEGMENT_VALUE_DSP: "",
+      APPLICATION_COLUMN_NAME: "PEI_ACTION",
+      DATATYPE: "VARCHAR2",
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj2 = {
+      TRANSACTION_NUMBER: 1,
+      APPLICATION_COLUMN_NAME: "PEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATATYPE: "NUMBER",
+      SEGMENT_VALUE_DSP: "",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: ""
+    };
+    let obj3 = {
+      APPLICATION_COLUMN_NAME: "PEI_EXTRA_INFO_ID",
+      DATATYPE: "NUMBER",
+      DATE_VALUE: null,
+      DESC_FLEX_CONTEXT_CODE: "",
+      DESC_FLEX_NAME: "",
+      DISPLAY_FLAG: "N",
+      NUMBER_VALUE: peiExtraInfoID,
+      SEGMENT_NAME: "",
+      SEGMENT_PROMPT: "",
+      SEGMENT_VALUE_DSP: "",
+      TRANSACTION_NUMBER: transNo,
+      VARCHAR2_VALUE: null
+    };
+    values.push(obj1);
+    values.push(obj2);
+    values.push(obj3);
+    return values;
+  }
+
+  fillExtraInformation(
+    values: any,
+    peiAction: string,
+    peiExtraInfoID: number,
+    peiObjVer: number,
+    transNo: number
+  ): any {
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_ACTION",
+      VARCHAR2_VALUE: peiAction,
+      NUMBER_VALUE: null,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_EXTRA_INFO_ID",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiExtraInfoID,
+      DATE_VALUE: null
+    });
+    values.push({
+      TRANSACTION_NUMBER: transNo,
+      NAME: "PEI_OBJECT_VERSION_NUMBER",
+      VARCHAR2_VALUE: null,
+      NUMBER_VALUE: peiObjVer,
+      DATE_VALUE: null
+    });
+    return values;
+  }
+
+  fixTransactionNo(transactionTBL: any): any[] {
+    let list: any = [];
+    let newIndex: number = 1;
+    let length: number = transactionTBL.length;
+    if (length > 0) {
+      for (let i = 0; i < length; i++) {
+        //  let item :any={};
+        const item = Object.assign({}, transactionTBL[i]);
+        let transNo: number = item.TRANSACTION_NUMBER;
+        let obj: any = item;
+        if (i == 0) {
+          obj.TRANSACTION_NUMBER = newIndex;
+          list.push(obj);
+        } else {
+          let prevEl: any = transactionTBL[i - 1].TRANSACTION_NUMBER;
+          if (transNo == prevEl) {
+            obj.TRANSACTION_NUMBER = newIndex;
+            list.push(obj);
+          } else {
+            newIndex++;
+            obj.TRANSACTION_NUMBER = newIndex;
+            list.push(obj);
+          }
+        }
+      }
+    }
+    return list;
+  }
+
+  private drawEitFieldsStatic(feildsList) {
+    const containerId = "containerDivTwo";
+    this.eitVALSettoCall = [];
+    for (let i = 0; i < feildsList.length; i++) {
+      let defaultVal: string = "";
+      let defaultValText: string = "";
+
+      if (feildsList[i].DISPLAY_FLAG != "N") {
+        //text , date , time
+        if (feildsList[i].DATATYPE == "VARCHAR2" && feildsList[i].ObjectValuesList === null) {
+          // character
+          this.textInput = new TextInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            defaultVal,
+            containerId,
+            defaultValText,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG
+          );
+        } else if (feildsList[i].DATATYPE == "VARCHAR2" && feildsList[i].ObjectValuesList !== null) {
+          this.selectInput = new SelectInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            defaultVal,
+            containerId,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG
+          );
+          this.fillStaticDropdownList(
+            feildsList[i].SEGMENT_NAME,
+            feildsList[i].ObjectValuesList,
+            feildsList[i].APPLICATION_COLUMN_NAME
+          );
+        } else if (feildsList[i].DATATYPE == "NUMBER") {
+          this.numberInput = new NumberInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            defaultVal,
+            containerId,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG
+          );
+        } else if (feildsList[i].DATATYPE == "DATE") {
+          this.dateInput = new DateInput(
+            feildsList[i].SEGMENT_PROMPT,
+            feildsList[i].APPLICATION_COLUMN_NAME,
+            "",
+            containerId,
+            feildsList[i].MOBILE_ENABLED,
+            feildsList[i].DISPLAY_FLAG,
+            feildsList[i].REQUIRED_FLAG,
+            this.direction
+          );
+
+        }
+      }
+    }
+
+  }
+
+  public fillStaticDropdownList(segmentName, optionList: any = [], elemID: string) {
+    let eitObj: any;
+    if (optionList.length > 0) {
+      let select = document.getElementById(elemID) as HTMLSelectElement;
+      document.getElementById(elemID).innerHTML = "";
+
+      for (let i = 0; i < optionList.length; i++) {
+        var option = document.createElement("option");
+        option.text = optionList[i].MEANING;
+        option.value = optionList[i].CODE;
+        select.add(option);
+      }
+    }
+  }
+
+  public getElementsStaticValues(): any {
+    this.updatedValues = []; //fill updated list
+    let valuseArr: any = [];
+    let varcharValue: any = null;
+    let numbervalue: any = 0;
+    let dateValue: any = null;
+    let transNo: number = 1;
+    let textValue: any;
+
+    for (let i = 0; i < this.termColStructure.length; i++) {
+      varcharValue = null;
+      numbervalue = null;
+      dateValue = null;
+
+      if (this.termColStructure[i].DISPLAY_FLAG != "N") {
+        if (this.termColStructure[i].ObjectValuesList === null) {
+          let elem = document.getElementById(this.termColStructure[i].APPLICATION_COLUMN_NAME) as HTMLInputElement;
+          let elemVal = elem !== null ? (document.getElementById(this.termColStructure[i].APPLICATION_COLUMN_NAME) as HTMLInputElement).value : '';
+          textValue = elemVal;
+
+          if (this.termColStructure[i].DATATYPE == "VARCHAR2" || this.termColStructure[i].DATATYPE == "NUMBER") {
+            elemVal = elemVal;
+          } else if (this.termColStructure[i].DATATYPE == "DATE") {
+            // date
+            elemVal = this.cs.formatDate(elemVal);
+          }
+
+          if (this.targetValue === 'new') {
+            if (this.termColStructure[i].REQUIRED_FLAG == "Y" && !elemVal) {
+              elem.classList.add("requiredClassElm");
+              return false;
+            } else {
+              elem.classList.remove("requiredClassElm");
+            }
+          }
+
+          if (this.termColStructure[i].DATATYPE == "DATE") {
+            dateValue = elemVal;
+          } else if (this.termColStructure[i].DATATYPE == "NUMBER") {
+            numbervalue = elemVal;
+          } else {
+            varcharValue = elemVal;
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.termColStructure[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        } else {
+          let x = document.getElementById(this.termColStructure[i].APPLICATION_COLUMN_NAME) as HTMLSelectElement;
+
+          let val = x.options && x.options[x.selectedIndex] ? x.options[x.selectedIndex].value : null;
+          let txt = x.options && x.options[x.selectedIndex] ? x.options[x.selectedIndex].text : null;
+          varcharValue = val;
+          textValue = txt;
+
+          if (x !== null) {
+            if (this.termColStructure[i].REQUIRED_FLAG == "Y" && !varcharValue) {
+              x.classList.add("requiredClassElm");
+              return false;
+            } else {
+              x.classList.remove("requiredClassElm");
+            }
+          }
+
+          valuseArr.push({
+            TRANSACTION_NUMBER: transNo,
+            NAME: this.termColStructure[i].APPLICATION_COLUMN_NAME,
+            VARCHAR2_VALUE: varcharValue,
+            NUMBER_VALUE: numbervalue,
+            DATE_VALUE: dateValue
+          });
+        }
+      } else {
+        let x = document.getElementById(this.termColStructure[i].APPLICATION_COLUMN_NAME) as HTMLSelectElement;
+        let val = x !== null ? x.dataset.colmText : '';
+        textValue = x !== null ? x.value : '';
+
+        if (x !== null) {
+          if (this.termColStructure[i].REQUIRED_FLAG == "Y" && !val) {
+            x.classList.add("requiredClassElm");
+            return false;
+          } else {
+            x.classList.remove("requiredClassElm");
+          }
+        }
+        varcharValue = val;
+
+
+
+        valuseArr.push({
+          TRANSACTION_NUMBER: transNo,
+          NAME: this.termColStructure[i].APPLICATION_COLUMN_NAME,
+          VARCHAR2_VALUE: varcharValue,
+          NUMBER_VALUE: numbervalue,
+          DATE_VALUE: dateValue
+        });
+      }
+    }
+    return valuseArr;
+  }
+  public customiseDate(date: any) {
+    let formatedDate = date.slice(0, 9);
+    let newDate = formatedDate.split("/").reverse();
+    const tmp = newDate[2];
+    newDate[2] = newDate[1];
+    newDate[1] = tmp;
+    newDate = newDate.join("/");
+    newDate = newDate + ' 00:00:00';
+    return newDate;
+  }
+}
diff --git a/Mohem/src/app/termination/termination.module.ts b/Mohem/src/app/termination/termination.module.ts
new file mode 100644
index 00000000..7302cb97
--- /dev/null
+++ b/Mohem/src/app/termination/termination.module.ts
@@ -0,0 +1,46 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { Routes, RouterModule } from '@angular/router';
+
+import { IonicModule } from '@ionic/angular';
+
+import { TerminationPage } from './termination.page';
+import { TerminationFormComponent } from './termination-form/termination-form.component';
+import { TerminationServiceService } from './service/termination-service.service';
+import { HmgCommonModule } from '../hmg-common/hmg-common.module';
+import { ConfirmTerminationComponent } from './confirm-termination/confirm-termination.component';
+import { SubmitAddressModalComponent } from '../profile/submit-eit-modal/submit-address-modal.component';
+
+
+const routes: Routes = [
+  {
+    path: '',
+    component: TerminationPage,
+    children: [
+      {
+        path: 'termination-form',
+        component: TerminationFormComponent
+      },
+      {
+        path: 'confirm-termination',
+        component: ConfirmTerminationComponent
+      },
+
+    ],
+  }
+];
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    RouterModule.forChild(routes),
+    HmgCommonModule
+  ],
+  declarations: [TerminationPage, TerminationFormComponent, ConfirmTerminationComponent],
+  providers: [TerminationServiceService],
+  entryComponents: [SubmitAddressModalComponent]
+})
+export class TerminationPageModule { }
diff --git a/Mohem/src/app/termination/termination.page.html b/Mohem/src/app/termination/termination.page.html
new file mode 100644
index 00000000..67cbe279
--- /dev/null
+++ b/Mohem/src/app/termination/termination.page.html
@@ -0,0 +1,3 @@
+<ion-content>
+  <ion-router-outlet></ion-router-outlet>
+</ion-content>
\ No newline at end of file
diff --git a/Mohem/src/app/termination/termination.page.scss b/Mohem/src/app/termination/termination.page.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/Mohem/src/app/termination/termination.page.spec.ts b/Mohem/src/app/termination/termination.page.spec.ts
new file mode 100644
index 00000000..04fa359a
--- /dev/null
+++ b/Mohem/src/app/termination/termination.page.spec.ts
@@ -0,0 +1,27 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TerminationPage } from './termination.page';
+
+describe('TerminationPage', () => {
+  let component: TerminationPage;
+  let fixture: ComponentFixture<TerminationPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TerminationPage ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TerminationPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/Mohem/src/app/termination/termination.page.ts b/Mohem/src/app/termination/termination.page.ts
new file mode 100644
index 00000000..f821ad78
--- /dev/null
+++ b/Mohem/src/app/termination/termination.page.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-termination',
+  templateUrl: './termination.page.html',
+  styleUrls: ['./termination.page.scss'],
+})
+export class TerminationPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}
diff --git a/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss b/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss
index ef433546..5cd0e320 100644
--- a/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss
+++ b/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss
@@ -852,7 +852,7 @@ $actionBtnSize : 36px;
       font-size: 18px;
     }
     span{
-        font-size: 11px;
+        font-size: 9px;
     }
   }
 }
diff --git a/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts b/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts
index 638d68e0..98f15742 100644
--- a/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts
+++ b/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts
@@ -184,7 +184,7 @@ export class TimeCardDetailsComponent implements OnInit {
               {
                 data: [this.absentDays, this.attendedDays],
                 backgroundColor: [
-                  '#269DB8',
+                  '#292F42',
                   '#269DB8'
                 ],
                 borderWidth: 2
diff --git a/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.html b/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.html
index 15900c2a..3d8f1032 100644
--- a/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.html
+++ b/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.html
@@ -33,9 +33,9 @@
 <!-- ////  okText='{{"general, ok" | translate }}' cancelText='{{"general, cancel" | translate }}'/// -->
 <div class="selectItem">
   <label class="label">{{'vacation-rule, itemType' | translate}}</label>
-  <select class="label-Select"  [(ngModel)]="index" (ionChange)="vacationRuleSel($event)" required>
-    <option [selected]="x.ITEM_TYPE_DISPLAY_NAME" value="{{i}}"
-      *ngFor="let x of ruleTypeList; let i=index;">
+  <select class="label-Select" name="selectAbsenceType" #selectAbsenceType="ngModel"  [(ngModel)]="index" (change)="vacationRuleSel()" required>
+    <option value="noType" selected hidden selected><p>{{ts.trPK('absenceList','selectType')}}</p></option>
+    <option  value="{{i}}" *ngFor="let x of ruleTypeList; let i=index;">
       {{x.ITEM_TYPE_DISPLAY_NAME}} </option>
   </select>
 </div>
diff --git a/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.ts b/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.ts
index eeef7508..acc38009 100644
--- a/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.ts
+++ b/Mohem/src/app/vacation-rule/vacation-type/vacation-type.component.ts
@@ -26,7 +26,7 @@ import { WorkListReplacementRollComponent } from 'src/app/notification/work-list
 })
 export class VacationTypeComponent implements OnInit {
   ruleTypeList: any;
-  index: any;
+  index = 'noType';
   vactionRuleSelected:any =-1;
   notificationTypeSelected: number;
   notification_list: any; ////
@@ -165,13 +165,11 @@ export class VacationTypeComponent implements OnInit {
 
 
   }
-  vacationRuleSel(event){
-    this.vactionRuleSelected=event.detail.value;
+  vacationRuleSel(){
+    this.vactionRuleSelected = this.index;
     if(this.notificationTypeShow){
-      //this.notificationTypeShow = false  
        this.notificationTypeShow = false 
        this.notifTypeSelP2 = "*";
-      //this.part3show = false
     }
     if (this.createVacationRuleShow){
       this.createVacationRuleShow = false 
@@ -180,11 +178,6 @@ export class VacationTypeComponent implements OnInit {
 
 
      }
-
-   
-    
-
-   console.log("event: "+ event.detail.value);
   }
   notificationSel(event){
 
diff --git a/Mohem/src/assets/icon/bar-chart-outline.svg b/Mohem/src/assets/icon/bar-chart-outline.svg
new file mode 100644
index 00000000..d17a6598
--- /dev/null
+++ b/Mohem/src/assets/icon/bar-chart-outline.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Bar Chart</title><path d="M32 32v432a16 16 0 0016 16h432" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><rect x="96" y="224" width="80" height="192" rx="20" ry="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><rect x="240" y="176" width="80" height="240" rx="20" ry="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><rect x="383.64" y="112" width="80" height="304" rx="20" ry="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/></svg>
\ No newline at end of file
diff --git a/Mohem/src/assets/icon/bar-chart.svg b/Mohem/src/assets/icon/bar-chart.svg
new file mode 100644
index 00000000..7a070f16
--- /dev/null
+++ b/Mohem/src/assets/icon/bar-chart.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Bar Chart</title><path d="M480 496H48a32 32 0 01-32-32V32a16 16 0 0132 0v432h432a16 16 0 010 32z"/><path d="M156 432h-40a36 36 0 01-36-36V244a36 36 0 0136-36h40a36 36 0 0136 36v152a36 36 0 01-36 36zM300 432h-40a36 36 0 01-36-36V196a36 36 0 0136-36h40a36 36 0 0136 36v200a36 36 0 01-36 36zM443.64 432h-40a36 36 0 01-36-36V132a36 36 0 0136-36h40a36 36 0 0136 36v264a36 36 0 01-36 36z"/></svg>
\ No newline at end of file
diff --git a/Mohem/src/assets/icon/blank.svg b/Mohem/src/assets/icon/blank.svg
new file mode 100644
index 00000000..458383af
--- /dev/null
+++ b/Mohem/src/assets/icon/blank.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+  <g id="Ellipse_219" data-name="Ellipse 219" fill="#fff" stroke="#c3c3c3" stroke-width="2">
+    <circle cx="16" cy="16" r="16" stroke="none"/>
+    <circle cx="16" cy="16" r="15" fill="none"/>
+  </g>
+</svg>
diff --git a/Mohem/src/assets/icon/green.svg b/Mohem/src/assets/icon/green.svg
new file mode 100644
index 00000000..635949a6
--- /dev/null
+++ b/Mohem/src/assets/icon/green.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+  <path id="Path_4727" data-name="Path 4727" d="M16,0A16,16,0,1,0,32,16,16,16,0,0,0,16,0ZM13.52,23.383,6.158,16.02l2.828-2.828,4.533,4.535L23.136,8.11l2.828,2.828Z" fill="#2bb7a7"/>
+</svg>
diff --git a/Mohem/src/assets/icon/select-all.svg b/Mohem/src/assets/icon/select-all.svg
new file mode 100644
index 00000000..f053110b
--- /dev/null
+++ b/Mohem/src/assets/icon/select-all.svg
@@ -0,0 +1 @@
+<svg height="512" viewBox="0 0 32 32" width="512" xmlns="http://www.w3.org/2000/svg"><g id="More_Select" data-name="More Select"><path d="m30 1h-24a1 1 0 0 0 -1 1v1h21a3 3 0 0 1 3 3v21h1a1 1 0 0 0 1-1v-24a1 1 0 0 0 -1-1z"/><path d="m26 5h-24a1 1 0 0 0 -1 1v24a1 1 0 0 0 1 1h24a1 1 0 0 0 1-1v-24a1 1 0 0 0 -1-1zm-4.747 9.344-8.728 8.726a1 1 0 0 1 -1.414 0l-4.364-4.363a1 1 0 0 1 1.414-1.414l3.657 3.656 8.021-8.019a1 1 0 0 1 1.414 1.414z"/></g></svg>
\ No newline at end of file
diff --git a/Mohem/src/assets/icon/settings-not.svg b/Mohem/src/assets/icon/settings-not.svg
new file mode 100644
index 00000000..e05313cb
--- /dev/null
+++ b/Mohem/src/assets/icon/settings-not.svg
@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="246.681" height="274.06" viewBox="0 0 246.681 274.06">
+  <g id="alarm" transform="translate(-25.575)">
+    <path id="Path_90" data-name="Path 90" d="M130.375,122.483a17.332,17.332,0,1,0,17.332-17.332A17.352,17.352,0,0,0,130.375,122.483Z" transform="translate(-48.703 -48.867)" fill="#fff"/>
+    <path id="Path_91" data-name="Path 91" d="M99,147.208A73.429,73.429,0,1,0,25.575,73.779,73.512,73.512,0,0,0,99,147.208ZM50.375,65.75H66.6a33.392,33.392,0,0,1,9.3-16.037L67.641,35.37l13.918-8.009L89.8,41.689a33.222,33.222,0,0,1,18.4,0l8.244-14.327,13.918,8.009-8.253,14.343a33.392,33.392,0,0,1,9.3,16.037h16.22V81.808h-16.22a33.389,33.389,0,0,1-9.3,16.037l8.253,14.343L116.449,120.2l-8.244-14.327a33.222,33.222,0,0,1-18.4,0L81.559,120.2l-13.918-8.009,8.253-14.343a33.392,33.392,0,0,1-9.3-16.037H50.375Z" transform="translate(0 -0.163)" fill="#fff"/>
+    <path id="Path_92" data-name="Path 92" d="M250.211,475.758a31.558,31.558,0,0,0,58.244,0Z" transform="translate(-104.394 -221.098)" fill="#fff"/>
+    <path id="Path_93" data-name="Path 93" d="M171.916,412.266h96.42l-.014.143h49.122V395.977l-22.837-23.132H145.646l-22.837,23.132v16.431H171.93Z" transform="translate(-45.187 -173.271)" fill="#fff"/>
+    <path id="Path_94" data-name="Path 94" d="M313.567,264.493h-85.69a89.107,89.107,0,0,1-50.122,21.163v20.777H313.567Z" transform="translate(-70.722 -122.917)" fill="#fff"/>
+    <path id="Path_95" data-name="Path 95" d="M300.174,73.616a89,89,0,0,1-16.629,51.9h70.983V67.906A67.92,67.92,0,0,0,265.9,3.235a89.379,89.379,0,0,1,34.279,70.381Z" transform="translate(-111.683)" fill="#fff"/>
+  </g>
+</svg>
diff --git a/Mohem/src/assets/icon/yellow.svg b/Mohem/src/assets/icon/yellow.svg
new file mode 100644
index 00000000..e146cb79
--- /dev/null
+++ b/Mohem/src/assets/icon/yellow.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+  <path id="Path_4728" data-name="Path 4728" d="M16,0A16,16,0,1,0,32,16,16,16,0,0,0,16,0ZM13.52,23.383,6.158,16.02l2.828-2.828,4.533,4.535L23.136,8.11l2.828,2.828Z" fill="#eac321"/>
+</svg>
diff --git a/Mohem/src/assets/imgs/hr-request.png b/Mohem/src/assets/imgs/hr-request.png
new file mode 100644
index 0000000000000000000000000000000000000000..c905603b82cab874185551c94467b9cf0993a790
GIT binary patch
literal 10488
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

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/Doable-old.png b/Mohem/src/assets/imgs/mohemm-action/Doable-old.png
new file mode 100644
index 0000000000000000000000000000000000000000..46d08d07325365424a64f010b0c832d160264530
GIT binary patch
literal 1441
zcmV;S1z!4zP)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00004b3#c}2nYxW
zd<bNS000G8Nkl<ZXhZFrZ){Ul6u{4U?Q|x9vKTTPX8+nTqXhZjwip>%P}*TslmsM@
zAZvr}gNc42BYfe5MiNah@<G9NGm*$Jy1)l$w=9`XM3^R1AraO;!3;JuW<y5eVC}n}
zTYb%2+qb^n_e$T&Zqjti&N=t|&N=Vi``$Z45Ezx8_Ewi5+X4tKV6Y4U${4~@`YshP
zH>U~%m_`PZ^gTiI{YgIuWeJZ(+FYZ#&PD#|8+C^V9%i=N+iAjWq|vBPD?d^M&ItMp
z`SJzE?*D4!^_IW%%#<CLF?4hWUjV>&N%#ppM(?H!19m}XxHsx`pUO7xoUo40zI7nS
z4<h24Y=#Q`cgEQFOp^9cd7sttMHANP>uqKzA4kCQLWAg@pTW3{usz~&4`kBG2<z|%
zI!O2(0=4O$$RdJN)^Wz9j)>RwL8?n>unvFU29gg@=}H#yKW8_nq-6&9e8lSxs+DKK
z)^znbB{}{RWpqi-GgwT4G5A}S?G4f0&yFar&4P9K0zXhjn=IzH0e9G$kf(KR8f>jE
z@T!D(%z$M}s?xUfGF`tXxO4wyc0ZFGD}qtVYNaJTHsBQBhr^@pCt*L*LQTWz557TP
z9~-b~b=CHe$Nh-{dyc#<=n*i_(K=7CO<2`+s@yKy#)vxm(J{{+<;y%jOV7lh0`Gwm
zR$|zWPG8_NK-`&+s6JM<7#7`UH^ubWt!cP+>mPAjj2%Wg8V2bQ;S#r!S(AgF-1M}m
zW?Q}-6b7b4#z|hrKa)qRP4$Y5y}8CgpITGR?l}D;3|*fPwfPG=e8C%t@Svy#Ej=}C
zPiRayBaO?;prL$eVj3f`{P@T-ON*8HLk(-hNwe&5!Ub3}@@!T{%(7!jX8EeSzH(Vw
zd>YHkfM0KX^n|X#RUO;L(D-E90%RH3d~7eN*SBS08z_56H$G)X)hBHn8jirB;c)Wz
z1z5rG8d{APGAkH$MXl({c<N3J+WUuLUsFBsMNU163YLTJI6VZvO-#XJx+6Nev0)Z)
z(ZH%fc{X`gKPT8Fs@uSM1*-t<e7p)?aXyl)P(7erc;3LK0v%YpDgmq)bY8)7XFI;T
zm^dCPV_#!^;&*<HYL%{ff#R}XtMoTJD=1(U2@xZAPlnINTKjA&umY3m8qH;=vLtM#
z3>yXIHeWh%Hd!IL1WA$2>j_H9a4w)j*C*lpc>1H4{@?#F1e&)pR!99KI@G^LE3<lg
znJX))tFcH1wRG~DSrJDUU`3*qLC4V3#k+CWV-hF)|8y~MiJrTy6fruVVCi+wW&TFs
z8+s$KP6W1M(E~8BrCCH(Q^)A`qGg!g(|*g#xSJl5Zx!{J1M`m=W9rU~;q65emcenJ
z*$&F=duBLmWgGM+;BBlq(qAXpVwZ~j{cK#eFTc0myz|m4_EM(BX>ZumdLY>?<6O}j
zrbdHmD_?hlzFi58x@wc%GTcb<_Cc|25pQdE;zmFnEh^_<X=Pp|7(vUa(F%Mq>~SY~
zX2DkbgR5=828*J15!g*xvOg2u_1uNz{cLJFilr-+{*S;FZFBdl`84{CgKyCv4qC1*
zbvnck5LCV&riyDede!&>>m`Jq`Bc)h#oVMm<4rkrk}DCZ_6Jtl0eMGfz0RN(P>fxU
z$4g#R_ZREVtRh&|HBf4c-}chY!X7GvM+-=kacb%sze+vt@6TZAkt@4erswi6r+&rS
z&feX~<jqvt8ww3gCEG_W!`-1acb8sYa)MQ7+b+*E6L>RCT1V}Gyt}K0j6I}xV!d*-
v*xVr5C_QS3P>@F$N`o<}WH4J6Gui(a@-F2i1VfQ#00000NkvXXu0mjf$~d*j

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/Doable.png b/Mohem/src/assets/imgs/mohemm-action/Doable.png
new file mode 100644
index 0000000000000000000000000000000000000000..36d8fb2532bf3413e47d6e2bce6562d5ec9b6957
GIT binary patch
literal 1371
zcmV-h1*H0kP)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00004b3#c}2nYxW
zd<bNS000FNNkl<ZXhZE=U2GIp6h8M(ZAna|6vQIkZ7KnL&=g~0d5~gkLKBPzHBkwP
zhV2IBO?)8mMvO)ija6S1+-;39QW7=wK_mu$sHl)&1gi<6qTOAgR?{DhNn1Mic+Q4t
zW|rNZzfN~{=zZJ0_nh;6_k4HmotZNNJhb7rpk+$PM?i>9fw&w28bH7j0b-E{cV$fw
za1s#41i&Z?F(MI<NU094OhDFcEb`&3UDyxHE^Bg|5MnD?v^ld1Y828Oh~psey_y;I
z{>@LqKTaaqk|nny+XMFl$mapXZBCrd?-(4EsP;A`;bXhFWyuoBjY`RG%H|z*jw;<x
zN%^`)>bpta-;}~ql58dg?I`3ST8E95CgL<cB3{&l+Sb$sUlg+`N_HqM_fW@kBwNjC
zpzw@Coi1p5;z{*#A*QRyX40?;P<}#JS{WV!E|DNA0qVY35{{THEo8I3u$tEBDU$9D
zF5QQ2I7xa!Q|hj!9dOP7XCa$OY2VU*xjuBry#qQP@6tD1MV5#@Mnn&K_Zw16)E|r|
zp`X#^GmHB`W}4)A+G3hR3fTuN9E@evI<XIE9aGDs<x|A_4IdsuZi+kOUFyv%WVI87
zw!%liK<Dcut=;uvq!$_|mApWiwLLlp3MWwKv=_~&l_L5QHf9lbicCtrO-X$s(1{I$
zbHx3WS&dH_ok8FcwTq#)q1Cr*H9Y~BN6+~4gYXf{_%y9o|A>k}S-$x*sB7Hl59Af=
z;r=^)62>!PC?&^fe_cE$hzgv<5;Jq=cI0peObs9N?2nI+EMt1A5==A5vINIYJmWe@
z?b24LZ+j(g=a($|m>05~5eDnF@e<&rut3)B%q?Wr<&5$6a%0B_P`Bb9mzLJyI6V&k
z{`5LbeE;lhN9bg12IPw^88hMByUVT(vdl8uQ?o!e6kE?+$~cmlMLO$_o!kXW+PZ-+
zaOM^%88gwp4&R$U=UzuQ2{&#2+(I}qWX(i5o7b;?92z$CRCi|o`{f<lGhef0%?Z(}
zTeIeKupv_>VMw=BMve4Vos37nN&sh<8x!Vc+<X_4u35)Z7r&hSDeLOVeqH`|sJ9+7
zVFSG#(Q+rSP?KfgX2O1m^3wSG=tFdzoG3RRwtc?uXYCFZOqg5YRksu}^P06q?{Yxk
zWL@I1oQ>Vu+KpczYd1sYemfbv@x@~Um9gKai`7Cl|8$Y+C(hEF_O)&^V2tN|v~kOK
zUd=6bULVXk2~LGmKl7U9UEJ4`Y$hyg>z%|bJ7#+HwD0YuOn_tjuBVUQ^*rhuY1kbg
z9%30&8IX7(>{$KcBN^`!xdX69Y4U8;-_O=5wc^@(^Um^!x|B)6dz-t|i{@&XU+HaL
zi{G^oHhUuaM?9-m%~s1W!06UN!Pa<E?_-YE3b(ZUf&RKZY}xUS2Y;lJpjkc^vbi+0
z>L3RqQM(9uiOTEmj%|lQW3nP!m5NezHYebySrw(~ji09Mc6*mkWi9ytL08{b3sICT
z^vb26Ll^SHYLYaOyrhBJ;;NF|n2|rzuyzJyKM}sQvbnO4&UZDMt{yPg7dy_ZG4S_Z
zSX86SBnsF~SL&F3*m)j-m_rFKDWMLuY=_Bm(OuOm4)w?#0>#7RaML_fDi-cj+Bo~-
z3BA`T7FT4=+13=a)3*fe^x4lE`j}`H_1!{p_kUAcfSlwxPJf-JkCuKDfagG{0bRm?
dT^5T?!2b}ni!c9ijadKy002ovPDHLkV1gOElj;Bf

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/More-2.png b/Mohem/src/assets/imgs/mohemm-action/More-2.png
new file mode 100644
index 0000000000000000000000000000000000000000..925f6ea5b5d1e33d4860b8316aff86e4b567cd84
GIT binary patch
literal 914
zcmV;D18w|?P)<h;3K|Lk000e1NJLTq0024w0027(1^@s6D(9Jv00009a7bBm000XT
z000XT0n*)m`~Uz0L`g(JRA_<in@?!dP#nj<Ys)slx;ih;2^O@)oz`A9Z*Cw2ysUcO
zVdOsSQ5eX)coqiUEFF0AAlpSO?9fdRriX3F*oX?PSSGS{e>za-pUTUANt>E%*_yP;
zYd)9sC28{e^!HwphTm%|m&-T}(Nrb`AO=8L+Q~A29k!H2VdpgGIgw~Il?ek#0vH0&
zZ?l{cD*&<p(vm1FoBfh0(P%2eGBycd#D>7@VV=b$i9+_cV;m_;-IEF4bBLG`vjE19
z>ehy$l*M!tyXZ;TWkbrSJNxujl4RCJl8i1Eb2OD1)7$u8Myn*d8Wo`p4A+iZjVO)D
zoXaJl*Ntnt?hFT#Acu7I3RN_k$|L~XY)V-6&>u}@CY2*sXY?^Ag4HBxI39}9mFkL9
zqO%azh2^WTl2P4DGAFP{R<uQ)zGA7}=2(;wXBka6AP~D5VxnQb9c5(EAqNCvHzD0;
zT@H!0ifC7>i0c1M;}K7kH#||^@I-kdV71S9{2B&(&SUT3H|{UImzN5C-9b#;xGuNS
zt9i`jzp2~KwFfXU*oWR=Cl)uhF}3v3(zq-Yy&LJpc>Jo`esU|0(U<Sk_Osgq2(}-d
za^PY&hMzB>u>W0dGs!!VOX{}L!7us8unJ4NZtvMMnl=kqVX&uLl~lMKtnAM+dDOA$
z#Zu9?UyGXd+~-QyT-+$4RMm~y=e4apwY|1g(tLNVsBPDa|H8=Vm{tEtSvO<>b_D!*
z{bdu67T59f&tG*rTi5CLW4&0ygEy-v?Ek22D{RX09RVMvmOkOdhk~V|>{UvZv)7!u
zc=u7>@I-mT6Xgw0ls8&MG~X(sIUf~f@Qy5My3EYQEVoKVXM9vvHtT?3>|#X{g`9FR
zN;m%e4MQ$Mkwqm@VD&}Ty`XUpd8(b#+(&sV*qBr*K2=ewottiISk^KxiGn&LYabYr
zRN?G)c591JG@_K|1nuZnl!C_{Ls62=Q2~b=FHVNV$-2+Fv}25F*4+XdaxtR{>|-Yn
zP=#dD;pMFlB~ef-IrT6*OCn5@2oeqxo~Bz!?zkOKI`1V!vI!c;jh5b}XLDuVi|NTe
or=H2gpiDQa#4cwhbGiWd2Z)XjnX^o=`v3p{07*qoM6N<$f(iJrN&o-=

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/More.png b/Mohem/src/assets/imgs/mohemm-action/More.png
index 925f6ea5b5d1e33d4860b8316aff86e4b567cd84..005e24ba0164231310d3fa8a3bf8eef51026acc5 100644
GIT binary patch
literal 1161
zcmV;41a|w0P)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00004b3#c}2nYxW
zd<bNS000C)Nkl<ZXhZE=O=uHA6y8mGDE&#Ih*Ts<EmjYf>P34<+k?<TgQ5uj(1RBd
zz3HVScclS^dh_R^CtE>852-~2wT*w^L5&AnRHPLJ5pB|z3MGl(+p=X-H`&?5x0y6q
z7+N~>-n?(VH#6_;zN$(A&*I`@^U~7N5s3DpZA4p-whpbf0CiR(e=y)T+Ap*pXk#@s
zHN$mvbu(6itNT?^fn+kdA(P4UtEze&GJ8ekn8szGHwIg7!KOPNkLRbzJeFXgOr4vX
z+Ye<I&~}O_b$Co1Hio@kZ`5kuykG&cJDpAsVFh<vDUzW78EhB;%g=M!k`pX|c45VC
zL$FB#AfhIG2QmGPjg61Z1WdtVe}*vlJepf{7Kz5CU`q%LU$Q))=I7^o;JObm&?ON7
zyQZXFE?2Ojp<&D@n8j=&k=TaL*Kh@oUG1`s#}-Tg#~v^|rQ4PT7Vi539UZb6UW7d{
zfbIMTEDoe&SdHN#6w4}l2!QXAaT>D#=>n^tLHib2EiS^YI8NtXz?Rm)g4NRie5DA5
zQi}rU834Yjfd#8C@q;x4oS2wUB9Vv^kH@uzX=`g!LZOh-*}1Z%I2Y^{T)9KVRnvs4
z=9}))95W6M4l2~lo^Uv<P-A{FZnt|g#l5U9OpFGD!Ms?a(I`8^<jN{s_$Dkl!L_n|
zeSJzS7R#$X5C|xvqoZ6V=z6cI2qeaUn(|VX$M5$mm?N)lpU<aEPfxSVZ%}%ln0<pk
zv~$fQ0v73+GBaa47q@HjTVi$=%zEugijJ4XjkWL*%u?3R_Q-NT5kPjZG>HUPk4B~=
zU}+*^m_QqY3c6n%3M!lh%eGH!D0Yll8#b{Gt%7A++7c^vjM)-rJ<c6a6?64eR8S#H
zxadewA(99<l=bjOP$FO*%6j<0R+Jl8)B#n^dawfYDz%#RFou+lg^P?BgjH9;3NKZe
z4P<}2sINz<vmX8J;s+SCos%R<vYtuWvrhoDn+vQ&LB&&Y;}N_hKgtDGmT-~EoQPQ}
z12X@f_#ak4BoS~T>jBtv1hy5JXy00v_7#F%1gryDPX?tzo7lg+OX9}MU*3r=PFI%X
zfC>X_#8@r!5eHRsA+BmAQ_8Ccd-V%|wyadkkg?o#P^J3TL-o<9lo`?9K^a+rJHMms
z%ZjNo>VFSbSMX$kMdeI;DwP^vBejc3RLBHSthro^WOm)Gp{mqg0DWZiLeskyQPo+n
zJ5)yQnq?{l5V*T9ueLvDAOVK=!KLq(lS>0+62ZekTb1Pcir~PaY=|m4ca#Ckld$oC
zvA$TCS$!Z@s}?MuM9JR(SoTW@`YUX_2$0udAN>zd&c{|fjJx<0Kp%$Eo>GGbz=yD7
z1R!sS+F}c=k?n<rg)Z#rE=<^piCfUO6~FsLCl(zC-Ln`=wa}mN`xLH|@%s9Dx*qeg
bXr})!U<g|wZGAD!00000NkvXXu0mjf{qGQL

literal 914
zcmV;D18w|?P)<h;3K|Lk000e1NJLTq0024w0027(1^@s6D(9Jv00009a7bBm000XT
z000XT0n*)m`~Uz0L`g(JRA_<in@?!dP#nj<Ys)slx;ih;2^O@)oz`A9Z*Cw2ysUcO
zVdOsSQ5eX)coqiUEFF0AAlpSO?9fdRriX3F*oX?PSSGS{e>za-pUTUANt>E%*_yP;
zYd)9sC28{e^!HwphTm%|m&-T}(Nrb`AO=8L+Q~A29k!H2VdpgGIgw~Il?ek#0vH0&
zZ?l{cD*&<p(vm1FoBfh0(P%2eGBycd#D>7@VV=b$i9+_cV;m_;-IEF4bBLG`vjE19
z>ehy$l*M!tyXZ;TWkbrSJNxujl4RCJl8i1Eb2OD1)7$u8Myn*d8Wo`p4A+iZjVO)D
zoXaJl*Ntnt?hFT#Acu7I3RN_k$|L~XY)V-6&>u}@CY2*sXY?^Ag4HBxI39}9mFkL9
zqO%azh2^WTl2P4DGAFP{R<uQ)zGA7}=2(;wXBka6AP~D5VxnQb9c5(EAqNCvHzD0;
zT@H!0ifC7>i0c1M;}K7kH#||^@I-kdV71S9{2B&(&SUT3H|{UImzN5C-9b#;xGuNS
zt9i`jzp2~KwFfXU*oWR=Cl)uhF}3v3(zq-Yy&LJpc>Jo`esU|0(U<Sk_Osgq2(}-d
za^PY&hMzB>u>W0dGs!!VOX{}L!7us8unJ4NZtvMMnl=kqVX&uLl~lMKtnAM+dDOA$
z#Zu9?UyGXd+~-QyT-+$4RMm~y=e4apwY|1g(tLNVsBPDa|H8=Vm{tEtSvO<>b_D!*
z{bdu67T59f&tG*rTi5CLW4&0ygEy-v?Ek22D{RX09RVMvmOkOdhk~V|>{UvZv)7!u
zc=u7>@I-mT6Xgw0ls8&MG~X(sIUf~f@Qy5My3EYQEVoKVXM9vvHtT?3>|#X{g`9FR
zN;m%e4MQ$Mkwqm@VD&}Ty`XUpd8(b#+(&sV*qBr*K2=ewottiISk^KxiGn&LYabYr
zRN?G)c591JG@_K|1nuZnl!C_{Ls62=Q2~b=FHVNV$-2+Fv}25F*4+XdaxtR{>|-Yn
zP=#dD;pMFlB~ef-IrT6*OCn5@2oeqxo~Bz!?zkOKI`1V!vI!c;jh5b}XLDuVi|NTe
or=H2gpiDQa#4cwhbGiWd2Z)XjnX^o=`v3p{07*qoM6N<$f(iJrN&o-=

diff --git a/Mohem/src/assets/imgs/mohemm-action/Skip-2.png b/Mohem/src/assets/imgs/mohemm-action/Skip-2.png
new file mode 100644
index 0000000000000000000000000000000000000000..03b3c23faac3055d0056112c6cc41e72d3379e3e
GIT binary patch
literal 888
zcmV-;1Bd*HP)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00009a7bBm000XT
z000XT0n*)m`~Uz0DoI2^RA_<in?Xw(K^TVL1`!I4Eh$J#p&nX7J!uYF@S@PbQZLO9
zu$b;$NKbl9|A9sD7$Wsv?ZL9(q0v+Iphcl&X(1L$i_nm0p&&xaY`<ML>n6@7nMroc
z0}COJJM%a@vorF}wQ9ABW{KyFQ2@69Of`KIKFR?00TfMLD>i$RK(g_i!NgK@J!_jv
zFe(7n*k$V4T9Du5k|oIuT{opD@o@woYwB8_r}U+=@tnbWG2dm9UYK;+)U^+d3e}aR
z-dqGQE1|LN;-#r;tj)go%91GiD~*Im)MmxhwY1+4BHk}TF3OmV=M3L5d_k5T-LQ(<
zFyV~%%bLfSCZo3<Xq+e#rmpSV_jY=g9$&60JVew?R_@2R+uot=U^1RFoXN_PbuAiH
zBvT_x%Rkk6)n<g&@Q$qSdr2YEZrMr2WvyLVB%U)wZ_l~`Yuyl`{iyP=am!>!uYxS=
zRKMk-vh-wC<x0u+iMsJX|NmQ`oSk!(9lkwaeg6FWgzI;jL0HeS#;;C~V>lM&D*NW?
zn049GA`to*KZ-@Mo|?d1;-ScDxREku=MoRFIz5JaH?GU5t}fChsPQ{7yh}|WIW#D%
z$_q%Hjidd2Sbmbgax&peU^3~*t0#GX&>G8+@5a=ZWw7zfdRgW;?wIVC(kW&(cJSlR
zUukv9A2<M(_P$|h@2m8BrOL8iT-ZLu$Dbvc)jCL%-TZ!xg{=c&OF<rl%buQ{V}APp
zn@7i@tGX1SvOB*@nBO{-ItevGm@M19%xvs(mwo<z*ZC|8VX{HSCMzpr((3)ELREUQ
zsuH2(*j1p&WSfr1g$Wh|jJPug3R7^8*>%Nbt>l|68z}G?Lh@eOilU+gJGN`dnz~l@
z#%L5GYpb~5vx}7OREdH+sp`m5@2V6Js(6DjH7h7eX1|u+EHPxf5&L=(+<eG##$I0d
zrOSQS#+27xk=?>J;VX(p8vzo2)#YMtDvd<Jc}8H0UdlrP8`>%bIwR0<ozH#Lh0>kb
zE|V_M>5qm7A#4I4Vxj<ciXw8I5dTDL-F(nZOiL%W7!u=v<(7760R90qB?X{L{0(CO
O0000<MNUMnLSTYrg{~I>

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/Skip.png b/Mohem/src/assets/imgs/mohemm-action/Skip.png
index 03b3c23faac3055d0056112c6cc41e72d3379e3e..17e38cb3348d26db0c0675389656802ea9a9dbcf 100644
GIT binary patch
delta 1297
zcmV+s1@8Lz2BZp*B!2{RLP=Bz2nYy#2xN!=00i4fL_t(&L+zVgY*a-Q$Nw|83JC^~
z7*eI(reeVd4f3KqX!}4y6OBegq7o7e-3`i{VnX1>0BSVR1V0`W+@;0`DTy)VK_x~a
zR79E>3swxGBD-6GRH5A#LkqogJhO1?F5T_ky|=e}ckm`W(0`qC=KSWInKO6hTmcWy
zxew4dD&&(8qE!&hCtw}~ZWRzSJ*b;hgg_%83<%%?3DGZ!_DQLBFK9!$+`d?cyXVXf
z+;+v1tA!A&SmFV9QbDyM9s_X*f<CSpQ=i=NEdF-WQ%P7>E7H60C?H=2#6515PH!9P
zm83S;#qe3Fet##0Wylt#<aYMv(o%{l{X0A5+Zt(a<nTUR%$B0CsW_TR$UQs{Yby=n
zwtpfzYYDZwE{d-U$rOZ5Cgdjm;S~;B%WX&DX-76MXqzH2_2%_9O@K`$umU8%;FVT}
z2cS$#h?IbOq&|jyxsrLX>2@^n9Q~d{cXpZTL)V-`I)7s+b${JDoOF!KgH6S)?>JvB
z3!UZO4LTHw+7C^DWzeS?bhmfCA(bTiiAW5c+PbV~X$xekPM+cv(-2aVeV9eP^=WmV
z*aDu%{G<}{Ip%)PhsKbL()vhLy?+hXI>OdgcncWlcy;sKT_*b5Q9GjK8TM?+tz)3(
z1ge~K(SMj)Aj}V8XB26@NX6xc?9^uh9oR4^C)&ZDwe&8dH4OFyY6D@f4&$RdUzY^h
zQ7DwtF_DbRLC&vpLSavUM(FLM4r4x5xiOyqVZHeIrg>MV{gn&Hyois>%xYSLS$C}&
z|NlVui@tR_%BIY-GiqBf|Ka_}^lZgY&&!^H=YK4H3A6d1^Ynkd9HZwBde)aKIOVWf
z`RLgLIR8x)_Qhn`MphlHCZx-Q80g-Be}4U_Ea0kybqFsdJF{M<%NbYDRSl~N?Te>z
zzANf#?o~ak<I>^dZ)1>G*U27ZV6Ud8qggK(OHoF_I*V84hpia?`P~UlHV)Py)G6w(
z{eLU-7B6FA9WU#!zLeUV9RtH*Gdzde%!k$9)S$UJ*f`H>IK77+KK_o`3zSYd+MC9w
zo}r#??9pvzZz}ZLkM^dUSGB61vxOER<F<=>5z0*|u3mY9&a+c>y6Bu#WMAI-WI=<5
z>E%6py2$ktC-|m)vD=X^*3N--vj|lpjDNXs>KA=1bAUT<@e6C+(g1n$T;GRd*#ozx
z|88Rjj%@I)^BUVheb>{$cRf$}g$=zt(H<SfTm~dw3%#*E4dgI>LG<m!B4x=Frr*!b
zQ0n#@>*ifYhv}irA-uUEs$S2nmidiu^BR3ljnIiR=;=sWEgY|w(H5Fp2ZdFUn19`&
z8S^XL67om>)4ic{k7tAECoTyZ=gEWZOJIo&*=0oSB4~)q>mRINi(Y4}jIBx~sahM_
z@KtV56stFWp1r%>bM#bLP;Vf3^?mDlGl~{^^~JH=7V^_-3TcKMvY;L>tCHLqkv|hy
zJO<gxz;{>JStYyIZ#9;!9?PvSc7N?zr{N#%m|0`X7zu3TmAbxUuhZRtsE;JxP(tl&
zT#J#(x-Y9<F}X{w6C_r$!WGlaRG_~vIdOJG+U$0>wv+{%>upP+nZG4y=Fff>@yA39
z`L{bc+~>OO*ljxw&p~c`ia%QVU4TwPs4iQgtCSZD>HimHM4B%`aFYZ8015yANkvXX
Hu0mjfq(6hK

delta 865
zcmV-n1D^b(3it+)B!3BTNLh0L01FZT01FZU(%pXi0009jNkl<ZXo2mUK}#D!7>3^l
z5ekhhDM(A99$G>@X%1TOqR_xnFU=3InC@LjPkK!Mfkp5bBK2PF!Ls0?(Np!HMWJPB
zAr?xD(2!`MAVSJ)zg;%#Ce9|ANp{Qw3n7j>^Ef-RGxE;0YJatgW{KyFQ2@69Of`KI
zKFR?00TfMLD>i$RK(g_i!NgK@J!_jvFe(7n*k$V4T9Du5k|oIuT{opD@o@woYwB8_
zr}U+=@tnbWG2dm9UYK;+)U^+d3e}aR-dqGQE1|LN;-#r;tj)go%91GiD~*Im)Mmxh
zwY1+4BHk}TE`Q3Hjpq#CF?>Om9^J5t+A!ga_sg2cm?opQ9cY{=5~i;0+xK>QmL6ZO
zDLh2fOjhp4xZB>L?O-yVGn~oFl65T_R3uX)OUpmidevrx*6@z3?|Vrh(r(#F#bvEs
zStOn_L~qZ!0c+h5q5Y`xuyM;|N3Vh`>r}txqO$a4Re$A5$@Yo5@j(CoTc4brbCn&w
zJz#zQ{QHFKcbY+1&$7m^PLE?a7Ue4Y=INMq+0r5q`WQcoMX{cmz+B>?$ZEKeGG^xz
z53o8thI==z%c!m{(k7_!J2AXVO&~cmD67f~NS%$N{e4(|lE88@;Y?sM>By@md4JFv
z%a8BI)PI*{u<^@!S>`zInCzF*DP}fy@Z-;4X?4mUH~^ORzF}$atMq!M%CcTu*gnL^
zpCy^qI!Ke<{C<putpj08K^}z5o}Qg!e)|BMN5`V8x)h<ZJHJYp-#U~!2{l5PEZe=z
zZ0vHEeg1ye`78=yvO&fsD=TBt>iwreReG|j5`UrO*j1p&WSfr1g$Wh|jJPug3R7^8
z*>%Nbt>l|68z}G?Lh@eOilU+gJGN`dnz~l@#%L5GYpb~5vx}7OREdH+sp`m5@2V6J
zs(6DjH7h7eX1|u+EHPxf5&L=(+<eG##$I0drOSQS#+27xk=?>J;VX(p8vzo2)#YMt
zDq4+1!FfhtieAb?0vp;Y1v(?paGlS6)P>TW*)EeV(CLqc2O(?%A7Y{ac8Vf$oe=*-
rYu$X%O-xHCwipuQfaR8UXaN2JG$jR~O8gCD00000NkvXXu0mjf$ZM_J

diff --git a/Mohem/src/assets/imgs/mohemm-action/answer.png b/Mohem/src/assets/imgs/mohemm-action/answer.png
new file mode 100644
index 0000000000000000000000000000000000000000..b73bed66e80718756c5f0f8c816989051cb423fb
GIT binary patch
literal 1940
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
alK(f;`$-ZP61^V)0000<MNUMnLSTYp6r7a+

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/data-corrected (2).png b/Mohem/src/assets/imgs/mohemm-action/data-corrected (2).png
new file mode 100644
index 0000000000000000000000000000000000000000..5d6dfd2acc026b284dc5e8f1e66bdb8a213d745d
GIT binary patch
literal 1818
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
IM6N<$g14z(`~Uy|

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/data-corrected (3).png b/Mohem/src/assets/imgs/mohemm-action/data-corrected (3).png
new file mode 100644
index 0000000000000000000000000000000000000000..40525d72622a222f225a01ab650b4d00964bbd9e
GIT binary patch
literal 1824
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
O0000<MNUMnLSTXbDrEiu

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/data-corrected.png b/Mohem/src/assets/imgs/mohemm-action/data-corrected.png
new file mode 100644
index 0000000000000000000000000000000000000000..a05cd2bc596e06438498efc25ae58aba2b1e2ee3
GIT binary patch
literal 1560
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
KMNUMnLSTX+%lL5s

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/doable-2-old.png b/Mohem/src/assets/imgs/mohemm-action/doable-2-old.png
new file mode 100644
index 0000000000000000000000000000000000000000..36d8fb2532bf3413e47d6e2bce6562d5ec9b6957
GIT binary patch
literal 1371
zcmV-h1*H0kP)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00004b3#c}2nYxW
zd<bNS000FNNkl<ZXhZE=U2GIp6h8M(ZAna|6vQIkZ7KnL&=g~0d5~gkLKBPzHBkwP
zhV2IBO?)8mMvO)ija6S1+-;39QW7=wK_mu$sHl)&1gi<6qTOAgR?{DhNn1Mic+Q4t
zW|rNZzfN~{=zZJ0_nh;6_k4HmotZNNJhb7rpk+$PM?i>9fw&w28bH7j0b-E{cV$fw
za1s#41i&Z?F(MI<NU094OhDFcEb`&3UDyxHE^Bg|5MnD?v^ld1Y828Oh~psey_y;I
z{>@LqKTaaqk|nny+XMFl$mapXZBCrd?-(4EsP;A`;bXhFWyuoBjY`RG%H|z*jw;<x
zN%^`)>bpta-;}~ql58dg?I`3ST8E95CgL<cB3{&l+Sb$sUlg+`N_HqM_fW@kBwNjC
zpzw@Coi1p5;z{*#A*QRyX40?;P<}#JS{WV!E|DNA0qVY35{{THEo8I3u$tEBDU$9D
zF5QQ2I7xa!Q|hj!9dOP7XCa$OY2VU*xjuBry#qQP@6tD1MV5#@Mnn&K_Zw16)E|r|
zp`X#^GmHB`W}4)A+G3hR3fTuN9E@evI<XIE9aGDs<x|A_4IdsuZi+kOUFyv%WVI87
zw!%liK<Dcut=;uvq!$_|mApWiwLLlp3MWwKv=_~&l_L5QHf9lbicCtrO-X$s(1{I$
zbHx3WS&dH_ok8FcwTq#)q1Cr*H9Y~BN6+~4gYXf{_%y9o|A>k}S-$x*sB7Hl59Af=
z;r=^)62>!PC?&^fe_cE$hzgv<5;Jq=cI0peObs9N?2nI+EMt1A5==A5vINIYJmWe@
z?b24LZ+j(g=a($|m>05~5eDnF@e<&rut3)B%q?Wr<&5$6a%0B_P`Bb9mzLJyI6V&k
z{`5LbeE;lhN9bg12IPw^88hMByUVT(vdl8uQ?o!e6kE?+$~cmlMLO$_o!kXW+PZ-+
zaOM^%88gwp4&R$U=UzuQ2{&#2+(I}qWX(i5o7b;?92z$CRCi|o`{f<lGhef0%?Z(}
zTeIeKupv_>VMw=BMve4Vos37nN&sh<8x!Vc+<X_4u35)Z7r&hSDeLOVeqH`|sJ9+7
zVFSG#(Q+rSP?KfgX2O1m^3wSG=tFdzoG3RRwtc?uXYCFZOqg5YRksu}^P06q?{Yxk
zWL@I1oQ>Vu+KpczYd1sYemfbv@x@~Um9gKai`7Cl|8$Y+C(hEF_O)&^V2tN|v~kOK
zUd=6bULVXk2~LGmKl7U9UEJ4`Y$hyg>z%|bJ7#+HwD0YuOn_tjuBVUQ^*rhuY1kbg
z9%30&8IX7(>{$KcBN^`!xdX69Y4U8;-_O=5wc^@(^Um^!x|B)6dz-t|i{@&XU+HaL
zi{G^oHhUuaM?9-m%~s1W!06UN!Pa<E?_-YE3b(ZUf&RKZY}xUS2Y;lJpjkc^vbi+0
z>L3RqQM(9uiOTEmj%|lQW3nP!m5NezHYebySrw(~ji09Mc6*mkWi9ytL08{b3sICT
z^vb26Ll^SHYLYaOyrhBJ;;NF|n2|rzuyzJyKM}sQvbnO4&UZDMt{yPg7dy_ZG4S_Z
zSX86SBnsF~SL&F3*m)j-m_rFKDWMLuY=_Bm(OuOm4)w?#0>#7RaML_fDi-cj+Bo~-
z3BA`T7FT4=+13=a)3*fe^x4lE`j}`H_1!{p_kUAcfSlwxPJf-JkCuKDfagG{0bRm?
dT^5T?!2b}ni!c9ijadKy002ovPDHLkV1gOElj;Bf

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/info-old.png b/Mohem/src/assets/imgs/mohemm-action/info-old.png
new file mode 100644
index 0000000000000000000000000000000000000000..7d37568e27f4aa04ce6c47f93c0e6baf9ad5ce5f
GIT binary patch
literal 1053
zcmV+&1mgRNP)<h;3K|Lk000e1NJLTq0027x0024&1^@s64tXIK00009a7bBm000XT
z000XT0n*)m`~Uz0&q+i<RA_<an?Yz3K@^7nhENdHRu7`~kb-s*daylck5&`{UK)B9
z5^^v0>?t0+w-mg&t>C#$FXDn=d#r+OPL{L>d#H+FZH*vQq4JV9aZP5kyOWtsHvW)9
zcC$P4<;}dAd2gog<m3b<W!cUofMNc4X$!z%IiFrLSr_fFmhFrI$N?b8>k6+}2SCup
zaz4GKvu;{oE!!CcFw2lBEj6oY55OFNrE)%f*zU{Pg0*ainq~n&w%v;O=!l``+JRPv
zwQQ%r)*MhRTtNg~DCg62Di4Q-<vzKj*dKL?`gN|HPk#vWzC@TGTed@ea<jvrq+8^{
zE!)Y2c_=WfWjkceMWw2l5p|yxHb5W+f@M(CPDoXYTt8p=!ge{RP}Z^?U#Ha)mS52A
zph6G)nzW}k<_Ei}j|SCkuW6?gmM05a5s#s|L}T%=Z1UmNjF(~x3a+=*VKu>8wlmA)
zSe!M*t1WL>p3oO!4l2}S-A2nsJ=Zm<RHJv6!S<30Qds^Mdc~?jDR<vZx^5V^YHl=z
znenSQ)1SotkDqwFv5i-IUyK*ak&l{Xd0aKRlDV6@fQJ*;s-UEy)2Hy{&NwD6oi|x5
zslGB2&A7=;>lRs6rmV+xjT#V3!N_2}bhbaK_Fy<sz#%%=@5jHT*WZ7wm@XQEPrw>)
zOAGIIQE33)KB!<}bJujy5SHy5dHRy5Uq?|QHQDTFEmmGR{)Oe8eNT%U(78xDj1YlE
zWJ#IElETC$_59uq+`K3sVl3N<jF$TBU}U9rSfN6xs=EK;ZKM|TQY5h5q6CLu{u|h~
zvtu#QA;E^qm&8?+>rI4B4#iX@xE$1akHc2|Qo{YEhxHF^(In^e$WS#xAroDXU;$s{
ztHN@+;K)=-(<7HLGk!&SkFI-7B{iue{E~YiP&AdqTHg7HjZfb^@4xwcV1$xYj~}~X
zjb-d;Dc3>OVe8XH-gDGzUiq0j!PPi7?v>PskUU6^zm96P6SXp+`Nj#8Y}GSs(lbY-
zBUvkLg5`fB?#($TOGdZaX0R61JS{mT>E4P~i}ws~l#G)~t#VeLu-ptXG3vi$n8{Wf
zIa`Khc<h~w0Wj4s<F{kgHwG00;1XNZcjXo+;N}7@X{nw*1qMafEx5eFgyx!49mlLq
z8bT$|l{Qy%zOz$%rS^Cn4Sje*DQ;ZOr;B`=V_xNXMUl^VMClsUQzC62h~O;>;xL2>
zOKUkF0G&r&xIbt3qoYr+@^P0ydx?X{$RQ>MC+|%eLUD+xRl=LRDp`%1=bDkjOaT4>
XSsF*S(5IC600000NkvXXu0mjfnEmu2

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/info.png b/Mohem/src/assets/imgs/mohemm-action/info.png
index 7d37568e27f4aa04ce6c47f93c0e6baf9ad5ce5f..7d8f16c61637a513dfac734440c116e438114c0f 100644
GIT binary patch
delta 1286
zcmV+h1^N1&2#pGm7k@hl1^@s6#U=8y00004b3#c}2nYxWd<bNS000EUNkl<ZXhZE=
zU2GIp6h3Emt2Ggo#*mU?O55F{i3Y)>@Su=tVW%M)l>{W17+_ociHW|D^2UQi6HPE7
z5ox#7L?dlt2tG7BEs#os0*wI`6QKJO5?U}u3l<WK?cU?Lz<+FZ+x?kk_s)*%PBPht
zz4trkJLkK9GiMO);i~N#sH;HQz+HVnumAz72w^_|R^9_##x4Xfg#_35cLET8XB&pl
z@L*)C?{coTxUaRVasSYx<hr$)TW{ifg|%L4S}}3r0G!}Je~oniH>2B||FB{yJ6R(1
z957yF_}$$2Nq;M#cD5m+a{_T^)UWqvvzw8u=fL1<5V1W7xGWn`vHvHa?@4GoBJI8(
z()p5>tT!;Qia_)+(duFov235<s?cC_WSc&es!vL?o~~dAPX-?_QI};y4r$04juB`b
z5x?(~*)Gi?>**d`%hC-ZqUI3)b9RHru^_~C5x;IEc7IMHTi-M2)nc(9IinBdY{6k2
zh~O_l?xtva%c$vE5?Pk-NzUj>hxwg{J9HxCZ+&hK*@i&yH4X4!9>|XDDga;M@q1W0
zcPF#ENb@W*qAcH9M|zxxQ*s>+kLypvE)=)PdOM9bL4$pHU^=_2fVV>J`sa7Z28>hu
zQ`9Y>;(utJ4*B(!xVWdk+8uLUVb<BVj*2}}1uyr~(=n*Ql9#X<L6$Ol1Hmsisc)!?
zs&jB@Kl0jY@Y?Egj#Fwp;Z4T3oLS>1hF_}2griV@=FA$`5#eFgZq2*T4WG3vgB1&_
zVC?4K@XnF5aDL*3YO`^CxqXzG<;hC@C5g7wE`Nv{l7ye{8&+>P!GdjMN4L$L7M}U?
z7~J@0#x}yXk)55{@taf7+;`kIqSBCUWaXIMw`MssRnG@W^z9>OY#p<<lC?F3X^bh)
z?7Pc7z$cHC=0|?J1|wG|Y>R_(vZ*E}lil945!ibsTqdg`0_DsWGOAy#Yq|~hMAbZy
zGk<d8RdO;m$w|_3*(sAPq?9sXDIc@t%-)SadCV%5bXmqKf?J-AOKrPo9t2)(tbs)j
zK9D4u(|ib!_Z2?!9SV)B5L6PT@-ds~AYghTPd~5skCe$4G6Kq<E;=Q%cb_f>FYwcu
zC54P&B9?g&$b^6X&q>&Qirr9p(M9=2;D0-QBd}Vj9S4B((~{#-#=ZQIe4_*WQR)KA
zxKC!bgERY~QcDg1XR_~Oedp0eO`Ew;>hEV`<X-sydh;$7R_apb$!TY}t@WdLwT!oB
zAk2jZbq*L_g?8amXw26Tua=SMrCSF@n<D<!UdeHGh1)MYGe1@6&=w1i-$VQw_J8Yf
zK1pQjx{akSqT!OLT?CpGF88z1Eo;u1!7kaVRN+EjbgO<eQB`T`jg9wsSGA{D^2^t*
z+(3le^iOBwq%HKS4+LM}g5yK~B}sE(^(5CBznoJgxfzkV?%)!)z{5O^J)Up0)%T~1
zF;VeSVtujY%$f}s_Y76KVz>M(fqxx*Kc?R4+$`{hVT}Fyc-mdrd1*`YRHoiJ)hjl1
z4YVVQ^(^hRxw%yM)-2gUB<u~f={;7_b0V9VZMT?Sg(Ub35o+Xbei~Tn^$hliRl`=>
w@mhJEKURtYQiOv%N~jIbXcfcRvX~10Utd5J1F&4Pi~s-t07*qoM6N<$f=%3jM*si-

delta 1045
zcmV+w1nT>Z3Y`d$7k@ek1^@s64tXIK00009a7bBm000XT000XT0n*)m`~Uz0&q+i<
zRA_<an?Yz3K@^7nhENdHRu7`~kb-s*daylck5&`{UK)B95^^v0>?t0+w-mg&t>C#$
zFXDn=d#r+OPL{L>d#H+FZH*vQq4JV9aZP5kyOWtsHvW)9c7L-w^X1LFnR#!f@8skJ
zCS}>qB!FT5cxem3VL6{(Gg%kyu$JwN0muO$$m<HPSO-AR#d1EqrL%5YU@hAj1Tf2x
zDJ?atX%E00fTeOiec0~H+Jd!ghni*qK(^hA_~?kC=h}f*hP7;`z}6g4EnGnaT`1?%
zb1DyqhUGrFq<`2Sb&2|QuAEPQ2=l%~m>*lVLw$0y!=R*F<iRc5$%J_*Fsx-eWX(mT
zs+kdWpA|MhAO(VDP}5FGRf}9dU-`mzIjB(9vK?Qi)e@Fp(Cwf?5B!?6r#I#YyQz-`
z)orh7rxcba3tJJ7p}It4@vv<2;nj?nVhRebx71-Z!GBt|Gt1*xoHfO(EpJ$!&=+D3
zD%51%M$1M$*EOkBqj#3U_L2%xSpFA!#i~Lnci&CAZWy;}ZZw6N@vAt~pTz!;pLo2n
zjaPeLj2Fw1kD6t9Ts69qxtqFxhZEPTproPGr|{&?I3_NgH(4yHzA_TcxXDfH7FkuM
ztjBeY8h;Q=!N_2}bhbaK_Fy<sz#%%=@5jHT*WZ7wm@XQEPrw>)OAGIIQE33)KB!<}
zbJujy5SHy5dHRy5Uq?|QHQDTFEmmGR{)Oe8eNT%U(78xDj1YlEWJ#IElETC$_59uq
z+`K3sVl3N<jF$TBU}U9rSfN6xs=EK;ZKM|TQhy|{-J%4CU;Z1|wzFd~(ILTx%9q4d
zl<Q4|O%BCWCAb{adXK|a{ZhjHrHAzoY|$j=^vF;(LLn1fk6-~`<*UMSy5PuENz)^j
zF*ANedXKJqO(iv{B>a+lAy71x#9H3@h>cI*Jnz5xd|-r<RgWLLVU1<%Xerl0)nV(?
zMStFN)N5Y(nLEMNI5+N<)Q6BfNRGdbYPA!!GNAd!36pHqGi%Z_N2DWJD{X@1e<SYA
zIVVd-x7uc~7SlW}IVI`didKvF3~!W-lS-{}R-Ulj3^Fn5zhs!nRvS56hGlr{os0o6
z)i2|>W7RhX6$9WBThw>u7AWB60xoH(o_{_C21VE{xV*uH=9*I-$E-~nLM70ZHdk}L
zvr~Je_IMl(eRx7CZd}f%i+q}6Ugdd3k<WNU=^E8jB5fat;4KQ`FoX$9YdIePokv}`
zKWF%(qff8$ahE`QiG#?<AtnYV?@bv(afqo^!kfG*S&f?Knvugy0R8}38b`L!rw)|(
P00000NkvXXu0mjfSb_HP

diff --git a/Mohem/src/assets/imgs/mohemm-action/notDoable-old.png b/Mohem/src/assets/imgs/mohemm-action/notDoable-old.png
new file mode 100644
index 0000000000000000000000000000000000000000..557ea6d37f199eac0c74fc8a984273b7e32bb679
GIT binary patch
literal 1478
zcmV;%1v&bOP)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00004b3#c}2nYxW
zd<bNS000GjNkl<ZXhZE=Uu;ul6hG&-(;4v(iy?zy#<q57qCp<mh>_xg(oUm-Bq%{+
zSR0fF6Mez)#)C$TCYbP`V7r-UWHUP90opA~CKXYJ3F=6M^-nN^4vpCmFb=og&+|=g
zZEx>wZ|}WbZ_94dbld&TIltd`&Ue0lX9zl;`j7e>s*r641UE2Pga9=RVIh52>rj_d
zgaJ$;gGu_HAbY>l&mmF3gRu_xSfREEpSGuY|Ij_mc6}=u+(Htq+N6rpiik5JeVnj-
zhBLQ*G5T`bA6hKsC(9T*x<XF@;9J!A0WC`BvJC?^A~M_+_j!)wvzwEwqibL-h{?T(
zxH6xjQom=6eai%4Cx!P3H7u%Ro&J6oL$MbDYfDW;vwa5RBEr^~*E6Ifqe#{f2zFBA
zH;JfCvmuK#q_9phCUnMp?)T)7vdB6D1M8`MkV03m2>ya$P)Lgm@X46Z6G|7(AlukI
z;1tB<59HB13$|b}0mk4@QM9+jw?8&2LCYZP@CUymkFK^DZUb=G@rbv5O%~ZEfADz$
z@t^_CmK3FFX(Nr_Lmb?Hp54s^$I?)oyjpKb#0Eg|c{n=ec?fnRC2D${fzT`T^??DM
zRu|n7@p?X#$bL^~OS%Lsa&Mg^va4}f_mNt=XiE_5{7c6oBPy19zLuVzfjYbiLRjj<
z9q9B2KL*5?iqWh0*W3XMZn2x9I&p0ZE?)avzb?l1BP|U>w1{x)*P<-Ri5}kYu&HX>
zJ`d|AOpA=eJdA%NL@P{1Mao`X>7Y-OscK(1dJ2XwP3YD66FU5%%ZPB7UJYt;>16vN
z3EduPU0ee#wF_s>7$M7-kKD7AtjvGX$r=G^mLAS<o~#*uHp?Ss=`qE#JnOEjUzF89
zt+h44#~Xk8A{XI;hG}DXd@?HmS%z#erWg76whY-8^4_OUtTH3&Q#$sYj={du(bVtr
zWOa70p=><w*&7MzS!bPU|MP^U_P(sb_>J%gd=*X1lG(E+`vM`~`?4X+J=XcnnUqK6
zge9U<1Kt^O50?#DPC`ydA}s&=M#mC($Ms-VsFxL4CBk(JZp+vRs1fC|Wk*(tu;jvA
zM9Y>e2mWa9F-ZJ1l?qkv;i1j0oU<e!_g~USdNxs_lg71?-IL+9ajtn*K1L<*YFS##
zI>C};<wTd<UY+4#y@a1RbOL^vxT>XJ6x*1-f>O)6YFS#2YWUJ5oE*<SdKvunH$y~C
z4`UAU#o(zFet9yI6aJ)qRcae33CXjuZZ|3jn(kR?VWF0FCBjMz3Z-mpX|fy~_pr2a
zR|1>seNjDY<aBW^c0Fc!_QvUA@GPCXE!U&8oXFC3&pCc0@HO2CtkpwS%Oasry+)@O
zHG6bVdyF5F_s}8vbA^JE+H=DEW5#p!pJ~I>iz-<Lz1*{%<k`2)0BdC(bQAD8HXayk
z7Hl(TEB$^pDcTp`TsQAL^eR1+DLL(mdfWG;s%4x@`=eB7&|u|prxV-x$e6n+RV~An
zRBjy<+Y<A&_snht(tC@-`De<^*#|>9yR_6|l!4Dgy`B`G46+S@&<Y!{a7ENE0=ps#
z_DAB|9v_i9y<)3U>Hi4a@ea>mdUUDO8;4$_7kf(`hI;Mu1q6lf`*L~JLa#=DaGikA
zS56^KQ_K~rGu}{8CArii4T0ctJ0P#<yiad0&z&4QmrPbYonBw8*|So^W!*#7w&Zmm
zZ5DP?7~DH|;I&zzs__d{^ZxEMRv$ROt?mDFTLtlg>J^*1`nMw!H&JM>*9N6{ttey%
zsARY&(&6dWYNa5u>E5=B(=H<JBBRYz4#=y!8cEsRS`BM$N6F?gwT%N~G3w+|hC+Bo
gs0!!vqLTi90c5}fG?P6MMgRZ+07*qoM6N<$g0%$3pa1{>

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/mohemm-action/notDoable.png b/Mohem/src/assets/imgs/mohemm-action/notDoable.png
new file mode 100644
index 0000000000000000000000000000000000000000..017070f582815407fe97dc480ecd54ce60f3dd4d
GIT binary patch
literal 1461
zcmV;m1xosfP)<h;3K|Lk000e1NJLTq0027x0027(1^@s6#U=8y00004b3#c}2nYxW
zd<bNS000GSNkl<ZXhZFrO>7%g5Xa~3rpVBWxCnu(2#ASDD6!S#0zE)_Kx$MWPy-S)
z>H&%nqMRs)suf<d*bYVFqns#kpglFIgxYX`RtTvO6<Q>urX+6Ch&Dk`h$=pkiWWoc
zef*!Lb?x=8*Y<krwaFfG$iA63zc=&dee9S~70+}e5==|<BoXT;PPY;9TZpmMQ01#a
zot;REIR6uU{XvW_p}%8X(}u%CLqFLG8sD>W1<tAJt^aE2t&FolboxNKa;~)FoCE#@
z{v5nPmOt)N)!)kL#}-y-JsXKUs!24&h=s~gdOh0!dje6lI~<FBYS(W`*eONXkRjR&
zPxjg=s{4CRUvpX88CHkBv9iSy_N@9!pQcHNAQ-4SNVx`Z{wpzQYbX{wZYE+1n^crt
z8u0{UOfI({ue8H-MliBn;duNl+XOWciELyNJBo&qR{*N8Lt`3$q&tx~mM>f2StO!+
zG>LtO1~*sHfu}^^;l&oY<^Hv*I-?s_06P(loJ7W5?<uPt8N*M6Vu^=}U?&x23$pI8
zBi$YpmNY(aUm`IoOv`$ftE!aDq%UB-y32$1Ix<PD!y#GjVXCTSVJ8&j1;%KfBds15
z2Jm)d=l8R)2;oz8-vYWhSe(8M#pCN)QdI*yll}!EY`b-I(;ioKBQ;AIt&KH%2<w9=
zLYYlQBL|SDo_2L)J)oQu{{XOx*k$y)VUOhVk?(frTWjr~6s6|potpRwLvk8Na$4t9
zlbL*Q+p~02dwWe(pWpYMGhj|<FlQqR$W5&^vB;pL`?Xlj)Xweyh_1}dRjp5KA4M4B
zeD2Pp!-^1`Kl)k4o%jN4D6nZ$R?aD`&~aU0ufij<@Jyx8N=$)vOoe6GN=I(lvlWh*
zSYGbjGDs_f!3re{n`@~Q{eJ2sT{?d4M#XbsoNtgLS_li^sXedf)HF4$piI6RU553<
z(qk6J3#U($zt{SzxzziH^6bSUhiPGaocuk#)HX0sG>z@vHw>)s*u~K!IY1+@4yre3
z+dNPd0SyByAdEmdaPj|p;Q7akJl{~TX22`_ep*^s$n&^4Xv1b>qbGGze~&e2!@>%~
zXWn_6mKGOt9u*$$-0^bBy~mZ=+1z{iMjZZe^6|_;z-k9&?OF3IZMXaK>^f@%UD4WF
z;9;v}$qHB;5q}&$nB7h~c^sc-jh?m2x>i}*XncM)b^>N5TT@su-{ubNx6Ham;Pz*>
z6`htE23An&8w;zfs{@;DD2&<I)1K9h6CN&gzAg3MRnI!TU99DK)=kf5Zx;bOjjPnI
zYD2~s2vEoN7poO7kgN7$uAI&Rdro}o`4XSBHk2b^)kXlzxSnzP{EaJDr^}0#4fxjc
z6+>yk2ucf{a%!m8<?*fO5EErUoY5Yy8|&CUPCM9?s&-~F>FH+wKFc%On*Z0A_iVav
z@=#`+c6Z0)Z{(_FCNt?Dumm}~>2^G^Tv0IBEy*3ZY8lZ*v(`bO7<&-KBO`*bu)<AI
zzQ>vyc4d6)pcKo^WH^?{@f5(qyX$~I2D=)*b`cDhWlj&SjmIbSaV{zcYL=>0l=1bW
zjPHy5fHJLpf`?y%hxgVY@@ms1HV~Mn?;4d^7J4P4(T5T9hZ`)UFCz_YuBeh+9})bd
zrE5uIqZpBUYcu5TX%VLy)E7UNUte6dXZ41&s_MI%$vlTL`kh#Z?{LrD>NKPJ<!3A}
zZ?2N%4}+>&@<y(rdPU6T=TWfx1oqJzt23>JQk;K|WpboDmbiB5Wuv|#*nDsQl}`6b
z67_LnotWDlm@9WfnZJfOSyk{HzMJq1IEJ2Q#Ah^(##XhojM;h7%#Qy6ifz#pXl)iO
P00000NkvXXu0mjfmK(zN

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/my-request.png b/Mohem/src/assets/imgs/my-request.png
new file mode 100644
index 0000000000000000000000000000000000000000..7fdc55390a1bdd6df84317ffcda760721e10d343
GIT binary patch
literal 4055
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

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/no-images.png b/Mohem/src/assets/imgs/no-images.png
new file mode 100644
index 0000000000000000000000000000000000000000..e4578a1229351f2e1830c421288e9b26a6c94095
GIT binary patch
literal 38816
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
DT7Dd#

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/pending-transaction.png b/Mohem/src/assets/imgs/pending-transaction.png
new file mode 100644
index 0000000000000000000000000000000000000000..d252ad43366869111863408b6ba9261fca23b866
GIT binary patch
literal 11004
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
G=KlfM$4F}c

literal 0
HcmV?d00001

diff --git a/Mohem/src/assets/imgs/profile-icons/family-g.svg b/Mohem/src/assets/imgs/profile-icons/family-g.svg
new file mode 100644
index 00000000..553b6086
--- /dev/null
+++ b/Mohem/src/assets/imgs/profile-icons/family-g.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="39" height="39" viewBox="0 0 39 39">
+  <g id="Group_7680" data-name="Group 7680" transform="translate(-111 -245.557)">
+    <circle id="Ellipse_152" data-name="Ellipse 152" cx="19.5" cy="19.5" r="19.5" transform="translate(111 245.557)" fill="#259cb8"/>
+    <path id="family_3_" data-name="family (3)" d="M9.537,15.144v.993A3.01,3.01,0,0,1,6.53,19.144H2.647A.344.344,0,0,1,2.3,18.8V16.984A2.186,2.186,0,0,1,4.487,14.8H9.193A.344.344,0,0,1,9.537,15.144ZM6.53,19.831c-2.567,0-3.49.008-3.871,0a.343.343,0,0,0-.355.343v.637a2.977,2.977,0,1,0,5.953-.024v-.852a.343.343,0,0,0-.458-.324A3.674,3.674,0,0,1,6.53,19.831Zm4.753,11.8a3.875,3.875,0,0,1-1.948.006.172.172,0,0,0-.177.274,1.486,1.486,0,0,0,2.3-.007A.171.171,0,0,0,11.283,31.633Zm1.506-.259h-.071a.339.339,0,0,0-.321.237,2.184,2.184,0,0,1-3.968.451,2.276,2.276,0,0,1-.208-.449.344.344,0,0,0-.325-.238H7.806a2.062,2.062,0,0,0-2.062,2.062v.344a.344.344,0,0,0,.344.344h8.42a.344.344,0,0,0,.344-.344v-.344A2.062,2.062,0,0,0,12.789,31.374ZM2.307,30.112H.344A.344.344,0,0,0,0,30.455v3.324a.344.344,0,0,0,.344.344H2.307a.344.344,0,0,0,.344-.344V30.455A.344.344,0,0,0,2.307,30.112Zm5.736-5.361a.344.344,0,0,0-.181-.625l-.1,0a.284.284,0,0,0-.266.184,2.33,2.33,0,0,1-2.142,1.547,2.362,2.362,0,0,1-2.182-1.591.208.208,0,0,0-.2-.14A2.976,2.976,0,0,0,0,27.1v1.98a.344.344,0,0,0,.344.344H2.307a.344.344,0,0,0,.344-.344v-.144a.351.351,0,0,1,.321-.354.344.344,0,0,1,.366.343v4.854a.344.344,0,0,0,.344.344H4.713a.343.343,0,0,0,.344-.35c0-.089,0-.195,0-.338a2.754,2.754,0,0,1,2-2.644.344.344,0,0,0,.178-.543,3.873,3.873,0,0,1,.813-5.5Zm9.574-.626a.279.279,0,0,0-.265.193,2.209,2.209,0,0,1-2.046,1.526,2.305,2.305,0,0,1-2.07-1.545.277.277,0,0,0-.258-.174c-.077,0-.156,0-.239,0a.344.344,0,0,0-.186.625,3.873,3.873,0,0,1,.81,5.5.344.344,0,0,0,.177.543,2.754,2.754,0,0,1,2,2.645c0,.143,0,.249,0,.338a.343.343,0,0,0,.344.35h1.031a.344.344,0,0,0,.344-.344V28.925a.344.344,0,0,1,.366-.343.351.351,0,0,1,.321.354v.144a.344.344,0,0,0,.344.344h1.964a.344.344,0,0,0,.344-.344V27.1A2.976,2.976,0,0,0,17.618,24.124Zm.326,6.331v3.324a.344.344,0,0,0,.344.344h1.964a.344.344,0,0,0,.344-.344V30.455a.344.344,0,0,0-.344-.344H18.287A.344.344,0,0,0,17.944,30.455ZM15.374,14.82A4.284,4.284,0,0,0,11.052,19.1V23.36a.344.344,0,0,0,.469.32,3.654,3.654,0,0,1,.567-.166.345.345,0,0,0,.207-.544,3.711,3.711,0,0,1-.722-2.2V19.442a1.031,1.031,0,0,1,1.043-1.031,12.582,12.582,0,0,0,4.157-.649,1.618,1.618,0,0,1,2.133,1.532v1.5a3.678,3.678,0,0,1-.721,2.183.343.343,0,0,0,.2.542,3.63,3.63,0,0,1,.737.242.344.344,0,0,0,.488-.312v-4.3a4.315,4.315,0,0,0-4.237-4.334Zm-5.076,9.9a3.179,3.179,0,1,0,3.179,3.179A3.183,3.183,0,0,0,10.3,24.715Zm4.123-.347a.172.172,0,0,0-.164.285,1.382,1.382,0,0,0,2.176-.062.172.172,0,0,0-.182-.274A3.688,3.688,0,0,1,14.421,24.368Zm2.572-5.954a13.252,13.252,0,0,1-4.385.684.343.343,0,0,0-.348.344v1.326a2.98,2.98,0,1,0,5.959.024v-1.5A.93.93,0,0,0,16.993,18.414ZM4.35,24.35a.172.172,0,0,0-.171.282,1.545,1.545,0,0,0,2.381-.053.172.172,0,0,0-.182-.275A3.669,3.669,0,0,1,4.35,24.35Z" transform="translate(120.203 239.361)" fill="#fff"/>
+  </g>
+</svg>
diff --git a/Mohem/src/assets/imgs/profile-icons/family.svg b/Mohem/src/assets/imgs/profile-icons/family.svg
new file mode 100644
index 00000000..7bc06a07
--- /dev/null
+++ b/Mohem/src/assets/imgs/profile-icons/family.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="39" height="39" viewBox="0 0 39 39">
+  <g id="Group_7680" data-name="Group 7680" transform="translate(-111 -245.557)">
+    <circle id="Ellipse_152" data-name="Ellipse 152" cx="19.5" cy="19.5" r="19.5" transform="translate(111 245.557)" fill="#4d4d4d"/>
+    <path id="family_3_" data-name="family (3)" d="M9.537,15.144v.993A3.01,3.01,0,0,1,6.53,19.144H2.647A.344.344,0,0,1,2.3,18.8V16.984A2.186,2.186,0,0,1,4.487,14.8H9.193A.344.344,0,0,1,9.537,15.144ZM6.53,19.831c-2.567,0-3.49.008-3.871,0a.343.343,0,0,0-.355.343v.637a2.977,2.977,0,1,0,5.953-.024v-.852a.343.343,0,0,0-.458-.324A3.674,3.674,0,0,1,6.53,19.831Zm4.753,11.8a3.875,3.875,0,0,1-1.948.006.172.172,0,0,0-.177.274,1.486,1.486,0,0,0,2.3-.007A.171.171,0,0,0,11.283,31.633Zm1.506-.259h-.071a.339.339,0,0,0-.321.237,2.184,2.184,0,0,1-3.968.451,2.276,2.276,0,0,1-.208-.449.344.344,0,0,0-.325-.238H7.806a2.062,2.062,0,0,0-2.062,2.062v.344a.344.344,0,0,0,.344.344h8.42a.344.344,0,0,0,.344-.344v-.344A2.062,2.062,0,0,0,12.789,31.374ZM2.307,30.112H.344A.344.344,0,0,0,0,30.455v3.324a.344.344,0,0,0,.344.344H2.307a.344.344,0,0,0,.344-.344V30.455A.344.344,0,0,0,2.307,30.112Zm5.736-5.361a.344.344,0,0,0-.181-.625l-.1,0a.284.284,0,0,0-.266.184,2.33,2.33,0,0,1-2.142,1.547,2.362,2.362,0,0,1-2.182-1.591.208.208,0,0,0-.2-.14A2.976,2.976,0,0,0,0,27.1v1.98a.344.344,0,0,0,.344.344H2.307a.344.344,0,0,0,.344-.344v-.144a.351.351,0,0,1,.321-.354.344.344,0,0,1,.366.343v4.854a.344.344,0,0,0,.344.344H4.713a.343.343,0,0,0,.344-.35c0-.089,0-.195,0-.338a2.754,2.754,0,0,1,2-2.644.344.344,0,0,0,.178-.543,3.873,3.873,0,0,1,.813-5.5Zm9.574-.626a.279.279,0,0,0-.265.193,2.209,2.209,0,0,1-2.046,1.526,2.305,2.305,0,0,1-2.07-1.545.277.277,0,0,0-.258-.174c-.077,0-.156,0-.239,0a.344.344,0,0,0-.186.625,3.873,3.873,0,0,1,.81,5.5.344.344,0,0,0,.177.543,2.754,2.754,0,0,1,2,2.645c0,.143,0,.249,0,.338a.343.343,0,0,0,.344.35h1.031a.344.344,0,0,0,.344-.344V28.925a.344.344,0,0,1,.366-.343.351.351,0,0,1,.321.354v.144a.344.344,0,0,0,.344.344h1.964a.344.344,0,0,0,.344-.344V27.1A2.976,2.976,0,0,0,17.618,24.124Zm.326,6.331v3.324a.344.344,0,0,0,.344.344h1.964a.344.344,0,0,0,.344-.344V30.455a.344.344,0,0,0-.344-.344H18.287A.344.344,0,0,0,17.944,30.455ZM15.374,14.82A4.284,4.284,0,0,0,11.052,19.1V23.36a.344.344,0,0,0,.469.32,3.654,3.654,0,0,1,.567-.166.345.345,0,0,0,.207-.544,3.711,3.711,0,0,1-.722-2.2V19.442a1.031,1.031,0,0,1,1.043-1.031,12.582,12.582,0,0,0,4.157-.649,1.618,1.618,0,0,1,2.133,1.532v1.5a3.678,3.678,0,0,1-.721,2.183.343.343,0,0,0,.2.542,3.63,3.63,0,0,1,.737.242.344.344,0,0,0,.488-.312v-4.3a4.315,4.315,0,0,0-4.237-4.334Zm-5.076,9.9a3.179,3.179,0,1,0,3.179,3.179A3.183,3.183,0,0,0,10.3,24.715Zm4.123-.347a.172.172,0,0,0-.164.285,1.382,1.382,0,0,0,2.176-.062.172.172,0,0,0-.182-.274A3.688,3.688,0,0,1,14.421,24.368Zm2.572-5.954a13.252,13.252,0,0,1-4.385.684.343.343,0,0,0-.348.344v1.326a2.98,2.98,0,1,0,5.959.024v-1.5A.93.93,0,0,0,16.993,18.414ZM4.35,24.35a.172.172,0,0,0-.171.282,1.545,1.545,0,0,0,2.381-.053.172.172,0,0,0-.182-.275A3.669,3.669,0,0,1,4.35,24.35Z" transform="translate(120.203 239.361)" fill="#fff"/>
+  </g>
+</svg>
diff --git a/Mohem/src/assets/localization/i18n.json b/Mohem/src/assets/localization/i18n.json
index 077e6689..1b044530 100644
--- a/Mohem/src/assets/localization/i18n.json
+++ b/Mohem/src/assets/localization/i18n.json
@@ -176,6 +176,46 @@
         "check-user-text3": {
             "en": "will be sent to your mobile number",
             "ar": "سيتم ارساله الى رقم هاتفك"
+        },
+        "current-password-validation":{
+            "en":"Do not use a current password.",
+            "ar":"لا تستخدم كلمة المرور الحالية."
+        },
+        "lowercase-password-validation":{
+            "en":"At least one lowercase.",
+            "ar":"حرف صغير واحد على الأقل."
+        },
+        "uppercase-password-validation":{
+            "en":"At least one uppercase.",
+            "ar":"حرف كبير واحد على الأقل."
+        },
+        "letter-password-validation":{
+            "en":"At least one Letter.",
+            "ar":"حرف واحد على الأقل."
+        },
+        "numerica-password-validation":{
+            "en":"At least one numeric.",
+            "ar":"رقم واحد على الأقل."
+        },
+        "min-password-validation":{
+            "en":"Minimum 8 characters.",
+            "ar":"8 أحرف على الأقل."
+        },
+        "repeating-password-validation":{
+            "en":"Do not add repeating letters.",
+            "ar":"لا تقم بإضافة أحرف متكررة."
+        },
+        "special-character-password-validation":{
+            "en":"It should contain a special character.",
+            "ar":"يجب أن يحتوي على طابع خاص."
+        },
+        "not-match-password-validation":{
+            "en":"Confirm Password does not match.",
+            "ar":"تأكيد كلمة المرور لا يتطابق."
+        },
+        "contain-username-password-validation":{
+            "en":"The password should not contain the user name.",
+            "ar":"يجب ألا تحتوي كلمة المرور على اسم المستخدم."
         }
     },
     "verificationcode": {
@@ -209,6 +249,50 @@
         }
     },
     "general": {
+        "fav-showData": {
+            "en": "Please select an alphabet to see your favourites",
+            "ar": "الرجاء تحديد الأبجدية لرؤية المفضلة لديك"
+        },
+        "fav-noData": {
+            "en": "No data available for favourites",
+            "ar": "لا توجد بيانات متاحة للمفضلة"
+        },
+        "concurrent-report": {
+            "en": "Concurrent Report",
+            "ar": "تقرير متزامن"
+        },
+        "update-contact": {
+            "en": "Update contact information",
+            "ar": "تحديث معلومات الاتصال"
+        },
+        "dependent-title": {
+            "en": "Dependents",
+            "ar": "المعالين"
+        },
+        "add-new-row": {
+            "en": "Add new row",
+            "ar": "أضف صفًا جديدًا"
+        },
+        "contact": {
+            "en": "Phone Number",
+            "ar": "رقم الهاتف"
+        },
+        "from-date": {
+            "en": "From Date",
+            "ar": "من التاريخ"
+        },
+        "to-date": {
+            "en": "To Date",
+            "ar": "حتى الآن"
+        },
+        "termination": {
+            "en": "Termination",
+            "ar": "نهاية"
+        },
+        "pending-transaction": {
+            "en": "Pending Transactions",
+            "ar": "المعاملات المعلقة"
+        },
         "huawei-plugin-issue": {
             "en": "Error while initializing Huawei Location Plugin",
             "ar": "خطأ أثناء تهيئة Huawei Location Plugin"
@@ -1049,7 +1133,7 @@
             "en": " Select the type of change you want to make.",
             "ar": " حدد نوع التغيير الذي تريد القيام به."
         },
-        "try-again":{
+        "try-again": {
             "en": "somthing went wrong please try again later",
             "ar": "حدث خطا الرجاء المحاولة لاحقا"
         },
@@ -1061,13 +1145,13 @@
             "en": "Update Now",
             "ar": "تحديث الان"
         },
-        "success-create":{
+        "success-create": {
             "en": "Request has been submitted successfully",
             "ar": "تم تقديم الطلب بنجاح"
         },
-        "business-card":{
-            "en":"Business Card",
-            "ar":"بطاقة العمل"
+        "business-card": {
+            "en": "View Business Card",
+            "ar": "عرض بطاقة العمل"
         }
     },
     "home": {
@@ -1268,16 +1352,16 @@
             "ar": "الوصف"
         },
         "MyHR-request": {
-            "en": "MY HR REQUEST",
-            "ar": "طلباتي"
+            "en": "Mowadhafhi Request",
+            "ar": "طلب Mowadhafhi"
         },
         "createHR-Request": {
-            "en": "CREATE HR REQUEST",
-            "ar": "انشاء طلب"
+            "en": "Create Mowadhafhi Request",
+            "ar": "انشاء Mowadhafhi طلب"
         },
         "HR-Request": {
-            "en": "HR Request",
-            "ar": "HR طلبات"
+            "en": "Mowadhafhi",
+            "ar": "Mowadhafhi"
         },
         "performance-evaluation": {
             "en": "Performance Evaluation",
@@ -1434,6 +1518,54 @@
         "postal-code": {
             "en": "Postal Code",
             "ar": "الرمز البريدي"
+        },
+        "contact-details": {
+            "en": "Contact Details",
+            "ar": "بيانات المتصل"
+        },
+        "family-members": {
+            "en": "Family Members",
+            "ar": "أفراد الأسرة"
+        },
+        "profile-compitation": {
+            "en": "Profile Completions",
+            "ar": "استكمال الملف الشخصي"
+        },
+        "work": {
+            "en": "Work",
+            "ar": "العمل"
+        },
+        "update": {
+            "en": "Update",
+            "ar": "تعديل"
+        },
+        "remove": {
+            "en": "Remove",
+            "ar": "حذف"
+        },
+        "update-msg": {
+            "en": "Are you sure you want to update this member ?",
+            "ar": "هل انت متاكد من تعديل هذا العضو؟"
+        },
+        "remove-msg": {
+            "en": "Are you sure you want to remove this member?",
+            "ar": "هل أنت متأكد أنك تريد إزالة هذا العضو؟"
+        },
+        "update-confirm": {
+            "en": "member updated successfully",
+            "ar": "تم تعديل البيانات بنجاح"
+        },
+        "remove-confirm": {
+            "en": "member removed successfully",
+            "ar": "تم حذف البيانات بنجاح"
+        },
+        "note-part-1": {
+            "en": "Add or update information about your beneficiaries of dependants.",
+            "ar": "قم بإضافة أو تحديث المعلومات حول المستفيدين من المعالين."
+        },
+        "note-part-2": {
+            "en": "Note: People you enter here become dependants or beneficiaries only after you complete benefits enrollment.",
+            "ar": "ملاحظة: الأشخاص الذين تدخلهم هنا يصبحون معالين أو مستفيدين فقط بعد إكمال تسجيل المزايا."
         }
     },
     "changePassword": {
@@ -1501,6 +1633,10 @@
         }
     },
     "vacation-rule": {
+        "effectiveDate": {
+            "en": "Effective Date",
+            "ar": "تاريخ الفعالية"
+        },
         "vacationRule": {
             "en": "Vacation Rule",
             "ar": "الإنابة بالإجازات"
@@ -1806,6 +1942,10 @@
         "tickets-balance": {
             "en": "Ticket Balance",
             "ar": "رصيد التذاكر"
+        },
+        "selectType": {
+            "en": "Select Type",
+            "ar": "اختر النوع"
         }
     },
     "accrualBalances": {
@@ -1878,6 +2018,18 @@
         "team-stats": {
             "en": "Team Statistics",
             "ar": "إحصائيات الفريق"
+        },
+        "subordinate-leave": {
+            "en": "Subordinate Leave",
+            "ar": "إجازة التابعيين"
+        },
+        "select-duration": {
+            "en": "Select Duration",
+            "ar": "اختر الفترة"
+        },
+        "no-of-days": {
+            "en": "No. of days",
+            "ar": "عدد الايام"
         }
     },
     "searchForReplacment": {
@@ -1982,6 +2134,18 @@
         "submit": {
             "en": "Are you sure you want to submit?",
             "ar": "هل انت متاكد من ارسال الطلب؟"
+        },
+        "cei": {
+            "en": "child Education",
+            "ar": "تعليم الطفل"
+        },
+        "relationship-start-date": {
+            "en": "Relationship Start Date",
+            "ar": ""
+        },
+        "relationship-end-date": {
+            "en": "Relationship End Date",
+            "ar": ""
         }
     },
     "submitAbsence": {
@@ -2261,23 +2425,22 @@
             "en": "Favorite",
             "ar": "مفضل"
         },
-        "workflow":{
-            "en":"WorkFlow",
-            "ar":"سير العمل"
+        "workflow": {
+            "en": "WorkFlow",
+            "ar": "سير العمل"
         },
-        "employee-id":{
-            "en":"Employee ID",
-            "ar":"هوية الموظف"
+        "employee-id": {
+            "en": "Employee ID",
+            "ar": "هوية الموظف"
         },
-        "employee-email":{
-            "en":"Employee Email",
-            "ar":"البريد الإلكتروني للموظف"
+        "employee-email": {
+            "en": "Employee Email",
+            "ar": "البريد الإلكتروني للموظف"
         },
-        "employee-name":{
-            "en":"Employee Name",
-            "ar":"اسم الموظف"
+        "employee-name": {
+            "en": "Employee Name",
+            "ar": "اسم الموظف"
         }
-
     },
     "worklist": {
         "view": {
@@ -2483,6 +2646,42 @@
         "urgent": {
             "en": "Urgent",
             "ar": "عاجل"
+        },
+        "worklist-setting": {
+            "en": "WORKLIST SETTINGS",
+            "ar": "اعدادات اشعارات"
+        },
+        "turn-on-notification": {
+            "en": "Turn on notification for",
+            "ar": "تفعيل الاشعارات "
+        },
+        "save-changes": {
+            "en": "Save Changes",
+            "ar": "حفظ التغيرات"
+        },
+        "loading": {
+            "en": "Loading",
+            "ar": "يتم التحميل"
+        },
+        "save-successfully": {
+            "ar": "تم حفظ التغيير بنجاح",
+            "en": "Your change has been saved successfully"
+        },
+        "done-successfully": {
+            "ar": "تم تنفيذ الإجراء الخاص بك بنجاح!",
+            "en": "Your action has been executed successfully!"
+        },
+        "save-error": {
+            "ar": "هناك شئ خاطئ، يرجى المحاولة فى وقت لاحق",
+            "en": "Something went wrong please try again later"
+        },
+        "assignment-number": {
+            "ar": "رقم التخصيص ",
+            "en": "Assignment Number"
+        },
+        "schedule-date": {
+            "ar": "تاريخ الجدول",
+            "en": "Schedule Date"
         }
     },
     "worklistMain": {
@@ -3054,10 +3253,70 @@
         }
     },
     "itemforsale": {
+        "slect-source-file": {
+            "en": "Select source file",
+            "ar": "حدد مصدر الملف"
+        },
+        "from-camera": {
+            "en": "Use Camera",
+            "ar": "استخدام الكاميرا"
+        },
+        "from-library": {
+            "en": "From Library",
+            "ar": "من ملفات الجهاز"
+        },
+        "from-icloud": {
+            "en": "From iCloud Drive",
+            "ar": "من iCloud Drive"
+        },
+        "warning": {
+            "en": "This ad will be valid for 2 week after approval",
+            "ar": "هذا الإعلان ساري المفعول لمدة أسبوعين بعد الموافقة"
+        },
+        "item-deleted": {
+            "en": "Item deleted successfully",
+            "ar": "تم حذف العنصر بنجاح"
+        },
+        "locked": {
+            "en": "Locked",
+            "ar": "مقفل"
+        },
         "title": {
             "en": "Item for sale",
             "ar": "سلعه للبيع"
         },
+        "region": {
+            "en": "Region",
+            "ar": "منطقة"
+        },
+        "selling-for": {
+            "en": "Selling for",
+            "ar": "بيع مقابل"
+        },
+        "item-condition": {
+            "en": "Item condition",
+            "ar": "حالة السلعة"
+        },
+        "new": {
+            "en": "New",
+            "ar": "جديد"
+        },
+        "used": {
+            "en": "Used",
+            "ar": "تستخدم"
+        },
+        "item-price": {
+            "en": "Item Price",
+            "ar": "سعر السلعة"
+        },
+        "item-photos": {
+            "en": "Item Photos",
+            "ar": "صور البند"
+        },
+        "offering": {
+            "en": "What are you offering?",
+            "ar": "ما الذي تعرضه؟"
+        },
         "related-offers": {
             "en": "Related offers",
             "ar": "العروض ذات الصلة"
@@ -3086,6 +3345,10 @@
             "en": "Add Details",
             "ar": "أضف التفاصيل"
         },
+        "item-info": {
+            "en": "Item Info",
+            "ar": "معلومات العنصر"
+        },
         "review-sell": {
             "en": "Review & Sell",
             "ar": "مراجعة وبيع"
@@ -3097,6 +3360,10 @@
         "offersdiscount": {
             "en": "Offers & Discount",
             "ar": "العروض والخصومات"
+        },
+        "location": {
+            "en": "Offer Location",
+            "ar": "عرض الموقع"
         }
     },
     "attendance-tracking": {
@@ -3235,6 +3502,56 @@
         "give-comments": {
             "en": "Please give us a comments",
             "ar": "من فضلك اعطنا تعليقات"
+        },
+        "survey-success": {
+            "en": "Your survey has been submitted successfully",
+            "ar": "تم تقديم الاستبيان الخاص بك بنجاح"
+        },
+        "erm-failed": {
+            "en": "Something went wrong please try again",
+            "ar": "حدث خطأ ما. أعد المحاولة من فضلك"
+        },
+        "viedo-success": {
+            "en": "Thank you for watching this video",
+            "ar": "شكرا لك على مشاهدة هذا الفيديو"
+        }
+    },
+    "transaction": {
+        "created-for": {
+            "en": "Created for",
+            "ar": "خلقت ل"
+        },
+        "created-date": {
+            "en": "Created Date",
+            "ar": "تاريخ الإنشاء"
+        },
+        "request-type": {
+            "en": "Request type",
+            "ar": "نوع الطلب"
+        },
+        "request-generated": {
+            "en": "Your Request for report has been sent to the server, click below link to check status",
+            "ar": "تم إرسال طلبك عن التقرير إلى الخادم، انقر فوق الرابط أدناه للتحقق من الحالة"
+        },
+        "check-status": {
+            "en": "Refresh",
+            "ar": "ينعش"
+        },
+        "phase": {
+            "en": "Phase",
+            "ar": "مرحلة"
+        },
+        "program-name": {
+            "en": "Program Name",
+            "ar": "إسم البرنامج"
+        },
+        "request-id": {
+            "en": "Request ID",
+            "ar": "طلب معرف"
+        },
+        "output": {
+            "en": "Output",
+            "ar": "انتاج"
         }
     }
 }
\ No newline at end of file
diff --git a/Mohem/src/index.html b/Mohem/src/index.html
index 2150180d..3d607717 100644
--- a/Mohem/src/index.html
+++ b/Mohem/src/index.html
@@ -11,6 +11,8 @@
   <meta name="format-detection" content="telephone=no" />
   <meta name="msapplication-tap-highlight" content="no" />
 
+  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCyDbWUM9d_sBUGIE8PcuShzPaqO08NSC8" async
+    defer></script>
   <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
   <script src="assets/js/sms.js"></script>
   <!-- add to homescreen for ios -->
diff --git a/Mohem/src/theme/styles.scss b/Mohem/src/theme/styles.scss
index 2d06bd96..e5217a79 100644
--- a/Mohem/src/theme/styles.scss
+++ b/Mohem/src/theme/styles.scss
@@ -1176,7 +1176,7 @@ border:0px
 }
 
 .logoHeader {
-    max-width: 130%;
+    max-width: 70%;
     width: 130%;
     border: 0px;
 }
@@ -1561,6 +1561,15 @@ table.monthview-datetable th small {
     position: absolute; 
     display: block;  
  }
+ .business-card-modal-css .modal-wrapper{
+    height: 500px;
+    width: 300px;
+    top: 50%;
+    position: absolute; 
+    display: block;
+    margin-top: -250px;
+ }
+
  .app-update-modal-css .modal-wrapper{
      border-radius: 0px !important;
  }
@@ -1617,3 +1626,27 @@ ion-segment-button {
 .top-filter svg {
     margin-top: 15px !important;
 }
+
+.disabledField{
+    opacity: .5;
+    pointer-events: none;
+}
+
+.filterClass input{
+    box-shadow: none !important;
+    -webkit-box-shadow: none !important;
+  }
+  .select-alert .alert-radio-label{
+     
+      font-size: 12px !important;
+  }
+  .modal-image-viewer-landscape {
+    --height: 35% !important;
+    --width: 90% !important;
+    --border-radius: 0.4cm;
+  }
+  .modal-image-viewer-portrait {
+    --height: 45% !important;
+    --width: 60% !important;
+    --border-radius: 0.4cm;
+  }  
\ No newline at end of file