68 lines
3.0 KiB
Vue
68 lines
3.0 KiB
Vue
<template>
|
|
<div class="mb-[20px] w-[100%] cursor-pointer overflow-hidden border border-[#EEEEEE] rounded-[10px] border-solid bg-[#FFFFFF]" @click="handleClick">
|
|
<div>
|
|
<el-image :src="props.itemInfo.iconUrl" class="h-[216px] w-[100%]" fit="cover"></el-image>
|
|
</div>
|
|
<div class="box-border p-[16px]">
|
|
<div class="flex items-center justify-between">
|
|
<div>
|
|
<div class="title mr-[38px] text-[16px] text-[#333333] font-bold flex items-center" :title="props.itemInfo.title">
|
|
<img v-if="props.itemInfo.source === 2" src="~/assets/images/zhuan.png" alt="" srcset="" class="mr-[2px] w-[22px] relative bottom-[-4px]" />
|
|
<img v-if="props.itemInfo.source === 1" src="~/assets/images/yuan.png" alt="" srcset="" class="mr-[2px] w-[20px] relative bottom-[-4px]" />
|
|
{{ props.itemInfo.title }}
|
|
</div>
|
|
<div class="mt-[8px] text-[15px] text-[#999999] font-normal">by {{ props.itemInfo?.ownedUserIdInfo?.nickName }}</div>
|
|
<div class="mt-[4px] text-[13px] text-[#999999] font-normal">{{ dayjs(props.itemInfo.createTime).format('YYYY-MM-DD HH:mm:ss') }}</div>
|
|
</div>
|
|
<div><img :src="props.itemInfo?.ownedUserIdInfo?.avatar" alt="" srcset="" class="h-[40px] w-[40px] rd-[50%]" /></div>
|
|
</div>
|
|
<div class="mt-[14px] flex items-center justify-between">
|
|
<div class="flex items-center justify-between text-[14px] text-[#666666] font-normal">
|
|
<div class="mr-[9px] flex items-center">
|
|
<img src="~/assets/images/look.png" alt="" srcset="" class="mr-[2px] h-[17px]" />
|
|
<span class="color-[#666]">{{ props.itemInfo.previewPoint }}</span>
|
|
</div>
|
|
<div class="mr-[9px] flex items-center">
|
|
<img src="~/assets/images/add.png" alt="" srcset="" class="mr-[2px] h-[22px]" />
|
|
<span class="color-[#666]">{{ props.itemInfo.hotPoint }}</span>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<img src="~/assets/images/chat.png" alt="" srcset="" class="mr-[4px] h-[17px]" />
|
|
<span class="color-[#666]">{{ props.itemInfo.commentsPoint }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="h-[30px] w-[90px] cursor-pointer border border-[#1A65FF] rounded-[15px] border-solid text-center line-height-[30px]"
|
|
><span class="text-[14px] text-[#1A65FF] font-normal">查看详情</span></div
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import dayjs from 'dayjs'
|
|
import type { PropType } from 'vue'
|
|
import type { pageRes } from '~/api/upnew/types'
|
|
const props = defineProps({
|
|
itemInfo: {
|
|
type: Object as PropType<pageRes['list'][0]>,
|
|
default: () => {
|
|
return {}
|
|
},
|
|
},
|
|
})
|
|
|
|
const handleClick = async () => {
|
|
console.log(props.itemInfo)
|
|
|
|
// 跳转到下载详情页 并且是单独开标签
|
|
await navigateTo(`/down-drawe-detail/${props.itemInfo.id}`) // 修改为在新窗口打开
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.title {
|
|
@include ellipsis(1);
|
|
}
|
|
</style>
|