完成回收界面以及部分逻辑

0cc822f0 · Zhang Xin · a20e3fc0 · 0cc822f0 · 0cc822f0 · 0cc822f0
Commit 0cc822f0 authored Sep 14, 2018 by Zhang Xin
13 changed files
--- a/client/actions/common.js
+++ b/client/actions/common.js
@@ -4,6 +4,17 @@ import {saveHeaderInfo} from "./initHeader";
 import actionTypes from "../actiontype/user";
 const domain = ENV.domain;
 //获取工单
+let myHeaders = new Headers({
+    'Access-Control-Allow-Origin': '*',
+    // 'Content-Type': 'text/plain;charset=UTF-8',
+    // 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
+    'Content-Type': 'application/json; charset=UTF-8',
+});
 const getTaskInfo = (data)=>{
    // let {employeeId,storeId} = data;
    console.log(data)
@@ -105,6 +116,18 @@ const getUserinfo = (employeeId,storeId)=>{
                }
            }).catch(e=>{console.error(e)})
    }
+};
+const test = ()=>{
+    fetch('http://192.168.10.128:8080/web/flat/work/status/1',{
+        credentials : 'include',
+        method : 'PUT',
+        mode : 'cors',
+        headers:myHeaders,
+    }).then((response)=>response.json())
+        .then(json=>{
+            console.log(json)
+        }).catch(e=>{console.error(e)})
 }
 const setBarcodeInfo = (data)=>{
@@ -141,4 +164,4 @@ const logout = ()=>{
    }
 }
-export {getStoreInfo,getTaskInfo,getInfoByBarcode,saveCommonInfo,getUserinfo,logout,startalljob}
+export {getStoreInfo,getTaskInfo,getInfoByBarcode,saveCommonInfo,getUserinfo,logout,startalljob,test}
--- a/client/components/CommonComponent/PopupComponent/index.css
+++ b/client/components/CommonComponent/PopupComponent/index.css
 .popupComponent{
    position: absolute;
-    background: rgba(0,0,0,.6);
+    background: rgba(0,0,0,.8);
    width: 100%;
    height: 100%;
    top: 0;

--- a/client/components/RecoveryComponent/RecoverySecondPage/RecoverySecondPage.jsx
+++ b/client/components/RecoveryComponent/RecoverySecondPage/RecoverySecondPage.jsx
@@ -4,7 +4,12 @@ require('./index.css')
 export default class RecoverySecondPage extends React.Component{
    constructor(props){
        super(props);
-        this.scanQrcode = this.scanQrcode.bind(this);
+        this.scanQrcode = this.scanQrcode.bind(this); //扫码回收
+        this.wrongQrcode = this.wrongQrcode.bind(this); //扫描错误商品
+        this.correctQrcode = this.correctQrcode.bind(this); //扫描正确商品
+        this.putSkuToBox = this.putSkuToBox.bind(this); //将商品放入回收箱
+        this.wrongSku = this.wrongSku.bind(this); //完成回收箱商品回收
+        this.uploadWrongSku = this.uploadWrongSku.bind(this); //货品不符上报
        this.state={
            style : {
                width:"100%",
@@ -13,7 +18,84 @@ export default class RecoverySecondPage extends React.Component{
        }
    }
+    getPopInfo(){
+        let btnDom = <Button key={"recoveryContainerCorrectQrcode"} style={{'width':"100%","marginTop":"36%"}} text={"已放入"} option={this.putSkuToBox}/>
+        return (
+            <div className={"recoveryPopInfo"}>
+                <div className={"icon iconfont icon-correct font100"} />
+                <div className={"text font40 col000"}>
+                    <p>请将货品放入回收箱</p>
+                </div>
+                <div className={"btn"}>
+                    {btnDom}
+                </div>
+            </div>
+        )
+    }
+    wrongQrcode(){
+        //拿错货品
+        let {showPopup,hidePopup} = this.props;
+        let btnDom = <Button key={"recoveryContainerCorrectQrcode"} style={{'width':"100%","marginTop":"36%"}} text={"关闭"} option={hidePopup}/>
+        let popDom =
+            <div className={"recoveryPopInfo"}>
+                <div className={"icon iconfont icon-wrong font100"} />
+                <div className={"text font40 col000"}>
+                    <p>您拿错货品了，请放回货架！</p>
+                </div>
+                <div className={"btn"}>
+                    {btnDom}
+                </div>
+            </div>
+        showPopup({
+            popupChild:popDom
+        });
+    }
+    wrongSku(){
+        //货道商品不符
+        console.log("货道商品不符 ",this.props)
+        let {showPopup,hidePopup} = this.props;
+        let marginTop = '40px';
+        let btnDom1 = <Button key={"recoveryContainerShelfWrong1"} style={{'width':"100%"}} text={"货品不符"} option={this.uploadWrongSku}/>
+        let btnDom2 = <Button key={"recoveryContainerShelfWrong2"} style={{'width':"100%","marginTop":marginTop}} text={"关闭窗口"} option={hidePopup}/>
+        let popDom =
+            <div className={"recoveryPopInfo"}>
+                <div className={"icon iconfont icon-exclamation font100"} />
+                <div className={"text font40 col000"}>
+                    <p>请确认货道信息，不要数错货道哦</p>
+                </div>
+                <div className={"btn"}>
+                    {btnDom1}
+                    {btnDom2}
+                </div>
+            </div>;
+        showPopup({
+            popupChild:popDom
+        });
+    }
+    correctQrcode(){
+        let {showPopup} = this.props;
+        let popDom = this.getPopInfo();
+        showPopup({
+            popupChild:popDom
+        });
+    }
+    putSkuToBox(){
+        //调取接口，将商品放入回收箱
+    }
+    uploadWrongSku(){
+        //货品不符上报
+    }
    scanQrcode(){
+        //扫码回收
        console.log("scan")
    }
@@ -42,25 +124,25 @@ export default class RecoverySecondPage extends React.Component{
            <div className={"RecoverySecondPage"}>
                <div className={"title font40 col333"}>任务目标：请将该货道货品进行扫码回收</div>
                <div className={"box"}>
-                    <div className={"skuInfo clearfix"}>
+                    <div className={"skuInfo"}>
-                        <div className={"fl"}>
                        <div className={"img"}>
                            <img style={this.state.style} ref={"secondPageImg"} onLoad={()=>this.handleLoadImg.bind(this)("secondPageImg")} onError={()=>this.handleErrorImg.bind(this)("secondPageImg")} src={UTILPATH.localImg.defaultImg} alt=""/>
                        </div>
                        <ul className={"shelfInfo font30 col333"}>
-                                <li className={""}>货品名称：雪碧</li>
+                            <li className={""}>
-                                <li className={""}>所在区域：A区1号柜 <span className={"areaBtn colff775c"}>区域照片</span></li>
+                                <span className={""}>货品名称：雪碧</span>
+                                <span className={"totalNum "}>需回收数量：<span className={"font40 colff775c"}>5</span></span>
+                            </li>
+                            <li className={""}>
+                                <span className={""}>所在区域：A区1号柜 <span className={"areaBtn colff775c"}>区域照片</span></span>
+                                <span className={"currentNum"}>已回收数量：<span className={"font40 colff775c"}>5</span></span>
+                            </li>
                            <li className={""}>货到信息：第6行 第3活到 13-6-6-6</li>
                        </ul>
                    </div>
-                        <div className={"fr font28 col333"}>
-                            <div className={"totalNum"}>需回收数量：<span className={"font30 colff775c"}>5</span></div>
-                            <div className={"currentNum"}>已回收数量：<span className={"font30 colff775c"}>5</span></div>
-                        </div>
-                    </div>
                    <div className={"btn"}>
                        <Button key={"RecoverySecondPageBtn"} classInfo={classInfo} style={style} text={'扫码回收'} option={this.scanQrcode}/>
-                        <div className={"text colff775c font28"}>货品不符？</div>
+                        <div className={"text colff775c font28"} onClick={()=>this.wrongSku()}>货品不符？</div>
                    </div>
                </div>
            </div>

--- a/client/components/RecoveryComponent/RecoverySecondPage/index.css
+++ b/client/components/RecoveryComponent/RecoverySecondPage/index.css
@@ -21,9 +21,12 @@
    text-align: left;
    padding: 0 60px;
    margin-top: 60px;
-}
-.RecoverySecondPage .box .skuInfo .fl{
    display: flex;
+    align-items: center;
+}
+.RecoverySecondPage .box .skuInfo .shelfInfo{
+    line-height: 50px;
+    flex: 1;
 }
 .RecoverySecondPage .box .skuInfo .img{
    width: 200px;
@@ -32,3 +35,21 @@
    text-align: center;
    margin-right: 40px;
 }
+.RecoverySecondPage .box .skuInfo ul>li{
+    display: flex;
+}
+.RecoverySecondPage .box .skuInfo ul>li .areaBtn{
+    margin-left: 10px;
+}
+.RecoverySecondPage .box .skuInfo ul>li>span:first-child{
+    flex: 1;
+}
+.RecoverySecondPage .btn{
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 7%;
+}
+.RecoverySecondPage .btn .text{
+    margin-top: 40px;
+}
\ No newline at end of file
--- a/client/containers/PageContainer/PageContainer.jsx
+++ b/client/containers/PageContainer/PageContainer.jsx
@@ -2,7 +2,7 @@
 import React from 'react'
 import { connect }  from 'react-redux';
-import {getStoreInfo,saveCommonInfo,getUserinfo,logout} from "../../actions/common";
+import {getStoreInfo,saveCommonInfo,getUserinfo,logout,test} from "../../actions/common";
 import {getTroubleList,updateTroubleList} from "../../actions/getTroubles";
 import {initGetOtherProblem,addNewProbem,deleteProblem,editProblemItem,submitProblemList} from "../../actions/otherQuestion"
 import {scanBarCodeGetProductInfo,submitProductInfo,saveEditProductInfo,submitProductSuccess,clearProductSuccess} from "../../actions/ScanBarCode"
@@ -409,6 +409,7 @@ class PageContainer extends React.Component {
    }
    showPopup(info){
        //eg : info = {popupText:'test',popupButtons:[{text : '返回',option:FUNCTION}]}
+        console.log("showPopup ",info)
        let popupInfo = Object.assign({},defaultPopupInfo,info);
        if(
            (   popupInfo.popupChild ||
@@ -550,10 +551,9 @@ class PageContainer extends React.Component {
                pages = <BreakageContainer />;
                break;
            case showPage[10]:
-                let info = {name:1};
                pages = <RecoveryPage
                    headerInfo = {state.commonInfo}
-                    showPopup={()=>this.showPopup(info)}
+                    showPopup={(info)=>this.showPopup(info)}
                    hidePopup={()=>this.hidePopup()}
                />;
                break;

--- a/client/containers/RecoveryContainer/RecoveryContainer.jsx
+++ b/client/containers/RecoveryContainer/RecoveryContainer.jsx
@@ -4,7 +4,6 @@ import LeftContainer from '../LeftContainer/LeftContainer';
 import RightContainer from '../RightContainer/RightContainer';
 import RecovertyFirstPage from '../../components/RecoveryComponent/RecoveryFirstPage/RecoveryFirstPage'
 import RecoverySecondPage from '../../components/RecoveryComponent/RecoverySecondPage/RecoverySecondPage'
-import Button from '../../components/CommonComponent/ButtonComponent/ButtonComponent'
 require('./index.css');
 const recoveryPageIndex = {
@@ -18,27 +17,23 @@ export default class RecoveryContainer extends React.Component{
        this.state = {
            showPage : recoveryPageIndex[1] //展示回收箱页面
        };
-        this.getFirstPage = this.getFirstPage.bind(this);
+        this.getFirstPage = this.getFirstPage.bind(this); //展示第一页
-        this.wrongQrcode = this.wrongQrcode.bind(this); //扫描错误商品
-        this.correctQrcode = this.correctQrcode.bind(this); //扫描正确商品
-        this.putSkuToBox = this.putSkuToBox.bind(this); //将商品放入回收箱
        this.getSecondPage = this.getSecondPage.bind(this); //展示第二页
-        this.finishBoxRecovery = this.finishBoxRecovery.bind(this); //完成回收箱商品回收
        this.getPage = this.getPage.bind(this); //获取要展示的页面
+        this.finishBoxRecovery = this.finishBoxRecovery.bind(this); //完成回收箱商品回收
    }
    componentWillMount() {
        let props = this.props;
        console.log("props ",this.props)
-        if(!props.whetherType){
+        // if(!props.whetherType){
-            console.log("没有回收箱物品")
+        //     console.log("没有回收箱物品")
-            //没有回收箱物品
+        //     //没有回收箱物品
-            this.setState({
+        //     this.setState({
-                showPage : recoveryPageIndex[2]
+        //         showPage : recoveryPageIndex[2]
-            })
+        //     })
+        //
-        }
+        // }
    }
    componentWillReceiveProps(nextProps){
@@ -52,60 +47,15 @@ export default class RecoveryContainer extends React.Component{
        })
    }
-    getPopInfo(){
-        let btnWidth = "410px";
-        let btnDom = <Button key={"recoveryContainerCorrectQrcode"} style={{'width':btnWidth,'display':'inline-block'}} text={"我已放入回收箱"} option={this.putSkuToBox}/>
-        return (
-            <div className={"recoveryPopInfo"}>
-                <div className={"icon iconfont icon-correct font90"} />
-                <div className={"text font30 col000"}>
-                    <p>货品信息匹配正确！</p>
-                    <p>请将货品放入回收箱</p>
-                </div>
-                {btnDom}
-            </div>
-        )
-    }
-    wrongQrcode(){
-        //拿错货品
-        let {showPopup,hidePopup} = this.props;
-        let btnWidth = "410px";
-        let btnDom = <Button key={"recoveryContainerCorrectQrcode"} style={{'width':btnWidth,'display':'inline-block'}} text={"关闭"} option={hidePopup}/>
-        let popDom =
-            <div className={"recoveryPopInfo"}>
-                <div className={"icon iconfont icon-wrong font90"} />
-                <div className={"text font30 col000"}>
-                    <p>您拿错货品了，请放回货架！</p>
-                </div>
-                {btnDom}
-            </div>
-        showPopup({
-            popupChild:popDom
-        });
-    }
-    correctQrcode(){
-        let {showPopup} = this.props;
-        let popDom = this.getPopInfo();
-        showPopup({
-            popupChild:popDom
-        });
-    }
-    putSkuToBox(){
-        //调取接口，将商品放入回收箱
-    }
    getFirstPage(){
        return (
            <RecovertyFirstPage finishBoxRecovery={()=>this.finishBoxRecovery()}/>
        )
    }
    getSecondPage(){
+        let props = this.props;
        return (
-            <RecoverySecondPage />
+            <RecoverySecondPage {...props}/>
        )
    }

--- a/client/containers/RecoveryContainer/index.css
+++ b/client/containers/RecoveryContainer/index.css
@@ -10,7 +10,7 @@
    text-align: center;
 }
 .recoveryPopInfo .icon{
-    margin: 80px 0 ;
+    margin: 70px 0 ;
    color: #27ce61;
 }
 .recoveryPopInfo .icon.icon-wrong{
@@ -20,3 +20,9 @@
    line-height: 40px;
    margin-bottom: 80px;
 }
+.recoveryPopInfo .btn{
+    position: relative;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 410px;
+}
\ No newline at end of file
--- a/client/css/font.css
+++ b/client/css/font.css
@@ -27,6 +27,7 @@ body{
 @value font60: 60px;
 @value font70: 70px;
 @value font90: 90px;
+@value font100: 100px;
 .font10 {
    font-size: calc(font10 * var(--base)) !important;
@@ -229,3 +230,14 @@ body{
 [data-dpr="3"] .font90 {
    font-size: calc(var(--font3) * font90 * var(--base)) !important;
 }
+.font100 {
+    font-size:  calc(font100 * var(--base)) !important;
+}
+[data-dpr="2"] .font100 {
+    font-size: calc(var(--font2) * font100 * var(--base)) !important;
+}
+[data-dpr="3"] .font100 {
+    font-size: calc(var(--font3) * font100 * var(--base)) !important;
+}
\ No newline at end of file
--- a/client/css/iconfont.css
+++ b/client/css/iconfont.css
 @font-face {font-family: "font_family";
-    src: url('../font/iconfont.eot?t=1536818672732'); /* IE9*/
+    src: url('../font/iconfont.eot?t=1536897268119'); /* IE9*/
-    src: url('../font/iconfont.eot?t=1536818672732#iefix') format('embedded-opentype'), /* IE6-IE8 */
+    src: url('../font/iconfont.eot?t=1536897268119#iefix') format('embedded-opentype'), /* IE6-IE8 */
-    url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'),
+    url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'),
-    url('../font/iconfont.ttf?t=1536818672732') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
+    url('../font/iconfont.ttf?t=1536897268119') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
-    url('../font/iconfont.svg?t=1536818672732#font_family') format('svg'); /* iOS 4.1- */
+    url('../font/iconfont.svg?t=1536897268119#font_family') format('svg'); /* iOS 4.1- */
 }
 .iconfont {
@@ -19,6 +18,8 @@
 .icon-circle-left:before { content: "\e613"; }
+.icon-exclamation:before { content: "\e65b"; }
 .icon-task:before { content: "\e653"; }
 .icon-arrow-o-l:before { content: "\e789"; }
@@ -41,3 +42,4 @@
 .icon-wrong:before { content: "\e620"; }
--- a/client/font/iconfont.eot
+++ b/client/font/iconfont.eot
--- a/client/font/iconfont.svg
+++ b/client/font/iconfont.svg
@@ -26,6 +26,9 @@ Created by iconfont
    <glyph glyph-name="circle-left" unicode="&#58899;" d="M19.407 391.476c0-268.009 217.268-485.268 485.276-485.268 268.001 0 485.26 217.258 485.26 485.268 0 268.008-217.258 485.265-485.26 485.268-268.009 0.001-485.276-217.259-485.276-485.266zM929.291 391.476c0-234.511-190.111-424.607-424.607-424.607-234.501 0-424.608 190.098-424.608 424.607 0 234.501 190.109 424.606 424.608 424.606 234.498 0.001 424.607-190.106 424.608-424.606zM367.124 418.118c-7.281-7.264-13.253-17.223-11.601-26.641-1.653-9.419 4.32-19.38 11.601-26.658l232.226-232.226c11.847-11.83 31.045-11.828 42.892 0 11.847 11.847 11.848 31.054 0 42.902l-215.981 215.982 215.981 215.974c11.847 11.845 11.847 31.052 0 42.9-11.845 11.839-31.043 11.839-42.892 0l-232.226-232.23z"  horiz-adv-x="1024" />
+    <glyph glyph-name="exclamation" unicode="&#58971;" d="M954.395224 61.209315999999944L553.317523 755.895055a47.725978 47.725978 0 0 1-82.660628 0L68.783061 59.829898999999955a47.724954 47.724954 0 0 1 41.330314-71.586408h803.772227c26.357298 0 47.723931 21.366633 47.723931 47.724954 0 9.269108-2.641153 17.920138-7.214309 25.240871z m-401.463488 72.672136c0-22.606881-18.326391-40.932248-40.932248-40.932248-22.606881 0-40.932248 18.325367-40.932248 40.932248v1.312902c0 22.606881 18.325367 40.932248 40.932248 40.932248 22.605857 0 40.932248-18.325367 40.932248-40.932248v-1.312902z m0 149.564388c0-22.606881-18.325367-40.932248-40.932248-40.932248-22.605857 0-40.932248 18.325367-40.932248 40.932248V501.088742c0 22.606881 18.326391 40.932248 40.932248 40.932248 22.606881 0 40.932248-18.325367 40.932248-40.932248V283.44584z"  horiz-adv-x="1024" />
    <glyph glyph-name="task" unicode="&#58963;" d="M840.454 833.558h-638.605c-76.445 0-139.409-63.68-139.409-141.007v-614.048c0-77.326 62.963-141.007 139.408-141.007h638.605c76.454 0 139.408 63.68 139.408 141.007v614.048c0 77.326-58.454 141.007-139.408 141.007zM912.409 73.95000000000005c0-40.931-31.473-72.772-71.954-72.772h-638.605c-40.473 0-71.954 31.84-71.954 72.772v618.603c0 40.931 31.481 72.772 71.954 72.772h638.605c40.481 0 71.954-31.84 71.954-72.772v-618.603zM399.73 610.6800000000001l-98.936-100.065-44.973 45.477c-13.5 13.647-35.981 13.647-44.973 0-13.5-13.638-13.5-36.386 0-45.477l71.954-72.781c4.5-4.546 13.492-9.092 26.981-9.092 13.5 0 13.5 4.546 26.981 9.092l121.426 122.813c13.5 13.647 13.5 36.386 0 45.487-26.981 13.638-44.973 13.638-58.463 4.546zM813.473 556.092h-310.308c-22.481 0-31.481-13.638-31.481-31.84 0-22.739 13.5-31.84 31.481-31.84h310.316c22.481 0 31.473 13.647 31.473 31.84 0 18.202-13.5 31.84-31.481 31.84zM318.775 351.41600000000005c-58.463 0-103.436-45.487-103.436-104.62 0-59.125 44.973-104.611 103.436-104.611 58.473 0 103.436 45.487 103.436 104.611 0 63.68-49.463 104.62-103.436 104.62zM318.775 214.957c-22.481 0-35.973 13.647-35.973 36.386 0 22.747 13.492 36.395 35.973 36.395 22.492 0 35.981-13.647 35.981-36.395 0-22.739-17.992-36.386-35.981-36.386zM813.473 283.192h-310.308c-22.481 0-31.481-13.647-31.481-31.849 0-18.184 13.5-31.84 31.481-31.84h310.316c22.481 0 31.473 13.647 31.473 31.84 0 18.202-13.5 31.84-31.481 31.84z"  horiz-adv-x="1044" />

--- a/client/font/iconfont.ttf
+++ b/client/font/iconfont.ttf
--- a/client/font/iconfont.woff
+++ b/client/font/iconfont.woff