<template>
  <el-row>
    <!-- 表格头部 -->
    <el-row class="mb-20">
      <span class="list-title">
        登录日志列表
      </span>
    </el-row>
    <!-- 表格内容 -->
    <TableElement
      :table-data="list"
      :colum-obj="columObj"
      :page-obj="pageObj"
      :loading="global.loading"
      :max-show="4"
      @rowOperation="rowOperation"
      @selectionChange="selectionChange"
      @getList="getList()"
    />
  </el-row>
</template>
<script>
import TableElement from '@/components/ElmTable/index.vue'
import { deepClone } from '@/utils'
import { Format } from '@fujica/utils'
import { toPrecision } from '@/utils/convert'
import { getlogPage } from '@/apiV2/log'

export default {
  components: { TableElement },
  inject: ['global'],
  props: {
    treeIds: { // 侧边栏
      type: String,
      default: ''
    },
    searchParams: { // 搜索栏
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      openExport: false,
      list: [], // 数据
      selectedList: [], // 选中的数据
      pageObj: { // 分页配置
        current: 1,
        size: 10,
        total: 0,
        pages: 0
      },
      columObj: { // 表格配置
        lazy: 'true',
        columnData: [
          { text: true, prop: 'createName', label: '账号', align: 'left' },
          { text: true, prop: 'type', label: '操作类型', align: 'left' },
          { text: true, prop: 'createTime', label: '操作时间', sortable: true, align: 'left' },
          { text: true, prop: 'projectNo', label: '项目编号', align: 'left' },
          { text: true, prop: 'url', label: '接口地址', align: 'left' },
          { text: true, prop: 'method', label: '接口方法', align: 'left' },
          { text: true, prop: 'inParam', label: '接口参数', align: 'left' },
          { text: true, prop: 'remark', label: '备注', align: 'left' }
          // { ownDefined: true, prop: 'type', label: '操作内容', align: 'left', ownDefinedReturn: (row) => this.global.dict.type[row.type] || '--' }
        ]
      }
    }
  },
  methods: {
    async getList(params) { // 表格数据 - 获取
      this.global.loading = true
      if (params != null) this.searchParams = params
      try {
        // TODO: 获取数据
        // const { data } = { data: { records: [{ name: 'test' }], pages: 1, total: 1 }}
        // const { data } = await request('/fs/personinout/tvoucherrecords/freezeList', { params: this.genQuery() })
        const { data } = await getlogPage(this.genQuery())
        const { records, pages, total } = data
        this.list = this.filterTabledata(records)
        Object.assign(this.pageObj, { pages, total })
      } finally {
        this.global.loading = false
      }
    },
    filterTabledata(list) { // 表格数据 - 过滤
      return list.map(item => ({
        ...item,
        availableCredit: item.settleType == 2 ? toPrecision((item.availableCredit / 60), 1) : Format.money(item.availableCredit, { yuan: true }) // 分钟-小时，分-元
      })).map((item) => ({
        ...item,
        availableCreditStr: (item.availableCredit + (item.settleType == 2 ? '小时' : '元'))
      }))
    },
    async exportExcel() { // 导出
      this.global.loading = true
      try {
        // TODO: 导出接口
        // const res = await request('/fs/personinout/tvoucherrecords/freezeExport', { params: this.genQuery() })
        // const res = await exportExchangeOrder(this.genQuery())
        // this.downloadExcel(res)
      } finally {
        this.global.loading = false
      }
    },
    genQuery() { // 产生最终参数
      const { current, size } = this.pageObj
      const query = Object.assign({ current, size }, this.filterSearchParams()) // 分页 & 查询
      return query
    },
    filterSearchParams() { // 查询字段过滤（请求数据过滤查询不影响原数据）
      // 复制一份
      const params = deepClone(this.searchParams)
      // 自定义部分
      params['platform'] = 1
      // TODO: 搜索数据过滤
      if (this.searchParams.timeRange?.length) {
        params['begin'] = this.searchParams.timeRange[0]
        params['end'] = this.searchParams.timeRange[1]
        delete params.timeRange
      }
      // 过滤空数据
      Object.entries(params).forEach(([key, val]) => {
        if (val == null || val === '') delete params[key]
      })
      return params
    },
    rowOperation(row, idx, actionName, params) { // 行操作
      console.log(actionName, row)
      this.$emit('rowOperation', row, idx, actionName, params)
    },
    selectionChange(list) { // 行选择
      this.selectedList = list
    },
    changeLook(e) {
      this.searchParams.lookstatus = e
      this.getList()
    }
  }
}
</script>

<style lang="scss" scoped>
.project-num {
  text-align: center;
  width: 100%;
}
</style>

