Commit 2228d752 by kevalbhatt

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

parent 887087d9
......@@ -710,3 +710,37 @@ td.searchTableName:hover {
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
......@@ -46,7 +46,7 @@
</div>
<div class="form-group">
<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">
<option>0</option>
<option>1</option>
......@@ -61,6 +61,9 @@
<option>10</option>
</select>
</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 class="form-group" data-id="multiValueSelect">
<label class="control-label col-sm-3" for="multiValSelect">Enable Multivalues</label>
......
......@@ -14,4 +14,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<form id="importGlossary" class="dropzone single-file-center"></form>
\ No newline at end of file
<form data-id="importGlossary" class="dropzone single-file-center"></form>
<div data-id="errorContainer" class="hide">
<ol data-id="errorDetails"></ol>
</div>
\ No newline at end of file
......@@ -37,7 +37,11 @@ define([
regions: {},
/** ui selector cache */
ui: {},
ui: {
errorContainer: "[data-id='errorContainer']",
importGlossary: "[data-id='importGlossary']",
errorDetails: "[data-id='errorDetails']"
},
/** ui events hash */
events: function() {
var events = {};
......@@ -66,8 +70,15 @@ define([
this.modal.on("closeModal", function() {
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() {
var that = this;
this.dropzone = null;
......@@ -81,7 +92,7 @@ define([
}
var headers = {};
headers[CommonViewFunction.restCsrfCustomHeader] = '""';
this.$("#importGlossary").dropzone({
this.ui.importGlossary.dropzone({
url: that.isGlossary ? UrlLinks.glossaryImportUrl() : UrlLinks.businessMetadataImportUrl(),
clickable: true,
acceptedFiles: ".csv,.xls,.xlsx",
......@@ -104,8 +115,19 @@ define([
success: function(file, response, responseObj) {
var success = true;
if (response.failedImportInfoList && response.failedImportInfoList.length) {
var errorStr = '',
notificationMsg = '';
success = false;
that.ui.errorDetails.empty();
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) {
that.modal.trigger("cancel");
......@@ -124,6 +146,22 @@ define([
dictDefaultMessage: "Drop files here or click to upload.",
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();
}
}
}
}
);
......
......@@ -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 {
height: 70px;
......@@ -830,3 +844,8 @@ td.searchTableName:hover {
background: $color_white_lilac_approx;
}
}
.help-btn {
cursor: pointer;
font-size: 20px;
}
\ No newline at end of file
......@@ -46,7 +46,7 @@
</div>
<div class="form-group">
<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">
<option>0</option>
<option>1</option>
......@@ -61,6 +61,9 @@
<option>10</option>
</select>
</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 class="form-group" data-id="multiValueSelect">
<label class="control-label col-sm-3" for="multiValSelect">Enable Multivalues</label>
......
......@@ -14,4 +14,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<form id="importGlossary" class="dropzone single-file-center"></form>
\ No newline at end of file
<form data-id="importGlossary" class="dropzone single-file-center"></form>
<div data-id="errorContainer" class="hide">
<ol data-id="errorDetails"></ol>
</div>
\ No newline at end of file
......@@ -37,7 +37,11 @@ define([
regions: {},
/** ui selector cache */
ui: {},
ui: {
errorContainer: "[data-id='errorContainer']",
importGlossary: "[data-id='importGlossary']",
errorDetails: "[data-id='errorDetails']"
},
/** ui events hash */
events: function() {
var events = {};
......@@ -66,8 +70,15 @@ define([
this.modal.on("closeModal", function() {
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() {
var that = this;
this.dropzone = null;
......@@ -81,7 +92,7 @@ define([
}
var headers = {};
headers[CommonViewFunction.restCsrfCustomHeader] = '""';
this.$("#importGlossary").dropzone({
this.ui.importGlossary.dropzone({
url: that.isGlossary ? UrlLinks.glossaryImportUrl() : UrlLinks.businessMetadataImportUrl(),
clickable: true,
acceptedFiles: ".csv,.xls,.xlsx",
......@@ -104,8 +115,19 @@ define([
success: function(file, response, responseObj) {
var success = true;
if (response.failedImportInfoList && response.failedImportInfoList.length) {
var errorStr = '',
notificationMsg = '';
success = false;
that.ui.errorDetails.empty();
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) {
that.modal.trigger("cancel");
......@@ -124,6 +146,22 @@ define([
dictDefaultMessage: "Drop files here or click to upload.",
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