You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm_srca/Mohem/src/app/mowadhafi/hr-request/hr-request.component.html

216 lines
7.7 KiB
HTML

<ion-header>
<ion-toolbar class="header-toolbar-new">
<ion-buttons slot="start">
<nav-buttons (backClick)="goback()" [navigate]="false"></nav-buttons>
</ion-buttons>
5 years ago
<ion-title style=" color:white; text-align: center;">{{ts.trPK('userProfile','createHR-Request')}}</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<div *ngIf="!showRequestDetails" class="contentBg">
<div class="result-graph" >
<div class="user-info">
<div class="user-image-container">
<div class="user-image">
<img class="img" [src]="EmpImg ? 'data:image/png;base64,'+ EmpImg : '../assets/imgs/profile.png'" alt="Team Member Image"/>
</div>
</div>
<div style="margin-top: 18px;">
<span class="Nametext">{{EmpName}}</span>
<p style=" font-size: 12px; color: rgb(128, 124, 124);">{{EmpEmail}}</p>
<!-- <span>{{EmpJob}}</span> -->
</div>
<div >
<ion-row>
<ion-col style="border-right: 1px solid rgb(221 221 221);">
<p style="font-size: 12px; color: rgb(128, 124, 124);">{{ts.trPK('userProfile','role')}}</p>
<span class="Boldtext">{{EmpJob}}</span>
</ion-col>
<ion-col>
<p style="font-size: 12px; color: rgb(128, 124, 124);">{{ts.trPK('userProfile','empNo')}}</p>
<span class="Boldtext">{{EmpNum}}</span>
</ion-col>
</ion-row>
</div>
</div>
</div>
<div class="employee-information-indetail">
<ion-row style="padding-left: 13px;">
<ion-col>
<p style="font-size: 16px; font-family: WorkSans-Bold; margin-top: 15px;">{{ts.trPK('userProfile','profile-details')}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','category')}}</h2>
<p>{{EmpCatMeaning}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','address')}}</h2>
<p>{{EmpLocation}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','phone-no')}}</h2>
<p>{{EmpMobile}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','busG')}}</h2>
<p>{{EmpOrgName}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','job')}}</h2>
<p>{{EmpJob}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','payrol')}}</h2>
<p>{{EmpPayrol}}</p>
</ion-col>
<ion-col [size]="12">
<h2>{{ts.trPK('userProfile','position')}}</h2>
<p>{{EmpPosition}}</p>
</ion-col>
<ion-col [size]="12" style="border-bottom: none;">
<h2>{{ts.trPK('userProfile','grade')}}</h2>
<p>{{EmpGRADENAME}}</p>
</ion-col>
</ion-row>
</div>
5 years ago
<ion-footer class="footer">
<div class="Btn">
<ion-button class="CreateBtn" (click)="createRequest()" >{{ts.trPK('userProfile','createHR-Request')}}</ion-button>
</div>
5 years ago
</ion-footer>
</div>
<!-- ///////////////////////////////////////////////////////////////////next page -->
<!-- <div>
<div class="verify-code">
<ion-row style=" margin-left: 9px; margin-bottom: 13px;">
<ion-col style="font-size: 12px; color: rgb(128, 124, 124);">{{ts.trPK('userProfile','code-sent')}}</ion-col>
<ion-col class="Boldtext"> {{EmpMobile}}</ion-col>
</ion-row>
<ion-row dir="ltr">
<ion-col [size]="12">
<ion-input type="tel" 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" 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" 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" 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>
<div>
<ion-button class="sendVerifyBtn" (click)="VerifyCode()" >{{ts.trPK('userProfile','verify-code')}}</ion-button>
</div>
</div> -->
<!-- ///////////////////////////////////////////////////////////////////next page -->
5 years ago
<div *ngIf="showRequestDetails" >
<ion-card class="result-serviceType">
<ion-card-content>
<div class="request-heading">
<span>{{ts.trPK('userProfile','ServiceType')}}</span>
</div>
<div>
<ion-row class="custom-radio">
<ion-radio-group (ionChange)="showSelectedField($event)" class="radio-list">
<ion-radio value="HR Services" [color]="myColor">HR Services</ion-radio>
<ion-label class="text-label" >HR Services</ion-label>
<ion-radio value="Complaints" [color]="myColor" >Complaints</ion-radio>
<ion-label class="text-label">Complaints</ion-label>
<ion-radio value="Inquiry" [color]="myColor" >Inquiry</ion-radio>
<ion-label class="text-label">Inquiry</ion-label>
</ion-radio-group>
</ion-row>
</div>
5 years ago
<!-- /////////////////////////////////////////// -->
<div>
<div>
<ion-list>
<label class="labels">{{ts.trPK('userProfile','DeptName')}}</label>
<ion-item lines="none" class="filed-container">
<select class="filed" placeholder="Select Department" type="text">
<option value="1">1</option>
<option value="2">2</option>
</select>
</ion-item>
<label class="labels">{{ts.trPK('userProfile','RelatedSection')}}</label>
<ion-item lines="none" class="filed-container">
<select class="filed" placeholder="Select Sectiont" type="text">
<option value="1">1</option>
<option value="2">2</option>
</select>
</ion-item>
<label class="labels">{{ts.trPK('userProfile','RelatedTopic')}}</label>
<ion-item lines="none" class="filed-container" placeholder="Select Topic" type="text">
<select class="filed" placeholder="Select Topic" type="text">
<option value="1">1</option>
<option value="2">2</option>
</select>
</ion-item>
</ion-list>
</div>
<div class="request-heading">
<span>{{ts.trPK('userProfile','SupportingDocument')}}</span>
</div>
5 years ago
<div>
<img slot="start" style=" height: 55px;" (click)="uploadDocument()" src="../assets/imgs/add-photo.svg">
</div>
<div class="request-heading">
<span>{{ts.trPK('userProfile','Description')}}</span>
</div>
5 years ago
<!-- <div class="filedDesc">
<ion-input class="labelDesc" placeholder="{{ts.trPK('userProfile','Description')}}" type="text">
</ion-input>
</div> -->
<ion-col size="12">
<ion-item style="margin-left: -20px;margin-right: -13px;" lines="none">
<ion-input [ngClass]="direction == 'en' ? 'filedDesc':'filedDesc-ar' " placeholder="{{ts.trPK('userProfile','Description')}}" type="text"></ion-input>
</ion-item>
</ion-col>
</div>
5 years ago
</ion-card-content>
</ion-card>
<ion-footer style=" padding:15px !important;" >
<div ng class="gridDiv" aria-disabled="true">
<button class="gridCancelBtn" ion-button (click)="cancelRequest()">{{ts.trPK('general','cancel')}}</button>
<button class="gridSubmitBtn" ion-button (click)="submitRequest()">{{ts.trPK('general','submit')}}</button>
</div>
5 years ago
</ion-footer>
</div>
5 years ago
</ion-content>