import * as React from "react";
import { useState, useMemo, useRef } from "react";
import DrawerPro from "@/components/DrawerPro";
import AutoTable from "@/components/AutoTable";
import PremButton from "@/components/PremButton";
import getcolumns from "./columns";
import { useRequest } from "ahooks";
import { doFetch, getFetch } from "@/utils/doFetch";
import { ExportOutlined, ImportOutlined } from "@ant-design/icons";
import dayjs from "dayjs";
import { Modal, message } from 'antd';

function Port(props) {
  const actionRef = useRef(),
    formRef = useRef(),
    formRefs = useRef();
  const [drawer, setdrawer] = useState({
    open: false,
  });
  const [selectedRowKeys, onChange] = useState([]);
  const pathconfig = useMemo(() => {
    let pathconf = getcolumns(setdrawer)?.pathconfig ?? {};
    return pathconf;
  }, []);
  const { run, loading } = useRequest(doFetch, {
    manual: true,
    onSuccess: (res, params) => {
      if (res?.code == "0000") {
        actionRef?.current?.reload();
        setdrawer((s) => ({
          ...s,
          open: false,
        }));
      }
    },
  });

  const detail = (text, row, _, action) => {
    return (
      <PremButton
        btn={{
          size: "small",
          type: "text",
          onClick: () => {
            setdrawer((s) => ({
              ...s,
              open: true,
              item: row,
              title: "详情",
              val: "detail",
              title: "详细信息",
            }));
          },
        }}
      >
        详情
      </PremButton>
    );
  };

  const edit = (text, row, _, action) => {
    return (
      <PremButton
        btn={{
          size: "small",
          type: "link",
          onClick: () => {
            setdrawer((s) => ({
              ...s,
              open: true,
              item: row,
              title: "编辑",
              val: "edit",
            }));
          },
        }}
      >
        编辑
      </PremButton>
    );
  };

  const remove = (text, row, _, action) => {
    return (
      <PremButton
        pop={{
          title: "是否删除?",
          okText: "确认",
          cancelText: "取消",
          placement: "bottom",
          onConfirm: () => {
            run({
              url: pathconfig?.delete + "/" + row?.id,
              params: {},
              method: "DELETE",
            });
          },
        }}
        btn={{
          size: "small",
          type: "text",
          danger: true,
        }}
      >
        删除
      </PremButton>
    );
  };

  const columns = useMemo(() => {
    let defcolumn = getcolumns(setdrawer)?.columns;
    return defcolumn.concat({
      title: "操作",
      valueType: "option",
      width: 150,
      render: (text, row, _, action) => [
        pathconfig?.enabledetail && detail(text, row, _, action),
        pathconfig?.enableedit && edit(text, row, _, action),
        pathconfig?.enabledelete && remove(text, row, _, action),
      ],
    });
  }, []);

  return (
    <div style={{ position: "relative", height: "100%", overflowX: "hidden" }}>
      <AutoTable
        pagetitle="退货单"
        columns={columns}
        actionRef={actionRef}
        formRef={formRefs}
        path={pathconfig?.list || "/ngic-auth/sysUser/query/page"}
        pageextra={"add,import,export"}
        resizeable={true}
        rowSelection={{
          selectedRowKeys,
          onChange
        }}
        tableAlertOptionRender={() => {
          return (
            <div size={16}>
              <a style={{color:"#ff4800"}} onClick={()=>{
                 Modal.confirm({
                  title:"是否批量删除？",
                  content:"删了就没了",
                  onOk:()=>{
                    doFetch({url:"/webtool/v1/purchasemutipledestroy",params:{ids:selectedRowKeys}}).then(res=>{
                      if(res?.code === 0){
                        message.success("删除成功！");
                        actionRef?.current?.reload();
                        onChange([]);
                      }
                    })
                  }
                 }) 


              }}>批量删除</a>
            </div>
          );
        }}
        addconfig={{
          // access: 'sysDepartment_save',
          btn: {
            disabled: false,
            onClick: () => {
              setdrawer((s) => ({
                ...s,
                open: true,
                item: null,
                title: "新增",
                val: "add",
              }));
            },
          },
        }}
        importconfig={{
          btn: {
            disabled: false,
            type: "primary",
            icon: <ImportOutlined />,
            onClick: () => {
              setdrawer((s) => ({
                ...s,
                open: true,
                item: null,
                title: "导入",
                val: "import",
                importurl: "/webtool/v1/purchasebulkCreate",
                refresh: () => {
                  actionRef?.current?.reload();
                },
              }));
            },
          },
        }}
        exportconfig={{
          btn: {
            disabled: false,
            type: "primary",
            icon: <ExportOutlined />,
            ghost: true,
            onClick: () => {
              let search = formRefs?.current?.getFieldsValue();

              if (search?.in_store_date) {
                search.in_store_date = search.in_store_date
                  ?.map((it) => dayjs(it).format("YYYY-MM-DD"))
                  .toString();
              }

              if (search?.back_date) {
                search.back_date = search.back_date
                  ?.map((it) => dayjs(it).format("YYYY-MM-DD"))
                  .toString();
              }

              getFetch({
                url: "/webtool/v1/purchaseexport",
                params: {
                  ...search,
                  filename: `退货单${dayjs().format("YYYY-MM-DD HH:mm:ss")}`,
                },
              });
            },
          },
        }}
      />

      <DrawerPro
        fields={columns}
        params={{ id: drawer?.item?.id }}
        formRef={formRef}
        placement="right"
        detailpath={pathconfig?.detail || null}
        detailData={drawer?.item}
        defaultFormValue={drawer?.item}
        onClose={() => {
          setdrawer((s) => ({
            ...s,
            open: false,
          }));
        }}
        {...drawer}
        onFinish={(vals) => {
          if (drawer?.val == "add") {
            run({ url: pathconfig?.add, params: { ...vals } });
          } else if (drawer?.val == "edit") {
            run({
              url: pathconfig?.edit + "/" + drawer?.item?.id,
              params: { ...vals },
              method: "PUT",
            });
          }
        }}
      />
    </div>
  );
}

export default Port;