mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange.git
synced 2026-08-19 12:24:09 +00:00
booking popup done
This commit is contained in:
@@ -1,6 +1,8 @@
|
||||
<template>
|
||||
|
||||
<el-main>
|
||||
|
||||
<!-- Input-Amount -->
|
||||
<el-row :gutter="20" type="flex" justify="center" align="middle">
|
||||
<el-col :span="8"><div class="grid-content bg-purple" align="left"><el-input placeholder="Amount" v-model="input"></el-input></div></el-col>
|
||||
<el-col :span="10"><div class="grid-content bg-purple" align="center"> <el-select v-model="value" placeholder="MYR">
|
||||
@@ -8,9 +10,9 @@
|
||||
<el-option v-for="item in options2" :key="item.value2" :label="item.label2" :value="item.value2"></el-option>
|
||||
</el-select></div></el-col>
|
||||
</el-row>
|
||||
<!-- Input-Amount-end -->
|
||||
<hr>
|
||||
|
||||
|
||||
<!-- Rate-Display -->
|
||||
<br>
|
||||
<el-row :gutter="20" type="flex" justify="center" align="middle">
|
||||
<el-col><div class="grid-content bg-purple" align="right"></div></el-col>
|
||||
@@ -31,11 +33,37 @@
|
||||
<el-row :gutter="20" type="flex" justify="center" align="middle">
|
||||
<el-col><div class="grid-content bg-purple"></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple"></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center"><el-button type="text">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center"><el-button type="text">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center"><el-button type="text">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center">
|
||||
<el-button type="text" @click="dialogFormVisible = true">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center">
|
||||
<el-button type="text" @click="dialogFormVisible = true">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center">
|
||||
<el-button type="text" @click="dialogFormVisible = true">Book</el-button></div></el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- Form_popup -->
|
||||
<el-dialog title="Booking" :visible.sync="dialogFormVisible" center fullscreen="true">
|
||||
<el-form :model="form"><div align="center">
|
||||
<el-form-item>
|
||||
<el-input placeholder="China Beneficiary Account" style="width: 80%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="Bank Name / AliPay / WechatPay" style="width: 80%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="Branch / 分行/支行" style="width: 80%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="Account Number / AliPay_ID / WechatPay_ID" style="width: 80%"></el-input>
|
||||
</el-form-item></div>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="dialogFormVisible = false">Book Now</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!-- Form_popup-end -->
|
||||
|
||||
<br>
|
||||
<el-row :gutter="20" type="flex" justify="center" align="middle">
|
||||
<el-col><div class="grid-content bg-purple" align="right"><i type="button" class="el-icon-question" circle></i></div></el-col>
|
||||
@@ -48,13 +76,19 @@
|
||||
<el-row :gutter="20" type="flex" justify="center" align="middle">
|
||||
<el-col><div class="grid-content bg-purple"></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple"></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center"><el-button type="text">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center"><el-button type="text">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center"><el-button type="text">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center">
|
||||
<el-button type="text" @click="dialogFormVisible = true">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center">
|
||||
<el-button type="text" @click="dialogFormVisible = true">Book</el-button></div></el-col>
|
||||
<el-col><div class="grid-content bg-purple" align="center">
|
||||
<el-button type="text" @click="dialogFormVisible = true">Book</el-button></div></el-col>
|
||||
</el-row>
|
||||
<!-- Rate-Display-end -->
|
||||
|
||||
<br><br>
|
||||
<hr>
|
||||
|
||||
<!-- Booking Table -->
|
||||
<el-row :gutter="20" >
|
||||
<div>
|
||||
<el-table :data="tableData" >
|
||||
@@ -89,9 +123,13 @@
|
||||
</el-table>
|
||||
</div>
|
||||
</el-row>
|
||||
<!-- Booking Table-end -->
|
||||
|
||||
</el-main>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
middleware: ['auth'],
|
||||
@@ -162,7 +200,13 @@
|
||||
value: '',
|
||||
value2: '',
|
||||
input: '',
|
||||
}
|
||||
dialogFormVisible: false,
|
||||
form: {
|
||||
name: '',
|
||||
region: ''
|
||||
},
|
||||
formLabelWidth: '0px'
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
formatter(row, column) {
|
||||
@@ -175,6 +219,6 @@
|
||||
const property = column['property'];
|
||||
return row[property] === value;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user