From 54d90504833836becfc6e7abb5f504c269bb253f Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <xiaojunnuo@qq.com>
Date: Fri, 12 Jul 2024 19:23:47 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=B1:=20[client]=20sync=20upgrade=20wit?=
 =?UTF-8?q?h=202=20commits=20[trident-sync]?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

perf: 优化editorwang示例
---
 .../src/views/crud/component/editor/crud.tsx  |  7 ++-
 .../views/crud/component/editor/editor.css    | 52 +++++++++++++++++++
 2 files changed, 58 insertions(+), 1 deletion(-)
 create mode 100644 packages/ui/certd-client/src/views/crud/component/editor/editor.css

diff --git a/packages/ui/certd-client/src/views/crud/component/editor/crud.tsx b/packages/ui/certd-client/src/views/crud/component/editor/crud.tsx
index 716e3a48..5b0b7d22 100644
--- a/packages/ui/certd-client/src/views/crud/component/editor/crud.tsx
+++ b/packages/ui/certd-client/src/views/crud/component/editor/crud.tsx
@@ -1,7 +1,7 @@
 import * as api from "./api";
 import { utils, dict, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, UserPageQuery, UserPageRes, EditReq, DelReq, AddReq, ScopeContext } from "@fast-crud/fast-crud";
 import { FsUploaderFormOptions } from "@fast-crud/fast-extends";
-
+import "./editor.css";
 export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
   const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
     return await api.GetList(query);
@@ -79,6 +79,11 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
             show: false
           },
           type: "editor-wang5", // 富文本图片上传依赖file-uploader，请先配置好file-uploader
+          viewForm: {
+            render({ value }) {
+              return <div class={"editor-content-view"} v-html={value}></div>;
+            }
+          },
           form: {
             helper: "示例已升级到wangEditor5版本，原来的editor-wang目前仍然可以使用，后续fs升级可能会将其删除，请尽快升级到editor-wang5版本",
             col: { span: 24 },
diff --git a/packages/ui/certd-client/src/views/crud/component/editor/editor.css b/packages/ui/certd-client/src/views/crud/component/editor/editor.css
new file mode 100644
index 00000000..5666c316
--- /dev/null
+++ b/packages/ui/certd-client/src/views/crud/component/editor/editor.css
@@ -0,0 +1,52 @@
+.editor-content-view {
+    /*border: 1px solid #ccc;*/
+    /*border-radius: 5px;*/
+    padding: 0 10px;
+    margin-top: 20px;
+    overflow-x: auto;
+}
+
+.editor-content-view p,
+.editor-content-view li {
+    white-space: pre-wrap; /* 保留空格 */
+}
+
+.editor-content-view blockquote {
+    border-left: 8px solid #d0e5f2;
+    padding: 10px 10px;
+    margin: 10px 0;
+    background-color: #f1f1f1;
+}
+
+.editor-content-view code {
+    font-family: monospace;
+    background-color: #eee;
+    padding: 3px;
+    border-radius: 3px;
+}
+.editor-content-view pre>code {
+    display: block;
+    padding: 10px;
+}
+
+.editor-content-view table {
+    border-collapse: collapse;
+}
+.editor-content-view td,
+.editor-content-view th {
+    border: 1px solid #ccc;
+    min-width: 50px;
+    height: 20px;
+}
+.editor-content-view th {
+    background-color: #f1f1f1;
+}
+
+.editor-content-view ul,
+.editor-content-view ol {
+    padding-left: 20px;
+}
+
+.editor-content-view input[type="checkbox"] {
+    margin-right: 5px;
+}
\ No newline at end of file