debian-mirror-gitlab/app/assets/javascripts/task_list.js

114 lines
3.2 KiB
JavaScript
Raw Normal View History

2018-05-09 12:01:36 +05:30
import $ from 'jquery';
2017-09-10 17:25:29 +05:30
import 'deckar01-task_list';
2019-03-02 22:35:43 +05:30
import { __ } from '~/locale';
2020-10-24 23:57:45 +05:30
import { deprecatedCreateFlash as Flash } from './flash';
2021-03-11 19:13:27 +05:30
import axios from './lib/utils/axios_utils';
2017-09-10 17:25:29 +05:30
export default class TaskList {
2017-08-17 22:00:37 +05:30
constructor(options = {}) {
this.selector = options.selector;
this.dataType = options.dataType;
this.fieldName = options.fieldName;
2019-03-02 22:35:43 +05:30
this.lockVersion = options.lockVersion;
this.taskListContainerSelector = `${this.selector} .js-task-list-container`;
this.updateHandler = this.update.bind(this);
2017-08-17 22:00:37 +05:30
this.onSuccess = options.onSuccess || (() => {});
2019-03-02 22:35:43 +05:30
this.onError =
options.onError ||
function showFlash(e) {
let errorMessages = '';
2017-08-17 22:00:37 +05:30
2019-03-02 22:35:43 +05:30
if (e.response.data && typeof e.response.data === 'object') {
errorMessages = e.response.data.errors.join(' ');
}
2017-08-17 22:00:37 +05:30
2019-03-02 22:35:43 +05:30
return new Flash(errorMessages || __('Update failed'), 'alert');
};
2017-08-17 22:00:37 +05:30
this.init();
}
init() {
2019-03-02 22:35:43 +05:30
this.disable(); // Prevent duplicate event bindings
2021-01-03 14:25:43 +05:30
const taskListFields = document.querySelectorAll(
`${this.taskListContainerSelector} .js-task-list-field[data-value]`,
);
2021-03-08 18:12:59 +05:30
taskListFields.forEach((taskListField) => {
2021-01-03 14:25:43 +05:30
// eslint-disable-next-line no-param-reassign
taskListField.value = taskListField.dataset.value;
});
2021-06-08 01:23:25 +05:30
this.enable();
2019-03-02 22:35:43 +05:30
}
getTaskListTarget(e) {
return e && e.currentTarget ? $(e.currentTarget) : $(this.taskListContainerSelector);
}
2021-06-08 01:23:25 +05:30
// Disable any task items that don't have a data-sourcepos attribute, on the
// assumption that if it doesn't then it wasn't generated from our markdown parser.
// This covers the case of markdown not being able to handle task lists inside
// markdown tables. It also includes hand coded HTML lists.
disableNonMarkdownTaskListItems(e) {
this.getTaskListTarget(e)
.find('.task-list-item')
.not('[data-sourcepos]')
.find('.task-list-item-checkbox')
.prop('disabled', true);
}
2019-03-02 22:35:43 +05:30
disableTaskListItems(e) {
this.getTaskListTarget(e).taskList('disable');
}
enableTaskListItems(e) {
this.getTaskListTarget(e).taskList('enable');
2021-06-08 01:23:25 +05:30
this.disableNonMarkdownTaskListItems(e);
}
enable() {
this.enableTaskListItems();
$(document).on('tasklist:changed', this.taskListContainerSelector, this.updateHandler);
2017-08-17 22:00:37 +05:30
}
disable() {
2019-03-02 22:35:43 +05:30
this.disableTaskListItems();
$(document).off('tasklist:changed', this.taskListContainerSelector);
2017-08-17 22:00:37 +05:30
}
update(e) {
const $target = $(e.target);
2019-03-02 22:35:43 +05:30
const { index, checked, lineNumber, lineSource } = e.detail;
2017-08-17 22:00:37 +05:30
const patchData = {};
2019-03-02 22:35:43 +05:30
2017-08-17 22:00:37 +05:30
patchData[this.dataType] = {
[this.fieldName]: $target.val(),
2019-03-02 22:35:43 +05:30
lock_version: this.lockVersion,
update_task: {
index,
checked,
line_number: lineNumber,
line_source: lineSource,
},
2017-08-17 22:00:37 +05:30
};
2018-03-17 18:26:18 +05:30
2019-03-02 22:35:43 +05:30
this.disableTaskListItems(e);
2018-12-13 13:39:08 +05:30
return axios
.patch($target.data('updateUrl') || $('form.js-issuable-update').attr('action'), patchData)
2019-03-02 22:35:43 +05:30
.then(({ data }) => {
this.lockVersion = data.lock_version;
this.enableTaskListItems(e);
return this.onSuccess(data);
})
.catch(({ response }) => {
this.enableTaskListItems(e);
return this.onError(response.data);
});
2017-08-17 22:00:37 +05:30
}
}