EnVisageOnline/Main/Source/EnVisage/Views/Calendar/_editRecurrence.cshtml

209 lines
10 KiB
Plaintext

<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
<h4 class="modal-title">Change Recurrence</h4>
</div>
<div class="modal-body">
<fieldset id="fsRecurr" class="form-group-margin">
<legend class="text-bold small-bottom-margin">Recurrence pattern</legend>
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="form-group" style="margin-bottom:20px;">
<div class="radio col-sm-2 col-md-2" style="float:left;">
<label>
<input type="radio" name="periodOption" checked value="1" class="px">
<span class="lbl">Daily</span>
</label>
</div>
<div class="radio col-sm-2 col-md-2" style="margin-top:0px;float:left;">
<label>
<input type="radio" name="periodOption" value="2" class="px">
<span class="lbl">Weekly</span>
</label>
</div>
<div class="radio col-sm-2 col-md-2" style="margin-top:0px;float:left;">
<label>
<input type="radio" name="periodOption" value="3" class="px">
<span class="lbl">Mothly</span>
</label>
</div>
<div class="radio col-sm-2 col-md-2" style="margin-top:0px;float:left;">
<label>
<input type="radio" name="periodOption" value="4" class="px">
<span class="lbl">Yearly</span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="daily_settings">
<div class="col-sm-12 col-md-12">
<div class="form-group">
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">Every</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">day(s)</span>
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">Every weekday</span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="weekly_settings" style="display:none;">
<div class="col-sm-12 col-md-12">
<div class="form-group">
<div class="radio">
<label style="margin-left:-20px;">
<span class="lbl">Recur every</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">weeks on:</span>
</label>
</div>
<div class="btn-group" data-toggle="buttons" style="margin-top:10px;">
<label class="btn btn-info" style="margin-right:5px;width:100px;">
<input type="checkbox">Sunday
</label>
<label class="btn btn-info" style="margin-right:5px;width:100px;">
<input type="checkbox">Monday
</label>
<label class="btn btn-info" style="margin-right:5px;width:100px;">
<input type="checkbox">Tuesday
</label>
<label class="btn btn-info" style="width:100px;">
<input type="checkbox">Wednesday
</label>
</div> <!-- / .btn-group -->
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-info" style="margin-right:5px;width:100px;">
<input type="checkbox">Thursday
</label>
<label class="btn btn-info" style="margin-right:5px;width:100px;">
<input type="checkbox">Friday
</label>
<label class="btn btn-info" style="width:100px;">
<input type="checkbox">Saturday
</label>
</div> <!-- / .btn-group -->
</div>
</div>
</div>
<div class="row" id="monthly_settings" style="display:none;">
<div class="col-sm-10 col-md-10">
<div class="form-group">
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">Date</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">of every</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">month(s)</span>
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">The</span>
<select class="form-control" style="width:60px;display:inline;"></select>
<select class="form-control" style="width:60px;display:inline;"></select>
<span class="lbl">of every</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">month</span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="yearly_settings" style="display:none;">
<div class="col-sm-10 col-md-10">
<div class="form-group">
<div class="radio">
<label style="margin-left:-20px;">
<span class="lbl">Recur every</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">year(s)</span>
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">On:</span>
<select class="form-control" style="width:60px;display:inline;"></select>
<input type="text" class="form-control" style="width:60px;display:inline;">
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">On the:</span>
<select class="form-control" style="width:60px;display:inline;"></select>
<select class="form-control" style="width:60px;display:inline;"></select>
<span class="lbl">of</span>
<select class="form-control" style="width:60px;display:inline;"></select>
</label>
</div>
</div>
</div>
</div>
</fieldset>
<fieldset id="fsRange" class="form-group-margin">
<legend class="text-bold small-bottom-margin">Range of reccurrence</legend>
<div class="row" id="range">
<div class="col-sm-4 col-md-4">
<div class="form-group no-margin-hr">
<label class="control-label">Start</label>
<div style="float:left;width:150px;">
<div id="range_start_picker" class="input-group date datepicker">
<input type="text" class="form-control date"><span class="input-group-addon"><i class="fa fa-calendar"></i></span>
</div>
</div>
</div>
</div>
<div class="col-sm-8 col-md-8">
<div class="form-group">
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">No end date</span>
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">End date</span>
<input type="text" class="form-control" style="width:60px;display:inline;">
<span class="lbl">occurrences</span>
</label>
</div>
<div class="radio" style="float:left;margin-top:10px;">
<label>
<input type="radio" name="dailyOption" class="px">
<span class="lbl">End by</span>
</label>
</div>
<div style="float:left;width:150px;margin-left:5px;">
<div id="range_picker" class="input-group date datepicker">
<input type="text" class="form-control date"><span class="input-group-addon"><i class="fa fa-calendar"></i></span>
</div>
</div>
</div>
</div>
</div>
</fieldset>
</div> <!-- / .modal-body -->
<div class="modal-footer">
<button type="button" class="btn btn-primary">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>