<script setup>
import { czrz_list } from './api'
import PrevIcon from '@/components/EpPagination/PrevIcon.vue'
import NextIcon from '@/components/EpPagination/NextIcon.vue'
import request from '@/utils/request'
import { user } from '@/store/index'
const keyword = ref('')
let tableData = $ref([])
let total = $ref()
let multipleSelection = $ref([])
const form_query = $ref({
  page: 1,
  limit: 10,
})

function handleSelectionChange(val) {
  multipleSelection = []
  val.forEach((item) => {
    multipleSelection.push(item.sl_id)
  })
}
function handleQuery() {
  const data = {
    ...form_query,
  }
  czrz_list(data).then((res) => {
    if (res.code === '1') {
      tableData = res.data.page_data
      total = res.data.total_rows * 1
    }
  })
}
handleQuery()
console.log(window.GLOBAL_CONFIG.api)
function exportAll() {
  const link = `${window.GLOBAL_CONFIG.api}/system/log/index?api=xls&page=1&limit=10000&token=${user.value.token}&checkedidstring=${multipleSelection}`
  console.log(link, 111)
  window.open(link, '_blank')
}
</script>

<template>
  <div class="card">
    <div class="flex justify-between mt-5 mb-7">
      <div>
        <el-button class="_" type="primary" @click="exportAll">
          导出
        </el-button>
      </div>
    </div>
    <el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column prop="sl_id" label="ID" show-overflow-tooltip width="100" />
      <el-table-column prop="user_realname" label="用户名" show-overflow-tooltip width="130" />
      <el-table-column prop="sl_datetime" label="时间" show-overflow-tooltip width="200" />
      <el-table-column label="操作记录" show-overflow-tooltip>
        <template #default="scope">
          <div v-html="scope.row.sl_content" />
        </template>
      </el-table-column>
    </el-table>
    <div class="flex_center my-6">
      <el-pagination v-model:current-page="form_query.page" v-model:page-size="form_query.limit" layout="total, prev, pager, next, jumper" :total="total" :prev-icon="PrevIcon" :next-icon="NextIcon" @current-change="handleQuery" />
    </div>
  </div>
</template>

<style lang="scss" scoped>
@use "~/styles/input-search.scss";
@use "~/styles/button.scss";
@use "~/styles/table.scss";
@use "~/styles/pagination.scss";
</style>
