| | |
| | | <template> |
| | | <div class="flexJob-card-wrapper"> |
| | | <div class="flexJob-card-top-wrapper"> |
| | | <UserAvatar :size="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-gender"> |
| | | <img v-if="1" :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> |
| | | <div class="flexJob-card-top-info-detail">{{ '26岁 | 非学生 | 本科 | 上岗121次' }}</div> |
| | | </div> |
| | | </div> |
| | | <FlexJobTopView /> |
| | | <div class="flexJob-card-done-list"> |
| | | {{ |
| | | '做过:客房服务员、客房服务员、客房客房服务员、客房做过:客房服务员、客房服务员、客房客房服务员、客房' |
| | |
| | | <div class="flexJob-card-done-detail-item">{{ '在「宁波雷迪森酒店」,做过客房服务员' }}</div> |
| | | </div> |
| | | <div class="flexJob-card-footer"> |
| | | <div class="flexJob-card-footer-left" v-if="showFooterLeft"> |
| | | <slot name="footerLeft"> |
| | | <div class="flexJob-card-footer-text">取消收藏</div> |
| | | </slot> |
| | | <div class="flexJob-card-footer-left-wrapper"> |
| | | <div class="flexJob-card-footer-left" v-if="showFooterLeft"> |
| | | <slot name="footerLeft"> |
| | | <div class="flexJob-card-footer-text">取消收藏</div> |
| | | </slot> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="flexJob-card-footer-right" v-if="showFooterRight"> |
| | | <slot name="footerRight"> |
| | | <nut-button type="primary">立即联系</nut-button> |
| | |
| | | import IconMale from '@/assets/mine/icon-male.png'; |
| | | import IconFemale from '@/assets/mine/icon-female.png'; |
| | | import { CommonTaskCardProps } from './card'; |
| | | import FlexJobTopView from './FlexJobTopView.vue'; |
| | | |
| | | defineOptions({ |
| | | name: 'FlexJobCard', |
| | |
| | | } |
| | | |
| | | .flexJob-card-top-wrapper { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 38px; |
| | | |
| | | .flexJob-card-top-avatar { |
| | | margin-right: 30px; |
| | | } |
| | | |
| | | .flexJob-card-top-info { |
| | | display: flex; |
| | | flex-direction: column; |
| | | |
| | | .flexJob-card-top-info-item { |
| | | display: flex; |
| | | align-items: center; |
| | | |
| | | .flexJob-card-top-info-name { |
| | | font-size: 34px; |
| | | line-height: 34px; |
| | | font-weight: bold; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | } |
| | | |
| | | .flexJob-card-top-info-gender { |
| | | display: inline-flex; |
| | | align-items: center; |
| | | height: 34px; |
| | | margin: 0 10px; |
| | | |
| | | .flexJob-card-top-info-gender-icon { |
| | | width: 24px; |
| | | height: 24px; |
| | | } |
| | | } |
| | | |
| | | .flexJob-card-top-info-auth { |
| | | font-size: 28px; |
| | | line-height: 34px; |
| | | } |
| | | } |
| | | |
| | | .flexJob-card-top-info-detail { |
| | | font-size: 24px; |
| | | font-weight: 400; |
| | | line-height: 28px; |
| | | margin-top: 12px; |
| | | color: boleGetCssVar('text-color', 'secondary'); |
| | | } |
| | | } |
| | | } |
| | | |
| | | .flexJob-card-done-list { |
| | |
| | | .flexJob-card-footer { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | border-top: #d9d9d9 1px solid; |
| | | padding-top: 24px; |
| | | margin-top: 18px; |
| | | |
| | | .flexJob-card-footer-left-wrapper { |
| | | flex: 1; |
| | | min-width: 0; |
| | | } |
| | | |
| | | .flexJob-card-footer-left { |
| | | .flexJob-card-footer-text { |
| | |
| | | .flexJob-card-footer-right { |
| | | --nut-button-default-font-size: 24px; |
| | | --nut-button-default-height: 52px; |
| | | --nut-button-default-line-height: 49px; |
| | | } |
| | | } |
| | | } |