crm-mobile/pages_crm/homeReport/report.vue

<template>
  <view class="uni-app">
    <view class="status-bar" />
    <view v-if="typeObj" class="main-container">
      <wk-nav-bar :title="navTitle" />

      <view class="list-view">
        <wk-scroll-view
          :status="listStatus"
          class="list-scroll"
          @refresh="getList({}, true)"
          @loadmore="getList()">
          <template v-for="(item, index) in listData">
            <customer-item
              v-if="typeObj.comName === 'CustomerItem'"
              :key="index"
              :item-data="item" />
            <contacts-item
              v-if="typeObj.comName === 'ContactsItem'"
              :key="index"
              :index="index"
              :item-data="item" />
            <business-item
              v-if="typeObj.comName === 'BusinessItem'"
              :key="index"
              :item-data="item" />
            <contract-item
              v-if="typeObj.comName === 'ContractItem'"
              :key="index"
              :item-data="item" />
            <received-item
              v-if="typeObj.comName === 'ReceivedItem'"
              :key="index"
              :item-data="item" />
          </template>
        </wk-scroll-view>
      </view>
    </view>
  </view>
</template>

<script>
  import { BulletinList } from 'API/crm/work'
  import { QueryLogBulletinByType } from 'API/oa/journal'

  import CustomerItem from '../customer/components/customerItem.vue'
  import ContactsItem from '../contacts/components/contactsItem.vue'
  import BusinessItem from '../business/components/businessItem.vue'
  import ContractItem from '../contract/components/contractItem.vue'
  import ReceivedItem from '../receivables/components/receivedItem.vue'

  import { mapGetters } from 'vuex'
  import mainListMixins from '@/mixins/mainList.js'
  import { isArray } from '@/utils/types.js'

  export default {
    name: 'HomeReport',
    components: {
      CustomerItem,
      ContactsItem,
      BusinessItem,
      ContractItem,
      ReceivedItem
    },
    mixins: [mainListMixins],
    data() {
      return {
        type: null,
        routerQuery: {},
        GetListFn: BulletinList
      }
    },
    computed: {
      typeObj() {
        if (!this.type) return null
        if (this.routerQuery.logId) {
          return {
            customer: {type: 1, comName: 'CustomerItem'},
            business: {type: 2, comName: 'BusinessItem'},
            contract: {type: 3, comName: 'ContractItem'},
            receivables_money: {type: 4, comName: 'ReceivedItem'}
          }[this.type] || null
        }

        const typeMap = {
          customer: {title: '新增的客户', label: 2, comName: 'CustomerItem'},
          contacts: {title: '新增的联系人', label: 3, comName: 'ContactsItem'},
          business: {title: '新增的商机', label: 5, comName: 'BusinessItem'},
          contract: {title: '新增的合同', label: 6, comName: 'ContractItem'},
          contract_money: {title: '合同金额', label: 6, comName: 'ContractItem'},
          business_money: {title: '商机金额', label: 5, comName: 'BusinessItem'},
          receivables_money: {title: '回款金额', label: 7, comName: 'ReceivedItem'}
        }
        if (!typeMap.hasOwnProperty(this.type)) return null
        return typeMap[this.type]
      },
      navTitle() {
        if (this.routerQuery.logId) {
          // eslint-disable-next-line vue/no-side-effects-in-computed-properties
          this.GetListFn = QueryLogBulletinByType
          return this.routerQuery.title
        }
        return this.typeObj.title
      }
    },
    onLoad(options = {}) {
      this.type = options.module
      this.routerQuery = options
      // 如果是日志
      if (this.routerQuery.logId) {
        this.GetListFn = QueryLogBulletinByType
      }
      this.getList()
    },
    methods: {
      getParams() {
        if (this.routerQuery.logId) {
          return {
            logId: this.routerQuery.logId,
            type: this.typeObj.type
          }
        }
        if (this.routerQuery.userList && !isArray(this.routerQuery.userList)) {
          this.routerQuery.userList = this.routerQuery.userList.split(',')
        }
        if (this.routerQuery.deptList && !isArray(this.routerQuery.deptList)) {
          this.routerQuery.deptList = this.routerQuery.deptList.split(',')
        }
        let query = {
          label: this.typeObj.label,
        ...this.routerQuery
        }
        delete query.module
        switch (this.type) {
        case 'contract_money':
          query = {
            ...query,
            checkStatus: 1,
            moneyType: 1
          }
          break;
        case 'business_money':
          break;
        case 'receivables_money':
          query = {
            ...query,
            checkStatus: 1,
            moneyType: 2
          }
          break;
        }
        return query
      }
    }
  }
</script>

<style scoped lang="scss">
	.list-view {
		flex: 1;
		overflow: hidden;
		.list-scroll {
			position: relative;
			width: 100%;
			height: 100%;
			overflow: hidden;
		}
	}
</style>