罗广聪 / ProtectGod

Go to a project
Toggle navigation Toggle navigation pinning
罗广聪
ae94c396 1 parent 4d75d3c5

我的 静态页面

Inline Side-by-side
Showing 2 changed files with 205 additions and 99 deletions
... ... @@ -43,7 +43,7 @@ export default class Login extends Component {
_that.setState({
IS_LOGIN: result
});
console.log("Login页面的AsyncStorage", result);
// console.log("Login页面的AsyncStorage", result);
});
}
componentDidMount() {
... ...
... ... @@ -9,7 +9,8 @@ import {
Alert,
AlertIOS,
AsyncStorage,
Button
Button,
ScrollView
} from "react-native";
import { StackNavigator, TabNavigator } from "react-navigation";
... ... @@ -20,7 +21,9 @@ export default class Mine extends Component {
IS_LOGIN: "",
USER_ID: "",
NICKNAME: "",
PROFESSION: ""
PROFESSION: "",
PHONT: "",
COMPONY: ""
};
this.saveResponse1 = this.saveResponse1.bind(this);
this.saveResponse2 = this.saveResponse2.bind(this);
... ... @@ -99,10 +102,10 @@ export default class Mine extends Component {
if (respJson.enmsg != "ok") {
alert(respJson.cnmsg);
} else {
AsyncStorage.setItem("NICKNAME",d).then(() => {
AsyncStorage.setItem("NICKNAME", d).then(() => {
console.log("保存修改成功");
that.setState({ NICKNAME: d });
})
});
}
})
.catch(err => console.error(err));
... ... @@ -136,116 +139,212 @@ export default class Mine extends Component {
if (respJson.enmsg != "ok") {
Alert.alert(respJson.cnmsg);
} else {
AsyncStorage.setItem("PROFESSION",d).then(() => {
AsyncStorage.setItem("PROFESSION", d).then(() => {
console.log("保存修改成功");
that.setState({ PROFESSION: d });
})
});
}
})
.catch(err => console.error(err));
}
render() {
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
{/* 头部头像 */}
<View style={styles.header}>
{this.state.IS_LOGIN == "yes" ? (
<Image
source={require("../../assets/Mine/iconpic1.png")}
style={styles.mineIcon}
/>
) : (
<Image
source={require("../../assets/Mine/iconpic_gray.png")}
style={styles.mineIcon}
/>
)}
</View>
<ScrollView>
{/* 头部头像 */}
<View style={styles.header}>
{this.state.IS_LOGIN == "yes" ? (
<Image
source={require("../../assets/Mine/iconpic1.png")}
style={styles.mineIcon}
/>
) : (
<Image
source={require("../../assets/Mine/iconpic_gray.png")}
style={styles.mineIcon}
/>
)}
{this.state.IS_LOGIN == "yes" ? null : (
<Text style={styles.headerText}>登录可享更多特权</Text>
)}
</View>
{/* 设置昵称和职业 */}
<View style={styles.midContainer}>
{/* 更改昵称 */}
<TouchableOpacity
style={styles.itemContainer}
onPress={() => {
if (this.state.IS_LOGIN == "yes") {
AlertIOS.prompt("更改昵称", null, this.saveResponse1);
} else {
Alert.alert("请先登录账号")
}
}}
>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>昵称</Text>
{/* 设置昵称和职业 */}
{this.state.IS_LOGIN == "yes" ? (
<View style={styles.midContainer}>
{/* 更改昵称 */}
<TouchableOpacity
style={styles.itemContainer}
onPress={() => {
if (this.state.IS_LOGIN == "yes") {
AlertIOS.prompt("更改昵称", null, this.saveResponse1);
} else {
Alert.alert("请先登录账号");
}
}}
>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>昵称</Text>
</View>
<View style={styles.itemRight}>
{this.state.IS_LOGIN === "yes" ? (
<Text style={styles.itemRightContent}>
{this.state.NICKNAME}
</Text>
) : null}
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
{/* 更改职业 */}
<TouchableOpacity
style={styles.itemContainer}
onPress={() => {
if (this.state.IS_LOGIN == "yes") {
AlertIOS.prompt("更改职业", null, this.saveResponse2);
} else {
Alert.alert("请先登录账号");
}
}}
>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>职业</Text>
</View>
<View style={styles.itemRight}>
{this.state.IS_LOGIN === "yes" ? (
<Text style={styles.itemRightContent}>
{this.state.PROFESSION}
</Text>
) : null}
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
{/* 公司 */}
<TouchableOpacity
style={styles.itemContainer}
onPress={() => {
if (this.state.IS_LOGIN == "yes") {
AlertIOS.prompt("更改手机", null, this.saveResponse2);
} else {
Alert.alert("请先登录账号");
}
}}
>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>手机</Text>
</View>
<View style={styles.itemRight}>
{this.state.IS_LOGIN === "yes" ? (
<Text style={styles.itemRightContent}>
{this.state.PHONT}
</Text>
) : null}
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
{/* 手机 */}
<TouchableOpacity
style={styles.itemContainer}
onPress={() => {
if (this.state.IS_LOGIN == "yes") {
AlertIOS.prompt("更改公司", null, this.saveResponse2);
} else {
Alert.alert("请先登录账号");
}
}}
>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>公司</Text>
</View>
<View style={styles.itemRight}>
{this.state.IS_LOGIN === "yes" ? (
<Text style={styles.itemRightContent}>
{this.state.COMPONY}
</Text>
) : null}
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
</View>
<View style={styles.itemRight}>
{this.state.IS_LOGIN === "yes" ? (
) : null}
<View style={styles.midContainer}>
<TouchableOpacity style={styles.itemContainer}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>评价我们</Text>
</View>
<View style={styles.itemRight}>
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
<TouchableOpacity style={styles.itemContainer}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>客服电话</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>4001-608876</Text>
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
</View>
<View style={styles.midContainer}>
<TouchableOpacity style={styles.itemContainer}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>当前版本</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>
{this.state.NICKNAME}
V1.0.0
</Text>
) : null}
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
{/* 更改职业 */}
</View>
</TouchableOpacity>
</View>
{/* 登录 */}
<TouchableOpacity
style={styles.itemContainer}
style={styles.loginOut}
onLogin={this.props.onLogin}
onPress={() => {
if (this.state.IS_LOGIN == "yes") {
AlertIOS.prompt("更改职业", null, this.saveResponse2);
} else {
Alert.alert("请先登录账号")
}
this.state.IS_LOGIN == "yes"
? this.signOut()
: navigate("Login", {
refreshCallback: data => {
console.log("refreshCallback参数", data);
this.setState({
IS_LOGIN: data.IS_LOGIN,
USER_ID: data.USER_ID,
NICKNAME: data.NICKNAME,
PROFESSION: data.PROFESSION
});
}
});
}}
>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>职业</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>
{this.state.PROFESSION}
</Text>
{this.state.IS_LOGIN === "yes" ? (
<Text style={styles.itemRightContent}>
{this.state.identity}
</Text>
) : null}
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
<Text style={styles.loginOutText}>
{this.state.IS_LOGIN == "yes" ? "退出登录" : "登录"}
</Text>
</TouchableOpacity>
</View>
{/* 登录 */}
<TouchableOpacity
style={styles.loginOut}
onLogin={this.props.onLogin}
onPress={() => {
this.state.IS_LOGIN == "yes"
? this.signOut()
: navigate("Login", {
refreshCallback: data => {
console.log("refreshCallback参数", data);
this.setState({
IS_LOGIN: data.IS_LOGIN,
USER_ID: data.USER_ID,
NICKNAME: data.NICKNAME,
PROFESSION: data.PROFESSION
});
}
});
}}
>
<Text style={styles.loginOutText}>
{this.state.IS_LOGIN == "yes" ? "退出登录" : "登录"}
</Text>
</TouchableOpacity>
</ScrollView>
</View>
);
}
... ... @@ -266,6 +365,11 @@ const styles = StyleSheet.create({
alignItems: "center",
marginBottom: 10
},
headerText: {
fontSize: 15,
color: "#fff",
marginLeft: 22
},
mineIcon: {
width: 86,
height: 86
... ... @@ -279,7 +383,9 @@ const styles = StyleSheet.create({
width: 14,
height: 14
},
midContainer: {},
midContainer: {
marginBottom: 10
},
itemContainer: {
height: 46,
paddingLeft: 16,
... ... @@ -315,7 +421,7 @@ const styles = StyleSheet.create({
height: 14
},
loginOut: {
marginTop: 10,
marginBottom: 10,
height: 46,
backgroundColor: "#fff",
justifyContent: "center"
... ... @@ -323,5 +429,5 @@ const styles = StyleSheet.create({
loginOutText: {
textAlign: "center",
fontSize: 15
},
}
});
... ...