<template>
  <com-head :options="headList"  v-model="selectStatus" v-if="!loadding">
    <el-form label-width="90px" inline="true">
      <el-form-item label="小区编码：">
        <el-input v-model="search.state.gardenNumber" placeholder="请输入"></el-input>
      </el-form-item>
      <el-form-item label="小区名称：">
        <el-input v-model="search.state.gardenName" placeholder="请输入"></el-input>
      </el-form-item>
      <el-form-item label="城市：">
        <el-select v-model="search.state.cityId" filterable clearable  placeholder="请选择">
          <el-option
            v-for="item in citys"
            :key="item.cityId"
            :label="item.cityName"
            :value="item.cityId">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="行政区：">
        <com-region :cityId="search.state.cityId" clearable  v-model="search.state.areaId" placeholder="请输入" />
      </el-form-item>
      <el-form-item label="物业类型：">
        <el-select v-model="search.state.propertySort" clearable  filterable placeholder="请选择">
          <el-option
            v-for="item in propertys"
            :key="item.propertySort"
            :label="item.propertySortName"
            :value="item.propertySort">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="建成年代：">
        <el-date-picker
          v-model="yearsTime"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="更新人：">
        <el-input v-model="search.state.updateByName" placeholder="请输入"></el-input>
      </el-form-item>
      <el-form-item label="创建时间：">
        <el-date-picker
          v-model="createTime"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>

      <el-form-item class="searh-btns">
        <el-button @click="resetSearch">重置</el-button>
        <el-button type="primary" @click="search.submit">查询</el-button>
        <el-button type="primary" @click="exportExe" :disabled="!pag.state.total">导出</el-button>
      </el-form-item>
    </el-form>
  </com-head>
</template>

<script>
import comHead from "@/components/head";
import getState from './state'
import { getParams } from "@/state/tableRef";
import axios from 'axios';
import { EXAMINE_SHOW_STATUS } from '@/constant'
import { exporrtCommunityAuditEstate, getCommunityTotal } from '@/request/config'
// import { getCitys, getPropertys } from '@/constant/ssrLists'
import comRegion from "@/components/region";
import { ref,reactive } from '@vue/reactivity';

export default {
  props: {
    parentVM: Object
  },
  setup(props) {
    const state = getState(props.parentVM)


    return {
      ...state,
      loadding: ref(true),
      citys: reactive([]),
      propertys: reactive([]),
      status: EXAMINE_SHOW_STATUS,
    }
  },
  watch: {
    'dataList.state'() {
      this.referTotal()
    }
  },
  methods: {
    resetSearch() {
      let type = this.search.state.type
      this.search.reset()
      this.search.state.type = type
    },
    async exportExe() {
      let params = {
        ...getParams(this.search.state),
        pageNum: this.pag.state.currPage,
        pageSize: this.pag.state.size
      }
      // if (!params.startTime || !params.endTime) {
      //   return this.$alert('请先选择提审时间段', '提示')
      // } else {
      //   const monthDiff = (startDate, endDate) => Math.max(0, (endDate.getFullYear() - startDate.getFullYear()) * 1022 - startDate.getMonth() + endDate.getMonth());
      //   if (monthDiff(this.time[0], this.time[1]) > 3) {
      //     return this.$alert('最多支持导出连续四个月的数据', '提示')
      //   }
      // }
      
      let res = await axios.get(exporrtCommunityAuditEstate, { params })
      location.href = res.data.resultData
    },
    async referTotal() {
      let res = await axios.post(getCommunityTotal)
      const map = {
        allCount: -2,
        areaAuditingCount: 3,
        groupAuditingCount: 1,
        onlineCount: 2,
        unPassCount: -1 
      }
      this.headList = this.initHeadList.map(item => {
        for (let key in res.data) {
          if (item.value === map[key]) {
            return {...item, name: `${item.name}(${res.data[key]})`}
          }
        }
        return item
      })
    }
  },
  async mounted() {
    this.initHeadList = this.headList.map(item => ({...item}))
    await this.referTotal()
    this.loadding = false
  },
  components: {
    "com-region": comRegion,
    comHead
  }
}
</script>