Files
app-govern/pages/user/head.vue
2024-09-02 09:50:59 +08:00

110 lines
3.4 KiB
Vue

<template>
<view>
<Cn-page :loading="loading">
<view slot="body">
<view class="head">
<image class="head-img" :src="userInfo.avatar" v-if="userInfo.avatar"></image>
<image class="head-img" src="/static/head.png" v-else></image>
<view class="head-setup">
<view class="head-setup-item" @click="take('album')">从相册选一张</view>
<view class="head-setup-item" @click="take('camera')">拍一张照片</view>
</view>
</view>
</view>
</Cn-page>
<uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog
type="info"
cancelText="禁止"
confirmText="允许"
title="权限说明"
content='是否允许"灿能物联"使用相机?'
@confirm="handleScon('camera')"
@close="dialogClose"
></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
import { uploadImage, getImageUrl } from '@/common/api/basic'
import { apiUpdateUser } from '@/common/api/user'
export default {
data() {
return {
loading: false,
userInfo: {},
}
},
methods: {
take(type) {
if (type == 'camera') {
if (
plus.os.name == 'Android' &&
plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
) {
//未授权
this.$refs.alertDialog.open()
} else {
this.handleScon(type)
}
} else {
this.handleScon(type)
}
},
handleScon(type) {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: [type],
success: (res) => {
uploadImage(res.tempFilePaths[0]).then((res) => {
console.log(res)
let result = JSON.parse(res[1].data)
apiUpdateUser({
headSculpture: result.data.minFileUrl,
}).then((res) => {
console.log(res)
this.userInfo.headSculpture = result.data.minFileUrl
this.userInfo.avatar = this.$config.static + result.data.minFileUrl
uni.setStorageSync(this.$cacheKey.userInfo, this.userInfo)
this.$forceUpdate()
})
})
},
})
},
dialogClose() {},
},
onLoad(options) {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
}
</script>
<style lang="scss">
.head {
.head-img {
height: 750rpx;
width: 750rpx;
}
.head-setup {
position: fixed;
bottom: 0;
left: 0;
width: 750rpx;
padding-bottom: 60rpx;
background-color: #fff;
.head-setup-item {
height: 100rpx;
line-height: 100rpx;
text-align: center;
border-top: 1rpx solid #e8e8e8;
}
}
}
</style>