codeninjasllc/discourse
1
0
Fork 0
mirror of https://github.com/codeninjasllc/discourse.git synced 2024-11-23 23:58:31 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

FIX: Reformat user fields admin to have a longer form

Browse source
This commit is contained in:
Robin Ward 2015-07-27 14:22:12 -04:00
parent d6069e8c90
commit f22618050f
7 changed files with 73 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/assets/javascripts/admin/components/admin-form-row.js.es6 Normal file
View file

@ -0,0 +1,3 @@
export default Ember.Component.extend({
classNames: ['row']
});

12
app/assets/javascripts/admin/components/admin-user-field-item.js.es6
View file

@ -6,6 +6,10 @@ export default Ember.Component.extend(bufferedProperty('userField'), {
editing: Ember.computed.empty('userField.id'),
classNameBindings: [':user-field'],
userFieldsDescription: function() {
return I18n.t('admin.user_fields.description');
}.property(),
_focusOnEdit: function() {
if (this.get('editing')) {
Ember.run.scheduleOnce('afterRender', this, '_focusName');
@ -36,7 +40,7 @@ export default Ember.Component.extend(bufferedProperty('userField'), {
}.property('userField.editable', 'userField.required', 'userField.show_on_profile'),
actions: {
save: function() {
save() {
const self = this;
const attrs = this.get('buffered').getProperties('name', 'description', 'field_type', 'editable', 'required', 'show_on_profile');
@ -47,15 +51,15 @@ export default Ember.Component.extend(bufferedProperty('userField'), {
}).catch(popupAjaxError);
},
edit: function() {
edit() {
this.set('editing', true);
},
destroy: function() {
destroy() {
this.sendAction('destroyAction', this.get('userField'));
},
cancel: function() {
cancel() {
const id = this.get('userField.id');
if (Ember.isEmpty(id)) {
this.sendAction('destroyAction', this.get('userField'));

18
app/assets/javascripts/admin/controllers/admin-user-fields.js.es6
View file

@ -4,28 +4,20 @@ export default Ember.ArrayController.extend({
fieldTypes: null,
createDisabled: Em.computed.gte('model.length', 20),
userFieldsDescription: function() {
return I18n.t('admin.user_fields.description');
}.property(),
userFieldsName: function() {
return I18n.t('admin.user_fields.name');
}.property(),
_performDestroy: function(f, model) {
_performDestroy(f, model) {
return f.destroy().then(function() {
model.removeObject(f);
});
},
actions: {
createField: function() {
createField() {
this.pushObject(UserField.create({ field_type: 'text' }));
},
destroy: function(f) {
var model = this.get('model'),
self = this;
destroy(f) {
const model = this.get('model'),
self = this;
// Only confirm if we already been saved
if (f.get('id')) {

14
app/assets/javascripts/admin/templates/components/admin-form-row.hbs Normal file
View file

@ -0,0 +1,14 @@
<div class='form-element-desc'>
{{#if label}}
<label>{{i18n label}}</label>
{{else}}
&nbsp;
{{/if}}
</div>
<div class='form-element'>
{{#if wrapLabel}}
<label>{{yield}}</label>
{{else}}
{{yield}}
{{/if}}
</div>

60
app/assets/javascripts/admin/templates/components/admin-user-field-item.hbs
View file

@ -1,36 +1,32 @@
{{#if editing}}
<div class='row'>
<div class='form-element'>
{{input value=buffered.name class="user-field-name" placeholder=userFieldsName}}
</div>
<div class='form-element'>
{{input value=buffered.description class="user-field-desc" placeholder=userFieldsDescription}}
</div>
<div class='form-element'>
{{combo-box content=fieldTypes valueAttribute="id" value=buffered.field_type}}
</div>
<div class='form-element controls'>
{{d-button action="save" class="btn-primary" icon="check" label="admin.user_fields.save"}}
{{d-button action="cancel" class="btn-danger" icon="times" label="admin.user_fields.cancel"}}
</div>
</div>
<div class="row">
<div class='form-element'>
<label>
{{input type="checkbox" checked=buffered.editable}} {{i18n 'admin.user_fields.editable.title'}}
</label>
</div>
<div class='form-element'>
<label>
{{input type="checkbox" checked=buffered.required}} {{i18n 'admin.user_fields.required.title'}}
</label>
</div>
<div class='form-element'>
<label>
{{input type="checkbox" checked=buffered.show_on_profile}} {{i18n 'admin.user_fields.show_on_profile.title'}}
</label>
</div>
</div>
{{#admin-form-row label="admin.user_fields.type"}}
{{combo-box content=fieldTypes valueAttribute="id" value=buffered.field_type}}
{{/admin-form-row}}
{{#admin-form-row label="admin.user_fields.name"}}
{{input value=buffered.name class="user-field-name"}}
{{/admin-form-row}}
{{#admin-form-row label="admin.user_fields.description"}}
{{input value=buffered.description class="user-field-desc"}}
{{/admin-form-row}}
{{#admin-form-row wrapLabel="true"}}
{{input type="checkbox" checked=buffered.editable}} {{i18n 'admin.user_fields.editable.title'}}
{{/admin-form-row}}
{{#admin-form-row wrapLabel="true"}}
{{input type="checkbox" checked=buffered.required}} {{i18n 'admin.user_fields.required.title'}}
{{/admin-form-row}}
{{#admin-form-row wrapLabel="true"}}
{{input type="checkbox" checked=buffered.show_on_profile}} {{i18n 'admin.user_fields.show_on_profile.title'}}
{{/admin-form-row}}
{{#admin-form-row}}
{{d-button action="save" class="btn-primary" icon="check" label="admin.user_fields.save"}}
{{d-button action="cancel" class="btn-danger" icon="times" label="admin.user_fields.cancel"}}
{{/admin-form-row}}
{{else}}
<div class="row">
<div class='form-display'><strong>{{userField.name}}</strong></div>

10
app/assets/javascripts/admin/templates/user-fields.hbs
View file

@ -9,8 +9,10 @@
{{/each}}
{{/if}}
<button {{bind-attr disabled="createDisabled"}} class='btn btn-primary' {{action "createField"}}>
{{fa-icon "plus"}}
{{i18n 'admin.user_fields.create'}}
</button>
{{d-button disabled=createDisabled
class="btn-primary"
action="createField"
label="admin.user_fields.create"
icon="plus"}}
</div>

10
app/assets/stylesheets/common/admin/admin_base.scss
View file

@ -1435,9 +1435,17 @@ tr.not-activated {
float: left;
}
.form-element {
.form-element, .form-element-desc {
float: left;
width: 25%;
height: 30px;
padding: 0.25em 0;
}
.form-element-desc label {
margin: 0.5em 1em 0 0;
text-align: right;
font-weight: bold;
}
.controls {