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

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

   if (up == null){
      return ;
   }
%>

<html ng-app="EMPVIEW">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
      <style>
         .detail-training{
            text-indent: 60px !important;
            font-size: 18px;
         }
         .fullwidth{
            width: 100%;
         }
         .halfwidth{
            width: 45%;
         }
         .floatright{
            float: right;
         }
         .label-subject{
            font-size: 30px;
         }
         .input-custom{
            font-size: 18px;
         }
         .subject-header{
            font-size: 32px;
         }
         .label-question{
            font-weight: bold !important;
         }
         .blankspace{
            margin-top: 30px;
            margin-bottom: 30px;
         }
         .bg-com{
            height: auto !important;
         }
         .font-bold{
            font-weight: bold;
         }
         .shift-table{
            text-indent: 30px;
         }
         .subgroup{
            font-size: 16px;
         }
         .md-table-input{
            margin: 0px !important;
         }
         .md-table-input .md-errors-spacer{
            min-width: 0px !important;
         }
         .md-table-input .md-input{
            text-align: center;
         }
         md-checkbox.md-default-theme[disabled] .md-label, md-checkbox[disabled] .md-label{
            color: rgba(0, 0, 0, 0.76) !important;
         }
         md-radio-group.md-default-theme[disabled], md-radio-group[disabled], md-radio-button.md-default-theme[disabled], md-radio-button[disabled]{
            color: rgba(0, 0, 0, 0.76) !important;
         }
         md-input-container.md-default-theme .md-input[disabled], md-input-container .md-input[disabled], md-input-container.md-default-theme .md-input [disabled], md-input-container .md-input [disabled]{
            color: rgba(0, 0, 0, 0.76) !important;
         }
         .required-on{
            color :red;
         }
         .spinner{
            margin-top: 10%;
      		margin-left: 45%;
      		height: 200px;
      		width: 200px;
      		animation: rotate 0.8s infinite linear;
      		border: 15px solid #0072C6;
      		border-right-color: transparent;
      		border-radius:50%;
      		z-index: 100;
      	}

      	@keyframes rotate{
      		0% {transform:rotate(0deg);}
      		100% {transform:rotate(360deg);}
      	}
         .before-load{
            width: 100%;
            height: 100%;
            position: fixed;
            background-color: #fff;
            z-index: 150;
         }
      </style>
   </head>
   <body>
      <jsp:include page="EMV_HEADMENU.jsp" flush="true" />
      <link rel="stylesheet" href="../public/lib/angular-material/angular-material.css" />

      <script type="text/javascript" src="../public/lib/angular-resource/angular-resource.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/SURVEY/Module.Controller.js"></script>
      <script type="text/javascript" src="JS/SURVEY/services.js"></script>
      <script type="text/javascript" src="JS/SURVEY/Survey.Controller.js"></script>

      <div class="bg-com"></div>
      <section ng-controller="Survey">

         <div class="before-load" ng-if="waitingload">
            <div class="spinner"></div>
         </div>
         {{ initLang("<%=up.get("lang")%>") }}
         <div class="container csc-content">
            <form class="forn-horizontal" name="cscform" method="post">
               <div class="csc-block-white">
                  <div class="center">
                     <h3 class="subject-header">{{ getFormData(formData.formSubject) }}</h3>
                  </div>

                  <div class="row">
                     <div class="col-md-1 col-sm-1 col-xs-1"></div>
                     <div class="col-md-10 col-sm-10 col-10">
                        <div class="input-custom detail-training">{{ getFormData(formData.formDescription) }}</div>
                     </div>
                  </div>

                  <div class="blankspace"></div>

                  <div class="row" ng-if='formData.detailStatus == "1"'>
                     <div class="form-group">
                        <div class="col-md-1 col-sm-1 col-xs-1"></div>
                        <div class="col-md-7 col-sm-7 col-xs-7">
                           <md-input-container class="md-block fullwidth">
                              <label class="input-custom">{{ getFormData(formData.formDetail) }}</label>
                              <input class="input-custom" ng-model="formData.formDetail.value"  ng-disabled="formData.savestatus == '1' || formData.savestatus == '2'"></input>
                           </md-input-container>
                        </div>
                        <div class="col-md-3 col-sm-3 col-xs-3">
                           <md-input-container class="md-block fullwidth">
                              <label class="input-custom">
                                 <span swlang code="SW012835">Years</span>
                              </label>
                              <input class="input-custom" ng-model="formData.years" disabled="true"></input>
                           </md-input-container>
                        </div>
                     </div>
                  </div>

                  <div class="row" ng-repeat="question in questionData">
                     <div class="row">
                        <div class="form-group">
                           <div class="col-md-1 col-sm-1 col-xs-1">
                           </div>
                           <div class="col-md-10 col-sm-10 col-xs-10">
                              <label class="input-custom label-question required-on" ng-if="question.showrequire == true">
                                 {{ $index+1 }}. {{ getQuestionData(question.tqtopic) }} <span ng-if="question.tqrequire != 0">(<span swlang code="SW012864">require</span>)</span>
                              </label>
                              <label class="input-custom label-question" ng-if="question.showrequire != true">
                                 {{ $index+1 }}. {{ getQuestionData(question.tqtopic) }} <span ng-if="question.tqrequire != 0">(<span swlang code="SW012864">require</span>)</span>
                              </label>
                           </div>
                        </div>
                     </div>

                     <showtext ng-if="question.type == 1"></showtext>
                     <showchoice ng-if="question.type == 2 || question.type == 3"></showchoice>
                     <showtable ng-if="question.type == 4 || question.type == 5 || question.type == 7"></showtable>
                     <showsubquestion ng-if="question.type == 6"></showsubquestion>
                  </div>

                  <div class="row" ng-if="formData.footerStatus == 1">
                     <div class="form-group">
                        <div class="col-md-7 col-sm-7 col-xs-7"></div>
                        <div class="col-md-5 col-sm-5 col-xs-5">
                           <md-input-container class="md-block fullwidth">
                              <label class="input-custom" swlang code="SW012862">ลงชื่อผู้ตอบแบบสำรวจ</label>
                              <input class="input-custom" ng-model="formData.signature" ng-disabled="formData.savestatus == '1' || formData.savestatus == '2'"></input>
                           </md-input-container>
                        </div>
                     </div>
                  </div>

                  <div class="row">
                     <div class="form-group">
                        <div class="col-xs-12 col-sm-12 col-md-12">
                           <center>
                              <a class="btn btn-primary" ng-click="saveSubmit()" ng-if="formData.savestatus != '1'">Submit</a>
                              <a class="btn btn-primary" ng-click="saveDraff()" ng-if="formData.savestatus != '1'">Save Draff</a>
                              <a class="btn btn-primary" ng-click="clearData()" ng-if="formData.savestatus != '1'">Clear</a>
                           </center>
                        </div>
                     </div>
                  </div>
               </div>
            </form>
         </div>

      </section>

   </body>
</html>