地址

src/pages/my/tools/address/index.css

@@ -0,0 +1,15 @@
+.address-card {
+    background-color: white;
+}
+
+.address-add {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    text-align: center;
+    font-size: 20px;
+    background-color: white;
+    border-top: 1px solid #F3F3F3;
+    height: 50px;
+    line-height: 50px;
+}

src/pages/my/tools/address/index.js

@@ -1,21 +1,82 @@
 import {Component} from "react"
 import React from "react"
+import {userAddressbyprops} from "../../../../utils/gql"
+import {ActivityIndicator} from 'antd-mobile'
+import {Button, Icon} from 'antd'
+import {Query} from "react-apollo"
+import gql from "graphql-tag"
+import './index.css'
 
 class Address extends Component {
     constructor(props) {
         super(props)
-        this.state = {
-
-        }
+        this.state = {}
     }
 
     render() {
         return (
             <div>
-                Address
+                <Query query={gql(userAddressbyprops)} variables={{user_id: "obR_j5GbxDfGlOolvSeTdZUwfpKA"}}>
+                    {
+                        ({loading, error, data}) => {
+                            if (loading) {
+                                return (
+                                    <div className="loading-center">
+                                        <ActivityIndicator text="Loading..." size="large"/>
+                                    </div>
+                                )
+                            }
+                            if (error) {
+                                return 'error!'
+                            }
+
+                            return (
+                                <AddressRender data={data.userAddressbyprops}/>
+                            )
+                        }
+                    }
+                </Query>
             </div>
+
         )
     }
 }
 
-export default Address
+export default Address
+
+class AddressRender extends Component {
+    constructor(props) {
+        super(props)
+        this.state = {}
+    }
+
+    render() {
+        let {data} = this.props
+        return (
+            <div>
+                <div className='address-add'>
+                    <Icon type="plus" style={{fontSize: 22}}/>&nbsp;
+                    添加新地址
+                </div>
+                <div>
+                    {data.map(address => {
+                        return (
+                            <div key={address.id} className='address-card'>
+                                <div>
+                                    收件人：{address.username}
+                                </div>
+                                <div>
+                                    联系电话：{address.telephone}
+                                </div>
+                                <div>
+                                    联系地址：{address.province + address.city + address.area + address.address}
+                                </div>
+                                <Button type='danger' className='address-delete'>删除</Button>
+                            </div>
+                        )
+                    })}
+                </div>
+            </div>
+        )
+    }
+}

src/utils/gql.js

@@ -56,8 +56,38 @@ const cart_by_userid = `
     }
 `
 
+const userAddressbyprops = `
+    query userAddressbyprops($address: String, $updatedAt: String, $telephone: String, $default: Int, $city: String, $username: String, $postcode: String, $createdAt: String, $deletedAt: String, $user_id: ID, $area: String, $province: String) {
+        userAddressbyprops: userAddress_by_props(address: $address updatedAt: $updatedAt telephone: $telephone
+default: $default city: $city username: $username postcode: $postcode createdAt: $createdAt deletedAt: $deletedAt user_id: $user_id area: $area province: $province) {
+        address
+        updatedAt
+        telephone
+        default
+        city
+        username
+        postcode
+        createdAt
+        deletedAt
+        id
+        user_id {
+            email
+            updatedAt
+            password
+            telephone
+            username
+            createdAt
+            openid
+            id
+        }
+        area
+        province
+    }
+}
+`
 export {
     productbyprops,
     productbyid,
-    cart_by_userid
+    cart_by_userid,
+    userAddressbyprops
 }