修改 华为商城反馈相机 问题

This commit is contained in:
GGJ
2024-09-06 14:35:06 +08:00
parent a631f060d2
commit a8618d0b5d
10 changed files with 2110 additions and 1617 deletions

View File

@@ -0,0 +1,328 @@
<template>
<view v-if="showPopup" class="uni-popup" :style="{top:isNativeHead?'':StatusBar}">
<view :class="[type, ani, animation ? 'ani' : '']" class="uni-custom uni-popup__wrapper" @click="close(true)">
<view class="uni-popup__wrapper-box">
<view class="title">{{authList[permissionID].title}}</view>
<view class="content">{{authList[permissionID].content}}</view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'YkAuthpup',
props: {
// 开启动画
animation: {
type: Boolean,
default: true
},
type: {
type: String,
default: 'top'
},
show: {
type: Boolean,
default: true
},
//是否是原生头部
isNativeHead:{
type: Boolean,
default: true
},
permissionID: {
type: [String, Number],
default: ''
}
},
data() {
return {
ani: '',
showPopup: false,
StatusBar:'',
refuseNum:'',//拒绝次数,
authList: {
'WRITE_EXTERNAL_STORAGE': {
title: "灿能物联存储空间/照片权限申请说明",
content: "便于您使用该功能上传您的照片/视频及用于更换头像、扫描二维码等场景中使用。"
},
'ACCESS_FINE_LOCATION': {
title: "XXX对地理位置权限申请说明",
content: "便于应用程序可以提供基于位置的服务、定位导航、附近搜索等功能。"
},
'CAMERA':{
title: "灿能物联对相机/摄像头权限申请说明",
content: "便于您使用该功能拍照上传您的照片/视频及用于更换头像、扫描二维码等场景中使用。"
},
'RECORD_AUDIO':{
title: "XXX对麦克风权限申请说明",
content: "便于您使用该功能进行录音、语音通话、发布语音、与客服语音沟通等场景中使用"
},
'CALL_PHONE': {
title: "XXX对拨打/管理电话权限申请说明",
content: "便于您使用该功能联系买家、骑手或者客服、业务经理与联系等场景下使用"
}
}
}
},
created() {
// #ifdef APP-PLUS
this.getSystemInfo();
// #endif
},
methods: {
//获取状态栏高度
getSystemInfo() {
let _this = this;
uni.getSystemInfo({
success: function(e) {
_this.StatusBar = e.statusBarHeight + 'px'; //用于自定义头部时,给手机状态栏留出位置,可通过isNativeHead这个参数控制
}
})
},
open() {
this.requestPermissions(this.permissionID);
},
close(type) {
this.ani = '';
this.$nextTick(() => {
setTimeout(() => {
this.showPopup = false;
}, 300)
})
},
//权限检测
requestPermissions(permissionID) {
let _this = this;
// #ifdef APP-PLUS
//判断安卓与ios设备
if (plus.os.name == 'Android') {
let _permissionID = 'android.permission.' + permissionID;
plus.android.checkPermission(_permissionID,
granted => {
if (granted.checkResult == -1) {
//还未授权当前查询的权限,打开权限申请目的自定义弹框
_this.showPopup = true;
_this.$nextTick(() => {
setTimeout(() => {
_this.ani = 'uni-' + _this.type
},30)
})
}
},
error => {
console.log(error.message);
}
);
plus.android.requestPermissions([_permissionID],
(e) => {
//关闭权限申请目的自定义弹框
_this.ani = '';
_this.$nextTick(() => {
setTimeout(() => {
_this.showPopup = false
}, 0)
})
console.log(e,'kkkkk')
if (e.granted.length > 0) {
//当前查询权限已授权,此时可以通知页面执行接下来的操作
_this.$emit('changeAuth');
}
if (e.deniedAlways.length > 0) {
//当前查询权限已被永久禁用,此时需要引导用户跳转手机系统设置去开启
uni.showModal({
title: '温馨提示',
content: '还没有该权限,立即去设置开启?',
cancelText: "取消",
confirmText: "去设置",
showCancel: true,
confirmColor: '#000',
cancelColor: '#666',
success: (res) => {
if (res.confirm) {
_this.goSetting();
}
}
})
}
})
} else {
//IOS不需要添加自定义弹框来描述权限目的因为在配置文件的隐私信息访问的许可描述里可添加
//正常可以直接调用uni的API调起权限询问弹框使用各种权限下面的判断使用场景主要是在IOS禁用某权限后这个可以判断有无权限进而引导用户跳转设置开启仅列出了位置、相册、通讯录、相机、录音等权限其他IOS权限可具体参考 https://ext.dcloud.net.cn/plugin?id=15787
let result = 0;
if (permissionID == 'ACCESS_FINE_LOCATION') {
//IOS检测位置权限
let cLLocationManager = plus.ios.importClass("CLLocationManager"),
authStatus = cLLocationManager.authorizationStatus(),
enable = cLLocationManager.locationServicesEnabled();
if (enable && authStatus != 2) {
result = 1;
} else {
result = 0;
}
plus.ios.deleteObject(cLLocationManager);
} else if (permissionID == 'WRITE_EXTERNAL_STORAGE') {
//IOS检测相册权限
let PHPhotoLibrary = plus.ios.importClass("PHPhotoLibrary"),
authStatus = PHPhotoLibrary.authorizationStatus();
if (authStatus === 3) {
result = 1;
} else {
result = 0;
}
plus.ios.deleteObject(PHPhotoLibrary);
} else if (permissionID == 'CAMERA') {
//IOS检测相机/摄像头权限
let avCaptureDevice = plus.ios.importClass("AVCaptureDevice"),
authStatus = avCaptureDevice.authorizationStatusForMediaType("vide");
if (authStatus === 3) {
result = 1;
} else {
result = 0;
}
plus.ios.deleteObject(avCaptureDevice);
} else if (permissionID == 'CALL_PHONE') {
//IOS检测通讯录权限
let contactStore = plus.ios.importClass("CNContactStore"),
authStatus = contactStore.authorizationStatusForEntityType(0);
if (authStatus === 3) {
result = 1;
} else {
result = 0;
}
plus.ios.deleteObject(contactStore);
}else if(permissionID == 'RECORD_AUDIO'){
//IOS检测麦克风权限
let aVAudioSession = plus.ios.importClass("AVAudioSession"),
aVAudio = aVAudioSession.sharedInstance(),
authStatus = aVAudio.recordPermission();
if ([1684369017, 1970168948].includes(authStatus)) {
result = 0;
} else {
result = 1;
}
plus.ios.deleteObject(aVAudioSession);
}
if (result) {
//当前查询权限已授权,此时可以通知页面执行接下来的操作
that.$emit('changeAuth')
} else {
//当前查询的权限已禁用,引导用户跳转手机系统设置去开启
uni.showModal({
title: '温馨提示',
content: '还没有该权限,立即去设置开启?',
cancelText: "取消",
confirmText: "去设置",
showCancel: true,
confirmColor: '#000',
cancelColor: '#666',
success: (res) => {
if (res.confirm) {
_this.goSetting();
}
}
})
}
}
// #endif
},
//跳转手机系统设置
goSetting() {
if (plus.os.name == "iOS") {
var UIApplication = plus.ios.import("UIApplication");
var application2 = UIApplication.sharedApplication();
var NSURL2 = plus.ios.import("NSURL");
var setting2 = NSURL2.URLWithString("app-settings:");
application2.openURL(setting2);
plus.ios.deleteObject(setting2);
plus.ios.deleteObject(NSURL2);
plus.ios.deleteObject(application2);
} else {
var Intent = plus.android.importClass("android.content.Intent");
var Settings = plus.android.importClass("android.provider.Settings");
var Uri = plus.android.importClass("android.net.Uri");
var mainActivity = plus.android.runtimeMainActivity();
var intent = new Intent();
intent.setAction(Settings.ACTION_APPLICATION_DETAILS_SETTINGS);
var uri = Uri.fromParts("package", mainActivity.getPackageName(), null);
intent.setData(uri);
mainActivity.startActivity(intent);
}
}
}
}
</script>
<style lang="scss">
.uni-popup {
position: fixed;
top: 20px;
bottom: 0;
left: 0;
right: 0;
z-index: 99999;
overflow: hidden;
&__wrapper {
position: absolute;
z-index: 999;
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
&.ani {
/* #ifndef APP-NVUE */
transition: all 0.3s;
/* #endif */
}
&.top {
top: 0;
width:705rpx;
/* #ifdef APP-NVUE */
left:22.5rpx;
/* #endif */
/* #ifndef APP-NVUE */
left:0;
transform: translateY(-705rpx);
/* #endif */
}
&-box {
position: relative;
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
}
&.uni-custom {
& .uni-popup__wrapper-box {
width: 705rpx;
/* #ifndef APP-NVUE */
margin: 0 22.5rpx;
/* #endif */
padding: 30upx;
background: #fff;
border: solid 2rpx #ddd;
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
border-radius: 16rpx;
.title{
font-size: 32rpx;
font-weight: bold;
}
.content{
margin-top: 16rpx;
line-height: 1.6;
}
}
&.top{
& .uni-popup__wrapper-box {
width: 705rpx;
}
}
}
&.uni-top{
transform: translateY(0);
}
}
}
</style>

View File

@@ -2,8 +2,8 @@
"name" : "灿能物联",
"appid" : "__UNI__88BC25B",
"description" : "",
"versionName" : "1.5.9",
"versionCode" : 159,
"versionName" : "1.6.0",
"versionCode" : 160,
"transformPx" : false,
/* 5+App */
"app-plus" : {
@@ -143,8 +143,8 @@
"proxy" : {
"/api" : {
"https" : true,
"target" : "https://pqmcn.com:8092/api",
// "target" : "http://192.168.1.126:10215",
// "target" : "https://pqmcn.com:8092/api",
"target" : "http://192.168.1.126:10215",
"changOrigin" : true,
"pathRewrite" : {
"/api" : ""

View File

@@ -1,16 +1,20 @@
{
"dependencies": {
"crypto-js": "^4.1.1",
"html2canvas": "^1.4.1",
"image-tools": "^1.4.0",
"jsrsasign": "^10.8.6",
"mqtt": "3.0.0",
"pinyin-pro": "^3.13.2",
"qs": "^6.11.2",
"vconsole": "^3.15.1"
},
"devDependencies": {
"@types/html5plus": "^1.0.2",
"@types/uni-app": "^1.4.4"
"id": "yk-authpup",
"name": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"displayName": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"version": "1.0.5",
"description": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"keywords": [
"uniapp",
"华为上架",
"权限",
"权限申请",
"权限判断"
],
"dcloudext": {
"category": [
"前端组件",
"通用组件"
]
}
}

View File

@@ -18,7 +18,7 @@
</uni-forms>
</view>
<view class="btn-wrap">
<button class="btn-wrap-item" :loading="isLoading" :disabled='isLoading' @click="register">
<button class="btn-wrap-item" :loading="isLoading" :disabled="isLoading" @click="register">
{{ isLoading ? '注册中...' : '发起注册' }}
</button>
</view>
@@ -165,13 +165,17 @@
</scroll-view>
</uni-drawer>
</template>
<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>
</view>
</template>
<script>
import { registerDevice, getModel, addDevice, queryByTopoId } from '@/common/api/device.js'
import { getProjectList, queryTopologyDiagramPage } from '@/common/api/project.js'
import ykAuthpup from '@/components/yk-authpup/yk-authpup'
export default {
components: {
ykAuthpup,
},
data() {
return {
loading: false,
@@ -298,11 +302,20 @@ export default {
aliasChange(e) {
this.$forceUpdate()
},
positionChange(e) {
console.log(e)
},
projectChange(e) {},
scanCode() {
if (plus.os.name == 'Android') {
this.$refs['authpup'].open()
} else {
this.changeAuth()
}
},
changeAuth() {
uni.scanCode({
success: (res) => {
console.log('条码类型:' + res.scanType)
@@ -321,8 +334,10 @@ export default {
return this.$util.toast('请输入设备识别码')
}
this.isLoading = true
registerDevice(this.formData.nDid, Number(this.options.type)).then((res) => {
getModel(this.formData.nDid).then((res) => {
registerDevice(this.formData.nDid, Number(this.options.type))
.then((res) => {
getModel(this.formData.nDid)
.then((res) => {
console.log(res)
this.pointList = res.data.map((item) => {
return {
@@ -334,14 +349,12 @@ export default {
this.type = 2
this.isLoading = false
}).catch(()=>{
})
.catch(() => {
this.isLoading = false
})
}).catch(()=>{
})
.catch(() => {
this.isLoading = false
})
},

View File

@@ -14,7 +14,9 @@
<uni-easyinput type="textarea" v-model="formData.description" placeholder="请输入详细描述"/>
</uni-forms-item>
<uni-forms-item label="图片">
<uni-file-picker :auto-upload="false" @select="fileChange" @delete="delImg"/>
<uni-file-picker :auto-upload="false" @select="fileChange" @delete="delImg">
</uni-file-picker>
</uni-forms-item>
</uni-forms>
</view>
@@ -54,6 +56,9 @@ export default {
console.log(e);
this.formData.files = this.formData.files.filter(item => item.url !== e.tempFilePath)
},
pickerClick(){
console.log(123);
},
fileChange(e) {
console.log(e);
e.tempFilePaths.forEach(item => {

View File

@@ -120,14 +120,19 @@
<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>
</view>
</template>
<script>
import { roleUpdate, autoLogin } from '@/common/api/user'
import { transferDevice, shareDevice } from '@/common/api/device'
import ykAuthpup from "@/components/yk-authpup/yk-authpup";
export default {
components: {
ykAuthpup
},
data() {
return {
loading: true,
@@ -183,17 +188,24 @@ export default {
})
})
},
changeAuth(){
//这里是权限通过后执行自己的代码逻辑
console.log('权限已授权,可执行自己的代码逻辑了');
// this.handleScon()
this.handleScon()
},
jump(type) {
switch (type) {
case 'scan':
if (
plus.os.name == 'Android' &&
plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
plus.os.name == 'Android'
// && plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
) {
//未授权
// this.$refs.alertDialog.open('bottom')
this.$refs['authpup'].open()
// this.$refs.message.open()
this.$refs.message.open()
this.$refs.alertDialog.open('bottom')
} else {
console.log(2)
this.handleScon()

View File

@@ -4,7 +4,7 @@
<view class="about">
<image src="/static/logo.png" class="logo"></image>
<view class="name">灿能物联</view>
<view class="version">Version 1.1.1</view>
<view class="version">Version 1.6.0</view>
</view>
</view>
</Cn-page>

View File

@@ -27,37 +27,62 @@
<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>
<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' &&
plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
) {
if (plus.os.name == 'Android') {
this.$refs['authpup'].open()
//未授权
this.$refs.message.open()
this.$refs.alertDialog.open('bottom')
// 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()
@@ -66,7 +91,6 @@ export default {
sizeType: ['original', 'compressed'],
sourceType: [type],
success: (res) => {
uploadImage(res.tempFilePaths[0]).then((res) => {
console.log(res)
let result = JSON.parse(res[1].data)
@@ -83,7 +107,9 @@ export default {
},
})
},
dialogClose() {this.$refs.message.close()},
dialogClose() {
this.$refs.message.close()
},
},
onLoad(options) {

View File

@@ -4,9 +4,18 @@
<text class="file-title">{{ title }}</text>
<!-- <text class="file-count">{{ filesList.length }}/{{ limitLength }}</text> -->
</view>
<upload-image v-if="fileMediatype === 'image' && showType === 'grid'" :readonly="readonly"
:image-styles="imageStyles" :files-list="filesList" :limit="limitLength" :disablePreview="disablePreview"
:delIcon="delIcon" @uploadFiles="uploadFiles" @choose="choose" @delFile="delFile">
<upload-image
v-if="fileMediatype === 'image' && showType === 'grid'"
:readonly="readonly"
:image-styles="imageStyles"
:files-list="filesList"
:limit="limitLength"
:disablePreview="disablePreview"
:delIcon="delIcon"
@uploadFiles="uploadFiles"
@choose="choose"
@delFile="delFile"
>
<slot>
<view class="is-add">
<view class="icon-add"></view>
@@ -14,26 +23,26 @@
</view>
</slot>
</upload-image>
<upload-file v-if="fileMediatype !== 'image' || showType !== 'grid'" :readonly="readonly"
:list-styles="listStyles" :files-list="filesList" :showType="showType" :delIcon="delIcon"
@uploadFiles="uploadFiles" @choose="choose" @delFile="delFile">
<upload-file
v-if="fileMediatype !== 'image' || showType !== 'grid'"
:readonly="readonly"
:list-styles="listStyles"
:files-list="filesList"
:showType="showType"
:delIcon="delIcon"
@uploadFiles="uploadFiles"
@choose="choose"
@delFile="delFile"
>
<slot><button type="primary" size="mini">选择文件</button></slot>
</upload-file>
</view>
</template>
<script>
import {
chooseAndUploadFile,
uploadCloudFiles
} from './choose-and-upload-file.js'
import {
get_file_ext,
get_extname,
get_files_and_is_max,
get_file_info,
get_file_data
} from './utils.js'
import { chooseAndUploadFile, uploadCloudFiles } from './choose-and-upload-file.js'
import { get_file_ext, get_extname, get_files_and_is_max, get_file_info, get_file_data } from './utils.js'
import uploadImage from './upload-image.vue'
import uploadFile from './upload-file.vue'
let fileInput = null
@@ -82,10 +91,10 @@
name: 'uniFilePicker',
components: {
uploadImage,
uploadFile
uploadFile,
},
options: {
virtualHost: true
virtualHost: true,
},
emits: ['select', 'success', 'fail', 'progress', 'delete', 'update:modelValue', 'input'],
props: {
@@ -94,7 +103,7 @@
type: [Array, Object],
default() {
return []
}
},
},
// #endif
@@ -103,55 +112,55 @@
type: [Array, Object],
default() {
return []
}
},
},
// #endif
beforeRemove: {
type: Function,
default: () => {}
default: () => {},
},
disabled: {
type: Boolean,
default: false
default: false,
},
disablePreview: {
type: Boolean,
default: false
default: false,
},
delIcon: {
type: Boolean,
default: true
default: true,
},
// 自动上传
autoUpload: {
type: Boolean,
default: true
default: true,
},
// 最大选择个数 h5只能限制单选或是多选
limit: {
type: [Number, String],
default: 9
default: 9,
},
// 列表样式 grid | list | list-card
mode: {
type: String,
default: 'grid'
default: 'grid',
},
// 选择文件类型 image/video/all
fileMediatype: {
type: String,
default: 'image'
default: 'image',
},
// 文件类型筛选
fileExtname: {
type: [Array, String],
default() {
return []
}
},
},
title: {
type: String,
default: ''
default: '',
},
listStyles: {
type: Object,
@@ -162,38 +171,44 @@
// 是否显示分隔线
dividline: true,
// 线条样式
borderStyle: {}
}
borderStyle: {},
}
},
},
imageStyles: {
type: Object,
default() {
return {
width: 'auto',
height: 'auto'
}
height: 'auto',
}
},
},
readonly: {
type: Boolean,
default: false
default: false,
},
returnType: {
type: String,
default: 'array'
default: 'array',
},
sizeType: {
type: Array,
default() {
return ['original', 'compressed']
}
}
},
},
sourceType: {
type: Array,
default() {
return ['camera', 'album']
},
},
},
data() {
return {
files: [],
localValue: []
localValue: [],
}
},
watch: {
@@ -202,7 +217,7 @@
handler(newVal, oldVal) {
this.setValue(newVal, oldVal)
},
immediate: true
immediate: true,
},
// #endif
// #ifdef VUE3
@@ -210,14 +225,14 @@
handler(newVal, oldVal) {
this.setValue(newVal, oldVal)
},
immediate: true
immediate: true,
},
// #endif
},
computed: {
filesList() {
let files = []
this.files.forEach(v => {
this.files.forEach((v) => {
files.push(v)
})
return files
@@ -239,7 +254,7 @@
return 9
}
return this.limit
}
},
},
created() {
// TODO 兼容不开通服务空间的情况
@@ -320,50 +335,56 @@
this.is_reset = false
this.formItem.setValue(this.localValue)
}
let filesData = Object.keys(newVal).length > 0 ? newVal : [];
let filesData = Object.keys(newVal).length > 0 ? newVal : []
this.files = [].concat(filesData)
},
/**
* 选择文件
*/
choose() {
choose(type) {
if (this.disabled) return
if (this.files.length >= Number(this.limitLength) && this.showType !== 'grid' && this.returnType ===
'array') {
if (
this.files.length >= Number(this.limitLength) &&
this.showType !== 'grid' &&
this.returnType === 'array'
) {
uni.showToast({
title: `您最多选择 ${this.limitLength} 个文件`,
icon: 'none'
icon: 'none',
})
return
}
this.chooseFiles()
this.chooseFiles(type)
},
/**
* 选择文件并上传
*/
chooseFiles() {
chooseFiles(type) {
const _extname = get_extname(this.fileExtname)
// 获取后缀
uniCloud
.chooseAndUploadFile({
type: this.fileMediatype,
compressed: false,
sourceType: [type],//type? :this.sourceType ,
sizeType: this.sizeType,
// TODO 如果为空video 有问题
extension: _extname.length > 0 ? _extname : undefined,
count: this.limitLength - this.files.length, //默认9
onChooseFile: this.chooseFileCallback,
onUploadProgress: progressEvent => {
onUploadProgress: (progressEvent) => {
this.setProgress(progressEvent, progressEvent.index)
}
},
})
.then(result => {
.then((result) => {
console.log('选择失败', result)
this.setSuccessAndError(result.tempFiles)
})
.catch(err => {
.catch((err) => {
console.log('选择失败', err)
})
},
@@ -374,19 +395,15 @@
*/
async chooseFileCallback(res) {
const _extname = get_extname(this.fileExtname)
const is_one = (Number(this.limitLength) === 1 &&
this.disablePreview &&
!this.disabled) ||
const is_one =
(Number(this.limitLength) === 1 && this.disablePreview && !this.disabled) ||
this.returnType === 'object'
// 如果这有一个文件 ,需要清空本地缓存数据
if (is_one) {
this.files = []
}
let {
filePaths,
files
} = get_files_and_is_max(res, _extname)
let { filePaths, files } = get_files_and_is_max(res, _extname)
if (!(_extname && _extname.length > 0)) {
filePaths = res.tempFilePaths
files = res.tempFiles
@@ -402,12 +419,12 @@
this.files.push(filedata)
currentData.push({
...filedata,
file: files[i]
file: files[i],
})
}
this.$emit('select', {
tempFiles: currentData,
tempFilePaths: filePaths
tempFilePaths: filePaths,
})
res.tempFiles = files
// 停止自动上传
@@ -422,14 +439,15 @@
*/
uploadFiles(files) {
files = [].concat(files)
return uploadCloudFiles.call(this, files, 5, res => {
return uploadCloudFiles
.call(this, files, 5, (res) => {
this.setProgress(res, res.index, true)
})
.then(result => {
.then((result) => {
this.setSuccessAndError(result)
return result;
return result
})
.catch(err => {
.catch((err) => {
console.log(err)
})
},
@@ -444,7 +462,7 @@
let errorTempFilePath = []
for (let i = 0; i < res.length; i++) {
const item = res[i]
const index = item.uuid ? this.files.findIndex(p => p.uuid === item.uuid) : item.index
const index = item.uuid ? this.files.findIndex((p) => p.uuid === item.uuid) : item.index
if (index === -1 || !this.files) break
if (item.errMsg === 'request:fail') {
@@ -476,14 +494,14 @@
// 状态改变返回
this.$emit('success', {
tempFiles: this.backObject(successData),
tempFilePaths: tempFilePath
tempFilePaths: tempFilePath,
})
}
if (errorData.length > 0) {
this.$emit('fail', {
tempFiles: this.backObject(errorData),
tempFilePaths: errorTempFilePath
tempFilePaths: errorTempFilePath,
})
}
},
@@ -500,7 +518,7 @@
const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total)
let idx = index
if (!type) {
idx = this.files.findIndex(p => p.uuid === progressEvent.tempFile.uuid)
idx = this.files.findIndex((p) => p.uuid === progressEvent.tempFile.uuid)
}
if (idx === -1 || !this.files[idx]) return
// fix by mehaotian 100 就会消失,-1 是为了让进度条消失
@@ -509,7 +527,7 @@
this.$emit('progress', {
index: idx,
progress: parseInt(percentCompleted),
tempFile: this.files[idx]
tempFile: this.files[idx],
})
},
@@ -520,12 +538,12 @@
async delFile(index) {
let res = await this.beforeRemove({
tempFile: this.files[index],
tempFilePath: this.files[index].url
tempFilePath: this.files[index].url,
})
if (res === false) return
this.$emit('delete', {
tempFile: this.files[index],
tempFilePath: this.files[index].url
tempFilePath: this.files[index].url,
})
this.files.splice(index, 1)
this.$nextTick(() => {
@@ -542,7 +560,7 @@
const len = name.length
return {
name: name.substring(0, last_len),
ext: name.substring(last_len + 1, len)
ext: name.substring(last_len + 1, len),
}
},
@@ -575,7 +593,7 @@
*/
backObject(files) {
let newFilesData = []
files.forEach(v => {
files.forEach((v) => {
newFilesData.push({
...v,
extname: v.extname,
@@ -585,14 +603,14 @@
path: v.path,
size: v.size,
fileID: v.fileID,
url: v.url
url: v.url,
})
})
return newFilesData
},
async getTempFileURL(fileList) {
fileList = {
fileList: [].concat(fileList)
fileList: [].concat(fileList),
}
const urls = await uniCloud.getTempFileURL(fileList)
return urls.fileList[0].tempFileURL || ''
@@ -601,16 +619,16 @@
* 获取父元素实例
*/
getForm(name = 'uniForms') {
let parent = this.$parent;
let parentName = parent.$options.name;
let parent = this.$parent
let parentName = parent.$options.name
while (parentName !== name) {
parent = parent.$parent;
if (!parent) return false;
parentName = parent.$options.name;
}
return parent;
}
parent = parent.$parent
if (!parent) return false
parentName = parent.$options.name
}
return parent
},
},
}
</script>

View File

@@ -2,14 +2,26 @@
<view class="uni-file-picker__container">
<view class="file-picker__box" v-for="(item, index) in filesList" :key="index" :style="boxStyle">
<view class="file-picker__box-content" :style="borderStyle">
<image class="file-image" :src="item.url" mode="aspectFill" @click.stop="prviewImage(item,index)"></image>
<image
class="file-image"
:src="item.url"
mode="aspectFill"
@click.stop="prviewImage(item, index)"
></image>
<view v-if="delIcon && !readonly" class="icon-del-box" @click.stop="delFile(index)">
<view class="icon-del"></view>
<view class="icon-del rotate"></view>
</view>
<view v-if="(item.progress && item.progress !== 100) ||item.progress===0 " class="file-picker__progress">
<progress class="file-picker__progress-item" :percent="item.progress === -1?0:item.progress" stroke-width="4"
:backgroundColor="item.errMsg?'#ff5a5f':'#EBEBEB'" />
<view
v-if="(item.progress && item.progress !== 100) || item.progress === 0"
class="file-picker__progress"
>
<progress
class="file-picker__progress-item"
:percent="item.progress === -1 ? 0 : item.progress"
stroke-width="4"
:backgroundColor="item.errMsg ? '#ff5a5f' : '#EBEBEB'"
/>
</view>
<view v-if="item.errMsg" class="file-picker__mask" @click.stop="uploadFiles(item, index)">
点击重试
@@ -24,31 +36,50 @@
</slot>
</view>
</view>
<view class="head-setup" v-if="headShow" @click="headShow = false">
<view class="head-setup-box">
<view class="head-setup-item" @click="take('camera')">拍摄</view>
<view class="head-setup-item" @click="take('album')">从相册选择</view>
<view class="head-setup-item" style="margin-top: 25rpx">取消</view>
</view>
</view>
<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 ykAuthpup from '@/components/yk-authpup/yk-authpup'
export default {
name: "uploadImage",
components: {
ykAuthpup,
},
name: 'uploadImage',
emits: ['uploadFiles', 'choose', 'delFile'],
props: {
filesList: {
type: Array,
default() {
return []
}
},
},
disabled: {
type: Boolean,
default: false
default: false,
},
disablePreview: {
type: Boolean,
default: false
default: false,
},
limit: {
type: [Number, String],
default: 9
default: 9,
},
imageStyles: {
type: Object,
@@ -56,33 +87,30 @@
return {
width: 'auto',
height: 'auto',
border: {}
}
border: {},
}
},
},
delIcon: {
type: Boolean,
default: true
default: true,
},
readonly: {
type: Boolean,
default:false
}
default: false,
},
},
computed: {
styles() {
let styles = {
width: 'auto',
height: 'auto',
border: {}
border: {},
}
return Object.assign(styles, this.imageStyles)
},
boxStyle() {
const {
width = 'auto',
height = 'auto'
} = this.styles
const { width = 'auto', height = 'auto' } = this.styles
let obj = {}
if (height === 'auto') {
if (width !== 'auto') {
@@ -113,9 +141,7 @@
return classles
},
borderStyle() {
let {
border
} = this.styles
let { border } = this.styles
let obj = {}
const widthDefaultValue = 1
const radiusDefaultValue = 3
@@ -130,7 +156,7 @@
'border-width': width,
'border-style': (border && border.style) || 'solid',
'border-color': (border && border.color) || '#eee',
'border-radius': radius
'border-radius': radius,
}
}
let classles = ''
@@ -138,14 +164,50 @@
classles += `${i}:${obj[i]};`
}
return classles
},
},
data() {
return {
headShow: false,
type:''
}
},
methods: {
uploadFiles(item, index) {
this.$emit("uploadFiles", item)
this.$emit('uploadFiles', item)
},
choose() {
this.$emit("choose")
this.headShow = true
// this.$emit('choose')
},
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.$emit('choose',type)
}
} else {
if (plus.os.name == 'Android') {
this.$refs['authpup1'].open()
//未授权
// this.$refs.message.open()
// this.$refs.alertDialog.open('bottom')
} else {
this.$emit('choose',type)
}
// this.handleScon(type)、
}
},
changeAuth() {
//这里是权限通过后执行自己的代码逻辑
console.log('权限已授权,可执行自己的代码逻辑了')
// this.handleScon()
this.$emit('choose',this.type)
},
delFile(index) {
this.$emit('delFile', index)
@@ -153,17 +215,17 @@
prviewImage(img, index) {
let urls = []
if (Number(this.limit) === 1 && this.disablePreview && !this.disabled) {
this.$emit("choose")
this.$emit('choose')
}
if (this.disablePreview) return
this.filesList.forEach(i => {
this.filesList.forEach((i) => {
urls.push(i.url)
})
uni.previewImage({
urls: urls,
current: index
});
current: index,
})
},
value2px(value) {
if (typeof value === 'number') {
@@ -174,8 +236,8 @@
}
}
return value
}
}
},
},
}
</script>
@@ -289,4 +351,29 @@
background-color: #fff;
border-radius: 2px;
}
.head-setup {
background-color: #fff;
position: fixed;
bottom: 0;
left: 0;
z-index: 10;
width: 750rpx;
height: 100vh;
padding-bottom: 60rpx;
background-color: rgba(0, 0, 0, 0.4);
.head-setup-box {
position: fixed;
bottom: 15rpx;
left: 0;
.head-setup-item {
z-index: 12;
height: 100rpx;
width: 750rpx;
background-color: #fff;
line-height: 100rpx;
text-align: center;
border-top: 1rpx solid #e8e8e8;
}
}
}
</style>