ze-react-component-library
Version:
ZeroETP React Component Library
123 lines (99 loc) • 4.69 kB
JavaScript
;
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.RecordLoading = void 0;
require("antd/lib/button/style");
var _button = _interopRequireDefault(require("antd/lib/button"));
require("antd/lib/message/style");
var _message2 = _interopRequireDefault(require("antd/lib/message"));
var _react = _interopRequireWildcard(require("react"));
var _request = require("../request");
var _useRecorder = _interopRequireDefault(require("../hooks/useRecorder"));
var _icons = require("@ant-design/icons");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var defaultColor = "primary";
var RecordLoading = function RecordLoading(_a) {
var _b = _a.color,
color = _b === void 0 ? defaultColor : _b,
children = _a.children,
style = _a.style,
_c = _a.className,
className = _c === void 0 ? "" : _c;
var isPrimary = color === defaultColor;
var props = {
color: isPrimary ? undefined : color,
className: isPrimary ? "text-primary-color" : undefined
};
return /*#__PURE__*/_react.default.createElement("div", {
style: style,
className: "ze-search-bar-record-loading-wrapper " + className
}, /*#__PURE__*/_react.default.createElement("div", {
className: "ze-search-bar-record-loading-icon"
}, /*#__PURE__*/_react.default.createElement(_icons.AudioOutlined, {
style: {
fontSize: 50,
color: props.color
},
className: props.className
}), /*#__PURE__*/_react.default.createElement(_icons.LoadingOutlined, {
className: props.className,
style: {
fontSize: 100,
color: props.color
},
spin: true
})), /*#__PURE__*/_react.default.createElement("div", {
style: {
fontSize: 18,
marginTop: 12,
color: props.color,
textAlign: "center"
},
className: props.className
}, children));
};
exports.RecordLoading = RecordLoading;
var VoiceRecorder = function VoiceRecorder(_a) {
var ask = _a.ask;
var _b = (0, _react.useState)(false),
translating = _b[0],
setTranslating = _b[1];
var recorder = (0, _useRecorder.default)();
(0, _react.useEffect)(function () {
recorder.start(ask);
}, []);
var sendVoice = function sendVoice(data) {
var formData = new FormData();
formData.append("voice", data);
(0, _request.requestSuggestByVoice)(formData).then(function (res) {
ask(res.result);
}).catch(function (e) {
_message2.default.error(e.message);
ask(); // 退出去
});
};
var translateRecord = function translateRecord() {
setTranslating(true);
recorder.stop(sendVoice);
};
return /*#__PURE__*/_react.default.createElement("div", {
style: {
textAlign: "center"
}
}, /*#__PURE__*/_react.default.createElement(RecordLoading, null), /*#__PURE__*/_react.default.createElement(_button.default, {
onClick: function onClick() {
return translateRecord();
},
loading: translating,
style: {
marginTop: 60
},
type: "primary"
}, "\u63D0\u4EA4"));
};
var _default = VoiceRecorder;
exports.default = _default;