<template>
  <div class="min-h-400 pb-10">
    <ProfileNotesEmpty v-if="!loading && !draftList.length" />

    <div v-else-if="draftList.length" class="grid grid-cols-1">
      <ProfileNotesRejectedItem
        v-for="item in draftList"
        :key="item.id"
        :data="item"
        @on-delete="handleDelete(item)"
      />
    </div>
  </div>
</template>

<script setup>
const { loading, setLoading } = useLoading()
loading.value = true

const draftList = ref([])

async function getNotesList() {
  setLoading(true)
  try {
    const { data } = await request('/website/tourism/publishTravelNotes/getDraftList', {
      query: {
        pageNum: 1,
        pageSize: 10000,
        type: 2
      }
    })
    draftList.value = data.dataList
  } finally {
    setLoading(false)
  }
}

async function handleDelete(item) {
  showConfirmDialog({
    title: '提示',
    message: '确定删除吗?'
  })
    .then(async () => {
      try {
        await request(`/website/tourism/publishTravelNotes/removeByDraftId`, {
          method: 'post',
          body: {
            writeId: item.id
          }
        })
        showSuccessToast('删除成功')
        getNotesList()
      } catch (error) {}
    })
    .catch(() => {
      // on cancel
    })
}

onMounted(() => {
  getNotesList()
})
</script>

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