<template>
  <div class="container">
    <div class="header">
      <el-form :inline="true" :model="query" class="demo-form-inline">
        <el-form-item label="检测时间:">
          <el-date-picker
            v-model="query.start"
            type="date"
            placeholder="选择日期"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="-------">
          <el-date-picker
            v-model="query.end"
            type="date"
            placeholder="选择日期"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>

        <el-form-item label="设施种类:">
          <el-select v-model="query.type" placeholder="请选择设施种类">
            <el-option label="仓房设施" value="1"></el-option>
            <el-option label="消防设施" value="2"></el-option>
            <el-option label="计量设施" value="3"></el-option>
            <el-option label="药品库设施" value="4"></el-option>
              <el-option label="配电室设施" value="5"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button type="success" plain @click="search()">查询</el-button>
          <el-button type="success" plain @click="clear()">清空</el-button>
        </el-form-item>
      </el-form>
      
    </div>

    <el-table
      border
      stripe
      :data="allData"
      highlight-current-row
      @current-change="handleCurrentChange"
      style="width: 100%"
    >
      <el-table-column type="index" align="center" label="序号" width="50px">
      </el-table-column>

      <!-- <el-table-column
              @current-change="handleCurrentChange"
            align="center"
            prop="dId"
            label="id"
            type="index"
            :index="indexMethod"
            show-overflow-tooltip
          ></el-table-column> -->
      <el-table-column prop="checkTime" label="检查时间" align="center">
      </el-table-column>
      <el-table-column prop="type" label="设施种类" align="center">
      </el-table-column>
      <el-table-column prop="status" label="状态" align="center">
      
      </el-table-column>
      <el-table-column prop="result" label="检查结果" align="center">
      
      </el-table-column>

      <el-table-column
        prop="operation"
        label="操作"
        align="center"
        width="300px"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleCheck(3, scope.$index, scope.row)"
            >查看</el-button
          >

        
          <el-button size="mini" @click="handleDelete(scope.$index, scope.row)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
      <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="listQuery.page"
          :limit.sync="listQuery.limit"
          @pagination="getPageList(page,limit)"
        />
  </div>
</template>
<script>
import Pagination from "@/components/Pagination"
export default {
   components: { Pagination },
  data() {
    return {
      query: {
        start: "",
        end: "",
      },

      //分页
      total: 30,
      listLoading: true,
      listQuery: {
        page: 1,
        limit: 10,
        importance: undefined,
        title: undefined,
        type: undefined,
        sort: "+id",
      },

      allData:[
        {
         checkTime:"2020-2-2",
         type:"仓房设施",
         status:"已完成",
         result:"1111"
        },
         {
         checkTime:"2020-2-2",
         type:"仓房设施",
         status:"已完成",
         result:"1111"
        },
         {
         checkTime:"2020-2-2",
         type:"仓房设施",
         status:"已完成",
         result:"1111"
        },
      ]
    }
  },
  methods: {
    handleCurrentChange(){}
  },
}
</script>
<style lang="scss">
.container {
  padding: 10px;
  .header {
    height: 40px;
    line-height: 40px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
  }
}
</style>