<template>
  <el-row>
    <el-col :span="24" class="main animate__animated animate__backInRight">
      <el-col :span="24" class="one">
        <cTable :fields="fields" :opera="opera" :list="list" :total="total" @query="search" @toSelect="toSelect" @edit="toEdit" @del="toDel">
          <template #status="{ row, item }">{{ row[item.model] }}</template>
        </cTable>
      </el-col>
    </el-col>
  </el-row>
</template>

<script setup lang="ts">
// 组件
import cTable from './c-table.vue'
// 基础
import type { Ref } from 'vue'
// reactive, ref, onMounted
import { onMounted, ref, getCurrentInstance } from 'vue'
// 接口
import { YearreportStore } from '@common/src/stores/studio/studios/yearreport'
import type { IQueryResult } from '@/util/types.util'
const testAxios = YearreportStore()
const { proxy } = getCurrentInstance() as any
// 分页数据
const skip = 0
let limit: number = proxy.$limit
const list: Ref<any[]> = ref([])
const total: Ref<number> = ref(0)
const fields: Ref<any[]> = ref([
  { label: '序号', options: { type: 'index', width: '80' } },
  { label: '依托单位名称', model: 'company', isSearch: true },
  { label: '姓名', model: 'name', isSearch: true },
  { label: '状态', model: 'status', isSearch: true }
])
const opera: Ref<any[]> = ref([
  { label: '修改', method: 'edit' },
  { label: '删除', method: 'del', confirm: true, type: 'danger', display: (i) => i.status == '1' }
])
// 请求
onMounted(async () => {
  await search({ skip, limit })
})
const search = async (e: { skip: number; limit: number }) => {
  const info = { skip: e.skip, limit: e.limit }
  const res: IQueryResult = await testAxios.query(info)
  if (res.errcode == '0') {
    list.value = res.data as any[]
    total.value = res.total
  }
}
// 多选
const toSelect = (val: Array<[]>) => {
  console.log('多选')
  console.log(val)
}

const toEdit = (data) => {
  console.log(data._id)
}
const toDel = (data) => {
  console.log(data._id)
}
</script>
<style scoped lang="less">
.main {
  padding: 4%;
}
</style>
