<template>
  <div class="auto app-text" style="margin-top: 5px;" v-for="item in data" @click="inputMeter(item)">
    <div class="panel" style="padding: 10px 10px 5px 10px;">
      <div class="panel-body panel-self">
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">户编号</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_userinfo_code }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">户姓名</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_user_name }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">户电话</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_user_phone }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">户地址</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_address }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">表号</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_meternumber }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">下发时间</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_hand_date }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">账户结余</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_balance }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">上期液晶示数</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_last_lcd }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">本期液晶示数</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_lcd }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">上期底数</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_last_tablebase }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">本期底数</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_tablebase }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">本期用量</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_oughtamount }}</p>
        </div>
        <div class="row">
          <p class="panel-title col-xs-4 text-left font">抄表状态</p>
          <p class="panel-title col-xs-8 text-right show-font">{{ item.f_meter_state }}</p>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    title: '抄表单信息',
    data () {
      return {}
    },
    props: {
      data: {
        type: Array,
        default: function () {
          return []
        }
      }
    },
    methods: {
      inputMeter (param) {
        this.$dispatch('select', param)
      }
    }
  }
</script>
<style>
  .app-text {
    font-size: 12px;
  }
  .panel-self{
    border-radius: 10px;
    border:1px solid #499EDF;
    background-color: #F8F8F8;
  }
  .font{
    font: 17px PingFang-SC-Medium;
    color: #666666
  }
  .show-font{
    font: 17px PingFang-SC-Medium;
    color: #333333
  }
</style>
