|
|
@@ -1,12 +1,188 @@
|
|
|
<template>
|
|
|
- <Info></Info>
|
|
|
+ <view class="f-straight wrapper">
|
|
|
+ <uni-forms ref="form" :modelValue="formData" :rules="rules" validateTrigger="bind" label-width="105px" label-align="right">
|
|
|
+ <uni-forms-item label="头像" name="avatar" class="f-straight">
|
|
|
+ <view style="display: flex;flex-wrap: wrap;">
|
|
|
+ <view class="upload-img" v-if="formData?.avatar" @click="handlePreviewImage">
|
|
|
+ <uni-icons size="30" type="clear" color="#fe574a" style="position: absolute;right: -11px; top: -11px; z-index: 9" @click="formData.avatar = ''"></uni-icons>
|
|
|
+ <image :src="formData?.avatar" mode="contain" style="width: 200rpx;height: 200rpx;"></image>
|
|
|
+ </view>
|
|
|
+ <view v-else class="upload-file" @click="uploadPhotos">
|
|
|
+ <uni-icons type="plusempty" size="50" color="#f1f1f1"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item required label="中文名" name="name">
|
|
|
+ <uni-easyinput v-model="formData.name" placeholder="请输入中文名" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="性别" name="sex" required>
|
|
|
+ <uni-data-checkbox v-model="formData.sex" :localdata="sexData" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="联系电话" name="phone">
|
|
|
+ <uni-easyinput v-model="formData.phone" placeholder="请输入电话号码" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="常用邮箱" name="email">
|
|
|
+ <uni-easyinput v-model="formData.email" placeholder="请输入常用邮箱" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item required label="出生日期" name="birthday">
|
|
|
+ <uni-datetime-picker type="date" return-type="timestamp" v-model="formData.birthday" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="首次工作时间" name="firstWorkTime">
|
|
|
+ <uni-datetime-picker type="date" return-type="timestamp" v-model="formData.firstWorkTime" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item required label="工作年限" name="expType" >
|
|
|
+ <uni-data-picker v-model="formData.expType" :localdata="dictObj.exp" :clear-icon="false" popup-title="请选择工作年限" :clear="false" :map="map"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item required label="最高学历" name="eduType" >
|
|
|
+ <uni-data-picker v-model="formData.eduType" :localdata="dictObj.edu" :clear-icon="false" popup-title="请选择最高学历" :clear="false" :map="map"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item required label="求职类型" name="jobType" >
|
|
|
+ <uni-data-picker v-model="formData.jobType" :localdata="dictObj.jobType" :clear-icon="false" popup-title="请选择求职类型" :map="map"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item required label="求职状态" name="jobStatus" >
|
|
|
+ <uni-data-picker v-model="formData.jobStatus" :localdata="dictObj.jobStatus" :clear-icon="false" popup-title="请选择求职状态" :map="map"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="婚姻状况" name="maritalStatus" >
|
|
|
+ <uni-data-picker v-model="formData.maritalStatus" :localdata="dictObj.marital" :clear-icon="false" popup-title="请选择婚姻状况" :map="map"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="所在城市" name="areaId" >
|
|
|
+ <uni-data-picker v-model="formData.areaId" :localdata="dictObj.areaTreeData" :clear-icon="false" popup-title="请选择所在城市" :map="{ text: 'name', value: 'id'}"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="户籍地" name="regId" >
|
|
|
+ <uni-data-picker v-model="formData.regId" :localdata="dictObj.areaTreeData" :clear-icon="false" popup-title="请选择户籍所在地" :map="{ text: 'name', value: 'id'}"></uni-data-picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <view class="f-horizon-center">
|
|
|
+ <button type="primary" size="default" class="send-button" @click="submit">提 交</button>
|
|
|
+ </view>
|
|
|
+ </uni-forms>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import Info from '@/pagesA/info/index'
|
|
|
+import { ref, unref } from 'vue'
|
|
|
+import { userStore } from '@/store/user'
|
|
|
+import { dictObj } from '@/utils/position.js'
|
|
|
+import { uploadFile } from '@/api/file'
|
|
|
+import { cloneDeep } from 'lodash-es'
|
|
|
+import { saveBaseInfo, updatePersonAvatar } from '@/api/user'
|
|
|
|
|
|
+const form = ref()
|
|
|
+const sexData = ref([])
|
|
|
+const map = { text: 'label', value: 'value' }
|
|
|
+const useUserStore = userStore()
|
|
|
+
|
|
|
+const formData = ref({})
|
|
|
+const getInfo = () => {
|
|
|
+ formData.value = cloneDeep(useUserStore?.baseInfo) || {
|
|
|
+ avatar: '',
|
|
|
+ name: '',
|
|
|
+ sex: '',
|
|
|
+ regId: '',
|
|
|
+ birthday: '',
|
|
|
+ phone: '',
|
|
|
+ email: '',
|
|
|
+ eduType: '',
|
|
|
+ firstWorkTime: '',
|
|
|
+ expType: '',
|
|
|
+ jobType: '',
|
|
|
+ jobStatus: '',
|
|
|
+ maritalStatus: '',
|
|
|
+ areaId: ''
|
|
|
+ }
|
|
|
+}
|
|
|
+getInfo()
|
|
|
+
|
|
|
+if (dictObj && dictObj?.sex) {
|
|
|
+ sexData.value = dictObj.sex.map(e => {
|
|
|
+ return { text: e.label, value: e.value, ...e }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 图片预览
|
|
|
+const handlePreviewImage = () => {
|
|
|
+ uni.previewImage({
|
|
|
+ current: 0,
|
|
|
+ urls: [formData.value.avatar]
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 选择头像
|
|
|
+const uploadPhotos = () => {
|
|
|
+ wx.chooseImage({
|
|
|
+ count: 1,
|
|
|
+ sizeType: ['original', 'compressed'],
|
|
|
+ sourceType: ['album', 'camera'],
|
|
|
+ success: function(res){
|
|
|
+ const path = res.tempFilePaths[0]
|
|
|
+ uploadFile(path).then(res => {
|
|
|
+ formData.value.avatar = res.data
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'error',
|
|
|
+ title: '图片上传失败!',
|
|
|
+ duration: 2000
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const rules = {
|
|
|
+ name:{
|
|
|
+ rules: [{required: true, errorMessage: '请输入姓名' }]
|
|
|
+ },
|
|
|
+ sex : {
|
|
|
+ rules: [{required: true, errorMessage: '请选择您的性别' }]
|
|
|
+ },
|
|
|
+ birthday: {
|
|
|
+ rules: [{required: true, errorMessage: '请选择您的出生日期' }]
|
|
|
+ },
|
|
|
+ expType: {
|
|
|
+ rules: [{required: true, errorMessage: '请选择您的工作年限' }]
|
|
|
+ },
|
|
|
+ eduType: {
|
|
|
+ rules: [{required: true, errorMessage: '请选择您的最高学历' }]
|
|
|
+ },
|
|
|
+ jobType: {
|
|
|
+ rules: [{required: true, errorMessage: '请选择您的求职类型' }]
|
|
|
+ },
|
|
|
+ jobStatus: {
|
|
|
+ rules: [{required: true, errorMessage: '请选择您的求职状态' }]
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const submit = async () => {
|
|
|
+ const valid = await unref(form).validate()
|
|
|
+ if (!valid) return
|
|
|
+
|
|
|
+ await updatePersonAvatar(formData.value.avatar)
|
|
|
+ await saveBaseInfo(formData.value)
|
|
|
+ uni.showToast({ title: '编辑成功', icon: 'success' })
|
|
|
+ await useUserStore.getInfo()
|
|
|
+ getInfo()
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss" scoped>
|
|
|
+<style lang="less" scoped>
|
|
|
|
|
|
+.wrapper{
|
|
|
+ padding: 15px;
|
|
|
+}
|
|
|
+.upload-img{
|
|
|
+ position: relative;
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border: 1px solid #f1f1f1;
|
|
|
+ margin: 10rpx;
|
|
|
+}
|
|
|
+.upload-file{
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border: 1px solid #f1f1f1;
|
|
|
+ margin: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 10rpx;
|
|
|
+}
|
|
|
</style>
|
zhengnaiwen_citu