<template>
  <div class="table-box">
    <LjVxeTable
      ref="VxeTableRef"
      row-key="taskid"
      :columns="columns"
      :request-api="getData"
      :data-callback="dataCallback"
      :dwname="DwnameEnum.tasklog"
      :table-props="tableProps"
      :table-events="tableEvents"
      :tool-button="['refresh', 'setting', 'search', 'location']"
      pagination
    />
  </div>
</template>

<script setup lang="tsx" name="system_taskLog">
import { getCurrentInstance } from "vue";
import type { TaskLog } from "@/api/interface/index";
import { DwnameEnum } from "@/enums/dwnameEnum";
import dialog from "@/utils/dialog";
import TaskLogDetailDialog from "./components/TaskLogDetailDialog.vue";
import { useHooks } from "./hooks";
import { useI18n } from "vue-i18n";

const { t } = useI18n();
const { VxeTableRef, columns, getData, dataCallback, tableProps } = useHooks(t);
const appContext = getCurrentInstance()?.appContext;

const openDetail = (row: TaskLog.TaskLogItem) => {
  dialog(TaskLogDetailDialog, {
    task: row,
    taskid: row.taskid,
    appContext,
    class: "is-selector",
    width: "80%",
    ifoverflow: true,
    style: { padding: 0 }
  }).then(() => {});
};

const tableEvents = {
  "cell-dblclick": ({ row }: { row: TaskLog.TaskLogItem }) => {
    openDetail(row);
  }
};
</script>
