Commit f47cea3f by Hemanth Yamijala

ATLAS-891 UI changes to implement Update term (Kalyanikashikar via yhemanth)

parent 056044a9
/* business-catlog.scss */
.main-search {
.form-control {
border: none;
......@@ -19,30 +20,6 @@
}
}
.page-title {
background-color: $white;
padding: 50px;
h1 {
margin-top: 0;
margin-bottom: 20px;
font-weight: 600;
small {
position: relative;
bottom: 5px;
margin-left: 15px;
padding-left: 15px;
border-left: 1px $color_mystic_approx solid;
color: $color_bombay_approx;
font-size: 40%;
font-weight: 600;
text-transform: uppercase;
}
}
.sub-title {
margin-bottom: 40px;
}
}
.arrowPosition {
left: -75px;
}
......@@ -92,6 +69,15 @@ ul[data-id=branchList] {
background-color: $white;
}
}
.listTerm{
padding-bottom:5px;
.listTerm {
padding-bottom: 5px;
}
.lineageLabel {
padding-bottom: 10px;
}
.detailLabel {
padding-bottom: 10px;
}
......@@ -8,7 +8,7 @@
}
.modal-header {
padding: 8px 15px;
padding: 15px;
border-bottom: 1px solid #DEDEDE;
}
......@@ -20,7 +20,7 @@
.modal-footer {
padding: 15px;
text-align: right;
border: none;
border: 1px solid #DEDEDE;
}
.modal-body {
......@@ -45,7 +45,8 @@
border-collapse: separate;
border-radius: 6px;
box-shadow: 0px 0px 4px #d8d8d8;
overflow: visible !important;
overflow: scroll !important;
max-height: 500px;
}
.table-quickMenu>thead>tr>th {
......
......@@ -99,7 +99,7 @@
.inputTag {
display: inline-block;
padding: 5px 10px;
padding: 2px 10px;
border: 1px $tag_color solid;
color: $tag_color;
font-size: 14px;
......@@ -121,7 +121,7 @@
}
.addTagBase {
padding: 4px 8px;
padding: 2px 8px;
border: 1px solid $action_gray;
color: $action_gray;
border-radius: 4px;
......@@ -176,11 +176,10 @@
.inputAttribute {
display: inline-block;
padding: 5px 10px;
padding: 2px 10px;
border: 1px $action_gray solid;
color: $action_gray;
font-size: 14px;
text-transform: uppercase;
border-radius: 4px;
margin-right: 3px;
margin-bottom: 3px;
......@@ -217,3 +216,42 @@ form-control .tagInpput {
display: inline-block;
}
}
.tagSpan,
.termSpan {
float: left;
padding: 2px 10px 2px 0px;
font-weight: 600;
width: 45px
}
.attrLabel {
float: left;
padding: 2px 10px 2px 0px;
font-weight: 600;
width: 70px
}
.inputAssignTag {
display: inline-block;
padding: 2px 0px;
border: 1px $action_gray solid;
color: $action_gray;
font-size: 14px;
border-radius: 4px;
margin-right: 3px;
margin-bottom: 3px;
float: left;
cursor: pointer;
background-color: $white;
width: 100px;
i.fa {
position: relative;
right: -5px;
cursor: pointer;
}
&:hover {
color: $color_dark_grey_approx;
background-color: $color_mercury_approx;
}
}
......@@ -36,8 +36,8 @@
background-color: $white;
padding: 50px;
h1 {
margin-top: 0;
margin-bottom: 20px;
margin-top: 50px;
margin-bottom: 10px;
font-weight: 600;
text-overflow: ellipsis;
max-width: 91%;
......@@ -105,7 +105,7 @@
.backButton {
display: block;
margin: 13px 13px;
margin: 0px 13px;
&:hover {
color: $color_jungle_green_approx;
}
......
......@@ -19,15 +19,16 @@
</div>
<div class="hide">
<div class="page-title clearfix">
<h1><span data-id="title"></span><!-- <button style="display:none" data-id="editButton" class="btn btn-default pull-right editbutton" id="editText"><i class="fa fa-pencil"></i></button> --></h1>
<h1><span data-id="title"></span></h1>
<button data-id="editButton" class="btn btn-default pull-right editbutton" id="editText"><i class="fa fa-pencil"></i></button>
<p class="sub-title" data-id="description">Description</p>
<div data-id="editBox" style="margin-bottom:10px;">
<!-- <div data-id="editBox" style="margin-bottom:10px;">
<textarea class="well well-sm col-sm-12" data-id="descriptionTextArea"></textarea>
<div class="clearfix" align="right">
<button class="btn-atlas" data-id="cancelButton">Cancel</button>
<button class="btn-atlas" data-id="publishButton">Publish</button>
</div>
<button class="btn btn-atlas cancel" data-id="cancelButton">Cancel</button>
<button class="btn btn-atlas ok" data-id="publishButton">Publish</button>
</div>
</div> -->
</div>
<div class="container-fluid gray-bg">
<div class="row">
......
......@@ -27,15 +27,17 @@
</div>
</div>
<div class="tagTerm">
<span class="tagSpan">Tags:</span>
<div class="" data-id="tagList">
<div class="addTag-dropdown" data-id="addTag">
<div class="addTagBase tagBox" data-id="addTagPlus"> Add Tag <i class="fa fa-plus"></i></div>
<div class="addTagBase tagBox" data-id="addTagPlus"><i class="fa fa-plus"></i></div>
</div>
</div>
<hr class=" termTagLine">
<hr class="termTagLine">
<span class="termSpan">Terms:</span>
<div class="" data-id="termList">
<div class="addTag-dropdown" data-id="addTerm">
<div class="addTagBase termBox" data-id="addTermPlus"> Add Term <i class="fa fa-plus"></i></div>
<div class="addTagBase termBox" data-id="addTermPlus"><i class="fa fa-plus"></i></div>
</div>
</div>
</div>
......@@ -44,6 +46,7 @@
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<div class="atlast-tabbable">
<h4 class="lineageLabel">LINEAGE</h4>
<div class="panel panel-default lineageLayout">
<div id="r_lineageLayoutView"></div>
</div>
......@@ -53,6 +56,7 @@
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<div class="atlast-tabbable">
<h4 class="detailLabel">DETAILS</h4>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="tab active"><a href="#tab-details" aria-controls="tab-details" role="tab" data-toggle="tab">Properties</a></li>
<!-- <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Acceptable Use</a></li> -->
......
......@@ -18,6 +18,7 @@
<h1><span data-id="title"></span></h1>
<button data-id="editButton" class="btn btn-default pull-right editbutton" id="editText"><i class="fa fa-pencil"></i></button>
<p class="sub-title" data-id="description"></p>
<span class="attrLabel">Attributes:</span>
<div data-id="showAttribute">
</div>
<div class="dropdown addTag-dropdown" data-id="addTagListBtn">
......
......@@ -22,7 +22,9 @@ define(['require',
'utils/Utils',
'collection/VCatalogList',
'models/VEntity',
], function(require, Backbone, BusinessCatalogDetailLayoutViewTmpl, Utils, VCatalogList, VEntity) {
'models/VCatalog',
'utils/Messages'
], function(require, Backbone, BusinessCatalogDetailLayoutViewTmpl, Utils, VCatalogList, VEntity, VCatalog, Messages) {
'use strict';
var BusinessCatalogDetailLayoutView = Backbone.Marionette.LayoutView.extend(
......@@ -63,15 +65,7 @@ define(['require',
/** ui events hash */
events: function() {
var events = {};
events["click " + this.ui.editButton] = function() {
this.ui.editButton.hide();
this.ui.description.hide();
this.ui.editBox.show();
this.ui.descriptionTextArea.focus();
if (this.ui.description.text().length) {
this.ui.descriptionTextArea.val(this.ui.description.text());
}
};
events["click " + this.ui.editButton] = 'onEditButton';
events["click " + this.ui.cancelButton] = 'onCancelButtonClick';
return events;
},
......@@ -103,8 +97,8 @@ define(['require',
createdDate = this.model.get('creation_time');
if (name) {
this.ui.title.show();
var termName = Utils.checkTagOrTerm(name);
this.ui.title.html('<span>' + termName.name + '</span>');
this.termName = Utils.checkTagOrTerm(name);
this.ui.title.html('<span>' + this.termName.name + '</span>');
} else {
this.ui.title.hide();
}
......@@ -185,12 +179,70 @@ define(['require',
complete: function() {}
});
},
offlineSearchTag: function(e) {
this.addTagCollectionList(this.tagCollection.fullCollection.models, $(e.currentTarget).val());
onEditButton: function(e) {
var that = this;
$(e.currentTarget).blur();
require([
'views/tag/CreateTagLayoutView',
'modules/Modal'
], function(CreateTagLayoutView, Modal) {
var view = new CreateTagLayoutView({ 'termCollection': that.collection, 'descriptionData': that.model.get('description'), 'tag': that.termName.name });
var modal = new Modal({
title: 'Edit Term',
content: view,
cancelText: "Cancel",
okText: 'Save',
allowCancel: true,
}).open();
view.ui.description.on('keyup', function(e) {
that.textAreaChangeEvent(view, modal);
});
modal.$el.find('button.ok').prop('disabled', true);
modal.on('ok', function() {
that.onSaveDescriptionClick(view);
});
modal.on('closeModal', function() {
modal.trigger('cancel');
});
});
},
textAreaChangeEvent: function(view, modal) {
if (view.description == view.ui.description.val()) {
modal.$el.find('button.ok').prop('disabled', true);
} else {
modal.$el.find('button.ok').prop('disabled', false);
}
},
onClickAddTagBtn: function() {
this.ui.searchTag.val("");
this.offlineSearchTag(this.ui.searchTag[0]);
onSaveDescriptionClick: function(view) {
view.description = view.ui.description.val();
this.onSaveButton(this.collection.first().toJSON(), Messages.updateTagDescriptionMessage, view);
this.ui.description.show();
},
onSaveButton: function(saveObject, message, view) {
var that = this,
termModel = new VCatalog();
termModel.url = function() {
return that.collection.url;
};
termModel.set({
"description": view.ui.description.val()
}).save(null, {
type: "PUT",
success: function(model, response) {
that.collection.fetch({ reset: true });
Utils.notifySuccess({
content: message
});
},
error: function(model, response) {
if (response.responseJSON && response.responseJSON.error) {
that.collection.fetch({ reset: true });
Utils.notifyError({
content: response.responseJSON.error
});
}
}
});
}
});
return BusinessCatalogDetailLayoutView;
......
......@@ -187,8 +187,10 @@ define(['require',
});
},
addTagToTerms: function(tagObject) {
var tagData = "",
var that = this,
tagData = "",
termData = "";
_.each(tagObject, function(val) {
var isTerm = Utils.checkTagOrTerm(val);
if (!isTerm.term) {
......@@ -196,12 +198,17 @@ define(['require',
}
if (isTerm.term) {
termData += '<span class="inputTag term" data-id="tagClick" data-href="' + val + '">' + val + '<i class="fa fa-close" data-id="deleteTag"></i></span>';
that.ui.addTerm.hide();
}
});
this.ui.tagList.find("span.inputTag").remove();
this.ui.termList.find("span.inputTag").remove();
this.ui.tagList.prepend(tagData);
this.ui.termList.prepend(termData);
if (this.ui.termList.find("span.term").length == 0) {
this.ui.addTerm.show();
}
},
saveTagFromList: function(ref) {
var that = this;
......
......@@ -56,9 +56,11 @@ define(['require',
* @constructs
*/
initialize: function(options) {
_.extend(this, _.pick(options, 'tagCollection', 'tag'));
if (this.tagCollection.first().get('traitTypes')) {
_.extend(this, _.pick(options, 'tagCollection', 'tag', 'termCollection', 'descriptionData'));
if (this.tagCollection && this.tagCollection.first().get('traitTypes')) {
this.description = this.tagCollection.first().get('traitTypes')[0].typeDescription;
} else if (this.termCollection) {
this.description = this.descriptionData;
} else {
this.create = true;
}
......
......@@ -22,6 +22,7 @@ ATLAS-409 Atlas will not import avro tables with schema read from a file (dosset
ATLAS-379 Create sqoop and falcon metadata addons (venkatnrangan,bvellanki,sowmyaramesh via shwethags)
ALL CHANGES:
ATLAS-891 UI changes to implement Update term (Kalyanikashikar via yhemanth)
ATLAS-794 Business Catalog Update (jspeidel via yhemanth)
ATLAS-837 Enhance Sqoop addon to handle export operation (venkatnrangan via shwethags)
ATLAS-869 Make LDAP/AD properties to be configurable. (nixonrodrigues via yhemanth)
......
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