<template>

  <!-- 搜索工作栏 -->
  <ContentWrap>
    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
    <div style="display: flex; justify-content: flex-end;">
      <el-button
        type="primary"
        @click="handleMultipleResend"
        v-hasPermi="['system:mail-log:query']"
      >
        重新发送
      </el-button>
    </div>
  </ContentWrap>

  <!-- 列表 -->
  <ContentWrap>
    <Table
      :selection="true"
      :columns="allSchemas.tableColumns"
      :data="tableObject.tableList"
      :loading="tableObject.loading"
      :pagination="{
        total: tableObject.total
      }"
      v-model:pageSize="tableObject.pageSize"
      v-model:currentPage="tableObject.currentPage"
      @selection-change="handleSelectionChange"
    >
      <template #action="{ row }">
        <el-button
          link
          type="primary"
          @click="openDetail(row.id)"
          v-hasPermi="['system:mail-log:query']"
        >
          详情
        </el-button>
        <el-button
          link
          type="primary"
          @click="resend(row.id)"
          v-hasPermi="['system:mail-log:query']"
        >
          重新发送
        </el-button>
      </template>
    </Table>
  </ContentWrap>

  <!-- 表单弹窗：详情 -->
  <mail-log-detail ref="detailRef" />
</template>
<script lang="ts" setup>
import { allSchemas } from './log.data'
import * as MailLogApi from '@/api/system/mail/log'
import MailLogDetail from './MailLogDetail.vue'
const message = useMessage() // 消息弹窗
defineOptions({ name: 'SystemMailLog' })

// tableObject：表格的属性对象，可获得分页大小、条数等属性
// tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
// 详细可见：https://doc.iocoder.cn/vue3/crud-schema/
const { tableObject, tableMethods } = useTable({
  getListApi: MailLogApi.getMailLogPage // 分页接口
})
// 获得表格的各种操作
const { getList, setSearchParams } = tableMethods

/** 详情操作 */
const detailRef = ref()
const openDetail = (id: number) => {
  detailRef.value.open(id)
}

const multipleSelection = ref<any[]>([])
let ids = ''
const handleSelectionChange = (val: any[]) => {
  multipleSelection.value = val.map(e => e.id)
  ids = multipleSelection.value.join(',')
}

const handleMultipleResend = () => {
  resend(ids)
}

/** 重新发送 */
const resend = async (ids: string) => {
  try {
    // 重新发送的二次确认
    await message.delConfirm(`是否确定对所选中数据重新发送邮件？`)
    // 发起重新发送
    await MailLogApi.getMailRetry(ids)
    message.success('发送邮件成功')
    // 刷新列表
    setTimeout(() => { getList() }, 1000)
    // getList()
  } catch {}
}

/** 初始化 **/
onMounted(() => {
  getList()
})
</script>
