diff --git a/pms/src/main/java/org/nl/pms/Portal/controller/PortalDashboardController.java b/pms/src/main/java/org/nl/pms/Portal/controller/PortalDashboardController.java
index a9df271..8d551e5 100644
--- a/pms/src/main/java/org/nl/pms/Portal/controller/PortalDashboardController.java
+++ b/pms/src/main/java/org/nl/pms/Portal/controller/PortalDashboardController.java
@@ -7,6 +7,7 @@ import org.nl.pms.Portal.service.PortalDashboardService;
 import org.nl.pms.Portal.vo.PortalDashboardVO;
 import org.nl.pms.common.exception.BadRequestException;
 import org.nl.pms.common.utils.SecurityUtils;
+import org.nl.pms.common.utils.dto.CurrentUser;
 import org.nl.pms.project.vo.ApiResponse;
 import org.springframework.web.bind.annotation.*;
 
@@ -22,8 +23,9 @@ public class PortalDashboardController {
     public ApiResponse<PortalDashboardVO> dashboard(
         @RequestParam(defaultValue = "1") long projectPage,
         @RequestParam(defaultValue = "6") long projectSize) {
+        CurrentUser currentUser = SecurityUtils.getCurrentUser();
         return ApiResponse.success(portalDashboardService.getDashboard(
-            SecurityUtils.getCurrentUsername(), projectPage, projectSize));
+            currentUser.getUsername(), currentUser.getPresonName(), projectPage, projectSize));
     }
 
     @GetMapping("/project-plan/{projectId}")
diff --git a/pms/src/main/java/org/nl/pms/Portal/service/PortalDashboardService.java b/pms/src/main/java/org/nl/pms/Portal/service/PortalDashboardService.java
index 88f3e86..7b31237 100644
--- a/pms/src/main/java/org/nl/pms/Portal/service/PortalDashboardService.java
+++ b/pms/src/main/java/org/nl/pms/Portal/service/PortalDashboardService.java
@@ -4,7 +4,7 @@ import org.nl.pms.Portal.vo.PortalDashboardVO;
 
 public interface PortalDashboardService {
 
-    PortalDashboardVO getDashboard(String username, long projectPage, long projectSize);
+    PortalDashboardVO getDashboard(String username, String personName, long projectPage, long projectSize);
 
     PortalDashboardVO.ProjectPlan getProjectPlan(String username, Long projectId);
 }
diff --git a/pms/src/main/java/org/nl/pms/Portal/service/impl/PortalDashboardServiceImpl.java b/pms/src/main/java/org/nl/pms/Portal/service/impl/PortalDashboardServiceImpl.java
index 97dfe5e..99a5a5a 100644
--- a/pms/src/main/java/org/nl/pms/Portal/service/impl/PortalDashboardServiceImpl.java
+++ b/pms/src/main/java/org/nl/pms/Portal/service/impl/PortalDashboardServiceImpl.java
@@ -33,22 +33,34 @@ public class PortalDashboardServiceImpl implements PortalDashboardService {
     private final ProjectProgressReportMapper projectProgressReportMapper;
 
     @Override
-    public PortalDashboardVO getDashboard(String username, long projectPage, long projectSize) {
+    public PortalDashboardVO getDashboard(String username, String personName, long projectPage, long projectSize) {
+        List<String> currentUserIdentifiers = currentUserIdentifiers(username, personName);
         long current = Math.max(projectPage, 1);
         long size = Math.min(Math.max(projectSize, 1), 12);
         List<Project> allProjects = projectMapper.selectList(new LambdaQueryWrapper<Project>()
             .orderByDesc(Project::getCreatedAt));
         List<Project> memberProjects = allProjects.stream()
-            .filter(project -> containsMember(project.getDevelopMembers(), username))
+            .filter(project -> containsMember(project.getDevelopMembers(), currentUserIdentifiers))
             .toList();
+        long activeParticipatedProjectCount = allProjects.stream()
+            .filter(project -> isActiveProjectStatus(project.getStatus()))
+            .filter(project -> containsUser(project.getDevelopLeader(), currentUserIdentifiers)
+                || containsMember(project.getDevelopMembers(), currentUserIdentifiers))
+            .count();
+        long responsibleProjectCount = allProjects.stream()
+            .filter(project -> containsUser(project.getDevelopLeader(), currentUserIdentifiers))
+            .count();
         List<ProjectPlanDetail> memberTasks = projectPlanDetailMapper.selectList(new LambdaQueryWrapper<ProjectPlanDetail>()
                 .orderByAsc(ProjectPlanDetail::getDevStartDate))
             .stream()
-            .filter(task -> containsMember(task.getTaskMembers(), username))
+            .filter(task -> containsMember(task.getTaskMembers(), currentUserIdentifiers))
+            .toList();
+        List<ProjectPlanDetail> activeMemberTasks = memberTasks.stream()
+            .filter(task -> isActiveTaskStatus(task.getStatus()))
             .toList();
 
         PortalDashboardVO result = new PortalDashboardVO();
-        result.setOverview(buildOverview(memberProjects.size(), memberTasks));
+        result.setOverview(buildOverview(activeParticipatedProjectCount, memberProjects.size(), responsibleProjectCount, activeMemberTasks));
         result.setProjects(toProjects(new Page<>(current, size)));
         result.setProjectRatio(buildRatio("我参与的项目", memberProjects.size(), "其他项目", Math.max(allProjects.size() - memberProjects.size(), 0)));
         result.setWorkHourRatio(buildRatio("我的工时", calculateHours(memberTasks), "其他工时", 0));
@@ -112,9 +124,12 @@ public class PortalDashboardServiceImpl implements PortalDashboardService {
         return plan;
     }
 
-    private PortalDashboardVO.Overview buildOverview(long projectCount, List<ProjectPlanDetail> tasks) {
+    private PortalDashboardVO.Overview buildOverview(long activeParticipatedProjectCount, long participatedProjectCount,
+                                                     long responsibleProjectCount, List<ProjectPlanDetail> tasks) {
         PortalDashboardVO.Overview overview = new PortalDashboardVO.Overview();
-        overview.setParticipatedProjectCount(projectCount);
+        overview.setActiveParticipatedProjectCount(activeParticipatedProjectCount);
+        overview.setParticipatedProjectCount(participatedProjectCount);
+        overview.setResponsibleProjectCount(responsibleProjectCount);
         overview.setTaskCount(tasks.size());
         overview.setAccumulatedHours(calculateHours(tasks));
         overview.setExceptionRate(0D);
@@ -150,16 +165,31 @@ public class PortalDashboardServiceImpl implements PortalDashboardService {
 
     private PortalDashboardVO.WeeklyPlan buildWeeklyPlan(List<ProjectPlanDetail> tasks) {
         LocalDate monday = LocalDate.now().with(DayOfWeek.MONDAY);
+        var projectNames = projectMapper.selectList(new LambdaQueryWrapper<Project>())
+            .stream()
+            .collect(java.util.stream.Collectors.toMap(Project::getId, Project::getProjectName, (left, right) -> left));
         List<String> dates = new ArrayList<>();
         List<Integer> taskCounts = new ArrayList<>();
+        List<List<PortalDashboardVO.WeeklyPlanItem>> taskDetails = new ArrayList<>();
         for (int offset = 0; offset < 7; offset++) {
             LocalDate date = monday.plusDays(offset);
+            List<PortalDashboardVO.WeeklyPlanItem> dayTasks = tasks.stream()
+                .filter(task -> isPlannedFor(task, date))
+                .map(task -> {
+                    PortalDashboardVO.WeeklyPlanItem item = new PortalDashboardVO.WeeklyPlanItem();
+                    item.setProjectName(projectNames.getOrDefault(task.getProjectId(), "未命名项目"));
+                    item.setPlanName(task.getDetailName());
+                    return item;
+                })
+                .toList();
             dates.add(date.toString());
-            taskCounts.add((int) tasks.stream().filter(task -> isPlannedFor(task, date)).count());
+            taskCounts.add(dayTasks.size());
+            taskDetails.add(dayTasks);
         }
         PortalDashboardVO.WeeklyPlan weeklyPlan = new PortalDashboardVO.WeeklyPlan();
         weeklyPlan.setDates(dates);
         weeklyPlan.setTaskCounts(taskCounts);
+        weeklyPlan.setTaskDetails(taskDetails);
         return weeklyPlan;
     }
 
@@ -238,11 +268,43 @@ public class PortalDashboardServiceImpl implements PortalDashboardService {
         };
     }
 
-    private boolean containsMember(String members, String username) {
-        if (!StringUtils.hasText(members) || !StringUtils.hasText(username)) {
+    private boolean isActiveProjectStatus(Integer status) {
+        return status != null && status >= 0 && status <= 2;
+    }
+
+    private boolean isActiveTaskStatus(Integer status) {
+        return status != null && (status == 1 || status == 2 || status == 4);
+    }
+
+    private List<String> currentUserIdentifiers(String username, String personName) {
+        List<String> identifiers = new ArrayList<>();
+        addIdentifier(identifiers, username);
+        addIdentifier(identifiers, personName);
+        return identifiers;
+    }
+
+    private void addIdentifier(List<String> identifiers, String value) {
+        if (!StringUtils.hasText(value)) {
+            return;
+        }
+        String identifier = value.trim();
+        if (!identifiers.contains(identifier)) {
+            identifiers.add(identifier);
+        }
+    }
+
+    private boolean containsUser(String value, List<String> userIdentifiers) {
+        return userIdentifiers.stream().anyMatch(identifier -> identifier.equals(value));
+    }
+
+    private boolean containsMember(String members, List<String> userIdentifiers) {
+        if (!StringUtils.hasText(members) || userIdentifiers.isEmpty()) {
             return false;
         }
-        return members.contains("\"" + username + "\"") || members.equals(username)
-            || Arrays.stream(members.split(",")).map(String::trim).anyMatch(username::equals);
+        return parseMembers(members).stream().anyMatch(userIdentifiers::contains);
+    }
+
+    private boolean containsMember(String members, String username) {
+        return containsMember(members, currentUserIdentifiers(username, null));
     }
 }
diff --git a/pms/src/main/java/org/nl/pms/Portal/vo/PortalDashboardVO.java b/pms/src/main/java/org/nl/pms/Portal/vo/PortalDashboardVO.java
index 1a7fd7c..ee06128 100644
--- a/pms/src/main/java/org/nl/pms/Portal/vo/PortalDashboardVO.java
+++ b/pms/src/main/java/org/nl/pms/Portal/vo/PortalDashboardVO.java
@@ -83,7 +83,9 @@ public class PortalDashboardVO {
 
     @Data
     public static class Overview {
+        private long activeParticipatedProjectCount;
         private long participatedProjectCount;
+        private long responsibleProjectCount;
         private long taskCount;
         private long accumulatedHours;
         private double exceptionRate;
@@ -103,5 +105,12 @@ public class PortalDashboardVO {
     public static class WeeklyPlan {
         private List<String> dates;
         private List<Integer> taskCounts;
+        private List<List<WeeklyPlanItem>> taskDetails;
+    }
+
+    @Data
+    public static class WeeklyPlanItem {
+        private String projectName;
+        private String planName;
     }
 }
diff --git a/pms_vue/src/views/Portal/index.vue b/pms_vue/src/views/Portal/index.vue
index 1aa5c9e..3b0c234 100644
--- a/pms_vue/src/views/Portal/index.vue
+++ b/pms_vue/src/views/Portal/index.vue
@@ -4,18 +4,18 @@
       <div class="portal-brand"><i class="el-icon-data-analysis" /><span>项目工作台</span></div>
     </header>
     <section class="summary-grid">
-      <div class="summary-panel"><div class="panel-heading"><span>个人概览</span><small>当前工作数据</small></div><div class="primary-metrics"><div class="primary-metric blue"><i class="el-icon-folder-opened" /><div><span>我参与的项目</span><strong>{{ overview.participatedProjectCount }}</strong><em>个项目</em></div></div><div class="primary-metric purple"><i class="el-icon-tickets" /><div><span>我的计划任务</span><strong>{{ overview.taskCount }}</strong><em>项任务</em></div></div></div></div>
+      <div class="summary-panel"><div class="panel-heading"><span>个人概览</span><small>当前工作数据</small></div><div class="primary-metrics"><div class="primary-metric blue"><i class="el-icon-folder-opened" /><div><span>正在参与的项目</span><strong>{{ overview.activeParticipatedProjectCount }}</strong><em>个项目</em></div></div><div class="primary-metric purple"><i class="el-icon-tickets" /><div><span>我的计划任务</span><strong>{{ overview.taskCount }}</strong><em>项任务</em></div></div></div></div>
       <div class="notice-panel"><div class="panel-heading"><span>消息通知</span><small>最多展示 5 条</small></div><el-empty :image-size="46" description="暂无消息" /></div>
     </section>
     <section class="projects-panel"><div class="panel-heading"><div><span>项目卡片</span><small>向左滑动加载更多项目</small></div><el-button :loading="projectsLoading" circle icon="el-icon-refresh" @click="loadDashboard" /></div><div ref="projectViewport" class="project-viewport" :class="{ 'is-dragging': isDragging }" @mousedown.prevent="startDrag" @mousemove="moveDrag" @mouseup="endDrag" @mouseleave="endDrag" @touchstart="startDrag" @touchmove="moveDrag" @touchend="endDrag"><div class="project-list"><article v-for="project in projects" :key="project.id" class="project-card" :class="{ active: selectedProjectId === project.id }" @click="selectProject(project)"><div class="project-cover"><img v-if="coverUrl(project)" :src="coverUrl(project)" :alt="project.projectName" @error="onCoverError(project)"><span v-else>{{ project.projectName ? project.projectName.slice(0, 1) : '项' }}</span></div><div class="project-card-content"><h3 :title="project.projectName">{{ project.projectName }}</h3><p>{{ project.projectCode || '未设置项目编号' }}</p><el-tag size="mini" effect="plain">{{ statusText(project.status) }}</el-tag></div></article><div v-if="!projects.length" class="empty-projects">暂无项目数据</div></div><div v-if="projectsLoading && projects.length" class="project-load-mask"><i class="el-icon-loading" /> 正在加载更多项目</div></div></section>
-    <section v-if="selectedProjectPlan" class="personal-plan-panel"><div class="plan-overview"><div><h2>{{ selectedProjectPlan.projectName }}</h2><div class="plan-meta"><span>项目负责人：{{ selectedProjectPlan.projectLeader || '-' }}</span><span>项目开发进度：-</span><span>项目开发成员：{{ membersText(selectedProjectPlan.developMembers) }}</span></div></div><el-button type="primary" icon="el-icon-document" @click="viewDevelopmentPlan">查看开发计划</el-button></div><div class="plan-workspace"><aside class="plan-sidebar"><button class="side-entry" :class="{ active: planView === 'approval' }" :disabled="!selectedProjectPlan.projectLeaderCurrentUser" @click="planView = 'approval'"><i class="el-icon-document-checked" /><span>我的审批</span><strong>{{ selectedProjectPlan.projectLeaderCurrentUser ? pendingReports.length : 0 }}</strong><small v-if="!selectedProjectPlan.projectLeaderCurrentUser">仅项目负责人可查看</small></button><button class="side-entry" :class="{ active: planView === 'work' }" @click="planView = 'work'"><i class="el-icon-tickets" /><span>工作明细</span><strong>{{ planTasks.length }}</strong></button></aside><main class="plan-detail"><template v-if="planView === 'approval'"><div class="detail-heading"><h3>待审批列表</h3><span>{{ pendingReports.length }} 条待审批</span></div><el-table :data="pendingReports" empty-text="暂无待审批报功"><el-table-column prop="detailName" label="工作明细" min-width="150" /><el-table-column prop="createdName" label="提交人" width="110" /><el-table-column prop="reportDate" label="报工日期" width="120" /><el-table-column prop="progressIncrement" label="进度增量" width="110"><template slot-scope="scope">+{{ scope.row.progressIncrement || 0 }}%</template></el-table-column><el-table-column prop="workContent" label="工作内容" min-width="220" show-overflow-tooltip /></el-table></template><template v-else><div class="detail-heading"><h3>项目开发计划</h3><span>{{ (selectedProjectPlan.masters || []).length }} 个主项</span></div><div v-if="selectedProjectPlan.masters && selectedProjectPlan.masters.length" class="portal-plan-list"><div v-for="master in selectedProjectPlan.masters" :key="master.id" class="portal-master-card"><div class="portal-master-header"><strong>{{ master.masterName || '未命名主项' }}</strong><span><el-tag size="mini">工时 {{ master.totalDevDays || 0 }} 天</el-tag><el-tag size="mini" type="success">{{ formatDateRange(master.devStartDate, master.devEndDate) }}</el-tag></span></div><el-timeline><el-timeline-item v-for="detail in master.details || []" :key="detail.id" :timestamp="formatDateRange(detail.devStartDate, detail.devEndDate)" placement="top"><strong>{{ detail.detailName || detail.subItemName || '未命名任务' }}</strong><p>{{ detail.detailDescription || '暂无描述' }}</p><div class="plan-detail-meta"><span>成员：{{ membersText(detail.taskMembers) }}</span><span>优先级：{{ detail.priorityLabel || '-' }}</span><span>进度：{{ detail.progress || 0 }}%</span></div></el-timeline-item></el-timeline></div></div><div v-else class="plan-empty">暂无开发计划</div></template></main></div></section><section v-else class="analysis-grid"><div class="metrics-panel"><div class="panel-heading"><span>我的项目数据</span><small>请点击上方项目卡片查看个人项目计划</small></div><div class="detail-metrics"><div><span>参与项目数</span><strong>{{ overview.participatedProjectCount }}<small>个</small></strong></div><div><span>累计工时</span><strong>{{ overview.accumulatedHours }}<small>小时</small></strong></div><div><span>项目异常率</span><strong>{{ percent(overview.exceptionRate) }}</strong></div><div><span>贡献度</span><strong>{{ percent(overview.contributionRate) }}</strong></div><div><span>代码量</span><strong>{{ overview.codeLines }}<small>行</small></strong></div></div></div><div class="charts-panel"><div class="pie-grid"><div class="chart-card"><h3>项目占比</h3><div ref="projectChart" class="pie-chart" /></div><div class="chart-card"><h3>工时占比</h3><div ref="hoursChart" class="pie-chart" /></div></div><div class="line-card"><div><h3>本周我的计划</h3><p>按开发计划日期统计</p></div><div ref="weeklyChart" class="weekly-chart" /></div></div></section>
+    <section v-if="selectedProjectPlan" class="personal-plan-panel"><div class="plan-overview"><div><h2>{{ selectedProjectPlan.projectName }}</h2><div class="plan-meta"><span>项目负责人：{{ selectedProjectPlan.projectLeader || '-' }}</span><span>项目开发进度：-</span><span>项目开发成员：{{ membersText(selectedProjectPlan.developMembers) }}</span></div></div><el-button type="primary" icon="el-icon-document" @click="viewDevelopmentPlan">查看开发计划</el-button></div><div class="plan-workspace"><aside class="plan-sidebar"><button class="side-entry" :class="{ active: planView === 'approval' }" :disabled="!selectedProjectPlan.projectLeaderCurrentUser" @click="planView = 'approval'"><i class="el-icon-document-checked" /><span>我的审批</span><strong>{{ selectedProjectPlan.projectLeaderCurrentUser ? pendingReports.length : 0 }}</strong><small v-if="!selectedProjectPlan.projectLeaderCurrentUser">仅项目负责人可查看</small></button><button class="side-entry" :class="{ active: planView === 'work' }" @click="planView = 'work'"><i class="el-icon-tickets" /><span>工作明细</span><strong>{{ planTasks.length }}</strong></button></aside><main class="plan-detail"><template v-if="planView === 'approval'"><div class="detail-heading"><h3>待审批列表</h3><span>{{ pendingReports.length }} 条待审批</span></div><el-table :data="pendingReports" empty-text="暂无待审批报功"><el-table-column prop="detailName" label="工作明细" min-width="150" /><el-table-column prop="createdName" label="提交人" width="110" /><el-table-column prop="reportDate" label="报工日期" width="120" /><el-table-column prop="progressIncrement" label="进度增量" width="110"><template slot-scope="scope">+{{ scope.row.progressIncrement || 0 }}%</template></el-table-column><el-table-column prop="workContent" label="工作内容" min-width="220" show-overflow-tooltip /></el-table></template><template v-else><div class="detail-heading"><h3>项目开发计划</h3><span>{{ (selectedProjectPlan.masters || []).length }} 个主项</span></div><div v-if="selectedProjectPlan.masters && selectedProjectPlan.masters.length" class="portal-plan-list"><div v-for="master in selectedProjectPlan.masters" :key="master.id" class="portal-master-card"><div class="portal-master-header"><strong>{{ master.masterName || '未命名主项' }}</strong><span><el-tag size="mini">工时 {{ master.totalDevDays || 0 }} 天</el-tag><el-tag size="mini" type="success">{{ formatDateRange(master.devStartDate, master.devEndDate) }}</el-tag></span></div><el-timeline><el-timeline-item v-for="detail in master.details || []" :key="detail.id" :timestamp="formatDateRange(detail.devStartDate, detail.devEndDate)" placement="top"><strong>{{ detail.detailName || detail.subItemName || '未命名任务' }}</strong><p>{{ detail.detailDescription || '暂无描述' }}</p><div class="plan-detail-meta"><span>成员：{{ membersText(detail.taskMembers) }}</span><span>优先级：{{ detail.priorityLabel || '-' }}</span><span>进度：{{ detail.progress || 0 }}%</span></div></el-timeline-item></el-timeline></div></div><div v-else class="plan-empty">暂无开发计划</div></template></main></div></section><section v-else class="analysis-grid"><div class="metrics-panel"><div class="panel-heading"><span>我的项目数据</span><small>请点击上方项目卡片查看个人项目计划</small></div><div class="detail-metrics"><div><span>我参与的项目</span><strong>{{ overview.participatedProjectCount }}<small>个</small></strong></div><div><span>我负责的项目</span><strong>{{ overview.responsibleProjectCount }}<small>个</small></strong></div><div><span>累计工时</span><strong>{{ overview.accumulatedHours }}<small>小时</small></strong></div><div><span>项目异常率</span><strong>{{ percent(overview.exceptionRate) }}</strong></div><div><span>贡献度</span><strong>{{ percent(overview.contributionRate) }}</strong></div><div><span>代码量</span><strong>{{ overview.codeLines }}<small>行</small></strong></div></div></div><div class="charts-panel"><div class="pie-grid"><div class="chart-card"><h3>项目占比</h3><div ref="projectChart" class="pie-chart" /></div><div class="chart-card"><h3>工时占比</h3><div ref="hoursChart" class="pie-chart" /></div></div><div class="line-card"><div><h3>本周我的计划</h3><p>按开发计划日期统计</p></div><div ref="weeklyChart" class="weekly-chart" /></div></div></section>
   </div>
 </template>
 <script>
 import echarts from 'echarts'
 import { mapGetters } from 'vuex'
 import { getDashboard, getProjectPlan } from './portal'
-export default { name: 'Portal', data() { return { loading: false, projectsLoading: false, projectPage: 1, projectSize: 6, projects: [], hasMoreProjects: true, overview: {}, projectRatio: {}, workHourRatio: {}, weeklyPlan: {}, charts: [], currentTime: '', timer: null, isDragging: false, dragStartX: 0, dragLastX: 0, dragStartScrollLeft: 0, failedCovers: [], selectedProjectId: null, selectedProjectPlan: null, planView: 'work', planLoading: false } }, computed: { ...mapGetters(['user', 'baseApi']), displayName() { return this.user.person_name || this.user.personName || this.user.username || '当前用户' }, planTasks() { return this.selectedProjectPlan && Array.isArray(this.selectedProjectPlan.tasks) ? this.selectedProjectPlan.tasks : [] }, pendingReports() { return this.selectedProjectPlan && Array.isArray(this.selectedProjectPlan.pendingReports) ? this.selectedProjectPlan.pendingReports : [] } }, mounted() { this.updateTime(); this.timer = window.setInterval(this.updateTime, 1000); this.loadDashboard(); window.addEventListener('resize', this.resizeCharts) }, beforeDestroy() { window.clearInterval(this.timer); window.removeEventListener('resize', this.resizeCharts); this.charts.forEach(chart => chart.dispose()) }, methods: { selectProject(project) { if (!project || this.planLoading) return; this.selectedProjectId = project.id; this.planLoading = true; getProjectPlan(project.id).then(res => { this.selectedProjectPlan = res.data || {}; this.planView = this.selectedProjectPlan.projectLeaderCurrentUser ? 'approval' : 'work' }).finally(() => { this.planLoading = false }) }, viewDevelopmentPlan() { if (this.selectedProjectId) this.$router.push({ path: '/system/project-plan', query: { projectId: this.selectedProjectId } }) }, membersText(members) { return Array.isArray(members) && members.length ? members.join('、') : '-' }, formatDateRange(start, end) { if (!start && !end) return '-'; return `${start || '-'} ~ ${end || '-'}` }, taskTag(status) { return ({ 1: 'info', 2: 'warning', 3: 'success', 4: 'danger' })[status] || 'info' }, priorityTag(priority) { return ({ 1: 'danger', 2: 'warning', 3: 'info' })[priority] || 'info' }, updateTime() { const date = new Date(); this.currentTime = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}:${String(date.getSeconds()).padStart(2, '0')}` }, handleUserCommand(command) { if (command === 'logout') this.$store.dispatch('LogOut').finally(() => { this.$router.push({ path: '/login' }) }) }, loadDashboard(resetProjects = true) { if (this.projectsLoading) return; this.loading = resetProjects && !this.projects.length; this.projectsLoading = true; if (resetProjects) this.projectPage = 1; getDashboard({ projectPage: this.projectPage, projectSize: this.projectSize }).then(res => { const data = res.data || {}; this.overview = data.overview || {}; this.projects = data.projects || []; this.hasMoreProjects = this.projects.length === this.projectSize; this.projectRatio = data.projectRatio || {}; this.workHourRatio = data.workHourRatio || {}; this.weeklyPlan = data.weeklyPlan || {}; this.failedCovers = []; this.$nextTick(this.renderCharts) }).finally(() => { this.loading = false; this.projectsLoading = false }) }, loadMoreProjects() { if (this.projectsLoading || !this.hasMoreProjects) return; const nextPage = this.projectPage + 1; const viewport = this.$refs.projectViewport; const previousScrollLeft = viewport ? viewport.scrollLeft : 0; this.projectsLoading = true; getDashboard({ projectPage: nextPage, projectSize: this.projectSize }).then(res => { const data = res.data || {}; const nextProjects = data.projects || []; const knownIds = new Set(this.projects.map(project => project.id)); this.projects = this.projects.concat(nextProjects.filter(project => !knownIds.has(project.id))); this.projectPage = nextPage; this.hasMoreProjects = nextProjects.length === this.projectSize; this.$nextTick(() => { if (viewport) viewport.scrollTo({ left: previousScrollLeft + viewport.clientWidth, behavior: 'smooth' }) }) }).finally(() => { this.projectsLoading = false }) }, startDrag(event) { if (this.projectsLoading || (event.button !== undefined && event.button !== 0)) return; const point = event.touches ? event.touches[0] : event; const viewport = this.$refs.projectViewport; this.isDragging = true; this.dragStartX = point.clientX; this.dragLastX = point.clientX; this.dragStartScrollLeft = viewport.scrollLeft }, moveDrag(event) { if (!this.isDragging) return; const point = event.touches ? event.touches[0] : event; const viewport = this.$refs.projectViewport; const delta = point.clientX - this.dragStartX; this.dragLastX = point.clientX; const maxScrollLeft = viewport.scrollWidth - viewport.clientWidth; viewport.scrollLeft = Math.max(0, Math.min(maxScrollLeft, this.dragStartScrollLeft - delta)); if (event.cancelable) event.preventDefault() }, endDrag() { if (!this.isDragging) return; const viewport = this.$refs.projectViewport; const movedLeft = this.dragLastX < this.dragStartX - 70; const atRightEdge = viewport.scrollLeft >= viewport.scrollWidth - viewport.clientWidth - 2; this.isDragging = false; if (movedLeft && atRightEdge) this.loadMoreProjects() }, coverUrl(project) { const coverUrl = project && project.coverUrl; if (!coverUrl || this.failedCovers.includes(project.id)) return ''; if (/^(https?:)?\/\//.test(coverUrl)) return coverUrl; const storagePath = coverUrl.startsWith('/project-storage/') ? coverUrl : `/project-storage/${coverUrl.replace(/^\/+/, '')}`; return `${(this.baseApi || '').replace(/\/$/, '')}${storagePath}` }, onCoverError(project) { this.failedCovers = [...this.failedCovers, project.id] }, percent(value) { return `${Number(value || 0).toFixed(0)}%` }, statusText(status) { return ['未开始', '开发中', '实施中', '已完成', '已暂停'][status] || '未知状态' }, resizeCharts() { this.charts.forEach(chart => chart.resize()) }, renderCharts() { this.charts.forEach(chart => chart.dispose()); this.charts = []; this.drawPie(this.$refs.projectChart, this.projectRatio, '#3b82f6'); this.drawPie(this.$refs.hoursChart, this.workHourRatio, '#8b5cf6'); this.drawWeekly() }, drawPie(element, data, color) { if (!element) return; const chart = echarts.init(element); const mine = data.mine || 0; const other = data.other || 0; chart.setOption({ color: [color, '#e9eef6'], tooltip: { trigger: 'item', formatter: '{b}<br/>{c} ({d}%)' }, series: [{ type: 'pie', radius: ['58%', '78%'], label: { show: false }, data: [{ value: mine, name: data.mineLabel || '我的数据' }, { value: other, name: data.otherLabel || '其他数据' }] }], graphic: [{ type: 'text', left: 'center', top: '39%', style: { text: String(mine), textAlign: 'center', fill: '#172033', fontSize: 26, fontWeight: 700 }}, { type: 'text', left: 'center', top: '57%', style: { text: '我的数据', textAlign: 'center', fill: '#8190a5', fontSize: 12 }}] }); this.charts.push(chart) }, drawWeekly() { if (!this.$refs.weeklyChart) return; const chart = echarts.init(this.$refs.weeklyChart); chart.setOption({ grid: { left: 38, right: 18, top: 22, bottom: 30 }, tooltip: { trigger: 'axis' }, xAxis: { type: 'category', data: (this.weeklyPlan.dates || []).map(date => date.slice(5)), axisLine: { lineStyle: { color: '#d9e1ec' }}, axisLabel: { color: '#8090a5' }}, yAxis: { type: 'value', minInterval: 1, splitLine: { lineStyle: { color: '#edf1f6' }}, axisLabel: { color: '#8090a5' }}, series: [{ name: '计划任务', type: 'line', smooth: true, symbolSize: 7, data: this.weeklyPlan.taskCounts || [], lineStyle: { color: '#2578f5', width: 3 }, itemStyle: { color: '#2578f5' }, areaStyle: { color: 'rgba(37,120,245,.12)' }}] }); this.charts.push(chart) } }}
+export default { name: 'Portal', data() { return { loading: false, projectsLoading: false, projectPage: 1, projectSize: 6, projects: [], hasMoreProjects: true, overview: {}, projectRatio: {}, workHourRatio: {}, weeklyPlan: {}, charts: [], currentTime: '', timer: null, isDragging: false, dragStartX: 0, dragLastX: 0, dragStartScrollLeft: 0, failedCovers: [], selectedProjectId: null, selectedProjectPlan: null, planView: 'work', planLoading: false } }, computed: { ...mapGetters(['user', 'baseApi']), displayName() { return this.user.person_name || this.user.personName || this.user.username || '当前用户' }, planTasks() { return this.selectedProjectPlan && Array.isArray(this.selectedProjectPlan.tasks) ? this.selectedProjectPlan.tasks : [] }, pendingReports() { return this.selectedProjectPlan && Array.isArray(this.selectedProjectPlan.pendingReports) ? this.selectedProjectPlan.pendingReports : [] } }, mounted() { this.updateTime(); this.timer = window.setInterval(this.updateTime, 1000); this.loadDashboard(); window.addEventListener('resize', this.resizeCharts) }, beforeDestroy() { window.clearInterval(this.timer); window.removeEventListener('resize', this.resizeCharts); this.charts.forEach(chart => chart.dispose()) }, methods: { selectProject(project) { if (!project || this.planLoading) return; this.selectedProjectId = project.id; this.planLoading = true; getProjectPlan(project.id).then(res => { this.selectedProjectPlan = res.data || {}; this.planView = this.selectedProjectPlan.projectLeaderCurrentUser ? 'approval' : 'work' }).finally(() => { this.planLoading = false }) }, viewDevelopmentPlan() { if (this.selectedProjectId) this.$router.push({ path: '/system/project-plan', query: { projectId: this.selectedProjectId } }) }, membersText(members) { return Array.isArray(members) && members.length ? members.join('、') : '-' }, formatDateRange(start, end) { if (!start && !end) return '-'; return `${start || '-'} ~ ${end || '-'}` }, taskTag(status) { return ({ 1: 'info', 2: 'warning', 3: 'success', 4: 'danger' })[status] || 'info' }, priorityTag(priority) { return ({ 1: 'danger', 2: 'warning', 3: 'info' })[priority] || 'info' }, updateTime() { const date = new Date(); this.currentTime = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}:${String(date.getSeconds()).padStart(2, '0')}` }, handleUserCommand(command) { if (command === 'logout') this.$store.dispatch('LogOut').finally(() => { this.$router.push({ path: '/login' }) }) }, loadDashboard(resetProjects = true) { if (this.projectsLoading) return; this.loading = resetProjects && !this.projects.length; this.projectsLoading = true; if (resetProjects) this.projectPage = 1; getDashboard({ projectPage: this.projectPage, projectSize: this.projectSize }).then(res => { const data = res.data || {}; this.overview = data.overview || {}; this.projects = data.projects || []; this.hasMoreProjects = this.projects.length === this.projectSize; this.projectRatio = data.projectRatio || {}; this.workHourRatio = data.workHourRatio || {}; this.weeklyPlan = data.weeklyPlan || {}; this.failedCovers = []; this.$nextTick(this.renderCharts) }).finally(() => { this.loading = false; this.projectsLoading = false }) }, loadMoreProjects() { if (this.projectsLoading || !this.hasMoreProjects) return; const nextPage = this.projectPage + 1; const viewport = this.$refs.projectViewport; const previousScrollLeft = viewport ? viewport.scrollLeft : 0; this.projectsLoading = true; getDashboard({ projectPage: nextPage, projectSize: this.projectSize }).then(res => { const data = res.data || {}; const nextProjects = data.projects || []; const knownIds = new Set(this.projects.map(project => project.id)); this.projects = this.projects.concat(nextProjects.filter(project => !knownIds.has(project.id))); this.projectPage = nextPage; this.hasMoreProjects = nextProjects.length === this.projectSize; this.$nextTick(() => { if (viewport) viewport.scrollTo({ left: previousScrollLeft + viewport.clientWidth, behavior: 'smooth' }) }) }).finally(() => { this.projectsLoading = false }) }, startDrag(event) { if (this.projectsLoading || (event.button !== undefined && event.button !== 0)) return; const point = event.touches ? event.touches[0] : event; const viewport = this.$refs.projectViewport; this.isDragging = true; this.dragStartX = point.clientX; this.dragLastX = point.clientX; this.dragStartScrollLeft = viewport.scrollLeft }, moveDrag(event) { if (!this.isDragging) return; const point = event.touches ? event.touches[0] : event; const viewport = this.$refs.projectViewport; const delta = point.clientX - this.dragStartX; this.dragLastX = point.clientX; const maxScrollLeft = viewport.scrollWidth - viewport.clientWidth; viewport.scrollLeft = Math.max(0, Math.min(maxScrollLeft, this.dragStartScrollLeft - delta)); if (event.cancelable) event.preventDefault() }, endDrag() { if (!this.isDragging) return; const viewport = this.$refs.projectViewport; const movedLeft = this.dragLastX < this.dragStartX - 70; const atRightEdge = viewport.scrollLeft >= viewport.scrollWidth - viewport.clientWidth - 2; this.isDragging = false; if (movedLeft && atRightEdge) this.loadMoreProjects() }, coverUrl(project) { const coverUrl = project && project.coverUrl; if (!coverUrl || this.failedCovers.includes(project.id)) return ''; if (/^(https?:)?\/\//.test(coverUrl)) return coverUrl; const storagePath = coverUrl.startsWith('/project-storage/') ? coverUrl : `/project-storage/${coverUrl.replace(/^\/+/, '')}`; return `${(this.baseApi || '').replace(/\/$/, '')}${storagePath}` }, onCoverError(project) { this.failedCovers = [...this.failedCovers, project.id] }, percent(value) { return `${Number(value || 0).toFixed(0)}%` }, statusText(status) { return ['未开始', '开发中', '实施中', '已完成', '已暂停'][status] || '未知状态' }, resizeCharts() { this.charts.forEach(chart => chart.resize()) }, renderCharts() { this.charts.forEach(chart => chart.dispose()); this.charts = []; this.drawPie(this.$refs.projectChart, this.projectRatio, '#3b82f6'); this.drawPie(this.$refs.hoursChart, this.workHourRatio, '#8b5cf6'); this.drawWeekly() }, drawPie(element, data, color) { if (!element) return; const chart = echarts.init(element); const mine = data.mine || 0; const other = data.other || 0; chart.setOption({ color: [color, '#e9eef6'], tooltip: { trigger: 'item', formatter: '{b}<br/>{c} ({d}%)' }, series: [{ type: 'pie', radius: ['58%', '78%'], label: { show: false }, data: [{ value: mine, name: data.mineLabel || '我的数据' }, { value: other, name: data.otherLabel || '其他数据' }] }], graphic: [{ type: 'text', left: 'center', top: '39%', style: { text: String(mine), textAlign: 'center', fill: '#172033', fontSize: 26, fontWeight: 700 }}, { type: 'text', left: 'center', top: '57%', style: { text: '我的数据', textAlign: 'center', fill: '#8190a5', fontSize: 12 }}] }); this.charts.push(chart) }, weeklyTooltip(params) { const point = params && params[0]; if (!point) return ''; const date = (this.weeklyPlan.dates || [])[point.dataIndex] || point.axisValue || ''; const tasks = ((this.weeklyPlan.taskDetails || [])[point.dataIndex] || []); const taskLines = tasks.length ? tasks.map(task => `${task.projectName || '未命名项目'} <br/> ${task.planName || '未命名计划'}`).join('<br/>') : '暂无计划'; return `${date}<br/>${taskLines}` }, drawWeekly() { if (!this.$refs.weeklyChart) return; const chart = echarts.init(this.$refs.weeklyChart); chart.setOption({ grid: { left: 38, right: 18, top: 22, bottom: 30 }, tooltip: { trigger: 'axis', formatter: params => this.weeklyTooltip(params) }, xAxis: { type: 'category', data: (this.weeklyPlan.dates || []).map(date => date.slice(5)), axisLine: { lineStyle: { color: '#d9e1ec' }}, axisLabel: { color: '#8090a5' }}, yAxis: { type: 'value', minInterval: 1, splitLine: { lineStyle: { color: '#edf1f6' }}, axisLabel: { color: '#8090a5' }}, series: [{ name: '计划任务', type: 'line', smooth: true, symbolSize: 7, data: this.weeklyPlan.taskCounts || [], lineStyle: { color: '#2578f5', width: 3 }, itemStyle: { color: '#2578f5' }, areaStyle: { color: 'rgba(37,120,245,.12)' }}] }); this.charts.push(chart) } }}
 </script>
 <style lang="scss" scoped>
 .portal-page { min-height: 100%; padding: 20px 24px 24px; background: #f5f7fb; color: #172033; }.portal-topbar { display: flex; justify-content: space-between; align-items: center; margin: -20px -24px 20px; padding: 0 26px; height: 58px; background: #fff; border-bottom: 1px solid #e8edf5; }.portal-brand { display: flex; align-items: center; gap: 9px; color: #1f5fbf; font-size: 17px; font-weight: 700; }.portal-brand i { font-size: 21px; }.portal-user-area { display: flex; align-items: center; gap: 18px; }.current-time { color: #8290a3; font-size: 13px; }.user-button { display: flex; align-items: center; gap: 7px; padding: 7px 10px; border: 0; border-radius: 7px; background: #f2f6fc; color: #34445a; cursor: pointer; }.user-button .el-icon-user-solid { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; background: #2678ee; color: #fff; }.user-button .el-icon-arrow-down { font-size: 11px; }.summary-grid, .analysis-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr); gap: 20px; }.summary-panel, .notice-panel, .projects-panel, .metrics-panel, .charts-panel { background: #fff; border: 1px solid #e8edf5; border-radius: 14px; box-shadow: 0 5px 18px rgba(19, 39, 71, .04); }.summary-panel, .notice-panel, .projects-panel, .metrics-panel { padding: 22px; }.panel-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }.panel-heading > span, .panel-heading > div > span { display: block; font-size: 18px; font-weight: 700; }.panel-heading small { display: block; margin-top: 5px; color: #97a4b7; font-size: 12px; font-weight: 400; }.primary-metrics { display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 16px; }.primary-metric { display: flex; align-items: center; min-height: 112px; padding: 19px; border-radius: 12px; }.primary-metric i { width: 56px; height: 56px; margin-right: 16px; border-radius: 14px; line-height: 56px; text-align: center; color: #fff; font-size: 27px; }.primary-metric span, .detail-metrics span { display: block; color: #8491a5; font-size: 13px; }.primary-metric strong { margin: 5px 5px 0 0; font-size: 28px; }.primary-metric em { color: #8491a5; font-style: normal; }.blue { background: #f0f6ff; }.blue i { background: linear-gradient(135deg, #4f96ff, #246dec); }.purple { background: #f6f2ff; }.purple i { background: linear-gradient(135deg, #9c7aff, #7658e8); }.notice-panel ::v-deep .el-empty { padding: 4px 0; }.projects-panel { margin-top: 20px; }.projects-panel .panel-heading { margin-bottom: 16px; }.project-viewport { --project-card-width: 184px; --project-card-gap: 14px; position: relative; width: min(100%, calc(var(--project-card-width) * 6 + var(--project-card-gap) * 5)); margin: 0 auto; overflow: hidden; cursor: grab; user-select: none; touch-action: pan-y; }.project-viewport.is-dragging { cursor: grabbing; }.project-list { display: grid; width: max-content; grid-auto-flow: column; grid-auto-columns: var(--project-card-width); gap: var(--project-card-gap); padding-bottom: 5px; will-change: transform; }.project-load-mask { position: sticky; right: 0; display: inline-flex; align-items: center; gap: 6px; margin-left: 14px; padding: 0 14px; color: #4784d8; font-size: 13px; }.project-card { overflow: hidden; border: 1px solid #e8edf5; border-radius: 10px; transition: transform .2s, box-shadow .2s; }.project-card:hover, .project-card.active { transform: translateY(-3px); box-shadow: 0 9px 18px rgba(37, 74, 131, .12); }.project-card.active { border-color: #2578f5; }.project-cover { height: 108px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: linear-gradient(135deg, #dbeafe, #c7d2fe); color: #3369c8; font-size: 38px; font-weight: 700; }.project-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }.project-card-content { padding: 11px; }.project-card h3 { overflow: hidden; margin: 0; color: #27354a; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }.project-card p { overflow: hidden; margin: 6px 0 9px; color: #97a4b7; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }.empty-projects { padding: 30px; grid-column: 1 / -1; color: #97a4b7; text-align: center; }.personal-plan-panel { margin-top: 20px; background: #fff; border: 1px solid #e8edf5; border-radius: 14px; box-shadow: 0 5px 18px rgba(19, 39, 71, .04); overflow: hidden; }.plan-overview { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px; border-bottom: 1px solid #e8edf5; }.plan-overview h2 { margin: 0; color: #172033; font-size: 21px; }.plan-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 11px; color: #68778d; font-size: 13px; }.plan-workspace { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(0, 3fr); min-height: 400px; background: #f8faff; }.plan-sidebar { padding: 16px; border-right: 1px solid #e8edf5; background: #fff; }.side-entry { display: grid; grid-template-columns: 25px 1fr auto; width: 100%; margin-bottom: 10px; padding: 13px 11px; border: 1px solid #e8edf5; border-radius: 8px; background: #fff; color: #4d5c70; text-align: left; cursor: pointer; }.side-entry i { color: #3b82f6; font-size: 17px; }.side-entry strong { color: #2578f5; }.side-entry small { grid-column: 2 / -1; margin-top: 5px; color: #a3adbc; font-size: 11px; }.side-entry.active { border-color: #8cc1ff; background: #eff7ff; }.side-entry:disabled { cursor: not-allowed; opacity: .65; }.plan-detail { padding: 20px; }.detail-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }.detail-heading h3 { margin: 0; font-size: 17px; }.detail-heading span { color: #97a4b7; font-size: 12px; }.portal-plan-list { max-height: 500px; padding-right: 8px; overflow-y: auto; }.portal-master-card { margin-bottom: 13px; padding: 15px; border: 1px solid #e8edf5; border-radius: 8px; background: #fff; }.portal-master-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; color: #27354a; }.portal-master-header > span { display: flex; flex-wrap: wrap; gap: 6px; }.portal-master-card p { margin: 5px 0 7px; color: #718096; font-size: 12px; }.plan-detail-meta { display: flex; flex-wrap: wrap; gap: 14px; color: #8491a5; font-size: 12px; }.work-item { margin-bottom: 12px; padding: 14px; border: 1px solid #e8edf5; border-radius: 8px; background: #fff; }.work-title { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: #2578f5; }.work-title strong { margin-left: 7px; color: #27354a; }.priority-tag { margin-left: 4px; }.work-item p { margin: 7px 0; color: #8491a5; font-size: 12px; }.plan-empty { padding: 120px 0; color: #a5afbd; text-align: center; }.detail-metrics { display: grid; gap: 17px; }.detail-metrics div { padding: 13px 0; border-bottom: 1px solid #eef2f7; }.detail-metrics strong { display: block; margin-top: 7px; color: #1781e7; font-size: 25px; }.detail-metrics strong small { display: inline; margin-left: 3px; color: #1781e7; font-size: 12px; }.reserved-note { margin: 19px 0 0; color: #a0acbd; font-size: 12px; line-height: 1.7; }.charts-panel { padding: 20px; }.pie-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }.chart-card { padding: 8px 12px 0; border: 1px solid #edf1f6; border-radius: 10px; }.chart-card h3, .line-card h3 { margin: 0; font-size: 15px; }.pie-chart { height: 205px; }.line-card { margin-top: 18px; padding: 18px; border: 1px solid #edf1f6; border-radius: 10px; }.line-card p { margin: 6px 0 0; color: #97a4b7; font-size: 12px; }.weekly-chart { height: 245px; }@media (max-width: 1180px) { .project-viewport { --project-card-width: 31%; width: 100%; }.analysis-grid, .summary-grid { grid-template-columns: 1fr; } }@media (max-width: 680px) { .portal-page { padding: 14px; }.portal-topbar { margin: -14px -14px 14px; padding: 0 14px; }.current-time { display: none; }.project-viewport { --project-card-width: calc((100vw - 56px) / 2); width: 100%; }.primary-metrics, .pie-grid { grid-template-columns: 1fr 1fr; }.primary-metric { padding: 12px; }.primary-metric i { width: 42px; height: 42px; margin-right: 9px; line-height: 42px; font-size: 21px; }.primary-metric strong { font-size: 22px; } }