统一名称

AutoRobot/Windows/Robot/Web/src/DockLayout/DockLayout.vue

@@ -47,7 +47,7 @@
     <Render
       v-for="area in floatingAreas"
       :key="area.id"
-      :type="'area'"
+      :type="'Area'"
       :config="area"
       :style="{ zIndex: area.zIndex || zIndexManager.getFloatingAreaZIndex(area.id) }"
       @close="() => onCloseFloatingArea(area.id)"
@@ -277,15 +277,15 @@ const addFloatingPanel = () => {
     // 使用Render期望的children结构
     children: [
       {
-        type: 'tabpage',
+        type: 'TabPage',
         id: `tabpage-${currentId}-1`,
         title: `标签页 1`,
         tabPosition: 'bottom',
         children: {
-          type: 'panel',
+          type: 'Panel',
           items: [
             {
-              type: 'panel',
+              type: 'Panel',
               id: `panel-${currentId}-1-1`,
               title: `面板 ${currentId}`,
               x: 0,
@@ -335,7 +335,7 @@ const onMaximize = (panelId) => {
   for (const area of floatingAreas.value) {
     if (area.children) {
       for (const child of area.children) {
-        if (child.type === 'tabpage' && child.children && child.children.type === 'panel') {
+        if (child.type === 'TabPage' && child.children && child.children.type === 'Panel') {
           const panels = child.children.items || []
           if (panels.length === 1 && panels[0].id === panelId) {
             // 当区域只包含一个Panel时，切换Area和Panel的最大化状态
@@ -393,7 +393,7 @@ const onClosePanel = (areaId, panelId) => {
   const area = floatingAreas.value.find(a => a.id === areaId)
   if (area && area.children) {
     for (const child of area.children) {
-      if (child.type === 'tabpage' && child.children && child.children.type === 'panel') {
+      if (child.type === 'TabPage' && child.children && child.children.type === 'Panel') {
         const panels = child.children.items || []
         const panelIndex = panels.findIndex(p => p.id === panelId)
         if (panelIndex !== -1) {
@@ -1539,7 +1539,7 @@ const clearHiddenList = () => {
 /**
  * 统一停靠结束处理函数
  * 根据拖拽类型和目标区域执行相应的停靠逻辑
- * @param {string} dragType - 拖拽类型 ('panel', 'area', 'tabpage')
+ * @param {string} dragType - 拖拽类型 ('Panel', 'Area', 'TabPage')
  * @param {string} sourceAreaId - 源Area的ID
  * @param {Object} options - 可选参数
  * @returns {Object} 处理结果 {success: boolean, message: string, strategy?: string}

AutoRobot/Windows/Robot/Web/src/DockLayout/Render.vue

@@ -6,13 +6,13 @@
     v-on="componentListeners"
   >
     <!-- 对于有children配置的情况，需要手动渲染子组件 -->
-    <template v-if="type === 'area' && config.children">
+    <template v-if="type === 'Area' && config.children">
       <!-- 如果children是数组 -->
       <template v-if="Array.isArray(config.children)">
         <div v-for="child in config.children" :key="child.id" style="width: 100%; height: 100%;">
           <Render 
-            v-if="child.type === 'tabpage'" 
+            v-if="child.type === 'TabPage'" 
-            :type="'tabpage'" 
+            :type="'TabPage'" 
             :config="child" 
             :debug="debug"
             @tab-change="$emit('tab-change', $event)"
@@ -32,10 +32,10 @@
         </div>
       </template>
       <!-- 如果children是对象 -->
-      <template v-else-if="config.children.type === 'tabpage'">
+      <template v-else-if="config.children.type === 'TabPage'">
         <div v-for="tabPage in (Array.isArray(config.children.items) ? config.children.items : [config.children])" :key="tabPage.id" style="width: 100%; height: 100%;">
           <Render 
-            :type="'tabpage'" 
+            :type="'TabPage'" 
             :config="tabPage" 
             :debug="debug"
             @tab-change="$emit('tab-change', $event)"
@@ -57,11 +57,11 @@
     </template>
 
     <!-- TabPage组件的panels prop -->
-    <template v-else-if="type === 'tabpage' && config.children && config.children.type === 'panel'">
+    <template v-else-if="type === 'TabPage' && config.children && config.children.type === 'Panel'">
       <!-- 手动渲染Panel组件 -->
       <div v-for="panel in (Array.isArray(config.children.items) ? config.children.items : [config.children])" :key="panel.id" style="width: 100%; height: 100%;">
         <Render 
-          :type="'panel'" 
+          :type="'Panel'" 
           :config="panel" 
           :debug="debug"
           @toggleCollapse="$emit('toggleCollapse', $event)"
@@ -85,11 +85,11 @@ import Panel from './Panel.vue'
 
 // 定义组件属性
 const props = defineProps({
-  // 组件类型：area, tabpage, panel
+  // 组件类型：area, TabPage, panel
   type: {
     type: String,
     required: true,
-    validator: (value) => ['area', 'tabpage', 'panel'].includes(value)
+    validator: (value) => ['Area', 'TabPage', 'Panel'].includes(value)
   },
   // 组件配置数据
   config: {
@@ -120,9 +120,9 @@ const emit = defineEmits([
 // 根据type计算要渲染的组件
 const componentType = computed(() => {
   const typeMap = {
-    'area': Area,
+    'Area': Area,
-    'tabpage': TabPage, 
+    'TabPage': TabPage, 
-    'panel': Panel
+    'Panel': Panel
   }
   return typeMap[props.type]
 })
@@ -132,7 +132,7 @@ const componentProps = computed(() => {
   const { config } = props
   
   switch (props.type) {
-    case 'area':
+    case 'Area':
       return {
         id: config.id,
         title: config.title || '面板区',
@@ -146,13 +146,13 @@ const componentProps = computed(() => {
         draggable: config.draggable !== false,
         // 如果有children配置，将其转换为TabPages格式
         tabPages: config.children ? (
-          config.children.type === 'tabpage' 
+          config.children.type === 'TabPage' 
             ? (Array.isArray(config.children.items) ? config.children.items : [config.children])
             : config.children // 如果直接是tabPages数组
         ) : config.tabPages || []
       }
       
-    case 'tabpage':
+    case 'TabPage':
       return {
         id: config.id,
         title: config.title || '标签页',
@@ -161,7 +161,7 @@ const componentProps = computed(() => {
         tabPosition: config.tabPosition || 'top'
       }
       
-    case 'panel':
+    case 'Panel':
       return {
         id: config.id,
         title: config.title || '',
@@ -185,7 +185,7 @@ const componentListeners = computed(() => {
   const allListeners = {}
   
   // 根据组件类型添加相应的事件监听器
-  if (props.type === 'area') {
+  if (props.type === 'Area') {
     // Area组件的事件
     allListeners['areaDragStart'] = (event) => {
       if (props.debug) console.log(`[Render-Area ${props.config.id}] areaDragStart:`, event)
@@ -229,7 +229,7 @@ const componentListeners = computed(() => {
     }
   }
   
-  if (props.type === 'tabpage') {
+  if (props.type === 'TabPage') {
     // TabPage组件的事件
     allListeners['tabChange'] = (event) => {
       if (props.debug) console.log(`[Render-TabPage ${props.config.id}] tabChange:`, event)
@@ -253,7 +253,7 @@ const componentListeners = computed(() => {
     }
   }
   
-  if (props.type === 'panel') {
+  if (props.type === 'Panel') {
     // Panel组件的事件
     allListeners['toggleCollapse'] = (event) => {
       if (props.debug) console.log(`[Render-Panel ${props.config.id}] toggleCollapse:`, event)
@@ -290,7 +290,7 @@ const componentListeners = computed(() => {
 
 // 规范化子组件数据（用于Area组件的slot内容）
 const normalizedChildren = computed(() => {
-  if (props.type !== 'area' || !props.config.children) {
+  if (props.type !== 'Area' || !props.config.children) {
     return []
   }
   

AutoRobot/Windows/Robot/Web/src/DockLayout/ToDoList.md

@@ -38,7 +38,7 @@
 4. 当将源Area拖动到中心指示器时
 4.1. Area的merge行为只接受一个Area参数.
 4.1. 如果目标Area内容区为空，则将源Area内容区的子组件添加到目标Area内容区。这个源Area保存到DockLayout的的隐藏列表中。
-4.2. 如果目标Area内容区已经包含一个TabPage，则将源Area的TabPage组件的每个标签页添加到目标Area的Tabpage中。这个源Area和源Area的TabPage组件保存到DockLayout的的隐藏列表中。
+4.2. 如果目标Area内容区已经包含一个TabPage，则将源Area的TabPage组件的每个标签页添加到目标Area的TabPage中。这个源Area和源Area的TabPage组件保存到DockLayout的的隐藏列表中。
 5. 当将源Area拖动到外部边缘指示器时 ✅ **已完成**
 
 **核心功能实现**：