Recently, after-sales function is being done, the page is as follows:
Need to do the function of uploading pictures, the core code of the small program for uploading pictures:
const App = getApp();
Page({
/**
* 页面的初始数据
*/
data: {
// 订单商品id
order_id: null,
statusBarHeight: 20,
toBarHeight: 44,
// 订单商品详情
detail: {},
// 图片列表
imageList: [],
// 服务类型
serviceType: 10,
},
disable: false,
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
let _this = this;
// 记录页面参数
_this.data.order_id = options.order_id;
_this.data.total_money = options.total_money;
console.log(_this.data)
// var qqq = App.globalData.url;
// console.log(qqq);
//title高度样式
_this.setData({
'statusBarHeight': App.globalData.statusBarHeight,
'toBarHeight': App.globalData.toBar,
});
//内容滚动条高度计算
if (_this.data.UserType == 10) {
var scollHeight = App.globalData.screenHeight - App.globalData.statusBarHeight - 260;
} else {
var scollHeight = App.globalData.screenHeight - App.globalData.statusBarHeight - 150;
}
_this.setData({
'o_boxHeight': scollHeight
});
_this.setData({
'total_money': options.total_money
});
//console.log(options)
// 获取订单商品详情
// this.getGoodsDetail();
},
//返回上一页
onClick: function () {
wx.navigateBack({
delta:1
})
},
/**
* 获取订单商品详情
*/
getGoodsDetail: function() {
let _this = this;
App._get('user.refund/apply', {
order_goods_id: this.data.order_goods_id
}, function(result) {
//_this.setData(result.data);
});
},
/**
* 切换标签
*/
onSwitchService: function(e) {
console.log(e.detail)
this.setData({
serviceType: e.detail.target.dataset.type
});
},
/**
* 跳转商品详情
*/
onGoodsDetail: function(e) {
wx.navigateTo({
url: '../../../goods/index?goods_id=' + e.detail.target.dataset.id
});
},
/**
* 选择图片
*/
chooseImage: function(e) {
let _this = this,
index = e.currentTarget.dataset.index,
imageList = _this.data.imageList;
// 选择图片
wx.chooseImage({
count: 6 - imageList.length,
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function(res) {
_this.setData({
imageList: imageList.concat(res.tempFilePaths)
});
}
});
},
/**
* 删除图片
*/
deleteImage: function(e) {
let dataset = e.currentTarget.dataset,
imageList = this.data.imageList;
imageList.splice(dataset.imageIndex, 1);
this.setData({
imageList
});
},
/**
* 表单提交
*/
onSubmit: function(e) {
let _this = this;
console.log(e.detail,_this.data);
if (!e.detail.value.content) {
App.showError('申请原因不能为空');
return false;
}
// 判断是否重复提交
if (_this.disable === true) {
return false;
}
// 表单提交按钮设为禁用 (防止重复提交)
_this.disable = true;
wx.showLoading({
title: '正在处理...',
mask: true
});
// console.log(wx.getStorageSync('yj_user_id'));
// form参数
let postParams = {
order_id: _this.data.order_id,
type: _this.data.serviceType,
content: e.detail.value.content,
user_id:wx.getStorageSync('yj_user_id'),
apply_money:e.detail.value.apply_number,
};
//console.log(postParams);return;
// form提交执行函数
let fromPostCall = function(params) {
console.log(params);
App._post_form('refund/apply', params, function(result) {
// console.log(result);return;
if (result.status == 200) {
App.showSuccess(result.msg,function(){
// 跳转售后管理页面
console.log("222")
wx.navigateTo({
url: "/pages/order/index"
});
});
} else {
App.showError(result.msg);
}
},
false,
function() {
wx.hideLoading();
_this.disable = false;
});
};
// 统计图片数量
let imagesLength = _this.data.imageList.length;
// 判断是否需要上传图片
imagesLength > 0 ? _this.uploadFile(imagesLength, fromPostCall, postParams) : fromPostCall(postParams);
},
/**
* 上传图片
*/
uploadFile: function(imagesLength, callBack, formData) {
var that = this
let uploaded = [];
// 文件上传
let i = 0;
that.data.imageList.forEach(function(filePath, fileKey) {
console.log(filePath,fileKey);
console.log(App.globalData.url + 'cpfr/Refund/upimages');
console.log(filePath)
wx.uploadFile({
url: App.globalData.url + 'cpfr/Refund/upimages',
//url: App.api_root + 'cpfr/upload/image',
header: {
"content-Type": "multipart/form-data"
},
filePath: filePath,
name: 'file',
formData: {
// wxapp_id:'1002',
// token: wx.getStorageSync('yj_LoginToken')
wxapp_id: 10002,
token: wx.getStorageSync('AuthorizeToken'),
filePath: filePath
},
success: function(res) {
console.log("vvv",res)
//return "111";
var dataa = res.data;
console.log(typeof dataa,JSON.parse(dataa))
let result = typeof res === "object" ? res : JSON.parse(res);
console.log("sss",typeof result,result)
console.log(result.data)
if (res.statusCode == 200) {
console.log("www")
uploaded[fileKey] = res.file;
console.log("www",uploaded)
}
},
fail: function (res) {
// debugger
console.log("ccc")
console.log("ccc",res);
},
complete: function() {
i++;
if (imagesLength === i) {
// 所有文件上传完成
console.log('upload complete');
console.log(uploaded)
formData['images'] = uploaded;
// 执行回调函数
callBack && callBack(formData);
}
}
});
});
},
})The reason why there are so many console.logs is because I am still debugging the project, and I try to keep the PHP code on the back end as simple as possible, as shown
//上传图片的方法
public function upimages(Request $request){
$vv = input('param.'); //获取全部参数
$file = request()->file('file');
if ($file) {
$info = $file->move('uploads/refund/');//文件路径
if ($info) {
//$file = $info->getSaveName();
$data = ROOT_PATH . 'uploads' .'refund' . $info->getSaveName();
$res = array('code'=>10002,'msg'=>'successfully','data'=>compact('data'));
lq_test(json_encode($res));
return json_encode($res);
//$return_arr = array('code'=>10003,'msg'=>'Data read successfully','data'=>compact('list'));
// return json_encode($return_arr);
}
}
}
public function addImg() {
$code = $_FILES['file'];//获取小程序传来的文件
//WSTUploadFile();
// return $_FILES['file']['type'];
// 判断是否是post提交
if(is_uploaded_file($_FILES['file']['tmp_name'])) {
//lq_test("222");
//临时文件
$uploaded_file = $_FILES['file']['tmp_name'];
// return $uploaded_file;
// 允许的图片类型
$judge_img = array("image/gif","image/pjpeg","image/jpeg","image/png","image/jpg");
// 允许的视频类型
$judge_vid = array("video/mp4");
// 判断是图片还是视频
if(in_array($_FILES['file']['type'],$judge_img)) {
// 换算字节 1M = 1024KB;1KB = 1000bt;
if($_FILES["file"]["size"] > 1024000) {
// 图片过大
$arr = ['status' => 2];
return json_encode($arr);
}
// 图片的路径
$pathdir= 'uploads/refund/';
$user_path = Env::get('root_path').$pathdir;
}elseif(in_array($_FILES['file']['type'],$judge_vid)) {
if($_FILES["file"]["size"] > 2048*1000) {
// 视频过大
$arr = ['status' => 2];
return json_encode($arr);
}
$pathdir= 'uploads/refund/';
// 视频的路径
$user_path = $pathdir;
}else {
// 格式错误
$arr = ['status' => 1];
return json_encode($arr);
}
$file_true_name = $_FILES['file']['name'];
$move_to_file = $user_path.time()."-".date("Y-m-d").substr($file_true_name,strrpos($file_true_name,"."));
if(move_uploaded_file($uploaded_file,iconv("utf-8","gb2312",$move_to_file))) {
// 上传成功
$arr = ['status' => 3, 'url' => $move_to_file];
$arr = json_encode($arr);
return $arr;
} else {
// 上传失败网络错误，请重新上传
$arr = ['status' => 4];
return json_encode($arr);
}
} else {
// 上传方式错误
$arr = ['status' => 6];
return json_encode($arr);
}
}
The print in the cosole received in the applet debugger is as follows:
I don’t know why the statuscode and cookie HTTP transmission fields are added. It may be that the file upload and transmission form is different, and the value is not affected.