omair/exchange
1
0
Fork 0
mirror of https://gitlab.com/omair-personal/exchange.git synced 2026-08-19 04:24:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix/merge_revert

Browse Source
This commit is contained in:
lonetrinity
2018-07-31 17:04:25 +08:00
parent 0823568cb8
commit 8727f7d9cb
36 changed files with 3101 additions and 3209 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/js/app.js
+17 -17
View File
@@ -11,23 +11,23 @@ import '~/plugins'
import '~/components'
const config = {
errorBagName: 'errors', // change if property conflicts.
fieldsBagName: 'fields',
delay: 0,
// locale: 'zh_CN',
strict: true,
enableAutoClasses: false,
classNames: {
touched: 'touched', // the control has been blurred
untouched: 'untouched', // the control hasn't been blurred
valid: 'valid', // model is valid
invalid: 'invalid', // model is invalid
pristine: 'pristine', // control has not been interacted with
dirty: 'dirty' // control has been interacted with
},
events: 'blur',
inject: true
}
errorBagName: 'errors', // change if property conflicts.
fieldsBagName: 'fields',
delay: 0,
// locale: 'zh_CN',
strict: true,
enableAutoClasses: false,
classNames: {
touched: 'touched', // the control has been blurred
untouched: 'untouched', // the control hasn't been blurred
valid: 'valid', // model is valid
invalid: 'invalid', // model is invalid
pristine: 'pristine', // control has not been interacted with
dirty: 'dirty' // control has been interacted with
},
events: 'blur',
inject: true
};
Vue.config.productionTip = false
resources/assets/js/components/AdminProgressTrack.vue
+2 -2
View File
@@ -3,8 +3,8 @@
<el-steps :value="(value.term === 'x1_ba' || value.term === 'x2_cheque') && value.status > 2 ? value.status - 2 : value.status" :active="(value.term === 'x1_ba' || value.term === 'x2_cheque') && value.status > 2 ? value.status - 2 : value.status" :align-center="true" process-status="wait" finish-status="success">
<el-step title="Booking"/>
<el-step title="Verification"/>
<el-step v-if="!(value.term === 'x1_ba' || value.term === 'x2_cheque')" title="Supplier Booking"/>
<el-step v-if="!(value.term === 'x1_ba' || value.term === 'x2_cheque')" title="Supplier Report"/>
<el-step title="Supplier Booking" v-if="!(value.term === 'x1_ba' || value.term === 'x2_cheque')"/>
<el-step title="Supplier Report" v-if="!(value.term === 'x1_ba' || value.term === 'x2_cheque')"/>
<el-step title="Upload China Bankslip To Booking"/>
<el-step title="Purchase Order/Invoice"/>
<el-step title="Completed"/>
resources/assets/js/components/LocaleDropdown.vue
+107 -105
View File
@@ -1,7 +1,7 @@
<template>
<div>
<ul class="nav navbar-nav">
<!-- <li class="nav-item dropdown">
<div>
<ul class="nav navbar-nav">
<!-- <li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ locales[locale] }}
@@ -13,21 +13,21 @@
</a>
</div>
</li> -->
<ul class="navbar-nav">
<li v-if="(user && role == 'admin')" class="nav-item">
<el-popover v-model="UpdateRatePopoverVisible" placement="top" width="300">
<ul class="navbar-nav">
<li v-if="(user && role == 'admin')" class="nav-item">
<el-popover placement="top" width="300" v-model="UpdateRatePopoverVisible">
<div align="center">
<p>Today's Rate</p>
<p>X1 : Cash: {{ rate.x1_cash }} Cheque: {{ rate.x1_cheque }} BA: {{ rate.x1_ba }}</p>
<p>X2 : Cash: {{ rate.x2_cash }} Cheque: {{ rate.x2_cheque }} BA: {{ rate.x2_ba }}</p>
<p>X1 : Cash: {{rate.x1_cash}} Cheque: {{rate.x1_cheque}} BA: {{rate.x1_ba}}</p>
<p>X2 : Cash: {{rate.x2_cash}} Cheque: {{rate.x2_cheque}} BA: {{rate.x2_ba}}</p>
</div>
<div style="text-align: center; margin: 0">
<el-button type="primary" size="mini" @click="UpdateRatePopoverVisible = false; UpdateRateDialogVisible = true">Update rate</el-button>
</div>
<a slot="reference" class="nav-link" href="#" role="button">Update Rate</a>
</el-popover>
</li>
</ul>
<a class="nav-link" href="#" role="button" slot="reference">Update Rate</a>
</el-popover>
</li>
</ul>
<li v-if="(user && role == 'admin')" class="nav-item">
<router-link :to="{ name: 'admin.transaction-history' }" class="nav-link">
{{ $t('Transaction History') }}
@@ -38,35 +38,35 @@
{{ $t('Completed Orders') }}
</router-link>
</li>
</ul>
<!-- update rate dialog start -->
<el-dialog :visible.sync="UpdateRateDialogVisible" align="center" width="900px">
<el-form ref="rate" :inline="true" :model="rate" :rules="rules" align="center">
</ul>
<!-- update rate dialog start -->
<el-dialog align="center" :visible.sync="UpdateRateDialogVisible" width="900px">
<el-form :inline="true" align="center" ref="rate" :model="rate" :rules="rules">
<el-form-item prop="x1_cash" >X1: &nbsp;&nbsp;&nbsp;Cash : <el-input v-model.number="rate.x1_cash" style="width:60%" /></el-form-item>
<el-form-item prop="x1_cheque" >Cheque : <el-input v-model.number="rate.x1_cheque" style="width:60%"/></el-form-item>
<el-form-item prop="x1_ba">BA : <el-input v-model.number="rate.x1_ba" style="width:60%"/></el-form-item>
<el-form-item prop="x1_cash" >X1: &nbsp;&nbsp;&nbsp;Cash : <el-input v-model.number="rate.x1_cash" style=width:60% ></el-input></el-form-item>
<el-form-item prop="x1_cheque" >Cheque : <el-input v-model.number="rate.x1_cheque" style=width:60%></el-input></el-form-item>
<el-form-item prop="x1_ba">BA : <el-input v-model.number="rate.x1_ba" style=width:60%></el-input></el-form-item>
<br>
<el-form-item prop="x2_cash" >X2: &nbsp;&nbsp;&nbsp;Cash : <el-input v-model.number="rate.x2_cash" style="width:60%" /></el-form-item>
<el-form-item prop="x2_cheque" >Cheque : <el-input v-model.number="rate.x2_cheque" style="width:60%"/></el-form-item>
<el-form-item prop="x2_ba" >BA : <el-input v-model.number="rate.x2_ba" style="width:60%"/></el-form-item>
</el-form>
<br>
<div align="center">
<el-form-item prop="x2_cash" >X2: &nbsp;&nbsp;&nbsp;Cash : <el-input v-model.number="rate.x2_cash" style=width:60% ></el-input></el-form-item>
<el-form-item prop="x2_cheque" >Cheque : <el-input v-model.number="rate.x2_cheque" style=width:60%></el-input></el-form-item>
<el-form-item prop="x2_ba" >BA : <el-input v-model.number="rate.x2_ba" style=width:60%></el-input></el-form-item>
</el-form>
<br>
<div align="center">
<el-button type="text" @click="UpdateRateDialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="updateRate('rate'); UpdateRateDialogVisible = false; DoneUpdateRateDialogVisible = true" >Save</el-button>
</div>
</el-dialog>
<!-- update rate dialog done -->
</div>
</el-dialog>
<!-- update rate dialog done -->
<el-dialog :visible.sync="DoneUpdateRateDialogVisible" align="center" width="30%">
<span>Rate Successfully Updated</span><br><br>
<div align="center">
<el-dialog align="center" :visible.sync="DoneUpdateRateDialogVisible" width="30%">
<span>Rate Successfully Updated</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneUpdateRateDialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- update rate dialog done end -->
</div>
</div>
</el-dialog>
<!-- update rate dialog done end -->
</div>
</template>
<script>
@@ -75,28 +75,28 @@ import { loadMessages } from '~/plugins/i18n'
import axios from 'axios'
export default {
data () {
data() {
return {
UpdateRatePopoverVisible: false,
UpdateRateDialogVisible: false,
DoneUpdateRateDialogVisible: false,
rate: {
x1_ba: null,
x1_cheque: null,
x1_cash: null,
x2_ba: null,
x2_cash: null,
x2_cheque: null
},
UpdateRatePopoverVisible: false,
UpdateRateDialogVisible: false,
DoneUpdateRateDialogVisible: false,
rate: {
x1_ba: null,
x1_cheque: null,
x1_cash: null,
x2_ba: null,
x2_cash: null,
x2_cheque: null,
},
rules: {
x1_cash: [
{ required: true, message: 'Please input rate for X1 Cash', trigger: 'change'},
{ type: 'number', message: 'Rate must be a number'}
],
],
x1_cheque: [
{ required: true, message: 'Please input rate for X1 Cheque', trigger: 'change'},
{ type: 'number', message: 'Rate must be a number'}
],
],
x1_ba: [
{ required: true, message: 'Please input rate for X1 BA', trigger: 'change'},
{ type: 'number', message: 'Rate must be a number'}
@@ -104,17 +104,17 @@ export default {
x2_cash: [
{ required: true, message: 'Please input rate for X2 Cash', trigger: 'change'},
{ type: 'number', message: 'Rate must be a number'}
],
],
x2_cheque: [
{ required: true, message: 'Please input rate for X2 Cheque', trigger: 'change'},
{ type: 'number', message: 'Rate must be a number'}
],
],
x2_ba: [
{ required: true, message: 'Please input rate for X2 BA', trigger: 'change'},
{ type: 'number', message: 'Rate must be a number'}
]
}
}
}
},
computed: mapGetters({
locale: 'lang/locale',
@@ -123,7 +123,7 @@ export default {
role: 'auth/role'
}),
mounted () {
this.getRate()
this.getRate();
},
methods: {
setLocale (locale) {
@@ -133,52 +133,22 @@ export default {
this.$store.dispatch('lang/setLocale', { locale })
}
},
getRate () {
getRate() {
let $this = this
axios.get('/api/rate').then(response => {
this.rate = response.data
})
},
createRate: function () { // TODO : we do not have create rate, only update rate. Delete this ?
createRate: function () { // TODO : we do not have create rate, only update rate. Delete this ?
this.loading = true,
this.dialogFormVisible1 = true
let newRate = {
x1_cash: this.rateForm.x1_cash,
x1_cheque: this.rateForm.x1_cheque,
x1_ba: this.rateForm.x1_ba,
x2_cash: this.rateForm.x2_cash,
x2_cheque: this.rateForm.x2_cheque,
x2_ba: this.rateForm.x2_ba
}
axios.post('/api/update-rate', newRate)
.then((response) => {
this.loading = false
this.rate = response.data
})
.catch((error) => {
console.log(error)
this.loading = false
this.$message({
showClose: true,
message: 'Error : All rate must be inserted',
type: 'error',
duration: 10000
})
})
},
updateRate (formName) {
this.loading = true
this.$refs[formName].validate((valid) => {
if (valid) {
let newRate = {
x1_cash: this.rate.x1_cash,
x1_cheque: this.rate.x1_cheque,
x1_ba: this.rate.x1_ba,
x2_cash: this.rate.x2_cash,
x2_cheque: this.rate.x2_cheque,
x2_ba: this.rate.x2_ba
x1_cash: this.rateForm.x1_cash,
x1_cheque: this.rateForm.x1_cheque,
x1_ba: this.rateForm.x1_ba,
x2_cash: this.rateForm.x2_cash,
x2_cheque: this.rateForm.x2_cheque,
x2_ba: this.rateForm.x2_ba
}
axios.post('/api/update-rate', newRate)
@@ -186,6 +156,37 @@ export default {
this.loading = false
this.rate = response.data
})
.catch((error) => {
console.log(error)
this.loading = false
this.$message({
showClose: true,
message: 'Error : All rate must be inserted',
type: 'error',
duration: 10000
})
})
},
updateRate(formName) {
this.loading = true
this.$refs[formName].validate((valid) => {
if (valid) {
let newRate = {
x1_cash: this.rate.x1_cash,
x1_cheque: this.rate.x1_cheque,
x1_ba: this.rate.x1_ba,
x2_cash: this.rate.x2_cash,
x2_cheque: this.rate.x2_cheque,
x2_ba: this.rate.x2_ba,
}
axios.post('/api/update-rate', newRate)
.then((response) => {
this.loading = false
this.rate = response.data
})
.catch((error) => {
this.loading = false
this.$message({
@@ -195,20 +196,21 @@ export default {
duration: 10000
})
})
} else {
this.loading = false
DoneUpdateRateDialogVisible = false
UpdateRateDialogVisible = true
this.$message({
showClose: true,
message: 'Please fill the form',
type: 'error',
duration: 10000
})
}
})
}
}
} else {
this.loading = false
DoneUpdateRateDialogVisible = false
UpdateRateDialogVisible = true
this.$message({
showClose: true,
message: 'Please fill the form',
type: 'error',
duration: 10000
})
}
})
},
}
}
</script>
resources/assets/js/components/Navbar.vue
+1 -1
View File
@@ -23,7 +23,7 @@
</el-badge>
<el-dropdown-menu slot="dropdown">
<div id="notification">
<div v-for="(item,index) in notification" :key="item.id">
<div v-for="(item, index) in notification" :key="item.id">
<a v-on:click.prevent='readNotification(item.id);navigateTo(item.link)'>
<el-dropdown-item>
<b v-if="item.is_read == 0">
resources/assets/js/components/ProgressTrack.vue
+3 -3
View File
@@ -1,6 +1,6 @@
<template>
<el-row>
<el-steps :value="value" :active="value" :align-center="true" class="progressBar" process-status="wait" finish-status="success">
<el-steps class="progressBar" :value="value" :active="value" :align-center="true" process-status="wait" finish-status="success">
<el-step title="Booking"/>
<el-step title="Payment"/>
<el-step title="Order Confirmation"/>
@@ -17,9 +17,9 @@
.progressBar {
width: 60%;
}
}
/*
.el-steps {
padding-top: 70px;
resources/assets/js/pages/admin/booking/bookingDetail.vue
+60 -59
View File
@@ -3,9 +3,9 @@
<progress-track v-model="trackerConfig" />
<div align="center">
<h4 style="margin-top:5%;"/>
<h4 style="margin-top:5%;"></h4>
<h5>Waiting User Upload Bank Slip</h5>
<br>
<br/>
<el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
</div>
<br>
@@ -63,7 +63,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">
@@ -71,7 +71,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>
<!---->
@@ -84,14 +84,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -127,7 +127,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -143,7 +143,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">
@@ -153,10 +153,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"> </div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"> </div>
</td>
</tr>
<!---->
@@ -169,7 +169,7 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -210,53 +210,54 @@
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
export default {
components: {
'progress-track': ProgressTrack
},
data () {
return {
trackerConfig: {
status: 1,
term: null
},
loading_btn: false,
rejectDialogVisible: false,
reject_reason: null,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
},
estimated_arrival_time: 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)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term
console.log(this.booking_details)
loading.close()
}).catch((error) => {
console.log(error)
loading.close()
this.$router.push({
name: 'notfound'
})
export default {
components: {
'progress-track': ProgressTrack
},
data() {
return {
trackerConfig :{
status: 1,
term: null
},
loading_btn: false,
rejectDialogVisible: false,
reject_reason: null,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
},
estimated_arrival_time: 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)
.then((response) => {
this.booking_details = response.data;
this.trackerConfig.term = response.data.term;
console.log(this.booking_details);
loading.close()
}).catch((error) => {
console.log(error)
loading.close()
this.$router.push({
name: 'notfound'
})
})
},
}
}
</script>
</script>
resources/assets/js/pages/admin/booking/completed.vue
+42 -42
View File
@@ -20,8 +20,8 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12" align="center">
<a :href="getURL(booking_details.user_po_path)" target="_blank">
<img v-if="isImage(booking_details.user_po_path)" :src="booking_details.user_po_path" class="image">
<a target="_blank" :href="getURL(booking_details.user_po_path)">
<img v-if="isImage(booking_details.user_po_path)" v-bind:src="booking_details.user_po_path" class="image">
<p v-else>Download</p>
</a>
</el-col>
@@ -37,11 +37,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 :href="getURL(cn_bankslip)" target="_blank">
<img v-if="isImage(cn_bankslip)" :src="cn_bankslip" class="image">
<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">
<p v-else>Download</p>
<br>
<br/>
</a>
</div>
</el-col>
@@ -56,8 +56,8 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12" align="center">
<a :href="getURL(booking_details.invoice_path)" target="_blank">
<img v-if="isImage(booking_details.invoice_path)" :src="booking_details.invoice_path" class="image">
<a target="_blank" :href="getURL(booking_details.invoice_path)">
<img v-if="isImage(booking_details.invoice_path)" v-bind:src="booking_details.invoice_path" class="image">
<p v-else>Download</p>
</a>
</el-col>
@@ -66,7 +66,7 @@
</el-col>
</el-row>
<br>
<!-- bank slips END -->
<!-- bank slips END -->
<el-row justify="center" align="center">
<el-card class="box-card">
@@ -91,7 +91,7 @@
<div class="el-row" style="margin-left: -6px; margin-right: -6px;">
<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="el-table__body-wrapper is-scrolling-none">
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
<colgroup>
@@ -136,7 +136,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">
@@ -144,7 +144,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>
<!---->
@@ -157,14 +157,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -200,7 +200,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -216,7 +216,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"><b>MYR {{ booking_details.bia }}</b></div>
@@ -224,10 +224,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"></div>
</td>
</tr>
<!---->
@@ -240,7 +240,7 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -270,8 +270,8 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<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">
<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>
</el-col>
@@ -307,17 +307,17 @@ export default {
},
data () {
return {
trackerConfig: {
status: 8,
term: null
},
trackerConfig :{
status: 8,
term: null
},
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
}
booking_details:{
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
}
}
},
beforeCreate () {
@@ -332,7 +332,7 @@ export default {
.get('/api/admin/booking/' + this.$route.params.id)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term
this.trackerConfig.term = response.data.term;
loading.close()
}).catch((error) => {
console.log(error)
@@ -343,17 +343,17 @@ export default {
})
},
methods: {
getExtension (path) {
return path.slice(-3)
getExtension(path){
return path.slice(-3);
},
isImage (path) {
var ext = this.getExtension(path)
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png'
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
getURL(path){
var getUrl = window.location;
var baseUrl = getUrl.protocol + "//" + getUrl.host;
return baseUrl + path;
}
}
}
resources/assets/js/pages/admin/booking/supplierBooking.vue
+126 -121
View File
@@ -3,7 +3,7 @@
<progress-track v-model="trackerConfig" />
<div align="center">
<h4 style="margin-top:5%;"/>
<h4 style="margin-top:5%;"></h4>
<br>
<h5> Supplier Booking </h5>
<br>
@@ -64,7 +64,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">
@@ -72,7 +72,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>
<!---->
@@ -85,14 +85,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -128,7 +128,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -144,7 +144,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">
@@ -154,10 +154,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"></div>
</td>
</tr>
<!---->
@@ -170,7 +170,7 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -204,8 +204,9 @@
<el-form ref="supplierBookingForm" :model="supplierBookingForm" :rules="rules">
<div align="center">
<el-form-item prop="supplier">
<el-select v-model="supplierBookingForm.supplier" prop="supplier" placeholder="Choose Supplier">
<el-option v-for="item in supplier_options" :key="item.value" :label="item.label" :value="item.value"/>
<el-select prop="supplier" v-model="supplierBookingForm.supplier" placeholder="Choose Supplier">
<el-option v-for="item in supplier_options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
@@ -235,133 +236,137 @@
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
export default {
components: {
'progress-track': ProgressTrack
},
data () {
return {
trackerConfig: {
status: 3,
term: null
},
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
},
supplier: null,
supplier_options: null,
supplierBookingForm: {
export default {
components: {
'progress-track': ProgressTrack
},
data() {
return {
trackerConfig :{
status: 3,
term: null
},
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
},
supplier: null,
rebate: null,
rate: null,
transfer_amount: null
},
value: '',
rules: {
supplier: [{
required: true,
message: 'Please select a supplier',
trigger: 'change'
}],
rebate: [{
required: true,
message: 'Please input rebate amount',
trigger: 'change'
}],
rate: [{
required: true,
message: 'Please input rate',
trigger: 'change'
}],
transfer_amount: [{
required: true,
message: 'Please input payment amount',
trigger: 'change'
}]
supplier_options: null,
supplierBookingForm: {
supplier: null,
rebate: null,
rate: null,
transfer_amount: null,
},
value: '',
rules: {
supplier: [{
required: true,
message: 'Please select a supplier',
trigger: 'change'
}],
rebate: [{
required: true,
message: 'Please input rebate amount',
trigger: 'change'
}],
rate: [{
required: true,
message: 'Please input rate',
trigger: 'change'
}],
transfer_amount: [{
required: true,
message: 'Please input payment amount',
trigger: 'change'
}]
},
}
}
},
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)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term
}).catch((error) => {
console.log(error)
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)'
})
axios
.get('/api/setting-supplier/')
.then((response) => {
loading.close()
this.supplier_options = response.data
}).catch((error) => {
loading.close()
console.log(error)
this.$router.push({
name: 'notfound'
axios
.get('/api/admin/booking/' + this.$route.params.id)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term;
}).catch((error) => {
console.log(error)
this.$router.push({
name: 'notfound'
})
})
})
},
methods: {
generateReport (formName) {
this.loading_btn = true
this.$refs[formName].validate((valid) => {
if (valid) {
let newReport = {
booking_id: this.$route.params.id,
supplier_id: this.supplierBookingForm.supplier,
rebate: this.supplierBookingForm.rebate,
rate: this.supplierBookingForm.rate
// transfer_amount: this.supplierBookingForm.transfer_amount,
}
axios
.get('/api/setting-supplier/')
.then((response) => {
loading.close()
this.supplier_options = response.data
}).catch((error) => {
loading.close()
console.log(error)
this.$router.push({
name: 'notfound'
})
})
axios.post('/api/supplier-booking', newReport)
},
methods: {
generateReport(formName) {
this.loading_btn = true
this.$refs[formName].validate((valid) => {
if (valid) {
let newReport = {
booking_id: this.$route.params.id,
supplier_id: this.supplierBookingForm.supplier,
rebate: this.supplierBookingForm.rebate,
rate: this.supplierBookingForm.rate,
//transfer_amount: this.supplierBookingForm.transfer_amount,
}
axios.post('/api/supplier-booking', newReport)
.then((response) => {
this.loading_btn = false
this.$router.push({
name: 'booking.admin.supplier.report',
params: {id: this.$route.params.id }
})
// redirect to supplier report
// redirect to supplier report
})
.catch((error) => {
this.loading_btn = false
console.log(error)
// TODO : Show error message
// TODO : Show error message
})
} else {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Please fill the supplier form',
type: 'error',
duration: 10000
})
}
})
} else {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Please fill the supplier form',
type: 'error',
duration: 10000
})
}
})
},
}
}
}
</script>
</script>
resources/assets/js/pages/admin/booking/supplierReport.vue
+315 -310
View File
@@ -3,7 +3,7 @@
<progress-track v-model="trackerConfig" />
<div align="center">
<h4 style="margin-top:5%;"/>
<h4 style="margin-top:5%;"></h4>
<br>
<h5>Supplier Report</h5>
<br>
@@ -64,7 +64,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">
@@ -72,7 +72,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>
<!---->
@@ -85,14 +85,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -128,7 +128,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -144,7 +144,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">
@@ -154,10 +154,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"></div>
</td>
</tr>
<!---->
@@ -170,7 +170,7 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -200,9 +200,9 @@
</div>
<el-row :gutter="12" style="text-align:center">
<el-col :span="20" style="text-align:center">
<canvas v-insert-message="supplier_booking" id="myCanvas" ref="myCanvas"/>
<canvas id="myCanvas" ref="myCanvas" v-insert-message="supplier_booking"></canvas>
<br>
<el-button type="text" @click="downloadReport()">Download Now</el-button>
<el-button @click="downloadReport()" type="text">Download Now</el-button>
</el-col>
</el-row>
</el-card>
@@ -214,8 +214,8 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<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">
<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>
</el-col>
@@ -225,8 +225,8 @@
<el-card class="box-card">
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<el-button :loading="loading_btn" type="primary" @click="goToSupplierBooking">Edit</el-button>
<el-button :loading="loading_btn" type="success" @click="completeReport">Done</el-button>
<el-button :loading="loading_btn" @click="goToSupplierBooking" type="primary">Edit</el-button>
<el-button :loading="loading_btn" @click="completeReport" type="success">Done</el-button>
</el-col>
</el-row>
</el-card>
@@ -250,308 +250,313 @@
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import Canvas2Image from 'canvas2image'
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import Canvas2Image from 'canvas2image'
export default {
components: {
'progress-track': ProgressTrack
},
directives: {
insertMessage: function (canvasElement, binding) {
export default {
components: {
'progress-track': ProgressTrack
},
data() {
return {
trackerConfig :{
status: 4,
term: null
},
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
},
supplier_booking:{
},
active_bank_setting: {
x1_bank_id: null,
x2_bank_id: null,
beneficiary_id: null
},
beneficiaryDetail:{
company_name: '奕继椿',
bank_name: '民生银行 深川红荔支行',
acc_no: '123456789',
},
supplier: null,
supplier_options: null,
exampleContent: "This is TEXT"
}
},
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)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term;
}).catch((error) => {
console.log(error)
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: {
downloadReport(){
let canvas = document.getElementById('myCanvas')
var dataString = canvas.toDataURL("image/png");
var link = document.createElement("a");
link.download = 'image';
link.href = dataString;
link.click();
},
goToSupplierBooking(){
this.$router.push({
name: 'booking.admin.supplier',
params: this.$route.params.id
})
},
completeReport() {
// TODO : send request to change status
this.loading_btn = true
axios
.post('/api/booking/' + this.$route.params.id + '/confirm-supplier')
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success, please comeback after getting china bankslip',
type: 'success',
duration: 5000
})
this.$router.push({
name: 'home'
})
//this.booking_details = response.data
}).catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Suceess',
type: 'success',
duration: 5000
})
})
this.$router.push({
name: 'booking.admin.cnslip',
params: {
id: this.$route.params.id
}
})
},
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;
}
},
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]
////////////////// 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
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)
///////////////////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.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
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(){
// 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.font = '13px Arial'
}, 1000, canvasElement, binding)
// 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.font = "13px Arial";
}, 1000,canvasElement,binding);
}
}
},
data () {
return {
trackerConfig: {
status: 4,
term: null
},
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
},
supplier_booking: {
},
active_bank_setting: {
x1_bank_id: null,
x2_bank_id: null,
beneficiary_id: null
},
beneficiaryDetail: {
company_name: '奕继椿',
bank_name: '民生银行 深川红荔支行',
acc_no: '123456789'
},
supplier: null,
supplier_options: null,
exampleContent: 'This is TEXT'
}
},
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)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term
}).catch((error) => {
console.log(error)
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: {
downloadReport () {
let canvas = document.getElementById('myCanvas')
var dataString = canvas.toDataURL('image/png')
var link = document.createElement('a')
link.download = 'image'
link.href = dataString
link.click()
},
goToSupplierBooking () {
this.$router.push({
name: 'booking.admin.supplier',
params: this.$route.params.id
})
},
completeReport () {
// TODO : send request to change status
this.loading_btn = true
axios
.post('/api/booking/' + this.$route.params.id + '/confirm-supplier')
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success, please comeback after getting china bankslip',
type: 'success',
duration: 5000
})
this.$router.push({
name: 'home'
})
// this.booking_details = response.data
}).catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Suceess',
type: 'success',
duration: 5000
})
})
this.$router.push({
name: 'booking.admin.cnslip',
params: {
id: this.$route.params.id
}
})
},
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>
resources/assets/js/pages/admin/booking/uploadChinaBankslip.vue
+94 -164
View File
@@ -3,7 +3,7 @@
<progress-track v-model="trackerConfig" />
<div align="center">
<h4 style="margin-top:5%;"/>
<h4 style="margin-top:5%;"></h4>
<br>
<h5> Upload China Bankslip To Customer </h5>
<br>
@@ -64,7 +64,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">
@@ -72,7 +72,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>
<!---->
@@ -85,14 +85,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -128,7 +128,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -144,7 +144,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">
@@ -154,10 +154,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"></div>
</td>
</tr>
<!---->
@@ -170,7 +170,7 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -205,18 +205,18 @@
<div align="center">
<!-- upload image -->
<el-upload :action="'/api/booking/' + booking_id + '/upload-china-bankslip'" :on-preview="handlePreview"
:on-error="uploadError"
:on-remove="handleRemove"
:multiple="false"
class="upload-demo" accept=".jpeg, .jpg, .png, .bmp, .doc, .docx, .xls, .xlsx, .pdf" list-type="picture">
<el-upload class="upload-demo" :action="'/api/booking/' + booking_id + '/upload-china-bankslip'"
:on-preview="handlePreview"
:on-error="uploadError"
accept=".jpeg, .jpg, .png, .bmp, .doc, .docx, .xls, .xlsx, .pdf"
:on-remove="handleRemove" :multiple="false" list-type="picture">
<el-button size="small" type="primary">Click to upload</el-button>
<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>
<br>
<!-- upload image end -->
<!-- <el-form-item prop="date">
<!-- <el-form-item prop="date">
<el-date-picker v-model="chinaSlipForm.date" type="date" placeholder="Pick a day" :picker-options="pickerOptions1">
</el-date-picker>
</el-form-item> -->
@@ -244,52 +244,9 @@
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
<<<<<<< HEAD
export default {
components: {
'progress-track': ProgressTrack
},
data () {
return {
trackerConfig: {
status: 5,
term: null
},
loading_btn: false,
booking_id: this.$route.params.id,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
},
supplier: null,
supplier_options: null,
chinaSlipForm: {
actual_transfer_amount: null,
// date: null,
details: null
},
rules: {
actual_transfer_amount: [{
required: true,
message: 'Please input transfer amount',
trigger: 'change'
}]
// date: [{
// required: true,
// message: 'Please input date',
// trigger: 'change'
// }],
// details: [{
// required: true,
// message: 'Please input details',
// trigger: 'change'
// }]
=======
export default {
components: {
'progress-track': ProgressTrack
@@ -355,112 +312,85 @@ export default {
// }
// }]
// }
>>>>>>> efa9ed6c91b98b6889eebd459e952a75a6c68708
}
// pickerOptions1: {
// disabledDate(time) {
// return time.getTime() > Date.now();
// },
// shortcuts: [{
// text: 'Today',
// onClick(picker) {
// picker.$emit('pick', new Date());
// }
// }, {
// text: 'Yesterday',
// onClick(picker) {
// const date = new Date();
// date.setTime(date.getTime() - 3600 * 1000 * 24);
// picker.$emit('pick', date);
// }
// }, {
// text: 'A week ago',
// onClick(picker) {
// const date = new Date();
// date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
// picker.$emit('pick', date);
// }
// }]
// }
}
},
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)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term
loading.close()
}).catch((error) => {
loading.close()
console.log(error)
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: {
submitChinaSlip (formName) {
this.loading_btn = true
this.$refs[formName].validate((valid) => {
if (valid) {
let newChinaSlip = {
date: this.chinaSlipForm.date,
actual_transfer_amount: this.chinaSlipForm.actual_transfer_amount,
details: this.chinaSlipForm.details
}
axios.patch('/api/booking/' + this.booking_id + '/update-china-bankslip', newChinaSlip)
.then((response) => {
this.$message({
showClose: true,
message: 'Your bankinslip has been submitted, please wait customer to upload their purchase order',
type: 'success',
duration: 5000
})
console.log(response)
this.$router.push({
name: 'home'
})
})
.catch((error) => {
console.log(error)
this.loading_btn = false
this.$message({
showClose: true,
message: 'Please upload your bankin slip first.',
type: 'warning',
duration: 10000
})
})
} else {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Please upload your bankin slip first.',
type: 'warning',
duration: 10000
axios
.get('/api/admin/booking/' + this.$route.params.id)
.then((response) => {
this.booking_details = response.data
this.trackerConfig.term = response.data.term;
loading.close()
}).catch((error) => {
loading.close()
console.log(error)
this.$router.push({
name: 'notfound'
})
}
})
})
},
handleRemove (file, fileList) {
console.log(file, fileList)
},
handlePreview (file) {
console.log(file)
},
uploadError (file, fileList) {
this.$message.warning(`Incorrect file format or file size too big.`)
methods: {
submitChinaSlip(formName) {
this.loading_btn = true
this.$refs[formName].validate((valid) => {
if (valid) {
let newChinaSlip = {
date: this.chinaSlipForm.date,
actual_transfer_amount: this.chinaSlipForm.actual_transfer_amount,
details: this.chinaSlipForm.details,
}
axios.patch('/api/booking/' + this.booking_id +'/update-china-bankslip', newChinaSlip)
.then((response) => {
this.$message({
showClose: true,
message: 'Your bankinslip has been submitted, please wait customer to upload their purchase order',
type: 'success',
duration: 5000
})
console.log(response)
this.$router.push({
name: 'home'
})
})
.catch((error) => {
console.log(error)
this.loading_btn = false
this.$message({
showClose: true,
message: 'Please upload your bankin slip first.',
type: 'warning',
duration: 10000
})
})
} else {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Please upload your bankin slip first.',
type: 'warning',
duration: 10000
})
}
})
},
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
uploadError(file,fileList){
this.$message.warning(`Incorrect file format or file size too big.`)
}
}
}
}
</script>
</script>
resources/assets/js/pages/admin/booking/uploadInvoice.vue
+138 -138
View File
@@ -3,7 +3,7 @@
<progress-track v-model="trackerConfig" />
<div align="center">
<h4 style="margin-top:5%;"/>
<h4 style="margin-top:5%;"></h4>
<br>
<div v-if="booking_details.user_po_path">
<h4>Upload Invoice</h4>
@@ -71,7 +71,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">
@@ -79,7 +79,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>
<!---->
@@ -92,14 +92,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -135,7 +135,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -151,7 +151,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">
@@ -161,10 +161,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"></div>
</td>
</tr>
<!---->
@@ -173,7 +173,7 @@
<!---->
<!---->
</div>
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -183,7 +183,7 @@
<el-row v-if="booking_details.user_po_path" :gutter="12" justify="center" align="center">
<el-col :span="12">
<el-card class="box-card">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>Upload Invoice</span>
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
@@ -221,8 +221,8 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12" align="center">
<a :href="getURL(booking_details.user_po_path)" target="_blank">
<img v-if="isImage(booking_details.user_po_path)" :src="booking_details.user_po_path" class="image">
<a target="_blank" :href="getURL(booking_details.user_po_path)">
<img v-if="isImage(booking_details.user_po_path)" v-bind:src="booking_details.user_po_path" class="image">
<p v-else>Download</p>
</a>
</el-col>
@@ -249,102 +249,102 @@
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
export default {
components: {
'progress-track': ProgressTrack
},
data () {
return {
trackerConfig: {
status: 6,
term: null
},
loading_btn: false,
booking_id: this.$route.params.id,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
},
supplier: null,
supplier_options: null,
chinaSlipForm: {
actual_transfer_amount: null,
date: null,
details: null
},
rules: {
actual_transfer_amount: [{
required: true,
message: 'Please input amount',
trigger: 'change'
}],
date: [{
required: true,
message: 'Please input bank name',
trigger: 'change'
}],
details: [{
required: true,
message: 'Please input details',
trigger: 'change'
}]
},
pickerOptions1: {
disabledDate (time) {
return time.getTime() > Date.now()
export default {
components: {
'progress-track': ProgressTrack
},
data() {
return {
trackerConfig :{
status: 6,
term: null
},
shortcuts: [{
text: 'Today',
onClick (picker) {
picker.$emit('pick', new Date())
}
}, {
text: 'Yesterday',
onClick (picker) {
const date = new Date()
date.setTime(date.getTime() - 3600 * 1000 * 24)
picker.$emit('pick', date)
}
}, {
text: 'A week ago',
onClick (picker) {
const date = new Date()
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', date)
}
}]
loading_btn: false,
booking_id: this.$route.params.id,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
},
supplier: null,
supplier_options: null,
chinaSlipForm: {
actual_transfer_amount: null,
date: null,
details: null,
},
rules: {
actual_transfer_amount: [{
required: true,
message: 'Please input amount',
trigger: 'change'
}],
date: [{
required: true,
message: 'Please input bank name',
trigger: 'change'
}],
details: [{
required: true,
message: 'Please input details',
trigger: 'change'
}]
},
pickerOptions1: {
disabledDate(time) {
return time.getTime() > Date.now();
},
shortcuts: [{
text: 'Today',
onClick(picker) {
picker.$emit('pick', new Date());
}
}, {
text: 'Yesterday',
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
picker.$emit('pick', date);
}
}, {
text: 'A week ago',
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit('pick', date);
}
}]
}
}
}
},
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)
.then((response) => {
loading.close()
this.booking_details = response.data
this.trackerConfig.term = response.data.term
}).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: {
confirmInvoice () {
axios
.get('/api/admin/booking/' + this.$route.params.id)
.then((response) => {
loading.close()
this.booking_details = response.data
this.trackerConfig.term = response.data.term;
}).catch((error) => {
console.log(error)
loading.close()
this.$router.push({
name: 'notfound'
})
})
},
methods: {
confirmInvoice () {
this.loading_btn = true
axios
.post('/api/booking/' + this.$route.params.id + '/confirm-invoice')
@@ -361,40 +361,40 @@ export default {
})
this.loading_btn = false
}).catch((error) => {
this.$message({
showClose: true,
message: 'Please upload invoice',
type: 'error',
duration: 30000
})
this.$message({
showClose: true,
message: 'Please upload invoice',
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 (file) {
console.log(file)
},
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
handleRemove(file, fileList) {
console.log(file, fileList);
// Should send some reqeust to controller to delete the file
},
handlePreview(file) {
console.log(file);
},
handleExceed(file){
console.log(file)
},
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>
resources/assets/js/pages/admin/booking/verification.vue
+134 -132
View File
@@ -3,7 +3,7 @@
<progress-track v-model="trackerConfig" />
<div align="center">
<h4 style="margin-top:5%;"/>
<h4 style="margin-top:5%;"></h4>
<br>
<h5> Verify User Bankslip </h5>
<br>
@@ -66,7 +66,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">
@@ -74,7 +74,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>
<!---->
@@ -87,14 +87,14 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</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">
@@ -130,7 +130,7 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">MYR {{ booking_details.bia }}</div>
@@ -146,7 +146,7 @@
</tr> -->
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell">
@@ -156,10 +156,10 @@
</tr>
<tr class="el-table__row">
<td class="el-table_3_column_11 is-right ">
<div class="cell"/>
<div class="cell"></div>
</td>
<td class="el-table_3_column_12 is-left ">
<div class="cell"/>
<div class="cell"></div>
</td>
</tr>
<!---->
@@ -172,7 +172,7 @@
<!---->
<!---->
<!---->
<div class="el-table__column-resize-proxy" style="display: none;"/>
<div class="el-table__column-resize-proxy" style="display: none;"></div>
</div>
</div>
</div>
@@ -202,8 +202,8 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<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">
<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>
</el-col>
@@ -213,27 +213,29 @@
<el-card class="box-card">
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<el-button :loading="loading_btn" type="success" @click="approveUserSlip">Approve</el-button>
<el-button :loading="loading_btn" type="danger" @click="rejectDialogVisible = true">Reject</el-button>
<el-button :loading="loading_btn" @click="approveUserSlip" type="success">Approve</el-button>
<el-button :loading="loading_btn" @click="rejectDialogVisible = true" type="danger">Reject</el-button>
</el-col>
</el-row>
</el-card>
</el-row>
<el-dialog :visible.sync="rejectDialogVisible" title="Reason of Reject" width="30%" center>
<el-dialog title="Reason of Reject" :visible.sync="rejectDialogVisible" width="30%" center>
<span>
<el-input
:rows="2"
v-model="reject_reason"
type="textarea"
placeholder="Please input the reason"/>
:rows="2"
placeholder="Please input the reason"
v-model="reject_reason">
</el-input>
</span>
<span slot="footer" class="dialog-footer">
<el-button @click="rejectDialogVisible = false">Cancel</el-button>
<el-button :loading="loading_btn" type="primary" @click="rejectUserSlip">Submit</el-button>
<el-button type="primary" :loading="loading_btn" @click="rejectUserSlip">Submit</el-button>
</span>
</el-dialog>
</el-main>
</template>
<style>
@@ -253,126 +255,126 @@
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
import ProgressTrack from '~/components/AdminProgressTrack'
import axios from 'axios'
export default {
components: {
'progress-track': ProgressTrack
},
data () {
return {
trackerConfig: {
status: 2,
term: null
},
loading_btn: false,
rejectDialogVisible: false,
reject_reason: null,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
},
estimated_arrival_time: 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)
.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'
})
export default {
components: {
'progress-track': ProgressTrack
},
data() {
return {
trackerConfig :{
status: 2,
term: null
},
loading_btn: false,
rejectDialogVisible: false,
reject_reason: null,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
},
estimated_arrival_time: null,
}
},
beforeCreate() {
const loading = this.$loading({
lock: true,
text: 'Please wait..',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
},
methods: {
approveUserSlip () {
this.loading_btn = true
let newApprove = {
estimated_arrival_time: this.estimated_arrival_time
}
axios.post('/api/booking/' + this.$route.params.id + '/approve-bank-slip', newApprove)
axios
.get('/api/admin/booking/' + this.$route.params.id)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'User bankinslip accepted. Proceed with book with supplier.',
type: 'success',
duration: 5000
})
this.$router.push({
name: this.booking_details.term === 'x1_ba' || this.booking_details.term === 'x2_cheque' ? 'booking.admin.cnslip' : 'booking.admin.supplier'
})
// pass variable to another router
})
.catch((error) => {
this.loading_btn = false
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'
})
})
},
rejectUserSlip () {
this.loading_btn = true
this.centerDialogVisible = false
methods: {
approveUserSlip() {
this.loading_btn = true
let newApprove = {
estimated_arrival_time: this.estimated_arrival_time,
reject_reason: this.reject_reason
let newApprove = {
estimated_arrival_time: this.estimated_arrival_time
}
axios.post('/api/booking/' + this.$route.params.id + '/approve-bank-slip', newApprove)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'User bankinslip accepted. Proceed with book with supplier.',
type: 'success',
duration: 5000
})
this.$router.push({
name: this.booking_details.term === 'x1_ba' || this.booking_details.term === 'x2_cheque' ? 'booking.admin.cnslip' : 'booking.admin.supplier'
})
// pass variable to another router
})
.catch((error) => {
this.loading_btn = false
console.log(error)
})
},
rejectUserSlip() {
this.loading_btn = true
this.centerDialogVisible = false
let newApprove = {
estimated_arrival_time: this.estimated_arrival_time,
reject_reason: this.reject_reason
}
axios.post('/api/booking/' + this.$route.params.id + '/reject-bank-slip', newApprove)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'User bankinslip rejected. Waiting user to reupload their user bankslip.',
type: 'warning',
duration: 5000
})
this.$router.push({
name: 'admin.home'
})
// pass variable to another router
})
.catch((error) => {
this.loading_btn = false
console.log(error)
})
},
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;
}
axios.post('/api/booking/' + this.$route.params.id + '/reject-bank-slip', newApprove)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'User bankinslip rejected. Waiting user to reupload their user bankslip.',
type: 'warning',
duration: 5000
})
this.$router.push({
name: 'admin.home'
})
// pass variable to another router
})
.catch((error) => {
this.loading_btn = false
console.log(error)
})
},
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>
resources/assets/js/pages/admin/complete-orders.vue
+92 -92
View File
@@ -6,107 +6,107 @@
</div>
<h1 align="center" style="margin-bottom:50px;">Completed Orders</h1>
<el-table :data="tableData" stripe height="500" style="width: 100%">
<el-table-column label="Ref No." prop="id" sortable/>
<el-table-column label="Order Date" prop="created_at" width="180" sortable/>
<el-table-column label="Marking" width="120" prop="marking"/>
<el-table-column label="Rate" prop="rate" width="74"/>
<el-table-column label="Amount" prop="amount" sortable/>
<el-table-column :filters="[{text: 'RMB', value: 'RMB'}, {text: 'USD', value: 'USD'}]" :filter-method="filterHandler" label="Transfer Amount" prop="bia"/>
<el-table-column label="Status" width="106" prop="admin_status">
<template slot-scope="scope">
<el-tag size="medium" type="success">{{ scope.row.admin_status }}</el-tag>
</template>
</el-table-column>
<el-table-column :filters="[{ text: 'Success', value: 'Success' }, { text: 'Pending', value: 'Pending' }]" :filter-method="filterTag" width="180" filter-placement="bottom-end">
<el-button slot-scope="scope" type="text" @click="(event) => { BookingStatus(scope.row.admin_status, scope.row.id) }"> View Status </el-button>
</el-table-column>
<el-table-column label="Ref No." prop="id" sortable></el-table-column>
<el-table-column label="Order Date" prop="created_at" width="180" sortable></el-table-column>
<el-table-column label="Marking" width="120" prop="marking"></el-table-column>
<el-table-column label="Rate" prop="rate" width="74"></el-table-column>
<el-table-column label="Amount" prop="amount" sortable></el-table-column>
<el-table-column :filters="[{text: 'RMB', value: 'RMB'}, {text: 'USD', value: 'USD'}]" :filter-method="filterHandler" label="Transfer Amount" prop="bia"></el-table-column>
<el-table-column label="Status" width="106" prop="admin_status">
<template slot-scope="scope">
<el-tag size="medium" type="success">{{ scope.row.admin_status }}</el-tag>
</template>
</el-table-column>
<el-table-column :filters="[{ text: 'Success', value: 'Success' }, { text: 'Pending', value: 'Pending' }]" :filter-method="filterTag" width="180" filter-placement="bottom-end">
<el-button slot-scope="scope" type="text" @click="(event) => { BookingStatus(scope.row.admin_status, scope.row.id) }"> View Status </el-button>
</el-table-column>
</el-table>
</div>
</template>
<script>
import axios from 'axios'
export default {
data () {
return {
tableData: [],
url: '/api/admin/complete-orders',
loading_btn: false
import axios from 'axios'
export default {
data() {
return {
tableData: [],
url: '/api/admin/complete-orders',
loading_btn: false,
}
},
mounted () {
this.RefreshCompletedOrders()
},
methods: {
RefreshCompletedOrders () {
let $this = this
this.loading_btn = true
axios.get(this.url).then(response => {
this.loading_btn = false
this.tableData = response.data
})
},
filterTag (value, row) {
return row.tag === value
},
filterHandler (value, row, column) {
const property = column['property']
return row[property] === value
},
BookingStatus (status, booking_id) {
// TODO : Get booking status from server
this.status = status
console.log(this.status)
switch (this.status) {
case 1:
this.$router.push({
name: 'booking.admin.pending',
params: {id: booking_id }
}
},
mounted () {
this.RefreshCompletedOrders()
},
methods: {
RefreshCompletedOrders() {
let $this = this
this.loading_btn = true
axios.get(this.url).then(response => {
this.loading_btn = false;
this.tableData = response.data
})
break
case 2:
this.$router.push({
name: 'booking.admin.verification',
params: {id: booking_id }
})
break
case 3:
this.$router.push({
name: 'booking.admin.supplier',
params: {id: booking_id }
})
break
case 4:
this.$router.push({
name: 'booking.admin.supplier.report',
params: {id: booking_id }
})
break
case 5:
this.$router.push({
name: 'booking.admin.cnslip',
params: {id: booking_id }
})
break
},
filterTag (value, row) {
return row.tag === value
},
filterHandler (value, row, column) {
const property = column['property']
return row[property] === value
},
BookingStatus (status, booking_id) {
// TODO : Get booking status from server
this.status = status
console.log(this.status)
switch (this.status) {
case 1:
this.$router.push({
name: 'booking.admin.pending',
params: {id: booking_id }
})
break
case 2:
this.$router.push({
name: 'booking.admin.verification',
params: {id: booking_id }
})
break
case 3:
this.$router.push({
name: 'booking.admin.supplier',
params: {id: booking_id }
})
break
case 4:
this.$router.push({
name: 'booking.admin.supplier.report',
params: {id: booking_id }
})
break
case 5:
this.$router.push({
name: 'booking.admin.cnslip',
params: {id: booking_id }
})
break
case 6:
this.$router.push({
name: 'booking.admin.invoice',
params: {id: booking_id }
})
break
case 6:
this.$router.push({
name: 'booking.admin.invoice',
params: {id: booking_id }
})
break
case 7:
this.$router.push({
name: 'booking.admin.complete',
params: {id: booking_id }
})
break
default:
break
case 7:
this.$router.push({
name: 'booking.admin.complete',
params: {id: booking_id }
})
break
default:
break
}
}
}
}
}
</script>
</script>
resources/assets/js/pages/admin/home.vue
+62 -59
View File
@@ -1,56 +1,56 @@
<template>
<div>
<div align="right">
<el-button :loading="loading_btn" type="primary" size="mini" @click="RefreshBooking()">Refresh</el-button>
</div>
<div>
<div align="right">
<el-button :loading="loading_btn" type="primary" size="mini" @click="RefreshBooking()">Refresh</el-button>
</div>
<!-- Booking Table -->
<el-row :gutter="20">
<div>
<el-table :data="bookingTable">
<el-table-column label="Ref No." width="100">
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)">Update</el-button>
<el-button slot-scope="scope" type="text" @click="(event) => { BookingStatus(scope.row.admin_status, scope.row.id) }"> {{ scope.row.id }}</el-button>
</el-table-column>
<el-table-column label="DateTime" prop="created_at" width="180" sortable/>
<el-table-column label="Marking" width="120" prop="marking" />
<el-table-column :filters="[{text: 'X1', value: 'X1'}, {text: 'X2', value: 'X2'}]" :filter-method="filterHandlerTerm" label="Term" prop="term" width="100"/>
<el-table-column label="Rate" width="74" prop="rate" />
<el-table-column label="Amount" prop="amount" justify="center" width="110" />
<el-table-column :filters="[{text: 'RMB', value: 'RMB'}, {text: 'USD', value: 'USD'}]" :filter-method="filterHandlerTranferAmount" label="Transfer Amount"
prop="transfer_amount" width="170" />
<!-- <el-table-column label="ETA" sortable width="100"/> -->
<!-- <el-table-column label="Payment Method" :filters="[{text: 'Cash', value: 'Cash'}, {text: 'Cheque', value: 'Cheque'}, {text: 'BA', value: 'BA'}]" :filter-method="filterHandler">
<!-- Booking Table -->
<el-row :gutter="20">
<div>
<el-table :data="bookingTable">
<el-table-column label="Ref No." width="100">
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)">Update</el-button>
<el-button slot-scope="scope" type="text" @click="(event) => { BookingStatus(scope.row.admin_status, scope.row.id) }"> {{ scope.row.id }}</el-button>
</el-table-column>
<el-table-column label="DateTime" prop="created_at" width="180" sortable/>
<el-table-column label="Marking" width="120" prop="marking" />
<el-table-column :filters="[{text: 'X1', value: 'X1'}, {text: 'X2', value: 'X2'}]" :filter-method="filterHandlerTerm" label="Term" prop="term" width="100"/>
<el-table-column label="Rate" width="74" prop="rate" />
<el-table-column label="Amount" prop="amount" justify="center" width="110" />
<el-table-column :filters="[{text: 'RMB', value: 'RMB'}, {text: 'USD', value: 'USD'}]" :filter-method="filterHandlerTranferAmount" label="Transfer Amount"
prop="transfer_amount" width="170" />
<!-- <el-table-column label="ETA" sortable width="100"/> -->
<!-- <el-table-column label="Payment Method" :filters="[{text: 'Cash', value: 'Cash'}, {text: 'Cheque', value: 'Cheque'}, {text: 'BA', value: 'BA'}]" :filter-method="filterHandler">
</el-table-column> -->
<!-- <el-table-column :filters="[{text: '(1/6)', value: '(1/6) Order Done'}, {text: '(2/6)', value: '(2/6) Waiting for Upload Bank in Slip'}, {text: '(3/6)', value: '(3/6) Order Confirmation'}, {text: '(4/6)', value: '(4/6) Processing Transfer'}, {text: '(5/6)', value: '(5/6) Waiting for Upload PO'}, {text: '(6/6)', value: '(6/6) Order Complete'}]" :filter-method="filterHandler" prop="status" label="Status"/> -->
<el-table-column :filters="[{ text: 'Success', value: 'Success' }, { text: 'Pending', value: 'Pending' }]" :filter-method="filterHandlerStatus" label="Status" width="106" prop="status_desc">
<template slot-scope="scope">
<el-popover trigger="click" placement="top">
<p>{{ scope.row.status_desc }}</p>
<div slot="reference" class="name-wrapper">
<el-tag size="medium">{{ scope.row.track_status }}</el-tag>
</div>
</el-popover>
</template>
</el-table-column>
<!-- <el-table-column label="Balance" prop="transfer_amount" sortable width="100"/> -->
<!-- <el-table-column prop="timeout" label="Bankin Timeout" /> -->
<el-table-column label="" width="180">
<el-button slot-scope="scope" type="text" @click="(event) => { BookingStatus(scope.row.admin_status, scope.row.id) }"> View Status </el-button>
<!-- <el-table-column :filters="[{text: '(1/6)', value: '(1/6) Order Done'}, {text: '(2/6)', value: '(2/6) Waiting for Upload Bank in Slip'}, {text: '(3/6)', value: '(3/6) Order Confirmation'}, {text: '(4/6)', value: '(4/6) Processing Transfer'}, {text: '(5/6)', value: '(5/6) Waiting for Upload PO'}, {text: '(6/6)', value: '(6/6) Order Complete'}]" :filter-method="filterHandler" prop="status" label="Status"/> -->
<el-table-column label="Status" width="106" :filters="[{ text: 'Success', value: 'Success' }, { text: 'Pending', value: 'Pending' }]" :filter-method="filterHandlerStatus" prop="status_desc">
<template slot-scope="scope">
<el-popover trigger="click" placement="top">
<p>{{ scope.row.status_desc }}</p>
<div slot="reference" class="name-wrapper">
<el-tag size="medium">{{ scope.row.track_status }}</el-tag>
</div>
</el-popover>
</template>
</el-table-column>
<!-- <el-table-column label="Balance" prop="transfer_amount" sortable width="100"/> -->
<!-- <el-table-column prop="timeout" label="Bankin Timeout" /> -->
<el-table-column label="" width="180">
<el-button slot-scope="scope" type="text" @click="(event) => { BookingStatus(scope.row.admin_status, scope.row.id) }"> View Status </el-button>
<!-- <template slot-scope="scope">
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)">View Status</el-button>
<el-button size="mini" type="danger" @click="BookingStatus(scope.$index, scope.row)">Cancel</el-button>
</template> -->
</el-table-column>
</el-table>
</div>
</el-row>
<div align="right">
<el-button :disabled="!pagination.prev_page_url" type="primary" size="mini" @click="fetchPaginateBooking(pagination.prev_page_url)">
</el-table-column>
</el-table>
</div>
</el-row>
<div align="right">
<el-button type="primary" size="mini" @click="fetchPaginateBooking(pagination.prev_page_url)" :disabled="!pagination.prev_page_url">
Previous
</el-button>
<span>Page {{ pagination.current_page }} of {{ pagination.last_page }}</span>
<el-button :disabled="!pagination.next_page_url" type="primary" size="mini" @click="fetchPaginateBooking(pagination.next_page_url)">
<span>Page {{pagination.current_page}} of {{pagination.last_page}}</span>
<el-button type="primary" size="mini" @click="fetchPaginateBooking(pagination.next_page_url)" :disabled="!pagination.next_page_url">
Next
</el-button>
</div>
@@ -75,25 +75,25 @@ export default {
bookingTable: [],
url: 'api/admin/booking',
pagination: {prev_page_url: null},
loading_btn: false
loading_btn: false,
}
},
mounted () {
this.getBooking()
},
methods: {
getBooking () {
getBooking(){
let $this = this
axios.get(this.url).then(response => {
this.bookingTable = response.data.data
$this.makePagination(this.bookingTable)
this.bookingTable = response.data.data;
$this.makePagination(this.bookingTable);
})
},
RefreshBooking () {
RefreshBooking() {
let $this = this
this.loading_btn = true
axios.get(this.url).then(response => {
this.loading_btn = false
this.loading_btn = false;
this.bookingTable = response.data.data
this.$message({
showClose: true,
@@ -103,8 +103,8 @@ export default {
})
})
},
makePagination (data) {
let pagination = {
makePagination(data){
let pagination ={
current_page: data.current_page,
last_page: data.last_page,
next_page_url: data.next_page_url,
@@ -112,21 +112,24 @@ export default {
}
this.pagination = pagination
},
fetchPaginateBooking (url) {
fetchPaginateBooking(url) {
this.url = url
this.getBooking()
},
filterHandlerStatus (value, row, column) {
const status = row.track_status
if (value === 'Success') { return status === '(5/5)' || status === '(7/7)' } else { return !(status === '(5/5)' || status === '(7/7)') }
const status = row.track_status;
if(value ==="Success")
return status === "(5/5)" || status === "(7/7)";
else
return !(status === "(5/5)" || status === "(7/7)");
},
filterHandlerTranferAmount (value, row, column) {
// Pending...lol
return false
return false;
},
filterHandlerTerm (value, row, column) {
const term = row.term
return value.toLowerCase() === term.substring(0, 2)
filterHandlerTerm(value, row, column){
const term = row.term;
return value.toLowerCase() === term.substring(0,2);
},
BookingStatus (status, booking_id) {
// TODO : Get booking status from server
resources/assets/js/pages/admin/transaction-history.vue
+18 -18
View File
@@ -1,29 +1,29 @@
<template>
<div>
<span align="center"><h2>Transaction History</h2></span><br>
<el-table :data="tableData" stripe style="width: 100%">
<el-table-column prop="transaction_date" label="Transaction Date" sortable/>
<el-table-column prop="booking_no" label="Booking No" sortable/>
<el-table-column prop="marking" label="Marking" sortable/>
<el-table-column prop="debit_in" label="Debit In"/>
<el-table-column prop="credit_out" label="Credit Out"/>
<el-table-column prop="balance" label="Balance"/>
<el-table-column prop="bank_recon" label="Bank Recon"/>
</el-table><br><br>
<div align="right">
<el-button>Export to Excel</el-button><el-button>Print</el-button><br><br>
<el-pagination :total="30" background layout="prev, pager, next"/>
<div>
<span align="center"><h2>Transaction History</h2></span><br>
<el-table :data="tableData" stripe style="width: 100%">
<el-table-column prop="transaction_date" label="Transaction Date" sortable></el-table-column>
<el-table-column prop="booking_no" label="Booking No" sortable></el-table-column>
<el-table-column prop="marking" label="Marking" sortable></el-table-column>
<el-table-column prop="debit_in" label="Debit In"></el-table-column>
<el-table-column prop="credit_out" label="Credit Out"></el-table-column>
<el-table-column prop="balance" label="Balance"></el-table-column>
<el-table-column prop="bank_recon" label="Bank Recon"></el-table-column>
</el-table><br><br>
<div align="right">
<el-button>Export to Excel</el-button><el-button>Print</el-button><br><br>
<el-pagination background layout="prev, pager, next" :total="30"></el-pagination>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
data() {
return {
}
}
}
}
</script>
resources/assets/js/pages/admin/upload-supplier-bank-slip.vue
+46 -46
View File
@@ -1,58 +1,58 @@
<template>
<div>
<span align="center"><h2>Uploaded Supplier Bank Slip</h2></span><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="AddNewDialogVisible = true">Add New</el-button>
</div><br>
<el-table :data="tableData" stripe style="width: 100%">
<el-table-column label="Ref No" sortable/>
<el-table-column label="Amount (RMB)" sortable/>
<el-table-column label="Date" sortable/>
<el-table-column label="Bank Slip File"/>
</el-table><br><br>
<div>
<span align="center"><h2>Uploaded Supplier Bank Slip</h2></span><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="AddNewDialogVisible = true">Add New</el-button>
</div><br>
<el-table :data="tableData" stripe style="width: 100%">
<el-table-column label="Ref No" sortable></el-table-column>
<el-table-column label="Amount (RMB)" sortable></el-table-column>
<el-table-column label="Date" sortable></el-table-column>
<el-table-column label="Bank Slip File"></el-table-column>
</el-table><br><br>
<!-- popup add new dialog -->
<el-dialog :visible.sync="AddNewDialogVisible" align="center">
<el-form :label-position="right" label-width="150px">
<el-form-item label="Select bank slip : " align="left">
<el-upload :on-preview="handlePreview" :on-remove="handleRemove" class="upload-slip" action="https://jsonplaceholder.typicode.com/posts/" list-type="picture">
<el-button size="small" type="primary">Click to upload</el-button></el-upload>
</el-form-item>
<el-form-item label="For Order No : "><el-input/></el-form-item>
<el-form-item label="Amount : "><el-input/></el-form-item>
<el-form-item label="Date : " align="left"><el-date-picker v-model="date" type="date" placeholder="Pick a date"/></el-form-item>
</el-form>
<div align="center">
<el-button type="text" @click="AddNewDialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="AddNewDialogVisible = false; DoneAddNewDialogVisible = true">Submit</el-button>
</div>
<el-dialog align="center" :visible.sync="AddNewDialogVisible">
<el-form :label-position="right" label-width="150px">
<el-form-item label="Select bank slip : " align="left">
<el-upload class="upload-slip" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" list-type="picture">
<el-button size="small" type="primary">Click to upload</el-button></el-upload>
</el-form-item>
<el-form-item label="For Order No : "><el-input></el-input></el-form-item>
<el-form-item label="Amount : "><el-input></el-input></el-form-item>
<el-form-item label="Date : " align="left"><el-date-picker v-model="date" type="date" placeholder="Pick a date"></el-date-picker></el-form-item>
</el-form>
<div align="center">
<el-button type="text" @click="AddNewDialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="AddNewDialogVisible = false; DoneAddNewDialogVisible = true">Submit</el-button>
</div>
</el-dialog>
<!-- popup add new dialog end -->
<!-- popup done upload -->
<el-dialog :visible.sync="DoneAddNewDialogVisible" align="center" width="30%">
<span>Bank Slip Successfully Updated</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneAddNewDialogVisible = false">Close</el-button>
</div>
</el-dialog>
<!-- popup done upload end -->
</div>
<!-- popup add new dialog end -->
<!-- popup done upload -->
<el-dialog align="center" :visible.sync="DoneAddNewDialogVisible" width="30%">
<span>Bank Slip Successfully Updated</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneAddNewDialogVisible = false">Close</el-button>
</div>
</el-dialog>
<!-- popup done upload end -->
</div>
</template>
<script>
export default {
data () {
return {
AddNewDialogVisible: false,
DoneAddNewDialogVisible: false,
date: ''
data() {
return {
AddNewDialogVisible: false,
DoneAddNewDialogVisible: false,
date: ''
}
},
methods: {
handlePreview(file) {
console.log(file);
}
}
},
methods: {
handlePreview (file) {
console.log(file)
}
}
}
</script>
resources/assets/js/pages/auth/register.vue
+64 -139
View File
@@ -1,81 +1,4 @@
<template>
<<<<<<< HEAD
<div class="container">
<div class="row">
<div class="col-lg-8 m-auto">
<card :title="$t('register')">
<form @submit.prevent="register" @keydown="form.onKeydown($event)">
<!-- Marking -->
<div :class="{'has-error': errors.has('marking') }" class="form-group row">
<label class="col-md-3 col-form-label text-md-right">{{ $t('Marking') }}</label>
<div class="col-md-7">
<el-input v-validate="'required|max:255'" v-model="form.marking" type="text" name="marking" placeholder="Marking Number"/>
<span v-if="errors.has('marking')" class="text-danger">{{ errors.first('marking') }}<br></span>
</div>
</div>
<!-- Email -->
<div :class="{'has-error': errors.has('email') }" class="form-group row">
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
<div class="col-md-7">
<el-input v-validate="'required|max:255'" v-model="form.email" type="email" name="email" placeholder="Email"/>
<span v-if="errors.has('email')" class="text-danger">{{ errors.first('email') }}</span>
</div>
</div>
<!-- Password -->
<div :class="{'has-error': errors.has('password') }" class="form-group row">
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
<div class="col-md-7">
<el-input v-validate="'required|min:6|max:255'" v-if="password_visible" v-model="form.password" type="text" name="password" placeholder="Password">
<template slot="append">
<el-button type="primary" @click="password_visible = !password_visible"><i class="fas fa-eye"/></el-button>
</template>
</el-input>
<el-input v-validate="'required|min:6|max:255'" v-else v-model="form.password" type="password" name="password" placeholder="Password">
<template slot="append">
<el-button type="primary" @click="password_visible = !password_visible"><i class="fas fa-eye-slash"/></el-button>
</template>
</el-input>
<span v-if="errors.has('password')" class="text-danger">{{ errors.first('password') }}</span>
</div>
</div>
<!-- Password Confirmation -->
<div :class="{'has-error': errors.has('confirm_password') }" class="form-group row">
<label class="col-md-3 col-form-label text-md-right">{{ $t('confirm_password') }}</label>
<div class="col-md-7">
<el-input v-validate="'required|min:6|max:255'" v-if="password_confirmation_visible" v-model="form.password_confirmation" type="text" name="password_confirmation" placeholder="Confirm Password">
<template slot="append">
<el-button type="primary" @click="password_confirmation_visible = !password_confirmation_visible"><i class="fas fa-eye"/></el-button>
</template>
</el-input>
<el-input v-validate="'required|min:6|max:255'" v-else v-model="form.password_confirmation" type="password" name="password_confirmation" placeholder="Confirm Password">
<template slot="append">
<el-button type="primary" @click="password_confirmation_visible = !password_confirmation_visible"><i class="fas fa-eye-slash"/></el-button>
</template>
</el-input>
<span v-if="errors.has('password_confirmation')" class="text-danger">{{ errors.first('password_confirmation') }}<br></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-7 offset-md-3 d-flex">
<!-- Submit Button -->
<v-button :loading="form.busy" :disabled="errors.any() || form.password=='' || form.password_confirmation=='' || form.email=='' || form.marking=='' ? true : false">
{{ $t('register') }}
</v-button>
<!-- GitHub Register Button -->
<login-with-github/>
</div>
</div>
</form>
</card>
</div>
</div>
</div>
=======
<div class="container">
<div class="row">
<div class="col-lg-8 m-auto">
@@ -152,7 +75,6 @@
</div>
</div>
</div>
>>>>>>> efa9ed6c91b98b6889eebd459e952a75a6c68708
</template>
<script>
@@ -162,78 +84,81 @@ import store from '~/store'
import Vue from 'vue'
export default {
middleware: 'guest',
middleware: 'guest',
components: {
LoginWithGithub
},
components: {
LoginWithGithub
},
metaInfo () {
return { title: this.$t('register') }
},
metaInfo () {
return { title: this.$t('register') }
},
data: () => ({
form: new Form({
marking: '',
email: '',
password: '',
password_confirmation: ''
}),
email: '',
password_visible: false,
password_confirmation_visible: false
}),
data: () => ({
form: new Form({
marking:'',
email: '',
password: '',
password_confirmation: ''
}),
email : '',
password_visible : false,
password_confirmation_visible : false
}),
methods: {
async register () {
var token
var data
// Register the user.
await this.form.post('/api/register')
.then((response) => {
methods: {
async register () {
var token
var data
// Register the user.
await this.form.post('/api/register')
.then( (response) => {
data = response.data
this.$message({
message: 'Success. Logging in..',
type: 'success'
})
})
.catch((error) => {
console.log(error)
message: "Success. Logging in..",
type: 'success'
})
})
.catch( (error) => {
console.log(error)
this.$message({
message: error.response.data.message,
type: 'error'
})
}
)
message: error.response.data.message,
type: 'error'
})
}
)
await this.form.post('/api/login')
.then((response) => {
console.log(response.data)
token = response.data.token
})
.catch((error) => {
console.log(error)
await this.form.post('/api/login')
.then( (response) => {
console.log(response.data)
token = response.data.token
})
.catch( (error) => {
console.log(error)
this.$message({
message: error.response.data.message,
type: 'error'
})
}
)
message: error.response.data.message,
type: 'error'
})
}
)
console.log(token)
// Save the token.
this.$store.dispatch('auth/saveToken', { token })
console.log(token)
// Save the token.
this.$store.dispatch('auth/saveToken', { token } )
// Update the user.
await this.$store.dispatch('auth/updateUser', { user: data })
// Update the user.
await this.$store.dispatch('auth/updateUser', { user: data })
// Redirect home.
if (store.getters['auth/user'].role === 'admin') {
this.$router.push({ name: 'admin.home' })
} else {
this.$router.push({ name: 'home' })
}
}
}
// Redirect home.
if (store.getters['auth/user'].role === 'admin') {
this.$router.push({ name: 'admin.home' })
} else {
this.$router.push({ name: 'home' })
}
}
}
}
</script>
resources/assets/js/pages/booking/completed.vue
+36 -35
View File
@@ -12,8 +12,8 @@
<div class="card-header">Purchase Order</div>
<div class="row">
<div class="card-body">
<a :href="getURL(booking_details.user_po_path)" target="_blank">
<img v-if="isImage(booking_details.user_po_path)" :src="booking_details.user_po_path" class="image">
<a target="_blank" :href="getURL(booking_details.user_po_path)">
<img v-if="isImage(booking_details.user_po_path)" v-bind:src="booking_details.user_po_path" class="image">
<p v-else>Download</p>
</a>
</div>
@@ -24,11 +24,11 @@
<div class="card">
<div class="card-header">China Bank Slip</div>
<div class="row">
<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">
<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">
<p v-else>Download</p>
<br>
<br/>
</a>
</div>
</div>
@@ -38,9 +38,9 @@
<div class="card">
<div class="card-header">Invoice</div>
<div class="row">
<div class="card-body">
<a :href="getURL(booking_details.invoice_path)" target="_blank">
<img v-if="isImage(booking_details.invoice_path)" :src="booking_details.invoice_path" class="image">
<div class="card-body">
<a target="_blank" :href="getURL(booking_details.invoice_path)">
<img v-if="isImage(booking_details.invoice_path)" v-bind:src="booking_details.invoice_path" class="image">
<p v-else>Download</p>
</a>
</div>
@@ -50,8 +50,8 @@
</div>
<!-- order details -->
<div class="card">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="row">
<div class="col">
<table class="table table-striped">
@@ -62,11 +62,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>
@@ -84,14 +84,14 @@
</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>
<td><b>MYR {{ booking_details.bia }}</b></td>
</tr>
</tbody>
@@ -104,10 +104,10 @@
<div class="card-header">Order Bankin Slip</div>
<div class="row">
<div class="card-body">
<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">
<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>
</a>
</div>
</div>
</div>
@@ -160,12 +160,12 @@ export default {
return {
status: 7,
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
}
booking_details:{
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
}
}
},
beforeCreate () {
@@ -180,7 +180,8 @@ export default {
.get('/api/booking/' + this.$route.params.id)
.then((response) => {
this.booking_details = response.data
loading.close()
loading.close();
}).catch((error) => {
console.log(error)
loading.close()
@@ -190,17 +191,17 @@ export default {
})
},
methods: {
getExtension (path) {
return path.slice(-3)
getExtension(path){
return path.slice(-3);
},
isImage (path) {
var ext = this.getExtension(path)
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png'
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
getURL(path){
var getUrl = window.location;
var baseUrl = getUrl.protocol + "//" + getUrl.host;
return baseUrl + path;
}
}
}
resources/assets/js/pages/booking/confirmation.vue
+28 -27
View File
@@ -6,8 +6,8 @@
<el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
</div>
<div class="card">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="row">
<div class="col">
<table class="table table-striped">
@@ -18,11 +18,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>
@@ -40,14 +40,14 @@
</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>
<td><b>MYR {{ booking_details.bia }}</b></td>
</tr>
</tbody>
@@ -61,8 +61,8 @@
<div class="card-header">Order Bankin Slip</div>
<div class="row">
<div class="card-body">
<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">
<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>
</div>
@@ -114,12 +114,12 @@ export default {
return {
status: 3,
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
}
booking_details:{
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
}
}
},
beforeCreate () {
@@ -135,6 +135,7 @@ export default {
.then((response) => {
this.booking_details = response.data
loading.close()
}).catch((error) => {
console.log(error)
loading.close()
@@ -144,18 +145,18 @@ export default {
})
},
methods: {
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
}
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>
resources/assets/js/pages/booking/po.vue
+31 -30
View File
@@ -12,8 +12,8 @@
<div class="card-header">Purchase Order</div>
<div class="row">
<div class="card-body">
<a :href="getURL(booking_details.user_po_path)" target="_blank">
<img v-if="isImage(booking_details.user_po_path)" :src="booking_details.user_po_path" class="image">
<a target="_blank" :href="getURL(booking_details.user_po_path)">
<img v-if="isImage(booking_details.user_po_path)" v-bind:src="booking_details.user_po_path" class="image">
<p v-else>Download</p>
</a>
</div>
@@ -25,8 +25,8 @@
<div class="card-header">China Bank Slip</div>
<div class="row">
<div class="card-body">
<a :href="getURL(booking_details.china_bankslip_path)" target="_blank">
<img v-if="isImage(booking_details.china_bankslip_path)" :src="booking_details.china_bankslip_path" class="image">
<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>
@@ -37,8 +37,8 @@
<div class="card">
<div class="card-header">Invoice</div>
<div class="row">
<div class="card-body">
<img class="uploadedImage" src="http://via.placeholder.com/900x1615">
<div class="card-body">
<img class="uploadedImage" src="http://via.placeholder.com/900x1615">
</div>
</div>
</div>
@@ -46,8 +46,8 @@
</div>
<!-- order details -->
<div class="card">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="row">
<div class="col">
<table class="table table-striped">
@@ -58,11 +58,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>
@@ -80,14 +80,14 @@
</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>
<td><b>MYR {{ booking_details.bia }}</b></td>
</tr>
</tbody>
@@ -100,8 +100,8 @@
<div class="card-header">Order Bankin Slip</div>
<div class="row">
<div class="card-body">
<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">
<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>
</div>
@@ -156,12 +156,12 @@ export default {
return {
status: 6,
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
}
booking_details:{
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
}
}
},
beforeCreate () {
@@ -177,6 +177,7 @@ export default {
.then((response) => {
this.booking_details = response.data
loading.close()
}).catch((error) => {
console.log(error)
loading.close()
@@ -186,17 +187,17 @@ export default {
})
},
methods: {
getExtension (path) {
return path.slice(-3)
getExtension(path){
return path.slice(-3);
},
isImage (path) {
var ext = this.getExtension(path)
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png'
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
getURL(path){
var getUrl = window.location;
var baseUrl = getUrl.protocol + "//" + getUrl.host;
return baseUrl + path;
}
}
}
resources/assets/js/pages/booking/poComplete.vue
+24 -22
View File
@@ -21,7 +21,7 @@
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target=" _blank" href="#">
<img :src="booking_details.user_po_path" class="image">
<img v-bind:src="booking_details.user_po_path" class="image">
</a>
</el-col>
</el-row>
@@ -37,7 +37,7 @@
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target=" _blank" href="#">
<img :src="booking_details.china_bankslip_path" class="image">
<img v-bind:src="booking_details.china_bankslip_path" class="image">
</a>
</el-col>
</el-row>
@@ -50,20 +50,20 @@
<!-- <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">
<img width="100%" height="100%" src="http://via.placeholder.com/700x800">
<el-col :span="12">
<img width="100%" height="100%" src="http://via.placeholder.com/700x800">
</el-col>
</el-row>
</el-card>
</el-col>
</el-row>
<br>
<!-- bank slips END -->
<!-- bank slips END -->
<!-- order details -->
<div class="card">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="row">
<div class="col">
<table class="table table-striped">
@@ -74,11 +74,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>
@@ -96,14 +96,14 @@
</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>
<td><b>MYR {{ booking_details.bia }}</b></td>
</tr>
</tbody>
@@ -112,14 +112,14 @@
</div>
</div>
</div>
<br>
<br>
<div class="card">
<div class="card-header">Payment Bankin Slip</div>
<div class="row">
<div class="card-body">
<a :href="booking_details.user_bankslip_path" target="_blank">
<img :src="booking_details.user_bankslip_path" class="uploadedImage">
</a>
<a target="_blank" :href="booking_details.user_bankslip_path">
<img v-bind:src="booking_details.user_bankslip_path" class="uploadedImage">
</a>
</div>
</div>
</div>
@@ -143,12 +143,12 @@ export default {
return {
status: 6,
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
}
booking_details:{
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
}
}
},
beforeCreate () {
@@ -164,6 +164,7 @@ export default {
.then((response) => {
this.booking_details = response.data
loading.close()
}).catch((error) => {
console.log(error)
loading.close()
@@ -171,6 +172,7 @@ export default {
name: 'notfound'
})
})
},
methods: {
resources/assets/js/pages/booking/transfer.vue
+27 -26
View File
@@ -8,8 +8,8 @@
</div>
<!-- order details -->
<div class="card">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="card-header">Order Details</div>
<div class="card-body">
<div class="row">
<div class="col">
<table class="table table-striped">
@@ -20,11 +20,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>
@@ -46,14 +46,14 @@
</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>
<td><b>MYR {{ booking_details.bia }}</b></td>
</tr>
<tr>
@@ -70,12 +70,12 @@
<div class="card-header">Order Bankin Slip</div>
<div class="row">
<div class="card-body">
<a :href="booking_details.user_bankslip_path" target="_blank">
<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">
<a target="_blank" :href="booking_details.user_bankslip_path">
<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>
</a>
</a>
</div>
</div>
</div>
@@ -135,12 +135,12 @@ export default {
return {
status: 4,
loading_btn: false,
booking_details: {
id: null,
amount: null,
bia: null,
user_bankslip_path: null
}
booking_details:{
id: null,
amount: null,
bia: null,
user_bankslip_path: null,
}
}
},
beforeCreate () {
@@ -156,6 +156,7 @@ export default {
.then((response) => {
this.booking_details = response.data
loading.close()
}).catch((error) => {
console.log(error)
loading.close()
@@ -165,17 +166,17 @@ export default {
})
},
methods: {
getExtension (path) {
return path.slice(-3)
getExtension(path){
return path.slice(-3);
},
isImage (path) {
var ext = this.getExtension(path)
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png'
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
getURL(path){
var getUrl = window.location;
var baseUrl = getUrl.protocol + "//" + getUrl.host;
return baseUrl + path;
}
}
}
resources/assets/js/pages/booking/uploadPo.vue
+108 -107
View File
@@ -14,16 +14,16 @@
<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>
: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 :action="'/api/booking/' + booking_id + '/upload-po'" :on-preview="handlePreview" :on-remove="handleRemove"
:before-remove="beforeRemove" :file-list="fileList" class="upload-demo uploadAreaTwo" multiple>
<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>
@@ -39,8 +39,8 @@
<div class="card">
<div class="card-header">China Bank Slip</div>
<div class="card-body">
<a :href="getURL(booking_details.china_bankslip_path)" target="_blank">
<img v-if="isImage(booking_details.china_bankslip_path)" :src="booking_details.china_bankslip_path" class="image">
<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>
@@ -94,7 +94,7 @@
<td>{{ booking_details.rate }}</td>
</tr>
<tr>
<td/>
<td></td>
<td>
<b>MYR {{ booking_details.bia }}</b>
</td>
@@ -113,8 +113,8 @@
<div class="card-header">Order Bankin Slip</div>
<div class="row">
<div class="card-body">
<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">
<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>
</div>
@@ -183,105 +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'
})
})
},
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;
}
}
},
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'
})
})
},
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
}
}
}
</script>
</script>
resources/assets/js/pages/booking/uploadUserBankSlip.vue
+1 -1
View File
@@ -371,4 +371,4 @@
}
}
}
</script>
</script>
resources/assets/js/pages/home.vue
+125 -131
View File
@@ -1,28 +1,28 @@
<template>
<el-main>
<!-- Input-Amount -->
<el-row :gutter="20" type="flex" justify="center" align="middle">
<el-col :span="20">
<div class="grid-content bg-purple" align="center">
I need :
<el-select v-model="value" placeholder="RMB">
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</el-col>
</el-row>
<br>
<el-row :gutter="20" type="flex" justify="center" align="middle">
<el-col :xs="18" :sm="18" :md="8" :lg="8" :xl="8">
<div class="grid-content bg-purple" align="left">
<el-input v-model="booking.amount" placeholder="Amount" />
</div>
</el-col>
</el-row>
<el-row :gutter="20" type="flex" justify="center" align="middle">
<el-col :span="20">
<div class="grid-content bg-purple" align="center">
I need :
<el-select v-model="value" placeholder="RMB">
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</el-col>
</el-row>
<br>
<el-row :gutter="20" type="flex" justify="center" align="middle">
<el-col :xs="18" :sm="18" :md="8" :lg="8" :xl="8">
<div class="grid-content bg-purple" align="left">
<el-input v-model="booking.amount" placeholder="Amount" />
</div>
</el-col>
</el-row>
<!-- Input-Amount-end -->
<div align="right">
<el-button :loading="loading_btn" type="primary" size="mini" @click="refreshRate()">Refresh Rate</el-button></div>
<el-button type="primary" :loading="loading_btn" size="mini" @click="refreshRate()">Refresh Rate</el-button></div>
<hr>
<!-- Rate-Display -->
@@ -140,9 +140,9 @@
<!-- Rate-Display-end -->
<!-- Form_popup -->
<el-dialog :visible.sync="dialogFormVisible" :fullscreen="true" title="Booking" center>
<el-form ref="bookingForm" :model="bookingForm" :rules="rules">
<div align="center">
<el-dialog :visible.sync="dialogFormVisible" :fullscreen="true" title="Booking" center>
<el-form ref="bookingForm" :model="bookingForm" :rules="rules">
<div align="center">
<el-form-item prop="payment_for"> <!-- TODO : this should be payment for order number -->
<el-select v-model="bookingForm.payment_for" placeholder="Payment For" style="width: 80%" required="true">
<el-option v-for="item in options3" :key="item.value" :label="item.label" :value="item.value" />
@@ -151,27 +151,27 @@
<el-form-item prop="order_no">
<el-input v-model="bookingForm.order_no" placeholder="Order No." style="width: 80%" required="true" />
</el-form-item>
<el-form-item prop="account_name">
<el-input v-model="bookingForm.account_name" placeholder="China Beneficiary Account" style="width: 80%" required="true" />
</el-form-item>
<el-form-item prop="bank_name">
<el-input v-model="bookingForm.bank_name" type="text" placeholder="Bank Name / AliPay / WechatPay" style="width: 80%" />
</el-form-item>
<el-form-item prop="bank_branch">
<el-input v-model="bookingForm.bank_branch" type="text" placeholder="Branch / 分行/支行" style="width: 80%" />
</el-form-item>
<el-form-item prop="account_num">
<el-input v-model="bookingForm.account_num" type="text" placeholder="Account Number / AliPay_ID / WechatPay_ID" style="width: 80%"
/>
</el-form-item>
<el-form-item>
<el-button @click="dialogFormVisible = false">Cancel</el-button>
<el-form-item prop="account_name">
<el-input v-model="bookingForm.account_name" placeholder="China Beneficiary Name" style="width: 80%" required="true" />
</el-form-item>
<el-form-item prop="bank_name">
<el-input v-model="bookingForm.bank_name" type="text" placeholder="Bank Name" style="width: 80%" />
</el-form-item>
<el-form-item prop="bank_branch">
<el-input v-model="bookingForm.bank_branch" type="text" placeholder="Branch / 分行/支行" style="width: 80%" />
</el-form-item>
<el-form-item prop="account_num">
<el-input v-model="bookingForm.account_num" type="text" placeholder="Account Number" style="width: 80%"
/>
</el-form-item>
<el-form-item>
<el-button @click="dialogFormVisible = false">Cancel</el-button>
<el-button :loading="loading" type="primary" @click="getCalculationValue('bookingForm')">Book Now</el-button>
</el-form-item>
</div>
</el-form>
</el-dialog>
<el-button :loading="loading" type="primary" @click="getCalculationValue('bookingForm')">Book Now</el-button>
</el-form-item>
</div>
</el-form>
</el-dialog>
<!-- Form_popup-end -->
<!-- Booking_confirmation_popup -->
@@ -203,8 +203,8 @@
<td> {{ bookingConfirmTable.remark }}</td>
</tr>
<tr>
<td/>
<td/>
<td></td>
<td></td>
</tr>
<tr>
<td>CNY/RMB :</td>
@@ -215,19 +215,19 @@
<tr>
<td>+ Service Charges :</td>
<td>
CNY {{ bookingConfirmTable.service_charge }}
CNY {{ bookingConfirmTable.service_charge }}
</td>
</tr>
<tr>
<td>/ Rate :</td>
<td>
{{ bookingConfirmTable.rate }}
{{ bookingConfirmTable.rate }}
</td>
</tr>
<tr>
<td/>
<td></td>
<td>
MYR {{ bookingConfirmTable.subtotal }}
MYR {{ bookingConfirmTable.subtotal }}
</td>
</tr>
<tr>
@@ -239,7 +239,7 @@
<tr>
<td>+ Billing Charge :</td>
<td>
MYR {{ bookingConfirmTable.billingChargeAmount }}
MYR {{ bookingConfirmTable.billingChargeAmount }}
</td>
</tr>
<tr>
@@ -250,24 +250,17 @@
</tr>
<tr>
<td>China Beneficiary Acc : <br>
Name : {{ bookingConfirmTable.acc_name }} <br>
Name : {{ bookingConfirmTable.acc_name }} <br>
Account No. : {{ bookingConfirmTable.acc_no }}</td>
<td/>
<td></td>
</tr>
<tr>
<td>Bank In Amount :</td>
<td><b>RM {{ bookingConfirmTable.bankin_amount }}</b></td>
</tr>
<tr>
<td/>
<td/>
</tr>
<tr>
<td align="center" colspan="2">
<b>CIEF WORLDWIDE SDN. BHD.(1134596-M)</b>
<br>
<b>MBB 568603010762</b>
</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
@@ -282,8 +275,8 @@
<br>
<hr>
<div align="right">
<el-button :loading="loading_btn" type="primary" size="mini" @click="RefreshBooking()">Refresh</el-button></div>
<!-- Booking Table -->
<el-button :loading="loading_btn" type="primary" size="mini" @click="RefreshBooking()">Refresh</el-button></div>
<!-- Booking Table -->
<el-row :gutter="20">
<div>
<el-table :data="bookingTable">
@@ -325,11 +318,11 @@
</div>
</el-row><br><br>
<div align="right">
<el-button :disabled="!pagination.prev_page_url" type="primary" size="mini" @click="fetchPaginateBooking(pagination.prev_page_url)">
<el-button type="primary" size="mini" @click="fetchPaginateBooking(pagination.prev_page_url)" :disabled="!pagination.prev_page_url">
Previous
</el-button>
<span>Page {{ pagination.current_page }} of {{ pagination.last_page }}</span>
<el-button :disabled="!pagination.next_page_url" type="primary" size="mini" @click="fetchPaginateBooking(pagination.next_page_url)">
<span>Page {{pagination.current_page}} of {{pagination.last_page}}</span>
<el-button type="primary" size="mini" @click="fetchPaginateBooking(pagination.next_page_url)" :disabled="!pagination.next_page_url">
Next
</el-button>
</div>
@@ -364,9 +357,9 @@ export default {
x1_cash: null,
x2_ba: null,
x2_cash: null,
x2_cheque: null
x2_cheque: null,
},
loading: null,
loading : null,
loading_btn: false,
status: '',
booking: {
@@ -380,16 +373,16 @@ export default {
account_num: ''
},
rules: {
order_no: [{
required: true,
message: 'Please input order number',
trigger: 'change'
}],
payment_for: [{
required: true,
message: 'Please input payment for',
trigger: 'change'
}],
// order_no: [{
// required: true,
// message: 'Please input order number',
// trigger: 'change'
// }],
payment_for: [{
required: true,
message: 'Please input payment for',
trigger: 'change'
}],
amount: [{
required: true,
message: 'Please input amount',
@@ -463,25 +456,25 @@ export default {
}
},
mounted () {
this.getBooking()
this.initBooking()
this.getRate()
this.getBooking();
this.initBooking();
this.getRate();
},
methods: {
getBooking () {
getBooking(){
let $this = this
axios.get(this.url).then(response => {
this.bookingTable = response.data.data
$this.makePagination(response.data)
})
},
getRate () {
getRate() {
let $this = this
axios.get('api/rate').then(response => {
this.rate = response.data
})
},
refreshRate () {
refreshRate() {
let $this = this
this.loading_btn = true
axios.get('api/rate').then(response => {
@@ -495,17 +488,17 @@ export default {
})
})
},
initBooking () {
initBooking() {
let $this = this
axios.get(this.url).then(response => {
this.bookingTable = response.data.data
})
},
RefreshBooking () {
RefreshBooking() {
let $this = this
this.loading_btn = true
axios.get(this.url).then(response => {
this.loading_btn = false
this.loading_btn = false;
this.bookingTable = response.data.data
this.$message({
showClose: true,
@@ -515,8 +508,8 @@ export default {
})
})
},
makePagination (data) {
let pagination = {
makePagination(data){
let pagination ={
current_page: data.current_page,
last_page: data.last_page,
next_page_url: data.next_page_url,
@@ -524,7 +517,7 @@ export default {
}
this.pagination = pagination
},
fetchPaginateBooking (url) {
fetchPaginateBooking(url) {
this.url = url
this.getBooking()
},
@@ -566,65 +559,66 @@ export default {
axios.post('api/booking/calculation', newConfirmation)
.then((response) => {
this.loading = false
this.bookingConfirmTable = response.data
this.bookingConfirmTable = response.data;
this.dialogFormVisible = false
this.dialogFormVisible1 = true
})
.catch((error) => {
this.$message({
showClose: true,
message: error.response.data.message,
type: 'error',
duration: 10000
})
showClose: true,
message: error.response.data.message,
type: 'error',
duration: 10000
});
this.loading = false
console.log(error)
})
} else {
this.loading = false
this.$message({
showClose: true,
message: 'Please fill the booking form in full.',
type: 'error',
duration: 10000
})
showClose: true,
message: 'Please fill the booking form in full.',
type: 'error',
duration: 10000
})
}
})
},
createBooking: function () {
this.loading = true,
this.dialogFormVisible1 = true
let newBooking = {
order_no: this.bookingForm.order_no,
payment_for: this.bookingForm.payment_for,
account_name: this.bookingForm.account_name,
account_num: this.bookingForm.account_num,
bank_name: this.bookingForm.bank_name,
bank_branch: this.bookingForm.bank_branch,
amount: this.booking.amount,
term: this.term
}
axios.post('api/booking', newBooking)
.then((response) => {
console.log(response)
this.loading = false
// push with return id
this.$router.push({
name: 'booking.user.upload',
params: {id: response.data.id }
})
// pass variable to another router
})
.catch((error) => {
console.log(error)
this.loading = false
this.$message({
showClose: true,
message: 'Internal server error. Please contact support',
type: 'error',
duration: 10000
})
})
let newBooking = {
order_no: this.bookingForm.order_no,
payment_for: this.bookingForm.payment_for,
account_name: this.bookingForm.account_name,
account_num: this.bookingForm.account_num,
bank_name: this.bookingForm.bank_name,
bank_branch: this.bookingForm.bank_branch,
amount: this.booking.amount,
term: this.term
}
axios.post('api/booking', newBooking)
.then((response) => {
console.log(response);
this.loading = false
// push with return id
this.$router.push({
name: 'booking.user.upload',
params: {id: response.data.id }
})
// pass variable to another router
})
.catch((error) => {
console.log(error)
this.loading = false
this.$message({
showClose: true,
message: 'Internal server error. Please contact support',
type: 'error',
duration: 10000
})
})
},
BookingStatus (status, booking_id) {
console.log(status)
resources/assets/js/pages/settings/admin-bank-setting.vue
+146 -142
View File
@@ -1,156 +1,160 @@
<template>
<div>
<div>
<span align="center"><h4>Bank Setting</h4></span><br>
<el-form :inline="true">
<el-form-item>
Active CIEF bank account for today :
X1 :
<el-select v-model="active_bank_setting.x1_bank_id" size="mini">
<el-option
v-for="item in options_CIEF"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item>
X2 :
<el-select v-model="active_bank_setting.x2_bank_id" size="mini">
<el-option
v-for="item in options_CIEF"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item>
Active CIEF China Beneficiary Account for Today :
<el-select v-model="active_bank_setting.beneficiary_id" size="mini">
<el-option
v-for="item in options_china_bank"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item>
<el-button :loading="loading_btn" type="primary" size="mini" @click="EditActiveBankSetting">Update</el-button>
</el-form-item>
<el-form-item>
Active CIEF bank account for today :
X1 :
<el-select v-model="active_bank_setting.x1_bank_id" size="mini">
<el-option
v-for="item in options_CIEF"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
X2 :
<el-select v-model="active_bank_setting.x2_bank_id" size="mini">
<el-option
v-for="item in options_CIEF"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
Active CIEF China Beneficiary Account for Today :
<el-select v-model="active_bank_setting.beneficiary_id" size="mini">
<el-option
v-for="item in options_china_bank"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" size="mini" :loading="loading_btn" @click="EditActiveBankSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
</div>
</template>
<script type="text/javascript">
import axios from 'axios'
export default {
// TODO : update credit limit and timeout
data () {
return {
options_CIEF: [],
options_china_bank: [],
active_bank_setting: {
x1_bank_id: null,
x2_bank_id: null,
beneficiary_id: null
},
loading_btn: false
// TODO : update credit limit and timeout
data() {
return {
options_CIEF: [],
options_china_bank: [],
active_bank_setting : {
x1_bank_id: null,
x2_bank_id: null,
beneficiary_id: null
},
loading_btn: false
};
},
beforeMount(){
this.UpdateMalaysiaBankOption();
this.UpdateChinaBankOption();
this.UpdateActiveBankSetting();
},
methods :{
UpdateMalaysiaBankOption : function(){
var malaysiaBankData;
axios.get('/api/setting-malaysia-bank')
.then((response) => {
malaysiaBankData = response.data;
this.options_CIEF = malaysiaBankData.map(function(item){
return {
value : item.id,
label : item.acc_no,
};
});
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
});
},
UpdateChinaBankOption : function(){
var chinaBankData;
axios.get('/api/setting-beneficiary')
.then((response) => {
chinaBankData = response.data;
this.options_china_bank = chinaBankData.map(function(item){
return {
value : item.id,
label : item.acc_no,
};
});
this.options_china_bank.unshift({
value : 0,
label : "Use Customer's Beneficiary"
});
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
});
},
UpdateActiveBankSetting : function(){
axios.get('/api/setting-active-bank')
.then((response) => {
this.active_bank_setting = response.data;
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
});
},
EditActiveBankSetting : function(){
this.loading_btn = true;
axios.put('/api/setting-active-bank', this.active_bank_setting)
.then((response) => {
this.loading_btn = false;
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false;
console.log(error);
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
});
})
},
}
},
beforeMount () {
this.UpdateMalaysiaBankOption()
this.UpdateChinaBankOption()
this.UpdateActiveBankSetting()
},
methods: {
UpdateMalaysiaBankOption: function () {
var malaysiaBankData
axios.get('/api/setting-malaysia-bank')
.then((response) => {
malaysiaBankData = response.data
this.options_CIEF = malaysiaBankData.map(function (item) {
return {
value: item.id,
label: item.acc_no
}
})
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
UpdateChinaBankOption: function () {
var chinaBankData
axios.get('/api/setting-beneficiary')
.then((response) => {
chinaBankData = response.data
this.options_china_bank = chinaBankData.map(function (item) {
return {
value: item.id,
label: item.acc_no
}
})
this.options_china_bank.unshift({
value: 0,
label: "Use Customer's Beneficiary"
})
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
UpdateActiveBankSetting: function () {
axios.get('/api/setting-active-bank')
.then((response) => {
this.active_bank_setting = response.data
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
EditActiveBankSetting: function () {
this.loading_btn = true
axios.put('/api/setting-active-bank', this.active_bank_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
})
})
}
}
}
</script>
</script>
resources/assets/js/pages/settings/admin-billing-charge-setting.vue
+61 -61
View File
@@ -1,65 +1,65 @@
<template>
<div>
<span align="center">
<h4>Billing Charge Setting</h4>
</span>
<br>
<el-form>
<el-form-item align="center">
Billing Charge Rate :
<el-input v-model="billing_charge_setting.billing_charge_rate" size="mini" style="width:20%"/> %
</el-form-item>
<el-form-item align="center">
<el-button :loading="loading_btn" type="primary" align="center" size="primary" @click="updateBillingChargeSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
<div>
<span align="center">
<h4>Billing Charge Setting</h4>
</span>
<br>
<el-form>
<el-form-item align="center">
Billing Charge Rate :
<el-input size="mini" v-model="billing_charge_setting.billing_charge_rate" style=width:20%></el-input> %
</el-form-item>
<el-form-item align="center">
<el-button type="primary" align="center" :loading="loading_btn" size="primary" @click="updateBillingChargeSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import axios from 'axios'
export default {
// TODO : update credit limit and timeout
data () {
return {
loading_btn: false,
billing_charge_setting: {
billing_charge_rate: null
}
}
},
beforeMount () {
this.getBillingChargeSetting()
},
methods: {
getBillingChargeSetting () {
axios.get('/api/setting-billing-charge').then(response => {
this.billing_charge_setting = response.data
})
},
updateBillingChargeSetting () {
this.loading_btn = true
axios.put('/api/setting-billing-charge', this.billing_charge_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
})
})
}
}
}
</script>
import axios from 'axios'
export default {
// TODO : update credit limit and timeout
data() {
return {
loading_btn: false,
billing_charge_setting: {
billing_charge_rate : null
},
};
},
beforeMount() {
this.getBillingChargeSetting();
},
methods: {
getBillingChargeSetting() {
axios.get('/api/setting-billing-charge').then(response => {
this.billing_charge_setting = response.data
})
},
updateBillingChargeSetting (){
this.loading_btn = true
axios.put('/api/setting-billing-charge', this.billing_charge_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
});
})
},
}
};
</script>
resources/assets/js/pages/settings/admin-china-bank.vue
+273 -269
View File
@@ -1,278 +1,281 @@
<template>
<div>
<span align="center"><h4>CIEF China Bank Details</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="company_name" label="Company Name" width="90px"/>
<el-table-column prop="bank_name" label="Bank Name"/>
<el-table-column prop="acc_no" label="Bank Account No" width="115px"/>
<el-table-column prop="bank_address" label="Bank Address" width="111px"/>
<el-table-column prop="swift" label="SWIFT Code"/>
<el-table-column prop="cnap" label="CNAP" width="80px"/>
<el-table-column prop="bank_branch" label="Bank Branch"/>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" @click="PopOutEditBeneficiaries(scope.$index)">Edit</el-button>
<el-button type="text" size="small" @click="DeleteBeneficiaries(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddBeneficiaries">Add New Data</el-button>
</div>
<!-- popup add new data -->
<el-dialog :visible.sync="AddDatadialogVisible" title="Add New Data" align="center" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.company_name" name="company_name"/>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.bank_name" name="bank_name"/>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.acc_no" name="acc_no"/>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.bank_address" name="bank_address"/>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.swift" name="swift"/>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.cnap" name="cnap" />
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.bank_branch" name="bank_branch"/>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="AddDatadialogVisible = false">Cancel</el-button>
<el-button :loading="loading_btn" :disabled="beneficiariesForm.company_name=='' || beneficiariesForm.bank_name=='' || beneficiariesForm.acc_no=='' || beneficiariesForm.bank_address=='' || beneficiariesForm.swift =='' || beneficiariesForm.cnap=='' || beneficiariesForm.bank_branch=='' ? true : false" type="primary" @click="CreateBeneficiaries">OK</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog :visible.sync="DoneAddDatadialogVisible" align="center" width="30%">
<span>Data Added Successfully</span><br><br>
<div align="center">
<el-button :loading="loading_btn" type="primary" @click="DoneAddDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup add new data end -->
<!-- popup edit data -->
<el-dialog :visible.sync="EditDatadialogVisible" title="Edit Data" align="center" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.company_name" name="company_name"/>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.bank_name" name="bank_name"/>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.acc_no" name="acc_no"/>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.bank_address" name="bank_address"/>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.swift" name="swift"/>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.cnap" name="cnap" />
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-validate="'required|max:191'" v-model="beneficiariesForm.bank_branch" name="bank_branch"/>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button :loading="loading_btn" :disabled="beneficiariesForm.company_name=='' || beneficiariesForm.bank_name=='' || beneficiariesForm.acc_no=='' || beneficiariesForm.bank_address=='' || beneficiariesForm.swift =='' || beneficiariesForm.cnap=='' || beneficiariesForm.bank_branch=='' ? true : false" type="primary" @click="EditBeneficiaries">Submit</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog :visible.sync="DoneUpdateDatadialogVisible" align="center" width="30%">
<span>Data Updated Successfully</span><br><br>
<div align="center">
<el-button :loading="loading_btn" type="primary" @click="DoneUpdateDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup edit data end -->
<!-- popup delete -->
<el-dialog :visible.sync="DeleteAdddialogVisible" align="center" width="30%">
<span>Data Deleted</span><br><br>
<div align="center">
<el-button :loading="loading_btn" type="primary" @click="DeleteAdddialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete end -->
</div>
<div>
<span align="center"><h4>CIEF China Bank Details</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="company_name" label="Company Name" width="90px"></el-table-column>
<el-table-column prop="bank_name" label="Bank Name"></el-table-column>
<el-table-column prop="acc_no" label="Bank Account No" width="115px"></el-table-column>
<el-table-column prop="bank_address" label="Bank Address" width="111px"></el-table-column>
<el-table-column prop="swift" label="SWIFT Code"></el-table-column>
<el-table-column prop="cnap" label="CNAP" width="80px"></el-table-column>
<el-table-column prop="bank_branch" label="Bank Branch"></el-table-column>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" @click="PopOutEditBeneficiaries(scope.$index)">Edit</el-button>
<el-button type="text" size="small" @click="DeleteBeneficiaries(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddBeneficiaries">Add New Data</el-button>
</div>
<!-- popup add new data -->
<el-dialog title="Add New Data" align="center" :visible.sync="AddDatadialogVisible" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-model="beneficiariesForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-model="beneficiariesForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-model="beneficiariesForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-model="beneficiariesForm.bank_address" v-validate="'required|max:191'" name="bank_address"></el-input>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-model="beneficiariesForm.swift" v-validate="'required|max:191'" name="swift"></el-input>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-model="beneficiariesForm.cnap" v-validate="'required|max:191'" name="cnap" ></el-input>
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-model="beneficiariesForm.bank_branch" v-validate="'required|max:191'" name="bank_branch"></el-input>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="AddDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" :loading="loading_btn" @click="CreateBeneficiaries" :disabled="beneficiariesForm.company_name=='' || beneficiariesForm.bank_name=='' || beneficiariesForm.acc_no=='' || beneficiariesForm.bank_address=='' || beneficiariesForm.swift =='' || beneficiariesForm.cnap=='' || beneficiariesForm.bank_branch=='' ? true : false">OK</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneAddDatadialogVisible" width="30%">
<span>Data Added Successfully</span><br><br>
<div align="center">
<el-button type="primary" :loading="loading_btn" @click="DoneAddDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup add new data end -->
<!-- popup edit data -->
<el-dialog title="Edit Data" align="center" :visible.sync="EditDatadialogVisible" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-model="beneficiariesForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-model="beneficiariesForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-model="beneficiariesForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-model="beneficiariesForm.bank_address" v-validate="'required|max:191'" name="bank_address"></el-input>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-model="beneficiariesForm.swift" v-validate="'required|max:191'" name="swift"></el-input>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-model="beneficiariesForm.cnap" v-validate="'required|max:191'" name="cnap" ></el-input>
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-model="beneficiariesForm.bank_branch" v-validate="'required|max:191'" name="bank_branch"></el-input>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" :loading="loading_btn" @click="EditBeneficiaries" :disabled="beneficiariesForm.company_name=='' || beneficiariesForm.bank_name=='' || beneficiariesForm.acc_no=='' || beneficiariesForm.bank_address=='' || beneficiariesForm.swift =='' || beneficiariesForm.cnap=='' || beneficiariesForm.bank_branch=='' ? true : false">Submit</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneUpdateDatadialogVisible" width="30%">
<span>Data Updated Successfully</span><br><br>
<div align="center">
<el-button type="primary" :loading="loading_btn" @click="DoneUpdateDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup edit data end -->
<!-- popup delete -->
<el-dialog align="center" :visible.sync="DeleteAdddialogVisible" width="30%">
<span>Data Deleted</span><br><br>
<div align="center">
<el-button type="primary" :loading="loading_btn" @click="DeleteAdddialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete end -->
</div>
</template>
<script>
import axios from 'axios'
import axios from 'axios'
export default {
data () {
return {
loading_btn: false,
tableData: [],
beneficiariesForm: {
company_name: '',
bank_name: '',
acc_no: '',
bank_address: '',
swift: '',
cnap: '',
bank_branch: ''
},
EditDatadialogVisible: false,
DeleteAdddialogVisible: false,
AddDatadialogVisible: false,
DoneAddDatadialogVisible: false,
DoneUpdateDatadialogVisible: false,
currentEdit: -1
}
},
beforeMount () {
this.UpdateTableData()
},
methods: {
CreateBeneficiaries: function () {
this.loading_btn = true
this.AddDatadialogVisible = false
axios.post('/api/setting-beneficiary', this.beneficiariesForm)
.then((response) => {
this.loading_btn = false
this.DoneAddDatadialogVisible = true
this.ClearBeneficiariesForm()
this.UpdateTableData()
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Create Fail',
type: 'error',
duration: 10000
})
this.ClearBeneficiariesForm()
})
},
UpdateTableData: function () {
this.loading_btn = true
axios.get('/api/setting-beneficiary', this.beneficiariesForm)
.then((response) => {
this.loading_btn = false
this.tableData = response.data
})
export default {
data() {
return {
loading_btn: false,
tableData: [],
beneficiariesForm : {
company_name : '',
bank_name : '',
acc_no : '',
bank_address : '',
swift : '',
cnap : '',
bank_branch : '',
},
EditDatadialogVisible: false,
DeleteAdddialogVisible: false,
AddDatadialogVisible: false,
DoneAddDatadialogVisible: false,
DoneUpdateDatadialogVisible: false,
currentEdit : -1,
}
},
beforeMount(){
this.UpdateTableData();
},
methods: {
CreateBeneficiaries : function(){
this.loading_btn = true
this.AddDatadialogVisible = false;
axios.post('/api/setting-beneficiary', this.beneficiariesForm)
.then((response) => {
this.loading_btn = false
this.DoneAddDatadialogVisible = true;
this.ClearBeneficiariesForm();
this.UpdateTableData();
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Create Fail',
type: 'error',
duration: 10000
});
this.ClearBeneficiariesForm();
});
},
UpdateTableData : function(){
this.loading_btn = true
axios.get('/api/setting-beneficiary', this.beneficiariesForm)
.then((response) => {
this.loading_btn = false
this.tableData = response.data;
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
})
},
DeleteBeneficiaries : function(beneficiaries_id){
this.loading_btn = true
this.DeleteAdddialogVisible = true;
axios.delete('/api/setting-beneficiary/' + beneficiaries_id)
.then((response) => {
this.loading_btn = false
this.UpdateTableData();
this.$message({
showClose: true,
message: 'Data Deleted Successfully',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
});
});
},
EditBeneficiaries : function(){
this.loading_btn = true
this.EditDatadialogVisible = false;
this.DoneUpdateDatadialogVisible = true;
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
DeleteBeneficiaries: function (beneficiaries_id) {
this.loading_btn = true
this.DeleteAdddialogVisible = true
axios.delete('/api/setting-beneficiary/' + beneficiaries_id)
.then((response) => {
this.loading_btn = false
this.UpdateTableData()
this.$message({
showClose: true,
message: 'Data Deleted Successfully',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
})
})
},
EditBeneficiaries: function () {
this.loading_btn = true
this.EditDatadialogVisible = false
this.DoneUpdateDatadialogVisible = true
axios.put('/api/setting-beneficiary/' + this.currentEdit, this.beneficiariesForm)
.then((response) => {
this.loading_btn = false
this.UpdateTableData()
this.$message({
showClose: true,
message: 'Data Updated Succesfully',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
})
})
},
PopOutAddBeneficiaries: function () {
this.AddDatadialogVisible = true
this.ClearBeneficiariesForm()
},
PopOutEditBeneficiaries: function (tableDataRow) {
this.EditDatadialogVisible = true
this.FillupBeneficiariesForm(tableDataRow)
this.currentEdit = this.tableData[tableDataRow].id
},
ClearBeneficiariesForm: function () {
this.beneficiariesForm.company_name = ''
this.beneficiariesForm.bank_name = ''
this.beneficiariesForm.acc_no = ''
this.beneficiariesForm.bank_address = ''
this.beneficiariesForm.swift = ''
this.beneficiariesForm.cnap = ''
this.beneficiariesForm.bank_branch = ''
},
FillupBeneficiariesForm: function (tableDataRow) {
this.beneficiariesForm.company_name = this.tableData[tableDataRow].company_name
this.beneficiariesForm.bank_name = this.tableData[tableDataRow].bank_name
this.beneficiariesForm.acc_no = this.tableData[tableDataRow].acc_no
this.beneficiariesForm.bank_address = this.tableData[tableDataRow].bank_address
this.beneficiariesForm.swift = this.tableData[tableDataRow].swift
this.beneficiariesForm.cnap = this.tableData[tableDataRow].cnap
this.beneficiariesForm.bank_branch = this.tableData[tableDataRow].bank_branch
}
}
}
axios.put('/api/setting-beneficiary/' + this.currentEdit, this.beneficiariesForm)
.then((response) => {
this.loading_btn = false
this.UpdateTableData();
this.$message({
showClose: true,
message: 'Data Updated Succesfully',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
});
});
},
PopOutAddBeneficiaries : function(){
this.AddDatadialogVisible = true;
this.ClearBeneficiariesForm();
},
PopOutEditBeneficiaries : function(tableDataRow){
this.EditDatadialogVisible = true;
this.FillupBeneficiariesForm(tableDataRow);
this.currentEdit = this.tableData[tableDataRow].id;
},
ClearBeneficiariesForm : function(){
this.beneficiariesForm.company_name = '';
this.beneficiariesForm.bank_name = '';
this.beneficiariesForm.acc_no = '';
this.beneficiariesForm.bank_address = '';
this.beneficiariesForm.swift = '';
this.beneficiariesForm.cnap = '';
this.beneficiariesForm.bank_branch = '';
},
FillupBeneficiariesForm : function(tableDataRow){
this.beneficiariesForm.company_name = this.tableData[tableDataRow].company_name;
this.beneficiariesForm.bank_name = this.tableData[tableDataRow].bank_name;
this.beneficiariesForm.acc_no = this.tableData[tableDataRow].acc_no;
this.beneficiariesForm.bank_address = this.tableData[tableDataRow].bank_address;
this.beneficiariesForm.swift = this.tableData[tableDataRow].swift;
this.beneficiariesForm.cnap = this.tableData[tableDataRow].cnap;
this.beneficiariesForm.bank_branch = this.tableData[tableDataRow].bank_branch;
}
}
}
</script>
<style type="text/css">
.error-message{
@@ -280,3 +283,4 @@ export default {
left: 0;
}
</style>
resources/assets/js/pages/settings/admin-credit-setting.vue
+78 -77
View File
@@ -1,82 +1,83 @@
<template>
<div>
<span align="center">
<h4>User Credit Limit Setting</h4>
</span>
<br>
<el-form>
<el-form-item align="center">
Time Limit for Customer to Upload Bank Slip :
<div>
<span align="center">
<h4>User Credit Limit Setting</h4>
</span>
<br>
<el-input v-model="credit_setting.time_limit" size="mini" style="width:20%"/> Seconds
</el-form-item>
<el-form-item align="center">
Credit Limit for RMB :
<el-input v-model="credit_setting.rmb_credit_limit" placeholder="Amount" size="mini" style="width:10%"/>
</el-form-item>
<el-form-item align="center">
<el-button :loading="loading_btn" type="primary" align="center" size="primary" @click="updateCreditSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
<el-form>
<el-form-item align="center">
Time Limit for Customer to Upload Bank Slip :
<br>
<el-input size="mini" v-model="credit_setting.time_limit" style=width:20%></el-input> Seconds
</el-form-item>
<el-form-item align="center">
Credit Limit for RMB :
<el-input placeholder="Amount" v-model="credit_setting.rmb_credit_limit" size="mini" style=width:10%></el-input>
</el-form-item>
<el-form-item align="center">
<el-button type="primary" align="center" :loading="loading_btn" size="primary" @click="updateCreditSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import axios from 'axios'
export default {
// TODO : update credit limit and timeout
data () {
return {
loading_btn: false,
credit_setting: {
rmb_credit_limit: null,
time_limit: null
},
TimeLimitDialogVisible: false,
CreditLimitDialogVisible: false
}
},
mounted () {
this.getCreditSetting()
},
methods: {
ValidateAll: function () {
var working
this.$validator.validateAll().then((result) => {
working = result
}).catch(() => {
})
},
getCreditSetting () {
axios.get('/api/setting-credit').then(response => {
this.credit_setting = response.data
})
},
updateCreditSetting () {
if (this.ValidateAll()) { return }
this.loading_btn = true
axios.put('/api/setting-credit', this.credit_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Time Limit and Credit Limit Updated Successfully',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
})
})
}
}
}
</script>
import axios from 'axios'
export default {
// TODO : update credit limit and timeout
data() {
return {
loading_btn: false,
credit_setting: {
rmb_credit_limit: null,
time_limit: null
},
TimeLimitDialogVisible: false,
CreditLimitDialogVisible: false
};
},
mounted() {
this.getCreditSetting();
},
methods: {
ValidateAll : function(){
var working;
this.$validator.validateAll().then((result) => {
working = result;
}).catch(() => {
});
},
getCreditSetting() {
axios.get('/api/setting-credit').then(response => {
this.credit_setting = response.data
})
},
updateCreditSetting (){
if(this.ValidateAll())
return;
this.loading_btn = true
axios.put('/api/setting-credit', this.credit_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Time Limit and Credit Limit Updated Successfully',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
});
})
},
}
};
</script>
resources/assets/js/pages/settings/admin-malaysia-bank.vue
+278 -273
View File
@@ -1,282 +1,286 @@
<template>
<div>
<span align="center"><h4>Malaysia Bank Details</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="company_name" label="Company Name" width="90px"/>
<el-table-column prop="bank_name" label="Bank Name"/>
<el-table-column prop="acc_no" label="Bank Account No" width="115px"/>
<el-table-column prop="bank_address" label="Bank Address" width="111px"/>
<el-table-column prop="swift" label="SWIFT Code"/>
<el-table-column prop="cnap" label="CNAP" width="80px"/>
<el-table-column prop="bank_branch" label="Bank Branch"/>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button :loading="loading_btn" type="text" size="small" @click="PopOutEditMalaysiaBank(scope.$index)">Edit</el-button>
<el-button :loading="loading_btn" type="text" size="small" @click="DeleteMalaysiaBank(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddMalaysiaBank">Add New Data</el-button>
</div>
<!-- popup add new data -->
<el-dialog :visible.sync="AddDatadialogVisible" title="Add New Data" align="center" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.company_name" name="company_name"/>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.bank_name" name="bank_name"/>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.acc_no" name="acc_no"/>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.bank_address" name="bank_address"/>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.swift" name="swift"/>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.cnap" name="cnap" />
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.bank_branch" name="bank_branch"/>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="AddDatadialogVisible = false">Cancel</el-button>
<el-button :loading="loading_btn" :disabled="malaysiaBankForm.company_name=='' || malaysiaBankForm.bank_name=='' || malaysiaBankForm.acc_no=='' || malaysiaBankForm.bank_address=='' || malaysiaBankForm.swift =='' || malaysiaBankForm.cnap=='' || malaysiaBankForm.bank_branch=='' ? true : false" type="primary" @click="CreateMalaysiaBank">OK</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog :visible.sync="DoneAddDatadialogVisible" align="center" width="30%">
<span>Data Added Successfully</span><br><br>
<div align="center">
<el-button :loading="loading_btn" type="primary" @click="DoneAddDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup add new data end -->
<!-- popup edit data -->
<el-dialog :visible.sync="EditDatadialogVisible" title="Edit Data" align="center" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.company_name" name="company_name"/>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.bank_name" name="bank_name"/>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.acc_no" name="acc_no"/>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.bank_address" name="bank_address"/>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.swift" name="swift"/>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.cnap" name="cnap" />
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-validate="'required|max:191'" v-model="malaysiaBankForm.bank_branch" name="bank_branch"/>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button :loading="loading_btn" :disabled="malaysiaBankForm.company_name=='' || malaysiaBankForm.bank_name=='' || malaysiaBankForm.acc_no=='' || malaysiaBankForm.bank_address=='' || malaysiaBankForm.swift =='' || malaysiaBankForm.cnap=='' || malaysiaBankForm.bank_branch=='' ? true : false" type="primary" @click="EditMalaysiaBank">Submit</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog :visible.sync="DoneUpdateDatadialogVisible" align="center" width="30%">
<span>Data Updated Successfully</span><br><br>
<div align="center">
<el-button :loading="loading_btn" type="primary" @click="DoneUpdateDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup edit data end -->
<!-- popup delete -->
<el-dialog :visible.sync="DeleteAdddialogVisible" align="center" width="30%">
<span>Data Deleted</span><br><br>
<div align="center">
<el-button :loading="loading_btn" type="primary" @click="DeleteAdddialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete end -->
</div>
<div>
<span align="center"><h4>Malaysia Bank Details</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="company_name" label="Company Name" width="90px"></el-table-column>
<el-table-column prop="bank_name" label="Bank Name"></el-table-column>
<el-table-column prop="acc_no" label="Bank Account No" width="115px"></el-table-column>
<el-table-column prop="bank_address" label="Bank Address" width="111px"></el-table-column>
<el-table-column prop="swift" label="SWIFT Code"></el-table-column>
<el-table-column prop="cnap" label="CNAP" width="80px"></el-table-column>
<el-table-column prop="bank_branch" label="Bank Branch"></el-table-column>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" :loading="loading_btn" @click="PopOutEditMalaysiaBank(scope.$index)">Edit</el-button>
<el-button type="text" size="small" :loading="loading_btn" @click="DeleteMalaysiaBank(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddMalaysiaBank">Add New Data</el-button>
</div>
<!-- popup add new data -->
<el-dialog title="Add New Data" align="center" :visible.sync="AddDatadialogVisible" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-model="malaysiaBankForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-model="malaysiaBankForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-model="malaysiaBankForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-model="malaysiaBankForm.bank_address" v-validate="'required|max:191'" name="bank_address"></el-input>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-model="malaysiaBankForm.swift" v-validate="'required|max:191'" name="swift"></el-input>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-model="malaysiaBankForm.cnap" v-validate="'required|max:191'" name="cnap" ></el-input>
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-model="malaysiaBankForm.bank_branch" v-validate="'required|max:191'" name="bank_branch"></el-input>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="AddDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" :loading="loading_btn" @click="CreateMalaysiaBank" :disabled="malaysiaBankForm.company_name=='' || malaysiaBankForm.bank_name=='' || malaysiaBankForm.acc_no=='' || malaysiaBankForm.bank_address=='' || malaysiaBankForm.swift =='' || malaysiaBankForm.cnap=='' || malaysiaBankForm.bank_branch=='' ? true : false">OK</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneAddDatadialogVisible" width="30%">
<span>Data Added Successfully</span><br><br>
<div align="center">
<el-button type="primary" :loading="loading_btn" @click="DoneAddDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup add new data end -->
<!-- popup edit data -->
<el-dialog title="Edit Data" align="center" :visible.sync="EditDatadialogVisible" width="40%">
<el-form label-width="150px">
<el-form-item label="Company Name">
<el-input v-model="malaysiaBankForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-model="malaysiaBankForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
</el-form-item>
<el-form-item label="Bank Account No">
<el-input v-model="malaysiaBankForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
</el-form-item>
<el-form-item label="Bank Address">
<el-input v-model="malaysiaBankForm.bank_address" v-validate="'required|max:191'" name="bank_address"></el-input>
</el-form-item>
<el-form-item label="SWIFT Code">
<el-input v-model="malaysiaBankForm.swift" v-validate="'required|max:191'" name="swift"></el-input>
</el-form-item>
<el-form-item label="CNAP">
<el-input v-model="malaysiaBankForm.cnap" v-validate="'required|max:191'" name="cnap" ></el-input>
</el-form-item>
<el-form-item label="Bank Branch">
<el-input v-model="malaysiaBankForm.bank_branch" v-validate="'required|max:191'" name="bank_branch"></el-input>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" :loading="loading_btn" @click="EditMalaysiaBank" :disabled="malaysiaBankForm.company_name=='' || malaysiaBankForm.bank_name=='' || malaysiaBankForm.acc_no=='' || malaysiaBankForm.bank_address=='' || malaysiaBankForm.swift =='' || malaysiaBankForm.cnap=='' || malaysiaBankForm.bank_branch=='' ? true : false">Submit</el-button>
</div>
<span slot="footer" class="dialog-footer">
* Please key in the data in Chinese
</span>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneUpdateDatadialogVisible" width="30%">
<span>Data Updated Successfully</span><br><br>
<div align="center">
<el-button type="primary" :loading="loading_btn" @click="DoneUpdateDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup edit data end -->
<!-- popup delete -->
<el-dialog align="center" :visible.sync="DeleteAdddialogVisible" width="30%">
<span>Data Deleted</span><br><br>
<div align="center">
<el-button type="primary" :loading="loading_btn" @click="DeleteAdddialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete end -->
</div>
</template>
<script>
import axios from 'axios'
import axios from 'axios'
export default {
data () {
return {
loading_btn: false,
tableData: [],
malaysiaBankForm: {
company_name: '',
bank_name: '',
acc_no: '',
bank_address: '',
swift: '',
cnap: '',
bank_branch: ''
},
EditDatadialogVisible: false,
DeleteAdddialogVisible: false,
AddDatadialogVisible: false,
DoneAddDatadialogVisible: false,
DoneUpdateDatadialogVisible: false,
currentEdit: -1
}
},
mounted () {
this.UpdateTableData()
export default {
data() {
return {
loading_btn: false,
tableData: [],
malaysiaBankForm : {
company_name : '',
bank_name : '',
acc_no : '',
bank_address : '',
swift : '',
cnap : '',
bank_branch : '',
},
EditDatadialogVisible: false,
DeleteAdddialogVisible: false,
AddDatadialogVisible: false,
DoneAddDatadialogVisible: false,
DoneUpdateDatadialogVisible: false,
currentEdit : -1,
}
},
mounted(){
this.UpdateTableData();
},
methods: {
CreateMalaysiaBank: function () {
this.loading_btn = true
this.AddDatadialogVisible = false
axios.post('/api/setting-malaysia-bank', this.malaysiaBankForm)
.then((response) => {
this.loading_btn = false
this.DoneAddDatadialogVisible = true
this.ClearMalaysiaBankForm()
this.UpdateTableData()
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Create Fail',
type: 'error',
duration: 10000
})
this.ClearMalaysiaBankForm()
})
},
UpdateTableData: function () {
this.loading_btn = true
axios.get('/api/setting-malaysia-bank', this.malaysiaBankForm)
.then((response) => {
this.loading_btn = false
this.tableData = response.data
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
DeleteMalaysiaBank: function (malaysiaBank_id) {
this.loading_btn = true
this.DeleteAdddialogVisible = true
axios.delete('/api/setting-malaysia-bank/' + malaysiaBank_id)
.then((response) => {
this.UpdateTableData()
this.$message({
showClose: true,
message: 'Data Deleted Successfully',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
})
})
},
EditMalaysiaBank: function () {
this.loading_btn = true
this.EditDatadialogVisible = false
this.DoneUpdateDatadialogVisible = true
axios.put('/api/setting-malaysia-bank/' + this.currentEdit, this.malaysiaBankForm)
.then((response) => {
this.loading_btn = false
this.UpdateTableData()
this.$message({
showClose: true,
message: 'Updated Successfully',
type: 'success',
duration: 5000
})
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
})
})
},
PopOutAddMalaysiaBank: function () {
this.AddDatadialogVisible = true
this.ClearMalaysiaBankForm()
},
PopOutEditMalaysiaBank: function (tableDataRow) {
this.EditDatadialogVisible = true
this.FillupMalaysiaBankForm(tableDataRow)
this.currentEdit = this.tableData[tableDataRow].id
},
ClearMalaysiaBankForm: function () {
this.malaysiaBankForm.company_name = ''
this.malaysiaBankForm.bank_name = ''
this.malaysiaBankForm.acc_no = ''
this.malaysiaBankForm.bank_address = ''
this.malaysiaBankForm.swift = ''
this.malaysiaBankForm.cnap = ''
this.malaysiaBankForm.bank_branch = ''
},
FillupMalaysiaBankForm: function (tableDataRow) {
this.malaysiaBankForm.company_name = this.tableData[tableDataRow].company_name
this.malaysiaBankForm.bank_name = this.tableData[tableDataRow].bank_name
this.malaysiaBankForm.acc_no = this.tableData[tableDataRow].acc_no
this.malaysiaBankForm.bank_address = this.tableData[tableDataRow].bank_address
this.malaysiaBankForm.swift = this.tableData[tableDataRow].swift
this.malaysiaBankForm.cnap = this.tableData[tableDataRow].cnap
this.malaysiaBankForm.bank_branch = this.tableData[tableDataRow].bank_branch
}
}
}
methods: {
CreateMalaysiaBank : function(){
this.loading_btn = true
this.AddDatadialogVisible = false;
axios.post('/api/setting-malaysia-bank', this.malaysiaBankForm)
.then((response) => {
this.loading_btn = false
this.DoneAddDatadialogVisible = true;
this.ClearMalaysiaBankForm();
this.UpdateTableData();
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Create Fail',
type: 'error',
duration: 10000
});
this.ClearMalaysiaBankForm();
});
},
UpdateTableData : function(){
this.loading_btn = true
axios.get('/api/setting-malaysia-bank', this.malaysiaBankForm)
.then((response) => {
this.loading_btn = false;
this.tableData = response.data;
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
})
},
DeleteMalaysiaBank : function(malaysiaBank_id){
this.loading_btn = true;
this.DeleteAdddialogVisible = true;
axios.delete('/api/setting-malaysia-bank/' + malaysiaBank_id)
.then((response) => {
this.UpdateTableData();
this.$message({
showClose: true,
message: 'Data Deleted Successfully',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false;
console.log(error);
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
});
});
},
EditMalaysiaBank : function(){
this.loading_btn = true;
this.EditDatadialogVisible = false;
this.DoneUpdateDatadialogVisible = true;
axios.put('/api/setting-malaysia-bank/' + this.currentEdit, this.malaysiaBankForm)
.then((response) => {
this.loading_btn = false;
this.UpdateTableData();
this.$message({
showClose: true,
message: 'Updated Successfully',
type: 'success',
duration: 5000
});
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
});
});
},
PopOutAddMalaysiaBank : function(){
this.AddDatadialogVisible = true;
this.ClearMalaysiaBankForm();
},
PopOutEditMalaysiaBank : function(tableDataRow){
this.EditDatadialogVisible = true;
this.FillupMalaysiaBankForm(tableDataRow);
this.currentEdit = this.tableData[tableDataRow].id;
},
ClearMalaysiaBankForm : function(){
this.malaysiaBankForm.company_name = '';
this.malaysiaBankForm.bank_name = '';
this.malaysiaBankForm.acc_no = '';
this.malaysiaBankForm.bank_address = '';
this.malaysiaBankForm.swift = '';
this.malaysiaBankForm.cnap = '';
this.malaysiaBankForm.bank_branch = '';
},
FillupMalaysiaBankForm : function(tableDataRow){
this.malaysiaBankForm.company_name = this.tableData[tableDataRow].company_name;
this.malaysiaBankForm.bank_name = this.tableData[tableDataRow].bank_name;
this.malaysiaBankForm.acc_no = this.tableData[tableDataRow].acc_no;
this.malaysiaBankForm.bank_address = this.tableData[tableDataRow].bank_address;
this.malaysiaBankForm.swift = this.tableData[tableDataRow].swift;
this.malaysiaBankForm.cnap = this.tableData[tableDataRow].cnap;
this.malaysiaBankForm.bank_branch = this.tableData[tableDataRow].bank_branch;
}
}
}
</script>
<style type="text/css">
.error-message{
@@ -284,3 +288,4 @@ export default {
left: 0;
}
</style>
resources/assets/js/pages/settings/admin-marking-setting.vue
+200 -197
View File
@@ -1,90 +1,90 @@
<template>
<div>
<span align="center"><h4>Marking Setting</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="marking" label="Marking" width="120px"/>
<el-table-column prop="email" label="Email"/>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" @click="PopOutEditMarking(scope.$index)">Edit</el-button>
<el-button type="text" size="small" @click="DeleteMarking(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddMarking">Add New Data</el-button>
</div>
<!-- popup add new data -->
<el-dialog :visible.sync="AddDatadialogVisible" title="Add New Data" align="center" width="40%">
<el-form ref="markingForm" :model="markingForm" :rules="rules">
<div align="right">
<el-form-item label="Marking" prop="marking">
<el-input v-model="markingForm.marking" type="text" style="width: 80%" />
</el-form-item>
<el-form-item label="Email" prop="email">
<el-input v-model="markingForm.email" type="text" style="width: 80%" />
</el-form-item>
</div>
</el-form>
<div align="right">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button :loading="loading_btn" type="primary" @click="CreateMarking('markingForm')">Add New Data</el-button>
</div>
<div>
<span align="center"><h4>Marking Setting</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="marking" label="Marking" width="120px"></el-table-column>
<el-table-column prop="email" label="Email"></el-table-column>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" @click="PopOutEditMarking(scope.$index)">Edit</el-button>
<el-button type="text" size="small" @click="DeleteMarking(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddMarking">Add New Data</el-button>
</div>
<!-- popup add new data -->
<el-dialog title="Add New Data" align="center" :visible.sync="AddDatadialogVisible" width="40%">
<el-form ref="markingForm" :model="markingForm" :rules="rules">
<div align="right">
<el-form-item label="Marking" prop="marking">
<el-input v-model="markingForm.marking" type="text" style="width: 80%" />
</el-form-item>
<el-form-item label="Email" prop="email">
<el-input v-model="markingForm.email" type="text" style="width: 80%" />
</el-form-item>
</div>
</el-form>
<div align="right">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" :loading="loading_btn" @click="CreateMarking('markingForm')">Add New Data</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="DoneAddDatadialogVisible" align="center" width="30%">
<span>Data Added Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneAddDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup add new data end -->
<!-- popup edit data -->
<el-dialog :visible.sync="EditDatadialogVisible" title="Edit Data" align="center" width="40%">
<el-form ref="markingForm" :model="markingForm" :rules="rules">
<div align="right">
<el-form-item label="Marking" prop="marking">
<el-input v-model="markingForm.marking" type="text" style="width: 80%" />
</el-form-item>
<el-form-item label="Email" prop="email">
<el-input v-model="markingForm.email" type="text" style="width: 80%" />
</el-form-item>
</div>
</el-form>
<div align="right">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" icon="el-icon-plus" @click="EditMarking">Submit</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="DoneUpdateDatadialogVisible" align="center" width="30%">
<span>Data Updated Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneUpdateDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup edit data end -->
<!-- popup delete -->
<el-dialog :visible.sync="DeleteAdddialogVisible" align="center" width="30%">
<span>Data Deleted</span><br><br>
<div align="center">
<el-button type="primary" @click="DeleteAdddialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete end -->
</div>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneAddDatadialogVisible" width="30%">
<span>Data Added Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneAddDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup add new data end -->
<!-- popup edit data -->
<el-dialog title="Edit Data" align="center" :visible.sync="EditDatadialogVisible" width="40%">
<el-form ref="markingForm" :model="markingForm" :rules="rules">
<div align="right">
<el-form-item label="Marking" prop="marking">
<el-input v-model="markingForm.marking" type="text" style="width: 80%" />
</el-form-item>
<el-form-item label="Email" prop="email">
<el-input v-model="markingForm.email" type="text" style="width: 80%" />
</el-form-item>
</div>
</el-form>
<div align="right">
<el-button @click="EditDatadialogVisible = false">Cancel</el-button>
<el-button type="primary" icon="el-icon-plus" @click="EditMarking">Submit</el-button>
</div>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneUpdateDatadialogVisible" width="30%">
<span>Data Updated Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneUpdateDatadialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup edit data end -->
<!-- popup delete -->
<el-dialog align="center" :visible.sync="DeleteAdddialogVisible" width="30%">
<span>Data Deleted</span><br><br>
<div align="center">
<el-button type="primary" @click="DeleteAdddialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete end -->
</div>
</template>
<script>
import axios from 'axios'
export default {
data () {
return {
loading_btn: false,
import axios from 'axios'
export default {
data() {
return {
loading_btn: false,
markingForm: {
marking: null,
email: null
marking : null,
email : null,
},
rules: {
rules: {
email: [{
required: true,
message: 'Please input email',
@@ -97,126 +97,127 @@ export default {
}]
},
tableData: [],
EditDatadialogVisible: false,
DeleteAdddialogVisible: false,
AddDatadialogVisible: false,
DoneAddDatadialogVisible: false,
DoneUpdateDatadialogVisible: false,
currentEdit: -1
}
},
mounted () {
this.UpdateTableData()
EditDatadialogVisible: false,
DeleteAdddialogVisible: false,
AddDatadialogVisible: false,
DoneAddDatadialogVisible: false,
DoneUpdateDatadialogVisible: false,
currentEdit : -1,
}
},
mounted(){
this.UpdateTableData();
},
methods: {
CreateMarking: function (formName) {
this.loading_btn = true
this.AddDatadialogVisible = false
this.$refs[formName].validate((valid) => {
if (valid) {
axios.post('/api/setting-marking', this.markingForm)
.then((response) => {
methods: {
CreateMarking : function(formName){
this.loading_btn = true
this.AddDatadialogVisible = false;
this.$refs[formName].validate((valid) => {
if (valid) {
axios.post('/api/setting-marking', this.markingForm)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
})
this.ClearMarkingForm()
this.UpdateTableData()
})
.catch((error) => {
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
});
this.ClearMarkingForm();
this.UpdateTableData();
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
})
this.ClearMarkingForm()
this.UpdateTableData()
})
} else {
this.$message({
showClose: true,
message: 'Please fillup form',
type: 'error',
duration: 10000
})
}
})
},
ClearMarkingForm: function () {
this.markingForm.marking = ''
this.markingForm.email = ''
},
UpdateTableData: function () {
axios.get('/api/setting-marking', this.markingForm)
.then((response) => {
this.tableData = response.data
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
DeleteMarking: function (marking_id) {
this.DeleteAdddialogVisible = true
console.log(marking_id)
axios.delete('/api/setting-marking/' + marking_id)
.then((response) => {
console.log('123fuck')
this.UpdateTableData()
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
})
})
},
EditMarking: function () {
this.EditDatadialogVisible = false
this.DoneUpdateDatadialogVisible = true
axios.put('/api/setting-marking/' + this.currentEdit, this.markingForm)
.then((response) => {
this.UpdateTableData()
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
})
})
},
PopOutAddMarking: function () {
this.AddDatadialogVisible = true
this.ClearMarkingForm()
},
PopOutEditMarking: function (tableDataRow) {
this.EditDatadialogVisible = true
this.FillupMarkingForm(tableDataRow)
this.currentEdit = this.tableData[tableDataRow].id
},
FillupMarkingForm: function (tableDataRow) {
this.markingForm.marking = this.tableData[tableDataRow].marking
this.markingForm.email = this.tableData[tableDataRow].email
}
}
}
console.log(error);
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
});
this.ClearMarkingForm();
this.UpdateTableData();
});
}
else{
this.$message({
showClose: true,
message: 'Please fillup form',
type: 'error',
duration: 10000
});
}
});
},
ClearMarkingForm : function(){
this.markingForm.marking = '';
this.markingForm.email = '';
},
UpdateTableData : function(){
axios.get('/api/setting-marking', this.markingForm)
.then((response) => {
this.tableData = response.data;
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
})
},
DeleteMarking : function(marking_id){
this.DeleteAdddialogVisible = true;
console.log(marking_id);
axios.delete('/api/setting-marking/' + marking_id)
.then((response) => {
console.log('123fuck');
this.UpdateTableData();
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
});
});
},
EditMarking : function(){
this.EditDatadialogVisible = false;
this.DoneUpdateDatadialogVisible = true;
axios.put('/api/setting-marking/' + this.currentEdit, this.markingForm)
.then((response) => {
this.UpdateTableData();
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
});
});
},
PopOutAddMarking : function(){
this.AddDatadialogVisible = true;
this.ClearMarkingForm();
},
PopOutEditMarking : function(tableDataRow){
this.EditDatadialogVisible = true;
this.FillupMarkingForm(tableDataRow);
this.currentEdit = this.tableData[tableDataRow].id;
},
FillupMarkingForm : function(tableDataRow){
this.markingForm.marking = this.tableData[tableDataRow].marking;
this.markingForm.email = this.tableData[tableDataRow].email;
}
},
}
</script>
<style type="text/css">
.error-message{
@@ -224,3 +225,5 @@ export default {
left: 0;
}
</style>
resources/assets/js/pages/settings/admin-supplier.vue
+214 -214
View File
@@ -1,223 +1,223 @@
<template>
<div>
<span align="center"><h4>Supplier Details</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="company_name" label="Company Name"/>
<el-table-column prop="supplier_reg_no" label="Registration No"/>
<el-table-column prop="gst_no" label="GST No"/>
<el-table-column prop="bank_name" label="Bank Name"/>
<el-table-column prop="acc_no" label="Account No"/>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" @click="PopOutEditSupplier(scope.$index)">Edit</el-button>
<el-button type="text" size="small" @click="DeleteSupplier(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddSupplier">Add New Supplier</el-button>
</div>
<!-- popup add new supplier -->
<el-dialog :visible.sync="AddNewSupplierdialogVisible" title="Add New Supplier" align="center" width="40%">
<el-form label-width="150px" >
<el-form-item label="Company Name">
<el-input v-validate="'required|max:191'" v-model="supplierForm.company_name" name="company_name"/>
</el-form-item>
<el-form-item label="Registration No">
<el-input v-validate="'required|max:191'" v-model="supplierForm.supplier_reg_no" name="supplier_reg_no"/>
</el-form-item>
<el-form-item label="GST No">
<el-input v-validate="'required|max:191'" v-model="supplierForm.gst_no" name="gst_no"/>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-validate="'required|max:191'" v-model="supplierForm.bank_name" name="bank_name"/>
</el-form-item>
<el-form-item label="Account No">
<el-input v-validate="'required|max:191'" v-model="supplierForm.acc_no" name="acc_no"/>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="AddNewSupplierdialogVisible = false">Cancel</el-button>
<el-button :disabled="supplierForm.company_name=='' || supplierForm.supplier_reg_no=='' || supplierForm.gst_no=='' || supplierForm.bank_name=='' || supplierForm.acc_no =='' ? true : false" type="primary" @click="CreateSupplier">OK</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="DoneAddSupplierdialogVisible" align="center" width="30%">
<span>Supplier Added Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneAddSupplierdialogVisible = false;">OK</el-button>
</div>
</el-dialog>
<!-- popup add new supplier end -->
<!-- popup edit supplier -->
<el-dialog :visible.sync="EditSupplierdialogVisible" title="Edit Supplier" align="center" width="40%">
<el-form label-width="150px" >
<el-form-item label="Company Name">
<el-input v-validate="'required|max:191'" v-model="supplierForm.company_name" name="company_name"/>
</el-form-item>
<el-form-item label="Registration No">
<el-input v-validate="'required|max:191'" v-model="supplierForm.supplier_reg_no" name="supplier_reg_no"/>
</el-form-item>
<el-form-item label="GST No">
<el-input v-validate="'required|max:191'" v-model="supplierForm.gst_no" name="gst_no"/>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-validate="'required|max:191'" v-model="supplierForm.bank_name" name="bank_name"/>
</el-form-item>
<el-form-item label="Account No">
<el-input v-validate="'required|max:191'" v-model="supplierForm.acc_no" name="acc_no"/>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="EditSupplierdialogVisible = false">Cancel</el-button>
<el-button :disabled="supplierForm.company_name=='' || supplierForm.supplier_reg_no=='' || supplierForm.gst_no=='' || supplierForm.bank_name=='' || supplierForm.acc_no =='' ? true : false" type="primary" @click="EditSupplier">OK</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="DoneUpdateSupplierdialogVisible" align="center" width="30%">
<span>Supplier's Details Updated Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneUpdateSupplierdialogVisible = false" >OK</el-button>
</div>
</el-dialog>
<!-- popup edit supplier end -->
<!-- popup delete supplier -->
<el-dialog :visible.sync="DeleteSupplierdialogVisible" align="center" width="30%">
<span>Supplier's Details Deleted</span><br><br>
<div align="center">
<el-button type="primary" @click="DeleteSupplierdialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete supplier end -->
</div>
<div>
<span align="center"><h4>Supplier Details</h4></span><br>
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="company_name" label="Company Name"></el-table-column>
<el-table-column prop="supplier_reg_no" label="Registration No"></el-table-column>
<el-table-column prop="gst_no" label="GST No"></el-table-column>
<el-table-column prop="bank_name" label="Bank Name"></el-table-column>
<el-table-column prop="acc_no" label="Account No"></el-table-column>
<el-table-column label="Action">
<template slot-scope="scope">
<el-button type="text" size="small" @click="PopOutEditSupplier(scope.$index)">Edit</el-button>
<el-button type="text" size="small" @click="DeleteSupplier(tableData[scope.$index].id)">Delete</el-button>
</template>
</el-table-column>
</el-table><br>
<div align="right">
<el-button type="primary" icon="el-icon-plus" @click="PopOutAddSupplier">Add New Supplier</el-button>
</div>
<!-- popup add new supplier -->
<el-dialog title="Add New Supplier" align="center" :visible.sync="AddNewSupplierdialogVisible" width="40%">
<el-form label-width="150px" >
<el-form-item label="Company Name">
<el-input v-model="supplierForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
</el-form-item>
<el-form-item label="Registration No">
<el-input v-model="supplierForm.supplier_reg_no" v-validate="'required|max:191'" name="supplier_reg_no"></el-input>
</el-form-item>
<el-form-item label="GST No">
<el-input v-model="supplierForm.gst_no" v-validate="'required|max:191'" name="gst_no"></el-input>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-model="supplierForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
</el-form-item>
<el-form-item label="Account No">
<el-input v-model="supplierForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="AddNewSupplierdialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="CreateSupplier" :disabled="supplierForm.company_name=='' || supplierForm.supplier_reg_no=='' || supplierForm.gst_no=='' || supplierForm.bank_name=='' || supplierForm.acc_no =='' ? true : false">OK</el-button>
</div>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneAddSupplierdialogVisible" width="30%">
<span>Supplier Added Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneAddSupplierdialogVisible = false;">OK</el-button>
</div>
</el-dialog>
<!-- popup add new supplier end -->
<!-- popup edit supplier -->
<el-dialog title="Edit Supplier" align="center" :visible.sync="EditSupplierdialogVisible" width="40%">
<el-form label-width="150px" >
<el-form-item label="Company Name">
<el-input v-model="supplierForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
</el-form-item>
<el-form-item label="Registration No">
<el-input v-model="supplierForm.supplier_reg_no" v-validate="'required|max:191'" name="supplier_reg_no"></el-input>
</el-form-item>
<el-form-item label="GST No">
<el-input v-model="supplierForm.gst_no" v-validate="'required|max:191'" name="gst_no"></el-input>
</el-form-item>
<el-form-item label="Bank Name">
<el-input v-model="supplierForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
</el-form-item>
<el-form-item label="Account No">
<el-input v-model="supplierForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
</el-form-item>
</el-form>
<div align="center">
<el-button @click="EditSupplierdialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="EditSupplier" :disabled="supplierForm.company_name=='' || supplierForm.supplier_reg_no=='' || supplierForm.gst_no=='' || supplierForm.bank_name=='' || supplierForm.acc_no =='' ? true : false">OK</el-button>
</div>
</el-dialog>
<el-dialog align="center" :visible.sync="DoneUpdateSupplierdialogVisible" width="30%">
<span>Supplier's Details Updated Successfully</span><br><br>
<div align="center">
<el-button type="primary" @click="DoneUpdateSupplierdialogVisible = false" >OK</el-button>
</div>
</el-dialog>
<!-- popup edit supplier end -->
<!-- popup delete supplier -->
<el-dialog align="center" :visible.sync="DeleteSupplierdialogVisible" width="30%">
<span>Supplier's Details Deleted</span><br><br>
<div align="center">
<el-button type="primary" @click="DeleteSupplierdialogVisible = false">OK</el-button>
</div>
</el-dialog>
<!-- popup delete supplier end -->
</div>
</template>
<script>
import axios from 'axios'
import axios from 'axios'
export default {
data () {
return {
tableData: [],
supplierForm: {
company_name: '',
supplier_reg_no: '',
gst_no: '',
bank_name: '',
acc_no: ''
},
AddNewSupplierdialogVisible: false,
EditSupplierdialogVisible: false,
DoneAddSupplierdialogVisible: false,
DoneUpdateSupplierdialogVisible: false,
DeleteSupplierdialogVisible: false,
currentEdit: -1
}
},
beforeMount () {
this.UpdateTableData()
},
methods: {
CreateSupplier: function () {
this.AddNewSupplierdialogVisible = false
axios.post('/api/setting-supplier', this.supplierForm)
.then((response) => {
this.DoneAddSupplierdialogVisible = true
this.UpdateTableData()
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Create Fail',
type: 'error',
duration: 10000
})
})
},
UpdateTableData: function () {
axios.get('/api/setting-supplier', this.supplierForm)
.then((response) => {
console.log(response.data)
this.tableData = response.data
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
})
})
},
DeleteSupplier: function (supplier_id) {
this.DeleteSupplierdialogVisible = true
axios.delete('/api/setting-supplier/' + supplier_id)
.then((response) => {
this.UpdateTableData()
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
})
})
},
EditSupplier: function () {
this.EditSupplierdialogVisible = false
this.DoneUpdateSupplierdialogVisible = true
export default {
data() {
return {
tableData: [],
supplierForm : {
company_name: '',
supplier_reg_no: '',
gst_no: '',
bank_name: '',
acc_no: '',
},
AddNewSupplierdialogVisible: false,
EditSupplierdialogVisible: false,
DoneAddSupplierdialogVisible: false,
DoneUpdateSupplierdialogVisible: false,
DeleteSupplierdialogVisible: false,
currentEdit: -1,
}
},
beforeMount(){
this.UpdateTableData();
},
methods:{
CreateSupplier : function(){
this.AddNewSupplierdialogVisible = false;
axios.post('/api/setting-supplier', this.supplierForm)
.then((response) => {
this.DoneAddSupplierdialogVisible = true;
this.UpdateTableData();
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Create Fail',
type: 'error',
duration: 10000
});
});
},
UpdateTableData : function(){
axios.get('/api/setting-supplier', this.supplierForm)
.then((response) => {
console.log(response.data)
this.tableData = response.data;
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Fetch data fail',
type: 'error',
duration: 10000
});
})
},
DeleteSupplier : function(supplier_id){
this.DeleteSupplierdialogVisible = true;
axios.delete('/api/setting-supplier/' + supplier_id)
.then((response) => {
this.UpdateTableData();
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Delete data fail',
type: 'error',
duration: 10000
});
})
},
EditSupplier : function(){
this.EditSupplierdialogVisible = false;
this.DoneUpdateSupplierdialogVisible = true;
axios.put('/api/setting-supplier/' + this.currentEdit, this.supplierForm)
.then((response) => {
this.UpdateTableData()
})
.catch((error) => {
console.log(error)
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
})
})
},
PopOutAddSupplier: function () {
this.AddNewSupplierdialogVisible = true
this.ClearSupplierForm()
},
PopOutEditSupplier: function (tableDataRow) {
this.EditSupplierdialogVisible = true
this.FillupSupplierForm(tableDataRow)
this.currentEdit = this.tableData[tableDataRow].id
},
ClearSupplierForm: function () {
this.supplierForm.company_name = ''
this.supplierForm.supplier_reg_no = ''
this.supplierForm.gst_no = ''
this.supplierForm.bank_name = ''
this.supplierForm.acc_no = ''
},
FillupSupplierForm: function (tableDataRow) {
this.supplierForm.company_name = this.tableData[tableDataRow].company_name
this.supplierForm.supplier_reg_no = this.tableData[tableDataRow].supplier_reg_no
this.supplierForm.gst_no = this.tableData[tableDataRow].gst_no
this.supplierForm.bank_name = this.tableData[tableDataRow].bank_name
this.supplierForm.acc_no = this.tableData[tableDataRow].acc_no
}
}
}
axios.put('/api/setting-supplier/' + this.currentEdit, this.supplierForm)
.then((response) => {
this.UpdateTableData();
})
.catch((error) => {
console.log(error);
this.$message({
showClose: true,
message: 'Update Fail',
type: 'error',
duration: 10000
});
})
},
PopOutAddSupplier : function(){
this.AddNewSupplierdialogVisible = true;
this.ClearSupplierForm();
},
PopOutEditSupplier : function(tableDataRow){
this.EditSupplierdialogVisible = true;
this.FillupSupplierForm(tableDataRow);
this.currentEdit = this.tableData[tableDataRow].id;
},
ClearSupplierForm : function(){
this.supplierForm.company_name = '';
this.supplierForm.supplier_reg_no = '';
this.supplierForm.gst_no = '';
this.supplierForm.bank_name = '';
this.supplierForm.acc_no = '';
},
FillupSupplierForm : function(tableDataRow){
this.supplierForm.company_name = this.tableData[tableDataRow].company_name;
this.supplierForm.supplier_reg_no = this.tableData[tableDataRow].supplier_reg_no;
this.supplierForm.gst_no = this.tableData[tableDataRow].gst_no;
this.supplierForm.bank_name = this.tableData[tableDataRow].bank_name;
this.supplierForm.acc_no = this.tableData[tableDataRow].acc_no;
}
}
}
</script>
<style type="text/css">
.error-message{
resources/assets/js/pages/settings/admin-tax-setting.vue
+62 -62
View File
@@ -1,66 +1,66 @@
<template>
<div>
<span align="center">
<h4>Tax Setting</h4>
</span>
<br>
<el-form>
<el-form-item align="center">
Tax :
<el-input v-model="tax_setting.tax_rate" size="mini" style="width:20%"/> <br>(Example : 1%, input 1.01 and 0% input 1.0)
</el-form-item>
<el-form-item align="center">
<el-button :loading="loading_btn" type="primary" align="center" size="primary" @click="updateTaxSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
<div>
<span align="center">
<h4>Tax Setting</h4>
</span>
<br>
<el-form>
<el-form-item align="center">
Tax :
<el-input size="mini" v-model="tax_setting.tax_rate" style=width:20%></el-input> <br>(Example : 1%, input 1.01 and 0% input 1.0)
</el-form-item>
<el-form-item align="center">
<el-button type="primary" align="center" :loading="loading_btn" size="primary" @click="updateTaxSetting">Update</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import axios from 'axios'
export default {
data () {
return {
loading_btn: false,
tax_setting: {
tax_rate: null
}
}
},
mounted () {
this.getTaxSetting()
},
methods: {
getTaxSetting () {
axios.get('/api/setting-tax').then(response => {
this.tax_setting = response.data
console.log(this.tax_setting)
})
},
updateTaxSetting () {
this.loading_btn = true
console.log(this.tax_setting)
axios.put('/api/setting-tax', this.tax_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
})
})
.catch((error) => {
this.loading_btn = false
console.log(error)
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
})
})
}
}
}
</script>
import axios from 'axios'
export default {
data() {
return {
loading_btn: false,
tax_setting: {
tax_rate : null
},
};
},
mounted() {
this.getTaxSetting();
},
methods: {
getTaxSetting() {
axios.get('/api/setting-tax').then(response => {
this.tax_setting = response.data;
console.log(this.tax_setting);
})
},
updateTaxSetting (){
this.loading_btn = true
console.log(this.tax_setting);
axios.put('/api/setting-tax', this.tax_setting)
.then((response) => {
this.loading_btn = false
this.$message({
showClose: true,
message: 'Success',
type: 'success',
duration: 5000
});
})
.catch((error) => {
this.loading_btn = false
console.log(error);
this.$message({
showClose: true,
message: 'Update failed, please contact support',
type: 'error',
duration: 10000
});
})
},
}
};
</script>
resources/assets/js/pages/settings/index.vue
+73 -72
View File
@@ -21,86 +21,87 @@
</template>
<script>
import {
mapGetters
} from 'vuex'
export default {
middleware: 'check-auth',
import {
mapGetters
} from 'vuex'
export default {
middleware: 'check-auth',
computed: {
role () {
return this.$store.getters['auth/role']
},
tabs () {
return [{
icon: 'user',
name: this.$t('profile'),
route: 'settings.profile',
role: 'member'
computed: {
role() {
return this.$store.getters['auth/role']
},
{
icon: 'lock',
name: this.$t('password'),
route: 'settings.password',
role: 'member'
},
{
icon: 'user',
name: this.$t('Supplier'),
route: 'settings.admin-supplier',
role: 'admin'
},
{
icon: 'cog',
name: this.$t('Credit Setting'),
route: 'settings.admin-credit-setting',
role: 'admin'
},
{
icon: 'flag',
name: this.$t('CIEF China Bank'),
route: 'settings.admin-china-bank',
role: 'admin'
},
{
icon: 'flag',
name: this.$t('CIEF Malaysia Bank'),
route: 'settings.admin-malaysia-bank',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Bank Setting'),
route: 'settings.admin-bank-setting',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Marking Setting'),
route: 'settings.admin-marking-setting',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Tax Setting'),
route: 'settings.admin-tax-setting',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Billing Charge Setting'),
route: 'settings.admin-billing-charge-setting',
role: 'admin'
tabs() {
return [{
icon: 'user',
name: this.$t('profile'),
route: 'settings.profile',
role: 'member'
},
{
icon: 'lock',
name: this.$t('password'),
route: 'settings.password',
role: 'member'
},
{
icon: 'user',
name: this.$t('Supplier'),
route: 'settings.admin-supplier',
role: 'admin'
},
{
icon: 'cog',
name: this.$t('Credit Setting'),
route: 'settings.admin-credit-setting',
role: 'admin'
},
{
icon: 'flag',
name: this.$t('CIEF China Bank'),
route: 'settings.admin-china-bank',
role: 'admin'
},
{
icon: 'flag',
name: this.$t('CIEF Malaysia Bank'),
route: 'settings.admin-malaysia-bank',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Bank Setting'),
route: 'settings.admin-bank-setting',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Marking Setting'),
route: 'settings.admin-marking-setting',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Tax Setting'),
route: 'settings.admin-tax-setting',
role: 'admin'
},
{
icon: 'building',
name: this.$t('Billing Charge Setting'),
route: 'settings.admin-billing-charge-setting',
role: 'admin'
},
]
}
]
}
}
}
}
</script>
<style>
.settings-card .card-body {
padding: 0;
}
</style>
</style>
resources/assets/js/pages/welcome.vue
+14 -14
View File
@@ -19,24 +19,24 @@
</template>
<script>
import { mapGetters } from 'vuex'
import { mapGetters } from 'vuex'
export default {
middleware: 'guest',
layout: 'basic',
export default {
middleware: 'guest',
layout: 'basic',
metaInfo () {
return { title: this.$t('home') }
},
metaInfo () {
return { title: this.$t('home') }
},
data: () => ({
title: window.config.appName
}),
data: () => ({
title: window.config.appName
}),
computed: mapGetters({
authenticated: 'auth/check'
})
}
computed: mapGetters({
authenticated: 'auth/check'
})
}
</script>
<style scoped>
resources/assets/js/router/routes.js
+1 -1
View File
@@ -64,7 +64,7 @@ export default [
{ path: 'admin-bank-setting', name: 'settings.admin-bank-setting', component: SettingsAdminBankSetting },
{ path: 'admin-marking-setting', name: 'settings.admin-marking-setting', component: SettingsAdminMarkingSetting },
{ path: 'admin-tax-setting', name: 'settings.admin-tax-setting', component: SettingsAdminTaxSetting },
{ path: 'admin-billing-charge-setting', name: 'settings.admin-billing-charge-setting', component: SettingsAdminBillingChargeSetting }
{ path: 'admin-billing-charge-setting', name: 'settings.admin-billing-charge-setting', component: SettingsAdminBillingChargeSetting },
] },
// Booking