Browse Source

feat: enhance project progress modal and dashboard functionality

- Updated the project progress modal to include a new button for navigating to project details, improving user experience.
- Added company ID input to the project progress modal for better context in project navigation.
- Enhanced styling for the new navigation button to ensure it is visually appealing and user-friendly.
- Commented out the view toggle button in the dashboard for a cleaner interface, while maintaining the option for future use.
0235711 3 ngày trước cách đây
mục cha
commit
5f00fbf513

+ 3 - 3
src/app/pages/designer/dashboard/dashboard.html

@@ -58,12 +58,12 @@
   <!-- 主要内容区域 - 工作台 -->
   <div *ngIf="activeDashboard === 'main'" class="dashboard-main">
 
-    <!-- 视图切换按钮 -->
-    <div class="view-toggle">
+    <!-- 视图切换按钮 - 已隐藏 -->
+    <!-- <div class="view-toggle">
       <button class="toggle-btn" (click)="toggleView()">
         {{ viewMode === 'card' ? '切换为列表' : '切换为卡片' }}
       </button>
-    </div>
+    </div> -->
 
     <!-- 卡片视图 -->
     @if (viewMode === 'card') {

+ 1 - 0
src/app/pages/team-leader/project-timeline/project-timeline.html

@@ -292,6 +292,7 @@
 <app-project-progress-modal
   [visible]="showProgressModal"
   [summary]="selectedProjectSummary"
+  [companyId]="companyId"
   (close)="onCloseProgressModal()"
   (reportIssue)="onReportIssueFromModal($event)">
 </app-project-progress-modal>

+ 1 - 0
src/modules/project/components/project-bottom-card/project-bottom-card.component.html

@@ -104,6 +104,7 @@
 <app-project-progress-modal
   [visible]="showProgressModal"
   [summary]="projectProgressSummary"
+  [companyId]="cid"
   (close)="onCloseProgressModal()"
   (reportIssue)="onReportIssueFromModal($event)">
 </app-project-progress-modal>

+ 10 - 0
src/modules/project/components/project-progress-modal/project-progress-modal.component.html

@@ -18,6 +18,16 @@
       <div class="info-row">
         <span class="label">项目名称:</span>
         <span class="value">{{ summary.projectName }}</span>
+        <!-- 🆕 进入项目按钮 -->
+        <a 
+          *ngIf="canNavigateToProject()"
+          [routerLink]="getProjectDetailRoute()"
+          class="enter-project-btn"
+          (click)="onClose()"
+          title="进入项目详情页">
+          <span class="btn-icon">🚀</span>
+          进入项目
+        </a>
       </div>
       <div class="info-row">
         <span class="label">空间总数:</span>

+ 32 - 0
src/modules/project/components/project-progress-modal/project-progress-modal.component.scss

@@ -133,6 +133,38 @@
     .value {
       color: #333;
       font-weight: 600;
+      flex: 1;
+    }
+
+    // 🆕 进入项目按钮样式
+    .enter-project-btn {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      padding: 8px 16px;
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      color: white;
+      text-decoration: none;
+      border-radius: 6px;
+      font-size: 14px;
+      font-weight: 600;
+      transition: all 0.2s;
+      margin-left: 12px;
+      white-space: nowrap;
+      
+      &:hover {
+        background: linear-gradient(135deg, #5568d3 0%, #65408b 100%);
+        transform: translateY(-1px);
+        box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4);
+      }
+      
+      &:active {
+        transform: translateY(0);
+      }
+      
+      .btn-icon {
+        font-size: 16px;
+      }
     }
   }
 }

+ 20 - 1
src/modules/project/components/project-progress-modal/project-progress-modal.component.ts

@@ -1,6 +1,7 @@
 import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
+import { RouterModule } from '@angular/router';
 import { ProjectSpaceDeliverableSummary, PhaseProgressInfo } from '../../services/project-space-deliverable.service';
 import { PHASE_INFO, PhaseName } from '../../../../app/models/project-phase.model';
 
@@ -21,13 +22,14 @@ import { PHASE_INFO, PhaseName } from '../../../../app/models/project-phase.mode
 @Component({
   selector: 'app-project-progress-modal',
   standalone: true,
-  imports: [CommonModule, FormsModule],
+  imports: [CommonModule, FormsModule, RouterModule],
   templateUrl: './project-progress-modal.component.html',
   styleUrl: './project-progress-modal.component.scss'
 })
 export class ProjectProgressModalComponent implements OnInit {
   @Input() summary: ProjectSpaceDeliverableSummary | null = null;
   @Input() visible: boolean = false;
+  @Input() companyId: string = ''; // 🆕 公司ID,用于项目详情页导航
   @Output() close = new EventEmitter<void>();
   @Output() reportIssue = new EventEmitter<string>(); // 提交问题,传递项目ID
 
@@ -131,5 +133,22 @@ export class ProjectProgressModalComponent implements OnInit {
     if (!this.summary) return '加载中';
     return this.getPhaseStatusLabel(this.summary.overallCompletionRate);
   }
+
+  /**
+   * 🆕 获取项目详情页路由
+   */
+  getProjectDetailRoute(): string[] {
+    if (!this.summary || !this.companyId) {
+      return [];
+    }
+    return ['/wxwork', this.companyId, 'project', this.summary.projectId];
+  }
+
+  /**
+   * 🆕 检查是否可以导航到项目详情页
+   */
+  canNavigateToProject(): boolean {
+    return !!(this.summary?.projectId && this.companyId);
+  }
 }