<template>
  <div style="height: 75vh; margin: 0px; background-color: #fff">
    <vxe-toolbar>
      <template #buttons>
        <div style="width: 300px; padding: 0px 10px">
          <span>项目列表</span>
          <a-button type="link" @click="iniData(1)">刷新</a-button>
        </div>
      </template>
    </vxe-toolbar>
    <vxe-table
      keep-source
      ref="refTable"
      size="small"
      height="auto"
      auto-resize
      :show-header="true"
      :data="dataList"
      :row-config="{ isCurrent: true, isHover: true, useKey: true }"
      :column-config="{ resizable: true, useKey: true }"
      :scroll-y="{ enabled: true, gt: 50 }"
      :radio-config="{ labelField: 'name', highlight: true }"
      :loading="loading"
    >
      <vxe-column type="seq" width="50" />
      <vxe-column field="name" width="30%" sortable type="html" title="项目名称" />
      <vxe-column field="des" sortable type="html" title="描述" />
      <vxe-column field="id" title="" :visible="false" />
      <vxe-column title="操作" fixed="right" width="10%">
        <template #default="{ row }">
          <vxe-button mode="text" status="primary" size="small" @click="rowChangeEvent(row)">
            {{ optName }}
          </vxe-button>
        </template>
      </vxe-column>
    </vxe-table>
  </div>
</template>

<script setup lang="ts">
  import { ref, computed } from 'vue';
  import { defHttp } from '/@/utils/http/axios';
  import { useUserStore } from '/@/store/modules/user';
  import { getUserTokey } from '/@/utils/flow';

  const listAll = '/audit/auditProject/listAll';
  const refTable = ref();
  const dataList = ref([]);
  const optName = ref();

  const emit = defineEmits(['callback']);
  const loading = ref(false);
   

  async function iniData(tp) {
    optName.value = computed(() => (tp == 1 ? '内容管理' : tp == 2 ? '任务分配' : tp == 3 ? '填报' : '报告管理'));
    loading.value = true;
    let UserTokey =  await getUserTokey();
    dataList.value = await defHttp.get({ url: listAll, params: {token:UserTokey} });
    loading.value = false;
  }

  function rowChangeEvent(row) {
    emit('callback', row);
  }

  defineExpose({
    iniData,
  });

  
</script>
