// pages/profile/published/published.ts
import { EmployeeService, PublishRecord as ApiPublishRecord } from '../../../services/employee';

interface Article {
  id: number;
  productName: string;
  title: string;
  content: string;
  tags: string[];
  images: Array<{
    id: number;
    image_url: string;
    image_thumb_url: string;
    sort_order: number;
    keywords_name: string;
  }>;
  createTime: string;
  status: string;
}

Page({
  data: {
    articles: [] as Article[]
  },

  onLoad() {
    this.loadArticles();
  },

  onShow() {
    this.loadArticles();
  },

  // 初始化模拟数据
  initMockData() {
    const existingArticles = wx.getStorageSync('myArticles') || [];
    
    // 如果已经有数据，不重复初始化
    if (existingArticles.length > 0) return;

    const mockArticles = [
      {
        id: Date.now() + 1,
        productName: '兰蔻小黑瓶精华液',
        title: '【种草分享】兰蔻小黑瓶精华液使用体验💕',
        content: '姐妹们！今天必须来跟大家分享一下我最近入手的宝藏好物——兰蔻小黑瓶精华液！\n\n✨使用感受：\n用了一段时间真的太爱了！质感超级好，完全超出我的预期。包装也非常精致，送人自用都很合适。\n\n🌟推荐理由：\n1. 品质优秀，性价比超高\n2. 使用体验一级棒\n3. 颜值在线，拿出来超有面子',
        tags: ['种草分享', '好物推荐', '必买清单', '真实测评'],
        createTime: new Date(Date.now() - 3600000 * 2).toISOString(), // 2小时前
        status: 'published'
      },
      {
        id: Date.now() + 2,
        productName: 'SK-II神仙水',
        title: '真香警告！SK-II神仙水实测分享',
        content: '集美们看过来！今天给大家带来SK-II神仙水的真实使用感受~\n\n🎯第一印象：\n收到货的那一刻就被惊艳到了！包装精美，细节满满，完全是高端货的质感。\n\n💫使用体验：\n用了几天下来，真的是越用越喜欢！质量很好，用起来特别顺手，完全就是我想要的样子！',
        tags: ['真实测评', '使用心得', '好物安利', '值得入手'],
        createTime: new Date(Date.now() - 86400000).toISOString(), // 1天前
        status: 'published'
      },
      {
        id: Date.now() + 3,
        productName: 'AirPods Pro 2',
        title: '【数码种草】AirPods Pro 2使用一周真实感受',
        content: '作为一个数码发烧友，终于入手了AirPods Pro 2！用了一周来给大家分享一下真实体验。\n\n🎵音质表现：\n音质真的提升很明显，特别是低音部分，听流行音乐和播客都非常棒！\n\n🔇降噪效果：\n降噪功能强大，地铁里基本听不到外界噪音，专注力提升100%！',
        tags: ['数码好物', '音质体验', '降噪耳机'],
        createTime: new Date(Date.now() - 172800000).toISOString(), // 2天前
        status: 'published'
      },
      {
        id: Date.now() + 4,
        productName: 'Dior烈艳蓝金口红',
        title: '【美妆必入】Dior烈艳蓝金口红999试色分享',
        content: '今天来分享我最近的心头好！Dior烈艳蓝金口红999号色，真的太美了！\n\n💄色号分析：\n999是经典的正红色，白皮黄皮都能驾驭，显白效果一级棒！\n\n✨质地感受：\n润而不油，持久度也很好，吃饭喝水后还有淡淡的颜色留存。',
        tags: ['美妆种草', '口红推荐', 'Dior蓝金'],
        createTime: new Date(Date.now() - 259200000).toISOString(), // 3天前
        status: 'published'
      },
      {
        id: Date.now() + 5,
        productName: '雅诗兰黛小棕瓶',
        content: '雅诗兰黛小棕瓶是我用过最好的精华！修复力强，用了一瓶皮肤状态明显提升。\n\n🌟产品亮点：\n含有高浓度修复精华，抗氧化效果很棒，长期使用能看到细纹改善。\n\n💡使用建议：\n建议晚上使用，配合按摩手法效果更好，第二天起来皮肤非常透亮！',
        title: '【护肤心得】雅诗兰黛小棕瓶修复精华使用报告',
        tags: ['护肤精华', '抗衰老', '修复力'],
        createTime: new Date(Date.now() - 432000000).toISOString(), // 5天前
        status: 'published'
      }
    ];

    wx.setStorageSync('myArticles', mockArticles);
  },

  // 加载文章列表
  async loadArticles() {
    try {
      // 从后端API获取发布记录
      const response = await EmployeeService.getMyPublishRecords(1, 50);
      
      console.log('===== 已发布文章列表响应 =====');
      console.log('response:', response);
      
      if (response.code === 200 && response.data) {
        const apiArticles = response.data.list.map((record: ApiPublishRecord) => {
          console.log('处理记录:', record);
          console.log('images:', record.images);
          console.log('tags:', record.tags);
          
          return {
            id: record.id,
            productName: record.product_name || '未知商品',
            title: record.title,
            content: '', // 列表页不需要显示完整内容
            tags: record.tags || [],
            images: record.images || [],
            createTime: record.publish_time,
            status: 'published'
          };
        });

        console.log('转换后的文章列表:', apiArticles);
        
        this.setData({
          articles: apiArticles
        });
        
        console.log('setData后的articles:', this.data.articles);
        return;
      }
    } catch (error) {
      console.error('加载发布记录失败:', error);
    }

    // 如果API失败，尝试使用本地数据
    const articles = wx.getStorageSync('myArticles') || [];
    
    // 格式化时间
    const formattedArticles = articles.map((item: Article) => {
      return {
        ...item,
        createTime: this.formatTime(item.createTime)
      };
    });

    this.setData({
      articles: formattedArticles
    });
  },

  // 格式化时间
  formatTime(isoString: string): string {
    const date = new Date(isoString);
    const year = date.getFullYear();
    const month = String(date.getMonth() + 1).padStart(2, '0');
    const day = String(date.getDate()).padStart(2, '0');
    const hours = String(date.getHours()).padStart(2, '0');
    const minutes = String(date.getMinutes()).padStart(2, '0');
    
    return `${year}-${month}-${day} ${hours}:${minutes}`;
  },

  // 查看文章详情
  viewArticle(e: any) {
    const index = e.currentTarget.dataset.index;
    const article = this.data.articles[index];
    
    // 跳转到文章详情页
    wx.navigateTo({
      url: `/pages/profile/article-detail/article-detail?id=${article.id}`
    });
  },

  // 分享功能
  onShareAppMessage() {
    return {
      title: '我的发布记录 - 万花筒AI助手',
      path: '/pages/home/home',
      imageUrl: ''
    };
  },

  // 分享到朋友圈
  onShareTimeline() {
    return {
      title: '万花筒AI助手 - 智能生成种草文案',
      imageUrl: ''
    };
  }
});
