<template>
<view class="content">
<view name= "img[]" class="" @click="get_img">点击上传</view>
<view v-for="(item ,index) in tempFiles " :key="index" >
<view class="upload_img_item"> <view class="upload_img_close">X</view>
<image :src="item.path" class="upload_img" @click="img_delete(index)"></image>
</view>
</view>
<view @click="do_upload">上传</view>
</view>
</template>
<script>
export default {
data() {
return {
tempFiles :[],
uploadList:[],
img_status:false,
imgAllUrl:[]
}
},
onLoad() {
},
methods: {
get_img(){
const _self = this;
uni.chooseImage({
count:1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album'], //从相册选择
success: function (res) {
var tempFiles = res.tempFiles; //显示的图片
var tempFilePaths = res.tempFilePaths; //上传的图片
//需要显示的图片
for(var i = 0;i<tempFiles.length;i++){
_self.tempFiles .push(tempFiles[i]);
}
//处理需要上传的图片
for(var i = 0;i<tempFilePaths.length;i++){
_self.uploadList.push(tempFilePaths[i]);
}
// 文件路劲封装
let imgs = _self.uploadList.map((value, index) => {
return {
name: "image" + index,
uri: value
}
});
console.log(imgs);
uni.uploadFile({
url:'http://www.yckcu.cn/api/Upload/uploadimages_file',
files: imgs,
fileType: "image",
formData:{folder:'repair'},
success: (res) => {
if (res.statusCode === 200) {
uni.showToast({
title: "反馈成功!"
});
}
}
});
}
});
},
img_delete(e){
const self = this;
self.imageList.splice(e,1);
self.uploadList.splice(e,1);
},
do_upload(){
var userinfo = uni.getStorageSync('userinfo');
var user_id = userinfo.user_id;
var that = this;
const img_list =this.uploadList;
var i=0;
for(i;i<img_list.length;i++){
const uploadTask =uni.uploadFile({
url:'http://www.yckcu.cn/api/Upload/uploadimages',
filePath: img_list[i],
fileType: 'image',
name: 'file',
formData: {
user_id:user_id,'folder':'repair'
},
success: (res) => {
var myurl = JSON.parse( res.data );
// console.log(myurl.data[0]);
// that.imgAllUrl.push(myurl.data[0])
that.imgAllUrl.push(myurl.data[0])
}
});
}
console.log(that.imgAllUrl);
var data = JSON.parse(JSON.stringify(that.imgAllUrl))
console.log(data)
}
}
}
</script>
<style>
.upload_img_item{
position: relative;
}
.upload_img_close{
position: absolute;
z-index: 999;
right: 0;
color:#fff;
background: #DD524D;
}
.upload_img{
width: 90px;
height: 90px;
display: block;
}
</style>
public function uploadimages_file(){
$folder = input('folder');
$user_id = input('user_id');
/* if(!model('user')->getUserIdInfo($user_id)){
$this->error('用户不存在');
}*/
$files = request()->file();
if(empty($files) || $files ==null){
$this->error('请上传文件');
}
$imags = [];
$errors = [];
foreach($files as $file){
if ($folder) { //保存目录
// 移动到框架应用根目录/public/uploads/ 目录下
$info = $file->move(ROOT_PATH . 'public' . DS . 'uploads' . DS . $folder);
if ($info) {
// 成功上传后 获取上传信息
//echo $info->getFilename();
// $path = '/uploads/editor/' . $info->getSaveName();
$path = $folder. DS . $info->getSaveName();
$fileName = str_replace('\\', '/', $path);
array_push($imags, '/'.$fileName);
} else {
array_push($errors, $file->getError()); // 上传失败获取错误信息
}
}
}
if(!$errors){
$msg['code'] = 1;
$msg['data'] = $imags;
return json($msg);
}else{
$msg['code'] = 0;
$msg['data'] = $imags;
$msg['msg'] = "上传出错";
return json($msg);
}
}