收银程序横屏兼容

src/components/HomeLayout.js

@@ -2,6 +2,7 @@ import React, {Component} from 'react';
 import {Dimensions, Image, Text, View} from 'react-native';
 import {appName} from '../utils/config';
 import {setSpText, scaleSize} from '../utils/screen';
+const {width, height} = Dimensions.get('window');
 
 class HomeLayout extends Component {
   render() {
@@ -30,7 +31,7 @@ const LandscapeStyles = {
     top: 0,
     paddingLeft: scaleSize(50),
     flexDirection: 'row',
-    height: scaleSize(110), // 修改了这里
+    height: scaleSize(width > height ? height * 0.12 : height * 0.2), // 修改了这里
     width: '100%',
     position: 'absolute',
     backgroundColor: 'white',
@@ -85,8 +86,6 @@ const portraitStyles = {
   },
 };
 
-const {width, height} = Dimensions.get('window');
-
 const isLandscape = width > height;
 
 const styles = isLandscape ? LandscapeStyles : portraitStyles;

src/pages/AuthPage.js

@@ -7,6 +7,7 @@ import {counterLogin} from '../utils/authLogin';
 import config from '../utils/config';
 import HomeLayout from '../components/HomeLayout';
 import {setSpText, scaleSize} from '../utils/screen';
+const {width, height} = Dimensions.get('window');
 
 class AuthPage extends Component {
   state = {
@@ -14,7 +15,6 @@ class AuthPage extends Component {
   };
 
   async componentDidMount() {
-    const {width, height} = Dimensions.get('window');
     this.setState({isLandscape: width > height});
     this.socket = io(axios.defaults.baseURL);
     this.socket.on('storeAuth', this.handleLogin);
@@ -34,11 +34,12 @@ class AuthPage extends Component {
 
   render() {
     const {socket, isLandscape} = this.state;
+    console.warn(width, height);
     return (
       <HomeLayout>
         <View style={styles.qrcode}>
           <QRCode
-            size={isLandscape ? scaleSize(320) : scaleSize(700)}
+            size={isLandscape ? scaleSize(height * 0.35) : scaleSize(700)}
             logo={require('../assets/logo.png')}
             backgroundColor="white"
             value={`${config.qrHost}/#/store-auth-${socket}`}

src/pages/CounterMixins.js

@@ -804,6 +804,7 @@ const CounterMixins = ComposeComponent => {
         return;
       }
       barcode = barcode || this.barcode;
+      console.warn(barcode);
       if (isNaN(barcode.substring(0, 4))) {
         const msg = '请遮住条码旁边的二维码，再重新扫条码';
         this.setState({voiceModal: true, voiceTitle: msg});