import { ref } from "vue";
import { ElMessageBox } from "element-plus";
import { message } from "@/utils/message";
import {
  queryRobotList,
  creaRobotData,
  deleteRobotData
} from "@/api/modules/backpack";
export function useData() {
  const loading = ref(true);
  const tableList = ref([]);
  const isShow = ref(false);
  const pagination = ref({
    total: 0,
    pageSize: 10,
    currentPage: 1,
    pageSizes: [10, 20, 50, 100, 500, 1000, 2000],
    background: true
  });
  const searchForm = ref({
    search_id: "",
    search_nickname: "",
    search_mobile: ""
  });
  const searchLabel = ref([
    { label: "名称", prop: "search_nickname", type: "input" },
    { label: "手机号", prop: "search_mobile", type: "input" },
  ]);
  const tableLabel = ref([
    {
      label: "ID",
      prop: "id"
    },
    {
      label: "头像",
      prop: "avatar",
      cellRenderer: ({ row }) => (
        <el-image
          fit="cover"
          preview-teleported={true}
          src={row.avatar}
          preview-src-list={Array.of(row.avatar)}
          class="w-[24px] h-[24px] rounded-full align-middle"
        />
      ),
    },
    {
      label: "昵称",
      prop: "nickname"
    },
    {
      label: "生成时间",
      prop: "createtime"
    },
    // {
    //   label: "发布人员",
    //   prop: "nickname"
    // },
    {
      label: "手机号",
      prop: "mobile"
    },
    {
      label: "操作",
      fixed: "right",
      slot: "operation"
    }
  ]);
  const onSearch = async (formData) => {
    loading.value = true;
    searchForm.value = { ...formData }
    const { data, code } = await queryRobotList({
      ...formData,
      page: pagination.value.currentPage,
      page_limit: pagination.value.pageSize,

    });
    if (code) {
      tableList.value = data.lists;
      pagination.value.total = data.count;
      pagination.value.currentPage = data.page;
    }
    loading.value = false;
  };
  const handleSizeChange = (val: number) => {
    pagination.value.pageSize = val;
    onSearch(searchForm.value);
  };
  const handleCurrentChange = (val: number) => {
    pagination.value.currentPage = val;
    onSearch(searchForm.value);
  };
  const handleDelete = async rowData => {
    const { code } = await deleteRobotData({ user_id: rowData.id });
    if (code) {
      message(`您删除了名称为${rowData.nickname}的这条数据`, {
        type: "success"
      });
      onSearch(searchForm.value);
    }
  };
  const generateData = async () => {
    ElMessageBox.confirm(
      `该操作将自动生成20条机器人数据，是否继续？`,
      "提示",
      {
        type: "warning"
      }
    )
      .then(async () => {
        const { code, msg } = await creaRobotData()
        if (code) {
          message("操作成功", { type: "success" });
          onSearch(searchForm.value);
        } else {
          message(msg, { type: "error" });
        }
      })
      .catch(() => { });
  }
  return {
    searchForm,
    searchLabel,
    onSearch,
    isShow,
    tableList,
    tableLabel,
    pagination,
    handleSizeChange,
    handleCurrentChange,
    loading,
    generateData,
    handleDelete
  };
}