e-virt-table
Version:
A powerful data table based on canvas. You can use it as data grid、Microsoft Excel or Google sheets. It supports virtual scroll、cell edit etc.
152 lines • 4.71 kB
JavaScript
import { getLayoutScrollerTrackSize } from './ScrollbarMode';
export default class BaseCell {
constructor(ctx, x, y, width, height, cellType, fixed) {
Object.defineProperty(this, "ctx", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "x", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "y", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "width", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "height", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "visibleWidth", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "visibleHeight", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "fixed", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "cellType", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "drawX", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "drawY", {
enumerable: true,
configurable: true,
writable: true,
value: 0
});
Object.defineProperty(this, "cellImages", {
enumerable: true,
configurable: true,
writable: true,
value: new Map()
});
this.ctx = ctx;
this.x = x;
this.y = y;
this.width = width;
this.height = height;
this.fixed = fixed;
this.cellType = cellType;
}
isHorizontalVisible() {
if (this.fixed) {
return true;
}
const { stageWidth, fixedLeftWidth, scrollX, fixedRightWidth } = this.ctx;
const offsetWidth = stageWidth;
return !(this.x + this.width - fixedLeftWidth - scrollX <= 0 || this.x - scrollX >= offsetWidth - fixedRightWidth);
}
isVerticalVisible() {
const { stageHeight, scrollY } = this.ctx;
const offsetHeight = stageHeight;
return !(this.y + this.height - scrollY <= 0 || this.y - scrollY >= offsetHeight);
}
getDrawX() {
if (this.fixed === 'left') {
return this.x;
}
if (this.fixed === 'right') {
// 可见区域宽度 -到右边界的距离即(表头宽度 - x坐标)
const { stageWidth } = this.ctx;
const x = stageWidth - (this.ctx.header.width - this.x) - getLayoutScrollerTrackSize(this.ctx.config);
return x;
}
return this.x - this.ctx.scrollX;
}
getDrawY() {
if (this.cellType === 'header') {
return this.y;
}
// footer固定时
if (this.cellType === 'footer' && this.ctx.config.FOOTER_FIXED) {
return this.y;
}
return this.y - this.ctx.scrollY;
}
getLeftFixedX() {
return this.x - this.ctx.scrollX;
}
isInside(x, y) {
return x >= this.drawX && x <= this.drawX + this.width && y >= this.drawY && y <= this.drawY + this.height;
}
/**
* 判断是否在可见区域,合并单元格用
* @param x
* @param y
* @returns
*/
isInsideVisible(x, y) {
return x >= this.drawX && x <= this.drawX + this.visibleWidth && y >= this.drawY && y <= this.drawY + this.visibleHeight && this.isInside(x, y);
}
setImage(key, image) {
this.cellImages.set(key, image);
}
getImages() {
return this.cellImages;
}
getImage(key) {
return this.cellImages.get(key);
}
isImageInside(key, e) {
const { offsetX, offsetY } = this.ctx.getOffset(e);
const image = this.getImage(key);
if (image) {
return image.isInside(offsetX, offsetY);
}
return false;
}
}
//# sourceMappingURL=BaseCell.js.map