<script setup>
import { ref } from 'vue'
import { logQueryService } from '@/api/log'
const params = ref({
  current: 1,
  size: 10
})
const key = ref('')
const total = ref(0)
const loading = ref(false)
const logList = ref([])
const getLogs = async () => {
  loading.value = true
  const {
    data: { data }
  } = await logQueryService(params.value, key.value)
  logList.value = data.list
  total.value = data.total
  loading.value = false
}
getLogs()
const onCurrentChange = (current) => {
  params.value.current = current
  getLogs()
}
const onSizeChange = (size) => {
  params.value.current = 1
  params.value.size = size
  getLogs()
}
</script>
<template>
  <page-container title="系统日志">
    <template #extra>
      <!-- <el-button type="primary" @click="onEdit">添加场馆信息</el-button> -->
    </template>

    <!-- 表格区域 -->
    <el-table :data="logList" stripe v-loading="loading">
      <el-table-column type="index" label="序号" width="60" />
      <el-table-column label="操作类型" prop="operationType" width="150">
      </el-table-column>
      <el-table-column
        label="操作描述"
        prop="operationDesc"
        width="350"
      ></el-table-column>
      <el-table-column label="结果" prop="result"></el-table-column>
      <el-table-column label="执行时间（毫秒）" prop="time"></el-table-column>
      <el-table-column label="状态" prop="status"></el-table-column>
      <el-table-column label="记录时间" prop="createTime"></el-table-column>
      <template #empty>
        <el-empty description="无数据" />
      </template>
    </el-table>

    <!-- 分页区域 -->
    <el-pagination
      v-model:current-page="params.current"
      v-model:page-size="params.size"
      :page-sizes="[10, 20, 50]"
      layout="jumper, total, sizes, prev, pager, next"
      background
      :total="total"
      @size-change="onSizeChange"
      @current-change="onCurrentChange"
      style="margin-top: 20px; justify-content: flex-end"
    />
  </page-container>
</template>
