add order

src/case/BillApp/src/App.js

@@ -16,7 +16,7 @@ import Bill from './components/Bill/Bill'
 import BillDetail from './components/BillDetail/BillDetail'
 
 
-import './App.css';
+import './components/App/App.css';
 
 window.sessionStorage.setItem('openid',config.APPID)
 
@@ -34,9 +34,15 @@ class BillApp extends Component{
 
     this.changePage=this.changePage.bind(this)
     this.setDetail=this.setDetail.bind(this)
+    this.getBills=this.getBills.bind(this)
+
+  }
+
+  componentDidMount() {
+      this.getBills()
   }
 
-  //更改页面
+    //更改页面
   changePage(page=''){
     console.log(page)
     this.setState({page})
@@ -54,6 +60,8 @@ class BillApp extends Component{
         this.setState({
             bills:e.billbyprops
         })
+
+        return e.billbyprops
     })
   }
 
@@ -64,7 +72,7 @@ class BillApp extends Component{
         return(
           <div className="pageWrap">
             <div className="scrollPage">
-              <HomePage changePage={this.changePage} setDetail={this.setDetail}/>
+              <HomePage changePage={this.changePage} setDetail={this.setDetail} getBills={this.getBills}/>
             </div>
           </div>
           )
@@ -97,7 +105,7 @@ class BillApp extends Component{
           return (
             <div className="pageWrap">
               <div className="scrollPage">
-                <BillDetail changePage={this.changePage} detail={this.state.detail}/>
+                <BillDetail changePage={this.changePage} detail={this.state.detail} bills={this.state.bills}/>
               </div>
             </div>
           )

src/case/BillApp/src/components/BillDetail/BillDetail.css

@@ -0,0 +1,41 @@
+.detail-wrap{
+    padding: 10px 5px;
+    background:#fff;
+}
+
+
+
+.detail-wrap .balance{
+    font-size: 9px;
+    color: #cccccc;
+}
+
+.balance-money{
+    font-size: 15px;
+    font-weight: bold;
+    padding: 3px 0;
+}
+.income-wrap , .pay-wrap{
+    display: flex;
+    padding: 5px 0;
+}
+
+.income-wrap span:nth-child(1){
+    flex-grow: 0.9;
+
+}
+
+.income-wrap span:nth-child(2){
+    flex-grow: 0.1;
+    color: red;
+}
+
+.pay-wrap span:nth-child(1){
+    flex-grow: 0.9;
+
+}
+
+.pay-wrap span:nth-child(2){
+    flex-grow: 0.1;
+    color: green;
+}

src/case/BillApp/src/components/BillDetail/BillDetail.jsx

@@ -1,54 +1,115 @@
 import React, { Component } from 'react'
 
 import NavBars from '../common/NavBar'
-import Pickers from '../common/Picker'
+//import Pickers from '../common/Picker'
 
 
-//import {setSessionStorage,getSessionStorage} from '../../untils/session_help'
-import {collectByDate} from '../../untils/date'
 
 
+//import {setSessionStorage,getSessionStorage} from '../../untils/session_help'
+import {getDayCollect,getWeekCollect,getMonthCollect,getAllCollect} from '../../untils/collect'
+import './BillDetail.css'
 
 
-const season = [
-    {
-      label: '春',
-      value: '春',
-    },
-    {
-      label: '夏',
-      value: '夏',
-    },
-  ];
+// const season = [
+//     {
+//       label: '春',
+//       value: '春',
+//     },
+//     {
+//       label: '夏',
+//       value: '夏',
+//     },
+//   ];
 
 export default class BillDetail extends Component {
     constructor(props){
         super(props)
         this.state={
-            bill:[]
+            bill:[],
+            pay:0,
+            income:0,
+            billArr:[]
         }
-        console.log('detailPage',props)
-    }
 
-    componentDidMount(props){
-        
     }
 
-    componentWillUnmount(){
+    componentDidMount(props){
+        console.log('detailPageProps',props)
+        const detail=this.props.detail
+        const bills=this.props.bills
+        if(detail==='day'){
+            this.getDay(bills)
+        }else if(detail==='week'){
+            this.getWeek(bills)
+        }else if(detail==='month'){
+            this.getMonth(bills)
+        }else{
+            this.getAll(bills)
+        }
 
     }
 
-    classBill(bill){
+    getDay(bills){
+        let collect=getDayCollect(bills)
+        this.setState({pay:collect.pay,income:collect.income,billArr:collect.billArr})
+    }
+    getWeek(bills){
+        let collect=getWeekCollect(bills)
+        this.setState({pay:collect.pay,income:collect.income,billArr:collect.billArr})
+    }
+    getMonth(bills){
+        let collect=getMonthCollect(bills)
+        this.setState({pay:collect.pay,income:collect.income,billArr:collect.billArr})
+    }
+    getAll(bills){
+        let collect=getAllCollect(bills)
+        this.setState({pay:collect.pay,income:collect.income,billArr:collect.billArr})
+    }
+    
+    renderList(){
+        let billArr=this.state.billArr||[]
+        let length=billArr.lemgth
+        if(length){
+            return <div>没有流水记录</div>
+        }else{
+            return (
+             billArr.map((item)=>{
+                 return (
+                   <div className={"pay-wrap"} style={{background:"#fff",margin:"5px 0",padding:"13px 5px"}} key={item.id}>
+                       <span>{item.remark}</span>
+                       <span>{item.money}</span>
+                   </div>
+                 )
+             })
+            )
+        }
 
     }
 
     render() {
+
         return (
         <div>
-            <NavBars changePage={this.props.changePage} page="home"/>
-            <div className="deatilWrap">
-                <Pickers data={season}/>
+            <NavBars changePage={this.props.changePage} page="home" navBarText={"账单详情"}/>
+            <div className={'detail-wrap'}>
+                <div className="balance">结余:</div>
+                <div className={"balance-money"}>{this.state.income - this.state.pay}</div>
+                <div className={"income-wrap"}>
+                    <span>收入</span>
+                    <span>{this.state.income}</span>
+                </div>
+                <div className={"pay-wrap"}>
+                    <span>支出</span>
+                    <span>{this.state.pay}</span>
+                </div>
             </div>
+            <div style={{height:'20px'}}></div>
+            {this.renderList()}
+
+            {/*<div className="deatilWrap">
+                <Pickers data={season}/>
+            </div>*/}
         </div>
         )
     }

src/case/BillApp/src/components/HomePage/HomePage.jsx

@@ -24,15 +24,14 @@ class HomePage  extends Component{
         super(props)
         const month =new Date().getMonth()+1
         const year=new Date().getFullYear()
-        this.state={
+        this.state= {
             month,
             year,
-            weekBottom:'',
-            weekTop:'',
-            bills:[],
-            navBarText:'微记账本'
+            weekBottom: '',
+            weekTop: '',
+            bills: [],
+            navBarText: '微记账本'
         }
-        
         //this.handleChange=this.handleChange.bind(this)
     }
 
@@ -73,7 +72,7 @@ class HomePage  extends Component{
                     <div className="buttonWrap">
                     <Buttons changePage={this.props.changePage} toPage='bill' buttonText='+ 记一笔'/>
                 </div>
-                <IconList bills={this.state.bills} week={{weekTop,weekBottom}} changePage={this.props.changePage} setDetail={this.props.setDetail}/>
+                <IconList bills={this.state.bills} week={{weekTop,weekBottom}} changePage={this.props.changePage} setDetail={this.props.setDetail} getBills={this.props.getBills}/>
             </div>
         )
     }

src/case/BillApp/src/components/HomePage/IconList.jsx

@@ -20,6 +20,8 @@ export default class IconList extends Component{
             allIncome:0.00
         }
     }
+
+
     componentWillReceiveProps(props){
         let {bills,week}=props
         this.getDayCollect(bills)
@@ -28,7 +30,7 @@ export default class IconList extends Component{
         this.getAllCollect(bills)
     }
 
-    
+
     getDayCollect(bills=[]){
         let day=new Date().toDateString()
         bills.forEach((item)=>{
@@ -50,8 +52,6 @@ export default class IconList extends Component{
                 return 0
             }
         })
-        
-
     }
 
     getWeekCollect(bills,week){

src/case/BillApp/src/untils/collect.js

@@ -0,0 +1,87 @@
+import {getMonDayAndSunDay} from "./date";
+
+
+function collectByDate(arr=[],bottom,top){
+
+  //console.log('log',bottom,top)
+  let Pay=0,Income=0;
+  arr=arr.filter((item)=>{
+    return (new Date(item.time).getTime()>=bottom&&new Date(item.time).getTime()<=top)
+  })
+
+  arr.forEach(item => {
+    if(item.class==='pay'){
+      Pay+=parseInt(item.money,10)
+    }else{
+      Income+=parseInt(item.money,10)
+    }
+  })
+
+  //console.log(Pay,Income)
+  return{Pay,Income,arr}
+}
+
+export function getDayCollect(bills=[]){
+  let day=new Date().toDateString()
+  let dayPay=0,dayIncome=0,billArr=[];
+  bills.forEach((item)=>{
+    let itemDay=new Date(item.time).toDateString()
+    if(itemDay===day){
+      billArr=item
+      if(item.class==='pay'){
+          dayPay=item.money
+      }else{
+          dayIncome=item.money
+      }
+    }
+
+  })
+  return {pay:dayPay,income:dayIncome,billArr}
+}
+
+export function getWeekCollect(bills=[]){
+
+  let today=new Date().toLocaleString('chinese', { hour12: false }).slice(0,10)
+
+  let result=getMonDayAndSunDay(today)
+
+  let weekBottom='20' + result[1].slice(1,10)
+  let weekTop='20'+ result[2].slice(1,10)
+
+
+  let bottom=new Date(weekBottom).getTime(),
+    top=new Date(weekTop).getTime();
+
+  let weeks=collectByDate(bills,bottom,top)
+
+  let weekPay=weeks.Pay
+  let weekIncome=weeks.Income
+  let billArr=weeks.arr
+
+
+  return {pay:weekPay,income:weekIncome,billArr}
+}
+
+export function getMonthCollect(bills=[]){
+
+  const month =new Date().getMonth()+1
+  const year=new Date().getFullYear()
+  let bottom=new Date(year+'/'+month+'/1').getTime(),
+    top=new Date(year+'/'+month+'/31').getTime();
+  let months=collectByDate(bills,bottom,top)
+
+  return {pay:months.Pay,income:months.Income,billArr:months.billArr}
+}
+
+export function getAllCollect(bills=[]){
+  let allPay=0,allIncome=0;
+  bills.forEach((item)=>{
+    if(item.class==='pay'){
+      allPay+=item.money
+    }else{
+      allIncome+=item.money
+    }
+  })
+
+  return {pay:allPay,income:allIncome,billArr:bills}
+}

src/case/BillApp/src/untils/date.js

@@ -49,7 +49,7 @@ export function collectByDate(arr=[],bottom,top){
             Income+=parseInt(item.money,10)
         }
     })
-    
+
     //console.log(Pay,Income)
     return{Pay,Income,arr}
 }

src/case/OrderApp/src/components/App/App.css

@@ -0,0 +1,39 @@
+
+
+.orderApp .pageWrap{
+    position: relative;
+    z-index: 2;
+    height: 100%;
+    margin-top: 0;
+    padding-top: 45px;
+}
+.scrollPage{
+    height: 440px;
+    overflow-y: hidden;
+    overflow:scroll;
+    margin-top: 1px;
+}
+
+.orderApp div.am-tabs-default-bar-tab{
+    font-size: 10px;
+}
+
+
+.orderApp  .navBars{
+    position: absolute;
+    width: 100%;
+    top: 0;
+    left: 0;
+    z-index:2;
+}
+
+.orderApp  .listText{
+    font-size: 14px;
+}
+
+
+
+
+
+
+

src/case/ShopApp/src/App.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import './App.css';
+import './components/App/App.css';
 
 import {PageContext,NumContext} from './context/context'
 

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

@@ -3,28 +3,16 @@ import { List } from 'antd-mobile';
 
 import './RadioAddress.css'
 
-
-
-
-
-
-
-
 import {graphqls} from '../../api/graphql_request'
 import {updateAddress,getAddressByProps} from '../../api/graphql/address'
 
-
-
 const Item = List.Item;
 const Brief = Item.Brief;
 
-
-
-
 export default class RadioAddress extends Component{
 
   onChange = (id) => {
-   // console.log('id:',id)
+   //console.log('id:',id)
     this.updateAddress(id)
   };
 

src/case/ShopApp/src/components/HomePage/HomePage.jsx

@@ -30,23 +30,24 @@ class HomePage extends Component{
     //获取所有商品
     getGoods(variables={}){
         return graphqls(getProductByProps,variables).then((data)=>{
-        let products=data.productbyprops||[]
-        let arr=products.map((item)=>{
-          return item.category
-        })
-        arr = Array.from(new Set(arr))
-        let tabs=arr.map((item)=>{
-          return {title:item}
-        })
-        this.setState({
-          tabs:[{title: '所有果品'},...tabs],
-          products:products,
-          select:'所有果品',
-          detail:'false',
-          loading:false
-        })
-       // sessionStorage.setItem("products",JSON.stringify(products))
-        })
+            console.log(data)
+            let products=data.productbyprops||[]
+            let arr=products.map((item)=>{
+              return item.category
+            })
+            arr = Array.from(new Set(arr))
+            let tabs=arr.map((item)=>{
+              return {title:item}
+            })
+            this.setState({
+              tabs:[{title: '所有果品'},...tabs],
+              products:products,
+              select:'所有果品',
+              detail:'false',
+              loading:false
+            })
+           // sessionStorage.setItem("products",JSON.stringify(products))
+            })
     }
 
     tabChange(e){

src/case/ShopApp/src/components/OrderCenterPage/OrderCenterPage.jsx

@@ -70,7 +70,9 @@ class OrderCenterPage extends Component {
   }
 
   deleteOrder(data){
+      console.log('deleteOrderData',data)
     graphqls(DELETE_ORDER,data).then(e=>{
+        console.log('deleteOrer',e)
         let user_id=sessionStorage.getItem('openid')
         this.getOrder({user_id})
     })