Andreas/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2026-03-07 22:22:33 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

dropdown items

Browse source
This commit is contained in:
Pouyan Savoli 2017-09-18 00:46:17 +02:00
parent caad952bc1
commit 3753337d60
10 changed files with 211 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/components/sidebar/sidebar.js
View file

@ -5,7 +5,7 @@ const defaultView = 'home';
const viewTitles = {
filter: 'filter-cards',
multiselection: 'multi-selection',
customFields: 'configure-custom-fields',
customFields: 'custom-fields',
archives: 'archives',
};

23
client/components/sidebar/sidebarCustomFields.jade
View file

@ -19,31 +19,34 @@ template(name="createCustomFieldPopup")
label
| {{_ 'name'}}
unless _id
input.js-field-name(type="text" name="field-name" autofocus)
input.js-field-name(type="text" autofocus)
else
input.js-field-name(type="text" name="field-name" value=name)
input.js-field-name(type="text" value=name)
label
| {{_ 'type'}}
select.js-field-type(name="field-type" disabled="{{#if _id}}disabled{{/if}}")
select.js-field-type(disabled="{{#if _id}}disabled{{/if}}")
each types
if selected
option(value=type selected="selected") {{name}}
option(value=value selected="selected") {{name}}
else
option(value=type) {{name}}
option(value=value) {{name}}
div.js-field-settings.js-field-settings-dropdown(class="{{#if isTypeNotSelected 'dropdown'}}hide{{/if}}")
label
| {{_ 'custom-field-dropdown-options'}}
each dropdownItems.get
input.js-dropdown-item(type="text" value=name placeholder="")
input.js-dropdown-item.last(type="text" value="" placeholder="{{_ 'custom-field-dropdown-options-placeholder'}}")
a.flex.js-field-show-on-card
.materialCheckBox(class="{{#if showOnCard}}is-checked{{/if}}")
span {{_ 'show-field-on-card'}}
button.primary.wide.left(type="submit")
button.primary.wide.left(type="button")
| {{_ 'save'}}
if _id
button.negate.wide.right.js-delete-custom-field
button.negate.wide.right.js-delete-custom-field(type="button")
| {{_ 'delete'}}
template(name="editCustomFieldPopup")
| {{> createCustomFieldPopup}}
template(name="deleteCustomFieldPopup")
p {{_ "custom-field-delete-pop"}}
button.js-confirm.negate.full(type="submit") {{_ 'delete'}}

133
client/components/sidebar/sidebarCustomFields.js
View file

@ -15,50 +15,111 @@ BlazeComponent.extendComponent({
}).register('customFieldsSidebar');
Template.createCustomFieldPopup.helpers({
const CreateCustomFieldPopup = BlazeComponent.extendComponent({
_types: ['text', 'number', 'checkbox', 'date', 'dropdown'],
onCreated() {
this.type = new ReactiveVar((this.data().type) ? this.data().type : this._types[0]);
this.dropdownItems = new ReactiveVar((this.data().settings && this.data().settings.dropdownItems) ? this.data().settings.dropdownItems : []);
},
types() {
var currentType = this.type;
return ['text', 'number', 'checkbox', 'date', 'dropdown'].
map(type => {return {
type: type,
name: TAPi18n.__('custom-field-' + type),
selected: type == currentType,
}});
const currentType = this.data().type;
return this._types.
map(type => {return {
value: type,
name: TAPi18n.__('custom-field-' + type),
selected: type == currentType,
}});
},
});
Template.createCustomFieldPopup.events({
'click .js-field-show-on-card'(event) {
let $target = $(event.target);
if(!$target.hasClass('js-field-show-on-card')){
$target = $target.parent();
}
$target.find('.materialCheckBox').toggleClass('is-checked');
$target.toggleClass('is-checked');
isTypeNotSelected(type) {
return this.type.get() !== type;
},
'submit'(evt, tpl) {
evt.preventDefault();
const name = tpl.find('.js-field-name').value.trim();
const type = tpl.find('.js-field-type').value.trim();
const showOnCard = tpl.find('.js-field-show-on-card.is-checked') != null;
//console.log('Create',name,type,showOnCard);
CustomFields.insert({
boardId: Session.get('currentBoard'),
name: name,
type: type,
showOnCard: showOnCard
getDropdownItems() {
var items = this.dropdownItems.get();
Array.from(this.findAll('.js-field-settings-dropdown input')).forEach((el, index) => {
//console.log('each item!', index, el.value);
if (!items[index]) items[index] = {
_id: Random.id(6),
};
items[index].name = el.value.trim();
});
Popup.back();
return items;
},
'click .js-delete-custom-field': Popup.afterConfirm('deleteCustomField', function() {
const customFieldId = this._id;
CustomFields.remove(customFieldId);
Popup.close();
}),
getSettings() {
let settings = {};
switch (this.type.get()) {
case 'dropdown':
let dropdownItems = this.getDropdownItems().filter(item => !!item.name.trim());
settings.dropdownItems = dropdownItems;
break;
}
return settings;
},
events() {
return [{
'change .js-field-type'(evt) {
const value = evt.target.value;
this.type.set(value);
},
'keydown .js-dropdown-item.last'(evt) {
if (evt.target.value.trim() && evt.keyCode === 13) {
let items = this.getDropdownItems();
this.dropdownItems.set(items);
evt.target.value = '';
}
},
'click .js-field-show-on-card'(evt) {
let $target = $(evt.target);
if(!$target.hasClass('js-field-show-on-card')){
$target = $target.parent();
}
$target.find('.materialCheckBox').toggleClass('is-checked');
$target.toggleClass('is-checked');
},
'click .primary'(evt) {
evt.preventDefault();
const data = {
boardId: Session.get('currentBoard'),
name: this.find('.js-field-name').value.trim(),
type: this.type.get(),
settings: this.getSettings(),
showOnCard: this.find('.js-field-show-on-card.is-checked') != null
}
// insert or update
if (!this.data()._id) {
CustomFields.insert(data);
} else {
CustomFields.update(this.data()._id, {$set: data});
}
Popup.back();
},
'click .js-delete-custom-field': Popup.afterConfirm('deleteCustomField', function() {
const customFieldId = this._id;
CustomFields.remove(customFieldId);
Popup.close();
}),
}];
},
});
CreateCustomFieldPopup.register('createCustomFieldPopup');
(class extends CreateCustomFieldPopup {
template() {
return 'createCustomFieldPopup';
}
}).register('editCustomFieldPopup');
/*Template.deleteCustomFieldPopup.events({
'submit'(evt) {