<?php if (!defined('ROOT')){ echo 'Deny ...'; exit; } extract($data); ?>
<style>
.plan-list {border-top: none;background-image: none !important;}
.plan {line-height: 1;padding: 0;}
.plan-left {text-align: right;padding: 10px 10px 10px 0;}
.plan-center {background-color: #3399ff;opacity: 0.5;}
.plan-right {padding: 10px 40px 10px 10px;}
.plan-date {font-size: 14px;opacity: 0.8;margin-bottom: 4px;font-weight: 500;}
.plan-duration {font-size: 11px;opacity: 0.4;}
.plan-name {font-size: 17px;margin-bottom: 8px;}
.plan-info {opacity: 0.4;font-size: 12px;line-height: 1.4;}    
</style>
<ons-page ng-controller="UserOrderController">
    <div class="navigation-bar">
        <div class="navigation-bar__left">
            <span class="toolbar-button--quiet navigation-bar__line-height" onclick="userNavigator.popPage();">
                <i class="ion-ios-arrow-back" style="font-size:32px; vertical-align:-6px;"></i>
                返回
            </span>
        </div>
        <div class="navigation-bar__center">
            我的订单
        </div>
        <div class="navigation-bar__right"></div>
    </div>
    <ons-list class="plan-list">
        <p ng-show="items.length === 0" style="padding-left: 24px;">
            没有相关数据
        </p>
        <ons-list-item class="plan" ng-repeat="item in items">
            <ons-row>
                <ons-col width="80px" class="plan-left">
                    <div class="plan-date">{{item._time}}</div>
                    <div class="plan-duration">{{item._date}}</div>
                    <div style="margin-top: 12px; color: #ff7300;">¥ {{item.price}}</div>
                </ons-col>

                <ons-col width="6px" class="plan-center" ng-style="{backgroundColor:$index % 2 == 1 ? '#3399ff' : '#FF7300'}">
                </ons-col>

                <ons-col class="plan-right">
                    <div class="plan-name">{{item._title}}</div>
                    <div class="plan-info">
                        <div>
                            订单号: {{item.tradeno}}
                        </div>
                        <div>
                            交易号: {{item.transactionid}}
                        </div>
                    </div>
                </ons-col>
            </ons-row>
        </ons-list-item>
    </ons-list>
    <div style="text-align: center; margin-bottom: 12px; margin-top: 12px;" ng-show="count > 0"><button class="button button--light" ng-click="loadMore();">点击加载更多</button></div>
</ons-page>