wechat/src/pages/sales/salesRecord/index.vue

<template>
  <div class="mainPage flex-v">
    <div class="top">
      <topCaseInfo :data="topCaseInfoData" :userName="userInfo.customer !== undefined ? userInfo.customer.CustomerName : ''" @selectCase="showVanPicker"></topCaseInfo>
    </div>
    <div class="flex-item body">
      <div>
        <ul>
          <li v-for="(item,index) in list" :key="index">
            <salesRecordItem :data="item" :fibdata="fibdata(item)" @triggerCardAndCoupon="triggerCardAndCoupon" @triggerDrink="triggerDrink" @toDetail='toDetail'></salesRecordItem>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import topCaseInfo from '../../../components/topCaseInfo/index'
import salesRecordItem from '../../../components/salesRecordItem/index'
import { mapState, createNamespacedHelpers } from 'vuex'
const { mapState: mapForbidState, mapActions: mapForbidActions } = createNamespacedHelpers('forbid')
const { mapActions: actions } = createNamespacedHelpers('app')
const { mapActions: caseTableActions } = createNamespacedHelpers('placeOrderForCoffee')
const { mapState: mapCaseState, mapActions: mapCaseActions } = createNamespacedHelpers('case')
export default {
  name: '',
  data () {
    return {
      topCaseInfoData: {
        CaseName: '',
        caseId: '',
        showSelect: false
      },
      list: []
    }
  },
  components: {
    topCaseInfo,
    salesRecordItem
  },
  computed: {
    ...mapState({
      userInfo: x => x.userCenter.userInfo,
      CaseList: x => x.app.CaseList,
      CaseTableList: x => x.placeOrderForCoffee.CaseTableList,
    }),
    ...mapCaseState({
      caseTotal: x => x.caseTotal,
    }),
    ...mapForbidState({
      salesList: x => x.salesList,
      forbidList: x => x.forbidList,
    }),
  },
  created () {
    this.getCaseList().then((res) => {
      this.topCaseInfoData.CaseName = res.cases[0].CaseName
      this.topCaseInfoData.CaseId = res.cases[0].CaseId
    })
    this.init()
  },
  methods: {
    ...actions([
      'getCaseList',
    ]),
    ...mapCaseActions([
      'getCaseTotal',
    ]),
    fibdata (item) {
      const couponfib = this.forbidList.filter(x => x.UserId === item.UserId && x.ForbidType === 'coupon').length > 0 ? true : false
      const orderfib = this.forbidList.filter(x => x.UserId === item.UserId && x.ForbidType === 'order').length > 0 ? true : false
      return {
        'coupon': couponfib,
        'order': orderfib
      }
    },
    showVanPicker () {
      this.showSelect = true
    },
    selectCase (val) { // 选择案场
      this.topCaseInfoData.CaseName = val.CaseName
      this.topCaseInfoData.CaseId = val.CaseId
      this.getCaseTableList({
        caseid: this.topCaseInfoData.CaseId
      })
      this.showSelect = false
    },
    ...mapForbidActions(['getSales', 'getForbidList', 'putForbid', 'putForbidOpen']),
    triggerCardAndCoupon (val) { // 切换卡券状态 type='close'：关闭；type='open'：开启；
      console.log(val)
      if (val.type === 'open') {
        this.putForbid({ userid: val.data.UserId, type: 'coupon' })
      } else {
        this.putForbidOpen({ userid: val.data.UserId, type: 'coupon' })
      }
      this.init()
    },
    triggerDrink (val) { // 切换饮品状态 type='close'：关闭；type='open'：开启；
      console.log(val)
      if (val.type === 'open') {
        this.putForbid({ userid: val.data.UserId, type: 'order' })
      } else {
        this.putForbidOpen({ userid: val.data.UserId, type: 'order' })
      }
      this.init()
    },
    toDetail (item) {
      console.log(item)
      this.$router.push({ name: 'salesGiveOutDetail', query: { id: item.UserId } })
    },
    init () {
      this.getSales({ type: 'sales' }).then(() => {
        this.getForbidList().then(() => {
          this.list = []
          for (let i = 0; i < this.salesList.length; i++) {
            let CustomerCard = this.salesList[i].CustomerCard || []
            let CustomerCoupon = this.salesList[i].CustomerCoupon || []
            let OrdersDetail = this.salesList[i].OrdersDetail || []
            let item = {
              name: this.salesList[i].RealName,
              id: i,
              cardAndCoupon: {
                totalNum: '100',
                usedNum: CustomerCard.length + CustomerCoupon.length
              },
              drink: {
                totalNum: '100',
                usedNum: OrdersDetail.length
              },
              UserId: this.salesList[i].UserId
            }
            this.list.push(item)
          }
        })
      })
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
@import 'page.scss';
</style>