import { ref, reactive } from 'vue'
import { DialogEnum } from '@/enums/pluginEnum'
import { getcomponentlist, deleteComponentData } from '@/api/demo/remote'
import { goDialog, httpErrorHandle } from '@/utils';
// 数据初始化
export const useDataListInit = () => {
  const loading = ref(true);
  const paginat = reactive({
    // 当前页数
    page: 1,
    // 每页值
    limit: 12,
    // 总数
    count: 10,
  });
  const list = ref([]);
  // const list = ref([
  //   {
  //     id: 'id_26gmicy1t4qo00',
  //     title: 'id_26gmicy1t4qo00',
  //     data: 'eNp9kUFLwzAUx7/KM5cqzBXR0+gGKgP1oKKCl1xG99ZlpklIXuag9Lv7krK5w9it7//7v/SXthP3zo23EcVEVKH2yhEEpOhm0qjWWU/QgccV9LDytoWCq4U00tTWBII2NDBN/LJ4Qq0tfFuvlxfFlTRVORzHB/FA2Dq9IOQJoFrfzLouL/d9VfKUU2VcJNhet3aJeioFcymgZFiVR/tiJCjw61eqGW+CNWzepX0pats6pdG/OVKsJ8UEMklswXa/LzkjH3G0z+s11j8n8k3YpUyKd48B/RalODBa+AZpwPPPV9zx8wGyfdTcPgM/MFgdk+NQe4hmydpHvWz7nL+/Ms1XmO8ITdhfKommZp/7UvA/eTxz9X/d2/Fd3pOmF/0fEx+nNQ==',
  //   },
  //   {
  //     id: 'id_5ljmju7p5h0000',
  //     title: '测试远程组件',
  //     data: 'eNp9kbFOwzAURX/F8hKQqlQIpipEAtQBBkDA6CVKXlKXxLZsJ0SK/AUVYzc+gAlYmPmb0M/AdtSSoermd+99V8d6Hb4QImxqwDMcqVRSoZECXYuYMFoJLjXqkIQcGZRLXqHARgPCCEs5UxpVqkDnzj8K+u/V5nO9+Xn7fV/166/+9SM4JiyaDqW2zg4aKlEmGuyEULQ4ibvOVxgTTe3k1Yw2MRrpbnY9o108wVpZgJwW4VJxZtk7t0twyitBS5B3QlMLSPAMecd5SVnylxuvaVnDZKunC0if9+hL1TqN4HsJCmQDBO88ncgC9GDPH2+hte+dWfGsLm36gPkAipe1YxxilzXLLPYo52mv/QUoK57UvNXA1PZTDtQljc8TbK9ydeDr/7in4ZnfI8xg8wcBeK7m',
  //   },
  //   {
  //     data: "eNp9UcFOwzAM/ZUol4IErSY4jW4SoB3gAAg45lJ1XpeRJlHsjqGq/46TsjEhtEOk2O/56T27l7fe59sO5FSWWAftSSBQ5+fK6ta7QKIXAVZiEKvgWpExNVNW2dpZJNFiI2YRP8sIkP6+7FzZshhlWZALgtabioArIcr1RNSmQpwpSZoMKDnv+yQ6DGWxnowsbX1HYnvZuiUYpjKupCgYLIsjvRLpy8RPnrT6OFs748KUDS5vlB2SmR+SvJCEHGKlm3yDznL+NKFk7VqvDYRnT5pDKjkVCYlYZYz7fEw9Ch1c7Pv1GuqPf/ob3MWeki8BEMKWEx4wqkIDNMKLtyfY8f8ActYu7uME+AroTBc9jrS7zi7Z9hEvuX1IV9S2ecfFjsDiPlQ0GplD4ivJl70/Ef3X7lV+neZ4o3L4Bi2Swjc=",
  //     id: "id_1yuhydwbpebk00",
  //     title: "id_1yuhydwbpebk00"
  //   }
  // ])

  // 数据请求
  const fetchList = async () => {
    loading.value = true;
    const res = await getcomponentlist({
      page: paginat.page,
      limit: paginat.limit,
    });
    if (res && res.items) {
      const { total } = res as any; // 这里的count与data平级，不在Response结构中
      paginat.count = total;
      list.value = res.items.map((e) => {
        const { id, componentName, componentData } = e;
        return {
          id: id,
          title: componentName,
          data: componentData
        };
      });
      setTimeout(() => {
        loading.value = false;
      }, 500);
      return;
    }
    httpErrorHandle();
  };

  // 修改页数
  const changePage = (_page: number) => {
    paginat.page = _page;
    fetchList();
  };

  // 修改大小
  const changeSize = (_size: number) => {
    paginat.limit = _size;
    fetchList();
  };
  
  // 删除
  const deleteHandle = (id:string) => {
    goDialog({
      type: DialogEnum.DELETE,
      promise: true,
      onPositiveCallback: () => deleteComponentData(id),
      promiseResCallback: (e: any) => {
        if(e){
          window.$message.success('删除成功')
          fetchList()
        }
      }
    })
  }

  // 立即请求
  fetchList();

  return {
    loading,
    paginat,
    list,
    fetchList,
    changeSize,
    changePage,
    deleteHandle,
  }
}
