index.jsx

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 } from '@/utils/doFetch';
import InitForm from '@/components/InitForm';
import { message, Divider } from 'antd';

function Requisition(props) {
  const actionRef = useRef(),
    formRef = useRef();
  const [drawer, setdrawer] = useState({
      open: false,
    }),
    [activeTabKey, setactiveTabKey] = useState('1');

  const { run, loading } = useRequest(doFetch, {
    manual: true,
    onSuccess: (res, params) => {
      if (res?.code == '0000') {
        message.success('操作成功');
        actionRef?.current?.reload();
        setdrawer((s) => ({
          ...s,
          open: false,
        }));
      }
    },
  });

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

  const edit = (text, row, _, action) => {
    return (
      <PremButton
        btn={{
          size: 'small',
          disabled: row.status == 2,
          onClick: () => {
            setdrawer((s) => ({
              ...s,
              open: true,
              item: row,
              title: '审批',
              val: 'detailaddon',
              addon: (
                <>
                  <InitForm
                    style={{ background: '#f0f0f0', padding: 12, borderTop: '#1890ff solid 1px' }}
                    fields={[
                      {
                        title: '审批结果',
                        dataIndex: 'approvalResult',
                        key: 'approvalResult',
                        formItemProps: { rules: [{ required: true, message: '此项为必填项' }] },
                        valueType: 'radio',
                        options: [
                          { label: '通过', value: '1' },
                          { label: '不通过', value: '2' },
                        ],
                      },
                      {
                        title: '审批备注',
                        dataIndex: 'approvalRemark',
                        key: 'approvalRemark',
                        valueType: 'textarea',
                        colProps: { span: 24 },
                      },
                    ]}
                    onFinish={(vals) => {
                      run({
                        url: '/sparepart/spareApplyTask/approval',
                        params: { ...vals, id: row?.id },
                      });
                    }}
                  />
                </>
              ),
            }));
          },
        }}
      >
        审批
      </PremButton>
    );
  };

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

  const columns = useMemo(() => {
    let defcolumn = getcolumns(drawer?.type).filter((it) => it.key == activeTabKey)[0]?.columns;
    let defpath =
      getcolumns(drawer?.type).filter((it) => it.key == activeTabKey)[0]?.pathconfig ?? {};
    return defcolumn.concat({
      title: '操作',
      valueType: 'option',
      width: 150,
      render: (text, row, _, action) => [
        defpath?.enabledetail && detail(text, row, _, action),
        defpath?.enableedit && edit(text, row, _, action),
        defpath?.enabledelete && remove(text, row, _, action),
      ],
    });
  }, [activeTabKey, drawer?.type]);

  const pathconfig = useMemo(() => {
    let defpath = getcolumns(setdrawer).filter((it) => it.key == activeTabKey)[0]?.pathconfig ?? {};
    return defpath;
  }, [activeTabKey]);

  return (
    <div style={{ position: 'relative' }}>
      <AutoTable
        pagetitle={<h3 className="page-title">备件领用</h3>}
        columns={columns}
        path={pathconfig?.list || '/ngic-auth/sysUser/query/page'}
        actionRef={actionRef}
        pageextra={pathconfig?.enableadd ? 'add' : null}
        resizeable={false}
        addconfig={{
          // access: 'sysDepartment_save',
          btn: {
            disabled: false,
            onClick: async () => {
              let res = await doFetch({
                url: '/base/pmBaseBusinessData/querySpareStockType',
                params: {},
              });
              let type = res?.data?.data?.type;
              setdrawer((s) => ({
                ...s,
                open: true,
                item: null,
                title: '新增',
                val: 'add',
                type,
              }));
            },
          },
        }}
        tabList={getcolumns()}
        activeTabKey={activeTabKey}
        onTabChange={(key) => {
          setactiveTabKey(key);
        }}
      />

      <DrawerPro
        fields={columns}
        detailpath={pathconfig?.detail || null}
        defaultFormValue={drawer?.item}
        params={{ id: drawer?.item?.id }}
        formRef={formRef}
        placement="right"
        onClose={() => {
          setdrawer((s) => ({
            ...s,
            open: false,
          }));
        }}
        {...drawer}
        onFinish={(vals) => {
          const detailsList = vals?.detailsList?.map?.((it, i) => {
            return {
              spareStockId: it?.id,
              operateNum: it?.operateNum,
            };
          });
          if (drawer?.val == 'add') {
            run({ url: pathconfig?.add || '/add', params: { ...vals, detailsList } });
          } else if (drawer?.val == 'edit') {
            run({
              url: pathconfig?.edit || '/edit',
              params: { ...vals, id: drawer?.item?.id, detailsList },
            });
          }
        }}
      >
        {drawer?.addon}
      </DrawerPro>
    </div>
  );
}

export default Requisition;