<template>
  <view class="w-full mt-2 bg-white px-4">
    <view
      v-for="(item, index) in dataList"
      :key="index"
      class="w-full box-border py-4 last:border-b-0"
    >
      <view class="flex justify-between items-center">
        <view style="border: 1px solid red" @click.stop="goToPage(item)">
          <view class="text-xs text-gray-400">
            <image class="w-[20rpx] h-[20rpx]" :src="oval" mode="widthFix" />
            {{ item.time }}
          </view>
          <view class="mt-1 text-gray-800">{{ item.title }}</view>
          <view class="mt-1 text-xs text-gray-500 line-clamp-1">
            {{ item?.desc ? item?.desc : '无备注' }}
            asdjaghjsdhgajsdgajhsdgahsdghsgdasdgajshgggggggggg
          </view>
          <view v-if="item?.recorder" class="mt-1 text-xs text-gray-400">
            记录者：{{ item?.recorder }}
          </view>
        </view>
        <view v-if="item?.image" class="ml-4">
          <img :src="item?.image" class="w-16 h-16 rounded-lg object-cover" alt="记录图片" />
        </view>
      </view>
    </view>
  </view>
</template>

<script setup>
  import oval from '@img/index/oval.svg'
  defineOptions({
    name: 'Recordlist',
  })

  defineProps({
    dataList: {
      type: Array,
      default: [],
    },
  })

  function goToPage({ type, id }) {
    uni.navigateTo({
      url: `/pages/record/record?type=${type}&id=${id}`,
    })
  }
</script>

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