guessing-miniprogram-fortend/src/components/quiz/item-new.vue

57 lines
1.5 KiB
Vue

<template>
<view>
<view class="flex items-center py-2" @click="$goToPage({url:'pages/quiz/logs', params: { activity_id: data.activity_id,user_id: data.user_id}})">
<view class="w-84rpx h-84rpx rounded-full flex-none">
<up-avatar size="84rpx" mode="aspectFit" :src="data.avatar"></up-avatar>
</view>
<view class="ml-10rpx flex-1">
<view class="flex-1 flex justify-between items-center">
<view class="text-28rpx text-primary">{{ data.nick_name }}</view>
<view class="text-xs text-hex-999">{{ data.history }}</view>
</view>
<view class="flex items-center text-sm">
<view class="flex items-center flex-1">
<view></view>
<view class="px-3">
{{ data.game_home_field }} VS {{ data.game_away }}
</view>
<view>{{ data.score }}</view>
</view>
<view :style="{color:currentStatus.color}">{{ currentStatus.label }}</view>
</view>
</view>
</view>
<up-line dashed></up-line>
</view>
</template>
<script setup>
import { computed } from 'vue'
const props = defineProps({
data: {
item: Object,
},
})
const status = [
{
value: 0,
label: '未公布',
color: '#1b2f85',
},
{
value: 1,
label: '猜中了',
color: '#e91f35',
},
{
value: 2,
label: '未猜中',
color: '#808080',
},
]
const currentStatus = computed(() =>
status.find((e) => e.value == props.data.status)
)
</script>