pref: 优化cherry-markdown toc样式解决 convertImageToDataUri not func BUG (#966)

* feat: 首页项目拖拽排序功能

* feat: 增加首页项目拖拽排序增加只能管理员进行, 排序失败元素回到原本位置

* perf: 新建文章以后直接进入到编辑文章页面

* perf: 优化文档打开时或刷新时样式闪动问题

* perf: 优化表格样式

* feat: 支持上传视频功能

* feat: 视频样式调整

* feat: 直接粘贴视频上传功能

* perf: 优化markdown目录显示

* feat: 项目配置新增是否开启打印功能

* perf: 优化模型自动更新表字段

* perf: 创建项目时增加选择编辑器功能

* perf: 优化cherry-markdown 菜单栏

* perf: 优化项目阅读界面, 新增打开搜索面板快捷键(Ctrl + f), esc恢复到目录快捷键功能

* perf: 优化项目搜索

* perf: 文章TOC样式调整

* feat: 配置管理中增加本地化切换

* feat: 配置管理中增加本地化切换

* fix: 调整页面内copyright的链接为: https://mindoc.com.cn/域名下

* fix: 创建README.md资源

* fix: 创建README.md资源

* fix: README更新

* fix: README更新

* fix: README 地址修改

* fix: 调整cherryMarkdown toc样式 兼容打印样式

fix: 修复 convertImageToDataUri not func

* fix: cherry-markdown 上传附件和样式调整

static/cherry/cherry-markdown.css

@@ -1961,6 +1961,15 @@ div[data-type=codeBlock] .token.inserted {
   transform: rotate(-2deg);
 }
 
+.whole-article-wrap > div {
+  display: flex;
+  flex-direction: column;
+}
+
+.whole-article-wrap > div > .markdown-article {
+  width: calc(100% - 260px);
+}
+
 [data-code-block-theme=coy] div[data-type=codeBlock] pre[class*=language-]:after {
   right: 0.75em;
   left: auto;
@@ -3194,7 +3203,8 @@ div[data-type=codeBlock] .token.inserted {
 }
 
 .cherry-editor .cm-s-default .cm-url {
-  background: #4b4b4b;
+  background: #f8fafb;
+  color: #3582fb;
   font-family: "Menlo", "Liberation Mono", "Consolas", "DejaVu Sans Mono", "Ubuntu Mono", "Courier New", "andale mono", "lucida console", monospace;
   font-size: 0.9em;
 }

static/cherry/cherry-markdown.js

@@ -54950,7 +54950,7 @@
 	      style: ['position: absolute', 'bottom: 30px', 'top: 30px', 'left: 0', 'right: 0', 'overflow: hidden'].join(';')
 	    });
 	    this.foot = createElement('div', 'cherry-dialog--foot', {
-	      style: ['height: 30px', 'line-height: 30px', 'padding-left: 10px', 'padding-right: 10px', 'position: absolute', 'bottom: 0', 'left: 0', 'right: 0'].join(';')
+	      style: ['height: 30px', 'line-height: 18px', 'padding-left: 10px', 'padding-right: 10px', 'position: absolute', 'bottom: 0', 'left: 0', 'right: 0'].join(';')
 	    });
 	    this.headTitle = createElement('span', 'cherry-dialog--title', {
 	      style: 'user-select:none;'

static/cherry/drawio_demo/EditorUi.js

@@ -5745,7 +5745,7 @@ EditorUi.prototype.convertImages = function (svgRoot, callback, imageCache, conv
 		for (var i = 0; i < images.length; i++) {
 			(mxUtils.bind(this, function (img) {
 				var src = converter.convert(img.getAttribute(srcAttr));
-
+				console.log(src)
 				// Data URIs are pass-through
 				if (src != null && src.substring(0, 5) != 'data:') {
 					var tmp = cache[src];
@@ -6059,6 +6059,21 @@ EditorUi.prototype.getBaseFilename = function () {
 };
 
 
+EditorUi.prototype.convertImageToDataUri = function (src, call) {
+	let img = new Image();
+	img.src = src;
+	img.onload = function() {
+		let canvas = document.createElement('canvas');
+		canvas.width = img.width;
+		canvas.height = img.height;
+		let ctx = canvas.getContext('2d');
+		ctx.drawImage(img, 0, 0);
+		let base64 = canvas.toDataURL('image/png');
+		call(base64)
+	};
+}
+
+
 EditorUi.prototype.createImageDataUri = function (canvas, xml, format) {
 	var data = canvas.toDataURL('image/' + format);
 

static/css/markdown.css

@@ -545,18 +545,20 @@ iframe.cherry-dialog-iframe {
 
 .manual-article.cherry-markdown .toc {
     position: fixed;
-    right: 0;
-    width: 200px;
-    margin-top: -70px;
+    right: 50px;
+    width: 260px;
+    font-size: 12px;
     overflow: auto;
-    margin-right: 50px;
+    border: 1px solid #e8e8e8;
+    padding: 10px;
+    border-radius: 6px;
 }
 
-@media screen and (min-width: 840px) {
-    .markdown-article {
-        margin-right: 200px !important;
-    }
-}
+/*@media screen and (min-width: 840px) {*/
+/*    .markdown-article {*/
+/*        margin-right: 200px !important;*/
+/*    }*/
+/*}*/
 
 .markdown-article-head {
     width: unset !important;

static/css/markdown.preview.css

@@ -56,6 +56,20 @@
     flex-direction: column;
 }
 
+/*.content > .whole-article-wrap {*/
+/*    flex-direction: row-reverse;*/
+/*}*/
+
+.content > .whole-article-wrap > .markdown-toc {
+    right: 30px;
+    margin-left: 10px;
+    max-height: 550px;
+}
+
+.content > .whole-article-wrap > .markdown-article {
+    width: 100%;
+}
+
 .article-body .markdown-toc{
     position: fixed;
     right: 50px;
@@ -90,7 +104,7 @@
     /*margin-right: 250px;*/
 }
 .article-body.content .markdown-toc{
-    position: relative;
+    position: fixed;
     margin-top: 0;
 }
 .article-body.content .markdown-article{

static/js/cherry_markdown.js

@@ -630,10 +630,11 @@ function myFileUpload(file, callback) {
         },
         success: function (data) {
             layer.close(layerIndex);
-            if (data[0].errcode !== 0) {
-                layer.msg(data[0].message);
+            // 验证data是否为数组
+            if (data.errcode !== 0) {
+                layer.msg(data.message);
             } else {
-                callback(data[0].url); // 假设返回的 JSON 中包含上传文件的 URL，调用回调函数并传入 URL
+                callback(data.url); // 假设返回的 JSON 中包含上传文件的 URL，调用回调函数并传入 URL
             }
         }
     });

static/js/kancloud.js

@@ -141,6 +141,7 @@ function renderPage($data) {
     $("#article-info").text($data.doc_info);
     $("#view_count").text("阅读次数：" + $data.view_count);
     $("#doc_id").val($data.doc_id);
+    checkMarkdownTocElement();
     if ($data.page) {
         loadComment($data.page, $data.doc_id);
     } else {
@@ -154,7 +155,7 @@ function renderPage($data) {
         $("#view_container").removeClass("theme__dark theme__green theme__light theme__red theme__default")
         $("#view_container").addClass($data.markdown_theme)
     }
-    checkMarkdownTocElement();
+
 }
 
 /***
@@ -442,6 +443,9 @@ function loadCopySnippets() {
 
 function checkMarkdownTocElement() {
     let toc = $(".markdown-toc-list");
+    if ($(".toc").length) {
+        toc = $(".toc");
+    }
     let articleComment = $("#articleComment");
     if (toc.length) {
         $(".wiki-bottom-left").css("width", "calc(100% - 260px)");