Skip to content

M
max_android_panel
Commit 119ada55 by Zhang Xin
Options

玩完善整套逻辑，修改页面bug

parent ebd5255b
Showing with 168 additions and 72 deletions
client/actions/getStore.js
......@@ -42,7 +42,7 @@ const getStoreInfo = (storeId)=>{
credentials : 'include',
method : 'POST',
mode : 'cors',
headers: myHeaders,
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(bodyData)
}).then((response)=>response.json())
.then(json=>{
......
client/actions/userinfo.js
......@@ -26,21 +26,31 @@ const saveUserinfo = (data)=>{
}
};
var 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 getUserinfo = (info)=>{
let employeeId = info.employeeid;
console.log("getUserinfo ",info)
let employeeId = info.employeeId;
let bodyData = Object.assign({},{employeeId})
return(dispatch)=>{
dispatch(saveHeaderInfo(info));
// fetch(domain + '/web/flush_image.action',{
// credentials : 'include',
// method : 'POST',
// mode : 'cors',
// body : {}
//
// }).then((response)=>response.json())
// .then(json=>{
// console.log(json);
// }).catch(e=>{console.error(e)})
fetch(domain + 'machine_pad/get_alowed_task.action',{
credentials : 'include',
method : 'POST',
mode : 'cors',
headers:myHeaders,
body : JSON.stringify(bodyData)
}).then((response)=>response.json())
.then(json=>{
console.log(json);
}).catch(e=>{console.error(e)})
if(json.meta.success && json.data){
dispatch(saveUserinfo(json.data))
}
......
client/components/CommonComponent/ClockComponent/ClockComponent.jsx
......@@ -13,7 +13,7 @@ export default class ClockComponent extends React.Component{
}
componentWillMount(){
console.log("componentWillMount")
console.log("clock componentWillMount")
let {totalTime} = this.props;
if(totalTime && totalTime > 0){
this.setState({
......@@ -26,11 +26,11 @@ export default class ClockComponent extends React.Component{
}
componentWillReceiveProps(){
console.log("componentWillReceiveProps")
console.log("clock componentWillReceiveProps")
}
componentWillUnmount(){
console.log("componentWillUnmount")
console.log("clock componentWillUnmount")
window.clearTimeout(this.state.timer);
this.setState({
timer : null,
......
client/components/CommonComponent/HeaderComponent/index.css
......@@ -33,7 +33,7 @@
border-left: 0 solid transparent;
border-right: 40px solid #34343e;
top: 0;
right: 0;
right: -1px;
}
.headerComponent .homeHeader .headerlogo .logoImg{
position: absolute;
......
client/components/OtherQuestionComponent/index.css
......@@ -6,6 +6,7 @@
display: inline-block;
position: relative;
float: left;
background: #ffffff;
}
.editUploadItem .closeBtn{
width: 32px;
......
client/components/ReportDamageListComponent/DamageItemComponent/DamageItem.jsx
......@@ -20,7 +20,7 @@ export default class DamageItem extends React.Component{
return (
<div className={"damageProductItem"}>
<span onClick={()=>{deleteItem(inventoryId)}} className={"closeBtn"}>×</span>
<span onClick={()=>{deleteItem(inventoryId)}} className={"closeBtn font50"}>×</span>
<div className={"productBaseInfo clearfix"}>
<img className={"productImg"} src= {skuBaseInfoVo.skuImagePath} alt=""/>
<div className={"baseNumber"}>
......@@ -36,8 +36,8 @@ export default class DamageItem extends React.Component{
</div>
<div className={"productOtherInfo"}>
<div className={"locationAndStatusInfo"}>
<p className={"location"}>商品位置:<span>{lossPosition}</span></p>
<p className={"status"}>商品状态:<span>{packingStatus}</span></p>
<p className={"location font32"}>商品位置:<span>{lossPosition}</span></p>
<p className={"status font32"}>商品状态:<span>{packingStatus}</span></p>
</div>
<div className={"damageImgs clearfix"}>
<ImgToolComponent noCloseBtn={true} type={"custom"} imgSrc = { require('./img/lol.gif')} ></ImgToolComponent>
......
client/components/ReportDamageListComponent/DamageItemComponent/index.css
......@@ -5,46 +5,50 @@
border-radius: 10px;
display: inline-block;
position: relative;
float: left;
background: #fff;
}
.damageProductItem .closeBtn{
width: 32px;
height: 32px;
width: 56px;
height: 56px;
display: inline-block;
border-radius: 50%;
background-color: #fe785b;
font-weight: 500;
font-weight: bold;
color: #ffffff;
font-size: 26px;
line-height: 27px;
/* line-height: 28px; */
text-align: center;
position: absolute;
top: -16px;
right: -16px
top: -28px;
right: -28px;
}
.damageProductItem .productBaseInfo{
border-bottom: 1px dashed #e5e5e5;
border-bottom: 2px dashed #e5e5e5;
padding-bottom: 30px;
}
.damageProductItem .productBaseInfo .productImg{
display: inline-block;
width: 200px;
height: 200px;
border: 1px solid #e5e5e5;
width: 198px;
height: 198px;
border: 2px solid #e5e5e5;
/*background-color: darkgoldenrod;*/
float: left;
}
.damageProductItem .productBaseInfo .baseNumber{
float: left;
width: 200px;
margin-left: 30px;
width: 315px;
margin: 0 30px;
width: 506px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.damageProductItem .productBaseInfo .baseNumber p{
margin-top: 8px;
font-size: 32px;
line-height: 44px;
color: #333333;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.damageProductItem .productBaseInfo .baseNumber .barcode{}
.damageProductItem .productBaseInfo .baseNumber .skuNumnber{}
......@@ -57,10 +61,11 @@
}
.damageProductItem .productBaseInfo .productCount{
display: inline-block;
padding-top: 140px;
float: right;
margin:0 20px 0 220px;
/*padding-top: 140px;*/
float: left;
/*margin:0 20px 0 220px;*/
box-sizing: border-box;
line-height: 198px;
}
.damageProductItem .productBaseInfo .productCount .multipleIcon{
font-size: 32px;
......@@ -73,8 +78,8 @@
font-size: 40px;
}
.damageProductItem .productOtherInfo{
margin-top: 16px;
width: 1080px;
margin-top: 24px;
width: 100%;
box-sizing: border-box;
}
.damageProductItem .productOtherInfo .locationAndStatusInfo{
......@@ -91,7 +96,7 @@
margin-left: 15px;
}
.damageProductItem .productOtherInfo .damageImgs{
margin-top: 40px;
margin-top: 32px;
}
.damageProductItem .productOtherInfo .damageImgs .imgItem {
width: 90px;
......
client/containers/ChooseTaskContainer/ChooseTaskContainer.jsx
import React from 'react';
import Button from '../../components/CommonComponent/ButtonComponent/ButtonComponent'
import HeaderComponent from '../../components/CommonComponent/HeaderComponent/HeaderComponent'
require('./index.css');
export default class ChooseTaskContainer extends React.Component{
constructor(props){
super(props);
this.state = {
}
};
this.closeDoor = this.closeDoor.bind(this);
}
componentWillMount(){
......@@ -17,10 +19,21 @@ export default class ChooseTaskContainer extends React.Component{
}
closeDoor(){
console.log("closeDoor")
this.props.showOpenDoorPage()
}
render(){
let {userInfo,storeInfo} = this.props;
return(
<div>
<HeaderComponent
showHeader={CONFIG.headerStatus[1]}
userinfo={userInfo}
storeInfo={storeInfo}
/>
<div className={"chooseTaskContainer"}>
<div className={"chooseTaskText font32"}>
<p>请选择一个有权限的任务！</p>
......@@ -30,9 +43,11 @@ export default class ChooseTaskContainer extends React.Component{
<Button text={"申报新故障"} style={{'marginTop':'20px'}}/>
<Button text={"设备检查"} style={{'marginTop':'20px'}}/>
<Button text={"设备测试"} style={{'marginTop':'20px'}}/>
<Button text={"确认退出，并离店"} style={{'marginTop':'87px'}}/>
<Button text={"确认退出，并离店"} style={{'marginTop':'87px'}} option={this.closeDoor}/>
</div>
</div>
</div>
)
}
}
......
client/containers/FinishAskContainer/FinishAskContainer.jsx
import React from 'react';
import Button from '../../components/CommonComponent/ButtonComponent/ButtonComponent'
import Clock from '../../components/CommonComponent/ClockComponent/ClockComponent'
import HeaderComponent from '../../components/CommonComponent/HeaderComponent/HeaderComponent'
require('./index.css');
export default class FinishAskContainer extends React.Component{
......@@ -8,31 +10,52 @@ export default class FinishAskContainer extends React.Component{
super(props);
this.state = {
}
this.closeDoor = this.closeDoor.bind(this);
this.selectTask = this.selectTask.bind(this);
}
componentWillMount(){
this.props.endCountBack()
}
componentWillReceiveProps(nextProps){
}
selectTask(){
console.log("selectTask")
let {changePages} = this.props;
changePages(CONFIG.showPage[9])
}
closeDoor(){
console.log("closeDoor")
this.props.showOpenDoorPage();
}
render(){
let {userInfo,storeInfo} = this.props;
return(
<div>
<HeaderComponent
showHeader={CONFIG.headerStatus[1]}
userinfo={userInfo}
storeInfo={storeInfo}
/>
<div className={"finishAskContainer"}>
<div className={"finishAskText font32"}>
<p>感谢您的故障问题处理工作！</p>
<p>您是否有其它任务</p>
</div>
<div className={"finishAskButtons"}>
<Button text={"有"} style={{'marginTop':'120px'}}/>
<Button text={"没有"} style={{'marginTop':'40px'}}/>
<Clock style={{'marginTop':'40px'}}/>
<Button text={"有"} style={{'marginTop':'120px'}} option={this.selectTask}/>
<Button text={"没有"} style={{'marginTop':'40px'}} option={this.closeDoor}/>
<Clock style={{'marginTop':'40px'}} totalTime={60}
callback={this.closeDoor}/>
</div>
</div>
</div>
)
}
}
......
client/containers/HomeContainer/HomeContainer.jsx
......@@ -22,7 +22,7 @@ export default class HomeContainer extends React.Component{
render(){
let props = this.props;
let {userInfo,storeInfo} = props;
let {userInfo,storeInfo,judgeDoorStatus} = props;
return(
<div>
<HeaderComponent
......@@ -39,7 +39,8 @@ export default class HomeContainer extends React.Component{
<p>关门倒数，请尽快离开店铺</p>
<p>请在离开前再次确保没有遗留个人物品在设备内</p>
</div>
<Clock totalTime={60}/>
<Clock totalTime={60}
callback={judgeDoorStatus}/>
</div> : null
}
</div>
......
client/containers/PageContainer/PageContainer.jsx
......@@ -44,13 +44,14 @@ class PageContainer extends React.Component {
constructor(props) {
super(props);
this.state = {
showPage : initPage,
showPage : showPage[3],
lastPage : '',
page : null,
popupInfo : defaultPopupInfo,
showClock : false, //关门页面显示倒计时
headerInfo : {},
pageStyle : {}
pageStyle : {},
successCloseDoor : false
};
this.getPages = this.getPages.bind(this); //获取当前页面
this.showPopup = this.showPopup.bind(this); //显示弹窗
......@@ -134,6 +135,9 @@ class PageContainer extends React.Component {
let info = JSON.parse(data.info);
console.log("SUCCESS_OPENDOOR " ,info);
dispatch(getUserinfo(info));
this.setState({
successCloseDoor : false
});
break;
case 'SUCCESS_CLOSEDOOR':
//关门成功
......@@ -143,7 +147,8 @@ class PageContainer extends React.Component {
this.setState({
showPage : showPage[7],
showClock : false,
popupInfo : defaultPopupInfo
popupInfo : defaultPopupInfo,
successCloseDoor : true
});
break;
}
......@@ -326,7 +331,12 @@ class PageContainer extends React.Component {
judgeDoorStatus(){
//成功关门
//关门失败
this.failCloseDoor()
// this.emptyUser();
// this.failCloseDoor()
if(!this.state.successCloseDoor){
//关门失败，上传警报
this.failCloseDoor();
}
}
playAlarmMusic(){
......@@ -360,6 +370,13 @@ class PageContainer extends React.Component {
}
showOpenDoorPage(){
console.log("showOpenDoorPage")
this.setState({
showPage : initPage,
showClock : true
})
}
getPages(){
......@@ -414,14 +431,24 @@ class PageContainer extends React.Component {
break;
case showPage[7]:
pages = <HomeContainer showClock={this.state.showClock} storeInfo={state.storeInfo}
userInfo={state.userInfo}/>;
userInfo={state.userInfo}
judgeDoorStatus={this.judgeDoorStatus}
/>;
break;
case showPage[8]:
pages = <FinishAskContainer />;
pages = <FinishAskContainer storeInfo={state.storeInfo}
userInfo={state.userInfo}
endCountBack={this.endCountBack}
changePages={(data)=>this.changePages(data)}
showOpenDoorPage={()=>this.showOpenDoorPage.bind(this)()}
/>;
break;
case showPage[9]:
pages = <ChooseTaskContainer storeInfo={state.storeInfo}
userInfo={state.userInfo}/>;
userInfo={state.userInfo}
changePages={(data)=>this.changePages(data)}
showOpenDoorPage={()=>this.showOpenDoorPage.bind(this)()}
/>;
break;
}
return pages;
......
client/containers/ReportDamagesListContainer/ReportDamagesListContainer.jsx
......@@ -45,7 +45,7 @@ export default class ReportDamagesListContainer extends React.Component{
});
}
let swiperOptions = {
width : 1396,
width : 987,
spaceBetween: 30,
freeMode:true,
// slidesPerView: 2.6,
......@@ -61,7 +61,7 @@ export default class ReportDamagesListContainer extends React.Component{
storeInfo={storeInfo}
/>
<div className={"damageTitleContainer"}>故障相关报损商品(非货架区)</div>
<div className={"damageProductList clearfix"}>
<div className={"damageProductList"}>
<SwiperComponent
swiperContainer={swiperContainer} swiperOptions={swiperOptions} swiperCount={swiperCount}
>
......
client/containers/ReportDamagesListContainer/index.css
......@@ -9,7 +9,9 @@
line-height: 25px;
font-size: 25px;
}
.ReportDamagesListContainer .damageProductList{}
.ReportDamagesListContainer .damageProductList{
padding-left: 30px;
}
.ReportDamagesListContainer .damageSwiperContainer{
overflow: visible;
}
......
client/containers/TextAreaContainer/TextAreaContainer.jsx
......@@ -26,17 +26,14 @@ export default class TextAreaContainer extends React.Component{
}
handleBlur(){
console.log("--handleBlur--");
this.props.setStyle({
'position':'absolute',
'top':'0px'
})
this.props.setStyle({})
}
handleFocus(){
console.log("==handleFocus==");
this.props.setStyle({
'position':'absolute',
'top':'120px'
'top':'0px'
})
}
......
client/containers/TroubleContainer/TroubleContainer.jsx
......@@ -218,9 +218,9 @@ export default class TroubleContainer extends React.Component{
}
setStyle(style){
// this.setState({
// style : style
// })
this.setState({
style : style
})
}
getTextAreaDom(){
......@@ -252,7 +252,7 @@ export default class TroubleContainer extends React.Component{
render(){
return (
<div className={"troubleContainers "+(this.state.showStatus === showDom[2] ? 'backfff' : '')}>
<div className={"troubleContainers "+(this.state.showStatus === showDom[2] ? 'backfff' : '')} style={this.state.style}>
{
this.getDom()
}
......
client/css/common.css
......@@ -5,6 +5,8 @@
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently*/
position: relative;
height: 100%;
}
div{
touch-action: none;
......
client/css/font.css
......@@ -135,6 +135,18 @@ body{
[data-dpr="3"] .font44 {
font-size: calc(var(--font3) * font44) !important;
}
.font50 {
font-size: font50 !important;
}
[data-dpr="2"] .font50 {
font-size: calc(var(--font2) * font50) !important;
}
[data-dpr="3"] .font50 {
font-size: calc(var(--font3) * font50) !important;
}
.font58 {
font-size: font58 !important;
}
......
client/css/reset.css
......@@ -26,7 +26,7 @@ button, input, select, textarea { /* for ie */
outline: none;
}
html, body {
/*height: 100%;*/
height: 100%;
background-color: #f5f5f5;
}
......
client/env/development.js
......@@ -2,6 +2,6 @@
* Created by ruibing on 16/11/2.
*/
module.exports = {
domain: 'http://test.mjitech.com/web/',
uploadImg : 'https://test.mjitech.com/static/uploadTrouble/'
domain: 'http://preprod.mjitech.com/web/',
uploadImg : 'https://preprod.mjitech.com/static/uploadTrouble/'
}
\ No newline at end of file
client/index.html
......@@ -2,8 +2,8 @@
<html>
<head>
<meta charset="UTF-8">
<title>怪兽家便利店</title>
<meta name='viewport' content='width=device-width, initial-scale=0.67, maximum-scale=0.67, user-scalable=false,target-densitydpi=device-dpi'/>
<title>华沁工作平台</title>
<meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=false,target-densitydpi=device-dpi'/>
<meta name="format-detection" content="telephone=no"/>
</head>
......
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