<template>
  <div class="flex-row">
    <div class="basic-main">
      <criteria-paged :model="model" v-ref:paged >
        <criteria partial='criteria' class="search_area" @condition-changed='$parent.selfSearch' v-ref:criteria>
          <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row">
              <div class="form-group col-sm-2">
                <label class="control-label">公&emsp;&emsp;司</label>
                <right-tree @re-res="$parent.$parent.getRes" :initresid="$login.f.orgid">
                </right-tree>
              </div>
              <div class="form-group col-sm-2"  >
                <label class="font_normal_body">区域</label>
                <v-select :value.sync="model.f_name" v-model='model.f_name'
                          :value-single="true" style="width: 60%"
                          class="select_list select"
                          :options='$parent.$parent.areaList' placeholder='区域'
                          close-on-select
                          condition="f_name = '{}'"></v-select>
              </div>

              <div class="form-group col-sm-2"  >
                <label class="font_normal_body">调压箱</label>
                <v-select :value.sync="model.f_adjustable_id" v-model='model.f_adjustable_id'
                          :value-single="true" style="width: 60%"
                          class="select_list select"
                          :options='$parent.$parent.boxOptions' placeholder='调压箱'
                          close-on-select
                          condition="f_adjustable_id = '{}'"></v-select>
              </div>
              <div class="form-group col-sm-2" >
                <label class="font_normal_body">安检时间</label>
                <datepicker
                  :value.sync="model.start"
                  placeholder='开始时间' style="width: 60%"
                  :disabled-days-of-week="[]"
                  :format="'yyyy-MM-dd'"
                  :show-rest-button="reset"
                  v-model="model.start"
                  >
                </datepicker>
              </div>
              <div class="form-group col-sm-2" >
                <label class="font_normal_body">安检时间</label>
                <datepicker
                  :value.sync="model.end"
                  placeholder='结束时间' style="width: 60%"
                  :disabled-days-of-week="[]"
                  :format="'yyyy-MM-dd'"
                  :show-rest-button="reset"
                  v-model="model.end">
                </datepicker>
              </div>
              <button class="button_spacing button_search" @click="$parent.$parent.search()">查询</button>
              <div style="float: right" class="button_spacing"
                   :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                   @click="$parent.$parent.hidden()"></div>
              <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow"  >
              </div>
            </div>
          </div>
        </criteria>
           <data-grid class="list_area table_sy" style="overflow: hidden" :model="model" partial='list' v-ref:grid>
          <template partial='head'>
            <tr>
              <th>
                <nobr>公司</nobr>
              </th>
              <th>
                <nobr>区域</nobr>
              </th>
              <th>
                <nobr>调压箱</nobr>
              </th>
              <th>
                <nobr>总用户数</nobr>
              </th>
              <th>
                <nobr>已检数</nobr>
              </th>
              <th>
                <nobr>未检数</nobr>
              </th>
              <th>
                <nobr>到访不遇</nobr>
              </th>
              <th>
                <nobr>拒检数</nobr>
              </th>
              <th>
                <nobr>隐患数</nobr>
              </th>
              <th>
                <nobr>已处理数</nobr>
              </th>
              <th>
                <nobr>未处理数</nobr>
              </th>
              <th>
                <nobr>安检完成率</nobr>
              </th>
            </tr>
          </template>
          <template partial='body'>
            <td style="text-align: center">{{row.f_orgname}}</td>
            <td style="text-align: center">{{row.f_name}}</td>
            <td style="text-align: center">{{row.f_adjustable_name}}</td>
            <td style="text-align: center">{{row.usertotal}}</td>
            <td style="text-align: center">{{row.ruhutotal}}</td>
            <td style="text-align: center">{{row.usertotal-row.ruhutotal}}</td>
            <td style="text-align: center">{{row.buyutotal}}</td>
            <td style="text-align: center">{{row.jujiantotal}}</td>
            <td style="text-align: center">{{row.f_defect_count}}</td>
            <td style="text-align: center">{{row.f_repair_count}}</td>
            <td style="text-align: center">{{row.weichuli}}</td>
            <td style="text-align: center">{{row.ruhulv}}</td>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
  </div>
</template>

<script>
import {HttpResetClass, PagedList} from 'vue-client'
export default {
  title: '安检区域汇总',
  data() {
    let model = new PagedList('rs/sql/regionalCheckList', 20,{
      start: 'this.start',
      end: 'this.end',
    })
    model.start = ''
    model.end = ''
    return {
      model: model,
      f_filialeids: '',
      areaList: [],
      boxOptions: [],
      }
    },
    methods: {
      //获取区域信息
      async getAreaList() {
        let resp = await new HttpResetClass().load('POST', `/rs/sql/safe_singleTable_OrderBy`, {
          data: {
            items:'*',
            tablename: 't_region',
            condition: `f_orgid = '${this.$login.f.orgid}'`,
            orderitem:'id'
          }
        }, {resolveMsg: null, rejectMsg: null})
        //tag)
        const areas = [{label: '全部', value: ''}]
        for (const item of resp.data) {
          areas.push({
            label: item.f_name,
            value: item.f_name
          })
        }
        this.areaList = areas
      },
      getAdjustableList() {
        new HttpResetClass().load('post', `/rs/sql/adjustableboxQuery`,
          {data: {condition: '1 = 1'}},
          {
          resolveMsg: null,
          rejectMsg: null
        }).then((res) => {
          const boxOptions =[{label: '全部', value: ''}]
          for (const data of res.data) {
            const one = {
              label: data.f_adjustable_id + data.f_adjustable_name,
              value: Number(data.f_adjustable_id)
            }
            boxOptions.push(one)
          }
          this.boxOptions = JSON.parse(JSON.stringify(boxOptions))
        }).catch((msg) => {
        })
      },
      getRes(obj) {
        this.f_filialeids = this.$login.convertToIn(obj.resids);
        },
      hidden() {
        this.criteriaShow = !this.criteriaShow
      },
      refresh() {
        this.$refs.paged.$refs.criteria.search()
      },
      search() {
        this.$refs.paged.$refs.criteria.search()
      },
      selfSearch(args) {
        if(args.model.start!=''){
          this.model.start = args.model.start
        }
        if(args.model.end!=''){
          this.model.end = args.model.end
        }
        if(this.f_filialeids!=''){
          args.condition += ` and f_orgid in ${this.f_filialeids}`

        }
        this.model.search(args.condition, args.model)
      }
    },
    ready() {
        this.getAdjustableList()
        this.getAreaList()
        this.search()
      },
    watch: { }

  }
</script>
