diff options
author | Lauri Ojansivu <x@xet7.org> | 2018-05-18 16:22:53 +0300 |
---|---|---|
committer | Lauri Ojansivu <x@xet7.org> | 2018-05-18 16:22:53 +0300 |
commit | 50f751e0a9f8214d690f6fd39136d09a46a8e69a (patch) | |
tree | 3a0e58883030abbfa8eb454d181356a8be299d79 /client/components/sidebar | |
parent | 61b240d126bcce7adcdb303c5b01a202dc7fa395 (diff) | |
parent | 1984a6b1c80dbd8b4eff89aa92913f943bacc63b (diff) | |
download | wekan-50f751e0a9f8214d690f6fd39136d09a46a8e69a.tar.gz wekan-50f751e0a9f8214d690f6fd39136d09a46a8e69a.tar.bz2 wekan-50f751e0a9f8214d690f6fd39136d09a46a8e69a.zip |
Merge branch 'devel' into greenkeeper/initial
Diffstat (limited to 'client/components/sidebar')
-rw-r--r-- | client/components/sidebar/sidebar.js | 1 | ||||
-rw-r--r-- | client/components/sidebar/sidebar.styl | 61 | ||||
-rw-r--r-- | client/components/sidebar/sidebarCustomFields.jade | 52 | ||||
-rw-r--r-- | client/components/sidebar/sidebarCustomFields.js | 131 |
4 files changed, 223 insertions, 22 deletions
diff --git a/client/components/sidebar/sidebar.js b/client/components/sidebar/sidebar.js index bff96dcb..5a9de74b 100644 --- a/client/components/sidebar/sidebar.js +++ b/client/components/sidebar/sidebar.js @@ -6,6 +6,7 @@ const viewTitles = { filter: 'filter-cards', search: 'search-cards', multiselection: 'multi-selection', + customFields: 'custom-fields', archives: 'archives', }; diff --git a/client/components/sidebar/sidebar.styl b/client/components/sidebar/sidebar.styl index 8f2f493e..740186b5 100644 --- a/client/components/sidebar/sidebar.styl +++ b/client/components/sidebar/sidebar.styl @@ -45,28 +45,45 @@ display: flex flex-direction: column - li > a - display: flex - height: 30px - margin: 0 - padding: 4px - border-radius: 3px - align-items: center - - &:hover - &, i, .quiet - color white - - .member, .card-label - margin-right: 7px - margin-top: 5px - - .sidebar-list-item-description - flex: 1 - overflow: ellipsis - - .fa.fa-check - margin: 0 4px + li + & > a + display: flex + height: 30px + margin: 0 + padding: 4px + border-radius: 3px + align-items: center + + &:hover + &, i, .quiet + color white + + .member, .card-label + margin-right: 7px + margin-top: 5px + + .minicard-edit-button + float: right + padding: 8px + border-radius: 3px + + .sidebar-list-item-description + flex: 1 + overflow: ellipsis + + .fa.fa-check + margin: 0 4px + + .minicard + padding: 6px 8px 4px + + .minicard-edit-button + float: right + padding: 4px + border-radius: 3px + + &:hover + background: #dbdbdb .sidebar-btn display: block diff --git a/client/components/sidebar/sidebarCustomFields.jade b/client/components/sidebar/sidebarCustomFields.jade new file mode 100644 index 00000000..def083e9 --- /dev/null +++ b/client/components/sidebar/sidebarCustomFields.jade @@ -0,0 +1,52 @@ +template(name="customFieldsSidebar") + ul.sidebar-list + each customFields + li + div.minicard-wrapper.js-minicard + div.minicard + a.fa.fa-pencil.js-edit-custom-field.minicard-edit-button + div.minicard-title + | {{ name }} ({{ type }}) + + if currentUser.isBoardMember + hr + a.sidebar-btn.js-open-create-custom-field + i.fa.fa-plus + span {{_ 'createCustomField'}} + +template(name="createCustomFieldPopup") + form + label + | {{_ 'name'}} + unless _id + input.js-field-name(type="text" autofocus) + else + input.js-field-name(type="text" value=name) + + label + | {{_ 'type'}} + select.js-field-type(disabled="{{#if _id}}disabled{{/if}}") + each types + if selected + option(value=value selected="selected") {{name}} + else + 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="button") + | {{_ 'save'}} + if _id + button.negate.wide.right.js-delete-custom-field(type="button") + | {{_ 'delete'}} + +template(name="deleteCustomFieldPopup") + p {{_ "custom-field-delete-pop"}} + button.js-confirm.negate.full(type="submit") {{_ 'delete'}}
\ No newline at end of file diff --git a/client/components/sidebar/sidebarCustomFields.js b/client/components/sidebar/sidebarCustomFields.js new file mode 100644 index 00000000..e56d744e --- /dev/null +++ b/client/components/sidebar/sidebarCustomFields.js @@ -0,0 +1,131 @@ +BlazeComponent.extendComponent({ + + customFields() { + return CustomFields.find({ + boardId: Session.get('currentBoard'), + }); + }, + + events() { + return [{ + 'click .js-open-create-custom-field': Popup.open('createCustomField'), + 'click .js-edit-custom-field': Popup.open('editCustomField'), + }]; + }, + +}).register('customFieldsSidebar'); + +const CreateCustomFieldPopup = BlazeComponent.extendComponent({ + + _types: ['text', 'number', '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() { + const currentType = this.data().type; + return this._types. + map((type) => {return { + value: type, + name: TAPi18n.__(`custom-field-${type}`), + selected: type === currentType, + };}); + }, + + isTypeNotSelected(type) { + return this.type.get() !== type; + }, + + getDropdownItems() { + const 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(); + }); + return items; + }, + + getSettings() { + const settings = {}; + switch (this.type.get()) { + case 'dropdown': { + const 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) { + const 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) { + const customFieldId = this._id; + CustomFields.remove(customFieldId); + Popup.close(); + } +});*/ |