<view class="top">
  <view class="top-line">
    <view class="top-name">姓名：</view>
    <view class="top-content">{{user.userName}}</view>
  </view>
  <view class="top-line">
    <view class="top-name">开始日期：</view>
    <picker mode="date" value="{{startdata}}" start="2015-09-01" end="{{enddata}}" bindchange="bindDateChange">
      <view class="data">
        <view class="data-title">
          <image class="data-icon" src="/images/data-icon.png"></image>
          <view class="data-text">{{startdata}}</view>
        </view>
        <image class="jiantou" src="/images/jiantou-bottom.png"></image>
      </view>
    </picker>
  </view>
  <view class="top-line">
    <view class="top-name">结束日期：</view>
    <picker mode="date" value="{{enddata}}" start="2015-09-01" end="{{checkenddate}}" bindchange="bindendDateChange">
      <view class="data">
        <view class="data-title">
          <image class="data-icon" src="/images/data-icon.png"></image>
          <view class="data-text">{{enddata}}</view>
        </view>
        <image class="jiantou" src="/images/jiantou-bottom.png"></image>
      </view>
    </picker>
  </view>
</view>
<view class="charts">
  <canvas canvas-id="ringCanvas" class="canvas" bindtouchstart="touchHandler"></canvas>
  <view class="charts-right">
    <view class="charts-line">
      <view class="charts-icon1 charts-icon"></view>
      <view class="charts-data">正常进入：{{data.nomalInTimes}}次</view>
    </view>
    <view class="charts-line">
      <view class="charts-icon2 charts-icon"></view>
      <view class="charts-data">正常外出：{{data.nomalOutTimes}}次</view>
    </view>
    <view class="charts-line">
      <view class="charts-icon3 charts-icon"></view>
      <view class="charts-data">　　晚归：{{data.laterTimes}}次</view>
    </view>
    <view class="charts-line">
      <view class="charts-icon4 charts-icon"></view>
      <view class="charts-data">　未归寝：{{data.UnreturnedTimes}}次</view>
    </view>
  </view>
</view>
<view class="bottom">
  <view class="bottom-view">
    <view>
      <view class="bottom-line">
        <view class="bottom-bigback bottom-bigback1">
          <view class="bottom-smllback bottom-smllback1">
            <text>{{data.unIn1Count?data.unIn1Count:0}}次</text>
          </view>
        </view>
      </view>
      <view class="bottom-title">1日未归寝</view>
    </view>
    <view>
      <view class="bottom-line">
        <view class="bottom-bigback bottom-bigback2">
          <view class="bottom-smllback bottom-smllback2">
            <text>{{data.unIn3Count?data.unIn3Count:0}}次</text>
          </view>
        </view>
      </view>
      <view class="bottom-title">3日未归寝</view>
    </view>
    <view>
      <view class="bottom-line">
        <view class="bottom-bigback bottom-bigback3">
          <view class="bottom-smllback bottom-smllback3">
            <text>{{data.unIn5Count?data.unIn5Count:0}}次</text>
          </view>
        </view>
      </view>
      <view class="bottom-title">5日未归寝</view>
    </view>
  </view>
</view>