罗广聪 / 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 134 additions and 53 deletions
@@ -38,8 +38,8 @@ const MainTabBar = TabNavigator( @@ -38,8 +38,8 @@ const MainTabBar = TabNavigator(
38 focused ? ( 38 focused ? (
39 <Image source={require("./src/assets/tabbar/ic_home_s.png")} /> 39 <Image source={require("./src/assets/tabbar/ic_home_s.png")} />
40 ) : ( 40 ) : (
41 - <Image source={require("./src/assets/tabbar/ic_home_n.png")} /> 41 + <Image source={require("./src/assets/tabbar/ic_home_n.png")} />
42 - ) 42 + )
43 } 43 }
44 }, 44 },
45 InsuranceCircle: { 45 InsuranceCircle: {
@@ -50,8 +50,8 @@ const MainTabBar = TabNavigator( @@ -50,8 +50,8 @@ const MainTabBar = TabNavigator(
50 focused ? ( 50 focused ? (
51 <Image source={require("./src/assets/tabbar/ic_circle_s.png")} /> 51 <Image source={require("./src/assets/tabbar/ic_circle_s.png")} />
52 ) : ( 52 ) : (
53 - <Image source={require("./src/assets/tabbar/ic_circle_n.png")} /> 53 + <Image source={require("./src/assets/tabbar/ic_circle_n.png")} />
54 - ) 54 + )
55 } 55 }
56 }, 56 },
57 InsuranceChurch: { 57 InsuranceChurch: {
@@ -62,8 +62,8 @@ const MainTabBar = TabNavigator( @@ -62,8 +62,8 @@ const MainTabBar = TabNavigator(
62 focused ? ( 62 focused ? (
63 <Image source={require("./src/assets/tabbar/ic_umbrella_s.png")} /> 63 <Image source={require("./src/assets/tabbar/ic_umbrella_s.png")} />
64 ) : ( 64 ) : (
65 - <Image source={require("./src/assets/tabbar/ic_umbrella_n.png")} /> 65 + <Image source={require("./src/assets/tabbar/ic_umbrella_n.png")} />
66 - ) 66 + )
67 } 67 }
68 }, 68 },
69 Customer: { 69 Customer: {
@@ -74,8 +74,8 @@ const MainTabBar = TabNavigator( @@ -74,8 +74,8 @@ const MainTabBar = TabNavigator(
74 focused ? ( 74 focused ? (
75 <Image source={require("./src/assets/tabbar/ic_discover_s.png")} /> 75 <Image source={require("./src/assets/tabbar/ic_discover_s.png")} />
76 ) : ( 76 ) : (
77 - <Image source={require("./src/assets/tabbar/ic_discover_n.png")} /> 77 + <Image source={require("./src/assets/tabbar/ic_discover_n.png")} />
78 - ) 78 + )
79 } 79 }
80 }, 80 },
81 Mine: { 81 Mine: {
@@ -86,8 +86,8 @@ const MainTabBar = TabNavigator( @@ -86,8 +86,8 @@ const MainTabBar = TabNavigator(
86 focused ? ( 86 focused ? (
87 <Image source={require("./src/assets/tabbar/ic_mine_s.png")} /> 87 <Image source={require("./src/assets/tabbar/ic_mine_s.png")} />
88 ) : ( 88 ) : (
89 - <Image source={require("./src/assets/tabbar/ic_mine_n.png")} /> 89 + <Image source={require("./src/assets/tabbar/ic_mine_n.png")} />
90 - ) 90 + )
91 } 91 }
92 } 92 }
93 }, 93 },
@@ -108,7 +108,10 @@ const ProtectGod = StackNavigator( @@ -108,7 +108,10 @@ const ProtectGod = StackNavigator(
108 Mine: { screen: Mine }, 108 Mine: { screen: Mine },
109 Login: { screen: Login }, 109 Login: { screen: Login },
110 Customer: { screen: Customer }, 110 Customer: { screen: Customer },
111 - CustomerEdit: {screen: CustomerEdit }, 111 + CustomerEdit: {
  112 + screen: CustomerEdit,
  113 + navigationOptions: { headerTitle: "客户信息" }
  114 + },
112 AllProduct: { 115 AllProduct: {
113 screen: AllProduct, 116 screen: AllProduct,
114 navigationOptions: { headerTitle: "全部产品" } 117 navigationOptions: { headerTitle: "全部产品" }
@@ -8,7 +8,7 @@ import { @@ -8,7 +8,7 @@ import {
8 TouchableOpacity, 8 TouchableOpacity,
9 ScrollView, 9 ScrollView,
10 ListView, 10 ListView,
11 - Dimensions, 11 + Dimensions
12 } from "react-native"; 12 } from "react-native";
13 import { StackNavigator, TabNavigator } from "react-navigation"; 13 import { StackNavigator, TabNavigator } from "react-navigation";
14 import post from "../../utils/fetch"; 14 import post from "../../utils/fetch";
@@ -30,7 +30,56 @@ export default class Edit extends Component { @@ -30,7 +30,56 @@ export default class Edit extends Component {
30 const { navigate } = this.props.navigation; 30 const { navigate } = this.props.navigation;
31 return ( 31 return (
32 <View style={styles.container}> 32 <View style={styles.container}>
33 - <Text>编辑客户信息</Text> 33 + <View style={styles.infoContaier}>
  34 + <TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
  35 + <View style={styles.itemLeft}>
  36 + <Text style={styles.leftTitle}>昵称</Text>
  37 + </View>
  38 + <View style={styles.itemRight}>
  39 + <Text style={styles.itemRightContent}>周周周</Text>
  40 + <Image
  41 + style={styles.itemRightImg}
  42 + source={require("../../assets/Mine/rightArrow_gray.png")}
  43 + />
  44 + </View>
  45 + </TouchableOpacity>
  46 + <TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
  47 + <View style={styles.itemLeft}>
  48 + <Text style={styles.leftTitle}>昵称</Text>
  49 + </View>
  50 + <View style={styles.itemRight}>
  51 + <Text style={styles.itemRightContent}>周周周</Text>
  52 + <Image
  53 + style={styles.itemRightImg}
  54 + source={require("../../assets/Mine/rightArrow_gray.png")}
  55 + />
  56 + </View>
  57 + </TouchableOpacity>
  58 + <TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
  59 + <View style={styles.itemLeft}>
  60 + <Text style={styles.leftTitle}>昵称</Text>
  61 + </View>
  62 + <View style={styles.itemRight}>
  63 + <Text style={styles.itemRightContent}>周周周</Text>
  64 + <Image
  65 + style={styles.itemRightImg}
  66 + source={require("../../assets/Mine/rightArrow_gray.png")}
  67 + />
  68 + </View>
  69 + </TouchableOpacity>
  70 + <TouchableOpacity style={styles.itemContainer} onPress={() => {}}>
  71 + <View style={styles.itemLeft}>
  72 + <Text style={styles.leftTitle}>昵称</Text>
  73 + </View>
  74 + <View style={styles.itemRight}>
  75 + <Text style={styles.itemRightContent}>周周周</Text>
  76 + <Image
  77 + style={styles.itemRightImg}
  78 + source={require("../../assets/Mine/rightArrow_gray.png")}
  79 + />
  80 + </View>
  81 + </TouchableOpacity>
  82 + </View>
34 </View> 83 </View>
35 ); 84 );
36 } 85 }
@@ -41,6 +90,43 @@ const styles = StyleSheet.create({ @@ -41,6 +90,43 @@ const styles = StyleSheet.create({
41 flex: 1, 90 flex: 1,
42 justifyContent: "flex-start", 91 justifyContent: "flex-start",
43 alignItems: "stretch", 92 alignItems: "stretch",
44 - backgroundColor: "#EFEFEF" 93 + backgroundColor: "#F0F0F0"
  94 + },
  95 + infoContaier: {
  96 + marginVertical: 10,
  97 + },
  98 + itemContainer: {
  99 + height: 46,
  100 + paddingLeft: 16,
  101 + paddingRight: 16,
  102 + flexDirection: "row",
  103 + justifyContent: "space-between",
  104 + alignItems: "center",
  105 + backgroundColor: "#fff",
  106 + borderStyle: "solid",
  107 + borderColor: "#F0F0F0",
  108 + borderBottomWidth: 1
  109 + },
  110 + itemLeft: {
  111 + flexDirection: "row",
  112 + justifyContent: "flex-start",
  113 + alignItems: "center"
  114 + },
  115 + leftTitle: {
  116 + fontSize: 15,
  117 + color: "#242424"
  118 + },
  119 + itemRight: {
  120 + flexDirection: "row",
  121 + justifyContent: "flex-start",
  122 + alignItems: "center"
  123 + },
  124 + itemRightContent: {
  125 + marginRight: 5,
  126 + color: "#7A7A7A"
  127 + },
  128 + itemRightImg: {
  129 + width: 14,
  130 + height: 14
45 } 131 }
46 }); 132 });
@@ -28,7 +28,6 @@ export default class Customer extends Component { @@ -28,7 +28,6 @@ export default class Customer extends Component {
28 getListData() { 28 getListData() {
29 post("/test/insurance/article", {}, res => {}, err => {}); 29 post("/test/insurance/article", {}, res => {}, err => {});
30 } 30 }
31 -  
32 getAllPhone() { 31 getAllPhone() {
33 Contacts.getAll((err, contacts) => { 32 Contacts.getAll((err, contacts) => {
34 if (err && err.type === "permissionDenied") { 33 if (err && err.type === "permissionDenied") {
@@ -53,27 +52,7 @@ export default class Customer extends Component { @@ -53,27 +52,7 @@ export default class Customer extends Component {
53 }); 52 });
54 } 53 }
55 54
56 - render() { 55 + _renderBegin() {
57 - const { navigate } = this.props.navigation;  
58 - const { hasCustomer, customers } = this.state;  
59 - return (  
60 - <View style={styles.container}>  
61 - {hasCustomer ? (  
62 - <Main customersList={this.state.customersList} navigation={this.props.navigation} />  
63 - ) : (  
64 - <Begin />  
65 - )}  
66 - </View>  
67 - );  
68 - }  
69 -}  
70 -  
71 -class Begin extends Component {  
72 - constructor(props) {  
73 - super(props);  
74 - this.state = {};  
75 - }  
76 - render() {  
77 return ( 56 return (
78 <View style={styles.beginContaier}> 57 <View style={styles.beginContaier}>
79 <Image 58 <Image
@@ -91,16 +70,8 @@ class Begin extends Component { @@ -91,16 +70,8 @@ class Begin extends Component {
91 </View> 70 </View>
92 ); 71 );
93 } 72 }
94 -} 73 + _renderMain() {
95 - 74 + const { customersList } = this.state;
96 -class Main extends Component {  
97 - constructor(props) {  
98 - super(props);  
99 - this.state = {};  
100 - }  
101 -  
102 - render() {  
103 - const { customersList } = this.props;  
104 const { navigate } = this.props.navigation; 75 const { navigate } = this.props.navigation;
105 return ( 76 return (
106 <View style={styles.mainContaier}> 77 <View style={styles.mainContaier}>
@@ -123,9 +94,16 @@ class Main extends Component { @@ -123,9 +94,16 @@ class Main extends Component {
123 <ScrollView style={styles.mainSvcContainer}> 94 <ScrollView style={styles.mainSvcContainer}>
124 {customersList.map((item, index) => { 95 {customersList.map((item, index) => {
125 return ( 96 return (
126 - <TouchableOpacity key={index} style={styles.mainCustomerItem} onPress={() => navigate("CustomerEdit")}> 97 + <TouchableOpacity
  98 + key={index}
  99 + style={styles.mainCustomerItem}
  100 + onPress={() => navigate("CustomerEdit")}
  101 + >
127 <Text style={styles.mainCustomerItemText}>{item}</Text> 102 <Text style={styles.mainCustomerItemText}>{item}</Text>
128 - <Image style={styles.mainCustomerItemImg} source={require("../../assets/customer/rightArrow_gray.png")} /> 103 + <Image
  104 + style={styles.mainCustomerItemImg}
  105 + source={require("../../assets/customer/rightArrow_gray.png")}
  106 + />
129 </TouchableOpacity> 107 </TouchableOpacity>
130 ); 108 );
131 })} 109 })}
@@ -133,6 +111,20 @@ class Main extends Component { @@ -133,6 +111,20 @@ class Main extends Component {
133 </View> 111 </View>
134 ); 112 );
135 } 113 }
  114 +
  115 + render() {
  116 + const { navigate } = this.props.navigation;
  117 + const { hasCustomer, customers } = this.state;
  118 + return (
  119 + <View style={styles.container}>
  120 + {hasCustomer ? (
  121 + this._renderMain()
  122 + ) : (
  123 + this._renderBegin()
  124 + )}
  125 + </View>
  126 + );
  127 + }
136 } 128 }
137 129
138 const styles = StyleSheet.create({ 130 const styles = StyleSheet.create({
@@ -228,7 +220,7 @@ const styles = StyleSheet.create({ @@ -228,7 +220,7 @@ const styles = StyleSheet.create({
228 }, 220 },
229 mainSvcContainer: { 221 mainSvcContainer: {
230 flex: 1, 222 flex: 1,
231 - backgroundColor: "white", 223 + backgroundColor: "white"
232 }, 224 },
233 mainCustomerItem: { 225 mainCustomerItem: {
234 flexDirection: "row", 226 flexDirection: "row",
@@ -240,14 +232,14 @@ const styles = StyleSheet.create({ @@ -240,14 +232,14 @@ const styles = StyleSheet.create({
240 marginRight: 10, 232 marginRight: 10,
241 borderStyle: "solid", 233 borderStyle: "solid",
242 borderColor: "#F2F2F2", 234 borderColor: "#F2F2F2",
243 - borderBottomWidth: 1, 235 + borderBottomWidth: 1
244 }, 236 },
245 mainCustomerItemText: { 237 mainCustomerItemText: {
246 fontSize: 16, 238 fontSize: 16,
247 - color: "#202020", 239 + color: "#202020"
248 }, 240 },
249 mainCustomerItemImg: { 241 mainCustomerItemImg: {
250 width: 14, 242 width: 14,
251 - height: 14, 243 + height: 14
252 - }, 244 + }
253 }); 245 });