<script lang="ts" setup>
import { Page } from '@vben/common-ui';

import { Button, message, Modal } from 'ant-design-vue';

import { useVbenVxeGrid } from '#/adapter';
import { LogApi } from '#/api';

import { gridOperateOptions, searchFormOptions } from '../data.config';

const [Grid, { reload }] = useVbenVxeGrid({
  formOptions: searchFormOptions,
  gridOptions: gridOperateOptions,
});

const handelClear = () => {
  Modal.confirm({
    iconType: 'info',
    title: '删除提示',
    content: `确定要清空日志记录吗?`,
    cancelText: `关闭`,
    onOk: async () => {
      await LogApi.clearLog('logOperate');
      message.success('数据删除成功');
      reload();
    },
  });
};
</script>

<template>
  <Page auto-content-height>
    <Grid>
      <template #toolbar-tools>
        <Button
          class="mr-2"
          type="primary"
          v-access:code="'logOperate:clear'"
          @click="() => handelClear()"
        >
          清空日志
        </Button>
      </template>
    </Grid>
  </Page>
</template>
