crm-mobile/pages_crm/homeReport/recordCountList.vue

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

      <view class="container">
        <view class="cell-wrapper">
          <view
            v-for="(item, index) in navList"
            :key="index"
            class="cell"
            @click="handleShowList(item)">
            <view class="cell-left">
              {{ item.label }}
            </view>
            <view class="cell-body">
              {{ item.num }}条
            </view>
            <view class="cell-right">
              <text class="wk wk-arrow-right" />
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  import { QueryRecordCount } from 'API/crm/work'
  import { QueryLogRecordCount } from 'API/oa/journal'
	
  import { isArray } from '@/utils/types.js'

  export default {
    name: 'RecordCountList',
    data() {
      return {
        routerQuery: {},

        navList: [
          { type: 1, label: '线索模块', num: 0 },
          { type: 2, label: '客户模块', num: 0 },
          { type: 3, label: '联系人模块', num: 0 },
          { type: 5, label: '商机模块', num: 0 },
          { type: 6, label: '合同模块', num: 0 }
        ],
      }
    },
    computed: {
      navTitle() {
        if (!this.routerQuery.logId) {
          return '新增的跟进记录'
        }
        return this.routerQuery.title
      }
    },
    onLoad(options = {}) {
      this.routerQuery = options
      this.getDataNum()
    },
    methods: {
      getDataNum() {
        let requset
        let params

        if (this.routerQuery.logId) {
          params = {
            type: 5,
            logId: this.routerQuery.logId
          }
          requset = QueryLogRecordCount
        } else {
          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(',')
          }
          params = this.routerQuery
          requset = QueryRecordCount
        }
        requset(params).then(res => {
          this.navList.forEach((item, index) => {
            let findRes = res.find(o => o.crmType == item.type)
            if (findRes) {
              item.num = findRes.count || 0
              this.$set(this.navList, index, item)
            }
          })
        }).catch(() => {})
      },

      handleShowList(nav) {
        if (nav.num === 0) return
        this.$Router.navigateTo({
          url: '/pages_crm/homeReport/recordDetailList',
          query: {
            ...this.routerQuery,
            crmType: nav.type
          }
        })
      }
    }
  }
</script>

<style scoped lang="scss">
	.cell-wrapper {
		background-color: white;
		padding: 0 32rpx;
		margin-top: 20rpx;
		.cell {
			font-size: 28rpx;
			border-bottom: 1rpx solid $border-color;
			padding: 25rpx 0;
			@include left;
			.cell-left {
				width: 200rpx;
				font-size: 30rpx;
			}
			.cell-body {
				flex: 1;
				color: $gray;
				text-align: right;
			}
			.cell-right {
				color: $light;
				margin-left: 10rpx;
			}
		}
	}
</style>