1
0
mirror of https://github.com/devcode-it/openstamanager.git synced 2025-02-23 14:57:46 +01:00

feat(frontend): Aggiunta creazione di un nuovo record

This commit is contained in:
Maicol Battistini 2021-10-04 22:56:26 +02:00
parent 51505d43e9
commit fabf83641e
No known key found for this signature in database
GPG Key ID: 4FDB0F87CDB1D34A
4 changed files with 53 additions and 5 deletions

View File

@ -31,6 +31,7 @@
"@material/mwc-menu": "^0.25.1",
"@material/mwc-ripple": "^0.25.1",
"@material/mwc-select": "^0.25.1",
"@material/mwc-snackbar": "^0.25.1",
"@material/mwc-textarea": "^0.25.1",
"@material/mwc-textfield": "^0.25.1",
"@material/mwc-top-app-bar": "^0.25.1",

View File

@ -1,11 +1,13 @@
import '@material/mwc-dialog';
import '@material/mwc-fab';
import '@material/mwc-snackbar';
import type {TextFieldInputMode, TextFieldType} from '@material/mwc-textfield/mwc-textfield-base';
import collect from 'collect.js';
import {Children} from 'mithril';
import {Model} from '../../Models';
import {showSnackbar} from '../../utils';
import DataTable from '../DataTable/DataTable.jsx';
import TableBody from '../DataTable/TableBody.jsx';
import TableCell from '../DataTable/TableCell.jsx';
@ -78,7 +80,8 @@ export default class RecordsPage extends Page {
sections: { [string]: SectionT } | [SectionT];
recordDialog: Children = <mwc-dialog heading={this.__('Aggiungi nuovo record')}>
recordDialog: Children = <mwc-dialog id="add-record-dialog"
heading={this.__('Aggiungi nuovo record')}>
<form method="PUT">
{(() => {
const sections = collect(this.sections);
@ -179,12 +182,24 @@ export default class RecordsPage extends Page {
super.oncreate(vnode);
$('mwc-fab#add-record')
.on('click', function () {
const dialog = $(this)
.on('click', (clickEvent) => {
const dialog = $(clickEvent.delegateTarget)
.next('mwc-dialog#add-record-dialog');
dialog.find('form')
.attr('method', 'PUT');
.attr('method', 'PUT')
.off()
.on('submit', async (event) => {
event.preventDefault();
const fd = new FormData(event.delegateTarget);
// noinspection JSUnresolvedFunction
const instance = await this.model.create(fd);
if (instance.id) {
this.rows.push(instance.all());
m.redraw();
await showSnackbar(this.__('Record creato'), 2.5);
}
});
dialog.find('mwc-textfield')
.val('');

View File

@ -2,7 +2,6 @@ import BaseModel from 'javel';
import {snakeCase} from 'lodash';
import redaxios from 'redaxios';
// noinspection JSUnusedGlobalSymbols
export default class Model extends BaseModel {
urlPath: string;

33
resources/js/utils.js vendored
View File

@ -15,3 +15,36 @@ export function containsHTML(string_: string): boolean {
// eslint-disable-next-line unicorn/better-regex
return /<[a-z][\s\S]*>/i.test(string_);
}
/**
* Show a snackbar
*/
export async function showSnackbar(message: string, duration: number, acceptText = 'OK', cancelText = 'Annulla'): Promise<boolean> {
const snackbar = document.createElement('mwc-snackbar');
snackbar.label = message;
snackbar.timeoutMs = duration;
if (acceptText) {
const button = document.createElement('mwc-button');
button.label = acceptText;
button.slot = 'action';
snackbar.append(button);
}
if (cancelText) {
const button = document.createElement('mwc-button');
button.label = cancelText;
button.slot = 'cancel';
snackbar.append(button);
}
document.body.append(snackbar);
let resolve: (value?: boolean) => void;
const reasonPromise = new Promise()((response) => {
resolve = response;
});
snackbar.addEventListener('MDCSnackbar:closed', (event) => {
resolve(event?.detail?.reason === 'action' ?? false);
});
snackbar.open();
const acceptOrReject = await reasonPromise;
snackbar.remove();
return acceptOrReject;
}