tablevu 0.2.3 → 0.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/array.js CHANGED
@@ -1 +1 @@
1
- export default function adapter(t,e){let a=e;if(t.filter||t.search){const r=t.cols.map((e,a)=>({index:a,searchable:null==q.searchable||1==q.searchable})).filter(e=>1==e.searchable).map(e=>e.index);0<r.length&&(t.filter||t.search)&&(t.filter,t.search)&&(a=a.filter(e=>Object.values(e).filter((e,a)=>-1<r.indexOf(a)).some(e=>-1<e.indexOf(t.search))))}if(t.sort&&0<t.sort.length)for(let e=t.sort.length-1;0<=e;e--){let r=t.sort[e];"desc"==r.dir?a.sort((e,a)=>e[r.name]<a[r.name]?1:a[r.name]<e[r.name]?-1:0):a.sort((e,a)=>e[r.name]>a[r.name]?1:a[r.name]>e[r.name]?-1:0)}return{rows:a=t.pageSize&&a.length>t.pageSize?a.filter((e,a,r)=>a>=t.pageSize*(t.currPage-1)&&a<t.pageSize*t.currPage):a,count:e.length}}
1
+ export default function(props,data){let d=[];if(Array.isArray(data))d=data;return new Promise((resolve,reject)=>{if(props.pageSize){d=d.slice((props.currPage-1)*props.pageSize,props.currPage*props.pageSize)}if(props.sort&&props.sort.length>0){for(let i=props.sort.length-1;i>=0;i--){let f=null;if(props.sort[i].index>-1)f=props.cols[props.sort[i].index].name;else f=props.sort[i].name;if(props.sort[i].dir=="desc")d.sort((a,b)=>a[f]<b[f]?1:b[f]<a[f]?-1:0);else d.sort((a,b)=>a[f]>b[f]?1:b[f]>a[f]?-1:0)}}resolve({rows:d,count:d.length})})}
package/dist/get.js CHANGED
@@ -1 +1 @@
1
- export default function get(n){return new Promise((o,t)=>{fetch(n).then(n=>n.json()).then(n=>{let t,e=0;n?(e=n.hasOwnProperty("value")?(t=n.value,n.hasOwnProperty("@count")?parseInt(n["@count"]):n.hasOwnProperty("count")?parseInt(n.count):0):(t=n,0),o({rows:t,count:e})):o({rows:null,count:null})}).catch(n=>{console.error(n),t(n)})})}
1
+ export default function get(url,options){return new Promise((resolve,reject)=>{fetch(url,options).then(res=>res.json()).then(res=>{let r;let c=0;if(res){if(res.hasOwnProperty("value")){r=res.value;if(res.hasOwnProperty("@count"))c=parseInt(res["@count"]);else if(res.hasOwnProperty("count"))c=parseInt(res["count"]);else c=0}else{r=res;c=0}resolve({rows:r,count:c})}else resolve({rows:null,count:null})}).catch(err=>{console.error(err);reject(err)})})}
package/dist/odata.js CHANGED
@@ -1 +1 @@
1
- import get from"./get.js";function filter(t){function r(e){return null===e?"null":"string"==typeof e?10==e.length&&"-"==e[4]&&"-"==e[7]&&Date.parse(e)?e:"'"+e+"'":"number"==typeof e?e:e.getMonth&&"function"==typeof e.getMonth?e.toISOString():e.func+"("+e.params.join(",")+")"}let n="";if(t&&t.filters)for(let e=0;e<t.filters.length;e++)0<e&&(n+=` ${t.type||"and"} `),t.filters[e].column?n="in"==t.filters[e].operator?n+r(t.filters[e].value)+" "+t.filters[e].operator+" "+t.filters[e].column:n+t.filters[e].column+" "+t.filters[e].operator+" "+r(t.filters[e].value):t.filters[e].func?n=n+t.filters[e].func+"("+t.filters[e].params.map(e=>r(e)).join(",")+")":t.filters[e]&&(n=n+"("+filter(t.filters[e])+")");return n}function sefs(e,t,n){let a="";if(t.select&&0<t.select.length&&(n?a+="$select="+t.select.join(","):e.searchParams.append("$select",t.select.join(","))),t.expand&&0<t.expand.length){let r=[];t.expand.forEach(e=>{var t=sefs(null,e,";");t?r.push(e.name+"("+t+")"):r.push(e.name)}),n?a+=(0<a.length?n:"")+"$expand="+r.join(","):e.searchParams.append("$expand",r.join(","))}return a}export default class odata{constructor(l,s,i){this.adapter=t=>{var e,r=new URL(l.url),n=(t.pageSize&&(r.searchParams.append("$skip",t.pageSize*(t.currPage-1)),r.searchParams.append("$top",t.pageSize)),sefs(r,s),[]);t.filter&&Object.prototype.hasOwnProperty.call(t.filter,"filters")&&(e=filter(t.filter))&&n.push(e),t.filter&&(e=filter(t.filter))&&n.push(e),t.search&&(e=t.cols.filter(e=>null==e.searchable||1==e.searchable).map(e=>"contains("+e.name.replaceAll(".","/")+",'"+t.search+"')").join(" or "))&&n.push("("+e+")"),n&&0<n.length&&r.searchParams.append("$filter",n.join(" and ")),t.sort&&0<t.sort.length&&r.searchParams.append("$orderby",t.sort.map(e=>{var t={index:-1,name:"",dir:null};return Object.prototype.hasOwnProperty.call(e,"index")?t.index=e.index:t.name=e.name,t.dir=e.dir,t}).map(e=>(-1<e.index?t.cols[e.index]:e).name.replaceAll(".","/")+(e.dir?" "+e.dir:"")).join(","));let a=null;return a=i&&i.onfetch&&"function"==typeof i.onfetch?i.onfetch(new Request(r,l)):new Request(r,l),get(a)}}}
1
+ import get from"./get.js";function filter(q){function fuval(q){if(q===null){return"null"}else if(typeof q==="string"){return"'"+q+"'"}else{if(typeof q==="number")return q;else{debugger;if(q.getMonth&&typeof q.getMonth==="function")return q.toISOString();else return q.func+"("+q.params.join(",")+")"}}}let s="";if(q&&q.filters)for(let i=0;i<q.filters.length;i++){if(i>0)s=s+` ${q.type||"and"} `;if(q.filters[i].column){if(q.filters[i].operator=="in")s=s+fuval(q.filters[i].value)+" "+q.filters[i].operator+" "+q.filters[i].column;else s=s+q.filters[i].column+" "+q.filters[i].operator+" "+fuval(q.filters[i].value)}else{if(q.filters[i].func)s=s+q.filters[i].func+"("+q.filters[i].params.map(m=>fuval(m)).join(",")+")";else if(q.filters[i])s=s+"("+filter(q.filters[i])+")"}}return s}export default class odata{constructor(url,options){this.adapter=props=>{const u=new URL(url);if(props.pageSize){u.searchParams.append("$skip",props.pageSize*(props.currPage-1));u.searchParams.append("$top",props.pageSize)}if(props.select&&props.select.length>0)u.searchParams.append("$select",props.select.join(","));if(props.expand&&props.expand.length>0)u.searchParams.append("$expand",props.expand.map(m=>m.name+(m.select&&m.select.length>0?"($select="+m.select.join(",")+")":"")).join(","));let f=[];if(props.filter&&Object.prototype.hasOwnProperty.call(props.filter,"filters")){let l=filter(props.filter);if(l)f.push(l)}if(props.filter){let l=filter(props.filter);if(l)f.push(l)}if(props.search){let l=props.cols.filter(q=>q.searchable==undefined||q.searchable==true).map(q=>"contains("+q.name.replaceAll(".","/")+",'"+props.search+"')").join(" or ");if(l)f.push("("+l+")")}if(f&&f.length>0)u.searchParams.append("$filter",f.join(" and "));if(props.sort&&props.sort.length>0)u.searchParams.append("$orderby",props.sort.map(m=>{let n={index:-1,name:"",dir:null};if(Object.prototype.hasOwnProperty.call(m,"index")){n.index=m.index}else{n.name=m.name}n.dir=m.dir;return n}).map(m=>{return(m.index>-1?props.cols[m.index].name:m.name)+(m.dir?" "+m.dir:"")}).join(","));if(props.count)u.searchParams.append("$count",true);return get(u,options)}}}
package/dist/table.js CHANGED
@@ -1 +1 @@
1
- import{h,onMounted,reactive,ref,watch}from"vue";import adaptarr from"./array.js";const tablevuStatuses={Error:-1,Ready:0,Loading:1},tablevu={props:{settings:{type:Object,default:null},data:{type:[Array,Function]},search:{type:String},filter:{type:[Array,Object]},command:{type:Array,default:[]},rowid:{type:String},onRowClick:{type:Function},onRowDblClick:{type:Function},class:{type:String,default:"table"},style:{type:String,default:null},buttonClass:{type:String,default:"btn"}},emits:["onRowClick","onRowDblClick"],setup(i,{emit:c}){let l=[],u=[],n=0;const p=reactive({adapter:null,group:{value:i.settings&&i.settings.group?i.settings.group.value:i.group||null,content:i.settings&&i.settings.group?i.settings.group.content:null,expandAll:!0,class:"table-light"},page:{count:0,size:i.settings&&i.settings.page?i.settings.page.size:0,current:0,type:null},footer:{button:{first:{visible:!0,content:null},prior:{visible:!0,content:null},next:{visible:!0,content:null},last:{visible:!0,content:null},page:{visible:!0,content:null},size:{visible:!0,content:null},class:"btn"}},sort:i.settings&&i.settings.sort?i.settings.sort:[],columns:i.settings&&i.settings.columns?i.settings.columns:[],onRowClick:i.settings.onRowClick||i.onRowClick,onRowDblClick:i.settings.onRowDblClick||i.onRowDblClick});function r(){m(1)}function a(){1<p.page.current?m(p.page.current-1):m(p.page.current)}function s(){m(p.page.current+1)}function d(){m(p.page.count)}function o(){m(p.page.current)}function g(e,t){var n;p.sort&&0<p.sort.length?(0==(n=p.sort.findIndex(t=>t.index==e))?p.sort[n].dir=t||(p.sort[0].dir?null:"desc"):0<n&&p.sort.splice(n,1),0!=n&&p.sort.unshift({index:e,dir:t||null}),2<p.sort.length&&p.sort.pop()):p.sort.push({index:e,dir:t||null}),m(p.page.current)}function m(e){let t=null;i.data&&(Array.isArray(i.data)&&(t=i.data),p.status=tablevuStatuses.Loading,p.adapter)&&p.adapter({pageSize:p.page.size,currPage:e,sort:p.sort,cols:p.columns,filter:p.filter,search:p.search},t).then(t=>{u=p.onData?p.onData(t.rows):t.rows,n=t.count,p.group&&("string"==typeof p.group||"bigint"==typeof p.group||"object"==typeof p.group&&p.group.value)&&(l=function(o,l){var r=[];for(let n=0;n<l.length;n++){let e=null,t=null;var a=l[n],s=(o.value?e="function"==typeof o.value?o.value(a):a[o.value]:"function"==typeof o?e=o(a):"bigint"==typeof o||"number"==typeof o?(s=parseInt(o))&&(e=a[s]):"string"==typeof o&&(e=a[o]),o.content&&(t="function"==typeof o.content?o.content(a):a[o.content]),r.findIndex(t=>t.group==e));-1<s?r[s].rows.push(a):r.push({group:e,content:t,expand:p.group.expandAll,rows:[a]})}return r}(p.group,u)),p.page.count=0<t.count&&0<p.page.size?t.count/p.page.size:0,p.page.current=e,p.status=tablevuStatuses.Ready,p.time=Date.now()})}function f(t,e){var n={style:{}},t=(t.colspan&&1<t.colspan&&(n.colspan=t.colspan),t.align&&(n.style["text-align"]=t.align),t.width&&(n.style["max-width"]=t.width),t.color&&(n.style.color=t.color),t.backgroundColor&&(n.style["background-color"]=t.backgroundColor),function(e,n){if(n){let t;var o;return t="datetime"==e.type||"date"==e.type||"time"==e.type?(o=new Date(n),"date"==e.type?o.toLocaleDateString():"time"==e.type?o.toLocaleTimeString():o.toLocaleString()):"numeric"==e.type?parseFloat(n):"integer"==e.type?parseInt(n):n}return""}(t,e));return h("td",n,t)}function y(t,n){var o,l,r,e={},a=[];e.key=t,e.index=t,i.rowid&&(e.rowid=n[i.rowid]);for(let t=0;t<p.columns.length;t+=1){let e;var s=p.columns[t];if(s.render)e=(l=n,void 0,r={style:{}},(o=s).colspan&&1<o.colspan&&(r.colspan=o.colspan),o.align&&(r.style["text-align"]=o.align),o.width&&(r.style["max-width"]=o.width),o=o.render(l),h("td",r,o)),a.push(e);else{if(s.depth){e=n;for(let t=0;t<s.depth.length;t+=1)e=e&&e[s.depth[t]]}else e=n[s.name];a.push(f(s,e))}}return e.ondblclick=t=>{var e=u[t.currentTarget.attributes.index.value];c("onRowDblClick",t,e)},i.onRowClick&&(e.onClick=t=>{var e=u[t.currentTarget.attributes.index.value];i.onRowClick(t,e)}),h("tr",e,a)}i.data&&(Array.isArray(i.data)?p.adapter=adaptarr:p.adapter=i.data),i.filter&&(p.filter=i.filter),watch(()=>i.filter,(t,e)=>{p.filter=t||null,o()},{deep:!0}),watch(()=>i.search,(t,e)=>{p.timer&&clearTimeout(p.timer),(e&&e.length>(i.data.searchMinChar||3)&&(null==t||t.length<=(i.data.searchMinChar||3))||t&&t.length>(i.data.searchMinChar||3))&&(p.timer=setTimeout(()=>{i.search&&i.search.length>(i.data.searchMinChar||3)?p.search=i.search:p.search=null,o()},444))}),watch(()=>i.command,(t,e)=>{t&&0<t.length&&((t=i.command[t.length-1])&&t.name&&("refresh"==t.name.toLowerCase()?o():"first"==t.name.toLowerCase()?r():"prior"==t.name.toLowerCase()?a():"next"==t.name.toLowerCase()?s():"last"==t.name.toLowerCase()?d():console.log("Unknown command")),i.command.length=0)},{deep:!0}),0==p.columns.length&&alert("Columns not defined !");for(let t=0;t<p.columns.length;t++)p.columns[t].name&&-1<p.columns[t].name.indexOf(".")&&(p.columns[t].depth=p.columns[t].name.split("."));return m(1),onMounted(()=>{console.log("tablevu.mounted")}),{spec:p,renderHeader:function(){var o=[];let l=1;for(let n=0;n<p.columns.length;n+=1)if(1<l)l--;else{var r=[],a=(p.columns[n].label?r.push(h("span",p.columns[n].label)):r.push(h("span",p.columns[n].name)),p.sort&&0<p.sort.length&&p.sort[0].index==n&&("desc"==p.sort[0].dir?r.push(h("span",{style:{float:"right"}},"▼")):r.push(h("span",{style:{float:"right"}},"▲"))),{position:"relative"}),s=(p.columns[n].width&&(a.width=p.columns[n].width,a.minWidth=p.columns[n].width,a.maxWidth=p.columns[n].width),{display:"block","font-weight":500,textDecoration:"none",color:"black",textAlign:"center"});p.columns[n].header&&(p.columns[n].header.colspan&&(l=parseInt(p.columns[n].header.colspan)||1),p.columns[n].header.align&&(s.textAlign=p.columns[n].header.align),p.columns[n].header.backgroundColor&&(a.backgroundColor=p.columns[n].header.backgroundColor),p.columns[n].header.color)&&(s.color=p.columns[n].header.color);let t,e;if(p.columns[n].popup){const c=ref(null);var i=[h("a",{href:"#",onClick(t){g(n),t.preventDefault()},style:{display:"block",textDecoration:"none",color:"black",fontWeight:"initial",padding:".25rem"}},"Order by Ascending"),h("a",{href:"#",onClick(t){g(n,"desc"),t.preventDefault()},style:{display:"block",textDecoration:"none",color:"black",fontWeight:"initial",padding:".25rem"}},"Order by Descending")];t=h("a",{href:"#",onClick(t){c.value&&c.value.style&&c.value.style.display&&"block"==c.value.style.display?c.value.style.display="none":c.value.style.display="block",t.preventDefault()},style:s},r),e=h("div",{ref:c,style:{position:"absolute",display:"none",width:p.columns[n].width||"12rem",height:"fit-content",border:"1px solid lightgray",backgroundColor:"whitesmoke",zIndex:1,left:0,top:"2rem",bottom:0,right:0,padding:".25rem"}},i)}else t=h("a",{href:"#",onClick(t){g(n),t.preventDefault()},style:s},r);p.columns[n].filter,o.push(h("th",{colspan:1<l?l:null,style:a},[t,e]))}return[h("tr",{},o)]},renderBody:function(){var n=[];if(l&&0<l.length){let e=0;for(let t=0;t<l.length;t+=1){var o=l[t];if(n.push(function(e){var t=h("button",{title:e.expand,onClick:t=>{console.log(e.expand),e.expand=!e.expand,t.currentTarget.value=e.expand?"▼":"►",p.time=Date.now(),t.preventDefault()},style:{padding:0,margin:"0 6px 0 0",width:"12px",height:"100%",border:"none",outline:0,backgroundColor:"transparent"}},e.expand?"▼":"►"),n=e.content||e.group;return h("tr",{},h("td",{colspan:p.columns.length,class:p.group.class},[t,n]))}(o)),o.expand&&o.rows&&0<o.rows.length)for(let t=0;t<o.rows.length;t+=1)n.push(y(e,o.rows[t])),e++}}else if(u&&0<u.length)for(let t=0;t<u.length;t+=1)n.push(y(t,u[t]));return n},renderFooter:function(){var t=h("button",{class:p.footer.button.class,style:"margin-right: .5rem",onClick:r,disabled:1==p.page.current},"◀◀"),e=h("button",{class:p.footer.button.class,style:"margin-right: .5rem",onClick:d,disabled:0<p.page.count},"▶▶"),n=h("button",{class:p.footer.button.class,style:"margin-right: .5rem"},p.page.current),o=h("button",{class:p.footer.button.class,style:"margin-right: .5rem",onClick:a,disabled:1==p.page.current},"◀"),l=h("button",{class:p.footer.button.class,style:"margin-right: .5rem",onClick:s,disabled:0<p.page.count&&p.page.current==p.page.count},"▶"),t=h("td",{colspan:p.columns.length,align:"center"},[t,o,n,l,e]);return[h("tr",{},[t])]},renderCaption:function(){return null}}},render(t){console.log("tablevu.render",this.spec.status);var e={class:"tablevu"},t=(t.class&&(e.class="tablevu "+t.class),t.style&&(e.style=t.style),[]);return t.push(h("thead",{},this.renderHeader())),this.spec.status==tablevuStatuses.Ready&&t.push(h("tbody",{"data-time":this.spec.time},this.renderBody())),this.spec.caption&&t.push(h("caption",{},this.renderCaption())),0<this.spec.page.size&&t.push(h("tfoot",{},this.renderFooter())),h("table",e,t)}};export default tablevu;
1
+ import{h,onMounted,reactive,ref,watch,isReactive,isRef}from"vue";import adaptarr from"./array.js";const tablevuStatuses={Error:-1,Ready:0,Loading:1};const tablevu={props:{settings:{type:Object,default:null},data:{type:[Array,Function]},group:{type:[String,Object]},search:{type:String},filter:{type:[Array,Object]},command:{type:Array,default:[]},rowid:{type:String},onRowClick:{type:Function},onRowDblClick:{type:Function},class:{type:String,default:"table"},style:{type:String,default:null}},emits:["onRowClick","onRowDblClick"],setup(props,{attrs,slots,emit,expose}){let rows=[];let rowg=[];let grps=[];let adapter=null;let timer=null;let events={rowClick:props.settings.onRowClick||props.onRowClick,rowDblClick:props.settings.onRowDblClick||props.onRowDblClick};const spec=reactive({caption:null,group:{value:props.settings&&props.settings.group?props.settings.group.value:props.group?props.group:null,content:props.settings&&props.settings.group?props.settings.group.content:null,expandAll:true,class:"table-light"},page:{count:0,size:props.settings&&props.settings.page?props.settings.page.size:0,current:0,type:null},sort:props.settings&&props.settings.sort?props.settings.sort:[],columns:props.settings&&props.settings.columns?props.settings.columns:[],footer:{button:{class:"btn"}}});if(props.data){if(Array.isArray(props.data)){adapter=adaptarr}else{adapter=props.data}}if(props.filter)spec.filter=props.filter;if(isRef(props.search)||isReactive(props.search))watch(()=>props.search,(n,o)=>{const x=parseInt(props.settings.searchMinChar)||3;if(timer)clearTimeout(timer);if(o&&o.length>x&&(n==undefined||n==null||n.length<=x)||n&&n.length>x){timer=setTimeout(()=>{if(n&&n.length>x)spec.search=props.search;else spec.search=null;refresh()},444)}});if(props.filter)spec.filter=props.filter;if(isRef(props.filter)||isReactive(props.filter))watch(()=>props.filter,()=>{if(props.filter)spec.filter=props.filter;else spec.filter=null;refresh()},{deep:true});if(isRef(props.command)||isReactive(props.command))watch(()=>props.command,(n,o)=>{if(n&&n.length>0){const c=props.command[n.length-1];if(c&&c.name){if(c.name.toLowerCase()=="refresh")refresh();else if(c.name.toLowerCase()=="first")first();else if(c.name.toLowerCase()=="prior")prior();else if(c.name.toLowerCase()=="next")next();else if(c.name.toLowerCase()=="last")last();else console.log("Unknown command")}props.command.length=0}},{deep:true});function prepareGroup(g,r){grps=[];rowg=[];for(let i=0;i<r.length;i++){let v=null;let c=null;const o=r[i];if(g.value){if(typeof g.value=="function")v=g.value(o);else v=o[g.value]}else if(typeof g=="function")v=g(o);else{if(typeof g=="bigint"||typeof g=="number"){const l=parseInt(g);if(l)v=o[l]}else if(typeof g=="string")v=o[g]}if(g.content){if(typeof g.content=="function")c=g.content(o);else c=o[g.content]}let n=grps.findIndex(f=>f.group==v);if(n==-1){n=grps.push({group:v,content:c,expand:spec.group.expandAll})-1}rowg.push(n)}}function first(){page(1)}function prior(){if(spec.page.current>1){page(spec.page.current-1)}else{page(spec.page.current)}}function next(){page(spec.page.current+1)}function last(){page(spec.page.count)}function refresh(){page(spec.page.current)}function orderby(ind,dir){if(spec.sort&&spec.sort.length>0){let l=spec.sort.findIndex(f=>f.index==ind);if(l<0){let n=spec.columns[ind].name;l=spec.sort.findIndex(f=>f.name==n)}if(l==0){spec.sort[l].dir=dir?dir:spec.sort[0].dir?null:"desc"}else if(l>0){spec.sort.splice(l,1)}if(l!=0){spec.sort.unshift({index:ind,dir:dir?dir:null})}if(spec.sort.length>2){spec.sort.pop()}}else{spec.sort.push({index:ind,dir:dir?dir:null})}page(spec.page.current)}function page(currentPage){let dat=null;if(props.data){if(Array.isArray(props.data))dat=props.data}else return;spec.status=tablevuStatuses.Loading;if(adapter){adapter({pageSize:spec.page.size,currPage:currentPage,sort:spec.sort,cols:spec.columns,filter:spec.filter,search:spec.search},dat).then(ada=>{if(spec.onData)rows=spec.onData(ada.rows);else rows=ada.rows;if(spec.group&&(typeof spec.group=="string"||typeof spec.group=="bigint"||typeof spec.group=="object"&&spec.group.value))prepareGroup(spec.group,rows);spec.page.count=ada.count>0&&spec.page.size>0?ada.count/spec.page.size:0;spec.page.current=currentPage;spec.status=tablevuStatuses.Ready;spec.time=Date.now()})}}function renderValue(col,val){if(val){let v;if(col.type=="datetime"||col.type=="date"||col.type=="time"){let t=new Date(val);if(col.type=="date")v=t.toLocaleDateString();else if(col.type=="time")v=t.toLocaleTimeString();else v=t.toLocaleString()}else{if(col.type=="numeric"){v=parseFloat(val)}else{if(col.type=="integer"){v=parseInt(val)}else v=val}}return v}else return""}function renderCell(col,val){const o={style:{}};if(col.colspan&&col.colspan>1){o.colspan=col.colspan}if(col.align){o.style["text-align"]=col.align}if(col.width){o.style["max-width"]=col.width}if(col.color){o.style["color"]=col.color}if(col.backgroundColor){o.style["background-color"]=col.backgroundColor}const v=renderValue(col,val);return h("td",o,v)}function renderCustomCell(col,row){const o={style:{}};if(col.colspan&&col.colspan>1){o.colspan=col.colspan}if(col.align){o.style["text-align"]=col.align}if(col.width){o.style["max-width"]=col.width}let f=col.render(row);return h("td",o,f)}function renderGroup(grp){const b=h("button",{title:grp.expand,onClick:event=>{grp.expand=grp.expand?false:true;event.currentTarget.value=grp.expand?"▼":"►";spec.time=Date.now();event.preventDefault()},style:{padding:0,margin:"0 6px 0 0",width:"12px",height:"100%",border:"none",outline:0,backgroundColor:"transparent"}},grp.expand?"▼":"►");const v=grp.content||grp.group;return h("tr",{},h("td",{colspan:spec.columns.length,class:spec.group.class},[b,v]))}function renderRow(index,row){const o={};const r=[];o.key=index;o.index=index;if(props.rowid){o.rowid=row[props.rowid]}for(let i=0;i<spec.columns.length;i+=1){let v;const c=spec.columns[i];if(c.render){v=renderCustomCell(c,row);r.push(v)}else{if(c.depth){v=row;for(let j=0;j<c.depth.length;j+=1){if(v)v=v[c.depth[j]]}}else{v=row[c.name]}r.push(renderCell(c,v))}}o.ondblclick=event=>{const r=rows[event.currentTarget.attributes.index.value];emit("onRowDblClick",event,r)};if(props.onRowClick){o.onClick=event=>{const r=rows[event.currentTarget.attributes.index.value];props.onRowClick(event,r)}}return h("tr",o,r)}function renderHeader(){let ar=[];let sp=1;for(let i=0;i<spec.columns.length;i+=1){if(sp>1){sp--;continue}const cl=[];if(spec.columns[i].label){cl.push(h("span",spec.columns[i].label))}else{cl.push(h("span",spec.columns[i].name))}if(spec.sort&&spec.sort.length>0&&spec.sort[0].index==i){if(spec.sort[0].dir=="desc")cl.push(h("span",{style:{float:"right"}},"▼"));else cl.push(h("span",{style:{float:"right"}},"▲"))}let ch={position:"relative"};if(spec.columns[i].width){ch.width=spec.columns[i].width;ch.minWidth=spec.columns[i].width;ch.maxWidth=spec.columns[i].width}let cy={display:"block","font-weight":500,textDecoration:"none",color:"black",textAlign:"center"};if(spec.columns[i].header){if(spec.columns[i].header.colspan)sp=parseInt(spec.columns[i].header.colspan)||1;if(spec.columns[i].header.align)cy.textAlign=spec.columns[i].header.align;if(spec.columns[i].header.backgroundColor)ch.backgroundColor=spec.columns[i].header.backgroundColor;if(spec.columns[i].header.color)cy.color=spec.columns[i].header.color}let a;let f;if(spec.columns[i].popup){const r=ref(null);let c=[h("a",{href:"#",onClick(event){orderby(i);event.preventDefault()},style:{display:"block",textDecoration:"none",color:"black",fontWeight:"initial",padding:".25rem"}},"Order by Ascending"),h("a",{href:"#",onClick(event){orderby(i,"desc");event.preventDefault()},style:{display:"block",textDecoration:"none",color:"black",fontWeight:"initial",padding:".25rem"}},"Order by Descending")];a=h("a",{href:"#",onClick(event){if(r.value&&r.value.style&&r.value.style.display&&r.value.style.display=="block")r.value.style.display="none";else r.value.style.display="block";event.preventDefault()},style:cy},cl);f=h("div",{ref:r,style:{position:"absolute",display:"none",width:spec.columns[i].width||"12rem",height:"fit-content",border:"1px solid lightgray",backgroundColor:"whitesmoke",zIndex:1,left:0,top:"2rem",bottom:0,right:0,padding:".25rem"}},c)}else a=h("a",{href:"#",onClick(event){orderby(i);event.preventDefault()},style:cy},cl);if(spec.columns[i].filter){}ar.push(h("th",{colspan:sp>1?sp:null,style:ch},[a,f]))}const tr=h("tr",{},ar);return[tr]}function renderBody(){const dr=[];if(rows&&rows.length>0){if(grps&&grps.length>0){let r=[];for(let g=0;g<grps.length;g++)r.push({index:g,childs:[]});for(let i=0;i<rows.length;i++){const x=rowg[i];r[x].childs.push(renderRow(i,rows[i]))}for(let g=0;g<grps.length;g++){dr.push(renderGroup(grps[g]));if(grps[g].expand)dr.push(r[g].childs)}}else{for(let i=0;i<rows.length;i++){dr.push(renderRow(i,rows[i]))}}}return dr}function renderFooter(){const fr=h("button",{class:spec.footer.button.class,style:"margin-right: .5rem",onClick:first,disabled:spec.page.current==1},"◀◀");const ls=h("button",{class:spec.footer.button.class,style:"margin-right: .5rem",onClick:last,disabled:spec.page.count>0},"▶▶");const pg=h("button",{class:spec.footer.button.class,style:"margin-right: .5rem"},spec.page.current);const pr=h("button",{class:spec.footer.button.class,style:"margin-right: .5rem",onClick:prior,disabled:spec.page.current==1},"◀");const nx=h("button",{class:spec.footer.button.class,style:"margin-right: .5rem",onClick:next,disabled:spec.page.count>0&&spec.page.current==spec.page.count},"▶");const td=h("td",{colspan:spec.columns.length,align:"center"},[fr,pr,pg,nx,ls]);const tr=h("tr",{},[td]);return[tr]}function renderCaption(){return null}if(spec.columns.length==0){alert("Columns not defined !")}for(let i=0;i<spec.columns.length;i++)if(spec.columns[i].name&&spec.columns[i].name.indexOf(".")>-1){spec.columns[i].depth=spec.columns[i].name.split(".")}page(1);onMounted(()=>{});return{spec:spec,renderHeader:renderHeader,renderBody:renderBody,renderFooter:renderFooter,renderCaption:renderCaption}},render(props){let prps={class:"tablevu"};if(props.class)prps.class="tablevu "+props.class;if(props.style)prps.style=props.style;let cntn=[];cntn.push(h("thead",{},this.renderHeader()));if(this.spec.status==tablevuStatuses.Ready)cntn.push(h("tbody",{"data-time":this.spec.time},this.renderBody()));if(this.spec.caption)cntn.push(h("caption",{},this.renderCaption()));if(this.spec.page.size>0)cntn.push(h("tfoot",{},this.renderFooter()));return h("table",prps,cntn)}};export default tablevu;
package/dist/webapi.js CHANGED
@@ -1 +1 @@
1
- import get from"./get.js";export default class webapi{constructor(t,e,n){this.adapter=a=>{var e=new URL(t.url);a.pageSize&&(e.searchParams.append("skip",a.pageSize*(a.currPage-1)),e.searchParams.append("top",a.pageSize)),a.search&&e.searchParams.append("search",a.search),a.sort&&0<a.sort.length&&e.searchParams.append("orderby",a.sort.map(e=>{var a={index:-1,name:""};return Object.prototype.hasOwnProperty.call(e,"index")?a.index=e.index:a.name=e.name,a}).map(e=>(-1<e.index?a.cols[e.index]:e).name));let r=null;return r=n&&n.onfetch&&"function"==typeof n.onfetch?n.onfetch(new Request(e,t)):new Request(e,t),get(r)}}}
1
+ import get from"./get.js";export default class webapi{constructor(req,data,events){this.adapter=props=>{const u=new URL(req.url);if(props.pageSize){u.searchParams.append("skip",props.pageSize*(props.currPage-1));u.searchParams.append("top",props.pageSize)}if(props.search)u.searchParams.append("search",props.search);if(props.sort&&props.sort.length>0){u.searchParams.append("orderby",props.sort.map(m=>{let n={index:-1,name:""};if(Object.prototype.hasOwnProperty.call(m,"index")){n.index=m.index}else{n.name=m.name}return n}).map(m=>{return m.index>-1?props.cols[m.index].name:m.name}))}let r=null;if(events&&events.onfetch&&typeof events.onfetch=="function")r=events.onfetch(new Request(u,req));else r=new Request(u,req);return get(r)}}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tablevu",
3
- "version": "0.2.3",
3
+ "version": "0.2.6",
4
4
  "description": "vue 3 data table",
5
5
  "main": "index.js",
6
6
  "directories": {
package/src/array.js CHANGED
@@ -1,5 +1,40 @@
1
+ export default function (props, data) {
2
+ let d = [];
3
+
4
+ if (Array.isArray(data))
5
+ d = data;
6
+
7
+ return new Promise((resolve, reject) => {
8
+ // Paging //
9
+ if (props.pageSize) {
10
+ d = d.slice((props.currPage - 1) * props.pageSize, props.currPage * props.pageSize);
11
+ }
12
+
13
+ // Sort //
14
+ if (props.sort && props.sort.length > 0) {
15
+ for (let i = props.sort.length - 1; i >= 0; i--) {
16
+ let f = null;
17
+
18
+ if (props.sort[i].index > -1)
19
+ f = props.cols[props.sort[i].index].name;
20
+ else
21
+ f = props.sort[i].name;
22
+
23
+ if (props.sort[i].dir == 'desc')
24
+ d.sort((a,b) => (a[f] < b[f]) ? 1 : ((b[f] < a[f]) ? -1 : 0));
25
+ else
26
+ d.sort((a,b) => (a[f] > b[f]) ? 1 : ((b[f] > a[f]) ? -1 : 0));
27
+ }
28
+ };
29
+
30
+
31
+ resolve({ rows: d, count: d.length })
32
+ })
33
+ }
34
+ /*
1
35
  export default function adapter(params, data) {
2
- let rsl = data;
36
+ debugger;
37
+ const rsl = data;
3
38
 
4
39
  // Filter & Search //
5
40
  if (params.filter || params.search) {
@@ -40,3 +75,4 @@ export default function adapter(params, data) {
40
75
 
41
76
  return { rows: rsl, count: data.length };
42
77
  }
78
+ */
package/src/get.js CHANGED
@@ -1,6 +1,6 @@
1
- export default function get(req) {
1
+ export default function get(url, options) {
2
2
  return new Promise((resolve, reject) => {
3
- fetch(req).then(res => res.json()).then(res => {
3
+ fetch(url, options).then(res => res.json()).then(res => {
4
4
  let r;
5
5
  let c = 0;
6
6
 
package/src/odata.js CHANGED
@@ -6,14 +6,12 @@ function filter(q) {
6
6
  if (q === null) {
7
7
  return 'null'
8
8
  } else if (typeof(q) === 'string') {
9
- if (q.length == 10 && q[4] == '-' && q[7] == '-' && Date.parse(q)) { // input date return iso string
10
- return q;
11
- } else
12
- return '\'' + q + '\'';
9
+ return '\'' + q + '\'';
13
10
  } else {
14
11
  if (typeof(q) === 'number')
15
12
  return q;
16
13
  else {
14
+ debugger;
17
15
  if (q.getMonth && typeof q.getMonth === "function")
18
16
  return q.toISOString()
19
17
  else
@@ -46,59 +44,25 @@ function filter(q) {
46
44
  return s;
47
45
  }
48
46
 
49
- function sefs(url, query, seperator) {
50
- let r = '';
51
-
52
- if (query.select && query.select.length > 0) {
53
- if (seperator)
54
- r += '$select=' + query.select.join(',');
55
- else
56
- url.searchParams.append('$select', query.select.join(','));
57
- };
58
-
59
- if (query.expand && query.expand.length > 0) {
60
- let a = [];
61
-
62
- query.expand.forEach(e => {
63
- let q = sefs(null, e, ';');
64
-
65
- if (q)
66
- a.push(e.name + '(' + q + ')');
67
- else
68
- a.push(e.name);
69
- });
70
-
71
- if (seperator)
72
- r += (r.length > 0 ? seperator: '') + '$expand=' + a.join(',');
73
- else
74
- url.searchParams.append('$expand', a.join(','));
75
- };
76
-
77
- return r;
78
- }
79
-
80
47
  export default class odata {
81
- constructor(req, data, events) {
48
+ constructor(url, options) {
82
49
  this.adapter = (props) => {
83
- const u = new URL(req.url);
50
+ const u = new URL(url);
84
51
 
85
52
  // Paging //
86
53
  if (props.pageSize) {
87
54
  u.searchParams.append('$skip', props.pageSize * (props.currPage - 1));
88
55
  u.searchParams.append('$top', props.pageSize);
89
56
  }
90
-
91
- sefs(u, data);
92
- /*
57
+
93
58
  // Select //
94
- if (data.select && data.select.length > 0)
95
- u.searchParams.append('$select', data.select.join(','));
59
+ if (props.select && props.select.length > 0)
60
+ u.searchParams.append('$select', props.select.join(','));
96
61
 
97
62
  // Expand //
98
- if (data.expand && data.expand.length > 0) {
99
- const a =
100
- u.searchParams.append('$expand', data.expand.map(m => m.name + ((m.select && m.select.length > 0) ? '($select=' + m.select.join(',') + ')' : '')).join(','));
101
- }*/
63
+ if (props.expand && props.expand.length > 0)
64
+ u.searchParams.append('$expand', props.expand.map(m => m.name + ((m.select && m.select.length > 0) ? '($select=' + m.select.join(',') + ')' : '')).join(','));
65
+
102
66
  // Filter //
103
67
  let f = [];
104
68
 
@@ -124,18 +88,16 @@ export default class odata {
124
88
 
125
89
  if (f && f.length > 0)
126
90
  u.searchParams.append('$filter', f.join(' and '));
127
-
91
+
128
92
  // Sort //
129
93
  if (props.sort && props.sort.length > 0)
130
- u.searchParams.append('$orderby', props.sort.map(m => { let n = { index: -1, name: '', dir: null }; if (Object.prototype.hasOwnProperty.call(m, 'index')) { n.index = m.index } else { n.name = m.name }; n.dir = m.dir; return n; }).map(m => { return (m.index > -1 ? props.cols[m.index].name : m.name).replaceAll('.', '/') + (m.dir ? (' ' + m.dir): '') }).join(','));
94
+ u.searchParams.append('$orderby', props.sort.map(m => { let n = { index: -1, name: '', dir: null }; if (Object.prototype.hasOwnProperty.call(m, 'index')) { n.index = m.index } else { n.name = m.name }; n.dir = m.dir; return n; }).map(m => { return (m.index > -1 ? props.cols[m.index].name : m.name) + (m.dir ? (' ' + m.dir): '') }).join(','));
131
95
 
132
- let r = null;
133
- if (events && events.onfetch && typeof events.onfetch == 'function')
134
- r = events.onfetch(new Request(u, req))
135
- else
136
- r = new Request(u, req);
96
+ // Count //
97
+ if (props.count)
98
+ u.searchParams.append('$count', true);
137
99
 
138
- return get(r);
100
+ return get(u, options);
139
101
  }
140
102
  }
141
103
  }
package/src/table.js CHANGED
@@ -5,7 +5,7 @@
5
5
  * https://github.com/endb/tablevu/LICENCE
6
6
  */
7
7
 
8
- import { h, onMounted, reactive, ref, watch } from 'vue';
8
+ import { h, onMounted, reactive, ref, watch, isReactive, isRef } from 'vue';
9
9
  import adaptarr from './array.js';
10
10
 
11
11
  const tablevuStatuses = { Error: -1, Ready: 0, Loading: 1 };
@@ -14,7 +14,7 @@ const tablevu = {
14
14
  props: {
15
15
  settings: { type: Object, default: null },
16
16
  data: { type: [Array, Function] },
17
- //group: { type: Object, default: { value: null, expandAll: true, class: 'table-light' } },
17
+ group: { type: [String, Object] },
18
18
  search: { type: String },
19
19
  filter: { type: [Array, Object] },
20
20
  command: { type: Array, default: [] },
@@ -22,19 +22,26 @@ const tablevu = {
22
22
  onRowClick: { type: Function },
23
23
  onRowDblClick: { type: Function },
24
24
  class: { type: String, default: 'table' },
25
- style: { type: String, default: null },
26
- buttonClass: { type: String, default: 'btn' }
25
+ style: { type: String, default: null }
27
26
  },
28
27
 
29
28
  emits: ['onRowClick', 'onRowDblClick'],
30
29
 
31
30
  setup(props, { attrs, slots, emit, expose }) {
32
- let grps = [];
33
31
  let rows = [];
34
- let count = 0;
32
+ let rowg = [];
33
+ let grps = [];
34
+
35
+ let adapter = null;
36
+ let timer = null;
37
+
38
+ let events = {
39
+ rowClick: props.settings.onRowClick || props.onRowClick,
40
+ rowDblClick: props.settings.onRowDblClick || props.onRowDblClick
41
+ };
35
42
 
36
43
  const spec = reactive({
37
- adapter: null,
44
+ caption: null,
38
45
  group: {
39
46
  value: (props.settings && props.settings.group) ? props.settings.group.value : props.group ? props.group: null, // string ise alan adı, int ise index, fonksiyon ise calistirip alacak.
40
47
  content: (props.settings && props.settings.group) ? props.settings.group.content : null, // grid de ne gosterilecek
@@ -47,75 +54,78 @@ const tablevu = {
47
54
  current: 0,
48
55
  type: null // incrementral, dynamic
49
56
  },
57
+ sort: (props.settings && props.settings.sort) ? props.settings.sort : [],
58
+ columns: (props.settings && props.settings.columns) ? props.settings.columns : [],
50
59
  footer: {
51
60
  button: {
52
- first: { visible: true, content: null },
53
- prior: { visible: true, content: null },
54
- next: { visible: true, content: null },
55
- last: { visible: true, content: null },
56
- page: { visible: true, content: null },
57
- size: { visible: true, content: null },
58
61
  class: 'btn'
59
62
  }
60
- },
61
- sort: (props.settings && props.settings.sort) ? props.settings.sort : [],
62
- columns: (props.settings && props.settings.columns) ? props.settings.columns : [],
63
- onRowClick: props.settings.onRowClick || props.onRowClick,
64
- onRowDblClick: props.settings.onRowDblClick || props.onRowDblClick,
63
+ }
65
64
  });
66
65
 
67
66
  if (props.data) {
68
67
  if (Array.isArray(props.data)) {
69
- spec.adapter = adaptarr;
68
+ adapter = adaptarr;
70
69
  }
71
70
  else {
72
- spec.adapter = props.data;
71
+ adapter = props.data;
73
72
  }
74
73
  };
75
74
 
76
- // Setup dynamic filter //
75
+ // Setup Search Input //
77
76
  if (props.filter)
78
77
  spec.filter = props.filter;
79
78
 
80
- watch(() => props.filter, (n, o) => {
81
- if (n)
82
- spec.filter = n;
83
- else
84
- spec.filter = null;
79
+ if (isRef(props.search) || isReactive(props.search))
80
+ watch(() => props.search, (n,o) => {
81
+ const x = parseInt(props.settings.searchMinChar) || 3;
85
82
 
86
- refresh();
87
- }, { deep: true });
83
+ if (timer)
84
+ clearTimeout(timer);
88
85
 
89
- // Setup Search Input //
90
- watch(() => props.search, (n,o) => {
91
- if (spec.timer)
92
- clearTimeout(spec.timer);
86
+ if ((o && o.length > x && (n == undefined || n == null || n.length <= x)) || (n && n.length > x)) {
87
+ timer = setTimeout(() => { if (n && n.length > x) spec.search = props.search; else spec.search = null; refresh(); }, 444);
88
+ }
89
+ });
93
90
 
94
- if ((o && o.length > (props.data.searchMinChar || 3) && (n == undefined || n == null || n.length <= (props.data.searchMinChar || 3))) || (n && n.length > (props.data.searchMinChar || 3))) {
95
- spec.timer = setTimeout(() => { if (props.search && props.search.length > (props.data.searchMinChar || 3)) spec.search = props.search; else spec.search = null; refresh(); }, 444);
96
- }
97
- });
91
+ // Setup dynamic filter //
92
+ if (props.filter)
93
+ spec.filter = props.filter;
94
+
95
+ if (isRef(props.filter) || isReactive(props.filter))
96
+ watch(() => props.filter, () => {
97
+ if (props.filter)
98
+ spec.filter = props.filter;
99
+ else
100
+ spec.filter = null;
101
+
102
+ refresh();
103
+ }, { deep: true });
98
104
 
99
105
  // Setup commands //
100
- watch(() => props.command, (n,o) => {
101
- if (n && n.length > 0) {
102
- const c = props.command[n.length-1];
103
-
104
- if (c && c.name) {
105
- if (c.name.toLowerCase() == 'refresh') refresh()
106
- else if (c.name.toLowerCase() == 'first') first()
107
- else if (c.name.toLowerCase() == 'prior') prior()
108
- else if (c.name.toLowerCase() == 'next') next()
109
- else if (c.name.toLowerCase() == 'last') last()
110
- else console.log('Unknown command');
111
- }
106
+ if (isRef(props.command) || isReactive(props.command))
107
+ watch(() => props.command, (n,o) => {
108
+ if (n && n.length > 0) {
109
+ const c = props.command[n.length-1];
110
+
111
+ if (c && c.name) {
112
+ if (c.name.toLowerCase() == 'refresh') refresh()
113
+ else if (c.name.toLowerCase() == 'first') first()
114
+ else if (c.name.toLowerCase() == 'prior') prior()
115
+ else if (c.name.toLowerCase() == 'next') next()
116
+ else if (c.name.toLowerCase() == 'last') last()
117
+ else console.log('Unknown command');
118
+ }
112
119
 
113
- props.command.length = 0;
114
- }
115
- }, { deep: true });
120
+ props.command.length = 0;
121
+ }
122
+ }, { deep: true });
123
+ /*****************************************************************
116
124
 
125
+ *****************************************************************/
117
126
  function prepareGroup(g, r) {
118
- let s = [];
127
+ grps = [];
128
+ rowg = [];
119
129
 
120
130
  for (let i = 0; i < r.length; i++) {
121
131
  let v = null;
@@ -149,15 +159,14 @@ const tablevu = {
149
159
  c = o[g.content];
150
160
  };
151
161
 
152
- const n = s.findIndex(f => f.group == v);
162
+ let n = grps.findIndex(f => f.group == v);
153
163
 
154
- if (n > -1)
155
- s[n].rows.push(o);
156
- else
157
- s.push({ group: v, content: c, expand: spec.group.expandAll, rows: [o] });
158
- };
164
+ if (n == -1) {
165
+ n = grps.push({ group: v, content: c, expand: spec.group.expandAll }) - 1;
166
+ };
159
167
 
160
- return s;
168
+ rowg.push(n);
169
+ };
161
170
  }
162
171
  /*****************************************************************
163
172
 
@@ -190,6 +199,12 @@ const tablevu = {
190
199
  if (spec.sort && spec.sort.length > 0) {
191
200
  let l = spec.sort.findIndex(f => f.index == ind);
192
201
 
202
+ if (l < 0) {
203
+ let n = spec.columns[ind].name;
204
+
205
+ l = spec.sort.findIndex(f => f.name == n);
206
+ }
207
+
193
208
  if (l == 0) {
194
209
  spec.sort[l].dir = dir ? dir: (spec.sort[0].dir ? null : 'desc');
195
210
  } else if (l > 0) {
@@ -221,25 +236,22 @@ const tablevu = {
221
236
 
222
237
  spec.status = tablevuStatuses.Loading;
223
238
 
224
- if (spec.adapter) {
225
- spec.adapter({ pageSize: spec.page.size, currPage: currentPage, sort: spec.sort, cols: spec.columns, filter: spec.filter, search: spec.search }, dat).then(ada => {
226
-
239
+ if (adapter) {
240
+ adapter({ pageSize: spec.page.size, currPage: currentPage, sort: spec.sort, cols: spec.columns, filter: spec.filter, search: spec.search }, dat).then(ada => {
227
241
  if (spec.onData)
228
242
  rows = spec.onData(ada.rows);
229
243
  else
230
244
  rows = ada.rows;
231
245
 
232
- count = ada.count;
233
-
234
246
  if (spec.group && (typeof spec.group == 'string' || typeof spec.group == 'bigint' || (typeof spec.group == 'object' && spec.group.value )))
235
- grps = prepareGroup(spec.group, rows);
247
+ prepareGroup(spec.group, rows);
236
248
 
237
249
  spec.page.count = (ada.count > 0 && spec.page.size > 0) ? (ada.count / spec.page.size) : 0
238
250
  spec.page.current = currentPage;
239
251
 
240
252
  spec.status = tablevuStatuses.Ready;
241
253
  spec.time = Date.now();
242
- });
254
+ });
243
255
  }
244
256
  }
245
257
  /*****************************************************************
@@ -324,7 +336,7 @@ const tablevu = {
324
336
  }
325
337
 
326
338
  function renderGroup(grp) {
327
- const b = h('button', { title: grp.expand, onClick: event => { console.log(grp.expand); grp.expand = (grp.expand ? false: true); event.currentTarget.value = grp.expand ? '▼': '►'; spec.time = Date.now(); event.preventDefault() }, style: { padding: 0, margin: '0 6px 0 0', width: '12px', height: '100%', border: 'none', outline: 0, backgroundColor: 'transparent' } }, grp.expand ? '▼': '►');
339
+ const b = h('button', { title: grp.expand, onClick: event => { grp.expand = (grp.expand ? false: true); event.currentTarget.value = grp.expand ? '▼': '►'; spec.time = Date.now(); event.preventDefault() }, style: { padding: 0, margin: '0 6px 0 0', width: '12px', height: '100%', border: 'none', outline: 0, backgroundColor: 'transparent' } }, grp.expand ? '▼': '►');
328
340
  const v = grp.content || grp.group;
329
341
 
330
342
 
@@ -460,27 +472,31 @@ const tablevu = {
460
472
  function renderBody() {
461
473
  const dr = [];
462
474
 
463
- if (grps && grps.length > 0) {
464
- let x = 0;
475
+ if (rows && rows.length > 0) {
476
+ if (grps && grps.length > 0) {
477
+ let r = [];
465
478
 
466
- for (let g = 0; g < grps.length; g += 1) {
467
- const r = grps[g];
479
+ for (let g = 0; g < grps.length; g++)
480
+ r.push({ index: g, childs: [] });
468
481
 
469
- dr.push(renderGroup(r));
482
+ for (let i = 0; i < rows.length; i++) {
483
+ const x = rowg[i];
470
484
 
471
- if (r.expand && r.rows && r.rows.length > 0) {
472
- for (let i = 0; i < r.rows.length; i += 1) {
473
- dr.push(renderRow(x, r.rows[i]));
474
- x++;
475
- }
485
+ r[x].childs.push(renderRow(i, rows[i]));
486
+ };
487
+
488
+ for (let g = 0; g < grps.length; g++) {
489
+ dr.push(renderGroup(grps[g]));
490
+
491
+ if (grps[g].expand)
492
+ dr.push(r[g].childs);
476
493
  }
477
- }
478
- } else
479
- if (rows && rows.length > 0) {
480
- for (let i = 0; i < rows.length; i += 1) {
494
+ } else {
495
+ for (let i = 0; i < rows.length; i++) {
481
496
  dr.push(renderRow(i, rows[i]));
482
497
  }
483
498
  }
499
+ };
484
500
 
485
501
  return dr;
486
502
  }
@@ -518,7 +534,6 @@ const tablevu = {
518
534
  page(1);
519
535
 
520
536
  onMounted(() => {
521
- console.log('tablevu.mounted');
522
537
  });
523
538
 
524
539
  return {
@@ -529,7 +544,6 @@ const tablevu = {
529
544
  },
530
545
 
531
546
  render(props) {
532
- console.log('tablevu.render', this.spec.status);
533
547
  let prps = { class: 'tablevu' };
534
548
  /*
535
549
  if (props.id)