<script setup name="Index">
import { onMounted, ref, reactive } from 'vue'
import { ElMessage } from "element-plus";
import { changeRoute } from '@/utils/switchRoute'
import QueryForm from './QueryForm.vue'
import { query, checkEnc, getEncryptionLogExcel } from "@/api/itemLogSet/projectEncryptedLog.js";

const queryParams = ref({
  page: 1,
  rows: 10,
  projectId: sessionStorage.getItem('projectId'),
  range: "3",
  user: "",
  module: "",
})
const logList = ref([])
const total = ref(0)
const loading = ref(false)

// 筛选查询
const onQuery = () => {
  getList()
}
// 查询组件事件重置
const onReset = (formQuery) => {
  formQuery.resetFields()
  getList()
}

// 获取列表数据
const getList = async () => {
  try {
    loading.value = true
    const { data } = await query(queryParams.value)
    logList.value = data.list
    total.value = data.total
    loading.value = false
  } catch (error) {
    loading.value = false
  }
}

// 导出
const download = async () => {
  try {
    const response = await getEncryptionLogExcel(queryParams.value)
    const blob = new Blob([response], { type: 'application/vnd.ms-excel,charset=utf-8' });
    const link = document.createElement('a')
    link.href = URL.createObjectURL(blob)
    link.download = '加密日志'
    link.click()
    URL.revokeObjectURL(link.href)
    ElMessage.success('导出成功')
  } catch (error) {
  }
}

// 数据校验
const dataValidation = async () => {
  try {
    const { flag } = await checkEnc(queryParams.value)
    if (flag) {
      ElMessage.success('校验成功！')
    } else {
      ElMessage.error('校验失败！')
    }
  } catch (error) {
  }
}

// 返回主页面
const pageProjectManage = () => {
  changeRoute()
}

onMounted(() => {
  getList()
})
</script>
<template>
  <div class="app-container scroller">
    <PageTitle backProject @handleBackProject="pageProjectManage">
      <template #title>
        加密日志
      </template>
      <template #buttons>
        <el-button type="primary" icon="Download" @click="download">导出</el-button>
        <el-button type="primary" @click="dataValidation">数据完成性校验</el-button>
      </template>
    </PageTitle>
    <div class="app-container__body">
      <query-form ref="QueryFormRef" v-model="queryParams" @query="onQuery" @reset="onReset" />
      <el-table v-loading="loading" :data="logList" border style="width: 100%">
        <el-table-column prop="operptionUser" label="用户" align="center" width="200" />
        <el-table-column prop="code" label="操作代码" align="center" width="180" />
        <el-table-column prop="operModule" label="操作模块" align="center" width="200" />
        <el-table-column prop="operptionMassage" label="操作信息" align="center" show-overflow-tooltip />
      </el-table>

      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.page" v-model:limit="queryParams.rows"
        @pagination="getList" />
    </div>
  </div>
</template>