Skip to content

M
max_android_panel
Commit 0d1f2a4c by Zhang Xin
Options

完成补货页面部分逻辑

parent 1f6c7f23
Showing with 197 additions and 114 deletions
client/actions/common.js
import fetch from 'isomorphic-fetch';
import actionType from '../actiontype/common'
import {addErrorInfo} from './uploadError'
const domain = ENV.domain;
let domain = ENV.domain;
//获取工单
domain = 'http://192.168.10.128:8080/web/'
let myHeaders = new Headers({
// 'Access-Control-Allow-Origin': '*',
......@@ -13,11 +15,10 @@ let myHeaders = new Headers({
//开始工作
const getTaskInfo = (data)=>{
// let {userInfo,storeInfo} = data;
let {userInfo,storeInfo} = data;
return(dispatch)=>{
// if(userInfo && userInfo.id && storeInfo && storeInfo.id) {
let url ='http://192.168.10.128:8080/web/flat/ready/13/A/28';
// let url = `${ENV.domain}flat/ready/${storeInfo.id}/${userInfo.id}`;
if(userInfo && userInfo.id && storeInfo && storeInfo.id) {
let url = `${domain}flat/ready/${storeInfo.id}/${userInfo.id}`;
fetch(url,{
// credentials : 'include',
method : 'GET',
......@@ -31,9 +32,9 @@ const getTaskInfo = (data)=>{
}
dispatch(saveCommonInfo(Object.assign({},{taskInfo})))
}).catch(e=>{console.error(e)})
// }else {
// dispatch(addErrorInfo("用户或门店不对"))
// }
}else {
dispatch(addErrorInfo("用户或门店不对"))
}
}
};
......@@ -113,10 +114,8 @@ const getUserinfo = (employeeId,storeId)=>{
//test 没有散落货品
const hasNoSku = (commonInfo)=>{
// console.log(commonInfo,'没有散落物品')
return (dispatch)=>{
// let url=`${ENV.domain}/flat/work/status/1`;
let url ='http://192.168.10.128:8080/web/flat/work/status/13/A/LR';
let url = domain + 'flat/work/status/1/A/LR';
fetch(url,{
// credentials : 'include',
method : 'PUT',
......@@ -132,8 +131,9 @@ const hasNoSku = (commonInfo)=>{
//拉取工单
const getTaskList = (data={})=>{
// let url=`${ENV.domain}/flat/work/list/13`;
let url ='http://192.168.10.128:8080/web/flat/work/list/13/A/336/28';
let {storeInfo={},userInfo={},taskInfo={}} = data;
if(storeInfo.id && userInfo.id && taskInfo.area && taskInfo.taskId){
let url =`${domain}flat/work/list/${storeInfo.id}/${taskInfo.area}/${taskInfo.taskId}/${userInfo.id}`;
return (dispatch)=>{
fetch(url,{
// credentials : 'include',
......@@ -157,6 +157,8 @@ const getTaskList = (data={})=>{
dispatch(saveCommonInfo(Object.assign({},data)))
})
}
}
}
const saveTaskListInfo = (data)=>{
......
client/components/RecoveryComponent/RecoveryFirstPage/RecoveryFirstPage.jsx
......@@ -8,15 +8,11 @@ export default class RecoveryFirstPage extends React.Component{
render(){
let props = this.props;
let style = {'width':"410px","background":"#ff7860","display": "inline-block"}
let classInfo = {
colorInfo : "colfff",
className : ''
}
return(
<div className={"recoveryFirstPage"}>
<div className={"text font40 col333"}>任务目标：请将A区回收箱进行整体更换</div>
<Button key={"RecoveryFirstPageBtn"} classInfo={classInfo} style={style} text={'已替换完成'} option={props.finishBoxRecovery}/>
<Button btnContainer={"RecoveryFirstPageBtn font32 backff775c colfff"} key={"RecoveryFirstPageBtn"} text={'已替换完成'} option={props.finishBoxRecovery}/>
<div className={"tips font24"}>查看回收箱位置</div>
</div>
)
......
client/components/RecoveryComponent/RecoveryFirstPage/index.css
......@@ -10,3 +10,6 @@
color: #5c66ff;
text-decoration: underline;
}
.RecoveryFirstPageBtn{
display: inline-block;
}
\ No newline at end of file
client/components/RecoveryComponent/RecoverySecondPage/index.css
......@@ -8,7 +8,7 @@
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 10%;
bottom: 20%;
}
.RecoverySecondPage .btn .text{
margin-top: 40px;
......
client/components/ReplenishComponent/ReplenishScanPage/ReplenishScanPage.jsx
import React from 'react';
import Button from '../../CommonComponent/ButtonComponent/ButtonComponent'
import Header from '../../CommonComponent/HeaderComponent/HeaderComponent';
import PopModel from '../../CommonComponent/PopupComponent/PopupChildComponent'
require('./index.css')
export default class ReplenishScanPage extends React.Component{
constructor(props){
super(props);
this.getOtherHeader = this.getOtherHeader.bind(this)
this.getBarcodeInput = this.getBarcodeInput.bind(this)
this.errorSku = this.errorSku.bind(this)
this.forgetSku = this.forgetSku.bind(this)
this.outReplenish = this.outReplenish.bind(this)
this.getSkuInfo = this.getSkuInfo.bind(this)
this.makeSureScanOver = this.makeSureScanOver.bind(this);
this.submitBarcode = this.submitBarcode.bind(this);
this.state = {
barcodeText : ''
}
}
getOtherHeader(){
let {headerInfo,goBack} = this.props;
let {taskInfo={}} = headerInfo;
return <div className={"otherHeader replenishScanQrcodeHeader font32 clearfix colfff "}>
<i className={"iconfont middle icon font50 icon-circle-left circleIcon fl"} onClick={()=>goBack()}/>
<span className={"middle"}>任务目标：将{taskInfo.area || ""}区补货箱中的货品扫码后放到货架上</span>
</div>
}
handleInputChange(e){
this.setState({
barcodeText:e.target.value
})
}
getBarcodeInput(){
return (
<div className={"barcodeInputDom"}>
<div className={"barcodeInputText font30"}>条形码输入错误，请重新输入</div>
<input className={"barcodeInput font30 col000"} type="text" onChange={this.handleInputChange.bind(this)}/>
<div className={"barcodeInputTip font30 colff775c"}><span className={"colfff"}>or</span>条形码扫描</div>
<Button btnContainer={"barcodeInputBarcode font32 backff775c colfff"} key={"barcodeInputBarcode"} text={"确定"} option={this.submitBarcode}/>
</div>
)
}
//扫描货品异常
errorSku(){
//货道已满解决办法
let {showPopup,hidePopup} = this.props;
let btnDom = <Button btnContainer={"replenishScanPageErrorSkuBtn font32 backff775c colfff"} key={"replenishScanPageErrorSkuBtn"} text={"确认扫描完毕"} option={this.makeSureScanOver}/>
let popDom =
<PopModel popupTitle={"扫描货品异常"} classContainer={"replenishPopInfo replenishScanPageErrorSku"}>
<div className={"icon iconfont icon-exclamation colf5a623 font150"} />
<div className={"text font40 col000"}>
<p>您需要补完【XXX】，才能补其他货品</p>
</div>
<div className={"btn"}>
{btnDom}
<div className={"colff775c font30 handleForgetSku"} onClick={()=>this.forgetSku()}>忘记该货品的样子</div>
</div>
</PopModel>
showPopup({popupChild:popDom});
}
//忘记样子
forgetSku(){
let {showPopup,hidePopup} = this.props;
let btnDom = <Button btnContainer={"replenishScanPageForgetSkuBtn font32 backff775c colfff"} key={"replenishScanPageForgetSkuBtn"} text={"继续扫描"} option={hidePopup}/>
let popDom =
<PopModel popupTitle={"扫描货品异常"} classContainer={"replenishPopInfo replenishScanPageForgetSku"}>
{this.getSkuInfo()}
<div className={"btn"}>
{btnDom}
</div>
</PopModel>
showPopup({popupChild:popDom});
}
//不在本次补货范围
outReplenish(){
//货道已满解决办法
let {showPopup,hidePopup} = this.props;
let btnDom = <Button btnContainer={"recoveryContainerQrcode font32 backff775c colfff"} key={"recoveryContainerWrongQrcode"} text={"关闭"} option={hidePopup}/>
let popDom =
<PopModel popupTitle={"扫描货品异常"} classContainer={"recoveryPopInfo"}>
<div className={"icon iconfont icon-wrong font150"} />
<div className={"text font40 col000"}>
<p>此货品不在本次补货范围内，请放入物流回收箱！</p>
</div>
<div className={"btn"}>
{btnDom}
</div>
</PopModel>
showPopup({popupChild:popDom});
}
getSkuInfo(){
return(
<div className={"replenishSkuInfo"}>
<div className={"skuName font30 col333"}>商品名称：雪碧</div>
<div className={"skuInfo"}>
<div className={"skuImg"}>
<img src="" alt=""/>
</div>
<div className={"areaImg"}>
<img src="" alt=""/>
</div>
<div className={"skuPos col333 font30"}>
<ul>
<li><span className={"skuPosTitle fl"}>所在区域：</span>A区域<span className={"colff775c showAreaImg"}>区域照片</span></li>
<li className={""}>
<span className={"skuPosTitle"}>货道信息：</span>
<span className={""}>一个字一个字一个字一个字一个字一个字</span>
</li>
<li><span className={"skuPosTitle fl"}>货道编号：</span>一个字</li>
</ul>
</div>
</div>
</div>
)
}
makeSureScanOver(){
//确认扫描完毕
let {hidePopup} = this.props;
hidePopup()
}
submitBarcode(){
//提交条形码信息
console.log("submitBarcode ",this.state.barcodeText)
}
render(){
......@@ -13,9 +140,13 @@ export default class ReplenishScanPage extends React.Component{
let {headerInfo} = props;
let {taskInfo={}} = headerInfo;
return(
<div className={"replenishHomePage"}>
<div className={"text font40 col333"}>任务目标：请将{taskInfo.area}区补货箱中的货品扫码放到货架上</div>
<Button btnContainer={"replenishHomePageBtn backff775c colfff font30"} key={"replenishHomePageBtn"} text={'开始扫码补货'} option={props.scanQrcode}/>
<div className={"replenishScanPage"} style={{width:'100%',height:'100%',backgroundColor:'#000'}}>
<Header
showHeader={CONFIG.headerStatus[2]}
>
{this.getOtherHeader()}
</Header>
{this.getBarcodeInput()}
</div>
)
}
......
client/components/ReplenishComponent/ReplenishScanPage/index.css
.replenishHomePage{
.barcodeInputDom{
text-align: center;
padding-top: 240px;
margin-top: 133px;
}
.replenishHomePage .text{
margin-bottom: 180px;
.barcodeInputDom .barcodeInputText{
color:#d0021b;
line-height: 90px;
}
.replenishHomePage .replenishHomePageBtn{
.barcodeInputDom .barcodeInput{
border:2px solid #9b9b9b ;
border-radius: 20px;
width: 540px;
height: 80px;
line-height: 80px;
background-color: #ffffff;
text-align: center;
}
.barcodeInputDom .barcodeInputTip{
line-height: 90px;
}
.barcodeInputDom .barcodeInputTip>span{
margin-right: 30px;
}
.barcodeInputDom .barcodeInputBarcode{
border:none;
display: inline-block;
margin-top: 110px;
}
.replenishScanPageErrorSku .handleForgetSku{
line-height: 90px;
}
.replenishScanPageErrorSku .btn{
flex-direction: column;
align-items: center;
}
.replenishScanPageForgetSku .replenishSkuInfo{
margin-top: 8%;
}
\ No newline at end of file
client/containers/PageContainer/PageContainer.jsx
......@@ -57,7 +57,7 @@ class PageContainer extends React.Component {
constructor(props) {
super(props);
this.state = {
showPage : showPage[13],
showPage : showPage[initPage],
lastPage : '',
page : null,
popupInfo : defaultPopupInfo,
......
client/containers/ReplenishContainer/ReplenishContainer.jsx
......@@ -6,7 +6,7 @@ import ReplenishHomePage from '../../components/ReplenishComponent/ReplenishHome
import ReplenishSkuPage from '../../components/ReplenishComponent/ReplenishSkuPage/ReplenishSkuPage'
import ReplenishScanPage from '../../components/ReplenishComponent/ReplenishScanPage/ReplenishScanPage'
import Button from '../../components/CommonComponent/ButtonComponent/ButtonComponent'
import PopModel from '../../components/CommonComponent/PopupComponent/PopupChildComponent'
require('./index.css');
const replenishPageIndex = {
......@@ -19,6 +19,7 @@ export default class ReplenishContainer extends React.Component{
constructor(props){
super(props);
this.beginScan = this.beginScan.bind(this)
this.goBack = this.goBack.bind(this)
this.state = {
pageType : 1,
showScanQrcode : false
......@@ -59,31 +60,7 @@ export default class ReplenishContainer extends React.Component{
return <ReplenishScanPage {...props}/>
}
getSkuInfo(){
return(
<div className={"replenishSkuInfo"}>
<div className={"skuName font30 col333"}>商品名称：雪碧</div>
<div className={"skuInfo"}>
<div className={"skuImg"}>
<img src="" alt=""/>
</div>
<div className={"areaImg"}>
<img src="" alt=""/>
</div>
<div className={"skuPos col333 font30"}>
<ul>
<li><span className={"skuPosTitle fl"}>所在区域：</span>A区域<span className={"colff775c showAreaImg"}>区域照片</span></li>
<li className={""}>
<span className={"skuPosTitle"}>货道信息：</span>
<span className={""}>一个字一个字一个字一个字一个字一个字</span>
</li>
<li><span className={"skuPosTitle fl"}>货道编号：</span>一个字</li>
</ul>
</div>
</div>
</div>
)
}
getOtherHeader(){
return <div className={"otherHeader replenishScanQrcodeHeader font32 clearfix colfff "}>
......@@ -100,57 +77,6 @@ export default class ReplenishContainer extends React.Component{
}
//扫描货品异常
errorSku(){
//货道已满解决办法
let {showPopup,hidePopup} = this.props;
let btnDom = <Button btnContainer={"recoveryContainerQrcode font32 backff775c colfff"} key={"recoveryContainerWrongQrcode"} text={"确认扫描完毕"} option={hidePopup}/>
let popDom =
<PopModel popupTitle={"扫描货品异常"} classContainer={"recoveryPopInfo"}>
<div className={"icon iconfont icon-wrong font150"} />
<div className={"text font40 col000"}>
<p>您需要补完【XXX】，才能补其他货品</p>
</div>
<div className={"btn"}>
{btnDom}
<div className={"colff775c font30"}>忘记该货品的样子</div>
</div>
</PopModel>
showPopup({popupChild:popDom});
}
//忘记样子
forgetSku(){
let {showPopup,hidePopup} = this.props;
let btnDom = <Button btnContainer={"recoveryContainerQrcode font32 backff775c colfff"} key={"recoveryContainerWrongQrcode"} text={"继续扫描"} option={hidePopup}/>
let popDom =
<PopModel popupTitle={"扫描货品异常"} classContainer={"recoveryPopInfo"}>
{this.getSkuInfo()}
<div className={"btn"}>
{btnDom}
</div>
</PopModel>
showPopup({popupChild:popDom});
}
//不在本次补货范围
outReplenish(){
//货道已满解决办法
let {showPopup,hidePopup} = this.props;
let btnDom = <Button btnContainer={"recoveryContainerQrcode font32 backff775c colfff"} key={"recoveryContainerWrongQrcode"} text={"关闭"} option={hidePopup}/>
let popDom =
<PopModel popupTitle={"扫描货品异常"} classContainer={"recoveryPopInfo"}>
<div className={"icon iconfont icon-wrong font150"} />
<div className={"text font40 col000"}>
<p>此货品不在本次补货范围内，请放入物流回收箱！</p>
</div>
<div className={"btn"}>
{btnDom}
</div>
</PopModel>
showPopup({popupChild:popDom});
}
render(){
......@@ -159,14 +85,7 @@ export default class ReplenishContainer extends React.Component{
<div className={"replenishContainer"}>
{
this.state.showScanQrcode ?
<div className={"replenishQrcode"} style={{width:'100%',height:'100%',backgroundColor:'#000'}}>
<Header
showHeader={CONFIG.headerStatus[2]}
>
{this.getOtherHeader()}
</Header>
</div> :
<ReplenishScanPage {...props} goBack={this.goBack}/> :
<div style={{width:'100%',height:'100%'}}>
{
props.headerInfo && props.headerInfo.storeInfo ?
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment