Skip to content

Commit

Permalink
LDBR-3.8: Чеклисты (#39)
Browse files Browse the repository at this point in the history
* LDBR-3.8: Работа SW только в DEBUG режиме

* LDBR-3.8: Добавить checklist actions, callback'и во вью, шаблон

* LDBR-3.8: Добавить обработчики в BoardStor

* LDBR-3.8: Добавить crud чеклистов

* LDBR-3.8: Реализовать работу чеклистов

* LDBR-3.8: Работа SW только в DEBUG режиме

* LDBR-3.8: Добавить checklist actions, callback'и во вью, шаблон

* LDBR-3.8: Добавить обработчики в BoardStor

* LDBR-3.8: Добавить crud чеклистов

* LDBR-3.8: Реализовать работу чеклистов

* LDBR-3.19: Удалить отладочную печать

* LDBR-3.19: Удалить еще отладочную печать

* LDBR-3.8: Исправить chlid в экшонах

* LDBR-3.8: Исправить еще один широкий объект

* LDBR-3.8: Исправить unresolved helper

* LDBR-3.8: Исправить баг когда после добавления нового чеклиста после переоткрытия попапа отображалась старая инфа

Co-authored-by: DPeshkoff <[email protected]>
  • Loading branch information
GeorgiyX and DPeshkoff authored Nov 25, 2021
1 parent 64f568c commit fe7ebe0
Show file tree
Hide file tree
Showing 13 changed files with 1,045 additions and 108 deletions.
146 changes: 146 additions & 0 deletions src/actions/checklist.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,146 @@
'use strict';

// Modules
import Dispatcher from '../modules/Dispatcher/Dispatcher.js';

/**
* Константа, содержащая в себе типы действий для checklist'ов и их элементов.
*/
export const CheckListActionTypes = {
CHECKLIST_CREATE: 'checklist/create',
CHECKLIST_EDIT: 'checklist/edit',
CHECKLIST_SAVE: 'checklist/save',
CHECKLIST_DELETE: 'checklist/delete',
CHECKLIST_ITEM_CREATE: 'checklist/item/create',
CHECKLIST_ITEM_EDIT: 'checklist/item/edit',
CHECKLIST_ITEM_SAVE: 'checklist/item/save',
CHECKLIST_ITEM_DELETE: 'checklist/item/delete',
CHECKLIST_ITEM_TOGGLE: 'checklist/item/toggle',
};

/**
* Объект, содержащий в себе действия в системе связанные с CheckList.
*/
export const checkListAction = {

/**
* Создает чеклист
*/
createCheckList() {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_CREATE,
});
},

/**
* Удаляет чеклист по его id
* @param {Number} chlid - id чеклиста
*/
deleteCheckList(chlid) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_DELETE,
data: {chlid},
});
},

/**
* Переключает заголовок чеклиста в режим редактирования
* @param {Number} chlid - id чеклиста
*/
editCheckList(chlid) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_EDIT,
data: {chlid},
});
},

/**
* Сохраняет новый заголовок чеклиста по его id
* @param {Number} chlid - id чеклиста
* @param {String} title - название чеклиста
*/
saveCheckList(chlid, title) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_SAVE,
data: {
chlid,
title,
},
});
},

/**
* Создает элемент чеклиста
* @param {Number} chlid - id чеклиста
*/
createCheckListItem(chlid) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_ITEM_CREATE,
data: {chlid},
});
},

/**
* Удаляет элемент чеклиста
* @param {Number} chlid - id чеклиста
* @param {Number} chliid - id элемента чеклиста
*/
deleteCheckListItem(chlid, chliid) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_ITEM_DELETE,
data: {
chlid,
chliid,
},
});
},

/**
* Переключает заголовок элемента чеклиста в режим редактирования
* @param {Number} chlid - id чеклиста
* @param {Number} chliid - id элемента чеклиста
*/
editCheckListItem(chlid, chliid) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_ITEM_EDIT,
data: {
chlid,
chliid,
},
});
},

/**
* Сохраняет новый заголовок элемента чеклиста
* @param {Number} chlid - id чеклиста
* @param {Number} chliid - id элемента чеклиста
* @param {String} text - название элемента чеклиста
*/
saveChekListItem(chlid, chliid, text) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_ITEM_SAVE,
data: {
chlid,
chliid,
text,
},
});
},

/**
* Сохраняет новый заголовок чеклиста по его id
* @param {Number} chlid - id чеклиста
* @param {Number} chliid - id элемента чеклиста
* @param {Boolean} status - статус чекбокса
*/
toggleChekListItem(chlid, chliid, status) {
Dispatcher.dispatch({
actionName: CheckListActionTypes.CHECKLIST_ITEM_TOGGLE,
data: {
chlid,
chliid,
status,
},
});
},
};
7 changes: 7 additions & 0 deletions src/constants/constants.js
Original file line number Diff line number Diff line change
Expand Up @@ -86,4 +86,11 @@ export const ConstantMessages = {
CardListTitleTooShort: 'Название списка карточек слишком короткое',
CardListTitleTooLong: 'Название списка карточек слишком длинное',
CardListErrorOnServer: 'Не удалось создать список, попробуйте позднее',

UnsuccessfulRequest: 'Неудачный запрос, попробуйте позднее :]',
};

export const CheckLists = {
CheckListDefaultTitle: 'Check List',
CheckListItemDefaultTitle: 'Item',
};
2 changes: 1 addition & 1 deletion src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import BoardView from './views/BoardView/BoardView.js';
import ProfileView from './views/ProfileView/ProfileView.js';
import {settingsActions} from './actions/settings';

if ('serviceWorker' in navigator) {
if ('serviceWorker' in navigator && !DEBUG) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js').then((registration) => {
console.log('SW registered with scope ', registration.scope);
Expand Down
86 changes: 86 additions & 0 deletions src/modules/Network/Network.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ class Network {
board: 'api/boards',
card: 'api/cards',
cardlist: 'api/cardLists',
checklists: 'api/checkLists',
checklistsItems: 'api/checkListItems',
};

this._defaultOptions = {
Expand Down Expand Up @@ -356,6 +358,90 @@ class Network {
`http://${this.BackendUrl}:${this.BackendPort}/${this._endpoints.sessions}`,
options);
}

/**
* Метод, реализующий запрос POST /api/checkLists.
* @param {object} data полезная нагрузка запроса
* @return {Promise<Response>} промис запроса
*/
async createCheckList(data) {
const options = {
method: 'post',
body: JSON.stringify(data),
};
return this.httpRequest(`http://${this.BackendUrl}:${this.BackendPort}` +
`/${this._endpoints.checklists}`, options);
}

/**
* Метод, реализующий запрос DELETE /api/checkLists/:chlid
* @param {Number} chlid - id чеклиста
* @return {Promise<Response>} промис запроса
*/
async deleteCheckList(chlid) {
const options = {
method: 'delete',
};
return this.httpRequest(`http://${this.BackendUrl}:${this.BackendPort}` +
`/${this._endpoints.checklists}/${chlid}`, options);
}

/**
* Метод, реализующий запрос PUT /api/checkLists/:chlid
* @param {object} data полезная нагрузка запроса
* @param {Number} chlid - id чеклиста
* @return {Promise<Response>} промис запроса
*/
async updateCheckList(data, chlid) {
const options = {
method: 'put',
body: JSON.stringify(data),
};
return this.httpRequest(`http://${this.BackendUrl}:${this.BackendPort}` +
`/${this._endpoints.checklists}/${chlid}`, options);
}

/**
* Метод, реализующий запрос POST /api/checkListItems.
* @param {object} data полезная нагрузка запроса
* @return {Promise<Response>} промис запроса
*/
async createCheckListItem(data) {
const options = {
method: 'post',
body: JSON.stringify(data),
};
return this.httpRequest(`http://${this.BackendUrl}:${this.BackendPort}` +
`/${this._endpoints.checklistsItems}`, options);
}

/**
* Метод, реализующий запрос PUT /api/checkListItems/:chliid
* @param {object} data полезная нагрузка запроса
* @param {Number} chliid - id элемента чеклиста
* @return {Promise<Response>} промис запроса
*/
async updateCheckListItem(data, chliid) {
const options = {
method: 'put',
body: JSON.stringify(data),
};
return this.httpRequest(`http://${this.BackendUrl}:${this.BackendPort}` +
`/${this._endpoints.checklistsItems}/${chliid}`, options);
}

/**
* Метод, реализующий запрос DELETE /api/checkListItems/:chliid
* @param {Number} chliid - id элемента чеклиста
* @return {Promise<Response>} промис запроса
*/
async deleteCheckListItem(chliid) {
const options = {
method: 'delete',
};
return this.httpRequest(`http://${this.BackendUrl}:${this.BackendPort}` +
`/${this._endpoints.checklistsItems}/${chliid}`, options);
}
}

export default new Network();
57 changes: 50 additions & 7 deletions src/popups/Card/CardPopUp.hbs
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{{#with card-popup}}
{{#if visible }}
<div class="popup-wrapper" id="cardPopUpWrapperId">
<div class="popup-content">
<form class="popup-form">
<div class="popup-content popup-content_width">
<form class="popup-form custom-scroll">
<div class="popup-form__header">
{{#if edit }}
Редактирование "{{card_name}}"
Expand All @@ -15,25 +15,27 @@
<div>
<label for="cardPopUpTitleId" class>Название карточки:</label>
<input class="simple-form-element" type="text" id="cardPopUpTitleId" name="card-name"
autofocus pattern="^[a-zA-Z\d]{1,40}$" autocomplete="off" required
autofocus pattern="^[a-zA-Z\d]{1,40}$" autocomplete="off" required
{{#if edit}} value="{{card_name}}" {{/if}}>
</div>
<div>
<label for="cardPopUpDescriptionId" class>Описание карточки:</label>
<input class="simple-form-element" type="text" id="cardPopUpDescriptionId" name="card-description"
autofocus pattern="^[a-zA-Z\d]{1,40}$" autocomplete="off" required
<input class="simple-form-element" type="text" id="cardPopUpDescriptionId"
name="card-description"
autofocus pattern="^[a-zA-Z\d]{1,40}$" autocomplete="off" required
{{#if edit}} value="{{description}}" {{/if}}>
</div>
<div>
<label for="cardPopUpDeadlineId" class>Дедлайн карточки:</label>
<input class="simple-form-element" type="datetime-local" id="cardPopUpDeadlineId" name="card-deadline"
min="1970-01-01T00:00" max="3000-12-31T23:59"
min="1970-01-01T00:00" max="3000-12-31T23:59"
pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}" required
{{#if edit}} value="{{deadline}}" {{/if}}>
</div>
{{#if edit}}
<label for="cardPopUpPositionId">Позиция:</label>
<select class="simple-form-element" id="cardPopUpPositionId" name="position-select" required>
<select class="simple-form-element" id="cardPopUpPositionId" name="position-select"
required>
{{#each positionRange}}
{{#if (IsEqualHelper this ../position) }}
<option value="{{this}}" selected>#{{this}}</option>
Expand All @@ -43,10 +45,51 @@
{{/each}}
</select>
{{/if}}
{{# if checkLists}}
<span class="check-list-separator">Чек листы</span>
{{/if}}
{{# each checkLists}}
<div class="check-list" data-id="{{this.chlid}}">
<div class="check-list__header-wrapper">
{{#if this.edit}}
<input class="simple-form-element check-list__input" type="text"
pattern="^[a-zA-Z\d]{1,40}$" autocomplete="off" required
value="{{this.title}}">
<div class="material-icon-save checklist-save"></div>
{{else}}
<div class="check-list__title">{{this.title}}</div>
<div class="material-icon-edit checklist-edit"></div>
{{/if}}
<div class="material-icon-add checklist-add"></div>
<div class="material-icon-delete checklist-delete"></div>
</div>
<div class="check-list__items-wrapper">
{{#each this.check_list_items }}
<div class="checklist-item" data-id="{{this.chliid}}">
<label class="checklist-item__label">
<input type="checkbox" {{#if this.status}}checked{{/if}}>
{{#if this.edit}}
</label>
<input class="simple-form-element checklist-item__input" type="text"
pattern="^[a-zA-Z\d]{1,40}$" autocomplete="off" required
value="{{this.text}}">
<div class="material-icon-save checklist-item-save"></div>
{{else}}
<div class="checklist-item__title">{{this.text}}</div>
</label>
<div class="material-icon-edit checklist-item-edit"></div>
{{/if}}
<div class="material-icon-delete checklist-item-delete"></div>
</div>
{{/each}}
</div>
</div>
{{/each}}
{{#if errors}}
<div class="error">{{errors}}</div>
{{/if}}
{{# if edit }}
<button class="button" id="cardPopUpAddCheckListBtnId">Новый чек-лист</button>
<button class="button" id="cardPopUpSaveBtnId">Сохранить</button>
{{ else }}
<button class="button" id="cardPopUpCreateBtnId">Создать</button>
Expand Down
Loading

0 comments on commit fe7ebe0

Please sign in to comment.