import { Component } from '@angular/core';

@Component({
  selector: 'app-pages-community',
  imports: [],
  templateUrl: './pages-community.html',
  styleUrl: './pages-community.scss'
})
export class PagesCommunity {
  likeWork(event: Event) {
    const element = event.target as HTMLElement;
    
    // 添加点击动画
    element.style.transform = 'scale(0.95)';
    element.style.opacity = '0.8';
    
    setTimeout(() => {
      element.style.transform = 'scale(1)';
      element.style.opacity = '1';
    }, 150);
    
    this.showNotification('点赞成功', '感谢你的支持！');
  }

  private showNotification(title: string, message: string) {
    // 在实际应用中，这里可以调用通知服务
    console.log(`${title}: ${message}`);
    
    // 简单实现一个临时提示
    const notification = document.createElement('div');
    notification.style.position = 'fixed';
    notification.style.bottom = '20px';
    notification.style.left = '50%';
    notification.style.transform = 'translateX(-50%)';
    notification.style.backgroundColor = '#4CAF50';
    notification.style.color = 'white';
    notification.style.padding = '12px 24px';
    notification.style.borderRadius = '4px';
    notification.style.boxShadow = '0 2px 10px rgba(0,0,0,0.2)';
    notification.style.zIndex = '1000';
    notification.style.animation = 'fadeIn 0.3s, fadeOut 0.3s 2.7s';
    notification.textContent = `${title}: ${message}`;
    
    document.body.appendChild(notification);
    
    setTimeout(() => {
      document.body.removeChild(notification);
    }, 3000);
  }
}