<template>
   <div class="global">
    <div class="mainContainer">
    <div class="top">器材库</div>
    <div class="container">
      <div class="header">
        <!-- <el-button>新增</el-button> -->
         <div class="div_input">
            <span>资产编号：</span>
            <el-input
              class="select_input"
              type="text"
              v-model="query.assetNumber"
            ></el-input>
          </div>
         <div class="div_input">
            <span>设备类别：</span>
            <el-select
              type="text"
              class="select_input"
              v-model="query.deviceClass"
            >
              <option label="库1" value="1"></option>
              <option label="库1" value="2"></option>
            </el-select>
          </div>
           <div class="div_input">
            <span>设备名称：</span>
            <el-select
              type="text"
              class="select_input"
              v-model="query.deviceNumber"
            >
              <option label="库1" value="1"></option>
              <option label="库1" value="2"></option>
            </el-select>
          </div>

           <div class="div_input">
            <span>规格型号：</span>
            <el-select
              type="text"
              class="select_input"
              v-model="query.model"
            >
              <option label="库1" value="1"></option>
              <option label="库1" value="2"></option>
            </el-select>
          </div>
          <el-button>查询</el-button>
          <el-button>新增器材</el-button>
      </div>

      <el-table
        border
        stripe
        :data="earlyWarningData"
        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
          prop="assetNumber"
          label="资产编号"
          align="center"
        >
        </el-table-column>
        <el-table-column prop="deviceNumber" label="设备编号" align="center">
        </el-table-column>
        <el-table-column prop="deviceClass" label="设备类别" align="center">
        </el-table-column>
        <el-table-column prop="deviceName" label="设备名称" align="center">
           
        </el-table-column>
         <el-table-column prop="manufacturer" label="生产厂家" align="center">
           
        </el-table-column>

          <el-table-column prop="arrivalTime" label="到库时间" align="center">
           
        </el-table-column>

            <el-table-column prop="management" 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(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="getList"
        />
    </div>
   </div>
  </div>
</template>
<script>
//引入分页
import Pagination from "@/components/Pagination"
export default {
    components:{Pagination},
  data() {
    return {
        query:{
            assetNumber:"",
            deviceClass:"",
            deviceNumber:"",
            model:"",
        },
                //分页
      total: 30,
      listLoading: true,
      listQuery: {
        page: 1,
        limit: 10,
        importance: undefined,
        title: undefined,
        type: undefined,
        sort: "+id",
      },
      // 列表数据
      earlyWarningData: [
        {
          assetNumber: "qdfg",
          deviceNumber: "1",
          deviceClass: "dfg",
          deviceName: "11122",
          manufacturer:"sfdefaf",
          arrivalTime:"dddd",
          management:"fffff",
        },

        {
          assetNumber: "qdfg",
          deviceNumber: "1",
          deviceClass: "dfg",
          deviceNumber: "11122",
          manufacturer:"sfdefaf",
          arrivalTime:"dddd",
          management:"fffff",
        },
        {
          assetNumber: "qdfg",
          deviceNumber: "1",
          deviceClass: "dfg",
          deviceNumber: "11122",
          manufacturer:"sfdefaf",
          arrivalTime:"dddd",
          management:"fffff",
        },
      ],
    }
  },
  methods: {
      getList(){},
    handleCurrentChange() {},
    change() {},
  },
}
</script>
<style lang="scss" scoped>
.top {
  height: 40px;
  line-height: 40px;
  border-bottom: 1px solid #ccc;
}
.container {
  padding: 10px;
  .header {
    height: 40px;
    line-height: 40px;
    display:flex;
    margin-bottom: 20px;
    .div_input {
        min-width: 300px;
        margin-right: 10px;
        .select_input {
          display: inline-block;
          width: 200px;
        }
    }
  }
}
</style>