罗广聪 / ProtectGod

Go to a project
Toggle navigation Toggle navigation pinning
Phecda
c0fe9763 1 parent 52f8bef6

健康问卷（未接入接口）

Inline Side-by-side
Showing 10 changed files with 365 additions and 291 deletions
{
"env": {
"browser": true,
"es6": true,
"node": true
},
"extends": [
"eslint:recommended",
"plugin:react/recommended"
],
"parserOptions": {
"ecmaFeatures": {
"experimentalObjectRestSpread": true,
"jsx": true
},
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
"indent": [
"error",
2,
{
"SwitchCase": 1
}
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"single"
],
"semi": [
"error",
"always",
{
"omitLastInOneLineBlock": true
}
],
"react/prop-types": 0
}
}
\ No newline at end of file
... ...
... ... @@ -21,9 +21,7 @@ import Discover from "./src/pages/Discover/index";
import AIBegin from "./src/pages/Home/AISolution/Begin";
import AIQuestion from "./src/pages/Home/AISolution/Question";
import AISolution from "./src/pages/Home/AISolution/Solution";
import HealthBegin from "./src/pages/Home/HealthQuestionnaire/HealthBegin";
import HealthQuestion from "./src/pages/Home/HealthQuestionnaire/HealthQuestion";
import HealthResult from "./src/pages/Home/HealthQuestionnaire/HealthResult";
import HealthQuestionnaire from "./src/pages/Home/healthQuestionnaire";
// 底部导航栏配置，但也只是作为一个页面，加载到StackNavigator成为第一个页面
const MainTabBar = TabNavigator(
... ... @@ -36,8 +34,8 @@ const MainTabBar = TabNavigator(
focused ? (
<Image source={require("./src/assets/tabbar/ic_home_s.png")} />
) : (
<Image source={require("./src/assets/tabbar/ic_home_n.png")} />
)
<Image source={require("./src/assets/tabbar/ic_home_n.png")} />
)
}
},
InsuranceCircle: {
... ... @@ -48,8 +46,8 @@ const MainTabBar = TabNavigator(
focused ? (
<Image source={require("./src/assets/tabbar/ic_circle_s.png")} />
) : (
<Image source={require("./src/assets/tabbar/ic_circle_n.png")} />
)
<Image source={require("./src/assets/tabbar/ic_circle_n.png")} />
)
}
},
Discover: {
... ... @@ -62,8 +60,8 @@ const MainTabBar = TabNavigator(
focused ? (
<Image source={require("./src/assets/tabbar/ic_discover_s.png")} />
) : (
<Image source={require("./src/assets/tabbar/ic_discover_n.png")} />
)
<Image source={require("./src/assets/tabbar/ic_discover_n.png")} />
)
}
},
InsuranceChurch: {
... ... @@ -74,8 +72,8 @@ const MainTabBar = TabNavigator(
focused ? (
<Image source={require("./src/assets/tabbar/ic_umbrella_s.png")} />
) : (
<Image source={require("./src/assets/tabbar/ic_umbrella_n.png")} />
)
<Image source={require("./src/assets/tabbar/ic_umbrella_n.png")} />
)
}
},
Mine: {
... ... @@ -86,8 +84,8 @@ const MainTabBar = TabNavigator(
focused ? (
<Image source={require("./src/assets/tabbar/ic_mine_s.png")} />
) : (
<Image source={require("./src/assets/tabbar/ic_mine_n.png")} />
)
<Image source={require("./src/assets/tabbar/ic_mine_n.png")} />
)
}
}
},
... ... @@ -127,18 +125,10 @@ const ProtectGod = StackNavigator(
screen: AISolution,
navigationOptions: { headerTitle: "智能方案" }
},
HealthBegin: {
screen: HealthBegin,
HealthQuestionnaire: {
screen: HealthQuestionnaire,
navigationOptions: { headerTitle: "健康问卷" }
},
HealthQuestion: {
screen: HealthQuestion,
navigationOptions: { headerTitle: "健康问卷" }
},
HealthResult: {
screen: HealthResult,
navigationOptions: { headerTitle: "健康问卷" }
},
}
},
{
navigationOptions: {
... ...
{
"name": "ProtectGod",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.0.0-alpha.12",
"react-native": "0.48.1",
"react-native-swiper": "^1.5.11",
"react-navigation": "^1.0.0-beta.11"
},
"devDependencies": {
"babel-jest": "20.0.3",
"babel-preset-react-native": "3.0.2",
"jest": "20.0.4",
"react-test-renderer": "16.0.0-alpha.12"
},
"jest": {
"preset": "react-native"
}
"name": "ProtectGod",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.0.0-alpha.12",
"react-native": "0.48.1",
"react-native-swiper": "^1.5.11",
"react-navigation": "^1.0.0-beta.11"
},
"devDependencies": {
"babel-jest": "20.0.3",
"babel-preset-react-native": "3.0.2",
"eslint": "^4.7.2",
"eslint-plugin-react": "^7.4.0",
"jest": "20.0.4",
"react-test-renderer": "16.0.0-alpha.12"
},
"jest": {
"preset": "react-native"
}
}
... ...
import React, { Component } from "react";
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
TouchableOpacity,
ScrollView,
ListView,
Dimensions,
DatePickerIOS
} from "react-native";
import { StackNavigator, TabNavigator } from "react-navigation";
export default class Home extends Component {
constructor(props) {
super(props);
this.state = {
showDate: false,
date: new Date()
};
}
componentWillMount() {}
componentDidMount() {}
getListData() {
let that = this;
return fetch(`https://devpay.brae.co/test/insurance/topic`, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json"
}
})
.then(resp => {
if (resp.status === 200) {
return resp.json();
} else {
console.error("something went wrong!");
}
})
.then(respJson => {
if (respJson.enmsg != "ok") {
alert(respJson.cnmsg);
} else {
that.setState({
ListData: respJson.data.topic
});
console.log("首页列表", this.state.ListData);
}
});
}
render() {
// console.log("首页的this.props", this);
// console.log("render首页文章列表", this.state.ListData);
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
<Text>健康问卷开始</Text>
{this.state.showDate ? (
<DatePickerIOS
style={styles.dateWrapper}
date={this.state.date}
onDateChange={date => this.setState({ date })}
mode="date"
/>
) : null}
<TouchableOpacity
onPress={() => {
{
/* alert(this.state.date); */
}
this.setState({
showDate: !this.state.showDate
});
}}
>
<Text>打印时间</Text>
</TouchableOpacity>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "flex-start",
alignItems: "stretch",
backgroundColor: "#EFEFEF"
},
dateWrapper: {
// position: "absolute",
// bottom: 200,
marginBottom: 50,
width: 250
}
});
import React, { Component } from "react";
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
TouchableOpacity,
ScrollView,
ListView,
Dimensions,
} from "react-native";
import { StackNavigator, TabNavigator } from "react-navigation";
export default class Home extends Component {
constructor(props) {
super(props);
this.state = {};
}
componentWillMount() {}
componentDidMount() {}
getListData() {
let that = this;
return fetch(`https://devpay.brae.co/test/insurance/topic`, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json"
}
})
.then(resp => {
if (resp.status === 200) {
return resp.json();
} else {
console.error("something went wrong!");
}
})
.then(respJson => {
if (respJson.enmsg != "ok") {
alert(respJson.cnmsg);
} else {
that.setState({
ListData: respJson.data.topic
});
console.log("首页列表", this.state.ListData);
}
});
}
render() {
// console.log("首页的this.props", this);
// console.log("render首页文章列表", this.state.ListData);
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
<Text>健康问卷 问题</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "flex-start",
alignItems: "stretch",
backgroundColor: "#EFEFEF"
},
});
import React, { Component } from "react";
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
TouchableOpacity,
ScrollView,
ListView,
Dimensions,
} from "react-native";
import { StackNavigator, TabNavigator } from "react-navigation";
export default class Home extends Component {
constructor(props) {
super(props);
this.state = {};
}
componentWillMount() {}
componentDidMount() {}
getListData() {
let that = this;
return fetch(`https://devpay.brae.co/test/insurance/topic`, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json"
}
})
.then(resp => {
if (resp.status === 200) {
return resp.json();
} else {
console.error("something went wrong!");
}
})
.then(respJson => {
if (respJson.enmsg != "ok") {
alert(respJson.cnmsg);
} else {
that.setState({
ListData: respJson.data.topic
});
console.log("首页列表", this.state.ListData);
}
});
}
render() {
// console.log("首页的this.props", this);
// console.log("render首页文章列表", this.state.ListData);
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
<Text>健康问卷 结果</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "flex-start",
alignItems: "stretch",
backgroundColor: "#EFEFEF"
},
});
import React, { Component } from 'react';
import {
Dimensions,
Image,
StyleSheet,
Text,
TouchableOpacity,
TouchableWithoutFeedback,
View,
} from 'react-native';
const questions = [
{ question: '早上起床时，有持续的发丝掉落。', score: 5 },
{ question: '情绪抑郁，会对着天空发呆。', score: 3 },
{ question: '记不起昨天想好的事，而且最近经常有这种现象出现。', score: 10 },
{ question: '上班途中，害怕走进办公室，觉得工作令人厌倦。', score: 5 },
{ question: '不想面对同事和上司，有一种自闭倾向。', score: 5 },
{ question: '工作效率明显下降，上司已表达了对你的不满。', score: 5 },
{ question: '每天工作一小时，就感身体倦怠，胸闷气短。', score: 10 },
{ question: '工作情绪始终无法高涨，最令自己不解的是无名的火气很大，但又没有精力发作。', score: 5 },
{ question: '每天进餐少，即使口味非常适合自己的菜肴，也食不知味。', score: 5 },
{ question: '盼望早点逃离办公室，能够回家躺在床上多休息。', score: 5 },
{ question: '对城市的污染、噪声非常敏感，比常人渴望清幽，希望到宁静的山水处，使身心得以休息。', score: 5 },
{ question: '不再像以前一样热衷于朋友的聚会，有一种强打起精神勉强应酬的感觉。', score: 2 },
{ question: '晚上经常睡不着觉，即使睡着了，又老是在做梦状态，睡眠状态很糟。', score: 10 },
{ question: '体重明显下降，早上起来，发现眼眶深陷，下巴突出。', score: 10 },
{ question: '感觉免疫力下降，容易伤风感冒。', score: 5 },
{ question: '性能力下降。昨天配偶对你明显表示有性要求，你却感到疲惫不堪，毫无性欲，令配偶怀疑你有外遇。', score: 10 },
];
class Start extends Component {
render() {
return (
<View style={[styles.container, { backgroundColor: 'white', alignItems: 'center' }]}>
<Image style={styles.startImage} source={require('../../assets/home/questionnaire.png')} resizeMode='contain' />
<TouchableOpacity style={styles.startBtn} onPress={() => this.props.onStart()}>
<Text style={styles.startBtnText}>开始测试</Text>
</TouchableOpacity>
<Text style={styles.startComment}>已有276人</Text>
</View>
);
}
}
class Question extends Component {
constructor(props) {
super(props);
this.state = {
answer: null,
};
}
render() {
const { number, pressHandler } = this.props;
return (
<View style={styles.container}>
<View style={styles.qPromptContainer}>
<Text style={styles.qPromptText}>请根据您的真实情况选择</Text>
<Text style={styles.qPromptText}>{number + 1}/{questions.length}</Text>
</View>
<View style={styles.qQuestionContainer}>
<Text style={styles.qQuestion}>{number + 1}. {questions[number].question}</Text>
</View>
<View style={styles.qOptionContainer}>
<TouchableOpacity style={styles.qOption} onPress={() => { pressHandler(questions[number].score) }}>
<Text style={styles.qOptionText}>符合</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.qOption} onPress={() => { pressHandler(0) }}>
<Text style={styles.qOptionText}>不符合</Text>
</TouchableOpacity>
</View>
</View>
);
}
}
class Result extends Component {
render() {
return (
<View style={styles.container}>
<View style={styles.rContainer}>
<Text style={styles.rTitle}>检测结果</Text>
<Text style={styles.rDetail}>hhggdsdfghkjkhggv</Text>
</View>
<TouchableOpacity style={styles.rResetBtn} onPress={()=> { this.props.onReset() }}>
<Text style={styles.rResetText}>重新检测</Text>
</TouchableOpacity>
</View>
);
}
}
class HealthQuestionnaire extends Component {
constructor(props) {
super(props);
this.state = {
stage: 0,
score: 0,
currentNumber: 0,
};
}
render() {
const { stage } = this.state;
return stage == 0 ?
<Start onStart={() => { this.setState({ stage: 1 }) }} />
: stage == 1 ?
<Question
pressHandler={score => {
const old = this.state;
let tmp = {
score: old.score + score,
currentNumber: old.currentNumber + 1
};
if (old.currentNumber == questions.length - 1) {
tmp.stage = old.stage + 1;
}
this.setState({
...tmp,
});
}}
number={this.state.currentNumber}
/> :
<Result score={this.state.score} onReset={() => { this.setState({ score: 0, stage: 0, currentNumber: 0 }) }} />
}
}
const { width } = Dimensions.get('window');
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'stretch',
paddingHorizontal: 12,
},
startImage: {
width: width - 140,
height: (width - 140) / 454 * 208,
marginVertical: 100,
},
startBtn: {
width: width - 80,
height: 45,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#1b9341',
borderRadius: 5,
},
startBtnText: {
fontSize: 16,
color: 'white',
},
startComment: {
marginTop: 8,
fontSize: 13,
color: '#727272',
},
qPromptContainer: {
height: 36,
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
},
qPromptText: {
fontSize: 13,
color: '#7a7a7a'
},
qQuestionContainer: {
padding: 12,
flex: 1,
backgroundColor: 'white',
borderRadius: 5,
},
qQuestion: {
fontSize: 15,
color: '#242424',
},
qOptionContainer: {
marginVertical: 14,
flexDirection: 'row',
justifyContent: 'space-between',
borderTopWidth: 0.5,
borderColor: '#e6e6e6'
},
qOption: {
justifyContent: 'center',
alignItems: 'center',
borderRadius: 5,
backgroundColor: '#1b9341',
height: 44,
width: (width - 28 - 14) / 2,
},
qOptionText: {
fontSize: 15,
color: 'white',
},
rContainer: {
flex: 1,
borderRadius: 5,
backgroundColor: 'white',
marginTop: 15,
paddingHorizontal: 24,
paddingBottom: 38,
},
rTitle: {
marginVertical: 37,
alignSelf: 'center',
fontSize: 20,
fontWeight: 'bold',
},
rDetail: {
fontSize: 15,
color: '#242424'
},
rResetBtn: {
justifyContent: 'center',
alignItems: 'center',
marginVertical: 25,
backgroundColor: '#1b9341',
height: 45,
borderRadius: 5,
},
rResetText: {
fontSize: 16,
color: 'white',
},
});
export default HealthQuestionnaire;
\ No newline at end of file
... ...
... ... @@ -172,7 +172,7 @@ export default class Home extends Component {
<TouchableOpacity
style={styles.AHContainer}
onPress={() => {
navigate("HealthBegin");
navigate("HealthQuestionnaire");
}}
>
<Image style={styles.AHIcon} source={require("../../assets/home/ic_questionnaire.png")}/>
... ...
import {
Alert,
} from 'react-native';
const MAIN_URL = 'https://devpay.brae.co';
/**
*
* @param {String} url 形如'/some/directory/'的接口，以'/'开头
* @param {Object} data 上送数据
* @param {function} sucCB 成功回调函数
* @param {function} errCB 失败回调函数
* @param {Object} header 补充包头
*/
export default function post(url, data, sucCB, errCB, header = {}) {
const requestUrl = `${MAIN_URL}${url}`;
const body = JSON.stringify(data);
const headers = {
"Accept": "application/json",
"Content-Type": "application/json",
...header,
}
fetch(requestUrl, {
method: 'POST',
body: body,
headers: headers,
}).then(res => {
if (res && res.status === 200) {
return res.json();
} else {
throw new Error('server')
}
}).then(res => {
if (res && res.code === 200 && res.enmsg === 'ok') {
sucCB(res);
} else {
errCB(res);
}
}).catch(err => {
console.log(err)
// 所有非 200 的情况都作为服务器内部错误处理
if (err.message === 'server') {
errCB({ code: 500, enmsg: 'server error', cnmsg: '服务器内部错误', data: null });
} else {
errCB({ code: 500, enmsg: 'client error', cnmsg: '网络异常', data: null });
}
})
}
\ No newline at end of file
... ...