From eaf81d57aa0b32c2d878752e3a6334d860439579 Mon Sep 17 00:00:00 2001 From: Julyp Date: Sat, 8 Feb 2020 12:11:25 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0Readme?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 27 ++--- dist/smartTable.min.js | 227 ++++++++++++++++++++++++++++++++++++++++- examples/index.html | 10 +- lib/core/core.js | 2 +- 4 files changed, 248 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index 38d4e5f..474c8ab 100644 --- a/README.md +++ b/README.md @@ -22,7 +22,8 @@ - 多级表头 - 排序 - 树形数据 - - 单选、多选 + - 单选 + - 多选 ## 体验 可直接访问https://peng92055.github.io/smart-table @@ -86,18 +87,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 | -| selection | string | no | 单选或多选（radio、checkbox),选中值会存储在根节点selected属性上 | false | -| selectionKey | string or number | no | 单选或多选时选中取值对应的tbody中有效列的角标（角标从0开始） | 0 | - +| 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 | +| radioBgColor | string | no | 单选时，body中选中行的背景色 | '#D1E7FF' | diff --git a/dist/smartTable.min.js b/dist/smartTable.min.js index 6ee4b61..ba5c687 100644 --- a/dist/smartTable.min.js +++ b/dist/smartTable.min.js @@ -1 +1,226 @@ -/*! 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 +/*! 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; o < e.length; o++) { var n = { css: e[o][1], media: e[o][2], sourceMap: e[o][3] }; + a[t][o] ? a[t][o](n) : a[t].push(u(n, r)) } } + + function l(t) { var e = document.createElement("style"), + o = t.attributes || {}; if (void 0 === o.nonce) { var n = r.nc; + n && (o.nonce = n) } if (Object.keys(o).forEach((function(t) { e.setAttribute(t, o[t]) })), "function" == typeof t.insert) t.insert(e); + else { var a = i(t.insert || "head"); if (!a) throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid."); + a.appendChild(e) } return e } var d, c = (d = [], function(t, e) { return d[t] = e, d.filter(Boolean).join("\n") }); + + function f(t, e, r, o) { var n = r ? "" : o.css; if (t.styleSheet) t.styleSheet.cssText = c(e, n); + else { var i = document.createTextNode(n), + a = t.childNodes; + a[e] && t.removeChild(a[e]), a.length ? t.insertBefore(i, a[e]) : t.appendChild(i) } } + + function h(t, e, r) { var o = r.css, + n = r.media, + i = r.sourceMap; if (n ? t.setAttribute("media", n) : t.removeAttribute("media"), i && btoa && (o += "\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(i)))), " */")), t.styleSheet) t.styleSheet.cssText = o; + else { for (; t.firstChild;) t.removeChild(t.firstChild); + t.appendChild(document.createTextNode(o)) } } var p = null, + b = 0; + + function u(t, e) { var r, o, n; if (e.singleton) { var i = b++; + r = p || (p = l(e)), o = f.bind(null, r, i, !1), n = f.bind(null, r, i, !0) } else r = l(e), o = h.bind(null, r, e), n = function() {! function(t) { if (null === t.parentNode) return !1; + t.parentNode.removeChild(t) }(r) }; return o(t), + function(e) { if (e) { if (e.css === t.css && e.media === t.media && e.sourceMap === t.sourceMap) return; + o(t = e) } else n() } } + t.exports = function(t, e, r) { return (r = r || {}).singleton || "boolean" == typeof r.singleton || (r.singleton = n()), t = r.base ? t + r.base : t, e = e || [], a[t] || (a[t] = []), s(t, e, r), + function(e) { if (e = e || [], "[object Array]" === Object.prototype.toString.call(e)) { a[t] || (a[t] = []), s(t, e, r); for (var o = e.length; o < a[t].length; o++) a[t][o](); + a[t].length = e.length, 0 === a[t].length && delete a[t] } } } }, function(t, e, r) { + (e = r(3)(!1)).push([t.i, ".smart-table{position:relative;overflow:hidden;box-sizing:border-box;width:100%;max-width:100%;background-color:#fff;color:#6A6B6F;border:1px solid #ECF0F5;border-right:none;border-bottom:none}.smart-table:after,.smart-table:before{content:\"\";position:absolute;background-color:#ECF0F5;z-index:1}.smart-table:before{left:0;bottom:0;width:100%;height:1px}.smart-table:after{top:0;right:0;width:1px;height:100%}.smart-table table{border-spacing:0;border:0}.smart-table thead{background:#F5F7FB;font-size:13px}.smart-table tr{-webkit-transition:background-color .25s ease;transition:background-color .25s ease}.smart-table tbody{font-size:12px}.smart-table tbody tr[expand] td:first-child{cursor:pointer}.smart-table tbody tr[expand] td:first-child :before{-webkit-transition:0.35s ease transform;transition:0.35s ease transform;-webkit-transform-origin:25% 50%;transform-origin:25% 50%;content:'';float:left;width:0;height:0;border-width:6px;border-style:solid;border-color:transparent transparent transparent #c0c4cc;margin:5px 0 0 5px}.smart-table tbody tr[expand][expanded]>td: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.length; o++) { var n = [].concat(t[o]); + r && (n[2] ? n[2] = "".concat(r, " and ").concat(n[2]) : n[2] = r), e.push(n) } }, e } }, function(t, e, r) { "use strict"; + r.r(e); + r(0); + + function o(t, e) { let r = document.createElement(t); return e && (r.className = e), r } + + function n(t, e) { return t.appendChild(e) } + + function i(t, e) { return t.hasAttribute(e) } + + function a(t, e, r) { return t.setAttribute(e, r || !0) } + + function s(t, e) { return t.getAttribute(e) } + + function l(t, e) { return t.removeAttribute(e) } + + function d(t, e) { return e.forEach(e => { 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; t < s - 1; t++) y(e[t][r], d[r], o, n) ? i.push(e[t]) : a.push(e[t]); return t(i, r, o, n).concat(d, t(a, r, o, n)) }(JSON.parse(JSON.stringify(t.data)), e, r, o); + JSON.stringify(t.data) !== JSON.stringify(n) && (! function(t, e) { let r = 0; for (let o = 0; o < e.length; o++) { const n = e[o]; let i = 0; for (; i < t.length; i++) { const a = t[i]; if (n.$key === a.$key) { if (n.$el = a.$el, n.$fixedLeftEl = a.$fixedLeftEl, n.$fixedRightEl = a.$fixedRightEl, i < r) { const t = e[o - 1], + r = t.$el.nextSibling; if (c(r.parentNode, a.$el, r), t.$fixedLeftEl) { const e = t.$fixedLeftEl.nextSibling; + c(e.parentNode, a.$fixedLeftEl, e) } if (t.$fixedRightEl) { const e = t.$fixedRightEl.nextSibling; + c(e.parentNode, a.$fixedRightEl, e) } } else r = i; break } } } }(t.data, n), t.data = n) }; + + function y(t, e, r, o) { return "number" === o && (t = parseFloat(t), e = parseFloat(e)), "ASC" === r ? t < e : t > e } + + 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; e < r; e++) + if (void 0 === t[e]) return e }(o) || o.length; if (o[l] = t, i(t, "sort") && a(t, "sortkey", "field-" + l), s > 1) + for (let t = 1; t < s; t++) o[l + t] = 0; if (n > 1) + for (let t = 1; t < n; t++) { let o = r[e + t] || []; for (let t = 0; t < s; t++) o[l + t] = 0; + r[e + t] = o } + r[e] = o }) }), e.shapes = r, t.props = e }(F), + function(t, e) { const { $root: r, $thead: o, $tbody: n, options: i } = t, { height: a } = i; + b(o, "th").forEach(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; t < l - 1 && i(s[t], "fixed"); t++) { d = t, n.thead.push("field-" + t); let r = v(s[t], "colspan", 1); for (let o = 0; o < r; o++) n.tbody.push("field-" + (t + o)), n.width += e[t + o] } + if (i(s[l - 1], "fixed")) { let t = 0; for (let r = l - 1; r > 0 && i(s[r], "fixed") && r !== d; r--) { a.thead.push("field-" + r); let n = v(s[r], "colspan", 1); for (let r = 0; r < n; r++) t++, a.tbody.push("field-" + (o - t)), a.width += e[o - t] } } } + r.fixedLeft = n, r.fixedRight = a }(F), function(t, e, r) { let i = 320; const { fixedLeft: a, fixedRight: s } = t.props; if (a.thead.length > 0) { 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; t < n.length && (o.push(n[t]), n[t].id !== r); t++); + n = o, e = n.length; let i = n[n.length - 1]; + i && i.children.push(f), d && (n.push(f), f.children = []) } else o.push(f); + c && (g(p(t, "td"), { paddingLeft: 35 * e + "px" }), g(t, { display: r ? "" : "none" })) }), t.expandData = o, g(t.$tbodyWrapper, { height: "" }) }(F, E), + function(t) { + (function(t) { t.$tbodyWrapper.addEventListener("scroll", () => function(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 diff --git a/examples/index.html b/examples/index.html index 34da4d0..4d0a8eb 100644 --- a/examples/index.html +++ b/examples/index.html @@ -75,9 +75,13 @@ GitHub

表格类型：

-

● 单表头

-

● 多表头

-

● 树形表

+

• 单表头

+

• 单选

+

• 排序

+

• 多表头

+

• 固定列

+

• 多选

+

• 树形表

diff --git a/lib/core/core.js b/lib/core/core.js index 1e9b5cc..c68c693 100644 --- a/lib/core/core.js +++ b/lib/core/core.js @@ -585,7 +585,7 @@ function initExpand(vm, tbody) { data.push(node) } if (hasParent) { - styled(querySelector(row, "td"), { paddingLeft: 35 * paddingLength + "px" }) + styled(querySelector(row, "td"), { paddingLeft: 32 * paddingLength + "px" }) styled(row, { display: expandAll ? '' : 'none' }) } })