技术监督新增查看功能

src/views/pqs/database/algorithm/components/form.vue

@@ -42,7 +42,7 @@
     </el-dialog>
 </template>
 <script lang="ts" setup>
-import { ref, inject } from 'vue'
+import { ref, nextTick } from 'vue'
 import { reactive } from 'vue'
 import { ElMessage } from 'element-plus'
 import { queryAllAlgorithmLibrary, addAlgorithm, updateAlgorithmLibrary } from '@/api/supervision-boot/database/index'
@@ -53,6 +53,7 @@ const title = ref('')
 const formRef = ref()
 const loading = ref(false)
 const dataTree = ref([])
+const key = ref(0)
 const TreeList: any = ref({})
 const List = ref({})
 const defaultProps = {
@@ -82,16 +83,20 @@ const cycle = [
     { value: '3', label: '年' }
 ]
 const changeTree = (row: any) => {
+    console.log("🚀 ~ changeTree ~ row:", row)
     TreeList.value = row
     if (title.value == '修改算法') {
         if (row.level != 4) {
             form.name = row.name
+
         } else {
             for (let key in form) {
                 form[key] = row[key]
             }
         }
+
         form.id = row.id
+        key.value += 1
     }
 }
 
@@ -101,15 +106,20 @@ const open = (row: any) => {
     List.value = row.row
     getTheTree()
     // 在此处恢复默认表单
-    for (let key in form) {
-        form[key] = ''
-    }
-    if (row.title == '修改算法') {
-        form.pid = row.row.id
-        TreeList.value = row.row
-        changeTree(row.row)
-        // row.row
-    }
+    nextTick(() => {
+        for (let key in form) {
+            form[key] = ''
+        }
+        if (row.title == '修改算法') {
+
+            form.pid = row.row.id
+            TreeList.value = row.row
+            changeTree(row.row)
+
+            // row.row
+        }
+    })
+    formRef.value?.resetFields()
 }
 const submit = async () => {
     loading.value = true
@@ -123,7 +133,7 @@ const submit = async () => {
                     forms.name = form.name
                     forms.pid = form.pid
                 }
-                await  addAlgorithm(forms).then(res => {
+                await addAlgorithm(forms).then(res => {
                     ElMessage.success('新增成功')
                     dialogVisible.value = false
                     emit('getTree')
@@ -131,7 +141,7 @@ const submit = async () => {
             } else {
                 let forms: any = {}
                 if (TreeList.value.level == 4) {
-                    forms = form
+                    forms = JSON.parse(JSON.stringify(form))
                 } else {
                     forms.name = form.name
                     forms.id = form.id
@@ -146,8 +156,9 @@ const submit = async () => {
         }
     })
     await setTimeout(() => {
-        loading.value=false 
-    },0)
+
+        loading.value = false
+    }, 0)
 }
 const getTheTree = () => {
     queryAllAlgorithmLibrary().then(res => {

src/views/pqs/database/algorithm/index.vue

@@ -82,7 +82,7 @@
             @getTree="treeRef.loadData(dotList.id), (popupEditFlag = false)" />
         <!-- 定义 -->
         <el-dialog v-model="viewFlag" title="定义" width="60%">
-            <div class="editor" v-html="summary" style="min-height: 300px;" />
+            <div class="editor" ref="editorRef" v-html="summary" style="min-height: 300px;" />
         </el-dialog>
         <!-- 删除 -->
         <el-dialog v-model="dialogVisible" title="请选择需要删除的数据" width="400">
@@ -112,6 +112,8 @@ import { ElMessage, ElMessageBox } from 'element-plus'
 import { deleteyById } from '@/api/supervision-boot/database/index'
 import { queryAllAlgorithmLibrary, updateAlgorithmLibrary } from '@/api/supervision-boot/database/index'
 import { useAdminInfo } from '@/stores/adminInfo'
+import katex from "katex";
+import "katex/dist/katex.css";
 const adminInfo = useAdminInfo()
 defineOptions({
     name: 'database/algorithm'
@@ -121,6 +123,7 @@ const height = mainHeight(20)
 const heightTab = mainHeight(82)
 const size = ref(0)
 const addTreeRef = ref()
+const editorRef = ref()
 const dialogVisible = ref(false)
 const viewFlag = ref(false)
 const popupEditFlag = ref(false)
@@ -207,9 +210,31 @@ onMounted(() => {
 })
 
 const view = (row: any) => {
+
     viewFlag.value = true
     summary.value = row.definition
+    setTimeout(() => {
+
+        const spans = document.querySelectorAll('span[data-value]');
+        // 遍历每个 span 标签  
+        spans.forEach(function (span) {
+
+            let val = katex.renderToString(span.getAttribute('data-value'), {
+                throwOnError: false,
+            })
+            // var newDiv = document.createElement('div');
+            var newDiv = span
+            newDiv.innerHTML = val;
+
+            span.parentNode.replaceChild(newDiv, span);
+        });
+        
+    }, 100)
+
+    // 
 }
+
+
 const handleNodeClick = (data: any, node: any) => {
     if (data.pid != '0') {
         dotList.value = data