@meta2d/form-diagram
Advanced tools
Comparing version
@@ -0,0 +0,0 @@ export * from './src/table'; |
@@ -0,0 +0,0 @@ export * from './src/table'; |
{ | ||
"name": "@meta2d/form-diagram", | ||
"version": "1.0.22", | ||
"version": "1.0.23", | ||
"description": "The form library based on le5le meta2d.", | ||
@@ -5,0 +5,0 @@ "main": "index.js", |
import { formPen } from './common'; | ||
export declare function checkbox(ctx: CanvasRenderingContext2D, pen: formPen): void; |
@@ -1,3 +0,3 @@ | ||
import { getTextColor, getFont } from '../../core'; | ||
import { pSBC } from '../../core'; | ||
import { getTextColor, getFont } from '@meta2d/core'; | ||
import { pSBC } from '@meta2d/core'; | ||
export function checkbox(ctx, pen) { | ||
@@ -10,8 +10,8 @@ if (!pen.onMouseDown) { | ||
} | ||
var x = pen.calculative.worldRect.x; | ||
var y = pen.calculative.worldRect.y; | ||
var h = pen.calculative.worldRect.height; | ||
var w = pen.calculative.worldRect.width; | ||
var _a = pen.calculative, fontStyle = _a.fontStyle, fontWeight = _a.fontWeight, fontSize = _a.fontSize, fontFamily = _a.fontFamily, lineHeight = _a.lineHeight; | ||
var r = 2; | ||
let x = pen.calculative.worldRect.x; | ||
let y = pen.calculative.worldRect.y; | ||
let h = pen.calculative.worldRect.height; | ||
let w = pen.calculative.worldRect.width; | ||
const { fontStyle, fontWeight, fontSize, fontFamily, lineHeight } = pen.calculative; | ||
let r = 2; | ||
ctx.beginPath(); | ||
@@ -63,7 +63,7 @@ ctx.moveTo(x, y); | ||
ctx.font = getFont({ | ||
fontStyle: fontStyle, | ||
fontWeight: fontWeight, | ||
fontStyle, | ||
fontWeight, | ||
fontFamily: fontFamily || pen.calculative.canvas.parent.store.options.fontFamily, | ||
fontSize: fontSize, | ||
lineHeight: lineHeight, | ||
fontSize, | ||
lineHeight, | ||
}); | ||
@@ -70,0 +70,0 @@ ctx.fillText(pen.value + '', x + h + 10, y + h / 2); |
@@ -1,4 +0,2 @@ | ||
import { Pen } from '../../core/src/pen'; | ||
import { ChartData } from '../../core/src/pen'; | ||
import { Rect } from '@meta2d/core'; | ||
import { Rect, ChartData, Pen } from '@meta2d/core'; | ||
export interface Pos { | ||
@@ -5,0 +3,0 @@ row: number; |
@@ -9,6 +9,6 @@ import { calcRightBottom } from '@meta2d/core'; | ||
export function getTextLength(text, pen) { | ||
var textScale = (pen.calculative.worldRect.height * 14) / 16; | ||
var chinese = text.match(/[\u4e00-\u9fa5]/g) || ''; | ||
var chineseLen = chinese.length; | ||
var width = (text.length - chineseLen) * textScale * 0.6 + chineseLen * textScale; | ||
const textScale = (pen.calculative.worldRect.height * 14) / 16; | ||
const chinese = text.match(/[\u4e00-\u9fa5]/g) || ''; | ||
const chineseLen = chinese.length; | ||
const width = (text.length - chineseLen) * textScale * 0.6 + chineseLen * textScale; | ||
return width; | ||
@@ -18,12 +18,12 @@ } | ||
if (pen.direction == 'horizontal') { | ||
var optionPos_1 = []; | ||
var textLength_1 = 0; | ||
var h_1 = pen.height; | ||
pen.checkboxHeight = h_1; | ||
pen.options.forEach(function (item, index) { | ||
optionPos_1.push(index * (40 + h_1) + textLength_1); | ||
textLength_1 += getTextLength(item.text, pen); | ||
const optionPos = []; | ||
let textLength = 0; | ||
const h = pen.height; | ||
pen.checkboxHeight = h; | ||
pen.options.forEach((item, index) => { | ||
optionPos.push(index * (40 + h) + textLength); | ||
textLength += getTextLength(item.text, pen); | ||
}); | ||
pen.optionPos = optionPos_1; | ||
var width = optionPos_1.length * (40 + h_1) + textLength_1; | ||
pen.optionPos = optionPos; | ||
const width = optionPos.length * (40 + h) + textLength; | ||
pen.checkboxWidth = width; | ||
@@ -51,8 +51,8 @@ pen.width = width; | ||
} | ||
var optionPos_2 = []; | ||
pen.options.forEach(function (item, index) { | ||
optionPos_2.push(index * (pen.optionInterval + pen.optionHeight)); | ||
const optionPos = []; | ||
pen.options.forEach((item, index) => { | ||
optionPos.push(index * (pen.optionInterval + pen.optionHeight)); | ||
}); | ||
pen.optionPos = optionPos_2; | ||
var height = optionPos_2[optionPos_2.length - 1] + pen.optionHeight; | ||
pen.optionPos = optionPos; | ||
const height = optionPos[optionPos.length - 1] + pen.optionHeight; | ||
pen.checkboxHeight = height; | ||
@@ -59,0 +59,0 @@ if (!pen.width) { |
import { formPen } from './common'; | ||
export declare function radio(ctx: CanvasRenderingContext2D, pen: formPen): void; |
import { getTextLength, initOptions } from './common'; | ||
import { getTextColor, getFont } from '../../core'; | ||
import { pSBC } from '../../core'; | ||
import { getTextColor, getFont } from '@meta2d/core'; | ||
import { pSBC } from '@meta2d/core'; | ||
export function radio(ctx, pen) { | ||
@@ -17,15 +17,15 @@ if (!pen.options) { | ||
} | ||
var x = pen.calculative.worldRect.x; | ||
var y = pen.calculative.worldRect.y; | ||
var h = pen.calculative.worldRect.height; | ||
var w = pen.calculative.worldRect.width; | ||
let x = pen.calculative.worldRect.x; | ||
let y = pen.calculative.worldRect.y; | ||
let h = pen.calculative.worldRect.height; | ||
let w = pen.calculative.worldRect.width; | ||
if (!pen.optionPos) { | ||
return; | ||
} | ||
var _a = pen.calculative, fontStyle = _a.fontStyle, fontWeight = _a.fontWeight, fontSize = _a.fontSize, fontFamily = _a.fontFamily, lineHeight = _a.lineHeight; | ||
const { fontStyle, fontWeight, fontSize, fontFamily, lineHeight } = pen.calculative; | ||
if (pen.direction == 'horizontal') { | ||
// const optionHeight = (pen.optionHeight * h) / pen.checkboxHeight; | ||
for (var i = 0; i < pen.optionPos.length; i++) { | ||
var gap = (pen.optionPos[i] * w) / pen.checkboxWidth; | ||
var isForbidden = pen.options[i].isForbidden || pen.disabled; | ||
for (let i = 0; i < pen.optionPos.length; i++) { | ||
const gap = (pen.optionPos[i] * w) / pen.checkboxWidth; | ||
const isForbidden = pen.options[i].isForbidden || pen.disabled; | ||
ctx.beginPath(); | ||
@@ -77,11 +77,11 @@ ctx.arc(x + gap + h / 2, y + h / 2, h / 2, 0, Math.PI * 2); | ||
: getTextColor(pen, pen.calculative.canvas.parent.store) || '#000000d9'; | ||
var textScale = (pen.calculative.worldRect.height * 14) / 16; | ||
const textScale = (pen.calculative.worldRect.height * 14) / 16; | ||
ctx.textAlign = 'start'; | ||
ctx.textBaseline = 'middle'; | ||
ctx.font = getFont({ | ||
fontStyle: fontStyle, | ||
fontWeight: fontWeight, | ||
fontStyle, | ||
fontWeight, | ||
fontFamily: fontFamily || pen.calculative.canvas.parent.store.options.fontFamily, | ||
fontSize: textScale, | ||
lineHeight: lineHeight, | ||
lineHeight, | ||
}); | ||
@@ -93,6 +93,6 @@ ctx.fillText(pen.options[i].text, x + h + gap + (10 / pen.checkboxWidth) * w, y + h / 2); | ||
else if (pen.direction == 'vertical') { | ||
var optionHeight = (pen.optionHeight * h) / pen.checkboxHeight; | ||
for (var i = 0; i < pen.optionPos.length; i++) { | ||
var gap = (pen.optionPos[i] * h) / pen.checkboxHeight; | ||
var isForbidden = pen.options[i].isForbidden; | ||
const optionHeight = (pen.optionHeight * h) / pen.checkboxHeight; | ||
for (let i = 0; i < pen.optionPos.length; i++) { | ||
const gap = (pen.optionPos[i] * h) / pen.checkboxHeight; | ||
const isForbidden = pen.options[i].isForbidden; | ||
ctx.beginPath(); | ||
@@ -133,3 +133,3 @@ ctx.arc(x + optionHeight / 2, y + optionHeight / 2 + gap, optionHeight / 2, 0, Math.PI * 2); | ||
: getTextColor(pen, pen.calculative.canvas.parent.store) || '#000000d9'; | ||
var textScale = (14 * pen.calculative.worldRect.height) / pen.checkboxHeight; | ||
const textScale = (14 * pen.calculative.worldRect.height) / pen.checkboxHeight; | ||
ctx.textAlign = 'start'; | ||
@@ -146,7 +146,7 @@ ctx.textBaseline = 'middle'; | ||
ctx.font = getFont({ | ||
fontStyle: fontStyle, | ||
fontWeight: fontWeight, | ||
fontStyle, | ||
fontWeight, | ||
fontFamily: fontFamily || pen.calculative.canvas.parent.store.options.fontFamily, | ||
fontSize: textScale, | ||
lineHeight: lineHeight, | ||
lineHeight, | ||
}); | ||
@@ -164,3 +164,3 @@ ctx.fillText(pen.options[i].text, x + optionHeight + 10, y + optionHeight / 2 + gap); | ||
// let checkedIndex = -1; | ||
for (var i = 0; i < pen.optionPos.length; i++) { | ||
for (let i = 0; i < pen.optionPos.length; i++) { | ||
if (!pen.options[i].isForbidden && | ||
@@ -192,5 +192,5 @@ e.x > | ||
else if (pen.direction == 'vertical') { | ||
var scaleY = pen.calculative.worldRect.height / pen.checkboxHeight; | ||
const scaleY = pen.calculative.worldRect.height / pen.checkboxHeight; | ||
// let checkedIndex = -1; | ||
for (var i = 0; i < pen.optionPos.length; i++) { | ||
for (let i = 0; i < pen.optionPos.length; i++) { | ||
if (!pen.options[i].isForbidden && | ||
@@ -197,0 +197,0 @@ e.y > pen.calculative.worldRect.y + pen.optionPos[i] * scaleY && |
@@ -0,0 +0,0 @@ import { le5leSwitch } from './switch'; |
@@ -9,6 +9,6 @@ import { le5leSwitch } from './switch'; | ||
return { | ||
radio: radio, | ||
radio, | ||
switch: le5leSwitch, | ||
slider: slider, | ||
checkbox: checkbox, | ||
slider, | ||
checkbox, | ||
table: table2, | ||
@@ -20,5 +20,5 @@ table2: table2, | ||
return { | ||
time: time, | ||
time, | ||
}; | ||
} | ||
//# sourceMappingURL=register.js.map |
import { formPen } from './common'; | ||
export declare function slider(ctx: CanvasRenderingContext2D, pen: formPen): void; |
@@ -1,3 +0,2 @@ | ||
import { calcRightBottom, calcTextRect } from '@meta2d/core'; | ||
import { pSBC } from '../../core'; | ||
import { pSBC, calcRightBottom, calcTextRect } from '@meta2d/core'; | ||
export function slider(ctx, pen) { | ||
@@ -17,7 +16,7 @@ if (!pen.onAdd) { | ||
} | ||
var data = pen.calculative.canvas.store.data; | ||
var options = pen.calculative.canvas.store.options; | ||
const data = pen.calculative.canvas.store.data; | ||
const options = pen.calculative.canvas.store.options; | ||
// calcBallRect(pen); | ||
// draw bar | ||
var background = pen.background; | ||
let background = pen.background; | ||
if (pen.disabled) { | ||
@@ -28,7 +27,7 @@ background = pen.disabledBackground || pSBC(0.6, background); | ||
ctx.beginPath(); | ||
var x = pen.calculative.worldRect.x + pen.calculative.barRect.x; | ||
var y = pen.calculative.worldRect.y + pen.calculative.barRect.y; | ||
var w = pen.calculative.barRect.width; | ||
var h = pen.calculative.barRect.height; | ||
var r = h / 2; | ||
let x = pen.calculative.worldRect.x + pen.calculative.barRect.x; | ||
let y = pen.calculative.worldRect.y + pen.calculative.barRect.y; | ||
let w = pen.calculative.barRect.width; | ||
let h = pen.calculative.barRect.height; | ||
let r = h / 2; | ||
ctx.moveTo(x + r, y); | ||
@@ -42,3 +41,3 @@ ctx.arcTo(x + w, y, x + w, y + h, r); | ||
// ctx.fillStyle = pen.activeColor || data.activeColor || options.activeColor; | ||
var activeColor = pen.activeColor || options.activeColor; | ||
let activeColor = pen.activeColor || options.activeColor; | ||
if (pen.disabled) { | ||
@@ -90,7 +89,7 @@ activeColor = pen.disabledColor || pSBC(0.6, activeColor); | ||
} | ||
var scaleX = pen.calculative.worldRect.width / pen.sliderWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.sliderHeight; | ||
var textScale = Math.min(scaleX, scaleY); | ||
const scaleX = pen.calculative.worldRect.width / pen.sliderWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.sliderHeight; | ||
const textScale = Math.min(scaleX, scaleY); | ||
pen.fontSize = pen._fontSize * textScale; | ||
var barWidth = pen.calculative.worldRect.width - pen._textWidth * textScale; | ||
const barWidth = pen.calculative.worldRect.width - pen._textWidth * textScale; | ||
pen.textLeft = barWidth + 10 * textScale; | ||
@@ -108,4 +107,4 @@ pen.calculative.textLeft = pen.textLeft; | ||
function calcBallRect(pen) { | ||
var height = pen.calculative.barRect.height * 3.5; | ||
var progress = (pen.calculative.barRect.width * pen.value) / 100; | ||
const height = pen.calculative.barRect.height * 3.5; | ||
const progress = (pen.calculative.barRect.width * pen.value) / 100; | ||
pen.calculative.ballRect = { | ||
@@ -115,3 +114,3 @@ x: progress, | ||
width: height, | ||
height: height, | ||
height, | ||
}; | ||
@@ -126,7 +125,7 @@ calcRightBottom(pen.calculative.ballRect); | ||
} | ||
var pos = e.x - pen.calculative.worldRect.x; | ||
const pos = e.x - pen.calculative.worldRect.x; | ||
if (pos > pen.calculative.barRect.width) { | ||
return; | ||
} | ||
var value = Math.round((pos / pen.calculative.barRect.width) * 100); | ||
let value = Math.round((pos / pen.calculative.barRect.width) * 100); | ||
if (value < pen.min || value > pen.max) { | ||
@@ -133,0 +132,0 @@ return; |
import { formPen } from './common'; | ||
export declare function le5leSwitch(ctx: CanvasRenderingContext2D, pen: formPen): void; |
@@ -1,2 +0,2 @@ | ||
import { pSBC } from '../../core'; | ||
import { pSBC } from '@meta2d/core'; | ||
export function le5leSwitch(ctx, pen) { | ||
@@ -6,6 +6,6 @@ if (!pen.onClick) { | ||
} | ||
var x = pen.calculative.worldRect.x; | ||
var y = pen.calculative.worldRect.y; | ||
var w = pen.calculative.worldRect.width; | ||
var h = pen.calculative.worldRect.height; | ||
let x = pen.calculative.worldRect.x; | ||
let y = pen.calculative.worldRect.y; | ||
let w = pen.calculative.worldRect.width; | ||
let h = pen.calculative.worldRect.height; | ||
if (w < h * 1.5) { | ||
@@ -12,0 +12,0 @@ w = 1.5 * h; |
import { formPen } from './common'; | ||
export declare function table(ctx: CanvasRenderingContext2D, pen: formPen): void; |
244
src/table.js
@@ -1,12 +0,1 @@ | ||
var __values = (this && this.__values) || function(o) { | ||
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; | ||
if (m) return m.call(o); | ||
if (o && typeof o.length === "number") return { | ||
next: function () { | ||
if (o && i >= o.length) o = void 0; | ||
return { value: o && o[i++], done: !o }; | ||
} | ||
}; | ||
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); | ||
}; | ||
import { calcRightBottom, calcTextLines } from '@meta2d/core'; | ||
@@ -24,4 +13,4 @@ export function table(ctx, pen) { | ||
} | ||
var data = pen.calculative.canvas.store.data; | ||
var options = pen.calculative.canvas.store.options; | ||
const data = pen.calculative.canvas.store.data; | ||
const options = pen.calculative.canvas.store.options; | ||
pen.color = pen.color || data.color || options.color; | ||
@@ -38,5 +27,4 @@ pen.activeColor = pen.activeColor || options.activeColor; | ||
function initRect(pen) { | ||
var e_1, _a, e_2, _b; | ||
var colPos = []; | ||
var rowPos = []; | ||
const colPos = []; | ||
const rowPos = []; | ||
if (!pen.table.rowHeight) { | ||
@@ -48,18 +36,8 @@ pen.table.rowHeight = 40; | ||
} | ||
var width = 0; | ||
try { | ||
for (var _c = __values(pen.table.header.data), _d = _c.next(); !_d.done; _d = _c.next()) { | ||
var item = _d.value; | ||
width += item.width || pen.table.colWidth; | ||
colPos.push(width); | ||
} | ||
let width = 0; | ||
for (const item of pen.table.header.data) { | ||
width += item.width || pen.table.colWidth; | ||
colPos.push(width); | ||
} | ||
catch (e_1_1) { e_1 = { error: e_1_1 }; } | ||
finally { | ||
try { | ||
if (_d && !_d.done && (_a = _c.return)) _a.call(_c); | ||
} | ||
finally { if (e_1) throw e_1.error; } | ||
} | ||
var height = 0; | ||
let height = 0; | ||
// 显示表头 | ||
@@ -70,16 +48,6 @@ if (pen.table.header.show != false) { | ||
} | ||
try { | ||
for (var _e = __values(pen.table.data), _f = _e.next(); !_f.done; _f = _e.next()) { | ||
var item = _f.value; | ||
height += item.height || pen.table.rowHeight; | ||
rowPos.push(height); | ||
} | ||
for (const item of pen.table.data) { | ||
height += item.height || pen.table.rowHeight; | ||
rowPos.push(height); | ||
} | ||
catch (e_2_1) { e_2 = { error: e_2_1 }; } | ||
finally { | ||
try { | ||
if (_f && !_f.done && (_b = _e.return)) _b.call(_e); | ||
} | ||
finally { if (e_2) throw e_2.error; } | ||
} | ||
pen.colPos = colPos; | ||
@@ -104,7 +72,6 @@ pen.rowPos = rowPos; | ||
function drawGridLine(ctx, pen) { | ||
var e_3, _a; | ||
if (!pen.colPos) { | ||
return; | ||
} | ||
var worldRect = pen.calculative.worldRect; | ||
const worldRect = pen.calculative.worldRect; | ||
ctx.save(); | ||
@@ -121,30 +88,20 @@ ctx.strokeStyle = pen.color; | ||
// 绘画行的线 | ||
var last = pen.rowPos[pen.rowPos.length - 1]; | ||
try { | ||
for (var _b = __values(pen.rowPos), _c = _b.next(); !_c.done; _c = _b.next()) { | ||
var item = _c.value; | ||
if (item === last) { | ||
continue; | ||
} | ||
var y = (item * pen.calculative.worldRect.height) / pen.tableHeight; | ||
ctx.beginPath(); | ||
ctx.moveTo(pen.calculative.worldRect.x, pen.calculative.worldRect.y + y); | ||
ctx.lineTo(pen.calculative.worldRect.ex, pen.calculative.worldRect.y + y); | ||
ctx.stroke(); | ||
let last = pen.rowPos[pen.rowPos.length - 1]; | ||
for (const item of pen.rowPos) { | ||
if (item === last) { | ||
continue; | ||
} | ||
const y = (item * pen.calculative.worldRect.height) / pen.tableHeight; | ||
ctx.beginPath(); | ||
ctx.moveTo(pen.calculative.worldRect.x, pen.calculative.worldRect.y + y); | ||
ctx.lineTo(pen.calculative.worldRect.ex, pen.calculative.worldRect.y + y); | ||
ctx.stroke(); | ||
} | ||
catch (e_3_1) { e_3 = { error: e_3_1 }; } | ||
finally { | ||
try { | ||
if (_c && !_c.done && (_a = _b.return)) _a.call(_b); | ||
} | ||
finally { if (e_3) throw e_3.error; } | ||
} | ||
// 绘画列的线 | ||
last = pen.colPos[pen.colPos.length - 1]; | ||
pen.colPos.forEach(function (item, i) { | ||
pen.colPos.forEach((item, i) => { | ||
if (item === last) { | ||
return; | ||
} | ||
var x = (item * pen.calculative.worldRect.width) / pen.tableWidth; | ||
const x = (item * pen.calculative.worldRect.width) / pen.tableWidth; | ||
ctx.beginPath(); | ||
@@ -158,3 +115,2 @@ ctx.moveTo(pen.calculative.worldRect.x + x, pen.calculative.worldRect.y); | ||
function drawCell(ctx, pen) { | ||
var _a, _b, _c, _d; | ||
if (!pen.colPos) { | ||
@@ -170,12 +126,12 @@ return; | ||
// ); | ||
var textScale = 1; | ||
for (var i = 0; i < pen.rowPos.length; i++) { | ||
var _loop_1 = function (j) { | ||
var cell = getCell(pen, i, j); | ||
var color = cell.color || pen.color; | ||
var background = cell.background; | ||
var activeColor = void 0; | ||
const textScale = 1; | ||
for (let i = 0; i < pen.rowPos.length; i++) { | ||
for (let j = 0; j < pen.colPos.length; j++) { | ||
let cell = getCell(pen, i, j); | ||
let color = cell.color || pen.color; | ||
let background = cell.background; | ||
let activeColor; | ||
// 选中 | ||
if (((_a = pen.calculative.activeCell) === null || _a === void 0 ? void 0 : _a.row) === i && | ||
((_b = pen.calculative.activeCell) === null || _b === void 0 ? void 0 : _b.col) === j) { | ||
if (pen.calculative.activeCell?.row === i && | ||
pen.calculative.activeCell?.col === j) { | ||
color = pen.activeColor; | ||
@@ -186,4 +142,4 @@ background = pen.activeBackground; | ||
// hover | ||
if (((_c = pen.calculative.hoverCell) === null || _c === void 0 ? void 0 : _c.row) === i && | ||
((_d = pen.calculative.hoverCell) === null || _d === void 0 ? void 0 : _d.col) === j) { | ||
if (pen.calculative.hoverCell?.row === i && | ||
pen.calculative.hoverCell?.col === j) { | ||
color = pen.hoverColor; | ||
@@ -193,3 +149,3 @@ background = pen.hoverBackground; | ||
} | ||
var rect = getCellRect(pen, i, j); | ||
const rect = getCellRect(pen, i, j); | ||
// 有背景 | ||
@@ -211,3 +167,3 @@ if (background) { | ||
pen.calculative.worldTextRect = rect; | ||
var rowText = pen.calculative.texts[i]; | ||
let rowText = pen.calculative.texts[i]; | ||
if (!pen.calculative.texts[i]) { | ||
@@ -225,3 +181,3 @@ rowText = []; | ||
} | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -232,3 +188,3 @@ else { | ||
if (!rowText[j]) { | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -239,3 +195,3 @@ // 计算换行和省略号 | ||
if (!rowText[j]) { | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -258,14 +214,11 @@ ctx.save(); | ||
else { | ||
var y_1 = 0.55; | ||
var lineHeight_1 = pen.calculative.fontSize * pen.calculative.lineHeight * textScale; | ||
var h = rowText[j].length * lineHeight_1; | ||
var top_1 = (rect.height - h) / 2; | ||
rowText[j].forEach(function (text, i) { | ||
ctx.fillText(text, rect.x + rect.width / 2, rect.y + top_1 + (i + y_1) * lineHeight_1); | ||
const y = 0.55; | ||
const lineHeight = pen.calculative.fontSize * pen.calculative.lineHeight * textScale; | ||
const h = rowText[j].length * lineHeight; | ||
let top = (rect.height - h) / 2; | ||
rowText[j].forEach((text, i) => { | ||
ctx.fillText(text, rect.x + rect.width / 2, rect.y + top + (i + y) * lineHeight); | ||
}); | ||
} | ||
ctx.restore(); | ||
}; | ||
for (var j = 0; j < pen.colPos.length; j++) { | ||
_loop_1(j); | ||
} | ||
@@ -283,3 +236,3 @@ } | ||
} | ||
var cell = getCell(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
const cell = getCell(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
// 子节点,非文本 | ||
@@ -290,3 +243,3 @@ if (Array.isArray(cell)) { | ||
pen.calculative.inputCell = pen.calculative.hoverCell; | ||
var rect = getCellRect(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
const rect = getCellRect(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
pen.calculative.tempText = cell.text || cell + ''; | ||
@@ -317,6 +270,6 @@ pen.calculative.canvas.showInput(pen, rect, '#ffffff'); | ||
function getCellIndex(pen, e) { | ||
var scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
var pos = { row: 0, col: 0 }; | ||
for (var i = 0; i < pen.colPos.length; i++) { | ||
const scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
const pos = { row: 0, col: 0 }; | ||
for (let i = 0; i < pen.colPos.length; i++) { | ||
if (e.x > pen.calculative.worldRect.x + pen.colPos[i] * scaleX) { | ||
@@ -326,3 +279,3 @@ pos.col = i + 1; | ||
} | ||
for (var i = 0; i < pen.rowPos.length; i++) { | ||
for (let i = 0; i < pen.rowPos.length; i++) { | ||
if (e.y > pen.calculative.worldRect.y + pen.rowPos[i] * scaleY) { | ||
@@ -340,18 +293,18 @@ pos.row = i + 1; | ||
if (pen.table.header.show == false) { | ||
var row_1 = pen.table.data[rowIndex]; | ||
if (Array.isArray(row_1)) { | ||
return row_1[colIndex]; | ||
const row = pen.table.data[rowIndex]; | ||
if (Array.isArray(row)) { | ||
return row[colIndex]; | ||
} | ||
else if (!row_1.data || !Array.isArray(row_1.data)) { | ||
else if (!row.data || !Array.isArray(row.data)) { | ||
return; | ||
} | ||
return row_1.data[colIndex]; | ||
return row.data[colIndex]; | ||
} | ||
// 显示表头 | ||
if (rowIndex === 0) { | ||
var cell = pen.table.header.data[colIndex]; | ||
const cell = pen.table.header.data[colIndex]; | ||
cell.fontWeight = pen.table.header.fontWeight; | ||
return cell; | ||
} | ||
var row = pen.table.data[rowIndex - 1]; | ||
const row = pen.table.data[rowIndex - 1]; | ||
if (!row) { | ||
@@ -375,3 +328,3 @@ return; | ||
pen.calculative.texts = undefined; | ||
var rowData; | ||
let rowData; | ||
// 没有表头 | ||
@@ -417,11 +370,11 @@ if (pen.table.header.show == false) { | ||
function getCellRect(pen, rowIndex, colIndex) { | ||
var scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
var x = 0; | ||
var ex = pen.colPos[colIndex] * scaleX; | ||
const scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
let x = 0; | ||
let ex = pen.colPos[colIndex] * scaleX; | ||
if (colIndex > 0) { | ||
x = pen.colPos[colIndex - 1] * scaleX; | ||
} | ||
var y = 0; | ||
var ey = pen.rowPos[rowIndex] * scaleY; | ||
let y = 0; | ||
let ey = pen.rowPos[rowIndex] * scaleY; | ||
if (rowIndex > 0) { | ||
@@ -441,51 +394,30 @@ y = pen.rowPos[rowIndex - 1] * scaleY; | ||
function calcChildrenRect(pen, rect, children) { | ||
var e_4, _a, e_5, _b; | ||
var scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
const scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
// 计算子节点需要的宽高 | ||
var height = 0; | ||
var lastX = 0; | ||
var lastY = 0; | ||
try { | ||
for (var children_1 = __values(children), children_1_1 = children_1.next(); !children_1_1.done; children_1_1 = children_1.next()) { | ||
var item = children_1_1.value; | ||
if (lastX + item.width * scaleX + 20 * scaleX < rect.width) { | ||
item.x = rect.x + lastX + 10 * scaleX; | ||
item.y = rect.y + lastY + 10 * scaleY; | ||
lastX += (item.width + 10) * scaleX; | ||
height = Math.max(height, lastY + (item.height + 10) * scaleY); | ||
} | ||
else { | ||
// 超出需要换行 | ||
lastX = 0; | ||
lastY = height; | ||
item.x = rect.x + lastX + 10 * scaleX; | ||
item.y = rect.y + lastY + 10 * scaleY; | ||
height += (item.height + 10) * scaleY; | ||
} | ||
let height = 0; | ||
let lastX = 0; | ||
let lastY = 0; | ||
for (const item of children) { | ||
if (lastX + item.width * scaleX + 20 * scaleX < rect.width) { | ||
item.x = rect.x + lastX + 10 * scaleX; | ||
item.y = rect.y + lastY + 10 * scaleY; | ||
lastX += (item.width + 10) * scaleX; | ||
height = Math.max(height, lastY + (item.height + 10) * scaleY); | ||
} | ||
} | ||
catch (e_4_1) { e_4 = { error: e_4_1 }; } | ||
finally { | ||
try { | ||
if (children_1_1 && !children_1_1.done && (_a = children_1.return)) _a.call(children_1); | ||
else { | ||
// 超出需要换行 | ||
lastX = 0; | ||
lastY = height; | ||
item.x = rect.x + lastX + 10 * scaleX; | ||
item.y = rect.y + lastY + 10 * scaleY; | ||
height += (item.height + 10) * scaleY; | ||
} | ||
finally { if (e_4) throw e_4.error; } | ||
} | ||
// 垂直居中 | ||
if (height + 20 * scaleY < rect.height) { | ||
var top_2 = (rect.height - height - 10 * scaleY) / 2; | ||
try { | ||
for (var children_2 = __values(children), children_2_1 = children_2.next(); !children_2_1.done; children_2_1 = children_2.next()) { | ||
var item = children_2_1.value; | ||
item.y += top_2; | ||
} | ||
const top = (rect.height - height - 10 * scaleY) / 2; | ||
for (const item of children) { | ||
item.y += top; | ||
} | ||
catch (e_5_1) { e_5 = { error: e_5_1 }; } | ||
finally { | ||
try { | ||
if (children_2_1 && !children_2_1.done && (_b = children_2.return)) _b.call(children_2); | ||
} | ||
finally { if (e_5) throw e_5.error; } | ||
} | ||
} | ||
@@ -492,0 +424,0 @@ } |
import { formPen } from './common'; | ||
export declare function table2(ctx: CanvasRenderingContext2D, pen: formPen): void; |
@@ -1,14 +0,3 @@ | ||
var __values = (this && this.__values) || function(o) { | ||
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; | ||
if (m) return m.call(o); | ||
if (o && typeof o.length === "number") return { | ||
next: function () { | ||
if (o && i >= o.length) o = void 0; | ||
return { value: o && o[i++], done: !o }; | ||
} | ||
}; | ||
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); | ||
}; | ||
import { ReplaceMode } from './common'; | ||
import { calcRightBottom, calcTextLines, deepClone } from '../../core'; | ||
import { calcRightBottom, calcTextLines, deepClone } from '@meta2d/core'; | ||
export function table2(ctx, pen) { | ||
@@ -41,4 +30,4 @@ if (!pen.onAdd) { | ||
} | ||
var data = pen.calculative.canvas.store.data; | ||
var options = pen.calculative.canvas.store.options; | ||
const data = pen.calculative.canvas.store.data; | ||
const options = pen.calculative.canvas.store.options; | ||
pen.color = pen.color || data.color || options.color; | ||
@@ -54,3 +43,3 @@ pen.textColor = | ||
ctx.beginPath(); | ||
var _a = pen.calculative.worldRect, x = _a.x, y = _a.y, width = _a.width, height = _a.height; | ||
const { x, y, width, height } = pen.calculative.worldRect; | ||
ctx.fillStyle = '#fff0'; | ||
@@ -83,4 +72,4 @@ ctx.rect(x - 1, y - 1, width + 2, height + 2); | ||
} | ||
var rect = pen.calculative.worldRect; | ||
var mousePos = pen.calculative.canvas.mousePos; | ||
let rect = pen.calculative.worldRect; | ||
let mousePos = pen.calculative.canvas.mousePos; | ||
if (!(mousePos.x > rect.x && | ||
@@ -95,8 +84,8 @@ mousePos.x < rect.x + rect.width && | ||
} | ||
var _a = pen.calculative.hoverCell, row = _a.row, col = _a.col; | ||
var _b = pen.calculative.canvas.mousePos, x = _b.x, y = _b.y; | ||
const { row, col } = pen.calculative.hoverCell; | ||
const { x, y } = pen.calculative.canvas.mousePos; | ||
if (!pen.data[row]) { | ||
return; | ||
} | ||
var text = pen.data[row][col]; | ||
let text = pen.data[row][col]; | ||
if (typeof text === 'object' || !text) { | ||
@@ -117,3 +106,3 @@ return; | ||
pen.calculative.fontFamily; | ||
var noteWidth = ctx.measureText(text).width; | ||
const noteWidth = ctx.measureText(text).width; | ||
ctx.beginPath(); | ||
@@ -132,5 +121,5 @@ ctx.fillStyle = '#fff'; | ||
function initRect(pen) { | ||
var colPos = []; | ||
var rowPos = []; | ||
var colStyle = {}; | ||
const colPos = []; | ||
const rowPos = []; | ||
const colStyle = {}; | ||
if (!pen.rowHeight) { | ||
@@ -142,14 +131,14 @@ pen.rowHeight = 40; | ||
} | ||
var width = 0; | ||
let width = 0; | ||
//获取所有col width | ||
var _col = pen.styles && | ||
pen.styles.filter(function (item) { | ||
const _col = pen.styles && | ||
pen.styles.filter((item) => { | ||
return item.col !== undefined && item.row === undefined && item.width; | ||
}); | ||
var _colWidthMap = {}; | ||
let _colWidthMap = {}; | ||
_col && | ||
_col.forEach(function (_c) { | ||
_col.forEach((_c) => { | ||
_colWidthMap[_c.col] = _c.width; | ||
}); | ||
var _loop_1 = function (i) { | ||
for (let i = 0; i < pen.data[0].length; i++) { | ||
width += | ||
@@ -159,4 +148,4 @@ (_colWidthMap[i] || pen.colWidth) * | ||
colPos.push(width); | ||
var style = pen.styles && | ||
pen.styles.filter(function (item) { | ||
let style = pen.styles && | ||
pen.styles.filter((item) => { | ||
return item.col === i && item.row === undefined; | ||
@@ -167,20 +156,17 @@ }); | ||
} | ||
}; | ||
for (var i = 0; i < pen.data[0].length; i++) { | ||
_loop_1(i); | ||
} | ||
var height = 0; | ||
let height = 0; | ||
//获取所有row height | ||
var _row = pen.styles && | ||
pen.styles.filter(function (item) { | ||
const _row = pen.styles && | ||
pen.styles.filter((item) => { | ||
return item.col === undefined && item.row !== undefined && item.height; | ||
}); | ||
var _rowHeightMap = {}; | ||
let _rowHeightMap = {}; | ||
_row && | ||
_row.forEach(function (_r) { | ||
_row.forEach((_r) => { | ||
_rowHeightMap[_r.row] = _r.height; | ||
}); | ||
// 显示表头 | ||
var finalHight = height; | ||
for (var j = 0; j < pen.data.length; j++) { | ||
let finalHight = height; | ||
for (let j = 0; j < pen.data.length; j++) { | ||
height += | ||
@@ -216,6 +202,6 @@ (_rowHeightMap[j] || pen.rowHeight) * | ||
} | ||
var x = pen.x; | ||
var y = pen.y; | ||
let x = pen.x; | ||
let y = pen.y; | ||
if (pen.parentId) { | ||
var parentPen = pen.calculative.canvas.store.pens[pen.parentId]; | ||
let parentPen = pen.calculative.canvas.store.pens[pen.parentId]; | ||
x = | ||
@@ -229,4 +215,4 @@ parentPen.calculative.worldRect.x + | ||
pen.calculative.worldRect = { | ||
x: x, | ||
y: y, | ||
x, | ||
y, | ||
height: pen.calculative.height, | ||
@@ -251,3 +237,2 @@ width: pen.calculative.width, | ||
function drawGridLine(ctx, pen) { | ||
var e_1, _a; | ||
if (!pen.colPos) { | ||
@@ -257,3 +242,3 @@ return; | ||
// const worldRect = pen.calculative.worldRect; | ||
var _b = pen.calculative.worldRect, x = _b.x, y = _b.y, width = _b.width, height = _b.height, ex = _b.ex, ey = _b.ey; | ||
const { x, y, width, height, ex, ey } = pen.calculative.worldRect; | ||
ctx.save(); | ||
@@ -265,3 +250,3 @@ ctx.beginPath(); | ||
// ctx.rect(worldRect.x, worldRect.y, worldRect.width, worldRect.height); | ||
var wr = pen.calculative.borderRadius || 0, hr = wr; | ||
let wr = pen.calculative.borderRadius || 0, hr = wr; | ||
if (wr < 1) { | ||
@@ -271,3 +256,3 @@ wr = width * wr; | ||
} | ||
var r = wr < hr ? wr : hr; | ||
let r = wr < hr ? wr : hr; | ||
if (width < 2 * r) { | ||
@@ -294,3 +279,3 @@ r = width / 2; | ||
// 绘画行的线 | ||
var last = pen.rowPos[pen.rowPos.length - 1]; | ||
let last = pen.rowPos[pen.rowPos.length - 1]; | ||
if (pen.hasHeader) { | ||
@@ -305,43 +290,33 @@ ctx.beginPath(); | ||
} | ||
try { | ||
for (var _d = __values(pen.rowPos), _e = _d.next(); !_e.done; _e = _d.next()) { | ||
var item = _e.value; | ||
if (item === last) { | ||
for (const item of pen.rowPos) { | ||
if (item === last) { | ||
continue; | ||
} | ||
const y = (item * pen.calculative.worldRect.height) / pen.tableHeight - | ||
pen.offsetY * pen.calculative.canvas.store.data.scale; | ||
if (pen.hasHeader) { | ||
if (y < 0 + pen.rowPos[0] || y > pen.calculative.worldRect.height) { | ||
continue; | ||
} | ||
var y_1 = (item * pen.calculative.worldRect.height) / pen.tableHeight - | ||
pen.offsetY * pen.calculative.canvas.store.data.scale; | ||
if (pen.hasHeader) { | ||
if (y_1 < 0 + pen.rowPos[0] || y_1 > pen.calculative.worldRect.height) { | ||
continue; | ||
} | ||
} | ||
else { | ||
if (y < 0 || y > pen.calculative.worldRect.height) { | ||
continue; | ||
} | ||
else { | ||
if (y_1 < 0 || y_1 > pen.calculative.worldRect.height) { | ||
continue; | ||
} | ||
} | ||
ctx.beginPath(); | ||
ctx.moveTo(pen.calculative.worldRect.x, pen.calculative.worldRect.y + y_1); | ||
ctx.lineTo(pen.calculative.worldRect.ex, pen.calculative.worldRect.y + y_1); | ||
ctx.strokeStyle = pen.borderColor || '#424B61'; | ||
ctx.stroke(); | ||
} | ||
ctx.beginPath(); | ||
ctx.moveTo(pen.calculative.worldRect.x, pen.calculative.worldRect.y + y); | ||
ctx.lineTo(pen.calculative.worldRect.ex, pen.calculative.worldRect.y + y); | ||
ctx.strokeStyle = pen.borderColor || '#424B61'; | ||
ctx.stroke(); | ||
} | ||
catch (e_1_1) { e_1 = { error: e_1_1 }; } | ||
finally { | ||
try { | ||
if (_e && !_e.done && (_a = _d.return)) _a.call(_d); | ||
} | ||
finally { if (e_1) throw e_1.error; } | ||
} | ||
} | ||
if (pen.vLine !== false) { | ||
// 绘画列的线 | ||
var last_1 = pen.colPos[pen.colPos.length - 1]; | ||
pen.colPos.forEach(function (item, i) { | ||
if (item === last_1) { | ||
let last = pen.colPos[pen.colPos.length - 1]; | ||
pen.colPos.forEach((item, i) => { | ||
if (item === last) { | ||
return; | ||
} | ||
var x = (item * pen.calculative.worldRect.width) / pen.tableWidth; | ||
const x = (item * pen.calculative.worldRect.width) / pen.tableWidth; | ||
ctx.beginPath(); | ||
@@ -357,3 +332,2 @@ ctx.moveTo(pen.calculative.worldRect.x + x, pen.calculative.worldRect.y); | ||
function drawCell(ctx, pen) { | ||
var _a, _b, _d, _e, _f; | ||
if (!pen.colPos) { | ||
@@ -365,8 +339,8 @@ return; | ||
} | ||
var textScale = 1; | ||
var _loop_2 = function (i) { | ||
const textScale = 1; | ||
for (let i = 0; i < pen.rowPos.length; i++) { | ||
if (pen.hasHeader && i === 1) { | ||
ctx.save(); | ||
ctx.beginPath(); | ||
var _g = pen.calculative.worldRect, x = _g.x, y = _g.y, width = _g.width, height = _g.height; | ||
const { x, y, width, height } = pen.calculative.worldRect; | ||
ctx.fillStyle = '#fff0'; | ||
@@ -379,21 +353,21 @@ ctx.rect(x - 1, y + | ||
} | ||
var rowStyle = getRow(pen, i).style; | ||
var _loop_3 = function (j) { | ||
var _h = getCell(pen, i, j), cell = _h.value, cellStyle = _h.style; | ||
var isSuccess = true; | ||
let { style: rowStyle } = getRow(pen, i); | ||
for (let j = 0; j < pen.colPos.length; j++) { | ||
let { value: cell, style: cellStyle } = getCell(pen, i, j); | ||
let isSuccess = true; | ||
//样式条件成立 | ||
if (Array.isArray(cellStyle) && cellStyle.length > 0) { | ||
var successIdx_1 = 0; | ||
cellStyle.forEach(function (item, idx) { | ||
let successIdx = 0; | ||
cellStyle.forEach((item, idx) => { | ||
if (item.wheres) { | ||
var success = item.wheres.every(function (where) { | ||
var fn = new Function('attr', "return attr " + where.comparison + " " + where.value); | ||
let success = item.wheres.every((where) => { | ||
const fn = new Function('attr', `return attr ${where.comparison} ${where.value}`); | ||
return fn(cell); | ||
}); | ||
if (success) { | ||
successIdx_1 = idx; | ||
successIdx = idx; | ||
} | ||
} | ||
}); | ||
cellStyle = cellStyle[successIdx_1]; | ||
cellStyle = cellStyle[successIdx]; | ||
} | ||
@@ -405,3 +379,3 @@ else { | ||
isSuccess = cellStyle.wheres.every(function (where) { | ||
var fn = new Function('attr', "return attr " + where.comparison + " " + where.value); | ||
const fn = new Function('attr', `return attr ${where.comparison} ${where.value}`); | ||
return fn(cell); | ||
@@ -411,8 +385,8 @@ }); | ||
} | ||
var color = pen.color; | ||
var textColor = pen.textColor || pen.color; | ||
var background = null; | ||
var fontSize = null; | ||
var fontWeight = null; | ||
var fontStyle = null; | ||
let color = pen.color; | ||
let textColor = pen.textColor || pen.color; | ||
let background = null; | ||
let fontSize = null; | ||
let fontWeight = null; | ||
let fontStyle = null; | ||
if (isSuccess) { | ||
@@ -434,3 +408,3 @@ color = | ||
} | ||
var activeColor = void 0; | ||
let activeColor; | ||
if (pen.stripe) { | ||
@@ -450,4 +424,4 @@ if (pen.hasHeader !== false) { | ||
if (pen.calculative.active && | ||
((_a = pen.calculative.activeCell) === null || _a === void 0 ? void 0 : _a.row) === i && | ||
((_b = pen.calculative.activeCell) === null || _b === void 0 ? void 0 : _b.col) === j) { | ||
pen.calculative.activeCell?.row === i && | ||
pen.calculative.activeCell?.col === j) { | ||
color = pen.activeColor; | ||
@@ -460,4 +434,4 @@ background = pen.activeBackground; | ||
if (pen.calculative.hover && | ||
((_d = pen.calculative.hoverCell) === null || _d === void 0 ? void 0 : _d.row) === i && | ||
((_e = pen.calculative.hoverCell) === null || _e === void 0 ? void 0 : _e.col) === j) { | ||
pen.calculative.hoverCell?.row === i && | ||
pen.calculative.hoverCell?.col === j) { | ||
color = pen.hoverColor; | ||
@@ -468,6 +442,6 @@ background = pen.hoverBackground; | ||
} | ||
var rect = getCellRect(pen, i, j); | ||
const rect = getCellRect(pen, i, j); | ||
if (rect.y + rect.height < pen.calculative.worldRect.y || | ||
rect.y > pen.calculative.worldRect.height + pen.calculative.worldRect.y) { | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -492,3 +466,3 @@ // 有背景 | ||
pen.calculative.worldTextRect = rect; | ||
var rowText = pen.calculative.texts[i]; | ||
let rowText = pen.calculative.texts[i]; | ||
if (!pen.calculative.texts[i]) { | ||
@@ -501,4 +475,4 @@ rowText = []; | ||
// TODO 配置 {} 代表添加节点 考虑是否有表头 | ||
var _colPen = pen.styles && | ||
pen.styles.filter(function (item) { | ||
const _colPen = pen.styles && | ||
pen.styles.filter((item) => { | ||
return item.col === j && item.row === undefined && item.pens; | ||
@@ -514,4 +488,4 @@ }); | ||
} | ||
var childrenPen = JSON.parse(JSON.stringify(_colPen[0].pens)); | ||
childrenPen.forEach(function (item) { | ||
let childrenPen = JSON.parse(JSON.stringify(_colPen[0].pens)); | ||
childrenPen.forEach((item) => { | ||
Object.assign(item, { row: i, col: j }, cell); | ||
@@ -530,3 +504,3 @@ item.activeBackground = item.background; | ||
} | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -541,3 +515,3 @@ } | ||
if (!rowText[j]) { | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -548,3 +522,3 @@ // 计算换行和省略号 | ||
if (!rowText[j]) { | ||
return "continue"; | ||
continue; | ||
} | ||
@@ -564,3 +538,3 @@ ctx.save(); | ||
pen.calculative.fontFamily; | ||
var textAlign = pen.colStyle && ((_f = pen.colStyle[j]) === null || _f === void 0 ? void 0 : _f.textAlign); | ||
let textAlign = pen.colStyle && pen.colStyle[j]?.textAlign; | ||
if (textAlign) { | ||
@@ -581,21 +555,21 @@ ctx.textAlign = textAlign; | ||
else { | ||
var y_2 = 0.55; | ||
var lineHeight_1 = (fontSize || pen.calculative.fontSize) * | ||
const y = 0.55; | ||
const lineHeight = (fontSize || pen.calculative.fontSize) * | ||
pen.calculative.lineHeight * | ||
textScale; | ||
var h = rowText[j].length * lineHeight_1; | ||
var top_1 = (rect.height - h) / 2; | ||
const h = rowText[j].length * lineHeight; | ||
let top = (rect.height - h) / 2; | ||
if (textAlign === 'left') { | ||
rowText[j].forEach(function (text, i) { | ||
ctx.fillText(text, rect.x, rect.y + top_1 + (i + y_2) * lineHeight_1); | ||
rowText[j].forEach((text, i) => { | ||
ctx.fillText(text, rect.x, rect.y + top + (i + y) * lineHeight); | ||
}); | ||
} | ||
else if (textAlign === 'right') { | ||
rowText[j].forEach(function (text, i) { | ||
ctx.fillText(text, rect.x + rect.width, rect.y + top_1 + (i + y_2) * lineHeight_1); | ||
rowText[j].forEach((text, i) => { | ||
ctx.fillText(text, rect.x + rect.width, rect.y + top + (i + y) * lineHeight); | ||
}); | ||
} | ||
else { | ||
rowText[j].forEach(function (text, i) { | ||
ctx.fillText(text, rect.x + rect.width / 2, rect.y + top_1 + (i + y_2) * lineHeight_1); | ||
rowText[j].forEach((text, i) => { | ||
ctx.fillText(text, rect.x + rect.width / 2, rect.y + top + (i + y) * lineHeight); | ||
}); | ||
@@ -605,9 +579,3 @@ } | ||
ctx.restore(); | ||
}; | ||
for (var j = 0; j < pen.colPos.length; j++) { | ||
_loop_3(j); | ||
} | ||
}; | ||
for (var i = 0; i < pen.rowPos.length; i++) { | ||
_loop_2(i); | ||
} | ||
@@ -617,5 +585,4 @@ } | ||
function onAdd(pen) { | ||
var _a; | ||
createInterval(pen); | ||
if (!((_a = pen.children) === null || _a === void 0 ? void 0 : _a.length)) { | ||
if (!pen.children?.length) { | ||
pen.isFirstTime = true; | ||
@@ -633,3 +600,3 @@ } | ||
} | ||
var cell = getCell(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col).value; | ||
const { value: cell } = getCell(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
// 子节点,非文本 | ||
@@ -643,3 +610,3 @@ if (typeof cell === 'object') { | ||
pen.calculative.inputCell = pen.calculative.hoverCell; | ||
var rect = getCellRect(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
const rect = getCellRect(pen, pen.calculative.hoverCell.row, pen.calculative.hoverCell.col); | ||
pen.calculative.tempText = cell.text || cell + ''; | ||
@@ -663,3 +630,3 @@ pen.calculative.canvas.showInput(pen, rect, '#ffffff'); | ||
} | ||
pen.timer = setTimeout(function () { | ||
pen.timer = setTimeout(() => { | ||
pen.calculative.isHover = true; | ||
@@ -683,6 +650,6 @@ pen.calculative.canvas.render(); | ||
function getCellIndex(pen, e) { | ||
var scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
var pos = { row: 0, col: 0 }; | ||
for (var i = 0; i < pen.colPos.length; i++) { | ||
const scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
const pos = { row: 0, col: 0 }; | ||
for (let i = 0; i < pen.colPos.length; i++) { | ||
if (e.x > pen.calculative.worldRect.x + pen.colPos[i] * scaleX) { | ||
@@ -692,3 +659,3 @@ pos.col = i + 1; | ||
} | ||
for (var i = 0; i < pen.rowPos.length; i++) { | ||
for (let i = 0; i < pen.rowPos.length; i++) { | ||
if (e.y > | ||
@@ -708,10 +675,10 @@ pen.calculative.worldRect.y + | ||
} | ||
var row = pen.data[rowIndex]; | ||
const row = pen.data[rowIndex]; | ||
//TODO 没有获取单独设置 某行 某列 的样式 | ||
var style = pen.styles && | ||
pen.styles.filter(function (item) { | ||
const style = pen.styles && | ||
pen.styles.filter((item) => { | ||
return item.row === rowIndex && item.col === colIndex; | ||
}); | ||
if (Array.isArray(row)) { | ||
return { value: row[colIndex], style: (style === null || style === void 0 ? void 0 : style.length) > 0 ? (style.length > 1 ? style : style[0]) : {} }; | ||
return { value: row[colIndex], style: style?.length > 0 ? (style.length > 1 ? style : style[0]) : {} }; | ||
} | ||
@@ -727,10 +694,10 @@ else if (!row.data || !Array.isArray(row.data)) { | ||
} | ||
var row = pen.data[rowIndex]; | ||
const row = pen.data[rowIndex]; | ||
//TODO 没有获取单独设置 某行 某列 的样式 | ||
var style = pen.styles && | ||
pen.styles.filter(function (item) { | ||
const style = pen.styles && | ||
pen.styles.filter((item) => { | ||
return item.row === rowIndex && !item.col; | ||
}); | ||
if (Array.isArray(row)) { | ||
return { value: row, style: (style === null || style === void 0 ? void 0 : style.length) > 0 ? style[0] : {} }; | ||
return { value: row, style: style?.length > 0 ? style[0] : {} }; | ||
} | ||
@@ -748,3 +715,3 @@ else if (!row.data || !Array.isArray(row.data)) { | ||
pen.calculative.texts = undefined; | ||
var rowData = pen.data[rowIndex]; | ||
let rowData = pen.data[rowIndex]; | ||
if (!rowData) { | ||
@@ -762,15 +729,15 @@ return; | ||
function getCellRect(pen, rowIndex, colIndex) { | ||
var scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
var x = 0; | ||
var ex = pen.colPos[colIndex] * scaleX; | ||
const scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
let x = 0; | ||
let ex = pen.colPos[colIndex] * scaleX; | ||
if (colIndex > 0) { | ||
x = pen.colPos[colIndex - 1] * scaleX; | ||
} | ||
var y = 0; | ||
var ey = pen.rowPos[rowIndex] * scaleY; | ||
let y = 0; | ||
let ey = pen.rowPos[rowIndex] * scaleY; | ||
if (rowIndex > 0) { | ||
y = pen.rowPos[rowIndex - 1] * scaleY; | ||
} | ||
var offset = pen.offsetY * pen.calculative.canvas.store.data.scale; | ||
let offset = pen.offsetY * pen.calculative.canvas.store.data.scale; | ||
if (rowIndex === 0 && pen.hasHeader) { | ||
@@ -790,10 +757,9 @@ offset = 0; | ||
function calcChildrenRect(pen, rect, children) { | ||
var e_2, _a, e_3, _b; | ||
if (!(children && children.length)) { | ||
return; | ||
} | ||
var scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
var resizeX = 1; | ||
var resizeY = 1; | ||
const scaleX = pen.calculative.worldRect.width / pen.tableWidth; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
let resizeX = 1; | ||
let resizeY = 1; | ||
if (pen.initWorldRect) { | ||
@@ -808,49 +774,29 @@ if (pen.calculative.worldRect.width !== pen.initWorldRect.width) { | ||
// 计算子节点需要的宽高 | ||
var height = 0; | ||
var lastX = 0; | ||
var lastY = 0; | ||
var scale = pen.calculative.canvas.store.data.scale; | ||
let height = 0; | ||
let lastX = 0; | ||
let lastY = 0; | ||
const scale = pen.calculative.canvas.store.data.scale; | ||
if (children.length > 1) { | ||
try { | ||
for (var children_1 = __values(children), children_1_1 = children_1.next(); !children_1_1.done; children_1_1 = children_1.next()) { | ||
var item = children_1_1.value; | ||
if (lastX + item.width * scaleX + 20 * scale * scaleX < rect.width) { | ||
item.x = rect.x + lastX + 10 * scale * scaleX; | ||
item.y = rect.y + lastY + 10 * scale * scaleY; | ||
lastX += (item.width + 10 * scale) * scaleX; | ||
height = Math.max(height, lastY + (item.height + 10 * scale) * scaleY); | ||
} | ||
else { | ||
// 超出需要换行 | ||
lastX = 0; | ||
lastY = height; | ||
item.x = rect.x + lastX + 10 * scale * scaleX; | ||
item.y = rect.y + lastY + 10 * scale * scaleY; | ||
height += (item.height + 10 * scale) * scaleY; | ||
} | ||
for (const item of children) { | ||
if (lastX + item.width * scaleX + 20 * scale * scaleX < rect.width) { | ||
item.x = rect.x + lastX + 10 * scale * scaleX; | ||
item.y = rect.y + lastY + 10 * scale * scaleY; | ||
lastX += (item.width + 10 * scale) * scaleX; | ||
height = Math.max(height, lastY + (item.height + 10 * scale) * scaleY); | ||
} | ||
} | ||
catch (e_2_1) { e_2 = { error: e_2_1 }; } | ||
finally { | ||
try { | ||
if (children_1_1 && !children_1_1.done && (_a = children_1.return)) _a.call(children_1); | ||
else { | ||
// 超出需要换行 | ||
lastX = 0; | ||
lastY = height; | ||
item.x = rect.x + lastX + 10 * scale * scaleX; | ||
item.y = rect.y + lastY + 10 * scale * scaleY; | ||
height += (item.height + 10 * scale) * scaleY; | ||
} | ||
finally { if (e_2) throw e_2.error; } | ||
} | ||
// 垂直居中 | ||
if (height + 20 * scale * scaleY < rect.height) { | ||
var top_2 = (rect.height - height - 10 * scale * scaleY) / 2; | ||
try { | ||
for (var children_2 = __values(children), children_2_1 = children_2.next(); !children_2_1.done; children_2_1 = children_2.next()) { | ||
var item = children_2_1.value; | ||
item.y += top_2; | ||
} | ||
const top = (rect.height - height - 10 * scale * scaleY) / 2; | ||
for (const item of children) { | ||
item.y += top; | ||
} | ||
catch (e_3_1) { e_3 = { error: e_3_1 }; } | ||
finally { | ||
try { | ||
if (children_2_1 && !children_2_1.done && (_b = children_2.return)) _b.call(children_2); | ||
} | ||
finally { if (e_3) throw e_3.error; } | ||
} | ||
} | ||
@@ -863,3 +809,3 @@ } | ||
} | ||
children.forEach(function (item) { | ||
children.forEach((item) => { | ||
item.width = item.width * resizeX; | ||
@@ -872,7 +818,7 @@ item.height = item.height * resizeY; | ||
delete pen.calculative.isUpdateData; | ||
var temChildren = deepClone(pen.children); | ||
let temChildren = deepClone(pen.children); | ||
pen.children = []; | ||
onAdd(pen); | ||
temChildren && | ||
temChildren.forEach(function (child) { | ||
temChildren.forEach((child) => { | ||
pen.calculative.canvas.delForce(pen.calculative.canvas.findOne(child)); | ||
@@ -885,3 +831,2 @@ }); | ||
function beforeValue(pen, value) { | ||
var e_4, _a; | ||
pen.calculative.isUpdateData = false; | ||
@@ -902,14 +847,14 @@ if (pen.swiper !== undefined) { | ||
if (value.dataY) { | ||
var replaceMode = pen.replaceMode; | ||
var data_1 = []; | ||
const replaceMode = pen.replaceMode; | ||
let data = []; | ||
if (!replaceMode) { | ||
//追加 | ||
data_1 = pen.data.concat(value.dataY); | ||
data = pen.data.concat(value.dataY); | ||
} | ||
else if (replaceMode === ReplaceMode.Replace) { | ||
//替换 | ||
data_1 = pen.data; | ||
data = pen.data; | ||
value.dataX && | ||
value.dataX.forEach(function (item, index) { | ||
data_1[item] = value.dataY[index]; | ||
value.dataX.forEach((item, index) => { | ||
data[item] = value.dataY[index]; | ||
}); | ||
@@ -920,8 +865,8 @@ } | ||
if (value.dataX) { | ||
data_1[0] = value.dataX; | ||
data[0] = value.dataX; | ||
} | ||
else { | ||
data_1[0] = pen.data[0]; | ||
data[0] = pen.data[0]; | ||
} | ||
data_1 = data_1.concat(value.dataY); | ||
data = data.concat(value.dataY); | ||
} | ||
@@ -931,3 +876,3 @@ delete value.dataX; | ||
pen.calculative.isUpdateData = true; | ||
return Object.assign(value, { data: data_1 }); | ||
return Object.assign(value, { data }); | ||
} | ||
@@ -938,20 +883,10 @@ if (value.data || value.styles || value.maxNum || value.rowHeight || value.colWidth) { | ||
} | ||
try { | ||
for (var _b = __values(Object.keys(value)), _d = _b.next(); !_d.done; _d = _b.next()) { | ||
var key = _d.value; | ||
if (key.includes('data.')) { | ||
pen.calculative.isUpdateData = true; | ||
} | ||
for (let key of Object.keys(value)) { | ||
if (key.includes('data.')) { | ||
pen.calculative.isUpdateData = true; | ||
} | ||
} | ||
catch (e_4_1) { e_4 = { error: e_4_1 }; } | ||
finally { | ||
try { | ||
if (_d && !_d.done && (_a = _b.return)) _a.call(_b); | ||
} | ||
finally { if (e_4) throw e_4.error; } | ||
} | ||
return value; | ||
} | ||
var rowData = pen.data[value.row]; | ||
let rowData = pen.data[value.row]; | ||
if (!rowData) { | ||
@@ -979,3 +914,3 @@ return value; | ||
} | ||
var offset = 0; | ||
let offset = 0; | ||
if (e.deltaY > 0) { | ||
@@ -991,3 +926,2 @@ offset = 4; | ||
function scroll(pen, offset) { | ||
var _a; | ||
if (!pen.offsetY) { | ||
@@ -1005,4 +939,4 @@ pen.offsetY = 0; | ||
//子节点 | ||
(_a = pen.children) === null || _a === void 0 ? void 0 : _a.forEach(function (item) { | ||
var _pen = pen.calculative.canvas.store.pens[item]; | ||
pen.children?.forEach((item) => { | ||
const _pen = pen.calculative.canvas.store.pens[item]; | ||
changeChildVisible(pen, _pen); | ||
@@ -1020,10 +954,10 @@ }); | ||
} | ||
var _a = _pen.calculative.worldRect, y = _a.y, height = _a.height; | ||
var _b = pen.calculative.worldRect, penY = _b.y, penH = _b.height; | ||
var scale = pen.calculative.canvas.store.data.scale; | ||
var scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
var rowHeight = pen.rowHeight; //*scale; | ||
const { y, height } = _pen.calculative.worldRect; | ||
const { y: penY, height: penH } = pen.calculative.worldRect; | ||
const scale = pen.calculative.canvas.store.data.scale; | ||
const scaleY = pen.calculative.worldRect.height / pen.tableHeight; | ||
const rowHeight = pen.rowHeight; //*scale; | ||
//y值更新 | ||
_pen.y = _pen.oldY - (pen.offsetY * scale) / pen.calculative.worldRect.height; | ||
var oldOffset = ((rowHeight * (pen.initScale || 1)) / pen.tableHeight) * pen.maxNum; | ||
const oldOffset = ((rowHeight * (pen.initScale || 1)) / pen.tableHeight) * pen.maxNum; | ||
pen.calculative.canvas.updatePenRect(_pen); | ||
@@ -1038,7 +972,7 @@ if (pen.hasHeader) { | ||
_pen.oldY += oldOffset; | ||
var row = _pen.row + pen.maxNum; | ||
let row = _pen.row + pen.maxNum; | ||
if (!pen.data[row]) { | ||
return; | ||
} | ||
var rowStyle = deepClone(pen.data[row][_pen.col]); | ||
let rowStyle = deepClone(pen.data[row][_pen.col]); | ||
if (rowStyle.background) { | ||
@@ -1067,7 +1001,7 @@ rowStyle.activeBackground = rowStyle.background; | ||
_pen.oldY -= oldOffset; | ||
var row = _pen.row - pen.maxNum; | ||
let row = _pen.row - pen.maxNum; | ||
if (!pen.data[row]) { | ||
return; | ||
} | ||
var rowStyle = deepClone(pen.data[row][_pen.col]); | ||
let rowStyle = deepClone(pen.data[row][_pen.col]); | ||
if (rowStyle.background) { | ||
@@ -1100,7 +1034,7 @@ rowStyle.activeBackground = rowStyle.background; | ||
_pen.oldY += oldOffset; | ||
var row = _pen.row + pen.maxNum; | ||
let row = _pen.row + pen.maxNum; | ||
if (!pen.data[row]) { | ||
return; | ||
} | ||
var rowStyle = deepClone(pen.data[row][_pen.col]); | ||
let rowStyle = deepClone(pen.data[row][_pen.col]); | ||
if (rowStyle.background) { | ||
@@ -1127,7 +1061,7 @@ rowStyle.activeBackground = rowStyle.background; | ||
_pen.oldY -= oldOffset; | ||
var row = _pen.row - pen.maxNum; | ||
let row = _pen.row - pen.maxNum; | ||
if (!pen.data[row]) { | ||
return; | ||
} | ||
var rowStyle = deepClone(pen.data[row][_pen.col]); | ||
let rowStyle = deepClone(pen.data[row][_pen.col]); | ||
if (rowStyle.background) { | ||
@@ -1169,3 +1103,3 @@ rowStyle.activeBackground = rowStyle.background; | ||
} | ||
pen.interval = globalThis.setInterval(function () { | ||
pen.interval = globalThis.setInterval(() => { | ||
if (pen.offsetY >= pen.calculative.maxOffsetY) { | ||
@@ -1195,16 +1129,15 @@ pen.offsetY = 0; | ||
function initChildrenStyle(pen) { | ||
var _a; | ||
(_a = pen.children) === null || _a === void 0 ? void 0 : _a.forEach(function (item) { | ||
var rowHeight = pen.rowHeight; //*scale; | ||
var _pen = pen.calculative.canvas.store.pens[item]; | ||
pen.children?.forEach((item) => { | ||
const rowHeight = pen.rowHeight; //*scale; | ||
const _pen = pen.calculative.canvas.store.pens[item]; | ||
if (!_pen) { | ||
return; | ||
} | ||
var oldOffset = ((rowHeight * (pen.initScale || 1)) / pen.tableHeight) * pen.maxNum; | ||
const oldOffset = ((rowHeight * (pen.initScale || 1)) / pen.tableHeight) * pen.maxNum; | ||
_pen.oldY -= oldOffset; | ||
var row = _pen.row - pen.maxNum; | ||
const row = _pen.row - pen.maxNum; | ||
if (!pen.data[row]) { | ||
return; | ||
} | ||
var rowStyle = deepClone(pen.data[row][_pen.col]); | ||
let rowStyle = deepClone(pen.data[row][_pen.col]); | ||
if (rowStyle.background) { | ||
@@ -1211,0 +1144,0 @@ rowStyle.activeBackground = rowStyle.background; |
export declare function time(pen: any, ctx?: CanvasRenderingContext2D): Path2D; |
export function time(pen, ctx) { | ||
var path = !ctx ? new Path2D() : ctx; | ||
var _a = pen.calculative.worldRect, x = _a.x, y = _a.y, width = _a.width, height = _a.height; | ||
const path = !ctx ? new Path2D() : ctx; | ||
const { x, y, width, height } = pen.calculative.worldRect; | ||
path.rect(x, y, width, height); | ||
@@ -22,25 +22,25 @@ if (!pen.onAdd) { | ||
//更多 https://blog.csdn.net/Endeavorseven/article/details/101310628 | ||
var weeks = ['天', '一', '二', '三', '四', '五', '六']; | ||
var now = new Date(); | ||
var year = now.getFullYear(); | ||
var pad = ''; | ||
const weeks = ['天', '一', '二', '三', '四', '五', '六']; | ||
const now = new Date(); | ||
const year = now.getFullYear(); | ||
let pad = ''; | ||
if (pen.fillZero) { | ||
pad = '0'; | ||
} | ||
var month = (now.getMonth() + 1 + '').padStart(2, pad); | ||
var day = (now.getDate() + '').padStart(2, pad); | ||
var week = now.getDay(); | ||
var hours = (now.getHours() + '').padStart(2, pad); | ||
var minutes = (now.getMinutes() + '').padStart(2, pad); | ||
var seconds = (now.getSeconds() + '').padStart(2, pad); | ||
var fn = new Function('year', 'month', 'day', 'week', 'hours', 'minutes', 'seconds', pen.timeFormat | ||
? "return " + pen.timeFormat | ||
const month = (now.getMonth() + 1 + '').padStart(2, pad); | ||
const day = (now.getDate() + '').padStart(2, pad); | ||
const week = now.getDay(); | ||
const hours = (now.getHours() + '').padStart(2, pad); | ||
const minutes = (now.getMinutes() + '').padStart(2, pad); | ||
const seconds = (now.getSeconds() + '').padStart(2, pad); | ||
const fn = new Function('year', 'month', 'day', 'week', 'hours', 'minutes', 'seconds', pen.timeFormat | ||
? `return ${pen.timeFormat}` | ||
: 'return `${year}:${month}:${day} ${hours}:${minutes}:${seconds} 星期${week}`'); | ||
var time = fn(year, month, day, weeks[week], hours, minutes, seconds); | ||
const time = fn(year, month, day, weeks[week], hours, minutes, seconds); | ||
return time; | ||
} | ||
function onAdd(pen) { | ||
pen.interval = setInterval(function () { | ||
var text = formatTime(pen); | ||
pen.calculative.canvas.parent.setValue({ id: pen.id, text: text }, { history: false, doEvent: false, render: false }); | ||
pen.interval = setInterval(() => { | ||
const text = formatTime(pen); | ||
pen.calculative.canvas.parent.setValue({ id: pen.id, text }, { history: false, doEvent: false, render: false }); | ||
pen.calculative.canvas.render(); | ||
@@ -47,0 +47,0 @@ }, pen.timeout || 1000); |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Uses eval
Supply chain riskPackage uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.
Found 1 instance in 1 package
Uses eval
Supply chain riskPackage uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.
Found 1 instance in 1 package
2
-33.33%171946
-54.1%31
-8.82%2332
-54.52%