Skip to content

A
atlas
Commit 71584552 by sameer79 Committed by Sarath Subramanian
Options

ATLAS:3456 : Allows user to add label in entity detail page.

parent 4952a560
Showing with 524 additions and 32 deletions
dashboardv2/public/css/scss/common.scss
...@@ -228,16 +228,18 @@ pre { ...@@ -228,16 +228,18 @@ pre {
.custom-col-0{ .custom-col-0{
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
line-height: 31px;
width: 2%; width: 2%;
} }
.custom-col-1{ .custom-col-1{
width: 43%; width: 40%;
} }
.custom-col-2{ .custom-col-2{
text-align: center; text-align: center;
width: 10%; width: 12%;
margin-left: 2%;
} }
} }
} }
...@@ -245,3 +247,10 @@ pre { ...@@ -245,3 +247,10 @@ pre {
.errorMsg { .errorMsg {
color: $red; color: $red;
} }
.badge-default {
background-color: $color_havelock_blue_approx;
color: $white;
font-size: 12px;
font-weight: normal;
}
dashboardv2/public/css/scss/panel.scss
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
.panel-title { .panel-title {
font-weight: bold; font-weight: bold;
padding-top: 8px; padding-top: 6px;
} }
} }
...@@ -102,26 +102,26 @@ ...@@ -102,26 +102,26 @@
} }
i.ec-icon:before { i.ec-icon:before {
content: "\f078" content: "\f054"
} }
&.collapsed, &.collapsed,
&[aria-expanded="false"] { &[aria-expanded="false"] {
i.ec-icon:before { i.ec-icon:before {
content: "\f078" content: "\f054"
} }
} }
&[aria-expanded="true"] { &[aria-expanded="true"] {
i.ec-icon:before { i.ec-icon:before {
content: "\f077" content: "\f078"
} }
} }
} }
} }
.panel-default.custom-panel>.panel-heading { .panel-default.custom-panel>.panel-heading {
color: $black; color: $color_jungle_green_approx;
cursor: pointer; cursor: pointer;
border-bottom: none; border-bottom: none;
display: inline-block; display: inline-block;
...@@ -129,12 +129,12 @@ ...@@ -129,12 +129,12 @@
.panel-title { .panel-title {
font-weight: normal; font-weight: normal;
a:hover { a:hover {
color: $black; color: $color_jungle_green_approx;
opacity: 0.7; opacity: 0.7;
} }
} }
.btn-group { .btn-group {
margin-top: 3px; margin-top: 4px;
} }
} }
...@@ -151,5 +151,5 @@ ...@@ -151,5 +151,5 @@
border-top: none; border-top: none;
} }
.panel-default.custom-panel>.panel-heading > .btn-group > button { .panel-default.custom-panel>.panel-heading > .btn-group > button {
color: $black; color: $color_jungle_green_approx;
} }
dashboardv2/public/js/models/VEntity.js
...@@ -87,6 +87,14 @@ define(['require', ...@@ -87,6 +87,14 @@ define(['require',
dataType: 'json' dataType: 'json'
}, options); }, options);
return this.constructor.nonCrudOperation.call(this, url, "", options); return this.constructor.nonCrudOperation.call(this, url, "", options);
},
saveEntityLabels: function(guid, options) {
var url = UrlLinks.entityLabelsAPIUrl(guid);
options = _.extend({
contentType: 'application/json',
dataType: 'json'
}, options);
return this.constructor.nonCrudOperation.call(this, url, "POST", options);
} }
}, {}); }, {});
return VEntity; return VEntity;
......
dashboardv2/public/js/templates/detail_page/DetailPageLayoutView_tmpl.html
...@@ -75,6 +75,7 @@ ...@@ -75,6 +75,7 @@
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div id="r_entityUserDefineView"></div> <div id="r_entityUserDefineView"></div>
<div id="r_entityLabelDefineView"></div>
</div> </div>
</div> </div>
</div> </div>
......
dashboardv2/public/js/templates/entity/EntityLabelDefineView_tmpl.html 0 → 100644
<!--
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<div class="panel-group" id="accordion">
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefineLabel">
{{#ifCond labels.length "===" 0}}
<div class="panel-heading collapsed" data-toggle="collapse" href="#collapse3" aria-expanded="false" style="width: 70%">
<h4 class="panel-title">
<a>Labels </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
{{else}}
<div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true" style="width: 70%">
<h4 class="panel-title">
<a>Labels </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
{{/ifCond}}
{{#ifCond readOnlyEntity "===" false}}
<div class="panel-actions">
{{#ifCond swapItem "!==" true}}
<button class="btn btn-action btn-sm" data-id="addLabels" {{#ifCond labels.length "===" 0}} data-original-title="Add User-Defined Labels" {{else}} data-original-title="Edit User-Defined Labels" {{/ifCond}}>
{{#ifCond labels.length "===" 0}} Add {{else}} Edit {{/ifCond}}
</button>
{{/ifCond}}
{{#ifCond saveLabels "===" true}}
<button class="btn btn-action btn-sm" data-id="saveLabels" data-original-title="Save User-Defined Labels">Save</button>
{{/ifCond}}
</div>
{{/ifCond}}
<div id="collapse3" {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
{{#ifCond labels.length "===" 0}}
<div class="panel-body">
<div class="row">
<div class="col-md-12">
{{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}}
<div class="badge-container">
{{#each labels}}
<label class="label badge-default">{{this}}</label>
{{/each}}
</div>
{{/ifCond}}
</div>
</div>
</div>
{{/ifCond}}
</div>
{{#ifCond labels.length ">" 0}}
<div id="collapse3" class="panel-collapse collapse in" >
<div class="panel-body">
<div class="row">
<div class="col-md-12">
{{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}}
<div class="badge-container">
{{#each labels}}
<label class="label badge-default">{{this}}</label>
{{/each}}
</div>
{{/ifCond}}
</div>
</div>
</div>
</div>
{{/ifCond}}
</div>
</div>
dashboardv2/public/js/templates/site/Statistics_tmpl.html
...@@ -15,12 +15,12 @@ ...@@ -15,12 +15,12 @@
* limitations under the License. * limitations under the License.
--> -->
<div class="panel-group server-stats-container statsContainer hide" id="accordion"> <div class="panel-group server-stats-container statsContainer hide" id="accordion">
<div class="panel panel-default expand_collapse_panel-icon" data-id="entity"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="entity">
<div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true"> <div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Entities <span class="count">(0)</span></a> <a>Entities <span class="count">(0)</span></a>
</h4> </h4>
<div class="btn-group pull-right"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div> </div>
</div> </div>
...@@ -36,12 +36,12 @@ ...@@ -36,12 +36,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default expand_collapse_panel-icon" data-id="stats"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats">
<div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true"> <div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Server Statistics </a> <a>Server Statistics </a>
</h4> </h4>
<div class="btn-group pull-right"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div> </div>
</div> </div>
......
dashboardv2/public/js/utils/UrlLinks.js
...@@ -78,6 +78,9 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require ...@@ -78,6 +78,9 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require
return entitiesUrl += '?minExtInfo=' + (minExtInfo); return entitiesUrl += '?minExtInfo=' + (minExtInfo);
} }
}, },
entityLabelsAPIUrl: function(guid) {
return this.entitiesApiUrl({ guid: guid }) + "/labels";
},
entityHeaderApiUrl: function(guid) { entityHeaderApiUrl: function(guid) {
return this.entitiesApiUrl({ guid: guid }) + "/header" return this.entitiesApiUrl({ guid: guid }) + "/header"
}, },
......
dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js
...@@ -47,6 +47,7 @@ define(['require', ...@@ -47,6 +47,7 @@ define(['require',
RProfileLayoutView: "#r_profileLayoutView", RProfileLayoutView: "#r_profileLayoutView",
RRelationshipLayoutView: "#r_relationshipLayoutView", RRelationshipLayoutView: "#r_relationshipLayoutView",
REntityUserDefineView: "#r_entityUserDefineView", REntityUserDefineView: "#r_entityUserDefineView",
REntityLabelDefineView: "#r_entityLabelDefineView"
}, },
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
...@@ -196,7 +197,7 @@ define(['require', ...@@ -196,7 +197,7 @@ define(['require',
if (collectionJSON.isIncomplete === true) { if (collectionJSON.isIncomplete === true) {
this.$(".isIncomplete").addClass("show"); this.$(".isIncomplete").addClass("show");
} }
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/><i class="fa fa-refresh fa-spin-custom"></i>').find("img").on('error', function() { this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/><i class="fa fa-hourglass-half"></i>').find("img").on('error', function() {
this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src }); this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src });
}); });
} else { } else {
...@@ -248,6 +249,7 @@ define(['require', ...@@ -248,6 +249,7 @@ define(['require',
} }
this.renderEntityDetailTableLayoutView(obj); this.renderEntityDetailTableLayoutView(obj);
this.renderEntityUserDefineView(obj); this.renderEntityUserDefineView(obj);
this.renderEntityLabelDefineView(obj);
this.renderRelationshipLayoutView(obj); this.renderRelationshipLayoutView(obj);
this.renderAuditTableLayoutView(obj); this.renderAuditTableLayoutView(obj);
this.renderTagTableLayoutView(obj); this.renderTagTableLayoutView(obj);
...@@ -495,6 +497,12 @@ define(['require', ...@@ -495,6 +497,12 @@ define(['require',
that.REntityUserDefineView.show(new EntityUserDefineView(obj)); that.REntityUserDefineView.show(new EntityUserDefineView(obj));
}); });
}, },
renderEntityLabelDefineView: function(obj) {
var that = this;
require(['views/entity/EntityLabelDefineView'], function(EntityLabelDefineView) {
that.REntityLabelDefineView.show(new EntityLabelDefineView(obj));
});
},
renderTagTableLayoutView: function(obj) { renderTagTableLayoutView: function(obj) {
var that = this; var that = this;
require(['views/tag/TagDetailTableLayoutView'], function(TagDetailTableLayoutView) { require(['views/tag/TagDetailTableLayoutView'], function(TagDetailTableLayoutView) {
......
dashboardv2/public/js/views/entity/EntityLabelDefineView.js 0 → 100644
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
define(['require',
'backbone',
'hbs!tmpl/entity/EntityLabelDefineView_tmpl',
'models/VEntity',
'utils/Utils',
'utils/Messages',
'utils/Enums'
], function(require, Backbone, EntityLabelDefineView_tmpl, VEntity, Utils, Messages, Enums) {
'use strict';
return Backbone.Marionette.LayoutView.extend({
_viewName: 'REntityLabelDefineView',
template: EntityLabelDefineView_tmpl,
templateHelpers: function() {
return {
swapItem: this.swapItem,
labels: this.labels,
saveLabels: this.saveLabels,
readOnlyEntity: this.readOnlyEntity
};
},
ui: {
addLabelOptions: "[data-id='addLabelOptions']",
addLabels: "[data-id='addLabels']",
saveLabels: "[data-id='saveLabels']"
},
events: function() {
var events = {};
events["change " + this.ui.addLabelOptions] = 'onChangeLabelChange';
events["click " + this.ui.addLabels] = 'handleBtnClick';
events["click " + this.ui.saveLabels] = 'saveUserDefinedLabels';
return events;
},
initialize: function(options) {
var self = this;
_.extend(this, _.pick(options, 'entity'));
this.swapItem = false, this.saveLabels = false;
this.readOnlyEntity = Enums.entityStateReadOnly[this.entity.status]
this.entityModel = new VEntity(this.entity);
this.labels = this.entity.labels || [];
},
onRender: function() {
this.populateLabelOptions();
},
bindEvents: function () {
},
populateLabelOptions: function() {
var that = this,
str = this.labels.map(function (label) {
return "<option selected > "+ label +" </option>";
});
this.ui.addLabelOptions.html(str);
this.ui.addLabelOptions.select2({
placeholder: "Select Label",
allowClear: true,
tags: true,
multiple: true
});
},
onChangeLabelChange: function () {
this.labels = this.ui.addLabelOptions.val();
},
handleBtnClick: function () {
this.swapItem = !this.swapItem;
this.saveLabels = this.swapItem === true ? true : false;
this.render();
},
saveUserDefinedLabels: function() {
var that = this;
var entityJson = that.entityModel.toJSON();
var payload = this.labels;
that.entityModel.saveEntityLabels(entityJson.guid ,{
data: JSON.stringify(payload),
type: 'POST',
success: function() {
var msg = entityJson.labels === undefined ? 'addSuccessMessage' : 'editSuccessMessage';
if (payload.length === 0) {
that.entityModel.unset('labels');
} else {
that.entityModel.set('labels', payload);
}
Utils.notifySuccess({
content: "User-defined labels " + Messages[msg]
});
that.swapItem = false;
that.saveLabels = false;
that.render();
},
error: function (e) {
that.ui.saveLabels && that.ui.saveLabels.length > 0 && that.ui.saveLabels[0].setAttribute("disabled", false);
Utils.notifySuccess({
content: e.message
});
},
complete: function () {
that.ui.saveLabels && that.ui.saveLabels.length > 0 && that.ui.saveLabels[0].setAttribute("disabled", false);
that.render();
}
});
}
});
});
dashboardv2/public/js/views/entity/EntityUserDefineView.js
...@@ -81,7 +81,7 @@ define(['require', ...@@ -81,7 +81,7 @@ define(['require',
okText: 'Save', okText: 'Save',
okCloses: false, okCloses: false,
cancelText: "Cancel", cancelText: "Cancel",
mainClass: 'modal-lg', mainClass: 'modal-md',
allowCancel: true, allowCancel: true,
}; };
this.setAttributeModal(modalObj); this.setAttributeModal(modalObj);
......
dashboardv3/public/css/scss/common.scss
...@@ -227,16 +227,18 @@ pre { ...@@ -227,16 +227,18 @@ pre {
.custom-col-0{ .custom-col-0{
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
line-height: 31px;
width: 2%; width: 2%;
} }
.custom-col-1{ .custom-col-1{
width: 43%; width: 40%;
} }
.custom-col-2{ .custom-col-2{
text-align: center; text-align: center;
width: 10%; width: 12%;
margin-left: 2%;
} }
} }
} }
...@@ -244,3 +246,10 @@ pre { ...@@ -244,3 +246,10 @@ pre {
.errorMsg { .errorMsg {
color: $red; color: $red;
} }
.badge-default {
background-color: $color_havelock_blue_approx;
color: $white;
font-size: 12px;
font-weight: normal;
}
dashboardv3/public/css/scss/panel.scss
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
.panel-title { .panel-title {
font-weight: bold; font-weight: bold;
padding-top: 8px; padding-top: 6px;
} }
} }
...@@ -117,19 +117,19 @@ ...@@ -117,19 +117,19 @@
} }
i.ec-icon:before { i.ec-icon:before {
content: "\f078" content: "\f054"
} }
&.collapsed, &.collapsed,
&[aria-expanded="false"] { &[aria-expanded="false"] {
i.ec-icon:before { i.ec-icon:before {
content: "\f078" content: "\f054"
} }
} }
&[aria-expanded="true"] { &[aria-expanded="true"] {
i.ec-icon:before { i.ec-icon:before {
content: "\f077" content: "\f078"
} }
} }
} }
...@@ -137,7 +137,7 @@ ...@@ -137,7 +137,7 @@
} }
.panel-default.custom-panel>.panel-heading { .panel-default.custom-panel>.panel-heading {
color: $black; color: $color_jungle_green_approx;
cursor: pointer; cursor: pointer;
border-bottom: none; border-bottom: none;
display: inline-block; display: inline-block;
...@@ -145,12 +145,12 @@ ...@@ -145,12 +145,12 @@
.panel-title { .panel-title {
font-weight: normal; font-weight: normal;
a:hover { a:hover {
color: $black; color: $color_jungle_green_approx;
opacity: 0.7; opacity: 0.7;
} }
} }
.btn-group { .btn-group {
margin-top: 3px; margin-top: 4px;
} }
} }
...@@ -167,5 +167,5 @@ ...@@ -167,5 +167,5 @@
border-top: none; border-top: none;
} }
.panel-default.custom-panel>.panel-heading > .btn-group > button { .panel-default.custom-panel>.panel-heading > .btn-group > button {
color: $black; color: $color_jungle_green_approx;
} }
dashboardv3/public/js/models/VEntity.js
...@@ -87,6 +87,14 @@ define(['require', ...@@ -87,6 +87,14 @@ define(['require',
dataType: 'json' dataType: 'json'
}, options); }, options);
return this.constructor.nonCrudOperation.call(this, url, "", options); return this.constructor.nonCrudOperation.call(this, url, "", options);
},
saveEntityLabels: function(guid, options) {
var url = UrlLinks.entityLabelsAPIUrl(guid);
options = _.extend({
contentType: 'application/json',
dataType: 'json'
}, options);
return this.constructor.nonCrudOperation.call(this, url, "POST", options);
} }
}, {}); }, {});
return VEntity; return VEntity;
......
dashboardv3/public/js/templates/detail_page/DetailPageLayoutView_tmpl.html
...@@ -78,6 +78,7 @@ ...@@ -78,6 +78,7 @@
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div id="r_entityUserDefineView"></div> <div id="r_entityUserDefineView"></div>
<div id="r_entityLabelDefineView"></div>
</div> </div>
</div> </div>
</div> </div>
......
dashboardv3/public/js/templates/entity/EntityLabelDefineView_tmpl.html 0 → 100644
<!--
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<div class="panel-group" id="accordion">
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefineLabel">
{{#ifCond labels.length "===" 0}}
<div class="panel-heading collapsed" data-toggle="collapse" href="#collapse3" aria-expanded="false" style="width: 70%">
<h4 class="panel-title">
<a>Labels </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
{{else}}
<div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true" style="width: 70%">
<h4 class="panel-title">
<a>Labels </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
{{/ifCond}}
{{#ifCond readOnlyEntity "===" false}}
<div class="panel-actions">
{{#ifCond swapItem "!==" true}}
<button class="btn btn-action btn-sm" data-id="addLabels" {{#ifCond labels.length "===" 0}} data-original-title="Add User-Defined Labels" {{else}} data-original-title="Edit User-Defined Labels" {{/ifCond}}>
{{#ifCond labels.length "===" 0}} Add {{else}} Edit {{/ifCond}}
</button>
{{/ifCond}}
{{#ifCond saveLabels "===" true}}
<button class="btn btn-action btn-sm" data-id="saveLabels" data-original-title="Save User-Defined Labels">Save</button>
{{/ifCond}}
</div>
{{/ifCond}}
<div id="collapse3" {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
{{#ifCond labels.length "===" 0}}
<div class="panel-body">
<div class="row">
<div class="col-md-12">
{{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}}
<div class="badge-container">
{{#each labels}}
<label class="label badge-default">{{this}}</label>
{{/each}}
</div>
{{/ifCond}}
</div>
</div>
</div>
{{/ifCond}}
</div>
{{#ifCond labels.length ">" 0}}
<div id="collapse3" class="panel-collapse collapse in" >
<div class="panel-body">
<div class="row">
<div class="col-md-12">
{{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}}
<div class="badge-container">
{{#each labels}}
<label class="label badge-default">{{this}}</label>
{{/each}}
</div>
{{/ifCond}}
</div>
</div>
</div>
</div>
{{/ifCond}}
</div>
</div>
dashboardv3/public/js/templates/site/Statistics_tmpl.html
...@@ -15,12 +15,12 @@ ...@@ -15,12 +15,12 @@
* limitations under the License. * limitations under the License.
--> -->
<div class="panel-group server-stats-container statsContainer hide" id="accordion"> <div class="panel-group server-stats-container statsContainer hide" id="accordion">
<div class="panel panel-default expand_collapse_panel-icon" data-id="entity"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="entity">
<div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true"> <div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Entities <span class="count">(0)</span></a> <a>Entities <span class="count">(0)</span></a>
</h4> </h4>
<div class="btn-group pull-right"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div> </div>
</div> </div>
...@@ -36,12 +36,12 @@ ...@@ -36,12 +36,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default expand_collapse_panel-icon" data-id="stats"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats">
<div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true"> <div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Server Statistics </a> <a>Server Statistics </a>
</h4> </h4>
<div class="btn-group pull-right"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div> </div>
</div> </div>
......
dashboardv3/public/js/utils/UrlLinks.js
...@@ -79,6 +79,9 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require ...@@ -79,6 +79,9 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require
return entitiesUrl += '?minExtInfo=' + (minExtInfo); return entitiesUrl += '?minExtInfo=' + (minExtInfo);
} }
}, },
entityLabelsAPIUrl: function(guid) {
return this.entitiesApiUrl({ guid: guid }) + "/labels";
},
entityHeaderApiUrl: function(guid) { entityHeaderApiUrl: function(guid) {
return this.entitiesApiUrl({ guid: guid }) + "/header" return this.entitiesApiUrl({ guid: guid }) + "/header"
}, },
......
dashboardv3/public/js/views/detail_page/DetailPageLayoutView.js
...@@ -47,6 +47,7 @@ define(['require', ...@@ -47,6 +47,7 @@ define(['require',
RProfileLayoutView: "#r_profileLayoutView", RProfileLayoutView: "#r_profileLayoutView",
RRelationshipLayoutView: "#r_relationshipLayoutView", RRelationshipLayoutView: "#r_relationshipLayoutView",
REntityUserDefineView: "#r_entityUserDefineView", REntityUserDefineView: "#r_entityUserDefineView",
REntityLabelDefineView: "#r_entityLabelDefineView"
}, },
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
...@@ -201,7 +202,7 @@ define(['require', ...@@ -201,7 +202,7 @@ define(['require',
if (collectionJSON.isIncomplete === true) { if (collectionJSON.isIncomplete === true) {
this.$(".isIncomplete").addClass("show"); this.$(".isIncomplete").addClass("show");
} }
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/><i class="fa fa-refresh fa-spin-custom"></i>').find("img").on('error', function() { this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/><i class="fa fa-hourglass-half"></i>').find("img").on('error', function() {
this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src }); this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src });
}); });
} else { } else {
...@@ -254,6 +255,7 @@ define(['require', ...@@ -254,6 +255,7 @@ define(['require',
} }
this.renderEntityDetailTableLayoutView(obj); this.renderEntityDetailTableLayoutView(obj);
this.renderEntityUserDefineView(obj); this.renderEntityUserDefineView(obj);
this.renderEntityLabelDefineView(obj);
this.renderRelationshipLayoutView(obj); this.renderRelationshipLayoutView(obj);
this.renderAuditTableLayoutView(obj); this.renderAuditTableLayoutView(obj);
this.renderTagTableLayoutView(obj); this.renderTagTableLayoutView(obj);
...@@ -507,6 +509,12 @@ define(['require', ...@@ -507,6 +509,12 @@ define(['require',
that.REntityUserDefineView.show(new EntityUserDefineView(obj)); that.REntityUserDefineView.show(new EntityUserDefineView(obj));
}); });
}, },
renderEntityLabelDefineView: function(obj) {
var that = this;
require(['views/entity/EntityLabelDefineView'], function(EntityLabelDefineView) {
that.REntityLabelDefineView.show(new EntityLabelDefineView(obj));
});
},
renderTagTableLayoutView: function(obj) { renderTagTableLayoutView: function(obj) {
var that = this; var that = this;
require(['views/tag/TagDetailTableLayoutView'], function(TagDetailTableLayoutView) { require(['views/tag/TagDetailTableLayoutView'], function(TagDetailTableLayoutView) {
......
dashboardv3/public/js/views/entity/EntityLabelDefineView.js 0 → 100644
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
define(['require',
'backbone',
'hbs!tmpl/entity/EntityLabelDefineView_tmpl',
'models/VEntity',
'utils/Utils',
'utils/Messages',
'utils/Enums'
], function(require, Backbone, EntityLabelDefineView_tmpl, VEntity, Utils, Messages, Enums) {
'use strict';
return Backbone.Marionette.LayoutView.extend({
_viewName: 'REntityLabelDefineView',
template: EntityLabelDefineView_tmpl,
templateHelpers: function() {
return {
swapItem: this.swapItem,
labels: this.labels,
saveLabels: this.saveLabels,
readOnlyEntity: this.readOnlyEntity
};
},
ui: {
addLabelOptions: "[data-id='addLabelOptions']",
addLabels: "[data-id='addLabels']",
saveLabels: "[data-id='saveLabels']"
},
events: function() {
var events = {};
events["change " + this.ui.addLabelOptions] = 'onChangeLabelChange';
events["click " + this.ui.addLabels] = 'handleBtnClick';
events["click " + this.ui.saveLabels] = 'saveUserDefinedLabels';
return events;
},
initialize: function(options) {
var self = this;
_.extend(this, _.pick(options, 'entity'));
this.swapItem = false, this.saveLabels = false;
this.readOnlyEntity = Enums.entityStateReadOnly[this.entity.status]
this.entityModel = new VEntity(this.entity);
this.labels = this.entity.labels || [];
},
onRender: function() {
this.populateLabelOptions();
},
bindEvents: function () {
},
populateLabelOptions: function() {
var that = this,
str = this.labels.map(function (label) {
return "<option selected > "+ label +" </option>";
});
this.ui.addLabelOptions.html(str);
this.ui.addLabelOptions.select2({
placeholder: "Select Label",
allowClear: true,
tags: true,
multiple: true
});
},
onChangeLabelChange: function () {
this.labels = this.ui.addLabelOptions.val();
},
handleBtnClick: function () {
this.swapItem = !this.swapItem;
this.saveLabels = this.swapItem === true ? true : false;
this.render();
},
saveUserDefinedLabels: function() {
var that = this;
var entityJson = that.entityModel.toJSON();
var payload = this.labels;
that.entityModel.saveEntityLabels(entityJson.guid ,{
data: JSON.stringify(payload),
type: 'POST',
success: function() {
var msg = entityJson.labels === undefined ? 'addSuccessMessage' : 'editSuccessMessage';
if (payload.length === 0) {
that.entityModel.unset('labels');
} else {
that.entityModel.set('labels', payload);
}
Utils.notifySuccess({
content: "User-defined labels " + Messages[msg]
});
that.swapItem = false;
that.saveLabels = false;
that.render();
},
error: function (e) {
that.ui.saveLabels && that.ui.saveLabels.length > 0 && that.ui.saveLabels[0].setAttribute("disabled", false);
Utils.notifySuccess({
content: e.message
});
},
complete: function () {
that.ui.saveLabels && that.ui.saveLabels.length > 0 && that.ui.saveLabels[0].setAttribute("disabled", false);
that.render();
}
});
}
});
});
dashboardv3/public/js/views/entity/EntityUserDefineView.js
...@@ -81,7 +81,7 @@ define(['require', ...@@ -81,7 +81,7 @@ define(['require',
okText: 'Save', okText: 'Save',
okCloses: false, okCloses: false,
cancelText: "Cancel", cancelText: "Cancel",
mainClass: 'modal-lg', mainClass: 'modal-md',
allowCancel: true, allowCancel: true,
}; };
this.setAttributeModal(modalObj); this.setAttributeModal(modalObj);
......
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