<!DOCTYPE html>
<%@page contentType="text/html; charset=UTF-8" %>
<%@page import="com.csc.library.utilities.*" %>
<%
  UProfile up = null;
  if (session != null) {
    up = (UProfile) session.getAttribute("userprofile");
  }
%>

<html ng-app="RECRUIT">
<head>
  <title>Manpower</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <link rel="stylesheet" type="text/css" href="../CSS/Bootstrap/css/bootstrap.css"/>
  <link href="../CSS/font-awesome.min.css" rel="stylesheet" type="text/css"/>
  <link href="../JS/jquery-ui-1.11.4.custom/jquery-ui.min.css" rel="stylesheet" type="text/css"/>
  <link href="../public/lib/angular-material/angular-material.min.css" rel="stylesheet" type="text/css"/>
  <link rel='stylesheet' href='CSS/Recruit.css'/>
  <link rel="stylesheet" type="text/css" href="../JS/bootstrap-daterangepicker-master/daterangepicker.css"/>
  <script type="text/javascript" src="../JS/jquery-2.1.3.min.js"></script>
  <script type="text/javascript" src="../JS/jquery-ui-1.11.4.js"></script>
  <script type="text/javascript" src="../CSS/Bootstrap/js/bootstrap.mins.js"></script>

  <!-- Include Date Range Picker -->
  <script type="text/javascript" src="../JS/bootstrap-daterangepicker-master/moment.min.js"></script>
  <script type="text/javascript" src="../JS/bootstrap-daterangepicker-master/daterangepicker.js"></script>

  <script type="text/javascript" src='../public/lib/angular/angular.min.js'></script>
  <script type="text/javascript" src='../public/lib/angular-resource/angular-resource.min.js'></script>
  <script type='text/javascript' src='../public/lib/angular-sanitize/angular-sanitize.min.js'></script>
  <script type="text/javascript" src="../public/lib/angular-material/angular-material.js"></script>
  <script type="text/javascript" src="../public/lib/angular-animate/angular-animate.js"></script>
  <script type="text/javascript" src="../public/lib/angular-aria/angular-aria.js"></script>
  <script type="text/javascript" src="../public/lib/angular-messages/angular-messages.js"></script>
  <script type='text/javascript' src='../JS/SCREEN.js'></script>
  <script type='text/javascript' src="../JS/VIEWCALENDAR.js"></script>
  <script type='text/javascript' src="../JS/HOTKEY.js"></script>
  <script type="text/javascript" src="../JS/ANGULAR/SCREEN_ANGULAR.js"></script>
  <script type="text/javascript" src="../JS/ANGULAR/swaplang.factory.js"></script>
  <script type='text/javascript' src='../JS/urljobboard.js'></script>
  <script type='text/javascript' src='js/ManpowerRequest/Module.Controller.js'></script>
  <script type='text/javascript' src='js/services.js'></script>
  <script type='text/javascript' src='js/ManpowerRequest/ManpowerRequest.Controller.js'></script>
  <script type='text/javascript'>
    setLang('<%=up.get("lang")%>');

  </script>
</head>
<body ng-controller='ManpowerRequest'>

<div ng-hide="isReady" layout="row" layout-sm="column" layout-align="space-around">
  <md-progress-circular md-mode="indeterminate"></md-progress-circular>
</div>

<form ng-show="isReady" name="cscform" method="post" action="ManpowerRequest.jsp">
  <input type="hidden" name="__cmd">
  <input type="hidden" name="__action">
  <input type="hidden" name="__requestid">
  <input type="hidden" name="__jobid">
  <br>
  <div class="container-fluid">
    <div class="header-panel-csc text-right panel-heading">
      <span swlang code="SW013415">Manpower Request</span>
    </div>
    <div class="panel-body body-panel-csc">
      <md-card>
        <md-card-content>
          <div class="form-horizontal">
            <div class="form-group">
              <div class="col-xs-12 col-md-2 control-label">
                <swaplang code="SW000019">Status</swaplang>
              </div>
              <div class="col-xs-6 col-md-2">
                <md-checkbox ng-model="conditions.filter.status.normal" ng-false-value="''" ng-true-value="'1'" aria-label="Normal">
                  <span class="card-request-normal"><swaplang code="SW013073">Normal</swaplang></span>
                </md-checkbox>
              </div>
              <div class="col-xs-6 col-md-2">
                <md-checkbox ng-model="conditions.filter.status.inProcess" ng-false-value="''" ng-true-value="'2'" aria-label="Inprocess">
                  <span class="card-request-inprocess"><swaplang code="SW013074">In Process</swaplang> </span>
                </md-checkbox>
              </div>
              <div class="col-xs-6 col-md-2">
                <md-checkbox ng-model="conditions.filter.status.completed" ng-false-value="''" ng-true-value="'3'" aria-label="completed">
                  <span class="card-request-completed"><swaplang code="SW000067">Completed</swaplang></span>
                </md-checkbox>
              </div>
              <div class="col-xs-6 col-md-2">
                <md-checkbox ng-model="conditions.filter.status.cancel" ng-false-value="''" ng-true-value="'4'" aria-label="cancel">
                  <span class="card-request-cancel"><swaplang code="SW013075">Cancel</swaplang></span>
                </md-checkbox>
              </div>
            </div>
            <div class="form-group">
              <div class="control-label col-xs-12 col-md-2">
                <swaplang code="SW003537">Search All</swaplang>
              </div>
              <div class="col-xs-12 col-md-10">
                <input type="text" class="form-control" ng-model="conditions.filter.all">
              </div>
            </div>
            <%--date--%>
            <%--<div class="form-group">--%>
              <%--<label class="control-label col-xs-12 col-sm-2">--%>
                <%--<swaplang code="SW001033">Date</swaplang>--%>
              <%--</label>--%>
              <%--<div class="col-xs-12 col-sm-10">--%>
                <%--<input class="form-control" name="dateFilter" type="text">--%>
              <%--</div>--%>
            <%--</div>--%>
          </div>
        </md-card-content>
      </md-card>
      <md-card>
        <md-card-content>
          <div class="text-right">
            <md-button class="md-raised md-button md-primary" ng-click="goPagess()">
              <swaplang code="SW013045">Add</swaplang>
            </md-button>
          </div>
          <div class="row" ng-repeat="i in [1,2,3]">
            <div class="md-toolbar-tools white-letter" style="background-color: #0072C6" ng-init="state['cardMreq'+i] = true">
              <h2>
                <a ng-if="i == 1">
                  <swaplang code="SW012930">External Only</swaplang>
                </a>
                <a ng-if="i == 2">
                  <swaplang code="SW012931"> Internal Only</swaplang>
                </a>
                <a ng-if="i == 3">
                  <swaplang code="SW012932">External and Internal</swaplang>
                </a>
              </h2>
              <span flex></span>
              {{(mreqs | filter : {requestType:i}| filter:filterStatus | filter:conditions.filter.all).length}}
              <md-button class="md-icon-button" aria-label="hide" data-toggle="collapse" data-target="#cardMreq{{i}}"
                         ng-click="state['cardMreq'+i] = !state['cardMreq'+i]">
                <i class="fa fa-caret-up fa-2x" ng-show="state['cardMreq'+{{i}}]"></i>
                <i class="fa fa-caret-down fa-2x" ng-show="!state['cardMreq'+i]"></i>
              </md-button>
            </div>
            <div class="collapse in" id="cardMreq{{i}}">
              <div class="col-sm-6"
                   ng-repeat="mreq in mreqs | filter:{requestType:i} | filter:filterStatus | filter:conditions.filter.all | orderBy : 'requestStatus'">
                <md-card ng-class="cardStatusClass(mreq)" flex>
                  <md-card-header>
                    <md-card-header-text>
                      <span class="md-title">{{mreq.requestid}}
                        <span class="pull-right">
                          <i class="fa fa-search" ng-click="showDetail($event, mreq)"></i>
                          <i class="fa fa-cog" ng-click="goPages(mreq)"></i>
                        </span>
                      </span>
                      <span class="md-subhead" style="min-height: 24px;font-size: 14px">{{mreq.employeetype}}</span>
                    </md-card-header-text>
                  </md-card-header>
                  <legend></legend>
                  <md-card-title>
                    <%--<md-card-title-text data-toggle="tooltip" title="{{mreq.jobdesc}}" style="min-height: 32px" class="md-headline text-truncate">--%>
                      <%--{{mreq.jobdesc}}--%>
                    <%--</md-card-title-text>--%>

                      <md-card-title-text class="text-truncate">
                        <span class="md-title" style="min-height: 34px;font-size: 24px" data-toggle="tooltip" title="{{mreq.jobdesc}}">{{mreq.jobdesc}}</span>
                        <span ng-if="basicConfig.postfixCompanyName" class="md-subhead" style="min-height: 36px;font-size: 18px" data-toggle="tooltip" title="{{mreq.companyName}}">{{mreq.companyName}}</span>
                      </md-card-title-text>



                  </md-card-title>
                  <md-card-content layout="row" layout-align="space-between">
                    <div layout="column" flex>
                      <div flex>
                        <swaplang code="SW006771">Applicant</swaplang>
                        <span class="badge pull-right">{{mreq.registered}}</span></div>
                      <div flex>
                        <swaplang code="SW013051">Candidate</swaplang>
                        <span class="badge pull-right">{{mreq.candidate}}</span></div>
                      <div flex>
                        <swaplang code="SW012913">Hired</swaplang>
                        <span class="badge pull-right">{{mreq.hired}} / {{mreq.emp_num}}</span></div>
                    </div>
                  </md-card-content>
                </md-card>
              </div>
            </div>
            <legend></legend>
          </div>
        </md-card-content>
      </md-card>
    </div>
    <div class="panel-footer footer-panel-csc">
    </div>
  </div>
</form>
</body>

</html>