<link rel="stylesheet" type="text/css" href="module/survey/css/survey.css" />
<section class="user_page container">
    <div class="sales_report">
        <div class="sales_report_in">
            <div class="sales_card" ng-show="listFound">
                <div class="container-fluid table_area">

                    <div class="row top_box">
                        <div class="left_box">
                            <div class="input-group mb-3">
                            </div>
                        </div>
                        <div class="right_box">
                            <div class="sear">
                                <form class="row form_2">
                                    <div class="form-group col-sm-12 disable">
                                        <input type="search" ng-change="onSearchChange()" class="form-control" ng-model="formData.mymodel" name="Search" placeholder="Search"
                                            autocomplete="off" required>
                                    </div>
                                </form>
                            </div>
                            <div class="addbtn">
                                <button class="btn export" ng-click="addFun()">
                                    <p>Add</p>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="row bottom_box">
                        <div class="col-sm-12 table_box">
                            <div class="table-fixed">
                                <table class="table table-fixed">
                                    <thead>
                                        <tr class="row-name">
                                            <th class="col-xs-4">Survey Name</th>
                                            <th class="col-xs-2">Survey Time</th>
                                            <th class="col-xs-2">Published Date</th>
                                            <th class="col-xs-2">End Date</th>
                                            <th class="col-xs-2">Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr ng-repeat="item in itemdetail">
                                            <td class="col-xs-4">{{item.assessmentname}}</td>
                                            <td class="col-xs-2">{{item.assessmenttime}}</td>
                                            <td class="col-xs-2">{{item.publisheddate}}</td>
                                            <td class="col-xs-2">{{item.enddate}}</td>
                                            <td class="col-xs-2">
                                                <div ng-if="item.is_edit==1" class="clsicon deleteicon ion-edit" title="Edit" ng-click="editrow(item,$index)"></div>
                                                <div ng-if="item.is_edit!=1" class="clsicondis ion-edit" title="Edit"></div>
                                                <div ng-if="item.is_edit==1" class="clsicon editicon ion-trash-a" title="Delete" ng-click="deleterow(item,$index)"></div>
                                                <div ng-if="item.is_edit!=1" class="clsicondis ion-trash-a" title="Delete"></div>

                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <nav aria-label="Page navigation" id="div1">
                            <ul class="pagination pager" uib-pagination total-items="totalItems" ng-model="currentPage" ng-change="pageChanged()" max-size="maxSize"
                                boundary-links="true" rotate="false" num-pages="numPages" items-per-page="itemsPerPage"></ul>
                        </nav>
                    </div>
                </div>
            </div>
            <!---ADD / EDIT FORM -------->
            <div class="profile_bg" ng-if="formLoad">
                <div class="container-fluid pro_head">
                    <h4 class="text4">{{modalTitle}}</h4>
                    <button type="button" class="close ass-close" ng-click="closeForm()">
                            <span>×</span>
                        </button>
                    <!-- <h4 class="text4">formTitle</h4> -->
                </div>
                <div class="container-fluid form_bg form-scroll" ng-if="sideselect.id == 1">
                    <form class="row form_2" ng-submit="surveySubmit()" novalidate>
                        <div class="form-group col-sm-6 phone">
                            <input id="topic" type="text" class="form-control" autocomplete="off" ng-model="formData.assessmentname" required="required"
                            />
                            <label for="topic" class="control-label form-control-placeholder">{{sideselect.formText[0]}}</label>
                            <div class="color_error shake" ng-if="assessment_error!=''">
                                <a class="text-left shake">
                                    {{assessment_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-6 phone">
                            <select name="clstime" class="form-control check" ng-model="formData.assessmenttimetype" required select-option>
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[17]}}</option>
                                <!-- <option value="0">No Timer</option> -->
                                <option value="1">Timer Assessment</option>
                            </select>
                            <div class="color_error shake" ng-if="type_error!=''">
                                <a class="text-left shake">
                                    {{type_error}}</a>
                            </div>
                        </div>
                        
                        <div class="form-group col-sm-12 topic_title">
                            <label>Role</label>
                            <multiple-autocomplete ng-model="formData.roleList" object-property="rolename" suggestions-arr="role">
                            </multiple-autocomplete>
                        </div>
                        <div class="clearfix"></div>
                         <div class="form-group col-sm-12 phone">
                    <label for="segment" class="control-label ">Segment</label>  
                  <select id='segment' name="clscategory" ng-model="formData.segment"   class="form-control selectbox"
                     required select-option>
                    <option value="" selected="" disabled="disabled">{{sideselect.formText[20]}}</option>
                    <option value="0"  >Student Learner</option>
                    <option value="1"  >Parents/Guardian</option>
                    <option value="2"  >Instructor</option>
                  </select>
                  <div class="color_error shake" ng-if="segment_error!=''">
                     <a class="text-left shake">
                     {{segment_error}}</a>
                  </div>
               </div>   
                        <div class="form-group col-sm-6 phone">
                            <input type="text" id="start_date" class="form-control datepicker" name="start_date" ng-model="formData.publisheddate" autocomplete="off"
                                data-isblockdate="true" ng-datepickermin required>
                            <label for="start_date" class="control-label form-control-placeholder">Start Date</label>
                            <div class="color_error shake" ng-if="publisheddate_error!=''">
                                <a class="text-left shake">
                                    {{publisheddate_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-6 phone">
                            <input type="text" id="end_date" class="form-control datepicker" name="clsenddate" ng-model="formData.enddate" autocomplete="off"
                                data-isblockdate="true" ng-datepickermax required>
                            <label for="end_date" class="control-label form-control-placeholder">End Date</label>
                            <div class="color_error shake" ng-if="enddate_error!=''">
                                <a class="text-left shake">
                                    {{enddate_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-6 phone">
                            <select name="clstime" class="form-control check" ng-model="formData.publishedtime" required select-option>
                                <option value="" selected="" disabled="disabled">Start Time</option>
                                <option ng-repeat="assessmenttime in start_time" value={{assessmenttime.value}}>{{assessmenttime.title}}</option>
                            </select>
                            <div class="color_error shake" ng-if="starttime_error!=''">
                                <a class="text-left shake">
                                    {{starttime_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-6 phone">
                            <select name="clstime" class="form-control check" ng-model="formData.endtime" required select-option>
                                <option value="" selected="" disabled="disabled">End Time</option>
                                <option ng-repeat="endtime in end_time" value={{endtime.value}}>{{endtime.title}}</option>
                            </select>
                            <div class="color_error shake" ng-if="endtime_error!=''">
                                <a class="text-left shake">
                                    {{endtime_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-6" ng-if="formData.assessmenttimetype==1">
                            <input id="assessmenttime" class="form-control" ng-model="formData.assessmenttime" autocomplete="off" required="required">
                            <label for="assessmenttime" class="control-label form-control-placeholder">{{sideselect.formText[1]}}</label>
                            <div class="color_error shake" ng-if="assessmenttime_error!=''">
                                <a class="text-left shake">
                                    {{assessmenttime_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <select name="clstime" class="form-control check" ng-model="formData.randomcond" required select-option>
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[17]}}</option>
                                <option value="0">No random question</option>
                                <option value="1">Random question</option>
                            </select>
                        </div>
                        <div class="form-group col-sm-6 phone custom-check">

                            <input type="checkbox" class="checkbox" id="notify" ng-disabled="true" ng-change="zoneChanged(obj,$index)" ng-model="formData.assessmentnotification"
                                value="1" ng-checked="true">
                            <label class="checkbox" for="notify">{{sideselect.formText[16]}}</label>

                            <!-- <input id="notify" type="text" class="form-control" ng-model="formData.assessmentnotification" required="required" />
                            <label for="notify" class="control-label form-control-placeholder">{{sideselect.formText[16]}}</label> -->
                            <div class="color_error shake" ng-if="notify_error!=''">
                                <a class="text-left shake">
                                    {{notify_error}}</a>
                            </div>
                        </div>
                        <!-- <div class="form-group col-sm-6 phone">
                                <input id="attempts" type="text" class="form-control" ng-model="formData.attemptslimit" required="required" />
                                <label for="attempts" class="control-label form-control-placeholder">Attempts Limit</label>
                                <div class="color_error shake" ng-if="limit_error!=''">
                                    <a class="text-left shake">
                                        {{limit_error}}</a>
                                </div>
                            </div> -->
                        <div class="clearfix"></div>
                        <!-- <div>
                            <label>Filters</label>
                        </div>
                        <div class="row region">
                            <div class="form-group col-sm-4">
                                <label>Zone</label>
                                <div class="col-md-12 region_box scroll">
                                    <div class="checkbox" ng-repeat="obj in zoneList track by $index">
                                        <label class="checkbox-inline">
                                            <input type="checkbox" ng-change="zoneChanged(obj,$index)" ng-model="formData.zoneList[obj.zone]" value="{{obj.zone}}">{{obj.zone}}
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-4" ng-show="stateVisible">
                                <label>City</label>
                                <div class="col-sm-12 region_box scroll_bar">
                                    <div class="checkbox" ng-repeat="obj in regionList">
                                        <div ng-repeat="child in obj.child">
                                            <label class="checkbox-inline">
                                                <input type="checkbox" ng-change="regionChanged(child,$index)" ng-model="formData.regionList[child]" value="{{child}}">{{child}}
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-4" ng-show="dealerVisible">
                                <label>Dealer</label>
                                <div class="col-sm-12 region_box scroll_bar">
                                    <div class="checkbox" ng-repeat="obj in dealerList">
                                        <div ng-repeat="child in obj.child">
                                            <label class="checkbox-inline">
                                                <input type="checkbox" ng-model="formData.dealerList[child.dealer_code]" value="{{child.dealer_code}}">{{child.dealer_name }}
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div> -->
                        <div class="clearfix"></div>
                        <div>
                            <h2 class="pull-left">Questions</h2>
                            <div class="form-group col-sm-6 pull-right">
                                <input id="total_ques" type="text" class="form-control" ng-model="formData.total_question" required="required" />
                                <label for="total_ques" class="control-label form-control-placeholder">Total Questions</label>
                            </div>
                            <div class="col-sm-12 panel panel-default questions" ng-repeat="ques in assessment_question">
                                <div class="col-sm-7 panel-body">
                                    <input type="hidden" class="checkcls" ng-model="formData.questionList[ques.id]" value="{{ques.id}}">
                                    <input type="checkbox" class="checkcls" ng-model="formData.questionList[ques.id]" ng-change="quesChange(ques,$index)">{{ques.questiontext}}
                                </div>
                                <div class="col-sm-5" ng-if="formData.questionList[ques.id]">
                                    <div class="form-group">
                                        <input type="radio" name="quesradio{{ques.id}}" ng-model="formData.is_mandatory[ques.id]" value="1" /> Yes,mandatory
                                        <input type="radio" name="quesradio{{ques.id}}" ng-model="formData.is_mandatory[ques.id]" value="0" /> No,mandatory
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-12 text-center ">
                            <button type="button" class="btn primary fixed" ng-click="closeForm()">Cancel</button>
                            <button type="submit" class="btn primary fixed">Submit</button>
                        </div>
                    </form>
                </div>

            </div>
        </div>
    </div>
</section>