Skip to content

A
atlas
Commit 2228d752 by kevalbhatt
Options

ATLAS-3728:- UI: Show uploaded data details (status)

parent 887087d9
Showing with 155 additions and 12 deletions
dashboardv2/public/css/scss/theme.scss
...@@ -710,3 +710,37 @@ td.searchTableName:hover { ...@@ -710,3 +710,37 @@ td.searchTableName:hover {
background: $color_white_lilac_approx; background: $color_white_lilac_approx;
} }
} }
.help-btn {
cursor: pointer;
font-size: 20px;
}
.back-button {
display: inline-block;
float: left;
position: absolute;
left: 4px;
top: 9px;
font-size: 38px;
color: #bfbfbf;
cursor: pointer;
&:hover {
color: $gray;
}
}
.modal-header {
.back-button {
margin-left: 10px;
top: 9px;
font-size: 38px;
}
.modal-name {
font-size: 22px;
margin-top: 5px;
margin-left: 20px;
}
}
\ No newline at end of file
dashboardv2/public/js/templates/business_metadata/BusinessMetadataAttributeItemView_tmpl.html
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label col-sm-3 required" for="type">Search Weight</label> <label class="control-label col-sm-3 required" for="type">Search Weight</label>
<div class="col-sm-8"> <div class="col-sm-6">
<select class="form-control searchWeightSelector" data-id="searchWeightSelector"> <select class="form-control searchWeightSelector" data-id="searchWeightSelector">
<option>0</option> <option>0</option>
<option>1</option> <option>1</option>
...@@ -61,6 +61,9 @@ ...@@ -61,6 +61,9 @@
<option>10</option> <option>10</option>
</select> </select>
</div> </div>
<label class="control-label">
<i class="fa fa-question-circle help-btn" title="<span><i class='fa fa-arrow-up'></i> the search weight for the attribute,<i class='fa fa-arrow-up'></i> the entity in the topmost search results when searched for by that attribute</span><h6>Applicable Ranges</h6><ul style='padding:0px'><li>Quick search: <b>0 - 10</b></li><li>Suggestion: <b>8 - 10</b></li></ul>" data-html="true"></i>
</label>
</div> </div>
<div class="form-group" data-id="multiValueSelect"> <div class="form-group" data-id="multiValueSelect">
<label class="control-label col-sm-3" for="multiValSelect">Enable Multivalues</label> <label class="control-label col-sm-3" for="multiValSelect">Enable Multivalues</label>
......
dashboardv2/public/js/templates/import/ImportLayoutView_tmpl.html
...@@ -14,4 +14,7 @@ ...@@ -14,4 +14,7 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<form id="importGlossary" class="dropzone single-file-center"></form> <form data-id="importGlossary" class="dropzone single-file-center"></form>
\ No newline at end of file <div data-id="errorContainer" class="hide">
<ol data-id="errorDetails"></ol>
</div>
\ No newline at end of file
dashboardv2/public/js/views/import/ImportLayoutView.js
...@@ -37,7 +37,11 @@ define([ ...@@ -37,7 +37,11 @@ define([
regions: {}, regions: {},
/** ui selector cache */ /** ui selector cache */
ui: {}, ui: {
errorContainer: "[data-id='errorContainer']",
importGlossary: "[data-id='importGlossary']",
errorDetails: "[data-id='errorDetails']"
},
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
var events = {}; var events = {};
...@@ -66,8 +70,15 @@ define([ ...@@ -66,8 +70,15 @@ define([
this.modal.on("closeModal", function() { this.modal.on("closeModal", function() {
that.modal.trigger("cancel"); that.modal.trigger("cancel");
}); });
this.bindEvents();
},
bindEvents: function() {
var that = this;
$('body').on('click', '.importBackBtn', function() {
var modalTitle = that.isGlossary ? "Import Glossary" : "Import Business Metadata";
that.toggleErrorAndDropZoneView({ title: modalTitle, isErrorView: false });
});
}, },
bindEvents: function() {},
onRender: function() { onRender: function() {
var that = this; var that = this;
this.dropzone = null; this.dropzone = null;
...@@ -81,7 +92,7 @@ define([ ...@@ -81,7 +92,7 @@ define([
} }
var headers = {}; var headers = {};
headers[CommonViewFunction.restCsrfCustomHeader] = '""'; headers[CommonViewFunction.restCsrfCustomHeader] = '""';
this.$("#importGlossary").dropzone({ this.ui.importGlossary.dropzone({
url: that.isGlossary ? UrlLinks.glossaryImportUrl() : UrlLinks.businessMetadataImportUrl(), url: that.isGlossary ? UrlLinks.glossaryImportUrl() : UrlLinks.businessMetadataImportUrl(),
clickable: true, clickable: true,
acceptedFiles: ".csv,.xls,.xlsx", acceptedFiles: ".csv,.xls,.xlsx",
...@@ -104,8 +115,19 @@ define([ ...@@ -104,8 +115,19 @@ define([
success: function(file, response, responseObj) { success: function(file, response, responseObj) {
var success = true; var success = true;
if (response.failedImportInfoList && response.failedImportInfoList.length) { if (response.failedImportInfoList && response.failedImportInfoList.length) {
var errorStr = '',
notificationMsg = '';
success = false; success = false;
that.ui.errorDetails.empty();
Utils.defaultErrorHandler(null, file.xhr, { defaultErrorMessage: response.failedImportInfoList[0].remarks }); Utils.defaultErrorHandler(null, file.xhr, { defaultErrorMessage: response.failedImportInfoList[0].remarks });
if (response.failedImportInfoList.length > 1) {
var modalTitle = '<div class="back-button importBackBtn" title="Back to import file"><i class="fa fa-angle-left "></i> </div> <div class="modal-name">Error Details</div>';
_.each(response.failedImportInfoList, function(err_obj) {
errorStr += '<li>' + err_obj.remarks + '</li>';
});
that.ui.errorDetails.append(errorStr);
that.toggleErrorAndDropZoneView({ title: modalTitle, isErrorView: true });
}
} }
if (success) { if (success) {
that.modal.trigger("cancel"); that.modal.trigger("cancel");
...@@ -124,6 +146,22 @@ define([ ...@@ -124,6 +146,22 @@ define([
dictDefaultMessage: "Drop files here or click to upload.", dictDefaultMessage: "Drop files here or click to upload.",
headers: headers headers: headers
}); });
},
toggleErrorAndDropZoneView: function(options) {
var that = this;
if (options) {
that.modal.$el.find('.modal-title').html(options.title);
if (options.isErrorView) {
that.ui.importGlossary.addClass("hide");
that.ui.errorContainer.removeClass("hide");
that.modal.$el.find("button.ok").addClass('hide');
} else {
that.ui.importGlossary.removeClass("hide");
that.ui.errorContainer.addClass("hide");
that.modal.$el.find("button.ok").removeClass('hide');
that.ui.errorDetails.empty();
}
}
} }
} }
); );
......
dashboardv3/public/css/scss/theme.scss
...@@ -62,6 +62,20 @@ body { ...@@ -62,6 +62,20 @@ body {
} }
} }
.modal-header {
.back-button {
margin-left: 10px;
top: 9px;
font-size: 38px;
}
.modal-name {
font-size: 22px;
margin-top: 5px;
margin-left: 20px;
}
}
.atlas-page-header { .atlas-page-header {
height: 70px; height: 70px;
...@@ -830,3 +844,8 @@ td.searchTableName:hover { ...@@ -830,3 +844,8 @@ td.searchTableName:hover {
background: $color_white_lilac_approx; background: $color_white_lilac_approx;
} }
} }
.help-btn {
cursor: pointer;
font-size: 20px;
}
\ No newline at end of file
dashboardv3/public/js/templates/business_metadata/BusinessMetadataAttributeItemView_tmpl.html
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label col-sm-3 required" for="type">Search Weight</label> <label class="control-label col-sm-3 required" for="type">Search Weight</label>
<div class="col-sm-8"> <div class="col-sm-6">
<select class="form-control searchWeightSelector" data-id="searchWeightSelector"> <select class="form-control searchWeightSelector" data-id="searchWeightSelector">
<option>0</option> <option>0</option>
<option>1</option> <option>1</option>
...@@ -61,6 +61,9 @@ ...@@ -61,6 +61,9 @@
<option>10</option> <option>10</option>
</select> </select>
</div> </div>
<label class="control-label">
<i class="fa fa-question-circle help-btn" title="<span><i class='fa fa-arrow-up'></i> the search weight for the attribute,<i class='fa fa-arrow-up'></i> the entity in the topmost search results when searched for by that attribute</span><h6>Applicable Ranges</h6><ul style='padding:0px'><li>Quick search: <b>0 - 10</b></li><li>Suggestion: <b>8 - 10</b></li></ul>" data-html="true"></i>
</label>
</div> </div>
<div class="form-group" data-id="multiValueSelect"> <div class="form-group" data-id="multiValueSelect">
<label class="control-label col-sm-3" for="multiValSelect">Enable Multivalues</label> <label class="control-label col-sm-3" for="multiValSelect">Enable Multivalues</label>
......
dashboardv3/public/js/templates/import/ImportLayoutView_tmpl.html
...@@ -14,4 +14,7 @@ ...@@ -14,4 +14,7 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<form id="importGlossary" class="dropzone single-file-center"></form> <form data-id="importGlossary" class="dropzone single-file-center"></form>
\ No newline at end of file <div data-id="errorContainer" class="hide">
<ol data-id="errorDetails"></ol>
</div>
\ No newline at end of file
dashboardv3/public/js/views/import/ImportLayoutView.js
...@@ -37,7 +37,11 @@ define([ ...@@ -37,7 +37,11 @@ define([
regions: {}, regions: {},
/** ui selector cache */ /** ui selector cache */
ui: {}, ui: {
errorContainer: "[data-id='errorContainer']",
importGlossary: "[data-id='importGlossary']",
errorDetails: "[data-id='errorDetails']"
},
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
var events = {}; var events = {};
...@@ -66,8 +70,15 @@ define([ ...@@ -66,8 +70,15 @@ define([
this.modal.on("closeModal", function() { this.modal.on("closeModal", function() {
that.modal.trigger("cancel"); that.modal.trigger("cancel");
}); });
this.bindEvents();
},
bindEvents: function() {
var that = this;
$('body').on('click', '.importBackBtn', function() {
var modalTitle = that.isGlossary ? "Import Glossary" : "Import Business Metadata";
that.toggleErrorAndDropZoneView({ title: modalTitle, isErrorView: false });
});
}, },
bindEvents: function() {},
onRender: function() { onRender: function() {
var that = this; var that = this;
this.dropzone = null; this.dropzone = null;
...@@ -81,7 +92,7 @@ define([ ...@@ -81,7 +92,7 @@ define([
} }
var headers = {}; var headers = {};
headers[CommonViewFunction.restCsrfCustomHeader] = '""'; headers[CommonViewFunction.restCsrfCustomHeader] = '""';
this.$("#importGlossary").dropzone({ this.ui.importGlossary.dropzone({
url: that.isGlossary ? UrlLinks.glossaryImportUrl() : UrlLinks.businessMetadataImportUrl(), url: that.isGlossary ? UrlLinks.glossaryImportUrl() : UrlLinks.businessMetadataImportUrl(),
clickable: true, clickable: true,
acceptedFiles: ".csv,.xls,.xlsx", acceptedFiles: ".csv,.xls,.xlsx",
...@@ -104,8 +115,19 @@ define([ ...@@ -104,8 +115,19 @@ define([
success: function(file, response, responseObj) { success: function(file, response, responseObj) {
var success = true; var success = true;
if (response.failedImportInfoList && response.failedImportInfoList.length) { if (response.failedImportInfoList && response.failedImportInfoList.length) {
var errorStr = '',
notificationMsg = '';
success = false; success = false;
that.ui.errorDetails.empty();
Utils.defaultErrorHandler(null, file.xhr, { defaultErrorMessage: response.failedImportInfoList[0].remarks }); Utils.defaultErrorHandler(null, file.xhr, { defaultErrorMessage: response.failedImportInfoList[0].remarks });
if (response.failedImportInfoList.length > 1) {
var modalTitle = '<div class="back-button importBackBtn" title="Back to import file"><i class="fa fa-angle-left "></i> </div> <div class="modal-name">Error Details</div>';
_.each(response.failedImportInfoList, function(err_obj) {
errorStr += '<li>' + err_obj.remarks + '</li>';
});
that.ui.errorDetails.append(errorStr);
that.toggleErrorAndDropZoneView({ title: modalTitle, isErrorView: true });
}
} }
if (success) { if (success) {
that.modal.trigger("cancel"); that.modal.trigger("cancel");
...@@ -124,6 +146,22 @@ define([ ...@@ -124,6 +146,22 @@ define([
dictDefaultMessage: "Drop files here or click to upload.", dictDefaultMessage: "Drop files here or click to upload.",
headers: headers headers: headers
}); });
},
toggleErrorAndDropZoneView: function(options) {
var that = this;
if (options) {
that.modal.$el.find('.modal-title').html(options.title);
if (options.isErrorView) {
that.ui.importGlossary.addClass("hide");
that.ui.errorContainer.removeClass("hide");
that.modal.$el.find("button.ok").addClass('hide');
} else {
that.ui.importGlossary.removeClass("hide");
that.ui.errorContainer.addClass("hide");
that.modal.$el.find("button.ok").removeClass('hide');
that.ui.errorDetails.empty();
}
}
} }
} }
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment