project-list.ts 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773
  1. import { Component, OnInit, OnDestroy, signal, computed, Inject } from '@angular/core';
  2. import { CommonModule } from '@angular/common';
  3. import { FormsModule } from '@angular/forms';
  4. import { Router, RouterModule, ActivatedRoute } from '@angular/router';
  5. import { MatDialog, MatDialogModule } from '@angular/material/dialog';
  6. import { ProjectService } from '../../../services/project.service';
  7. import { ConsultationOrderDialogComponent } from '../consultation-order/consultation-order-dialog.component';
  8. import { Project, ProjectStatus, ProjectStage } from '../../../models/project.model';
  9. import { FmodeParse, FmodeObject } from 'fmode-ng/parse';
  10. import { ProfileService } from '../../../services/profile.service';
  11. import { normalizeStage, getProjectStatusByStage } from '../../../utils/project-stage-mapper';
  12. const Parse = FmodeParse.with('nova');
  13. // 定义项目列表项接口,包含计算后的属性
  14. interface ProjectListItem extends Project {
  15. progress: number;
  16. daysUntilDeadline: number;
  17. isUrgent: boolean;
  18. tagDisplayText: string;
  19. }
  20. @Component({
  21. selector: 'app-project-list',
  22. standalone: true,
  23. imports: [CommonModule, FormsModule, RouterModule, MatDialogModule],
  24. templateUrl: './project-list.html',
  25. styleUrls: ['./project-list.scss', '../customer-service-styles.scss']
  26. })
  27. export class ProjectList implements OnInit, OnDestroy {
  28. // 项目列表数据
  29. projects = signal<ProjectListItem[]>([]);
  30. // 原始项目数据(用于筛选)
  31. allProjects = signal<Project[]>([]);
  32. // 视图模式:卡片 / 列表 / 监控大盘(默认卡片)
  33. viewMode = signal<'card' | 'list' | 'dashboard'>('card');
  34. // 看板列配置 - 按照订单分配、确认需求、交付执行、售后四个阶段
  35. columns = [
  36. { id: 'order', name: '订单分配' },
  37. { id: 'requirements', name: '确认需求' },
  38. { id: 'delivery', name: '交付执行' },
  39. { id: 'aftercare', name: '售后' }
  40. ] as const;
  41. // 基础项目集合(服务端返回 + 本地生成),用于二次处理
  42. private baseProjects: Project[] = [];
  43. // 消息监听器
  44. private messageListener?: (event: MessageEvent) => void;
  45. // 添加toggleSidebar方法
  46. toggleSidebar(): void {
  47. // 侧边栏切换逻辑
  48. console.log('Toggle sidebar');
  49. }
  50. // 筛选和排序状态
  51. searchTerm = signal('');
  52. statusFilter = signal<string>('all');
  53. stageFilter = signal<string>('all');
  54. sortBy = signal<string>('deadline');
  55. // 当前页码
  56. currentPage = signal(1);
  57. // 每页显示数量
  58. pageSize = 8;
  59. // 分页后的项目列表(列表模式下可用)
  60. paginatedProjects = computed(() => {
  61. const filteredProjects = this.projects();
  62. const startIndex = (this.currentPage() - 1) * this.pageSize;
  63. return filteredProjects.slice(startIndex, startIndex + this.pageSize);
  64. });
  65. // 总页数
  66. totalPages = computed(() => {
  67. return Math.ceil(this.projects().length / this.pageSize);
  68. });
  69. // 筛选和排序选项
  70. statusOptions = [
  71. { value: 'all', label: '全部' },
  72. { value: 'order', label: '订单分配' },
  73. { value: 'requirements', label: '确认需求' },
  74. { value: 'delivery', label: '交付执行' },
  75. { value: 'aftercare', label: '售后' }
  76. ];
  77. stageOptions = [
  78. { value: 'all', label: '全部阶段' },
  79. { value: '需求沟通', label: '需求沟通' },
  80. { value: '建模', label: '建模' },
  81. { value: '软装', label: '软装' },
  82. { value: '渲染', label: '渲染' },
  83. { value: '尾款结算', label: '尾款结算' },
  84. { value: '投诉处理', label: '投诉处理' }
  85. ];
  86. sortOptions = [
  87. { value: 'deadline', label: '截止日期' },
  88. { value: 'createdAt', label: '创建时间' },
  89. { value: 'name', label: '项目名称' }
  90. ];
  91. // Parse相关
  92. company: FmodeObject | null = null;
  93. currentProfile: FmodeObject | null = null;
  94. isLoading = signal(false);
  95. loadError = signal<string | null>(null);
  96. constructor(
  97. private projectService: ProjectService,
  98. private router: Router,
  99. private route: ActivatedRoute,
  100. private dialog: MatDialog,
  101. private profileService: ProfileService
  102. ) {}
  103. async ngOnInit(): Promise<void> {
  104. // 读取上次的视图记忆
  105. const saved = localStorage.getItem('cs.viewMode');
  106. if (saved === 'card' || saved === 'list' || saved === 'dashboard') {
  107. this.viewMode.set(saved as 'card' | 'list' | 'dashboard');
  108. }
  109. // 初始化用户和公司信息
  110. await this.initializeUserAndCompany();
  111. // 清理重复的Product记录(确保每个项目在每个阶段只出现一次)
  112. await this.cleanupDuplicateProducts();
  113. // 加载真实项目数据
  114. await this.loadProjects();
  115. // 处理来自dashboard的查询参数
  116. this.route.queryParams.subscribe(params => {
  117. const filter = params['filter'];
  118. if (filter === 'all') {
  119. // 显示所有项目 - 重置筛选
  120. this.statusFilter.set('all');
  121. console.log('✅ 显示所有项目');
  122. } else if (filter === 'pending') {
  123. // 筛选待分配项目 - 使用'order'列ID
  124. this.statusFilter.set('order');
  125. console.log('✅ 筛选待分配项目(订单分配阶段)');
  126. }
  127. });
  128. // 添加消息监听器,处理来自iframe的导航请求
  129. this.messageListener = (event: MessageEvent) => {
  130. // 验证消息来源(可以根据需要添加更严格的验证)
  131. if (event.data && event.data.type === 'navigate' && event.data.route) {
  132. this.router.navigate([event.data.route]);
  133. }
  134. };
  135. window.addEventListener('message', this.messageListener);
  136. }
  137. ngOnDestroy(): void {
  138. // 清理消息监听器
  139. if (this.messageListener) {
  140. window.removeEventListener('message', this.messageListener);
  141. }
  142. }
  143. // 视图切换
  144. toggleView(mode: 'card' | 'list' | 'dashboard') {
  145. if (this.viewMode() !== mode) {
  146. this.viewMode.set(mode);
  147. localStorage.setItem('cs.viewMode', mode);
  148. }
  149. }
  150. // 初始化用户和公司信息
  151. private async initializeUserAndCompany(): Promise<void> {
  152. try {
  153. // 方法1: 从localStorage获取公司ID(参考team-leader的实现)
  154. const companyId = localStorage.getItem('company');
  155. if (companyId) {
  156. // 创建公司指针对象
  157. const CompanyClass = Parse.Object.extend('Company');
  158. this.company = new CompanyClass();
  159. this.company.id = companyId;
  160. console.log('✅ 从localStorage加载公司ID:', companyId);
  161. } else {
  162. // 方法2: 从Profile获取公司信息
  163. this.currentProfile = await this.profileService.getCurrentProfile();
  164. if (!this.currentProfile) {
  165. throw new Error('无法获取用户信息');
  166. }
  167. // 获取公司信息
  168. this.company = this.currentProfile.get('company');
  169. if (!this.company) {
  170. throw new Error('无法获取公司信息');
  171. }
  172. console.log('✅ 从Profile加载公司信息:', this.company.get('name'));
  173. }
  174. } catch (error) {
  175. console.error('❌ 初始化用户和公司信息失败:', error);
  176. this.loadError.set('加载用户信息失败,请刷新页面重试');
  177. }
  178. }
  179. // 获取公司指针
  180. private getCompanyPointer() {
  181. if (!this.company) {
  182. throw new Error('公司信息未初始化');
  183. }
  184. return {
  185. __type: 'Pointer',
  186. className: 'Company',
  187. objectId: this.company.id
  188. };
  189. }
  190. /**
  191. * 清理重复的Product记录
  192. * 对于同一个项目中相同名称的Product,只保留最早创建的,删除其他重复的
  193. */
  194. private async cleanupDuplicateProducts(): Promise<void> {
  195. if (!this.company) {
  196. console.warn('公司信息未加载,跳过重复清理');
  197. return;
  198. }
  199. try {
  200. console.log('🔍 开始检查重复的Product记录...');
  201. // 查询所有Product
  202. const ProductQuery = new Parse.Query('Product');
  203. ProductQuery.equalTo('company', this.getCompanyPointer());
  204. ProductQuery.notEqualTo('isDeleted', true);
  205. ProductQuery.limit(1000);
  206. const allProducts = await ProductQuery.find();
  207. console.log(`📦 找到 ${allProducts.length} 个Product记录`);
  208. // 按项目分组,然后按产品名称检测重复
  209. const projectMap = new Map<string, Map<string, any[]>>();
  210. for (const product of allProducts) {
  211. const projectId = product.get('project')?.id;
  212. const productName = (product.get('productName') || '').trim().toLowerCase();
  213. if (!projectId || !productName) continue;
  214. if (!projectMap.has(projectId)) {
  215. projectMap.set(projectId, new Map());
  216. }
  217. const productsByName = projectMap.get(projectId)!;
  218. if (!productsByName.has(productName)) {
  219. productsByName.set(productName, []);
  220. }
  221. productsByName.get(productName)!.push(product);
  222. }
  223. // 找出并删除重复的Product
  224. let duplicateCount = 0;
  225. const duplicatesToDelete: any[] = [];
  226. for (const [projectId, productsByName] of projectMap.entries()) {
  227. for (const [productName, products] of productsByName.entries()) {
  228. if (products.length > 1) {
  229. console.log(`⚠️ 项目 ${projectId} 中发现重复空间: "${productName}" (${products.length}个)`);
  230. // 按创建时间排序,保留最早的,删除其他的
  231. products.sort((a, b) => {
  232. const timeA = a.get('createdAt')?.getTime() || 0;
  233. const timeB = b.get('createdAt')?.getTime() || 0;
  234. return timeA - timeB;
  235. });
  236. // 保留第一个,删除其他的
  237. for (let i = 1; i < products.length; i++) {
  238. duplicatesToDelete.push(products[i]);
  239. duplicateCount++;
  240. console.log(` 🗑️ 标记删除: ${products[i].get('productName')} (${products[i].id})`);
  241. }
  242. }
  243. }
  244. }
  245. // 批量删除重复的Product
  246. if (duplicatesToDelete.length > 0) {
  247. console.log(`🗑️ 准备删除 ${duplicatesToDelete.length} 个重复Product...`);
  248. for (const product of duplicatesToDelete) {
  249. try {
  250. product.set('isDeleted', true);
  251. product.set('data', {
  252. ...product.get('data'),
  253. deletedAt: new Date(),
  254. deletedReason: '重复产品,自动清理'
  255. });
  256. await product.save();
  257. console.log(` ✅ 已删除: ${product.get('productName')} (${product.id})`);
  258. } catch (error) {
  259. console.error(` ❌ 删除失败: ${product.id}`, error);
  260. }
  261. }
  262. console.log(`✅ 重复Product清理完成,共删除 ${duplicateCount} 个`);
  263. } else {
  264. console.log('✅ 未发现重复的Product记录');
  265. }
  266. } catch (error) {
  267. console.error('❌ 清理重复Product失败:', error);
  268. // 不阻塞主流程
  269. }
  270. }
  271. // 加载项目列表(从Parse Server)
  272. async loadProjects(): Promise<void> {
  273. if (!this.company) {
  274. console.warn('公司信息未加载,跳过项目加载');
  275. return;
  276. }
  277. this.isLoading.set(true);
  278. this.loadError.set(null);
  279. try {
  280. const ProjectQuery = new Parse.Query('Project');
  281. ProjectQuery.equalTo('company', this.getCompanyPointer());
  282. // 不强制要求isDeleted字段,兼容没有该字段的数据
  283. ProjectQuery.notEqualTo('isDeleted', true);
  284. ProjectQuery.include('contact', 'assignee', 'owner');
  285. ProjectQuery.descending('updatedAt');
  286. ProjectQuery.limit(500); // 获取最多500个项目
  287. const projectObjects = await ProjectQuery.find();
  288. console.log(`✅ 从Parse Server加载了 ${projectObjects.length} 个项目`);
  289. // 如果没有数据,打印调试信息
  290. if (projectObjects.length === 0) {
  291. console.warn('⚠️ 未找到项目数据,请检查:');
  292. console.warn('1. Parse Server中是否有Project数据');
  293. console.warn('2. 当前公司ID:', this.company.id);
  294. console.warn('3. 数据是否正确关联到当前公司');
  295. }
  296. // 转换为Project接口格式(并从Product表同步最新阶段)
  297. const projects: Project[] = await Promise.all(projectObjects.map(async (obj: FmodeObject) => {
  298. const contact = obj.get('contact');
  299. const assignee = obj.get('assignee');
  300. // 🔄 从Product表读取最新阶段(与组长端保持一致)
  301. let rawStage = obj.get('currentStage') || obj.get('stage') || '订单分配';
  302. try {
  303. const ProductQuery = new Parse.Query('Product');
  304. ProductQuery.equalTo('project', { __type: 'Pointer', className: 'Project', objectId: obj.id });
  305. ProductQuery.notEqualTo('isDeleted', true);
  306. ProductQuery.descending('updatedAt');
  307. ProductQuery.limit(1);
  308. const latestProduct = await ProductQuery.first();
  309. if (latestProduct) {
  310. const productStage = latestProduct.get('stage');
  311. if (productStage) {
  312. rawStage = productStage;
  313. console.log(`📦 项目 ${obj.get('title')} 从Product同步阶段: ${productStage}`);
  314. }
  315. }
  316. } catch (error) {
  317. console.warn(`⚠️ 查询项目 ${obj.id} 的Product失败:`, error);
  318. }
  319. // 🔄 规范化阶段名称(统一为四大核心阶段)
  320. const normalizedStage = normalizeStage(rawStage);
  321. // 🔄 根据阶段自动判断状态(与组长端、管理端保持一致)
  322. const projectStatus = obj.get('status');
  323. const autoStatus = getProjectStatusByStage(rawStage, projectStatus);
  324. console.log(`📊 客服项目 "${obj.get('title')}": 原始阶段=${rawStage}, 规范化阶段=${normalizedStage}, 原状态=${projectStatus}, 自动状态=${autoStatus}`);
  325. // 确保updatedAt是Date对象
  326. const updatedAt = obj.get('updatedAt');
  327. const createdAt = obj.get('createdAt');
  328. return {
  329. id: obj.id,
  330. name: obj.get('title') || '未命名项目',
  331. customerName: contact?.get('name') || '未知客户',
  332. customerId: contact?.id || '',
  333. status: autoStatus as ProjectStatus, // 使用根据阶段自动判断的状态
  334. currentStage: normalizedStage as ProjectStage,
  335. stage: normalizedStage as ProjectStage, // stage和currentStage保持一致
  336. assigneeId: assignee?.id || '',
  337. assigneeName: assignee?.get('name') || '未分配',
  338. deadline: obj.get('deadline') || new Date(Date.now() + 30 * 24 * 60 * 60 * 1000),
  339. createdAt: createdAt instanceof Date ? createdAt : (createdAt ? new Date(createdAt) : new Date()),
  340. updatedAt: updatedAt instanceof Date ? updatedAt : (updatedAt ? new Date(updatedAt) : new Date()),
  341. description: obj.get('description') || '',
  342. priority: obj.get('priority') || 'medium',
  343. customerTags: [],
  344. highPriorityNeeds: [],
  345. skillsRequired: [],
  346. contact: contact
  347. };
  348. }));
  349. this.allProjects.set(projects);
  350. this.baseProjects = projects;
  351. this.processProjects(projects);
  352. console.log('项目数据处理完成');
  353. } catch (error) {
  354. console.error('加载项目列表失败:', error);
  355. this.loadError.set('加载项目列表失败,请刷新页面重试');
  356. this.projects.set([]);
  357. } finally {
  358. this.isLoading.set(false);
  359. }
  360. }
  361. // 映射Parse Server状态到前端状态
  362. private mapStatus(parseStatus: string): ProjectStatus {
  363. const statusMap: Record<string, ProjectStatus> = {
  364. '进行中': '进行中',
  365. '已完成': '已完成',
  366. '已暂停': '已暂停',
  367. '已延期': '已延期'
  368. };
  369. return statusMap[parseStatus] || '进行中';
  370. }
  371. // 映射Parse Server阶段到前端阶段
  372. private mapStage(parseStage: string): ProjectStage {
  373. // 直接返回Parse Server的阶段,不做转换
  374. // Parse Server的currentStage字段包含:订单分配、需求沟通、建模、软装、渲染、后期、尾款结算、投诉处理等
  375. if (!parseStage) {
  376. return '需求沟通'; // 默认阶段
  377. }
  378. return parseStage as ProjectStage;
  379. }
  380. // 处理项目数据,添加计算属性
  381. processProjects(projects: Project[]): void {
  382. const processedProjects = projects.map(project => {
  383. // 计算项目进度(模拟)
  384. const progress = this.calculateProjectProgress(project);
  385. // 计算距离截止日期的天数
  386. const daysUntilDeadline = this.calculateDaysUntilDeadline(project.deadline);
  387. // 判断是否紧急(截止日期前3天或已逾期)
  388. const isUrgent = daysUntilDeadline <= 3 && project.status === '进行中';
  389. // 生成标签显示文本
  390. const tagDisplayText = this.generateTagDisplayText(project);
  391. return {
  392. ...project,
  393. progress,
  394. daysUntilDeadline,
  395. isUrgent,
  396. tagDisplayText
  397. };
  398. });
  399. this.projects.set(this.applyFiltersAndSorting(processedProjects));
  400. }
  401. // 应用筛选和排序
  402. applyFiltersAndSorting(projects: ProjectListItem[]): ProjectListItem[] {
  403. let filteredProjects = [...projects];
  404. // 搜索筛选
  405. if (this.searchTerm().trim()) {
  406. const searchLower = this.searchTerm().toLowerCase().trim();
  407. filteredProjects = filteredProjects.filter(project =>
  408. project.name.toLowerCase().includes(searchLower) ||
  409. project.customerName.toLowerCase().includes(searchLower)
  410. );
  411. }
  412. // 状态筛选(按看板列映射)
  413. if (this.statusFilter() !== 'all') {
  414. const col = this.statusFilter() as 'order' | 'requirements' | 'delivery' | 'aftercare';
  415. filteredProjects = filteredProjects.filter(project =>
  416. this.getColumnIdForProject(project) === col
  417. );
  418. }
  419. // 阶段筛选
  420. if (this.stageFilter() !== 'all') {
  421. filteredProjects = filteredProjects.filter(project =>
  422. project.currentStage === this.stageFilter()
  423. );
  424. }
  425. // 排序
  426. filteredProjects.sort((a, b) => {
  427. switch (this.sortBy()) {
  428. case 'deadline':
  429. return new Date(a.deadline).getTime() - new Date(b.deadline).getTime();
  430. case 'createdAt':
  431. return new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime();
  432. case 'name':
  433. return a.name.localeCompare(b.name);
  434. default:
  435. return 0;
  436. }
  437. });
  438. return filteredProjects;
  439. }
  440. // 生成标签显示文本
  441. generateTagDisplayText(project: Project): string {
  442. if (!project.customerTags || project.customerTags.length === 0) {
  443. return '普通项目';
  444. }
  445. const tag = project.customerTags[0];
  446. return `${tag.preference}${tag.needType}`;
  447. }
  448. // 计算项目进度(模拟)
  449. calculateProjectProgress(project: Project): number {
  450. if (project.status === '已完成') return 100;
  451. if (project.status === '已暂停' || project.status === '已延期') return 0;
  452. // 基于当前阶段计算进度(包含四大核心阶段和细分阶段)
  453. const stageProgress: Record<ProjectStage, number> = {
  454. // 四大核心阶段
  455. '订单分配': 0,
  456. '确认需求': 25,
  457. '交付执行': 60,
  458. '售后归档': 95,
  459. // 细分阶段(向后兼容)
  460. '需求沟通': 20,
  461. '方案确认': 30,
  462. '建模': 40,
  463. '软装': 50,
  464. '渲染': 70,
  465. '后期': 85,
  466. '尾款结算': 90,
  467. '客户评价': 100,
  468. '投诉处理': 100
  469. };
  470. return stageProgress[project.currentStage] || 0;
  471. }
  472. // 计算距离截止日期的天数
  473. calculateDaysUntilDeadline(deadline: Date): number {
  474. const now = new Date();
  475. const deadlineDate = new Date(deadline);
  476. const diffTime = deadlineDate.getTime() - now.getTime();
  477. return Math.ceil(diffTime / (1000 * 60 * 60 * 24));
  478. }
  479. // 列表/筛选交互(保留已有实现)
  480. onSearch(): void {
  481. // 搜索后重算
  482. this.processProjects(this.baseProjects);
  483. }
  484. onStatusChange(event: Event): void {
  485. const value = (event.target as HTMLSelectElement).value;
  486. this.statusFilter.set(value);
  487. this.processProjects(this.baseProjects);
  488. }
  489. onStageChange(event: Event): void {
  490. const value = (event.target as HTMLSelectElement).value;
  491. this.stageFilter.set(value);
  492. this.processProjects(this.baseProjects);
  493. }
  494. onSortChange(event: Event): void {
  495. const value = (event.target as HTMLSelectElement).value;
  496. this.sortBy.set(value);
  497. this.processProjects(this.baseProjects);
  498. }
  499. goToPage(page: number): void {
  500. if (page >= 1 && page <= this.totalPages()) {
  501. this.currentPage.set(page);
  502. }
  503. }
  504. prevPage(): void {
  505. if (this.currentPage() > 1) {
  506. this.currentPage.update(v => v - 1);
  507. }
  508. }
  509. nextPage(): void {
  510. if (this.currentPage() < this.totalPages()) {
  511. this.currentPage.update(v => v + 1);
  512. }
  513. }
  514. pageNumbers = computed(() => {
  515. const total = this.totalPages();
  516. const pages: number[] = [];
  517. const maxToShow = Math.min(total, 5);
  518. for (let i = 1; i <= maxToShow; i++) pages.push(i);
  519. return pages;
  520. });
  521. getAbsValue(value: number): number {
  522. return Math.abs(value);
  523. }
  524. formatDate(date: Date): string {
  525. const d = new Date(date);
  526. const y = d.getFullYear();
  527. const m = String(d.getMonth() + 1).padStart(2, '0');
  528. const day = String(d.getDate()).padStart(2, '0');
  529. return `${y}-${m}-${day}`;
  530. }
  531. getStatusClass(status: string): string {
  532. switch (status) {
  533. case '进行中': return 'status-in-progress';
  534. case '已完成': return 'status-completed';
  535. case '已暂停': return 'status-paused';
  536. case '已延期': return 'status-overdue';
  537. default: return '';
  538. }
  539. }
  540. getStageClass(stage: string): string {
  541. switch (stage) {
  542. case '需求沟通': return 'stage-communication';
  543. case '建模': return 'stage-modeling';
  544. case '软装': return 'stage-decoration';
  545. case '渲染': return 'stage-rendering';
  546. case '投诉处理': return 'stage-completed';
  547. case '订单分配': return 'stage-active';
  548. case '方案确认': return 'stage-active';
  549. case '尾款结算': return 'stage-completed';
  550. case '客户评价': return 'stage-completed';
  551. default: return '';
  552. }
  553. }
  554. // 看板分组逻辑 - 按照订单分配、确认需求、交付执行、售后四个阶段
  555. // 🔄 使用规范化后的四大核心阶段名称进行匹配
  556. private isOrderAssignment(p: Project): boolean {
  557. // 订单分配阶段:currentStage为"订单分配"
  558. const stage = p.currentStage as string;
  559. return stage === '订单分配';
  560. }
  561. private isRequirementsConfirmation(p: Project): boolean {
  562. // 确认需求阶段:currentStage为"确认需求"
  563. // 注意:阶段已经通过normalizeStage规范化为四大核心阶段
  564. const stage = p.currentStage as string;
  565. return stage === '确认需求';
  566. }
  567. private isDeliveryExecution(p: Project): boolean {
  568. // 交付执行阶段:currentStage为"交付执行"
  569. const stage = p.currentStage as string;
  570. return stage === '交付执行';
  571. }
  572. private isAftercare(p: Project): boolean {
  573. // 售后归档阶段:currentStage为"售后归档" 或 状态为"已完成"
  574. const stage = p.currentStage as string;
  575. return stage === '售后归档' || p.status === '已完成';
  576. }
  577. getProjectsByColumn(columnId: 'order' | 'requirements' | 'delivery' | 'aftercare'): ProjectListItem[] {
  578. const list = this.projects();
  579. switch (columnId) {
  580. case 'order':
  581. return list.filter(p => this.isOrderAssignment(p));
  582. case 'requirements':
  583. return list.filter(p => this.isRequirementsConfirmation(p));
  584. case 'delivery':
  585. return list.filter(p => this.isDeliveryExecution(p));
  586. case 'aftercare':
  587. return list.filter(p => this.isAftercare(p));
  588. }
  589. }
  590. // 新增:根据项目状态与阶段推断所在看板列
  591. getColumnIdForProject(project: ProjectListItem): 'order' | 'requirements' | 'delivery' | 'aftercare' {
  592. if (this.isOrderAssignment(project)) return 'order';
  593. if (this.isRequirementsConfirmation(project)) return 'requirements';
  594. if (this.isDeliveryExecution(project)) return 'delivery';
  595. if (this.isAftercare(project)) return 'aftercare';
  596. return 'requirements'; // 默认为确认需求阶段
  597. }
  598. // 详情跳转到wxwork项目详情页面(与组长、管理员保持一致)
  599. navigateToProject(project: ProjectListItem, columnId: 'order' | 'requirements' | 'delivery' | 'aftercare') {
  600. // 获取公司ID
  601. const cid = localStorage.getItem('company') || '';
  602. if (!cid) {
  603. console.error('未找到公司ID,无法跳转到项目详情页');
  604. return;
  605. }
  606. // 根据columnId映射到wxwork路由的阶段路径
  607. // wxwork路由支持的阶段:order, requirements, delivery, aftercare, issues
  608. const stagePathMapping = {
  609. 'order': 'order', // 订单分配
  610. 'requirements': 'requirements', // 确认需求
  611. 'delivery': 'delivery', // 交付执行
  612. 'aftercare': 'aftercare' // 售后归档
  613. };
  614. const stagePath = stagePathMapping[columnId];
  615. // ✅ 标记从客服板块进入(用于控制"确认订单"按钮权限)
  616. try {
  617. localStorage.setItem('enterFromCustomerService', '1');
  618. localStorage.setItem('customerServiceMode', 'true');
  619. console.log('✅ 已标记从客服板块进入,允许确认订单');
  620. } catch (e) {
  621. console.warn('无法设置 localStorage 标记:', e);
  622. }
  623. // 跳转到wxwork路由的项目详情页(纯净页面,无管理端侧边栏)
  624. // 路由格式:/wxwork/:cid/project/:projectId/:stage
  625. this.router.navigate(['/wxwork', cid, 'project', project.id, stagePath]);
  626. }
  627. // 新增:直接进入沟通管理(消息)标签
  628. navigateToMessages(project: ProjectListItem) {
  629. this.router.navigate(['/customer-service/messages'], { queryParams: { projectId: project.id } });
  630. }
  631. // 导航到创建订单页面
  632. navigateToCreateOrder() {
  633. // 打开咨询订单弹窗
  634. const dialogRef = this.dialog.open(ConsultationOrderDialogComponent, {
  635. width: '900px',
  636. maxWidth: '95vw',
  637. maxHeight: '90vh',
  638. panelClass: 'consultation-order-dialog'
  639. });
  640. // 监听订单分配成功事件
  641. dialogRef.componentInstance.orderCreated.subscribe((orderData: any) => {
  642. // 关闭弹窗
  643. dialogRef.close();
  644. // 准备同步数据
  645. const syncData = {
  646. customerInfo: orderData.customerInfo,
  647. requirementInfo: orderData.requirementInfo,
  648. preferenceTags: orderData.preferenceTags,
  649. assignedDesigner: orderData.assignedDesigner
  650. };
  651. // 跳转到新创建的项目详情页面,传递同步数据
  652. this.router.navigate([
  653. '/designer/project-detail',
  654. orderData.orderId
  655. ], {
  656. queryParams: {
  657. role: 'customer-service',
  658. activeTab: 'overview',
  659. syncData: JSON.stringify(syncData)
  660. }
  661. });
  662. });
  663. }
  664. }