From 186234cb3833e620aa0ae46212fe337eb2d6e77d Mon Sep 17 00:00:00 2001 From: wupengfei <834520024@qq.com> Date: 星期四, 13 三月 2025 13:07:02 +0800 Subject: [PATCH] feat: 接口对接 --- packages/components/src/Card/FlexJobTopView.vue | 34 +++++++++++++++++++++++++++++----- 1 files changed, 29 insertions(+), 5 deletions(-) diff --git a/packages/components/src/Card/FlexJobTopView.vue b/packages/components/src/Card/FlexJobTopView.vue index 4f938b6..ba2b4fd 100644 --- a/packages/components/src/Card/FlexJobTopView.vue +++ b/packages/components/src/Card/FlexJobTopView.vue @@ -1,16 +1,24 @@ <template> <div :class="['flexJob-card-top-wrapper', size]"> - <UserAvatar :size="size === 'small' ? 50 : 60" class="flexJob-card-top-avatar" /> + <Avatar :src="avatarUrl" :size="size === 'small' ? 50 : 60" class="flexJob-card-top-avatar" /> <div class="flexJob-card-top-info"> <div class="flexJob-card-top-info-item"> - <div class="flexJob-card-top-info-name">{{ '娲嬫磱' }}</div> + <div class="flexJob-card-top-info-name">{{ name }}</div> <div class="flexJob-card-top-info-gender"> - <img v-if="1" :src="IconMale" class="flexJob-card-top-info-gender-icon" /> + <img + v-if="genderType === Gender.Male" + :src="IconMale" + class="flexJob-card-top-info-gender-icon" + /> <img v-else :src="IconFemale" class="flexJob-card-top-info-gender-icon" /> </div> - <div class="flexJob-card-top-info-auth">{{ '宸插疄鍚�' }}</div> + <div class="flexJob-card-top-info-auth">{{ isRealName ? '宸插疄鍚�' : '鏈疄鍚�' }}</div> </div> - <div class="flexJob-card-top-info-detail">{{ '26宀� | 闈炲鐢� | 鏈 | 涓婂矖121娆�' }}</div> + <slot name="detail"> + <div class="flexJob-card-top-info-detail"> + {{ `${age}宀� | ${educationalLevel} | ${educationalLevel} | 涓婂矖${arrangeCount}娆 }} + </div> + </slot> </div> </div> </template> @@ -18,6 +26,8 @@ <script setup lang="ts"> import IconMale from '@/assets/mine/icon-male.png'; import IconFemale from '@/assets/mine/icon-female.png'; +import { AvatarImage, Gender } from '@12333/constants'; +import { Avatar } from '@12333/components'; defineOptions({ name: 'FlexJobTopView', @@ -25,10 +35,19 @@ type Props = { size?: 'normal' | 'small'; + + avatarUrl?: string; + name?: string; + genderType?: Gender; + age?: number; + educationalLevel?: string; + arrangeCount?: number; + isRealName?: boolean; }; const props = withDefaults(defineProps<Props>(), { size: 'normal', + avatarUrl: AvatarImage, }); </script> @@ -46,6 +65,8 @@ .flexJob-card-top-info { display: flex; flex-direction: column; + flex: 1; + min-width: 0; .flexJob-card-top-info-item { display: flex; @@ -56,6 +77,7 @@ line-height: 34px; font-weight: bold; color: boleGetCssVar('text-color', 'primary'); + @include ellipsis; } .flexJob-card-top-info-gender { @@ -63,6 +85,7 @@ align-items: center; height: 34px; margin: 0 10px; + flex-shrink: 0; .flexJob-card-top-info-gender-icon { width: 24px; @@ -73,6 +96,7 @@ .flexJob-card-top-info-auth { font-size: 28px; line-height: 34px; + flex-shrink: 0; } } -- Gitblit v1.9.1