fix(parser)：添加 divider 解析

src/assets/css/mys-parser.css

@@ -0,0 +1,89 @@
+/*
+ * @description 米游社解析 css
+ * @since Alpha v0.1.1
+ */
+.mys-post-body {
+	margin: 20px auto;
+	width: 800px;
+	font-family: "Genshin", serif;
+}
+
+.mys-post-div {
+	margin: 20px auto;
+}
+
+.mys-post-span {
+	line-height: 2;
+}
+
+.mys-post-link {
+	color: #00c3ff;
+	text-decoration: none;
+}
+
+.mys-post-divider {
+	margin: 20px auto;
+}
+
+.mys-post-divider img {
+	width: 800px;
+	height: auto;
+}
+
+.mys-post-img {
+	width: 800px;
+	height: auto;
+	border-radius: 10px;
+}
+
+.mys-post-vod {
+	width: 800px;
+	height: 450px;
+}
+
+.mys-post-link-card {
+	width: 800px;
+	height: 200px;
+	padding: 10px;
+	border-radius: 10px;
+	display: flex;
+	background: #e1e1e1;
+}
+
+.mys-post-link-card-cover {
+	width: 180px;
+	height: 180px;
+	border-radius: 10px;
+}
+
+.mys-post-link-card-cover img {
+	width: 180px;
+	height: 180px;
+	border-radius: 10px;
+}
+
+.mys-post-link-card-content {
+	width: 100%;
+	padding-left: 20px;
+	height: 180px;
+}
+
+.mys-post-link-card-title {
+	font-size: 20px;
+	color: black;
+	height: 150px;
+}
+
+.mys-post-link-card-price {
+	font-size: 20px;
+	color: #ff667f;
+	display: inline-block;
+}
+
+.mys-post-link-card-btn {
+	display: inline-block;
+	float: right;
+	color: #00c3ff;
+	margin-right: 20px;
+	text-decoration: none;
+}

src/assets/index.css

@@ -1,80 +1,5 @@
 @import "fonts/index.css";
-
+@import "css/mys-parser.css";
-/*
- * @description 米游社解析 css
- * @since Alpha v0.1.1
- */
-.mys-post-body {
-	margin: 20px auto;
-	width: 800px;
-	font-family: "Genshin", serif;
-}
-
-.mys-post-div {
-	margin: 20px auto;
-}
-
-.mys-post-span {
-	line-height: 2;
-}
-
-.mys-post-img {
-	width: 800px;
-	height: auto;
-	border-radius: 10px;
-}
-
-.mys-post-vod {
-	width: 800px;
-	height: 450px;
-}
-
-.mys-post-link-card {
-	width: 800px;
-	height: 200px;
-	padding: 10px;
-	border-radius: 10px;
-	display: flex;
-	background: #e1e1e1;
-}
-
-.mys-post-link-card-cover {
-	width: 180px;
-	height: 180px;
-	border-radius: 10px;
-}
-
-.mys-post-link-card-cover img {
-	width: 180px;
-	height: 180px;
-	border-radius: 10px;
-}
-
-.mys-post-link-card-content {
-	width: 100%;
-	padding-left: 20px;
-	height: 180px;
-}
-
-.mys-post-link-card-title {
-	font-size: 20px;
-	color: black;
-	height: 150px;
-}
-
-.mys-post-link-card-price {
-	font-size: 20px;
-	color: #ff667f;
-	display: inline-block;
-}
-
-.mys-post-link-card-btn {
-	display: inline-block;
-	float: right;
-	color: #00c3ff;
-	margin-right: 20px;
-	text-decoration: none;
-}
 
 /*
  * @description 米游社解析 json

src/plugins/Mys/interface/post.ts

@@ -237,7 +237,8 @@ export interface PostStat {
  * @property {object} insert.fold 折叠内容
  * @property {string} insert.fold.title 折叠标题，反序列化后为 PostStructuredContent[]
  * @property {string} insert.fold.content 折叠文本，反序列化后为 PostStructuredContent[]
- * @property {PostStructuredContentLinkCard} link_card 链接卡片
+ * @property {PostStructuredContentLinkCard} insert.link_card 链接卡片
+ * @property {string} insert.divider 分割线
  * @property {object} attributes 属性
  * @property {number} attributes.height 高度
  * @property {number} attributes.width 宽度
@@ -259,6 +260,7 @@ export interface PostStructuredContent {
 					content: string;
 				};
 				link_card?: PostStructuredContentLinkCard;
+				divider?: string;
 		  }
 		| string;
 	attributes?: {

src/plugins/Mys/utils/parser.ts

@@ -45,7 +45,10 @@ function ParserTransfer(data: PostStructuredContent): HTMLDivElement | HTMLSpanE
 		return BackupTextParser(data);
 	} else if (data.insert.link_card) {
 		return LinkCardParser(data);
+	} else if (data.insert.divider) {
+		return DividerParser(data);
 	} else {
+		console.log(data);
 		throw new Error("Unknown data.insert type");
 	}
 }
@@ -68,11 +71,7 @@ function TextParser(data: PostStructuredContent): HTMLSpanElement {
 		if (data.attributes.bold) text.style.fontWeight = "bold";
 		if (data.attributes.color) text.style.color = data.attributes.color;
 		if (data.attributes.link) {
-			const a = document.createElement("a");
+			return LinkTextParser(data);
-			a.href = data.attributes.link;
-			a.target = "void(0)";
-			a.innerText = data.insert;
-			return a;
 		}
 	}
 	// 添加 class
@@ -83,6 +82,69 @@ function TextParser(data: PostStructuredContent): HTMLSpanElement {
 	return text;
 }
 
+/**
+ * @description 解析链接
+ * @since Alpha v0.1.1
+ * @param {PostStructuredContent} data Mys数据
+ * @returns {HTMLSpanElement} 解析后的链接
+ */
+function LinkTextParser(data: PostStructuredContent): HTMLSpanElement {
+	// 检查数据
+	if (typeof data.insert !== "string") {
+		throw new Error("data.insert is not a string");
+	}
+	if (!data.attributes) {
+		throw new Error("data.attributes is not defined");
+	}
+	if (!data.attributes.link) {
+		throw new Error("data.attributes.link is not defined");
+	}
+	// 创建图标
+	const icon = document.createElement("i");
+	icon.classList.add("mdi", "mdi-link-variant");
+	// 创建链接
+	const link = document.createElement("a");
+	link.classList.add("mys-post-link");
+	link.href = data.attributes.link;
+	link.target = "view_window";
+	link.innerText = data.insert;
+	// 插入图标作为链接前缀
+	link.prepend(icon);
+	// 返回链接
+	return link;
+}
+
+/**
+ * @description 解析分割线
+ * @since Alpha v0.1.1
+ * @param {PostStructuredContent} data Mys数据
+ * @returns {HTMLDivElement} 解析后的分割线
+ */
+function DividerParser(data: PostStructuredContent): HTMLDivElement {
+	// 数据检查
+	if (typeof data.insert === "string") {
+		throw new Error("data.insert is a string");
+	}
+	if (!data.insert.divider) {
+		throw new Error("data.insert.divider is not defined");
+	}
+	// 创建分割线
+	const div = document.createElement("div");
+	div.classList.add("mys-post-divider");
+	// 创建 img
+	const img = document.createElement("img");
+	if (data.insert.divider === "line_2") {
+		img.src =
+			"https://mihoyo-community-web.oss-cn-shanghai.aliyuncs.com/upload/2021/01/05/477d4c535e965bec1791203aecdfa8e6.png";
+	} else {
+		throw new Error("Unknown divider type");
+	}
+	// 插入 img
+	div.appendChild(img);
+	// 返回分割线
+	return div;
+}
+
 /**
  * @description 解析图片
  * @since Alpha v0.1.1
@@ -259,7 +321,7 @@ function LinkCardParser(data: PostStructuredContent): HTMLDivElement {
 	button.classList.add("mys-post-link-card-btn");
 	button.innerHTML = data.insert.link_card.button_text + " >";
 	button.href = data.insert.link_card.origin_url;
-	button.target = "void(0)";
+	button.target = "view_window";
 	// 插入 button
 	content.appendChild(button);
 	// 插入 content