vxe-gantt 4.0.1 → 4.0.3

package/lib/ui/src/log.js

@@ -8,6 +8,6 @@ var _core = require("@vxe-ui/core");
 const {
   log
 } = _core.VxeUI;
-const version = `gantt v${"4.0.1"}`;
+const version = `gantt v${"4.0.3"}`;
 const warnLog = exports.warnLog = log.create('warn', version);
 const errLog = exports.errLog = log.create('error', version);

package/lib/ui/src/log.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.warnLog=exports.errLog=void 0;var _core=require("@vxe-ui/core");let log=_core.VxeUI.log,version="gantt v4.0.1",warnLog=exports.warnLog=log.create("warn",version),errLog=exports.errLog=log.create("error",version);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.warnLog=exports.errLog=void 0;var _core=require("@vxe-ui/core");let log=_core.VxeUI.log,version="gantt v4.0.3",warnLog=exports.warnLog=log.create("warn",version),errLog=exports.errLog=log.create("error",version);

package/lib/vxe-gantt/style/style.css

@@ -9,27 +9,31 @@
 .vxe-gantt-view--chart-row {
   position: relative;
 }
-.vxe-gantt-view--chart-row.is--round > .vxe-gantt-view--chart-bar {
+.vxe-gantt-view--chart-row.is--round > .vxe-gantt-view--chart-bar, .vxe-gantt-view--chart-row.is--round > .vxe-gantt-view--chart-custom-bar {
   border-radius: var(--vxe-ui-gantt-view-task-bar-border-radius);
 }
-.vxe-gantt-view--chart-row.is--round > .vxe-gantt-view--chart-bar:hover::after {
+.vxe-gantt-view--chart-row.is--round > .vxe-gantt-view--chart-bar:hover::after, .vxe-gantt-view--chart-row.is--round > .vxe-gantt-view--chart-custom-bar:hover::after {
   border-radius: var(--vxe-ui-gantt-view-task-bar-border-radius);
 }
 
-.vxe-gantt-view--chart-bar {
+.vxe-gantt-view--chart-bar,
+.vxe-gantt-view--chart-custom-bar {
   display: flex;
   flex-direction: row;
-  align-items: center;
   position: absolute;
   top: 50%;
   left: 0;
-  color: #ffffff;
   transform: translateY(-50%);
-  height: var(--vxe-ui-gantt-view-chart-bar-height);
+  color: #ffffff;
   background-color: var(--vxe-ui-gantt-view-task-bar-background-color);
   overflow: hidden;
   pointer-events: all;
 }
+
+.vxe-gantt-view--chart-bar {
+  align-items: center;
+  height: var(--vxe-ui-gantt-view-chart-bar-height);
+}
 .vxe-gantt-view--chart-bar:hover::after {
   content: "";
   position: absolute;
@@ -556,10 +560,6 @@
   float: left;
 }
 
-.vxe-gantt-view--header-table {
-  height: 100%;
-}
-
 .vxe-gantt-view--header-table,
 .vxe-gantt-view--body-table {
   border: 0;
@@ -592,8 +592,8 @@
 }
 
 .vxe-gantt-view--body-inner-wrapper {
-  overflow-y: auto;
-  overflow-x: auto;
+  overflow-y: scroll;
+  overflow-x: scroll;
 }
 
 .vxe-gantt-view--header-inner-wrapper,
@@ -605,10 +605,15 @@
   -ms-overflow-style: none;
   -webkit-overflow-scrolling: touch;
 }
+.vxe-gantt-view--header-inner-wrapper::-webkit-scrollbar,
+.vxe-gantt-view--body-inner-wrapper::-webkit-scrollbar {
+  display: none;
+}
 
 .vxe-gantt-view--header-column {
   text-align: center;
   font-size: 1em;
+  height: var(--vxe-ui-gantt-view-cell-height, var(--vxe-ui-table-row-line-height));
 }
 
 .vxe-gantt-view--header-column,
@@ -648,10 +653,6 @@
   background-color: var(--vxe-ui-table-row-hover-current-background-color);
 }
 
-.vxe-gantt-view.mode--day .vxe-gantt-view--header-column {
-  height: 50%;
-}
-
 .vxe-gantt {
   font-size: var(--vxe-ui-font-size-default);
 }

package/lib/vxe-gantt/style/style.min.css

@@ -1 +1 @@
-@charset "UTF-8";.vxe-gantt-view--chart-wrapper{position:absolute;top:0;left:0;pointer-events:none}.vxe-gantt-view--chart-row{position:relative}.vxe-gantt-view--chart-row.is--round>.vxe-gantt-view--chart-bar{border-radius:var(--vxe-ui-gantt-view-task-bar-border-radius)}.vxe-gantt-view--chart-row.is--round>.vxe-gantt-view--chart-bar:hover::after{border-radius:var(--vxe-ui-gantt-view-task-bar-border-radius)}.vxe-gantt-view--chart-bar{display:flex;flex-direction:row;align-items:center;position:absolute;top:50%;left:0;color:#fff;transform:translateY(-50%);height:var(--vxe-ui-gantt-view-chart-bar-height);background-color:var(--vxe-ui-gantt-view-task-bar-background-color);overflow:hidden;pointer-events:all}.vxe-gantt-view--chart-bar:hover::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.1);pointer-events:none}.vxe-gantt-view--chart-progress{flex-shrink:0;width:0;height:100%;text-align:left;background-color:var(--vxe-ui-gantt-view-task-bar-completed-background-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-gantt-view--chart-content{position:absolute;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9em;padding:0 .6em}.vxe-gantt{position:relative;overflow:auto;display:flex;flex-direction:column}.vxe-gantt.is--loading:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:99;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:var(--vxe-ui-loading-background-color)}.vxe-gantt.is--loading>.vxe-gantt-view .vxe-loading{background-color:transparent}.vxe-gantt.is--maximize{position:fixed;top:0;left:0;width:100%;height:100%;padding:.5em 1em;background-color:var(--vxe-ui-layout-background-color)}.vxe-gantt.is--split-drag{cursor:col-resize}.vxe-gantt.is--split-drag .vxe-gantt--table-wrapper::after,.vxe-gantt.is--split-drag .vxe-gantt--view-wrapper::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:0 0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-gantt .vxe-gantt--bottom-wrapper,.vxe-gantt .vxe-gantt--form-wrapper,.vxe-gantt .vxe-gantt--top-wrapper{position:relative}.vxe-gantt .vxe-gantt--gantt-container{position:relative;display:flex;flex-direction:row}.vxe-gantt .vxe-gantt--left-wrapper,.vxe-gantt .vxe-gantt--right-wrapper{flex-shrink:0;overflow:auto;outline:0}.vxe-gantt .vxe-gantt--table-wrapper,.vxe-gantt .vxe-gantt--view-wrapper{display:none;position:relative;flex-grow:1;overflow:hidden}.vxe-gantt .vxe-gantt--view-split-bar{flex-shrink:0;width:var(--vxe-ui-gantt-view-split-bar-width);background-color:var(--vxe-ui-gantt-view-split-bar-background-color)}.vxe-gantt .vxe-gantt--view-split-bar.is--resize{cursor:col-resize}.vxe-gantt.show--left .vxe-gantt--table-wrapper{display:block}.vxe-gantt.show--left.show--right .vxe-gantt--table-wrapper{flex-grow:unset;flex-shrink:0;width:var(--vxe-ui-gantt-view-table-default-width)}.vxe-gantt.show--right .vxe-gantt--view-wrapper{display:block}.vxe-gantt--layout-body-wrapper{display:flex;flex-direction:row;overflow:auto;flex-grow:1}.vxe-gantt--layout-body-content-wrapper{flex-grow:1;overflow:hidden}.vxe-gantt--layout-aside-left-wrapper,.vxe-gantt--layout-footer-wrapper,.vxe-gantt--layout-header-wrapper{flex-shrink:0;overflow:auto}.vxe-gantt--border-line{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none;border:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--full .vxe-gantt-view--body-column,.vxe-gantt.border--full .vxe-gantt-view--footer-column,.vxe-gantt.border--full .vxe-gantt-view--header-column{background-image:linear-gradient(var(--vxe-ui-table-border-color),var(--vxe-ui-table-border-color)),linear-gradient(var(--vxe-ui-table-border-color),var(--vxe-ui-table-border-color));background-repeat:no-repeat;background-size:var(--vxe-ui-table-border-width) 100%,100% var(--vxe-ui-table-border-width);background-position:right top,right bottom}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--default .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-top-corner::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-width:0;border-style:solid;border-color:var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-top-corner::before{border-bottom-width:var(--vxe-ui-table-border-width)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-bottom-corner{border-top:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--full .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--inner .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--outer .vxe-gantt-view--scroll-x-wrapper::after{content:"";position:absolute;left:0;width:100%;height:100%;z-index:1;pointer-events:none}.vxe-gantt.border--default.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--full.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--inner.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--outer.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after{top:0;border-bottom:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--full.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--inner.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--outer.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after{bottom:0;height:calc(100% + var(--vxe-ui-table-border-width));border-top:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-top-corner::before{border-left-width:var(--vxe-ui-table-border-width);border-right-width:var(--vxe-ui-table-border-width)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-bottom-corner::before{border-left-width:var(--vxe-ui-table-border-width);border-right-width:var(--vxe-ui-table-border-width)}.vxe-gantt.border--default.sy-pos--right .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--default.sy-pos--right .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full.sy-pos--right .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--full.sy-pos--right .vxe-gantt-view--scroll-y-top-corner::before{width:calc(100% + 1px);left:-1px}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-wrapper::after,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-wrapper::after{content:"";position:absolute;top:0;width:100%;height:100%;z-index:1;pointer-events:none}.vxe-gantt.border--default.sy-pos--left .vxe-gantt-view--scroll-y-wrapper::after,.vxe-gantt.border--full.sy-pos--left .vxe-gantt-view--scroll-y-wrapper::after{left:0;border-right:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default.sy-pos--right .vxe-gantt-view--scroll-y-wrapper::after,.vxe-gantt.border--full.sy-pos--right .vxe-gantt-view--scroll-y-wrapper::after{right:0;width:calc(100% + var(--vxe-ui-table-border-width));border-left:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--body-column,.vxe-gantt.border--default .vxe-gantt-view--footer-column,.vxe-gantt.border--default .vxe-gantt-view--header-column,.vxe-gantt.border--inner .vxe-gantt-view--body-column,.vxe-gantt.border--inner .vxe-gantt-view--footer-column,.vxe-gantt.border--inner .vxe-gantt-view--header-column{background-image:linear-gradient(var(--vxe-ui-table-border-color),var(--vxe-ui-table-border-color));background-repeat:no-repeat;background-size:100% var(--vxe-ui-table-border-width);background-position:right bottom}.vxe-gantt.border--default .vxe-gantt-view--footer-wrapper,.vxe-gantt.border--full .vxe-gantt-view--footer-wrapper,.vxe-gantt.border--inner .vxe-gantt-view--footer-wrapper{border-top:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--inner .vxe-gantt--border-line{border-width:0 0 1px 0}.vxe-gantt.border--none .vxe-gantt--border-line{display:none}.vxe-gantt--view-split-bar{position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-gantt--view-split-bar-handle{position:absolute;top:0;left:0;width:100%;height:100%;z-index:13}.vxe-gantt--view-split-bar-btn-wrapper{display:flex;flex-direction:column;align-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:15;pointer-events:none}.vxe-gantt--view-split-bar-btn-wrapper>div{margin-top:1em}.vxe-gantt--view-split-bar-btn-wrapper>div:first-child{margin-top:0}.vxe-gantt--view-split-bar-left-btn,.vxe-gantt--view-split-bar-right-btn{display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:.5em;height:var(--vxe-ui-gantt-view-split-bar-height);width:var(--vxe-ui-gantt-view-split-bar-width);color:var(--vxe-ui-layout-background-color);border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-gantt-view-handle-background-color);border:1px solid var(--vxe-ui-input-border-color);pointer-events:all;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:all .1s ease-in-out}.vxe-gantt--view-split-bar-left-btn:hover,.vxe-gantt--view-split-bar-right-btn:hover{background-color:var(--vxe-ui-font-primary-lighten-color)}.vxe-gantt--view-split-bar-left-btn:active,.vxe-gantt--view-split-bar-right-btn:active{transform:scale(.9)}.vxe-gantt--resizable-split-tip{display:none;position:absolute;top:0;left:0;width:1px;height:100%;z-index:18;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:col-resize}.vxe-gantt--resizable-split-tip:before{content:"";display:block;height:100%;background-color:var(--vxe-ui-table-resizable-drag-line-color)}.vxe-gantt--resizable-split-tip-number{position:absolute;top:0;left:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}.vxe-gantt--resizable-split-number-left,.vxe-gantt--resizable-split-number-right{position:absolute;padding:.25em .25em;font-size:12px;border-radius:var(--vxe-ui-border-radius);white-space:nowrap;color:#fff;background-color:var(--vxe-ui-table-resizable-drag-line-color)}.vxe-gantt--resizable-split-number-left{right:0}.vxe-gantt--resizable-split-number-right{left:1px}.vxe-gantt.is--loading>.vxe-gantt-view--scroll-x-virtual{visibility:hidden}.vxe-gantt.is--loading>.vxe-gantt-view--layout-wrapper>.vxe-gantt-view--scroll-y-virtual{visibility:hidden}.vxe-gantt .vxe-gantt-view--scroll-x-virtual{height:0}.vxe-gantt .vxe-gantt-view--scroll-y-virtual{width:0}.vxe-gantt .vxe-gantt-view--scroll-x-virtual,.vxe-gantt .vxe-gantt-view--scroll-y-virtual{visibility:hidden;position:relative;flex-shrink:0;z-index:7}.vxe-gantt .vxe-gantt-view--scroll-x-handle,.vxe-gantt .vxe-gantt-view--scroll-x-left-corner,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner,.vxe-gantt .vxe-gantt-view--scroll-x-wrapper,.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt .vxe-gantt-view--scroll-y-handle,.vxe-gantt .vxe-gantt-view--scroll-y-top-corner,.vxe-gantt .vxe-gantt-view--scroll-y-wrapper{position:absolute}.vxe-gantt .vxe-gantt-view--scroll-x-handle,.vxe-gantt .vxe-gantt-view--scroll-x-wrapper{width:100%;left:0;bottom:0}.vxe-gantt .vxe-gantt-view--scroll-x-handle{overflow-y:hidden;overflow-x:scroll;height:18px}.vxe-gantt .vxe-gantt-view--scroll-x-wrapper{height:100%}.vxe-gantt .vxe-gantt-view--scroll-y-handle,.vxe-gantt .vxe-gantt-view--scroll-y-wrapper{width:100%;height:100%;right:0;top:0}.vxe-gantt .vxe-gantt-view--scroll-y-handle{overflow-y:scroll;overflow-x:hidden;width:18px;height:100%}.vxe-gantt .vxe-gantt-view--scroll-x-space{height:1px}.vxe-gantt .vxe-gantt-view--scroll-y-space{width:1px}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner,.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt .vxe-gantt-view--scroll-y-top-corner{display:none;position:absolute}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner{bottom:0;width:0;height:100%}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner::before,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-width:var(--vxe-ui-table-border-width);border-style:solid;border-color:var(--vxe-ui-table-border-color)}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner{left:0}.vxe-gantt .vxe-gantt-view--scroll-x-right-corner{right:0}.vxe-gantt.sy-pos--right .vxe-gantt-view--scroll-x-right-corner{right:1px}.vxe-gantt.sy-pos--right .vxe-gantt-view--scroll-x-right-corner::before{border-right:0}.vxe-gantt.sx-pos--bottom .vxe-gantt-view--scroll-x-right-corner{bottom:1px}.vxe-gantt.sx-pos--bottom .vxe-gantt-view--scroll-x-right-corner::before{border-bottom:0}.vxe-gantt .vxe-gantt-view--scroll-y-top-corner{background-color:var(--vxe-ui-table-header-background-color)}.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt .vxe-gantt-view--scroll-y-top-corner{top:0;right:0;width:100%;height:0}.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner{margin-top:-1px}.vxe-gantt-view--layout-wrapper{display:flex;flex-direction:row;background-color:var(--vxe-ui-layout-background-color)}.vxe-gantt-view--viewport-wrapper{position:relative;overflow:hidden;flex-grow:1}.vxe-gantt-view--render-vars{width:0;height:0;overflow:hidden}.vxe-gantt-view--column-info{width:var(--vxe-ui-gantt-view-default-cell-width)}.vxe-gantt-view{flex-grow:1;overflow:hidden}.vxe-gantt-view .vxe-body--x-space{width:100%;height:1px;margin-bottom:-1px}.vxe-gantt-view .vxe-body--y-space{width:0;float:left}.vxe-gantt-view--header-table{height:100%}.vxe-gantt-view--body-table,.vxe-gantt-view--header-table{border:0;border-spacing:0;border-collapse:separate;table-layout:fixed}.vxe-gantt-view--body-table col,.vxe-gantt-view--header-table col{width:var(--vxe-ui-gantt-view-default-cell-width)}.vxe-gantt-view--header-wrapper{background-color:var(--vxe-ui-table-header-background-color)}.vxe-gantt-view--footer-wrapper{margin-top:calc(var(--vxe-ui-table-border-width) * -1);background-color:var(--vxe-ui-table-footer-background-color)}.vxe-gantt-view--body-wrapper,.vxe-gantt-view--header-wrapper{overflow:hidden}.vxe-gantt-view--header-inner-wrapper{overflow-y:hidden;overflow-x:scroll}.vxe-gantt-view--body-inner-wrapper{overflow-y:auto;overflow-x:auto}.vxe-gantt-view--body-inner-wrapper,.vxe-gantt-view--header-inner-wrapper{position:relative;width:100%;height:100%;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}.vxe-gantt-view--header-column{text-align:center;font-size:1em}.vxe-gantt-view--body-column,.vxe-gantt-view--footer-column,.vxe-gantt-view--header-column{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-gantt-view--body-row.row--stripe{background-color:var(--vxe-ui-table-row-striped-background-color)}.vxe-gantt-view--body-row.row--radio{background-color:var(--vxe-ui-table-row-radio-checked-background-color)}.vxe-gantt-view--body-row.row--checked{background-color:var(--vxe-ui-table-row-checkbox-checked-background-color)}.vxe-gantt-view--body-row.row--current{background-color:var(--vxe-ui-table-row-current-background-color)}.vxe-gantt-view--body-row.row--hover{background-color:var(--vxe-ui-table-row-hover-background-color)}.vxe-gantt-view--body-row.row--hover.row--stripe{background-color:var(--vxe-ui-table-row-hover-striped-background-color)}.vxe-gantt-view--body-row.row--hover.row--radio{background-color:var(--vxe-ui-table-row-hover-radio-checked-background-color)}.vxe-gantt-view--body-row.row--hover.row--checked{background-color:var(--vxe-ui-table-row-hover-checkbox-checked-background-color)}.vxe-gantt-view--body-row.row--hover.row--current{background-color:var(--vxe-ui-table-row-hover-current-background-color)}.vxe-gantt-view.mode--day .vxe-gantt-view--header-column{height:50%}.vxe-gantt{font-size:var(--vxe-ui-font-size-default)}.vxe-gantt.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-gantt.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-gantt.size--mini{font-size:var(--vxe-ui-font-size-mini)}
+@charset "UTF-8";.vxe-gantt-view--chart-wrapper{position:absolute;top:0;left:0;pointer-events:none}.vxe-gantt-view--chart-row{position:relative}.vxe-gantt-view--chart-row.is--round>.vxe-gantt-view--chart-bar,.vxe-gantt-view--chart-row.is--round>.vxe-gantt-view--chart-custom-bar{border-radius:var(--vxe-ui-gantt-view-task-bar-border-radius)}.vxe-gantt-view--chart-row.is--round>.vxe-gantt-view--chart-bar:hover::after,.vxe-gantt-view--chart-row.is--round>.vxe-gantt-view--chart-custom-bar:hover::after{border-radius:var(--vxe-ui-gantt-view-task-bar-border-radius)}.vxe-gantt-view--chart-bar,.vxe-gantt-view--chart-custom-bar{display:flex;flex-direction:row;position:absolute;top:50%;left:0;transform:translateY(-50%);color:#fff;background-color:var(--vxe-ui-gantt-view-task-bar-background-color);overflow:hidden;pointer-events:all}.vxe-gantt-view--chart-bar{align-items:center;height:var(--vxe-ui-gantt-view-chart-bar-height)}.vxe-gantt-view--chart-bar:hover::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.1);pointer-events:none}.vxe-gantt-view--chart-progress{flex-shrink:0;width:0;height:100%;text-align:left;background-color:var(--vxe-ui-gantt-view-task-bar-completed-background-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-gantt-view--chart-content{position:absolute;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9em;padding:0 .6em}.vxe-gantt{position:relative;overflow:auto;display:flex;flex-direction:column}.vxe-gantt.is--loading:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:99;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:var(--vxe-ui-loading-background-color)}.vxe-gantt.is--loading>.vxe-gantt-view .vxe-loading{background-color:transparent}.vxe-gantt.is--maximize{position:fixed;top:0;left:0;width:100%;height:100%;padding:.5em 1em;background-color:var(--vxe-ui-layout-background-color)}.vxe-gantt.is--split-drag{cursor:col-resize}.vxe-gantt.is--split-drag .vxe-gantt--table-wrapper::after,.vxe-gantt.is--split-drag .vxe-gantt--view-wrapper::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:0 0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-gantt .vxe-gantt--bottom-wrapper,.vxe-gantt .vxe-gantt--form-wrapper,.vxe-gantt .vxe-gantt--top-wrapper{position:relative}.vxe-gantt .vxe-gantt--gantt-container{position:relative;display:flex;flex-direction:row}.vxe-gantt .vxe-gantt--left-wrapper,.vxe-gantt .vxe-gantt--right-wrapper{flex-shrink:0;overflow:auto;outline:0}.vxe-gantt .vxe-gantt--table-wrapper,.vxe-gantt .vxe-gantt--view-wrapper{display:none;position:relative;flex-grow:1;overflow:hidden}.vxe-gantt .vxe-gantt--view-split-bar{flex-shrink:0;width:var(--vxe-ui-gantt-view-split-bar-width);background-color:var(--vxe-ui-gantt-view-split-bar-background-color)}.vxe-gantt .vxe-gantt--view-split-bar.is--resize{cursor:col-resize}.vxe-gantt.show--left .vxe-gantt--table-wrapper{display:block}.vxe-gantt.show--left.show--right .vxe-gantt--table-wrapper{flex-grow:unset;flex-shrink:0;width:var(--vxe-ui-gantt-view-table-default-width)}.vxe-gantt.show--right .vxe-gantt--view-wrapper{display:block}.vxe-gantt--layout-body-wrapper{display:flex;flex-direction:row;overflow:auto;flex-grow:1}.vxe-gantt--layout-body-content-wrapper{flex-grow:1;overflow:hidden}.vxe-gantt--layout-aside-left-wrapper,.vxe-gantt--layout-footer-wrapper,.vxe-gantt--layout-header-wrapper{flex-shrink:0;overflow:auto}.vxe-gantt--border-line{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none;border:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--full .vxe-gantt-view--body-column,.vxe-gantt.border--full .vxe-gantt-view--footer-column,.vxe-gantt.border--full .vxe-gantt-view--header-column{background-image:linear-gradient(var(--vxe-ui-table-border-color),var(--vxe-ui-table-border-color)),linear-gradient(var(--vxe-ui-table-border-color),var(--vxe-ui-table-border-color));background-repeat:no-repeat;background-size:var(--vxe-ui-table-border-width) 100%,100% var(--vxe-ui-table-border-width);background-position:right top,right bottom}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--default .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-top-corner::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-width:0;border-style:solid;border-color:var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-top-corner::before{border-bottom-width:var(--vxe-ui-table-border-width)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt.border--inner .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt.border--outer .vxe-gantt-view--scroll-y-bottom-corner{border-top:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--full .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--inner .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--outer .vxe-gantt-view--scroll-x-wrapper::after{content:"";position:absolute;left:0;width:100%;height:100%;z-index:1;pointer-events:none}.vxe-gantt.border--default.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--full.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--inner.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--outer.sx-pos--top .vxe-gantt-view--scroll-x-wrapper::after{top:0;border-bottom:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--full.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--inner.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after,.vxe-gantt.border--outer.sx-pos--bottom .vxe-gantt-view--scroll-x-wrapper::after{bottom:0;height:calc(100% + var(--vxe-ui-table-border-width));border-top:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-top-corner::before{border-left-width:var(--vxe-ui-table-border-width);border-right-width:var(--vxe-ui-table-border-width)}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-bottom-corner::before{border-left-width:var(--vxe-ui-table-border-width);border-right-width:var(--vxe-ui-table-border-width)}.vxe-gantt.border--default.sy-pos--right .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--default.sy-pos--right .vxe-gantt-view--scroll-y-top-corner::before,.vxe-gantt.border--full.sy-pos--right .vxe-gantt-view--scroll-y-bottom-corner::before,.vxe-gantt.border--full.sy-pos--right .vxe-gantt-view--scroll-y-top-corner::before{width:calc(100% + 1px);left:-1px}.vxe-gantt.border--default .vxe-gantt-view--scroll-y-wrapper::after,.vxe-gantt.border--full .vxe-gantt-view--scroll-y-wrapper::after{content:"";position:absolute;top:0;width:100%;height:100%;z-index:1;pointer-events:none}.vxe-gantt.border--default.sy-pos--left .vxe-gantt-view--scroll-y-wrapper::after,.vxe-gantt.border--full.sy-pos--left .vxe-gantt-view--scroll-y-wrapper::after{left:0;border-right:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default.sy-pos--right .vxe-gantt-view--scroll-y-wrapper::after,.vxe-gantt.border--full.sy-pos--right .vxe-gantt-view--scroll-y-wrapper::after{right:0;width:calc(100% + var(--vxe-ui-table-border-width));border-left:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--default .vxe-gantt-view--body-column,.vxe-gantt.border--default .vxe-gantt-view--footer-column,.vxe-gantt.border--default .vxe-gantt-view--header-column,.vxe-gantt.border--inner .vxe-gantt-view--body-column,.vxe-gantt.border--inner .vxe-gantt-view--footer-column,.vxe-gantt.border--inner .vxe-gantt-view--header-column{background-image:linear-gradient(var(--vxe-ui-table-border-color),var(--vxe-ui-table-border-color));background-repeat:no-repeat;background-size:100% var(--vxe-ui-table-border-width);background-position:right bottom}.vxe-gantt.border--default .vxe-gantt-view--footer-wrapper,.vxe-gantt.border--full .vxe-gantt-view--footer-wrapper,.vxe-gantt.border--inner .vxe-gantt-view--footer-wrapper{border-top:var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color)}.vxe-gantt.border--inner .vxe-gantt--border-line{border-width:0 0 1px 0}.vxe-gantt.border--none .vxe-gantt--border-line{display:none}.vxe-gantt--view-split-bar{position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-gantt--view-split-bar-handle{position:absolute;top:0;left:0;width:100%;height:100%;z-index:13}.vxe-gantt--view-split-bar-btn-wrapper{display:flex;flex-direction:column;align-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:15;pointer-events:none}.vxe-gantt--view-split-bar-btn-wrapper>div{margin-top:1em}.vxe-gantt--view-split-bar-btn-wrapper>div:first-child{margin-top:0}.vxe-gantt--view-split-bar-left-btn,.vxe-gantt--view-split-bar-right-btn{display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:.5em;height:var(--vxe-ui-gantt-view-split-bar-height);width:var(--vxe-ui-gantt-view-split-bar-width);color:var(--vxe-ui-layout-background-color);border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-gantt-view-handle-background-color);border:1px solid var(--vxe-ui-input-border-color);pointer-events:all;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:all .1s ease-in-out}.vxe-gantt--view-split-bar-left-btn:hover,.vxe-gantt--view-split-bar-right-btn:hover{background-color:var(--vxe-ui-font-primary-lighten-color)}.vxe-gantt--view-split-bar-left-btn:active,.vxe-gantt--view-split-bar-right-btn:active{transform:scale(.9)}.vxe-gantt--resizable-split-tip{display:none;position:absolute;top:0;left:0;width:1px;height:100%;z-index:18;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:col-resize}.vxe-gantt--resizable-split-tip:before{content:"";display:block;height:100%;background-color:var(--vxe-ui-table-resizable-drag-line-color)}.vxe-gantt--resizable-split-tip-number{position:absolute;top:0;left:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}.vxe-gantt--resizable-split-number-left,.vxe-gantt--resizable-split-number-right{position:absolute;padding:.25em .25em;font-size:12px;border-radius:var(--vxe-ui-border-radius);white-space:nowrap;color:#fff;background-color:var(--vxe-ui-table-resizable-drag-line-color)}.vxe-gantt--resizable-split-number-left{right:0}.vxe-gantt--resizable-split-number-right{left:1px}.vxe-gantt.is--loading>.vxe-gantt-view--scroll-x-virtual{visibility:hidden}.vxe-gantt.is--loading>.vxe-gantt-view--layout-wrapper>.vxe-gantt-view--scroll-y-virtual{visibility:hidden}.vxe-gantt .vxe-gantt-view--scroll-x-virtual{height:0}.vxe-gantt .vxe-gantt-view--scroll-y-virtual{width:0}.vxe-gantt .vxe-gantt-view--scroll-x-virtual,.vxe-gantt .vxe-gantt-view--scroll-y-virtual{visibility:hidden;position:relative;flex-shrink:0;z-index:7}.vxe-gantt .vxe-gantt-view--scroll-x-handle,.vxe-gantt .vxe-gantt-view--scroll-x-left-corner,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner,.vxe-gantt .vxe-gantt-view--scroll-x-wrapper,.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt .vxe-gantt-view--scroll-y-handle,.vxe-gantt .vxe-gantt-view--scroll-y-top-corner,.vxe-gantt .vxe-gantt-view--scroll-y-wrapper{position:absolute}.vxe-gantt .vxe-gantt-view--scroll-x-handle,.vxe-gantt .vxe-gantt-view--scroll-x-wrapper{width:100%;left:0;bottom:0}.vxe-gantt .vxe-gantt-view--scroll-x-handle{overflow-y:hidden;overflow-x:scroll;height:18px}.vxe-gantt .vxe-gantt-view--scroll-x-wrapper{height:100%}.vxe-gantt .vxe-gantt-view--scroll-y-handle,.vxe-gantt .vxe-gantt-view--scroll-y-wrapper{width:100%;height:100%;right:0;top:0}.vxe-gantt .vxe-gantt-view--scroll-y-handle{overflow-y:scroll;overflow-x:hidden;width:18px;height:100%}.vxe-gantt .vxe-gantt-view--scroll-x-space{height:1px}.vxe-gantt .vxe-gantt-view--scroll-y-space{width:1px}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner,.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt .vxe-gantt-view--scroll-y-top-corner{display:none;position:absolute}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner{bottom:0;width:0;height:100%}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner::before,.vxe-gantt .vxe-gantt-view--scroll-x-right-corner::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-width:var(--vxe-ui-table-border-width);border-style:solid;border-color:var(--vxe-ui-table-border-color)}.vxe-gantt .vxe-gantt-view--scroll-x-left-corner{left:0}.vxe-gantt .vxe-gantt-view--scroll-x-right-corner{right:0}.vxe-gantt.sy-pos--right .vxe-gantt-view--scroll-x-right-corner{right:1px}.vxe-gantt.sy-pos--right .vxe-gantt-view--scroll-x-right-corner::before{border-right:0}.vxe-gantt.sx-pos--bottom .vxe-gantt-view--scroll-x-right-corner{bottom:1px}.vxe-gantt.sx-pos--bottom .vxe-gantt-view--scroll-x-right-corner::before{border-bottom:0}.vxe-gantt .vxe-gantt-view--scroll-y-top-corner{background-color:var(--vxe-ui-table-header-background-color)}.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner,.vxe-gantt .vxe-gantt-view--scroll-y-top-corner{top:0;right:0;width:100%;height:0}.vxe-gantt .vxe-gantt-view--scroll-y-bottom-corner{margin-top:-1px}.vxe-gantt-view--layout-wrapper{display:flex;flex-direction:row;background-color:var(--vxe-ui-layout-background-color)}.vxe-gantt-view--viewport-wrapper{position:relative;overflow:hidden;flex-grow:1}.vxe-gantt-view--render-vars{width:0;height:0;overflow:hidden}.vxe-gantt-view--column-info{width:var(--vxe-ui-gantt-view-default-cell-width)}.vxe-gantt-view{flex-grow:1;overflow:hidden}.vxe-gantt-view .vxe-body--x-space{width:100%;height:1px;margin-bottom:-1px}.vxe-gantt-view .vxe-body--y-space{width:0;float:left}.vxe-gantt-view--body-table,.vxe-gantt-view--header-table{border:0;border-spacing:0;border-collapse:separate;table-layout:fixed}.vxe-gantt-view--body-table col,.vxe-gantt-view--header-table col{width:var(--vxe-ui-gantt-view-default-cell-width)}.vxe-gantt-view--header-wrapper{background-color:var(--vxe-ui-table-header-background-color)}.vxe-gantt-view--footer-wrapper{margin-top:calc(var(--vxe-ui-table-border-width) * -1);background-color:var(--vxe-ui-table-footer-background-color)}.vxe-gantt-view--body-wrapper,.vxe-gantt-view--header-wrapper{overflow:hidden}.vxe-gantt-view--header-inner-wrapper{overflow-y:hidden;overflow-x:scroll}.vxe-gantt-view--body-inner-wrapper{overflow-y:scroll;overflow-x:scroll}.vxe-gantt-view--body-inner-wrapper,.vxe-gantt-view--header-inner-wrapper{position:relative;width:100%;height:100%;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}.vxe-gantt-view--body-inner-wrapper::-webkit-scrollbar,.vxe-gantt-view--header-inner-wrapper::-webkit-scrollbar{display:none}.vxe-gantt-view--header-column{text-align:center;font-size:1em;height:var(--vxe-ui-gantt-view-cell-height,var(--vxe-ui-table-row-line-height))}.vxe-gantt-view--body-column,.vxe-gantt-view--footer-column,.vxe-gantt-view--header-column{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-gantt-view--body-row.row--stripe{background-color:var(--vxe-ui-table-row-striped-background-color)}.vxe-gantt-view--body-row.row--radio{background-color:var(--vxe-ui-table-row-radio-checked-background-color)}.vxe-gantt-view--body-row.row--checked{background-color:var(--vxe-ui-table-row-checkbox-checked-background-color)}.vxe-gantt-view--body-row.row--current{background-color:var(--vxe-ui-table-row-current-background-color)}.vxe-gantt-view--body-row.row--hover{background-color:var(--vxe-ui-table-row-hover-background-color)}.vxe-gantt-view--body-row.row--hover.row--stripe{background-color:var(--vxe-ui-table-row-hover-striped-background-color)}.vxe-gantt-view--body-row.row--hover.row--radio{background-color:var(--vxe-ui-table-row-hover-radio-checked-background-color)}.vxe-gantt-view--body-row.row--hover.row--checked{background-color:var(--vxe-ui-table-row-hover-checkbox-checked-background-color)}.vxe-gantt-view--body-row.row--hover.row--current{background-color:var(--vxe-ui-table-row-hover-current-background-color)}.vxe-gantt{font-size:var(--vxe-ui-font-size-default)}.vxe-gantt.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-gantt.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-gantt.size--mini{font-size:var(--vxe-ui-font-size-mini)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-gantt",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "description": "A vue based gantt component",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -64,7 +64,7 @@
     "vue": "3.4.27",
     "vue-router": "~4.5.1",
     "vxe-pc-ui": "^4.8.19",
-    "vxe-table": "^4.16.0-beta.3"
+    "vxe-table": "^4.16.0-beta.4"
   },
   "vetur": {
     "tags": "helper/vetur/tags.json",

package/packages/gantt/src/gantt-chart.ts

@@ -33,6 +33,9 @@ export default defineVxeComponent({
       const rowOpts = computeRowOpts.value
       const defaultRowHeight = computeDefaultRowHeight.value
 
+      const ganttSlots = $xeGantt.context.slots
+      const taskBarSlot = ganttSlots.taskBar || ganttSlots['task-bar']
+
       const titleField = computeTitleField.value
       const progressField = computeProgressField.value
       const taskBarOpts = computeTaskBarOpts.value
@@ -62,7 +65,7 @@ export default defineVxeComponent({
         }
       }, [
         h('div', {
-          class: 'vxe-gantt-view--chart-bar',
+          class: taskBarSlot ? 'vxe-gantt-view--chart-custom-bar' : 'vxe-gantt-view--chart-bar',
           rowid,
           onClick (evnt) {
             $xeGantt.handleTaskBarClickEvent(evnt, { row })
@@ -70,21 +73,23 @@ export default defineVxeComponent({
           onDblclick (evnt) {
             $xeGantt.handleTaskBarDblclickEvent(evnt, { row })
           }
-        }, [
-          showProgress
-            ? h('div', {
-              class: 'vxe-gantt-view--chart-progress',
-              style: {
-                width: `${progressValue || 0}%`
-              }
-            })
-            : renderEmptyElement($xeGantt),
-          showContent
-            ? h('div', {
-              class: 'vxe-gantt-view--chart-content'
-            }, title)
-            : renderEmptyElement($xeGantt)
-        ])
+        }, taskBarSlot
+          ? $xeGantt.callSlot(taskBarSlot, { row })
+          : [
+              showProgress
+                ? h('div', {
+                  class: 'vxe-gantt-view--chart-progress',
+                  style: {
+                    width: `${progressValue || 0}%`
+                  }
+                })
+                : renderEmptyElement($xeGantt),
+              showContent
+                ? h('div', {
+                  class: 'vxe-gantt-view--chart-content'
+                }, title)
+                : renderEmptyElement($xeGantt)
+            ])
       ])
     }
 

package/packages/gantt/src/gantt-view.ts

@@ -51,7 +51,7 @@ export default defineVxeComponent({
 
     const $xeGantt = inject('$xeGantt', {} as (VxeGanttConstructor & VxeGanttPrivateMethods))
 
-    const { computeTaskViewOpts, computeStartField, computeEndField, computeScrollbarOpts, computeScrollbarXToTop, computeScrollbarYToLeft } = $xeGantt.getComputeMaps()
+    const { computeTaskOpts, computeTaskViewOpts, computeStartField, computeEndField, computeScrollbarOpts, computeScrollbarXToTop, computeScrollbarYToLeft } = $xeGantt.getComputeMaps()
 
     const refElem = ref<HTMLDivElement>()
 
@@ -131,6 +131,12 @@ export default defineVxeComponent({
       getComputeMaps: () => computeMaps
     } as unknown as VxeGanttViewConstructor & VxeGanttViewPrivateMethods
 
+    const parseStringDate = (dateValue: any) => {
+      const taskOpts = computeTaskOpts.value
+      const { dateFormat } = taskOpts
+      return XEUtils.toStringDate(dateValue, dateFormat || null)
+    }
+
     const handleParseColumn = () => {
       const ganttProps = $xeGantt.props
       const { treeConfig } = ganttProps
@@ -198,8 +204,8 @@ export default defineVxeComponent({
                 const startValue = XEUtils.get(row, startField)
                 const endValue = XEUtils.get(row, endField)
                 if (startValue && endValue) {
-                  const startDate = XEUtils.toStringDate(startValue)
-                  const endDate = XEUtils.toStringDate(endValue)
+                  const startDate = parseStringDate(startValue)
+                  const endDate = parseStringDate(endValue)
                   const oLeftSize = Math.floor((startDate.getTime() - minViewDate.getTime()) / 86400000)
                   const oWidthSize = Math.floor((endDate.getTime() - startDate.getTime()) / 86400000) + 1
                   ctMaps[rowid] = {
@@ -248,11 +254,11 @@ export default defineVxeComponent({
           const startValue = XEUtils.get(row, startField)
           const endValue = XEUtils.get(row, endField)
           if (startValue && endValue) {
-            const startDate = XEUtils.toStringDate(startValue)
+            const startDate = parseStringDate(startValue)
             if (!minDate || minDate.getTime() > startDate.getTime()) {
               minDate = startDate
             }
-            const endDate = XEUtils.toStringDate(endValue)
+            const endDate = parseStringDate(endValue)
             if (!maxDate || maxDate.getTime() < endDate.getTime()) {
               maxDate = endDate
             }
@@ -319,7 +325,7 @@ export default defineVxeComponent({
     }
 
     const updateStyle = () => {
-      const { scrollbarWidth, scrollbarHeight, tableColumn } = reactData
+      const { scrollbarWidth, scrollbarHeight, tableColumn, headerGroups } = reactData
       const { elemStore } = internalData
       const $xeTable = internalData.xeTable
 
@@ -358,6 +364,7 @@ export default defineVxeComponent({
       const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
       if (headerScrollElem) {
         headerScrollElem.style.height = `${tHeaderHeight}px`
+        headerScrollElem.style.setProperty('--vxe-ui-gantt-view-cell-height', `${tHeaderHeight / headerGroups.length}px`)
       }
       const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
       if (bodyScrollElem) {

package/packages/gantt/src/gantt.ts

@@ -109,7 +109,8 @@ export default defineVxeComponent({
     const refForm = ref<VxeFormInstance>()
     const refToolbar = ref<VxeToolbarInstance>()
     const refPager = ref<VxePagerInstance>()
-    const refGanttContainer = ref<HTMLDivElement>()
+    const refGanttContainerElem = ref<HTMLDivElement>()
+    const refClassifyWrapperElem = ref<HTMLDivElement>()
     const refGanttView = ref<VxeGanttViewInstance>()
 
     const refFormWrapper = ref<HTMLDivElement>()
@@ -273,6 +274,8 @@ export default defineVxeComponent({
     const computeTableProps = computed(() => {
       const { seqConfig, pagerConfig, editConfig, proxyConfig } = props
       const { isZMax, tablePage } = reactData
+      const taskViewOpts = computeTaskViewOpts.value
+      const { tableStyle } = taskViewOpts
       const tableExtendProps = computeTableExtendProps.value
       const proxyOpts = computeProxyOpts.value
       const pagerOpts = computePagerOpts.value
@@ -283,6 +286,12 @@ export default defineVxeComponent({
         showHeaderOverflow: true,
         showFooterOverflow: true
       })
+      if (tableStyle) {
+        const { border } = tableStyle
+        if (!XEUtils.eqNull(border)) {
+          tProps.border = border
+        }
+      }
       if (isZMax) {
         if (tableExtendProps.maxHeight) {
           tProps.maxHeight = '100%'
@@ -358,7 +367,14 @@ export default defineVxeComponent({
     })
 
     const computeTableBorder = computed(() => {
-      const { border } = props
+      let { border } = props
+      const taskViewOpts = computeTaskViewOpts.value
+      const { viewStyle } = taskViewOpts
+      if (viewStyle) {
+        if (!XEUtils.eqNull(viewStyle.border)) {
+          border = viewStyle.border
+        }
+      }
       if (border === true) {
         return 'full'
       }
@@ -373,7 +389,9 @@ export default defineVxeComponent({
       refTable,
       refForm,
       refToolbar,
-      refPager
+      refPager,
+      refGanttContainerElem,
+      refClassifyWrapperElem
     }
 
     const computeMaps: VxeGanttPrivateComputed = {
@@ -685,7 +703,7 @@ export default defineVxeComponent({
       if (!el) {
         return
       }
-      const ganttContainerEl = refGanttContainer.value
+      const ganttContainerEl = refGanttContainerElem.value
       if (!ganttContainerEl) {
         return
       }
@@ -1337,6 +1355,28 @@ export default defineVxeComponent({
           return $ganttView.refreshData()
         }
         return nextTick()
+      },
+      hasTableViewVisible () {
+        return reactData.showLeftView
+      },
+      showTableView () {
+        reactData.showLeftView = true
+        return nextTick()
+      },
+      hideTableView () {
+        reactData.showLeftView = false
+        return nextTick()
+      },
+      hasTaskViewVisible () {
+        return reactData.showRightView
+      },
+      showTaskView () {
+        reactData.showRightView = true
+        return nextTick()
+      },
+      hideTaskView () {
+        reactData.showRightView = false
+        return nextTick()
       }
     }
 
@@ -1806,7 +1846,7 @@ export default defineVxeComponent({
           case 'Gantt':
             childVNs.push(
               h('div', {
-                ref: refGanttContainer,
+                ref: refGanttContainerElem,
                 key: 'tv',
                 class: 'vxe-gantt--gantt-container'
               }, [
@@ -1815,6 +1855,9 @@ export default defineVxeComponent({
                 renderSplitBar(),
                 renderTaskView(),
                 renderTableRight(),
+                h('div', {
+                  ref: refClassifyWrapperElem
+                }),
                 h('div', {
                   ref: refResizableSplitTip,
                   class: 'vxe-gantt--resizable-split-tip'

package/styles/components/gantt-module/gantt-chart.scss

@@ -7,7 +7,8 @@
 .vxe-gantt-view--chart-row {
   position: relative;
   &.is--round {
-    & > .vxe-gantt-view--chart-bar {
+    & > .vxe-gantt-view--chart-bar,
+    & > .vxe-gantt-view--chart-custom-bar {
       border-radius: var(--vxe-ui-gantt-view-task-bar-border-radius);
       &:hover {
         &::after {
@@ -17,19 +18,22 @@
     }
   }
 }
-.vxe-gantt-view--chart-bar {
+.vxe-gantt-view--chart-bar,
+.vxe-gantt-view--chart-custom-bar {
   display: flex;
   flex-direction: row;
-  align-items: center;
   position: absolute;
   top: 50%;
   left: 0;
-  color: #ffffff;
   transform: translateY(-50%);
-  height: var(--vxe-ui-gantt-view-chart-bar-height);
+  color: #ffffff;
   background-color: var(--vxe-ui-gantt-view-task-bar-background-color);
   overflow: hidden;
   pointer-events: all;
+}
+.vxe-gantt-view--chart-bar {
+  align-items: center;
+  height: var(--vxe-ui-gantt-view-chart-bar-height);
   &:hover {
     &::after {
       content: "";

package/styles/components/gantt.scss

@@ -538,9 +538,6 @@
     float: left;
   }
 }
-.vxe-gantt-view--header-table {
-  height: 100%;
-}
 .vxe-gantt-view--header-table,
 .vxe-gantt-view--body-table {
   border: 0;
@@ -567,8 +564,8 @@
   overflow-x: scroll;
 }
 .vxe-gantt-view--body-inner-wrapper {
-  overflow-y: auto;
-  overflow-x: auto;
+  overflow-y: scroll;
+  overflow-x: scroll;
 }
 .vxe-gantt-view--header-inner-wrapper,
 .vxe-gantt-view--body-inner-wrapper {
@@ -578,10 +575,14 @@
   scrollbar-width: none;
   -ms-overflow-style: none;
   -webkit-overflow-scrolling: touch;
+  &::-webkit-scrollbar {
+    display: none;
+  }
 }
 .vxe-gantt-view--header-column {
   text-align: center;
   font-size: 1em;
+  height: var(--vxe-ui-gantt-view-cell-height, var(--vxe-ui-table-row-line-height));
 }
 .vxe-gantt-view--header-column,
 .vxe-gantt-view--body-column,
@@ -623,14 +624,6 @@
   }
 }
 
-.vxe-gantt-view {
-  &.mode--day {
-    .vxe-gantt-view--header-column {
-      height: 50%;
-    }
-  }
-}
-
 .vxe-gantt {
   font-size: var(--vxe-ui-font-size-default);
   &.size--medium {