@51yzone/pc-components/es/login/code-img.js

An enterprise-class UI design language and React-based implementation

import "antd/es/button/style";
import _Button from "antd/es/button";
import "antd/es/input/style";
import _Input from "antd/es/input";
import "antd/es/col/style";
import _Col from "antd/es/col";
import "antd/es/row/style";
import _Row from "antd/es/row";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";

/**
 * 关键字：图片验证码
 * 新增人：徐友万
 */
import React, { useState, useEffect } from 'react';
import { MailOutlined } from '@ant-design/icons';

var CodeImg = function CodeImg(props) {
  var value = props.value,
      codeImgUrl = props.codeImgUrl,
      size = props.size,
      prefixIconVisible = props.prefixIconVisible,
      prefixCls = props.prefixCls,
      onChange = props.onChange;

  var _useState = useState(codeImgUrl),
      _useState2 = _slicedToArray(_useState, 2),
      url = _useState2[0],
      setUrl = _useState2[1];

  var handleRefreshImg = function handleRefreshImg() {
    setUrl("".concat(codeImgUrl, "?").concat(new Date().getTime()));
  };

  useEffect(function () {
    setUrl(codeImgUrl);
  }, [codeImgUrl]);
  return /*#__PURE__*/React.createElement(_Row, {
    gutter: 8
  }, /*#__PURE__*/React.createElement(_Col, {
    span: 16
  }, /*#__PURE__*/React.createElement(_Input, {
    value: value,
    onChange: onChange,
    size: size,
    placeholder: "\u9A8C\u8BC1\u7801",
    prefix: prefixIconVisible && /*#__PURE__*/React.createElement(MailOutlined, {
      className: "".concat(prefixCls, "__icon-outlined")
    })
  })), /*#__PURE__*/React.createElement(_Col, {
    span: 8
  }, /*#__PURE__*/React.createElement(_Button, {
    className: "".concat(prefixCls, "__code-button ").concat(prefixCls, "__code-button-").concat(size),
    onClick: handleRefreshImg,
    size: size,
    block: true
  }, /*#__PURE__*/React.createElement("img", {
    className: "".concat(prefixCls, "__code-img"),
    alt: "\u70B9\u51FB\u5237\u65B0",
    src: url
  }))));
};

CodeImg.defaultProps = {
  value: '',
  codeImgUrl: '',
  size: 'large',
  prefixIconVisible: true,
  prefixCls: 'yz-login'
};
export default CodeImg;