增加因式分解相关图谱

resources/views/filament/pages/simulated-grading.blade.php

@@ -421,70 +421,7 @@
     @endif
 </div>
 
-{{-- 最简单的 Livewire 调试脚本 --}}
-<script>
-    document.addEventListener('DOMContentLoaded', function() {
-        console.log('页面加载完成，开始调试 Livewire');
 
-        setTimeout(() => {
-            if (typeof window.Livewire !== 'undefined') {
-                console.log('✅ Livewire 找到了');
-
-                // 查找所有 wire:click 元素
-                const wireClickElements = document.querySelectorAll('[wire\\:click]');
-                console.log(`找到 ${wireClickElements.length} 个 wire:click 元素:`);
-
-                wireClickElements.forEach((el, i) => {
-                    console.log(`  ${i+1}. ${el.textContent.trim()} -> ${el.getAttribute('wire:click')}`);
-                });
-
-                // 查找测试按钮
-                const testButtons = document.querySelectorAll('[wire\\:click*="test"], [wire\\:click*="increment"]');
-                console.log(`找到 ${testButtons.length} 个测试按钮:`);
-
-                testButtons.forEach((btn, i) => {
-                    console.log(`测试按钮 ${i+1}: ${btn.textContent.trim()}`);
-
-                    // 检查是否被禁用
-                    const disabled = btn.hasAttribute('disabled') || btn.disabled;
-                    console.log(`  状态: ${disabled ? '禁用' : '正常'}`);
-                });
-
-                // 检查 Livewire 组件
-                if (window.Livewire.components) {
-                    const componentKeys = Object.keys(window.Livewire.components.componentsById || {});
-                    console.log(`Livewire 组件数量: ${componentKeys.length}`);
-
-                    if (componentKeys.includes('simulated-grading')) {
-                        const component = window.Livewire.components.componentsById['simulated-grading'];
-                        console.log('SimulatedGrading 组件数据:', {
-                            studentId: component.data.studentId,
-                            exerciseHistory: component.data.exerciseHistory,
-                            historyCurrentPage: component.data.historyCurrentPage,
-                            historyPerPage: component.data.historyPerPage,
-                            historyTotal: component.data.historyTotal,
-                            historyTotalPages: component.data.historyTotalPages,
-                            hasHistory: component.data.exerciseHistory && component.data.exerciseHistory.length > 0
-                        });
-                    }
-                }
-
-            } else {
-                console.error('❌ Livewire 未找到');
-                console.log('检查全局变量:', {
-                    'window.Livewire': typeof window.Livewire,
-                    'window.livewire': typeof window.livewire,
-                    'window.Alpine': typeof window.Alpine
-                });
-            }
-        }, 2000);
-    });
-
-    // 监听通知事件
-    document.addEventListener('notify', (event) => {
-        console.log('🔔 收到通知:', event.detail);
-    });
-</script>
 
 <x-math-render />
 

resources/views/public/knowledge-mindmap.blade.php

@@ -8,7 +8,7 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700&display=swap" rel="stylesheet">
     <script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
-    <script src="https://gw.alipayobjects.com/os/lib/antv/g6/5.0.18/dist/g6.min.js"></script>
+    <script src="https://gw.alipayobjects.com/os/lib/antv/g6/4.8.24/dist/g6.min.js"></script>
     <style>
         :root {
             color-scheme: light;
@@ -88,6 +88,7 @@
 
 <script>
         window.knowledgeMindmap = () => ({
+            isTreeGraph: true,
             graph: null,
             treeData: null,
             relationEdges: [],
@@ -103,30 +104,35 @@
                     ['Z'],
                 ];
             },
+            // ... (omitted for brevity, but I need to target the right place)
+
             levelStyles: [
                 {
                     fill: '#0ea5e9',
                     stroke: '#0369a1',
                     labelColor: '#0f172a',
-                    fontSize: 17,
+                    fontSize: 22, // Increased from 17
                     fontWeight: 700,
-                    size: 34,
+                    size: 40, // Increased from 34
+                    lineWidth: 4, // Explicitly set thicker line
                 },
                 {
                     fill: '#e0f2fe',
                     stroke: '#38bdf8',
                     labelColor: '#0f172a',
-                    fontSize: 16,
+                    fontSize: 20, // Increased from 16
                     fontWeight: 700,
-                    size: 30,
+                    size: 36, // Increased from 30
+                    lineWidth: 4,
                 },
                 {
                     fill: '#f1f5f9',
                     stroke: '#cbd5e1',
                     labelColor: '#0f172a',
-                    fontSize: 14,
+                    fontSize: 18, // Increased from 14
                     fontWeight: 600,
-                    size: 26,
+                    size: 32, // Increased from 26
+                    lineWidth: 3.5,
                 },
             ],
             relationStyles: {
@@ -135,12 +141,12 @@
                     curveOffset: 60,
                     style: {
                         stroke: '#2563eb',
-                        lineWidth: 3.4,
+                        lineWidth: 5, // Increased from 3.4
                         lineDash: [8, 6],
                         endArrow: {
                             path: null,
                             fill: '#2563eb',
-                            d: 12,
+                            d: 16, // Increased arrow size
                         },
                         startArrow: false,
                         shadowBlur: 0,
@@ -153,12 +159,12 @@
                     curveOffset: 60,
                     style: {
                         stroke: '#dc2626',
-                        lineWidth: 3.4,
+                        lineWidth: 5, // Increased from 3.4
                         lineDash: [8, 6],
                         endArrow: {
                             path: null,
                             fill: '#dc2626',
-                            d: 12,
+                            d: 16,
                         },
                         startArrow: false,
                         shadowBlur: 0,
@@ -172,11 +178,11 @@
                     style: {
                         stroke: '#64748b',
                         lineDash: [6, 6],
-                        lineWidth: 3,
+                        lineWidth: 4, // Increased from 3
                         endArrow: {
                             path: null,
                             fill: '#64748b',
-                            d: 10,
+                            d: 14,
                         },
                         shadowBlur: 0,
                         shadowColor: undefined,
@@ -188,12 +194,12 @@
                     curveOffset: 50,
                     style: {
                         stroke: '#fcd34d',
-                        lineWidth: 3,
+                        lineWidth: 4, // Increased from 3
                         lineDash: [10, 8],
                         endArrow: {
                             path: null,
                             fill: '#fbbf24',
-                            d: 10,
+                            d: 14,
                         },
                         shadowBlur: 0,
                         shadowColor: undefined,
@@ -205,12 +211,12 @@
                     curveOffset: 50,
                     style: {
                         stroke: '#94a3b8',
-                        lineWidth: 3,
+                        lineWidth: 4, // Increased from 3
                         lineDash: [10, 8],
                         endArrow: {
                             path: null,
                             fill: '#94a3b8',
-                            d: 10,
+                            d: 14,
                         },
                         shadowBlur: 0,
                         shadowColor: undefined,
@@ -231,7 +237,7 @@
                     Object.keys(this.relationStyles).forEach((key) => {
                         const rel = this.relationStyles[key];
                         if (rel?.style && rel.style.endArrow && !rel.style.endArrow.path) {
-                            rel.style.endArrow.path = this.arrow(rel.style.endArrow.d || 10, (rel.style.endArrow.d || 10) + 2, 4);
+                            rel.style.endArrow.path = this.arrow(rel.style.endArrow.d || 14, (rel.style.endArrow.d || 14) + 4, 6);
                         }
                     });
                     await this.loadData();
@@ -318,6 +324,7 @@
                 });
                 return normalized;
             },
+
             renderGraph(containerEl = null) {
                 if (!this.treeData) return;
                 const container = containerEl || document.getElementById('knowledge-mindmap');
@@ -348,6 +355,7 @@
                     tooltipEl.style.display = 'none';
                     tooltipEl.innerHTML = '';
                 };
+
                 const G6Lib = window.G6?.default || window.G6;
                 const TreeGraphClass = G6Lib?.TreeGraph || null;
                 if (!TreeGraphClass) {
@@ -379,50 +387,50 @@
                     layout: {
                         type: 'mindmap',
                         direction: 'H',
-                        getHeight: () => 32,
+                        getHeight: () => 40, // Increased from 32
                         getWidth: () => 140,
                         getVGap: () => 32,
-                        getHGap: () => 110,
+                        getHGap: () => 60, // Decreased from 110
                     },
                     defaultNode: {
-                        size: 22,
+                        size: 26, // Increased from 22
                         style: {
                             stroke: '#94a3b8',
                             fill: '#fff',
                             radius: 4,
                             shadowColor: undefined,
                             shadowBlur: 0,
-                            lineWidth: 3,
+                            lineWidth: 4, // Increased from 3
                         },
                         labelCfg: {
                             style: {
-                                fontSize: 13,
+                                fontSize: 16, // Increased from 13
                                 fill: '#0f172a',
-                                fontWeight: 500,
+                                fontWeight: 600, // Increased weight
                             },
                             position: 'right',
-                            offset: 12,
+                            offset: 14,
                         },
                     },
                     defaultEdge: {
                         type: 'cubic-horizontal',
                         style: {
                             stroke: '#cbd5f5',
-                            lineWidth: 3,
+                            lineWidth: 4, // Increased from 3
                             shadowBlur: 0,
                             shadowColor: undefined,
                         },
                     },
                     nodeStateStyles: {
                         selected: {
-                            lineWidth: 3.2,
+                            lineWidth: 4.5, // Increased
                             stroke: '#2563eb',
                             fill: '#e0f2fe',
                         },
                     },
                     edgeStateStyles: {
                         highlight: {
-                            lineWidth: 3.4,
+                            lineWidth: 5, // Increased
                             stroke: '#fb923c',
                         },
                     },
@@ -499,20 +507,20 @@
             getNodeLevelStyle(depth = 0) {
                 const style = this.levelStyles[depth] || this.levelStyles[this.levelStyles.length - 1];
                 return {
-                    size: style.size || 22,
+                    size: style.size || 26, // Increased default
                     nodeStyle: {
                         fill: style.fill || '#fff',
                         stroke: style.stroke || '#cbd5f5',
-                        lineWidth: 3,
+                        lineWidth: style.lineWidth || 4, // Increased default
                         radius: 6,
                         shadowColor: undefined,
                         shadowBlur: 0,
                     },
                     labelCfg: {
                         position: 'right',
-                        offset: 12,
+                        offset: 14, // Increased offset
                         style: {
-                            fontSize: style.fontSize || 13,
+                            fontSize: style.fontSize || 16, // Increased default
                             fontWeight: style.fontWeight || 600,
                             fill: style.labelColor || '#0f172a',
                         },
@@ -556,6 +564,11 @@
                 };
                 if (this.isTreeGraph && (canAddEdge || canAddItem)) {
                     this.relationEdges.forEach((edge, index) => {
+                        // 检查节点是否存在
+                        if (!this.graph.findById(edge.source) || !this.graph.findById(edge.target)) {
+                            // console.warn(`Edge skipped: ${edge.source} -> ${edge.target} (node missing)`);
+                            return;
+                        }
                         const model = buildModel(edge, index);
                         if (canAddEdge) {
                             this.graph.addEdge(model);