<template>
  <div class="panel panel-default auto repair-info-content">
    <div class="panel-body">
      <div v-show="title == '缴费记录'">
        <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_pregas }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    购气金额: {{ row.f_preamount }}
                  </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_payment }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    购气时间: {{ row.f_operate_date.substring(0, 11) }}
                    {{ row.f_operate_date.substring(11, 19) }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div v-show="title == '抄表记录'">
        <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-12 col-sm-12 col-md-12">
                    抄表时间: {{ row.f_operate_date.substring(0, 11) }}
                    {{ row.f_operate_date.substring(11, 19) }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    抄表状态: {{ row.f_meter_state }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    气表分类: {{ row.f_meter_classify }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    用户类型: {{ row.f_user_type }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    用户地址: {{ row.f_address }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    用户姓名: {{ row.f_user_name }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    本次底数: {{ row.f_tablebase }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    上次底数: {{ row.f_last_tablebase }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div v-show="title == '欠费记录'">
        <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_last_tablebase }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    本期指数: {{ row.f_tablebase }}
                  </div>
                  <div class="col-xs-6 col-sm-6 col-md-6">
                    抄表时间: {{ row.f_input_date }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    总气量: {{ row.f_oughtamount }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    用气金额: {{ row.f_allfee }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    已缴气费: {{ row.f_debt_money }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    违约金: {{ row.f_overdue }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    总欠费: {{ (row.f_oughtfee + row.f_overdue).toFixed(2) }}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    违约天数: {{ row.overduedays }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div v-show="title == '保险记录'">
        <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-12 col-sm-12 col-md-12">
                    保险险种: {{row.f_insurance_type}}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    购买时间: {{row.f_buy_date}}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    生效时间: {{row.f_ins_start_date}}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    到期时间: {{row.f_expiration_date}}
                  </div>
                  <div class="col-xs-12 col-sm-12 col-md-12">
                    状态: {{row.f_state}}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <p v-show="model.length == 0">{{ message }}</p>
    </div>
  </div>
</template>

<script>
import HttpResetClass from "vue-client/src/plugins/HttpResetClass";
import Vue from "vue";

export default {
  title: "查询用户",
  data() {
    return {
      model: [],
      show: false,
      row: Object,
      message: "请稍候。。。。。。",
    }
  },
  props: {
    user: {
      type: Object
    },
    f_userinfo_id: "",
    title: "",
  },
  methods: {
    getmodel() {
      let userinfoid
      if (this.f_userinfo_id) {
        userinfoid = this.f_userinfo_id
      } else {
        userinfoid = this.user.f_userinfo_id
      }
      let searchItems = ""
      let tableName = ""
      let orderByItems = ""
      switch (this.title) {
        case "欠费记录":
          let url = "rs/sql/getOverdue"
          if (Vue.isv4) {
            url = "api/af-revenue/sql/openapi/getOverdue"
          }
          new HttpResetClass().load("POST", `${this.$androidUtil.getProxyUrl()}/${url}`, {
              data: {
                f_userfiles_id: this.f_userinfo_id,
              }
            }).then((response) => {
              this.model = response.data
              if (this.model.length == 0) {
                this.message = "该用户暂无" + this.title
              }
            })
          return
        case "缴费记录":
          searchItems = "f_pregas,f_preamount,f_payment,f_operate_date,f_state";
          tableName = "t_sellinggas";
          orderByItems = "f_operate_date desc";
          break;
        case "保险记录":
          searchItems = "f_insurance_type,f_fee_type,f_buy_date,f_ins_start_date,f_expiration_date,f_state";
          tableName = "t_userfees";
          orderByItems = "f_operate_date desc";
          break;
        case "抄表记录":
          searchItems =
            "f_operate_date,f_meter_state,f_meter_classify,f_user_type,f_address,f_user_name,f_tablebase,f_last_tablebase";
          tableName = "t_handplan";
          orderByItems = "f_operate_date desc";
          break;
      }
      this.searchHistory(userinfoid, searchItems, tableName, orderByItems);
    },
    searchHistory(userinfoid, searchItems, tableName, orderByItems) {
      this.$resetpost(
        `${this.$androidUtil.getProxyUrl()}/rs/sql/tel_singleTable_OrderBy`,
        {
          data: {
            items: searchItems,
            tablename: tableName,
            orderitem: orderByItems,
            condition: `f_userinfo_id = '${userinfoid}'`
          }
        }).then((resp) => {
          this.model = resp.data;
          if (this.model.length == 0) {
            this.message = "该用户暂无" + this.title;
          }
        }).catch((error) => {
          this.message = "该用户暂无" + this.title;
        })
    }
  },
  ready() {
    if (this.user && this.user.f_userinfo_id) {
      this.getmodel();
    } else if (this.f_userinfo_id) {
      this.getmodel();
    }
  }
}
</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>
