mirror of
https://github.com/ljcoder2015/obsidian-excel.git
synced 2026-07-22 08:30:28 +00:00
feat: search
This commit is contained in:
雷军
parent
c3c97b9204
commit
c70a1aa080
5 changed files with 92 additions and 367 deletions
46
main.css
46
main.css
File diff suppressed because one or more lines are too long
4
package-lock.json
generated
4
package-lock.json
generated
|
|
@ -1408,8 +1408,8 @@
|
|||
"dev": true
|
||||
},
|
||||
"x-data-spreadsheet": {
|
||||
"version": "git+ssh://git@github.com/ljcoder2015/x-spreadsheet.git#4506de2b225f6529d69acd446cc60d28acad5aaf",
|
||||
"from": "git+ssh://git@github.com/ljcoder2015/x-spreadsheet.git#1.0.0",
|
||||
"version": "git+ssh://git@github.com/ljcoder2015/x-spreadsheet.git#cecc61ca0e98de20afa2355a27f14454ab484a03",
|
||||
"from": "git+ssh://git@github.com/ljcoder2015/x-spreadsheet.git#1.1.1",
|
||||
"requires": {
|
||||
"opencollective": "^1.0.3",
|
||||
"opencollective-postinstall": "^2.0.2"
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"monkey-around": "^2.3.0",
|
||||
"x-data-spreadsheet": "git+ssh://git@github.com:ljcoder2015/x-spreadsheet.git#1.0.0",
|
||||
"x-data-spreadsheet": "git+ssh://git@github.com:ljcoder2015/x-spreadsheet.git#1.1.1",
|
||||
"xlsx": "https://cdn.sheetjs.com/xlsx-0.20.0/xlsx-0.20.0.tgz"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,346 +0,0 @@
|
|||
diff --git a/node_modules/x-data-spreadsheet/src/component/event.js b/node_modules/x-data-spreadsheet/src/component/event.js
|
||||
index cdbc0fa..cb2a9db 100644
|
||||
--- a/node_modules/x-data-spreadsheet/src/component/event.js
|
||||
+++ b/node_modules/x-data-spreadsheet/src/component/event.js
|
||||
@@ -74,6 +74,7 @@ export function bindTouch(target, { move, end }) {
|
||||
starty = pageY;
|
||||
}
|
||||
evt.preventDefault();
|
||||
+ evt.stopPropagation();
|
||||
});
|
||||
bind(target, 'touchend', (evt) => {
|
||||
if (!end) return;
|
||||
diff --git a/node_modules/x-data-spreadsheet/src/component/sheet.js b/node_modules/x-data-spreadsheet/src/component/sheet.js
|
||||
index 086b8c4..6757389 100644
|
||||
--- a/node_modules/x-data-spreadsheet/src/component/sheet.js
|
||||
+++ b/node_modules/x-data-spreadsheet/src/component/sheet.js
|
||||
@@ -77,11 +77,11 @@ function selectorSet(multiple, ri, ci, indexesUpdated = true, moving = false) {
|
||||
const cell = data.getCell(ri, ci);
|
||||
if (multiple) {
|
||||
selector.setEnd(ri, ci, moving);
|
||||
- this.trigger('cells-selected', cell, selector.range);
|
||||
+ this.trigger('cells-selected', this.data, selector.range);
|
||||
} else {
|
||||
// trigger click event
|
||||
selector.set(ri, ci, indexesUpdated);
|
||||
- this.trigger('cell-selected', cell, ri, ci);
|
||||
+ this.trigger('cell-selected', this.data, ri, ci);
|
||||
}
|
||||
toolbar.reset();
|
||||
table.render();
|
||||
@@ -467,7 +467,7 @@ function horizontalScrollbarMove(distance) {
|
||||
function rowResizerFinished(cRect, distance) {
|
||||
const { ri } = cRect;
|
||||
const { table, selector, data } = this;
|
||||
- data.rows.setHeight(ri, distance);
|
||||
+ data.setRowHeight(ri, distance);
|
||||
table.render();
|
||||
selector.resetAreaOffset();
|
||||
verticalScrollbarSet.call(this);
|
||||
@@ -477,7 +477,7 @@ function rowResizerFinished(cRect, distance) {
|
||||
function colResizerFinished(cRect, distance) {
|
||||
const { ci } = cRect;
|
||||
const { table, selector, data } = this;
|
||||
- data.cols.setWidth(ci, distance);
|
||||
+ data.setColWidth(ci, distance);
|
||||
// console.log('data:', data);
|
||||
table.render();
|
||||
selector.resetAreaOffset();
|
||||
@@ -785,7 +785,7 @@ function sheetInitEvents() {
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
- // console.log('evt.keyCode:', evt.keyCode);
|
||||
+ console.log('evt.keyCode:', evt.keyCode);
|
||||
switch (keyCode) {
|
||||
case 32:
|
||||
if (shiftKey) {
|
||||
@@ -854,7 +854,7 @@ function sheetInitEvents() {
|
||||
}
|
||||
|
||||
export default class Sheet {
|
||||
- constructor(targetEl, data) {
|
||||
+ constructor(targetEl, data, isDark) {
|
||||
this.eventMap = createEventEmitter();
|
||||
const { view, showToolbar, showContextmenu } = data.settings;
|
||||
this.el = h('div', `${cssPrefix}-sheet`);
|
||||
@@ -904,7 +904,7 @@ export default class Sheet {
|
||||
this.sortFilter.el,
|
||||
);
|
||||
// table
|
||||
- this.table = new Table(this.tableEl.el, data);
|
||||
+ this.table = new Table(this.tableEl.el, data, isDark);
|
||||
sheetInitEvents.call(this);
|
||||
sheetReset.call(this);
|
||||
// init selector [0, 0]
|
||||
diff --git a/node_modules/x-data-spreadsheet/src/component/table.js b/node_modules/x-data-spreadsheet/src/component/table.js
|
||||
index 41e1e14..09ac678 100644
|
||||
--- a/node_modules/x-data-spreadsheet/src/component/table.js
|
||||
+++ b/node_modules/x-data-spreadsheet/src/component/table.js
|
||||
@@ -7,22 +7,23 @@ import { formatm } from '../core/format';
|
||||
import {
|
||||
Draw, DrawBox, thinLineWidth, npx,
|
||||
} from '../canvas/draw';
|
||||
+import { idText } from 'typescript';
|
||||
// gobal var
|
||||
const cellPaddingWidth = 5;
|
||||
const tableFixedHeaderCleanStyle = { fillStyle: '#f4f5f8' };
|
||||
-const tableGridStyle = {
|
||||
+var tableGridStyle = {
|
||||
fillStyle: '#fff',
|
||||
lineWidth: thinLineWidth,
|
||||
strokeStyle: '#e6e6e6',
|
||||
};
|
||||
-function tableFixedHeaderStyle() {
|
||||
+function tableFixedHeaderStyle(isDark) {
|
||||
return {
|
||||
textAlign: 'center',
|
||||
textBaseline: 'middle',
|
||||
font: `500 ${npx(12)}px Source Sans Pro`,
|
||||
- fillStyle: '#585757',
|
||||
+ fillStyle: isDark ? '#dcdcdc' : '#585757',
|
||||
lineWidth: thinLineWidth(),
|
||||
- strokeStyle: '#e6e6e6',
|
||||
+ strokeStyle: isDark ? '#c0c0c0': '#e6e6e6',
|
||||
};
|
||||
}
|
||||
|
||||
@@ -184,13 +185,18 @@ function renderSelectedHeaderCell(x, y, w, h) {
|
||||
// h: the fixed height of header
|
||||
// tx: moving distance on x-axis
|
||||
// ty: moving distance on y-axis
|
||||
-function renderFixedHeaders(type, viewRange, w, h, tx, ty) {
|
||||
+function renderFixedHeaders(type, viewRange, w, h, tx, ty, isDark) {
|
||||
const { draw, data } = this;
|
||||
const sumHeight = viewRange.h; // rows.sumHeight(viewRange.sri, viewRange.eri + 1);
|
||||
const sumWidth = viewRange.w; // cols.sumWidth(viewRange.sci, viewRange.eci + 1);
|
||||
const nty = ty + h;
|
||||
const ntx = tx + w;
|
||||
|
||||
+ if (isDark) {
|
||||
+ tableFixedHeaderCleanStyle.fillStyle = '#595d88'
|
||||
+ tableFixedHeaderCleanStyle.strokeStyle = '#5d5d5d'
|
||||
+ }
|
||||
+
|
||||
draw.save();
|
||||
// draw rect background
|
||||
draw.attr(tableFixedHeaderCleanStyle);
|
||||
@@ -203,7 +209,7 @@ function renderFixedHeaders(type, viewRange, w, h, tx, ty) {
|
||||
// console.log(data.selectIndexes);
|
||||
// draw text
|
||||
// text font, align...
|
||||
- draw.attr(tableFixedHeaderStyle());
|
||||
+ draw.attr(tableFixedHeaderStyle(isDark));
|
||||
// y-header-text
|
||||
if (type === 'all' || type === 'left') {
|
||||
data.rowEach(viewRange.sri, viewRange.eri, (i, y1, rowHeight) => {
|
||||
@@ -247,21 +253,25 @@ function renderFixedHeaders(type, viewRange, w, h, tx, ty) {
|
||||
draw.restore();
|
||||
}
|
||||
|
||||
-function renderFixedLeftTopCell(fw, fh) {
|
||||
+function renderFixedLeftTopCell(fw, fh, isDark) {
|
||||
const { draw } = this;
|
||||
draw.save();
|
||||
// left-top-cell
|
||||
- draw.attr({ fillStyle: '#f4f5f8' })
|
||||
+ draw.attr({ fillStyle: isDark ? '#595d88' : '#f4f5f8', strokeStyle: isDark ? '#5d5d5d' : '#e6e6e6' })
|
||||
.fillRect(0, 0, fw, fh);
|
||||
draw.restore();
|
||||
}
|
||||
|
||||
function renderContentGrid({
|
||||
sri, sci, eri, eci, w, h,
|
||||
-}, fw, fh, tx, ty) {
|
||||
+}, fw, fh, tx, ty, isDark) {
|
||||
const { draw, data } = this;
|
||||
const { settings } = data;
|
||||
|
||||
+ if (isDark) {
|
||||
+ tableGridStyle.strokeStyle = '#5d5d5d'
|
||||
+ }
|
||||
+
|
||||
draw.save();
|
||||
draw.attr(tableGridStyle)
|
||||
.translate(fw + tx, fh + ty);
|
||||
@@ -300,10 +310,11 @@ function renderFreezeHighlightLine(fw, fh, ftw, fth) {
|
||||
|
||||
/** end */
|
||||
class Table {
|
||||
- constructor(el, data) {
|
||||
+ constructor(el, data, isDark) {
|
||||
this.el = el;
|
||||
this.draw = new Draw(el, data.viewWidth(), data.viewHeight());
|
||||
this.data = data;
|
||||
+ this.isDark = isDark
|
||||
}
|
||||
|
||||
resetData(data) {
|
||||
@@ -329,10 +340,10 @@ class Table {
|
||||
const ty = data.freezeTotalHeight();
|
||||
const { x, y } = data.scroll;
|
||||
// 1
|
||||
- renderContentGrid.call(this, viewRange, fw, fh, tx, ty);
|
||||
+ renderContentGrid.call(this, viewRange, fw, fh, tx, ty, this.isDark);
|
||||
renderContent.call(this, viewRange, fw, fh, -x, -y);
|
||||
- renderFixedHeaders.call(this, 'all', viewRange, fw, fh, tx, ty);
|
||||
- renderFixedLeftTopCell.call(this, fw, fh);
|
||||
+ renderFixedHeaders.call(this, 'all', viewRange, fw, fh, tx, ty, this.isDark);
|
||||
+ renderFixedLeftTopCell.call(this, fw, fh, this.isDark);
|
||||
const [fri, fci] = data.freeze;
|
||||
if (fri > 0 || fci > 0) {
|
||||
// 2
|
||||
@@ -343,7 +354,7 @@ class Table {
|
||||
vr.h = ty;
|
||||
renderContentGrid.call(this, vr, fw, fh, tx, 0);
|
||||
renderContent.call(this, vr, fw, fh, -x, 0);
|
||||
- renderFixedHeaders.call(this, 'top', vr, fw, fh, tx, 0);
|
||||
+ renderFixedHeaders.call(this, 'top', vr, fw, fh, tx, 0, this.isDark);
|
||||
}
|
||||
// 3
|
||||
if (fci > 0) {
|
||||
@@ -352,13 +363,13 @@ class Table {
|
||||
vr.eci = fci - 1;
|
||||
vr.w = tx;
|
||||
renderContentGrid.call(this, vr, fw, fh, 0, ty);
|
||||
- renderFixedHeaders.call(this, 'left', vr, fw, fh, 0, ty);
|
||||
+ renderFixedHeaders.call(this, 'left', vr, fw, fh, 0, ty, this.isDark);
|
||||
renderContent.call(this, vr, fw, fh, 0, -y);
|
||||
}
|
||||
// 4
|
||||
const freezeViewRange = data.freezeViewRange();
|
||||
renderContentGrid.call(this, freezeViewRange, fw, fh, 0, 0);
|
||||
- renderFixedHeaders.call(this, 'all', freezeViewRange, fw, fh, 0, 0);
|
||||
+ renderFixedHeaders.call(this, 'all', freezeViewRange, fw, fh, 0, 0, this.isDark);
|
||||
renderContent.call(this, freezeViewRange, fw, fh, 0, 0);
|
||||
// 5
|
||||
renderFreezeHighlightLine.call(this, fw, fh, tx, ty);
|
||||
diff --git a/node_modules/x-data-spreadsheet/src/index.d.ts b/node_modules/x-data-spreadsheet/src/index.d.ts
|
||||
index 948a8e9..7c99ef0 100644
|
||||
--- a/node_modules/x-data-spreadsheet/src/index.d.ts
|
||||
+++ b/node_modules/x-data-spreadsheet/src/index.d.ts
|
||||
@@ -34,6 +34,7 @@ declare module 'x-data-spreadsheet' {
|
||||
italic: false;
|
||||
};
|
||||
};
|
||||
+ isDark: boolean;
|
||||
}
|
||||
|
||||
export type CELL_SELECTED = 'cell-selected';
|
||||
@@ -45,18 +46,18 @@ declare module 'x-data-spreadsheet' {
|
||||
export interface SpreadsheetEventHandler {
|
||||
(
|
||||
envt: CELL_SELECTED,
|
||||
- callback: (cell: Cell, rowIndex: number, colIndex: number) => void
|
||||
+ callback: (sheetData: Record<string, any>, rowIndex: number, colIndex: number) => void
|
||||
): void;
|
||||
(
|
||||
envt: CELLS_SELECTED,
|
||||
callback: (
|
||||
- cell: Cell,
|
||||
+ sheetData: Record<string, any>,
|
||||
parameters: { sri: number; sci: number; eri: number; eci: number }
|
||||
) => void
|
||||
): void;
|
||||
(
|
||||
evnt: CELL_EDITED,
|
||||
- callback: (text: string, rowIndex: number, colIndex: number) => void
|
||||
+ callback: (sheetData: Record<string, any>, rowIndex: number, colIndex: number) => void
|
||||
): void;
|
||||
}
|
||||
|
||||
@@ -182,6 +183,25 @@ declare module 'x-data-spreadsheet' {
|
||||
* @param callback
|
||||
*/
|
||||
change(callback: (json: Record<string, any>) => void): this;
|
||||
+
|
||||
+ /**
|
||||
+ * 添加sheet监听回调
|
||||
+ * @param callback
|
||||
+ */
|
||||
+ onAddSheet(callback: () => void): this;
|
||||
+
|
||||
+ /**
|
||||
+ * 重命名Sheet
|
||||
+ * @param callback
|
||||
+ */
|
||||
+ onRenameSheet(callback: () => void): this;
|
||||
+
|
||||
+ /**
|
||||
+ * 删除Sheet
|
||||
+ * @param callback
|
||||
+ */
|
||||
+ onDeleteSheet(callback: () => void): this;
|
||||
+
|
||||
/**
|
||||
* set locale
|
||||
* @param lang
|
||||
diff --git a/node_modules/x-data-spreadsheet/src/index.js b/node_modules/x-data-spreadsheet/src/index.js
|
||||
index 479a0b7..165880e 100644
|
||||
--- a/node_modules/x-data-spreadsheet/src/index.js
|
||||
+++ b/node_modules/x-data-spreadsheet/src/index.js
|
||||
@@ -11,8 +11,8 @@ import './index.less';
|
||||
class Spreadsheet {
|
||||
constructor(selectors, options = {}) {
|
||||
let targetEl = selectors;
|
||||
- this.options = { showBottomBar: true, ...options };
|
||||
- this.sheetIndex = 1;
|
||||
+ this.options = { isDark: false, showBottomBar: true, ...options };
|
||||
+ this.sheetIndex = 0;
|
||||
this.datas = [];
|
||||
if (typeof selectors === 'string') {
|
||||
targetEl = document.querySelector(selectors);
|
||||
@@ -20,6 +20,7 @@ class Spreadsheet {
|
||||
this.bottombar = this.options.showBottomBar ? new Bottombar(() => {
|
||||
const d = this.addSheet();
|
||||
this.sheet.resetData(d);
|
||||
+ this.sheet.trigger('add-sheet', "")
|
||||
}, (index) => {
|
||||
const d = this.datas[index];
|
||||
this.sheet.resetData(d);
|
||||
@@ -27,13 +28,14 @@ class Spreadsheet {
|
||||
this.deleteSheet();
|
||||
}, (index, value) => {
|
||||
this.datas[index].name = value;
|
||||
+ this.sheet.trigger('rename-sheet', value)
|
||||
}) : null;
|
||||
this.data = this.addSheet();
|
||||
const rootEl = h('div', `${cssPrefix}`)
|
||||
.on('contextmenu', evt => evt.preventDefault());
|
||||
// create canvas element
|
||||
targetEl.appendChild(rootEl.el);
|
||||
- this.sheet = new Sheet(rootEl, this.data);
|
||||
+ this.sheet = new Sheet(rootEl, this.data, options.isDark);
|
||||
if (this.bottombar !== null) {
|
||||
rootEl.child(this.bottombar.el);
|
||||
}
|
||||
@@ -60,6 +62,7 @@ class Spreadsheet {
|
||||
const [oldIndex, nindex] = this.bottombar.deleteItem();
|
||||
if (oldIndex >= 0) {
|
||||
this.datas.splice(oldIndex, 1);
|
||||
+ this.sheet.trigger('delete-sheet', "")
|
||||
if (nindex >= 0) this.sheet.resetData(this.datas[nindex]);
|
||||
}
|
||||
}
|
||||
@@ -120,6 +123,21 @@ class Spreadsheet {
|
||||
return this;
|
||||
}
|
||||
|
||||
+ onAddSheet(cb) {
|
||||
+ this.sheet.on('add-sheet', cb);
|
||||
+ return this;
|
||||
+ }
|
||||
+
|
||||
+ onRenameSheet(cb) {
|
||||
+ this.sheet.on('rename-sheet', cb);
|
||||
+ return this;
|
||||
+ }
|
||||
+
|
||||
+ onDeleteSheet(cb) {
|
||||
+ this.sheet.on('delete-sheet', cb)
|
||||
+ return this
|
||||
+ }
|
||||
+
|
||||
static locale(lang, message) {
|
||||
locale(lang, message);
|
||||
}
|
||||
61
styles.css
61
styles.css
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue