Skip to content

M
max_android_panel
Commit f3304357 by Zhang Xin
Options

fix rem bug

parent 5b862bed
Showing with 83 additions and 30 deletions
client/components/CommonComponent/ButtonComponent/index.css
......@@ -14,7 +14,7 @@
.buttonComponent{
width: 2.3333333333333335rem;
height: 0.6666666666666666rem;
border: 2px solid #e5e5e5;
border: 2px solid transparent;
background-color: #ffffff;
line-height: 0.6666666666666666rem;
text-align: center;
......
client/components/CommonComponent/SkuInfoComponent/index.css
......@@ -8,6 +8,9 @@
/*.skuInfoComponent .shelfInfo{*/
/*line-height: 50px;*/
/*flex: 1;*/
/*white-space: nowrap;*/
/*overflow: hidden;*/
/*text-overflow: ellipsis;*/
/*}*/
/*.skuInfoComponent .img{*/
/*width: 200px;*/
......@@ -39,6 +42,9 @@
.skuInfoComponent .shelfInfo{
line-height: 0.4166666666666667rem;
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.skuInfoComponent .img{
width: 1.6666666666666667rem;
......
client/components/RecoveryComponent/RecoverySecondPage/RecoverySecondPage.jsx
......@@ -39,7 +39,7 @@ export default class RecoverySecondPage extends React.Component{
wrongSku(){
//货道商品不符
let {showPopup,hidePopup} = this.props;
let btnDom1 = <Button btnContainer={"recoveryPopInfoWrongSkuBtn1 font32"} key={"recoveryContainerShelfWrong1"} text={"货品不符"} option={this.uploadWrongSku}/>
let btnDom1 = <Button btnContainer={"recoveryPopInfoWrongSkuBtn1 font32 bordere5e5e5"} key={"recoveryContainerShelfWrong1"} text={"货品不符"} option={this.uploadWrongSku}/>
let btnDom2 = <Button btnContainer={"recoveryPopInfoWrongSkuBtn2 backff775c colfff font32"} key={"recoveryContainerShelfWrong2"} text={"关闭窗口"} option={hidePopup}/>
let popDom =
<PopModel popupTitle={"遇到问题-货品不符"} classContainer={"recoveryPopInfo"}>
......
client/components/ReplenishComponent/ReplenishScanPage/ReplenishScanPage.jsx
......@@ -123,10 +123,16 @@ export default class ReplenishScanPage extends React.Component{
getOtherHeader(){
let {headerInfo} = this.props;
let {taskInfo={}} = headerInfo;
let btnStyle = {
display: 'inline-block',
float: 'right',
transform: 'translateY(20%)',
position: 'relative'
};
return <div className={"otherHeader replenishScanQrcodeHeader font32 clearfix colfff "}>
<i className={"iconfont middle icon font50 icon-circle-left circleIcon fl"} onClick={()=>this.goBack.bind(this)(1)}/>
<span className={"middle"}>任务目标：将{taskInfo.area || ""}区补货箱中的货品扫码后放到货架上</span>
<Button btnContainer={"barcodeInputBarcode font32 backff775c colfff"} key={"barcodeInputBarcode"} style={{display:'inline-block'}} text={"扫描结束"} option={this.handleScanOver}/>
<Button btnContainer={"barcodeInputBarcode font32 backff775c colfff"} key={"barcodeInputBarcode"} style={btnStyle} text={"扫描结束"} option={this.handleScanOver}/>
</div>
}
......
client/components/ReplenishComponent/ReplenishSkuPage/ReplenishSkuPage.jsx
......@@ -71,7 +71,7 @@ export default class ReplenishSkuPage extends React.Component{
{this.getSkuInfo()}
<div className={"btn pageBtn"}>
<div className={"tips colff775c font30"} onClick={()=>this.getPage(2)}>遇到问题？</div>
<Button btnContainer={"replenishPageBtn1 font32"} key={"replenishPageBtn1"} text={'扫描工作结束'} option={this.handleScanOver}/>
<Button btnContainer={"replenishPageBtn1 font32 bordere5e5e5"} key={"replenishPageBtn1"} text={'补货工作结束'} option={this.handleScanOver}/>
<Button btnContainer={"replenishPageBtn2 font32 colfff backff775c"} key={"replenishPageBtn2"} text={'扫描下一个'} option={this.handleScanQrcode}/>
</div>
</div>
......@@ -83,7 +83,7 @@ export default class ReplenishSkuPage extends React.Component{
console.log("扫描结束")
//货道商品不符
let {showPopup,hidePopup} = this.props;
let btnDom1 = <Button btnContainer={"replenishHandleScanOverBtn1 font32"} key={"replenishHandleScanOverBtn1"} text={"继续扫描"} option={hidePopup}/>
let btnDom1 = <Button btnContainer={"replenishHandleScanOverBtn1 font32 bordere5e5e5"} key={"replenishHandleScanOverBtn1"} text={"继续扫描"} option={hidePopup}/>
let btnDom2 = <Button btnContainer={"replenishHandleScanOverBtn2 backff775c colfff font32"} key={"replenishHandleScanOverBtn2"} text={"确认扫描完毕"} option={this.scanOver}/>
let popDom =
<PopModel popupTitle={"补货结束确认"} classContainer={"replenishPopInfo"}>
......@@ -167,9 +167,9 @@ export default class ReplenishSkuPage extends React.Component{
<div className={"pagebox"}>
<div className={"btn pageBtn"}>
<div className={"tips col000 font40"}>补货过程中您是否遇到了如下问题？</div>
<Button btnContainer={"replenishQuestionPageBtn1 replenishQuestionPageBtn font32"} key={"replenishQuestionPageBtn1"} text={'种类不符'} option={()=>this.getPage(3)}/>
<Button btnContainer={"replenishQuestionPageBtn2 replenishQuestionPageBtn font32"} key={"replenishQuestionPageBtn2"} text={'货道已满'} option={()=>this.getPage(4)}/>
<Button btnContainer={"replenishQuestionPageBtn3 replenishQuestionPageBtn font32"} key={"replenishQuestionPageBtn3"} text={'货品损坏'} option={()=>this.getPage(5)}/>
<Button btnContainer={"replenishQuestionPageBtn1 replenishQuestionPageBtn font32 bordere5e5e5"} key={"replenishQuestionPageBtn1"} text={'种类不符'} option={()=>this.getPage(3)}/>
<Button btnContainer={"replenishQuestionPageBtn2 replenishQuestionPageBtn font32 bordere5e5e5"} key={"replenishQuestionPageBtn2"} text={'货道已满'} option={()=>this.getPage(4)}/>
<Button btnContainer={"replenishQuestionPageBtn3 replenishQuestionPageBtn font32 bordere5e5e5"} key={"replenishQuestionPageBtn3"} text={'货品损坏'} option={()=>this.getPage(5)}/>
</div>
</div>
</div>
......@@ -179,6 +179,7 @@ export default class ReplenishSkuPage extends React.Component{
getWrongSku(){
let {headerInfo,showPopup,hidePopup} = this.props;
let {taskList={},taskInfo={}} = headerInfo;
let marginTop = UTILPATH.getRemByPx(20)
return(
<div className={"replenishWrongSkuPage commonPage"}>
<div className={"title font40 col333 pageTitle"}>
......@@ -187,15 +188,15 @@ export default class ReplenishSkuPage extends React.Component{
</div>
<div className={"pagebox"}>
<div className={"wrongSkuIcon"}>
<i className={"iconfont icon-exclamation font150 colf5a623"} />
<i className={"iconfont icon-exclamation font110 colf5a623"} />
</div>
<div className={"tips col000 font40"}>请再次仔细确认货道中的货品是否相符？</div>
<div className={"skuInfo"}>
<div className={"text font28 col333"}>待补货品信息：</div>
<SkuInfoComponent showPopup={showPopup} hidePopup={hidePopup} style={{display:"flex",marginTop:"20px",padding:"0"}} skuInfo={taskList} />
<SkuInfoComponent showPopup={showPopup} hidePopup={hidePopup} style={{display:"flex",marginTop:marginTop,padding:"0"}} skuInfo={taskList} />
</div>
<div className={"btn pageBtn"}>
<Button btnContainer={"replenishWrongSkuBtn backff775c colfff font32"} key={"replenishWrongSkuBtn"} text={'货品不符'} option={this.handleWrongSkuQuestion}/>
<Button btnContainer={"replenishWrongSkuBtn backff775c colfff font32 bordere5e5e5"} key={"replenishWrongSkuBtn"} text={'货品不符'} option={this.handleWrongSkuQuestion}/>
</div>
</div>
</div>
......@@ -205,6 +206,7 @@ export default class ReplenishSkuPage extends React.Component{
overflowShelf(){
let {headerInfo,showPopup,hidePopup} = this.props;
let {taskList={}} = headerInfo;
let marginTop = UTILPATH.getRemByPx(20)
return(
<div className={"replenishOverflowShelfPage replenishWrongSkuPage commonPage"}>
<div className={"title font40 col333 pageTitle"}>
......@@ -213,12 +215,12 @@ export default class ReplenishSkuPage extends React.Component{
</div>
<div className={"pagebox"}>
<div className={"wrongSkuIcon"}>
<i className={"iconfont icon-exclamation font150 colf5a623"} />
<i className={"iconfont icon-exclamation font110 colf5a623"} />
</div>
<div className={"tips col000 font40"}>请再次仔细确认货道中是否已放满货品</div>
<div className={"skuInfo"}>
<div className={"text font28 col333"}>待补货品信息：</div>
<SkuInfoComponent showPopup={showPopup} hidePopup={hidePopup} style={{display:"flex",marginTop:"20px",padding:"0"}} skuInfo={taskList}/>
<SkuInfoComponent showPopup={showPopup} hidePopup={hidePopup} style={{display:"flex",marginTop:marginTop,padding:"0"}} skuInfo={taskList}/>
</div>
<div className={"btn pageBtn"}>
<Button btnContainer={"replenishWrongSkuBtn backff775c colfff font32"} key={"replenishWrongSkuBtn"} text={'货道已满'} option={this.handleOverflowShelfQuestion}/>
......@@ -231,6 +233,7 @@ export default class ReplenishSkuPage extends React.Component{
getBadSku(){
let {headerInfo} = this.props;
let {taskList={}} = headerInfo;
let marginTop = UTILPATH.getRemByPx(20)
return(
<div className={"replenishBadSkuPage replenishWrongSkuPage commonPage"}>
<div className={"title font40 col333 pageTitle"}>
......@@ -239,12 +242,12 @@ export default class ReplenishSkuPage extends React.Component{
</div>
<div className={"pagebox"}>
<div className={"wrongSkuIcon"}>
<i className={"iconfont icon-exclamation font150 colf5a623"} />
<i className={"iconfont icon-exclamation font110 colf5a623"} />
</div>
<div className={"tips col000 font40"}>此货品是否已经损坏，不能进行售卖</div>
<div className={"skuInfo"}>
<div className={"text font28 col333"}>待补货品信息：</div>
<SkuInfoComponent style={{display:"flex",marginTop:"20px",padding:"0"}} skuInfo={taskList}/>
<SkuInfoComponent style={{display:"flex",marginTop:marginTop,padding:"0"}} skuInfo={taskList}/>
</div>
<div className={"btn pageBtn"}>
<Button btnContainer={"replenishWrongSkuBtn backff775c colfff font32"} key={"replenishWrongSkuBtn"} text={'是的'} option={this.handleBadSkuQuestion}/>
......@@ -261,7 +264,7 @@ export default class ReplenishSkuPage extends React.Component{
let btnDom1 = <Button btnContainer={"replenishQuestionPopupBtn font32 backff775c colfff "} key={"replenishQuestionPopupBtn2"} text={"已放回"} option={()=>this.putInBox(CONFIG.taskErrorType.WRONGSKU)}/>
let popDom =
<PopModel popupTitle={"遇到问题-货品不符解决办法"} classContainer={"replenishQuestionPopup"}>
<div className={"text font40 col000"}>
<div className={"text font30 col000"}>
<p>1、请将刚才扫描的货品转放到物流回收箱内带回</p>
<p>2、若{taskInfo.area || ""}区补货箱内还有此货品也都放到物流回收箱带回</p>
<p>3、放完后请开始补其他货品</p>
......@@ -279,7 +282,7 @@ export default class ReplenishSkuPage extends React.Component{
let btnDom1 = <Button btnContainer={"replenishQuestionPopupBtn font32 backff775c colfff "} key={"replenishQuestionPopupBtn1"} text={"已放回"} option={()=>this.putInBox(CONFIG.taskErrorType.OVERSHELF)}/>
let popDom =
<PopModel popupTitle={"遇到问题-货道已满解决办法"} classContainer={"replenishQuestionPopup"}>
<div className={"text font40 col000"}>
<div className={"text font30 col000"}>
<p>1、请将刚才扫描的货品转放到物流回收箱内带回</p>
<p>2、若{taskInfo.area || ""}区补货箱内还有此货品也都放到物流回收箱带回</p>
<p>3、继续扫描其它种类货品</p>
......@@ -296,7 +299,7 @@ export default class ReplenishSkuPage extends React.Component{
let btnDom1 = <Button btnContainer={"replenishQuestionPopupBtn font32 backff775c colfff "} key={"replenishQuestionPopupBtn1"} text={"已放回"} option={()=>this.putInBox(CONFIG.taskErrorType.BADSKU)}/>
let popDom =
<PopModel popupTitle={"遇到问题-货品破损解决办法"} classContainer={"replenishQuestionPopup"}>
<div className={"text font40 col000"} style={{textAlign:"center",paddingLeft:"0"}}>
<div className={"text font30 col000"} style={{textAlign:"center",paddingLeft:"0"}}>
<p>请将刚才扫描的货品放到物流回收箱内带回</p>
</div>
<div className={"btn"}>
......
client/containers/HomePageContainer/HomePageContainer.jsx
......@@ -18,7 +18,13 @@ export default class HomePageContainer extends React.Component{
let props = this.props;
let {headerInfo={}} = props;
let {taskInfo={}} = headerInfo;
let buttonStyle={background:'#ff775c',margin:"0 auto",marginTop:'77px'};
let marginTop = UTILPATH.getRemByPx(77);
let marginTop50 = UTILPATH.getRemByPx(50);
let marginTop20 = UTILPATH.getRemByPx(20);
let padding = UTILPATH.getRemByPx(8);
let marginTop160 = UTILPATH.getRemByPx(160);
let imgStyle = taskInfo.area ? {marginTop: marginTop160} : {};
let buttonStyle={background:'#ff775c',margin:"0 auto",marginTop:marginTop};
return(
<div>
<HeaderComponent
......@@ -26,12 +32,12 @@ export default class HomePageContainer extends React.Component{
headerInfo={headerInfo}
/>
<div className={"homeContainer"} >
<img className={"homeIcon"} src={UTILPATH.localImg.homePage} alt=""/>
<img className={"homeIcon"} style={imgStyle} src={UTILPATH.localImg.homePage} alt=""/>
{
taskInfo.area ? <div className={'homeWelcom font30 clo333'} style={{marginTop:'50px'}}>欢迎来到<span className="homeArea font50 colff775c" style={{padding:'0 8px'}}>{taskInfo.area || ''}</span>区</div>
taskInfo.area ? <div className={'homeWelcom font30 clo333'} style={{marginTop:marginTop50}}>欢迎来到<span className="homeArea font50 colff775c" style={{padding:`0 ${padding}`}}>{taskInfo.area || ''}</span>区</div>
: null
}
<div className={"homeText font42"} style={{fontWeight:'800',marginTop:'20px'}}>下午好, 你辛苦了！</div>
<div className={"homeText font42"} style={{fontWeight:'800',marginTop:marginTop20}}>下午好, 你辛苦了！</div>
<Button text={'开始工作'} btnContainer={'colfff font30'} style={buttonStyle} option={this.start.bind(this)}/>
</div>
</div>
......
client/containers/ReplenishContainer/index.css
......@@ -47,7 +47,7 @@
/*.replenishSkuInfo .skuInfo img{*/
/*width: 100%;*/
/*height: auto;*/
/*height: 100%;*/
/*}*/
......@@ -114,7 +114,7 @@
}
.replenishSkuInfo .skuInfo img{
width: 100%;
height: auto;
height: 100%;
}
.replenishSkuInfo .skuInfo .skuPos{
line-height: 0.38333333333333336rem;
......
client/css/color.css
......@@ -39,3 +39,6 @@
.backff775c{
background-color: #ff775c!important;
}
.bordere5e5e5{
border-color: #e5e5e5!important;
}
\ No newline at end of file
client/css/common.css
......@@ -50,17 +50,31 @@ body,.ant-modal-mask , .ant-modal-wrap ,.totalClass,.storeManagerQrcodeComponent
box-sizing: border-box;
transform: translateX(5%);
}
/*.commonPage .pageTitle{*/
/*width: 100%;*/
/*background: #e0e0e0;*/
/*line-height: 100px;*/
/*white-space: nowrap;*/
/*margin: 50px 0;*/
/*position: relative;*/
/*border-top-right-radius: 10px;*/
/*border-top-left-radius: 10px;*/
/*}*/
.commonPage .pageTitle{
width: 100%;
background: #e0e0e0;
/* border: 2px solid #e5e5e5; */
line-height: 100px;
/* border: 2px solid #e5e5e5;
*/
line-height: 0.8333333333333334rem;
white-space: nowrap;
margin: 50px 0;
margin: 0.4166666666666667rem 0;
position: relative;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 0.08333333333333333rem;
border-top-left-radius: 0.08333333333333333rem;
}
.commonPage .pagebox{
flex: 1;
width: 100%;
......
client/css/font.css
......@@ -29,6 +29,7 @@ body{
@value font70: 70px;
@value font90: 90px;
@value font100: 100px;
@value font110: 110px;
@value font150: 150px;
.font10 {
......@@ -255,6 +256,18 @@ body{
font-size: calc(var(--font3) * font100 * var(--base)) !important;
}
.font110 {
font-size: calc(font110 * var(--base)) !important;
}
[data-dpr="2"] .font110 {
font-size: calc(var(--font2) * font110 * var(--base)) !important;
}
[data-dpr="3"] .font110 {
font-size: calc(var(--font3) * font110 * var(--base)) !important;
}
.font150 {
font-size: calc(font150 * var(--base)) !important;
}
......
client/env/development.js
......@@ -2,6 +2,6 @@
* Created by ruibing on 16/11/2.
*/
module.exports = {
domain: 'http://192.168.10.128:8080/web/',
domain: 'http://192.168.10.88:8080/maxbox/web/',
uploadImg : 'https://preprod.mjitech.com/static/uploadTrouble'
}
\ No newline at end of file
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