import { postServiceOrderViewImages } from '@/services';
import { Button, Divider, Image, Modal } from 'antd';
import { useEffect, useState } from 'react';
export default ({ setVisible, onClose, orderRow }) => {
  const [images, setImages] = useState([]);
  const handleOk = () => {
    onClose();
    setVisible(false);
  };

  const handleCancel = () => {
    onClose();
    setVisible(false);
  };

  async function getImages() {
    const res = await postServiceOrderViewImages({
      data: { subId: orderRow.id },
    });
    const images = res.data;
    setImages(images);
  }
  useEffect(() => {
    getImages();
  }, []);

  return (
    <>
      <Modal
        title="收货凭证"
        open
        onOk={handleOk}
        onCancel={handleCancel}
        footer={[
          <Button key="back" onClick={handleCancel}>
            返回
          </Button>,
        ]}
      >
        <Image.PreviewGroup
          className="mr-10"
          preview={{
            onChange: (current, prev) =>
              console.log(`current index: ${current}, prev index: ${prev}`),
          }}
        >
          {images.map((url) => (
            <>
              <Image width={120} src={url} /> <Divider type="vertical" />
            </>
          ))}
        </Image.PreviewGroup>
      </Modal>
    </>
  );
};