From 984c68dc0961d0121fae9f80413777c2889b4143 Mon Sep 17 00:00:00 2001
From: weifashi <605403358@qq.com>
Date: Thu, 7 Sep 2023 15:22:35 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E9=80=82=E9=85=8D=E7=A7=BB?=
 =?UTF-8?q?=E5=8A=A8=E7=AB=AF=E4=B9=9F=E5=8F=AF=E4=BB=A5=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E6=96=87=E4=BB=B6=EF=BC=88.md=20=EF=BC=8C.text=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/MDEditor/assets/css/index.less | 15 ++-
 .../MDEditor/components/pro/index.vue         |  4 +-
 .../js/components/MDEditor/config/tools.js    |  4 +-
 .../assets/js/components/MDEditor/index.vue   |  3 +-
 .../pages/manage/components/FileContent.vue   | 98 ++++++++++++++++++-
 .../pages/manage/components/FileHistory.vue   |  2 +-
 resources/assets/js/pages/manage/file.vue     |  2 +-
 .../sass/pages/components/file-content.scss   |  2 +-
 8 files changed, 116 insertions(+), 14 deletions(-)

diff --git a/resources/assets/js/components/MDEditor/assets/css/index.less b/resources/assets/js/components/MDEditor/assets/css/index.less
index 143c1bf1d..145fea0f6 100644
--- a/resources/assets/js/components/MDEditor/assets/css/index.less
+++ b/resources/assets/js/components/MDEditor/assets/css/index.less
@@ -366,14 +366,14 @@
 
         .codemirror {
             flex: 1;
-            width: 0;
+            width: auto;
             height: 100%;
             overflow: auto;
         }
 
         .markdown-preview {
             flex: 1;
-            width: 0;
+            width: auto;
             height: 100%;
         }
     }
@@ -1035,3 +1035,14 @@ ul.shift {
         opacity: 1;
     }
 }
+
+@media (max-width: 920px) {
+    .markdown {
+        .markdown-content {
+            flex-direction: column;
+        }
+        .toc-anchor,.icon-svg{
+            display: none !important;
+        }
+    }
+}
diff --git a/resources/assets/js/components/MDEditor/components/pro/index.vue b/resources/assets/js/components/MDEditor/components/pro/index.vue
index 1797270fd..3d01afff8 100644
--- a/resources/assets/js/components/MDEditor/components/pro/index.vue
+++ b/resources/assets/js/components/MDEditor/components/pro/index.vue
@@ -118,11 +118,11 @@
             <li v-if="tools.save" :name="$L('保存')" @click="handleSave">
                 <span class="iconfont icon-save"></span>
             </li>
-            <li :name="$L(scrolling ? '同步滚动:开' : '同步滚动:关')">
+            <li v-if="tools.scrolling" :name="$L(scrolling ? '同步滚动:开' : '同步滚动:关')">
                 <span @click="scrolling = !scrolling" v-show="scrolling" class="iconfont icon-on"></span>
                 <span @click="scrolling = !scrolling" v-show="!scrolling" class="iconfont icon-off"></span>
             </li>
-            <li :name="$L('html转markdown')" @click="onCustom('html2md')">
+            <li  v-if="tools.html_to_markdown" :name="$L('html转markdown')" @click="onCustom('html2md')">
                 <span style="width:auto;font-size:14px;padding:0 6px">HTML2MD</span>
             </li>
             <li class="right">
diff --git a/resources/assets/js/components/MDEditor/config/tools.js b/resources/assets/js/components/MDEditor/config/tools.js
index de59c784c..a90f86622 100644
--- a/resources/assets/js/components/MDEditor/config/tools.js
+++ b/resources/assets/js/components/MDEditor/config/tools.js
@@ -32,5 +32,7 @@ export default {
     exportmd: true,
     importmd: true,
     save: false,
-    clear: false
+    clear: false,
+    scrolling: true,
+    html_to_markdown: true,
 }
diff --git a/resources/assets/js/components/MDEditor/index.vue b/resources/assets/js/components/MDEditor/index.vue
index 25ed7909a..90657b6ac 100755
--- a/resources/assets/js/components/MDEditor/index.vue
+++ b/resources/assets/js/components/MDEditor/index.vue
@@ -96,7 +96,6 @@
 <script>
     import MarkdownPro from './pro';
     import ImgUpload from "../ImgUpload";
-    import {mapState} from "vuex";
 
     export default {
         name: 'MDEditor',
@@ -140,6 +139,8 @@
                         importmd: false,
                         save: false,
                         clear: false,
+                        scrolling: true,
+                        html_to_markdown: true,
 
                         custom_image: true,
                         custom_uploadImage: true,
diff --git a/resources/assets/js/pages/manage/components/FileContent.vue b/resources/assets/js/pages/manage/components/FileContent.vue
index 9a11308e5..aa774ff1d 100644
--- a/resources/assets/js/pages/manage/components/FileContent.vue
+++ b/resources/assets/js/pages/manage/components/FileContent.vue
@@ -33,7 +33,7 @@
                         <li v-if="editUser.length > 10" class="more" :title="editUser.length">{{editUser.length > 999 ? '...' : editUser.length}}</li>
                     </ul>
                 </div>
-                <div v-if="file.type=='document' && contentDetail" class="header-hint">
+                <div v-if="file.type=='document' && contentDetail && !windowPortrait" class="header-hint">
                     <ButtonGroup size="small" shape="circle">
                         <Button :type="`${contentDetail.type=='md'?'primary':'default'}`" @click="setTextType('md')">{{$L('MD编辑器')}}</Button>
                         <Button :type="`${contentDetail.type!='md'?'primary':'default'}`" @click="setTextType('text')">{{$L('文本编辑器')}}</Button>
@@ -67,14 +67,22 @@
                             </ETooltip>
                         </EPopover>
                     </div>
-                    <Button :disabled="equalContent" :loading="loadSave > 0" class="header-button" size="small" type="primary" @click="handleClick('save')">{{$L('保存')}}</Button>
+                    <template v-if="windowPortrait && file.type=='document'">
+                        <Button v-if="!edit" class="header-button" size="small" type="primary" @click="edit=true">{{$L('编辑')}}</Button>
+                        <Button v-else-if="edit && equalContent" class="header-button" size="small"  @click="edit=false">{{$L('取消')}}</Button>
+                        <Button v-else :disabled="equalContent" :loading="loadSave > 0" class="header-button" size="small" type="primary" @click="handleClick('save')">{{$L('保存')}}</Button>
+                    </template>
+                    <Button v-else :disabled="equalContent" :loading="loadSave > 0" class="header-button" size="small" type="primary" @click="handleClick('save')">{{$L('保存')}}</Button>
                 </template>
             </div>
             <div class="content-body">
                 <div v-if="historyShow" class="content-mask"></div>
                 <template v-if="file.type=='document'">
-                    <MDEditor v-if="contentDetail.type=='md'" v-model="contentDetail.content" height="100%"/>
-                    <TEditor v-else v-model="contentDetail.content" height="100%" @editorSave="handleClick('saveBefore')"/>
+                    <template v-if="contentDetail.type=='md'">
+                        <MDEditor v-if="edit" v-model="contentDetail.content" height="100%" :toolbars="toolbars"/>
+                        <MDPreview v-else :initialValue="contentDetail.content"/>
+                    </template>
+                    <TEditor v-else :readOnly="!edit" v-model="contentDetail.content" height="100%" @editorSave="handleClick('saveBefore')"/>
                 </template>
                 <Drawio v-else-if="file.type=='drawio'" ref="myFlow" v-model="contentDetail" :title="file.name" @saveData="handleClick('saveBefore')"/>
                 <Minder v-else-if="file.type=='mind'" ref="myMind" v-model="contentDetail" @saveData="handleClick('saveBefore')"/>
@@ -122,6 +130,7 @@ import FileHistory from "./FileHistory";
 import IFrame from "./IFrame";
 
 const MDEditor = () => import('../../../components/MDEditor/index');
+const MDPreview = () => import('../../../components/MDEditor/preview');
 const TEditor = () => import('../../../components/TEditor');
 const AceEditor = () => import('../../../components/AceEditor');
 const OnlyOffice = () => import('../../../components/OnlyOffice');
@@ -130,7 +139,7 @@ const Minder = () => import('../../../components/Minder');
 
 export default {
     name: "FileContent",
-    components: {IFrame, FileHistory, AceEditor, TEditor, MDEditor, OnlyOffice, Drawio, Minder},
+    components: {IFrame, FileHistory, AceEditor, TEditor, MDEditor, OnlyOffice, Drawio, Minder, MDPreview},
     props: {
         value: {
             type: Boolean,
@@ -167,10 +176,13 @@ export default {
 
             historyShow: false,
             officeReady: false,
+
+            edit: false,
         }
     },
 
     mounted() {
+        this.edit = !this.windowPortrait
         document.addEventListener('keydown', this.keySave)
         window.addEventListener('message', this.handleOfficeMessage)
         //
@@ -287,6 +299,81 @@ export default {
             }
             return '';
         },
+
+        toolbars() {
+            return this.windowPortrait ? {
+                strong: true,
+                italic: true,
+                overline: true,
+                h1: true,
+                h2: true,
+                h3: true,
+                h4: false,
+                h5: false,
+                h6: false,
+                hr: true,
+                quote: false,
+                ul: true,
+                ol: true,
+                code: true,
+                link: true,
+                image: false,
+                uploadImage: false,
+                table: true,
+                checked: false,
+                notChecked: false,
+                split: true,
+                preview: false,
+                fullscreen: false,
+                theme: false,
+                exportmd: false,
+                importmd: false,
+                save: false,
+                clear: false,
+                scrolling: false,
+                html_to_markdown: false,
+                custom_image: false,
+                custom_uploadImage: false,
+                custom_uploadFile: false,
+                custom_fullscreen: false,
+            } : {
+                strong: true,
+                italic: true,
+                overline: true,
+                h1: true,
+                h2: true,
+                h3: true,
+                h4: false,
+                h5: false,
+                h6: false,
+                hr: true,
+                quote: true,
+                ul: true,
+                ol: true,
+                code: true,
+                link: true,
+                image: false,
+                uploadImage: false,
+                table: true,
+                checked: true,
+                notChecked: true,
+                split: true,
+                preview: true,
+                fullscreen: false,
+                theme: false,
+                exportmd: false,
+                importmd: false,
+                save: false,
+                clear: false,
+                scrolling: true,
+                html_to_markdown: true,
+
+                custom_image: true,
+                custom_uploadImage: true,
+                custom_uploadFile: true,
+                custom_fullscreen: true,
+            }
+        }
     },
 
     methods: {
@@ -405,6 +492,7 @@ export default {
                             newData.ext = this.fileExt;
                             this.fileExt = null;
                         }
+                        this.edit = this.windowPortrait ? false : true;
                         this.$store.dispatch("saveFile", newData);
                     }).catch(({msg}) => {
                         $A.modalError(msg);
diff --git a/resources/assets/js/pages/manage/components/FileHistory.vue b/resources/assets/js/pages/manage/components/FileHistory.vue
index 2b43d707f..604648f6a 100644
--- a/resources/assets/js/pages/manage/components/FileHistory.vue
+++ b/resources/assets/js/pages/manage/components/FileHistory.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="file-history">
         <Table
-            :width="480"
+            :width="(windowWidth - 40) > 480 ? 480 : (windowWidth - 40)"
             :max-height="windowHeight - 180"
             :columns="columns"
             :data="list"
diff --git a/resources/assets/js/pages/manage/file.vue b/resources/assets/js/pages/manage/file.vue
index b2e2ca26f..bceab7bdc 100644
--- a/resources/assets/js/pages/manage/file.vue
+++ b/resources/assets/js/pages/manage/file.vue
@@ -810,7 +810,7 @@ export default {
         },
 
         isPreview() {
-            return this.windowPortrait || this.fileInfo.permission === 0
+            return (this.windowPortrait && this.fileInfo.type!='document') || this.fileInfo.permission === 0
         },
 
         isParentShare() {
diff --git a/resources/assets/sass/pages/components/file-content.scss b/resources/assets/sass/pages/components/file-content.scss
index 296061654..4f02c4ab8 100644
--- a/resources/assets/sass/pages/components/file-content.scss
+++ b/resources/assets/sass/pages/components/file-content.scss
@@ -319,7 +319,7 @@
         overflow: auto;
         .edit-header,
         .content-body {
-            min-width: 720px;
+            min-width: 375px;
             overflow-x: auto;
             .teditor-loadedstyle {
                 .tox-menubar,