<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="font_normal_body">小区名称</label>
                <input type="text" class="input_search" v-model="model.f_residential_area"
                       style="width: 60%" placeholder="小区名称" condition="ta.f_residential_area like '%{}%'">
              </div>
              <div class="form-group col-sm-2" style="width: auto;margin-top:8px;float: right">
                <div style="float: right" class="button_spacing"
                     :class="{'button_shrink_left':$parent.$parent.$parent.showItem,'button_shrink_right':!$parent.$parent.$parent.showItem}"
                     @click="$parent.$parent.hiddenr()"></div>
                <export-excel-safe :data="$parent.$parent.searchData"
                              :field="$parent.$parent.excelHeaders"
                              :choose-col="true"
                              sqlurl="rs/logic/SafeExportExcel" sql-name="securityCheckLedger" template-name='安检台账'></export-excel-safe>
                <button class="button_spacing button_search" @click="search()">查询</button>
              </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>
            </tr>
          </template>
          <template partial='body'>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.f_residential_area}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.area_num}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.f_plan_name}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.plan_num}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.f_issue_time}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.first_check_date}}</td>
            <td style="text-align: center " @click="$parent.$parent.$parent.showList(row)">{{row.f_use_end_time}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.zq_value}}</td>
            <td style="text-align: center" @click="$parent.$parent.$parent.showList(row)">{{row.dw_value}}</td>
            <td :style="{ 'text-align': 'center', color: row.difference_day <= 100 ? 'red' : '' }" @click="$parent.$parent.$parent.showList(row)">{{ row.difference_day }}</td>
            <td style="text-align: center">
              <button class="button_spacing button_search" @click="$parent.$parent.$parent.showUser(row)">计划下发</button>
            </td>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
  </div>
</template>

<script>
  import {PagedList} from 'vue-client'

export default {
  title: '安检台账',
  data() {
    return {
      model: new PagedList('rs/sql/securityCheckLedger', 20),
      searchData: {
        condition: "1=1"
      },
      excelHeaders: {
        'f_residential_area': '小区名称',
        'area_num': '小区用户数',
        'f_plan_name': '所属计划',
        'plan_num': '计划内用户数',
        'f_issue_time': '计划下发时间',
        'first_check_date': '计划执行时间',
        'f_use_end_time': '计划结束时间',
        'zq_value': '执行周期',
        'dw_value': '周期单位',
        'difference_day': '距离下周期时间（天）'
      }
      }
    },
    methods: {
      hiddenr() {
        if (this.$parent.isdetail){
          this.$parent.isdetail = false
        }
        if (this.$parent.isdetail2){
          this.$parent.isdetail2 = false
        }
      },
      showList(row){
        row.val = row
        this.$parent.selected(row)
      },
      showUser(row){
        row.val = row
        this.$parent.selected2(row)
      },
      selfSearch(args) {
        args.condition += ` and ta.f_orgid = '${this.$login.f.orgid}'`
        this.model.search(args.condition, args.model, args.condValue)
      }
    },
    ready() {

    },
  watch: {
    'model.condition'(val) {
      if (val) {
        this.searchData.condition = val
      }
    }
  },
  computed: {
    selected() {
      return this.$refs.paged.$refs.grid.selected
    }
  }

  }
</script>
