git_admin/sx-fc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update order_reservaiotn ui fishe

Browse Source
This commit is contained in:
Aung Myo
2018-04-10 15:19:46 +06:30
parent 4810628930
commit 77adad2417
1 changed files with 339 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

466
app/views/origami/order_reservation/index.html.erb
View File

@@ -1,93 +1,220 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row m-t--10">
<div class="col-lg-4 col-md-4 col-sm-4"> <div class="col-lg-4 col-md-4 col-sm-4" style="margin:0px 0px 0px -5px !important ">
<ul class="nav nav-tabs tab-col-teal" role="tablist"> <ul class="nav nav-tabs tab-col-teal" role="tablist">
<li class="nav-item active" data-color="#F44336" style="background-color: #F44336;"> <li class="nav-item active" data-color="#F44336" style="background-color: #F44336;">
<a class="nav-link" data-toggle="tab" href="#complete" role="tab"><p class="num">4</p> <%= t :pending %></a> <a class="nav-link" data-toggle="tab" href="#pending" role="tab"><p class="num">4</p> <%= t :pending %></a>
</li> </li>
<li class="nav-item" data-color="#673AB7" style="background-color: #673AB7;"> <li class="nav-item" data-color="#673AB7" style="background-color: #673AB7;">
<a class="nav-link" data-toggle="tab" href="#tables" role="tab"><p class="num">4</p> <%= t :processing %></a> <a class="nav-link" data-toggle="tab" href="#processing" role="tab"><p class="num">4</p> <%= t :processing %></a>
</li> </li>
<li class="nav-item" data-color="#009688" style="background-color: #009688;"> <li class="nav-item" data-color="#009688" style="background-color: #009688;">
<a class="nav-link" data-toggle="tab" href="#rooms" role="tab"><p class="num">4</p> <%= t :delivering %></a> <a class="nav-link" data-toggle="tab" href="#delivery" role="tab"><p class="num">4</p> <%= t :delivering %></a>
</li> </li>
<li class="nav-item" data-color="#03A9F4" style="background-color: #03A9F4;"> <li class="nav-item" data-color="#03A9F4" style="background-color: #03A9F4;">
<a class="nav-link" data-toggle="tab" href="#orders" role="tab"><p class="num">4</p> <%= t :completed %></a> <a class="nav-link" data-toggle="tab" href="#completed" role="tab"><p class="num">4</p> <%= t :completed %></a>
</li> </li>
</ul> </ul>
<div class="tab-content"> <div class="tab-content m-t--10">
<div class="tab-pane dining" id="complete" role="tabpanel"> <div class="tab-pane active" id="pending" role="tabpanel">
<div class="card"> <div class="card-block font-13">
<div class="card-block"> <div id="menu-slimscroll" data-height="50">
<div class="card-text"> <table class="table table-stripe custom-table">
<table table table-striped>
<tbody> <tbody>
<tr> <tr>
<td class="item-name">aaaa</td> <td width ="5%" class="align-left">
<td class="item-attr">aaaa</td> 1
<td class="item-attr">ssss</td> </td>
</tr> <td width ="30%" class="align-center">
<tr> 3:30 PM
<td class="item-name">aaaa</td> </td>
<td class="item-attr">aaaa</td> <td width ="30%" class="align-center">
<td class="item-attr">ssss</td> 13000
</tr> </td>
<tr> <td width ="30%" class="align-center">
<td class="item-name">aaaa</td> <span class="font-10 col-blue">STATUS</span>
<td class="item-attr">aaaa</td> </td>
<td class="item-attr">ssss</td> </tr>
</tr> <tr>
<tr> <td width ="5%" class="align-left">
<td class="item-name">aaaa</td> 2
<td class="item-attr">aaaa</td> </td>
<td class="item-attr">ssss</td> <td width ="30%" class="align-center">
</tr> 3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
<tr>
<td width ="5%" class="align-left">
3
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
<tr>
<td width ="5%" class="align-left">
4
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
</tbody> </tbody>
</table> </table>
</div>
</div> </div>
</div> </div>
</div> </div>
<!--- Panel 3 - Orders --> <!--- Panel 3 - Orders -->
<div class="tab-pane dining" id="orders" role="tabpanel"> <div class="tab-pane dining" id="processing" role="tabpanel">
<div class="card"> <div class="card-block font-13">
<div class="card-header" style="color:"> <div id="menu-slimscroll" data-height="50">
<table> <table class="table table-stripe custom-table">
<tr>
<td>No.11 (DELIVERY)</td>
<td>0065 4321 0012</td>
</tr>
</table>
</div>
<div class="card-block">
<div class="card-text">
<table table table-striped>
<tbody> <tbody>
<tr> <tr>
<td class="item-name">aaaa</td> <td width ="5%" class="align-left">
<td class="item-attr">aaaa</td> 1
<td class="item-attr">ssss</td> </td>
</tr> <td width ="30%" class="align-center">
<tr> 3:30 PM
<td class="item-name">aaaa</td> </td>
<td class="item-attr">aaaa</td> <td width ="30%" class="align-center">
<td class="item-attr">ssss</td> 13000
</tr> </td>
<tr> <td width ="30%" class="align-center">
<td class="item-name">aaaa</td> <span class="font-10 col-blue">STATUS</span>
<td class="item-attr">aaaa</td> </td>
<td class="item-attr">ssss</td> </tr>
</tr> <tr>
<tr> <td width ="5%" class="align-left">
<td class="item-name">aaaa</td> 2
<td class="item-attr">aaaa</td> </td>
<td class="item-attr">ssss</td> <td width ="30%" class="align-center">
</tr> 3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!--- Panel 3 - Orders -->
<div class="tab-pane dining" id="delivery" role="tabpanel">
<div class="card-block font-13">
<div id="menu-slimscroll" data-height="50">
<table class="table table-stripe custom-table">
<tbody>
<tr>
<td width ="5%" class="align-left">
1
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
<tr>
<td width ="5%" class="align-left">
2
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
<tr>
<td width ="5%" class="align-left">
3
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!--- Panel 3 - Orders -->
<div class="tab-pane dining" id="completed" role="tabpanel">
<div class="card-block font-13">
<div id="menu-slimscroll" data-height="50">
<table class="table table-stripe custom-table">
<tbody>
<tr>
<td width ="5%" class="align-left">
1
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
<tr>
<td width ="5%" class="align-left">
3
</td>
<td width ="30%" class="align-center">
3:30 PM
</td>
<td width ="30%" class="align-center">
13000
</td>
<td width ="30%" class="align-center">
<span class="font-10 col-blue">STATUS</span>
</td>
</tr>
</tbody> </tbody>
</table> </table>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -95,7 +222,7 @@
</div> </div>
<div class="'col-lg-4 col-md-4 col-sm-4'"> <div class="col-lg-4 col-md-4 col-sm-4" style="margin:0px -5px !important ">
<div class="card"> <div class="card">
<div class="card-header custom-card-header" style="color:"> <div class="card-header custom-card-header" style="color:">
<table class="table"> <table class="table">
@@ -108,68 +235,101 @@
</table> </table>
</div> </div>
<div class="card-block custom-card-block"> <div class="card-block custom-card-block">
<table class="table"> <div id="order-detail-slimscroll" data-height="220">
<tbody> <table class="table">
<tr> <tbody>
<td width ="70%" class="body-td align-left"> <tr>
MENU ITEM 01 <td width ="70%" class="body-td align-left">
<br><span class="font-13">2 <span class="col-blue">X700</span></span> MENU ITEM 01
</td> <br><span class="font-13">2 <span class="col-blue">X700</span></span>
<td width ="30%" class="body-td align-right">1400.00</td> </td>
</tr> <td width ="30%" class="body-td align-right">1400.00</td>
<tr> </tr>
<td width ="70%" class="body-td align-left"> <tr>
MENU ITEM 01 <td width ="70%" class="body-td align-left">
<br><span class="font-13">2 <span class="col-blue">X700</span></span> MENU ITEM 01
</td> <br><span class="font-13">2 <span class="col-blue">X700</span></span>
<td width ="30%" class="body-td align-right">1400.00</td> </td>
</tr> <td width ="30%" class="body-td align-right">1400.00</td>
<tr> </tr>
<td width ="70%" class="body-td align-left"> <tr>
MENU ITEM 01 <td width ="70%" class="body-td align-left">
<br><span class="font-13">2 <span class="col-blue">X700</span></span> MENU ITEM 01
</td> <br><span class="font-13">2 <span class="col-blue">X700</span></span>
<td width ="30%" class="body-td align-right">1400.00</td> </td>
</tr> <td width ="30%" class="body-td align-right">1400.00</td>
<tr> </tr>
<td width ="70%" class="body-td align-left"> <tr>
MENU ITEM 01 <td width ="70%" class="body-td align-left">
<br><span class="font-13">2 <span class="col-blue">X700</span></span> MENU ITEM 01
</td> <br><span class="font-13">2 <span class="col-blue">X700</span></span>
<td width ="30%" class="body-td align-right">1400.00</td> </td>
</tr> <td width ="30%" class="body-td align-right">1400.00</td>
</tbody> </tr>
</table> <tr>
<td width ="70%" class="body-td align-left">
MENU ITEM 01
<br><span class="font-13">2 <span class="col-blue">X700</span></span>
</td>
<td width ="30%" class="body-td align-right">1400.00</td>
</tr>
<tr>
<td width ="70%" class="body-td align-left">
MENU ITEM 01
<br><span class="font-13">2 <span class="col-blue">X700</span></span>
</td>
<td width ="30%" class="body-td align-right">1400.00</td>
</tr>
</tbody>
</table>
</div>
</div> </div>
<div class="card-footer custom-card-footer"> <div class="card-footer custom-card-footer">
<table class="table"> <table class="table">
<tbody> <tbody>
<tr> <tr>
<td width ="70%" class="body-td align-left"> <td width ="70%" class="footer-td align-left">
MENU ITEM 01 SUB TOTAL
</td> </td>
<td width ="30%" class="body-td align-right">1400.00</td> <td width ="30%" class="footer-td align-right">1400.00</td>
</tr> </tr>
<tr> <tr>
<td width ="70%" class="body-td align-left"> <td width ="70%" class="footer-td align-left">
MENU ITEM 01 DELIVERY FEES (PICK-UP)
<br><span class="font-13">2 <span class="col-blue">X700</span></span>
</td> </td>
<td width ="30%" class="body-td align-right">1400.00</td> <td width ="30%" class="footer-td align-right">1400.00</td>
</tr> </tr>
<tr> <tr>
<td width ="70%" class="body-td align-left"> <td width ="70%" class="footer-td align-left">
MENU ITEM 01 CONVENIENCE CHARGES
<br><span class="font-13">2 <span class="col-blue">X700</span></span> </td>
</td> <td width ="30%" class="footer-td align-right">1400.00</td>
<td width ="30%" class="body-td align-right">1400.00</td>
</tr> </tr>
<tr> <tr>
<td width ="70%" class="body-td align-left"> <td width ="70%" class="footer-td align-left">
MENU ITEM 01 GOVERNMENT TAX
<br><span class="font-13">2 <span class="col-blue">X700</span></span> </td>
<td width ="30%" class="footer-td align-right">1400.00</td>
</tr>
</tbody>
</table>
</div>
<div class="card-footer grand-card-footer">
<table class="table">
<tbody>
<tr>
<td width ="70%" class="footer-td align-left col-blue">
GRAND TOTAL
</td>
<td width ="30%" class="footer-td align-right col-blue">1400.00</td>
</tr>
<tr>
<td width ="50%" class="footer-td align-left col-blue">
<button type="button" class="btn btn-lg bg-blue waves-effect" data-dismiss="modal"><strong>DECLINE</strong></button>
</td>
<td width ="50%" class="footer-td align-right col-blue">
<button type="button" class="btn btn-lg bg-blue waves-effect" data-dismiss="modal"><strong>ACCEPT</strong></button>
</td> </td>
<td width ="30%" class="body-td align-right">1400.00</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@@ -177,11 +337,46 @@
</div> </div>
</div> </div>
<div class="'col-lg-4 col-md-4 col-sm-4'"> <div class="'col-lg-4 col-md-4 col-sm-4'" style="margin:0px -5px 0px -2px !important ">
<div class="card"> <div class="card" style="background-color: #E8EAF6">
<div class="card-header"></div> <div class="card-header custom-card-header" style="background-color: #E8EAF6">
<table class="table">
<tr>
<td width ="" class="header-td align-left col-blue">CUSTOMER & DELIVERY INFORMATION
</td>
</tr>
</table>
</div>
<div class="card-block"> <div class="card-block">
<table class="table">
<tbody>
<tr>
<td class="body-td align-left">
<span class="font-13">NAME</span><br>
<b>DAW AYE AYE</b>
</td>
</tr>
<tr>
<td class="body-td align-left">
<span class="font-13">PHONE</span><br>
<b>09 8765 4321 098</b>
</td>
</tr>
<tr>
<td class="body-td align-left">
<span class="font-13">ADDRESS</span><br>
<b>No. (12), 3rd floor, zay kyee Street, kyi myin dine
infront of Nya Zay Main Entrance</b>
</td>
</tr>
<tr>
<td class="body-td align-left">
<span class="font-13">DELEVER TO</span><br>
<b>HOME</b>
</td>
</tr>
</tbody>
</table>
</div> </div>
</div> </div>
</div> </div>
@@ -196,7 +391,7 @@
} }
.nav-tabs .nav-link { .nav-tabs .nav-link {
padding: 0.9286em .35em; padding: 0.5286em .33em;
} }
.nav-tabs li a.active { .nav-tabs li a.active {
color: #111 !important; color: #111 !important;
@@ -218,7 +413,8 @@
.nav-tabs.tab-col-teal > li > a:before { .nav-tabs.tab-col-teal > li > a:before {
border-bottom: 0px solid #009688; border-bottom: 0px solid #009688;
} }
.nav-item .a .nav-link { .nav-tabs .nav-item{
margin-bottom: 2px ;
} }
.num{ .num{
color:#fff; color:#fff;
@@ -234,30 +430,42 @@
.table .header-td{ .table .header-td{
border-top:0px solid !important; border-top:0px solid !important;
border-bottom: 0px solid !important; border-bottom: 0px solid !important;
padding:0px 7px !important; padding:3px 7px !important;
border-top:0px solid !important; border-top:0px solid !important;
border-bottom: 0px solid !important; border-bottom: 0px solid !important;
} }
.card-block .table td:first-child, .custom-card-block .table td:first-child,
.card-block .table td:nth-child(2), .custom-card-block .table td:nth-child(2),
.card-footer .table td:first-child, .custom-card-footer .table td:first-child,
.card-footer .table td:nth-child(2){ .custom-card-footer .table td:nth-child(2){
border-top:0px solid !important; border-top:0px solid !important;
} }
/*.card-block .table .body-td:last-child, .custom-card-footer .footer-td ,
.card-footer .table .body-td:last-child{ .grand-card-footer .footer-td {
border-top:0px solid !important;
border-bottom:0px solid !important; border-bottom:0px solid !important;
}*/ font-weight: bold;
padding:5px 10px;
}
.custom-card-header{ .custom-card-header{
border-bottom: 1px solid #F8BBD0 !important; border-bottom: 1px solid #F8BBD0 !important;
padding:13px 5px !important;
} }
.custom-card-footer{ .custom-card-footer{
border-top: 1px solid #F8BBD0 !important; border-top: 1px solid #F8BBD0 !important;
} }
.custom-card-header,
.custom-card-block, .custom-card-block,
.grand-card-footer,
.custom-card-footer{ .custom-card-footer{
padding :5px !important; padding :5px !important;
} }
.custom-table{
background-color:#F3E5F5;
}
.custom-table tbody tr td,
.custom-table tbody tr th{
border-top: 1px solid #FFEBEE;
border-bottom: 1px solid #FFEBEE;
}
</style> </style>