mirror of
				https://github.com/Tencent/tmagic-editor.git
				synced 2025-11-04 02:28:04 +08:00 
			
		
		
		
	feat(editor): 代码列表默认只展开第一层
This commit is contained in:
		
							parent
							
								
									befaf67ba7
								
							
						
					
					
						commit
						41cd22b17f
					
				
							
								
								
									
										21
									
								
								packages/editor/src/components/CodeIcon.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										21
									
								
								packages/editor/src/components/CodeIcon.vue
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,21 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <svg width="2em" height="2em" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 | 
			
		||||
    <path
 | 
			
		||||
      d="M8.94034 2.55798L6.09333 13.1832L7.05925 13.442L9.90626 2.8168L8.94034 2.55798Z"
 | 
			
		||||
      fill="currentColor"
 | 
			
		||||
      fill-opacity="0.9"
 | 
			
		||||
    ></path>
 | 
			
		||||
    <path
 | 
			
		||||
      d="M2.14982 8.00001L5.57495 11.4251L4.86784 12.1323L1.15987 8.42428C0.925551 8.18996 0.925553 7.81006 1.15987 7.57575L4.86784 3.86777L5.57495 4.57488L2.14982 8.00001Z"
 | 
			
		||||
      fill="currentColor"
 | 
			
		||||
      fill-opacity="0.9"
 | 
			
		||||
    ></path>
 | 
			
		||||
    <path
 | 
			
		||||
      d="M13.846 8.00001L10.4054 11.4016L11.1085 12.1127L14.8368 8.42668C15.0744 8.19183 15.0744 7.80819 14.8368 7.57333L11.1085 3.88732L10.4054 4.59845L13.846 8.00001Z"
 | 
			
		||||
      fill="currentColor"
 | 
			
		||||
      fill-opacity="0.9"
 | 
			
		||||
    ></path>
 | 
			
		||||
  </svg>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script lang="ts" setup name="MEditorCodeIcon"></script>
 | 
			
		||||
@ -15,7 +15,7 @@
 | 
			
		||||
      class="magic-editor-layer-tree"
 | 
			
		||||
      node-key="id"
 | 
			
		||||
      empty-text="暂无代码块"
 | 
			
		||||
      default-expand-all
 | 
			
		||||
      :default-expanded-keys="expandedKeys"
 | 
			
		||||
      :expand-on-click-node="false"
 | 
			
		||||
      :data="codeList"
 | 
			
		||||
      :highlight-current="true"
 | 
			
		||||
@ -25,6 +25,7 @@
 | 
			
		||||
      <template #default="{ data }">
 | 
			
		||||
        <div :id="data.id" class="list-container">
 | 
			
		||||
          <div class="list-item">
 | 
			
		||||
            <CodeIcon style="width: 15px; margin-right: 5px" v-if="data.type === 'code'"></CodeIcon>
 | 
			
		||||
            <span class="code-name">{{ data.name }}({{ data.id }})</span>
 | 
			
		||||
            <!-- 右侧工具栏 -->
 | 
			
		||||
            <div class="right-tool" v-if="data.type === 'code'">
 | 
			
		||||
@ -58,6 +59,7 @@ import { TMagicButton, tMagicMessage, TMagicScrollbar, TMagicTooltip, TMagicTree
 | 
			
		||||
import { ColumnConfig } from '@tmagic/form';
 | 
			
		||||
import { CodeBlockContent, Id } from '@tmagic/schema';
 | 
			
		||||
 | 
			
		||||
import CodeIcon from '@editor/components/CodeIcon.vue';
 | 
			
		||||
import Icon from '@editor/components/Icon.vue';
 | 
			
		||||
import SearchInput from '@editor/components/SearchInput.vue';
 | 
			
		||||
import { CodeDeleteErrorType, CodeDslItem, Services } from '@editor/type';
 | 
			
		||||
@ -87,6 +89,9 @@ const codeList = computed(() =>
 | 
			
		||||
  })),
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
// 默认展开节点
 | 
			
		||||
const expandedKeys = computed(() => codeList.value.map((item) => item.id));
 | 
			
		||||
 | 
			
		||||
const editable = computed(() => codeBlockService?.getEditStatus());
 | 
			
		||||
 | 
			
		||||
// 是否展示代码编辑区
 | 
			
		||||
 | 
			
		||||
@ -34,6 +34,7 @@
 | 
			
		||||
    overflow: hidden;
 | 
			
		||||
    .list-item {
 | 
			
		||||
      display: flex;
 | 
			
		||||
      align-items: center;
 | 
			
		||||
      width: 100%;
 | 
			
		||||
 | 
			
		||||
      .right-tool {
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user