亚希base function devâ€

client/actions/ScanBarCodeContainer.js

+import fetch from 'isomorphic-fetch';
+import * as INIT_SCANBARCODEGETPRODUCTINFO_SUCCESS from '../actiontype/ScanBarCodeContainer';
+const domain = ENV.domain;
+const fakeJsonData = {
+
+}
+export function scanBarCodeGetProductInfo(postData) {
+    return (dispatch) => {
+        let url = String(domain+'/web/scanning_sku_barcode_for_add_loss_task');
+        fetch(url,{
+            credentials : 'include',
+            method : 'POST',
+            mode : 'cors',
+            body : JSON.stringify(postData)
+
+        }).then((response) => response.json())
+            .then(
+                (json)=>{
+                    if(json.is_succ){
+
+                    }else{
+                    }
+                }
+            ).catch(e=>dispatch(console.log("出现错误"))
+        )
+    }
+}
+function initSuccess(data) {
+    return {
+        type: actionTypes.INIT_SCANBARCODEGETPRODUCTINFO_SUCCESS,
+        data
+    }
+}
\ No newline at end of file

client/actiontype/ScanBarCodeContainer.js

+const INIT_SCANBARCODEGETPRODUCTINFO_SUCCESS  = 'INIT_SCANBARCODEGETPRODUCTINFO_SUCCESS'
+
+module.exports = {INIT_SCANBARCODEGETPRODUCTINFO_SUCCESS}

client/containers/PageContainer/PageContainer.jsx

 'use strict';
 import React from 'react'
 import { connect }  from 'react-redux';
+import ScanBarCodeContainer from '../ScanBarCodeContainer/ScanBarCodeContaienr'
 
 class PageContainer extends React.Component {
     constructor(props) {
@@ -14,13 +15,11 @@ class PageContainer extends React.Component {
     }
     componentWillReceiveProps(nextProps){
     }
-    componentWillUnmount() {
+    componentWillUnmount(){
     }
     render() {
         return (
-            <div>
-               123
-            </div>
+            <ScanBarCodeContainer></ScanBarCodeContainer>
         )
     }
 }

client/containers/ScanBarCodeContainer/ScanBarCodeContaienr.jsx

+'use strict';
+import React from 'react';
+import { connect } from  'react-redux';
+import { scanBarCodeGetProductInfo } from '../../actions/ScanBarCodeContainer'
+require('./index.css');
+class ScanBarCodeContainer extends React.Component{
+    constructor(props) {
+        super(props);
+        const {state, dispatch} = this.props;
+        console.log(state);
+        console.log(props);
+        this.state = {
+            "barCodeValue":''
+        }
+
+    }
+    componentWillMount() {
+    }
+    componentDidMount(){
+    }
+    componentDidUpdate() {
+    }
+    componentWillReceiveProps(nextProps){
+    }
+    componentWillUnmount() {
+    }
+    handleInputBarCode(evnet){
+        console.log("onchange");
+        let barCodeValue = evnet.target.value;
+        this.setState({
+            barCodeValue :barCodeValue
+        },()=>{})
+
+    }
+    handleSubmitClick(){
+        const {state,dispatch} = this.props;
+        let postData = {};
+        postData.warehouseId = Number("123456");
+        postData.taskId = Number("123456");
+        postData.sellOrderId = Number("123456");
+        postData.skuBarcode = String(this.state.barCodeValue);
+        dispatch(scanBarCodeGetProductInfo(postData));
+    }
+    render() {
+        return (
+            <div className={"scanBarCodeContainer"}>
+               <div className={"scanBarCodeTipText"}>请把遗留或者掉落货品的条形码输入到文本框中，每次一件。</div>
+                <div className={"scanBarInputContainer"}>
+                    <label htmlFor="">商品条形码</label>
+                    <input type="text" onChange={(e)=>this.handleInputBarCode(e)}/>
+                </div>
+                <div className={"opeationContainer"}>
+                    <button onClick={()=>{this.handleSubmitClick.bind(this)()}}>确认</button>
+                </div>
+                <div className={"productInfoContainer"}>
+                    <div className={"baseInfo"}>
+                        <img  className={"right"} src="http://img.zcool.cn/community/0117e2571b8b246ac72538120dd8a4.jpg@1280w_1l_2o_100sh.jpg" alt=""/>
+                        <div className={"left"}>
+                            <p>9038383898</p>
+                            <p>SKU00001 <span>可口可乐</span></p>
+                            <p>250ml</p>
+
+                        </div>
+                    </div>
+                    <ul className={"locationInfo"}>
+                        商品位置
+                        <li>机械手平台</li>
+                        <li>出货传送区</li>
+                        <li>轨道</li>
+                        <li>机械手平台</li>
+                        <li>出货传送区</li>
+                        <li>轨道</li>
+                    </ul>
+                    <ul className={"productStatusInfo"}>
+                        商品状态
+                        <li>包装完整</li>
+                        <li>包装损坏</li>
+                        <li>包装损坏</li>
+                    </ul>
+                    <div className={"operationContainer"}>
+                        <button>提交</button>
+                    </div>
+                </div>
+            </div>
+        )
+    }
+}
+function select(store) {
+    return Object.assign({}, {state: store})
+}
+
+export default connect(select)(ScanBarCodeContainer)
\ No newline at end of file

client/containers/ScanBarCodeContainer/index.css

+.scanBarCodeContainer{
+    width: 500px;
+    height: 500px;
+    background-color: orangered;
+}
+.scanBarCodeContainer .productInfoContainer{}
+.scanBarCodeContainer .productInfoContainer{}
\ No newline at end of file

client/reducers/index.js

 import { combineReducers } from 'redux'
 import trouble from './trouble'
+import scanBarCodeContainer from './scanBarCodeContainer'
 
 
 export default combineReducers({
-    trouble
+    trouble,
+    scanBarCodeContainer
 })
 

client/reducers/scanBarCodeContainer.js

+import * as actionTypes from '../actiontype/ScanBarCodeContainer';
+function initSuccess(state,data) {
+    let newInfo = Object.assign({},state,data);
+    return newInfo;
+}
+export default function(state={}, action) {
+    switch (action.type) {
+        case actionTypes.INIT_SCANBARCODEGETPRODUCTINFO_SUCCESS:
+            return initSuccess(state,action.data)
+        default:
+            return state;
+    }
+}
\ No newline at end of file