mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange.git
synced 2026-08-19 04:14:04 +00:00
completed transfer frontend
completed upload po frontend
This commit is contained in:
Jack Goh
@@ -3,7 +3,7 @@
|
||||
<progress-track v-model="status"></progress-track>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Waiting Bankin Slip To Be Verify</h4>
|
||||
<h4 style="margin-top:5%;">Bankin Slip Verification In Progress</h4>
|
||||
<br>
|
||||
<el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"></progress-track>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Transfer In Progress</h4>
|
||||
<br>
|
||||
<h5> ETA : 3 days 14 Hours </h5>
|
||||
<br>
|
||||
<el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
|
||||
</div>
|
||||
<br>
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Order Details</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" align="center" :show-header="false">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable2" align="center" :show-header="false">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
<br>
|
||||
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>BankinSlip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<img src="http://via.placeholder.com/600x400" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import VueCountdown from '@dmaksimovic/vue-countdown'
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
'progress-track': ProgressTrack
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
status: 4,
|
||||
bookingConfirmTable: [{
|
||||
data1: 'Order Number :',
|
||||
data2: '001'
|
||||
}, {
|
||||
data1: 'Date :',
|
||||
data2: '25/5/2018'
|
||||
}, {
|
||||
data1: 'Customer Marking :',
|
||||
data2: 'CIEF/150ECE'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: ''
|
||||
}, {
|
||||
data1: 'Payment Method :',
|
||||
data2: 'Cash/Bank Transfer'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: ''
|
||||
}],
|
||||
bookingConfirmTable2:[{
|
||||
data1: 'CNY/RMB :',
|
||||
data2: 'CNY 120,500.00'
|
||||
}, {
|
||||
data1: '+ Service Charge :',
|
||||
data2: 'CNY 20.00'
|
||||
}, {
|
||||
data1: '/ RATE :',
|
||||
data2: '1.63'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: 'MYR 73,848.04'
|
||||
}, {
|
||||
data1: '+ GST 6% :',
|
||||
data2: 'MYR 4,430.88'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: 'MYR 78,278.92'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: ''
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"></progress-track>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Transfer Completed</h4>
|
||||
<h5> Please upload your PO </h5>
|
||||
<br>
|
||||
</div>
|
||||
|
||||
<!-- upload card -->
|
||||
<br>
|
||||
<el-row :gutter="12" justify="center" align="center">
|
||||
<el-col :span="12">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Upload PO</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
|
||||
<!-- upload image -->
|
||||
<el-upload class="upload-demo" drag action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove"
|
||||
:file-list="fileList" multiple>
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">Drop file here or
|
||||
<em>click to upload</em>
|
||||
</div>
|
||||
<div class="el-upload__tip" slot="tip">jpg/png files with a size less than 500kb</div>
|
||||
</el-upload>
|
||||
<br>
|
||||
<!-- upload image end -->
|
||||
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Proof : China BankSlip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row type="flex" :gutter="12">
|
||||
<el-col :span="12">
|
||||
<a href="https://placeholder.com">
|
||||
<img width="100%" height="100%" src="http://via.placeholder.com/700x800">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<br>
|
||||
|
||||
<!-- order details -->
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Order Details</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" align="center" :show-header="false">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable2" align="center" :show-header="false">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
<br>
|
||||
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>BankinSlip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<img src="http://via.placeholder.com/600x400" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import VueCountdown from '@dmaksimovic/vue-countdown'
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
'progress-track': ProgressTrack
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
status: 5,
|
||||
bookingConfirmTable: [{
|
||||
data1: 'Order Number :',
|
||||
data2: '001'
|
||||
}, {
|
||||
data1: 'Date :',
|
||||
data2: '25/5/2018'
|
||||
}, {
|
||||
data1: 'Customer Marking :',
|
||||
data2: 'CIEF/150ECE'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: ''
|
||||
}, {
|
||||
data1: 'Payment Method :',
|
||||
data2: 'Cash/Bank Transfer'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: ''
|
||||
}],
|
||||
bookingConfirmTable2: [{
|
||||
data1: 'CNY/RMB :',
|
||||
data2: 'CNY 120,500.00'
|
||||
}, {
|
||||
data1: '+ Service Charge :',
|
||||
data2: 'CNY 20.00'
|
||||
}, {
|
||||
data1: '/ RATE :',
|
||||
data2: '1.63'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: 'MYR 73,848.04'
|
||||
}, {
|
||||
data1: '+ GST 6% :',
|
||||
data2: 'MYR 4,430.88'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: 'MYR 78,278.92'
|
||||
}, {
|
||||
data1: '',
|
||||
data2: ''
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -452,7 +452,7 @@
|
||||
BookingStatus(index, row) {
|
||||
|
||||
// TODO : Get booking status from server
|
||||
this.status = 3
|
||||
this.status = 5
|
||||
|
||||
switch (this.status) {
|
||||
case 1:
|
||||
@@ -472,19 +472,19 @@
|
||||
break;
|
||||
case 4:
|
||||
this.$router.push({
|
||||
name: 'booking.user.upload'
|
||||
name: 'booking.transfer'
|
||||
})
|
||||
break;
|
||||
|
||||
case 5:
|
||||
this.$router.push({
|
||||
name: 'booking.user.upload'
|
||||
name: 'booking.user.uploadpo'
|
||||
})
|
||||
break;
|
||||
|
||||
case 6:
|
||||
this.$router.push({
|
||||
name: 'booking.user.upload'
|
||||
name: 'booking.user.complete'
|
||||
})
|
||||
break;
|
||||
default:
|
||||
|
||||
Reference in New Issue
Block a user