czh-20260521-更改计划名称以及优化新增分组流程

This commit is contained in:
zhihao
2026-05-21 19:16:21 +08:00
parent 43db637f60
commit b3fb3b93b9
16 changed files with 325 additions and 170 deletions
+63 -19
View File
@@ -2,7 +2,7 @@
<div class="task-content">
<div class="content-header">
<template v-if="showListGroupView">
<h2 class="content-title">任务清单</h2>
<h2 class="content-title">计划列表</h2>
</template>
<template v-else>
<div class="content-header-left">
@@ -16,7 +16,7 @@
@blur="confirmHeaderRename"
/>
</div>
<h2 v-else class="content-title">{{ currentList?.name || '请选择清单' }}</h2>
<h2 v-else class="content-title">{{ currentList?.name || '请选择计划' }}</h2>
<a-dropdown v-if="currentList && canShowHeaderMore" :trigger="['click']">
<a-button type="text" size="small" class="header-more-btn">
<Icon icon="ant-design:ellipsis-outlined" />
@@ -39,7 +39,7 @@
<span v-if="currentList.secretText" class="header-secret-badge" :style="{ color: SECRET_LEVEL_COLOR[currentList.secretLevel || 1] || '#8c8c8c', borderColor: SECRET_LEVEL_COLOR[currentList.secretLevel || 1] || '#8c8c8c' }">
{{ currentList.secretText }}
</span>
<div class="collaborator-bar" @click="emit('open-collaborator')">
<div class="collaborator-bar" :class="{ disabled: !_isOwner }" @click="_isOwner && emit('open-collaborator')">
<AvatarDisplay
v-if="collaboratorDisplayNames"
:names="collaboratorDisplayNames"
@@ -60,7 +60,7 @@
<a-dropdown>
<template #overlay>
<a-menu @click="onStatusFilterChange">
<a-menu-item key="all" :class="{ 'ant-dropdown-menu-item-selected': statusFilter === 'all' }">全部清单</a-menu-item>
<a-menu-item key="all" :class="{ 'ant-dropdown-menu-item-selected': statusFilter === 'all' }">全部</a-menu-item>
<a-menu-item key="completed" :class="{ 'ant-dropdown-menu-item-selected': statusFilter === 'completed' }">已完成</a-menu-item>
<a-menu-item key="uncompleted" :class="{ 'ant-dropdown-menu-item-selected': statusFilter === 'uncompleted' }">未完成</a-menu-item>
</a-menu>
@@ -269,13 +269,13 @@
</template>
<span v-else class="field-placeholder">-</span>
</div>
<div class="list-group-col list-group-col-collaborators">
<div class="list-group-col list-group-col-collaborators clickable" @click.stop="emit('open-collaborator-for-list', list.id)">
<template v-if="getAllCollaborators(list)">
<a-tooltip :title="getAllCollaborators(list)" placement="top"
><AvatarDisplay :names="getAllCollaborators(list)" :size="24" :show-name="false"
/></a-tooltip>
<a-tooltip title="点击管理协作者" placement="top">
<AvatarDisplay :names="getAllCollaborators(list)" :size="24" :show-name="getCollaboratorCount(list) === 1" />
</a-tooltip>
</template>
<span v-else class="field-placeholder">-</span>
<Icon v-else icon="tasklist-add-user|svg" class="collab-add-icon" />
</div>
<div class="list-group-col list-group-col-secret">
<span
@@ -293,7 +293,7 @@
</div>
<div v-if="allTaskLists.length === 0" class="empty-state">
<Icon icon="ant-design:inbox-outlined" class="empty-icon" />
<p>暂无任务清单</p>
<p>暂无可见计划</p>
</div>
</div>
</template>
@@ -303,7 +303,7 @@
<div class="table-col table-col-drag-handle"></div>
<div class="table-col table-col-title">
<Icon icon="tasklist-title|svg" class="header-icon" />
<span class="header-label">任务标题</span>
<span class="header-label">事项标题</span>
</div>
<template v-for="field in visibleFieldConfigs" :key="field.key">
<div class="table-col header-col" :style="{ width: fieldWidthMap[field.key] || '100px' }">
@@ -387,7 +387,7 @@
<span
v-if="canEdit && groupDimension === 'custom'"
class="group-action-btn group-action-add"
title="新建任务"
title="新建事项"
@click.stop="showNewTaskInput = group.id"
>
<Icon icon="ant-design:plus-outlined" />
@@ -744,7 +744,7 @@
ref="newTaskInputRef"
v-model:value="newTaskTitle"
size="small"
placeholder="输入任务标题,按回车确认..."
placeholder="输入事项标题,按回车确认..."
autofocus
@press-enter="submitNewTask(group.id)"
@blur="submitNewTask(group.id)"
@@ -764,7 +764,7 @@
<span class="expand-arrow-placeholder"></span>
</div>
<Icon icon="ant-design:plus-outlined" class="new-task-plus" />
<span class="new-task-text">新建任务</span>
<span class="new-task-text">新建事项</span>
</div>
</div>
</div>
@@ -793,7 +793,7 @@
<div v-else class="empty-state">
<Icon icon="ant-design:inbox-outlined" class="empty-icon" />
<p>请从左侧选择一个任务清单</p>
<p>请从左侧选择一个计划</p>
</div>
</template>
</div>
@@ -864,6 +864,7 @@
'update:list-group-tab': [value: string];
'list-select': [listId: string];
'open-collaborator': [];
'open-collaborator-for-list': [listId: string];
'add-to-favorites': [taskListId: string];
'remove-from-favorites': [favoriteId: string];
'move-task': [taskId: string, targetPid: string, targetSortOrder: number];
@@ -920,7 +921,7 @@
function showDragBlockedMessage() {
import('ant-design-vue').then(({ message }) => {
message.warning('子任务只能在当前父任务下移动');
message.warning('子事项只能在当前父事项下移动');
});
}
@@ -981,6 +982,12 @@
return names.join(',');
}
function getCollaboratorCount(list: TaskList): number {
const names = getAllCollaborators(list);
if (!names) return 0;
return names.split(/[,,、]/).filter(Boolean).length;
}
function getFormattedCreateTime(list: TaskList): string {
if (list.createTimeStr) {
return list.createTimeStr;
@@ -1137,6 +1144,10 @@
const canEdit = computed(() => props.currentList?.myPermission === '1' || props.currentList?.myPermission === '2');
const isReadOnly = computed(() => props.currentList?.myPermission === '3');
function isListOwner(list: TaskList): boolean {
return list.myPermission === '1';
}
const canShowHeaderMore = computed(() => {
if (!props.currentList) return false;
const perm = props.currentList.myPermission;
@@ -1162,7 +1173,7 @@
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '删除任务清单后,其下所有任务也将被删除,确定要删除吗?',
content: '删除计划后,其下所有事项也将被删除,确定要删除吗?',
okText: '确认',
cancelText: '取消',
onOk: () => {
@@ -1238,7 +1249,7 @@
};
const statusFilterLabel = computed(() => {
const map: Record<StatusFilter, string> = { all: '全部清单', completed: '已完成', uncompleted: '未完成' };
const map: Record<StatusFilter, string> = { all: '全部', completed: '已完成', uncompleted: '未完成' };
return map[props.statusFilter];
});
@@ -1780,7 +1791,7 @@
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '删除分组后,分组内的任务将合并到默认分组,确定要删除吗?',
content: '删除分组后,分组内的事项将合并到默认分组,确定要删除吗?',
okText: '确认',
cancelText: '取消',
onOk: () => {
@@ -1889,6 +1900,16 @@
border-color: #d0d0d0;
background: #fafafa;
}
&.disabled {
cursor: not-allowed;
opacity: 0.5;
&:hover {
border-color: #e8e8e8;
background: transparent;
}
}
}
.collab-btn {
@@ -2676,6 +2697,29 @@
.list-group-col-collaborators {
width: 120px;
padding: 0 12px;
display: flex;
align-items: center;
gap: 4px;
&.clickable {
cursor: pointer;
border-radius: 4px;
transition: background 0.15s;
&:hover {
background: #f0f5ff;
}
}
}
.collab-add-icon {
font-size: 20px;
color: #bfbfbf;
transition: color 0.15s;
.clickable:hover & {
color: #3370ff;
}
}
.list-group-col-secret {