openrat-cms

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README

form.min.js (4078B)


      1 import $         from  '../jquery-global.min.js';
      2 import Workbench from "./workbench.min.js";
      3 import Notice    from "./notice.min.js";
      4 import Callback  from "./callback.min.js";
      5 import Api       from "./api.min.js";
      6 export default class Form {
      7 static modes = {
      8 keepOpen           :  2,
      9 closeAfterSubmit   :  4,
     10 closeAfterSuccess  :  8,
     11 };
     12 constructor() {
     13 this.onChangeHandler = new Callback();
     14 this.onSaveHandler   = new Callback();
     15 this.onCloseHandler  = new Callback();
     16 this.forwardHandler  = new Callback();
     17 this.async = false;
     18 this.afterSuccess = '';
     19 this.element = null;
     20 this.autosave = false;
     21 this.mode = Form.modes.keepOpen;
     22 this.formMethod = 'GET';
     23 this.forwardToMethod = null;
     24 }
     25 set isLoadStatus( isLoading ) {
     26 if   ( isLoading )
     27 Workbench.getInstance().startSpinner();
     28 else
     29 Workbench.getInstance().stopSpinner();
     30 }
     31 initOnElement( element ) {
     32 this.element = element;
     33 this.formMethod      = $(this.element).attr('method').toUpperCase();
     34 this.afterSuccess    = $(this.element).data('afterSuccess');
     35 this.forwardToMethod = $(this.element).data('forwardTo');
     36 this.async           = $(this.element).data('async');
     37 if   ( $(this.element).data('autosave') ) {
     38 this.autosave = true;
     39 $(this.element).find('input[type="checkbox"]').click( () => {
     40 this.submit(Form.modes.keepOpen);
     41 });
     42 $(this.element).find('select').change( () => {
     43 this.submit(Form.modes.keepOpen);
     44 });
     45 }
     46 $(element).find('.or-act-form-cancel').click( () => {
     47 this.cancel();
     48 });
     49 $(element).find('.or-act-form-reset').click( () => {
     50 this.rollback();
     51 });
     52 $(element).find('.or-act-form-apply').click( () => {
     53 this.submit(Form.modes.keepOpen);
     54 });
     55 $(element).find('.or-act-form-save').click( () => {
     56 if   ( this.async )
     57 this.submit( Form.modes.closeAfterSubmit );
     58 else
     59 this.submit( Form.modes.closeAfterSuccess );
     60 });
     61 $(element).find('.or-input').change( () => {
     62 this.onChangeHandler.fire();
     63 });
     64 $(element).submit( ( event ) => {
     65 if   ( this.async )
     66 this.submit( Form.modes.closeAfterSubmit );
     67 else
     68 this.submit( Form.modes.closeAfterSuccess );
     69 event.preventDefault();
     70 });
     71 }
     72 cancel() {
     73 Notice.removeAllNotices();
     74 this.close();
     75 }
     76 rollback() {
     77 this.element.nodes[0].reset();
     78 }
     79 forwardTo(action, subaction, id, data) {
     80 this.forwardHandler.fire( action, subaction, id, data );
     81 }
     82 async submit( mode ) {
     83 Notice.removeAllNotices();
     84 let progressStatus = new Notice();
     85 progressStatus.setStatus('info');
     86 progressStatus.inProgress();
     87 progressStatus.msg = Workbench.language.PROGRESS;
     88 progressStatus.show();
     89 this.removeErrorMarkers();
     90 let formData = new FormData( $(this.element).get(0) );
     91 if   (!formData.has('id') )
     92 formData.append('id',Workbench.state.id);
     93 if   (!formData.has('action') )
     94 formData.append('action',Workbench.state.action);
     95 if	( this.formMethod == 'GET' )
     96 {
     97 this.forwardTo( formData.get('action'), formData.get('subaction'),formData.get('id,'),formData );
     98 progressStatus.close();
     99 }
    100 else
    101 {
    102 if	( mode == Form.modes.closeAfterSubmit )
    103 this.close();
    104 try {
    105 await this.sendFormData( formData,mode );
    106 }
    107 catch( error ) {
    108 }
    109 finally {
    110 progressStatus.close();
    111 }
    112 }
    113 }
    114 sendFormData = async function( formData,mode ) {
    115 if   ( !this.async )
    116 this.isLoadStatus = true;
    117 let api = new Api();
    118 api.notifyBrowser = this.async;
    119 api.validationErrorForField = (name) => {
    120 $('.or-input[name='+name+']').addClass('input--error').parent().addClass('input--error').parents('.or-group').removeClass('closed').addClass('show').addClass('open');
    121 }
    122 try {
    123 await api.sendData( formData );
    124 this.onSaveHandler.fire();
    125 if (mode == Form.modes.closeAfterSuccess) {
    126 this.close();
    127 }
    128 if (this.afterSuccess) {
    129 if (this.afterSuccess == 'reloadAll') {
    130 Workbench.getInstance().reloadAll();
    131 } else if (this.afterSuccess == 'forward') {
    132 if (this.forwardToMethod)
    133 this.forwardTo(formData.get('action'), this.forwardToMethod, formData.get('id'), []);
    134 }
    135 } else {
    136 if (this.async)
    137 ; 
    138 else
    139 Workbench.getInstance().reloadViews();
    140 }
    141 Callback.dataChangedHandler.fire();
    142 } finally {
    143 this.isLoadStatus = false;
    144 }
    145 }
    146 close = function() {
    147 this.onCloseHandler.fire();
    148 }
    149 removeErrorMarkers = function() {
    150 $(this.element).find('.or-input--error').removeClass('input--error');
    151 }
    152 }