<template>
  <a-card>
    <a-table
      :columns="columns"
      :loading="state.loading"
      :data-source="state.dataSource"
      style="margin-top: 20px;"
      :pagination="queryParams"
      @change="changePage"
    >
    </a-table>
  </a-card>
</template>
<script lang='ts' setup >
import { DevOpsController } from '@/controller/iot/devOps'
import { onMounted, reactive } from 'vue'

const columns = [
  {
    title: 'ID',
    dataIndex: 'id'
  },
  {
    title: '提醒名称',
    dataIndex: 'noticeLabel'
  },
  {
    title: '提醒实体ID',
    dataIndex: 'noticeEntityId'
  },
  {
    title: '提醒描述',
    dataIndex: 'noticeDescription'
  },
  {
    title: '实体ID',
    dataIndex: 'entityId'
  }
]

const queryParams = reactive({
  page: 1,
  pageSize: 10,
  total: 0
})

const state = reactive({
  loading: false,
  dataSource: []
})

const changePage = ({ current }) => {
  queryParams.page = current
  getNoticePage()
}

const getNoticePage = async () => {
  state.loading = true
  const { data, sum } = await DevOpsController.pageNotice(queryParams)
  state.loading = false
  state.dataSource = data
  queryParams.total = sum
}

onMounted(() => {
  getNoticePage()
})

</script>
<style lang='less' scoped >
</style>
