vxe-pc-ui 4.5.1 → 4.5.2

package/lib/split/src/split.js

@@ -24,6 +24,10 @@ var _default = exports.default = (0, _vue.defineComponent)({
       type: Boolean,
       default: () => (0, _ui.getConfig)().split.border
     },
+    padding: {
+      type: Boolean,
+      default: () => (0, _ui.getConfig)().split.padding
+    },
     itemConfig: Object
   },
   emits: [],
@@ -235,6 +239,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
     const renderItems = () => {
       const {
         border,
+        padding,
         vertical
       } = props;
       const {
@@ -262,6 +267,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         itemVNs.push((0, _vue.h)('div', {
           xid: id,
           class: ['vxe-split-item', vertical ? 'is--vertical' : 'is--horizontal', {
+            'is--padding': padding,
             'is--border': border,
             'is--height': renderHeight,
             'is--width': renderWidth,
@@ -276,7 +282,9 @@ var _default = exports.default = (0, _vue.defineComponent)({
         }) : (0, _ui.renderEmptyElement)($xeSplit), (0, _vue.h)('div', {
           xid: id,
           class: 'vxe-split-item--wrapper'
-        }, defaultSlot ? callSlot(defaultSlot, {}) : [])]));
+        }, [(0, _vue.h)('div', {
+          class: 'vxe-split-item--inner'
+        }, defaultSlot ? callSlot(defaultSlot, {}) : [])])]));
       });
       return (0, _vue.h)('div', {
         class: 'vxe-split-wrapper'

package/lib/split/src/split.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_ui=require("../../ui"),_vn=require("../../ui/src/vn"),_dom=require("../../ui/src/dom"),_utils=require("../../ui/src/utils"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeSplit",props:{width:[Number,String],height:[Number,String],vertical:{type:Boolean,default:()=>(0,_ui.getConfig)().split.vertical},border:{type:Boolean,default:()=>(0,_ui.getConfig)().split.border},itemConfig:Object},emits:[],setup(b,e){const{emit:l,slots:s}=e;var t=_xeUtils.default.uniqueId();const U=(0,_vue.ref)(),C=(0,_vue.reactive)({staticItems:[]});const N=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().split.itemConfig,b.itemConfig)),i={computeItemOpts:N},r={refElem:U},a={xID:t,props:b,context:e,reactData:C,internalData:{},getRefMaps:()=>r,getComputeMaps:()=>i};const d=(e,t)=>e&&(_xeUtils.default.isString(e)&&(e=s[e]||null),_xeUtils.default.isFunction(e))?(0,_vn.getSlotVNs)(e(t)):[],u=()=>(0,_vue.nextTick)().then(()=>{var e=b["vertical"],t=C["staticItems"],i=U.value;if(i){const r=i.clientWidth,s=i.clientHeight;if(r&&s){i=N.value;const u=_xeUtils.default.toNumber(i.minWidth),n=_xeUtils.default.toNumber(i.minHeight),o=[];if(e){let l=0;if(t.forEach(e=>{var t=e["height"];let i=0;t?(i=(0,_dom.isScale)(t)?s*_xeUtils.default.toNumber(t):_xeUtils.default.toNumber(t),e.renderHeight=i):o.push(e),l+=i}),o.length){const a=(s-l)/o.length;o.forEach(e=>{e.renderHeight=Math.max(_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(e.minHeight,n)),a)})}}else{let l=0;if(t.forEach(e=>{var t=e["width"];let i=0;t?(i=(0,_dom.isScale)(t)?r*_xeUtils.default.toNumber(t):_xeUtils.default.toNumber(t),e.renderWidth=i):o.push(e),l+=i}),o.length){const d=(r-l)/o.length;o.forEach(e=>{e.renderWidth=Math.max(_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(e.minWidth,u)),d)})}}}}}),c=e=>{e.preventDefault();const i=b["vertical"];var t=C["staticItems"],l=e.currentTarget;const r=U.value;if(r){const n=l.getAttribute("xid");l=_xeUtils.default.findIndexOf(t,e=>e.id===n);const o=t[l];if(o){var s=N.value,u=_xeUtils.default.toNumber(s.minWidth),s=_xeUtils.default.toNumber(s.minHeight);const a=t[l-1];t=a?r.querySelector(`.vxe-split-item[xid="${a.id}"]`):null,l=o?r.querySelector(`.vxe-split-item[xid="${o.id}"]`):null;const d=t?t.clientWidth:0,c=l?l.clientWidth:0,h=t?t.clientHeight:0,m=l?l.clientHeight:0,f=_xeUtils.default.toNumber(a?(0,_utils.getGlobalDefaultConfig)(a.minWidth,u):u),v=_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(o.minWidth,u)),_=_xeUtils.default.toNumber(a?(0,_utils.getGlobalDefaultConfig)(a.minHeight,s):s),g=_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(o.minHeight,s)),p=e.clientX,x=e.clientY;(0,_dom.addClass)(r,"is--drag"),document.onmousemove=e=>{var t;e.preventDefault(),i?0<(t=e.clientY-x)?a&&m-t>=g&&(a.renderHeight=h+t,o.renderHeight=m-t):a&&h+t>=_&&(a.renderHeight=h+t,o.renderHeight=m-t):0<(t=e.clientX-p)?a&&c-t>=v&&(a.renderWidth=d+t,o.renderWidth=c-t):a&&d+t>=f&&(a.renderWidth=d+t,o.renderWidth=c-t)},document.onmouseup=()=>{document.onmousemove=null,(document.onmouseup=null,_dom.removeClass)(r,"is--drag")}}}};t={dispatchEvent:(e,t,i)=>{l(e,(0,_ui.createEvent)(i,{$split:a},t))},recalculate:u};Object.assign(a,t,{});return(0,_vue.watch)(()=>C.staticItems,()=>{u()}),(0,_vue.onMounted)(()=>{u()}),(0,_vue.onActivated)(()=>{u()}),(0,_vue.provide)("$xeSplit",a),a.renderVN=()=>{var{vertical:e,width:t,height:i}=b,l=s.default,r={};return i&&(r.height=(0,_dom.toCssUnit)(i)),t&&(r.width=(0,_dom.toCssUnit)(t)),(0,_vue.h)("div",{ref:U,class:["vxe-split",e?"is--vertical":"is--horizontal"],style:r},[(0,_vue.h)("div",{class:"vxe-split-slots"},l?l({}):[]),(()=>{const{border:u,vertical:n}=b;var e=C["staticItems"];const o=[];return e.forEach((e,t)=>{var{id:e,slots:i,renderHeight:l,renderWidth:r}=e,i=i?i.default:null,s={};n?l&&(s.height=(0,_dom.toCssUnit)(l)):r&&(s.width=(0,_dom.toCssUnit)(r)),o.push((0,_vue.h)("div",{xid:e,class:["vxe-split-item",n?"is--vertical":"is--horizontal",{"is--border":u,"is--height":l,"is--width":r,"is--fill":!l&&!r,"is--handle":0<t}],style:s},[t?(0,_vue.h)("div",{xid:e,class:"vxe-split-item-handle",onMousedown:c}):(0,_ui.renderEmptyElement)(a),(0,_vue.h)("div",{xid:e,class:"vxe-split-item--wrapper"},i?d(i,{}):[])]))}),(0,_vue.h)("div",{class:"vxe-split-wrapper"},o)})()])},a},render(){return this.renderVN()}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_ui=require("../../ui"),_vn=require("../../ui/src/vn"),_dom=require("../../ui/src/dom"),_utils=require("../../ui/src/utils"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeSplit",props:{width:[Number,String],height:[Number,String],vertical:{type:Boolean,default:()=>(0,_ui.getConfig)().split.vertical},border:{type:Boolean,default:()=>(0,_ui.getConfig)().split.border},padding:{type:Boolean,default:()=>(0,_ui.getConfig)().split.padding},itemConfig:Object},emits:[],setup(b,e){const{emit:l,slots:s}=e;var t=_xeUtils.default.uniqueId();const U=(0,_vue.ref)(),C=(0,_vue.reactive)({staticItems:[]});const N=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().split.itemConfig,b.itemConfig)),i={computeItemOpts:N},r={refElem:U},a={xID:t,props:b,context:e,reactData:C,internalData:{},getRefMaps:()=>r,getComputeMaps:()=>i};const c=(e,t)=>e&&(_xeUtils.default.isString(e)&&(e=s[e]||null),_xeUtils.default.isFunction(e))?(0,_vn.getSlotVNs)(e(t)):[],u=()=>(0,_vue.nextTick)().then(()=>{var e=b["vertical"],t=C["staticItems"],i=U.value;if(i){const r=i.clientWidth,s=i.clientHeight;if(r&&s){i=N.value;const u=_xeUtils.default.toNumber(i.minWidth),n=_xeUtils.default.toNumber(i.minHeight),d=[];if(e){let l=0;if(t.forEach(e=>{var t=e["height"];let i=0;t?(i=(0,_dom.isScale)(t)?s*_xeUtils.default.toNumber(t):_xeUtils.default.toNumber(t),e.renderHeight=i):d.push(e),l+=i}),d.length){const o=(s-l)/d.length;d.forEach(e=>{e.renderHeight=Math.max(_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(e.minHeight,n)),o)})}}else{let l=0;if(t.forEach(e=>{var t=e["width"];let i=0;t?(i=(0,_dom.isScale)(t)?r*_xeUtils.default.toNumber(t):_xeUtils.default.toNumber(t),e.renderWidth=i):d.push(e),l+=i}),d.length){const a=(r-l)/d.length;d.forEach(e=>{e.renderWidth=Math.max(_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(e.minWidth,u)),a)})}}}}}),h=e=>{e.preventDefault();const i=b["vertical"];var t=C["staticItems"],l=e.currentTarget;const r=U.value;if(r){const n=l.getAttribute("xid");l=_xeUtils.default.findIndexOf(t,e=>e.id===n);const d=t[l];if(d){var s=N.value,u=_xeUtils.default.toNumber(s.minWidth),s=_xeUtils.default.toNumber(s.minHeight);const o=t[l-1];t=o?r.querySelector(`.vxe-split-item[xid="${o.id}"]`):null,l=d?r.querySelector(`.vxe-split-item[xid="${d.id}"]`):null;const a=t?t.clientWidth:0,c=l?l.clientWidth:0,h=t?t.clientHeight:0,m=l?l.clientHeight:0,v=_xeUtils.default.toNumber(o?(0,_utils.getGlobalDefaultConfig)(o.minWidth,u):u),f=_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(d.minWidth,u)),_=_xeUtils.default.toNumber(o?(0,_utils.getGlobalDefaultConfig)(o.minHeight,s):s),g=_xeUtils.default.toNumber((0,_utils.getGlobalDefaultConfig)(d.minHeight,s)),p=e.clientX,x=e.clientY;(0,_dom.addClass)(r,"is--drag"),document.onmousemove=e=>{var t;e.preventDefault(),i?0<(t=e.clientY-x)?o&&m-t>=g&&(o.renderHeight=h+t,d.renderHeight=m-t):o&&h+t>=_&&(o.renderHeight=h+t,d.renderHeight=m-t):0<(t=e.clientX-p)?o&&c-t>=f&&(o.renderWidth=a+t,d.renderWidth=c-t):o&&a+t>=v&&(o.renderWidth=a+t,d.renderWidth=c-t)},document.onmouseup=()=>{document.onmousemove=null,(document.onmouseup=null,_dom.removeClass)(r,"is--drag")}}}};t={dispatchEvent:(e,t,i)=>{l(e,(0,_ui.createEvent)(i,{$split:a},t))},recalculate:u};Object.assign(a,t,{});return(0,_vue.watch)(()=>C.staticItems,()=>{u()}),(0,_vue.onMounted)(()=>{u()}),(0,_vue.onActivated)(()=>{u()}),(0,_vue.provide)("$xeSplit",a),a.renderVN=()=>{var{vertical:e,width:t,height:i}=b,l=s.default,r={};return i&&(r.height=(0,_dom.toCssUnit)(i)),t&&(r.width=(0,_dom.toCssUnit)(t)),(0,_vue.h)("div",{ref:U,class:["vxe-split",e?"is--vertical":"is--horizontal"],style:r},[(0,_vue.h)("div",{class:"vxe-split-slots"},l?l({}):[]),(()=>{const{border:u,padding:n,vertical:d}=b;var e=C["staticItems"];const o=[];return e.forEach((e,t)=>{var{id:e,slots:i,renderHeight:l,renderWidth:r}=e,i=i?i.default:null,s={};d?l&&(s.height=(0,_dom.toCssUnit)(l)):r&&(s.width=(0,_dom.toCssUnit)(r)),o.push((0,_vue.h)("div",{xid:e,class:["vxe-split-item",d?"is--vertical":"is--horizontal",{"is--padding":n,"is--border":u,"is--height":l,"is--width":r,"is--fill":!l&&!r,"is--handle":0<t}],style:s},[t?(0,_vue.h)("div",{xid:e,class:"vxe-split-item-handle",onMousedown:h}):(0,_ui.renderEmptyElement)(a),(0,_vue.h)("div",{xid:e,class:"vxe-split-item--wrapper"},[(0,_vue.h)("div",{class:"vxe-split-item--inner"},i?c(i,{}):[])])]))}),(0,_vue.h)("div",{class:"vxe-split-wrapper"},o)})()])},a},render(){return this.renderVN()}});

package/lib/split/style/style.css

@@ -48,18 +48,27 @@
 .vxe-split-item--wrapper {
   position: relative;
   word-break: break-word;
-  overflow: auto;
+  overflow: hidden;
   flex-grow: 1;
 }
 .vxe-split-item--wrapper > .vxe-split {
   height: 100%;
 }
 
+.vxe-split-item--inner {
+  height: 100%;
+  width: 100%;
+  overflow: auto;
+}
+
 .vxe-split-item {
   display: flex;
   position: relative;
   overflow: auto;
 }
+.vxe-split-item.is--padding > .vxe-split-item--wrapper {
+  padding: var(--vxe-ui-layout-padding-default);
+}
 .vxe-split-item.is--fill {
   flex-grow: 1;
 }

package/lib/split/style/style.min.css

@@ -1 +1 @@
-.vxe-split.is--vertical>.vxe-split-wrapper{flex-direction:column}.vxe-split.is--vertical>.vxe-split-wrapper>.vxe-split-item{width:100%}.vxe-split.is--drag{-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-split.is--drag>.vxe-split-wrapper>.vxe-split-item>.vxe-split-item--wrapper::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:0 0}.vxe-split-wrapper{height:100%;display:flex;flex-direction:row;overflow:hidden}.vxe-split-slots{display:none}.vxe-split-item-handle{flex-shrink:0;background-color:var(--vxe-split-handle-bar-background-color);-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-split-item-handle:hover{background-color:var(--vxe-ui-font-primary-lighten-color)}.vxe-split-item-handle:active{background-color:var(--vxe-ui-font-primary-darken-color)}.vxe-split-item--wrapper{position:relative;word-break:break-word;overflow:auto;flex-grow:1}.vxe-split-item--wrapper>.vxe-split{height:100%}.vxe-split-item{display:flex;position:relative;overflow:auto}.vxe-split-item.is--fill{flex-grow:1}.vxe-split-item.is--height,.vxe-split-item.is--width{flex-shrink:0}.vxe-split-item.is--border>.vxe-split-item--wrapper,.vxe-split-item.is--border>.vxe-split-item-handle{border:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-split-item.is--horizontal{flex-direction:row}.vxe-split-item.is--horizontal>.vxe-split-item-handle{width:var(--vxe-split-handle-bar-width);cursor:w-resize}.vxe-split-item.is--horizontal.is--border>.vxe-split-item-handle{border-width:1px 0 1px 0}.vxe-split-item.is--vertical{flex-direction:column}.vxe-split-item.is--vertical>.vxe-split-item-handle{height:var(--vxe-split-handle-bar-height);cursor:n-resize}.vxe-split-item.is--vertical.is--border>.vxe-split-item-handle{border-width:0 1px 0 1px}
+.vxe-split.is--vertical>.vxe-split-wrapper{flex-direction:column}.vxe-split.is--vertical>.vxe-split-wrapper>.vxe-split-item{width:100%}.vxe-split.is--drag{-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-split.is--drag>.vxe-split-wrapper>.vxe-split-item>.vxe-split-item--wrapper::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:0 0}.vxe-split-wrapper{height:100%;display:flex;flex-direction:row;overflow:hidden}.vxe-split-slots{display:none}.vxe-split-item-handle{flex-shrink:0;background-color:var(--vxe-split-handle-bar-background-color);-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-split-item-handle:hover{background-color:var(--vxe-ui-font-primary-lighten-color)}.vxe-split-item-handle:active{background-color:var(--vxe-ui-font-primary-darken-color)}.vxe-split-item--wrapper{position:relative;word-break:break-word;overflow:hidden;flex-grow:1}.vxe-split-item--wrapper>.vxe-split{height:100%}.vxe-split-item--inner{height:100%;width:100%;overflow:auto}.vxe-split-item{display:flex;position:relative;overflow:auto}.vxe-split-item.is--padding>.vxe-split-item--wrapper{padding:var(--vxe-ui-layout-padding-default)}.vxe-split-item.is--fill{flex-grow:1}.vxe-split-item.is--height,.vxe-split-item.is--width{flex-shrink:0}.vxe-split-item.is--border>.vxe-split-item--wrapper,.vxe-split-item.is--border>.vxe-split-item-handle{border:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-split-item.is--horizontal{flex-direction:row}.vxe-split-item.is--horizontal>.vxe-split-item-handle{width:var(--vxe-split-handle-bar-width);cursor:w-resize}.vxe-split-item.is--horizontal.is--border>.vxe-split-item-handle{border-width:1px 0 1px 0}.vxe-split-item.is--vertical{flex-direction:column}.vxe-split-item.is--vertical>.vxe-split-item-handle{height:var(--vxe-split-handle-bar-height);cursor:n-resize}.vxe-split-item.is--vertical.is--border>.vxe-split-item-handle{border-width:0 1px 0 1px}