Mini-Program/pages/chat-detail/index.js

// pages/chat-detail/index.js
Page({
  data: {
    chatId: null,
    messages: [],
    inputValue: '',
    loading: false
  },

  onLoad: function (options) {
    if (options.id) {
      this.setData({
        chatId: options.id
      });
    }
    this.loadMessages();
  },

  onBack: function () {
    wx.navigateBack();
  },

  loadMessages: function () {
    this.setData({ loading: true });
    
    // 模拟加载聊天记录
    setTimeout(() => {
      const messages = [
        {
          id: 1,
          content: '您好，有什么可以帮助您的吗？',
          sender: 'other',
          time: '刚刚'
        },
        {
          id: 2,
          content: '你好，我想咨询一下产品信息',
          sender: 'me',
          time: '刚刚'
        },
        {
          id: 3,
          content: '当然可以，请问您想了解哪种产品？',
          sender: 'other',
          time: '5分钟前'
        }
      ];
      
      this.setData({
        messages: messages,
        loading: false
      });
    }, 1000);
  },

  loadMoreMessages: function () {
    // 加载更多历史消息
    if (this.data.loading) return;
    
    this.setData({ loading: true });
    
    // 模拟加载更多历史消息
    setTimeout(() => {
      const moreMessages = [
        {
          id: 4,
          content: '你好，我想了解一下你们的鸡蛋产品',
          sender: 'me',
          time: '1小时前'
        },
        {
          id: 5,
          content: '您好，欢迎咨询我们的鸡蛋产品',
          sender: 'other',
          time: '1小时前'
        }
      ];
      
      this.setData({
        messages: [...moreMessages, ...this.data.messages],
        loading: false
      });
    }, 1000);
  },

  onInputChange: function (e) {
    this.setData({
      inputValue: e.detail.value
    });
  },

  sendMessage: function () {
    const content = this.data.inputValue.trim();
    if (!content) return;
    
    const newMessage = {
      id: Date.now(),
      content: content,
      sender: 'me',
      time: '刚刚'
    };
    
    this.setData({
      messages: [...this.data.messages, newMessage],
      inputValue: ''
    });
    
    // 模拟对方回复
    setTimeout(() => {
      const reply = {
        id: Date.now() + 1,
        content: '这是一条自动回复',
        sender: 'other',
        time: '刚刚'
      };
      
      this.setData({
        messages: [...this.data.messages, reply]
      });
    }, 1000);
  }
});