<template>
  <div class="testdiv">
    <div class="divborder newSearchDiv" style="margin:0px;">
        <div class="filter">
          <label>日志类型：</label>
          <Select v-model="type" class="searchSelect">
            <Option :value='2' >失败</Option>
            <Option :value='1' >成功</Option>
          </Select>
        </div>
        <div class="filter">
          <label >{{$t('900908')}}：</label>
          <DatePicker type="daterange" :value="dateTime" placeholder="" class="searchInput MaxWidth" @on-change="selectdate"></DatePicker>
      </div>
         <div class="searchBtn">
          <Button type="primary" class="twoWord" icon="ios-search" @click="search(1,10)">{{$t('1001')}}</Button>
         </div>
    </div>
    <div class="divborder newTableDiv">
      <Table
         class="tableClass"
        @on-current-change="handleRowChange"
        highlight-row
        :data="tableData1"
        @on-selection-change="handleSelectRow"
        :columns="tableColumns1"></Table>
    <div class="pageDiv">
      <div class="pageDirection">
        <Page
          :total="total"
          :current="page"
          @on-change="changePage"
          show-elevator
          show-sizer
          show-total
          @on-page-size-change="handlePageSize"
          :page-size-opts="[10,20,30,40,100]"
        ></Page>
      </div>
    </div>
    </div>
  </div>
</template>
<script>
import axios from '@/libs/api.request'
export default {
    name: 'apihistorymanagement', // 组件不刷新
    data () {
        return {
            dateTime: '', // 时间范围
            startTime: '', // 开始时间
            endTime: '', // 结束时间
            type: 2,
            tableData1: [],
            total: 0,
            page: 1,
            pagesize: 10,
            selectids: '',
            loading1: false, // 远程搜索loading
            tableColumns1: [
                {
                    type: 'index2',
                    title: this.$t('1008'),
                    key: 'xuhao',
                    render: (h, params) => {
                        return h(
                            'span',
                            params.index + (this.page - 1) * this.pagesize + 1
                        )
                    },
                    width: '50px'
                },
                {
                    title: '接口地址',
                    key: 'url',
                    width: '300px'
                },
                {
                    title: '最后调用时间',
                    key: 'time',
                    width: '180px'
                },
                {
                    title: '调用次数',
                    key: 'count',
                    width: '90px'
                },
                {
                    title: '用户ID',
                    key: 'userid',
                    width: '90px'
                },
                {
                    title: '异常',
                    key: 'msg',
                    width: '90px'
                },
                {
                    title: '参数',
                    key: 'parameter'
                },
                {
                    title: '内部错误',
                    key: 'error'
                }
            ]
        }
    },
    created () {
        this.inittime()
        this.search(1, 10)
        // 格式化表格样式
        this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1)
    },
    methods: {
        inittime () {
            // 时间赋值
            var date = new Date()
            console.log(this.timestampToTime(date.getTime()))
            var start = this.timestampToTime(date.getTime() - 3600 * 1000 * 24 * 7)
            var end = this.timestampToTime(date.getTime() + 3600 * 1000 * 24)
            this.dateTime = [start, end]
        },
        selectdate (e) {
            this.dateTime = [e[0], e[1]];
            let dtStart = e[0];
            let dtEnd = e[1];
            let last_str = dtEnd.split(' ')[1];
            if (last_str == '00:00:00') {
                dtEnd = moment(dtEnd).format('YYYY-MM-DD') + ' 23:59:59';
                this.dateTime = [dtStart, dtEnd];
            }
        },
        search (page, pagesize) {
            if (this.dateTime !== '') {
                this.startTime = this.dateTime[0]
                this.endTime = this.dateTime[1]
            }
            var params = {
                type: this.type,
                start: this.startTime,
                end: this.endTime,
                page: page,
                pagesize: pagesize
            }
            axios
                .request({
                    url: '/config/ApiHistory/GetHistories',
                    params,
                    method: 'get'
                })
                .then(res => {
                    this.total = res.data.total
                    this.page = res.data.page
                    this.mockTableData1(res.data.data)
                })
        },
        mockTableData1 (tablelist) {
            let data = []
            tablelist.forEach(item => {
                if (item) {
                    data.push({
                        url: item.url,
                        userid: item.userid,
                        time: item.time,
                        parameter: item.parameter,
                        error: item.error,
                        msg: item.msg,
                        count: item.count
                    })
                }
            })
            this.tableData1 = data
        },
        handleSelectRow: function (data) {
            var ids = []
            for (var i in data) {
                ids.push(data[i].id)
            }
            this.selectids = ids.join(',')
        },
        handleRowChange (currentRow, oldCurrentRow) {
            this.detailobj = currentRow
        },
        handlePageSize (value) {
            this.pagesize = value
            this.search(this.page, this.pagesize)
        },
        changePage (value) {
            this.page = value
            this.search(this.page, this.pagesize)
        },
        // 时间戳转换成时间
        timestampToTime (timeStampe) {
            var date = new Date(timeStampe)// 时间戳为10位需*1000，时间戳为13位的话不需乘1000
            var Y = date.getFullYear() + '-'
            var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
            var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' '
            var h = (date.getHours() < 10 ? '0' + (date.getHours()) : date.getHours()) + ':'
            var m = (date.getMinutes() < 10 ? '0' + (date.getMinutes()) : date.getMinutes()) + ':'
            var s = (date.getSeconds() < 10 ? '0' + (date.getSeconds()) : date.getSeconds())
            return Y + M + D + h + m + s
        }
    }
}
</script>
<style lang="less" scoped>
</style>
