WorkBuddy
69ebf33e18
CI/CD Pipeline / Backend Build & Test (push) Waiting to run
CI/CD Pipeline / Admin Web Build (push) Waiting to run
CI/CD Pipeline / Mini Program Compile Check (push) Waiting to run
CI/CD Pipeline / Migration Validation (push) Blocked by required conditions
CI/CD Pipeline / Test Shell Guard (Phase 23 Gate) (push) Waiting to run
CI/CD Pipeline / UI Contracts (source-structure gates) (push) Waiting to run
CI/CD Pipeline / E2E (live stack) (push) Blocked by required conditions
82 lines
2.2 KiB
Vue
82 lines
2.2 KiB
Vue
<template>
|
|
<div class="ui-user-card" @click="$emit('tap', user)">
|
|
<UiAvatar :src="user.avatarUrl" :name="user.displayName" :size="56" />
|
|
<div class="ui-user-card__main">
|
|
<div class="ui-user-card__title">
|
|
<span class="ui-user-card__name">{{ user.displayName || '未设置昵称' }}</span>
|
|
<UiTag v-if="user.verified" type="success">已实名</UiTag>
|
|
</div>
|
|
<div class="ui-user-card__meta">
|
|
<span v-if="user.age">{{ user.age }}岁</span>
|
|
<span v-if="user.heightCm">{{ user.heightCm }}cm</span>
|
|
<span v-if="user.regionName">{{ user.regionName }}</span>
|
|
</div>
|
|
<div v-if="user.recommendationReasons?.length" class="ui-user-card__reasons">
|
|
{{ user.recommendationReasons.slice(0, 3).join(' · ') }}
|
|
</div>
|
|
</div>
|
|
<div v-if="showActions" class="ui-user-card__actions">
|
|
<van-button size="mini" type="primary" :loading="loading" @click.stop="$emit('like', user)">喜欢</van-button>
|
|
<van-button size="mini" plain @click.stop="$emit('pass', user)">略过</van-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import UiAvatar from './UiAvatar.vue'
|
|
import UiTag from './UiTag.vue'
|
|
|
|
const props = withDefaults(
|
|
defineProps<{ user: any; showActions?: boolean; loading?: boolean }>(),
|
|
{ showActions: false, loading: false },
|
|
)
|
|
defineEmits<{ tap: [any]; like: [any]; pass: [any] }>()
|
|
</script>
|
|
|
|
<style scoped>
|
|
.ui-user-card {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
background: var(--mini-surface);
|
|
border-radius: var(--mini-radius);
|
|
padding: 12px;
|
|
margin-bottom: 10px;
|
|
box-shadow: var(--mini-shadow);
|
|
}
|
|
.ui-user-card__main {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
.ui-user-card__title {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
.ui-user-card__name {
|
|
font-size: 15px;
|
|
font-weight: 600;
|
|
color: var(--mini-text-strong);
|
|
}
|
|
.ui-user-card__meta {
|
|
display: flex;
|
|
gap: 10px;
|
|
font-size: 12px;
|
|
color: var(--mini-text-secondary);
|
|
margin-top: 4px;
|
|
}
|
|
.ui-user-card__reasons {
|
|
font-size: 12px;
|
|
color: var(--mini-tabbar-active);
|
|
margin-top: 4px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.ui-user-card__actions {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 6px;
|
|
}
|
|
</style>
|