mirror of
https://git.imnavajas.es/jjimenez/safekat.git
synced 2025-07-25 22:52:08 +00:00
feat wiki/ayuda section
This commit is contained in:
@ -19,10 +19,10 @@ export const initAutonumeric = () => {
|
||||
new AutoNumeric(this, {
|
||||
digitGroupSeparator: ".",
|
||||
decimalCharacter: ",",
|
||||
allowDecimalPadding : 'floats',
|
||||
allowDecimalPadding: 'floats',
|
||||
decimalPlaces: 2,
|
||||
unformatOnSubmit: true,
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
})
|
||||
@ -32,10 +32,10 @@ export const initAutonumeric = () => {
|
||||
new AutoNumeric(this, {
|
||||
digitGroupSeparator: ".",
|
||||
decimalCharacter: ",",
|
||||
allowDecimalPadding : 'floats',
|
||||
allowDecimalPadding: 'floats',
|
||||
decimalPlaces: $(this).data('decimal-places'),
|
||||
unformatOnSubmit: true,
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
})
|
||||
@ -49,7 +49,7 @@ export const initAutonumeric = () => {
|
||||
// allowDecimalPadding : 'floats',
|
||||
// decimalPlaces: 2,
|
||||
// unformatOnSubmit: true,
|
||||
|
||||
|
||||
// });
|
||||
// }
|
||||
// })
|
||||
@ -85,4 +85,26 @@ export const initAutonumeric = () => {
|
||||
// });
|
||||
// }
|
||||
// })
|
||||
}
|
||||
|
||||
export const getTablerIconClassName = () => {
|
||||
const classNames = [];
|
||||
for (const sheet of document.styleSheets) {
|
||||
try {
|
||||
if (sheet.cssRules) {
|
||||
for (const rule of sheet.cssRules) {
|
||||
if (rule.selectorText && rule.selectorText.startsWith(".ti-")) {
|
||||
let className = rule.selectorText.split(" ")[0].replace(".", "");
|
||||
className = className.split("::")[0]
|
||||
className = className.split(":")[0]
|
||||
classNames.push(className);
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn("Cannot access stylesheet:", sheet.href);
|
||||
}
|
||||
}
|
||||
return classNames.reverse();
|
||||
|
||||
}
|
||||
@ -13,7 +13,6 @@ import EditorJS from '../../../../../themes/vuexy/js/editorjs.mjs';
|
||||
import TranslationHelper from '../../common/TranslationHelper.js';
|
||||
import { alertConfirmAction, alertError, alertSuccess, alertWarning } from '../alerts/sweetAlert.js';
|
||||
|
||||
import Modal from '../modal.js'
|
||||
import WikiSectionForm from '../forms/WikiSectionForm.js'
|
||||
|
||||
|
||||
@ -22,29 +21,19 @@ class WikiEditor extends TranslationHelper{
|
||||
constructor() {
|
||||
super();
|
||||
this.sectionId = $("#wiki-section-id").val();
|
||||
this.modalSection = $("#modalSection")
|
||||
this.newSectionBtn = $("#new-section")
|
||||
this.editSectionBtn = $("#edit-section")
|
||||
this.modal = new Modal(this.modalSection)
|
||||
|
||||
this.wikiFormSection = new WikiSectionForm()
|
||||
this.wikiFormSection.setId(this.sectionId)
|
||||
}
|
||||
async initEditor()
|
||||
{
|
||||
this.wikiFormSection
|
||||
this.newSectionBtn.on('click',() => {
|
||||
this.modal.toggle()
|
||||
this.wikiFormSection.initPost()
|
||||
})
|
||||
this.editSectionBtn.on('click',() => {
|
||||
this.modal.toggle()
|
||||
this.wikiFormSection.initUpdate()
|
||||
})
|
||||
this.wikiFormSection.init()
|
||||
|
||||
await this.get_translations("Wiki")
|
||||
this.editor = new EditorJS({
|
||||
holder: 'editorjs',
|
||||
i18n: this.locale == "es" ? es : null,
|
||||
autofocus: true,
|
||||
placeholder: this.get_lang('header-placeholder'),
|
||||
readOnly: true,
|
||||
tunes: {
|
||||
alignment: {
|
||||
@ -121,6 +110,7 @@ class WikiEditor extends TranslationHelper{
|
||||
async initViewOnly()
|
||||
{
|
||||
try {
|
||||
await this.initEditor()
|
||||
await this.editor.isReady;
|
||||
this.handleGetDataPublished();
|
||||
} catch (reason) {
|
||||
@ -135,7 +125,7 @@ class WikiEditor extends TranslationHelper{
|
||||
/** Do anything you need after editor initialization */
|
||||
$('#save-editor').on('click', () => {
|
||||
this.editor.save().then(outputData => {
|
||||
alertConfirmAction('Guardar contenido').then(result => {
|
||||
alertConfirmAction(this.get_lang('save_content')).then(result => {
|
||||
if (result.isConfirmed) {
|
||||
this.handleSaveContent(outputData)
|
||||
}
|
||||
@ -153,7 +143,7 @@ class WikiEditor extends TranslationHelper{
|
||||
console.log(result)
|
||||
});
|
||||
}).catch((error) => {
|
||||
alertError('Tienes que estar en modo editar para publicar').fire()
|
||||
alertError(this.get_lang('need_editor_to_save')).fire()
|
||||
})
|
||||
|
||||
})
|
||||
@ -187,7 +177,7 @@ class WikiEditor extends TranslationHelper{
|
||||
ajax.get()
|
||||
}
|
||||
handleGetDataSuccess(response) {
|
||||
if (response.data.contents) {
|
||||
if (response.data.contents?.editor_data) {
|
||||
alertSuccess(response.message).fire()
|
||||
this.renderContent(response.data.contents.editor_data)
|
||||
} else {
|
||||
@ -202,16 +192,16 @@ class WikiEditor extends TranslationHelper{
|
||||
const ajax = new Ajax(`/wiki/section/${this.sectionId}`,
|
||||
null,
|
||||
null,
|
||||
this.handleGetDataSuccess.bind(this),
|
||||
this.handleGetDataError.bind(this))
|
||||
this.handleGetDataPublishedSuccess.bind(this),
|
||||
this.handleGetDataPublishedError.bind(this))
|
||||
ajax.get()
|
||||
}
|
||||
handleGetDataPublishedSuccess(response) {
|
||||
if (response.data.contents) {
|
||||
if (response.data.contents?.published_data) {
|
||||
alertSuccess(response.message).fire()
|
||||
this.renderContent(response.data.contents.published_data)
|
||||
} else {
|
||||
alertWarning('No hay contenido').fire()
|
||||
alertWarning(this.get_lang('no_content')).fire()
|
||||
}
|
||||
}
|
||||
handleGetDataPublishedError(error) {
|
||||
|
||||
@ -1,41 +1,73 @@
|
||||
import Ajax from "../ajax.js";
|
||||
import { alertError, alertSuccess } from "../alerts/sweetAlert.js";
|
||||
|
||||
class WikiSectionForm
|
||||
{
|
||||
import { alertConfirmAction, alertConfirmationDelete, alertError, alertSuccess } from "../alerts/sweetAlert.js";
|
||||
import Modal from "../modal.js"
|
||||
import { getTablerIconClassName } from "../../common/common.js";
|
||||
class WikiSectionForm {
|
||||
constructor() {
|
||||
this.item = $("#formSection")
|
||||
this.btnNew = $("#submit-new-section")
|
||||
this.btnUpdate = $("#submit-update-section")
|
||||
this.btnDelete = $("#delete-section")
|
||||
this.name = this.item.find('#section-name')
|
||||
this.icon = this.item.find('#section-icon')
|
||||
this.roles = this.item.find('#section-roles').select2({
|
||||
dropdownParent: this.item.parent()
|
||||
})
|
||||
|
||||
|
||||
this.newSectionBtn = $("#new-section")
|
||||
this.editSectionBtn = $("#edit-section")
|
||||
this.modalSection = $("#modalSection")
|
||||
this.modal = new Modal(this.modalSection)
|
||||
this.icons = getTablerIconClassName().map((e, index) => {
|
||||
return { 'text': e, 'id': `ti ${e}` }
|
||||
})
|
||||
}
|
||||
renderIcon(option) {
|
||||
var icon = `<i class="ti ${option.text}"></i> ${option.text}`;
|
||||
return icon;
|
||||
}
|
||||
init() {
|
||||
this.icon.wrap('<div class="position-relative"></div>').select2({
|
||||
data: this.icons,
|
||||
dropdownParent: this.icon.parent(),
|
||||
templateResult: this.renderIcon,
|
||||
templateSelection: this.renderIcon,
|
||||
escapeMarkup: function (m) { return m; }
|
||||
})
|
||||
this.icon.on('change', () => {
|
||||
console.log(this.icon.val())
|
||||
})
|
||||
this.btnNew.on('click', this.post.bind(this))
|
||||
this.btnUpdate.on('click', this.update.bind(this))
|
||||
this.btnDelete.on('click',this.deleteConfirm.bind(this))
|
||||
|
||||
initPost()
|
||||
{
|
||||
this.newSectionBtn.on('click', () => {
|
||||
this.initPost()
|
||||
})
|
||||
this.editSectionBtn.on('click', () => {
|
||||
this.initUpdate()
|
||||
})
|
||||
}
|
||||
setId(id) {
|
||||
this.sectionId = id
|
||||
}
|
||||
initPost() {
|
||||
this.showPost()
|
||||
this.btnNew.on('click',this.post.bind(this))
|
||||
this.btnUpdate.off('click')
|
||||
|
||||
}
|
||||
initUpdate()
|
||||
{
|
||||
this.showUpdate()
|
||||
this.btnUpdate.on('click',this.update.bind(this))
|
||||
this.btnNew.off('click')
|
||||
|
||||
}
|
||||
getFormData()
|
||||
{
|
||||
initUpdate() {
|
||||
this.showUpdate()
|
||||
|
||||
}
|
||||
getFormData() {
|
||||
return {
|
||||
name : this.name.val(),
|
||||
icon : this.icon.val()
|
||||
name: this.name.val(),
|
||||
icon: this.icon.val(),
|
||||
roles: this.roles.val()
|
||||
}
|
||||
}
|
||||
post(){
|
||||
|
||||
post() {
|
||||
|
||||
const ajax = new Ajax('/wiki/section',
|
||||
this.getFormData(),
|
||||
null,
|
||||
@ -45,30 +77,90 @@ class WikiSectionForm
|
||||
ajax.post()
|
||||
}
|
||||
|
||||
update(){
|
||||
update() {
|
||||
const ajax = new Ajax('/wiki/update/section',
|
||||
this.getFormData(),
|
||||
{
|
||||
wiki_section_id: this.sectionId,
|
||||
...this.getFormData()
|
||||
},
|
||||
null,
|
||||
this.success.bind(this),
|
||||
this.error.bind(this)
|
||||
)
|
||||
ajax.post()
|
||||
}
|
||||
success(response)
|
||||
{
|
||||
alertSuccess(response.message).fire()
|
||||
deleteConfirm() {
|
||||
alertConfirmAction('Eliminar sección').then(result => {
|
||||
if (result.isConfirmed) {
|
||||
this.delete()
|
||||
}
|
||||
console.log(result)
|
||||
});
|
||||
}
|
||||
error(error)
|
||||
{
|
||||
delete() {
|
||||
const ajax = new Ajax('/wiki/section/' + this.sectionId,
|
||||
null,
|
||||
null,
|
||||
this.success.bind(this),
|
||||
this.error.bind(this)
|
||||
)
|
||||
ajax.delete()
|
||||
}
|
||||
success(response) {
|
||||
alertSuccess(response.message).fire()
|
||||
this.modal.toggle()
|
||||
}
|
||||
error(error) {
|
||||
alertError(error?.message).fire()
|
||||
}
|
||||
showPost(){
|
||||
showPost() {
|
||||
this.empty()
|
||||
this.btnNew.removeClass('d-none')
|
||||
this.btnUpdate.addClass('d-none')
|
||||
$("#modalTitleNew").removeClass('d-none')
|
||||
$("#modalTitleEdit").addClass('d-none')
|
||||
this.modal.toggle()
|
||||
|
||||
|
||||
}
|
||||
showUpdate(){
|
||||
async showUpdate() {
|
||||
this.empty()
|
||||
const sectionData = await this.handleShowSection()
|
||||
if (sectionData) {
|
||||
console.log(sectionData)
|
||||
this.name.val(sectionData.data.name)
|
||||
this.icon.val(sectionData.data.icon).trigger('change')
|
||||
this.roles.val(sectionData.data.roles_array).trigger('change')
|
||||
}
|
||||
this.btnUpdate.removeClass('d-none')
|
||||
this.btnNew.addClass('d-none')
|
||||
$("#modalTitleNew").addClass('d-none')
|
||||
$("#modalTitleEdit").removeClass('d-none')
|
||||
this.modal.toggle()
|
||||
|
||||
|
||||
}
|
||||
handleShowSection() {
|
||||
return new Promise((resolve, reject) => {
|
||||
|
||||
const ajax = new Ajax('/wiki/section/' + this.sectionId,
|
||||
null,
|
||||
null,
|
||||
(response) => {
|
||||
resolve(response)
|
||||
},
|
||||
(error) => {
|
||||
alertError(error.message).fire()
|
||||
resolve(false)
|
||||
}
|
||||
)
|
||||
ajax.get()
|
||||
})
|
||||
}
|
||||
empty() {
|
||||
this.name.val(null)
|
||||
this.icon.val("").trigger('change')
|
||||
this.roles.val("").trigger('change')
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
37
httpdocs/assets/js/safekat/components/listSortable.js
Normal file
37
httpdocs/assets/js/safekat/components/listSortable.js
Normal file
@ -0,0 +1,37 @@
|
||||
import "../../../../../themes/vuexy/vendor/libs/sortablejs/sortable.js"
|
||||
|
||||
|
||||
class ListSortable{
|
||||
constructor(listItem,config = {}) {
|
||||
|
||||
this.list = Sortable.create($(listItem)[0], {
|
||||
animation: 150,
|
||||
group: 'menuSorting',
|
||||
handle: '.drag-handle',
|
||||
direction : 'vertical',
|
||||
...config,
|
||||
});
|
||||
}
|
||||
getArray(){
|
||||
const list = this.list.toArray()
|
||||
return list
|
||||
}
|
||||
onChange(callback)
|
||||
{
|
||||
this.list.option('onChange',callback)
|
||||
}
|
||||
onMove(callback)
|
||||
{
|
||||
this.list.option('onMove',callback)
|
||||
}
|
||||
onEnd(callback)
|
||||
{
|
||||
this.list.option('onEnd',callback)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
export default ListSortable
|
||||
@ -9,6 +9,7 @@ class Modal{
|
||||
show(){
|
||||
this.item.modal('show');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Modal;
|
||||
@ -1,11 +1,12 @@
|
||||
import WikiEditor from "../../components/editorjs/WikiEditor.js"
|
||||
import Ajax from "../../components/ajax.js"
|
||||
|
||||
|
||||
$(async () => {
|
||||
try {
|
||||
|
||||
const editor = new WikiEditor()
|
||||
await editor.init()
|
||||
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
25
httpdocs/assets/js/safekat/pages/wiki/menuSortable.js
Normal file
25
httpdocs/assets/js/safekat/pages/wiki/menuSortable.js
Normal file
@ -0,0 +1,25 @@
|
||||
import Ajax from "../../components/ajax.js"
|
||||
import { alertError, alertSuccess } from "../../components/alerts/sweetAlert.js"
|
||||
import ListSortable from "../../components/listSortable.js"
|
||||
$(() => {
|
||||
|
||||
const menuSectionList = new ListSortable('#menu-inner-list')
|
||||
menuSectionList.onEnd(updateWikiSectionOrder)
|
||||
|
||||
})
|
||||
|
||||
const updateWikiSectionOrder = (evt) =>
|
||||
{
|
||||
let list = new ListSortable('#menu-inner-list')
|
||||
|
||||
const ajax = new Ajax('/wiki/section/update/order',
|
||||
{
|
||||
orders : list.getArray()
|
||||
},
|
||||
null,
|
||||
(response) => alertSuccess(response.message).fire(),
|
||||
(error) => alertError(error.message).fire(),
|
||||
)
|
||||
ajax.post();
|
||||
}
|
||||
|
||||
@ -6,7 +6,7 @@ $(async() => {
|
||||
|
||||
try {
|
||||
const editor = new WikiEditor()
|
||||
await editor.init()
|
||||
await editor.initViewOnly()
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user