Added callback to save form state in query string
This commit is contained in:
eldadfux
parent
18f126c705
commit
358b81d4f0
|
|
@ -15,17 +15,21 @@ $limit = 5;
|
|||
|
||||
<h2 style="display: none;">Users</h2>
|
||||
|
||||
<form class="box padding-small margin-bottom-large"
|
||||
<form class="box padding-small margin-bottom"
|
||||
data-service="users.listUsers"
|
||||
data-event="submit"
|
||||
data-param-search="{{router.params.search}}"
|
||||
data-param-limit="<?php echo $limit; ?>"
|
||||
data-param-offset="{{router.params.offset}}"
|
||||
data-param-order-type="ASC"
|
||||
data-scope="sdk"
|
||||
data-name="project-users">
|
||||
<input type="hidden" name="orderType" value="ASC">
|
||||
<input type="hidden" name="offset" value="0">
|
||||
<input type="hidden" name="limit" value="<?php echo $limit; ?>">
|
||||
<div class="row responsive">
|
||||
data-name="project-users"
|
||||
data-success="state"
|
||||
data-success-param-state-keys="search,offset">
|
||||
<input type="hidden" name="project" data-ls-bind="{{router.params.project}}">
|
||||
<div class="row responsive thin">
|
||||
<div class="col span-10">
|
||||
<input name="search" id="searchUsers" type="search" autocomplete="off" placeholder="Search" class="margin-bottom-no">
|
||||
<input name="search" id="searchUsers" type="search" autocomplete="off" placeholder="Search" class="margin-bottom-no" data-ls-bind="{{router.params.search}}">
|
||||
</div>
|
||||
<div class="col span-2">
|
||||
<button class="fill">Search</button>
|
||||
|
|
@ -50,12 +54,13 @@ $limit = 5;
|
|||
</div>
|
||||
|
||||
<div data-ls-if="0 != {{project-users.sum}}" style="display: none;">
|
||||
<div class="note margin-bottom-small margin-end-small text-align-end text-size-small"><span data-ls-bind="{{project-users.sum}}"></span> results found</div>
|
||||
<div class="box margin-bottom">
|
||||
<table class="vertical">
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="30"></th>
|
||||
<th width="180">Name</th>
|
||||
<th width="60"></th>
|
||||
<th width="200">Name</th>
|
||||
<th width="200">Email</th>
|
||||
<th>Status</th>
|
||||
<th width="100">Joined</th>
|
||||
|
|
|
|||
26
public/dist/scripts/app-all.js
vendored
26
public/dist/scripts/app-all.js
vendored
|
|
@ -2365,17 +2365,25 @@ window.getSelection().removeAllRanges();});element.parentNode.parentNode.appendC
|
|||
document.body.classList.add(prefix+'-'+value);cookie.set('language-'+prefix,value,365);document.dispatchEvent(new CustomEvent('updated-language-'+prefix));};document.addEventListener('updated-language-'+prefix,function(){element.value=cookie.get('language-'+prefix);});let def=cookie.get('language-'+prefix)||element.options[0].value;select(def);element.value=def;}}).add({selector:'data-ls-ui-chart',repeat:false,controller:function(element,container,date,document){let child=document.createElement('canvas');child.width=500;child.height=175;let stats=container.get('usage');if(!stats||!stats['requests']||!stats['requests']['data']){return;}
|
||||
let config={type:'line',data:{labels:[],datasets:[{label:'Requests',backgroundColor:'rgba(230, 248, 253, 0.3)',borderColor:'#29b5d9',borderWidth:2,data:[0,0,0,0,0,0,0],fill:true}]},options:{responsive:true,title:{display:false,text:'Stats'},legend:{display:false},tooltips:{mode:'index',intersect:false,caretPadding:0},hover:{mode:'nearest',intersect:true},scales:{xAxes:[{display:false}],yAxes:[{display:false,}]}}};for(let i=0;i<stats['requests']['data'].length;i++){config.data.datasets[0].data[i]=stats['requests']['data'][i].value;config.data.labels[i]=date.format('d F Y',stats['requests']['data'][i].date);}
|
||||
let chart=container.get('chart');if(chart){}
|
||||
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.trim().split(','):[];failure=(failure&&failure!='')?failure.trim().split(','):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
|
||||
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
|
||||
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.split(',').map(element=>element.trim()):[];failure=(failure&&failure!='')?failure.split(',').map(element=>element.trim()):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
|
||||
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'state':function(keys){let updateQueryString=function(key,value,url){var re=new RegExp("([?&])"+key+"=.*?(&|#|$)(.*)","gi"),hash;if(re.test(url)){if(typeof value!=='undefined'&&value!==null){return url.replace(re,'$1'+key+"="+value+'$2$3');}
|
||||
else{hash=url.split('#');url=hash[0].replace(re,'$1$3').replace(/(&|\?)$/,'');if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
|
||||
return url;}}
|
||||
else{if(typeof value!=='undefined'&&value!==null){var separator=url.indexOf('?')!==-1?'&':'?';hash=url.split('#');url=hash[0]+separator+key+'='+value;if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
|
||||
return url;}
|
||||
else{return url;}}}
|
||||
keys=keys.split(',').map(element=>element.trim());return function(router,serviceData){let url=window.location.href;keys.map(key=>{let value=getValue(key,'param',serviceData);if(!value){}
|
||||
url=updateQueryString(key,(value?value:null),url)});console.log(url);window.history.replaceState({},'',url);}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
|
||||
if(debug)console.log('%c[event triggered]: '+events[i],'color:green');document.dispatchEvent(new CustomEvent(events[i]));}}}};let getParams=function getParams(func){const REGEX_COMMENTS=/((\/\/.*$)|(\/\*[\s\S]*?\*\/))/mg;const REGEX_FUNCTION_PARAMS=/(?:\s*(?:function\s*[^(]*)?\s*)((?:[^'"]|(?:(?:(['"])(?:(?:.*?[^\\]\2)|\2))))*?)\s*(?=(?:=>)|{)/m;const REGEX_PARAMETERS_VALUES=/\s*([\w\\$]+)\s*(?:=\s*((?:(?:(['"])(?:\3|(?:.*?[^\\]\3)))((\s*\+\s*)(?:(?:(['"])(?:\6|(?:.*?[^\\]\6)))|(?:[\w$]*)))*)|.*?))?\s*(?:,|$)/gm;let functionAsString=func.toString();let params=[];let match;functionAsString=functionAsString.replace(REGEX_COMMENTS,'');functionAsString=functionAsString.match(REGEX_FUNCTION_PARAMS)[1];if(functionAsString.charAt(0)==='('){functionAsString=functionAsString.slice(1,-1);}
|
||||
while(match=REGEX_PARAMETERS_VALUES.exec(functionAsString)){params.push(match[1]);}
|
||||
return params;}
|
||||
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
|
||||
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){let result=null;if(!value){return null;}
|
||||
if(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]){result=expression.parse(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]);}
|
||||
if(data[value]){result=data[value];}
|
||||
let getValue=function(key,prefix,data){let result=null;if(!key){return null;}
|
||||
if(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]){result=expression.parse(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]);}
|
||||
if(data[key]){result=data[key];}
|
||||
if(!result){result='';}
|
||||
if(debug)console.log('%c[param resolved]: ('+service+') '+value+'='+result,'color:#808080');return result;}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
|
||||
if(debug)console.log('%c[param resolved]: ('+service+') '+key+'='+result,'color:#808080');return result;}
|
||||
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
|
||||
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){return getValue(value,prefix,data);}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
|
||||
if(event){event.preventDefault();}
|
||||
if(confirm){if(window.confirm(confirm)!==true){return false;}}
|
||||
if(loading){loaderId=alerts.add({text:loading,class:''},0);}
|
||||
|
|
@ -2383,8 +2391,8 @@ let method=container.path(scope+'.'+action);if(!method){throw new Error('Method
|
|||
let result=resolve(method,'param',('FORM'===element.tagName)?form.toJson(element):{});if(!result){return;}
|
||||
result.then(function(data){if(loaderId!==null){alerts.remove(loaderId);}
|
||||
if(!element){return;}
|
||||
container.set(service.replace('.','-'),data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
|
||||
element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
|
||||
container.set(service.replace('.','-'),data,true,true);container.set('serviceData',data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
|
||||
container.set('serviceData',null,true,true);element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
|
||||
if(!element){return;}
|
||||
for(let i=0;i<failure.length;i++){container.resolve(resolve(callbacks[failure[i]],'failureParam'+failure[i].charAt(0).toUpperCase()+failure[i].slice(1),{}));}
|
||||
element.$lsSkip=false;view.render(element);});};let events=event.trim().split(',');for(let y=0;y<events.length;y++){if(''===events[y]){continue;}
|
||||
|
|
|
|||
26
public/dist/scripts/app.js
vendored
26
public/dist/scripts/app.js
vendored
|
|
@ -272,17 +272,25 @@ window.getSelection().removeAllRanges();});element.parentNode.parentNode.appendC
|
|||
document.body.classList.add(prefix+'-'+value);cookie.set('language-'+prefix,value,365);document.dispatchEvent(new CustomEvent('updated-language-'+prefix));};document.addEventListener('updated-language-'+prefix,function(){element.value=cookie.get('language-'+prefix);});let def=cookie.get('language-'+prefix)||element.options[0].value;select(def);element.value=def;}}).add({selector:'data-ls-ui-chart',repeat:false,controller:function(element,container,date,document){let child=document.createElement('canvas');child.width=500;child.height=175;let stats=container.get('usage');if(!stats||!stats['requests']||!stats['requests']['data']){return;}
|
||||
let config={type:'line',data:{labels:[],datasets:[{label:'Requests',backgroundColor:'rgba(230, 248, 253, 0.3)',borderColor:'#29b5d9',borderWidth:2,data:[0,0,0,0,0,0,0],fill:true}]},options:{responsive:true,title:{display:false,text:'Stats'},legend:{display:false},tooltips:{mode:'index',intersect:false,caretPadding:0},hover:{mode:'nearest',intersect:true},scales:{xAxes:[{display:false}],yAxes:[{display:false,}]}}};for(let i=0;i<stats['requests']['data'].length;i++){config.data.datasets[0].data[i]=stats['requests']['data'][i].value;config.data.labels[i]=date.format('d F Y',stats['requests']['data'][i].date);}
|
||||
let chart=container.get('chart');if(chart){}
|
||||
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.trim().split(','):[];failure=(failure&&failure!='')?failure.trim().split(','):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
|
||||
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
|
||||
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.split(',').map(element=>element.trim()):[];failure=(failure&&failure!='')?failure.split(',').map(element=>element.trim()):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
|
||||
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'state':function(keys){let updateQueryString=function(key,value,url){var re=new RegExp("([?&])"+key+"=.*?(&|#|$)(.*)","gi"),hash;if(re.test(url)){if(typeof value!=='undefined'&&value!==null){return url.replace(re,'$1'+key+"="+value+'$2$3');}
|
||||
else{hash=url.split('#');url=hash[0].replace(re,'$1$3').replace(/(&|\?)$/,'');if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
|
||||
return url;}}
|
||||
else{if(typeof value!=='undefined'&&value!==null){var separator=url.indexOf('?')!==-1?'&':'?';hash=url.split('#');url=hash[0]+separator+key+'='+value;if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
|
||||
return url;}
|
||||
else{return url;}}}
|
||||
keys=keys.split(',').map(element=>element.trim());return function(router,serviceData){let url=window.location.href;keys.map(key=>{let value=getValue(key,'param',serviceData);if(!value){}
|
||||
url=updateQueryString(key,(value?value:null),url)});console.log(url);window.history.replaceState({},'',url);}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
|
||||
if(debug)console.log('%c[event triggered]: '+events[i],'color:green');document.dispatchEvent(new CustomEvent(events[i]));}}}};let getParams=function getParams(func){const REGEX_COMMENTS=/((\/\/.*$)|(\/\*[\s\S]*?\*\/))/mg;const REGEX_FUNCTION_PARAMS=/(?:\s*(?:function\s*[^(]*)?\s*)((?:[^'"]|(?:(?:(['"])(?:(?:.*?[^\\]\2)|\2))))*?)\s*(?=(?:=>)|{)/m;const REGEX_PARAMETERS_VALUES=/\s*([\w\\$]+)\s*(?:=\s*((?:(?:(['"])(?:\3|(?:.*?[^\\]\3)))((\s*\+\s*)(?:(?:(['"])(?:\6|(?:.*?[^\\]\6)))|(?:[\w$]*)))*)|.*?))?\s*(?:,|$)/gm;let functionAsString=func.toString();let params=[];let match;functionAsString=functionAsString.replace(REGEX_COMMENTS,'');functionAsString=functionAsString.match(REGEX_FUNCTION_PARAMS)[1];if(functionAsString.charAt(0)==='('){functionAsString=functionAsString.slice(1,-1);}
|
||||
while(match=REGEX_PARAMETERS_VALUES.exec(functionAsString)){params.push(match[1]);}
|
||||
return params;}
|
||||
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
|
||||
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){let result=null;if(!value){return null;}
|
||||
if(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]){result=expression.parse(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]);}
|
||||
if(data[value]){result=data[value];}
|
||||
let getValue=function(key,prefix,data){let result=null;if(!key){return null;}
|
||||
if(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]){result=expression.parse(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]);}
|
||||
if(data[key]){result=data[key];}
|
||||
if(!result){result='';}
|
||||
if(debug)console.log('%c[param resolved]: ('+service+') '+value+'='+result,'color:#808080');return result;}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
|
||||
if(debug)console.log('%c[param resolved]: ('+service+') '+key+'='+result,'color:#808080');return result;}
|
||||
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
|
||||
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){return getValue(value,prefix,data);}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
|
||||
if(event){event.preventDefault();}
|
||||
if(confirm){if(window.confirm(confirm)!==true){return false;}}
|
||||
if(loading){loaderId=alerts.add({text:loading,class:''},0);}
|
||||
|
|
@ -290,8 +298,8 @@ let method=container.path(scope+'.'+action);if(!method){throw new Error('Method
|
|||
let result=resolve(method,'param',('FORM'===element.tagName)?form.toJson(element):{});if(!result){return;}
|
||||
result.then(function(data){if(loaderId!==null){alerts.remove(loaderId);}
|
||||
if(!element){return;}
|
||||
container.set(service.replace('.','-'),data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
|
||||
element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
|
||||
container.set(service.replace('.','-'),data,true,true);container.set('serviceData',data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
|
||||
container.set('serviceData',null,true,true);element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
|
||||
if(!element){return;}
|
||||
for(let i=0;i<failure.length;i++){container.resolve(resolve(callbacks[failure[i]],'failureParam'+failure[i].charAt(0).toUpperCase()+failure[i].slice(1),{}));}
|
||||
element.$lsSkip=false;view.render(element);});};let events=event.trim().split(',');for(let y=0;y<events.length;y++){if(''===events[y]){continue;}
|
||||
|
|
|
|||
2
public/dist/styles/default-ltr.css
vendored
2
public/dist/styles/default-ltr.css
vendored
File diff suppressed because one or more lines are too long
|
|
@ -17,8 +17,8 @@
|
|||
let success = (element.dataset['success'] || '');
|
||||
let failure = (element.dataset['failure'] || '');
|
||||
|
||||
success = (success && success != '') ? success.trim().split(',') : [];
|
||||
failure = (failure && failure != '') ? failure.trim().split(',') : [];
|
||||
success = (success && success != '') ? success.split(',').map(element => element.trim()) : [];
|
||||
failure = (failure && failure != '') ? failure.split(',').map(element => element.trim()) : [];
|
||||
|
||||
if (debug) console.log('%c[service init]: ' + action + ' (' + service + ')', 'color:red');
|
||||
|
||||
|
|
@ -51,6 +51,61 @@
|
|||
}
|
||||
},
|
||||
|
||||
'state': function (keys) {
|
||||
let updateQueryString = function(key, value, url) {
|
||||
var re = new RegExp("([?&])" + key + "=.*?(&|#|$)(.*)", "gi"),
|
||||
hash;
|
||||
|
||||
if (re.test(url)) {
|
||||
if (typeof value !== 'undefined' && value !== null) {
|
||||
return url.replace(re, '$1' + key + "=" + value + '$2$3');
|
||||
}
|
||||
else {
|
||||
hash = url.split('#');
|
||||
url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, '');
|
||||
if (typeof hash[1] !== 'undefined' && hash[1] !== null) {
|
||||
url += '#' + hash[1];
|
||||
}
|
||||
return url;
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (typeof value !== 'undefined' && value !== null) {
|
||||
var separator = url.indexOf('?') !== -1 ? '&' : '?';
|
||||
hash = url.split('#');
|
||||
url = hash[0] + separator + key + '=' + value;
|
||||
if (typeof hash[1] !== 'undefined' && hash[1] !== null) {
|
||||
url += '#' + hash[1];
|
||||
}
|
||||
return url;
|
||||
}
|
||||
else {
|
||||
return url;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
keys = keys.split(',').map(element => element.trim());
|
||||
|
||||
return function (router, serviceData) {
|
||||
let url = window.location.href;
|
||||
|
||||
keys.map(key => {
|
||||
let value = getValue(key, 'param', serviceData);
|
||||
|
||||
if(!value) {
|
||||
// return;
|
||||
}
|
||||
|
||||
url = updateQueryString(key, (value ? value : null), url)
|
||||
});
|
||||
|
||||
console.log(url);
|
||||
//router.change(url, true);
|
||||
window.history.replaceState({}, '', url);
|
||||
}
|
||||
},
|
||||
|
||||
'trigger': function (events) {
|
||||
return function (document) {
|
||||
events = events.trim().split(',');
|
||||
|
|
@ -110,6 +165,35 @@
|
|||
return params;
|
||||
}
|
||||
|
||||
let getValue = function(key, prefix, data) {
|
||||
let result = null;
|
||||
|
||||
if(!key) {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Get from element data-param-* (expression supported)
|
||||
* 2. Get from element data-param-state-*
|
||||
* 3. Get from element form object-*
|
||||
*/
|
||||
if(element.dataset[prefix + key.charAt(0).toUpperCase() + key.slice(1)]) {
|
||||
result = expression.parse(element.dataset[prefix + key.charAt(0).toUpperCase() + key.slice(1)]);
|
||||
}
|
||||
|
||||
if(data[key]) {
|
||||
result = data[key];
|
||||
}
|
||||
|
||||
if(!result) {
|
||||
result = '';
|
||||
}
|
||||
|
||||
if (debug) console.log('%c[param resolved]: (' + service + ') ' + key + '=' + result, 'color:#808080');
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
let resolve = function(target, prefix = 'param', data = {}) {
|
||||
if (!target) {
|
||||
return function() {};
|
||||
|
|
@ -120,32 +204,7 @@
|
|||
if (debug) console.log('%c[form data]: ', 'color:green', data);
|
||||
|
||||
return target.apply(target, args.map(function(value) {
|
||||
let result = null;
|
||||
|
||||
if(!value) {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Get from element data-param-* (expression supported)
|
||||
* 2. Get from element data-param-state-*
|
||||
* 3. Get from element form object-*
|
||||
*/
|
||||
if(element.dataset[prefix + value.charAt(0).toUpperCase() + value.slice(1)]) {
|
||||
result = expression.parse(element.dataset[prefix + value.charAt(0).toUpperCase() + value.slice(1)]);
|
||||
}
|
||||
|
||||
if(data[value]) {
|
||||
result = data[value];
|
||||
}
|
||||
|
||||
if(!result) {
|
||||
result = '';
|
||||
}
|
||||
|
||||
if (debug) console.log('%c[param resolved]: (' + service + ') ' + value + '=' + result, 'color:#808080');
|
||||
|
||||
return result;
|
||||
return getValue(value, prefix, data);
|
||||
}));
|
||||
};
|
||||
|
||||
|
|
@ -196,6 +255,7 @@
|
|||
}
|
||||
|
||||
container.set(service.replace('.', '-'), data, true, true);
|
||||
container.set('serviceData', data, true, true);
|
||||
|
||||
if (debug) console.log('%cservice ready: "' + service.replace('.', '-') + '"', 'color:green');
|
||||
if (debug) console.log('%cservice:', 'color:blue', container.get(service.replace('.', '-')));
|
||||
|
|
@ -204,9 +264,12 @@
|
|||
container.resolve(resolve(callbacks[success[i]], 'successParam' + success[i].charAt(0).toUpperCase() + success[i].slice(1), {}));
|
||||
}
|
||||
|
||||
container.set('serviceData', null, true, true);
|
||||
|
||||
element.$lsSkip = false;
|
||||
|
||||
view.render(element);
|
||||
|
||||
}, function (exception) {
|
||||
if(loaderId !== null) { // Remove loader if needed
|
||||
alerts.remove(loaderId);
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
@config-color-fade: #9e9e9e;
|
||||
@config-color-border: #e6e6e6;
|
||||
@config-color-fade-light: #e2e2e2;
|
||||
@config-color-fade-super: #f9f9f9;
|
||||
@config-color-fade-super: #f1f3f5;
|
||||
@config-color-danger: #f53d3d;
|
||||
@config-color-success: #1bbf61;
|
||||
@config-color-warning: #ffed4d;
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ table {
|
|||
|
||||
thead {
|
||||
box-shadow: 0 0 2px rgba(0,0,0,.25);
|
||||
border-bottom: solid 1px #e7e7e7;
|
||||
border-bottom: solid 1px @config-color-fade-super;
|
||||
|
||||
th {
|
||||
position: sticky;
|
||||
|
|
@ -48,7 +48,7 @@ table {
|
|||
}
|
||||
|
||||
tr {
|
||||
border-bottom: solid 1px #e7e7e7;
|
||||
border-bottom: solid 1px @config-color-fade-super;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
|
|
@ -106,7 +106,7 @@ table {
|
|||
@media @phones, @tablets {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
border-top: solid 1px #e7e7e7;
|
||||
border-top: solid 1px @config-color-fade-super;
|
||||
padding-top: 12px;
|
||||
|
||||
thead, tbody, tr, td, th {
|
||||
|
|
|
|||
Loading…
Reference in a new issue