From 7aed0ea7163b9a7d974690120e833357315ffe95 Mon Sep 17 00:00:00 2001
From: CPunisher <1343316114@qq.com>
Date: Fri, 15 May 2020 13:55:28 +0800
Subject: [PATCH] [Param checkbox]

---
 src/components/param/ParamCheckbox.js       | 22 +++++++++++++++++++++
 src/components/param/ParamList.js           |  2 ++
 src/constant/ParamTypes.js                  |  2 +-
 src/containers/param/ParamCheckBoxViewer.js | 17 ++++++++++++++++
 src/reducers/index.js                       |  8 ++------
 src/utils/util.js                           |  7 +++++++
 6 files changed, 51 insertions(+), 7 deletions(-)
 create mode 100644 src/components/param/ParamCheckbox.js
 create mode 100644 src/containers/param/ParamCheckBoxViewer.js

diff --git a/src/components/param/ParamCheckbox.js b/src/components/param/ParamCheckbox.js
new file mode 100644
index 0000000..f7b41c6
--- /dev/null
+++ b/src/components/param/ParamCheckbox.js
@@ -0,0 +1,22 @@
+import React from 'react';
+import PropTypes from 'prop-types'
+import '../Qrcode.css';
+
+const ParamCheckBox = ({ rendererIndex, paramIndex, value, onChange }) => (
+    <input
+        type="checkbox"
+        className="Qr-checkbox"
+        key={"checkbox_" + rendererIndex + "_" + paramIndex}
+        checked={value}
+        onChange={onChange}>
+    </input>
+)
+
+ParamCheckBox.propTypes = {
+    rendererIndex: PropTypes.number.isRequired,
+    paramIndex: PropTypes.number.isRequired,
+    value: PropTypes.bool.isRequired,
+    onChange: PropTypes.func.isRequired
+}
+
+export default ParamCheckBox;
diff --git a/src/components/param/ParamList.js b/src/components/param/ParamList.js
index 9219612..fdb52da 100644
--- a/src/components/param/ParamList.js
+++ b/src/components/param/ParamList.js
@@ -5,11 +5,13 @@ import ParamTextViewer from "../../containers/param/ParamTextViewer";
 import ParamSelectViewer from "../../containers/param/ParamSelectViewer";
 import ParamColorViewer from "../../containers/param/ParamColorViewer";
 import ParamUploadViewer from "../../containers/param/ParamUploadViewer";
+import ParamCheckBoxViewer from "../../containers/param/ParamCheckBoxViewer";
 
 const mapTypeToComponent = ({
     [ParamTypes.TEXT_EDITOR]: ParamTextViewer,
     [ParamTypes.SELECTOR]: ParamSelectViewer,
     [ParamTypes.COLOR_EDITOR]: ParamColorViewer,
+    [ParamTypes.CHECK_BOX]: ParamCheckBoxViewer,
     [ParamTypes.UPLOAD_BUTTON]: ParamUploadViewer,
 })
 
diff --git a/src/constant/ParamTypes.js b/src/constant/ParamTypes.js
index 728e766..57d262d 100644
--- a/src/constant/ParamTypes.js
+++ b/src/constant/ParamTypes.js
@@ -2,6 +2,6 @@ export const ParamTypes = ({
     TEXT_EDITOR: 1,
     SELECTOR: 2,
     COLOR_EDITOR: 3,
-    MULTI_CHECK: 4,
+    CHECK_BOX: 4,
     UPLOAD_BUTTON: 5
 });
diff --git a/src/containers/param/ParamCheckBoxViewer.js b/src/containers/param/ParamCheckBoxViewer.js
new file mode 100644
index 0000000..138cd29
--- /dev/null
+++ b/src/containers/param/ParamCheckBoxViewer.js
@@ -0,0 +1,17 @@
+import { connect } from 'react-redux';
+import {changeParam} from "../../actions";
+import ParamCheckBox from "../../components/param/ParamCheckbox";
+
+const mapStateToProps = (state, ownProps) => ({
+    rendererIndex: ownProps.rendererIndex,
+    paramIndex: ownProps.paramIndex,
+    value: state.paramValue[ownProps.rendererIndex][ownProps.paramIndex],
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+    onChange: (e) => {
+        dispatch(changeParam(ownProps.rendererIndex, ownProps.paramIndex, e.target.checked))
+    }
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(ParamCheckBox);
diff --git a/src/reducers/index.js b/src/reducers/index.js
index c0fee9e..c66433f 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -2,6 +2,7 @@ import {getQrcodeData} from "../utils/qrcodeHandler";
 import {actionTypes} from "../constant/ActionTypes";
 import {QRBTF_URL} from "../constant/References";
 import RendererBase from "../components/renderer/RendererBase";
+import {getExactValue} from "../utils/util";
 
 const initialState = {
     selectedIndex: 0,
@@ -53,12 +54,7 @@ export default function appReducer(state = initialState, action) {
                     }
 
                     const newItem = item.slice();
-                    let newValue = action.value;
-                    if (newValue.length <= 0)
-                        newValue = state.paramInfo[action.rendererIndex][action.paramIndex].default;
-
-                    if (!isNaN(newValue)) newValue = parseInt(newValue);
-                    newItem[action.paramIndex] = newValue;
+                    newItem[action.paramIndex] = getExactValue(action.value, state.paramInfo[action.rendererIndex][action.paramIndex].default);
                     return newItem;
                 })
             });
diff --git a/src/utils/util.js b/src/utils/util.js
index bc0d4a4..7953e10 100644
--- a/src/utils/util.js
+++ b/src/utils/util.js
@@ -51,6 +51,13 @@ export function gamma(r, g, b) {
     return Math.pow((Math.pow(r, 2.2) + Math.pow(1.5 * g, 2.2) + Math.pow(0.6 * b, 2.2)) / (1 + Math.pow(1.5, 2.2) + Math.pow(0.6, 2.2)), 1/2.2)
 }
 
+export function getExactValue(value, defaultValue) {
+    if (typeof value != "string") return value;
+    if (value.length <= 0) value = defaultValue;
+    if (!isNaN(value)) value = parseInt(value);
+    return value;
+}
+
 export function toBase64(file, width, height) {
     let canvas = document.createElement('canvas');
     let ctx = canvas.getContext('2d');