<template>
  <div id='app' class="basic-main" style="height: 100%">
    <criteria-paged :model="model" :pager='false' v-ref:paged>
      <criteria partial='criteria' @condition-changed='search' class="search_area" v-ref:criteria>
        <div novalidate class="form-inline auto" partial>
          <div class="row">
            <div class="col-sm-4" style="width: 20%">
              <label class="font_normal_body">分&nbsp;公&nbsp;司&nbsp;:</label>
              <right-tree @re-res="$parent.$parent.getRes" :initresid="$login.f.orgid"></right-tree>
            </div>
<!--            <div class="col-sm-4" style="width: 20%">-->
<!--              <label for="startDate" class="font_normal_body">开始日期:</label>-->
<!--              <datepicker id="startDate" placeholder="开始日期"-->
<!--                          v-model="model.startDate"-->
<!--                          :value.sync="model.startDate"-->
<!--                          style="width: 60%;"-->
<!--                          :disabled-days-of-Week="[]"-->
<!--                          :format="'yyyy-MM-dd'"-->
<!--                          :show-reset-button="reset">-->
<!--              </datepicker>-->
<!--            </div>-->
<!--            <div class="col-sm-4" style="width: 20%">-->
<!--              <label for="endDate" class="font_normal_body">结束日期:</label>-->
<!--              <datepicker id="endDate" placeholder="结束日期"-->
<!--                          v-model="model.endDate"-->
<!--                          :value.sync="model.endDate"-->
<!--                          :disabled-days-of-Week="[]"-->
<!--                          style="width: 60%;"-->
<!--                          :format="'yyyy-MM-dd'"-->
<!--                          :show-reset-button="reset">-->
<!--              </datepicker>-->
<!--            </div>-->
            <div class="col-sm-4" style="width: 20%">
              <button class="button_search button_spacing" @click="search()">查询</button>
              <report-excel class="button_export button_spacing" style="width:28%" id='aode'></report-excel>
            </div>
          </div>
        </div>
      </criteria >
      <div partial='list' id='aode' class="list_area" style="overflow-y: scroll">
        <table class='tableprint' style="margin: 0px auto">
          <thead>
          <tr>
            <th colspan='7' style="font-weight: normal; text-align: left;">
              <h3 style="text-align: center">{{ $parent.orgname }}工商业用户抄表率报表</h3>
            </th>
          </tr>
<!--          <tr>-->
<!--            <th colspan='3' style="font-weight: normal; text-align: center;">-->
<!--              开始时间：{{model.model.startDate}}-->
<!--            </th>-->

<!--            <th colspan='4' style="font-weight: normal; text-align: center;">-->
<!--              结束时间：{{ model.model.endDate }}-->
<!--            </th>-->
<!--          </tr>-->
          </thead>
          <tr>
            <td colspan='12' style="border: 0px">
              <table>
                <tr>
                  <td class="tdcenter bg-info" width="100" height="30" >开户总数</td>
                  <td class="tdcenter bg-info" width="100" height="30" >抄表总户数</td>
                  <td class="tdcenter bg-info" width="100" height="30" >未抄表总户数</td>
                  <td class="tdcenter bg-info" width="100" height="30" >抄表率</td>
                </tr>
              </table>
              <table class="tableprint" v-for="row in model.data">
                <tr >
                  <td class="tdcenter bg-info" width="100" height="30" rowspan="7">{{ row.khs}}</td>
                </tr>
                <tr>
                  <td class="tdcenter bg-info" width="100" height="30" rowspan="7">{{row.cbs}}</td>
                </tr>
                <tr>
                  <td class="tdcenter bg-info" width="100" height="30" rowspan="7">{{row.wcbs}}</td>
                </tr>
                <tr>
                  <td class="tdcenter bg-info" width="100" height="30" rowspan="7">{{row.cbsrate}}</td>
                </tr>
              </table>
            </td>
          </tr>
        </table>
      </div>
    </criteria-paged>
  </div>
</template>

<script>
  import {DataModel} from 'vue-client'
  import * as Util from "../Util";
  export default {
    title: '抄表率报表',
    data() {
      let model = new DataModel('api/af-safecheck/sql/MeterReadingRate', {startDate: 'this.model.startDate', endDate: 'this.model.endDate', f_filialeid: 'this.f_filialeid'})
      model.f_filialeid = '(' + this.$login.f.orgid + ')'
      return {
        filialeNameStr: '',
        filialeCodeStr: '',
        orgname:'',
        userid: this.$login.f.id,
        source: `tool.getFullTree(this.getRights().where(row.getType() != $zone$).where(row.getType() == $organization$))`,
        model: model,
        f_user_types: [{label:'全部',value:''},{label:'民用',value:'民用'},{label:'非民用',value:'非民用'}],
        f_gaspropertiess: [{label:'全部',value:''},{label:'工业用气',value:'工业用气'},{label:'居民用气',value:'居民用气'},{label:'民用用气',value:'民用用气'},{label:'商业用气',value:'商业用气'}],
      }
    },
    methods: {
      getRes(obj) {
        this.orgname=obj.res[0]
        this.$set('orgname',obj.res[0])
        this.model.f_filialeid = this.$login.convertToIn(obj.resids);
        console.log(this.model.f_filialeid)
        console.log(this.orgname)
      },
    },
    ready() {
      console.log(this.$login.f)
      this.orgname=this.$login.f.orgs
      this.$refs.paged.$refs.criteria.model.endDate = Util.toStandardTimeString().substring(0,10)
      this.$refs.paged.$refs.criteria.model.startDate = Util.getPreMonth(this.$refs.paged.$refs.criteria.model.endDate)

    },
    computed: {
      selected() {
        return this.$refs.grid.selected
      },
    }
  }
</script>
