mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange.git
synced 2026-08-19 12:24:09 +00:00
Almost Done
This commit is contained in:
@@ -0,0 +1,80 @@
|
||||
APP_NAME=IZYIM
|
||||
APP_ENV=local
|
||||
APP_KEY=base64:Fu2YulXExzm9HJ5LgVmZUmcbRkchHkc82q02MorN5GQ=
|
||||
APP_DEBUG=true
|
||||
APP_URL=http://localhost
|
||||
|
||||
LOG_CHANNEL=stack
|
||||
|
||||
DB_CONNECTION=mysql
|
||||
DB_HOST=mysql
|
||||
DB_PORT=3306
|
||||
DB_DATABASE=default
|
||||
DB_USERNAME=default
|
||||
DB_PASSWORD=secret
|
||||
|
||||
BROADCAST_DRIVER=log
|
||||
CACHE_DRIVER=file
|
||||
SESSION_DRIVER=file
|
||||
SESSION_LIFETIME=120
|
||||
QUEUE_DRIVER=sync
|
||||
|
||||
REDIS_HOST=127.0.0.1
|
||||
REDIS_PASSWORD=null
|
||||
REDIS_PORT=6379
|
||||
|
||||
MAIL_DRIVER=smtp
|
||||
MAIL_HOST=smtp.mailtrap.io
|
||||
MAIL_PORT=2525
|
||||
MAIL_USERNAME=null
|
||||
MAIL_PASSWORD=null
|
||||
MAIL_ENCRYPTION=null
|
||||
|
||||
PUSHER_APP_ID=
|
||||
PUSHER_APP_KEY=
|
||||
PUSHER_APP_SECRET=
|
||||
PUSHER_APP_CLUSTER=mt1
|
||||
|
||||
MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
|
||||
MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
|
||||
APP_NAME=exchange
|
||||
APP_ENV=local
|
||||
APP_KEY=base64:Fu2YulXExzm9HJ5LgVmZUmcbRkchHkc82q02MorN5GQ=
|
||||
APP_DEBUG=true
|
||||
APP_URL=http://localhost
|
||||
|
||||
LOG_CHANNEL=stack
|
||||
|
||||
DB_CONNECTION=mysql
|
||||
DB_HOST=mysql
|
||||
DB_PORT=3306
|
||||
DB_DATABASE=default
|
||||
DB_USERNAME=default
|
||||
DB_PASSWORD=secret
|
||||
|
||||
BROADCAST_DRIVER=log
|
||||
CACHE_DRIVER=file
|
||||
SESSION_DRIVER=file
|
||||
SESSION_LIFETIME=120
|
||||
QUEUE_DRIVER=sync
|
||||
|
||||
REDIS_HOST=127.0.0.1
|
||||
REDIS_PASSWORD=null
|
||||
REDIS_PORT=6379
|
||||
|
||||
MAIL_DRIVER=smtp
|
||||
MAIL_HOST=smtp.mailtrap.io
|
||||
MAIL_PORT=2525
|
||||
MAIL_USERNAME=null
|
||||
MAIL_PASSWORD=null
|
||||
MAIL_ENCRYPTION=null
|
||||
|
||||
PUSHER_APP_ID=
|
||||
PUSHER_APP_KEY=
|
||||
PUSHER_APP_SECRET=
|
||||
PUSHER_APP_CLUSTER=mt1
|
||||
|
||||
MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
|
||||
MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
|
||||
|
||||
JWT_SECRET=FwYZ3SPFgjpEDqAwcaSIV6eEmQiMtGWt
|
||||
@@ -770,20 +770,19 @@ class BookingController extends Controller
|
||||
|
||||
public function adminShowCompletedOrders()
|
||||
{
|
||||
$bookings = Booking::select('id', 'company_name','company_address','created_at','rate','amount', 'rmb_book_amount', 'admin_status')
|
||||
$bookings = Booking::select('id','created_at','user_id','rate','amount', 'bia', 'admin_status')
|
||||
->where('admin_status', 7)
|
||||
->orderBy('id', 'desc')
|
||||
->get();
|
||||
|
||||
foreach ($bookings as $booking) {
|
||||
$booking->id;
|
||||
$booking->company_name;
|
||||
$booking->company_address;
|
||||
$booking->created_at;
|
||||
$booking->marking = $booking->user->marking;
|
||||
$booking->rate;
|
||||
$booking->amount;
|
||||
$booking->rmb_book_amount;
|
||||
$booking->admin_status;
|
||||
$booking->bia;
|
||||
$booking->admin_status = "(". $booking->admin_status ."/7)";;
|
||||
}
|
||||
return $bookings;
|
||||
}
|
||||
|
||||
@@ -19,11 +19,11 @@
|
||||
## Installation
|
||||
|
||||
- `git clone git@gitlab.com:CIEFWorldwideSdnBhd/exchange.git`
|
||||
- `cd` in your working folder
|
||||
- Copy `.env-example` to `.env`
|
||||
- Edit `.env` and set your database connection details
|
||||
- `Comp` run `php artisan key:generate` and `php artisan jwt:secret`)
|
||||
- `php artisan migrate`
|
||||
- `yarn` / `npm install`
|
||||
- Run `docker-compose up`
|
||||
- Open another git bash run `yarn install`
|
||||
- Run `yarn run watch`
|
||||
|
||||
## Usage
|
||||
|
||||
|
||||
@@ -13,24 +13,31 @@
|
||||
</a>
|
||||
</div>
|
||||
</li> -->
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<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>
|
||||
</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 class="nav-link" href="#" role="button" slot="reference">Update Rate</a>
|
||||
<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>
|
||||
</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 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.complete' }" class="nav-link">{{ $t('Complete Order') }}</router-link></li> -->
|
||||
<li v-if="(user && role == 'admin')" class="nav-item"><router-link :to="{ name: 'admin.transaction-history' }" class="nav-link">{{ $t('Transaction History') }}</router-link></li>
|
||||
<!-- <li v-if="(user && role == 'admin')" class="nav-item"><router-link :to="{ name: 'admin.upload-supplier-bank-slip' }" class="nav-link">{{ $t('Upload Supplier Bank Slip to System') }}</router-link></li> -->
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
<li v-if="(user && role == 'admin')" class="nav-item">
|
||||
<router-link :to="{ name: 'admin.transaction-history' }" class="nav-link">
|
||||
{{ $t('Transaction History') }}
|
||||
</router-link>
|
||||
</li>
|
||||
<li v-if="(user && role == 'admin')" class="nav-item">
|
||||
<router-link :to="{ name: 'admin.complete' }" class="nav-link">
|
||||
{{ $t('Completed Orders') }}
|
||||
</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- update rate dialog start -->
|
||||
<el-dialog align="center" :visible.sync="UpdateRateDialogVisible" width="900px">
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
</button>
|
||||
|
||||
<div id="navbarToggler" class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<locale-dropdown/>
|
||||
<!-- <li class="nav-item">
|
||||
<a class="nav-link" href="#">Link</a>
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<div align="right">
|
||||
<el-button icon="el-icon-refresh" type="primary" size="mini" @click="RefreshCompletedOrders()">Refresh</el-button>
|
||||
</div>
|
||||
<h1 align="center">Completed Orders</h1>
|
||||
<el-table :data="tableData" stripe height="500" style="width: 100%">
|
||||
<el-table-column label="Order No" prop="id" sortable></el-table-column>
|
||||
<el-table-column label="Company Name" prop="company_name"></el-table-column>
|
||||
<el-table-column label="Company Address" prop="company_address"></el-table-column>
|
||||
<el-table-column label="Order Date" prop="created_at" sortable></el-table-column>
|
||||
<el-table-column label="Rate" prop="rate" sortable></el-table-column>
|
||||
<el-table-column label="Amount" prop="amount" sortable></el-table-column>
|
||||
<el-table-column label="Transfer Amount (RMB)" prop="rmb_book_amount" sortable></el-table-column>
|
||||
<el-table-column label="Status" prop="admin_status"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
url: '/api/admin/complete-order',
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.RefreshCompletedOrders()
|
||||
},
|
||||
methods: {
|
||||
RefreshCompletedOrders() {
|
||||
let $this = this
|
||||
axios.get(this.url).then(response => {
|
||||
this.tableData = response.data
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<div>
|
||||
<div align="right">
|
||||
<el-button icon="el-icon-refresh" type="primary" size="mini" @click="RefreshCompletedOrders()">Refresh</el-button>
|
||||
</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="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',
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.RefreshCompletedOrders()
|
||||
},
|
||||
methods: {
|
||||
RefreshCompletedOrders() {
|
||||
let $this = this
|
||||
axios.get(this.url).then(response => {
|
||||
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 }
|
||||
})
|
||||
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 7:
|
||||
this.$router.push({
|
||||
name: 'booking.admin.complete',
|
||||
params: {id: booking_id }
|
||||
})
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,55 +1,57 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-lg-8 m-auto">
|
||||
<card :title="$t('login')">
|
||||
<form @submit.prevent="login" @keydown="form.onKeydown($event)">
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email">
|
||||
<has-error :form="form" field="email"/>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 m-auto">
|
||||
<card :title="$t('login')">
|
||||
<form @submit.prevent="login" @keydown="form.onKeydown($event)">
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email">
|
||||
<has-error :form="form" field="email"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Password -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.password" :class="{ 'is-invalid': form.errors.has('password') }" class="form-control" type="password" name="password">
|
||||
<has-error :form="form" field="password"/>
|
||||
<!-- Password -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.password" :class="{ 'is-invalid': form.errors.has('password') }" class="form-control" type="password" name="password">
|
||||
<has-error :form="form" field="password"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Remember Me -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-3"/>
|
||||
<div class="col-md-7 d-flex">
|
||||
<checkbox v-model="remember" name="remember">
|
||||
{{ $t('remember_me') }}
|
||||
</checkbox>
|
||||
<!-- Remember Me -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-3"/>
|
||||
<div class="col-md-7 d-flex">
|
||||
<checkbox v-model="remember" name="remember">
|
||||
{{ $t('remember_me') }}
|
||||
</checkbox>
|
||||
|
||||
<router-link :to="{ name: 'password.request' }" class="small ml-auto my-auto">
|
||||
{{ $t('forgot_password') }}
|
||||
</router-link>
|
||||
<router-link :to="{ name: 'password.request' }" class="small ml-auto my-auto">
|
||||
{{ $t('forgot_password') }}
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group row">
|
||||
<div class="col-md-7 offset-md-3 d-flex">
|
||||
<!-- Submit Button -->
|
||||
<v-button :loading="form.busy">
|
||||
{{ $t('login') }}
|
||||
</v-button>
|
||||
<div class="form-group row">
|
||||
<div class="col-md-7 offset-md-3 d-flex">
|
||||
<!-- Submit Button -->
|
||||
<v-button :loading="form.busy">
|
||||
{{ $t('login') }}
|
||||
</v-button>
|
||||
|
||||
<!-- <el-button type="primary" @click="openFullScreen2">As a service</el-button> -->
|
||||
<!-- <el-button type="primary" @click="openFullScreen2">As a service</el-button> -->
|
||||
|
||||
<!-- GitHub Login Button -->
|
||||
<login-with-github/>
|
||||
<!-- GitHub Login Button -->
|
||||
<login-with-github/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</card>
|
||||
</form>
|
||||
</card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,29 +1,31 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-lg-8 m-auto">
|
||||
<card :title="$t('reset_password')">
|
||||
<form @submit.prevent="send" @keydown="form.onKeydown($event)">
|
||||
<alert-success :form="form" :message="status"/>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 m-auto">
|
||||
<card :title="$t('reset_password')">
|
||||
<form @submit.prevent="send" @keydown="form.onKeydown($event)">
|
||||
<alert-success :form="form" :message="status"/>
|
||||
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email">
|
||||
<has-error :form="form" field="email"/>
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email">
|
||||
<has-error :form="form" field="email"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Submit Button -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-9 ml-md-auto">
|
||||
<v-button :loading="form.busy">
|
||||
{{ $t('send_password_reset_link') }}
|
||||
</v-button>
|
||||
<!-- Submit Button -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-9 ml-md-auto">
|
||||
<v-button :loading="form.busy">
|
||||
{{ $t('send_password_reset_link') }}
|
||||
</v-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</card>
|
||||
</form>
|
||||
</card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,47 +1,49 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-lg-8 m-auto">
|
||||
<card :title="$t('reset_password')">
|
||||
<form @submit.prevent="reset" @keydown="form.onKeydown($event)">
|
||||
<alert-success :form="form" :message="status"/>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 m-auto">
|
||||
<card :title="$t('reset_password')">
|
||||
<form @submit.prevent="reset" @keydown="form.onKeydown($event)">
|
||||
<alert-success :form="form" :message="status"/>
|
||||
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email" readonly>
|
||||
<has-error :form="form" field="email"/>
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email" readonly>
|
||||
<has-error :form="form" field="email"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Password -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.password" :class="{ 'is-invalid': form.errors.has('password') }" class="form-control" type="password" name="password">
|
||||
<has-error :form="form" field="password"/>
|
||||
<!-- Password -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.password" :class="{ 'is-invalid': form.errors.has('password') }" class="form-control" type="password" name="password">
|
||||
<has-error :form="form" field="password"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Password Confirmation -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('confirm_password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.password_confirmation" :class="{ 'is-invalid': form.errors.has('password_confirmation') }" class="form-control" type="password" name="password_confirmation">
|
||||
<has-error :form="form" field="password_confirmation"/>
|
||||
<!-- Password Confirmation -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('confirm_password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.password_confirmation" :class="{ 'is-invalid': form.errors.has('password_confirmation') }" class="form-control" type="password" name="password_confirmation">
|
||||
<has-error :form="form" field="password_confirmation"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Submit Button -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-9 ml-md-auto">
|
||||
<v-button :loading="form.busy">
|
||||
{{ $t('reset_password') }}
|
||||
</v-button>
|
||||
<!-- Submit Button -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-9 ml-md-auto">
|
||||
<v-button :loading="form.busy">
|
||||
{{ $t('reset_password') }}
|
||||
</v-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</card>
|
||||
</form>
|
||||
</card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,77 +1,79 @@
|
||||
<template>
|
||||
<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="form-group row" :class="{'has-error': errors.has('marking') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('Marking') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-model="form.marking" v-validate="'required|max:255'" type="text" name="marking" placeholder="Marking Number">
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('marking')">{{ errors.first('marking') }}<br/></span>
|
||||
<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="form-group row" :class="{'has-error': errors.has('marking') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('Marking') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-model="form.marking" v-validate="'required|max:255'" type="text" name="marking" placeholder="Marking Number">
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('marking')">{{ errors.first('marking') }}<br/></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Email -->
|
||||
<div class="form-group row" :class="{'has-error': errors.has('email') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-model="form.email" v-validate="'required|max:255'" type="email" name="email" placeholder="Email">
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('email')">{{ errors.first('email') }}</span>
|
||||
<!-- Email -->
|
||||
<div class="form-group row" :class="{'has-error': errors.has('email') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-model="form.email" v-validate="'required|max:255'" type="email" name="email" placeholder="Email">
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('email')">{{ errors.first('email') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Password -->
|
||||
<div class="form-group row" :class="{'has-error': errors.has('password') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-if="password_visible" v-model="form.password" v-validate="'required|min:6|max:255'" type="text" name="password" placeholder="Password">
|
||||
<template slot="append">
|
||||
<el-button type="primary" @click="password_visible = !password_visible"><i class="fas fa-eye"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input v-else v-model="form.password" v-validate="'required|min:6|max:255'" type="password" name="password" placeholder="Password">
|
||||
<template slot="append">
|
||||
<el-button type="primary" @click="password_visible = !password_visible"><i class="fas fa-eye-slash"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('password')">{{ errors.first('password') }}</span>
|
||||
<!-- Password -->
|
||||
<div class="form-group row" :class="{'has-error': errors.has('password') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-if="password_visible" v-model="form.password" v-validate="'required|min:6|max:255'" type="text" name="password" placeholder="Password">
|
||||
<template slot="append">
|
||||
<el-button type="primary" @click="password_visible = !password_visible"><i class="fas fa-eye"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input v-else v-model="form.password" v-validate="'required|min:6|max:255'" type="password" name="password" placeholder="Password">
|
||||
<template slot="append">
|
||||
<el-button type="primary" @click="password_visible = !password_visible"><i class="fas fa-eye-slash"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('password')">{{ errors.first('password') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Password Confirmation -->
|
||||
<div class="form-group row" :class="{'has-error': errors.has('confirm_password') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('confirm_password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-if="password_confirmation_visible" v-model="form.password_confirmation" v-validate="'required|min:6|max:255'" 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"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input v-else v-model="form.password_confirmation" v-validate="'required|min:6|max:255'" 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"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('password_confirmation')">{{ errors.first('password_confirmation') }}<br/></span>
|
||||
<!-- Password Confirmation -->
|
||||
<div class="form-group row" :class="{'has-error': errors.has('confirm_password') }">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('confirm_password') }}</label>
|
||||
<div class="col-md-7">
|
||||
<el-input v-if="password_confirmation_visible" v-model="form.password_confirmation" v-validate="'required|min:6|max:255'" 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"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input v-else v-model="form.password_confirmation" v-validate="'required|min:6|max:255'" 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"></i></el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="text-danger" v-if="errors.has('password_confirmation')">{{ errors.first('password_confirmation') }}<br/></span>
|
||||
</div>
|
||||
</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>
|
||||
<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/>
|
||||
<!-- GitHub Register Button -->
|
||||
<login-with-github/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</card>
|
||||
</form>
|
||||
</card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,277 +1,134 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"/>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Order Completed</h4>
|
||||
<br>
|
||||
<h1>Order Completed</h1>
|
||||
<div class="goBackButton">
|
||||
<el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!-- bankslip -->
|
||||
<br>
|
||||
<el-row :gutter="12" justify="center" align="center">
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Purchase Order</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
<a target=" _blank" href="#">
|
||||
<img v-bind:src="booking_details.user_po_path" class="image">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">Purchase Order</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target=" _blank" :href="booking_details.user_po_path">
|
||||
<img v-bind:src="booking_details.user_po_path" class="uploadedImage">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>China Bank Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
<a target=" _blank" href="#">
|
||||
<img v-bind:src="booking_details.china_bankslip_path" class="image">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Invoice</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
<img v-bind:src="booking_details.invoice_path" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<br>
|
||||
<!-- bank slips END -->
|
||||
|
||||
<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" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<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>
|
||||
<col name="el-table_2_column_9" width="200">
|
||||
<col name="el-table_2_column_10" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Order Number :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.id }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Date :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.created_at }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Customer Marking :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.marking }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Term :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.term }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<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 class="el-table__body-wrapper is-scrolling-none">
|
||||
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
|
||||
<colgroup>
|
||||
<col name="el-table_3_column_11" width="200">
|
||||
<col name="el-table_3_column_12" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">CNY/RMB :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.amount }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ Service Charge :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.service_charge }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">/ RATE :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">{{ booking_details.rate }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- <tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ GST 6% :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR 4,430.88</div>
|
||||
</td>
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"><b>MYR {{ booking_details.bia }}</b></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<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>Payment Bankin Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">China Bank Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target=" _blank" :href="booking_details.china_bankslip_path">
|
||||
<img v-bind:src="booking_details.china_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="col">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Order Number :</td>
|
||||
<td>{{ booking_details.id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
<td>{{ booking_details.term }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>CNY/RMB :</td>
|
||||
<td>CNY {{ booking_details.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-header">Order Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.goBackButton {
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.uploadedImage {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
.uploadedImage:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
|
||||
@@ -1,225 +1,95 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"/>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Bankin Slip Verification In Progress</h4>
|
||||
<br>
|
||||
<h1>Bankin Slip Verification in Progress</h1>
|
||||
<div class="goBackButton">
|
||||
<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" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<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>
|
||||
<col name="el-table_2_column_9" width="200">
|
||||
<col name="el-table_2_column_10" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Order Number :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.id }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Date :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.created_at }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Customer Marking :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.marking }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Term :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.term }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Order Number :</td>
|
||||
<td>{{ booking_details.id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
<td>{{ booking_details.term }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</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 class="el-table__body-wrapper is-scrolling-none">
|
||||
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
|
||||
<colgroup>
|
||||
<col name="el-table_3_column_11" width="200">
|
||||
<col name="el-table_3_column_12" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">CNY/RMB :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.amount }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ Service Charge :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.service_charge }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">/ RATE :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">{{ booking_details.rate }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- <tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ GST 6% :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR 4,430.88</div>
|
||||
</td>
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"><b>MYR {{ booking_details.bia }}</b></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>CNY/RMB :</td>
|
||||
<td>CNY {{ booking_details.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Banking Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.goBackButton {
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.uploadedImage {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
.uploadedImage:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
|
||||
@@ -1,281 +1,125 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"/>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Processing Invoice</h4>
|
||||
<br>
|
||||
<h1>Processing Invoice</h1>
|
||||
<div class="goBackButton">
|
||||
<el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!-- bankslip -->
|
||||
<br>
|
||||
<el-row :gutter="12" justify="center" align="center">
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Purchase Order</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">Purchase Order</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target=" _blank" :href="booking_details.user_po_path">
|
||||
<img v-bind:src="booking_details.user_po_path" class="image">
|
||||
<img v-bind:src="booking_details.user_po_path" class="uploadedImage">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>China Bank Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">China Bank Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target=" _blank" :href="booking_details.china_bankslip_path">
|
||||
<img v-bind:src="booking_details.china_bankslip_path" class="image">
|
||||
<img v-bind:src="booking_details.china_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Invoice</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
<img width="100%" height="100%" src="http://via.placeholder.com/900x1615">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<br>
|
||||
<!-- bank slips END -->
|
||||
|
||||
<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" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<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>
|
||||
<col name="el-table_2_column_9" width="200">
|
||||
<col name="el-table_2_column_10" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Order Number :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.id }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Date :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.created_at }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Customer Marking :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.marking }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Term :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.term }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<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 class="el-table__body-wrapper is-scrolling-none">
|
||||
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
|
||||
<colgroup>
|
||||
<col name="el-table_3_column_11" width="200">
|
||||
<col name="el-table_3_column_12" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">CNY/RMB :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.amount }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ Service Charge :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.service_charge }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">/ RATE :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">{{ booking_details.rate }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- <tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ GST 6% :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR 4,430.88</div>
|
||||
</td>
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"><b>MYR {{ booking_details.bia }}</b></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<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>Payment Bankin Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<div class="col">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Order Number :</td>
|
||||
<td>{{ booking_details.id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
<td>{{ booking_details.term }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>CNY/RMB :</td>
|
||||
<td>CNY {{ booking_details.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-header">Order Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.image {
|
||||
.goBackButton {
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.uploadedImage {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
margin-left: auto;
|
||||
@@ -283,7 +127,7 @@
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
.image:hover {
|
||||
.uploadedImage:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -60,213 +60,69 @@
|
||||
<br>
|
||||
<!-- bank slips END -->
|
||||
|
||||
<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" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<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>
|
||||
<col name="el-table_2_column_9" width="200">
|
||||
<col name="el-table_2_column_10" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Order Number :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.id }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Date :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.created_at }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Customer Marking :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.marking }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Term :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.term }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Order Number :</td>
|
||||
<td>{{ booking_details.id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
<td>{{ booking_details.term }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</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 class="el-table__body-wrapper is-scrolling-none">
|
||||
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
|
||||
<colgroup>
|
||||
<col name="el-table_3_column_11" width="200">
|
||||
<col name="el-table_3_column_12" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">CNY/RMB :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.amount }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ Service Charge :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.service_charge }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">/ RATE :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">{{ booking_details.rate }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- <tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ GST 6% :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR 4,430.88</div>
|
||||
</td>
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"><b>MYR {{ booking_details.bia }}</b></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>CNY/RMB :</td>
|
||||
<td>CNY {{ booking_details.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<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>Payment Bankin Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-header">Payment Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
|
||||
@@ -1,225 +1,101 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"/>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Bankin Slip Aprroved <br><br> Transfer In Progress</h4>
|
||||
<br>
|
||||
<h1>Bankin Slip Approved</h1>
|
||||
<h2>Transfer In Progress</h2>
|
||||
<div class="goBackButton">
|
||||
<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" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<el-table-column prop="data1" align="right" width="200" />
|
||||
<el-table-column prop="data2" align="left" width="200" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<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>
|
||||
<col name="el-table_2_column_9" width="200">
|
||||
<col name="el-table_2_column_10" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Order Number :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.id }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Date :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.created_at }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Customer Marking :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.marking }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Term :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.term }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Order Number :</td>
|
||||
<td>{{ booking_details.id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
<td>{{ booking_details.term }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</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 class="el-table__body-wrapper is-scrolling-none">
|
||||
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
|
||||
<colgroup>
|
||||
<col name="el-table_3_column_11" width="200">
|
||||
<col name="el-table_3_column_12" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">CNY/RMB :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.amount }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ Service Charge :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.service_charge }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">/ RATE :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">{{ booking_details.rate }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- <tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ GST 6% :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR 4,430.88</div>
|
||||
</td>
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"><b>MYR {{ booking_details.bia }}</b></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>CNY/RMB :</td>
|
||||
<td>CNY {{ booking_details.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-table :data="bookingConfirmTable" :show-header="false" align="center">
|
||||
<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" :show-header="false" align="center">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<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 class="card">
|
||||
<div class="card-header">Order Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="uploadedImage">
|
||||
</a>
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
}
|
||||
h2 {
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.goBackButton {
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.uploadedImage {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
.uploadedImage:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
|
||||
@@ -1,260 +1,162 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<progress-track v-model="status"/>
|
||||
|
||||
<div align="center">
|
||||
<h4 style="margin-top:5%;">Transfer Completed</h4>
|
||||
<h5> Please upload your purchase order </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-main>
|
||||
<progress-track v-model="status"/>
|
||||
<h1>Transfer Completed</h1>
|
||||
<h2> Please upload your purchase order </h2>
|
||||
<br>
|
||||
<!-- upload card -->
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">Upload PO</div>
|
||||
<!-- upload image -->
|
||||
<div class="card-body">
|
||||
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-po'" :on-exceed="handleExceed" :on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
class="upload-demo"
|
||||
drag
|
||||
multiple>
|
||||
:on-remove="handleRemove"
|
||||
class="upload-demo uploadAreaOne"
|
||||
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">jpg/png/pdf files with a size less than 3mb</div>
|
||||
</el-upload>
|
||||
|
||||
<el-upload
|
||||
class="upload-demo uploadAreaTwo"
|
||||
:action="'/api/booking/' + booking_id + '/upload-po'"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:before-remove="beforeRemove"
|
||||
multiple
|
||||
:file-list="fileList">
|
||||
<el-button size="small" type="primary">Click to upload</el-button>
|
||||
<div slot="tip" class="el-upload__tip">jpg/png files with a size less than 500kb</div>
|
||||
</el-upload>
|
||||
<br>
|
||||
|
||||
<div class="bottom clearfix" style="text-align:right;">
|
||||
<el-button :loading="loading_btn" type="primary" @click="uploadPo">Submit</el-button>
|
||||
</div>
|
||||
<!-- upload image end -->
|
||||
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>China Bank Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
<el-row :gutter="12" type="flex">
|
||||
<el-col :span="12">
|
||||
<a target="_blank" :href="booking_details.china_bankslip_path">
|
||||
<img v-bind:src="booking_details.china_bankslip_path" class="image">
|
||||
</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> -->
|
||||
<!-- upload image end -->
|
||||
</div>
|
||||
<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>
|
||||
<col name="el-table_2_column_9" width="200">
|
||||
<col name="el-table_2_column_10" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Order Number :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.id }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Date :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.created_at }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Customer Marking :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.marking }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell">Term :</div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell">{{ booking_details.term }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_2_column_9 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_2_column_10 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card">
|
||||
<div class="card-header">China Bank Slip</div>
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.china_bankslip_path">
|
||||
<img v-bind:src="booking_details.china_bankslip_path" class="bankinSlipImage">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- order details -->
|
||||
<div class="card">
|
||||
<div class="card-header">Order Details</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Order Number :</td>
|
||||
<td>{{ booking_details.id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Date :</td>
|
||||
<td>{{ booking_details.created_at }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Customer Marking :</td>
|
||||
<td>{{ booking_details.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Term: </td>
|
||||
<td>{{ booking_details.term }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</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 class="el-table__body-wrapper is-scrolling-none">
|
||||
<table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
|
||||
<colgroup>
|
||||
<col name="el-table_3_column_11" width="200">
|
||||
<col name="el-table_3_column_12" width="200">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">CNY/RMB :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.amount }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ Service Charge :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">CNY {{ booking_details.service_charge }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">/ RATE :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">{{ booking_details.rate }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR {{ booking_details.bia }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- <tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell">+ GST 6% :</div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">MYR 4,430.88</div>
|
||||
</td>
|
||||
</tr> -->
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell">
|
||||
<b>MYR {{ booking_details.bia }}</b>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="el-table__row">
|
||||
<td class="el-table_3_column_11 is-right ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
<td class="el-table_3_column_12 is-left ">
|
||||
<div class="cell"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<!---->
|
||||
</tbody>
|
||||
</table>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<div class="el-table__column-resize-proxy" style="display: none;"></div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>CNY/RMB :</td>
|
||||
<td>CNY {{ booking_details.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>+ Service Charge :</td>
|
||||
<td>CNY {{ booking_details.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>RATE :</td>
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><b>MYR {{ booking_details.bia }}</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-row>
|
||||
<br>
|
||||
|
||||
<el-row justify="center" align="center">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Order Bankin Slip</span>
|
||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-header">Order Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="bankinSlipImage">
|
||||
</a>
|
||||
</div>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="22" style="text-align:center">
|
||||
<a target="_blank" :href="booking_details.user_bankslip_path">
|
||||
<img v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
</a>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
}
|
||||
.image {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 150px;
|
||||
display: block;
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.image:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
}
|
||||
h2 {
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
}
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
}
|
||||
.bankinSlipImage {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
.bankinSlipImage:hover {
|
||||
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
|
||||
}
|
||||
.uploadAreaTwo {
|
||||
display: none;
|
||||
}
|
||||
@media only screen and (max-width : 767px) {
|
||||
.uploadAreaOne {
|
||||
display: none;
|
||||
}
|
||||
.uploadAreaTwo {
|
||||
display: unset;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import VueCountdown from '@dmaksimovic/vue-countdown'
|
||||
|
||||
@@ -10,93 +10,80 @@
|
||||
<br>
|
||||
</div>
|
||||
<div v-else align="center">
|
||||
<h4 style="margin-top:5%;margin-bottom:5%;font-size:5vw">Waiting For Payment</h4>
|
||||
<h1>Waiting For Payment</h1>
|
||||
</div>
|
||||
|
||||
<el-row justify="center" align="center">
|
||||
<table class="table-responsive el-table" style="display:table; width:70%; margin: 0 auto;">
|
||||
<div class="row">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="el-table_2_column_9 is-center ">Amount : </td>
|
||||
<td class="el-table_2_column_9 is-center ">
|
||||
<b> RMB {{ booking.amount }} </b>
|
||||
</td>
|
||||
<td>Amount : </td>
|
||||
<td><b>RMB {{ booking.amount }}</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="el-table_2_column_9 is-center ">Bankin Amount : </td>
|
||||
<td class="el-table_2_column_9 is-center ">
|
||||
<b> MYR {{ booking.bankin_amount }} </b>
|
||||
</td>
|
||||
<td>Bankin Amount : </td>
|
||||
<td><b> MYR {{ booking.bankin_amount }}</b></td>
|
||||
</tr>
|
||||
<!--<tr>
|
||||
<td align="center">
|
||||
{{bankDetail.company_name}}<br/>
|
||||
{{bankDetail.bank_name}} : {{bankDetail.acc_no}}
|
||||
</td>
|
||||
</tr>-->
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
</el-row>
|
||||
<br>
|
||||
|
||||
<!-- action="https://jsonplaceholder.typicode.com/posts/" -->
|
||||
|
||||
<div align="center">
|
||||
|
||||
<vue-countdown :countdownend="handleCoutdownend" :time="booking.timeout">
|
||||
<template slot-scope="props">Time Remaining:<br>{{ props.days }} days, {{ props.hours }} hours, {{ props.minutes }} minutes, {{ props.seconds }} seconds.</template>
|
||||
</vue-countdown>
|
||||
<!-- <button v-on:click="startTimer">Start timer</button> -->
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!-- upload image -->
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-user-bankslip'" :on-preview="handlePictureCardPreview" :on-remove="handleRemove"
|
||||
list-type="picture-card" align="center">
|
||||
<i class="el-icon-plus" />
|
||||
</el-upload>
|
||||
<el-dialog :visible.sync="dialogVisible">
|
||||
<img :src="dialogImageUrl" width="100%" alt="">
|
||||
</el-dialog>
|
||||
<br>
|
||||
<!-- upload image end -->
|
||||
|
||||
<!-- <el-form label-width="300px">
|
||||
<el-form-item label="Amount (RM) :"> -->
|
||||
<div align="center">
|
||||
Bankin Amount (RM) :
|
||||
<el-form ref="user_slip_form" :model="user_slip_form" :rules="rules">
|
||||
<div align="center">
|
||||
<el-form-item prop="transfer_amount">
|
||||
<el-input class="transferAmountInput" v-model="user_slip_form.transfer_amount" type="text" placeholder="Transfer Amount"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<div align="center">
|
||||
<el-button :loading="loading" type="primary" @click="submitUserSlip('user_slip_form')">Submit</el-button>
|
||||
<router-link :to="{ name: 'home' }" class="small ml-auto my-auto">
|
||||
Upload Later
|
||||
</router-link>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div class="row timer">
|
||||
<div class="col">
|
||||
<vue-countdown :countdownend="handleCoutdownend" :time="booking.timeout">
|
||||
<template slot-scope="props">Time Remaining:<br>{{ props.days }} days, {{ props.hours }} hours, {{ props.minutes }} minutes, {{ props.seconds }} seconds.</template>
|
||||
</vue-countdown>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- upload image -->
|
||||
<div class="row upload">
|
||||
<div class="col">
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-user-bankslip'" :on-preview="handlePictureCardPreview" :on-remove="handleRemove"
|
||||
list-type="picture-card" align="center">
|
||||
<i class="el-icon-plus" />
|
||||
</el-upload>
|
||||
<el-dialog :visible.sync="dialogVisible">
|
||||
<img :src="dialogImageUrl" width="100%" alt="">
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!-- upload image end -->
|
||||
<div class="row bankinAmount">
|
||||
<div class="col">
|
||||
Bankin Amount (RM) :<br>
|
||||
<el-form ref="user_slip_form" :model="user_slip_form" :rules="rules">
|
||||
<el-form-item prop="transfer_amount">
|
||||
<el-input class="transferAmountInput" v-model="user_slip_form.transfer_amount" type="text" placeholder="Transfer Amount"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button :loading="loading" type="primary" @click="submitUserSlip('user_slip_form')">Submit</el-button>
|
||||
<router-link :to="{ name: 'home' }" class="small ml-auto my-auto">
|
||||
Upload Later
|
||||
</router-link>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-form>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<!-- </el-form-item>
|
||||
</el-form> -->
|
||||
</el-main>
|
||||
</template>
|
||||
<style>
|
||||
.booking-details {
|
||||
font-weight: bold;
|
||||
h1 {
|
||||
margin-top:5%;
|
||||
font-size:4vw;
|
||||
text-align:center;
|
||||
margin-bottom:5%;
|
||||
}
|
||||
.timer, .upload, .bankinAmount {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.transferAmountInput {
|
||||
width: 20%;
|
||||
}
|
||||
@media screen and (max-width: 800px) {
|
||||
@media screen and (max-width: 767px) {
|
||||
.transferAmountInput {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
@@ -1,13 +1,15 @@
|
||||
<template>
|
||||
<card class="text-center">
|
||||
<h3 class="mb-4">{{ $t('page_not_found') }}</h3>
|
||||
<div class="container">
|
||||
<card class="text-center">
|
||||
<h3 class="mb-4">{{ $t('page_not_found') }}</h3>
|
||||
|
||||
<div class="links">
|
||||
<router-link :to="{ name: 'home' }">
|
||||
{{ $t('go_home') }}
|
||||
</router-link>
|
||||
</div>
|
||||
</card>
|
||||
<div class="links">
|
||||
<router-link :to="{ name: 'home' }">
|
||||
{{ $t('go_home') }}
|
||||
</router-link>
|
||||
</div>
|
||||
</card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -49,7 +49,6 @@
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
<!-- <el-col><div class="grid-content bg-purple" align="right"><i type="button" class="el-icon-question" circle/></div></el-col> -->
|
||||
<el-col>
|
||||
<div class="grid-content bg-purple" align="right">X1 :</div>
|
||||
</el-col>
|
||||
@@ -165,45 +164,44 @@
|
||||
|
||||
<!-- Booking_confirmation_popup -->
|
||||
<el-dialog :visible.sync="dialogFormVisible1" :fullscreen="true" title="Booking Confirmation" center>
|
||||
<table class="table-responsive el-table" style="display:table; width:100%; margin: 0 auto;">
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="el-table_2_column_9 is-center ">Date : </td>
|
||||
<td class="el-table_2_column_9 is-center "> {{ bookingConfirmTable.date }}</td>
|
||||
<td>Date : </td>
|
||||
<td> {{ bookingConfirmTable.date }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">Customer Marking : </td>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> {{ bookingConfirmTable.marking }}</td>
|
||||
<td>Customer Marking : </td>
|
||||
<td> {{ bookingConfirmTable.marking }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">Payment Method : </td>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> {{ bookingConfirmTable.payment_method }}</td>
|
||||
<td>Payment Method : </td>
|
||||
<td> {{ bookingConfirmTable.payment_method }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">CNY/RMB : </td>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> {{ bookingConfirmTable.amount }}</td>
|
||||
<td>CNY/RMB : </td>
|
||||
<td> {{ bookingConfirmTable.amount }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">+ Service Charge : </td>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> RMB {{ bookingConfirmTable.service_charge }}</td>
|
||||
<td>+ Service Charge : </td>
|
||||
<td> RMB {{ bookingConfirmTable.service_charge }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> RATE :</td>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> {{ bookingConfirmTable.rate }}</td>
|
||||
<td> RATE :</td>
|
||||
<td> {{ bookingConfirmTable.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">China Beneficiary Acc :</td>
|
||||
<td width="200" class="el-table_2_column_9 is-center "> {{ bookingConfirmTable.account_name }}</td>
|
||||
<td>China Beneficiary Acc :</td>
|
||||
<td> {{ bookingConfirmTable.account_name }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">Bank in Amount :</td>
|
||||
<td width="200" class="el-table_2_column_9 is-center ">
|
||||
<td>Bank in Amount :</td>
|
||||
<td>
|
||||
<b> RM {{ bookingConfirmTable.bankin_amount }}</b>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<!-- <el-button @click="dialogFormVisible = false">Cancel</el-button> -->
|
||||
<el-button :loading="loading" type="primary" @click="createBooking">Confirm</el-button>
|
||||
|
||||
@@ -1,34 +1,36 @@
|
||||
<template>
|
||||
<card :title="$t('your_info')">
|
||||
<form @submit.prevent="update" @keydown="form.onKeydown($event)">
|
||||
<alert-success :form="form" :message="$t('info_updated')"/>
|
||||
<div class="container">
|
||||
<card :title="$t('your_info')">
|
||||
<form @submit.prevent="update" @keydown="form.onKeydown($event)">
|
||||
<alert-success :form="form" :message="$t('info_updated')"/>
|
||||
|
||||
<!-- Name -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('name') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.name" :class="{ 'is-invalid': form.errors.has('name') }" class="form-control" type="text" name="name">
|
||||
<has-error :form="form" field="name"/>
|
||||
<!-- Name -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('name') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.name" :class="{ 'is-invalid': form.errors.has('name') }" class="form-control" type="text" name="name">
|
||||
<has-error :form="form" field="name"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email">
|
||||
<has-error :form="form" field="email" />
|
||||
<!-- Email -->
|
||||
<div class="form-group row">
|
||||
<label class="col-md-3 col-form-label text-md-right">{{ $t('email') }}</label>
|
||||
<div class="col-md-7">
|
||||
<input v-model="form.email" :class="{ 'is-invalid': form.errors.has('email') }" class="form-control" type="email" name="email">
|
||||
<has-error :form="form" field="email" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Submit Button -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-9 ml-md-auto">
|
||||
<v-button :loading="form.busy" type="success">{{ $t('update') }}</v-button>
|
||||
<!-- Submit Button -->
|
||||
<div class="form-group row">
|
||||
<div class="col-md-9 ml-md-auto">
|
||||
<v-button :loading="form.busy" type="success">{{ $t('update') }}</v-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</card>
|
||||
</form>
|
||||
</card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="container">
|
||||
<div class="top-right links">
|
||||
<template v-if="authenticated">
|
||||
<router-link :to="{ name: 'home' }">
|
||||
@@ -15,52 +15,38 @@
|
||||
</router-link>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="text-center">
|
||||
<div class="title mb-4">
|
||||
{{ title }}
|
||||
</div>
|
||||
|
||||
<div class="links">
|
||||
<a href="https://laravel.com/docs">Documentation</a>
|
||||
<a href="https://laracasts.com">Laracasts</a>
|
||||
<a href="https://laravel-news.com">News</a>
|
||||
<a href="https://forge.laravel.com">Forge</a>
|
||||
<a href="https://github.com/laravel/laravel">GitHub</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</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>
|
||||
.top-right {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 18px;
|
||||
}
|
||||
.top-right {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 18px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 85px;
|
||||
}
|
||||
.title {
|
||||
font-size: 85px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -36,7 +36,7 @@ const adminCompleted = () => import('~/pages/admin/booking/completed').then(m =>
|
||||
|
||||
// Admin pages
|
||||
const AdminHome = () => import('~/pages/admin/home').then(m => m.default || m)
|
||||
const AdminCompleteOrder = () => import('~/pages/admin/complete-order').then(m => m.default || m)
|
||||
const AdminCompleteOrder = () => import('~/pages/admin/complete-orders').then(m => m.default || m)
|
||||
const TransactionHistory = () => import('~/pages/admin/transaction-history').then(m => m.default || m)
|
||||
const UploadSupplierBankSlip = () => import('~/pages/admin/upload-supplier-bank-slip').then(m => m.default || m)
|
||||
|
||||
@@ -81,7 +81,7 @@ export default [
|
||||
|
||||
// Admin pages
|
||||
{ path: '/admin', name: 'admin.home', component: AdminHome },
|
||||
{ path: '/admin/complete-order', name: 'admin.complete', component: AdminCompleteOrder },
|
||||
{ path: '/admin/complete-orders', name: 'admin.complete', component: AdminCompleteOrder },
|
||||
{ path: '/admin/transaction-history', name: 'admin.transaction-history', component: TransactionHistory },
|
||||
{ path: '/admin/upload-supplier-bank-slip', name: 'admin.upload-supplier-bank-slip', component: UploadSupplierBankSlip },
|
||||
{ path: '*', name: 'notfound', component: NotFound }
|
||||
|
||||
+1
-1
@@ -109,7 +109,7 @@ Route::group(['middleware' => ['role:admin']], function() {
|
||||
Route::post('booking/{id}/upload-invoice', 'BookingController@uploadInvoice');
|
||||
Route::post('booking/{id}/confirm-invoice', 'BookingController@confirmInvoice');
|
||||
|
||||
Route::get('admin/complete-order', 'BookingController@adminShowCompletedOrders');
|
||||
Route::get('admin/complete-orders', 'BookingController@adminShowCompletedOrders');
|
||||
// for both user and admin
|
||||
Route::get('setting-active-bank', 'SettingActiveBankController@index');
|
||||
Route::get('setting-malaysia-bank/{malaysiaBank}', 'SettingMalaysiaBankController@show');
|
||||
|
||||
Reference in New Issue
Block a user