Merge branch 'master' of https://github.com/ciaochaos/qrbtf
This commit is contained in:
commit
bd96341137
|
@ -6,18 +6,17 @@ function calClassName(props) {
|
||||||
return 'Qr-item';
|
return 'Qr-item';
|
||||||
}
|
}
|
||||||
|
|
||||||
class QrItem extends React.Component {
|
export default class QrItem extends React.Component {
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.handleClick = this.handleClick.bind(this);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
this.forceUpdate()
|
this.forceUpdate()
|
||||||
}
|
}
|
||||||
|
|
||||||
handleClick(e) {
|
handleClick = (e) => {
|
||||||
this.props.onSelected(this.props.index);
|
this.props.onSelected(this.props.index);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -40,5 +39,3 @@ class QrItem extends React.Component {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrItem;
|
|
||||||
|
|
|
@ -70,7 +70,7 @@ function listPoint(props) {
|
||||||
return pointList;
|
return pointList;
|
||||||
}
|
}
|
||||||
|
|
||||||
class QrRendererBase extends React.Component {
|
export default class QrRendererBase extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
if (this.props.setParamInfo) {
|
if (this.props.setParamInfo) {
|
||||||
|
@ -111,4 +111,3 @@ class QrRendererBase extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrRendererBase
|
|
||||||
|
|
|
@ -2,10 +2,9 @@ import React from "react";
|
||||||
import './Qrcode.css'
|
import './Qrcode.css'
|
||||||
import {defaultRenderer} from "../utils/util";
|
import {defaultRenderer} from "../utils/util";
|
||||||
|
|
||||||
class QrRendererBlank extends React.Component {
|
export default class QrRendererBlank extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return defaultRenderer(this.props.qrcode);
|
return defaultRenderer(this.props.qrcode);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrRendererBlank
|
|
||||||
|
|
|
@ -159,7 +159,7 @@ function listPoint(props) {
|
||||||
return pointList;
|
return pointList;
|
||||||
}
|
}
|
||||||
|
|
||||||
class QrRendererDSJ extends React.Component {
|
export default class QrRendererDSJ extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
if (this.props.setParamInfo) {
|
if (this.props.setParamInfo) {
|
||||||
|
@ -190,4 +190,3 @@ class QrRendererDSJ extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrRendererDSJ
|
|
||||||
|
|
|
@ -38,10 +38,9 @@ function listPoint(props) {
|
||||||
return pointList;
|
return pointList;
|
||||||
}
|
}
|
||||||
|
|
||||||
class QrRendererRandRect extends React.Component {
|
export default class QrRendererRandRect extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return defaultRenderer(this.props.qrcode, listPoint(this.props));
|
return defaultRenderer(this.props.qrcode, listPoint(this.props));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrRendererRandRect
|
|
||||||
|
|
|
@ -70,7 +70,7 @@ function listPoint(props) {
|
||||||
return pointList;
|
return pointList;
|
||||||
}
|
}
|
||||||
|
|
||||||
class QrRendererRandRound extends React.Component {
|
export default class QrRendererRandRound extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
if (this.props.setParamInfo) {
|
if (this.props.setParamInfo) {
|
||||||
|
@ -111,4 +111,3 @@ class QrRendererRandRound extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrRendererRandRound
|
|
||||||
|
|
|
@ -70,7 +70,7 @@ function listPoint(props) {
|
||||||
return pointList;
|
return pointList;
|
||||||
}
|
}
|
||||||
|
|
||||||
class QrRendererRound extends React.Component {
|
export default class QrRendererRound extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
if (this.props.setParamInfo) {
|
if (this.props.setParamInfo) {
|
||||||
|
@ -111,4 +111,3 @@ class QrRendererRound extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default QrRendererRound
|
|
||||||
|
|
|
@ -40,14 +40,6 @@ class Qrcode extends React.Component {
|
||||||
paramValueBuffer;
|
paramValueBuffer;
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.handleCreate = this.handleCreate.bind(this)
|
|
||||||
this.downloadSvg = this.downloadSvg.bind(this)
|
|
||||||
this.downloadImg = this.downloadImg.bind(this)
|
|
||||||
this.setParamValue = this.setParamValue.bind(this)
|
|
||||||
this.getParamValue = this.getParamValue.bind(this)
|
|
||||||
this.setParamInfo = this.setParamInfo.bind(this)
|
|
||||||
this.renderAdjustment = this.renderAdjustment.bind(this)
|
|
||||||
this.renderParamEditor = this.renderParamEditor.bind(this)
|
|
||||||
this.state = {
|
this.state = {
|
||||||
text: '',
|
text: '',
|
||||||
selectedIndex: 0,
|
selectedIndex: 0,
|
||||||
|
@ -72,7 +64,7 @@ class Qrcode extends React.Component {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
setParamInfo(index) {
|
setParamInfo = (index) => {
|
||||||
const _this = this;
|
const _this = this;
|
||||||
return function (params) {
|
return function (params) {
|
||||||
_this.paramInfoBuffer[index] = params;
|
_this.paramInfoBuffer[index] = params;
|
||||||
|
@ -82,39 +74,32 @@ class Qrcode extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
setParamValue(valueIndex, value) {
|
setParamValue = (valueIndex, value) => {
|
||||||
const newValue = this.state.paramValue.slice();
|
const newValue = this.state.paramValue.slice();
|
||||||
newValue[this.state.selectedIndex][valueIndex] = value;
|
newValue[this.state.selectedIndex][valueIndex] = value;
|
||||||
this.setState({paramValue: newValue});
|
this.setState({paramValue: newValue});
|
||||||
}
|
}
|
||||||
|
|
||||||
getParamValue(index) {
|
handleCreate = (e) => {
|
||||||
const _this = this;
|
|
||||||
return function () {
|
|
||||||
return _this.state.paramValue[index];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
handleCreate(e) {
|
|
||||||
let text = this.state.text
|
let text = this.state.text
|
||||||
if (text.length <= 0) text = 'https://qrbtf.com/';
|
if (text.length <= 0) text = 'https://qrbtf.com/';
|
||||||
this.setState({text: text, options: {text: text}, qrcode: getQrcodeData({text: text, correctLevel: this.state.correctLevel})});
|
this.setState({text: text, options: {text: text}, qrcode: getQrcodeData({text: text, correctLevel: this.state.correctLevel})});
|
||||||
if (e) e.target.blur();
|
if (e) e.target.blur();
|
||||||
}
|
}
|
||||||
|
|
||||||
downloadSvg(e) {
|
downloadSvg = (e) => {
|
||||||
const style = styleList[this.state.selectedIndex]
|
const style = styleList[this.state.selectedIndex]
|
||||||
const el = React.createElement(style.renderer, {qrcode: this.state.qrcode, params: this.state.paramValue[this.state.selectedIndex]})
|
const el = React.createElement(style.renderer, {qrcode: this.state.qrcode, params: this.state.paramValue[this.state.selectedIndex]})
|
||||||
saveSvg(style.value, ReactDOMServer.renderToString(el))
|
saveSvg(style.value, ReactDOMServer.renderToString(el))
|
||||||
}
|
}
|
||||||
|
|
||||||
downloadImg(e) {
|
downloadImg = (e) => {
|
||||||
const style = styleList[this.state.selectedIndex]
|
const style = styleList[this.state.selectedIndex]
|
||||||
const el = React.createElement(style.renderer, {qrcode: this.state.qrcode, params: this.state.paramValue[this.state.selectedIndex]})
|
const el = React.createElement(style.renderer, {qrcode: this.state.qrcode, params: this.state.paramValue[this.state.selectedIndex]})
|
||||||
saveImg(style.value, ReactDOMServer.renderToString(el), 1500, 1500)
|
saveImg(style.value, ReactDOMServer.renderToString(el), 1500, 1500)
|
||||||
}
|
}
|
||||||
|
|
||||||
renderParamEditor(info, index) {
|
renderParamEditor = (info, index) => {
|
||||||
if (info.choices) {
|
if (info.choices) {
|
||||||
return (
|
return (
|
||||||
<select
|
<select
|
||||||
|
@ -149,7 +134,7 @@ class Qrcode extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
renderAdjustment() {
|
renderAdjustment = () => {
|
||||||
const target = this.state.paramInfo[this.state.selectedIndex];
|
const target = this.state.paramInfo[this.state.selectedIndex];
|
||||||
if (target instanceof Array) {
|
if (target instanceof Array) {
|
||||||
return target.map((info, index) => {
|
return target.map((info, index) => {
|
||||||
|
|
Loading…
Reference in New Issue