Files
cn-rdms-web/src/views/workbench/modules/workbench-my-task.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

108 lines
2.6 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script setup lang="ts">
import { computed, ref } from 'vue';
import WorkbenchModuleCard from './workbench-module-card.vue';
defineOptions({ name: 'WorkbenchMyTask' });
interface Props {
editing?: boolean;
collapsed?: boolean;
}
withDefaults(defineProps<Props>(), { editing: false, collapsed: false });
defineEmits<{ (e: 'hide'): void; (e: 'toggle-collapse'): void }>();
interface FocusItem {
id: string;
title: string;
done: boolean;
}
const items = ref<FocusItem[]>([
{ id: 'f1', title: '提交昨日工时', done: true },
{ id: 'f2', title: '登录页 SSO 改造 · 18:00 截止', done: false },
{ id: 'f3', title: '迭代 24.05 关闭 · 跟交付 / QA 确认遗留', done: false }
]);
const doneCount = computed(() => items.value.filter(i => i.done).length);
const totalCount = computed(() => items.value.length);
const todayHours = 3.5;
const targetHours = 8;
</script>
<template>
<WorkbenchModuleCard
title="我的今日"
icon="mdi:calendar-check-outline"
:editing="editing"
:collapsed="collapsed"
@hide="$emit('hide')"
@toggle-collapse="$emit('toggle-collapse')"
>
<div class="today-head">
<span class="today-progress">{{ doneCount }} / {{ totalCount }} 已完成</span>
</div>
<ul class="today-list">
<li v-for="item in items" :key="item.id" class="today-row">
<ElCheckbox v-model="item.done" />
<span class="today-text" :class="{ 'today-done': item.done }">{{ item.title }}</span>
</li>
</ul>
<div class="today-foot">
当日累计工时
<b>{{ todayHours }}h</b>
/ {{ targetHours }}h
</div>
</WorkbenchModuleCard>
</template>
<style scoped>
.today-head {
display: flex;
justify-content: flex-end;
font-size: 12px;
color: var(--el-text-color-secondary);
margin-bottom: 6px;
}
.today-progress {
padding: 2px 8px;
background: var(--el-fill-color-lighter);
border-radius: 999px;
}
.today-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
}
.today-row {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 4px;
border-bottom: 1px solid var(--el-border-color-lighter);
}
.today-row:last-child {
border-bottom: none;
}
.today-text {
font-size: 13px;
}
.today-done {
text-decoration: line-through;
color: var(--el-text-color-placeholder);
}
.today-foot {
margin-top: 10px;
padding-top: 8px;
border-top: 1px solid var(--el-border-color-lighter);
font-size: 12px;
color: var(--el-text-color-secondary);
}
.today-foot b {
color: var(--el-text-color-primary);
font-weight: 700;
}
</style>