<template>
  <div class="flex">
    <criteria-paged :model="model" v-ref:paged :pager="false">
      <criteria partial='criteria' @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-4" >
              <label class="font_normal_body">计划名称</label>
              <input type="text" class="input_search" style="width:60%" v-model="model.f_plan_name" placeholder='计划名称'
                     condition="f_plan_name = '{}'" @keyup.enter="search()">
            </div>
<!--            <div class="form-group col-sm-4" >-->
<!--              <label class="font_normal_body">用户类型</label>-->
<!--              <v-select style="width:60% "-->
<!--                        class="select select_list"-->
<!--                        :value.sync="model.f_user_type"-->
<!--                        v-model="model.f_user_type"-->
<!--                        :options='$parent.$parent.userType'-->
<!--                        placeholder='用户类型'-->
<!--                        condition="f_user_type = '{}'"-->
<!--                        close-on-select>-->
<!--              </v-select>-->
<!--            </div>-->
<!--            <div class="form-group col-sm-4" >-->
<!--              <label class="font_normal_body">是否已检</label>-->
<!--              <v-select style="width:60% "-->
<!--                        class="select select_list"-->
<!--                        :value.sync="model.f_state"-->
<!--                        v-model="model.f_state"-->
<!--                        :options='$parent.$parent.checkState'-->
<!--                        placeholder='是否已检'-->
<!--                        condition="f_state = '{}'"-->
<!--                        close-on-select>-->
<!--              </v-select>-->
<!--            </div>-->
<!--            <div class="form-group col-sm-4" >-->
<!--              <label class="font_normal_body">安检状态</label>-->
<!--              <v-select style="width:60% "-->
<!--                        class="select select_list"-->
<!--                        :value.sync="model.f_entry_status"-->
<!--                        v-model="model.f_entry_status"-->
<!--                        :options='$parent.$parent.entry_status'-->
<!--                        placeholder='安检状态'-->
<!--                        condition="f_entry_status = '{}'"-->
<!--                        close-on-select>-->
<!--              </v-select>-->
<!--            </div>-->
          </div>
<!--          <div class="row" v-show="$parent.$parent.criteriaShow">-->
<!--            <div class="form-group col-sm-4" >-->
<!--              <label class="font_normal_body">气表编号</label>-->
<!--              <input type="text" class="input_search" style="width:60%" v-model="model.f_meternumber" placeholder='气表编号'-->
<!--                     condition="f_meternumber = '{}'" @keyup.enter="search()">-->
<!--            </div>-->
<!--            <div class="form-group col-sm-4" >-->
<!--              <label class="font_normal_body">气表品牌</label>-->
<!--              <input type="text" class="input_search" style="width:60%" v-model="model.f_meter_brand" placeholder='气表品牌'-->
<!--                     condition="f_meter_brand like '%{}%'" @keyup.enter="search()">-->
<!--            </div>-->
<!--          </div>-->
          <div class="row">
            <div class="form-group col-sm-2 button-range" >
              <button class="button_search" style="margin-right: 10px"  @click="search()" v-el:cba>查询</button>
<!--              <export-excel-safe   :data="$parent.$parent.exportParameter"-->
<!--                                   :field="$parent.$parent.excelHeaders"-->
<!--                                   sqlurl="rs/logic/SafeExportExcel" sql-name="getCheckPlanUserList"-->
<!--                                   template-name='安检情况明细' :choose-col="true">-->
<!--              </export-excel-safe>-->
<!--              &lt;!&ndash;展示下方条件或隐藏&ndash;&gt;-->
<!--              <div class="span" style="float:right;">-->
<!--                <div class="button_spacing" style="float: right;margin-left:10px"-->
<!--                     :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"-->
<!--                     @click="$parent.$parent.hidden()">-->
<!--                </div>-->
<!--              </div>-->
            </div>
          </div>
        </div>
      </criteria>
      <data-grid :model="model" class="table_sy"  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>
          </tr>
        </template>
        <template partial='body' >
          <tr >
            <td style="text-align:center"><span>{{row.f_plan_name}}</span></td>
            <td style="text-align:center"><span>{{row.f_plan_num}}</span></td>
            <td style="text-align:center"><span>{{row.f_issue_time}}</span></td>
            <td style="text-align:center"><span>{{row.min_f_last_check_date}}</span></td>
            <td style="text-align:center"><span>{{row.max_f_last_check_date}}</span></td>
            <td style="text-align:center">{{row.f_ruhu}}</td>
            <td style="text-align:center">{{row.f_buyu}}</td>
            <td style="text-align:center">{{row.f_jujian}}</td>
            <td style="text-align:center">{{row.f_check_bv}}</td>
            <td style="text-align:center">{{row.f_ruhu_bv}}</td>
          </tr>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

<script>
import {HttpResetClass, PagedList} from 'vue-client'
export default {
  title: '安检情况明细',
  data () {
    return {
      model: new PagedList('rs/sql/securityCheckList', 50, {}),
    }
  },
  props: ['checkrow'],
  ready () {
    this.search()
    // this.getfield = this.config.excelHeaders
  },
  methods: {
    search () {
      this.$refs.paged.$refs.criteria.search()
    },
    async selfSearch (args) {
      if(!this.checkrow){
        return
      }
      let condition = {
        condition1: `f_residential_area = '${this.checkrow.f_residential_area}'`,
        condition2: args.condition
      }
      const res = await new HttpResetClass().load('post','/rs/sql/securityCheckList',{data:{condition: condition}})
      this.model.rows = res.data
      // this.model.search(condition, args.model)
    },
  },
  watch: {
    'checkrow' () {
      this.search()
    }
  }
}
</script>
