支持TaskList的showTaskIcon配置

This commit is contained in:
qiuchengw
2025-12-01 17:37:25 +08:00
parent 357914a90e
commit d0c2dc56e4
3 changed files with 23 additions and 2 deletions
+1
View File
@@ -574,6 +574,7 @@ onUnmounted(() => {
:columns="visibleColumns"
:get-column-width-style="getColumnWidthStyle"
:disable-children-render="true"
:show-task-icon="props.taskListConfig?.showTaskIcon"
@toggle="toggleCollapse"
@dblclick="handleTaskRowDoubleClick"
@contextmenu="handleTaskRowContextMenu"
+21 -2
View File
@@ -38,6 +38,7 @@ interface Props {
columns: TaskListColumnConfig[]
getColumnWidthStyle?: (column: { width?: number | string }) => StyleValue
disableChildrenRender?: boolean
showTaskIcon?: boolean // 是否显示任务图标,默认true
}
const props = defineProps<Props>()
const emit = defineEmits([
@@ -332,8 +333,14 @@ onUnmounted(() => {
<!-- 里程碑分组的占位空间用于与有折叠按钮的任务对齐 -->
<span v-if="isMilestoneGroup" class="milestone-spacer"></span>
<!-- 叶子节点的占位空间无折叠按钮且无图标显示时 -->
<span
v-if="!isParentTask && !isMilestoneGroup && showTaskIcon === false"
class="leaf-spacer"
></span>
<!-- 任务图标 -->
<span class="task-icon">
<span v-if="showTaskIcon !== false" class="task-icon">
<!-- 里程碑分组图标 - 使用菱形图标 -->
<svg
v-if="isMilestoneGroup"
@@ -470,7 +477,11 @@ onUnmounted(() => {
</template>
</div>
</div>
<template v-if="!props.disableChildrenRender && hasChildren && !props.task.collapsed && !isMilestoneGroup">
<template
v-if="
!props.disableChildrenRender && hasChildren && !props.task.collapsed && !isMilestoneGroup
"
>
<TaskRow
v-for="child in props.task.children"
:key="child.id"
@@ -482,6 +493,7 @@ onUnmounted(() => {
:columns="props.columns"
:get-column-width-style="props.getColumnWidthStyle"
:disable-children-render="props.disableChildrenRender"
:show-task-icon="props.showTaskIcon"
@toggle="emit('toggle', $event)"
@dblclick="emit('dblclick', $event)"
@start-timer="emit('start-timer', $event)"
@@ -665,6 +677,13 @@ onUnmounted(() => {
margin-right: 4px;
}
/* 叶子节点占位空间 - 当不显示图标时保持缩进层级 */
.leaf-spacer {
display: inline-flex;
width: 20px; /* 18px (折叠按钮宽度) + 2px (额外间距) */
height: 18px;
}
.task-name-text {
display: inline-block;
max-width: calc(100% - 24px);
+1
View File
@@ -22,6 +22,7 @@ export interface TaskListColumnConfig {
export interface TaskListConfig {
columns?: TaskListColumnConfig[]
showAllColumns?: boolean // 是否显示所有列,默认true
showTaskIcon?: boolean // 是否显示任务图标,默认true
defaultWidth?: number | string // 默认展开宽度,支持像素数字(如 320)或百分比字符串(如 '30%'),默认320px
minWidth?: number | string // 最小宽度,支持像素数字(如 280)或百分比字符串(如 '20%'),默认280px,不能小于280px
maxWidth?: number | string // 最大宽度,支持像素数字(如 1160)或百分比字符串(如 '80%'),默认1160px