diff --git a/README.md b/README.md index 00fd253..38d4e5f 100644 --- a/README.md +++ b/README.md @@ -22,6 +22,7 @@ - 多级表头 - 排序 - 树形数据 + - 单选、多选 ## 体验 可直接访问https://peng92055.github.io/smart-table @@ -65,7 +66,9 @@ hoverBgColor: '#C5DFFF', height: 300, align: 'left', - size: 'middle' + size: 'middle', + selection: 'checkbox', + selectionKey: 1, }) ``` @@ -83,15 +86,18 @@ ### Table Options -| Property | Type | Required | Description | Default | -| :---------------------| :----------------- | :---------- | :------------------------------------------ | :------------ | -| selector | string | yes | 需要初始化的表格元素 | | -| height | number or function | no | 可指定表格的高度 | | -| align | string | no | 表格文本的水平排列方式(left、center、right) | center | -| size | string | no | 每一行的垂直高度风格(large、middle、small) | small | -| hoverBgColor | string | no | body中每行hover时的背景色 | '#EFF8FF' | -| expand | boolean | no | 是否开启树形结构(树形结构会忽略排序及固定列) | false | -| defaultExpandAll | boolean | no | 是否默认展开所有树形结构 | false | +| Property | Type | Required | Description | Default | +| :---------------------| :----------------- | :---------- | :------------------------------------------------------------- | :------------ | +| selector | string | yes | 需要初始化的表格元素 | | +| height | number or function | no | 可指定表格的高度 | | +| align | string | no | 表格文本的水平排列方式(left、center、right) | center | +| size | string | no | 每一行的垂直高度风格(large、middle、small) | small | +| hoverBgColor | string | no | body中每行hover时的背景色 | '#EFF8FF' | +| expand | boolean | no | 是否开启树形结构(树形结构会忽略排序及固定列) | false | +| defaultExpandAll | boolean | no | 是否默认展开所有树形结构 | false | +| selection | string | no | 单选或多选(radio、checkbox),选中值会存储在根节点selected属性上 | false | +| selectionKey | string or number | no | 单选或多选时选中取值对应的tbody中有效列的角标(角标从0开始) | 0 | + diff --git a/dist/smartTable.min.js b/dist/smartTable.min.js index 647366f..6ee4b61 100644 --- a/dist/smartTable.min.js +++ b/dist/smartTable.min.js @@ -1 +1 @@ -/*! smartTable v1.1.2 | (c) pengyajun 2020 | Released under the MIT License. */!function(t){var e={};function r(o){if(e[o])return e[o].exports;var i=e[o]={i:o,l:!1,exports:{}};return t[o].call(i.exports,i,i.exports,r),i.l=!0,i.exports}r.m=t,r.c=e,r.d=function(t,e,o){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)r.d(o,i,function(e){return t[e]}.bind(null,i));return o},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=4)}([function(t,e,r){var o=r(1),i=r(2);"string"==typeof(i=i.__esModule?i.default:i)&&(i=[[t.i,i,""]]);var n={insert:"head",singleton:!1},a=(o(t.i,i,n),i.locals?i.locals:{});t.exports=a},function(t,e,r){"use strict";var o,i=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},n=function(){var t={};return function(e){if(void 0===t[e]){var r=document.querySelector(e);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(t){r=null}t[e]=r}return t[e]}}(),a={};function s(t,e,r){for(var o=0;otd:first-child>:before{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.smart-table tbody.stripe tr:nth-child(2n){background-color:#F9FBFF}.smart-table td,.smart-table th{padding:5px 0;text-overflow:ellipsis;vertical-align:middle;position:relative;border-bottom:1px solid #ECF0F5;border-right:1px solid #ECF0F5;text-align:center}.smart-table td.is-hidden>*,.smart-table th.is-hidden>*{visibility:hidden}.smart-table th{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden}.smart-table th[sort]{cursor:pointer}.smart-table th[sort] :before,.smart-table th[sort] :after{content:'';float:right;width:0;height:0;border-width:5px;border-style:solid}.smart-table th[sort] :before{margin:1px 0 0 -10px;border-color:transparent transparent #c0c4cc transparent}.smart-table th[sort] :after{margin:12px 0 0 4px;border-color:#c0c4cc transparent transparent transparent}.smart-table th[sort].desc :after{border-top-color:#409eff}.smart-table th[sort].asc :before{border-bottom-color:#409eff}.smart-table.stb-cust-large thead{font-size:16px}.smart-table.stb-cust-large tbody{font-size:15px}.smart-table.stb-cust-large td,.smart-table.stb-cust-large th{padding:12px 0}.smart-table.stb-cust-middle thead{font-size:15px}.smart-table.stb-cust-middle tbody{font-size:14px}.smart-table.stb-cust-middle td,.smart-table.stb-cust-middle th{padding:10px 0}.smart-table.stb-cust-left td,.smart-table.stb-cust-left th{text-align:left}.smart-table.stb-cust-right td,.smart-table.stb-cust-right th{text-align:right}.smart-table .stb_cell{overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all;padding:0 4px;line-height:23px}.smart-table th>.stb_cell{display:inline-block;position:relative;vertical-align:middle}.smart-table .stb_body,.smart-table .stb_footer,.smart-table .stb_header{table-layout:fixed;border-collapse:separate;background:#fff}.smart-table .stb_header-wrapper{overflow:hidden}.smart-table .stb_body-wrapper{overflow:auto}.smart-table .stb_fixed,.smart-table .stb_fixed-right{position:absolute;top:0;left:0;overflow-x:hidden;overflow-y:hidden;box-shadow:0 -1px 8px rgba(0,0,0,0.08)}.smart-table .stb_fixed-right{top:0;left:auto;right:0;box-shadow:-1px 0 8px rgba(0,0,0,0.08)}.smart-table .stb_fixed-right .stb_fixed-body-wrapper,.smart-table .stb_fixed-right .stb_fixed-footer-wrapper,.smart-table .stb_fixed-right .stb_fixed-header-wrapper{left:auto;right:0}.smart-table .stb_fixed-right-patch{position:absolute;top:-1px;right:0;background-color:#F5F7FB}.smart-table .stb_fixed-header-wrapper{position:absolute;left:0;top:0;z-index:3}.smart-table .stb_fixed-body-wrapper{position:absolute;left:0;top:37px;overflow:hidden;z-index:3}.smart-table ::-webkit-scrollbar{width:8px;height:8px;background-color:#e9edf4}.smart-table ::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:2em}.smart-table ::-webkit-scrollbar-thumb:hover{background-color:#919191}.smart-table *{box-sizing:border-box}\n",""]),t.exports=e},function(t,e,r){"use strict";t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r=function(t,e){var r=t[1]||"",o=t[3];if(!o)return r;if(e&&"function"==typeof btoa){var i=(a=o,s=btoa(unescape(encodeURIComponent(JSON.stringify(a)))),l="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(s),"/*# ".concat(l," */")),n=o.sources.map((function(t){return"/*# sourceURL=".concat(o.sourceRoot||"").concat(t," */")}));return[r].concat(n).concat([i]).join("\n")}var a,s,l;return[r].join("\n")}(e,t);return e[2]?"@media ".concat(e[2]," {").concat(r,"}"):r})).join("")},e.i=function(t,r){"string"==typeof t&&(t=[[null,t,""]]);for(var o=0;oe}function n(t,e){let r=document.createElement(t);return e&&(r.className=e),r}function a(t,e){return t.appendChild(e)}function s(t,e){return t.hasAttribute(e)}function l(t,e,r){return t.setAttribute(e,r||!0)}function d(t,e){return t.getAttribute(e)}function c(t,e){return t.removeAttribute(e)}function f(t,e){return e.forEach(e=>{t.appendChild(e)}),t}function h(t,e){t.removeChild(e)}function p(t,e){return t.cloneNode(e)}function u(t,e){return t.querySelector(e)}function b(t,e){return t.querySelectorAll(e)}function g(t){let e=t.childNodes,r=n("div","stb_cell");for(;e.length;)a(r,e[0]);a(t,r)}function x(t,e,r,o){let i=n("div",t),s=n("table","stb_"+r);return s.style.width=e.size.tableWidth+"px",f(s,[m(e.colgroup),o]),a(i,s),i}function y(t,e,r){return Number.parseInt(d(t,e)||r)}function m(t){if(!t)return;let e=n("colgroup");return t.forEach(t=>{let r=n("col");r.setAttribute("width",t),a(e,r)}),e}function $(t,e,r){const o=p(e,!0);return b(o,"tr:first-child>th").forEach((t,e)=>{-1===r.thead.indexOf("field-"+e)&&t.classList.add("is-hidden")}),x("stb_fixed-header-wrapper",t,"header",o)}function v(t,e,r,o){const i=p(e,!0);b(i,"tr").forEach(t=>{let e=-1;b(t,"td").forEach((t,i)=>{"left"===o?e=i:e+=y(t,"colspan",1),-1===r.tbody.indexOf("field-"+e)&&t.classList.add("is-hidden")})});const n=x("stb_fixed-body-wrapper",t,"body",i);return n.style.top=t.$thead.offsetHeight+"px",n.style.height=t.size.tbodyWrapperHeight-(t.scrollX?t.gutterWidth:0)+"px",n}function w(t,e,r,o,i,a){const s=n("div",i);"right"===a&&(s.style.right=(t.scrollY?t.gutterWidth:0)+"px"),f(s,[e,r]),s.style.width=o.width+"px";let l=t.$root.offsetHeight-(t.scrollX?t.gutterWidth:2);const d=t.$thead.offsetHeight+t.$tbody.offsetHeight;return l=d>l?l:d,s.style.height=l+"px",s}let E;function L(t){const{$root:e,props:r}=t,o=e.offsetWidth-1,i=o-(t.scrollY?t.gutterWidth:0);let n=[],a=0;r.shapes.forEach(t=>{t.forEach((t,e)=>{if(t){1===y(t,"colspan",1)&&(n[e]=y(t,"width",0))}})});let s=0;if(n.forEach(t=>{a+=t,0===t&&s++}),s){const t=Math.floor((i-a)/s),e=t>80?t:80;let r=0;a=0,n=n.map((t,o)=>(0===t&&(t=e,r=o),a+=t,t)),i>a&&(n[r]=n[r]+i-a,a=i)}else a=n.reduce((t,e)=>e+t,0);t.colgroup=n,t.size.rootWidth=o,t.size.tableWidth=a,t.scrollX=t.size.tableWidth>t.size.rootWidth}function k(t){!function(t,e){let r;return function(){const o=this,i=arguments;function n(){e.apply(o,i)}r&&clearTimeout(r),r=setTimeout(n,t)}}(500,()=>{const{fixedLeft:e,fixedRight:r}=t.props;L(t),function(t){b(t.$root,"table").forEach(e=>{e.style.width=t.size.tableWidth+"px",e.replaceChild(m(t.colgroup),u(e,"colgroup"))})}(t),t.scrollY=t.$tbody.offsetHeight>t.size.tbodyWrapperHeight,t.$scrollTH.style.display=t.scrollY?"table-cell":"none";let o=t.$root.offsetHeight-(t.scrollX?t.gutterWidth:2);const i=t.$thead.offsetHeight+t.$tbody.offsetHeight;o=i>o?o:i;const n=t.size.tbodyWrapperHeight-(t.scrollX?t.gutterWidth:0),a=t.$thead.offsetHeight;let s=0,l=0;t.$fixedLeft&&e.thead.length&&(e.thead.forEach((e,r)=>{s+=t.colgroup[r]}),t.$fixedLeftBody.style.height=n+"px",t.$fixedLeftBody.style.top=a+"px",t.$fixedLeft.style.width=s+"px",t.$fixedLeft.style.height=o+"px"),t.$fixedRight&&r.thead.length&&(r.thead.forEach((e,r)=>{l+=t.colgroup[t.colgroup.length-r-1]}),t.$fixedRightBody.style.height=n+"px",t.$fixedRightBody.style.top=a+"px",t.$fixedRight.style.width=l+"px",t.$fixedRight.style.height=o+"px",t.$fixedRight.style.right=(t.scrollY?t.gutterWidth:0)+"px",t.$rightPatch.style.display=t.scrollY?"block":"none",t.$rightPatch.style.height=t.$thead.offsetHeight+"px")})()}function _(t,e,r){e&&(e.addEventListener("mouseenter",()=>{e.style.background=t.style.hoverBgColor,r.forEach(e=>{e&&(e.style.background=t.style.hoverBgColor)})}),e.addEventListener("mouseleave",()=>{e.style.background="",r.forEach(t=>{t&&(t.style.background="")})}))}function W(t){this instanceof W||console.error("Smart Table is a constructor and should be called with the `new` keyword"),window.addEventListener("load",()=>{setTimeout(this._init(t),0)})}W.prototype._init=function(t={}){if(!t.selector)return console.error("Smart Table init need a selector");const e=String(t.selector).trim(),r=u(document,e);if(!r)return console.error("Smart Table "+e+" not found");const i=u(r,"table");if(!i)return console.error("Smart Table init need a table");const p=u(i,"thead");if(!p)return console.error("Smart Table init need a thead");const m=u(i,"tbody");if(!m)return console.error("Smart Table init need a tbody");r.classList.add("smart-table"),t.size&&r.classList.add("stb-cust-"+t.size),t.align&&r.classList.add("stb-cust-"+t.align),s(i,"stripe")&&m.classList.add("stripe"),t.expand?(b(p,"th[sort]").forEach(t=>{c(t,"sort")}),b(p,"th[fixed]").forEach(t=>{c(t,"fixed")})):(b(m,"tr[expand]").forEach(t=>{c(t,"expand")}),b(p,"tr[expand-parent]").forEach(t=>{c(t,"expand-parent")}));const W=this;W.$root=r,W.$thead=p,W.$tbody=m,W.options=t,W.gutterWidth=function(){if(void 0!==E)return E;const t=n("div","smart-table");a(document.body,t);const e=n("div");e.style.visibility="hidden",e.style.width="100px",e.style.position="absolute",e.style.top="-9999px",a(t,e);const r=e.offsetWidth;e.style.overflow="scroll";const o=n("div");o.style.width="100%",a(e,o);const i=o.offsetWidth;return h(t.parentNode,t),E=r-i,E}(),W.style={hoverBgColor:t.hoverBgColor||"#EFF8FF"},W.size={},function(t){let e={},r=[];b(t.$thead,"tr").forEach((t,e)=>{let o=r[e]||[];b(t,"th").forEach(t=>{let i=y(t,"rowspan",1),n=y(t,"colspan",1),a=function(t){for(let e=0,r=t.length;e1)for(let t=1;t1)for(let t=1;tg(t)),b(i,"td").forEach(t=>g(t)),L(t),t.$theadWrapper=x("stb_header-wrapper",t,"header",o),t.$tbodyWrapper=x("stb_body-wrapper",t,"body",i),f(r,[t.$theadWrapper,t.$tbodyWrapper]);const s=o.offsetHeight,l=("function"==typeof a?a.call():a)||r.offsetHeight,d=l>s?l-s-1:s+150;t.$tbodyWrapper.style.height=d+"px",t.size.tbodyWrapperHeight=d,t.scrollY=t.$tbody.offsetHeight>d,h(e.parentNode,e)}(W,i),t.expand||(function(t){let{colgroup:e,props:r}=t;const o=e.length;let i={thead:[],tbody:[],width:0},n={thead:[],tbody:[],width:0};const a=b(t.$thead,"tr:first-child>th"),l=a.length;let d=0;if(0!==l){if(s(a[0],"fixed"))for(let t=0;t0&&s(a[r],"fixed")&&r!==d;r--){n.thead.push("field-"+r);let i=y(a[r],"colspan",1);for(let r=0;r0){o=o>i.width?o:i.width;const n=$(t,e,i),s=v(t,r,i,"left");t.$fixedLeft=w(t,n,s,i,"stb_fixed","left"),a(t.$root,t.$fixedLeft),t.$fixedLeftBody=s}if(s.thead.length>0){o+=s.width;const i=$(t,e,s),l=v(t,r,s,"right");t.$fixedRight=w(t,i,l,s,"stb_fixed-right","right"),a(t.$root,t.$fixedRight),t.$fixedRightBody=l;let d=n("div","stb_fixed-right-patch");d.style.display="none",d.style.width=t.gutterWidth+"px",d.style.height=t.$thead.offsetHeight+"px",a(t.$root,d),t.$rightPatch=d,t.scrollY&&(t.$rightPatch.style.display="block")}t.$root.style.minWidth=o+"px"}(W,p,m)),function(t,e){let r=t.$fixedLeftBody&&b(t.$fixedLeftBody,"tbody tr"),o=t.$fixedRightBody&&b(t.$fixedRightBody,"tbody tr"),i=[],n=[];b(e,"tr").forEach((t,e)=>{let a={$el:t,$fixedLeftEl:r&&r[e],$fixedRightEl:o&&o[e],$key:"$$rowkey"+e};b(t,"td .stb_cell").forEach((t,e)=>{a["field-"+e]=t.innerHTML}),s(t,"unsort")?n.push(a):i.push(a)}),t.data=i,t.unsortData=n}(W,m),t.expand&&function(t,e){const r=t.options.defaultExpandAll;let o=[],i=[];b(e,"tr").forEach(t=>{let e=i.length,n=s(t,"expand"),a=s(t,"expand-parent"),f={$el:t,id:d(t,"expand"),expand:n};if(n&&(r?l(t,"expanded"):c(t,"expanded")),n&&!a)f.children=[],i=[f],o.push(f);else if(a){let r=d(t,"expand-parent"),o=[];for(let t=0;tfunction(t){!function(t,e){let r,o=0;return function(){const i=this,n=(new Date).getTime()-o,a=arguments;function s(){o=(new Date).getTime(),e.apply(i,a)}r&&clearTimeout(r),n>t?s():r=setTimeout(s,t-n)}}(20,()=>{t.$theadWrapper.scrollLeft=t.$tbodyWrapper.scrollLeft,t.$fixedLeftBody&&(t.$fixedLeftBody.scrollTop=t.$tbodyWrapper.scrollTop),t.$fixedRightBody&&(t.$fixedRightBody.scrollTop=t.$tbodyWrapper.scrollTop)})()}(t),{passive:!0})})(t),function(t){[].concat(t.data,t.unsortData).forEach(e=>{_(t,e.$el,[e.$fixedLeftEl,e.$fixedRightEl]),e.$fixedLeftEl&&_(t,e.$fixedLeftEl,[e.$el,e.$fixedRightEl]),e.$fixedRightEl&&_(t,e.$fixedRightEl,[e.$el,e.$fixedLeftEl])})}(t),t.options.expand?function(t){!function t(e){e.forEach(e=>{e.expand&&(u(e.$el,"td").addEventListener("click",()=>{!function t(e,r){r?l(e.$el,"expanded"):c(e.$el,"expanded"),e.children&&e.children.forEach(e=>{e.$el.style.display=r?"":"none",t(e,r)})}(e,!s(e.$el,"expanded"))}),e.children&&t(e.children))})}(t.expandData)}(t):function(t){let e=Array.from(b(t.$root,"th[sort]"));0!==e.length&&e.forEach(r=>{r.addEventListener("click",i=>{i.stopPropagation();let n="ASC",a=d(r,"sort")||"string";r.classList.contains("asc")?(r.classList.remove("asc"),r.classList.add("desc"),n="DESC"):(r.classList.remove("desc"),r.classList.add("asc")),e=e.map(t=>(r!=t&&t.classList.remove("asc","desc"),t)),o(t,d(r,"sortkey"),n,a)})})}(t),function(t){window.addEventListener("resize",()=>k(t),{passive:!0})}(t)}(W);const S=n("th");S.style.display="none",l(S,"width",W.gutterWidth),l(S,"rowspan",W.props.shapes.length),a(u(W.$thead,"tr"),S),W.$scrollTH=S,W.scrollY&&(W.$scrollTH.style.display="table-cell",k(W))};var S=W;window.SmartTable=S}]); \ No newline at end of file +/*! smartTable v1.1.2 | (c) pengyajun 2020 | Released under the MIT License. */!function(t){var e={};function r(o){if(e[o])return e[o].exports;var n=e[o]={i:o,l:!1,exports:{}};return t[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}r.m=t,r.c=e,r.d=function(t,e,o){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)r.d(o,n,function(e){return t[e]}.bind(null,n));return o},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=4)}([function(t,e,r){var o=r(1),n=r(2);"string"==typeof(n=n.__esModule?n.default:n)&&(n=[[t.i,n,""]]);var i={insert:"head",singleton:!1},a=(o(t.i,n,i),n.locals?n.locals:{});t.exports=a},function(t,e,r){"use strict";var o,n=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},i=function(){var t={};return function(e){if(void 0===t[e]){var r=document.querySelector(e);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(t){r=null}t[e]=r}return t[e]}}(),a={};function s(t,e,r){for(var o=0;otd:first-child>:before{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.smart-table tbody.stripe tr:nth-child(2n){background-color:#F9FBFF}.smart-table td,.smart-table th{padding:5px 0;text-overflow:ellipsis;vertical-align:middle;position:relative;border-bottom:1px solid #ECF0F5;border-right:1px solid #ECF0F5;text-align:center}.smart-table td.is-hidden>*,.smart-table th.is-hidden>*{visibility:hidden}.smart-table th{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden}.smart-table th[sort]{cursor:pointer}.smart-table th[sort] :before,.smart-table th[sort] :after{content:'';float:right;width:0;height:0;border-width:5px;border-style:solid}.smart-table th[sort] :before{margin:1px 0 0 -10px;border-color:transparent transparent #c0c4cc transparent}.smart-table th[sort] :after{margin:12px 0 0 4px;border-color:#c0c4cc transparent transparent transparent}.smart-table th[sort].desc :after{border-top-color:#409eff}.smart-table th[sort].asc :before{border-bottom-color:#409eff}.smart-table.stb-cust-large thead{font-size:16px}.smart-table.stb-cust-large tbody{font-size:15px}.smart-table.stb-cust-large td,.smart-table.stb-cust-large th{padding:12px 0}.smart-table.stb-cust-middle thead{font-size:15px}.smart-table.stb-cust-middle tbody{font-size:14px}.smart-table.stb-cust-middle td,.smart-table.stb-cust-middle th{padding:10px 0}.smart-table.stb-cust-left td,.smart-table.stb-cust-left th{text-align:left}.smart-table.stb-cust-right td,.smart-table.stb-cust-right th{text-align:right}.smart-table .std-checkbox_inner{display:inline-block;position:relative;border:1px solid #dcdfe6;border-radius:2px;box-sizing:border-box;width:14px;height:14px;background-color:#fff;z-index:1;-webkit-transition:border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);transition:border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46)}.smart-table .std-checkbox_inner:after{box-sizing:content-box;content:\"\";border:1px solid #fff;border-left:0;border-top:0;height:7px;left:4px;position:absolute;top:1px;-webkit-transform:rotate(45deg) scaleY(0);transform:rotate(45deg) scaleY(0);width:3px;-webkit-transition:-webkit-transform .15s ease-in .05s;transition:-webkit-transform .15s ease-in .05s;transition:transform .15s ease-in .05s;transition:transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s;-webkit-transform-origin:center;transform-origin:center}.smart-table .std-checkbox_input{white-space:nowrap;cursor:pointer;outline:none;display:inline-block;line-height:1;position:relative;vertical-align:middle}.smart-table .std-checkbox{color:#606266;font-weight:500;font-size:14px;position:relative;cursor:pointer;display:inline-block;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.smart-table .std-checkbox[checked]>.std-checkbox_input>.std-checkbox_inner{background-color:#409eff;border-color:#409eff}.smart-table .std-checkbox[checked]>.std-checkbox_input>.std-checkbox_inner:after{-webkit-transform:rotate(45deg) scaleY(1);transform:rotate(45deg) scaleY(1)}.smart-table .stb_cell{overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all;padding:0 4px;line-height:23px}.smart-table th>.stb_cell{display:inline-block;position:relative;vertical-align:middle}.smart-table .stb_body,.smart-table .stb_footer,.smart-table .stb_header{table-layout:fixed;border-collapse:separate;background:#fff}.smart-table .stb_header-wrapper{overflow:hidden}.smart-table .stb_body-wrapper{overflow:auto}.smart-table .stb_fixed,.smart-table .stb_fixed-right{position:absolute;top:0;left:0;overflow-x:hidden;overflow-y:hidden;box-shadow:0 -1px 8px rgba(0,0,0,0.08)}.smart-table .stb_fixed-right{top:0;left:auto;right:0;box-shadow:-1px 0 8px rgba(0,0,0,0.08)}.smart-table .stb_fixed-right .stb_fixed-body-wrapper,.smart-table .stb_fixed-right .stb_fixed-footer-wrapper,.smart-table .stb_fixed-right .stb_fixed-header-wrapper{left:auto;right:0}.smart-table .stb_fixed-right-patch{position:absolute;top:-1px;right:0;background-color:#F5F7FB}.smart-table .stb_fixed-header-wrapper{position:absolute;left:0;top:0;z-index:3}.smart-table .stb_fixed-body-wrapper{position:absolute;left:0;top:37px;overflow:hidden;z-index:3}.smart-table ::-webkit-scrollbar{width:8px;height:8px;background-color:#e9edf4}.smart-table ::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:2em}.smart-table ::-webkit-scrollbar-thumb:hover{background-color:#919191}.smart-table *{box-sizing:border-box}\n",""]),t.exports=e},function(t,e,r){"use strict";t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r=function(t,e){var r=t[1]||"",o=t[3];if(!o)return r;if(e&&"function"==typeof btoa){var n=(a=o,s=btoa(unescape(encodeURIComponent(JSON.stringify(a)))),l="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(s),"/*# ".concat(l," */")),i=o.sources.map((function(t){return"/*# sourceURL=".concat(o.sourceRoot||"").concat(t," */")}));return[r].concat(i).concat([n]).join("\n")}var a,s,l;return[r].join("\n")}(e,t);return e[2]?"@media ".concat(e[2]," {").concat(r,"}"):r})).join("")},e.i=function(t,r){"string"==typeof t&&(t=[[null,t,""]]);for(var o=0;o{t.appendChild(e)}),t}function c(t,e,r){t.insertBefore(e,r)}function f(t,e){t.removeChild(e)}function h(t,e){return t.cloneNode(e)}function p(t,e){return t.querySelector(e)}function b(t,e){return t.querySelectorAll(e)}function u(t){return t.offsetHeight}function x(t){return t.offsetWidth}function g(t,e){for(let r in e)t.style[r]=e[r];return t}var m=function(t,e,r,o){if(!t.data||t.data.length<1)return;let n=function t(e,r,o,n){if(e.length<=1)return e;let i=[],a=[],s=e.length,l=Math.floor(s/2),d=e.splice(l,1)[0];for(let t=0;te}function $(t){let e=t.childNodes,r=o("div","stb_cell");for(;e.length;)n(r,e[0]);n(t,r)}function w(t,e){if(!t)return;let r=o(t);a(r,"rowspan",e);let i=o("label","std-checkbox"),s=o("span","std-checkbox_input");return n(s,o("span","std-checkbox_inner")),n(i,s),n(r,i),r}function k(t,e,r,i){let a=o("div",t),s=o("table","stb_"+r);return g(s,{width:e.size.tableWidth+"px"}),d(s,[E(e.colgroup),i]),n(a,s),a}function v(t,e,r){return Number.parseInt(s(t,e)||r)}function E(t){if(!t)return;let e=o("colgroup");return t.forEach(t=>{let r=o("col");a(r,"width",t),n(e,r)}),e}function L(t,e,r){const o=h(e,!0);return b(o,"tr:first-child>th").forEach((t,e)=>{-1===r.thead.indexOf("field-"+e)&&t.classList.add("is-hidden")}),k("stb_fixed-header-wrapper",t,"header",o)}function _(t,e,r,o){const n=h(e,!0);b(n,"tr").forEach(t=>{let e=-1;b(t,"td").forEach((t,n)=>{"left"===o?e=n:e+=v(t,"colspan",1),-1===r.tbody.indexOf("field-"+e)&&t.classList.add("is-hidden")})});const i=k("stb_fixed-body-wrapper",t,"body",n);return g(i,{top:u(t.$thead)+"px",height:t.size.tbodyWrapperHeight-(t.scrollX?t.gutterWidth:0)+"px"}),i}function S(t,e,r,n,i,a){const s=o("div",i);d(s,[e,r]);const l=u(t.$root)-(t.scrollX?t.gutterWidth:2),c=u(t.$thead)+u(t.$tbody);return g(s,{width:n.width+"px",height:(c>l?l:c)+"px",right:"right"===a?(t.scrollY?t.gutterWidth:0)+"px":""}),s}let z;function C(t){const{$root:e,props:r}=t,o=x(e)-1,n=o-(t.scrollY?t.gutterWidth:0);let i=[],a=0;r.shapes.forEach(t=>{t.forEach((t,e)=>{if(t){1===v(t,"colspan",1)&&(i[e]=v(t,"width",0))}})});let s=0;if(i.forEach(t=>{a+=t,0===t&&s++}),s){const e=Math.floor((n-a)/s),r=e>80?e:80;let o=0;a=0,i=i.map((n,i)=>(0===n&&(n=t.hasCheckbox&&0===i?e>55?e:55:r,o=i),a+=n,n)),n>a&&(i[o]=i[o]+n-a,a=n)}else a=i.reduce((t,e)=>e+t,0);t.colgroup=i,t.size.rootWidth=o,t.size.tableWidth=a,t.scrollX=t.size.tableWidth>t.size.rootWidth}function R(t){!function(t,e){let r;return function(){const o=this,n=arguments;function i(){e.apply(o,n)}r&&clearTimeout(r),r=setTimeout(i,t)}}(500,()=>{const{fixedLeft:e,fixedRight:r}=t.props;C(t),function(t){b(t.$root,"table").forEach(e=>{g(e,{width:t.size.tableWidth+"px"}),e.replaceChild(E(t.colgroup),p(e,"colgroup"))})}(t),t.scrollY=u(t.$tbody)>t.size.tbodyWrapperHeight,g(t.$scrollTH,{display:t.scrollY?"table-cell":"none"});let o=u(t.$root)-(t.scrollX?t.gutterWidth:2);const n=u(t.$thead)+u(t.$tbody);o=n>o?o:n;const i=t.size.tbodyWrapperHeight-(t.scrollX?t.gutterWidth:0),a=u(t.$thead);let s=0,l=0;t.$fixedLeft&&e.thead.length&&(e.thead.forEach((e,r)=>{s+=t.colgroup[r]}),g(t.$fixedLeftBody,{height:i+"px",top:a+"px"}),g(t.$fixedLeft,{width:s+"px",height:o+"px"})),t.$fixedRight&&r.thead.length&&(r.thead.forEach((e,r)=>{l+=t.colgroup[t.colgroup.length-r-1]}),g(t.$fixedRightBody,{height:i+"px",top:a+"px"}),g(t.$fixedRight,{width:l+"px",height:o+"px",right:(t.scrollY?t.gutterWidth:0)+"px"}),g(t.$rightPatch,{display:t.scrollY?"block":"none",height:u(t.$thead)+"px"}))})()}function W(t,e,r,o){e&&e.addEventListener("click",()=>{let{selected:n}=t,s=!1;(n!==o||i(e,"checked"))&&(n!==o?(b(t.$root,"tr[checked]>td").forEach(t=>g(t,{background:""})),b(t.$root,"tr[checked]").forEach(t=>l(t,"checked")),s=!0):i(e,"checked")&&(s=!1),n=s?o:null,s?a(e,"checked",!0):l(e,"checked"),e.querySelectorAll("td").forEach(e=>{g(e,{background:s?t.style.radioBgColor:""})}),r.forEach(e=>{e&&(s?a(e,"checked",!0):l(e,"checked"),e.querySelectorAll("td").forEach(e=>{g(e,{background:s?t.style.radioBgColor:""})}))}),s?a(t.$root,"selected",n):l(t.$root,"selected"),t.selected=n)})}function T(t,e,r){e&&(e.addEventListener("mouseenter",()=>{g(e,{background:t.style.hoverBgColor}),r.forEach(e=>{e&&g(e,{background:t.style.hoverBgColor})})}),e.addEventListener("mouseleave",()=>{g(e,{background:""}),r.forEach(t=>{t&&g(t,{background:""})})}))}function F(t){this instanceof F||console.error("Smart Table is a constructor and should be called with the `new` keyword"),window.addEventListener("load",()=>{setTimeout(this._init(t),0)})}F.prototype._init=function(t={}){if(!t.selector)return console.error("Smart Table init need a selector");const e=String(t.selector).trim(),r=p(document,e);if(!r)return console.error("Smart Table "+e+" not found");const h=p(r,"table");if(!h)return console.error("Smart Table init need a table");const y=p(h,"thead");if(!y)return console.error("Smart Table init need a thead");const E=p(h,"tbody");if(!E)return console.error("Smart Table init need a tbody");r.classList.add("smart-table"),t.size&&r.classList.add("stb-cust-"+t.size),t.align&&r.classList.add("stb-cust-"+t.align),i(h,"stripe")&&E.classList.add("stripe"),t.expand?(b(y,"th[sort]").forEach(t=>{l(t,"sort")}),b(y,"th[fixed]").forEach(t=>{l(t,"fixed")})):(b(E,"tr[expand]").forEach(t=>{l(t,"expand")}),b(y,"tr[expand-parent]").forEach(t=>{l(t,"expand-parent")}));const F=this;F.$root=r,F.$thead=y,F.$tbody=E,F.options=t,F.gutterWidth=function(){if(void 0!==z)return z;const t=o("div","smart-table");n(document.body,t);const e=o("div");g(e,{visibility:"hidden",width:"100px",position:"absolute",top:"-9999px"}),n(t,e);const r=x(e);g(e,{overflow:"scroll"});const i=o("div");g(i,{width:"100%"}),n(e,i);const a=x(i);return f(t.parentNode,t),z=r-a,z}(),F.style={radioBgColor:t.radioBgColor||"#D1E7FF",hoverBgColor:t.hoverBgColor||"#EFF8FF"},F.size={},F.hasCheckbox=!t.expand&&"checkbox"===t.selection,F.hasCheckbox&&function(t){const{$thead:e,$tbody:r}=t;let o=p(e,"tr"),n=o.querySelector("th"),s=w("th",v(n,"rowspan",1));i(n,"fixed")&&a(s,"fixed"),c(o,s,n),b(r,"tr").forEach(t=>{let e=t.querySelector("td");c(t,w("td",v(e,"rowspan",1)),e)})}(F),function(t){let e={},r=[];b(t.$thead,"tr").forEach((t,e)=>{let o=r[e]||[];b(t,"th").forEach(t=>{let n=v(t,"rowspan",1),s=v(t,"colspan",1),l=function(t){for(let e=0,r=t.length;e1)for(let t=1;t1)for(let t=1;t$(t)),b(n,"td").forEach(t=>$(t)),C(t),t.$theadWrapper=k("stb_header-wrapper",t,"header",o),t.$tbodyWrapper=k("stb_body-wrapper",t,"body",n),d(r,[t.$theadWrapper,t.$tbodyWrapper]);const s=u(o),l=("function"==typeof a?a.call():a)||u(r),c=l>s?l-s-1:s+150;g(t.$tbodyWrapper,{height:c+"px"}),t.size.tbodyWrapperHeight=c,t.scrollY=u(t.$tbody)>c,f(e.parentNode,e)}(F,h),t.expand||(function(t){let{colgroup:e,props:r}=t;const o=e.length;let n={thead:[],tbody:[],width:0},a={thead:[],tbody:[],width:0};const s=b(t.$thead,"tr:first-child>th"),l=s.length;let d=0;if(0!==l){if(i(s[0],"fixed"))for(let t=0;t0&&i(s[r],"fixed")&&r!==d;r--){a.thead.push("field-"+r);let n=v(s[r],"colspan",1);for(let r=0;r0){i=i>a.width?i:a.width;const o=L(t,e,a),s=_(t,r,a,"left");t.$fixedLeft=S(t,o,s,a,"stb_fixed","left"),n(t.$root,t.$fixedLeft),t.$fixedLeftBody=s}if(s.thead.length>0){i+=s.width;const a=L(t,e,s),l=_(t,r,s,"right");t.$fixedRight=S(t,a,l,s,"stb_fixed-right","right"),n(t.$root,t.$fixedRight),t.$fixedRightBody=l;let d=o("div","stb_fixed-right-patch");g(d,{display:"none",width:t.gutterWidth+"px",height:u(t.$thead)+"px"}),n(t.$root,d),t.$rightPatch=d,t.scrollY&&g(t.$rightPatch,{display:"block"})}g(t.$root,{minWidth:i+"px"})}(F,y,E)),function(t,e){let r=t.$fixedLeftBody&&b(t.$fixedLeftBody,"tbody tr"),o=t.$fixedRightBody&&b(t.$fixedRightBody,"tbody tr"),n=[],a=[];b(e,"tr").forEach((t,e)=>{let s={$el:t,$fixedLeftEl:r&&r[e],$fixedRightEl:o&&o[e],$key:"$$rowkey"+e};b(t,"td .stb_cell").forEach((t,e)=>{s["field-"+e]=t.innerHTML}),i(t,"unsort")?a.push(s):n.push(s)}),t.data=n,t.unsortData=a}(F,E),t.expand&&function(t,e){const r=t.options.defaultExpandAll;let o=[],n=[];b(e,"tr").forEach(t=>{let e=n.length,d=i(t,"expand"),c=i(t,"expand-parent"),f={$el:t,id:s(t,"expand"),expand:d};if(d&&(r?a(t,"expanded"):l(t,"expanded")),d&&!c)f.children=[],n=[f],o.push(f);else if(c){let r=s(t,"expand-parent"),o=[];for(let t=0;tfunction(t){!function(t,e){let r,o=0;return function(){const n=this,i=(new Date).getTime()-o,a=arguments;function s(){o=(new Date).getTime(),e.apply(n,a)}r&&clearTimeout(r),i>t?s():r=setTimeout(s,t-i)}}(20,()=>{t.$theadWrapper.scrollLeft=t.$tbodyWrapper.scrollLeft,t.$fixedLeftBody&&(t.$fixedLeftBody.scrollTop=t.$tbodyWrapper.scrollTop),t.$fixedRightBody&&(t.$fixedRightBody.scrollTop=t.$tbodyWrapper.scrollTop)})()}(t),{passive:!0})})(t),function(t){const{selection:e,selectionKey:r}=t.options,o=p(t.$fixedLeft||t.$thead,"th>.stb_cell>label.std-checkbox");[].concat(t.data,t.unsortData).forEach(n=>{if(T(t,n.$el,[n.$fixedLeftEl,n.$fixedRightEl]),n.$fixedLeftEl&&T(t,n.$fixedLeftEl,[n.$el,n.$fixedRightEl]),n.$fixedRightEl&&T(t,n.$fixedRightEl,[n.$el,n.$fixedLeftEl]),e){let s=n["field-"+(r||0)];switch(e){case"radio":W(t,n.$el,[n.$fixedLeftEl,n.$fixedRightEl],s),n.$fixedLeftEl&&W(t,n.$fixedLeftEl,[n.$el,n.$fixedRightEl],s),n.$fixedRightEl&&W(t,n.$fixedRightEl,[n.$el,n.$fixedLeftEl],s);break;case"checkbox":!function(t,e,r,o){const n=p(e,"label.std-checkbox");n&&r&&n.addEventListener("click",()=>{let{selected:e}=t;e=e||[];const s=!i(n,"checked");s?a(n,"checked",!0):l(n,"checked"),s?e.push(o):e.splice(e.indexOf(o),1);const d=e.length;d?a(t.$root,"selected",e):l(t.$root,"selected"),d===t.data.length+t.unsortData.length?a(r,"checked",!0):l(r,"checked"),t.selected=e})}(t,n.$fixedLeftEl||n.$el,o,s)}}}),t.hasCheckbox&&function(t,e){if(!e)return;const{selectionKey:r}=t.options;e.addEventListener("click",()=>{let{selected:o}=t;o=[];const n=!i(e,"checked");n?a(e,"checked",!0):l(e,"checked"),[].concat(t.data,t.unsortData).forEach(t=>{let e=p(t.$fixedLeftEl||t.$el,"label.std-checkbox");n?a(e,"checked",!0):l(e,"checked"),n&&o.push(t["field-"+(r||0)])}),o.length?a(t.$root,"selected",o):l(t.$root,"selected"),t.selected=o})}(t,o)}(t),t.options.expand?function(t){!function t(e){e.forEach(e=>{e.expand&&(p(e.$el,"td").addEventListener("click",()=>{!function t(e,r){r?a(e.$el,"expanded"):l(e.$el,"expanded"),e.children&&e.children.forEach(e=>{g(e.$el,{display:r?"":"none"}),t(e,r)})}(e,!i(e.$el,"expanded"))}),e.children&&t(e.children))})}(t.expandData)}(t):function(t){let e=Array.from(b(t.$root,"th[sort]"));0!==e.length&&e.forEach(r=>{r.addEventListener("click",o=>{o.stopPropagation();let n="ASC",i=s(r,"sort")||"string";r.classList.contains("asc")?(r.classList.remove("asc"),r.classList.add("desc"),n="DESC"):(r.classList.remove("desc"),r.classList.add("asc")),e=e.map(t=>(r!=t&&t.classList.remove("asc","desc"),t)),m(t,s(r,"sortkey"),n,i)})})}(t),function(t){window.addEventListener("resize",()=>R(t),{passive:!0})}(t)}(F);const B=o("th");g(B,{display:"none"}),a(B,"width",F.gutterWidth),a(B,"rowspan",F.props.shapes.length),n(p(F.$thead,"tr"),B),F.$scrollTH=B,F.scrollY&&(g(F.$scrollTH,{display:"table-cell"}),R(F))};var B=F;window.SmartTable=B}]); \ No newline at end of file