add SanCodePage

client/components/BreakageComponent/BreakageCode/BreakageCode.jsx

@@ -5,18 +5,13 @@ require('./index.css')
 class BreakageCode extends React.Component{
     constructor(props){
          super(props)
-         this.state={
-             barcode:'',
-             barcodeWord:false
-         }
     }
 
     render(){
-        let { barcode , barcodeWord } = this.state;
        return (
            <div className={'breakageContent'} style={{width:'100%',height:'100%',background:'rgba(0,0,0,1)'}}>
                 <div className={"breakageCodeHeader font32  colfff "}>
-                    <i className={"iconfont middle icon font50 icon-circle-left circleIcon fl"} onClick={this.changCodePage.bind(this)} style={{flexBasis:'100px'}}/>
+                    <i className={"iconfont middle icon font50 icon-circle-left circleIcon fl"} onClick={this.changeSanCodePage.bind(this)} style={{flexBasis:'100px'}}/>
                     <span className={"font40"}>请输入遗留商品的条形码</span>
                     <span className={'font30'}>条形码残缺?</span>
                 </div>
@@ -34,8 +29,9 @@ class BreakageCode extends React.Component{
            </div>
        )
     }
-    changCodePage(){
-        this.props.changeCodePage(true)
+  
+    changeSanCodePage(){
+        this.props.changeSanCodePage('SanCode')
     }
 }
 export default BreakageCode;
\ No newline at end of file

client/components/BreakageComponent/SanCodeComponent/SanCodeComponent.jsx

+import React from 'react'
+require('./index.css')
+class SanCodeComponent extends React.Component{
+     constructor(props){
+         super(props)
+     }
+
+     render(){
+        return <div className={'breakageContent'} style={{width:'100%',height:'100%',background:'black'}}>
+                    <div className={"breakageSanCodeHeader font32  colfff "}>
+                        <i className={"iconfont middle icon font50 icon-circle-left circleIcon fl"} onClick={this.changCodePage.bind(this)}/>
+                        <span className={"font40"}>请把遗留货品的条形码,对准前置摄像头进行扫描</span>
+                        <span className={'font30'}>条形码残缺?</span>
+                    </div>
+                    <div className="SanCodeFrame">
+
+                    </div>
+                    <div className="handMovementCode">
+                         <p className="colfff font30">or<span className="colff7860" style={{marginLeft:'15px'}} onClick={this.changeSanCodePage.bind(this)}>手动输入条形码</span></p>
+                    </div>
+            </div>
+     }
+     changCodePage(){
+        this.props.changeCodePage(true)
+    }
+    changeSanCodePage(){
+        this.props.changeSanCodePage('HandCode')
+    }
+}
+
+export default SanCodeComponent
\ No newline at end of file

client/components/BreakageComponent/SanCodeComponent/index.css

+.breakageContent .breakageSanCodeHeader{
+    display: flex;
+    justify-content: space-between;
+    padding:0 20px;
+    width:100%;
+    line-height: 98px;
+}
+.breakageContent .handMovementCode{
+    width:100%;
+    height:40px;
+    position: absolute;
+    bottom:120px;
+    text-align: center;
+}
\ No newline at end of file

client/containers/BreakageContainer/BreakageConatiner.jsx

@@ -5,13 +5,15 @@ import HeaderComponent from '../../components/CommonComponent/HeaderComponent/He
 import DefaultComponent from '../../components/BreakageComponent/defaultComponent/DefaultComponnet'
 import BreakageProductDetail from '../../components/BreakageComponent/BreakageProductDetail/BreakageProductDetail'
 import BreakageCode from '../../components/BreakageComponent/BreakageCode/BreakageCode'
+import SanCodeComponent from '../../components/BreakageComponent/SanCodeComponent/SanCodeComponent'
 require('./index.css')
 class BreakageContainer extends React.Component {
     constructor(props){
          super(props)
          this.state={
             showPage:1,
-            isShow:true
+            isShow:true,
+            SanCodePage:'SanCode'
          }
          this.changePage=this.changePage.bind(this);
     }
@@ -30,7 +32,7 @@ class BreakageContainer extends React.Component {
                                  this.getPages() 
                               }
                         </RightContainer>
-                       </div>:<BreakageCode changePage={this.changePage.bind(this)} changeCodePage={this.changeCodePage.bind(this)} getBarCodeProductInfo={this.getproductCode.bind(this)} />
+                       </div>:this.getSanCodePgae()
                   }
              </div>
          ) 
@@ -52,6 +54,12 @@ class BreakageContainer extends React.Component {
             isShow:bool
         })
     }
+    changeSanCodePage(CodePage){
+        this.setState({
+            SanCodePage:CodePage
+        })
+    }
+    //根据 判断 显示应该显示的组件
     getPages(){
         let pages=null;
         let props=this.props;
@@ -71,9 +79,27 @@ class BreakageContainer extends React.Component {
         }
         return pages;
     }
+    //根据数据显示扫码 还是手动输入条形码
+    getSanCodePgae(){
+        let {SanCodePage}=this.state;
+        let SanPage=null;
+        switch(SanCodePage){
+            case 'SanCode' :
+                    SanPage=<SanCodeComponent changeSanCodePage={this.changeSanCodePage.bind(this)}
+                                              changeCodePage={this.changeCodePage.bind(this)}
+                                          />
+                break;
+            case 'HandCode' :
+                    SanPage=<BreakageCode changePage={this.changePage.bind(this)} changeSanCodePage={this.changeSanCodePage.bind(this)} getBarCodeProductInfo={this.getproductCode.bind(this)} />
+                break;
+        }
+       return  SanPage;
+    }
+    //把二维码传给后台
     getproductCode(barcode){
         this.props.getBarCodeProductInfo(barcode)
     }
+    //把 商品的详细信息传给后台
     transmitInfo(productDetail){
         this.props.submitBreakageProduct(productDetail)
     }

client/containers/TakeStokeContainer/TakeStokeContainer.jsx

@@ -69,10 +69,12 @@ class TakeStokeContaniner extends React.Component {
                     </div>
             )
     }
+    //显示放大显示
     showImg(){
         let popupInfo={showPopup:true,popupChild:<img onClick={this.props.hidePopup} className={'defaultPopup'} src={UTILPATH.localImg.defaultImg} alt=""/>}
         this.props.showPopup(popupInfo)
     }
+    //产品数量的加减
     productNum(str){
         let {initNum}=this.state;
         if(str==='add'){
@@ -89,12 +91,14 @@ class TakeStokeContaniner extends React.Component {
             })
         }
     }
+    //核对产品数量
     checkProductNum(){
         let {initNum}=this.state;
         let {workListId,skuPassId}=this.props.tokeTaskProduct;
         let tokeProductInfo={workListId,skuPassId,quantity:initNum}
         this.props.checkProductQuantity(tokeProductInfo)
     }
+    //根据后台返回的数据  判断显示的组件
     componentWillReceiveProps(nextProps){
           let {type}=nextProps.TokeStokeState;
           switch(type){