add delete userCart method

src/configs/url.js

@@ -1,3 +1,4 @@
-const graphqlFC = 'https://ec.ioobot.cn/graphql';
+// const graphqlFC = 'https://ec.ioobot.cn/graphql';
+const graphqlFC = 'http://ecenhance.ioobot.cn/graphql';
 
 export {graphqlFC}

src/pages/cart/all/edit/index.js

@@ -1,14 +1,16 @@
-import React, { Component } from 'react';
-import { Checkbox, WhiteSpace, Modal, Toast } from 'antd-mobile';
-import classNames from 'classnames';
-// import { Query,Mutation } from "react-apollo";
+import React, {Component} from 'react'
+import {Checkbox, WhiteSpace, Modal, Toast} from 'antd-mobile'
+import classNames from 'classnames'
+import {Mutation} from "react-apollo"
+import gql from "graphql-tag"
 
 import '../index.css'
-const alert = Modal.alert;
+import {delete_userCart_by_id} from "../../../../utils/gql"
+const alert = Modal.alert
 
 class CartEdit extends Component {
     constructor(props) {
-        super(props);
+        super(props)
         this.state = {
             isSelectAll:false,
             selectedCount:0
@@ -20,236 +22,241 @@ class CartEdit extends Component {
         this.setState({
             cartList:this.props.cartList
         },()=>{
-            this.checkedAll('',false);
-        });
+            this.checkedAll('',false)
+        })
 
     }
 
     //获取输入框的值
     getInputValue=(e,i)=>{
         this.setState({
-            cartList:this.state.cartList.map((ele,index)=>{
+            cartList:this.state.cartList.map((item,index)=>{
                 if(index===i){
-                    ele.count=e.target.value;
-                    return ele
+                    item.count=e.target.value
+                    return item
                 }else {
-                    return ele
+                    return item
                 }
             })
-        });
-        this.sumCount();
-    };
+        })
+        this.sumCount()
+    }
 
     // 增加
     augment=(e,i)=>{
         this.setState({
-            cartList:this.state.cartList.map((ele,index)=>{
+            cartList:this.state.cartList.map((item,index)=>{
                 if(index===i){
-                    ele.count=ele.count*1+1;
-                    return ele
+                    item.count=item.count*1+1
+                    return item
                 }else {
-                    return ele
+                    return item
                 }
             })
-        });
-        this.sumCount();
-    };
+        })
+        this.sumCount()
+    }
 
     // 减少
     reduce=(e,i)=> {
         this.setState({
-            cartList:this.state.cartList.map((ele,index)=>{
+            cartList:this.state.cartList.map((item,index)=>{
                 if(index===i){
-                    ele.count=ele.count*1-1;
-                    return ele
+                    item.count=item.count*1-1
+                    return item
                 }else {
-                    return ele
+                    return item
                 }
             })
-        });
-        this.sumCount();
-    };
+        })
+        this.sumCount()
+    }
 
     //结算传值
-    delete=()=>{
-        let {cartList} = this.state;
-        let listLength = cartList.length;
+    delete=(delete_userCart_by_id)=>{
+        let {cartList} = this.state
 
         alert('', `确定要删除这${this.state.selectedCount}种商品吗？`, [
             { text: '取消', onPress: () => console.log('cancel') },
             {
                 text: '确定',
-                onPress: () =>
-                    new Promise((resolve) => {
-                        for (let i = 0; i < listLength; i++) {
-                            if (cartList[i] && cartList[i].checked===true) {
-                                cartList.splice(i, 1); // 将使后面的元素依次前移，数组长度减1
-                                i--; // 如果不减，将漏掉一个元素
-                            }
-                        }
+                onPress: () => {
+                    let deleteList = cartList.filter((item)=> item.checked === true)
+                    let cartList1 = cartList.filter((item)=> item.checked === false)
+
+                    let deleteIdList = deleteList.map(item => item.id)
+
+                    delete_userCart_by_id({variables:{id:deleteIdList}},()=>{
+                        Toast.info('删除成功', 1)
 
                         this.setState({
-                            cartList:cartList
-                        });
-                        Toast.info('删除成功', 1);
-                        this.sumCount();
-                        setTimeout(resolve, 1000);
-                    }),
+                            cartList:cartList1,
+                            selectedCount:0
+                        })
+                    });
+                }
             },
-        ]);
-    };
+        ])
+    }
 
     //删除
     del=(e,i)=> {
         this.setState({
-            cartList:this.state.cartList.filter((ele,index)=>{
+            cartList:this.state.cartList.filter((item,index)=>{
                 if(index!==i){
                     return true
                 }else {
                     return false
                 }
             })
-        });
+        })
         setTimeout(()=>{
-            this.sumCount();
+            this.sumCount()
         },1)
-    };
+    }
 
     // 改变选择
     changeCheckedStatus=(e,i)=>{
         this.setState({
-            cartList:this.state.cartList.map((ele,index)=>{
+            cartList:this.state.cartList.map((item,index)=>{
                 if(index===i){
-                    ele.checked=!ele.checked
+                     item.checked=! item.checked
                 }
-                return ele
+                return  item
             })
-        });
+        })
 
-        let flag = this.state.cartList.every((ele,index)=>{
-            if(ele.checked===false) {
-                return false;
+        let flag = this.state.cartList.every((item,index)=>{
+            if( item.checked===false) {
+                return false
             }else {
-                return true;
+                return true
             }
-        });
+        })
 
         if(flag===true){
-            this.setState({isSelectAll:true});
+            this.setState({isSelectAll:true})
         }else {
-            this.setState({isSelectAll:false});
+            this.setState({isSelectAll:false})
         }
-        this.sumCount();
-    };
+        this.sumCount()
+    }
 
     //全选或全不选,判断全选状态
     checkedAll=(e,check)=>{
-        let checked = e.target ? e.target.checked : check;
+        let checked = e.target ? e.target.checked : check
 
         if(checked===true){
             this.setState({
-                cartList:this.state.cartList.map((ele,index)=>{
-                    ele.checked=true;
-                    return ele
+                cartList:this.state.cartList.map(( item,index)=>{
+                     item.checked=true
+                    return  item
                 }),
                 isSelectAll:true
-            });
+            })
         }else  if(checked===false){
             this.setState({
-                cartList:this.state.cartList.map((ele,index)=>{
-                    ele.checked=false;
-                    return ele
+                cartList:this.state.cartList.map((item,index)=>{
+                     item.checked=false
+                    return item
                 }),
                 isSelectAll:false
-            });
+            })
         }
-        this.sumCount();
-    };
+        this.sumCount()
+    }
 
     //计算总合计
     sumCount=()=>{
-        let selectedCount=0;
-        this.state.cartList.forEach((ele,index)=>{
-            if(ele.checked===true){
-                selectedCount+=ele.count;
+        let selectedCount=0
+        this.state.cartList.forEach((item,index)=>{
+            if(item.checked===true){
+                selectedCount+=item.count
             }
-        });
+        })
         this.setState({
             selectedCount
-        });
-    };
+        })
+    }
 
     render() {
-        let {cartList} = this.state;
-        let listLength = cartList.length;
+        let {cartList} = this.state
+        let listLength = cartList.length
 
         return (
-            <div className="cart-content-wrap">
-                <div className='cart-content'>
-                    {
-                        this.state.cartList.map((ele,index)=>{
-                            return(
-                                <div key={index}>
-                                    <div className="cart-list">
-                                        <div className="cart-list-checkbox">
+            <Mutation mutation={gql(delete_userCart_by_id)}
+                      onCompleted={()=>{this.props.refetch()}}
+                      onError={error=>console.log('error',error)}
+            >
+                {(delete_userCart_by_id,{ loading, error }) => (
+                    <div className="cart-content-wrap">
+                        <div className='cart-content'>
+                            {
+                                this.state.cartList.map((item,index)=>{
+                                    return(
+                                        <div key={index}>
+                                            <div className="cart-list">
+                                                <div className="cart-list-checkbox">
+                                                    <Checkbox
+                                                        style={{marginLeft:15}}
+                                                        checked={item.checked}
+                                                        onChange={(e)=>{this.changeCheckedStatus(e,index)}}
+                                                    />
+                                                </div>
+                                                <div className="cart-list-image">
+                                                    <img src={item.product_id.img || "https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png"} alt=""/>
+                                                </div>
+                                                <div className="cart-list-intro">
+                                                    <div>{item.product_id.name}</div>
+                                                    <div>颜色尺码等</div>
+                                                    <div>¥ {item.product_id.price}</div>
+                                                </div>
+                                                <div className="cart-list-count">
+                                                    <div className="selected">
+                                                        <button
+                                                            className={classNames({
+                                                                'selected_button': true,
+                                                                'selected_button-disabled': item.count <= 1
+                                                            })}
+                                                            disabled={item.count <= 1}
+                                                            onClick={(e)=>{this.reduce(e,index)}}
+                                                        >-</button>
+                                                        <input className="selected_input" type="text" value={item.count} onChange={(e)=>{this.getInputValue(e,index)}}/>
+                                                        <button className="selected_button" onClick={(e)=>{this.augment(e,index)}}>+</button>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <WhiteSpace size="md" />
+                                        </div>
+                                    )
+                                })
+                            }
+                        </div>
+                        {
+                            listLength ?
+                                <div className="footer">
+                                    <div className="jiesuan">
+                                        <div className="jiesuan-checkbox">
                                             <Checkbox
+                                                checked={this.state.isSelectAll}
+                                                onChange={(e)=>{this.checkedAll(e,'')}}
                                                 style={{marginLeft:15}}
-                                                checked={ele.checked}
-                                                onChange={(e)=>{this.changeCheckedStatus(e,index)}}
-                                            />
+                                            />,
+                                            <span className="jiesuan-checkbox_label">全选</span>
                                         </div>
-                                        <div className="cart-list-image">
-                                            <img src={ele.product_id.img || "https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png"} alt=""/>
-                                        </div>
-                                        <div className="cart-list-intro">
-                                            <div>{ele.product_id.name}</div>
-                                            <div>颜色尺码等</div>
-                                            <div>¥ {ele.product_id.price}</div>
-                                        </div>
-                                        <div className="cart-list-count">
-                                            <div className="selected">
-                                                <button
-                                                    className={classNames({
-                                                        'selected_button': true,
-                                                        'selected_button-disabled': ele.count <= 1
-                                                    })}
-                                                    disabled={ele.count <= 1}
-                                                    onClick={(e)=>{this.reduce(e,index)}}
-                                                >-</button>
-                                                <input className="selected_input" type="text" value={ele.count} onChange={(e)=>{this.getInputValue(e,index)}}/>
-                                                <button className="selected_button" onClick={(e)=>{this.augment(e,index)}}>+</button>
-                                            </div>
+                                        <div className="jiesuan-total">
                                         </div>
+                                        <button className="jiesuan-button" onClick={()=>{this.delete(delete_userCart_by_id)}}>
+                                            <span>删除({this.state.selectedCount})</span>
+                                        </button>
                                     </div>
-                                    <WhiteSpace size="md" />
-                                </div>
-                            )
-                        })
-                    }
-                </div>
-                {
-                    listLength ?
-                        <div className="footer">
-                            <div className="jiesuan">
-                                <div className="jiesuan-checkbox">
-                                    <Checkbox
-                                        checked={this.state.isSelectAll}
-                                        onChange={(e)=>{this.checkedAll(e,'')}}
-                                        style={{marginLeft:15}}
-                                    />,
-                                    <span className="jiesuan-checkbox_label">全选</span>
-                                </div>
-                                <div className="jiesuan-total">
-                                </div>
-                                <button className="jiesuan-button" onClick={()=>{this.delete()}}>
-                                    <span>删除({this.state.selectedCount})</span>
-                                </button>
-                            </div>
-                        </div>:''
-                }
-            </div>
-        );
+                                </div>:''
+                        }
+                    </div>
+                )}
+            </Mutation>
+        )
     }
 }
 
-export default CartEdit;
+export default CartEdit

src/pages/cart/all/index.css

@@ -70,6 +70,7 @@
 .cart-list-intro {
     width: 35%;
     position: relative;
+    text-align: left;
 }
 
 .cart-list-intro :first-child {

src/pages/cart/all/index.js

@@ -45,14 +45,14 @@ class All extends Component {
         }))
     }
 
-    renderPage = (data) => {
+    renderPage = (data, refetch) => {
         let {page} = this.state
 
         switch (page) {
             case 'detail':
                 return <CartDetail cartList={data.cartList}/>
             case 'edit':
-                return <CartEdit cartList={data.cartList}/>
+                return <CartEdit cartList={data.cartList} refetch={refetch}/>
             default:
                 return <div>test</div>
         }
@@ -64,7 +64,7 @@ class All extends Component {
         return (
             <Query query={gql(cart_by_userid)} variables={{user_id: "obR_j5GbxDfGlOolvSeTdZUwfpKA"}}>
                 {
-                    ({loading, error, data}) => {
+                    ({loading, error, data, refetch}) => {
                         if (loading) {
                             return (
                                 <div className="loading-center">
@@ -93,7 +93,7 @@ class All extends Component {
                                     </NavBar>
                                 </div>
                                 {data.cartList.length ?
-                                    this.renderPage(data) : <Empty/>
+                                    this.renderPage(data, refetch) : <Empty/>
                                 }
                             </div>
                         )

src/pages/cart/orders/index.js

@@ -140,7 +140,6 @@ class CartOrders extends Component {
                                         <div onClick={() => {
                                             this.onChangeHeight('100%', true, false)
                                         }}>
-
                                             {
                                                 unfoldList.map((ele, index) => {
                                                     return (
@@ -162,7 +161,6 @@ class CartOrders extends Component {
                                                     )
                                                 })
                                             }
-
                                             <div className='packup-title'>收起</div>
                                             <div>∧</div>
                                         </div> : ''

src/pages/cart/pay/index.js

@@ -1,6 +1,6 @@
 import React, {Component} from 'react'
 import {withRouter} from 'react-router-dom'
-import {NavBar, Icon, Checkbox} from 'antd-mobile'
+import {NavBar, Icon, Checkbox, Toast} from 'antd-mobile'
 import classNames from 'classnames'
 
 import './index.css'
@@ -10,7 +10,7 @@ class Pay extends Component {
         super(props)
         this.state = {
             checked:true,
-            totalPrice:JSON.parse(window.localStorage.getItem('totalPrice')),
+            totalPrice:JSON.parse(localStorage.getItem('totalPrice')),
         }
     }
 
@@ -20,6 +20,13 @@ class Pay extends Component {
         })
     }
 
+    pay = () => {
+        Toast.info('支付成功', 2);
+        this.props.history.push({
+            pathname:'/my'
+        })
+    }
+
     render() {
         let {checked,totalPrice} = this.state
         return (
@@ -56,9 +63,7 @@ class Pay extends Component {
                             })}
                             onClick={()=>{
                                 if(checked){
-                                    this.props.history.push({
-                                        pathname:'/my'
-                                    })
+                                   this.pay()
                                 }
                             }}>
                         <span>确认支付</span>

src/utils/gql.js

@@ -56,6 +56,15 @@ const cart_by_userid = `
     }
 `
 
+const delete_userCart_by_id = `
+    mutation($id: [String]) {
+        delete_userCart(where: {
+            id: {
+                _in: $id
+            }
+        }) 
+    }
+`
 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
@@ -136,6 +145,7 @@ export {
     productbyprops,
     productbyid,
     cart_by_userid,
+    delete_userCart_by_id,
     userAddressbyprops,
     orderbyprops
 }