<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
<title>Acknowledgement of inventory of months (ACK_IMO)</title>
<meta charset="utf-8" />
<!-- the next meta info is used for some compatibility issue in IE11 -->
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta sedName="S101" sedPackage="Sector Components/Sickness/S101" sedGVer="4" sedVer="0" sedPatch="16"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<link href="_forms/angular/css/bootstrap.min.css" rel="stylesheet" />
<!-- http://isteven.github.io/angular-multi-select CSS -->
<link href="_forms/angular/css/isteven-multi-select.css" rel="stylesheet" />
<link href="_forms/angular/css/select.css" rel="stylesheet" />
<link href="_forms/angular/css/sed_angular_common_MET.css" rel="stylesheet" />
<link href="_forms/angular/css/sed_angular_common.css" rel="stylesheet" />
<link href="_forms/angular/css/splitter.css" rel="stylesheet" />
<link href="_forms/angular/css/style.css" rel="stylesheet" />

<script src="_forms/angular/js/lib/angular.js"></script>
<script src="_forms/angular/js/lib/angular-animate.js"></script>
<script src="_forms/angular/js/lib/angular-sanitize.js"></script>
<script src="_forms/angular/js/lib/ui-bootstrap-tpls.js"></script>

<script src="_forms/angular/js/src/datePicker1.js"></script>
<!-- http://isteven.github.io/angular-multi-select JS -->
<script src="_forms/angular/js/src/isteven-multi-select.js"></script>
<!-- https://vitalets.github.io/checklist-model JS -->
<script src="_forms/angular/js/src/checklist-model.js"></script>
<!-- ui-select files -->
<script src="_forms/angular/js/src/select.js"></script>
<!-- http://lorenzofox3.github.io/smart-table-website/ -->
<script src="_forms/angular/js/src/smart-table.js"></script>
<!-- RINA style checkbox -->
<script src="_forms/angular/js/src/angular-bootstrap-checkbox-met.js"></script>
<!-- IR widget -->
<script src="_forms/angular/js/src/angular-bootstrap-IR.js"></script>
<!-- TR widget -->
<script src="_forms/angular/js/src/angular-bootstrap-TR.js"></script>

<!-- <script src="_forms/angular/js/src/sed_angular.js"></script> -->
<script src="_forms/angular/js/src/sed_angular_common.js"></script>
<script src="_forms/angular/js/src/sed_angular_common_MET.js"></script>
<script src="_forms/angular/js/src/sed_angular_common_RINA.js"></script>

</head>
<body ng-app="sedAngularApp">
	<div ng-controller = "ControllerS101" class="met-root">
		<div>
			<h3 class="sedHeadingAC">S101 - Acknowledgement of inventory of months (ACK_IMO) <br/> Articles 63, 64, 65, 66, 67 of Regulation (EC) No 987/2009</h3>
			<div style="position:absolute;top:0;right:0;font-size:70%">SED API version: 0.14.2 PREVIEW build 3<br/>Model version: 4.0.16</div>
		</div>
		<!--  
		<ui-layout class= "layout" options = "{sizes:['99%', '1%']}" >
		-->
		<div class="layoutAC">
		<bg-splitter orientation="vertical" position="VM.splitterPosition" class="met-splitter">
		<bg-pane min-size="100" scroll-to-id="viewModel.scrollToId">
			<div ng-controller="SedController" ng-cloak ng-init = "section = model.S101; metaSection = metaModel.S101" class="wb-stretch">
				<div id = "content-angular_S101" class="content-angular container-fluid" ng-model-options="{ debounce: 250 }" ng-form="S101" sedName="S101" sedPackage="Sector Components/Sickness/S101" sedGVer="4" sedVer="0" sedPatch="16">
					<div class="tab-content met-content" ng-init="sedForm = S101">
						<div met_start_tag class="form-group" ng-controller="WbAngularSedCtrl">
							<div style="vertical-align:bottom" met_start_tag  ng-controller = "SectionController" ng-init = "section = $parent.section.GlobalNoteACKIMO; metaSection = $parent.metaSection.GlobalNoteACKIMO" ng-hide = "metaSection.$$isHidden" id="section_{{getNextUUID(metaSection)}}">
								<div style="vertical-align:bottom" met_start_tag class="met_lazy" ng-if="::shouldLoadSection">
								<div style="vertical-align:bottom" class="SECTION_ROW"    id="section_{{getNextUUID(metaSection)}}">
									<label style="vertical-align:bottom" class="control-label SECTION_ROW">1. Global note ACK_IMO <i>*</i>
									</label>
									<div class="SECTION_ROW_WHITESPACE"></div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.globalIMOReferenceCreditorLiaisonBody.$$error,'has-warning': validateForm && metaSection.globalIMOReferenceCreditorLiaisonBody.$$warning && !metaSection.globalIMOReferenceCreditorLiaisonBody.$$error}">
									<label class="control-label col-xs-3">1.1. Global IMO Reference Creditor Liaison Body <i>*</i></label>
									<div class="tooltip-handler" tooltip="Unique number of the claim (IMO) given by the creditor liaison body." tooltip-enable="true" tooltip-placement="left" tooltip-trigger="click"></div>
									<div class="col-xs-7">
										<input ng-model="section.globalIMOReferenceCreditorLiaisonBody" ng-disabled="true" class="form-control" type="text" 	value="" id="field_{{getNextUUID(metaSection.globalIMOReferenceCreditorLiaisonBody)}}" /><br/>
									</div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.globalIMOReferenceCreditorLiaisonBody.$$error">{{metaSection.globalIMOReferenceCreditorLiaisonBody.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.globalIMOReferenceCreditorLiaisonBody.$$warning && !metaSection.globalIMOReferenceCreditorLiaisonBody.$$error">{{metaSection.globalIMOReferenceCreditorLiaisonBody.$$warning}}</label>
								   </div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$error,'has-warning': validateForm && metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$warning && !metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$error}">
									<label class="control-label col-xs-3">1.2. Global ACK_IMO Reference Debtor Liaison Body <i>*</i></label>
									<div class="tooltip-handler" tooltip="Unique number for the acknowledgment of the claim (ACK_IMO) given by the debtor liaison body." tooltip-enable="true" tooltip-placement="left" tooltip-trigger="click"></div>
									<div class="col-xs-7">
										<input ng-model="section.globalACKIMOReferenceDebtorLiaisonBody" ng-disabled="false" class="form-control" type="text" 	value="" id="field_{{getNextUUID(metaSection.globalACKIMOReferenceDebtorLiaisonBody)}}" /><br/>
									</div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$error">{{metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$warning && !metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$error">{{metaSection.globalACKIMOReferenceDebtorLiaisonBody.$$warning}}</label>
								   </div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.totalNumberIndividualClaims.$$error,'has-warning': validateForm && metaSection.totalNumberIndividualClaims.$$warning && !metaSection.totalNumberIndividualClaims.$$error}">
									<label class="control-label col-xs-3">1.3. Total number of individual claims <i>*</i></label>
									<div class="col-xs-7"><input ng-model="section.totalNumberIndividualClaims" ng-disabled="false" class="form-control" type="text" 	value="" id="field_{{getNextUUID(metaSection.totalNumberIndividualClaims)}}" /><br/></div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.totalNumberIndividualClaims.$$error">{{metaSection.totalNumberIndividualClaims.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.totalNumberIndividualClaims.$$warning && !metaSection.totalNumberIndividualClaims.$$error">{{metaSection.totalNumberIndividualClaims.$$warning}}</label>
								   </div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.totalNumberMonths.$$error,'has-warning': validateForm && metaSection.totalNumberMonths.$$warning && !metaSection.totalNumberMonths.$$error}">
									<label class="control-label col-xs-3">1.4. Total number of months <i>*</i></label>
									<div class="col-xs-7"><input ng-model="section.totalNumberMonths" ng-disabled="false" class="form-control" type="text" 	value="" id="field_{{getNextUUID(metaSection.totalNumberMonths)}}" /><br/></div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.totalNumberMonths.$$error">{{metaSection.totalNumberMonths.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.totalNumberMonths.$$warning && !metaSection.totalNumberMonths.$$error">{{metaSection.totalNumberMonths.$$warning}}</label>
								   </div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.lumpSumLegalCategory.$$error,'has-warning': validateForm && metaSection.lumpSumLegalCategory.$$warning && !metaSection.lumpSumLegalCategory.$$error}">
									<label class="control-label col-xs-3">1.5. Lump sum legal category <i>*</i></label>
									<div class="col-xs-7">
										<input ng-model="section.lumpSumLegalCategory" ng-disabled="false" class="form-control" type="text" 	value="" id="field_{{getNextUUID(metaSection.lumpSumLegalCategory)}}" /><br/>
									</div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.lumpSumLegalCategory.$$error">{{metaSection.lumpSumLegalCategory.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.lumpSumLegalCategory.$$warning && !metaSection.lumpSumLegalCategory.$$error">{{metaSection.lumpSumLegalCategory.$$warning}}</label>
								   </div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.dateReceipt.$$error,'has-warning': validateForm && metaSection.dateReceipt.$$warning && !metaSection.dateReceipt.$$error}">
									<label class="control-label col-xs-3">1.6. Date of receipt <i>*</i></label>
									<div class="col-xs-7" ng-controller="DatePicker1">
										<p class="input-group">
											<span ng-class="{'met-datepicker-up': metaSection.dateReceipt.$$elemNo >= metaModel.S101.$$elementsNo - 4}">
												<input type="text" class="form-control" datepicker-popup-met ng-model="section.dateReceipt" ng-disabled="false" is-open="status.opened" min-date="minDate" max-date="maxDate" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" close-text="Close" show-weeks="false" year-rows="9" year-columns="9" time-arrow="backward" datepicker-mode="year" placeholder="dd-MM-yyyy" id="field_{{getNextUUID(metaSection.dateReceipt)}}" />
											</span>
											<span class="input-group-btn">
												<button ng-class="{'has-error-date-button': validateForm && metaSection.dateReceipt.$$error, 'has-warning-date-button': validateForm && !metaSection.dateReceipt.$$error && metaSection.dateReceipt.$$warning}" ng-disabled="false" type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
											</span>
										</p>
									</div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.dateReceipt.$$error">{{metaSection.dateReceipt.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.dateReceipt.$$warning && !metaSection.dateReceipt.$$error">{{metaSection.dateReceipt.$$warning}}</label>
								   </div>
								</div>
								<!-- div met_start_tag met_if = "!isChoice" class="container-fluid row"></div-->
								<div met_start_tag class="container-fluid" ng-hide="false">
								<div ng-class="{'has-error': validateForm && metaSection.dateSubmission.$$error,'has-warning': validateForm && metaSection.dateSubmission.$$warning && !metaSection.dateSubmission.$$error}">
									<label class="control-label col-xs-3">1.7. Date of submission <i>*</i></label>
									<div class="tooltip-handler" tooltip="Date when the current SED is submitted." tooltip-enable="true" tooltip-placement="left" tooltip-trigger="click"></div>
									<div class="col-xs-7" ng-controller="DatePicker1">
										<p class="input-group">
											<span ng-class="{'met-datepicker-up': metaSection.dateSubmission.$$elemNo >= metaModel.S101.$$elementsNo - 4}">
												<input type="text" class="form-control" datepicker-popup-met ng-model="section.dateSubmission" ng-disabled="false" is-open="status.opened" min-date="minDate" max-date="maxDate" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" close-text="Close" show-weeks="false" year-rows="9" year-columns="9" time-arrow="backward" datepicker-mode="year" placeholder="dd-MM-yyyy" id="field_{{getNextUUID(metaSection.dateSubmission)}}" />
											</span>
											<span class="input-group-btn">
												<button ng-class="{'has-error-date-button': validateForm && metaSection.dateSubmission.$$error, 'has-warning-date-button': validateForm && !metaSection.dateSubmission.$$error && metaSection.dateSubmission.$$warning}" ng-disabled="false" type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
											</span>
										</p>
									</div>
									
									<label class="control-label col-xs-2 error-msg warning-msg" ng-show="validateForm && metaSection.dateSubmission.$$error">{{metaSection.dateSubmission.$$error}}</label>
									<label class="control-label col-xs-2 warning-msg" ng-show="validateForm && metaSection.dateSubmission.$$warning && !metaSection.dateSubmission.$$error">{{metaSection.dateSubmission.$$warning}}</label>
								   </div>
								</div>
							</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			</bg-pane>
			<bg-pane min-size="1">
			<div class = "footer-content" ng-controller="FooterController" ng-cloak>
					<table ng-show="errors.length > 0" st-table="errorListDisplay" st-safe-src="errors" class="table table-condensed table-striped table-hover">
					<tbody>
					<tr ng-repeat="row in errorListDisplay | orderBy:'level'">
						<td width="95%" ng-click="showError(row)" class="wb-link" 
							ng-style="{'color':row.severity == 'Error'?'red':'orange'}">
							{{ row.severity }} :
							{{ row.message }}
						</td>
					</tr>
					</tbody>
				</table>
			</div>
		 </bg-pane>
		 </bg-splitter>
		</div>
		<script>
		
		/*
		angular.module("sedAngularApp").run( function() {
			angular.module("sedAngularApp").lazy.controller("ControllerS101",["$scope", ControllerS101]);	
		});
		*/
		
		angular.module("sedAngularApp").lazy.controller("ControllerS101",["$scope", ControllerS101]);
		
		function ControllerS101($scope){
			
			$scope.VM = { splitterPosition:1 };
			
			$scope.contentDiv = "content-angular_S101";
			
			$scope.errors = new Array();
		
			$scope.MODEL = {
	"S101":{
		"sedPackage":"Sector Components/Sickness/S101",
		"sedGVer":"4",
		"sedVer":"0",
		"GlobalNoteACKIMO":{
			"globalIMOReferenceCreditorLiaisonBody":"",
			"globalACKIMOReferenceDebtorLiaisonBody":"",
			"totalNumberIndividualClaims":"",
			"totalNumberMonths":"",
			"lumpSumLegalCategory":"",
			"dateReceipt":"",
			"dateSubmission":""
		}
	}
};
		
			$scope.META_MODEL = {
					"S101":{
							"$$name" : "S101",
							"$$heading":"",
							"$$mandatory":true, 
							"$$repetition":false, 
							"$$type":"sed",
							"$$uuid":"S101",
							"$$hasData":false,
							"GlobalNoteACKIMO":{
								"$$name":"GlobalNoteACKIMO",
								"$$heading":"1",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$type":"section",
								"$$uuid":0,
								"$$hasData":false,
							"globalIMOReferenceCreditorLiaisonBody":{
								"$$name":"globalIMOReferenceCreditorLiaisonBody",
								"$$heading":"1.1",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$type":"string",
								"$$uuid":0,
								"$$hasData":false
							},
							"globalACKIMOReferenceDebtorLiaisonBody":{
								"$$name":"globalACKIMOReferenceDebtorLiaisonBody",
								"$$heading":"1.2",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$type":"string",
								"$$uuid":0,
								"$$hasData":false
							},
							"totalNumberIndividualClaims":{
								"$$name":"totalNumberIndividualClaims",
								"$$heading":"1.3",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$hasRestrictions":true,
								"$$restrictions": { "minInclusive":"0" },
								"$$type":"int",
								"$$uuid":0,
								"$$hasData":false
							},
							"totalNumberMonths":{
								"$$name":"totalNumberMonths",
								"$$heading":"1.4",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$type":"int",
								"$$uuid":0,
								"$$hasData":false
							},
							"lumpSumLegalCategory":{
								"$$name":"lumpSumLegalCategory",
								"$$heading":"1.5",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$hasRestrictions":true,
								"$$restrictions": { "minLength":"1", "maxLength":"65" },
								"$$type":"string",
								"$$uuid":0,
								"$$hasData":false
							},
							"dateReceipt":{
								"$$name":"dateReceipt",
								"$$heading":"1.6",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$type":"date",
								"$$uuid":0,
								"$$hasData":false
							},
							"dateSubmission":{
								"$$name":"dateSubmission",
								"$$heading":"1.7",
								"$$mandatory":true,
								"$$draftCritical":false,
								"$$repetition":false,
								"$$isHidden":false,
								"$$type":"date",
								"$$uuid":0,
								"$$hasData":false
							}
							}
				}
			};
		}
		
		/* Without flags */
		var INPUT = 
		{
			"structureEnd": {}
		};
		
		var ERROR_MESSAGES =
		{
			"section": "section",
			"field": "field",	
			"requiresdata": "requires data",
			"invalidformat": "has invalid formatted data",
			"norestriction": "does not comply with restriction"
		};
		
		var LOCALE =
		{
			"Add": "Add",
			"Translate": "Translate"
		};
		
		</script>	
	</div>

</body>
</html>