ks-app-employment-service/packageA/pages/myResume/myResume.vue

<template>
    <view class="mys-container">
        <!-- 个人信息 -->
        <view class="mys-tops btn-feel">
            <view class="tops-left">
                <view class="name">
                    <text>{{ userInfo.name || '编辑用户名' }}</text>
                    <view class="edit-icon mar_le10">
                        <image
                            class="button-click"
                            src="@/static/icon/edit1.png"
                            @click="navTo('/packageA/pages/personalInfo/personalInfo')"
                        ></image>
                    </view>
                </view>
                <view class="subName">
                    <dict-Label class="mar_ri10" dictType="sex" :value="userInfo.sex"></dict-Label>
                    <text class="mar_ri10">{{ userInfo.age }}岁</text>
                    <dict-Label class="mar_ri10" dictType="education" :value="userInfo.education"></dict-Label>
                    <dict-Label
                        class="mar_ri10"
                        dictType="affiliation"
                        :value="userInfo.politicalAffiliation"
                    ></dict-Label>
                </view>
                <view class="subName">{{ userInfo.phone }}</view>
            </view>
            <view class="tops-right">
                <view class="right-imghead">
                    <image v-if="userInfo.sex === '0'" src="@/static/icon/boy.png"></image>
                    <image v-else src="@/static/icon/girl.png"></image>
                </view>
                <view class="right-sex">
                    <image v-if="userInfo.sex === '0'" src="@/static/icon/boy1.png"></image>
                    <image v-else src="@/static/icon/girl1.png"></image>
                </view>
            </view>
        </view>
        <!-- 求职期望 -->
        <view class="mys-line"></view>
        <view class="mys-info">
            <view class="mys-h4">
                <text>求职期望</text>
                <view class="mys-edit-icon">
                    <image
                        class="button-click"
                        src="@/static/icon/edit1.png"
                        @click="navTo('/packageA/pages/jobExpect/jobExpect')"
                    ></image>
                </view>
            </view>
            <view class="mys-text">
                <text>期望薪资：</text>
                <text>{{ userInfo.salaryMin / 1000 }}k-{{ userInfo.salaryMax / 1000 }}k</text>
            </view>
            <view class="mys-text">
                <text>期望工作地：</text>
                <text>青岛市-</text>
                <dict-Label dictType="area" :value="Number(userInfo.area)"></dict-Label>
            </view>
            <view class="mys-list">
                <view class="cards button-click" v-for="(title, index) in userInfo.jobTitle" :key="index">
                    {{ title }}
                </view>
            </view>
        </view>
    </view>
</template>

<script setup>
import { reactive, inject, watch, ref, onMounted, computed } from 'vue';
const { $api, navTo } = inject('globalFunction');
import { onLoad, onShow } from '@dcloudio/uni-app';
import { storeToRefs } from 'pinia';
import useUserStore from '@/stores/useUserStore';
import useDictStore from '@/stores/useDictStore';
const { userInfo } = storeToRefs(useUserStore());
const { getUserResume } = useUserStore();
const { getDictData, oneDictData } = useDictStore();
</script>

<style lang="stylus" scoped>
image{
    width: 100%;
    height: 100%
}
.mys-container{
    .mys-tops{
        display: flex
        justify-content: space-between
        padding: 52rpx 48rpx
        .tops-left{
            .name{
                font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
                font-weight: 600;
                font-size: 44rpx;
                color: #333333;
                display: flex
                align-items: center
                justify-content: flex-start
                .edit-icon{
                    display: inline-block
                    width: 40rpx;
                    height: 40rpx
                    padding-bottom: 10rpx
                }
            }
            .subName{
                margin-top: 12rpx
                font-weight: 400;
                font-size: 32rpx;
                color: #333333;
            }

        }
        .tops-right{
            position: relative
            .right-imghead{
                width: 136rpx;
                height: 136rpx;
                border-radius: 50%;
                background: #e8e8e8
                overflow: hidden
            }
            .right-sex{
                position: absolute
                right: -10rpx
                top: -10rpx
                width: 50rpx
                height: 50rpx
            }
        }
    }
    .mys-line{
        margin: 0 28rpx
        height: 0rpx;
        border-radius: 0rpx 0rpx 0rpx 0rpx;
        border: 2rpx dashed #000000;
        opacity: 0.16;
    }
    .mys-info{
        padding: 28rpx
        .mys-h4{
            font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
            font-weight: 600;
            font-size: 32rpx;
            color: #000000;
            margin-bottom: 8rpx
            display: flex;
            justify-content: space-between
            align-items: center
            .mys-edit-icon{
                display: inline-block
                width: 40rpx;
                height: 40rpx
            }
        }
        .mys-text{
            font-weight: 400;
            font-size: 28rpx;
            color: #333333;
            margin-top: 16rpx
        }
        .mys-list{
            display: flex
            align-items: center
            flex-wrap: wrap;
            .cards{
                margin: 28rpx 28rpx 0 0
                height: 80rpx;
                padding: 0 38rpx;
                width: fit-content
                display: flex
                align-items: center
                justify-content: center
                border-radius: 12rpx 12rpx 12rpx 12rpx;
                border: 2rpx solid #E8EAEE;
            }
        }
    }
}
</style>