
<md-dialog aria-label="Employee Details" style="width:100%;height:100%;max-width: 100%;
    max-height: 100%;">

<form ng-cloak name="myForm">
	<md-toolbar>
	<div class="md-toolbar-tools"
		style="background: cadetblue;">
		<h2>Employee Details </h2>
		<span flex></span>
		<md-button class="md-icon-button" ng-click="cancel()"> <i
			class="fa fa-times fa-2x"
			style="margin-top: 5px; font-size: 1.5em; float: left"></i> </md-button>
	</div>
	</md-toolbar>

	<md-dialog-content>
	<div class="md-dialog-content">
		<div class="form-group">
		
		 		<div class="container col-lg-12" style="float: left; padding-left: 30px;border:1px">
		 		 <fieldset>
         <legend style="font-size: 18px;">Employee Profile</legend>
			<div class="row col-lg-12">
				<div class="col-xs-3" style="text-align: left;">
					<p>
						<b>Employee ID:</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.employeeId}}
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>Employee Name</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.employeeName}}
					</p>
				</div>
			</div>
			<div class="row col-lg-12">
				<div class="col-xs-3">
					<p>
						<b>Email ID</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.emailId}}
					</p>
				</div>
			
				<div class="col-xs-3">
					<p>
						<b>Designation</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.designation}}
					</p>
				</div>

			</div>
			<div class="row col-lg-12">
				<div class="col-xs-3">
					<p>
						<b>Role</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.role}}
					</p>
				</div>

			
				<div class="col-xs-3">
					<p>
						<b>Mobile Number:</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.mobileNumber}}
					</p>
				</div>
			</div>
			<div class="row col-lg-12">
				<div class="col-xs-3">
					<p>
						<b>Alt Mobile Number</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.alternateMobileNumber}}
					</p>
				</div>

		
				<div class="col-xs-3">
					<p>
						<b>Personal EmailId</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.personalEmailId}}
					</p>
				</div>
			</div>
			<div class="row col-lg-12">
				<div class="col-xs-3">
					<p>
						<b>Shift</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.shift}}
					</p>
				</div>

		        <div class="col-xs-3">
					<p>
						<b>Primary Skill</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.baseTechnology}}
					</p>
				</div>
			</div>
			<div class="row col-lg-12">
				<div class="col-xs-3">
					<p>
						<b>Technologies Known</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.technologyKnown}}
					</p>
				</div>
         	</div>
<br/><br/>
		 </fieldset>
		    <!-- <fieldset>
         <legend style="font-size: 18px;" >Passport and Visa Details  <i  style="margin-top:3px;color:blue;cursor:pointer;font-size: 14px;" ng-click="toggleVisaDisplay()">{{showOrHidePV}}</i></legend>
         <div ng-show="showVisaDisplay">
         <div class="container col-lg-12" style="float: left; padding-left: 30px;">
		 	<div class="row col-lg-12">
				<div class="col-xs-3" style="text-align: left;">
					<p>
						<b>Passport No:</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.employeeId}}
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>Passport Expiry Date</b>
					</p>
				</div>
				<div class="col-xs-3">
					<p>
						<b>:</b> {{profile.employeeName}}
					</p>
				</div>
			</div>
			</div><br/><br/>
				
          <div id="gridEmpVisa" ui-grid="gridOptionsVisaDetails" 
			class="myGrid" style="width:99%;height:200px;">
			<div class="watermark" ng-show="!gridOptionsVisaDetails.data.length">No
				data available</div>
		</div>
		</div>
		<br/><br/>
          </fieldset> -->
		 <fieldset>
         <legend style="font-size: 18px;" >Project Allocations <i  style="margin-top:3px;color:blue;cursor:pointer;font-size:14px;" ng-click="toggleProjectAllocations()">{{showOrHidePA}}</i>
         </legend>
       
         <div class="row col-lg-12" style="margin-left: 0px;">

		<div id="gridProjectAllocatons" ui-grid="gridOptionsProjectAllocatons" 
			class="myGrid" style="width:85%;height:200px;" ng-show="showProjectAllocations">
			<div class="watermark" ng-show="!gridOptionsProjectAllocatons.data.length">No
				data available</div>
		</div>
	</div>
	<br/><br/>
          </fieldset>
          <fieldset>
         <legend style="font-size: 18px;">Billability Details <i  style="margin-top:3px;color:blue;cursor:pointer;font-size: 14px;" ng-click="toggleBillability()">{{showOrHideBD}}</i></legend>
           <div class="row col-lg-12" style="margin-left: 0px;">
         <div id="gridEmpBillability" ui-grid="gridOptionsEmpBillability"
			class="myGrid" style="width:85%;height:200px;" ng-show="showBillable">
			<div class="watermark" ng-show="!gridOptionsEmpBillability.data.length">No
				data available</div>
		</div>
			</div>
		<br/><br/>
          </fieldset> 
           <fieldset>
         <legend style="font-size: 18px;">Location Details <i  style="margin-top:3px;color:blue;cursor:pointer;font-size: 14px;" ng-click="toggleEmpLocationDetails()">{{showOrHideBD}}</i></legend>
           <div class="row col-lg-12" style="margin-left: 0px;">
         <div id="gridEmpLocationDetails" ui-grid="gridOptionsEmpLocationDetails"
			class="myGrid" style="width:99%;height:200px;" ng-show="showEmplocations">
			<div class="watermark" ng-show="!gridOptionsEmpLocationDetails.data.length">No
				data available</div>
		</div>
			</div>
		<br/><br/>
          </fieldset>
          
		</div>
		


		</div>
	</div>
	</md-dialog-content>

	<md-dialog-actions layout="row">  <md-button class="md-raised" ng-click="cancel()" style="width:120px;background: cadetblue;color:white;">
	Close </md-button> </md-dialog-actions>
</form>
</md-dialog>