zc

package.json

@@ -64,6 +64,7 @@
     "js-md5": "^0.7.3",
     "jsencrypt": "3.0.0-rc.1",
     "jszip": "^3.10.1",
+    "mathjax": "^3.2.2",
     "mpegts.js": "^1.7.3",
     "mqtt": "^4.2.8",
     "npm": "^8.3.0",

public/index.html

@@ -707,4 +707,19 @@
   <!--<script src="./xgPlayer/xgplayer.js" charset="utf-8"></script>-->
   <!--<script src="./xgPlayer/xgplayer-hls.js" charset="utf-8"></script>-->
   <script src="./h5player/h5player.min.js" charset="utf-8"></script>
+  <!-- MathJax 3 用于渲染 LaTeX 公式 -->
+  <script>
+    window.MathJax = {
+      tex: {
+        inlineMath: [['\\(', '\\)']],
+        displayMath: [['$$', '$$']],
+        processEscapes: true
+      },
+      options: {
+        skipHtmlTags: ['script', 'noscript', 'style', 'textarea', 'pre']
+      },
+      startup: { typeset: false }
+    }
+  </script>
+  <script src="./mathjax/tex-svg.js"></script>
 </html>

src/views/safetyEducationExaminationNew/questionBankManagement/questionBankManagement/addPage.vue

@@ -67,7 +67,12 @@
         </div>
         <div class="editor-form-box edde">
           <el-form-item label="" prop="data5" label-width="0">
-
+            <tinymce-container
+              v-model="newData.data5"
+              :height="300"
+              :upload-url="editorUploadUrl"
+              :upload-headers="editorUploadHeaders"
+            />
           </el-form-item>
         </div>
         <div class="title-content-box">
@@ -94,8 +99,11 @@
   //import { getDicts } from "@/api/commonality/noPermission";
   //import { systemUserSelect } from "@/api/commonality/permission";
   import { examElKnowledgePointTreeList, } from "@/api/safetyEducationExaminationNew/index";
+  import TinymceContainer from "@/components/tinymceContainer/index.vue";
+  import { getToken } from "@/utils/auth";
   export default {
     name: 'addPage',
+    components: { TinymceContainer },
     props: {
       propsData: {}
     },
@@ -115,6 +123,11 @@
           data8:"",
           data9:"",
         },
+        // 编辑器图片/附件上传接口，按需修改
+        editorUploadUrl: this.uploadUrl(),
+        editorUploadHeaders: {
+          Authorization:getToken(),
+        },
         rules:{
           data1: [
             { required: true, message: "请选择试题类型", trigger: "blur" },

vue.config.js

@@ -99,7 +99,18 @@ module.exports = {
       alias: {
         '@': resolve('src')
       }
-    }
+    },
+    plugins: [
+      new (require('copy-webpack-plugin'))([
+        { from: resolve('node_modules/tinymce/skins'),                        to: 'tinymce/skins' },
+        { from: resolve('node_modules/tinymce/icons'),                        to: 'tinymce/icons' },
+        { from: resolve('node_modules/tinymce/models'),                       to: 'tinymce/models' },
+        { from: resolve('node_modules/tinymce/plugins/emoticons/js'),         to: 'tinymce/plugins/emoticons/js' },
+        { from: resolve('public/tinymce/langs'),                              to: 'tinymce/langs' },
+        { from: resolve('node_modules/mathjax/es5/tex-svg.js'),               to: 'mathjax/tex-svg.js' },
+        { from: resolve('node_modules/mathjax/es5/output/svg'),               to: 'mathjax/output-svg' },
+      ])
+    ]
   },
   chainWebpack(config) {
     config.plugins.delete('preload') // TODO: need test