148 lines
4.9 KiB
Vue
148 lines
4.9 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
|
||
style="width: 90%; margin: 5%"
|
||
cancelText="禁止"
|
||
confirmText="允许"
|
||
title="权限说明"
|
||
content='是否允许"灿能物联"使用相机?'
|
||
@confirm="handleScon('camera')"
|
||
@close="dialogClose"
|
||
></uni-popup-dialog>
|
||
</uni-popup>
|
||
<uni-popup ref="message" type="message">
|
||
<uni-popup-message type="info" :duration="0" style="width: 90%; margin: 5%">
|
||
<view style="color: #909399; font-style: 16px">相机权限使用说明:</view>
|
||
<view style="color: #6c6c6c; margin-top: 3rpx"> 用于拍照上传头像!</view>
|
||
</uni-popup-message>
|
||
</uni-popup>
|
||
<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>
|
||
<yk-authpup
|
||
ref="authpup1"
|
||
type="top"
|
||
@changeAuth="changeAuth"
|
||
permissionID="WRITE_EXTERNAL_STORAGE"
|
||
></yk-authpup>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import { uploadImage, getImageUrl } from '@/common/api/basic'
|
||
import { apiUpdateUser } from '@/common/api/user'
|
||
import ykAuthpup from '@/components/yk-authpup/yk-authpup'
|
||
export default {
|
||
components: {
|
||
ykAuthpup,
|
||
},
|
||
data() {
|
||
return {
|
||
loading: false,
|
||
userInfo: {},
|
||
type: '',
|
||
}
|
||
},
|
||
methods: {
|
||
take(type) {
|
||
this.type = type
|
||
if (type == 'camera') {
|
||
if (plus.os.name == 'Android') {
|
||
this.$refs['authpup'].open()
|
||
//未授权
|
||
// this.$refs.message.open()
|
||
// this.$refs.alertDialog.open('bottom')
|
||
} else {
|
||
this.handleScon(type)
|
||
}
|
||
} else {
|
||
if (plus.os.name == 'Android') {
|
||
this.$refs['authpup1'].open()
|
||
//未授权
|
||
// this.$refs.message.open()
|
||
// this.$refs.alertDialog.open('bottom')
|
||
} else {
|
||
this.handleScon(type)
|
||
}
|
||
// this.handleScon(type)、
|
||
}
|
||
},
|
||
changeAuth() {
|
||
//这里是权限通过后执行自己的代码逻辑
|
||
console.log('权限已授权，可执行自己的代码逻辑了')
|
||
// this.handleScon()
|
||
this.handleScon(this.type)
|
||
},
|
||
handleScon(type) {
|
||
this.$refs.message.close()
|
||
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() {
|
||
this.$refs.message.close()
|
||
},
|
||
},
|
||
|
||
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;
|
||
}
|
||
}
|
||
}
|
||
/deep/ .uni-popup-message__box {
|
||
border-radius: 10rpx !important;
|
||
background-color: #fff;
|
||
}
|
||
</style>
|