bpmnProcessDesigner 修改 xml、json 预览，使用老版本的 highlight

YunaiV
1 parent 490f907a
Showing 2 changed files with 14 additions and 5 deletions
yudao-admin-ui/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
yudao-admin-ui/src/views/tool/codegen/index.vue
@@ -80,8 +80,8 @@
     <div class="my-process-designer__container">
       <div class="my-process-designer__canvas" ref="bpmn-canvas"></div>
     </div>
-    <el-dialog title="预览" width="60%" :visible.sync="previewModelVisible" append-to-body destroy-on-close>
-      <highlightjs :language="previewType" :code="previewResult" />
+    <el-dialog title="预览" width="80%" :visible.sync="previewModelVisible" append-to-body destroy-on-close>
+      <pre><code class="hljs" v-html="highlightedCode(previewType, previewResult)"></code></pre>
     </el-dialog>
   </div>
 </template>
@@ -107,6 +107,12 @@ import flowableModdleExtension from &quot;./plugins/extension-moddle/flowable&quot;;
 // 引入json转换与高亮
 import convert from "xml-js";
+// 代码高亮插件
+import hljs from "highlight.js/lib/highlight";
+import "highlight.js/styles/github-gist.css";
+hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml"));
+hljs.registerLanguage("json", require("highlight.js/lib/languages/json"));
+
 export default {
   name: "MyProcessDesigner",
   componentName: "MyProcessDesigner",
@@ -463,7 +469,12 @@ export default {
       }
       // 触发 save 事件
       this.$emit('save', xml)
-    }
+    },
+    /** 高亮显示 */
+    highlightedCode(previewType, previewResult) {
+      const result = hljs.highlight(previewType, previewResult || "", true);
+      return result.value || '&nbsp;';
+    },
   }
 };
 </script>
@@ -125,8 +125,6 @@ import importTable from &quot;./importTable&quot;;
 // 代码高亮插件
 import hljs from "highlight.js/lib/highlight";
 import "highlight.js/styles/github-gist.css";
-import {SysCommonStatusEnum} from "@/utils/constants";
-import {createTestDemo, updateTestDemo} from "@/api/tool/testDemo";
 hljs.registerLanguage("java", require("highlight.js/lib/languages/java"));
 hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml"));
 hljs.registerLanguage("html", require("highlight.js/lib/languages/xml"));