<template>
  <div>
    <!--<button class="btn btn-xs" v-show="!criteriaShow" @click="show()">-->
      <!--<span class="glyphicon glyphicon-chevron-down" style="color: #000;"></span>-->
    <!--</button>-->
    <criteria-paged :model="model"  v-ref:paged>
      <criteria partial='criteria' @condition-changed='search' v-ref:criteria>
        <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
          <div class="row">
            <div class="col-sm-3 form-group form-input-group" style="width: 20%">
              <label class="control-label">计划名称</label>
              <input type="text" class="form-control" v-model="model.f_plan_name" id="f_plan_name" style="height:34px;margin-top: 8px"
                     placeholder="计划名称" condition="f_plan_name like '%{}%'">
            </div>
            <div class="col-sm-3 form-group form-input-group" style="width: 20%">
              <label class="control-label">小区名称</label>
              <input type="text" class="form-control" v-model="model.f_plan_year" id="f_plan_year" style="height:34px;margin-top: 8px"
                     placeholder="计划年份" condition="f_plan_year = '{}'">
            </div>
            <div class="col-sm-3 form-group form-input-group" style="width: 20%">
              <label class="control-label">安检员</label>
              <input type="text" class="form-control" v-model="model.f_plan_month" id="f_plan_month" style="height:34px;margin-top: 8px"
                     placeholder="计划月份" condition="f_plan_month = '{}'">
            </div>
            <div class="col-sm-3 form-group form-input-group" style="width: 20%">
              <label class="control-label">起始时间</label>
              <datepicker
                :value.sync="model.f_check_start"
                placeholder='开始时间' style="margin-top: 8px"
                :disabled-days-of-week="[]"
                :format="'yyyy-MM-dd'"
                :show-rest-button="reset"
                v-model = "model.f_check_start"
                condition="f_onsite_time > ='{} 00:00:00'">
              </datepicker>
            </div>
            <div class="col-sm-3 form-group form-input-group" style="width: 20%">
              <label class="control-label">结束时间</label>
              <datepicker
                :value.sync="model.f_check_end"
                placeholder='结束时间' style="margin-top: 8px"
                :disabled-days-of-week="[]"
                :format="'yyyy-MM-dd'"
                :show-rest-button="reset"
                v-model = "model.f_check_end"
                condition="f_onsite_time < ='{} 00:00:00'">
              </datepicker>
            </div>

            <div class="row">
              <div class="span" style = "float:right;margin-top:5px">
                <button class="button_search button_spacing" @click="search()">查询</button>
              </div>
            </div>

          </div>
        </div>
      </criteria>
      <data-grid :model="model" partial="list" class="table table-bordered table table-hover" v-ref:grid >
        <template partial='head'>
          <tr>
            <!--<th><nobr>全选<input style="width: 22px;height: 22px;" type="checkbox" @click='$parent.$parent.$parent.changeStates(row)'  v-model='$parent.$parent.$parent.checkedAll'></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_checker_name}}</td>
          <td style="text-align: center;">{{row.f_plan_name}}</td>
          <td  style="text-align: center;">{{row.f_residential_area}}</td>
          <td  style="text-align: center">{{row.f_usercount}}</td>
        </template>
      </data-grid>
    </criteria-paged>
  </div>
  <!--<work-busy :is-busy="showWait"></work-busy>-->
</template>

<script>
  import { PagedList } from 'vue-client'
  import { HttpResetClass } from 'vue-client'
  import co from 'co'
  import * as Util from '../Util'
  import Vue from 'vue'
  import AppData from '../../stores/AppData'


  export default {
    title: '点火验收单报表',
    data() {
      return {
        model: new PagedList('rs/sql/IgnitionPlanReport',20,{}),
        checkboxModel: {},
      }
    },
    props: {
      checkplan: { // 传入一条安检计划信息
        type: Object
      },
      additemshow:{
        type:Boolean,
        default:false
      }
    },
    ready() {
    },
    methods: {
      search(args) {
        this.model.search(args.condition, args.model)
      },

    },
    watch: {
    },
    computed: {
      selected() {
        return this.$refs.paged.$refs.grid.selected
      }
    }
  }
</script>
<style scoped>
  .newcolor{
    color:red;
  }
  .table th{
    background-color: #f2f6fa;
    color: black;
  }
</style>
