feat: embed link 高度自定义 & 配置页

src/ExcelSettingTab.ts

@@ -0,0 +1,101 @@
+import { App, PluginSettingTab, Setting } from "obsidian";
+import ExcelPlugin from "./main";
+
+export class ExcelSettingTab extends PluginSettingTab {
+	plugin: ExcelPlugin;
+
+	constructor(app: App, plugin: ExcelPlugin) {
+		super(app, plugin);
+		this.plugin = plugin;
+	}
+
+    display() {
+        let { containerEl } = this
+
+        containerEl.empty()
+
+        containerEl.createEl("h1", { text: "File Setting / 文件设置" });
+
+        new Setting(containerEl)
+            .setName("Folder")
+            .setDesc("Create files in this folder by default / 默认在此文件夹下创建文件")
+            .addText((text) => 
+                text
+                    .setPlaceholder("/")
+                    .setValue(this.plugin.settings.folder)
+                    .onChange(async (value) => {
+                        this.plugin.settings.folder = value
+                        this.plugin.saveSettings()
+                    })
+            )
+
+        new Setting(containerEl)
+            .setName("Filename Prefix / 文件名前缀")
+            .setDesc("filename prefi / 设置文件名前缀")
+            .addText((text) => 
+                text
+                    .setPlaceholder("Excel")
+                    .setValue(this.plugin.settings.excelFilenamePrefix)
+                    .onChange(async (value) => {
+                        this.plugin.settings.excelFilenamePrefix = value
+                        this.plugin.saveSettings()
+                    })
+            )
+
+        new Setting(containerEl)
+            .setName("Filename Date Time/ 文件名时间格式")
+            .setDesc("filename date time / 文件名时间格式")
+            .addText((text) => 
+                text
+                    .setPlaceholder("YYYY-MM-DD HH.mm.ss")
+                    .setValue(this.plugin.settings.excelFilenameDateTime)
+                    .onChange(async (value) => {
+                        this.plugin.settings.excelFilenameDateTime = value
+                        this.plugin.saveSettings()
+                    })
+            )
+
+        containerEl.createEl("h1", { text: "Embed Link Setting / 嵌入链接设置" });
+                    
+        new Setting(containerEl)
+            .setName("Sheet Height/ 表格高度")
+            .setDesc("default height for rendering spreadsheets / 渲染表格的默认高度")
+            .addText((text) => 
+                text
+                    .setPlaceholder("300")
+                    .setValue(this.plugin.settings.sheetHeight)
+                    .onChange(async (value) => {
+                        this.plugin.settings.sheetHeight = value
+                        this.plugin.saveSettings()
+                    })
+            )
+
+        containerEl.createEl("h1", { text: "Sheet Setting / 表格设置" });
+
+        new Setting(containerEl)
+            .setName("Row Height/ 行高度")
+            .setDesc("default row height / 默认行高")
+            .addText((text) => 
+                text
+                    .setPlaceholder("25")
+                    .setValue(this.plugin.settings.rowHeight)
+                    .onChange(async (value) => {
+                        this.plugin.settings.rowHeight = value
+                        this.plugin.saveSettings()
+                    })
+            )
+
+        new Setting(containerEl)
+            .setName("Column Width/ 列宽度")
+            .setDesc("default column width / 默认列的宽度")
+            .addText((text) => 
+                text
+                    .setPlaceholder("25")
+                    .setValue(this.plugin.settings.colWidth)
+                    .onChange(async (value) => {
+                        this.plugin.settings.colWidth = value
+                        this.plugin.saveSettings()
+                    })
+            )
+    }
+}

src/MarkdownPostProcessor.ts

@@ -115,18 +115,31 @@ const tmpObsidianWYSIWYG = async (
 	const data = await vault.read(file);
 	const src = internalEmbedDiv.getAttribute("src") ?? "";
 	const alt = internalEmbedDiv.getAttribute("alt") ?? "";
+	var range = alt
+
+	var heigh = 300
+	const matchResult = alt.match(/<(\d+)>/);
+
+	if (matchResult && matchResult.length > 1) {
+	  const extractedValue = matchResult[1];  // 获取匹配到的数字
+	//   console.log("Extracted value:", extractedValue);
+	  heigh = parseInt(extractedValue)
+	  range = range.replace(/<\d+>/, '');
+	} else {
+	//   console.log("No match found.");
+	}
 	const split = src.split("#");
 	var excelData = getExcelData(data);
 	if (split.length > 1) {
 		excelData = getExcelAreaData(
 			data,
 			split[1],
-			alt
+			range
 		);
 	}
 
 	// console.log('internalEmbedDiv', excelData, src, alt)
-	const sheetDiv = createSheetEl(excelData, file, internalEmbedDiv.clientWidth);
+	const sheetDiv = createSheetEl(excelData, file, internalEmbedDiv.clientWidth, heigh);
 	if (markdownEmbed) {
 		//display image on canvas without markdown frame
 		internalEmbedDiv.removeClass("markdown-embed");
@@ -135,7 +148,7 @@ const tmpObsidianWYSIWYG = async (
 	internalEmbedDiv.appendChild(sheetDiv);
 };
 
-const createSheetEl = (data: string, file: TFile, width: number): HTMLDivElement => {
+const createSheetEl = (data: string, file: TFile, width: number, height: number = 300): HTMLDivElement => {
 
 	const sheetDiv = createDiv()
 
@@ -161,6 +174,7 @@ const createSheetEl = (data: string, file: TFile, width: number): HTMLDivElement
 		cls: "sheet-iframe",
 		attr: {
 			id: `x-spreadsheet-${new Date().getTime()}`,
+			style: `height: ${height}px`
 		},
 	});
 
@@ -172,7 +186,7 @@ const createSheetEl = (data: string, file: TFile, width: number): HTMLDivElement
 		showToolbar: false,
 		showBottomBar: true,
 		view: {
-			height: () => 300,
+			height: () => height,
 			width: () => width,
 		},
 	}).loadData(jsonData); // load data

src/main.ts

@@ -12,6 +12,7 @@ import { PaneTarget } from "./utils/ModifierkeyHelper";
 import { ExcelView } from "./ExcelView";
 import { getExcelFilename } from "./utils/FileUtils";
 import { around, dedupe } from "monkey-around";
+import { ExcelSettingTab } from "./ExcelSettingTab"
 
 import {
 	initializeMarkdownPostProcessor,
@@ -25,6 +26,11 @@ export default class ExcelPlugin extends Plugin {
 	private _loaded: boolean = false;
 
 	async onload() {
+		// 加载设置
+		await this.loadSettings()
+
+		this.addSettingTab(new ExcelSettingTab(this.app, this))
+
 		this.registerView(
 			VIEW_TYPE_EXCEL,
 			(leaf: WorkspaceLeaf) => new ExcelView(leaf, this)

src/utils/Settings.ts

@@ -1,15 +1,17 @@
 export interface ExcelSettings {
 	folder: string;
 	excelFilenamePrefix: string,
-	excelEmbedPrefixWithFilename: true,
-	excelFilnameEmbedPostfix: string,
 	excelFilenameDateTime: string,
+	sheetHeight: string,
+	rowHeight: string,
+	colWidth: string
 }
 
 export const DEFAULT_SETTINGS: ExcelSettings = {
-	folder: "Excel",
+	folder: "/",
 	excelFilenamePrefix: "Excel ",
-	excelEmbedPrefixWithFilename: true,
-	excelFilnameEmbedPostfix: " ",
 	excelFilenameDateTime: "YYYY-MM-DD HH.mm.ss",
+	sheetHeight: "300",
+	rowHeight: "25",
+	colWidth: "100"
 };

styles.css

@@ -16,7 +16,6 @@
 /* Markdown 文档引入样式设置*/
 .sheet-iframe {
 	width: 100%;
-	height: 308px;
 	background-color: var(--background-primary-alt);
 	border: 5px solid #f5f6f7;
 }