lcoco/components/en-utils/en-head-img.vue

<template>
	<view>
		<view class="box" @click="isShowPop()">
			<image class="left" :src="value" mode="aspectFill"></image>
			<view class="right">
				<text>{{label}}</text>
				<image src="@/static/img/toRight.png" mode=""></image>
			</view>
		</view>
		<uni-popup ref="popup" type="bottom"  background-color="#fff">
			<view class="pop-box" @click="this.editImg(2)">使用相机拍一张</view>
			<view class="pop-box" @click="this.editImg(1)">从相册选择一张</view>
		</uni-popup>
	</view>
</template>

<script>
	import { upLoadingFileOss } from "@/common/js/upLoadingFile";
	import tools from '@/common/js/tools.js'
	
	export default {
		props:{
			label: {
			  type: String,
			  default: '标题'
			},
			value:{
				type: String,
				default: ''
			},
		},
		data(){
			return{}
		},
		methods:{
			isShowPop(){
				let isH5=false
				// #ifdef H5
				isH5=true
				// #endif

				if(isH5){
					this.editImg(1)
				}else{
					this.$refs.popup.open('bottom')
				}
			},
			editImg(type){
				uni.chooseImage({
					count: 1,
					sizeType: ["compressed", "camera"],
					sourceType: [type===1?"album":"camera"],
					success:(res)=>{
						if (res.errMsg == "chooseImage:ok"){
							tools.showLoading()
							this.upLoadOss(res.tempFiles[0].path)
						}else{
							tools.error('头像选择失败')
						}
					}
				})
			},
			
			upLoadOss(path){
				 upLoadingFileOss(path).then((res)=>{
					 if(res){
						 this.value = res
					 }else{
						 tools.error('头像上传失败')
					 }
					 tools.hideLoading()
				 }).catch(()=>{
					 tools.hideLoading()
				 })
				 this.$refs.popup.close()
			},
		},
	}
</script> 

<style scoped lang="scss">
	.box{
		width: 100%;
		height: 152rpx;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: space-between;
		image{
			width: 96rpx;
			height: 96rpx;
			border-radius: 50%;
		}
		.left{
			font-size: 32rpx;
		}
		.right{
			display: flex;
			align-items: center;
			text{
				font-size: 32rpx;
				color: #333;
			}
			image{
				width: 40rpx;
				height: 40rpx;
			}
		}
	}
	.pop-box{
		height: 130rpx;
		background-color: #fff;
		text-align: center;
		line-height: 130rpx;
		font-size: 30rpx;
	}
</style>