<script setup lang="ts">
import { useI18n } from 'vue-i18n'
import { ref } from 'vue'
import { getUserMessageApi, getUserMessageDetailApi } from '@/api/message'
import { onShow } from '@dcloudio/uni-app'
import { timestampToDate2 } from '@/common/common'
const { t } = useI18n()
const UserMessageList = ref([])

onShow(() => {
  getUserMessage()
  getUserMessageDetail()
})

const getUserMessage = async () => {
  const res = await getUserMessageApi()
  if (res.code === 1) {
    UserMessageList.value = res.data.data
  }
}
const getUserMessageDetail = async () => {
  await getUserMessageDetailApi()
}

// const getData = (dataString: any) => {
//   const time = new Date(dataString * 1000)
//   const year = time.getFullYear()
//   const month = time.getMonth() + 1
//   const day = time.getDate()
//   const hour = time.getHours()
//   const minute = time.getMinutes()
//   const second = time.getSeconds()
//   return (
//     year +
//     '-' +
//     (month < 10 ? '0' + month : month) +
//     '-' +
//     (day < 10 ? '0' + day : day) +
//     ' ' +
//     (hour < 10 ? '0' + hour : hour) +
//     ':' +
//     (minute < 10 ? '0' + minute : minute) +
//     ':' +
//     (second < 10 ? '0' + second : second)
//   )
// }
</script>
<template>
  <Navigater :title="t('message.xiaoxi')" />
  <view>
    <scroll-view scroll-y :style="{ height: 'calc(100vh - 48px)' }">
      <view v-for="(item, index) in UserMessageList" :key="index">
        <view class="createtime">{{ timestampToDate2(item.createtime) }}</view>
        <view class="content">{{ item.content }}</view>
      </view>
      <NotData v-if="UserMessageList.length === 0" />
    </scroll-view>
  </view>
</template>
<style lang="scss" scoped>
.content {
  color: #fff;
  background-color: rgba(10, 31, 54, 0.8);
  margin: 0.625rem;
  padding: 0.9375rem 0.625rem;
  font-size: $uni-font-size-1;
  border-radius: 0.625rem;
}
.createtime {
  font-size: $uni-font-size-1;
  color: #747474;
  text-align: center;
  margin-top: 0.625rem;
}
</style>
