mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange.git
synced 2026-08-19 04:14:04 +00:00
supplier do
This commit is contained in:
Edmond Teh
@@ -14,6 +14,8 @@ use App\Booking;
|
||||
use App\Invoice;
|
||||
use App\InvoiceDetails;
|
||||
use App\InvoiceStatuses;
|
||||
use App\SupplierBooking;
|
||||
use App\SettingSupplier;
|
||||
use PDF;
|
||||
|
||||
class InvoiceController extends Controller
|
||||
@@ -367,18 +369,18 @@ class InvoiceController extends Controller
|
||||
$data = [
|
||||
'title' => 'Delivery Order',
|
||||
'buyer' => [
|
||||
'buyer_company' => 'CIEF Worldwide Sdn Bhd',
|
||||
'buyer_company' => $invoice->buyer_company,
|
||||
'reg_no' => '',
|
||||
'address' => $invoice->address,
|
||||
'gst' => '',
|
||||
'phone' => $invoice->contact_no
|
||||
],
|
||||
'seller' => [
|
||||
'seller_company' => 'CIEF Worldwide Sdn Bhd',
|
||||
'address' => 'Malaysia Global Innovation & Creativity Centre, Level
|
||||
1 CWS, Block 3730, Persiaran APEC 63000
|
||||
Cyberjaya.',
|
||||
'gst' => '',
|
||||
'phone' => '018 2909252'
|
||||
],
|
||||
'seller' => [
|
||||
'seller_company' => $invoice->buyer_company,
|
||||
'address' => $invoice->address,
|
||||
'phone' => $invoice->contact_no,
|
||||
'phone' => '018 2909252',
|
||||
'date' => $invoice->updated_at,
|
||||
'po_number' => $invoice->po_number,
|
||||
'order_number' => $booking->order_no
|
||||
@@ -396,13 +398,41 @@ class InvoiceController extends Controller
|
||||
|
||||
public function getSupplierDO($id)
|
||||
{
|
||||
// Only Admin Can get Supplier DO
|
||||
// Generate PO
|
||||
|
||||
// Ensure Invoice Exist and Completed
|
||||
|
||||
// Generate PO
|
||||
|
||||
// Send
|
||||
$booking = Booking::where('id', $id)->first();
|
||||
$invoice = Invoice::where('booking_id', $booking['id'])->first();
|
||||
$lines = InvoiceDetails::where('invoice_id', $invoice->id)->get();
|
||||
$supplierbooking = SupplierBooking::where('booking_id', $id)->first();
|
||||
$supplier = SettingSupplier::where('id', $supplierbooking->supplier_id)->first();
|
||||
|
||||
$data = [
|
||||
'title' => 'Delivery Order',
|
||||
'buyer' => [
|
||||
'buyer_company' => 'CIEF Worldwide Sdn Bhd',
|
||||
'reg_no' => '',
|
||||
'address' => 'Malaysia Global Innovation & Creativity Centre, Level
|
||||
1 CWS, Block 3730, Persiaran APEC 63000
|
||||
Cyberjaya.',
|
||||
'gst' => '',
|
||||
'phone' => '018 2909252'
|
||||
],
|
||||
'seller' => [
|
||||
'seller_company' => $invoice->buyer_company,
|
||||
'address' => $supplier->company_name,
|
||||
'phone' => '',
|
||||
'date' => '',
|
||||
'po_number' => $invoice->po_number,
|
||||
'order_number' => $booking->order_no
|
||||
],
|
||||
'lines' => $lines,
|
||||
'amount' => $invoice->amount
|
||||
];
|
||||
$pdf = PDF::loadView('pdf/po', $data);
|
||||
|
||||
|
||||
// Send
|
||||
return $pdf->download('do.pdf');
|
||||
}
|
||||
|
||||
// private invoiceExist($id)
|
||||
|
||||
@@ -21,11 +21,11 @@
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12" align="center">
|
||||
<div v-for="po in booking_details.user_po_path" :key='po'>
|
||||
<a target="_blank" :href="getURL(po)">
|
||||
<img v-if="isImage(po)" v-bind:src="po" class="image" style="max-width: 100%">
|
||||
<div v-for="po in booking_details.user_po_path" :key="po">
|
||||
<a :href="getURL(po)" target="_blank">
|
||||
<img v-if="isImage(po)" :src="po" class="image" style="max-width: 100%">
|
||||
<p v-else>Download</p>
|
||||
<br/>
|
||||
<br>
|
||||
</a>
|
||||
</div>
|
||||
</el-col>
|
||||
@@ -41,11 +41,11 @@
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12" align="center">
|
||||
<div v-for="cn_bankslip in booking_details.china_bankslip_path" :key='cn_bankslip'>
|
||||
<a target="_blank" :href="getURL(cn_bankslip)">
|
||||
<img v-if="isImage(cn_bankslip)" v-bind:src="cn_bankslip" class="image" style="max-width: 100%">
|
||||
<div v-for="cn_bankslip in booking_details.china_bankslip_path" :key="cn_bankslip">
|
||||
<a :href="getURL(cn_bankslip)" target="_blank">
|
||||
<img v-if="isImage(cn_bankslip)" :src="cn_bankslip" class="image" style="max-width: 100%">
|
||||
<p v-else>Download</p>
|
||||
<br/>
|
||||
<br>
|
||||
</a>
|
||||
</div>
|
||||
</el-col>
|
||||
@@ -54,21 +54,34 @@
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Invoice</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
<div v-if="booking_details.invoice_path[0] !== '/storage/'">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Invoice</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12" align="center">
|
||||
<div v-for="invoice in booking_details.invoice_path" :key="invoice">
|
||||
<a :href="getURL(invoice)" target="_blank">
|
||||
<img v-if="isImage(invoice)" :src="invoice" class="image" style="max-width: 100%">
|
||||
<p v-else>Download</p>
|
||||
<br>
|
||||
</a>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div v-else>
|
||||
<button class="btn btn-success" type="button" @click="onDownloadPO">
|
||||
Download PO
|
||||
</button>
|
||||
<button class="btn btn-primary" type="button" @click="onDownloadDO">
|
||||
Download DO
|
||||
</button>
|
||||
<button class="btn btn-warning" type="button" @click="onDownloadSupplier">
|
||||
Download Supplier PO
|
||||
</button>
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12" align="center">
|
||||
<div v-for="invoice in booking_details.invoice_path" :key='invoice'>
|
||||
<a target="_blank" :href="getURL(invoice)">
|
||||
<img v-if="isImage(invoice)" v-bind:src="invoice" class="image" style="max-width: 100%">
|
||||
<p v-else>Download</p>
|
||||
<br/>
|
||||
</a>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -143,7 +156,7 @@
|
||||
<div class="cell">Beneficiary Account : </div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{booking_details.account_name}}</div>
|
||||
<div class="cell">{{ booking_details.account_name }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
@@ -151,7 +164,7 @@
|
||||
<div class="cell">Beneficiary Account Number : </div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{booking_details.account_num}}</div>
|
||||
<div class="cell">{{ booking_details.account_num }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
@@ -164,14 +177,14 @@
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
<div class="el-table__column-resize-proxy" style="display: none;" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="el-col el-col-12" style="padding-left: 6px; padding-right: 6px;">
|
||||
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition" align="center">
|
||||
<div class="hidden-columns">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div />
|
||||
<div />
|
||||
</div>
|
||||
<!---->
|
||||
<div class="el-table__body-wrapper is-scrolling-none">
|
||||
@@ -207,7 +220,7 @@
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
<div class="cell" />
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
@@ -223,7 +236,7 @@
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
<div class="cell" />
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">
|
||||
@@ -233,10 +246,10 @@
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
<div class="cell" />
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
<div class="cell" />
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
@@ -249,7 +262,7 @@
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
<div class="el-table__column-resize-proxy" style="display: none;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -270,7 +283,7 @@
|
||||
</el-card>
|
||||
</el-row>
|
||||
<br>
|
||||
<el-row justify="center" align="center">
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Supplier Report</span>
|
||||
@@ -278,9 +291,9 @@
|
||||
</div>
|
||||
<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>
|
||||
<canvas v-insert-message="supplier_booking" id="myCanvas" ref="myCanvas"/>
|
||||
<br>
|
||||
<el-button @click="downloadReport()" type="text">Download Now</el-button>
|
||||
<el-button type="text" @click="downloadReport()">Download Now</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
@@ -292,8 +305,8 @@
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<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" style="max-width: 100%">
|
||||
<a :href="getURL(booking_details.user_bankslip_path)" target="_blank" >
|
||||
<img v-if="isImage(booking_details.user_bankslip_path)" :src="booking_details.user_bankslip_path" class="image" style="max-width: 100%">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</el-col>
|
||||
@@ -309,8 +322,8 @@
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<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">
|
||||
<a :href="getURL(booking_details.user_bankslip_path)" target="_blank">
|
||||
<img v-if="isImage(booking_details.user_bankslip_path)" :src="booking_details.user_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</el-col>
|
||||
@@ -336,257 +349,308 @@
|
||||
.image:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
.btn-warning {
|
||||
margin-top: 0.4em !important;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import ProgressTrack from '~/components/AdminProgressTrack'
|
||||
import X2ProgressTrack from '~/components/X2AdminProgressTrack'
|
||||
import axios from 'axios'
|
||||
import ProgressTrack from '~/components/AdminProgressTrack'
|
||||
import X2ProgressTrack from '~/components/X2AdminProgressTrack'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
'progress-track': ProgressTrack,
|
||||
'x2-progress-track': X2ProgressTrack
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
trackerConfig: {
|
||||
status: 8,
|
||||
term: null
|
||||
},
|
||||
supplier_booking:{},
|
||||
loading_btn: false,
|
||||
booking_details: {
|
||||
id: null,
|
||||
amount: null,
|
||||
bia: null,
|
||||
user_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/admin/booking/' + this.$route.params.id + '/details')
|
||||
.then((response) => {
|
||||
this.booking_details = response.data
|
||||
this.trackerConfig.term = response.data.term;
|
||||
loading.close()
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
loading.close()
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
})
|
||||
axios.get('/api/supplier-booking/' + this.$route.params.id)
|
||||
.then((response) => {
|
||||
this.supplier_booking = response.data
|
||||
loading.close()
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
loading.close()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getExtension(path){
|
||||
let index = path.lastIndexOf('.') + 1;
|
||||
return path.slice(index);
|
||||
export default {
|
||||
components: {
|
||||
'progress-track': ProgressTrack,
|
||||
'x2-progress-track': X2ProgressTrack
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
trackerConfig: {
|
||||
status: 8,
|
||||
term: null
|
||||
},
|
||||
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;
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
insertMessage: function (canvasElement, binding) {
|
||||
setTimeout(function (canvasElement, binding) {
|
||||
////////////////// variable //////////////////////////
|
||||
var canvasWidth = 450;
|
||||
var rowHeight = [20, 40, 60, 80, 100, 120, 140, 170, 190, 210, 230, 250, 270, 290, 310, 330, 350, 390,
|
||||
410,
|
||||
470, 490, 510, 610, 630
|
||||
]
|
||||
const canvasHeight = rowHeight[rowHeight.length - 1];
|
||||
|
||||
var column1X = 220;
|
||||
var column2X = 320;
|
||||
var column3X = 420;
|
||||
|
||||
///////////////////Canvast Init////////////////////
|
||||
var canvas = document.getElementById("myCanvas");
|
||||
canvas.width = canvasWidth;
|
||||
canvas.height = canvasHeight;
|
||||
// Get canvas context
|
||||
var ctx = canvasElement.getContext("2d");
|
||||
// Clear the canvas
|
||||
ctx.clearRect(0, 0, 300, 150);
|
||||
|
||||
ctx.fillStyle = "#FFFFFF";
|
||||
ctx.fillRect(0, 0, canvasWidth, rowHeight[0]);
|
||||
for (var i = 1; i < rowHeight.length; i++) {
|
||||
if (i % 2 == 1)
|
||||
ctx.fillStyle = "#A9D08E";
|
||||
else
|
||||
ctx.fillStyle = "#FFFFFF";
|
||||
ctx.fillRect(0, rowHeight[i - 1], canvasWidth, rowHeight[i]);
|
||||
}
|
||||
///////////// fillup with text////////////////
|
||||
//// config canvas
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
ctx.textAlign = "right";
|
||||
//// Row 1
|
||||
ctx.fillText("Ref No. :", column1X, rowHeight[1] - 5);
|
||||
ctx.fillText(binding.value.booking_id, column3X, rowHeight[1] - 5);
|
||||
//// Row 2
|
||||
ctx.fillText("Date :", column1X, rowHeight[2] - 5);
|
||||
ctx.fillText(binding.value.date, column3X, rowHeight[2] - 5);
|
||||
//// Row 3
|
||||
ctx.fillText("Marking :", column1X, rowHeight[3] - 5);
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillStyle = "#0070D5";
|
||||
ctx.fillText(binding.value.marking, column3X, rowHeight[3] - 5);
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
//// Row 4
|
||||
ctx.fillText("Payment For(Order No.) :", column1X, rowHeight[4] - 5);
|
||||
ctx.fillText(binding.value.order_no, column3X, rowHeight[4] - 5);
|
||||
//// Row 4
|
||||
ctx.fillText("Payment For :", column1X, rowHeight[5] - 5);
|
||||
ctx.fillText(binding.value.payment_for, column3X, rowHeight[5] - 5);
|
||||
//// Row 5
|
||||
ctx.fillText("Payment Method :", column1X, rowHeight[6] - 5);
|
||||
ctx.fillText(binding.value.payment_method, column3X, rowHeight[6] - 5);
|
||||
//// Row 6
|
||||
ctx.fillText("Remark :", column1X, rowHeight[7] - 10);
|
||||
//// Row 7
|
||||
// Empty
|
||||
//// Row 8
|
||||
ctx.fillText("MYR/RM :", column1X, rowHeight[9] - 5);
|
||||
ctx.fillText("MYR", column2X, rowHeight[9] - 5);
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText(binding.value.amount_in_myr, column3X, rowHeight[9] - 5);
|
||||
ctx.font = "13px Arial";
|
||||
//// Row 8
|
||||
ctx.fillText("* RATE :", column1X, rowHeight[10] - 5);
|
||||
ctx.fillText(binding.value.rate, column3X, rowHeight[10] - 5);
|
||||
//// Row 9
|
||||
ctx.fillText("REBATE :", column1X, rowHeight[11] - 5);
|
||||
ctx.fillText("MYR", column2X, rowHeight[11] - 5);
|
||||
ctx.font = "14px Arial";
|
||||
ctx.fillText(binding.value.rebate, column3X, rowHeight[11] - 5);
|
||||
ctx.font = "13px Arial";
|
||||
//// Row 10
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText("CNY", column2X, rowHeight[12] - 5);
|
||||
ctx.fillText(binding.value.amountInRMB, column3X, rowHeight[12] - 5);
|
||||
ctx.font = "13px Arial";
|
||||
//line
|
||||
ctx.beginPath();
|
||||
ctx.lineWidth = 1;
|
||||
ctx.moveTo(column1X + 30, rowHeight[11]);
|
||||
ctx.lineTo(column3X + 20, rowHeight[11]);
|
||||
ctx.stroke();
|
||||
ctx.beginPath();
|
||||
ctx.lineWidth = 2;
|
||||
ctx.moveTo(column1X + 30, rowHeight[12]);
|
||||
ctx.lineTo(column3X + 20, rowHeight[12]);
|
||||
ctx.stroke();
|
||||
//// Row 11
|
||||
ctx.fillText("MYR/RM :", column1X, rowHeight[14] - 5);
|
||||
ctx.fillText("MYR", column2X, rowHeight[14] - 5);
|
||||
ctx.fillText(binding.value.amount_in_myr, column3X, rowHeight[14] - 5);
|
||||
//// Row 12
|
||||
// ctx.fillText("Billing(1.0%) :", column1X, rowHeight[15] - 5);
|
||||
// ctx.fillText("MYR", column2X, rowHeight[15] - 5);
|
||||
// ctx.fillText(binding.value.billing_amount, column3X, rowHeight[15] - 5);
|
||||
//// Row 13
|
||||
|
||||
ctx.fillText("+ TAX " + (Math.round((binding.value.tax_rate * 100 - 100) * 100) / 100) + "% :",
|
||||
column1X, rowHeight[16] - 5); // TODO : Change to percentage
|
||||
ctx.fillText("MYR", column2X, rowHeight[16] - 5);
|
||||
ctx.fillText(binding.value.salestax_amount, column3X, rowHeight[16] - 5);
|
||||
// //// Row 14
|
||||
// ctx.fillText("+ GST 6% :", column1X, rowHeight[17] - 15);
|
||||
// ctx.fillText("MYR", column2X, rowHeight[17] - 15);
|
||||
// ctx.fillText("289.84", column3X, rowHeight[17] - 15);
|
||||
//// Row 15
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText("Bank In Amount :", column1X, rowHeight[18] - 5);
|
||||
ctx.fillStyle = "#0070D5";
|
||||
ctx.fillText("MYR", column2X, rowHeight[18] - 5);
|
||||
ctx.fillText(binding.value.amount_after_tax, column3X, rowHeight[18] - 5);
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
//line
|
||||
ctx.lineWidth = 1;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(column1X + 30, rowHeight[17]);
|
||||
ctx.lineTo(column3X + 20, rowHeight[17]);
|
||||
ctx.stroke();
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(column1X + 30, rowHeight[18] + 1);
|
||||
ctx.lineTo(column3X + 20, rowHeight[18] + 1);
|
||||
ctx.stroke();
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(column1X + 30, rowHeight[18] - 2);
|
||||
ctx.lineTo(column3X + 20, rowHeight[18] - 2);
|
||||
ctx.stroke();
|
||||
//// Row 16
|
||||
// ctx.fillText("Rebate :", column1X, rowHeight[19] - 25);
|
||||
// ctx.fillText("CNY", column2X, rowHeight[19] - 25);
|
||||
// ctx.fillText("224.68", column3X, rowHeight[19] - 25);
|
||||
//// Row 16
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText("Bank In to Account Below :", column1X, rowHeight[20] - 5);
|
||||
ctx.font = "bold italic 15px Arial";
|
||||
ctx.fillStyle = "#0070D5";
|
||||
ctx.fillText("CNY", column2X, rowHeight[20] - 5);
|
||||
ctx.fillText(binding.value.amountInRMB, column3X - 20, rowHeight[20] - 5);
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
//// 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
|
||||
|
||||
// img.onload=function(){
|
||||
// ctx.drawImage(img, 50, 530, 80, 50);
|
||||
// };
|
||||
|
||||
// text
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.textAlign = "center";
|
||||
ctx.fillText("China beneficiary Account", column2X - 40, rowHeight[22] - 80);
|
||||
ctx.fillText("户名 : " + binding.value.acc_name, column2X - 40, rowHeight[22] - 60);
|
||||
ctx.fillText(binding.value.acc_no, column2X - 40, rowHeight[22] - 40);
|
||||
ctx.fillText(binding.value.bank_name, column2X - 40, rowHeight[22] - 20);
|
||||
ctx.fillText(binding.value.bank_branch, column2X - 40, rowHeight[22] - 2);
|
||||
|
||||
ctx.font = "13px Arial";
|
||||
}, 1000, canvasElement, binding);
|
||||
|
||||
supplier_booking: {},
|
||||
loading_btn: false,
|
||||
booking_details: {
|
||||
id: null,
|
||||
amount: null,
|
||||
bia: null,
|
||||
user_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/admin/booking/' + this.$route.params.id + '/details')
|
||||
.then((response) => {
|
||||
this.booking_details = response.data
|
||||
this.trackerConfig.term = response.data.term
|
||||
loading.close()
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
loading.close()
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
})
|
||||
axios.get('/api/supplier-booking/' + this.$route.params.id)
|
||||
.then((response) => {
|
||||
this.supplier_booking = response.data
|
||||
loading.close()
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
loading.close()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getExtension (path) {
|
||||
let index = path.lastIndexOf('.') + 1
|
||||
return path.slice(index)
|
||||
},
|
||||
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
|
||||
},
|
||||
onDownloadPO () {
|
||||
const url = '/api/invoice/' + this.booking_details.id + '/po'
|
||||
axios({
|
||||
url: url,
|
||||
method: 'GET',
|
||||
responseType: 'blob' // important
|
||||
}).then(resp => {
|
||||
const url = window.URL.createObjectURL(new Blob([resp.data]))
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.setAttribute('download', 'po.pdf')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
})
|
||||
.catch(err => console.error(JSON.stringify(err)))
|
||||
},
|
||||
onDownloadDO () {
|
||||
const url = '/api/invoice/' + this.booking_details.id + '/do'
|
||||
axios({
|
||||
url: url,
|
||||
method: 'GET',
|
||||
responseType: 'blob' // important
|
||||
}).then(resp => {
|
||||
const url = window.URL.createObjectURL(new Blob([resp.data]))
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.setAttribute('download', 'do.pdf')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
})
|
||||
.catch(err => console.error(JSON.stringify(err)))
|
||||
},
|
||||
onDownloadSupplier () {
|
||||
const url = '/api/invoice/' + this.booking_details.id + '/supplierdo'
|
||||
axios({
|
||||
url: url,
|
||||
method: 'GET',
|
||||
responseType: 'blob' // important
|
||||
}).then(resp => {
|
||||
const url = window.URL.createObjectURL(new Blob([resp.data]))
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.setAttribute('download', 'supplier-do.pdf')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
})
|
||||
.catch(err => console.error(JSON.stringify(err)))
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
insertMessage: function (canvasElement, binding) {
|
||||
setTimeout(function (canvasElement, binding) {
|
||||
// //////////////// variable //////////////////////////
|
||||
var canvasWidth = 450;
|
||||
var rowHeight = [20, 40, 60, 80, 100, 120, 140, 170, 190, 210, 230, 250, 270, 290, 310, 330, 350, 390,
|
||||
410,
|
||||
470, 490, 510, 610, 630
|
||||
]
|
||||
const canvasHeight = rowHeight[rowHeight.length - 1];
|
||||
|
||||
var column1X = 220;
|
||||
var column2X = 320;
|
||||
var column3X = 420;
|
||||
|
||||
// /////////////////Canvast Init////////////////////
|
||||
var canvas = document.getElementById("myCanvas");
|
||||
canvas.width = canvasWidth;
|
||||
canvas.height = canvasHeight;
|
||||
// Get canvas context
|
||||
var ctx = canvasElement.getContext("2d");
|
||||
// Clear the canvas
|
||||
ctx.clearRect(0, 0, 300, 150);
|
||||
|
||||
ctx.fillStyle = "#FFFFFF";
|
||||
ctx.fillRect(0, 0, canvasWidth, rowHeight[0]);
|
||||
for (var i = 1; i < rowHeight.length; i++) {
|
||||
if (i % 2 == 1)
|
||||
ctx.fillStyle = "#A9D08E";
|
||||
else
|
||||
ctx.fillStyle = "#FFFFFF";
|
||||
ctx.fillRect(0, rowHeight[i - 1], canvasWidth, rowHeight[i]);
|
||||
}
|
||||
///////////// fillup with text////////////////
|
||||
//// config canvas
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
ctx.textAlign = "right";
|
||||
//// Row 1
|
||||
ctx.fillText("Ref No. :", column1X, rowHeight[1] - 5);
|
||||
ctx.fillText(binding.value.booking_id, column3X, rowHeight[1] - 5);
|
||||
//// Row 2
|
||||
ctx.fillText("Date :", column1X, rowHeight[2] - 5);
|
||||
ctx.fillText(binding.value.date, column3X, rowHeight[2] - 5);
|
||||
//// Row 3
|
||||
ctx.fillText("Marking :", column1X, rowHeight[3] - 5);
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillStyle = "#0070D5";
|
||||
ctx.fillText(binding.value.marking, column3X, rowHeight[3] - 5);
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
//// Row 4
|
||||
ctx.fillText("Payment For(Order No.) :", column1X, rowHeight[4] - 5);
|
||||
ctx.fillText(binding.value.order_no, column3X, rowHeight[4] - 5);
|
||||
//// Row 4
|
||||
ctx.fillText("Payment For :", column1X, rowHeight[5] - 5);
|
||||
ctx.fillText(binding.value.payment_for, column3X, rowHeight[5] - 5);
|
||||
//// Row 5
|
||||
ctx.fillText("Payment Method :", column1X, rowHeight[6] - 5);
|
||||
ctx.fillText(binding.value.payment_method, column3X, rowHeight[6] - 5);
|
||||
//// Row 6
|
||||
ctx.fillText("Remark :", column1X, rowHeight[7] - 10);
|
||||
//// Row 7
|
||||
// Empty
|
||||
//// Row 8
|
||||
ctx.fillText("MYR/RM :", column1X, rowHeight[9] - 5);
|
||||
ctx.fillText("MYR", column2X, rowHeight[9] - 5);
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText(binding.value.amount_in_myr, column3X, rowHeight[9] - 5);
|
||||
ctx.font = "13px Arial";
|
||||
//// Row 8
|
||||
ctx.fillText("* RATE :", column1X, rowHeight[10] - 5);
|
||||
ctx.fillText(binding.value.rate, column3X, rowHeight[10] - 5);
|
||||
//// Row 9
|
||||
ctx.fillText("REBATE :", column1X, rowHeight[11] - 5);
|
||||
ctx.fillText("MYR", column2X, rowHeight[11] - 5);
|
||||
ctx.font = "14px Arial";
|
||||
ctx.fillText(binding.value.rebate, column3X, rowHeight[11] - 5);
|
||||
ctx.font = "13px Arial";
|
||||
//// Row 10
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText("CNY", column2X, rowHeight[12] - 5);
|
||||
ctx.fillText(binding.value.amountInRMB, column3X, rowHeight[12] - 5);
|
||||
ctx.font = "13px Arial";
|
||||
//line
|
||||
ctx.beginPath();
|
||||
ctx.lineWidth = 1;
|
||||
ctx.moveTo(column1X + 30, rowHeight[11]);
|
||||
ctx.lineTo(column3X + 20, rowHeight[11]);
|
||||
ctx.stroke();
|
||||
ctx.beginPath();
|
||||
ctx.lineWidth = 2;
|
||||
ctx.moveTo(column1X + 30, rowHeight[12]);
|
||||
ctx.lineTo(column3X + 20, rowHeight[12]);
|
||||
ctx.stroke();
|
||||
//// Row 11
|
||||
ctx.fillText("MYR/RM :", column1X, rowHeight[14] - 5);
|
||||
ctx.fillText("MYR", column2X, rowHeight[14] - 5);
|
||||
ctx.fillText(binding.value.amount_in_myr, column3X, rowHeight[14] - 5);
|
||||
//// Row 12
|
||||
// ctx.fillText("Billing(1.0%) :", column1X, rowHeight[15] - 5);
|
||||
// ctx.fillText("MYR", column2X, rowHeight[15] - 5);
|
||||
// ctx.fillText(binding.value.billing_amount, column3X, rowHeight[15] - 5);
|
||||
//// Row 13
|
||||
|
||||
ctx.fillText("+ TAX " + (Math.round((binding.value.tax_rate * 100 - 100) * 100) / 100) + "% :",
|
||||
column1X, rowHeight[16] - 5); // TODO : Change to percentage
|
||||
ctx.fillText("MYR", column2X, rowHeight[16] - 5);
|
||||
ctx.fillText(binding.value.salestax_amount, column3X, rowHeight[16] - 5);
|
||||
// //// Row 14
|
||||
// ctx.fillText("+ GST 6% :", column1X, rowHeight[17] - 15);
|
||||
// ctx.fillText("MYR", column2X, rowHeight[17] - 15);
|
||||
// ctx.fillText("289.84", column3X, rowHeight[17] - 15);
|
||||
//// Row 15
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText("Bank In Amount :", column1X, rowHeight[18] - 5);
|
||||
ctx.fillStyle = "#0070D5";
|
||||
ctx.fillText("MYR", column2X, rowHeight[18] - 5);
|
||||
ctx.fillText(binding.value.amount_after_tax, column3X, rowHeight[18] - 5);
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
//line
|
||||
ctx.lineWidth = 1;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(column1X + 30, rowHeight[17]);
|
||||
ctx.lineTo(column3X + 20, rowHeight[17]);
|
||||
ctx.stroke();
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(column1X + 30, rowHeight[18] + 1);
|
||||
ctx.lineTo(column3X + 20, rowHeight[18] + 1);
|
||||
ctx.stroke();
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(column1X + 30, rowHeight[18] - 2);
|
||||
ctx.lineTo(column3X + 20, rowHeight[18] - 2);
|
||||
ctx.stroke();
|
||||
//// Row 16
|
||||
// ctx.fillText("Rebate :", column1X, rowHeight[19] - 25);
|
||||
// ctx.fillText("CNY", column2X, rowHeight[19] - 25);
|
||||
// ctx.fillText("224.68", column3X, rowHeight[19] - 25);
|
||||
//// Row 16
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.fillText("Bank In to Account Below :", column1X, rowHeight[20] - 5);
|
||||
ctx.font = "bold italic 15px Arial";
|
||||
ctx.fillStyle = "#0070D5";
|
||||
ctx.fillText("CNY", column2X, rowHeight[20] - 5);
|
||||
ctx.fillText(binding.value.amountInRMB, column3X - 20, rowHeight[20] - 5);
|
||||
ctx.fillStyle = "#000000";
|
||||
ctx.font = "13px Arial";
|
||||
//// 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
|
||||
|
||||
// img.onload=function(){
|
||||
// ctx.drawImage(img, 50, 530, 80, 50);
|
||||
// };
|
||||
|
||||
// text
|
||||
ctx.font = "bold 14px Arial";
|
||||
ctx.textAlign = "center";
|
||||
ctx.fillText("China beneficiary Account", column2X - 40, rowHeight[22] - 80);
|
||||
ctx.fillText("户名 : " + binding.value.acc_name, column2X - 40, rowHeight[22] - 60);
|
||||
ctx.fillText(binding.value.acc_no, column2X - 40, rowHeight[22] - 40);
|
||||
ctx.fillText(binding.value.bank_name, column2X - 40, rowHeight[22] - 20);
|
||||
ctx.fillText(binding.value.bank_branch, column2X - 40, rowHeight[22] - 2);
|
||||
|
||||
ctx.font = "13px Arial";
|
||||
}, 1000, canvasElement, binding);
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -247,7 +247,7 @@ export default {
|
||||
const url = window.URL.createObjectURL(new Blob([resp.data]))
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.setAttribute('download', 'po.pdf')
|
||||
link.setAttribute('download', 'do.pdf')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
})
|
||||
|
||||
+1
-1
@@ -140,7 +140,7 @@ Route::group(['middleware' => ['role:admin']], function() {
|
||||
// New routes for invoice
|
||||
|
||||
Route::patch('invoice/{id}/status', 'InvoiceController@updateStatus');
|
||||
Route::get('invoice/{id}/supplierdo', 'InvoiceController@supplierDO');
|
||||
Route::get('invoice/{id}/supplierdo', 'InvoiceController@getSupplierDO');
|
||||
Route::post('invoice/{id}/comment', 'InvoiceController@postStatus');
|
||||
|
||||
Route::get('admin/complete-orders', 'BookingController@adminShowCompletedOrders');
|
||||
|
||||
Reference in New Issue
Block a user