feat: 添加 JVM 内存可视化逻辑表格组件

该组件用于展示 JVM 内存管理相关逻辑的状态和配置，支持动态切换逻辑的启用状态，并触发相应的事件通知

Author: nce40202

src/components/jvm-memory-visualizer/LogicTable.vue

@@ -0,0 +1,77 @@
+<template>
+    <div class="logic-table">
+        <a-table :data="logicList" :pagination="false">
+            <template #columns>
+                <a-table-column title="逻辑名称" data-index="name" :width="200" />
+                <a-table-column title="描述" data-index="desc" />
+                <a-table-column title="状态" :width="100">
+                    <template #cell="{ record }">
+                        <template v-if="record.implemented">
+                            <a-switch v-if="record.configurable" v-model="record.enabled"
+                                @change="handleLogicChange(record)">
+                                <template #checked>已启用</template>
+                                <template #unchecked>已禁用</template>
+                            </a-switch>
+                            <span v-else>{{ record.enabled ? '已启用' : '已禁用' }}</span>
+                        </template>
+                        <template v-else>
+                            <span>未实现</span>
+                        </template>
+                    </template>
+                </a-table-column>
+            </template>
+        </a-table>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+interface LogicItem {
+    id: string;
+    name: string;
+    desc: string;
+    enabled: boolean;
+    configurable: boolean;
+    implemented: boolean;
+}
+
+const logicList = ref<LogicItem[]>([
+    {
+        id: 'eden_sweep',
+        name: '优先 Eden 分配',
+        desc: '优先将对象分配到 Eden 区',
+        enabled: true,
+        configurable: false,
+        implemented: true
+    },
+    {
+        id: 'pretenure_size_threshold',
+        name: '大对象直入老年代',
+        desc: '当对象大小超过 Eden 区时，直接在老年代分配（可以通过 -XX:PretenureSizeThreshold 参数配置）',
+        enabled: true,
+        configurable: false,
+        implemented: false
+    },
+    {
+        id: 'dynamic_age_threshold',
+        name: '动态年龄判定',
+        desc: '当 Survivor 区中相同年龄对象大小总和超过 Survivor 区的一半时，年龄大于等于该年龄的对象直接进入老年代',
+        enabled: false,
+        configurable: false,
+        implemented: false
+    }
+]);
+
+const emit = defineEmits(['logicChange']);
+
+const handleLogicChange = (logic: LogicItem) => {
+    emit('logicChange', logic);
+};
+</script>
+
+<style scoped>
+.logic-table {
+    background: white;
+}
+</style>

src/views/MemoryVisualizer.vue

@@ -11,6 +11,9 @@
             <a-form-item>
                 <a-button @click="restartJvm" class="restart-button" :loading="isRestarting">重启 JVM</a-button>
             </a-form-item>
+            <a-form-item>
+                <a-button @click="showLogicTable">内存管理逻辑</a-button>
+            </a-form-item>
         </a-form>
 
         <!-- 对象创建表单 -->
@@ -116,12 +119,18 @@
             </template>
         </a-table>
     </a-modal>
+
+    <!-- 内存管理逻辑弹窗 -->
+    <a-modal v-model:visible="showLogicModal" title="内存管理逻辑" :footer="false" width="1000px">
+        <LogicTable @logicChange="handleLogicChange" />
+    </a-modal>
 </template>
 
 <script setup lang="ts">
 import { ref, computed, onBeforeMount, reactive } from 'vue';
 import { Message } from '@arco-design/web-vue';
 import MemorySpace from '@/components/jvm-memory-visualizer/MemorySpace.vue';
+import LogicTable from '@/components/jvm-memory-visualizer/LogicTable.vue';
 import type { HeapObject } from '@/types';
 
 onBeforeMount(() => {
@@ -135,6 +144,11 @@ onBeforeMount(() => {
 // 重启状态
 const isRestarting = ref(false);
 const showHelpModal = ref(false);
+const showLogicModal = ref(false);
+
+const showLogicTable = () => {
+    showLogicModal.value = true;
+};
 
 const jvmArgsHelp = [
     {
@@ -655,6 +669,10 @@ const toggleGarbageCollectable = (obj: HeapObject) => {
     obj.isGarbageCollectable = !obj.isGarbageCollectable;
     operationLogs.value.unshift(`切换对象 ${obj.name} 的可回收状态为: ${obj.isGarbageCollectable ? '可回收' : '不可回收'}`);
 };
+
+const handleLogicChange = (logic: { id: string; enabled: boolean }) => {
+    operationLogs.value.unshift(`${logic.enabled ? '启用' : '禁用'}逻辑: ${logic.id}`);
+};
 </script>
 
 <style scoped>