商品订单

src/components/orderListItem/index.vue

 <template>
   <div class="orderListItem">
     <div class="title flex-h">
-      <div class="orange" v-if="data.status === 0">
+      <div class="orange" v-if="data.Status === 0">
         <i class="iconfont icon-dengdai"></i><br>
         <span>制作中</span>
       </div>
-      <div class="grey" v-if="data.status === 1">
+      <div class="grey" v-if="data.Status === -1">
         <i class="iconfont icon-quxiao"></i><br>
         <span>已取消</span>
       </div>
-      <div class="green" v-if="data.status === 2">
+      <div class="green" v-if="data.Status === 1">
         <i class="iconfont icon-gouxuan"></i><br>
         <span>已完成</span>
       </div>
       <div class="flex-item">
         <div>
-          <span>{{data.caseName}}</span>
+          <span>{{data.CaseName}}</span>
         </div>
       </div>
-      <span>{{data.creatTime}}</span>
+      <span>{{toolClass.dateFormat(data.CreateDate, 'MM/dd hh:mm')}}</span>
     </div>
     <div class="line">
       <div>
     <div class="list flex-h">
       <div class="flex-item">
         <ul>
-          <li v-for="(subItem,subIndex) in data.goodsList" :key="subIndex">
-            <span>{{subItem.name}}</span>
+          <li v-for="(subItem,subIndex) in data.Goods" :key="subIndex">
+            <span>{{subItem.GoodsName + (subItem.SpecName!==''?'('+subItem.SpecName+')':'')}}</span>
             <div>
-              <span>￥{{subItem.price === null ? subItem.specPrice : subItem.price}} x {{subItem.num === null ? subItem.specNum : subItem.num}}</span>
+              <span>￥{{subItem.Price}} x {{subItem.Number}}</span>
             </div>
           </li>
         </ul>

src/pages/sales/coffeeIndex/index.vue

             <div class="topInfo flex-h">
               <div class="flex-item">
                 <div>
-                  <span>共计已使用：45杯</span>
+                  <span>共计已使用：{{caseTotal.total}}杯</span>
                 </div>
               </div>
               <div class="flex-item">
                 <div>
-                  <span>本月已用：0杯</span>
+                  <span>本月已用：{{caseTotal.monthtotal}}杯</span>
                 </div>
               </div>
               <a>点单记录</a>
 import { mapState, createNamespacedHelpers } from 'vuex'
 const { mapActions: actions } = createNamespacedHelpers('app')
 const { mapActions: caseTableActions } = createNamespacedHelpers('placeOrderForCoffee')
+const { mapState: mapCaseState, mapActions: mapCaseActions } = createNamespacedHelpers('case')
 
 export default {
   name: '',
       userInfo: x => x.userCenter.userInfo,
       CaseList: x => x.app.CaseList,
       CaseTableList: x => x.placeOrderForCoffee.CaseTableList,
+    }),
+    ...mapCaseState({
+      caseTotal: x => x.caseTotal,
     })
   },
   components: {
       this.getCaseTableList({
         caseid: this.topCaseInfoData.CaseId
       })
+      this.getCaseTotal({
+        caseid: this.topCaseInfoData.CaseId
+      })
     })
   },
   methods: {
     ...caseTableActions([
       'getCaseTableList',
     ]),
+    ...mapCaseActions([
+      'getCaseTotal',
+    ]),
     selectCase (val) { // 选择案场
       this.topCaseInfoData.CaseName = val.CaseName
       this.topCaseInfoData.CaseId = val.CaseId

src/pages/user/mainPage/userCenter/index.vue

           <span>课程订单</span>
           <i class="iconfont icon-jiantou-right"></i>
         </div>
-        <div class="menu-item flex-h">
+        <div class="menu-item flex-h" @click="toGoodsOrder">
           <span>商品订单</span>
           <i class="iconfont icon-jiantou-right"></i>
         </div>
     },
     bindMobile () {
       this.$router.push({ name: 'bindMobile' })
-    }
+    },
+    toGoodsOrder () {
+      this.$router.push({ name: 'orderList' })
+    },
   }
 }
 </script>

src/pages/user/orderList/index.vue

 <template>
   <div class="mainPage flex-v">
-    <div class="top">
-      <topCaseInfo :data="topCaseInfoData"></topCaseInfo>
-    </div>
+    <!-- <div class="top">
+      <topCaseInfo :data="topCaseInfoData" :userName="userInfo.customer != undefined ? userInfo.customer.CustomerName : ''"></topCaseInfo>
+    </div> -->
     <div class="flex-item">
       <div class="flex-h">
         <div class="flex-item">
           <ul>
-            <li v-for="(item,index) in list" :key="index">
+            <li v-for="(item,index) in orders.list" :key="index">
               <orderListItem :data="item"></orderListItem>
             </li>
           </ul>
 <script>
 import topCaseInfo from '../../../components/topCaseInfo/index'
 import orderListItem from '../../../components/orderListItem/index'
+import { mapState, createNamespacedHelpers } from 'vuex'
+// const { mapActions: actions } = createNamespacedHelpers('app')
+
+const { mapState: mapOrdersState, mapActions: mapOrdersActions } = createNamespacedHelpers('goodsOrder')
 
 export default {
   name: '',
   data () {
     return {
-      topCaseInfoData: {
-        caseName: 'xxx',
-        caseId: '',
-        showSelect: false,
-        userName: 'xxx'
-      },
-      list: [{
-        status: 0,
-        caseName: '案场名称',
-        creatTime: '02/16 14:20',
-        goodsList: [{
-          name: '商品名称1',
-          specName: '加冰',
-          price: null,
-          specPrice: 20,
-          num: null,
-          specNum: 2,
-        },{
-          name: '商品名称2',
-          specName: null,
-          price: 100,
-          specPrice: null,
-          num: 1,
-          specNum: null,
-        },{
-          name: '商品名称3',
-          specName: null,
-          price: 100,
-          specPrice: null,
-          num: 1,
-          specNum: null,
-        },{
-          name: '商品名称4',
-          specName: null,
-          price: 100,
-          specPrice: null,
-          num: 1,
-          specNum: null,
-        },{
-          name: '商品名称5',
-          specName: null,
-          price: 100,
-          specPrice: null,
-          num: 1,
-          specNum: null,
-        },{
-          name: '商品名称6',
-          specName: null,
-          price: 100,
-          specPrice: null,
-          num: 1,
-          specNum: null,
-        }],
-      },{
-        status: 1,
-        caseName: '案场名称',
-        creatTime: '02/16 14:20',
-        goodsList: [{
-          name: '商品名称1',
-          specName: '加冰',
-          price: null,
-          specPrice: 20,
-          num: null,
-          specNum: 2,
-        }],
-      },{
-        status: 2,
-        caseName: '案场名称',
-        creatTime: '02/16 14:20',
-        goodsList: [{
-          name: '商品名称1',
-          specName: '加冰',
-          price: null,
-          specPrice: 20,
-          num: null,
-          specNum: 2,
-        }],
-      },{
-        status: 0,
-        caseName: '案场名称',
-        creatTime: '02/16 14:20',
-        goodsList: [{
-          name: '商品名称1',
-          specName: '加冰',
-          price: null,
-          specPrice: 20,
-          num: null,
-          specNum: 2,
-        }],
-      }],
+      page: 1,
+      pagesize: 10,
     }
   },
-  computed: {},
+  computed: {
+    ...mapState({
+      userInfo: x => x.userCenter.userInfo,
+    }),
+    ...mapOrdersState({
+      orders: x => x.orders,
+    }),
+  },
   components: {
     topCaseInfo,
     orderListItem,
   },
-  created () { },
+  created () {
+    this.getCustomerGoodsOrder({
+      page: this.page,
+      pagesize: this.pagesize,
+    })
+  },
   methods: {
-    
+    ...mapOrdersActions([
+      'getCustomerGoodsOrder',
+    ])
   }
 }
 </script>

src/store/case/case.js

+import Ajax from '../../util/ajax'
+import api from '../../util/api'
+
+// 请求数据
+export default {
+  namespaced: true,
+  state: {
+    caseTotal: {},
+  },
+  mutations: {
+    setCaseTotal (state, data) { // 获取案场下单数量信息
+      state.caseTotal = data
+    },
+  },
+  actions: {
+    getCaseTotal ({ commit }, { caseid }) {
+      return new Promise((resolve, reject) => {
+        Ajax(api.case.total.url, {
+          method: api.case.total.method,
+          urlData: {
+            caseid
+          }
+        }).then(res => {
+          commit("setCaseTotal", res)
+          resolve(res)
+        }).catch((err) => {
+          reject(err)
+        })
+      })
+    },
+  }
+}

src/store/goods/order.js

+import Ajax from '../../util/ajax'
+import api from '../../util/api'
+
+export default {
+  namespaced: true,
+  state: {
+    orders: {},
+  },
+  mutations: {
+    setGoodsOrders (state, data) { // 获取案场下单数量信息
+      state.orders = data
+    },
+  },
+  actions: {
+    getCustomerGoodsOrder ({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+        Ajax(api.goods.getCustOrders.url, {
+          method: api.goods.getCustOrders.method,
+          queryData: {
+            ...payload
+          },
+        }).then(res => {
+          commit("setGoodsOrders", res)
+          resolve(res)
+        }).catch((err) => {
+          reject(err)
+        })
+      })
+    },
+  }
+}

src/store/index.js

   userCenter: () => require('./userCenter/userCenter').default,
   majorProjects: () => require('./majorProjects/majorProjects').default,
   placeOrderForCoffee: () => require('./placeOrderForCoffee/index').default,
+  case: () => require('./case/case').default,
+  goodsOrder: () => require('./goods/order').default,
 }
 
 Object.keys(modules).forEach((modKey) => {

src/util/api.js

       url: `${baseUrl}${guest}/cms/location`
     },
   },
-  login:{ // 主管、销售端登陆
+  login: { // 主管、销售端登陆
     login: {
       method: 'post',
       url: `${baseUrl}${guest}/wxsignin`
     }
-  }
+  },
+  case: {
+    total: {
+      method: 'get',
+      url: `${baseUrl}${wechat}/goods/case/:caseid`
+    },
+  },
+  goods: {
+    getCustOrders: {
+      method: 'get',
+      url: `${baseUrl}${wechat}/goods/user`
+    }
+  },
 }
 export default $api