make booking number and status clickable

This commit is contained in:
Jack Goh
2018-06-14 11:26:12 +08:00
parent a2b58b6d10
commit 09a2fe36e8
+35 -11
View File
@@ -127,19 +127,37 @@
<el-row :gutter="20" >
<div>
<el-table :data="bookingData">
<el-table-column label="No." width="106" prop="booking_no"/>
<el-table-column
label="No."
width="106">
<el-button type="text" slot-scope="scope" @click="viewStatus('{{scope.row.booking_no}}')"> {{scope.row.booking_no}}</el-button>
</el-table-column>
<el-table-column label="Date" prop="date" width="120" sortable/>
<!-- <el-table-column label="Term" :filters="[{text: 'X1', value: 'X1'}, {text: 'X2', value: 'X2'}]" :filter-method="filterHandler">
</el-table-column> -->
<el-table-column label="Rate" width="74" prop="rate"/>
<el-table-column label="Amount" prop="amount" justify="center" width="110" sortable />
<el-table-column label="Amount" prop="amount" justify="center" width="110"/>
<el-table-column :filters="[{text: 'RMB', value: 'RMB'}, {text: 'USD', value: 'USD'}]" :filter-method="filterHandler" label="Transfer Amount" prop="transfer_amount" width="150"/>
<!-- <el-table-column label="ETA" sortable width="100"/> -->
<!-- <el-table-column label="Payment Method" :filters="[{text: 'Cash', value: 'Cash'}, {text: 'Cheque', value: 'Cheque'}, {text: 'BA', value: 'BA'}]" :filter-method="filterHandler">
</el-table-column> -->
<el-table-column :filters="[{text: '(1/6)', value: '(1/6) Order Done'}, {text: '(2/6)', value: '(2/6) Waiting for Upload Bank in Slip'}, {text: '(3/6)', value: '(3/6) Order Confirmation'}, {text: '(4/6)', value: '(4/6) Processing Transfer'}, {text: '(5/6)', value: '(5/6) Waiting for Upload PO'}, {text: '(6/6)', value: '(6/6) Order Complete'}]" :filter-method="filterHandler" prop="status" label="Status"/>
<!-- <el-table-column :filters="[{text: '(1/6)', value: '(1/6) Order Done'}, {text: '(2/6)', value: '(2/6) Waiting for Upload Bank in Slip'}, {text: '(3/6)', value: '(3/6) Order Confirmation'}, {text: '(4/6)', value: '(4/6) Processing Transfer'}, {text: '(5/6)', value: '(5/6) Waiting for Upload PO'}, {text: '(6/6)', value: '(6/6) Order Complete'}]" :filter-method="filterHandler" prop="status" label="Status"/> -->
<el-table-column
label="No."
width="106">
<template slot-scope="scope">
<el-popover trigger="hover" placement="top">
<p>{{ scope.row.status_desc }}</p>
<div slot="reference" class="name-wrapper">
<el-tag size="medium">{{ scope.row.status }}</el-tag>
</div>
</el-popover>
</template>
</el-table-column>
<!-- <el-table-column label="Balance" prop="transfer_amount" sortable width="100"/> -->
<el-table-column prop="timeout" label="Bankin Timeout" sortable/>
<el-table-column prop="timeout" label="Bankin Timeout"/>
<el-table-column :filters="[{ text: 'Success', value: 'Success' }, { text: 'Pending', value: 'Pending' }]" :filter-method="filterTag" label=""
width="200" filter-placement="bottom-end" >
<template slot-scope="scope">
@@ -159,7 +177,11 @@
</el-main>
</template>
<style>
.el-tag{
cursor: pointer;
}
</style>
<script>
import Form from 'vform'
import LoginWithGithub from '~/components/LoginWithGithub'
@@ -186,13 +208,14 @@ export default {
dialogFormVisible1: false,
formLabelWidth: '0px',
bookingData: [{
date: 'Order Number :',
date: '12/1/2018',
booking_no: '001',
rate: '123',
amount: 'amount',
transfer_amount: '123',
status: 'timeout',
timeout: 'timeout'
rate: '1.23',
amount: 'RM 1000',
transfer_amount: 'RMB 10000',
status: '(1/6)',
status_desc: 'Waiting admin to confirm',
timeout: '56:00:00'
}]
}
},
@@ -261,5 +284,6 @@ export default {
})
}
}
}
</script>