<template>
  <div class="">
    <table class="filter-table-home">
      <colgroup>
        <col style="width: auto" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
        <col style="" />
      </colgroup>
      <thead>
        <tr class="firstHead">
          <th colspan="5">基本工资</th>
          <th colspan="3">基础性绩效</th>
          <th colspan="1">奖励性绩效</th>
          <th colspan="1" rowspan="2">绩效考核奖</th>
          <th colspan="1" rowspan="2">上年度绩效工资</th>
          <th colspan="1" rowspan="2">上年度绩效考核奖</th>
          <th colspan="1" rowspan="2">X项目小计</th>
          <th colspan="1" rowspan="2">上年度X项目小计</th>
          <th colspan="1" rowspan="2">房贴</th>
          <th colspan="1" rowspan="2">德育导师</th>
          <th colspan="1" rowspan="2">临时补发</th>
          <th colspan="2" rowspan="2">应发工资</th>
        </tr>
        <tr class="twoHead">
          <th colspan="2">岗位工资</th>
          <th>薪级工资</th>
          <th>临时性补贴</th>
          <th>小计</th>
          <th>岗位津贴</th>
          <th>生活补贴</th>
          <th>小计</th>
          <th>院聘</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in arr1" :key="item">
          <td colspan="2" align="center">{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td>{{ item.one }}</td>
          <td colspan="2" align="center">16</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script lang="ts" setup>
let arr1 = new Array(100);
for (let i = 0; i < arr1.length; i++) {
  arr1[i] = {
    one: '1',
    two: '2',
    three: '3',
    four: '4',
    five: '5',
    sex: '6',
    seven: '7',
  };
}
</script>

<style lang="less">
.filter-table-home {
  border: 1px solid #f5f5f5;
  border-width: 1px 0px 0px 1px;
  border-collapse: collapse;
  width: 100%;
  color: #909399;
  thead {
    position: sticky;
    top: 0;
    background: white;
    .firstHead {
    }
  }
}
td {
  border: 1px solid #f5f5f5;
  border-width: 0px 1px 1px 0px;
  padding: 10px;
  height: 50px;
  text-align: center;
  font-size: 12px;
  color: #606266;
}
th {
  border: 1px solid #f5f5f5;
  border-width: 0px 1px 1px 0px;
}
</style>
