support code view

src/components/markdown-view/index.vue

@@ -14,6 +14,7 @@ defineOptions({
 });
 
 const props = withDefaults(defineProps<{
+	code?: string;
 	content?: string;
 	showCodeBorder?: boolean;
 	maxHeight?: string;
@@ -25,13 +26,27 @@ const props = withDefaults(defineProps<{
 const { content } = toRefs(props);
 const markdownHTML = ref("");
 
+const buildMarkdown = () => {
+	if (props.code) {
+		const codeRaw = props.code ?? "";
+		const sepIndex = codeRaw.indexOf(":");
+		const lang = sepIndex < 0 ? "" : codeRaw.slice(0, sepIndex).trim();
+		const codeText = sepIndex < 0 ? codeRaw : codeRaw.slice(sepIndex + 1);
+		const langTag = lang ? lang : "";
+
+		return `\`\`\`${langTag}\n${codeText}\n\`\`\``;
+	}
+	return content.value;
+};
+
 const doRender = async () => {
-	markdownHTML.value = await Markdown.getInstance().toHTML(content.value);
+	const markdownText = buildMarkdown();
+	markdownHTML.value = await Markdown.getInstance().toHTML(markdownText);
 	await nextTick();
 	Prism.highlightAll();
 };
 
-watch(() => props.content, doRender);
+watch(() => [props.code, props.content], doRender);
 onMounted(doRender);
 </script>
 <style lang="less" scoped>

src/utils/Toolkit.ts

@@ -423,4 +423,11 @@ export default class Toolkit {
 			}
 		}, interval);
 	}
+
+	public static formatJson(jsonStr?: string): string {
+		if (!jsonStr) {
+			return "";
+		}
+		return JSON.stringify(JSON.parse(jsonStr), null, 4);
+	}
 }