<template>
  <basic-container>
    <!--搜索栏-->
    <el-form
      size="small"
      label-position="right"
      :inline="true"
      style="padding-left: 10px;padding-right: 10px;"
    >
      <el-row :span="24">
        <el-form-item label="姓名:">
          <el-input v-model="search.companyName" placeholder="姓名" clearable></el-input>
        </el-form-item>
        <el-form-item label="身份证号码:">
          <el-input v-model="search.companyName" placeholder="姓名" clearable></el-input>
        </el-form-item>
        <el-form-item label="服务状态:">
          <el-input v-model="search.companyName" placeholder="姓名" clearable></el-input>
        </el-form-item>
        <el-form-item label="服务期:">
          <el-date-picker
            v-model="monthData"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
             @change="getDateValue ">
            </el-date-picker>
        </el-form-item>
        <div class="searchBtn">
          <el-button type="primary" size="small" icon="el-icon-search" @click="handleSearch">搜 索</el-button>
          <el-button size="small" icon="el-icon-delete" @click="handleClear">清 空</el-button>
        </div>
      </el-row>
    </el-form>
    <!--/搜索栏-->
    <payment-table ref="waiting" v-if="search.status === 0" @refresh="handleClear"></payment-table>
  </basic-container>
</template>

<script>
import PaymentTable from './Table/PaymentTable'//待签发

export default {
  comments: {

  },
  name: "income_tax",
  data () {
    return {
      monthLast:'',
      monthData:'',
      monthData1:'',
      onLinePayValue:'all',
      timeValue:"",
      page: {
        pageSize: 20,
        currentPage: 1,
        total: 0
      },
      search: {
        status: 0
      }
    }
  },
  components: {
    PaymentTable,
  },
  computed: {
  },
  watch: {
  },
  created(){
  },  
  methods: {
    getDateValue(val){
      this.search.commitStartTime = val[0];
      this.search.commitEndTime = val[1];
    },
    getDateValue1(val){
      this.search.signStartTime = val[0];
      this.search.signEndTime = val[1];
    },
    getCurrentMonthLast (val) {
      var date = val.toString().split('-');
      var year = date[0];
      var month = date[1];
      var day = new Date(year, month, 0)
      this.monthLast = year + '-' + month + '-' + day.getDate()+' 00:00:00';
    },
    handleSearch () {
      //this.search.belong = this.monthLast;
      if (this.search.status === 0) {
        this.$refs.waiting.onLoad(this.page, this.search);
      } else if (this.search.status === 1) {
        this.$refs.onging.onLoad(this.page, this.search);
      } else if (this.search.status === 2) {
        this.$refs.finished.onLoad(this.page, this.search);
      }
    },
    dateChange(val){
      if(val){
        this.search.stime = val[0]+" 00:00:00";
        this.search.etime = val[1]+" 23:59:59";
      }else{
        this.search.stime = '';
        this.search.etime = '';
      }
      
    },
    handleClear () {
      let curStatus = this.search.status;
      this.search = {
        status: curStatus,
        companyName: '',
      }
      this.timeValue = '';
      this.monthData = '';
      this.monthData1 = '';
      this.monthLast = '';
      this.handleSearch()
    }
  }
};
</script>
<style scoped>
.el-form-item {
  margin-bottom: 18px;
  padding: 0 10px;
}
.searchBtn {
  display: inline-block;
  margin-bottom: 18px;
}
.el-form-item__label,.el-input--small{
    font-size: 12px;
}
.el-form--inline .el-form-item{
    margin-right: 10px;
}
.el-radio-button--small .el-radio-button__inne{
    font-size: 14px;
}
</style>
