Bladeren bron

fix: order date time issue & project save

ryanemax 1 dag geleden
bovenliggende
commit
e263f7d180

+ 1 - 2
src/modules/project/pages/project-detail/stages/stage-aftercare.component.ts

@@ -5,7 +5,7 @@ import { ActivatedRoute } from '@angular/router';
 import { FmodeObject, FmodeParse } from 'fmode-ng/parse';
 import { ProjectFileService } from '../../../services/project-file.service';
 import { ProductSpaceService, Project } from '../../../services/product-space.service';
-import { WxworkAuth } from 'fmode-ng/social';
+import { WxworkAuth } from 'fmode-ng/core';
 
 const Parse = FmodeParse.with('nova');
 
@@ -343,7 +343,6 @@ export class StageAftercareComponent implements OnInit {
       this.cid = params['cid'] || localStorage.getItem("company") || '';
       this.projectId = params['projectId'] || this.project?.id || '';
       
-      // @ts-ignore - WxworkAuth type issue with fmode-ng
       let wwauth = new WxworkAuth({cid:this.cid})
       this.currentUser = await wwauth.currentProfile();
       await this.loadData();

+ 20 - 10
src/modules/project/pages/project-detail/stages/stage-order.component.html

@@ -79,21 +79,31 @@
           <!-- 交付期限 -->
           <div class="form-group">
             <label class="form-label">小图日期 <span class="required">*</span></label>
-            <input
-              class="form-input"
-              type="date"
-              [(ngModel)]="projectInfo.demoday"
-              [disabled]="!canEdit" />
+            <mat-form-field appearance="outline" class="date-picker-field">
+              <input
+                matInput
+                [matDatepicker]="demodayPicker"
+                [(ngModel)]="projectInfo.demoday"
+                [disabled]="!canEdit"
+                placeholder="选择小图日期">
+              <mat-datepicker-toggle matIconSuffix [for]="demodayPicker"></mat-datepicker-toggle>
+              <mat-datepicker #demodayPicker></mat-datepicker>
+            </mat-form-field>
           </div>
 
           <!-- 交付期限 -->
           <div class="form-group">
             <label class="form-label">交付日期 </label>
-            <input
-              class="form-input"
-              type="date"
-              [(ngModel)]="projectInfo.deadline"
-              [disabled]="!canEdit" />
+            <mat-form-field appearance="outline" class="date-picker-field">
+              <input
+                matInput
+                [matDatepicker]="deadlinePicker"
+                [(ngModel)]="projectInfo.deadline"
+                [disabled]="!canEdit"
+                placeholder="选择交付日期">
+              <mat-datepicker-toggle matIconSuffix [for]="deadlinePicker"></mat-datepicker-toggle>
+              <mat-datepicker #deadlinePicker></mat-datepicker>
+            </mat-form-field>
           </div>
 
           <!-- 项目描述 -->

+ 76 - 0
src/modules/project/pages/project-detail/stages/stage-order.component.scss

@@ -1,5 +1,81 @@
 // 订单分配阶段样式 - 纯 div+scss 实现
 
+// ============ Material DatePicker 样式 ============
+.date-picker-field {
+  width: 100%;
+
+  ::ng-deep {
+    .mat-mdc-form-field-infix {
+      padding-top: 8px;
+      padding-bottom: 8px;
+    }
+
+    .mat-mdc-text-field-wrapper {
+      padding-left: 0;
+      padding-right: 0;
+    }
+
+    .mat-mdc-form-field-subscript-wrapper {
+      display: none; // 隐藏底部的提示文本区域
+    }
+
+    .mat-mdc-form-field-focus-overlay {
+      background-color: transparent;
+    }
+
+    .mat-datepicker-toggle {
+      color: var(--ion-color-primary, #3880ff);
+    }
+
+    input.mat-mdc-input-element {
+      padding: 10px 14px;
+      font-size: 14px;
+      color: #111827;
+
+      &::placeholder {
+        color: #9ca3af;
+      }
+
+      &:disabled {
+        color: #6b7280;
+        cursor: not-allowed;
+      }
+    }
+
+    .mat-mdc-form-field-outline {
+      border-radius: 8px;
+    }
+
+    .mdc-notched-outline__leading,
+    .mdc-notched-outline__notch,
+    .mdc-notched-outline__trailing {
+      border-color: #e5e7eb;
+      border-width: 1.5px;
+    }
+
+    .mdc-notched-outline:hover .mdc-notched-outline__leading,
+    .mdc-notched-outline:hover .mdc-notched-outline__notch,
+    .mdc-notched-outline:hover .mdc-notched-outline__trailing {
+      border-color: var(--ion-color-primary, #3880ff);
+    }
+
+    .mat-mdc-form-field.mat-focused .mdc-notched-outline__leading,
+    .mat-mdc-form-field.mat-focused .mdc-notched-outline__notch,
+    .mat-mdc-form-field.mat-focused .mdc-notched-outline__trailing {
+      border-color: var(--ion-color-primary, #3880ff);
+    }
+
+    .mat-mdc-form-field.mat-form-field-disabled {
+      .mdc-notched-outline__leading,
+      .mdc-notched-outline__notch,
+      .mdc-notched-outline__trailing {
+        border-color: #d1d5db;
+        background-color: #f3f4f6;
+      }
+    }
+  }
+}
+
 // 文件上传相关样式
 .files-card {
   .wx-support-indicator {

+ 26 - 22
src/modules/project/pages/project-detail/stages/stage-order.component.ts

@@ -2,7 +2,11 @@ import { Component, OnInit, Input, ViewChild, ElementRef, ChangeDetectionStrateg
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
-import { FmodeObject, FmodeParse, WxworkSDK } from 'fmode-ng/core';
+import { FmodeObject, FmodeParse, WxworkAuth, WxworkSDK } from 'fmode-ng/core';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import { MatInputModule } from '@angular/material/input';
+import { MatNativeDateModule } from '@angular/material/core';
+import { MatFormFieldModule } from '@angular/material/form-field';
 
 import { ProjectFileService } from '../../../services/project-file.service';
 import { ProductSpaceService, Project } from '../../../services/product-space.service';
@@ -35,7 +39,16 @@ const Parse = FmodeParse.with('nova');
 @Component({
   selector: 'app-stage-order',
   standalone: true,
-  imports: [CommonModule, FormsModule, QuotationEditorComponent, TeamAssignComponent],
+  imports: [
+    CommonModule,
+    FormsModule,
+    MatDatepickerModule,
+    MatInputModule,
+    MatNativeDateModule,
+    MatFormFieldModule,
+    QuotationEditorComponent,
+    TeamAssignComponent
+  ],
   templateUrl: './stage-order.component.html',
   styleUrls: ['./stage-order.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush
@@ -54,22 +67,13 @@ export class StageOrderComponent implements OnInit {
     title: '',
     projectType: '', // 家装 | 工装
     renderType: '', // 静态单张 | 360全景
-    demoday: this.formatDate(),
-    deadline: this.formatDate(),
+    demoday: new Date() as Date | null,
+    deadline: new Date() as Date | null,
     description: '',
     priceLevel: '一级', // 一级(老客户) | 二级(中端组) | 三级(高端组)
     spaceType: 'single' // single | multi
   };
 
-  formatDate (date = new Date()) {
-    const year = date.getFullYear();
-    // 月份从 0 开始,需 +1,并用 padStart 补零确保两位数
-    const month = String(date.getMonth() + 1).padStart(2, '0');
-    // 日期补零确保两位数
-    const day = String(date.getDate()).padStart(2, '0');
-    return `${year}-${month}-${day}`;
-  };
-
   
   // 空间管理
   projectSpaces: Project[] = [];
@@ -296,8 +300,8 @@ export class StageOrderComponent implements OnInit {
       }
 
       if (!this.currentUser && this.cid) {
-        const wxwork = new WxworkSDK({ cid: this.cid, appId: 'crm' });
-        this.currentUser = await wxwork.getCurrentUser();
+        const wxwork = new WxworkAuth({ cid: this.cid, appId: 'crm' });
+        this.currentUser = await wxwork.currentProfile();
 
         const role = this.currentUser?.get('roleName') || '';
         this.canEdit = ['客服', '组员', '组长', '管理员'].includes(role);
@@ -308,8 +312,8 @@ export class StageOrderComponent implements OnInit {
         this.projectInfo.title = this.project.get('title') || '';
         this.projectInfo.projectType = this.project.get('projectType') || '';
         this.projectInfo.renderType = this.project.get('renderType') || '';
-        this.projectInfo.deadline = this.formatDate(this.project.get('deadline') || new Date());
-        this.projectInfo.demoday = this.formatDate(this.project.get('demoday') || new Date());
+        this.projectInfo.deadline = this.project.get('deadline') || new Date();
+        this.projectInfo.demoday = this.project.get('demoday') || new Date();
         this.projectInfo.description = this.project.get('description') || '';
 
         const data = this.project.get('data') || {};
@@ -750,8 +754,8 @@ export class StageOrderComponent implements OnInit {
       this.project.set('title', this.projectInfo.title);
       this.project.set('projectType', this.projectInfo.projectType);
       this.project.set('renderType', this.projectInfo.renderType);
-      this.project.set('deadline', new Date(this.projectInfo.deadline));
-      this.project.set('demoday', new Date(this.projectInfo.demoday));
+      this.project.set('deadline', this.projectInfo.deadline);
+      this.project.set('demoday', this.projectInfo.demoday);
       this.project.set('description', this.projectInfo.description);
       this.project.set('spaceType', this.projectInfo.spaceType);
 
@@ -840,9 +844,9 @@ export class StageOrderComponent implements OnInit {
       approvalHistory.push({
         stage: '订单分配',
         submitter: {
-          id: this.currentUser!.id,
-          name: this.currentUser!.get('name'),
-          role: this.currentUser!.get('roleName')
+          id: this.currentUser?.id,
+          name: this.currentUser?.get('name'),
+          role: this.currentUser?.get('roleName')
         },
         submitTime: new Date(),
         status: 'confirm',