<script setup name="checkProjectList">
import { h, onMounted, reactive, ref } from 'vue'
const
  searchForm = reactive({
    projectName: undefined
  }),
  tableListRef = ref(),
  total = ref(5),
  column = reactive([
    {
      label: '序号',
      type: 'index',
      width: '80'
    },
    {
      label: '项目名称',
      key: 'projectName',
      prop: 'projectName',
      minWidth: '150',
      showOverflowTooltip: true
    },
    {
      label: '申报单位',
      key: 'buildOrg',
      prop: 'buildOrg',
      minWidth: '80',
      showOverflowTooltip: true
    },
    {
      label: '项目类型',
      key: 'projectTypeName',
      prop: 'projectTypeName',
      width: '100'
    },
    {
      label: '预算年度',
      key: 'projectYear',
      prop: 'projectYear',
      width: '80'
    },
    {
      label: '自评得分',
      key: 'selfScore',
      prop: 'selfScore',
      width: '80',
      render: row => h('span', row.selfScore || '-')
    },
    {
      label: '复评得分',
      key: 'reviewScore',
      prop: 'reviewScore',
      width: '80',
      render: row => h('span', row.reviewScore || '-')
    },
    {
      label: '核查得分',
      key: 'checkScore',
      prop: 'checkScore',
      width: '80',
      render: row => h('span', row.reviewScore || '-')
    },
    {
      label: '核查时间',
      key: 'createdTime',
      prop: 'createdTime',
      width: '150',
      render: row => h('span', row.createdTime || '-')
    },
    {
      label: '操作',
      slot: 'action',
      width: '110',
      fixed: 'right'
    }
  ]),
  data = ref([]),
  getTableData = async (pageParams = tableListRef.value.pageParams) => {
    data.value = [{
      projectName: '应用目录质量提升服务项目',
      buildOrg: '大数据局',
      projectYear: 2023,
      selfScore: 90,
      projectType: 1
    },
    {
      projectName: '应用目录质量提升服务项目',
      buildOrg: '大数据局',
      projectYear: 2023,
      selfScore: 90,
      projectType: 1
    },
    {
      projectName: '电子政务项目全生命周期管理系统',
      buildOrg: '大数据局',
      projectYear: 2023,
      projectType: 2,
      selfScore: 89,
      reviewScore: 80,
      createdTime: '2022-08-12 11:42'
    },
    {
      projectName: '电子政务项目全生命周期管理系统',
      buildOrg: '大数据局',
      projectYear: 2023,
      projectType: 2,
      selfScore: 89,
      reviewScore: 80,
      checkScore: 88,
      createdTime: '2022-08-12 11:42'
    },
    {
      projectName: '电子政务项目全生命周期管理系统',
      buildOrg: '大数据局',
      projectYear: 2023,
      projectType: 2,
      selfScore: 89,
      reviewScore: 80,
      checkScore: 88,
      createdTime: '2022-08-12 11:42'
    }
    ]
  },
  search = () => {
    getTableData()
  },
  reset = () => {
    searchForm.name = undefined
    tableListRef.value.pageParams.pageNumber = 1
    tableListRef.value.pageParams.pageSize = 10
    getTableData()
  },
  activeName = ref('1')
onMounted(() => {
  getTableData()
})
</script>

<template>
  <el-card class="search mb-16">
    <el-form label-suffix=":" :model="searchForm" size="small">
      <el-row :gutter="16">
        <el-col :span="8">
          <el-form-item label="项目名称">
            <el-input
              v-model="searchForm.name"
              placeholder="请输入"
            />
          </el-form-item>
        </el-col>
        <el-col :span="16">
          <el-form-item class="btn">
            <el-button type="primary" @click="search">查询</el-button>
            <el-button @click="reset">重置</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </el-card>
  <el-card class="tab-card">
    <template #header>
      <el-tabs v-model="activeName">
        <el-tab-pane label="A组" name="1" />
        <el-tab-pane label="B组" name="2" />
        <el-tab-pane label="C组" name="3" />
      </el-tabs>
    </template>
    <table-list
      ref="tableListRef"
      :column="column"
      :data="data"
      :total="total"
      @get-table-data="getTableData"
    >
      <template #action>
        <a @click="$router.push({name:'finalGiveScore'})">打分</a>
        <a @click="$router.push({name:'finalScoreDetail'})">详情</a>
      </template>
    </table-list>
  </el-card>
</template>
