bkui-vue 0.0.1-beta.36 → 0.0.1-beta.37

package/lib/table/table.js

@@ -1 +1 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("@babel/runtime/helpers/defineProperty"),require("vue"),require("../virtual-render"),require("@babel/runtime/helpers/classCallCheck"),require("@babel/runtime/helpers/createClass"),require("../pagination"),require("@babel/runtime/helpers/typeof"),require("@babel/runtime/helpers/toConsumableArray"),require("lodash"));else if("function"==typeof define&&define.amd)define(["../shared","@babel/runtime/helpers/defineProperty","vue","../virtual-render","@babel/runtime/helpers/classCallCheck","@babel/runtime/helpers/createClass","../pagination","@babel/runtime/helpers/typeof","@babel/runtime/helpers/toConsumableArray","lodash"],t);else{var r="object"==typeof exports?t(require("../shared"),require("@babel/runtime/helpers/defineProperty"),require("vue"),require("../virtual-render"),require("@babel/runtime/helpers/classCallCheck"),require("@babel/runtime/helpers/createClass"),require("../pagination"),require("@babel/runtime/helpers/typeof"),require("@babel/runtime/helpers/toConsumableArray"),require("lodash")):t(e["../shared"],e["@babel/runtime/helpers/defineProperty"],e.vue,e["../virtual-render"],e["@babel/runtime/helpers/classCallCheck"],e["@babel/runtime/helpers/createClass"],e["../pagination"],e["@babel/runtime/helpers/typeof"],e["@babel/runtime/helpers/toConsumableArray"],e.lodash);for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(self,((e,t,r,n,o,a,i,l,s,c)=>(()=>{"use strict";var u={5801:e=>{e.exports=i},4212:t=>{t.exports=e},3511:e=>{e.exports=n},3162:e=>{e.exports=o},5111:e=>{e.exports=a},311:e=>{e.exports=t},642:e=>{e.exports=s},8541:e=>{e.exports=l},467:e=>{e.exports=c},748:e=>{e.exports=r}},p={};function d(e){var t=p[e];if(void 0!==t)return t.exports;var r=p[e]={exports:{}};return u[e](r,r.exports,d),r.exports}d.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return d.d(t,{a:t}),t},d.d=(e,t)=>{for(var r in t)d.o(t,r)&&!d.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},d.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),d.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var f={};return(()=>{d.r(f),d.d(f,{default:()=>q});var e=d(4212),t=d(311),r=d.n(t),n=d(748),o=d(3511),a=d.n(o),i=["none","row","col","outer"],l={data:e.PropTypes.arrayOf(e.PropTypes.any).def([]),columns:e.PropTypes.arrayOf(e.PropTypes.shape({label:e.PropTypes.oneOfType([e.PropTypes.func.def((function(){return""})),e.PropTypes.string.def("")]),field:e.PropTypes.oneOfType([e.PropTypes.func.def((function(){return""})),e.PropTypes.string.def("")]),render:e.PropTypes.oneOfType([e.PropTypes.func.def((function(){return""})),e.PropTypes.string.def("")]),width:e.PropTypes.oneOfType([e.PropTypes.number.def(void 0),e.PropTypes.string.def("auto")])})),activeColumn:e.PropTypes.oneOfType([e.PropTypes.number.def(-1),e.PropTypes.arrayOf(e.PropTypes.number.def(-1))]),columnPick:e.PropTypes.commonType(["multi","single","disabled"],"columnPick").def("disabled"),height:e.PropTypes.oneOfType([e.PropTypes.number,e.PropTypes.string]).def("auto"),minHeight:e.PropTypes.oneOfType([e.PropTypes.number,e.PropTypes.string]).def("auto"),rowHeight:e.PropTypes.oneOfType([e.PropTypes.number,e.PropTypes.func]).def(40),headHeight:e.PropTypes.number.def(40),showHead:e.PropTypes.bool.def(!0),virtualEnabled:e.PropTypes.bool.def(!1),border:e.PropTypes.arrayOf(e.PropTypes.commonType(i,"border")).def(["row"]),pagination:e.PropTypes.oneOfType([e.PropTypes.bool.def(!1),e.PropTypes.object.def({})]).def(!1),remotePagination:e.PropTypes.bool.def(!1)},s=d(3162),c=d.n(s),u=d(5111),p=d.n(u),h=d(5801),v=d.n(h),m=p()((function e(t,r){c()(this,e),this.props=null,this.ctx=null,this.props=t,this.ctx=r})),b=d(8541),y=d.n(b),g=d(642),C=d.n(g),P=d(467),T=void 0,k=function(e,t,r){var n;if(Object.prototype.hasOwnProperty.call(e,t))return"function"==typeof e[t]?(n=e[t]).call.apply(n,[T].concat(C()(r))):e[t]},x=function(e){return"disabled"!==e.columnPick?"multi"===e.columnPick?Array.isArray(e.activeColumn)?e.activeColumn:O(e.activeColumn):Array.isArray(e.activeColumn)?O(e.activeColumn[0]):O(e.activeColumn):[]},O=function(e){return/^\d+$/.test("".concat(e))?[parseInt("".concat(e),10)]:[]},w=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"100%",r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n="";return n=/^auto|null|undefined$/gi.test("".concat(e))?t:/^\d+\.?\d+$/.test("".concat(e))?"".concat(e,"px"):e,r&&(n="calc(".concat(n," - ").concat(r,")")),n},j=function(e,t){if(e){if("object"===y()(e)){var r=Object.prototype.hasOwnProperty.call(e,"current")?e.current:e.value;return/\d+/.test(r)||(r=1),Object.assign(Object.assign(Object.assign({},t),e),{current:r})}return t}return{}},N=function(){function t(e,r,n,o){c()(this,t),this.props=e,this.context=r,this.reactiveProp=n,this.colgroups=o,this.plugins=new m(e,r)}return p()(t,[{key:"propActiveCols",get:function(){return this.reactiveProp.activeColumns}},{key:"renderTableHeadSchema",value:function(){return this.$createElement,(0,n.createVNode)("table",{cellpadding:0,cellspacing:0},[this.renderColGroup(),this.renderHeader()])}},{key:"renderTableBodySchema",value:function(e){return this.$createElement,(0,n.createVNode)("table",{cellpadding:0,cellspacing:0},[this.renderColGroup(),this.renderTBody(e)])}},{key:"renderTableFooter",value:function(e){var t=this;return this.$createElement,(0,n.createVNode)(v(),(0,n.mergeProps)(e,{modelValue:e.current,onLimitChange:function(e){return t.handlePageLimitChange(e)},onChange:function(e){return t.hanlePageChange(e)}}),null)}},{key:"handlePageLimitChange",value:function(e){Object.assign(this.props.pagination,{limit:e}),this.context.emit("pageLimitChange",e)}},{key:"hanlePageChange",value:function(e){Object.assign(this.props.pagination,{current:e,value:e}),this.context.emit("pageValueChange",e)}},{key:"setColumnActive",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],r=this.propActiveCols.find((function(t){return t.index===e}));Object.assign(r,{active:!r.active}),t&&this.propActiveCols.filter((function(t){return t.index!==e&&t.active})).forEach((function(e){Object.assign(e,{active:!1})}))}},{key:"handleColumnHeadClick",value:function(e){"disabled"!==this.props.columnPick&&(this.setColumnActive(e,"single"===this.props.columnPick),this.context.emit("column-pick",this.propActiveCols))}},{key:"renderHeader",value:function(){var t=this,r=(this.$createElement,{"--row-height":"".concat(k(this.props,"headHeight",["thead"]),"px")});return(0,n.createVNode)("thead",{style:r},[(0,n.createVNode)("tr",null,[this.props.columns.map((function(r,o){return(0,n.createVNode)("th",{colspan:1,rowspan:1,class:(0,e.classes)({active:t.isColActive(o)}),onClick:function(){return t.handleColumnHeadClick(o)}},[(0,n.createVNode)("div",{class:"cell"},[k(r,"label",[r])])])}))])])}},{key:"renderTBody",value:function(e){var t=this;return this.$createElement,(0,n.createVNode)("tbody",null,[e.map((function(r,o){var a={"--row-height":"".concat(k(t.props,"rowHeight",["tbody",r,o]),"px")};return(0,n.createVNode)("tr",{style:a,onClick:function(n){return t.handleRowClick(n,r,o,e)},onDblclick:function(n){return t.handleRowDblClick(n,r,o,e)}},[t.props.columns.map((function(a){return(0,n.createVNode)("td",{colspan:1,rowspan:1},[(0,n.createVNode)("div",{class:"cell"},[t.renderCell(r,a,o,e)])])}))])}))])}},{key:"handleRowClick",value:function(e,t,r,n){this.context.emit("rowClick",e,t,r,n,this)}},{key:"handleRowDblClick",value:function(e,t,r,n){this.context.emit("rowDblClick",e,t,r,n,this)}},{key:"renderCell",value:function(e,t,r,n){var o=e[k(t,"field",[t,e])];return"function"==typeof t.render?t.render(o,e,r,n):o}},{key:"isColActive",value:function(e){return"disabled"!==this.props.columnPick&&this.propActiveCols.some((function(t){return t.index===e&&t.active}))}},{key:"renderColGroup",value:function(){var t=this;return this.$createElement,(0,n.createVNode)("colgroup",null,[(this.colgroups||[]).map((function(r,o){var a,i=(0,e.classes)({active:t.isColActive(o)}),l={width:(a=r.calcWidth,w(a,"auto"))};return(0,n.createVNode)("col",{class:i,style:l},null)}))])}}]),t}();const V=(0,n.defineComponent)({name:"Table",props:l,emits:["columnPick","rowClick","rowDblClick","pageLimitChange","pageValueChange"],setup:function(t,o){this.$createElement;var l=(0,n.reactive)(x(t)),s=(0,n.reactive)(t.columns.map((function(e){return Object.assign(Object.assign({},e),{calcWidth:null})}))),c=(0,n.ref)(0),u=(0,n.ref)(0),p=(0,n.reactive)({count:0,limit:10,current:1});p=j(t.pagination,p);var d=function(){if(!t.pagination||t.remotePagination)return c.value=0,void(u.value=t.data.length);c.value=(p.current-1)*p.limit,u.value=p.current*p.limit};d();var f=null,h=(0,n.ref)(),v=function(){return(t.columns||[]).map((function(e,t){return{index:t,active:l.some((function(e){return e===t})),_column:e}}))},m=(0,n.reactive)({activeColumns:v(),scrollTranslateY:0});(0,n.watch)((function(){return[t.activeColumn,t.columns]}),(function(){(0,n.nextTick)((function(){m.activeColumns=v();var e=x(t);m.activeColumns.forEach((function(t,r){Object.assign(t,{active:e.some((function(e){return e===r}))})}))}))}),{deep:!0});var b=new N(t,o,m,s),y=(0,n.computed)((function(){return{minHeight:w(t.minHeight,"auto")}}));(0,n.watchEffect)((function(){p=j(t.pagination,p),d()}));var g=(0,n.computed)((function(){return t.data.slice(c.value,u.value)})),T=(0,n.computed)((function(){return t.pagination?t.remotePagination?p:Object.assign(Object.assign({},p),{count:t.data.length}):null})),k=(0,n.computed)((function(){var e,r=w(t.height),n=t.showHead?w(t.headHeight):"0",o=(e=t.height,!/^\d+\.?\d*(px|%)?$/.test("".concat(e))),a=t.pagination?40:0,i="calc(".concat(r," - ").concat(n," - ").concat(a,"px - 2px)");return Object.assign({display:"block"},o?{maxHeight:i}:{height:i})})),O=(0,n.computed)((function(){return(0,e.classes)(r()({},(0,e.resolveClassName)("table"),!0),(o=["row"],"string"==typeof(n=t.border)&&o.push(n),Array.isArray(n)&&o.push.apply(o,C()(n.filter((function(e){return i.includes(e)})))),C()(new Set(o)).map((function(e){return"bordered-".concat(e)})).join(" ")));var n,o})),V=(0,e.classes)(r()({},(0,e.resolveClassName)("table-head"),!0)),q=(0,e.classes)(r()({},(0,e.resolveClassName)("table-body"),!0)),A=(0,e.classes)(r()({},(0,e.resolveClassName)("table-footer"),!0)),H=function(e){var t=e[1];m.scrollTranslateY=t.translateY};return(0,n.onMounted)((function(){f=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:60,n=arguments.length>3&&void 0!==arguments[3]&&arguments[3],o=(0,P.throttle)((function(){"function"==typeof t&&t()}),r),a=new ResizeObserver((function(){o()}));return n&&"function"==typeof t&&t(),{start:function(){a.observe(e)},stop:function(){a.disconnect(),a.unobserve(e)}}}(h.value,(function(){!function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:20,n=(e.getBoundingClientRect()||{}).width,o=[],a=function(e,t){var r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];Object.assign(e,{calcWidth:t}),r&&(n-=t)<0&&(n=0)};if(t.forEach((function(e,t){var i=String(e.width),l=!0;if(/^\d+\.?\d*(px)?$/.test(i)){var s=Number(i.replace("px",""));a(e,s),l=!1}if(/^\d+\.?\d*%$/.test(i)){var c=r;if(n>0){var u=Number(i.replace("%",""));c=n*u/100}a(e,c),l=!1}l&&o.push(t)})),o.length>0){var i=r;n>0&&(i=n/o.length,o.forEach((function(e){return a(t[e],i,!1)})))}}(h.value,s,20)}),60,!0),f.start()})),(0,n.onBeforeUnmount)((function(){f.stop(),f=null})),o.expose({plugins:b.plugins}),function(){return(0,n.createVNode)("div",{class:O.value,style:y.value,ref:h},[(0,n.createVNode)("div",{class:V},[t.showHead&&b.renderTableHeadSchema()]),(0,n.createVNode)(a(),{lineHeight:t.rowHeight,class:q,style:k.value,list:g.value,onContentScroll:H,throttleDelay:0,enabled:t.virtualEnabled},{default:function(e){return b.renderTableBodySchema(e.data||t.data)},afterContent:function(){return(0,n.createVNode)("div",{class:(0,e.resolveClassName)("table-fixed")},null)}}),(0,n.createVNode)("div",{class:A},[t.pagination&&b.renderTableFooter(T.value)])])}}}),q=(0,e.withInstall)(V)})(),f})()));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("@babel/runtime/helpers/defineProperty"),require("vue"),require("../virtual-render"),require("@babel/runtime/helpers/classCallCheck"),require("@babel/runtime/helpers/createClass"),require("../pagination"),require("@babel/runtime/helpers/typeof"),require("@babel/runtime/helpers/toConsumableArray"),require("lodash"));else if("function"==typeof define&&define.amd)define(["../shared","@babel/runtime/helpers/defineProperty","vue","../virtual-render","@babel/runtime/helpers/classCallCheck","@babel/runtime/helpers/createClass","../pagination","@babel/runtime/helpers/typeof","@babel/runtime/helpers/toConsumableArray","lodash"],t);else{var r="object"==typeof exports?t(require("../shared"),require("@babel/runtime/helpers/defineProperty"),require("vue"),require("../virtual-render"),require("@babel/runtime/helpers/classCallCheck"),require("@babel/runtime/helpers/createClass"),require("../pagination"),require("@babel/runtime/helpers/typeof"),require("@babel/runtime/helpers/toConsumableArray"),require("lodash")):t(e["../shared"],e["@babel/runtime/helpers/defineProperty"],e.vue,e["../virtual-render"],e["@babel/runtime/helpers/classCallCheck"],e["@babel/runtime/helpers/createClass"],e["../pagination"],e["@babel/runtime/helpers/typeof"],e["@babel/runtime/helpers/toConsumableArray"],e.lodash);for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(self,((e,t,r,n,o,a,i,l,c,s)=>(()=>{"use strict";var u={5801:e=>{e.exports=i},4212:t=>{t.exports=e},3511:e=>{e.exports=n},3162:e=>{e.exports=o},5111:e=>{e.exports=a},311:e=>{e.exports=t},642:e=>{e.exports=c},8541:e=>{e.exports=l},467:e=>{e.exports=s},748:e=>{e.exports=r}},p={};function d(e){var t=p[e];if(void 0!==t)return t.exports;var r=p[e]={exports:{}};return u[e](r,r.exports,d),r.exports}d.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return d.d(t,{a:t}),t},d.d=(e,t)=>{for(var r in t)d.o(t,r)&&!d.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},d.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),d.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var f={};return(()=>{d.r(f),d.d(f,{default:()=>q});var e=d(4212),t=d(311),r=d.n(t),n=d(748),o=d(3511),a=d.n(o),i=["none","row","col","outer"],l={data:e.PropTypes.arrayOf(e.PropTypes.any).def([]),columns:e.PropTypes.arrayOf(e.PropTypes.shape({label:e.PropTypes.oneOfType([e.PropTypes.func.def((function(){return""})),e.PropTypes.string.def("")]),field:e.PropTypes.oneOfType([e.PropTypes.func.def((function(){return""})),e.PropTypes.string.def("")]),render:e.PropTypes.oneOfType([e.PropTypes.func.def((function(){return""})),e.PropTypes.string.def("")]),width:e.PropTypes.oneOfType([e.PropTypes.number.def(void 0),e.PropTypes.string.def("auto")])})),activeColumn:e.PropTypes.oneOfType([e.PropTypes.number.def(-1),e.PropTypes.arrayOf(e.PropTypes.number.def(-1))]),columnPick:e.PropTypes.commonType(["multi","single","disabled"],"columnPick").def("disabled"),height:e.PropTypes.oneOfType([e.PropTypes.number,e.PropTypes.string]).def("auto"),minHeight:e.PropTypes.oneOfType([e.PropTypes.number,e.PropTypes.string]).def("auto"),rowHeight:e.PropTypes.oneOfType([e.PropTypes.number,e.PropTypes.func]).def(40),headHeight:e.PropTypes.number.def(40),showHead:e.PropTypes.bool.def(!0),virtualEnabled:e.PropTypes.bool.def(!1),border:e.PropTypes.arrayOf(e.PropTypes.commonType(i,"border")).def(["row"]),pagination:e.PropTypes.oneOfType([e.PropTypes.bool.def(!1),e.PropTypes.object.def({})]).def(!1),remotePagination:e.PropTypes.bool.def(!1)},c=d(3162),s=d.n(c),u=d(5111),p=d.n(u),h=d(5801),v=d.n(h),m=p()((function e(t,r){s()(this,e),this.props=null,this.ctx=null,this.props=t,this.ctx=r})),b=d(8541),y=d.n(b),g=d(642),C=d.n(g),P=d(467),T=void 0,x=function(e,t,r){var n;if(Object.prototype.hasOwnProperty.call(e,t))return"function"==typeof e[t]?(n=e[t]).call.apply(n,[T].concat(C()(r))):e[t]},k=function(e){return"disabled"!==e.columnPick?"multi"===e.columnPick?Array.isArray(e.activeColumn)?e.activeColumn:O(e.activeColumn):Array.isArray(e.activeColumn)?O(e.activeColumn[0]):O(e.activeColumn):[]},O=function(e){return/^\d+$/.test("".concat(e))?[parseInt("".concat(e),10)]:[]},w=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"100%",r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n="";return n=/^auto|null|undefined$/gi.test("".concat(e))?t:/^\d+\.?\d+$/.test("".concat(e))?"".concat(e,"px"):e,r&&(n="calc(".concat(n," - ").concat(r,")")),n},j=function(e,t){if(e){if("object"===y()(e)){var r=Object.prototype.hasOwnProperty.call(e,"current")?e.current:e.value;return/\d+/.test(r)||(r=1),Object.assign(Object.assign(Object.assign({},t),e),{current:r})}return t}return{}},N=function(){function t(r,n,o,a){var i=this;s()(this,t),this.getColumnClass=function(e){return"".concat(i.uuid,"-column-").concat(e)},this.props=r,this.context=n,this.reactiveProp=o,this.colgroups=a,this.plugins=new m(r,n),this.uuid=(0,e.random)(8)}return p()(t,[{key:"propActiveCols",get:function(){return this.reactiveProp.activeColumns}},{key:"renderTableHeadSchema",value:function(){return this.$createElement,(0,n.createVNode)("table",{cellpadding:0,cellspacing:0},[this.renderColGroup(),this.renderHeader()])}},{key:"renderTableBodySchema",value:function(e){return this.$createElement,(0,n.createVNode)("table",{cellpadding:0,cellspacing:0},[this.renderColGroup(),this.renderTBody(e)])}},{key:"renderTableFooter",value:function(e){var t=this;return this.$createElement,(0,n.createVNode)(v(),(0,n.mergeProps)(e,{modelValue:e.current,onLimitChange:function(e){return t.handlePageLimitChange(e)},onChange:function(e){return t.hanlePageChange(e)}}),null)}},{key:"handlePageLimitChange",value:function(e){Object.assign(this.props.pagination,{limit:e}),this.context.emit("pageLimitChange",e)}},{key:"hanlePageChange",value:function(e){Object.assign(this.props.pagination,{current:e,value:e}),this.context.emit("pageValueChange",e)}},{key:"setColumnActive",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],r=this.propActiveCols.find((function(t){return t.index===e}));Object.assign(r,{active:!r.active}),t&&this.propActiveCols.filter((function(t){return t.index!==e&&t.active})).forEach((function(e){Object.assign(e,{active:!1})}))}},{key:"handleColumnHeadClick",value:function(e){"disabled"!==this.props.columnPick&&(this.setColumnActive(e,"single"===this.props.columnPick),this.context.emit("column-pick",this.propActiveCols))}},{key:"renderHeader",value:function(){var t=this,r=(this.$createElement,{"--row-height":"".concat(x(this.props,"headHeight",["thead"]),"px")});return(0,n.createVNode)("thead",{style:r},[(0,n.createVNode)("tr",null,[this.props.columns.map((function(r,o){return(0,n.createVNode)("th",{colspan:1,rowspan:1,class:(0,e.classes)({active:t.isColActive(o)}),onClick:function(){return t.handleColumnHeadClick(o)}},[(0,n.createVNode)("div",{class:"cell"},[x(r,"label",[r])])])}))])])}},{key:"renderTBody",value:function(e){var t=this;return this.$createElement,(0,n.createVNode)("tbody",null,[e.map((function(r,o){var a={"--row-height":"".concat(x(t.props,"rowHeight",["tbody",r,o]),"px")};return(0,n.createVNode)("tr",{style:a,onClick:function(n){return t.handleRowClick(n,r,o,e)},onDblclick:function(n){return t.handleRowDblClick(n,r,o,e)}},[t.props.columns.map((function(o,a){return(0,n.createVNode)("td",{class:t.getColumnClass(a),colspan:1,rowspan:1},[(0,n.createVNode)("div",{class:"cell"},[t.renderCell(r,o,a,e)])])}))])}))])}},{key:"handleRowClick",value:function(e,t,r,n){this.context.emit("rowClick",e,t,r,n,this)}},{key:"handleRowDblClick",value:function(e,t,r,n){this.context.emit("rowDblClick",e,t,r,n,this)}},{key:"renderCell",value:function(e,t,r,n){var o=e[x(t,"field",[t,e])];return"function"==typeof t.render?t.render(o,e,r,n):o}},{key:"isColActive",value:function(e){return"disabled"!==this.props.columnPick&&this.propActiveCols.some((function(t){return t.index===e&&t.active}))}},{key:"renderColGroup",value:function(){var t=this;return this.$createElement,(0,n.createVNode)("colgroup",null,[(this.colgroups||[]).map((function(r,o){var a,i=(0,e.classes)({active:t.isColActive(o)}),l="".concat((a=r.calcWidth,w(a,"auto"))).replace(/px$/i,"");return(0,n.createVNode)("col",{class:i,width:l},null)}))])}}]),t}();const V=(0,n.defineComponent)({name:"Table",props:l,emits:["columnPick","rowClick","rowDblClick","pageLimitChange","pageValueChange"],setup:function(t,o){this.$createElement;var l=(0,n.reactive)(k(t)),c=(0,n.reactive)(t.columns.map((function(e){return Object.assign(Object.assign({},e),{calcWidth:null})}))),s=(0,n.ref)(0),u=(0,n.ref)(0),p=(0,n.reactive)({count:0,limit:10,current:1});p=j(t.pagination,p);var d=function(){if(!t.pagination||t.remotePagination)return s.value=0,void(u.value=t.data.length);s.value=(p.current-1)*p.limit,u.value=p.current*p.limit};d();var f=null,h=(0,n.ref)(),v=function(){return(t.columns||[]).map((function(e,t){return{index:t,active:l.some((function(e){return e===t})),_column:e}}))},m=(0,n.reactive)({activeColumns:v(),scrollTranslateY:0});(0,n.watch)((function(){return[t.activeColumn,t.columns]}),(function(){(0,n.nextTick)((function(){m.activeColumns=v();var e=k(t);m.activeColumns.forEach((function(t,r){Object.assign(t,{active:e.some((function(e){return e===r}))})}))}))}),{deep:!0});var b=new N(t,o,m,c),y=(0,n.computed)((function(){return{minHeight:w(t.minHeight,"auto")}}));(0,n.watchEffect)((function(){p=j(t.pagination,p),d()}));var g=(0,n.computed)((function(){return t.data.slice(s.value,u.value)})),T=(0,n.computed)((function(){return t.pagination?t.remotePagination?p:Object.assign(Object.assign({},p),{count:t.data.length}):null})),x=(0,n.computed)((function(){var e,r=w(t.height),n=t.showHead?w(t.headHeight):"0",o=(e=t.height,!/^\d+\.?\d*(px|%)?$/.test("".concat(e))),a=t.pagination?40:0,i="calc(".concat(r," - ").concat(n," - ").concat(a,"px - 2px)");return Object.assign({display:"block"},o?{maxHeight:i}:{height:i})})),O=(0,n.computed)((function(){return(0,e.classes)(r()({},(0,e.resolveClassName)("table"),!0),(o=["row"],"string"==typeof(n=t.border)&&o.push(n),Array.isArray(n)&&o.push.apply(o,C()(n.filter((function(e){return i.includes(e)})))),C()(new Set(o)).map((function(e){return"bordered-".concat(e)})).join(" ")));var n,o})),V=(0,e.classes)(r()({},(0,e.resolveClassName)("table-head"),!0)),q=(0,e.classes)(r()({},(0,e.resolveClassName)("table-body"),!0)),A=(0,e.classes)(r()({},(0,e.resolveClassName)("table-footer"),!0)),H=function(e){var t=e[1];m.scrollTranslateY=t.translateY};return(0,n.onMounted)((function(){f=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:60,n=arguments.length>3&&void 0!==arguments[3]&&arguments[3],o=(0,P.throttle)((function(){"function"==typeof t&&t()}),r),a=new ResizeObserver((function(){o()}));return n&&"function"==typeof t&&t(),{start:function(){a.observe(e)},stop:function(){a.disconnect(),a.unobserve(e)}}}(h.value,(function(){!function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:20,n=(e.getBoundingClientRect()||{}).width-4,o=[],a=function(e,t){var r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];Object.assign(e,{calcWidth:t}),r&&(n-=t)<0&&(n=0)};if(t.forEach((function(e,t){var i=String(e.width),l=!0;if(/^\d+\.?\d*(px)?$/.test(i)){var c=Number(i.replace("px",""));a(e,c),l=!1}if(/^\d+\.?\d*%$/.test(i)){var s=r;if(n>0){var u=Number(i.replace("%",""));s=n*u/100}a(e,s),l=!1}l&&o.push(t)})),o.length>0){var i=r;n>0&&(i=n/o.length,o.forEach((function(e){return a(t[e],i,!1)})))}}(h.value,c,20)}),60,!0),f.start()})),(0,n.onBeforeUnmount)((function(){f.stop(),f=null})),o.expose({plugins:b.plugins}),function(){return(0,n.createVNode)("div",{class:O.value,style:y.value,ref:h},[(0,n.createVNode)("div",{class:V},[t.showHead&&b.renderTableHeadSchema()]),(0,n.createVNode)(a(),{lineHeight:t.rowHeight,class:q,style:x.value,list:g.value,onContentScroll:H,throttleDelay:0,enabled:t.virtualEnabled},{default:function(e){return b.renderTableBodySchema(e.data||t.data)},afterContent:function(){return(0,n.createVNode)("div",{class:(0,e.resolveClassName)("table-fixed")},null)}}),(0,n.createVNode)("div",{class:A},[t.pagination&&b.renderTableFooter(T.value)])])}}}),q=(0,e.withInstall)(V)})(),f})()));

package/lib/table/table.less

@@ -16,13 +16,13 @@
     table {
       width: 100%;
       border-collapse: collapse;
-
+      table-layout: fixed;
+      
       th,
       td {
         min-width: 80px;
 
         .cell {
-          height: var(--row-height);
           padding: 0 15px;
           overflow: hidden;
           line-height: var(--row-height);
@@ -65,7 +65,8 @@
   }
 
   &.bordered-row {
-    .cell { 
+    td,
+    th { 
       border-bottom: 1px solid @table-border-color;
     }
   }
@@ -78,14 +79,10 @@
   &.bordered-col {
     th,
     td {
-      .cell { 
-        border-right: 1px solid @table-border-color;
-      }
+      border-right: 1px solid @table-border-color;
 
       &:last-child {
-        .cell {
-          border-right: none;
-        }
+        border-right: none;
       }
     }
 
@@ -94,12 +91,10 @@
   &.bordered-none {
     th,
     td {
-      .cell {
-        border-top: none;
-        border-right: none;
-        border-bottom: none;
-        border-left: none;
-      }
+      border-top: none;
+      border-right: none;
+      border-bottom: none;
+      border-left: none;
     }
   }
 

package/lib/table/table.variable.css

@@ -108,6 +108,7 @@
 .bk-table .bk-table-body table {
   width: 100%;
   border-collapse: collapse;
+  table-layout: fixed;
 }
 .bk-table .bk-table-head table th,
 .bk-table .bk-table-body table th,
@@ -119,7 +120,6 @@
 .bk-table .bk-table-body table th .cell,
 .bk-table .bk-table-head table td .cell,
 .bk-table .bk-table-body table td .cell {
-  height: var(--row-height);
   padding: 0 15px;
   overflow: hidden;
   line-height: var(--row-height);
@@ -149,23 +149,24 @@
 .bk-table .bk-table-footer {
   line-height: 40px;
 }
-.bk-table.bordered-row .cell {
+.bk-table.bordered-row td,
+.bk-table.bordered-row th {
   border-bottom: 1px solid var(--table-border-color);
 }
 .bk-table.bordered-outer {
   border-right: 1px solid var(--table-border-color);
   border-left: 1px solid var(--table-border-color);
 }
-.bk-table.bordered-col th .cell,
-.bk-table.bordered-col td .cell {
+.bk-table.bordered-col th,
+.bk-table.bordered-col td {
   border-right: 1px solid var(--table-border-color);
 }
-.bk-table.bordered-col th:last-child .cell,
-.bk-table.bordered-col td:last-child .cell {
+.bk-table.bordered-col th:last-child,
+.bk-table.bordered-col td:last-child {
   border-right: none;
 }
-.bk-table.bordered-none th .cell,
-.bk-table.bordered-none td .cell {
+.bk-table.bordered-none th,
+.bk-table.bordered-none td {
   border-top: none;
   border-right: none;
   border-bottom: none;

package/lib/virtual-render/virtual-render.css

@@ -20,21 +20,14 @@
   scrollbar-width: thin;
 }
 .bk-virtual-render.bk-scroll-x::-webkit-scrollbar {
-  height: 8px;
-  background-color: transparent;
-}
-.bk-virtual-render.bk-scroll-x::-webkit-scrollbar-thumb {
-  background-color: #a0a0a0;
-  border-radius: 8px;
+  height: 6px;
 }
 .bk-virtual-render.bk-scroll-y {
   overflow-y: auto;
 }
 .bk-virtual-render.bk-scroll-y::-webkit-scrollbar {
-  width: 6px;
-  background-color: transparent;
+  width: 4px;
 }
 .bk-virtual-render.bk-scroll-y::-webkit-scrollbar-thumb {
-  background-color: #dcdee5;
-  border-radius: 6px;
+  border-radius: 4px;
 }

package/lib/virtual-render/virtual-render.less

@@ -24,13 +24,7 @@
     scrollbar-width: thin;
 
     &::-webkit-scrollbar {
-      height: 8px;
-      background-color: transparent;
-    }
-
-    &::-webkit-scrollbar-thumb {
-      background-color: #a0a0a0;
-      border-radius: 8px;
+      height: 6px;
     }
   }
     
@@ -38,13 +32,11 @@
     overflow-y: auto;
 
     &::-webkit-scrollbar {
-      width: 6px;
-      background-color: transparent;
+      width: 4px;
     }
 
     &::-webkit-scrollbar-thumb {
-      background-color: #dcdee5;
-      border-radius: 6px;
+      border-radius: 4px;
     }
   }
 }

package/lib/virtual-render/virtual-render.variable.css

@@ -20,21 +20,14 @@
   scrollbar-width: thin;
 }
 .bk-virtual-render.bk-scroll-x::-webkit-scrollbar {
-  height: 8px;
-  background-color: transparent;
-}
-.bk-virtual-render.bk-scroll-x::-webkit-scrollbar-thumb {
-  background-color: #a0a0a0;
-  border-radius: 8px;
+  height: 6px;
 }
 .bk-virtual-render.bk-scroll-y {
   overflow-y: auto;
 }
 .bk-virtual-render.bk-scroll-y::-webkit-scrollbar {
-  width: 6px;
-  background-color: transparent;
+  width: 4px;
 }
 .bk-virtual-render.bk-scroll-y::-webkit-scrollbar-thumb {
-  background-color: #dcdee5;
-  border-radius: 6px;
+  border-radius: 4px;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "0.0.1-beta.36",
+  "version": "0.0.1-beta.37",
   "workspaces": {
     "packages": [
       "packages/!(**.bak)*"