mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange.git
synced 2026-08-19 04:14:04 +00:00
Merge branch 'fix/uploadPicture' into 'master'
Fix/upload picture See merge request CIEFWorldwideSdnBhd/exchange!141
This commit is contained in:
@@ -576,7 +576,7 @@ class BookingController extends Controller
|
||||
return response()->json(['book_id'=>$book_id],200);
|
||||
}
|
||||
|
||||
public function uploadbankslip(Request $request, $id)
|
||||
private function uploadbankslip(Request $request, $id)
|
||||
{
|
||||
$booking = Booking::where('user_id',Auth::user()->id)->where('id',$id)->first();
|
||||
|
||||
@@ -586,40 +586,48 @@ class BookingController extends Controller
|
||||
return response()->json(['message'=>'Access denied'], 403);
|
||||
}
|
||||
|
||||
$validator = Validator::make($request->all(), [
|
||||
'file' => 'mimes:jpg,jpeg,bmp,png,xls,xlsx,doc,docx,pdf'
|
||||
]);
|
||||
// $validator = Validator::make($request->all(), [
|
||||
// 'slip_image' => 'mimes:jpg,jpeg,bmp,png,xls,xlsx,doc,docx,pdf'
|
||||
// ]);
|
||||
|
||||
if($validator->fails())
|
||||
{
|
||||
return response()->json(['message'=>'Incorrect format'],400);
|
||||
}
|
||||
// if($validator->fails())
|
||||
// {
|
||||
// return response()->json(['message'=>'Incorrect format'],400);
|
||||
// }
|
||||
|
||||
$validator = Validator::make($request->all(), [
|
||||
'file' => 'max:10000' // image size
|
||||
]);
|
||||
// $validator = Validator::make($request->all(), [
|
||||
// 'slip_image' => 'max:10000' // image size
|
||||
// ]);
|
||||
|
||||
if($validator->fails())
|
||||
{
|
||||
return response()->json(['message'=>'Image too large, upload files up to 3 MB'], 400);
|
||||
}
|
||||
// if($validator->fails())
|
||||
// {
|
||||
// return response()->json(['message'=>'Image too large, upload files up to 3 MB'], 400);
|
||||
// }
|
||||
|
||||
|
||||
if($bankslip_file = $request->file('file'))
|
||||
if($bankslip_file = $request->input('slip_image'))
|
||||
|
||||
{
|
||||
/* End Validation */
|
||||
$filename = $bankslip_file->getClientOriginalName();
|
||||
$ext = $bankslip_file->getClientOriginalExtension();
|
||||
|
||||
|
||||
$unique_name = 'bank_slip_' . md5($filename. time()); // probably not a good idea
|
||||
$unique_image_path = $unique_name. '.' .$ext;
|
||||
|
||||
$upload_path = Storage::disk('public')->putFileAs(
|
||||
'user_bankslip', $bankslip_file, $unique_image_path
|
||||
);
|
||||
$ext = explode('/', explode(':', substr($bankslip_file, 0, strpos($bankslip_file, ';')))[1])[1];
|
||||
$img = str_replace('data:image/'.$ext.';base64,', '', $bankslip_file);
|
||||
$img = str_replace(' ', '+', $img);
|
||||
$data = base64_decode($img);
|
||||
$file_name = 'bank_slip_' . md5(time()).'.'.$ext;
|
||||
if($bankslip_file!=""){
|
||||
// storing image in storage/app/public Folder
|
||||
$upload_path = \Storage::disk('public')->put('user_bankslip'.'/'.$file_name, $data);
|
||||
}
|
||||
// /* End Validation */
|
||||
// // $filename = $bankslip_file->getClientOriginalName();
|
||||
//
|
||||
|
||||
// $unique_name = 'bank_slip_' . md5(time()); // probably not a good idea
|
||||
// $unique_image_path = $unique_name. '.' .'jpg';
|
||||
// $image_parts = explode(";base64,", $bankslip_file);
|
||||
// $upload_path = \Storage::disk('public')->put('user_bankslip'.'/'.$unique_image_path,base64_decode(base64_decode($image_parts[1])));
|
||||
// // $upload_path = Storage::disk('public')->putFileAs(
|
||||
// // 'user_bankslip', base64_decode($image), $unique_image_path
|
||||
// // );
|
||||
if($upload_path){
|
||||
$user_bankslip = $booking->userBankSlip()->first();
|
||||
|
||||
@@ -628,8 +636,8 @@ class BookingController extends Controller
|
||||
$user_bankslip = new UserBankSlip;
|
||||
}
|
||||
$user_bankslip->booking_id = $booking->id;
|
||||
$user_bankslip->bankslip_path = $upload_path;
|
||||
$user_bankslip->transfer_amount = $request->input('transfer_amount');
|
||||
$user_bankslip->bankslip_path = 'user_bankslip'.'/'.$file_name;
|
||||
$user_bankslip->transfer_amount = null;
|
||||
$user_bankslip->save();
|
||||
|
||||
|
||||
@@ -647,6 +655,7 @@ class BookingController extends Controller
|
||||
}
|
||||
|
||||
public function updateBankSlipAmount(Request $request, $id){
|
||||
$this->uploadbankslip($request, $id);
|
||||
$booking = Booking::where('user_id',Auth::user()->id)->where('id',$id)->first();
|
||||
$user_bankslip = $booking->userBankSlip()->first();
|
||||
|
||||
|
||||
@@ -22,6 +22,7 @@
|
||||
"bootstrap": "^4.0.0",
|
||||
"canvas2image": "^1.0.5",
|
||||
"element-ui": "^2.4.4",
|
||||
"image-compressor.js": "^1.1.4",
|
||||
"jquery": "^3.3.1",
|
||||
"js-cookie": "^2.2.0",
|
||||
"laravel-echo": "^1.4.0",
|
||||
@@ -34,6 +35,7 @@
|
||||
"vue-axios": "^2.1.1",
|
||||
"vue-button-spinner": "^2.2.0",
|
||||
"vue-i18n": "^7.6.0",
|
||||
"vue-image-compressor": "^1.0.3",
|
||||
"vue-js-toggle-button": "^1.3.0",
|
||||
"vue-loader": "^14.2.2",
|
||||
"vue-loading-spinner": "^1.0.11",
|
||||
|
||||
@@ -58,11 +58,27 @@
|
||||
<el-dialog :visible.sync="dialogVisible">
|
||||
<img :src="dialogImageUrl" width="100%" alt="">
|
||||
</el-dialog> -->
|
||||
<el-upload class="avatar-uploader" :action="'/api/booking/' + booking_id + '/upload-user-bankslip'" :show-file-list="false"
|
||||
:on-success="handleUploadSuccess" :before-upload="beforeFileUpload" algin="center">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
ref="upload"
|
||||
action="'/api/booking/' + booking_id + '/upload-user-bankslip'"
|
||||
:auto-upload="false"
|
||||
:show-file-list="false"
|
||||
:on-success="handleUploadSuccess"
|
||||
:on-change="beforeFileUpload"
|
||||
algin="center">
|
||||
<img v-if="imageUrl" :src="imageUrl" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
||||
</el-upload>
|
||||
<!-- <el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:auto-upload="false">
|
||||
<el-button slot="trigger" size="small" type="primary">select file</el-button>
|
||||
<el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">upload to server</el-button>
|
||||
<div class="el-upload__tip" slot="tip">jpg/png files with a size less than 500kb</div>
|
||||
</el-upload> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -155,6 +171,7 @@
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
import X2ProgressTrack from '~/components/X2ProgressTrack'
|
||||
import axios from 'axios'
|
||||
import ImageCompressor from 'image-compressor.js';
|
||||
|
||||
export default {
|
||||
middleware: ['auth'],
|
||||
@@ -177,7 +194,8 @@
|
||||
dialogVisible: false,
|
||||
booking_id: this.$route.params.id,
|
||||
user_slip_form: {
|
||||
transfer_amount: ''
|
||||
transfer_amount: '',
|
||||
slip_image: ''
|
||||
},
|
||||
booking: {
|
||||
amount: '',
|
||||
@@ -292,14 +310,23 @@
|
||||
|
||||
beforeFileUpload(file) {
|
||||
//const isJPG = file.type === 'image/jpeg';
|
||||
const isLt10M = file.size / 10240 / 10240 < 2;
|
||||
|
||||
// if (!isJPG) {
|
||||
// this.$message.error('Avatar picture must be JPG format!');
|
||||
// }
|
||||
if (!isLt10M) {
|
||||
this.$message.error('File size can not exceed 10MB!');
|
||||
}
|
||||
const isLt2M = file.size / 1024 / 1024 < 2;
|
||||
var vm = this;
|
||||
new ImageCompressor(file.raw, {
|
||||
quality: .4,
|
||||
convertSize: 1500000,
|
||||
success(result) {
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(result);
|
||||
reader.onloadend = function() {
|
||||
vm.imageUrl = reader.result;
|
||||
vm.user_slip_form.slip_image = reader.result;
|
||||
}
|
||||
},
|
||||
error(e) {
|
||||
console.log(e.message);
|
||||
}
|
||||
});
|
||||
|
||||
this.$message({
|
||||
showClose: true,
|
||||
@@ -308,7 +335,7 @@
|
||||
duration: 5000
|
||||
})
|
||||
// return isJPG && isLt2M;
|
||||
return isLt10M;
|
||||
return isLt2M;
|
||||
},
|
||||
|
||||
handleCoutdownend() {
|
||||
@@ -357,7 +384,7 @@
|
||||
let newUserSlip = {
|
||||
transfer_amount: this.user_slip_form.transfer_amount
|
||||
}
|
||||
axios.patch('/api/booking/' + this.booking_id + '/bankslip-amount/', newUserSlip)
|
||||
axios.patch('/api/booking/' + this.booking_id + '/bankslip-amount/', this.user_slip_form)
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user