<template>
  <div>
    <fvSearchForm :searchConfig="searchConfig" @search="search"></fvSearchForm>
    <fvTable  ref="tableIns" :tableConfig="tableConfig">
      <template #empty>
        <el-empty description="暂无数据"/>
      </template>
    </fvTable>
  </div>
</template>

<script setup lang="jsx">
const route = useRoute()
const searchConfig = reactive([
  {
    label: '项目名称',
    prop: 'projectName',
    component: 'el-input',
    props: {
      placeholder: '请输入项目名称查询',
      clearable: true,
      filterable: true,
      checkStrictly: true
    }
  },
  {
    label: '姓名',
    prop: 'researchPersonnel',
    component: 'el-input',
    props: {
      placeholder: '请输入姓名查询',
      clearable: true,
      filterable: true,
      checkStrictly: true
    }
  },
  // {
  //   label: '起始时间',
  //   prop: 'time',
  //   component: 'el-date-picker',
  //   props: {
  //     placeholder: '请选择起始时间',
  //     clearable: true,
  //   },
  //   colProps: {}
  // },
])
const tableConfig = reactive({
  columns: [
    {
      prop: 'projectName',
      label: '项目名称',
      align: 'center'
    },
    {
      prop: 'researchPersonnel',
      label: '研发人员',
      align: 'center'
    },
    {
      prop: 'wagesPayable',
      label: '应发工资',
      align: 'center'
    },
    {
      prop: 'performance',
      label: '绩效',
      align: 'center'
    },
    {
      prop: 'reserveFund',
      label: '公积金',
      align: 'center'
    },
    {
      prop: 'socialSecurity',
      label: '社保',
      align: 'center'
    },
    {
      prop: 'annuity',
      label: '年金',
      align: 'center'
    },
    {
      prop: 'workday',
      label: '工作日(天)',
      align: 'center'
    },
    {
      prop: 'researchDuration',
      label: '研发时长(天)',
      align: 'center'
    },
  ],
  api:'/workflow/mosr/cost/allocation/usr',
  params:{
    allocationId:route.query.id
  }
})
const tableIns = ref()
const search = (val) => {
  tableConfig.params = {
    allocationId:route.query.id,
    ...val
  }
  tableIns.value.refresh()
}
</script>

<style scoped>
:deep(.el-table--fit ){
  width: 100%;
  height: 400px!important;
}
</style>
