<!DOCTYPE html>
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<%@ page import="com.csc.library.database.*,com.csc.library.session.*,com.csc.library.utilities.*,com.csc.library.utility.*"  %>
<%@ include file="../CHECKPROFILE.jsp" %>
<% request.setCharacterEncoding("UTF-8"); %>
<%
	CheckNull chk = new CheckNull();

	UProfile up = null;
	if (session != null){
		up = (UProfile)session.getAttribute("userprofile");
	}

	if (up == null){
		return ;
	}
	String sequence = StaticConfig.getConfigCompany(up, "SEQUENCE_UPPER");
	int year = Integer.parseInt(StaticConfig.getConfigCompany(up, "YEAR_UPPER"));
	String p_apsid = chk.chkNullString(request.getParameter("apsid_aps"),"APS_MAN");
	String p_apsassessy = chk.chkNullString(request.getParameter("assessy"),up.get("employeeid"));
	String p_type = chk.chkNullString(request.getParameter("type"),"self");

%>
<html ng-app='APS_JET_PER_MAN'>
	<head>
		<title>Employee View</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link rel="stylesheet" href="<%=request.getContextPath()%>/EMPVIEW/css/APP_UP/style_apsup.css" />
		<link rel="stylesheet" type="text/css" href="css/APP_MBO/style.css" />
	</head>
	<body ng-controller='ApsManForm'>
		<div class='bg-com'></div>
		<div class="emv-headmenu" style="display:none"><jsp:include page="EMV_HEADMENU.jsp" flush="true" /></div>

		<script type="text/javascript" src="../JS/SCREEN.js"></script>
		<script type="text/javascript" src="../JS/jquery-2.1.3.min.js"></script>
		<script type='text/javascript' src="../public/lib/angular-resource/angular-resource.min.js"></script>
		<script type='text/javascript' src='JS/APS_JET_PER_MAN/Module.Controller.js'></script>
		<script type='text/javascript' src='JS/APS_JET_PER_MAN/services.js'></script>
		<script type='text/javascript' src='JS/APS_JET_PER_MAN/ApsMan.Controller.js'></script>
		<script type='text/javascript'>
			setLang('<%=up.get("lang")%>');
		</script>

		<section>
			<div class="container csc-content">
				<form name="cscform" class="form-horizontal" method="post" >
					<div>
						<input type='hidden' name='apsid' value='<%=p_apsid%>'/>
						<input type='hidden' name='assessy' value='<%=p_apsassessy%>'/>
						<input type='hidden' name='type' value='<%=p_type%>'/>
						<input type='hidden' name='me' value='<%=up.get("username")%>' />
						<div class='loading-page'>
							<div class='spiner'></div>
						</div>
						<div class="form-horizontal" id='target_warpper'>
							<table class="table table-head table-bordered table-title-left" >
								<tr>
									<th colspan='4' class='center detail-table'>PERFORMANCE MANAGEMENT <%=year%></th>
								</tr>
								<tr>
									<th colspan='4' class='center detail-table'>JAA Staff Performance Evaluation for Managers</th>
								</tr>
								<tr>
									<th width='50%' colspan='2' class='center detail-table' swlang code='SW001041'>Assessor</th>
									<th width='50%' colspan='2' class='center detail-table' swlang code='SW001042'>Assessy</th>
								</tr>
								<tr>
									<th class='headlabel td-bold' swlang code='SW001984'>Fullname</th>
									<td>{{ assessordata.fullname }}</td>
									<th class='headlabel td-bold' swlang code='SW001984'>Fullname</th>
									<td>{{ assessydata.fullname }}</td>
								</tr>
								<tr>
									<th class='headlabel td-bold' swlang code='SW000274'>Employee ID</th>
									<td>{{ assessordata.assessy }}</td>
									<th class='headlabel td-bold' swlang code='SW000274'>Employee ID</th>
									<td>{{ assessydata.assessy }}</td>
								</tr>
								<tr>
									<th class='headlabel td-bold' swlang code='SW000057'>Position</th>
									<td>{{ assessordata.position }}</td>
									<th class='headlabel td-bold' swlang code='SW000057'>Position</th>
									<td>{{ assessydata.position }}</td>
								</tr>
								<tr>
									<th class='headlabel td-bold' swlang code='SW012799'>Start Date</th>
									<td>{{ assessordata.startdate }}</td>
									<th class='headlabel td-bold' swlang code='SW012799'>Start Date</th>
									<td>{{ assessydata.startdate }}</td>
								</tr>
								<tr>
									<th class='headlabel td-bold' colspan="4">OVERALL PERFORMANCE RATING SCORE</th>
								</tr>
								<tr>
									<th class='headlabel td-bold'>Add Individual Compentency Ratings</th>
									<th class='headlabel td-bold'>Number of Compentencies</th>
									<th class='headlabel td-bold' colspan="2">Overall Performance Rating</th>
								</tr>
								<tr>
									<td class='headlabel td-bold center'><b>{{ score }}</b></td>
									<td class='headlabel td-bold center'><b>{{ max }}</b></td>
									<td class='headlabel td-bold center' colspan="2"><b>{{ result }}</b></td>
								</tr>
							</table>
							
							<ul id="tabs" class="nav nav-tabs nav-justified" data-tabs="tabs" >
								<li class="active"><a href="#tab1" data-toggle="tab" class="black"><b>Quality of Work</b></a></li>
								<li><a href="#tab2" data-toggle="tab" class="black"><b>Annual Performance Goals</b></a></li>
								<li><a href="#tab3" data-toggle="tab" class="black"><b>Annual Development Goals</b></a></li>
							</ul>
							<div class="tab-content clearfix">
								<!-- ############################### TAB1 ############################### -->
								<div class="tab-pane active" id="tab1">
									<table class="table table-head table-bordered table-title-left" >
										<tbody ng-repeat='tastran_tab1 in tastran_tab1'>
											<tr>
												<th class='table-title'><b>{{ tastran_tab1.massess_desc}}</b></th>
											</tr>
											<tr>
												<td><b>Difinition : </b>{{ tastran_tab1.massess_assuggest }}</td>
											</tr>
											<tr>
												<td><b>Behavioral Indicators : </b><br><span style="white-space:pre-wrap;">{{tastran_tab1.massess_asobject}}</span></td>
											</tr>
											<tr>
												<td>
													<table style="width:100%">
														<tr>
															<th width="12%" ng-repeat='masanswer in masanswer_tab1'><div align="center"><b>{{masanswer.tdesc}}</b></div><div align="center">{{masanswer.topic}}</div></th>
														</tr>
														<tr>
															<td height="30px" ng-repeat='masanswer in masanswer_tab1'><div align="center"><input type="radio" ng-model='tastran_tab1.asranswer' ng-click="sumWeightTab1()" value="{{masanswer.anwscore}}" ng-disabled='isApsassessy || apsstate!=0'></div></td>
														</tr>
													</table>
												</td>
											</tr>
											<tr>
												<td><b>Comments : </b><textarea class='' rows="5" style="width:100%" ng-model='tastran_tab1.apscomment1' ng-trim='true' ng-disabled='isApsassessy || apsstate!=0'></textarea></td>
											</tr>
										</tbody>
									</table>
								</div>
								<!-- ############################### TAB2 ############################### -->
								<div class="tab-pane" id="tab2">
									<table class="table table-head table-bordered table-title-left" >
										<tbody ng-repeat='tastran_tab2 in tastran_tab2'>
											<tr>
												<th class='table-title'><b>{{ tastran_tab2.massess_desc}}</b></th>
											</tr>
											<tr>
												<td><b>{{ tastran_tab2.massess_assuggest }} : </b><input class='form-control' type='text'  ng-model='tastran_tab2.answerdesc' ng-disabled='isApsassessy || apsstate!=0'></td>
											</tr>
											<tr>
												<td>
													<table style="width:100%">
														<tr>
															<th width="12%" ng-repeat='masanswer in masanswer_tab2'><div align="center">{{masanswer.topic}}</div></th>
														</tr>
														<tr>
															<td height="30px" ng-repeat='masanswer in masanswer_tab2'><div align="center"><input type="radio" ng-model='tastran_tab2.asranswer' value="{{masanswer.anwscore}}" ng-disabled='isApsassessy || apsstate!=0'></div></td>
														</tr>
													</table>
												</td>
											</tr>
											<tr>
												<td><b>Comments : </b><textarea class='' rows="5" style="width:100%" ng-model='tastran_tab2.apscomment1' ng-trim='true' ng-disabled='isApsassessy || apsstate!=0'></textarea></td>
											</tr>
										</tbody>
									</table>
								</div>
								<!-- ############################### TAB3 ############################### -->
								<div class="tab-pane" id="tab3">
									<table class="table table-head table-bordered table-title-left" >
										<tbody ng-repeat='tastran_tab3 in tastran_tab3'>
											<tr>
												<th class='table-title'><b>{{ tastran_tab3.massess_desc}}</b></th>
											</tr>
											<tr>
												<td><b>{{ tastran_tab3.massess_assuggest }} : </b><input class='form-control' type='text'  ng-model='tastran_tab3.answerdesc' ng-disabled='isApsassessy || apsstate!=0'></td>
											</tr>
											<tr>
												<td>
													<table style="width:100%">
														<tr>
															<th width="12%" ng-repeat='masanswer in masanswer_tab3'><div align="center">{{masanswer.topic}}</div></th>
														</tr>
														<tr>
															<td height="30px" ng-repeat='masanswer in masanswer_tab3'><div align="center"><input type="radio" ng-model='tastran_tab3.asranswer' value="{{masanswer.anwscore}}" ng-disabled='isApsassessy || apsstate!=0'></div></td>
														</tr>
													</table>
												</td>
											</tr>
											<tr>
												<td><b>Comments : </b><textarea class='' rows="5" style="width:100%" ng-model='tastran_tab3.apscomment1' ng-trim='true' ng-disabled='isApsassessy || apsstate!=0'></textarea></td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
						</div>
						<div class="center">
							<button type="button" ng-disabled='(isApsapprove1 && apsstate!=0) || (isApsassessy)' class="btn btn-info" ng-click='saveDraft()' >Save Draft</button>
							<button type="button" ng-disabled='(isApsapprove1 && apsstate!=0) || (isApsassessy)' class="btn btn-info" ng-click='save()' >Submit</button>
							<button type="button" ng-if='isApsapprove1' class="btn btn-info" ng-click='closePage()' >Close</button>
						</div>
						<div class='spece-bot'></div>
					</div>
				</form>
				<a href="#top" id="top-button"><i class="fa fa-angle-up"></i><div class="top-word">Back to top</div></a>
			</div>
		</section>
		<div><jsp:include page="FOOTER.jsp" flush="true" /></div>
	</body>
</html>