182 lines
3.8 KiB
Vue
182 lines
3.8 KiB
Vue
<template>
|
|
<view :class="['content',{'gray':store.isgray==1}]">
|
|
<view class="box">
|
|
<view>头像</view>
|
|
<view style="display: flex;align-items: center;">
|
|
<button class="head-btn" @click="chooseAvatar">
|
|
<image class="head-img" v-if="!form.avatar" :src="imgUrl(store.userinfo.avatar)" mode="">
|
|
</image>
|
|
<image class="head-img" v-else :src="imgUrl(form.avatar)"></image>
|
|
</button>
|
|
<uni-icons type="right" size="24"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view class="box" style="padding-top: 30rpx;padding-bottom: 30rpx;">
|
|
<view>姓名</view>
|
|
<input disabled style="text-align: right;" type="nickname"
|
|
placeholder-style="font-size: 32rpx;color: #999999;" v-model="store.userinfo.realname"
|
|
placeholder="请输入姓名" />
|
|
</view>
|
|
<view class="box" style="padding-top: 30rpx;padding-bottom: 30rpx;">
|
|
<view>手机号</view>
|
|
<input style="text-align: right;" type="nickname" v-model="store.userinfo.phone"
|
|
placeholder="请输入手机号" placeholder-style="font-size: 32rpx;color: #999999;" />
|
|
</view>
|
|
<view class="box" style="padding-top: 30rpx;padding-bottom: 30rpx;">
|
|
<view>劳动合同号</view>
|
|
<input style="text-align: right;" type="nickname" disabled v-model="store.userinfo.workNo"
|
|
placeholder="请输入劳动合同号" placeholder-style="font-size: 32rpx;color: #999999;" />
|
|
</view>
|
|
</view>
|
|
<view class="line">
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
reactive,
|
|
ref
|
|
} from "vue";
|
|
import {
|
|
onLoad
|
|
} from '@dcloudio/uni-app';
|
|
import {
|
|
userEditApi,
|
|
} from '@/api/api.js';
|
|
import {
|
|
beforeJump,
|
|
imgUrl
|
|
} from '@/utils/index.js';
|
|
import {
|
|
useStore
|
|
} from '@/store';
|
|
const baseUrl = import.meta.env.VITE_REQUEST_BASE_URL + '/jeecg-boot/sys/common/upload'
|
|
const store = useStore()
|
|
|
|
const jump = (url) => {
|
|
beforeJump(url, () => {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
})
|
|
}
|
|
const chooseAvatar = () => {
|
|
uni.chooseImage({
|
|
count: 1,
|
|
success: (chooseImageRes) => {
|
|
const tempFilePaths = chooseImageRes.tempFilePaths;
|
|
const photoPath = '用户头像/' + store.userinfo.realname
|
|
uni.uploadFile({
|
|
url: baseUrl, //仅为示例，非真实的接口地址
|
|
filePath: tempFilePaths[0],
|
|
name: 'file',
|
|
formData: {
|
|
appPath: photoPath
|
|
},
|
|
success: (res) => {
|
|
uni.showLoading({
|
|
title: '上传中...'
|
|
})
|
|
form.avatar = JSON.parse(res.data).message
|
|
userEditApi({
|
|
avatar: form.avatar,
|
|
id: store.userinfo.id
|
|
}).then((res) => {
|
|
if (res) {
|
|
uni.showToast({
|
|
title: res,
|
|
icon: 'success',
|
|
duration: 2000
|
|
})
|
|
}
|
|
}).catch((err) => {
|
|
console.log(err);
|
|
})
|
|
},
|
|
fail(err) {
|
|
console.log('图片上传出错', err);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
}
|
|
|
|
const form = reactive({
|
|
avatar: '',
|
|
realname: '',
|
|
phone: ''
|
|
})
|
|
onLoad(() => {
|
|
uni.setNavigationBarColor({
|
|
frontColor: "#ffffff",
|
|
backgroundColor: '#bebebe'
|
|
})
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.choose {
|
|
font-size: 32rpx;
|
|
color: #999999;
|
|
}
|
|
|
|
.choosed {
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
button::after {
|
|
display: none;
|
|
}
|
|
|
|
.content {
|
|
padding: 30rpx 30rpx 0 30rpx;
|
|
|
|
.box:not(:last-child) {
|
|
border-bottom: 1rpx solid #EFEFEF;
|
|
}
|
|
|
|
.box {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
|
|
button {
|
|
background-color: #fff;
|
|
margin: 0;
|
|
padding: 0;
|
|
border: none;
|
|
|
|
image {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
border-radius: 50%;
|
|
background-color: #f8f8f8;
|
|
}
|
|
}
|
|
|
|
.value {
|
|
color: #999999;
|
|
}
|
|
}
|
|
|
|
.out_login {
|
|
color: #ED361D;
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
margin-top: 60rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.line {
|
|
height: 10rpx;
|
|
background: #F8F8F8;
|
|
}
|
|
|
|
</style> |