<template>
  <div class="d-flex flex-column">
    <v-banner single-line style="color:#0D47A1">
      重点业务进展情况
    </v-banner>
    <v-simple-table class="box" dense fixed-header height="100%" style="overflow: auto;">
      <template v-slot:default>
        <thead>
          <tr>
            <th class="text-left" style="background-color: #eee;">
              信息
            </th>
            <th class="text-left" style="background-color: #eee;">
              进度
            </th>
          </tr>
        </thead>
        <tbody>
          <tr
            v-for="item in desserts"
            :key="item.name"
          >
            <td>{{ item.name }}</td>
            <td>{{ item.schedule }}</td>
          </tr>
        </tbody>
      </template>
    </v-simple-table>
  </div>
</template>

<script>
export default {
  name: 'list-package',
  data () {
    return {
      desserts: [
        {
          name: '廉江引水工程',
          schedule: '项目立项阶段'
        },
        {
          name: '巴斯夫一体化基地',
          schedule: '投产试运行'
        },
        {
          name: '中科炼化一体化项目',
          schedule: '投产运行'
        },
        {
          name: '雷州150MW农光互补项目',
          schedule: '1千万补贴款已发放'
        },
        {
          name: '合浦只湛江铁路',
          schedule: ' 已经完成环境保护测评'
        }
      ]
    }
  },
  methods: {
    details () {}
  }
}
</script>

<style lang="scss" scoped>
.box {
  border-color: #CCC;
  border-style: solid;
  border-width: 0 1px 1px 1px;
  // border: 1px solid #CCC;
}
.footer {
  cursor: pointer;
}
</style>
