vxe-table 3.8.8-beta.4 → 3.8.8-beta.6

package/lib/vxe-table-custom-module/style/style.min.css

@@ -1 +1 @@
-[class*=vxe-],[class*=vxe-] :after,[class*=vxe-] :before,[class*=vxe-]:after,[class*=vxe-]:before{box-sizing:border-box}[class*=vxe-]{font-variant:tabular-nums;font-feature-settings:"tnum"}.vxe-primary-color{color:#409eff}.vxe-success-color{color:#67c23a}.vxe-info-color{color:#909399}.vxe-warning-color{color:#e6a23c}.vxe-danger-color{color:#f56c6c}.vxe-perfect-color{color:#f8f8f9}.vxe-row:after{content:"";display:block;clear:both;height:0;overflow:hidden;visibility:hidden}.vxe-row>.vxe-col--1{float:left;width:4.16667%}.vxe-row>.vxe-col--2{float:left;width:8.33333%}.vxe-row>.vxe-col--3{float:left;width:12.5%}.vxe-row>.vxe-col--4{float:left;width:16.66667%}.vxe-row>.vxe-col--5{float:left;width:20.83333%}.vxe-row>.vxe-col--6{float:left;width:25%}.vxe-row>.vxe-col--7{float:left;width:29.16667%}.vxe-row>.vxe-col--8{float:left;width:33.33333%}.vxe-row>.vxe-col--9{float:left;width:37.5%}.vxe-row>.vxe-col--10{float:left;width:41.66667%}.vxe-row>.vxe-col--11{float:left;width:45.83333%}.vxe-row>.vxe-col--12{float:left;width:50%}.vxe-row>.vxe-col--13{float:left;width:54.16667%}.vxe-row>.vxe-col--14{float:left;width:58.33333%}.vxe-row>.vxe-col--15{float:left;width:62.5%}.vxe-row>.vxe-col--16{float:left;width:66.66667%}.vxe-row>.vxe-col--17{float:left;width:70.83333%}.vxe-row>.vxe-col--18{float:left;width:75%}.vxe-row>.vxe-col--19{float:left;width:79.16667%}.vxe-row>.vxe-col--20{float:left;width:83.33333%}.vxe-row>.vxe-col--21{float:left;width:87.5%}.vxe-row>.vxe-col--22{float:left;width:91.66667%}.vxe-row>.vxe-col--23{float:left;width:95.83333%}.vxe-row>.vxe-col--24{float:left;width:100%}.is--animat .vxe-filter--btn:after,.is--animat .vxe-filter--btn:before,.is--animat .vxe-sort--asc-btn:after,.is--animat .vxe-sort--asc-btn:before,.is--animat .vxe-sort--desc-btn:after,.is--animat .vxe-sort--desc-btn:before{transition:border .1s ease-in-out}.is--animat .vxe-input--wrapper .vxe-input{transition:border .1s ease-in-out}.is--animat .vxe-table--expand-btn,.is--animat .vxe-tree--node-btn{transition:transform .1s ease-in-out}.is--animat .vxe-checkbox>input:checked+span,.is--animat .vxe-radio>input:checked+span{transition:background-color .1s ease-in-out}.vxe-table-custom--option{position:relative;display:flex;flex-direction:row}.vxe-table-custom--option.active--drag-target[drag-pos=top]::after{display:block;top:-2px}.vxe-table-custom--option.active--drag-target[drag-pos=bottom]::after{display:block;bottom:-2px}.vxe-table-custom--option:first-child[drag-pos=top]::after{top:0}.vxe-table-custom--option:last-child[drag-pos=bottom]::after{bottom:0}.vxe-table-custom--option::after{display:none;content:"";position:absolute;left:-1px;width:calc(100% + 1px);height:3px;background-color:#409eff;z-index:12}.vxe-table-custom--option:last-child::after{width:100%}.vxe-table-custom-wrapper{display:none;position:absolute;top:1px;right:2px;text-align:left;background-color:#fff;z-index:19;border:1px solid #e8eaec;border-radius:4px;box-shadow:0 0 10px 0 rgba(0,0,0,.16)}.vxe-table-custom-wrapper.is--active{display:block}.vxe-table-custom--list-wrapper{display:block}.vxe-table-custom--body,.vxe-table-custom--header{list-style-type:none;overflow-x:hidden;overflow-y:auto;margin:0;padding:0}.vxe-table-custom--body>li,.vxe-table-custom--header>li{max-width:26em;min-width:18em;padding:.2em 1em .2em 1em}.vxe-table-custom--body>li.level--2,.vxe-table-custom--header>li.level--2{padding-left:3.5em}.vxe-table-custom--body>li.level--2 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--2 .vxe-checkbox--icon{left:1.8em}.vxe-table-custom--body>li.level--3,.vxe-table-custom--header>li.level--3{padding-left:4.5em}.vxe-table-custom--body>li.level--3 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--3 .vxe-checkbox--icon{left:2.8em}.vxe-table-custom--body>li.level--4,.vxe-table-custom--header>li.level--4{padding-left:5.5em}.vxe-table-custom--body>li.level--4 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--4 .vxe-checkbox--icon{left:3.8em}.vxe-table-custom--body>li.level--5,.vxe-table-custom--header>li.level--5{padding-left:6.5em}.vxe-table-custom--body>li.level--5 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--5 .vxe-checkbox--icon{left:4.8em}.vxe-table-custom--body>li.level--6,.vxe-table-custom--header>li.level--6{padding-left:7.5em}.vxe-table-custom--body>li.level--6 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--6 .vxe-checkbox--icon{left:5.8em}.vxe-table-custom--body>li.level--7,.vxe-table-custom--header>li.level--7{padding-left:8.5em}.vxe-table-custom--body>li.level--7 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--7 .vxe-checkbox--icon{left:6.8em}.vxe-table-custom--body>li.level--8,.vxe-table-custom--header>li.level--8{padding-left:9.5em}.vxe-table-custom--body>li.level--8 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--8 .vxe-checkbox--icon{left:7.8em}.vxe-table-custom--header{padding:.28em 0;font-weight:700;border-bottom:1px solid #dadce0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--body{padding:.2em 0;max-height:20em}.vxe-table-custom--body .vxe-table-custom--checkbox-option:hover{background-color:#f5f7fa}.vxe-table-custom--footer{display:flex;flex-direction:row;border-top:1px solid #dadce0;text-align:right}.vxe-table-custom--footer button{background-color:transparent;width:50%;height:2.8em;border:0;color:#606266;text-align:center;cursor:pointer}.vxe-table-custom--footer button:focus{outline:0}.vxe-table-custom--footer button:hover{color:#409eff}.vxe-table-custom--checkbox-option .vxe-checkbox--icon{font-size:1.34em}.vxe-table-custom--checkbox-option .vxe-checkbox--icon{color:#dcdfe6;vertical-align:middle;font-weight:700;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--checkbox-option.is--checked,.vxe-table-custom--checkbox-option.is--indeterminate{color:#409eff}.vxe-table-custom--checkbox-option.is--checked .vxe-checkbox--icon,.vxe-table-custom--checkbox-option.is--indeterminate .vxe-checkbox--icon{color:#409eff}.vxe-table-custom--checkbox-option:not(.is--disabled){cursor:pointer}.vxe-table-custom--checkbox-option:not(.is--disabled):hover .vxe-checkbox--icon{color:#409eff}.vxe-table-custom--checkbox-option.is--disabled{color:#bfbfbf;cursor:not-allowed}.vxe-table-custom--checkbox-option.is--disabled .vxe-checkbox--icon{color:#dcdfe6}.vxe-table-custom--checkbox-option .vxe-checkbox--label{padding-left:.5em;vertical-align:middle}.vxe-table-custom--checkbox-option,.vxe-table-custom--sort-option{padding-right:.4em;flex-shrink:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--sort-option{display:flex;flex-direction:row;align-items:center;justify-content:center}.vxe-table-custom--sort-btn{padding-left:.2em;padding-right:.4em;cursor:grabbing}.vxe-table-custom--sort-btn:hover{color:#409eff}.vxe-table-custom--checkbox-label{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-table-custom--fixed-option{flex-shrink:0;padding-left:.5em;display:flex;flex-direction:row;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--fixed-left-option,.vxe-table-custom--fixed-right-option{line-height:1.34em;font-size:1.1em;padding:0 .2em;cursor:pointer}.vxe-table-custom--fixed-left-option.is--checked,.vxe-table-custom--fixed-left-option:hover,.vxe-table-custom--fixed-right-option.is--checked,.vxe-table-custom--fixed-right-option:hover{color:#409eff}.vxe-table-custom--fixed-left-option.is--disabled,.vxe-table-custom--fixed-right-option.is--disabled{cursor:no-drop;color:#dcdfe6}.vxe-table-custom-popup--body{overflow:auto;height:100%}.vxe-table-custom-popup--table-wrapper{border-bottom:1px solid #e8eaec}.vxe-table-custom-popup--table-wrapper table{width:100%;border:0;table-layout:fixed;word-break:break-all;border-spacing:0;border-collapse:separate}.vxe-table-custom-popup--table-wrapper table th{position:sticky;top:0;text-align:left;border-top:1px solid #e8eaec;border-bottom:1px solid #e8eaec;border-left:1px solid #e8eaec;background-color:#f8f8f9;z-index:7}.vxe-table-custom-popup--table-wrapper table td{border-top:1px solid #e8eaec;border-left:1px solid #e8eaec}.vxe-table-custom-popup--table-wrapper table tr:first-child td{border-top:0}.vxe-table-custom-popup--table-wrapper table tr:hover{background-color:#f5f7fa}.vxe-table-custom-popup--table-wrapper table td,.vxe-table-custom-popup--table-wrapper table th{height:44px;padding:0 .6em}.vxe-table-custom-popup--table-wrapper table td:last-child,.vxe-table-custom-popup--table-wrapper table th:last-child{border-right:1px solid #e8eaec}.vxe-table-custom-popup--drag-hint{display:none;position:absolute;top:0;left:0;padding:.6em 1em .6em 1.8em;max-width:300px;border-radius:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;background-color:#fff;box-shadow:0 0 10px 0 rgba(0,0,0,.2);z-index:33}.vxe-table-custom-popup--name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-table-custom-popup--row.level--2 .vxe-table-custom-popup--name{padding-left:24px}.vxe-table-custom-popup--row.level--3 .vxe-table-custom-popup--name{padding-left:48px}.vxe-table-custom-popup--row.level--4 .vxe-table-custom-popup--name{padding-left:72px}.vxe-table-custom-popup--row.level--5 .vxe-table-custom-popup--name{padding-left:96px}.vxe-table-custom-popup--row.level--6 .vxe-table-custom-popup--name{padding-left:120px}.vxe-table-custom-popup--row.level--7 .vxe-table-custom-popup--name{padding-left:144px}.vxe-table-custom-popup--row.level--8 .vxe-table-custom-popup--name{padding-left:168px}.vxe-table-custom-popup--row.level--9 .vxe-table-custom-popup--name{padding-left:192px}.vxe-table-custom-popup--column-item{position:relative}.vxe-table-custom-popup--column-item.col--fixed,.vxe-table-custom-popup--column-item.col--sort,.vxe-table-custom-popup--column-item.col--visible{text-align:center}.vxe-table-custom-popup--row.active--drag-target[drag-pos=top] .vxe-table-custom-popup--column-item::after{display:block;top:-2px}.vxe-table-custom-popup--row.active--drag-target[drag-pos=bottom] .vxe-table-custom-popup--column-item::after{display:block;bottom:-2px}.vxe-table-custom-popup--row:first-child[drag-pos=top] .vxe-table-custom-popup--column-item::after{top:0}.vxe-table-custom-popup--row:last-child[drag-pos=bottom] .vxe-table-custom-popup--column-item::after{bottom:0}.vxe-table-custom-popup--column-item::after{display:none;content:"";position:absolute;left:-1px;width:calc(100% + 1px);height:3px;background-color:#409eff;z-index:12}.vxe-table-custom-popup--column-item:last-child::after{width:100%}.vxe-table-custom--list-move{transition:transform .35s}.vxe-table-custom-popup--column-sort-btn{font-size:1.2em;padding:.2em .5em;cursor:grab}.vxe-table-custom-popup--column-sort-btn:hover{color:#409eff}.vxe-table-custom-popup--column-sort-btn:active{cursor:grabbing}.vxe-table-custom-popup--table-sort-help-icon,.vxe-table-custom-popup--table-sort-help-title{vertical-align:middle}.vxe-table-custom-popup--table-sort-help-icon{margin-left:5px;cursor:help}
+[class*=vxe-],[class*=vxe-] :after,[class*=vxe-] :before,[class*=vxe-]:after,[class*=vxe-]:before{box-sizing:border-box}[class*=vxe-]{font-variant:tabular-nums;font-feature-settings:"tnum"}.vxe-primary-color{color:#409eff}.vxe-success-color{color:#67c23a}.vxe-info-color{color:#909399}.vxe-warning-color{color:#e6a23c}.vxe-danger-color{color:#f56c6c}.vxe-perfect-color{color:#f8f8f9}.vxe-row:after{content:"";display:block;clear:both;height:0;overflow:hidden;visibility:hidden}.vxe-row>.vxe-col--1{float:left;width:4.16667%}.vxe-row>.vxe-col--2{float:left;width:8.33333%}.vxe-row>.vxe-col--3{float:left;width:12.5%}.vxe-row>.vxe-col--4{float:left;width:16.66667%}.vxe-row>.vxe-col--5{float:left;width:20.83333%}.vxe-row>.vxe-col--6{float:left;width:25%}.vxe-row>.vxe-col--7{float:left;width:29.16667%}.vxe-row>.vxe-col--8{float:left;width:33.33333%}.vxe-row>.vxe-col--9{float:left;width:37.5%}.vxe-row>.vxe-col--10{float:left;width:41.66667%}.vxe-row>.vxe-col--11{float:left;width:45.83333%}.vxe-row>.vxe-col--12{float:left;width:50%}.vxe-row>.vxe-col--13{float:left;width:54.16667%}.vxe-row>.vxe-col--14{float:left;width:58.33333%}.vxe-row>.vxe-col--15{float:left;width:62.5%}.vxe-row>.vxe-col--16{float:left;width:66.66667%}.vxe-row>.vxe-col--17{float:left;width:70.83333%}.vxe-row>.vxe-col--18{float:left;width:75%}.vxe-row>.vxe-col--19{float:left;width:79.16667%}.vxe-row>.vxe-col--20{float:left;width:83.33333%}.vxe-row>.vxe-col--21{float:left;width:87.5%}.vxe-row>.vxe-col--22{float:left;width:91.66667%}.vxe-row>.vxe-col--23{float:left;width:95.83333%}.vxe-row>.vxe-col--24{float:left;width:100%}.is--animat .vxe-filter--btn:after,.is--animat .vxe-filter--btn:before,.is--animat .vxe-sort--asc-btn:after,.is--animat .vxe-sort--asc-btn:before,.is--animat .vxe-sort--desc-btn:after,.is--animat .vxe-sort--desc-btn:before{transition:border .1s ease-in-out}.is--animat .vxe-input--wrapper .vxe-input{transition:border .1s ease-in-out}.is--animat .vxe-table--expand-btn,.is--animat .vxe-tree--node-btn{transition:transform .1s ease-in-out}.is--animat .vxe-checkbox>input:checked+span,.is--animat .vxe-radio>input:checked+span{transition:background-color .1s ease-in-out}.vxe-table-custom--option{position:relative;display:flex;flex-direction:row}.vxe-table-custom--option.active--drag-target[drag-pos=top]::after{display:block;top:-2px}.vxe-table-custom--option.active--drag-target[drag-pos=bottom]::after{display:block;bottom:-2px}.vxe-table-custom--option:first-child[drag-pos=top]::after{top:0}.vxe-table-custom--option:last-child[drag-pos=bottom]::after{bottom:0}.vxe-table-custom--option::after{display:none;content:"";position:absolute;left:-1px;width:calc(100% + 1px);height:3px;background-color:#409eff;z-index:12}.vxe-table-custom--option:last-child::after{width:100%}.vxe-table-custom-wrapper{display:none;flex-direction:column;position:absolute;top:1px;right:2px;text-align:left;background-color:#fff;z-index:19;border:1px solid #e8eaec;border-radius:4px;box-shadow:0 0 10px 0 rgba(0,0,0,.16)}.vxe-table-custom-wrapper.placement--topLeft{top:2px;left:2px}.vxe-table-custom-wrapper.placement--topRight{top:2px;right:2px}.vxe-table-custom-wrapper.placement--bottomLeft{bottom:2px;left:2px}.vxe-table-custom-wrapper.placement--bottomRight{bottom:2px;right:2px}.vxe-table-custom-wrapper.placement--left{left:2px}.vxe-table-custom-wrapper.placement--right{right:2px}.vxe-table-custom-wrapper.placement--left,.vxe-table-custom-wrapper.placement--right{top:2px;height:calc(100% - 4px)}.vxe-table-custom-wrapper.is--active{display:flex}.vxe-table-custom--list-wrapper{display:block;flex-grow:1;overflow-x:hidden;overflow-y:auto}.vxe-table-custom--body,.vxe-table-custom--header{list-style-type:none;margin:0;padding:0}.vxe-table-custom--body>li,.vxe-table-custom--header>li{max-width:26em;min-width:17em;padding:.2em 1em .2em 1em}.vxe-table-custom--body>li.level--2,.vxe-table-custom--header>li.level--2{padding-left:3.5em}.vxe-table-custom--body>li.level--2 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--2 .vxe-checkbox--icon{left:1.8em}.vxe-table-custom--body>li.level--3,.vxe-table-custom--header>li.level--3{padding-left:4.5em}.vxe-table-custom--body>li.level--3 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--3 .vxe-checkbox--icon{left:2.8em}.vxe-table-custom--body>li.level--4,.vxe-table-custom--header>li.level--4{padding-left:5.5em}.vxe-table-custom--body>li.level--4 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--4 .vxe-checkbox--icon{left:3.8em}.vxe-table-custom--body>li.level--5,.vxe-table-custom--header>li.level--5{padding-left:6.5em}.vxe-table-custom--body>li.level--5 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--5 .vxe-checkbox--icon{left:4.8em}.vxe-table-custom--body>li.level--6,.vxe-table-custom--header>li.level--6{padding-left:7.5em}.vxe-table-custom--body>li.level--6 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--6 .vxe-checkbox--icon{left:5.8em}.vxe-table-custom--body>li.level--7,.vxe-table-custom--header>li.level--7{padding-left:8.5em}.vxe-table-custom--body>li.level--7 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--7 .vxe-checkbox--icon{left:6.8em}.vxe-table-custom--body>li.level--8,.vxe-table-custom--header>li.level--8{padding-left:9.5em}.vxe-table-custom--body>li.level--8 .vxe-checkbox--icon,.vxe-table-custom--header>li.level--8 .vxe-checkbox--icon{left:7.8em}.vxe-table-custom--header{flex-shrink:0;padding:.28em 0;font-weight:700;border-bottom:1px solid #dadce0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--body{padding:.2em 0}.vxe-table-custom--body .vxe-table-custom--checkbox-option:hover{background-color:#f5f7fa}.vxe-table-custom--footer{display:flex;flex-direction:row;flex-shrink:0;border-top:1px solid #dadce0;text-align:right}.vxe-table-custom--footer button{background-color:transparent;width:50%;height:2.8em;border:0;color:#606266;text-align:center;cursor:pointer}.vxe-table-custom--footer button:focus{outline:0}.vxe-table-custom--footer button:hover{color:#409eff}.vxe-table-custom--checkbox-option .vxe-checkbox--icon{font-size:1.34em}.vxe-table-custom--checkbox-option .vxe-checkbox--icon{color:#dcdfe6;vertical-align:middle;font-weight:700;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--checkbox-option.is--checked,.vxe-table-custom--checkbox-option.is--indeterminate{color:#409eff}.vxe-table-custom--checkbox-option.is--checked .vxe-checkbox--icon,.vxe-table-custom--checkbox-option.is--indeterminate .vxe-checkbox--icon{color:#409eff}.vxe-table-custom--checkbox-option:not(.is--disabled){cursor:pointer}.vxe-table-custom--checkbox-option:not(.is--disabled):hover .vxe-checkbox--icon{color:#409eff}.vxe-table-custom--checkbox-option.is--disabled{color:#bfbfbf;cursor:not-allowed}.vxe-table-custom--checkbox-option.is--disabled .vxe-checkbox--icon{color:#dcdfe6}.vxe-table-custom--checkbox-option .vxe-checkbox--label{padding-left:.5em;vertical-align:middle}.vxe-table-custom--checkbox-option,.vxe-table-custom--sort-option{padding-right:.4em;flex-shrink:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--sort-option{display:flex;flex-direction:row;align-items:center;justify-content:center}.vxe-table-custom--sort-btn{padding-left:.2em;padding-right:.4em;cursor:grabbing}.vxe-table-custom--sort-btn:hover{color:#409eff}.vxe-table-custom--checkbox-label{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-table-custom--fixed-option{flex-shrink:0;padding-left:.5em;display:flex;flex-direction:row;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-table-custom--fixed-left-option,.vxe-table-custom--fixed-right-option{line-height:1.34em;font-size:1.1em;padding:0 .2em;cursor:pointer}.vxe-table-custom--fixed-left-option.is--checked,.vxe-table-custom--fixed-left-option:hover,.vxe-table-custom--fixed-right-option.is--checked,.vxe-table-custom--fixed-right-option:hover{color:#409eff}.vxe-table-custom--fixed-left-option.is--disabled,.vxe-table-custom--fixed-right-option.is--disabled{cursor:no-drop;color:#dcdfe6}.vxe-table-custom-popup--body{overflow:auto;height:100%}.vxe-table-custom-popup--table-wrapper{border-bottom:1px solid #e8eaec}.vxe-table-custom-popup--table-wrapper table{width:100%;border:0;table-layout:fixed;word-break:break-all;border-spacing:0;border-collapse:separate}.vxe-table-custom-popup--table-wrapper table th{position:sticky;top:0;text-align:left;border-top:1px solid #e8eaec;border-bottom:1px solid #e8eaec;border-left:1px solid #e8eaec;background-color:#f8f8f9;z-index:7}.vxe-table-custom-popup--table-wrapper table td{border-top:1px solid #e8eaec;border-left:1px solid #e8eaec}.vxe-table-custom-popup--table-wrapper table tr:first-child td{border-top:0}.vxe-table-custom-popup--table-wrapper table tr:hover{background-color:#f5f7fa}.vxe-table-custom-popup--table-wrapper table td,.vxe-table-custom-popup--table-wrapper table th{height:44px;padding:0 .6em}.vxe-table-custom-popup--table-wrapper table td:last-child,.vxe-table-custom-popup--table-wrapper table th:last-child{border-right:1px solid #e8eaec}.vxe-table-custom-popup--drag-hint{display:none;position:absolute;top:0;left:0;padding:.6em 1em .6em 1.8em;max-width:300px;border-radius:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;background-color:#fff;box-shadow:0 0 10px 0 rgba(0,0,0,.2);z-index:33}.vxe-table-custom-popup--name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-table-custom-popup--row.level--2 .vxe-table-custom-popup--name{padding-left:24px}.vxe-table-custom-popup--row.level--3 .vxe-table-custom-popup--name{padding-left:48px}.vxe-table-custom-popup--row.level--4 .vxe-table-custom-popup--name{padding-left:72px}.vxe-table-custom-popup--row.level--5 .vxe-table-custom-popup--name{padding-left:96px}.vxe-table-custom-popup--row.level--6 .vxe-table-custom-popup--name{padding-left:120px}.vxe-table-custom-popup--row.level--7 .vxe-table-custom-popup--name{padding-left:144px}.vxe-table-custom-popup--row.level--8 .vxe-table-custom-popup--name{padding-left:168px}.vxe-table-custom-popup--row.level--9 .vxe-table-custom-popup--name{padding-left:192px}.vxe-table-custom-popup--column-item{position:relative}.vxe-table-custom-popup--column-item.col--fixed,.vxe-table-custom-popup--column-item.col--resizable,.vxe-table-custom-popup--column-item.col--sort,.vxe-table-custom-popup--column-item.col--visible{text-align:center}.vxe-table-custom-popup--column-item.col--resizable>.vxe-input{width:100%}.vxe-table-custom-popup--row.active--drag-target[drag-pos=top] .vxe-table-custom-popup--column-item::after{display:block;top:-2px}.vxe-table-custom-popup--row.active--drag-target[drag-pos=bottom] .vxe-table-custom-popup--column-item::after{display:block;bottom:-2px}.vxe-table-custom-popup--row:first-child[drag-pos=top] .vxe-table-custom-popup--column-item::after{top:0}.vxe-table-custom-popup--row:last-child[drag-pos=bottom] .vxe-table-custom-popup--column-item::after{bottom:0}.vxe-table-custom-popup--column-item::after{display:none;content:"";position:absolute;left:-1px;width:calc(100% + 1px);height:3px;background-color:#409eff;z-index:12}.vxe-table-custom-popup--column-item:last-child::after{width:100%}.vxe-table-custom--list-move{transition:transform .35s}.vxe-table-custom-popup--column-sort-btn{font-size:1.2em;padding:.2em .5em;cursor:grab}.vxe-table-custom-popup--column-sort-btn:hover{color:#409eff}.vxe-table-custom-popup--column-sort-btn:active{cursor:grabbing}.vxe-table-custom-popup--table-sort-help-icon,.vxe-table-custom-popup--table-sort-help-title{vertical-align:middle}.vxe-table-custom-popup--table-sort-help-icon{margin-left:5px;cursor:help}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "3.8.8-beta.4",
+  "version": "3.8.8-beta.6",
   "description": "一个基于 vue 的 PC 端表单/表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印导出、自定义模板、渲染器、JSON 配置式...",
   "scripts": {
     "update": "npm install --legacy-peer-deps",

package/packages/custom/src/mixin.js

@@ -11,6 +11,7 @@ export default {
         const colid = column.getKey()
         column.renderFixed = column.fixed
         column.renderVisible = column.visible
+        column.renderResizeWidth = column.renderWidth
         sortMaps[colid] = column.renderSortNumber
         fixedMaps[colid] = column.fixed
         visibleMaps[colid] = column.visible
@@ -36,25 +37,19 @@ export default {
       return this.$nextTick()
     },
     calcMaxHeight  () {
-      const { $refs, customStore } = this
-      const customWrapperElem = $refs.customWrapper ? $refs.customWrapper.$el : null
-      const headElem = $refs.tableHeader ? $refs.tableHeader.$el : null
-      const bodyElem = $refs.tableBody ? $refs.tableBody.$el : null
+      const { $el, customStore } = this
       // 判断面板不能大于表格高度
       let tableHeight = 0
-      if (headElem) {
-        tableHeight += headElem.clientHeight
+      if ($el) {
+        tableHeight = $el.clientHeight - 30
       }
-      if (bodyElem) {
-        tableHeight += bodyElem.clientHeight
-      }
-      customStore.maxHeight = Math.max(0, customWrapperElem ? Math.min(customWrapperElem.clientHeight, tableHeight - 80) : 0)
+      customStore.maxHeight = Math.max(4, tableHeight)
     },
     checkCustomStatus () {
       const { customStore, collectColumn, customOpts } = this
       const { checkMethod } = customOpts
-      customStore.isAll = collectColumn.every((column) => (checkMethod ? !checkMethod({ column }) : false) || column.visible)
-      customStore.isIndeterminate = !customStore.isAll && collectColumn.some((column) => (!checkMethod || checkMethod({ column })) && (column.visible || column.halfVisible))
+      customStore.isAll = collectColumn.every((column) => (checkMethod ? !checkMethod({ column }) : false) || column.renderVisible)
+      customStore.isIndeterminate = !customStore.isAll && collectColumn.some((column) => (!checkMethod || checkMethod({ column })) && (column.renderVisible || column.halfVisible))
     },
     emitCustomEvent (type, evnt) {
       const comp = this.$xegrid || this

package/packages/custom/src/panel.js

@@ -27,7 +27,7 @@ const renderSimplePanel = (h, _vm) => {
   const { _e, $xetable, customStore } = _vm
   const { customColumnList, customOpts, isMaxFixedColumn } = $xetable
   const { maxHeight } = customStore
-  const { checkMethod, visibleMethod, allowSort, allowFixed, trigger } = customOpts
+  const { checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, trigger, placement } = customOpts
   const colVNs = []
   const customWrapperOns = {}
   // hover 触发
@@ -58,7 +58,7 @@ const renderSimplePanel = (h, _vm) => {
             dragover: _vm.sortDragoverEvent
           }
         }, [
-          h('div', {
+          allowVisible ? h('div', {
             class: ['vxe-table-custom--checkbox-option', {
               'is--checked': isChecked,
               'is--indeterminate': isIndeterminate,
@@ -78,7 +78,7 @@ const renderSimplePanel = (h, _vm) => {
             h('span', {
               class: ['vxe-checkbox--icon', isIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
             })
-          ]),
+          ]) : _e(),
           allowSort && column.level === 1
             ? h('div', {
               class: 'vxe-table-custom--sort-option'
@@ -148,9 +148,14 @@ const renderSimplePanel = (h, _vm) => {
   const isAllIndeterminate = customStore.isIndeterminate
   return h('div', {
     key: 'simple',
-    class: ['vxe-table-custom-wrapper', {
+    class: ['vxe-table-custom-wrapper', `placement--${placement}`, {
       'is--active': customStore.visible
-    }]
+    }],
+    style: maxHeight && !['left', 'right'].includes(placement)
+      ? {
+          maxHeight: `${maxHeight}px`
+        }
+      : {}
   }, customStore.visible
     ? [
         h('ul', {
@@ -159,25 +164,28 @@ const renderSimplePanel = (h, _vm) => {
           h('li', {
             class: 'vxe-table-custom--option'
           }, [
-            h('div', {
-              class: ['vxe-table-custom--checkbox-option', {
-                'is--checked': isAllChecked,
-                'is--indeterminate': isAllIndeterminate
-              }],
-              attrs: {
-                title: GlobalConfig.i18n('vxe.table.allTitle')
-              },
-              on: {
-                click: _vm.allCustomEvent
-              }
-            }, [
-              h('span', {
-                class: ['vxe-checkbox--icon', isAllIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
-              }),
-              h('span', {
+            allowVisible
+              ? h('div', {
+                class: ['vxe-table-custom--checkbox-option', {
+                  'is--checked': isAllChecked,
+                  'is--indeterminate': isAllIndeterminate
+                }],
+                attrs: {
+                  title: GlobalConfig.i18n('vxe.table.allTitle')
+                },
+                on: {
+                  click: _vm.allCustomEvent
+                }
+              }, [
+                h('span', {
+                  class: ['vxe-checkbox--icon', isAllIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
+                }),
+                h('span', {
+                  class: 'vxe-checkbox--label'
+                }, GlobalConfig.i18n('vxe.toolbar.customAll'))
+              ]) : h('span', {
                 class: 'vxe-checkbox--label'
-              }, GlobalConfig.i18n('vxe.toolbar.customAll'))
-            ])
+              }, GlobalConfig.i18n('vxe.table.customTitle'))
           ])
         ]),
         h('div', {
@@ -190,11 +198,6 @@ const renderSimplePanel = (h, _vm) => {
               name: 'vxe-table-custom--list',
               tag: 'ul'
             },
-            style: maxHeight
-              ? {
-                  maxHeight: `${maxHeight}px`
-                }
-              : {},
             on: customWrapperOns
           }, colVNs),
           h('div', {
@@ -235,7 +238,7 @@ const renderSimplePanel = (h, _vm) => {
 const renderPopupPanel = (h, _vm) => {
   const { _e, $xetable, customStore } = _vm
   const { customOpts, customColumnList, columnOpts, isMaxFixedColumn } = $xetable
-  const { allowSort, allowFixed, checkMethod, visibleMethod } = customOpts
+  const { allowVisible, allowSort, allowFixed, allowResizable, checkMethod, visibleMethod } = customOpts
   const trVNs = []
   XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => {
     const isVisible = visibleMethod ? visibleMethod({ column }) : true
@@ -260,7 +263,7 @@ const renderPopupPanel = (h, _vm) => {
             dragover: _vm.sortDragoverEvent
           }
         }, [
-          h('td', {
+          allowVisible ? h('td', {
             class: 'vxe-table-custom-popup--column-item col--visible'
           }, [
             h('div', {
@@ -284,7 +287,7 @@ const renderPopupPanel = (h, _vm) => {
                 class: ['vxe-checkbox--icon', isIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
               })
             ])
-          ]),
+          ]) : _e(),
           allowSort
             ? h('td', {
               class: 'vxe-table-custom-popup--column-item col--sort'
@@ -304,7 +307,7 @@ const renderPopupPanel = (h, _vm) => {
                     class: GlobalConfig.icon.TABLE_CUSTOM_SORT
                   })
                 ])
-                : null
+                : h('span', '-')
             ])
             : _e(),
           h('td', {
@@ -317,12 +320,33 @@ const renderPopupPanel = (h, _vm) => {
               }
             }, colTitle)
           ]),
+          allowResizable
+            ? h('td', {
+              class: 'vxe-table-custom-popup--column-item col--resizable'
+            }, [
+              !isChecked || (column.children && column.children.length)
+                ? h('span', '-')
+                : h('vxe-input', {
+                  props: {
+                    type: 'integer',
+                    min: 40,
+                    value: column.renderResizeWidth
+                  },
+                  on: {
+                    modelValue (value) {
+                      column.renderResizeWidth = Math.max(40, Number(value))
+                    }
+                  }
+                })
+            ])
+            : _e(),
           allowFixed
             ? h('td', {
               class: 'vxe-table-custom-popup--column-item col--fixed'
             }, [
-              !parent
-                ? h('vxe-radio-group', {
+              parent
+                ? h('span', '-')
+                : h('vxe-radio-group', {
                   props: {
                     value: column.renderFixed || '',
                     type: 'button',
@@ -342,7 +366,6 @@ const renderPopupPanel = (h, _vm) => {
                   // }
                   }
                 })
-                : null
             ])
             : _e()
         ])
@@ -357,10 +380,10 @@ const renderPopupPanel = (h, _vm) => {
       className: 'vxe-table-custom-popup-wrapper vxe-table--ignore-clear',
       value: customStore.visible,
       title: GlobalConfig.i18n('vxe.custom.cstmTitle'),
-      width: '40vw',
-      minWidth: 520,
-      height: '50vh',
-      minHeight: 300,
+      width: 700,
+      minWidth: 700,
+      height: 400,
+      minHeight: 400,
       mask: true,
       lockView: true,
       showFooter: true,
@@ -384,11 +407,11 @@ const renderPopupPanel = (h, _vm) => {
           }, [
             h('table', {}, [
               h('colgroup', {}, [
-                h('col', {
+                allowVisible ? h('col', {
                   style: {
                     width: '80px'
                   }
-                }),
+                }) : _e(),
                 allowSort
                   ? h('col', {
                     style: {
@@ -401,6 +424,13 @@ const renderPopupPanel = (h, _vm) => {
                     minWidth: '120px'
                   }
                 }),
+                allowResizable
+                  ? h('col', {
+                    style: {
+                      width: '140px'
+                    }
+                  })
+                  : _e(),
                 allowFixed
                   ? h('col', {
                     style: {
@@ -411,7 +441,7 @@ const renderPopupPanel = (h, _vm) => {
               ]),
               h('thead', {}, [
                 h('tr', {}, [
-                  h('th', {}, [
+                  allowVisible ? h('th', {}, [
                     h('div', {
                       class: ['vxe-table-custom--checkbox-option', {
                         'is--checked': isAllChecked,
@@ -432,7 +462,7 @@ const renderPopupPanel = (h, _vm) => {
                         class: 'vxe-checkbox--label'
                       }, GlobalConfig.i18n('vxe.toolbar.customAll'))
                     ])
-                  ]),
+                  ]) : _e(),
                   allowSort
                     ? h('th', {}, [
                       h('span', {
@@ -454,6 +484,9 @@ const renderPopupPanel = (h, _vm) => {
                     ])
                     : _e(),
                   h('th', {}, GlobalConfig.i18n('vxe.custom.setting.colTitle')),
+                  allowResizable
+                    ? h('th', {}, GlobalConfig.i18n('vxe.custom.setting.colResizable'))
+                    : _e(),
                   allowFixed
                     ? h('th', {}, GlobalConfig.i18n('vxe.custom.setting.colFixed', [columnOpts.maxFixedSize || 0]))
                     : _e()
@@ -563,18 +596,34 @@ export default {
         updateStore({
           id,
           type,
-          storeData: this.getStoreData()
+          storeData: $xetable.getCustomStoreData()
         })
       }
     },
     confirmCustomEvent  (evnt) {
       const { $xetable } = this
-      const { customColumnList } = $xetable
-      customColumnList.forEach((column, index) => {
-        const sortIndex = index + 1
-        column.renderSortNumber = sortIndex
-        column.fixed = column.renderFixed
-        column.visible = column.renderVisible
+      const { customOpts, customColumnList } = $xetable
+      const { allowVisible, allowSort, allowFixed, allowResizable } = customOpts
+      XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => {
+        if (!parent) {
+          if (allowSort) {
+            const sortIndex = index + 1
+            column.renderSortNumber = sortIndex
+          }
+          if (allowFixed) {
+            column.fixed = column.renderFixed
+          }
+        }
+        if (allowResizable) {
+          if (column.renderVisible && (!column.children || column.children.length)) {
+            if (column.renderResizeWidth !== column.renderWidth) {
+              column.resizeWidth = column.renderResizeWidth
+            }
+          }
+        }
+        if (allowVisible) {
+          column.visible = column.renderVisible
+        }
       })
       $xetable.closeCustom()
       $xetable.emitCustomEvent('confirm', evnt)
@@ -582,17 +631,27 @@ export default {
     },
     cancelCustomEvent  (evnt) {
       const { $xetable } = this
-      const { customStore, customColumnList } = $xetable
+      const { customStore, customOpts, customColumnList } = $xetable
       const { oldSortMaps, oldFixedMaps, oldVisibleMaps } = customStore
+      const { allowVisible, allowSort, allowFixed, allowResizable } = customOpts
       XEUtils.eachTree(customColumnList, column => {
         const colid = column.getKey()
         const visible = !!oldVisibleMaps[colid]
         const fixed = oldFixedMaps[colid] || ''
-        column.renderVisible = visible
-        column.visible = visible
-        column.renderFixed = fixed
-        column.fixed = fixed
-        column.renderSortNumber = oldSortMaps[colid] || 0
+        if (allowVisible) {
+          column.renderVisible = visible
+          column.visible = visible
+        }
+        if (allowFixed) {
+          column.renderFixed = fixed
+          column.fixed = fixed
+        }
+        if (allowSort) {
+          column.renderSortNumber = oldSortMaps[colid] || 0
+        }
+        if (allowResizable) {
+          column.renderResizeWidth = column.renderWidth
+        }
       }, { children: 'children' })
       $xetable.closeCustom()
       $xetable.emitCustomEvent('cancel', evnt)
@@ -602,7 +661,7 @@ export default {
       $xetable.resetColumn(true)
       $xetable.closeCustom()
       $xetable.emitCustomEvent('reset', evnt)
-      this.handleSaveStore('confirm')
+      this.handleSaveStore('reset')
     },
     resetCustomEvent  (evnt) {
       if (VXETable.modal) {

package/packages/locale/lang/en-US.js

@@ -117,6 +117,7 @@ export default {
         colSort: 'Sort',
         sortHelpTip: 'Click and drag the icon to adjust the order of the columns.',
         colTitle: 'Title',
+        colResizable: 'Column width (px)',
         colVisible: 'Visible',
         colFixed: 'Freeze columns (Max. {0})',
         fixedLeft: 'Left',

package/packages/locale/lang/es-ES.js

@@ -117,6 +117,7 @@ export default {
         colSort: 'Sort',
         sortHelpTip: 'Click and drag the icon to adjust the order of the columns.',
         colTitle: 'Title',
+        colResizable: 'Column width (px)',
         colVisible: 'Visible',
         colFixed: 'Freeze columns (Max {0})',
         fixedLeft: 'Left',

package/packages/locale/lang/ja-JP.js

@@ -117,6 +117,7 @@ export default {
         colSort: 'ソート',
         sortHelpTip: 'Click and drag the icon to adjust the order of the columns.',
         colTitle: 'タイトル',
+        colResizable: 'Column width (px)',
         colVisible: '表示',
         colFixed: '冻结列（最多 {0} 列）',
         fixedLeft: '左側',

package/packages/locale/lang/pt-BR.js

@@ -117,6 +117,7 @@ export default {
         colSort: 'Sort',
         sortHelpTip: 'Click and drag the icon to adjust the order of the columns.',
         colTitle: 'Title',
+        colResizable: 'Column width (px)',
         colVisible: 'Visible',
         colFixed: 'Freeze columns (Max {0})',
         fixedLeft: 'Left',

package/packages/locale/lang/zh-CN.js

@@ -117,6 +117,7 @@ export default {
         colSort: '排序',
         sortHelpTip: '点击并拖动图标可以调整列的排序',
         colTitle: '标题',
+        colResizable: '列宽（像素）',
         colVisible: '是否显示',
         colFixed: '冻结列（最多 {0} 列）',
         fixedLeft: '左侧',

package/packages/locale/lang/zh-TC.js

@@ -117,6 +117,7 @@ export default {
         colSort: '排序',
         sortHelpTip: '點擊並拖動圖標可以調整列的排序',
         colTitle: '標題',
+        colResizable: '列宽（像素）',
         colVisible: '是否顯示',
         colFixed: '冻结列（最多 {0} 列）',
         fixedLeft: '左側',

package/packages/pager/src/pager.js

@@ -34,6 +34,10 @@ export default {
     autoHidden: { type: Boolean, default: () => GlobalConfig.pager.autoHidden },
     transfer: { type: Boolean, default: () => GlobalConfig.pager.transfer },
     className: [String, Function],
+    pageSizePlacement: {
+      type: String,
+      default: () => GlobalConfig.pager.pageSizePlacement
+    },
     // 自定义图标
     iconPrevPage: String,
     iconJumpPrev: String,
@@ -271,7 +275,7 @@ export default {
         class: 'vxe-pager--sizes',
         props: {
           value: this.pageSize,
-          placement: 'top',
+          placement: this.pageSizePlacement,
           transfer: this.transfer,
           options: this.sizeList
         },

package/packages/table/src/columnInfo.js

@@ -126,7 +126,9 @@ export class ColumnInfo {
 
       renderWidth: 0,
       renderHeight: 0,
+      renderResizeWidth: 0,
       resizeWidth: 0,
+
       renderLeft: 0,
       renderArgs: [], // 渲染参数可用于扩展
       model: {},

package/packages/table/src/methods.js

@@ -1596,6 +1596,7 @@ const Methods = {
       if (!checkMethod || checkMethod({ column })) {
         column.visible = column.defaultVisible
       }
+      column.renderResizeWidth = column.renderWidth
     })
     if (opts.resizable) {
       this.saveCustomResizable(true)
@@ -1798,6 +1799,61 @@ const Methods = {
       localStorage.setItem(visibleStorageKey, XEUtils.toJSONString(columnVisibleStorageMap))
     }
   },
+  getCustomStoreData () {
+    const { id, collectColumn, customOpts } = this
+    const { checkMethod } = customOpts
+    const resizableData = {}
+    const sortData = {}
+    const visibleData = {}
+    const fixedData = {}
+    const storeData = {
+      resizableData,
+      sortData,
+      visibleData,
+      fixedData
+    }
+    if (!id) {
+      errLog('vxe.error.reqProp', ['id'])
+      return storeData
+    }
+    XEUtils.eachTree(collectColumn, (column, index, items, path, parent) => {
+      // 排序只支持一级
+      if (!parent) {
+        collectColumn.forEach((column) => {
+          const colKey = column.getKey()
+          if (colKey) {
+            sortData[colKey] = column.renderSortNumber
+          }
+        })
+      }
+      if (column.resizeWidth) {
+        const colKey = column.getKey()
+        if (colKey) {
+          resizableData[colKey] = column.renderWidth
+        }
+      }
+      if (column.fixed && column.fixed !== column.defaultFixed) {
+        const colKey = column.getKey()
+        if (colKey) {
+          fixedData[colKey] = column.fixed
+        }
+      }
+      if (!checkMethod || checkMethod({ column })) {
+        if (!column.visible && column.defaultVisible) {
+          const colKey = column.getKey()
+          if (colKey) {
+            visibleData[colKey] = false
+          }
+        } else if (column.visible && !column.defaultVisible) {
+          const colKey = column.getKey()
+          if (colKey) {
+            visibleData[colKey] = true
+          }
+        }
+      }
+    })
+    return storeData
+  },
   saveCustomResizable (isReset) {
     const { id, collectColumn, customConfig, customOpts } = this
     const { storage } = customOpts
@@ -1843,11 +1899,9 @@ const Methods = {
         columnWidthStorage = XEUtils.isPlainObject(columnSortStorageMap[id]) ? columnSortStorageMap[id] : {}
         // 排序只支持一级
         collectColumn.forEach(column => {
-          if (column.sortNumber !== column.renderSortNumber) {
-            const colKey = column.getKey()
-            if (colKey) {
-              columnWidthStorage[colKey] = column.renderSortNumber
-            }
+          const colKey = column.getKey()
+          if (colKey) {
+            columnWidthStorage[colKey] = column.renderSortNumber
           }
         })
       }

package/packages/v-x-e-table/src/conf.js

@@ -59,9 +59,12 @@ export default {
     //   visibleMethod () {}
     // },
     customConfig: {
+      allowVisible: true,
+      allowResizable: true,
       allowFixed: true,
       allowSort: true,
-      showFooter: true
+      showFooter: true,
+      placement: 'topRight'
       //  storage: false,
       //  checkMethod () {}
     },
@@ -273,6 +276,7 @@ export default {
     leaveDelay: 300
   },
   pager: {
+    pageSizePlacement: 'top'
     // size: null,
     // autoHidden: false,
     // perfect: true,