<script setup>
import { inject } from "vue";
import { postChgAck } from "@/apis/alert";
import { Button } from "ant-design-vue";
const { dataSource, openModal, search, tableLoading } = inject("alert_table");

const columns = [
  {
    key: "alarm_guid",
    title: "異常ID",
  },
  {
    key: "factor",
    title: "告警條件",
  },
  {
    key: "device_number",
    title: "設備名稱",
  },
  {
    key: "points",
    title: "點位名稱",
  },
  {
    key: "created_at",
    title: "發生時間",
  },
  {
    key: "reason",
    title: "異常原因",
  },
  {
    key: "repairOrder",
    title: "派工 / 維運單號",
  },
];

const chgAck = async (devUuid) => {
  const res = await postChgAck(devUuid);
  if (res.isSuccess) {
    search?.();
  }
};
</script>

<template>
  <Table :loading="tableLoading" :columns="columns" :dataSource="dataSource">
    <template #bodyCell="{ record, column, index }">
      <template v-if="column.key === 'repairOrder'">
        <button
          class="btn btn-sm btn-success text-white whitespace-nowrap mr-2"
          @click.stop.prevent="() => openModal(record)"
        >
          <span v-if="record.formId">{{ record.formId }}</span>
          <span v-else>
            <font-awesome-icon :icon="['fas', 'plus']" />維修單
          </span>
        </button>
      </template>
    </template>
  </Table>
</template>

<style lang="scss" scoped></style>
