gaoYuJournal/miniprogram/pages/main/other/memo/index.ts

// 备忘录页面逻辑
import { ToolApi } from "../../../../api/ToolApi";

type EditorInputEvent = WechatMiniprogram.CustomEvent<{
	html?: string;
	text?: string;
}>;

interface MemoData {
	formats: Record<string, unknown>;
	placeholder: string;
	editorHeight: number;
	keyboardHeight: number;
	isIOS: boolean;
	isSaving: boolean;
	isEditorReady: boolean;
	contentHtml: string;
	contentText: string;
}

Page({
	data: <MemoData>{
		formats: {},
		placeholder: "开始输入...",
		editorHeight: 300,
		keyboardHeight: 0,
		isIOS: false,
		isSaving: false,
		isEditorReady: false,
		contentHtml: "",
		contentText: ""
	},
	editorCtx: null as WechatMiniprogram.EditorContext | null,
	pendingHtml: "",
	hasSavedOnLeave: false,
	hasLoadFailed: false,
	async onLoad() {
		const platform = wx.getSystemInfoSync().platform;
		const isIOS = platform === "ios";
		this.setData({ isIOS });
		this.updatePosition(0);
		this.bindKeyboardHeightChange();
		await this.loadMemo();
	},
	onShow() {
		this.hasSavedOnLeave = false;
	},
	async onUnload() {
		await this.saveMemoOnLeave();
	},
	async onHide() {
		await this.saveMemoOnLeave();
	},
	bindKeyboardHeightChange() {
		let keyboardHeight = 0;
		wx.onKeyboardHeightChange((res) => {
			if (res.height === keyboardHeight) {
				return;
			}
			const duration = 0 < res.height ? res.duration * 1000 : 0;
			keyboardHeight = res.height;
			setTimeout(() => {
				wx.pageScrollTo({
					scrollTop: 0,
					success: () => {
						this.updatePosition(keyboardHeight);
						this.editorCtx?.scrollIntoView();
					}
				});
			}, duration);
		});
	},
	updatePosition(keyboardHeight: number) {
		const toolbarHeight = 50;
		const { windowHeight } = wx.getSystemInfoSync();
		const editorHeight = 0 < keyboardHeight
			? windowHeight - keyboardHeight - toolbarHeight
			: windowHeight;
		this.setData({ editorHeight, keyboardHeight });
	},
	onEditorReady() {
		const query = wx.createSelectorQuery();
		query.select("#memo-editor").context((res) => {
			this.editorCtx = (res as { context?: WechatMiniprogram.EditorContext }).context || null;
			this.setData({ isEditorReady: true });
			this.applyPendingContent();
		});
		query.exec();
	},
	applyPendingContent() {
		if (!this.editorCtx || !this.pendingHtml) {
			return;
		}
		this.editorCtx.setContents({
			html: this.pendingHtml
		});
		this.pendingHtml = "";
	},
	onStatusChange(e: WechatMiniprogram.CustomEvent<Record<string, unknown>>) {
		this.setData({ formats: e.detail || {} });
	},
	format(e: WechatMiniprogram.BaseEvent) {
		const { name, value } = e.target.dataset as { name?: string; value?: string | number };
		if (!name || !this.editorCtx) {
			return;
		}
		this.editorCtx.format(name, value);
	},
	onEditorInput(e: EditorInputEvent) {
		const { html = "", text = "" } = e.detail || {};
		this.setData({
			contentHtml: html,
			contentText: text
		});
	},
	async loadMemo() {
		wx.showLoading({ title: "加载中..", mask: true });
		let shouldGoBack = false;
		try {
			const contentHtml = await ToolApi.getMemo();
			this.pendingHtml = contentHtml;
			this.setData({
				contentHtml,
				contentText: this.normalizeMemoText(contentHtml)
			});
			this.applyPendingContent();
		} catch (error) {
			console.error("加载备忘录失败", error);
			this.hasLoadFailed = true;
			shouldGoBack = true;
		} finally {
			wx.hideLoading();
			if (shouldGoBack) {
				wx.navigateBack({ delta: 1 });
			}
		}
	},
	normalizeMemoText(html: string) {
		const normalized = html
			.replace(/<[^>]*>/g, "")
			.replace(/&nbsp;/g, " ")
			.replace(/\s+/g, " ")
			.trim();
		return normalized;
	},
	async saveMemoOnLeave() {
		if (this.hasLoadFailed || this.data.isSaving || this.hasSavedOnLeave) {
			return;
		}
		this.hasSavedOnLeave = true;
		this.setData({ isSaving: true });
		wx.showLoading({ title: "保存中..", mask: true });
		try {
			await ToolApi.updateMemo(this.data.contentHtml || "");
		} catch (error) {
			console.error("保存备忘录失败", error);
		} finally {
			wx.hideLoading();
			this.setData({ isSaving: false });
		}
	}
});