Commit 7c9cc916 authored by Damon's avatar Damon

图片队列使用临时路径

parent cfe977aa
......@@ -15,7 +15,7 @@
}
if (ENV_VAR) {
process.uniEnv = {};
process.uniEnv['node_env'] = NODE_ENV;
process.uniEnv['node_env'] = NODE_ENV;
for (let key in ENV_VAR) {
process.uniEnv[key] = ENV_VAR[key];
}
......
......@@ -77,7 +77,7 @@ export default {
// 系统自动登录::每次运行小程序重新获取用户信息
await this.autoLogin();
this.deleteTempImg()
//this.deleteTempImg()
},
onShow: async function () {
// 应用启动,或从后台进入前台显示
......
This diff is collapsed.
......@@ -87,7 +87,6 @@
if(photo.tempPath.mixWater){
// 保存水印处理图片到本地
path = photo.tempPath.mixWater
console.log("path", path)
let result1 = await this.saveLocal(path)
if(result1){
uni.showToast({
......
import uploader from '@/plugins/uploader/index.js'
const globalUrl = process.uniEnv || {}
const randomChar = function(l, url = "") {
const x = "0123456789qwertyuioplkjhgfdsazxcvbnm";
let tmp = "";
let time = new Date();
for (let i = 0; i < l; i++) {
tmp += x.charAt(Math.ceil(Math.random() * 100000000) % x.length);
}
return (
"file/" +
url +
time.getTime() +
tmp
);
}
export default {
name: 'upload',
components: {},
data() {
return {
imgList:[],
// 上传文件种类:0--头像、1--证件、2--身份证
categories: ['avatar', 'cert', 'id'],
};
},
created() {
// this.initQiniu()
},
methods: {
async uploadPath(type){
// 可以直接上传path
const self = this
let imgList = []
let options = {
files:[] // 文件路径
}
if(type==='qiniu'){
let res = await uploader.qnFileUpload(options)
return
}
let res = await uploader.urlFileUpload(options)
},
/**
* 存储图片到任务队列
* @param {Array} files 图片路径
*/
async saveToTask(files) {
// 生成key返回,然后把key放到异步上传的任务队列
let lists = []
for (let i = 0; i < files.length; i++) {
const path = files[i]
const row = await this.saveFiles(path)
lists.push(row)
}
const data = this.uploadTask
const saveLists = data.concat(lists)
this.$u.vuex('uploadTask', saveLists)
return lists
},
/**
* 选择图片
* @param {Object} data option
*/
async chooseImg(data){
const self = this
return new Promise((resolve, reject) => {
uni.chooseImage({
count: data.count || 9, //默认9
sizeType: data.sizeType || ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: data.sourceType || ['album', 'camera'], //从相册选择
success: function(res) {
const lists = self.saveToTask(res.tempFilePaths)
resolve(lists)
},
fail: err => {
console.log("err", err)
}
})
})
},
// 保存图片到本地
saveFiles(path) {
return new Promise((resolve, reject) => {
uni.saveFile({
tempFilePath: path,
success(e) {
const { savedFilePath } = e
const img = {
key: randomChar(10),
path: savedFilePath,
src: ''
}
resolve(img)
},
fail: reject
})
})
},
/**
* 上传图片公用组件
* @param {Object} type 文件上传方式
* @param {Object} attr 文件属性:图片种类[category](身份证、证件、头像);
* 图片上传其他配置[options】(如,选择图片或拍摄options.consourceType,['album', 'camera'];)其他
*/
async chooseImage(type, attr={}){
const self = this
let imgList = []
if(type==='qiniu'){
// 图片种类
let category = attr && attr.category || self.categories[0]
let config = attr && attr.options || {} // 图片上传参数配置
// 七牛上传
let options = {
onProgressUpdate(res){
let item = {
path:res.path, // 图片临时缓存路径
key:'', // 图片上传成功后相对路径
src:'', // 访问图片的绝对路径
progress:res.progress // 图片上传进度
}
if(res.fileIndex<imgList.length){
imgList[res.fileIndex].progress = res.progress
}else{
imgList.push(item)
}
imgList[res.fileIndex]
self.imgList = imgList
// 多文件上传每个文件进度条
},
onEachUpdate(res){
// 多文件上传每个文件上传成功触发
if(imgList.length>res.fileIndex){
imgList[res.fileIndex].key = res.url
imgList[res.fileIndex].src = uploader.qiniuTokenObj.visitPrefix + res.url
}
self.imgList = imgList
},
cardType: category,
...config
}
// 不需要进度条等可直接获取
let res = await uploader.qnImgUpload(options)
// let imgList = res.map(item=>{
// return {
// key:item,
// src:uploader.qiniuTokenObj.visitPrefix + item
// }
// })
// this.imgList = imgList
return
}
// 本地服务上传
let res = await uploader.urlUpload()
this.imgList = res
},
perviewImg(index) {
let urls = []
this.imgList.map(item => {
urls.push(item.src)
})
uni.previewImage({
current: index,
urls: urls
});
},
removeImg(index) {
this.imgList.splice(index, 1)
// this.$emit('image-change', this.imgList) //将图片回传父页面
},
}
}
import uploader from '@/plugins/uploader/index.js'
const globalUrl = process.uniEnv || {}
const randomChar = function(l, url = "") {
const x = "0123456789qwertyuioplkjhgfdsazxcvbnm";
let tmp = "";
let time = new Date();
for (let i = 0; i < l; i++) {
tmp += x.charAt(Math.ceil(Math.random() * 100000000) % x.length);
}
return (
"file/" +
url +
time.getTime() +
tmp
);
}
export default {
name: 'upload',
components: {},
data() {
return {
imgList:[],
// 上传文件种类:0--头像、1--证件、2--身份证
categories: ['avatar', 'cert', 'id'],
};
},
created() {
// this.initQiniu()
},
methods: {
async uploadPath(type){
// 可以直接上传path
const self = this
let imgList = []
let options = {
files:[] // 文件路径
}
if(type==='qiniu'){
let res = await uploader.qnFileUpload(options)
return
}
let res = await uploader.urlFileUpload(options)
},
/**
* 存储图片到任务队列
* @param {Array} files 图片路径
*/
async saveToTask(files) {
// 生成key返回,然后把key放到异步上传的任务队列
let lists = files.map(v => {
return {
key: randomChar(10),
path: v,
src: ''
}
})
// for (let i = 0; i < files.length; i++) {
// const path = files[i]
// const row = await this.saveFiles(path)
// lists.push(row)
// }
const data = this.uploadTask
const saveLists = data.concat(lists)
this.$u.vuex('uploadTask', saveLists)
return lists
},
/**
* 选择图片
* @param {Object} data option
*/
async chooseImg(data){
const self = this
return new Promise((resolve, reject) => {
uni.chooseImage({
count: data.count || 9, //默认9
sizeType: data.sizeType || ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: data.sourceType || ['album', 'camera'], //从相册选择
success: function(res) {
const lists = self.saveToTask(res.tempFilePaths)
resolve(lists)
},
fail: err => {
console.log("err", err)
}
})
})
},
// 保存图片到本地
saveFiles(path) {
return new Promise((resolve, reject) => {
uni.saveFile({
tempFilePath: path,
success(e) {
const { savedFilePath } = e
const img = {
key: randomChar(10),
path: savedFilePath,
src: ''
}
resolve(img)
},
fail: reject
})
})
},
/**
* 上传图片公用组件
* @param {Object} type 文件上传方式
* @param {Object} attr 文件属性:图片种类[category](身份证、证件、头像);
* 图片上传其他配置[options】(如,选择图片或拍摄options.consourceType,['album', 'camera'];)其他
*/
async chooseImage(type, attr={}){
const self = this
let imgList = []
if(type==='qiniu'){
// 图片种类
let category = attr && attr.category || self.categories[0]
let config = attr && attr.options || {} // 图片上传参数配置
// 七牛上传
let options = {
onProgressUpdate(res){
let item = {
path:res.path, // 图片临时缓存路径
key:'', // 图片上传成功后相对路径
src:'', // 访问图片的绝对路径
progress:res.progress // 图片上传进度
}
if(res.fileIndex<imgList.length){
imgList[res.fileIndex].progress = res.progress
}else{
imgList.push(item)
}
imgList[res.fileIndex]
self.imgList = imgList
// 多文件上传每个文件进度条
},
onEachUpdate(res){
// 多文件上传每个文件上传成功触发
if(imgList.length>res.fileIndex){
imgList[res.fileIndex].key = res.url
imgList[res.fileIndex].src = uploader.qiniuTokenObj.visitPrefix + res.url
}
self.imgList = imgList
},
cardType: category,
...config
}
// 不需要进度条等可直接获取
let res = await uploader.qnImgUpload(options)
// let imgList = res.map(item=>{
// return {
// key:item,
// src:uploader.qiniuTokenObj.visitPrefix + item
// }
// })
// this.imgList = imgList
return
}
// 本地服务上传
let res = await uploader.urlUpload()
this.imgList = res
},
perviewImg(index) {
let urls = []
this.imgList.map(item => {
urls.push(item.src)
})
uni.previewImage({
current: index,
urls: urls
});
},
removeImg(index) {
this.imgList.splice(index, 1)
// this.$emit('image-change', this.imgList) //将图片回传父页面
},
}
}
......@@ -32,7 +32,7 @@ export default {
}
})
uni.setStorageSync('delImg', delImg) // 已上传完的图片,会在启动系统的时候做一次清理
// uni.setStorageSync('delImg', delImg) // 已上传完的图片,会在启动系统的时候做一次清理
that.$u.vuex('uploadTask', newTask)
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment