mirror of
https://gitlab.com/omair-personal/exchange.git
synced 2026-08-19 04:24:08 +00:00
Merge branch 'fix/bug' into 'master'
Fix/bug See merge request CIEFWorldwideSdnBhd/exchange!89
This commit is contained in:
Jack Goh
@@ -210,9 +210,9 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item prop="rate">
|
||||
<el-form-item prop="rate">
|
||||
<el-input v-model="supplierBookingForm.rate" type="text" placeholder="Rate" style="width: 80%" />
|
||||
</el-form-item> -->
|
||||
</el-form-item>
|
||||
<el-form-item prop="rebate">
|
||||
<el-input v-model="supplierBookingForm.rebate" type="text" placeholder="Rebate" style="width: 80%" />
|
||||
</el-form-item>
|
||||
@@ -333,7 +333,7 @@
|
||||
booking_id: this.$route.params.id,
|
||||
supplier_id: this.supplierBookingForm.supplier,
|
||||
rebate: this.supplierBookingForm.rebate,
|
||||
//rate: this.supplierBookingForm.rate,
|
||||
rate: this.supplierBookingForm.rate,
|
||||
//transfer_amount: this.supplierBookingForm.transfer_amount,
|
||||
}
|
||||
|
||||
|
||||
@@ -201,7 +201,6 @@
|
||||
<el-row :gutter="12" style="text-align:center">
|
||||
<el-col :span="20" style="text-align:center">
|
||||
<canvas id="myCanvas" ref="myCanvas" v-insert-message="supplier_booking"></canvas>
|
||||
<img id="banklogo" src="/banklogo.png" style="display: none"/>
|
||||
<br>
|
||||
<el-button @click="downloadReport()" type="text">Download Now</el-button>
|
||||
</el-col>
|
||||
@@ -533,17 +532,17 @@
|
||||
//// Row 17
|
||||
//// Row 18
|
||||
//// Row 19
|
||||
var img = new Image();
|
||||
img.src = "/banklogo.png";
|
||||
img.crossOrigin = "anonymous";
|
||||
var maxwidth = 70;
|
||||
var ratio = maxwidth / img.width;
|
||||
var offset = ((rowHeight[22] - rowHeight[21]) / 2) - (img.height * ratio / 2);
|
||||
var y = rowHeight[21] + offset; // to make it always center
|
||||
// var img = new Image();
|
||||
// img.src = "/banklogo.png";
|
||||
// img.crossOrigin = "anonymous";
|
||||
// var maxwidth = 70;
|
||||
// var ratio = maxwidth / img.width;
|
||||
// var offset = ((rowHeight[22] - rowHeight[21]) / 2) - (img.height * ratio / 2);
|
||||
// var y = rowHeight[21] + offset; // to make it always center
|
||||
|
||||
img.onload=function(){
|
||||
ctx.drawImage(img, 50, 530, 80, 50);
|
||||
};
|
||||
// img.onload=function(){
|
||||
// ctx.drawImage(img, 50, 530, 80, 50);
|
||||
// };
|
||||
|
||||
// text
|
||||
ctx.font = "bold 14px Arial";
|
||||
|
||||
@@ -1,64 +1,56 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"/>
|
||||
<h1>Transfer Completed</h1>
|
||||
<h2> Please upload your purchase order </h2>
|
||||
<!-- upload card -->
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">Upload PO</div>
|
||||
<!-- upload image -->
|
||||
<div class="card-body">
|
||||
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-po'" :on-exceed="handleExceed" :on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:on-error="uploadError"
|
||||
class="upload-demo uploadAreaOne"
|
||||
accept=".jpeg, .jpg, .png, .bmp, .doc, .docx, .xls, .xlsx, .pdf"
|
||||
drag
|
||||
multiple>
|
||||
<i class="el-icon-upload"/>
|
||||
<div class="el-upload__text">Drop file here or
|
||||
<em>click to upload</em>
|
||||
</div>
|
||||
<div slot="tip" class="el-upload__tip">bmp/jpeg/jpg/png/pdf/xls/xlxs/doc/docx files with a size less than 3MB</div>
|
||||
</el-upload>
|
||||
<el-upload
|
||||
class="upload-demo uploadAreaTwo"
|
||||
:action="'/api/booking/' + booking_id + '/upload-po'"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:before-remove="beforeRemove"
|
||||
multiple
|
||||
:file-list="fileList">
|
||||
<el-button size="small" type="primary">Click to upload</el-button>
|
||||
<div slot="tip" class="el-upload__tip">jpg/png files with a size less than 500kb</div>
|
||||
</el-upload>
|
||||
|
||||
<div class="bottom clearfix" style="text-align:right;">
|
||||
<el-button :loading="loading_btn" type="primary" @click="uploadPo">Submit</el-button>
|
||||
<el-main>
|
||||
<progress-track v-model="status" />
|
||||
<h1>Transfer Completed</h1>
|
||||
<h2> Please upload your purchase order </h2>
|
||||
<!-- upload card -->
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">Upload PO
|
||||
<a href="/po-format.xls" target="_blank">(Download Po Format)</a>
|
||||
</div>
|
||||
<!-- upload image -->
|
||||
<div class="card-body">
|
||||
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-po'" :on-exceed="handleExceed" :on-preview="handlePreview" :on-remove="handleRemove"
|
||||
:on-error="uploadError" class="upload-demo uploadAreaOne" accept=".jpeg, .jpg, .png, .bmp, .doc, .docx, .xls, .xlsx, .pdf"
|
||||
drag multiple>
|
||||
<i class="el-icon-upload" />
|
||||
<div class="el-upload__text">Drop file here or
|
||||
<em>click to upload</em>
|
||||
</div>
|
||||
<div slot="tip" class="el-upload__tip">bmp/jpeg/jpg/png/pdf/xls/xlxs/doc/docx files with a size less than 3MB</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo uploadAreaTwo" :action="'/api/booking/' + booking_id + '/upload-po'" :on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :before-remove="beforeRemove" multiple :file-list="fileList">
|
||||
<el-button size="small" type="primary">Click to upload</el-button>
|
||||
<div slot="tip" class="el-upload__tip">jpg/png files with a size less than 500kb</div>
|
||||
</el-upload>
|
||||
|
||||
<div class="bottom clearfix" style="text-align:right;">
|
||||
<el-button :loading="loading_btn" type="primary" @click="uploadPo">Submit</el-button>
|
||||
</div>
|
||||
<!-- upload image end -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">China Bank Slip</div>
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="getURL(booking_details.china_bankslip_path)">
|
||||
<img v-if="isImage(booking_details.china_bankslip_path)" v-bind:src="booking_details.china_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</div>
|
||||
<!-- upload image end -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">China Bank Slip</div>
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="getURL(booking_details.china_bankslip_path)">
|
||||
<img v-if="isImage(booking_details.china_bankslip_path)" v-bind:src="booking_details.china_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
@@ -69,11 +61,11 @@
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
@@ -95,15 +87,17 @@
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
<td>
|
||||
<b>MYR {{ booking_details.bia }}</b>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Beneficiary Account Number : </td>
|
||||
@@ -120,9 +114,9 @@
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="getURL(booking_details.user_bankslip_path)">
|
||||
<img v-if="isImage(booking_details.user_bankslip_path)" v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
<img v-if="isImage(booking_details.user_bankslip_path)" v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -132,19 +126,23 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:3vw;
|
||||
text-align:center;
|
||||
margin-top: 5%;
|
||||
font-size: 3vw;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size:2vw;
|
||||
text-align:center;
|
||||
margin-bottom:3%;
|
||||
font-size: 2vw;
|
||||
text-align: center;
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bankinSlipImage {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
@@ -153,26 +151,30 @@
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.bankinSlipImage:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
|
||||
.uploadAreaTwo {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.card {
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
@media only screen and (max-width : 767px) {
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
.uploadAreaOne {
|
||||
display: none;
|
||||
}
|
||||
.uploadAreaTwo {
|
||||
display: unset;
|
||||
}
|
||||
.table {
|
||||
font-size: 3.5vmin;
|
||||
}
|
||||
h1 {
|
||||
.table {
|
||||
font-size: 3.5vmin;
|
||||
}
|
||||
h1 {
|
||||
font-size: 1em;
|
||||
}
|
||||
h2 {
|
||||
@@ -181,104 +183,106 @@
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import VueCountdown from '@dmaksimovic/vue-countdown'
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
import axios from 'axios'
|
||||
import VueCountdown from '@dmaksimovic/vue-countdown'
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
'progress-track': ProgressTrack
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
booking_id: this.$route.params.id,
|
||||
status: 5,
|
||||
loading_btn: false,
|
||||
booking_details:{
|
||||
id: null,
|
||||
amount: null,
|
||||
bia: null,
|
||||
user_bankslip_path: null,
|
||||
china_bankslip_path: null,
|
||||
export default {
|
||||
components: {
|
||||
'progress-track': ProgressTrack
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
booking_id: this.$route.params.id,
|
||||
status: 5,
|
||||
loading_btn: false,
|
||||
booking_details: {
|
||||
id: null,
|
||||
amount: null,
|
||||
bia: null,
|
||||
user_bankslip_path: null,
|
||||
china_bankslip_path: null,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeCreate () {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Please wait..',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
|
||||
axios
|
||||
.get('/api/booking/' + this.$route.params.id)
|
||||
.then((response) => {
|
||||
this.booking_details = response.data
|
||||
loading.close()
|
||||
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
loading.close()
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
},
|
||||
beforeCreate() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Please wait..',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
uploadPo () {
|
||||
this.loading_btn = true
|
||||
|
||||
axios
|
||||
.post('/api/booking/' + this.$route.params.id + '/confirm-po')
|
||||
.get('/api/booking/' + this.$route.params.id)
|
||||
.then((response) => {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: 'Your PO has been uploaded. We are processing the Invoice.',
|
||||
type: 'success',
|
||||
duration: 5000
|
||||
})
|
||||
this.$router.push({
|
||||
name: 'home'
|
||||
})
|
||||
this.loading_btn = false
|
||||
this.booking_details = response.data
|
||||
loading.close()
|
||||
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
loading.close()
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
uploadPo() {
|
||||
this.loading_btn = true
|
||||
axios
|
||||
.post('/api/booking/' + this.$route.params.id + '/confirm-po')
|
||||
.then((response) => {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: 'Your PO has been uploaded. We are processing the Invoice.',
|
||||
type: 'success',
|
||||
duration: 5000
|
||||
})
|
||||
this.$router.push({
|
||||
name: 'home'
|
||||
})
|
||||
this.loading_btn = false
|
||||
}).catch((error) => {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: "Please upload your purchase order",
|
||||
type: 'error',
|
||||
duration: 30000
|
||||
})
|
||||
this.loading_btn = false
|
||||
})
|
||||
},
|
||||
handleRemove (file, fileList) {
|
||||
console.log(file, fileList)
|
||||
// Should send some reqeust to controller to delete the file
|
||||
},
|
||||
handlePreview (file) {
|
||||
console.log(file)
|
||||
},
|
||||
handleExceed (files, fileList) {
|
||||
this.$message.warning(`The limit is 3, you selected ${files.length} files this time, add up to ${files.length + fileList.length} totally`)
|
||||
},
|
||||
beforeRemove (file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}？`)
|
||||
},
|
||||
uploadError(file,fileList){
|
||||
this.$message.warning(`Incorrect file format or file size too big.`)
|
||||
},
|
||||
getExtension(path){
|
||||
return path.slice(-3);
|
||||
},
|
||||
isImage(path){
|
||||
var ext = this.getExtension(path);
|
||||
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png';
|
||||
},
|
||||
getURL(path){
|
||||
var getUrl = window.location;
|
||||
var baseUrl = getUrl.protocol + "//" + getUrl.host;
|
||||
return baseUrl + path;
|
||||
this.loading_btn = false
|
||||
})
|
||||
},
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList)
|
||||
// Should send some reqeust to controller to delete the file
|
||||
},
|
||||
handlePreview(file) {
|
||||
console.log(file)
|
||||
},
|
||||
handleExceed(files, fileList) {
|
||||
this.$message.warning(
|
||||
`The limit is 3, you selected ${files.length} files this time, add up to ${files.length + fileList.length} totally`
|
||||
)
|
||||
},
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}？`)
|
||||
},
|
||||
uploadError(file, fileList) {
|
||||
this.$message.warning(`Incorrect file format or file size too big.`)
|
||||
},
|
||||
getExtension(path) {
|
||||
return path.slice(-3);
|
||||
},
|
||||
isImage(path) {
|
||||
var ext = this.getExtension(path);
|
||||
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png';
|
||||
},
|
||||
getURL(path) {
|
||||
var getUrl = window.location;
|
||||
var baseUrl = getUrl.protocol + "//" + getUrl.host;
|
||||
return baseUrl + path;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
@@ -249,17 +249,11 @@
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>China Beneficiary Acc :</td>
|
||||
<td>China Beneficiary Acc : <br>
|
||||
Name : {{ bookingConfirmTable.acc_name }} <br>
|
||||
Account No. : {{ bookingConfirmTable.acc_no }}</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
Name : {{ bookingConfirmTable.acc_name }} <br>
|
||||
Account No. : {{ bookingConfirmTable.acc_no }}
|
||||
</td>
|
||||
<td>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Bank In Amount :</td>
|
||||
<td><b>RM {{ bookingConfirmTable.bankin_amount }}</b></td>
|
||||
|
||||
Reference in New Issue
Block a user