yss-project/src/app/pages/admin/user-management/user-dialog/user-dialog.ts

import { Component, Inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';

interface User {
  id: string;
  username: string;
  realName: string;
  email: string;
  phone: string;
  role: string;
  department: string;
  status: 'active' | 'inactive';
  createdAt: string;
  lastLogin: string;
}

@Component({
  selector: 'app-user-dialog',
  standalone: true,
  imports: [
    CommonModule,
    FormsModule,
    MatButtonModule,
    MatDialogModule,
    MatFormFieldModule,
    MatInputModule,
    MatSelectModule,
    MatDatepickerModule,
    MatNativeDateModule,
    MatIconModule
  ],
  templateUrl: './user-dialog.html',
  styleUrl: './user-dialog.scss'
})
export class UserDialogComponent {
  user: User;
  isEditMode: boolean;
  roles: string[] = ['超级管理员', '客服', '设计师', '组长', '财务', '人事'];
  departments: string[] = ['管理层', '客户服务部', '设计部', '财务部', '人力资源部', '行政部'];
  statuses: { value: string; label: string }[] = [
    { value: 'active', label: '激活' },
    { value: 'inactive', label: '禁用' }
  ];

  constructor(
    public dialogRef: MatDialogRef<UserDialogComponent>,
    @Inject(MAT_DIALOG_DATA) public data: User
  ) {
    this.isEditMode = !!data.id;
    this.user = {
      id: data.id || '',
      username: data.username || '',
      realName: data.realName || '',
      email: data.email || '',
      phone: data.phone || '',
      role: data.role || '',
      department: data.department || '',
      status: data.status || 'active',
      createdAt: data.createdAt || new Date().toISOString().split('T')[0],
      lastLogin: data.lastLogin || ''
    };
  }

  onCancel(): void {
    this.dialogRef.close();
  }

  onSave(): void {
    if (this.isFormValid()) {
      this.dialogRef.close(this.user);
    }
  }

  isFormValid(): boolean {
    // 验证用户名
    if (!this.user.username.trim() || this.user.username.length < 3) {
      alert('用户名至少需要3个字符');
      return false;
    }

    // 验证姓名
    if (!this.user.realName.trim()) {
      alert('请输入真实姓名');
      return false;
    }

    // 验证邮箱
    const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
    if (!emailRegex.test(this.user.email)) {
      alert('请输入有效的邮箱地址');
      return false;
    }

    // 验证手机号
    const phoneRegex = /^1[3-9]\d{9}$/;
    if (!phoneRegex.test(this.user.phone)) {
      alert('请输入有效的手机号码');
      return false;
    }

    // 验证角色和部门
    if (!this.user.role || !this.user.department) {
      alert('请选择角色和部门');
      return false;
    }

    return true;
  }

  generateRandomPassword(): void {
    const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()';
    let password = '';
    for (let i = 0; i < 12; i++) {
      password += chars.charAt(Math.floor(Math.random() * chars.length));
    }
    alert(`生成的随机密码：${password}\n请妥善保存！`);
  }

  onRoleChange(): void {
    // 超级管理员只能属于管理层
    if (this.user.role === '超级管理员') {
      this.user.department = '管理层';
    }
  }
}