account - contact 2

This commit is contained in:
Yuri Kuznetsov
2014-07-04 14:55:02 +03:00
parent 6bd7d2398d
commit a3ad210ec2
6 changed files with 193 additions and 41 deletions
@@ -108,7 +108,8 @@
"Original": "Original",
"You": "You",
"you": "you",
"change": "change"
"change": "change",
"Primary": "Primary"
},
"messages": {
"notModified": "You have not modified the record",
+1 -1
View File
File diff suppressed because one or more lines are too long
@@ -24,6 +24,123 @@ Espo.define('Crm:Views.Contact.Fields.Accounts', 'Views.Fields.LinkMultipleWithR
return Dep.extend({
roleType: 'varchar',
events: {
'click [data-action="switchPrimary"]': function (e) {
$target = $(e.currentTarget);
var id = $target.data('id');
if (!$target.hasClass('active')) {
this.$el.find('button[data-action="switchPrimary"]').removeClass('active').children().addClass('text-muted');
$target.addClass('active').children().removeClass('text-muted');
this.setPrimaryId(id);
}
}
},
getAttributeList: function () {
var list = Dep.prototype.getAttributeList.call(this);
list.push('accountId');
list.push('accountName');
list.push('title');
return list;
},
setup: function () {
Dep.prototype.setup.call(this);
this.primaryIdFieldName = 'accountId';
this.primaryNameFieldName = 'accountName';
this.primaryRoleFieldName = 'title';
this.primaryId = this.model.get(this.primaryIdFieldName);
this.primaryName = this.model.get(this.primaryNameFieldName);
this.listenTo(this.model, 'change:' + this.primaryIdFieldName, function () {
this.primaryId = this.model.get(this.primaryIdFieldName);
this.primaryName = this.model.get(this.primaryNameFieldName);
}.bind(this));
},
setPrimaryId: function (id) {
this.primaryId = id;
this.primaryName = this.nameHash[id];
this.trigger('change');
},
renderLinks: function () {
if (this.primaryId) {
this.addLinkHtml(this.primaryId, this.primaryName);
}
this.ids.forEach(function (id) {
if (id != this.primaryId) {
this.addLinkHtml(id, this.nameHash[id]);
}
}, this);
},
getValueForDisplay: function () {
var names = [];
if (this.primaryId) {
names.push(this.getDetailLinkHtml(this.primaryId, this.primaryName));
}
this.ids.forEach(function (id) {
if (id != this.primaryId) {
names.push(this.getDetailLinkHtml(id));
}
}, this);
return names.join('');
},
deleteLinkHtml: function (id) {
Dep.prototype.deleteLinkHtml.call(this, id);
this.managePrimaryButton();
},
addLinkHtml: function (id, name) {
$el = Dep.prototype.addLinkHtml.call(this, id, name);
var isPrimary = (id == this.primaryId);
var iconHtml = '<span class="glyphicon glyphicon-star ' + (!isPrimary ? 'text-muted' : '') + '"></span>';
var title = this.translate('Primary');
var $primary = $('<button type="button" class="btn btn-link btn-sm pull-right hidden" title="'+title+'" data-action="switchPrimary" data-id="'+id+'">'+iconHtml+'</button>');
$el.children().first().prepend($primary);
this.managePrimaryButton();
},
afterRender: function () {
Dep.prototype.afterRender.call(this);
},
managePrimaryButton: function () {
var $primary = this.$el.find('button[data-action="switchPrimary"]');
if ($primary.size() > 1) {
$primary.removeClass('hidden');
} else {
$primary.addClass('hidden');
}
if ($primary.filter('.active').size() == 0) {
var $first = $primary.first();
if ($first.size()) {
$first.addClass('active').children().removeClass('text-muted');
this.setPrimaryId($first.data('id'));
}
}
},
fetch: function () {
var data = Dep.prototype.fetch.call(this);
data[this.primaryIdFieldName] = this.primaryId;
data[this.primaryNameFieldName] = this.primaryName;
data[this.primaryRoleFieldName] = (this.columns[this.primaryId] || {}).role || '';
return data;
},
});
@@ -28,14 +28,14 @@ Espo.define('Views.Fields.LinkMultipleWithRole', 'Views.Fields.LinkMultiple', fu
roleType: 'enum',
setup: function () {
Dep.prototype.setup.call(this);
Dep.prototype.setup.call(this);
this.columnsName = this.name + 'Columns';
this.columns = Espo.Utils.cloneDeep(this.model.get(this.columnsName) || {});
this.listenTo(this.model, 'change:' + this.columnsName, function () {
this.columns = Espo.Utils.cloneDeep(this.model.get(this.columnsName) || {});
}.bind(this));
}, this);
this.roleField = this.getMetadata().get('entityDefs.' + this.model.name + '.fields.' + this.name + '.columns.role');
@@ -50,24 +50,30 @@ Espo.define('Views.Fields.LinkMultipleWithRole', 'Views.Fields.LinkMultiple', fu
return list;
},
getValueForDisplay: function () {
var nameHash = this.nameHash;
var string = '';
var names = [];
getDetailLinkHtml: function (id, name) {
name = name || this.nameHash[id];
for (var id in nameHash) {
var role = (this.columns[id] || {}).role || '';
var roleHtml = '';
if (role != '') {
roleHtml = '<span class="text-muted small"> &#187; ' + this.getLanguage().translateOption(role, this.roleField, this.foreignScope) + '</span>';
}
names.push('<a href="#' + this.foreignScope + '/view/' + id + '">' + nameHash[id] + '</a> ' + roleHtml);
var role = (this.columns[id] || {}).role || '';
var roleHtml = '';
if (role != '') {
roleHtml = '<span class="text-muted small"> &#187; ' + this.getLanguage().translateOption(role, this.roleField, this.foreignScope) + '</span>';
}
return '<div>' + names.join('</div><div>') + '</div>';
var lineHtml = '<div>' + '<a href="#' + this.foreignScope + '/view/' + id + '">' + name + '</a> ' + roleHtml + '</div>';
return lineHtml;
},
getValueForDisplay: function () {
var names = [];
this.ids.forEach(function (id) {
var lineHtml = this.getDetailLinkHtml(id);
names.push(lineHtml);
}, this);
return names.join('');
},
deleteLink: function (id) {
this.$el.find('.link-' + id).remove();
this.deleteLinkHtml(id);
var index = this.ids.indexOf(id);
if (index > -1) {
@@ -92,11 +98,11 @@ Espo.define('Views.Fields.LinkMultipleWithRole', 'Views.Fields.LinkMultiple', fu
Dep.prototype.afterRender.call(this);
},
addLinkHtml: function (id, name) {
addLinkHtml: function (id, name) {
var $conteiner = this.$el.find('.link-container');
var $el = $('<div class="form-inline">').addClass('link-' + id).addClass('list-group-item');
var $el = $('<div class="form-inline list-group-item link-with-role">').addClass('link-' + id);
var nameHtml = '<span>' + name + '&nbsp;' + '</div>';
var nameHtml = '<div>' + name + '&nbsp;' + '</div>';
var removeHtml = '<a href="javascript:" class="pull-right" data-id="' + id + '" data-action="clearLink"><span class="glyphicon glyphicon-remove"></a>';
@@ -116,7 +122,7 @@ Espo.define('Views.Fields.LinkMultipleWithRole', 'Views.Fields.LinkMultiple', fu
$role = $('<input class="role form-control input-sm" maxlength="50" placeholder="'+label+'" data-id="'+id+'" value="' + (roleValue || '') + '">');
}
$contentContainer = $('<div class="">').css({
$contentContainer = $('<div class="pull-left">').css({
'width': '50%',
'display': 'inline-block'
});
@@ -125,7 +131,7 @@ Espo.define('Views.Fields.LinkMultipleWithRole', 'Views.Fields.LinkMultiple', fu
$el.append($contentContainer);
$right = $('<div class="">').css({
$right = $('<div>').css({
'width': '50%',
'display': 'inline-block',
'vertical-align': 'top'
@@ -150,7 +156,7 @@ Espo.define('Views.Fields.LinkMultipleWithRole', 'Views.Fields.LinkMultiple', fu
this.trigger('change');
}.bind(this));
}
return $el;
},
fetch: function () {
@@ -140,22 +140,27 @@ Espo.define('Views.Fields.LinkMultiple', 'Views.Fields.Base', function (Dep) {
$element.autocomplete('dispose');
}, this);
this.ids.forEach(function (id) {
this.addLinkHtml(id, this.nameHash[id]);
}, this);
this.renderLinks();
}
},
renderLinks: function () {
this.ids.forEach(function (id) {
this.addLinkHtml(id, this.nameHash[id]);
}, this);
},
deleteLink: function (id) {
this.$el.find('.link-' + id).remove();
deleteLink: function (id) {
this.deleteLinkHtml(id);
var index = this.ids.indexOf(id);
if (index > -1) {
this.ids.splice(index, 1);
}
delete this.nameHash[id];
this.trigger('change');
this.trigger('change');
},
addLink: function (id, name) {
@@ -167,21 +172,29 @@ Espo.define('Views.Fields.LinkMultiple', 'Views.Fields.Base', function (Dep) {
this.trigger('change');
},
deleteLinkHtml: function (id) {
this.$el.find('.link-' + id).remove();
},
addLinkHtml: function (id, name) {
var conteiner = this.$el.find('.link-container');
var el = $('<div />').addClass('link-' + id).addClass('list-group-item');
el.html(name + '&nbsp');
el.append('<a href="javascript:" class="pull-right" data-id="' + id + '" data-action="clearLink"><span class="glyphicon glyphicon-remove"></a>');
conteiner.append(el);
var $el = $('<div />').addClass('link-' + id).addClass('list-group-item');
$el.html(name + '&nbsp');
$el.append('<a href="javascript:" class="pull-right" data-id="' + id + '" data-action="clearLink"><span class="glyphicon glyphicon-remove"></a>');
conteiner.append($el);
return $el;
},
getDetailLinkHtml: function (id) {
return '<a href="#' + this.foreignScope + '/view/' + id + '">' + this.nameHash[id] + '</a>';
},
getValueForDisplay: function () {
var nameHash = this.nameHash;
var string = '';
var names = [];
for (var id in nameHash) {
names.push('<a href="#' + this.foreignScope + '/view/' + id + '">' + nameHash[id] + '</a>');
}
this.ids.forEach(function (id) {
names.push(this.getDetailLinkHtml(id));
}, this);
return names.join(', ');
},
+17 -2
View File
@@ -196,10 +196,25 @@ ul.dropdown-menu > li.checkbox {
margin-bottom: 0px;
}
.field .link-container .list-group-item .form-control.input-sm {
margin: -4px 10px -4px 5px;
.field .link-container .list-group-item > div {
margin: -6px 0;
}
.field .link-container .list-group-item > div > div {
margin: 6px 0;
}
.field .link-container .list-group-item .form-control,
.field .link-container .list-group-item .btn {
margin-bottom: 0px;
}
.field .link-container .list-group-item a {
margin-top: 6px
}
@media screen and (min-width: 768px) {
.modal-dialog {
width: 740px !important;