import { cancelOrder, OrderInfo, queryOrderList } from "../../service/shop-api";
import message from "../../utils/message";

type TabType = {
  // tab标题
  title: string
  // 标识
  name: string
  // 查询状态值
  status: number
  // 当前查询的页码
  page: number
  // 是否已经查询结束
  end: boolean
  // 订单列表
  orders: OrderInfo[]
}
function createTab(title: string, name: string, status: number) {
  const tab: TabType = {
    title,
    name,
    status,
    page: 1,
    end: false,
    orders: []
  }
  return tab;
}
// pages/order/index.ts
Page({

  /**
   * 页面的初始数据
   */
  data: {
    tabActive: 'all',
    statusEnums: {
      1: '待确认',
      2: '已确认',
      3: '已取消',
      4: '已完成',
      0: '已删除'
    },
    tabs: [
      createTab('全部', 'all', 0),
      createTab('待确认', 'not-confirm', 1),
      createTab('已确认', 'confirm', 2),
      createTab('已取消', 'cancel', 3),
      createTab('已完成', 'finish', 4),
      // {
      //   title: '待确认',
      //   name: 'not-confirm',
      //   status: 1,
      //   orders: []
      // },
      // {
      //   title: '已确认',
      //   name: 'confirm',
      //   status: 2,
      //   orders: []
      // },
      // {
      //   title: '已取消',
      //   name: 'cancel',
      //   status: 3,
      //   orders: []
      // },
      // {
      //   title: '已完成',
      //   name: 'finish',
      //   status: 3,
      //   orders: []
      // }
    ]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad() {
    this.loadOrderList('all');
  },
  onTabChange(e: any) {
    const tabActive = e.detail.name
    // TODO 是否重新加载 -- 缓存
    this.loadOrderList(tabActive)
    this.setData({ tabActive })
  },
  showOrderDetail(e: TapEvent){
    const id = e.currentTarget.id
    
    wx.navigateTo({
      url: `/pages/order/detail?id=${id}`
    })
  },
  async cancelOrder(e: TapEvent) {
    try {
      if ((await message.confirm('确定要取消订单?'))) {
        await cancelOrder(e.target.dataset.id)
        message.toast('取消订单成功');
        this.loadOrderList(this.data.tabActive)
      }
    } catch (e) { }
  },
  async deleteOrder(e: TapEvent) {
    try {
      if ((await message.confirm('确定要删除订单?'))) {
        console.log('shanchu')
        await cancelOrder(e.target.dataset.id)
        message.toast('取消删除成功');
        this.loadOrderList(this.data.tabActive)
      }
    } catch (e) { }
  },
  loadOrderList(active: string) {
    // 1、找到当前选中的tab
    const tab = this.data.tabs.find(s => s.name == active);
    if (tab) {
      queryOrderList(tab.status).then(ret => {
        if (ret.records && ret.records.length > 0) {
          if (tab.page === 1) {
            tab.orders = ret.records
          } else tab.orders.push(...ret.records)
          // 更新数据
          this.setData({
            tabs: this.data.tabs
          })
        }
      })
    }
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})