perf: 流程图只读模式下的样式

src/components/office/Drawio.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="drawio-content">
+  <div class="drawio-content" :style="{'top': readOnly ? '0': '2.5rem'}">
     <div class="drawio-title">
       <span class="drawio-title-name" :style="{'color': saved ? '': '#ff8200'}">{{title}}</span>
-      <span  class="drawio-save"><el-button v-if="!saved" @click="save" size="mini" :loading="updating">保存</el-button></span>
+      <span  class="drawio-save"><el-button v-if="!saved" @click="save" size="mini" :loading="saveBtnUpdating">保存</el-button></span>
     </div>
     <iframe ref="myFlow" class="drawio-iframe" :src="url" :title="file.name"></iframe>
   </div>
@@ -10,6 +10,7 @@
 
 <style lang="scss" scoped>
 .drawio-content {
+  z-index: 999;
   position: absolute;
   top: 2.5rem;
   left: 0;
@@ -81,6 +82,7 @@ export default {
       url: null,
       bakData: '',
       xml: '',
+      saveBtnUpdating: false,
       title: this.file.name,
       saved: true
     }
@@ -107,7 +109,11 @@ export default {
           return
         }
         this.xml = ''
-        api.previewText({
+        let request = 'previewText'
+        if(this.readOnly){
+          request = 'sharePreviewText'
+        }
+        api[request]({
           shareId: this.shareId,
           fileId: this.file.id,
           id: this.file.id,
@@ -142,21 +148,21 @@ export default {
       this.update(this.xml)
     },
     update(value) {
-      this.updating = true
+      this.saveBtnUpdating = true
       txtApi.editMarkdownByPath({
         relativePath: encodeURI(this.file.path + this.file.name),
         userId: this.$store.state.user.userId,
         username: this.$store.state.user.name,
         contentText: value
       }).then(() => {
-        this.updating = false
+        this.saveBtnUpdating = false
         this.$message({
           message: "保存成功",
           type: 'success',
           duration : 1000
         })
       }).catch(() => {
-        this.updating = false
+        this.saveBtnUpdating = false
       })
     },
     handleMessage(event) {

src/components/preview/OfficePreview.vue

@@ -17,7 +17,7 @@
           </div>
           <div class="wrapper">
             <pdf-preview v-if="fileType === 'pdf'" :file="file" :shareId="shareId" :file-url="fileUrl" @onReady="onReady"></pdf-preview>
-            <drawio v-else-if="fileType === 'drawio'" :file="file" :read-only="readOnly" @onEdit="onEdit" @onReady="onReady"></drawio>
+            <drawio v-else-if="fileType === 'drawio'" :file="file" :shareId="shareId" :read-only="readOnly" @onEdit="onEdit" @onReady="onReady"></drawio>
             <only-office-editor ref="officeEditor" v-else :file="file" :file-url="fileUrl" :read-only="readOnly" @onEdit="onEdit" @manualSave="manualSave" @onClose="close" @onReady="onReady"></only-office-editor>
           </div>
         </div>
@@ -248,6 +248,7 @@ export default {
   z-index: 2001;
 
   .close-bar {
+    z-index: 2000;
     background-color: rgba(0,0,0,.5);
     position: relative;
     top: -2.5rem;

src/views/public/share/shareList.vue

@@ -936,7 +936,7 @@
             return
           }
           // office文件
-          if (row.contentType.indexOf('office') > -1 || row.suffix === 'csv' || row.suffix === 'pdf') {
+          if (row.contentType.indexOf('office') > -1 || ['pdf','csv','drawio'].includes(row.suffix)) {
             // office文件
             this.officePreviewVisible = true
             this.officePreviewRow = row