chore(deps): Sostituto jQuery con Cash

This commit is contained in:
Maicol Battistini 2021-10-08 16:38:46 +02:00
parent 6e2e8bf8ab
commit 3c871d9d83
No known key found for this signature in database
GPG Key ID: 4FDB0F87CDB1D34A
6 changed files with 52 additions and 53 deletions

View File

@ -1,7 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptLibraryMappings">
<file url="PROJECT" libraries="{@types/jquery, @types/mithril}" />
<file url="PROJECT" libraries="{@types/mithril}" />
<includedPredefinedLibrary name="Node.js Core" />
</component>
</project>

View File

@ -90,8 +90,6 @@
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" name="@types/mithril" level="application" />
<orderEntry type="library" name="@types/jquery" level="application" />
<orderEntry type="library" name="@types/jquery" level="application" />
<orderEntry type="library" name="@types/mithril" level="application" />
</component>
</module>

View File

@ -38,10 +38,10 @@
"@material/theme": "^13.0.0",
"@mdi/font": "^6.2.95",
"async-wait-until": "^2.0.7",
"cash-dom": "^8.1.0",
"classnames": "^2.3.1",
"collect.js": "^4.29.0",
"coloquent": "^2.4.0",
"jquery": "^3.6.0",
"lit": "^2.0.2",
"locale-code": "^2.0.2",
"lodash-es": "^4.17.21",

View File

@ -1,12 +1,13 @@
import {type Cash} from 'cash-dom/dist/cash';
import classnames, {Argument as ClassNames} from 'classnames';
import collect, {Collection} from 'collect.js';
import m, {
Children, ClassComponent,
Vnode, VnodeDOM
Children, ClassComponent, Vnode, VnodeDOM
} from 'mithril';
interface Attributes extends Collection {
addClassNames(...classNames: ClassNames[]): void,
addStyles(...styles: string[]): void
}
@ -26,7 +27,7 @@ interface Attributes extends Collection {
* - The static `initAttrs` method allows a convenient way to provide defaults (or to otherwise
* modify) the attrs that have been passed into a component.
* - When the component is created in the DOM, we store its DOM element under `this.element`;
* this lets us use jQuery to modify child DOM state from internal methods via the `this.$()`
* this lets us use Cash to modify child DOM state from internal methods via the `this.$()`
* method.
* - A convenience `component` method, which serves as an alternative to hyperscript and JSX.
*
@ -105,21 +106,21 @@ export default class Component implements ClassComponent {
onremove(vnode: VnodeDOM) {}
/**
* Returns a jQuery object for this component's element. If you pass in a
* selector string, this method will return a jQuery object, using the current
* Returns a Cash object for this component's element. If you pass in a
* selector string, this method will return a Cash object, using the current
* element as its buffer.
*
* For example, calling `component.$('li')` will return a jQuery object
* For example, calling `component.$('li')` will return a Cash object
* containing all of the `li` elements inside the DOM element of this
* component.
*
* @param [selector] a jQuery-compatible selector string
* @returns the jQuery object for the DOM node
* @param [selector] a Cash-compatible selector string
* @returns the Cash object for the DOM node
* @final
* @protected
*/
$(selector?: string): JQuery {
const $element: JQuery<HTMLElement> = $(this.element);
$(selector?: string): Cash {
const $element: Cash<HTMLElement> = $(this.element);
return selector ? $element.find(element => selector(element)) : $element;
}

View File

@ -3,6 +3,7 @@ import '@material/mwc-fab';
import '@material/mwc-snackbar';
import type {TextFieldInputMode, TextFieldType} from '@material/mwc-textfield/mwc-textfield-base';
import {type Cash} from 'cash-dom/dist/cash';
import collect from 'collect.js';
import {snakeCase} from 'lodash-es/string';
import {Children} from 'mithril';
@ -209,47 +210,47 @@ export default class RecordsPage extends Page {
oncreate(vnode) {
super.oncreate(vnode);
$('mwc-fab#add-record')
.on('click', (clickEvent) => {
const dialog = $(clickEvent.delegateTarget)
.next('mwc-dialog#add-record-dialog');
const form: JQuery = dialog.find('form');
const fab: Cash = $('mwc-fab#add-record');
fab.on('click', () => {
const dialog: Cash = fab.next('mwc-dialog#add-record-dialog');
const form: Cash = dialog.find('form');
dialog.find('mwc-button[type="submit"]')
.on('click', () => {
form.trigger('submit');
});
dialog.find('mwc-button[type="submit"]')
.on('click', () => {
form.trigger('submit');
});
form.attr('method', 'PUT')
.off()
.on('submit', async (event) => {
event.preventDefault();
form.attr('method', 'PUT')
.off()
.on('submit', async (event) => {
event.preventDefault();
// noinspection JSUnresolvedFunction
if (form.isValid()) {
const data = {};
form.find('mwc-textfield, mwc-textarea')
.each((index, field) => {
const key = this.saveModelWithSnakeCase ? snakeCase(field.id) : field.id;
data[key] = field.value;
});
// noinspection JSUnresolvedFunction
if (form.isValid()) {
const data = {};
form.find('mwc-textfield, mwc-textarea')
.each((index, field) => {
const key = this.saveModelWithSnakeCase ? snakeCase(field.id) : field.id;
data[key] = field.value;
});
// noinspection JSUnresolvedFunction
const response = await this.model.create(data);
if (response.getModelId()) {
dialog.close();
this.rows.push(response.getModel());
m.redraw();
await showSnackbar(this.__('Record creato'), 4000);
}
} else {
await showSnackbar(this.__('Campi non validi. Controlla i dati inseriti'));
const response = await this.model.create(data);
if (response.getModelId()) {
dialog.get(0)
.close();
this.rows.push(response.getModel());
m.redraw();
await showSnackbar(this.__('Record creato'), 4000);
}
});
} else {
await showSnackbar(this.__('Campi non validi. Controlla i dati inseriti'));
}
});
dialog.get(0)
.show();
});
dialog.get(0)
.show();
});
}
}

5
resources/js/app.js vendored
View File

@ -5,15 +5,14 @@ import '@mdi/font/css/materialdesignicons.min.css';
import {InertiaProgress} from '@inertiajs/progress';
import {createInertiaApp} from '@maicol07/inertia-mithril';
import {waitUntil} from 'async-wait-until';
import jQuery from 'jquery/dist/jquery.slim.min';
import $ from 'cash-dom';
import m from 'mithril';
// Fix Mithril JSX durante la compilazione
m.Fragment = '[';
// Variabili globali
window.$ = jQuery;
window.jQuery = jQuery;
window.$ = $;
window.m = m;
InertiaProgress.init();