scheduler.html 5.96 KB
<style type="text/css">
   .newUlView {
   padding: 5px;
   margin: 3px;
   }
   .subnavbar .mainnav > li:nth-child(5) > a{
   color: #ca5c6a;
   }
   .fc button, .fc-button-group, .fc-time-grid .fc-event .fc-time span{
      display: block;
   }
   .fc-state-default{
      background-color: #fff;
      background-image: none;
   }
   .fc-state-active, .fc-state-down{
      box-shadow: none;
      color: #fff;
      background-color: #ff9900;
   }
   .stacked:after, .stacked:before{
      display: none;
   }
   .btn-white, .btn-white:hover{
      background-color: #fff;
      background-image: none;
   }
   .fc-day-grid-event .fc-time{
      display: none;
   }

   /*#wrap {
      width: 1100px;
      margin: 0 auto;
   }
      
   #external-events {
      float: left;
      width: 150px;
      padding: 0 10px;
      border: 1px solid #ccc;
      background: #eee;
      text-align: left;
   }
      
   #external-events h4 {
      font-size: 16px;
      margin-top: 0;
      padding-top: 1em;
   }
      
   #external-events .fc-event {
      margin: 10px 0;
      cursor: pointer;
   }
      
   #external-events p {
      margin: 1.5em 0;
      font-size: 11px;
      color: #666;
   }
      
   #external-events p input {
      margin: 0;
      vertical-align: middle;
   }

   #calendar {
      float: right;
      width: 900px;
   }*/
</style>

<div class="myLoader" ng-show="showLoader">
  <img src="../img/hourglass.gif" width="50px;">
</div>

<div class="main">
   <div class="container">
      <div class="row">
         <div class="col-xs-12">
            <div class="col-xs-12 col-md-1">
                <!--<div class="widget stacked">
                  <div class="widget-header">
                     <i class="fa fa-plane" aria-hidden="true"></i>
                     <h3>Enter Support Service</h3>
                  </div>
                  <div class="widget-content">
                     <label ng-repeat="item in events" ng-click="editEvent(item)" style="width: 100%;">
                        <div class="fc-event" data-drag="true" data-jqyoui-options="{revert: 'invalid'}" jqyoui-draggable="{index: {{$index}},placeholder:true,animate:true}">
                           {{item.title}}
                        </div>
                        <div class="fc-event">
                           {{item.title}}
                        </div>
                     </label>
                     <p>
                        <input type='checkbox' id='drop-remove' />
                        <label for='drop-remove'>remove after drop</label>
                     </p>
                  </div>
               </div>
               <div class="text-right">
                  <button class="btn btn-default btn-white" data-toggle="modal" data-target="#addEvent">Add Event</button>
               </div> -->
            </div>

            <div class="col-xs-12 col-md-10">
               <div class="widget stacked">
                  <div class="widget-header">
                     <i class="fa fa-calendar" aria-hidden="true"></i>
                     <h3>Schedule</h3>
                  </div>
                  <div class="widget-content">
                     <div id="my-calendar" ui-calendar="uiConfig.calendar" ng-model="eventSources" data-drop="true"></div>


                  </div>
               </div>
            </div>
            <div style='clear:both'></div>
			<div class="col-xs-12 col-md-1">
			</div>

            <!-- <div ui-calendar="uiConfig.calendar" ng-model="eventSources" class="col-xs-12 col-md-9" data-drop="true" jqyoui-droppable="{multiple:true, onDrop: 'addEvent($index)'}"></div> -->

            </div>

         </div>

      </div>
      <div>
      </div>
      <!-- /row -->
   </div>
   <!-- /container -->
</div>
<!-- /main -->


<div id="addEvent" class="modal fade" role="dialog" data-backdrop="static">
  <div class="modal-dialog">
    <form ng-submit="addNewEvent()">
       <div class="modal-content">
         <div class="modal-header">
           <button type="button" ng-click="cancelAdd()" class="close" data-dismiss="modal">&times;</button>
           <h4 class="modal-title">Schedule New Event</h4>
        </div>
        <div class="modal-body">
           <div class="col-md-6" style="padding-left: 0;">
            <label>Event Name:</label>
            <input type="text" ng-model="newEvent.aircraft" class="form-control">
         </div>
         <div class="col-md-6" style="padding-right: 0;">
            <label>Deploy Date:</label>
            <input type="text" datepicker ng-model="newEvent.deployDate" class="form-control">
         </div>
         <div class="clearfix"></div>
      </div>
      <div class="modal-footer">
         <input type="submit" value="Add" class="btn btn-primary">
         <button type="button" class="btn btn-default" ng-click="cancelAdd()" data-dismiss="modal">Close</button>
      </div>
    </div>
   </form>

   </div>
</div>

<div id="editEvent" class="modal fade" role="dialog" data-backdrop="static">
  <div class="modal-dialog">
    <form ng-submit="updateEvent()">
       <div class="modal-content">
         <div class="modal-header">
           <button type="button" ng-click="cancelAdd()" class="close" data-dismiss="modal">&times;</button>
           <h4 class="modal-title">Update Scheduled Event</h4>
        </div>
        <div class="modal-body">
           <div class="col-md-6" style="padding-left: 0;">
            <label>Event Name:</label>
            <input type="text" ng-model="editData.title" class="form-control">
         </div>
         <div class="col-md-6" style="padding-right: 0;">
            <label>Deploy Date:</label>
            <input type="text" datepicker ng-model="editData.start" class="form-control">
         </div>
         <div class="clearfix"></div>
      </div>
      <div class="modal-footer">
         <input type="submit" value="Update" class="btn btn-primary">
         <button type="button" class="btn btn-default" ng-click="cancelUpdate()" data-dismiss="modal">Close</button>
      </div>
    </div>
   </form>

   </div>
</div>