crm-mobile/pages_crm/customer/components/tabsAbout.vue

<template>
  <view class="detail-customer-about">
    <about-contacts :list="contactsList" :config="getConfigs('contacts')" class="about-section" />
    <about-group :list="teamList" :config="getConfigs('group')" class="about-section" />
    <about-business :list="businessList" :config="getConfigs('business')" class="about-section" />
    <about-contract :list="contractList" :config="getConfigs('contract')" class="about-section" />
    <about-receivables :list="receivedList" :config="getConfigs('receivables')" class="about-section" />

    <about-file
      v-if="batchId"
      :batch-id="batchId"
      :detail-id="detailId"
      :is-seas="isSeas"
      type="crm_customer"
      class="about-section" />

    <about-operation
      :detail-id="detailId"
      type="crm_customer"
      class="about-section" />
  </view>
</template>

<script>
  import {
    QueryContacts,
    QueryBusiness,
    QueryContract,
    QueryReceivables,
    GetMembers
  } from 'API/crm/customer'

  import AboutContacts from '../../components/tabAbout/aboutContacts.vue'
  import AboutGroup from '../../components/tabAbout/aboutGroup.vue'
  import AboutBusiness from '../../components/tabAbout/aboutBusiness.vue'
  import AboutContract from '../../components/tabAbout/aboutContract.vue'
  import AboutReceivables from '../../components/tabAbout/aboutReceivables.vue'
  import AboutFile from '../../components/tabAbout/aboutFile.vue'
  import AboutOperation from '../../components/tabAbout/aboutOperation.vue'

  export default {
    name: 'DetailCustomerAbout',
    components: {
      AboutContacts,
      AboutGroup,
      AboutBusiness,
      AboutContract,
      AboutReceivables,
      AboutFile,
      AboutOperation
    },
    props: {
      detailId: {
        type: [String, Number],
        default: null,
        required: true
      },
      detailData: {
        type: Object,
        default: () => {}
      },
      batchId: {
        type: String,
        default: null
      },
      isSeas: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
        contactsList: [],
        businessList: [],
        contractList: [],
        receivedList: [],
        teamList: [],

        contractReady: false,
        receivedReady: false
      }
    },
    computed: {
      flag() {
        return this.contractReady && this.receivedReady
      }
    },
    watch: {
      flag: {
        handler(val) {
          if (val) {
            if (this.contractList.length > 0) {
              this.contractList.forEach(contract => {
                let filterRes = this.receivedList.filter(received => {
                  return contract.contract_id == received.contract_id && received.check_status === 2
                })
                let doMoney = 0
                filterRes.forEach(item => {
                  doMoney += Number(item.money)
                })
                contract.doMoney = doMoney.toFixed(2)
                this.$set(contract, 'doMoney', contract.doMoney)
              })
            }
            console.log('redy contractList', this.contractList)
          }
        },
        immediate: true
      }
    },
    created() {
      this.getList()
    },
    methods: {
      getList() {
        let params = {
          customerId: this.detailId,
          pageType: 0
        }
        QueryContacts(params).then(response => {
          console.log('contactsList: ', response)
          this.contactsList = response.list
        }).catch()

        QueryBusiness(params).then(response => {
          console.log('businessList: ', response)
          this.businessList = response.list
        })

        QueryContract(params).then(response => {
          console.log('contractList: ', response)
          this.contractList = response.list || []
          this.contractReady = true
        })

        QueryReceivables(params).then(response => {
          console.log('receivedList: ', response)
          this.receivedList = response.list || []
          this.receivedReady = true
        })

        GetMembers({
          id: this.detailId
        }).then(res => {
          console.log('teamList: ', res)
          this.teamList = res
        }).catch(() => {})
      },

      getConfigs() {
        return {
          detail: this.detailData,
          type: 'customer',
          isSeas: this.isSeas
        }
      }
    }
  }
</script>

<style scoped lang="scss">

</style>