<template>
  <div class="p-0">

    <BasicTable @register="registerTable" > 
    <!--操作栏-->
    <template #action="{ record }">
      <TableAction :actions="getTableAction(record)" />
    </template>
  </BasicTable>
  <!-- 表单区域 -->
    <FlowRunlistModal @register="registerModal" @success="handleSuccess"></FlowRunlistModal>
  </div>
</template>

<script setup lang="ts">
import { ref, computed } from 'vue';
import { defHttp } from '/@/utils/http/axios';
import { BasicTable, useTable, TableAction, BasicColumn, ActionItem, EditRecordRow } from '/@/components/Table';

import { useTabs } from '/@/hooks/web/useTabs';
import {useModal} from '/@/components/Modal';
import FlowRunlistModal from './components/FlowRunlistModal.vue'

import { useListPage } from '/@/hooks/system/useListPage';
import { useUserStoreWithOut } from '/@/store/modules/user';
import { useRouter } from 'vue-router';

 //注册model
const [registerModal, {openModal}] = useModal();

const router = useRouter();
const user = useUserStoreWithOut();
const { closeCurrent, refreshPage, setTitle } = useTabs();

 function getQueryParam(paramName) {
    const urlParams = new URLSearchParams(window.location.search);
    return urlParams.get(paramName);
  }

const listAll = '/flow/flowRunlist/list';

  const refTable = ref();
  const dataList = ref([]);

let queryParamSta = getQueryParam('sta');
console.log('queryParamSta ',queryParamSta);
if (queryParamSta==null){
  queryParamSta=0;
}

  //定义表格列
  const columns: BasicColumn[] = [
    {
    title: '流程',
    align: "center",
    dataIndex: 'flowname',
    width: 300,
  },
  {
    title: '标题',
    align: "center",
    dataIndex: 'title',
    width: 300,
  },
  {
    title: '发起人',
    align: "center",
    dataIndex: 'startername',
    width: 100,
  },
  

   {
    title: '停留节点',
    align: "center",
    dataIndex: 'nodename'
  },
 {
    title: '发起日期',
    align: "center",
    dataIndex: 'rdt'
  },
  {
    title: '当前处理人',
    align: "center",
    dataIndex: 'todoemps'
  },
  {
    title: '发起人部门',
    align: "center",
    dataIndex: 'deptname',
    width: 100,
  },


  ];

    //ajax请求api接口
  const demoListApi = (params) => {
    return defHttp.get({ url: listAll, params: {token: user.getJflowToken,sta:queryParamSta} });
  };

    // 列表页面公共参数、方法
  const { tableContext } = useListPage({
    tableProps: {
      api: demoListApi,
      columns: columns,
      actionColumn: {
        width: 120,
      },
      useSearchForm:false,
      pagination:false,
    }, //tableProps


  }); //useListPage

   //注册table数据
  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext


/**
    * 成功回调
    */
  function handleSuccess() {
      (selectedRowKeys.value = []) && reload();
   }

   /**
   * 操作栏
   */
  function getTableAction(record): ActionItem[] {
    return [
      {
        label: '催办',
        onClick: handleEdit.bind(null, record),
      },
    ];
  }



  /**
    * 编辑事件
    */
  function handleEdit(record: Recordable) {
     openModal(true, {
       record,
       isUpdate: true,
       showFooter: true,
     });
   }

/**
  function handleEdit(record) {
    //console.log(record);

    router.push({path: '/workflow/base/cc/MyFlow',query:{
      WorkID:record.workid,MyPK:record.mypk,FK_Flow:record.fkFlow,FK_Node:record.nodeidwork,FID:record.fid,Sta:record.sta,Rec:record.recempname,NodeName:record.nodename
    }})
  }
  */


  







  

</script>

