Repository: atlas Updated Branches: refs/heads/master 3b074d9ce -> 809a99c8a
ATLAS-2484 : UI - Need validation for Start Date and End Date while applying validity period Signed-off-by: nixonrodrigues <[email protected]> Project: http://git-wip-us.apache.org/repos/asf/atlas/repo Commit: http://git-wip-us.apache.org/repos/asf/atlas/commit/5f71cad0 Tree: http://git-wip-us.apache.org/repos/asf/atlas/tree/5f71cad0 Diff: http://git-wip-us.apache.org/repos/asf/atlas/diff/5f71cad0 Branch: refs/heads/master Commit: 5f71cad0d19dfdaff5ddbaf1d9b29ff32ed60f3e Parents: 3b074d9 Author: pratik24mac <[email protected]> Authored: Thu Mar 15 15:21:50 2018 +0530 Committer: nixonrodrigues <[email protected]> Committed: Fri Mar 16 18:51:07 2018 +0530 ---------------------------------------------------------------------- .../js/templates/tag/AddTagModalView_tmpl.html | 20 +++---- .../js/templates/tag/AddTimezoneView_tmpl.html | 12 ++-- .../public/js/views/tag/AddTagModalView.js | 5 +- .../public/js/views/tag/AddTimezoneItemView.js | 60 +++++++++----------- 4 files changed, 45 insertions(+), 52 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/atlas/blob/5f71cad0/dashboardv2/public/js/templates/tag/AddTagModalView_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/tag/AddTagModalView_tmpl.html b/dashboardv2/public/js/templates/tag/AddTagModalView_tmpl.html index dbf7d66..0c3f7a9 100644 --- a/dashboardv2/public/js/templates/tag/AddTagModalView_tmpl.html +++ b/dashboardv2/public/js/templates/tag/AddTagModalView_tmpl.html @@ -16,26 +16,24 @@ --> <div> <div class="form-group hide"> - {{#if tagModel}} - <h4>{{tagModel.typeName}}</h4> {{else}} <div class="row modalHeight"> - <div class="col-md-8"> + <div class="col-md-7"> + {{#if tagModel}} + <h4>{{tagModel.typeName}}</h4> </div>{{else}} <select class="form-control row-margin-bottom" data-id="addTagOptions" required> </select> </div> {{/if}} - <div class="col-sm-2"> + <div class="col-md-2"> <div class="inline"> <label class="checkbox-inline btn"> <input type="checkbox" data-id="checkModalTagProperty" class="input" checked /> Propagate</label> </div> </div> - <div class="col-sm-2"> - <div class="inline-content-fr table-action-btn"> - <div class="inline"> - <label class="checkbox-inline btn"> - <input type="checkbox" data-id="checkTimezoneProperty" class="input" /> Apply Validity Period</label> - </div> + <div class="col-md-3"> + <div class="inline"> + <label class="checkbox-inline btn"> + <input type="checkbox" data-id="checkTimezoneProperty" class="input" /> Apply Validity Period</label> </div> </div> </div> @@ -60,7 +58,7 @@ </div> <div class="col-sm-12" style="display:none"> <p>Classification Attributes(optional)</p> - <p class="text-gray">Add attribute values for this tag</p> + <p class="text-gray">Add attribute values for this classification</p> <div data-id="tagAttribute"></div> </div> </div> http://git-wip-us.apache.org/repos/asf/atlas/blob/5f71cad0/dashboardv2/public/js/templates/tag/AddTimezoneView_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/tag/AddTimezoneView_tmpl.html b/dashboardv2/public/js/templates/tag/AddTimezoneView_tmpl.html index e7e1289..62b9009 100644 --- a/dashboardv2/public/js/templates/tag/AddTimezoneView_tmpl.html +++ b/dashboardv2/public/js/templates/tag/AddTimezoneView_tmpl.html @@ -15,20 +15,16 @@ * limitations under the License. --> <div class="form-group clearfix"> - <div class="col-sm-4"> - <label for="">Start Time</label> - <input type="text" class="form-control" name="startTime" data-id="startTime" /> - </div> - <div class="col-sm-4"> - <label for="">End Time</label> - <input type="text" class="form-control" name="endTime" data-id="endTime" /> + <div class="col-sm-8"> + <label for="">Start Time - End Time</label> + <input type="text" class="form-control" name="timeInterval" data-id="timeInterval" readonly="true" /> </div> <div class="col-sm-3"> <label for="">TimeZone</label> <select class="form-control row-margin-bottom" data-id="timeZone" required> </select> </div> - <div class="col-sm-1 attributePlusData" align="right"> + <div class="col-sm-1 attributePlusData" align="right" style="margin-top: 25px;"> <button type="button" class="btn btn-danger btn-sm closeInput" data-id="close"><i class="fa fa-times"></i></button> </div> </div> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/5f71cad0/dashboardv2/public/js/views/tag/AddTagModalView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/tag/AddTagModalView.js b/dashboardv2/public/js/views/tag/AddTagModalView.js index 9d60e08..e442f57 100644 --- a/dashboardv2/public/js/views/tag/AddTagModalView.js +++ b/dashboardv2/public/js/views/tag/AddTagModalView.js @@ -63,6 +63,9 @@ define(['require', var events = {}; events["change " + this.ui.addTagOptions] = 'onChangeTagDefination'; events["change " + this.ui.checkTimeZone] = function(e) { + if(this.tagModel){ + this.buttonActive({isButtonActive: true}); + } if (e.target.checked) { this.ui.timeZoneDiv.show(); this.ui.validityPeriodBody.show(); @@ -311,7 +314,7 @@ define(['require', }); }, buttonActive: function(option) { - if (option && option.isButtonActive) { + if (option) { var isButton = option.isButtonActive; this.modal.$el.find('button.ok').attr("disabled", isButton === true ? false : true); } http://git-wip-us.apache.org/repos/asf/atlas/blob/5f71cad0/dashboardv2/public/js/views/tag/AddTimezoneItemView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/tag/AddTimezoneItemView.js b/dashboardv2/public/js/views/tag/AddTimezoneItemView.js index 015bb51..420303f 100644 --- a/dashboardv2/public/js/views/tag/AddTimezoneItemView.js +++ b/dashboardv2/public/js/views/tag/AddTimezoneItemView.js @@ -36,19 +36,14 @@ define(['require', /** ui selector cache */ ui: { close: "[data-id='close']", - startTime: 'input[name="startTime"]', - endTime: 'input[name="endTime"]', + timeInterval: 'input[name="timeInterval"]', timeZone: '[data-id="timeZone"]' }, /** ui events hash */ events: function() { - var events = {}; - events["change " + this.ui.startTime] = function(e) { - this.model.set({ "startTime": this.ui.startTime.val() }); - this.buttonActive({ isButtonActive: true }); - }; - events["change " + this.ui.endTime] = function(e) { - this.model.set({ "endTime": this.ui.endTime.val() }); + var events = {}, + that = this; + events["change " + this.ui.timeInterval] = function(e) { this.buttonActive({ isButtonActive: true }); }; events["change " + this.ui.timeZone] = function(e) { @@ -68,46 +63,45 @@ define(['require', }, onRender: function() { var that = this, + minDate = new Date(), dateObj = { - "singleDatePicker": true, "showDropdowns": true, "timePicker": true, + "timePicker24Hour": true, "startDate": new Date(), - "timePickerIncrement": 30, "locale": { - format: 'YYYY/MM/DD HH:MM:SS' - } + format: 'YYYY/MM/DD h:mm A' + }, + "alwaysShowCalendars": true }, tzstr = '<option selected="selected" disabled="disabled">-- Select Timezone --</option>'; if (this.model.get('startTime') !== "") { - this.ui.startTime.daterangepicker({ - "singleDatePicker": true, + this.ui.timeInterval.daterangepicker({ "showDropdowns": true, "timePicker": true, + "timePicker24Hour": true, "startDate": this.model.get('startTime'), - "timePickerIncrement": 30, + "endDate": this.model.get('endTime'), "locale": { - format: 'YYYY/MM/DD HH:MM:SS' - } - }); - this.ui.endTime.daterangepicker({ - "singleDatePicker": true, - "showDropdowns": true, - "timePicker": true, - "startDate": this.model.get('endTime'), - "timePickerIncrement": 30, - "locale": { - format: 'YYYY/MM/DD HH:MM:SS' - } + format: 'YYYY/MM/DD h:mm A' + }, + "alwaysShowCalendars": true + }).on('apply.daterangepicker', function(fullDate) { + var val = fullDate.currentTarget.value.split(' - '); + that.model.set('startTime', val[0]); + that.model.set('endTime', val[1]); }); this.ui.timeZone.select2({ data: moment.tz.names() }); this.ui.timeZone.val(this.model.get('timeZone')).trigger("change", { 'manual': true }); } else { - this.ui.startTime.daterangepicker(dateObj); - this.ui.endTime.daterangepicker(dateObj); + this.ui.timeInterval.daterangepicker(dateObj).on('apply.daterangepicker', function(fullDate) { + var val = fullDate.currentTarget.value.split(' - '); + that.model.set('startTime', val[0]); + that.model.set('endTime', val[1]); + }); this.ui.timeZone.html(tzstr); this.ui.timeZone.select2({ placeholder: "Select TimeZone", @@ -115,6 +109,8 @@ define(['require', data: moment.tz.names() }); } + $('[name="daterangepicker_start"]').attr('readonly', true); + + $('[name="daterangepicker_end"]').attr('readonly', true); }, buttonActive: function(option) { var that = this; @@ -129,8 +125,8 @@ define(['require', } if (this.parentView.collection.models.length <= 0) { this.parentView.ui.timeZoneDiv.hide(); - this.parentView.ui.checkTimeZone.prop('checked',false); - this.parentView.modal.$el.find('button.ok').attr("disabled",true); + this.parentView.ui.checkTimeZone.prop('checked', false); + this.parentView.modal.$el.find('button.ok').attr("disabled", true); } } });
