Skip to content

B
bh_face_counter
Commit 019af583 by zeven
Options

人脸识别或出店失败出现二维码扫码

parent 85c3f209
Showing with 105 additions and 30 deletions
package.json
{
"name": "zm-face-counter",
"version": "1.1.1",
"version": "1.1.2",
"private": true,
"scripts": {
"android": "react-native run-android",
......
src/components/TipsModal.js
import React, {Component} from 'react';
import {Modal, View, Text, Image} from 'react-native';
import {Modal, View, Text, Image, Dimensions} from 'react-native';
import QRCode from 'react-native-qrcode-svg';
import ModalStyles from './Modal/styles';
import {font} from '../utils/common';
import {scaleSize, setSpText} from '../utils/screen';
......@@ -16,9 +17,11 @@ const mStyles = {
},
};
const {width, height} = Dimensions.get('window');
class TipsModal extends Component {
render() {
const {
let {
tip,
title,
leftText,
......@@ -26,6 +29,8 @@ class TipsModal extends Component {
leftTouch,
rightTouch,
faceType,
qrCode,
onMaskPress,
...props
} = this.props;
if (faceType === 'alipay') {
......@@ -42,6 +47,11 @@ class TipsModal extends Component {
return (
<Modal styles={mStyles} {...props}>
<View style={styles.modalBackgroundStyle}>
<Touch
style={styles.mask}
onPress={() => onMaskPress && onMaskPress()}>
<View />
</Touch>
<View style={styles.modal}>
<View style={styles.header}>
<Image
......@@ -52,16 +62,34 @@ class TipsModal extends Component {
<Text style={styles.title}>{title}</Text>
</View>
<View style={styles.container}>
<Text style={styles.tip}>{tip}</Text>
</View>
<View style={styles.footer}>
<Touch style={styles.left} onPress={() => leftTouch()}>
<Text style={styles.call}>{leftText}</Text>
</Touch>
<Touch style={styles.right} onPress={() => rightTouch()}>
<Text style={styles.reset}>{rightText}</Text>
</Touch>
{qrCode && (
<View style={styles.qrcode}>
<QRCode
logoSize={50}
// logoBackgroundColor="#fc4000"
logo={require('../assets/logo2.png')}
size={250}
value={qrCode}
/>
</View>
)}
<Text
ellipsizeMode="tail"
numberOfLines={qrCode ? 1 : 3}
style={styles.tip}>
{tip}
</Text>
</View>
{!qrCode && (
<View style={styles.footer}>
<Touch style={styles.left} onPress={() => leftTouch()}>
<Text style={styles.call}>{leftText}</Text>
</Touch>
<Touch style={styles.right} onPress={() => rightTouch()}>
<Text style={styles.reset}>{rightText}</Text>
</Touch>
</View>
)}
</View>
</View>
</Modal>
......@@ -74,6 +102,11 @@ const styles = {
flex: 1,
backgroundColor: 'rgba(0, 0, 0, 0.5)',
},
mask: {
width,
height,
position: 'absolute',
},
modal: {
height: '35%',
width: '80%',
......@@ -91,6 +124,10 @@ const styles = {
borderTopLeftRadius: 20,
borderTopRightRadius: 20,
},
qrcode: {
marginTop: 110,
marginBottom: 10,
},
image: {
width: scaleSize(60),
height: scaleSize(60),
......@@ -103,7 +140,7 @@ const styles = {
},
container: {
flex: 0.45,
flexDirection: 'row',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
padding: scaleSize(60),
......
src/pages/FacePage.js
......@@ -18,6 +18,7 @@ import {onTalkCall, leaveTalkCall} from '../utils/agora';
import Toast from '../components/Toast';
import Screensaver from '../components/Screensaver';
import {width, setSpText, scaleSize} from '../utils/screen';
import {qrHost} from '../utils/config';
class FacePage extends Component {
state = {
......@@ -35,6 +36,7 @@ class FacePage extends Component {
faceType: 'wxpay',
sleep: true,
loadingModal: false,
qrCode: '',
};
async componentWillMount() {
......@@ -139,7 +141,10 @@ class FacePage extends Component {
}
};
doorOpen = () => {
doorOpen = ({action}) => {
this.action = action;
if (action === '进店') this.action = 'leave';
else if (action === '出店') this.action = 'enter';
this.loading(false);
this.wakeUp();
};
......@@ -214,26 +219,38 @@ class FacePage extends Component {
let tipText = ret.msg;
Speech.speak(tipText);
this.userId = ret.userId;
this.setState({tip: tipText, tipsModal: true, loadingModal: false});
if (ret.code === 401) {
// 需要验证手机号
this.setState({
phoneModal: true,
loadingModal: false,
});
} else if (ret.orders && ret.orders.length > 0) {
let goodsArr = [];
ret.orders.map(v1 => {
v1.goods.map(v2 => {
goodsArr.push(v2);
});
});
return;
}
// else if (ret.orders && ret.orders.length > 0) {
// // 有购物订单
// let goodsArr = [];
// ret.orders.map(v1 => {
// v1.goods.map(v2 => {
// goodsArr.push(v2);
// });
// });
// this.setState({
// orderDetailsModal: true,
// loadingModal: false,
// goodsArr,
// customerPhone: ret.phone || '0000',
// current: 1,
// });
// }
if (ret.action && !/您没有进店信息/.test(tipText)) {
this.setQrcode({action: ret.action, tip: tipText});
} else {
this.setState({
orderDetailsModal: true,
tip: tipText,
tipsModal: true,
loadingModal: false,
goodsArr,
customerPhone: ret.phone || '0000',
current: 1,
qrCode: null,
});
}
} else if (ret.msg) {
......@@ -248,6 +265,18 @@ class FacePage extends Component {
}
};
setQrcode = ({action, tip}) => {
const state = {
qrCode: `${qrHost}/#/store-${action}-j${this.storeKey}`,
};
if (tip) {
state.tip = tip;
state.tipsModal = true;
state.loadingModal = false;
}
this.setState(state);
};
authinfo = async () => {
const rawdata = await WxFacepay.rawdata();
const {data} = await this.props.dispatch({
......@@ -261,8 +290,9 @@ class FacePage extends Component {
wechatFace = async () => {
const {orderDetailsModal, tipsModal} = this.state;
if (orderDetailsModal || tipsModal) {
// 出现订单弹窗，不做人脸识别
return;
} // 出现订单弹窗，不做人脸识别
}
const tipText = '正在人脸识别，请看向屏幕，靠中间站稳';
Speech.speak(tipText);
// this.setState({tip: tipText, tipsModal: true});
......@@ -285,7 +315,10 @@ class FacePage extends Component {
let res = (await WxFacepay.faceinfo(params)) || {};
if (!res.openid) {
// 返回错误自动重新识别
res = (await WxFacepay.faceinfo(params)) || {};
// res = (await WxFacepay.faceinfo(params)) || {};
// 返回错误出现二维码扫码
Speech.speak('请扫码开门');
this.setQrcode({action: this.action, tip: '请扫码开门'});
}
if (window.socket) {
// 返回结果，立即重新连接socket
......@@ -336,6 +369,8 @@ class FacePage extends Component {
const res = await Smilepay.verify(JSON.parse(data.data));
if (res.code !== '1000') {
Toast.show(res.msg);
Speech.speak('请扫码开门');
this.setQrcode({action: this.action, tip: '请扫码开门'});
return;
}
this.loading(true);
......@@ -428,6 +463,7 @@ class FacePage extends Component {
sleep,
faceType,
loadingModal,
qrCode,
} = this.state;
let {dispatch} = this.props;
if (faceType === 'alipay') {
......@@ -473,12 +509,14 @@ class FacePage extends Component {
<TipsModal
visible={tipsModal}
transparent
title={'操作失败'}
title={'开门失败'}
tip={tip}
qrCode={qrCode}
leftText={'呼叫客服'}
rightText={'重新识别'}
leftTouch={this.onCall}
rightTouch={this.closeTips}
onMaskPress={() => this.setState({tipsModal: false})}
faceType={faceType}
/>
<LoadingModal transparent visible={loadingModal} />
......
src/utils/config.js
......@@ -2,7 +2,7 @@ const app = ''; // eg: .25h/.eg
export const isProd = process.env.NODE_ENV === 'production';
export const host = isProd
? `https://api${app}.vs-u.com`
: 'http://192.168.1.88:7001';
: 'http://192.168.88.88:7001';
export const login = `https://m${app}.vs-u.com`;
export const qrHost = login;
export const imgUrl = 'http://barcod.oss-cn-shenzhen.aliyuncs.com/images/';
......
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