<template >
  <div class="panel panel-default auto repair-info-content">
    <div class="panel-body">
      <div class="panel panel-default well" v-for="row in model">
        <div class="bg-info">
          <div class="row form-group">
            <div class="col-xs-12 col-sm-12 col-md-12">
              <div class="row">
                <div class="col-xs-6 col-sm-6 col-md-6">
                  收费类型: {{row.f_brand_spec}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  品名规格: {{row.f_typename}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  单价: {{row.f_collection}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  数量: {{row.f_number}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  收款: {{row.f_money}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  付款方式: {{row.f_payment}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  状态: {{row.f_state}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  收费日期: {{row.f_operate_date}}
                </div>
                <div class="col-xs-6 col-sm-6 col-md-6">
                  服务人员: {{row.f_operator}}
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <p v-show="model.length == 0 && noExp ">此用户暂无其他收费记录</p>
      <p v-show="model.length == 0 && !noExp ">{{expMsg}}</p>
    </div>
  </div>
</template>

<script>
  import { PagedList } from 'vue-client'
  import co from 'co'
  import Vue from 'vue'
  export default {
    title: '查询其他收费记录',
    data () {
      return {
        model: [],
        show: false,
        row: Object,
        noExp: false,
        expMsg: '查询中......'
      }
    },
    props: {
      user: {
        type: Object
      },
      f_userinfo_id:''
    },
    methods: {
      getmodel () {
        let userinfoid
        if(this.f_userinfo_id){
          userinfoid = this.f_userinfo_id
        }else{
          userinfoid = this.user.f_userinfoid
          console.log(this.user.f_userinfo_id)
        }
        console.log(userinfoid)
        this.noExp = false
        this.$resetpost(`${this.$androidUtil.getProxyUrl()}/api/af-revenue/sql/otherChargeQuery`, {data: {
            condition: ` f_orgid in ('${Vue.user.orgid}') and f_userinfo_id =  '${userinfoid}' and f_state = '有效'`,
            orderitem: "f_operate_date desc"
          }
        }).then((row) => {
          this.model = row.data
          this.noExp = true
        })
      },
      back(){

      }
    },
    watch: {
      'f_userinfo_id'(){
        if(this.f_userinfo_id){
          this.model= []
          this.getmodel()
        }
      }
    },
    ready () {
    }
  }
</script>
<style>
  .app-botton {
    position:fixed;
    background: #87b2dd;
    color: #FFF;
    padding: 8px;
    text-align: center;
    font-size: 1.2em;
    z-index: 10;
    opacity:0.5;
    bottom: 50px;
    margin-top: -10px;
    height: 40px;
  }
</style>
