<template>
  <div class="book-item van-hairline--bottom" @click="handle">
    <van-row>
      <van-col span="6">
        <van-image
          width="5rem"
          height="5rem"
          :src="item.avatar"
          style="text-align: center;"
        />
      </van-col>
      <van-col span="18" style="padding-left: 1rem;">
        <p style="font-size: 1.15rem; color: #222222; font-weight: bold;">逃家小兔绘本</p>
        <div style="font-size: 0.85rem; color: #999999; margin: 0.5rem 0;" class="van-multi-ellipsis--l2">
          从前有一只小兔子，总是想要离家出走。有一天，他对妈妈说如果有大灰狼怎么办，不要把门打开
        </div>
        <div style="font-size: 0.85rem; color: #999999; margin-top: 0.5rem;">
          <van-icon :name="icon_video" />
          54个作品
        </div>
      </van-col>
    </van-row>
  </div>
</template>

<script setup>
import icon_video from '@images/video.png'

import { ref, reactive, onMounted } from 'vue'
const props = defineProps({
  item: Object
})
const emit = defineEmits(['on-click']);
const handle = () => {
  emit('on-click', '')
}
  onMounted(() => {
    
  })
</script>

<script>
export default {
  data () {
    return {

    }
  },
  mounted () {

  },
  methods: {

  }
}
</script>

<style lang="less" scoped>
  .book-item {
    margin: 1rem;
    padding: 1rem;
  }
</style>