<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { DbHst } from '#/components/db-hst'

const hstRef = ref<any>(null)

const columns = ref<any[]>([
  { type: 'text', data: 'code', title: '编码' },
  { type: 'text', data: 'name', title: '措施项目名称' },
  { type: 'text', data: 'unit', title: '单位' },
  { type: 'text', data: 'amount', title: '金额' },
])

const settings = {
  columns: columns.value,
}

const mockData = Array.from({ length: 20 }, (_, index) => ({
  code: `MSR${String(index + 1).padStart(6, '0')}`,
  name: `措施项目${index + 1}`,
  unit: '项',
  amount: `${(index + 1) * 1000}`,
}))

onMounted(() => {
  setTimeout(() => {
    if (hstRef.value) {
      hstRef.value.loadData(mockData)
    }
  }, 100)
})
</script>

<template>
  <div class="h-full">
    <DbHst ref="hstRef" :settings="settings" />
  </div>
</template>
