import { filterObj } from '@/utils/util'
import { deleteAction, postAction } from '@/api/manage'

/**
 * 分页列表 Mixins
 *
 * 接口调用：在 data 中定义 interface 对象，在对象中定义接口名。具体对应关系如下：
 * list: 分页列表接口、delete: 删除单项数据接口
 * @example interface: { list: '/xxx/xxx', delete: '/xxx/xxx' }
 *
 * 组件调用：在分页列表页面调用【新增、编辑、查看】弹框组件时，只需要定义对应的 ref 即可。具体对应关系如下：
 * 新增: ref="modalEditRef"、编辑: ref="modalEditRef"、查看: ref="modalViewRef"
 * 组件方法：在对应的子组件中创建相对应的方法名称即可。具体对应关系如下：
 * 新增子组件: handleAdd()、编辑子组件: handleEdit(record)、查看子组件: handleView(record)
 * @example
 * <template>
 *   <ChildEdit ref="modalEditRef">
 *   <ChildEdit ref="modalViewRef">
 * </template>
 * <script>
 *   export default {
 *     methods: {
 *       add() {
 *         this.$refs.modalEditRef.handleAdd()
 *       },
 *       edit(record) {
 *         this.$refs.modalEditRef.handleEdit(record)
 *       },
 *       view(record) {
 *         this.$refs.modalEditRef.handleView(record)
 *       }
 *     }
 *   }
 * </script>
 *
 * @author Matrix
 * @since 2022/09/01
 */
export const PageListMixin = {
  data() {
    return {
      // table loading
      tableLoading: false,
      // 查询条件 -> 请不要在queryParams中声明非字符串值的属性
      queryParams: {},
      // 筛选参数
      filterParams: {},
      // 分页参数
      pagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30', '50'],
        showTotal: (total, range) => range[0] + '-' + range[1] + ' 共' + total + '条',
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
      // 排序参数
      sortParams: {
        column: 'createTime',
        order: 'desc'
      },
      // 接口对象
      interface: {},
      // table 数据
      dataSource: [],
      // 是否禁用 Mixin 初始化
      isDisableMixin: false
    }
  },
  created() {
    !this.isDisableMixin && this.loadData(1)
  },
  methods: {
    /**
     * 加载初始化数据
     * @param {Number} page 分页页数
     * @author Matrix
     * @since 2022/09/01
     */
    loadData(page) {
      if (!this?.interface?.list) {
        this.$message.error('请设置 interface.list 属性!')
        return
      }
      if (page === 1) this.pagination.current = 1
      const mergeParams = this.getQueryParams()
      this.tableLoading = true
      postAction(this.interface.list, mergeParams)
        .then(res => {
          this.dataSource = res.value.records
          this.pagination.total = res.value.total
        })
        .finally(() => (this.tableLoading = false))
    },

    /**
     * 整合参数
     * @return {Object}
     * @author Matrix
     * @since 2022/09/01
     */
    getQueryParams() {
      let params = Object.assign(this.sortParams, this.filterParams)
      params.value = filterObj(this.queryParams)
      params.pageNo = this.pagination.current
      params.pageSize = this.pagination.pageSize
      return params
    },

    /**
     * 分页回调
     * @param {Object} pagination 分页
     * @param {Object} filters 筛选
     * @param {Object} sorter 排序
     * @author Matrix
     * @since 2022/09/01
     */
    handlePaginationChange(pagination, filters, sorter) {
      if (Object.keys(sorter).length > 0) {
        this.sortParams.column = sorter.field
        this.sortParams.order = 'ascend' === sorter.order ? 'asc' : 'desc'
      }
      this.pagination = pagination
      this.loadData()
    },

    /**
     * 查询
     * @author Matrix
     * @since 2022/09/01
     */
    searchQuery() {
      this.loadData(1)
    },

    /**
     * 重置
     * @author Matrix
     * @since 2022/09/01
     */
    resetQuery() {
      this.queryParams = {}
      this.filterParams = {}
      this.loadData(1)
    },

    /**
     * 创建 / 新增
     * @param {String} title modal标题
     * @author Matrix
     * @since 2022/09/01
     */
    handleAdd(title = '创建') {
      this.$refs.modalEditRef.handleAdd()
      this.$refs.modalEditRef.title = title
    },

    /**
     * 编辑 / 修改
     * @param {Object} record 当前项数据
     * @param {String} title modal标题
     * @author Matrix
     * @since 2022/09/01
     */
    handleEdit(record, title = '编辑') {
      this.$refs.modalEditRef.handleEdit(record)
      this.$refs.modalEditRef.title = title
    },

    /**
     * 新增/修改 成功时，重载列表数据
     * @author Matrix
     * @since 2022/09/01
     */
    handleOk() {
      this.loadData(1)
    },

    /**
     * 查看 / 详情
     * @param {Object} record 当前项数据
     * @param {String} title modal标题
     * @author Matrix
     * @since 2022/09/01
     */
    handleView(record, title = '详情') {
      this.$refs.modalViewRef.handleView(record)
      this.$refs.modalViewRef.title = title
    },

    /**
     * 删除某项数据
     * @param {String} id
     * @author Matrix
     * @since 2022/09/01
     */
    handleDelete(id) {
      if (!this?.interface.delete) {
        this.$message.error('请设置 interface.delete 属性！')
        return
      }
      deleteAction(this.interface.delete, { id }).then(() => {
        this.$message.success('删除成功！')
        this.loadData(1)
      })
    }
  }
}
