罗广聪 / ProtectGod

Go to a project
Toggle navigation Toggle navigation pinning
罗广聪
45fdb220 1 parent e28937af

edit style

Inline Side-by-side
Showing 3 changed files with 124 additions and 43 deletions
... ... @@ -108,7 +108,10 @@ const ProtectGod = StackNavigator(
Mine: { screen: Mine },
Login: { screen: Login },
Customer: { screen: Customer },
CustomerEdit: {screen: CustomerEdit },
CustomerEdit: {
screen: CustomerEdit,
navigationOptions: { headerTitle: "客户信息" }
},
AllProduct: {
screen: AllProduct,
navigationOptions: { headerTitle: "全部产品" }
... ...
... ... @@ -8,7 +8,7 @@ import {
TouchableOpacity,
ScrollView,
ListView,
Dimensions,
Dimensions
} from "react-native";
import { StackNavigator, TabNavigator } from "react-navigation";
import post from "../../utils/fetch";
... ... @@ -30,7 +30,56 @@ export default class Edit extends Component {
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
<Text>编辑客户信息</Text>
<View style={styles.infoContaier}>
<TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>昵称</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>周周周</Text>
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
<TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>昵称</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>周周周</Text>
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
<TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>昵称</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>周周周</Text>
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
<TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
<View style={styles.itemLeft}>
<Text style={styles.leftTitle}>昵称</Text>
</View>
<View style={styles.itemRight}>
<Text style={styles.itemRightContent}>周周周</Text>
<Image
style={styles.itemRightImg}
source={require("../../assets/Mine/rightArrow_gray.png")}
/>
</View>
</TouchableOpacity>
</View>
</View>
);
}
... ... @@ -41,6 +90,43 @@ const styles = StyleSheet.create({
flex: 1,
justifyContent: "flex-start",
alignItems: "stretch",
backgroundColor: "#EFEFEF"
backgroundColor: "#F0F0F0"
},
infoContaier: {
marginVertical: 10,
},
itemContainer: {
height: 46,
paddingLeft: 16,
paddingRight: 16,
flexDirection: "row",
justifyContent: "space-between",
alignItems: "center",
backgroundColor: "#fff",
borderStyle: "solid",
borderColor: "#F0F0F0",
borderBottomWidth: 1
},
itemLeft: {
flexDirection: "row",
justifyContent: "flex-start",
alignItems: "center"
},
leftTitle: {
fontSize: 15,
color: "#242424"
},
itemRight: {
flexDirection: "row",
justifyContent: "flex-start",
alignItems: "center"
},
itemRightContent: {
marginRight: 5,
color: "#7A7A7A"
},
itemRightImg: {
width: 14,
height: 14
}
});
... ...
... ... @@ -28,7 +28,6 @@ export default class Customer extends Component {
getListData() {
post("/test/insurance/article", {}, res => {}, err => {});
}
getAllPhone() {
Contacts.getAll((err, contacts) => {
if (err && err.type === "permissionDenied") {
... ... @@ -53,27 +52,7 @@ export default class Customer extends Component {
});
}
render() {
const { navigate } = this.props.navigation;
const { hasCustomer, customers } = this.state;
return (
<View style={styles.container}>
{hasCustomer ? (
<Main customersList={this.state.customersList} navigation={this.props.navigation} />
) : (
<Begin />
)}
</View>
);
}
}
class Begin extends Component {
constructor(props) {
super(props);
this.state = {};
}
render() {
_renderBegin() {
return (
<View style={styles.beginContaier}>
<Image
... ... @@ -91,16 +70,8 @@ class Begin extends Component {
</View>
);
}
}
class Main extends Component {
constructor(props) {
super(props);
this.state = {};
}
render() {
const { customersList } = this.props;
_renderMain() {
const { customersList } = this.state;
const { navigate } = this.props.navigation;
return (
<View style={styles.mainContaier}>
... ... @@ -123,9 +94,16 @@ class Main extends Component {
<ScrollView style={styles.mainSvcContainer}>
{customersList.map((item, index) => {
return (
<TouchableOpacity key={index} style={styles.mainCustomerItem} onPress={() => navigate("CustomerEdit")}>
<TouchableOpacity
key={index}
style={styles.mainCustomerItem}
onPress={() => navigate("CustomerEdit")}
>
<Text style={styles.mainCustomerItemText}>{item}</Text>
<Image style={styles.mainCustomerItemImg} source={require("../../assets/customer/rightArrow_gray.png")} />
<Image
style={styles.mainCustomerItemImg}
source={require("../../assets/customer/rightArrow_gray.png")}
/>
</TouchableOpacity>
);
})}
... ... @@ -133,6 +111,20 @@ class Main extends Component {
</View>
);
}
render() {
const { navigate } = this.props.navigation;
const { hasCustomer, customers } = this.state;
return (
<View style={styles.container}>
{hasCustomer ? (
this._renderMain()
) : (
this._renderBegin()
)}
</View>
);
}
}
const styles = StyleSheet.create({
... ... @@ -228,7 +220,7 @@ const styles = StyleSheet.create({
},
mainSvcContainer: {
flex: 1,
backgroundColor: "white",
backgroundColor: "white"
},
mainCustomerItem: {
flexDirection: "row",
... ... @@ -240,14 +232,14 @@ const styles = StyleSheet.create({
marginRight: 10,
borderStyle: "solid",
borderColor: "#F2F2F2",
borderBottomWidth: 1,
borderBottomWidth: 1
},
mainCustomerItemText: {
fontSize: 16,
color: "#202020",
color: "#202020"
},
mainCustomerItemImg: {
width: 14,
height: 14,
},
height: 14
}
});
... ...