@fle-ui/plus-goods-detail-drawer/es/components/GoodsDetailSkeleton/index.js

@fle-ui/plus-goods-detail-drawer

import "antd/es/row/style";
import _Row from "antd/es/row";
import "antd/es/col/style";
import _Col from "antd/es/col";
import "antd/es/divider/style";
import _Divider from "antd/es/divider";
import "antd/es/space/style";
import _Space from "antd/es/space";
import "antd/es/skeleton/style";
import _Skeleton from "antd/es/skeleton";
import React from 'react';
var GoodsDetailSkeleton = function GoodsDetailSkeleton(_ref) {
  var type = _ref.type;
  return /*#__PURE__*/React.createElement("div", {
    className: "goods-skeleton"
  }, (type === 'audit' || type === 'readAudit') && /*#__PURE__*/React.createElement("div", {
    style: {
      margin: '-24px -24px 0 -24px'
    }
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    block: true,
    active: true,
    size: "small",
    style: {
      height: 100,
      borderRadius: 0
    }
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      marginTop: 24
    }
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      height: 24
    }
  })), /*#__PURE__*/React.createElement("div", {
    className: "goods-detail-skeleton-section"
  }, /*#__PURE__*/React.createElement(_Space, {
    direction: "vertical",
    size: 16
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 22
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 200,
      height: 32
    }
  }))), /*#__PURE__*/React.createElement(_Divider, null), /*#__PURE__*/React.createElement(_Space, {
    direction: "vertical",
    size: 16,
    className: "goods-detail-skeleton-section"
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 22
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    align: "start",
    size: 16
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 90,
      height: 90
    }
  })), /*#__PURE__*/React.createElement(_Space, {
    align: "start",
    size: 16,
    wrap: true
  }, Array.from({
    length: 5
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      key: index,
      active: true,
      size: "small",
      style: {
        width: 90,
        height: 90
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    block: true,
    active: true,
    size: "small",
    style: {
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    block: true,
    active: true,
    size: "small",
    style: {
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    block: true,
    active: true,
    size: "small",
    style: {
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Row, {
    gutter: [16, 16]
  }, Array.from({
    length: 16
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Col, {
      lg: 6,
      key: index
    }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
      block: true,
      active: true,
      key: index,
      size: "small",
      style: {
        height: 16
      }
    }));
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      marginTop: 20
    }
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 16,
      marginBottom: 12,
      paddingLeft: 12
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      width: '100%',
      height: 200
    }
  }))), /*#__PURE__*/React.createElement(_Divider, null), /*#__PURE__*/React.createElement(_Space, {
    direction: "vertical",
    size: 16,
    className: "goods-detail-skeleton-section"
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 22
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 200,
      height: 32
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 120,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    size: 16,
    wrap: true
  }, Array.from({
    length: 6
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      key: index,
      active: true,
      size: "small",
      style: {
        width: 140,
        height: 16
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 120,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    size: 16,
    wrap: true
  }, Array.from({
    length: 12
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      key: index,
      active: true,
      size: "small",
      style: {
        width: 140,
        height: 16
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 120,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    size: 16,
    wrap: true
  }, Array.from({
    length: 4
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      key: index,
      active: true,
      size: "small",
      style: {
        width: 140,
        height: 16
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      width: 80,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    size: 16,
    wrap: true
  }, Array.from({
    length: 6
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      key: index,
      active: true,
      size: "small",
      style: {
        width: 140,
        height: 16
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 100,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    size: 16,
    wrap: true
  }, Array.from({
    length: 2
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      key: index,
      active: true,
      size: "small",
      style: {
        width: 140,
        height: 16
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 100,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 200,
      height: 32
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      width: '100%',
      height: 120
    }
  })), /*#__PURE__*/React.createElement(_Divider, null), /*#__PURE__*/React.createElement(_Space, {
    direction: "vertical",
    size: 16,
    className: "goods-detail-skeleton-section"
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 22
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 120,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      width: '100%',
      height: 80
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 120,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      width: '100%',
      height: 80
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 120,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    block: true,
    size: "small",
    style: {
      width: '100%',
      height: 80
    }
  })), /*#__PURE__*/React.createElement(_Divider, null), /*#__PURE__*/React.createElement(_Space, {
    direction: "vertical",
    size: 16,
    className: "goods-detail-skeleton-section"
  }, /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 22
    }
  }), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 16
    }
  }), /*#__PURE__*/React.createElement(_Space, {
    direction: "vertical",
    size: 16
  }, Array.from({
    length: 4
  }).map(function (_, index) {
    return /*#__PURE__*/React.createElement(_Skeleton.Input, {
      active: true,
      key: index,
      size: "small",
      style: {
        width: 400,
        height: 20
      }
    });
  })), /*#__PURE__*/React.createElement(_Skeleton.Input, {
    active: true,
    size: "small",
    style: {
      width: 80,
      height: 16
    }
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      backgroundColor: '#fafafa',
      border: '1px solid #f0f0f0',
      borderRadius: 4,
      padding: 16,
      minHeight: 200
    }
  }, /*#__PURE__*/React.createElement(_Skeleton, {
    active: true,
    paragraph: {
      rows: 6
    }
  }))));
};
export default GoodsDetailSkeleton;