专家企业机构产品统计

config/prod.env.js

@@ -4,8 +4,8 @@ module.exports = {
  ENV_CONFIG:'"prod"',
  PLAT_ID: '"F5DEA8EDB12E421A9FC4B701BB6176A6"',
  BASE_API: '""',
  // XT_API: '"http://www.xttjpt.cn"',
  // KX_API: '"http://www.ekexiu.com"'
  XT_API: '"http://192.168.3.233:84"',
  KX_API: '"http://192.168.3.233:81"'
  XT_API: '"http://www.xttjpt.cn"',
  KX_API: '"http://www.ekexiu.com"'
  // XT_API: '"http://192.168.3.233:84"',
  // KX_API: '"http://192.168.3.233:81"'
}

src/api/statistics.js

@@ -2,3 +2,8 @@ export const pqFilterList = '/ajax/log/article/pq' // 筛选内容列表
export const queryCreator = '/ajax/sys/name' // 查询发布者
export const queryTotalView = '/ajax/log/total' // 查询每天浏览量
export const queryOneView = '/ajax/log/qo' // 查询单个浏览量
export const pqCompanyFilterList = '/ajax/log/company/pq'
export const pqProductFilterList = '/ajax/log/product/pq'
export const pqOrgFilterList = '/ajax/log/org/ql'
export const pqExpertFilterList = '/ajax/log/professor/ql'

src/router/index.js

@@ -344,6 +344,30 @@ export const asyncRouterMap = [
          component: () => import('@/views/statistics/contentCount'),
          name: 'contentCount',
          meta: { title: '内容数据统计' }
        },
        {
          path: 'expertCount',
          component: () => import('@/views/statistics/expertCount'),
          name: 'expertCount',
          meta: { title: '特约专家数据统计' }
        },
        {
          path: 'orgCount',
          component: () => import('@/views/statistics/orgCount'),
          name: 'orgCount',
          meta: { title: '合作机构数据统计' }
        },
        {
          path: 'companyCount',
          component: () => import('@/views/statistics/companyCount'),
          name: 'companyCount',
          meta: { title: '企业数据统计' }
        },
        {
          path: 'productCount',
          component: () => import('@/views/statistics/productCount'),
          name: 'productCount',
          meta: { title: '企业产品数据统计' }
        }
      ]
    }

src/views/cooperationAgency/index.vue

@@ -31,6 +31,7 @@
        dataList: [], //  拉去专家数据存到dataList这个数组里面
        tableData: [], //  每一页的存储的数据
        total: 0, //  页码总数
        pageSize: 10,
        tableItem: [ // 表头信息
          {
            prop: 'level',
@@ -90,8 +91,8 @@
                if (j === 0) {
                  this.dataList = epData
                  this.total = epData.length
                  if (this.total >= 20) {
                    this.tableData = this.dataList.slice(0, 20)
                  if (this.total >= this.pageSize) {
                    this.tableData = this.dataList.slice(0, this.pageSize)
                  } else {
                    const array = this.dataList
                    ret.gapFilling(array)
@@ -119,13 +120,13 @@
        this.$refs.sort.form = { ...obj }
      },
      current(val) { // 点击页码
        if (val <= Math.ceil(this.total / 20)) {
          this.tableData = this.dataList.slice(20 * (val - 1), 20 * val)
          if (val === Math.ceil(this.total / 20)) {
        if (val <= Math.ceil(this.total / this.pageSize)) {
          this.tableData = this.dataList.slice(this.pageSize * (val - 1), this.pageSize * val)
          if (val === Math.ceil(this.total / this.pageSize)) {
            ret.gapFilling(this.tableData)
          }
        } else {
          const array = this.dataList.slice(20 * val)
          const array = this.dataList.slice(this.pageSize * val)
          ret.gapFilling(array)
          this.tableData = array
        }

src/views/specialExperts/index.vue

@@ -34,6 +34,7 @@
        dataList: [], //  拉去专家数据存到dataList这个数组里面
        tableData: [], //  每一页的存储的数据
        total: 0, //  页码总数
        pageSize: 10,
        tableItem: [ // 表头信息
          {
            prop: 'level',
@@ -103,8 +104,8 @@
                if (j === 0) {
                  this.dataList = epData
                  this.total = epData.length
                  if (this.total >= 20) {
                    this.tableData = this.dataList.slice(0, 20)
                  if (this.total >= this.pageSize) {
                    this.tableData = this.dataList.slice(0, this.pageSize)
                  } else {
                    const array = this.dataList
                    if (epData.length !== 0) {
@@ -134,13 +135,13 @@
        this.$refs.sort.form = { ...obj }
      },
      current(val) { // 点击页码
        if (val <= Math.ceil(this.total / 20)) {
          this.tableData = this.dataList.slice(20 * (val - 1), 20 * val)
          if (val === Math.ceil(this.total / 20)) {
        if (val <= Math.ceil(this.total / this.pageSize)) {
          this.tableData = this.dataList.slice(this.pageSize * (val - 1), this.pageSize * val)
          if (val === Math.ceil(this.total / this.pageSize)) {
            ret.gapFilling(this.tableData)
          }
        } else {
          const array = this.dataList.slice(20 * val)
          const array = this.dataList.slice(this.pageSize * val)
          ret.gapFilling(array)
          this.tableData = array
        }

src/views/statistics/companyCount.vue

@@ -0,0 +1,277 @@
<template>
  <div class="app-container">
    <div class="box-container">
      <div class="contain-title">企业数据统计</div>
    </div>
    <div class="content-container">
      <div class="content-item" style="padding-top:0">
        <div class="content-item-tit">内容浏览量统计</div>
        <div class="line-chart-box">
          <LineChart :chartData="chartData"></LineChart>
        </div>
      </div>
      <div class="content-item">
        <div class="content-item-tit">企业浏览量查询</div>
        <div class="contain-search" style="margin-top:20px; width:95%">
          <el-form :model="formFilter" class="demo-form" label-width="100px">
            <el-row :gutter="10">
              <el-col :span="8">
                <el-form-item label="企业名称：">
                  <el-input v-model="formFilter.name" placeholder="搜索企业名称"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="所属行业：">
                  <el-input v-model="formFilter.industry" placeholder="搜索所属行业"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="企业状态：">
                  <el-select v-model="formFilter.actived" placeholder="选择分类" clearable @change="catalogChanged">
                    <el-option :label="item.tit" :value="item.val" v-for="item in [{tit: '已激活', val: '1'},{tit: '未激活', val: '0'}]" :key="item.index"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="创建时间：">
                  <el-date-picker v-model="formFilter.dateRange" type="daterange"
                    range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                    format="yyyy-MM-dd" value-format="yyyyMMdd" @change="changeRangerDate">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="排序方式：">
                  <el-select v-model="formFilter.orderBy" placeholder="选择排序方式" @change="sortChanged">
                    <el-option label="按创建时间由新到旧排序" value="1"></el-option>
                    <el-option label="按浏览量由高到底排序" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label-width="30px" align="right">
                  <el-button type="primary" @click="filterSearch">查询</el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <complex-table :tableData="tableData" :tableItem="tableItem" :total="total" :jump="'company'" v-on:current="current" :chartLine= true @showChart="showChart"></complex-table>
      </div>
    </div>
    <el-dialog title="企业流量分析" :visible.sync="ChartItemDialogVisible" width="860px">
      <LineChart :chartData="chartOneData"></LineChart>
    </el-dialog>
  </div>
</template>
<script>
import { pqCompanyFilterList, queryTotalView, queryOneView } from '@/api/statistics'
import { queryCompKeyword } from '@/api/companyCen'
import { parseTime } from '@/utils/index'
import complexTable from '@/components/complexTable'
import ret from '@/utils/comTable'
import LineChart from './lineChart/LineChart'
import { dayListFn, chartModel } from './lineChart/chart'
export default {
  data() {
    return {
      ChartItemDialogVisible: false,
      formFilter: {
        name: '',
        industry: '',
        actived: '',
        dateRange: '',
        orderBy: '1'
      },
      pageSize: 10,
      pageNo: 1,
      total: 0,
      tableData: [],
      tableItem: [
        {
          tit: '图表',
          chart: true,
          width: 80
        },
        {
          prop: 'name',
          tit: '企业名称',
          active: 'active'
        },
        {
          prop: 'industry',
          tit: '所属行业',
          tag: true
        },
        {
          prop: 'linkman',
          tit: '联系人'
        },
        {
          prop: 'linkphone',
          tit: '联系电话',
          width: '120'
        },
        {
          prop: 'linkemail',
          tit: '联系邮箱',
          width: '160'
        },
        {
          prop: 'createTime',
          tit: '创建时间',
          width: '160'
        },
        {
          prop: 'sum',
          tit: '浏览数量'
        }
      ],
      chartData: [],
      chartOneData: [],
      beginDate: dayListFn(true)
    }
  },
  components: {
    complexTable,
    LineChart
  },
  created() {
    this.queryInfoList()
    this.getInfoTotal()
  },
  methods: {
    getInfoTotal() {
      this.$http.get(queryTotalView, {
        tn: 'company',
        bt: this.beginDate
      }, (res) => {
        var obj = res.data
        this.chartData = chartModel(obj)
      })
    },
    filterSearch() {
      this.pageNo = 1
      this.total = 0
      this.tableData = []
      this.queryInfoList()
    },
    queryInfoList() {
      var that = this
      const form = this.formFilter
      let st = ''
      let et = ''
      if (form.dateRange) {
        st = form.dateRange[0]
        et = form.dateRange[1]
      }
      var obj = {
        name: form.name,
        industry: form.industry,
        actived: form.actived,
        bt: st,
        et: et,
        orderBy: form.orderBy,
        pageSize: this.pageSize,
        pageNo: this.pageNo
      }
      this.$http.get(pqCompanyFilterList, obj, (res) => {
        if (res.success && res.data) {
          const obj = res.data.data
          if (obj.length > 0) {
            var hData = { num: 1, data: obj }
            for (let i = 0; i < obj.length; ++i) {
              if (obj[i].createTime) {
                obj[i].createTime = parseTime(obj[i].createTime)
              }
              if (obj[i].activeTime) {
                obj[i].activeTime = parseTime(obj[i].activeTime)
              }
              (function(item, num) {
                item.industry = ''
                that.getCompanyKeyword(item, num)
              })(obj[i], hData.num)
            }
            hData.num--
            that.total = res.data.total
            if (hData.num === 0) {
              that.tableData = obj
            }
            ret.gapFilling(that.tableData)
          } else {
            that.pageNo = 1
            that.total = 0
            that.tableData = []
          }
        } else {
          that.pageNo = 1
          that.total = 0
          that.tableData = []
        }
      })
    },
    getCompanyKeyword(lmt, num) {
      var that = this
      var objKey = []
      num++
      that.$http.get(queryCompKeyword, {
        id: lmt.id,
        type: 1
      }, function(res) {
        num--
        if (res.success && res.data) {
          const str = res.data
          if (str.length > 0) {
            str.map(item => {
              objKey.push(item.value)
            })
            lmt.industry = objKey.join('，')
            that.$forceUpdate()
          }
        }
      })
    },
    current(val) {
      this.pageNo = val
      this.queryInfoList()
    },
    changeRangerDate(val) {
      this.formFilter.dateRange = val
    },
    catalogChanged(val) {
      this.formFilter.actived = val
    },
    sortChanged(val) {
      this.formFilter.orderBy = val
    },
    showChart(val) {
      this.chartOneData = []
      this.$http.get(queryOneView, {
        tn: 'company',
        id: val,
        bt: this.beginDate
      }, (res) => {
        if (res.success) {
          this.chartOneData = chartModel(res.data)
          this.ChartItemDialogVisible = true
        }
      })
    }
  }
}
</script>
<style>
  .content-item{
    padding: 10px;
  }
  .content-item + .content-item {
    border-top: 1px solid #ccc;
  }
  .content-item-tit{
    line-height: 30px;
  }
</style>

src/views/statistics/contentCount.vue

@@ -119,8 +119,7 @@ export default {
        },
        {
          prop: 'creator',
          tit: '发布人',
          width: '160'
          tit: '发布人'
        },
        {
          prop: 'modifyTime',
@@ -129,8 +128,7 @@ export default {
        },
        {
          prop: 'sum',
          tit: '浏览数量',
          width: '160'
          tit: '浏览数量'
        }
      ],
      chartData: [],

src/views/statistics/expertCount.vue

@@ -0,0 +1,298 @@
<template>
  <div class="app-container">
    <div class="box-container">
      <div class="contain-title">特约专家数据统计列表</div>
    </div>
    <div class="content-container">
      <div class="content-item" style="padding-top:0">
        <div class="content-item-tit">特约专家总浏览量统计</div>
        <div class="line-chart-box">
          <LineChart :chartData="chartData"></LineChart>
        </div>
      </div>
      <div class="content-item">
        <div class="content-item-tit">特约专家浏览量查询</div>
        <div class="contain-search" style="margin-top:20px; width:95%">
          <el-form :model="formFilter" class="demo-form" label-width="100px">
            <el-row :gutter="10">
              <el-col :span="8">
                <el-form-item label="真实姓名：">
                  <el-input v-model="formFilter.name" placeholder="搜索真实姓名"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="所在机构：">
                  <el-input v-model="formFilter.orgName" placeholder="搜索所在机构"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="所在城市：">
                  <el-input v-model="formFilter.address" placeholder="搜索所在城市"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="入驻时间：">
                  <el-date-picker v-model="formFilter.dateRange" type="daterange"
                    range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                    format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="changeRangerDate">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="排序方式：">
                  <el-select v-model="formFilter.orderBy" placeholder="选择排序方式" @change="sortChanged">
                    <el-option label="按入驻时间由新到旧排序" value="1"></el-option>
                    <el-option label="按浏览量由高到底排序" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label-width="30px" align="right">
                  <el-button type="primary" @click="filterSearch">查询</el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <complex-table :tableData="tableDataEnd" :tableItem="tableItem" :total="total" :jump="'expert'" v-on:current="current" :chartLine= true @showChart="showChart"
          v-loading="tableLoding"></complex-table>
      </div>
    </div>
    <el-dialog title="专家流量分析" :visible.sync="ChartItemDialogVisible" width="860px">
      <LineChart :chartData="chartOneData"></LineChart>
    </el-dialog>
  </div>
</template>
<script>
import { pqExpertFilterList, queryTotalView, queryOneView } from '@/api/statistics'
import { parseTime } from '@/utils/index'
import complexTable from '@/components/complexTable'
import crossDomin from '@/utils/CrossDomain'
import LineChart from './lineChart/LineChart'
import { dayListFn, chartModel } from './lineChart/chart'
import { doneFilter } from './ObjFilters'
export default {
  data() {
    return {
      ChartItemDialogVisible: false,
      formFilter: {
        name: '',
        orgName: '',
        address: '',
        dateRange: '',
        orderBy: '1'
      },
      pageSize: 10,
      pageNo: 1,
      total: 0,
      tableData: [],
      tableDataEnd: [],
      filterTableDataEnd: [],
      flag: false,
      tableLoding: true,
      tableItem: [
        {
          tit: '图表',
          chart: true,
          width: 80
        },
        {
          prop: 'name',
          tit: '真实姓名',
          active: 'active'
        },
        {
          prop: 'title',
          tit: '职称'
        },
        {
          prop: 'orgName',
          tit: '所在机构'
        },
        {
          prop: 'address',
          tit: '所在城市'
        },
        {
          prop: 'phone',
          tit: '联系电话',
          width: '160'
        },
        {
          prop: 'email',
          tit: '联系邮箱',
          width: '160'
        },
        {
          prop: 'assTime',
          tit: '入驻时间',
          width: '160'
        },
        {
          prop: 'sum',
          tit: '浏览数量'
        }
      ],
      chartData: [],
      chartOneData: [],
      beginDate: dayListFn(true)
    }
  },
  components: {
    complexTable,
    LineChart
  },
  created() {
    this.queryInfoList()
    this.getInfoTotal()
  },
  methods: {
    getInfoTotal() {
      this.$http.get(queryTotalView, {
        tn: 'professor',
        bt: this.beginDate
      }, (res) => {
        var obj = res.data
        this.chartData = chartModel(obj)
      })
    },
    filterSearch() {
      this.tableLoding = true
      const form = this.formFilter
      let st = new Date('1970-01-01')
      let et = new Date().getTime()
      if (form.dateRange) {
        st = new Date(form.dateRange[0]).getTime()
        et = new Date(form.dateRange[1]).getTime()
      }
      // 筛选条件
      var Conditions = {
        strs: [
          {
            type: 'name',
            val: form.name
          },
          {
            type: 'orgName',
            val: form.orgName
          },
          {
            type: 'address',
            val: form.address
          }
        ],
        ranges: [
          {
            type: 'assTime',
            min: st,
            max: et
          }
        ]
      }
      this.tableDataEnd = []
      this.filterTableDataEnd = []
      this.filterTableDataEnd = doneFilter(this.tableData, Conditions)
      this.pageNo = 1
      this.total = this.filterTableDataEnd.length
      this.currentChangePage(this.filterTableDataEnd)
      this.flag = true
      this.tableLoding = false
    },
    sortChanged(val) {
      this.formFilter.orderBy = val
    },
    sortTableOperate(val) {
      if (val.length > 0) {
        val.sort((a, b) => {
          if (this.formFilter.orderBy === '1') {
            return new Date(b.assTime).getTime() - new Date(a.assTime).getTime()
          } else if (this.formFilter.orderBy === '2') {
            return b.sum - a.sum
          }
        })
      }
      return val
    },
    queryInfoList() {
      this.$http.get(pqExpertFilterList, {}, (response) => {
        if (response.success && response.data) {
          const epData = response.data
          let j = 0
          for (let i = 0; i < epData.length; i++) {
            epData[i].assTime = parseTime(epData[i].assTime).substr(0, 16)
            j++
            crossDomin.getUserInfo(epData[i].id, data => {
              j--
              Object.assign(epData[i], data)
              if (j === 0) {
                this.tableData = epData
                this.total = epData.length
                if (this.total > this.pageSize) {
                  for (let i = 0; i < this.pageSize; i++) {
                    this.tableDataEnd.push(epData[i])
                  }
                } else {
                  this.tableDataEnd = epData
                }
                this.tableLoding = false
                this.tableDataEnd = this.sortTableOperate(this.tableDataEnd)
              }
            })
          }
        } else {
          this.tableLoding = false
        }
      })
    },
    current(val) {
      this.pageNo = val
      if (!this.flag) {
        this.currentChangePage(this.tableDataEnd)
      } else {
        this.currentChangePage(this.filterTableDataEnd)
      }
    },
    currentChangePage(list) {
      let from = (this.pageNo - 1) * this.pageSize
      const to = this.pageNo * this.pageSize
      this.tableDataEnd = []
      for (; from < to; from++) {
        if (list[from]) {
          this.tableDataEnd.push(list[from])
        }
      }
      this.tableDataEnd = this.sortTableOperate(this.tableDataEnd)
    },
    changeRangerDate(val) {
      this.formFilter.dateRange = val
    },
    showChart(val) {
      this.chartOneData = []
      this.$http.get(queryOneView, {
        tn: 'professor',
        id: val,
        bt: this.beginDate
      }, (res) => {
        if (res.success) {
          this.chartOneData = chartModel(res.data)
          this.ChartItemDialogVisible = true
        }
      })
    }
  }
}
</script>
<style>
  .content-item{
    padding: 10px;
  }
  .content-item + .content-item {
    border-top: 1px solid #ccc;
  }
  .content-item-tit{
    line-height: 30px;
  }
</style>

src/views/statistics/objFilters.js

@@ -0,0 +1,89 @@
const ObjFilters = {
  /**
   * 字符串类型筛选
   * @param {array<Obj>} objArr
   * @param {array<{type: String, val: String}>} strs
   */
  strsFilter(objArr, strs) {
    if (strs.length === 0) {
      return objArr
    } else {
      for (const str of strs) {
        objArr = objArr.filter(item => {
          if (item[str.type]) {
            return item[str.type].match(str.val) !== null
          } else {
            return item
          }
        })
      }
    }
    return objArr
  },
  /**
   * 区间类型筛选
   * @param {array<Obj>} objArr
   * @param {array<{type: String, min: String, max: String}>} ranges
   */
  rangesFilter(objArr, ranges) {
    if (ranges.length === 0) {
      return objArr
    } else {
      /**
       * 循环多个区间条件，
       * 每种区间类型应该只有一个，
       * 比如价格区间不会有1000-2000和4000-6000同时需要的情况
       */
      for (const range of ranges) {
        // 多个不同类型区间是与逻辑，可以直接赋值给自身
        objArr = objArr.filter(item => {
          if (item[range.type]) {
            const r = new Date(item[range.type]).getTime()
            if (range.min && range.max) {
              return r >= range.min && r <= range.max
            }
          } else {
            return item
          }
        })
      }
      return objArr
    }
  },
  /**
   * 选择类型筛选
   * @param {array<Obj>} objArr
   * @param {array<{type: String, val: String}>} chooses
   */
  choosesFilter(objArr, chooses) {
    let tmpObj = []
    if (chooses.length === 0) {
      tmpObj = objArr
    } else {
      /**
       * 选择类型条件是或逻辑，使用数组连接concat
       */
      for (const choice of chooses) {
        tmpObj = tmpObj.concat(objArr.filter(item => {
          if (item[choice.type]) {
            return item[choice.type].match(choice.val) !== null
          }
        }))
      }
    }
    return tmpObj
  }
}
export function doneFilter(obj, conditions) {
  // 根据条件循环调用筛选器里的方法
  for (const key in conditions) {
    // 判断是否有需要的过滤方法
    if (ObjFilters.hasOwnProperty(key + 'Filter') && typeof ObjFilters[key + 'Filter'] === 'function') {
      obj = ObjFilters[key + 'Filter'](obj, conditions[key])
    }
  }
  return obj
}

src/views/statistics/orgCount.vue

@@ -0,0 +1,286 @@
<template>
  <div class="app-container">
    <div class="box-container">
      <div class="contain-title">合作机构数据统计</div>
    </div>
    <div class="content-container">
      <div class="content-item" style="padding-top:0">
        <div class="content-item-tit">机构总浏览量统计</div>
        <div class="line-chart-box">
          <LineChart :chartData="chartData"></LineChart>
        </div>
      </div>
      <div class="content-item">
        <div class="content-item-tit">机构浏览量查询</div>
        <div class="contain-search" style="margin-top:20px; width:70%">
          <el-form :model="formFilter" class="demo-form" label-width="100px">
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item label="机构名称：">
                  <el-input v-model="formFilter.name" placeholder="搜索机构名称"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="机构类型：">
                  <el-input v-model="formFilter.orgType" placeholder="搜索机构类型"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="入驻时间：">
                  <el-date-picker v-model="formFilter.dateRange" type="daterange"
                    range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                    format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="changeRangerDate">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="排序方式：">
                  <el-select v-model="formFilter.orderBy" placeholder="选择排序方式" @change="sortChanged">
                    <el-option label="按入驻时间由新到旧排序" value="1"></el-option>
                    <el-option label="按浏览量由高到底排序" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label-width="30px" align="right">
                  <el-button type="primary" @click="filterSearch">查询</el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <complex-table :tableData="tableDataEnd" :tableItem="tableItem" :total="total" :jump="'org'" v-on:current="current" :chartLine= true @showChart="showChart"
          v-loading="tableLoding"></complex-table>
      </div>
    </div>
    <el-dialog title="机构流量分析" :visible.sync="ChartItemDialogVisible" width="860px">
      <LineChart :chartData="chartOneData"></LineChart>
    </el-dialog>
  </div>
</template>
<script>
import { pqOrgFilterList, queryTotalView, queryOneView } from '@/api/statistics'
import { parseTime } from '@/utils/index'
import complexTable from '@/components/complexTable'
import crossDomin from '@/utils/CrossDomain'
import LineChart from './lineChart/LineChart'
import { dayListFn, chartModel } from './lineChart/chart'
import { doneFilter } from './ObjFilters'
export default {
  data() {
    return {
      ChartItemDialogVisible: false,
      formFilter: {
        name: '',
        orgType: '',
        dateRange: '',
        orderBy: '1'
      },
      pageSize: 10,
      pageNo: 1,
      total: 0,
      tableData: [],
      tableDataEnd: [],
      filterTableDataEnd: [],
      flag: false,
      tableLoding: true,
      tableItem: [
        {
          tit: '图表',
          chart: true,
          width: 80
        },
        {
          prop: 'name',
          tit: '机构名称',
          active: 'active'
        },
        {
          prop: 'orgType',
          tit: '机构类型'
        },
        {
          prop: 'phone',
          tit: '联系电话',
          width: '160'
        },
        {
          prop: 'email',
          tit: '联系邮箱',
          width: '160'
        },
        {
          prop: 'assTime',
          tit: '入驻时间',
          width: '160'
        },
        {
          prop: 'sum',
          tit: '浏览数量'
        }
      ],
      chartData: [],
      chartOneData: [],
      beginDate: dayListFn(true)
    }
  },
  components: {
    complexTable,
    LineChart
  },
  created() {
    this.queryInfoList()
    this.getInfoTotal()
  },
  methods: {
    getInfoTotal() {
      this.$http.get(queryTotalView, {
        tn: 'organization',
        bt: this.beginDate
      }, (res) => {
        var obj = res.data
        this.chartData = chartModel(obj)
      })
    },
    filterSearch() {
      this.tableLoding = true
      const form = this.formFilter
      let st = new Date('1970-01-01')
      let et = new Date().getTime()
      if (form.dateRange) {
        st = new Date(form.dateRange[0]).getTime()
        et = new Date(form.dateRange[1]).getTime()
      }
      // 筛选条件
      var Conditions = {
        strs: [
          {
            type: 'name',
            val: form.name
          },
          {
            type: 'orgType',
            val: form.orgType
          }
        ],
        ranges: [
          {
            type: 'assTime',
            min: st,
            max: et
          }
        ]
      }
      this.tableDataEnd = []
      this.filterTableDataEnd = []
      this.filterTableDataEnd = doneFilter(this.tableData, Conditions)
      this.pageNo = 1
      this.total = this.filterTableDataEnd.length
      this.currentChangePage(this.filterTableDataEnd)
      this.flag = true
      this.tableLoding = false
    },
    sortChanged(val) {
      this.formFilter.orderBy = val
    },
    sortTableOperate(val) {
      if (val.length > 0) {
        val.sort((a, b) => {
          if (this.formFilter.orderBy === '1') {
            return new Date(b.assTime).getTime() - new Date(a.assTime).getTime()
          } else if (this.formFilter.orderBy === '2') {
            return b.sum - a.sum
          }
        })
      }
      return val
    },
    queryInfoList() {
      this.$http.get(pqOrgFilterList, {}, (response) => {
        if (response.success && response.data) {
          const epData = response.data
          let j = 0
          for (let i = 0; i < epData.length; i++) {
            epData[i].assTime = parseTime(epData[i].assTime).substr(0, 10)
            j++
            crossDomin.getAgencyInfo(epData[i].id, data => {
              j--
              Object.assign(epData[i], data)
              if (j === 0) {
                this.tableData = epData
                this.total = epData.length
                if (this.total > this.pageSize) {
                  for (let i = 0; i < this.pageSize; i++) {
                    this.tableDataEnd.push(epData[i])
                  }
                } else {
                  this.tableDataEnd = epData
                }
                this.tableLoding = false
                this.tableDataEnd = this.sortTableOperate(this.tableDataEnd)
              }
            })
          }
          if (epData.length === 0) {
            this.dataList = []
            this.tableData = []
            this.total = 0
          }
        } else {
          this.$sort.total = 0
          this.tableData = []
        }
      })
    },
    current(val) {
      this.pageNo = val
      if (!this.flag) {
        this.currentChangePage(this.tableDataEnd)
      } else {
        this.currentChangePage(this.filterTableDataEnd)
      }
    },
    currentChangePage(list) {
      let from = (this.pageNo - 1) * this.pageSize
      const to = this.pageNo * this.pageSize
      this.tableDataEnd = []
      for (; from < to; from++) {
        if (list[from]) {
          this.tableDataEnd.push(list[from])
        }
      }
      this.tableDataEnd = this.sortTableOperate(this.tableDataEnd)
    },
    changeRangerDate(val) {
      this.formFilter.dateRange = val
    },
    showChart(val) {
      this.chartOneData = []
      this.$http.get(queryOneView, {
        tn: 'organization',
        id: val,
        bt: this.beginDate
      }, (res) => {
        if (res.success) {
          this.chartOneData = chartModel(res.data)
          this.ChartItemDialogVisible = true
        }
      })
    }
  }
}
</script>
<style>
  .content-item{
    padding: 10px;
  }
  .content-item + .content-item {
    border-top: 1px solid #ccc;
  }
  .content-item-tit{
    line-height: 30px;
  }
</style>

src/views/statistics/productCount.vue

@@ -0,0 +1,269 @@
<template>
  <div class="app-container">
    <div class="box-container">
      <div class="contain-title">企业产品数据统计</div>
    </div>
    <div class="content-container">
      <div class="content-item" style="padding-top:0">
        <div class="content-item-tit">企业产品总浏览量统计</div>
        <div class="line-chart-box">
          <LineChart :chartData="chartData"></LineChart>
        </div>
      </div>
      <div class="content-item">
        <div class="content-item-tit">企业产品浏览量查询</div>
        <div class="contain-search" style="margin-top:20px; width:70%">
          <el-form :model="formFilter" class="demo-form" label-width="100px">
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item label="产品名称：">
                  <el-input v-model="formFilter.title" placeholder="搜索产品名称"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="所属企业：">
                  <el-select v-model="formFilter.companyId" clearable filterable remote :remote-method="remoteOwnerName"
                  suffix-icon="el-icon-search" @change="ownerChanged" placeholder="搜索所属企业">
                    <el-option v-for="item in nameOptions" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="创建时间：">
                  <el-date-picker v-model="formFilter.dateRange" type="daterange"
                    range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                    format="yyyy-MM-dd" value-format="yyyyMMdd" @change="changeRangerDate">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="排序方式：">
                  <el-select v-model="formFilter.orderBy" placeholder="选择排序方式" @change="sortChanged">
                    <el-option label="按创建时间由新到旧排序" value="1"></el-option>
                    <el-option label="按浏览量由高到底排序" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label-width="30px" align="right">
                  <el-button type="primary" @click="filterSearch">查询</el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <complex-table :tableData="tableData" :tableItem="tableItem" :total="total" :jump="'product'" v-on:current="current" :chartLine= true @showChart="showChart"></complex-table>
      </div>
    </div>
    <el-dialog title="企业产品流量分析" :visible.sync="ChartItemDialogVisible" width="860px">
      <LineChart :chartData="chartOneData"></LineChart>
    </el-dialog>
  </div>
</template>
<script>
import { queryCompName, queryCompanyOne } from '@/api/companyCen'
import { pqProductFilterList, queryTotalView, queryOneView } from '@/api/statistics'
import { parseTime } from '@/utils/index'
import complexTable from '@/components/complexTable'
import ret from '@/utils/comTable'
import LineChart from './lineChart/LineChart'
import { dayListFn, chartModel } from './lineChart/chart'
export default {
  data() {
    return {
      ChartItemDialogVisible: false,
      nameOptions: [],
      formFilter: {
        title: '',
        companyId: '',
        dateRange: '',
        orderBy: '1'
      },
      pageSize: 10,
      pageNo: 1,
      total: 0,
      tableData: [],
      tableItem: [
        {
          tit: '图表',
          chart: true,
          width: 80
        },
        {
          prop: 'name',
          tit: '产品名称',
          active: 'active'
        },
        {
          prop: 'companyName',
          tit: '所属企业'
        },
        {
          prop: 'createTime',
          tit: '创建时间',
          width: '160'
        },
        {
          prop: 'sum',
          tit: '浏览数量'
        }
      ],
      chartData: [],
      chartOneData: [],
      beginDate: dayListFn(true)
    }
  },
  components: {
    complexTable,
    LineChart
  },
  created() {
    this.queryInfoList()
    this.getInfoTotal()
  },
  methods: {
    getInfoTotal() {
      this.$http.get(queryTotalView, {
        tn: 'product',
        bt: this.beginDate
      }, (res) => {
        var obj = res.data
        this.chartData = chartModel(obj)
      })
    },
    filterSearch() {
      this.pageNo = 1
      this.total = 0
      this.tableData = []
      this.queryInfoList()
    },
    queryInfoList() {
      var that = this
      const form = this.formFilter
      let st = ''
      let et = ''
      if (form.dateRange) {
        st = form.dateRange[0]
        et = form.dateRange[1]
      }
      var obj = {
        title: form.title,
        companyId: form.companyId,
        bt: st,
        et: et,
        orderBy: form.orderBy,
        pageSize: this.pageSize,
        pageNo: this.pageNo
      }
      this.$http.get(pqProductFilterList, obj, (res) => {
        if (res.success && res.data) {
          const obj = res.data.data
          if (obj.length > 0) {
            var hData = { num: 1, data: obj }
            for (let i = 0; i < obj.length; ++i) {
              if (obj[i].createTime) {
                obj[i].createTime = parseTime(obj[i].createTime)
              }
              (function(item, num) {
                item.companyName = ''
                that.getCompanyName(item, num)
              })(obj[i], hData.num)
            }
            hData.num--
            that.total = res.data.total
            if (hData.num === 0) {
              that.tableData = obj
            }
            ret.gapFilling(that.tableData)
          } else {
            that.pageNo = 1
            that.total = 0
            that.tableData = []
          }
        } else {
          that.pageNo = 1
          that.total = 0
          that.tableData = []
        }
      })
    },
    getCompanyName(lmt, num) {
      var that = this
      num++
      that.$http.get(queryCompanyOne, {
        id: lmt.companyId
      }, function(res) {
        num--
        if (res.success) {
          const obj = res.data
          lmt.companyName = obj.name
          that.$forceUpdate()
        }
      })
    },
    current(val) {
      this.pageNo = val
      this.queryInfoList()
    },
    remoteOwnerName(query) {
      var that = this
      if (query !== '') {
        that.selectLoading = true
        that.$http.get(queryCompName, {
          name: query,
          size: 5
        }, function(res) {
          that.selectLoading = false
          if (res.success && res.data) {
            const obj = res.data
            that.nameOptions = obj.map(item => {
              return { value: item.id, label: item.name }
            })
          } else {
            that.nameOptions = []
          }
        })
      } else {
        that.compOptions = []
      }
    },
    changeRangerDate(val) {
      this.formFilter.dateRange = val
    },
    ownerChanged(val) {
      this.formFilter.companyId = val
    },
    sortChanged(val) {
      this.formFilter.orderBy = val
    },
    showChart(val) {
      this.chartOneData = []
      this.$http.get(queryOneView, {
        tn: 'product',
        id: val,
        bt: this.beginDate
      }, (res) => {
        if (res.success) {
          this.chartOneData = chartModel(res.data)
          this.ChartItemDialogVisible = true
        }
      })
    }
  }
}
</script>
<style>
  .content-item{
    padding: 10px;
  }
  .content-item + .content-item {
    border-top: 1px solid #ccc;
  }
  .content-item-tit{
    line-height: 30px;
  }
</style>