Files
cn-rdms-web/src/views/workbench/modules/workbench-personal-item.vue
hongawen e9214137c1 refactor(project): 重构项目执行模块组件结构和数据管理
- 移除 execution-list-panel.vue 组件并将功能整合到执行区域
- 新增 execution-section.vue 组件替代原有的列表面板
- 将 task-workspace.vue 重命名为 task-workspace-comp.vue 并更新引用
- 引入 useTaskViewContext 组合式 API 进行任务视图上下文管理
- 添加跨执行任务状态统计接口调用和数据处理逻辑
- 重构执行状态筛选和任务创建权限判断逻辑
- 更新执行选择、搜索和重置功能的事件处理方式
- 调整页面布局结构,优化左右分栏的内容组织方式
- 完善执行详情获取和状态操作的业务流程
- 优化执行分配和状态变更的异步处理机制
2026-05-23 14:22:58 +08:00

74 lines
1.8 KiB
Vue

<script setup lang="ts">
import { ref } from 'vue';
import WorkbenchModuleCard from './workbench-module-card.vue';
defineOptions({ name: 'WorkbenchPersonalItem' });
interface Props {
editing?: boolean;
collapsed?: boolean;
}
withDefaults(defineProps<Props>(), { editing: false, collapsed: false });
defineEmits<{ (e: 'hide'): void; (e: 'toggle-collapse'): void }>();
interface ItemRow {
id: string;
title: string;
done: boolean;
}
const items = ref<ItemRow[]>([
{ id: 'p1', title: '周会准备 · 跨境支付方案 PPT', done: false },
{ id: 'p2', title: '整理 Q2 OKR 复盘材料', done: false },
{ id: 'p3', title: '回复采购系统迁移邮件', done: true },
{ id: 'p4', title: '技术分享话题征集', done: false },
{ id: 'p5', title: '新人 Onboarding · 文档整理', done: false }
]);
</script>
<template>
<WorkbenchModuleCard
title="我的个人事项"
icon="mdi:format-list-checks"
:badge-count="items.filter(i => !i.done).length"
:editing="editing"
:collapsed="collapsed"
@hide="$emit('hide')"
@toggle-collapse="$emit('toggle-collapse')"
>
<ul class="item-list">
<li v-for="item in items" :key="item.id" class="item-row">
<ElCheckbox v-model="item.done" />
<span class="item-text" :class="{ 'item-done': item.done }">{{ item.title }}</span>
</li>
</ul>
</WorkbenchModuleCard>
</template>
<style scoped>
.item-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
}
.item-row {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 4px;
border-bottom: 1px solid var(--el-border-color-lighter);
}
.item-row:last-child {
border-bottom: none;
}
.item-text {
font-size: 13px;
}
.item-done {
text-decoration: line-through;
color: var(--el-text-color-placeholder);
}
</style>