🎨 Format code
This commit is contained in:
parent
f68244538c
commit
4d0303445e
|
@ -30,7 +30,7 @@ log/
|
|||
nbproject/private/
|
||||
build/
|
||||
nbbuild/
|
||||
dist/
|
||||
./dist/
|
||||
nbdist/
|
||||
.nb-gradle/
|
||||
|
||||
|
|
|
@ -1,8 +1,7 @@
|
|||
import type { I18nLang } from "@/type/i18n";
|
||||
|
||||
const lang: I18nLang = {
|
||||
"insert_image": "Insert Image"
|
||||
}
|
||||
insert_image: "Insert Image",
|
||||
};
|
||||
|
||||
|
||||
export default lang
|
||||
export default lang;
|
||||
|
|
|
@ -15,4 +15,4 @@ export declare type Options = {
|
|||
showAttachment: () => void;
|
||||
language: string;
|
||||
codeBlockPreview: boolean;
|
||||
}
|
||||
};
|
||||
|
|
|
@ -1 +1 @@
|
|||
export declare type I18nLang = {[key: string]: string}
|
||||
export declare type I18nLang = { [key: string]: string };
|
||||
|
|
|
@ -4,10 +4,10 @@ import zhTW from "@/i18n/zh-TW";
|
|||
import enUS from "@/i18n/en-US";
|
||||
|
||||
const langDict: { [key: string]: I18nLang } = {
|
||||
"zh_CN": zhCN,
|
||||
"zh_TW": zhTW,
|
||||
"en_US": enUS
|
||||
}
|
||||
zh_CN: zhCN,
|
||||
zh_TW: zhTW,
|
||||
en_US: enUS,
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取翻译的文本
|
||||
|
@ -15,5 +15,5 @@ const langDict: {[key: string]: I18nLang} = {
|
|||
* @param lang 目标语言
|
||||
*/
|
||||
export function t(key: string, lang: keyof II18n): string {
|
||||
return langDict[lang][key]
|
||||
return langDict[lang][key];
|
||||
}
|
||||
|
|
|
@ -1,2 +1 @@
|
|||
|
||||
export const mdiImage: string = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="m8.5 13.5l2.5 3l3.5-4.5l4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2"/></svg>`
|
||||
export const mdiImage = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="m8.5 13.5l2.5 3l3.5-4.5l4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2"/></svg>`;
|
||||
|
|
|
@ -19,35 +19,43 @@ export function getOptions(options: Options): IOptions {
|
|||
input: options.input,
|
||||
toolbar: getToolbar(options.showAttachment, getLanguage(options.language)),
|
||||
counter: {
|
||||
enable: true
|
||||
enable: true,
|
||||
},
|
||||
preview: {
|
||||
markdown: {
|
||||
toc: true,
|
||||
codeBlockPreview: options.codeBlockPreview
|
||||
}
|
||||
codeBlockPreview: options.codeBlockPreview,
|
||||
},
|
||||
},
|
||||
outline: {
|
||||
enable: true,
|
||||
position: "left"
|
||||
position: "left",
|
||||
},
|
||||
fullscreen: {
|
||||
index: 1000
|
||||
}
|
||||
}
|
||||
index: 1000,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function getLanguage(lang = "zh-CN"): keyof II18n {
|
||||
switch (lang) {
|
||||
case "zh-CN": return "zh_CN";
|
||||
case "zh-TW": return "zh_TW";
|
||||
case "en-US": return "en_US";
|
||||
case "es": return "en_US";
|
||||
default: return "zh_CN";
|
||||
case "zh-CN":
|
||||
return "zh_CN";
|
||||
case "zh-TW":
|
||||
return "zh_TW";
|
||||
case "en-US":
|
||||
return "en_US";
|
||||
case "es":
|
||||
return "en_US";
|
||||
default:
|
||||
return "zh_CN";
|
||||
}
|
||||
}
|
||||
|
||||
function getToolbar(showAttachmentCb: () => void, lang: keyof II18n): (string | IMenuItem)[] | undefined {
|
||||
function getToolbar(
|
||||
showAttachmentCb: () => void,
|
||||
lang: keyof II18n
|
||||
): (string | IMenuItem)[] | undefined {
|
||||
return [
|
||||
"emoji",
|
||||
"headings",
|
||||
|
@ -75,7 +83,7 @@ function getToolbar(showAttachmentCb: () => void, lang: keyof II18n): (string |
|
|||
tip: t("insert_image", lang),
|
||||
tipPosition: "n",
|
||||
hotkey: "⇧⌘P",
|
||||
click: showAttachmentCb
|
||||
click: showAttachmentCb,
|
||||
},
|
||||
"table",
|
||||
"|",
|
||||
|
@ -86,12 +94,7 @@ function getToolbar(showAttachmentCb: () => void, lang: keyof II18n): (string |
|
|||
"edit-mode",
|
||||
{
|
||||
name: "more",
|
||||
toolbar: [
|
||||
"both",
|
||||
"export",
|
||||
"outline",
|
||||
"info",
|
||||
"help"
|
||||
],
|
||||
},]
|
||||
toolbar: ["both", "export", "outline", "info", "help"],
|
||||
},
|
||||
];
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<script setup lang="ts">
|
||||
import Vditor from "vditor";
|
||||
import Vditor from "@zhengyi/vditor";
|
||||
import { onMounted, ref } from "vue";
|
||||
import "vditor/dist/index.css"
|
||||
import "vditor/dist/index.css";
|
||||
import type { EditorConfig } from "@/type/editor";
|
||||
import { getOptions } from "@/utils/vditor-utils";
|
||||
import type { AttachmentLike } from "@halo-dev/console-shared";
|
||||
|
@ -17,9 +17,9 @@ const props = withDefaults(
|
|||
}
|
||||
);
|
||||
|
||||
const vditor = ref()
|
||||
const vditorRef = ref()
|
||||
const attachmentSelectorModalShow = ref(false)
|
||||
const vditor = ref();
|
||||
const vditorRef = ref();
|
||||
const attachmentSelectorModalShow = ref(false);
|
||||
|
||||
const emit = defineEmits<{
|
||||
(event: "update:raw", value: string): void;
|
||||
|
@ -31,12 +31,12 @@ const debounceOnUpdate = () => {
|
|||
emit("update:raw", vditor.value.getValue());
|
||||
emit("update:content", vditor.value.getHTML() || "");
|
||||
emit("update", vditor.value.getValue());
|
||||
}
|
||||
};
|
||||
|
||||
// 选取附件后处理
|
||||
const attachmentSelect = (attachments: AttachmentLike[]) => {
|
||||
// Reference https://github.com/guqing/willow-mde/blob/4b8e697132f8a8f4b08dd0f92cf10d070cb26793/console/src/components/toolbar/Toolbar.vue#L104
|
||||
attachments.forEach(attachment => {
|
||||
attachments.forEach((attachment) => {
|
||||
if (typeof attachment === "string") {
|
||||
vditor.value.insertValue(`![](${attachment})`);
|
||||
} else if ("url" in attachment) {
|
||||
|
@ -46,41 +46,43 @@ const attachmentSelect = (attachments: AttachmentLike[]) => {
|
|||
const { permalink } = attachment.status || {};
|
||||
vditor.value.insertValue(`![${displayName}](${permalink})`);
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
let mode: "ir" | "wysiwyg" | "sv" | undefined = "ir"
|
||||
let typeWriterMode: boolean = false
|
||||
let codeBlockPreview: boolean = true
|
||||
let mode: "ir" | "wysiwyg" | "sv" | undefined = "ir";
|
||||
let typeWriterMode = false;
|
||||
let codeBlockPreview = true;
|
||||
|
||||
// 实验性功能: 获取当前语言
|
||||
const lang = localStorage.getItem("locale") || "zh-CN"
|
||||
const lang = localStorage.getItem("locale") || "zh-CN";
|
||||
|
||||
try {
|
||||
const response = await fetch(
|
||||
"/apis/api.vditor.mczhengyi.top/editor-options"
|
||||
);
|
||||
const editorConfig: EditorConfig = await response.json();
|
||||
mode = editorConfig.basic.defaultRenderMode
|
||||
typeWriterMode = editorConfig.basic.typeWriterMode
|
||||
codeBlockPreview = editorConfig.basic.codeBlockPreview
|
||||
mode = editorConfig.basic.defaultRenderMode;
|
||||
typeWriterMode = editorConfig.basic.typeWriterMode;
|
||||
codeBlockPreview = editorConfig.basic.codeBlockPreview;
|
||||
} catch (e) {
|
||||
// ignore this
|
||||
}
|
||||
vditor.value = new Vditor(vditorRef.value, getOptions({
|
||||
vditor.value = new Vditor(
|
||||
vditorRef.value,
|
||||
getOptions({
|
||||
defaultRenderMode: mode,
|
||||
typeWriterMode: typeWriterMode,
|
||||
after: () => {
|
||||
vditor.value.setValue(props.raw || "# Title Here")
|
||||
vditor.value.setValue(props.raw || "# Title Here");
|
||||
},
|
||||
input: debounceOnUpdate,
|
||||
showAttachment: () => attachmentSelectorModalShow.value = true,
|
||||
showAttachment: () => (attachmentSelectorModalShow.value = true),
|
||||
language: lang,
|
||||
codeBlockPreview: codeBlockPreview
|
||||
}))
|
||||
codeBlockPreview: codeBlockPreview,
|
||||
})
|
||||
|
||||
);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
Loading…
Reference in New Issue