Merge branch 'master' of http://gogs.ioobot.com:6680/xy/online

src/case/ShopApp/src/App.js

@@ -30,12 +30,14 @@ class ShopApp extends Component {
       editAddress:false,
       fromShopCar:false,
       fromOrderCenter:false,
-      order_id:''
+      order_id:'',
+      address_id:''
     }
     this.changePage=this.changePage.bind(this)
     this.triggerAddress=this.triggerAddress.bind(this)
     this.setFromShopCar=this.setFromShopCar.bind(this)
     this.setOrderId=this.setOrderId.bind(this)
+    this.setAddressId=this.setAddressId.bind(this)
   }
 
   componentWillMount(){
@@ -55,7 +57,6 @@ class ShopApp extends Component {
     return graphqls(getProductById,{id}).then(e=>e)
   }
   //显示页面，控制子页面的显示
-
   changePage(page,product_id){
     console.log("onAppPage",page)
 
@@ -72,6 +73,11 @@ class ShopApp extends Component {
     this.setState({editAddress})
   }
 
+  setAddressId(id){
+    this.setState({address_id:id})
+    console.log(id)
+  }
+
   setNum(num){
     this.setState({num})
   }
@@ -172,9 +178,11 @@ class ShopApp extends Component {
     const setOrderId=this.setOrderId//
     const fromOrderCenter=this.state.fromOrderCenter
     const num=this.state.num
+    const address_id=this.state.address_id
+    const setAddressId=this.setAddressId
     //console.log('APPrender')
     return (
-      <PageContext.Provider value={{changePage,triggerAddress,getProductByIds,num,fromShopCar,setFromShopCar,setOrderId,order_id,product_id,fromOrderCenter}}>
+      <PageContext.Provider value={{address_id,setAddressId,changePage,triggerAddress,getProductByIds,num,fromShopCar,setFromShopCar,setOrderId,order_id,product_id,fromOrderCenter}}>
           <div className="AppWrap">
             <div className="phone6s">
               <div className="App">

src/case/ShopApp/src/api/graphql/address.js

@@ -50,4 +50,21 @@ export const createAddress=`mutation createuserAddress($address: String, $update
             area
             province
         }
+    }`
+
+    export const getAddressById=`query userAddressbyid($id: ID) {
+        userAddressbyid: userAddress_by_id(id: $id) {
+            address
+            updatedAt
+            telephone
+            default
+            city
+            username
+            postcode
+            createdAt
+            deletedAt
+            id
+            area
+            province
+        }
     }`

src/case/ShopApp/src/api/graphql/ecommerce-js.txt

@@ -387,16 +387,6 @@ query userAddressbyid($id: ID) {
         createdAt
         deletedAt
         id
-        user_id {
-            email
-            updatedAt
-            password
-            telephone
-            username
-            createdAt
-            openid
-            id
-        }
         area
         province
     }

src/case/ShopApp/src/components/AddressPage/AddressPage.jsx

@@ -7,28 +7,29 @@ import './AddressPage.css'
 import {graphqls} from '../../api/graphql_request'
 import {getAddressByProps} from '../../api/graphql/address'
 
+import {PageContext} from '../../context/context'
+
 
 const Item = List.Item;
 const Brief = Item.Brief;
 
-export default class AddressPage extends Component {
+class AddressPage extends Component {
   constructor(props){
       super(props)
       this.state={
         addressList:[]
       }
-    console.log(props.address)
-
+    //console.log(props.address)
     this.getAddress=this.getAddress.bind(this)
   }
 
   componentDidMount(){
-    this.getAddress()
+    let user_id=sessionStorage.getItem('openid')  
+    this.getAddress({user_id})
   }
 
-  getAddress(){
-    let user_id=sessionStorage.getItem('openid')  
-    graphqls(getAddressByProps,{user_id}).then((res)=>{
+  getAddress(data){
+    graphqls(getAddressByProps,data).then((res)=>{
         console.log(res.userAddressbyprops)
         this.setState({
           addressList:res.userAddressbyprops
@@ -38,7 +39,7 @@ export default class AddressPage extends Component {
 
   renderPage(page){
     if(page===true){
-      return(<EditAddress address={this.props.address}/>)
+      return(<EditAddress address={this.props.address} address_id={this.props.address_id} getAddress={this.getAddress}/>)
     }else{
       return(
         <div className="addressPageWrap">
@@ -52,7 +53,7 @@ export default class AddressPage extends Component {
           </List>
           </div>
           <div className="addressList">
-              <RadioAddress addressList={this.state.addressList} getAddress={this.getAddress}/>
+              <RadioAddress addressList={this.state.addressList} triggerAddress={this.props.triggerAddress} changePage={this.props.changePage} getAddress={this.getAddress} setAddressId={this.props.setAddressId} address_id={this.props.address_id}/>
           </div>
         </div>
       )
@@ -68,3 +69,14 @@ export default class AddressPage extends Component {
 
 
 }
+
+export default props=>{
+  return(
+      <PageContext.Consumer>
+          {(obj)=><AddressPage {...props} {...obj}/>}
+      </PageContext.Consumer>
+  )
+}
+
+
+

src/case/ShopApp/src/components/AddressPage/EditAddress.jsx

@@ -3,6 +3,7 @@ import FormAddress from './FormAddress'
 
 import {graphqls} from '../../api/graphql_request'
 import {getAddressByProps,createAddress} from '../../api/graphql/address'
+import {successToast} from '../Common/Toast'
 
 export default class EditAddress extends Component {
   constructor(props){
@@ -20,13 +21,13 @@ export default class EditAddress extends Component {
   //创建用户地址
 
   createUserAddress(data){
-    graphqls(createAddress,data).then(e=>console.log(e))
+    graphqls(createAddress,data).then(e=>{successToast('创建地址成功',2)})
     //console.log('---------',data)
   }
   render() {
     return (
       <div>
-        <FormAddress createUserAddress={this.createUserAddress}/>
+        <FormAddress createUserAddress={this.createUserAddress} address={this.props.address} address_id={this.props.address_id} getAddress={this.getAddress}/>
       </div>
     )
   }

src/case/ShopApp/src/components/AddressPage/FormAddress.jsx

@@ -4,9 +4,13 @@ import { List, InputItem, WhiteSpace ,Picker,PickerView, Button, WingBlank} from
 import { createForm } from 'rc-form';
 import './FormAddress.css'
 
+import {graphqls} from '../../api/graphql_request'
+import {getAddressById,updateAddress} from '../../api/graphql/address'
+
 import { district} from 'antd-mobile-demo-data';
 
 import config from '../../api/url_config'
+import {successToast} from '../Common/Toast'
 
 const APPID =config.APPID
 
@@ -33,6 +37,26 @@ export default class FormAddress extends Component {
       this.codeChange=this.codeChange.bind(this)
       this.submit=this.submit.bind(this)
   }
+
+  componentWillMount(){
+    //console.log('from render------',this.props.address_id)
+    if(this.props.address_id){
+      graphqls(getAddressById,{id:this.props.address_id}).then((e)=>{
+        console.log('--------getAddressBYID------------',e.userAddressbyid)
+        let address=e.userAddressbyid
+        this.setState({
+          name:address.username,
+          phone:address.telephone,
+          detail:address.address,
+          code:address.postcode,
+          "area": address.area,
+          "city": address.city,
+          "province": address.province
+        })
+      })
+    }
+
+  }
   nameChange(e){
     console.log(e)
     this.setState({
@@ -98,6 +122,11 @@ export default class FormAddress extends Component {
     })
   }
 
+  updateUserAddress(data){
+    graphqls(updateAddress,data).then(e=>{
+      successToast('更新地址成功',2)
+    })
+  }
   submit(){
     let data={
       "address": this.state.detail,
@@ -113,7 +142,12 @@ export default class FormAddress extends Component {
       "username": this.state.name
     }
     //console.log(this.props)
-    this.props.createUserAddress(data)
+    if(this.props.address_id){
+      this.updateUserAddress(data)
+    }else{
+      this.props.createUserAddress(data)
+    }
+    
   }
 
   trigger(){

src/case/ShopApp/src/components/AddressPage/RadioAddress.css

@@ -8,4 +8,41 @@
 
   .am-list-item .am-list-line .am-list-content{
     font-size: 12px;
-  }
+  }
+
+  .addressListWrap{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 5px 0;
+    overflow: hidden;
+    margin-top: 10px;
+    border-bottom: 1px solid #d8d2d2;
+  }
+
+  .left-icon{
+    height: 15px;
+    flex-basis: 15px;
+    border-radius: 50%;
+    margin-right: 5px;
+    border: 1px solid #ccc;
+  }
+
+  .left-icon:hover{
+    box-shadow: 0 0 1px 1px #ccc;
+  }
+  .right-icon{
+    height: 20px;
+    width: 20px;
+    flex-basis: 21px;
+    background: url('../../images/modify.svg') no-repeat center center;
+  }
+
+  .middle-text{
+    height: 20px;
+    flex-basis: 248px;
+    line-height: 20px;
+    padding: 0 5px;
+  }
+
+ 

src/case/ShopApp/src/components/AddressPage/RadioAddress.jsx

@@ -28,6 +28,11 @@ export default class RadioAddress extends Component{
     this.updateAddress(id)
   };
 
+  toModifyAddress(id){
+    this.props.setAddressId(id)
+    this.props.triggerAddress(true)
+  }
+
   updateAddress=(id)=>{
     let that=this
     console.log('更新启动')
@@ -50,20 +55,34 @@ export default class RadioAddress extends Component{
   }
 
   render() {
+    //获取地址列表
     let addressList=[...this.props.addressList]   
     return (
       <div>
+      {/*
         <List renderHeader={() => ''}>
           {addressList.map(item => (
-            <List  key={item.id} onClick={()=>this.onChange(item.id)}>
+            <List   >
               <Item
                 thumb={item.default===1 ? "https://zos.alipayobjects.com/rmsportal/dNuvNrtqUztHCwM.png" : ''}
                 arrow="horizontal"
                 onClick={() => {}}
-              >{item.username+item.telephone+item.province+item.city+item.area+item.address}</Item>
+              ></Item>
             </List>
           ))}
-        </List>
+          </List>*/}
+
+          {
+            addressList.map((item)=>{
+              return(
+                <div className="addressListWrap" key={item.id}>
+                  <span className="left-icon" onClick={()=>this.onChange(item.id)} style={item.default===1?{background: "#1890ff"}:{}}></span>
+                  <span className="middle-text">{item.username+item.telephone+item.province+item.city+item.area+item.address}</span>
+                  <span className="right-icon" onClick={()=>this.toModifyAddress(item.id)}></span>
+                </div>
+              )
+            })
+          }
       </div>
     );
   }

src/case/ShopApp/src/components/OrderPage/OrederPage.jsx

@@ -77,23 +77,6 @@ class OrderPage extends React.Component{
         }
     }
 
-    /*
-        count: 5
-        createdAt: "2018-11-22 5:10:02"
-        deliveryTime: ""
-        id: "1542877802949"
-        orderLogistics_id: null
-        orderPay_id: null
-        orderProducts: [{…}]
-        orderShipFee: 0
-        orderStatus: "0"
-        orderTotalPay: 49.95
-        payTime: "2018-11-22 5:10:02"
-        productTotalPay: 49.95
-        updatedAt: ""
-        userAddress_id: {address: "彩虹家园1栋1601", updatedAt: "2018-11-15 4:41:06", telephone: "1322637947", default: 1, city: "合肥市", …}
-    */
-
     componentWillUnmount(){
         this.props.setFromShopCar(false)
         this.props.setOrderId(false)
@@ -268,10 +251,9 @@ class OrderPage extends React.Component{
                         multipleLine
                         onClick={() => {
                             this.props.changePage('addressPage')
-                            this.props.triggerAddress(true)
                         }}
                         >{address ?
-                            address.username+address.telephone+address.province+address.city+address.area+address.address:'地址为空,新建一个地址'
+                            address.username+address.telephone+address.province+address.city+address.area+address.address:'请选择一个地址'
                         }
                         </Item>
                     </List>

src/case/ShopApp/src/images/modify.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1544585522847" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2105" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><defs><style type="text/css"></style></defs><path d="M295.384615 708.923077h433.23077a19.692308 19.692308 0 1 1 0 39.384615h-433.23077a19.692308 19.692308 0 1 1 0-39.384615zM590.769231 303.576615L618.653538 275.692308l72.979693 73.019077-27.844923 27.844923L590.769231 303.576615z m-236.307693 196.923077L382.345846 472.615385l89.284923 89.324307-27.844923 27.844923L354.461538 500.499692z" p-id="2106" fill="#707070"></path><path d="M401.329231 616.841846l308.342154-308.342154-55.689847-55.689846-308.381538 308.342154-8.152615 63.881846 63.881846-8.192z m-93.065846-74.043077l317.833846-317.833846a39.384615 39.384615 0 0 1 55.729231 0l55.689846 55.689846a39.384615 39.384615 0 0 1 0 55.689846l-317.833846 317.833847-127.763693 16.344615 16.344616-127.724308z" p-id="2107" fill="#707070"></path></svg>