index.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  10. var _style = _interopRequireDefault(require("./style"));
  11. var _LocaleReceiver = require("../locale/LocaleReceiver");
  12. var _type = require("../_util/type");
  13. var _spin = _interopRequireDefault(require("../spin"));
  14. var _button = _interopRequireDefault(require("../button"));
  15. var _iconsVue = require("@ant-design/icons-vue/lib/icons");
  16. var _internal = require("../theme/internal");
  17. var _QRCode = require("./QRCode");
  18. var _warning = _interopRequireDefault(require("../_util/warning"));
  19. var _interface = require("./interface");
  20. const QRCode = (0, _vue.defineComponent)({
  21. name: 'AQrcode',
  22. inheritAttrs: false,
  23. props: (0, _interface.qrcodeProps)(),
  24. emits: ['refresh'],
  25. setup(props, _ref) {
  26. let {
  27. emit,
  28. attrs,
  29. expose
  30. } = _ref;
  31. if (process.env.NODE_ENV !== 'production') {
  32. (0, _warning.default)(!(props.icon && props.errorLevel === 'L'), 'QRCode', 'ErrorLevel `L` is not recommended to be used with `icon`, for scanning result would be affected by low level.');
  33. }
  34. const [locale] = (0, _LocaleReceiver.useLocaleReceiver)('QRCode');
  35. const {
  36. prefixCls
  37. } = (0, _useConfigInject.default)('qrcode', props);
  38. const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
  39. const [, token] = (0, _internal.useToken)();
  40. const qrCodeCanvas = (0, _vue.ref)();
  41. expose({
  42. toDataURL: (type, quality) => {
  43. var _a;
  44. return (_a = qrCodeCanvas.value) === null || _a === void 0 ? void 0 : _a.toDataURL(type, quality);
  45. }
  46. });
  47. const qrCodeProps = (0, _vue.computed)(() => {
  48. const {
  49. value,
  50. icon = '',
  51. size = 160,
  52. iconSize = 40,
  53. color = token.value.colorText,
  54. bgColor = 'transparent',
  55. errorLevel = 'M'
  56. } = props;
  57. const imageSettings = {
  58. src: icon,
  59. x: undefined,
  60. y: undefined,
  61. height: iconSize,
  62. width: iconSize,
  63. excavate: true
  64. };
  65. return {
  66. value,
  67. size: size - (token.value.paddingSM + token.value.lineWidth) * 2,
  68. level: errorLevel,
  69. bgColor,
  70. fgColor: color,
  71. imageSettings: icon ? imageSettings : undefined
  72. };
  73. });
  74. return () => {
  75. const pre = prefixCls.value;
  76. return wrapSSR((0, _vue.createVNode)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, attrs), {}, {
  77. "style": [attrs.style, {
  78. width: `${props.size}px`,
  79. height: `${props.size}px`,
  80. backgroundColor: qrCodeProps.value.bgColor
  81. }],
  82. "class": [hashId.value, pre, {
  83. [`${pre}-borderless`]: !props.bordered
  84. }]
  85. }), [props.status !== 'active' && (0, _vue.createVNode)("div", {
  86. "class": `${pre}-mask`
  87. }, [props.status === 'loading' && (0, _vue.createVNode)(_spin.default, null, null), props.status === 'expired' && (0, _vue.createVNode)(_vue.Fragment, null, [(0, _vue.createVNode)("p", {
  88. "class": `${pre}-expired`
  89. }, [locale.value.expired]), (0, _vue.createVNode)(_button.default, {
  90. "type": "link",
  91. "onClick": e => emit('refresh', e)
  92. }, {
  93. default: () => [locale.value.refresh],
  94. icon: () => (0, _vue.createVNode)(_iconsVue.ReloadOutlined, null, null)
  95. })]), props.status === 'scanned' && (0, _vue.createVNode)("p", {
  96. "class": `${pre}-scanned`
  97. }, [locale.value.scanned])]), props.type === 'canvas' ? (0, _vue.createVNode)(_QRCode.QRCodeCanvas, (0, _objectSpread2.default)({
  98. "ref": qrCodeCanvas
  99. }, qrCodeProps.value), null) : (0, _vue.createVNode)(_QRCode.QRCodeSVG, qrCodeProps.value, null)]));
  100. };
  101. }
  102. });
  103. var _default = exports.default = (0, _type.withInstall)(QRCode);