投手数据

dist/index.html

@@ -12,7 +12,7 @@
 			document.write('<script src="' + src + '"><\/script>');
 			})();
     </script>
-    <script type="module" crossorigin src="./assets/index-_SrrqTY2.js"></script>
+    <script type="module" crossorigin src="./assets/index-BqJQZnq2.js"></script>
     <link rel="modulepreload" crossorigin href="./js/@vue/@vue.lccsL1Mu.js">
     <link rel="modulepreload" crossorigin href="./js/vue-router/vue-router.D86bYXwF.js">
     <link rel="modulepreload" crossorigin href="./js/vue-demi/vue-demi.Dq6ymT-8.js">

src/api/api.ts

@@ -177,6 +177,7 @@ export enum Api{
     report_ratio = '/api/report/ratio',
     report_accountReportList = '/api/report/accountReportList',
     report_projectReportList = '/api/report/projectReportList',
+    oe_promoter_data_report_list = '/api/report/promoterDataReport',
 
     materialData_videoView = '/api/report/videoView',
     materialData_videoReportList = '/api/report/videoReportList',

src/components/businessMoudle/dataManagement/acStatement/dataList.vue

@@ -11,7 +11,7 @@
       <el-table ref="tableAccountRef" :data="tableInfo.tableList" :header-cell-style="tableHeaderStyle"
         style="width: 100%;" :key="tableInfo.updateKey" border empty-text="暂无数据" :summary-method="getSummaries" show-summary
         max-height="calc(100vh - 280px)">
-        <template v-for="item in tableInfo.descol">
+        <template v-if="tableInfo.total>0" v-for="item in tableInfo.descol">
           <el-table-column :fixed="item.disabled == 1" :prop="item.key_value"
             :min-width="item.key_value != 'advertiser_status' && item.key_value != 'advertiser_nick' && item.label.length <= 4 ? '120px' : item.label.length <= 8 ? '150px' : '200px'">
             <template #header>

src/components/businessMoudle/dataManagement/oePromoterData/dataList.vue

@@ -0,0 +1,271 @@
+<template>
+  <div v-loading="loading" class="table_container">
+    <div class="tableTop">
+      <div class="title"></div>
+      <div>
+        <el-button class="lMar10" type="primary" plain @click="exportEvent">导出数据</el-button>
+      </div>
+    </div>
+    <div>
+      <el-table ref="tableAccountRef" :data="tableInfo.tableList" :header-cell-style="tableHeaderStyle"
+        style="width: 100%;" :key="tableInfo.updateKey" border empty-text="暂无数据" :summary-method="getSummaries" show-summary
+        max-height="calc(100vh - 280px)">
+        <template v-if="tableInfo.total>0" v-for="item in tableInfo.descol">
+          <el-table-column :fixed="item.disabled == 1" :prop="item.key_value"
+            :min-width="item.key_value != 'advertiser_status' && item.key_value != 'advertiser_nick' && item.label.length <= 4 ? '120px' : item.label.length <= 8 ? '150px' : '200px'">
+            <template #header>
+              <div class="flex" :class="[tableInfo.sortKey == item.key_value ? 'active_css' : '']">
+                <span :style="{ color: tableInfo.sortKey == item.key_value ? '#3173FF' : '' }">{{ item.label }}</span>
+                <el-tooltip v-if="item.tooltip && item.tooltip != item.label" placement="top" effect="dark"
+                  :content="item.tooltip"><i-ep-QuestionFilled class="lMar5 c-999 f14 pointer" /></el-tooltip>
+                <div v-if="item.if_sort == 1" class="sortBox lMar5 pointer">
+                  <div class="sortItem" @click="sortEvent(item.key_value, 'asc')">
+                    <el-icon
+                      :color="(tableInfo.sortType == 'asc' && tableInfo.sortKey == item.key_value) ? '#3173FF' : ''"><i-ep-CaretTop /></el-icon>
+                  </div>
+                  <div class="sortItem" @click="sortEvent(item.key_value, 'desc')">
+                    <el-icon
+                      :color="(tableInfo.sortType == 'desc' && tableInfo.sortKey == item.key_value) ? '#3173FF' : ''"><i-ep-CaretBottom /></el-icon>
+                  </div>
+                </div>
+              </div>
+            </template>
+            <template #default="scope">
+              <!-- 其他 -->
+              <div class="cellDiv" :class="tableInfo.sortKey == item.key_value ? 'active_css' : ''">
+                <el-tooltip :disabled="!(scope.row[item.key_value] && scope.row[item.key_value].length > 30)"
+                  effect="dark" :content="scope.row[item.key_value] + ''">
+                  <div class="clampTwo line21" style="flex: 1">
+                    {{ scope.row[item.key_value] || scope.row[item.key_value] == 0 ? (item.label.indexOf('ID') != -1 || item.label.indexOf('id') != -1 ? scope.row[item.key_value] : hasDot(scope.row[item.key_value], 2, true)) : '-'  }}<span
+                      v-if="item.label.indexOf('率') != -1 && (scope.row[item.key_value] || scope.row[item.key_value] == 0)">%</span>
+                  </div>
+                </el-tooltip>
+              </div>
+            </template>
+          </el-table-column>
+        </template>
+      </el-table>
+      <div class="paginationBox flex" style="justify-content: center" v-if="Number(tableInfo.total) > 0">
+        <el-pagination v-model:currentPage="tableInfo.currentPage" v-model:page-size="tableInfo.pageSize" background
+          :total="tableInfo.total" @current-change="handleCurrentChange" />
+      </div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { nextTick, onMounted, reactive, ref } from "vue";
+import { listTs } from "@/components/businessMoudle/gdtList/ts/list";
+import { Api } from "@/api/api";
+import { ElMessage } from "element-plus";
+import { getDay, hasDot } from "@/common/common";
+import http from "@/http/http";
+import { exportOrder } from "@/common/export/index.js";
+import Indicators from '@/components/businessMoudle/gdtList/indicators/index.vue'
+
+const props = defineProps({
+  mainPageInfo: {
+    type: Object,
+    default: () => { }
+  }
+})
+
+const downLoadTableRef = ref()
+const tableAccountRef = ref()
+const loading = ref<boolean>(false)
+const tableInfo = reactive<any>({
+  tableList: [],
+  descol: [],
+  summary: [],
+  sortKey: '',
+  currentPage: 1,
+  pageSize: 20,
+  total: 0,
+  totalPages: 0,//共多少页
+  sortType: 'desc',
+  updateKey: 1,
+})
+
+
+//排序
+const sortEvent = (row: any, order: string) => {
+  tableInfo.sortType = order;
+  tableInfo.sortKey = row
+  init(1)
+}
+
+//分页
+const handleCurrentChange = (val) => {
+  tableInfo.currentPage = val
+  init(val)
+}
+
+//导出
+const exportEvent = async () => {
+  loading.value = true;
+  let params = {
+    page: 1,
+    pageSize: 1000,
+    start_date: props.mainPageInfo.time[0],
+    end_date: props.mainPageInfo.time[1],
+    has_cost: props.mainPageInfo.has_cost,
+    promoter_id: props.mainPageInfo.promoter_id,
+    advertiser_name: props.mainPageInfo.keyword,
+  }
+  let res: any = await http.get(Api.oe_promoter_data_report_list, params)
+  loading.value = false;
+  if (res && res.errNo == '0') {
+    let list = res.rst.data.list;
+    let descol = [{
+        disabled: 1,
+        if_sort: 0,
+        key_value: "date",
+        label: "日期",
+        tooltip: ""
+      }].concat(res.rst.data?.explain)
+
+    let tHeader = descol.map((v) => {
+      return v.label;
+    })
+    let filterVal = descol.map((v) => {
+      return v.key_value
+    })
+    let excelDatas = [
+      {
+        tHeader: tHeader, // sheet表一头部
+        filterVal: filterVal, // 表一的数据字段
+        tableDatas: list, // 表一的整体json数据
+        sheetName: ''// 表一的sheet名字
+      }
+    ]
+    exportOrder({ excelDatas, name: `数据报表（导出时间：${getDay(0)}）` })
+  } else {
+    ElMessage.error(res.errMsg)
+  }
+}
+
+//列表
+const init = async (page?: any, pageSize?: any) => {
+  loading.value = true;
+  let params = {
+    page: page ? page : tableInfo.currentPage,
+    page_size: pageSize ? pageSize : tableInfo.pageSize,
+    start_date: props.mainPageInfo.time[0],
+    end_date: props.mainPageInfo.time[1],
+    has_cost: props.mainPageInfo.has_cost,
+    promoter_id: props.mainPageInfo.promoter_id,
+    advertiser_name: props.mainPageInfo.keyword,
+  }
+  let res: any = await http.get(Api.oe_promoter_data_report_list, params)
+  loading.value = false;
+  if (res && res.errNo == '0') {
+    if (res.rst?.data?.summary?.length > 0) {
+      tableInfo.summary = res.rst?.data?.summary[0];
+    }
+    tableInfo.descol = [{
+        disabled: 1,
+        if_sort: 0,
+        key_value: "date",
+        label: "日期",
+        tooltip: ""
+      }].concat(res.rst?.data?.explain);
+    tableInfo.tableList = res.rst?.data?.list;
+    tableInfo.total = res.rst?.pageInfo.total
+    tableInfo.totalPages = res.rst?.pageInfo.total
+    tableInfo.updateKey ++;
+  } else {
+    ElMessage.error(res.errMsg)
+  }
+}
+
+/**合计计算 */
+const getSummaries = (param) => {
+  const { columns, data } = param
+  const sums: string[] = []
+  columns.forEach((column, index) => {
+    if (index === 0) {
+      sums[index] = ''
+      return
+    }
+    if (index === 1) {
+      sums[index] = '合计'
+      return
+    }
+    if (tableInfo.summary[column.property] && tableInfo.summary[column.property] != 0) {
+      let info = tableInfo.descol.filter((v) => {
+        return v.key_value == column.property
+      })
+      if (info.length > 0 && info[0].label?.indexOf('率') != -1) {
+        sums[index] = hasDot(tableInfo.summary[column.property], 2, false) + '%'
+      } else {
+        sums[index] = hasDot(tableInfo.summary[column.property], 2, true)
+      }
+    } else {
+      sums[index] = ''
+    }
+  })
+  return sums
+}
+
+const {
+  tableHeaderStyle,
+} = listTs()
+
+// 暴露自己的属性供父组件使用
+defineExpose({
+  init,
+});
+</script>
+<style lang="scss" scoped>
+:deep(.el-table__body-wrapper) {
+  order: 1;
+}
+
+:deep(.el-table__footer-wrapper) {
+  border-bottom: var(--el-table-border);
+  border-top: none;
+}
+
+:deep(.el-table__footer-wrapper tbody td.el-table__cell) {
+  background-color: #fafafa;
+}
+
+.el-table th div.cell {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  max-width: 600px;
+  /* 设置最大宽度，根据需要调整 */
+}
+
+.table_container {
+  background-color: #fff;
+  margin-top: 10px;
+  padding: 20px;
+}
+
+.sortBox {
+  height: 16px;
+  margin-left: 2px;
+  margin-top: -4px;
+
+  .sortItem {
+    width: 8px;
+    height: 8px;
+    line-height: 8px;
+    cursor: pointer;
+    color: #999;
+  }
+}
+
+.tableTop {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 20px;
+
+  .title {
+    font-size: 14px;
+    color: #333;
+    font-weight: bold;
+  }
+}</style>

src/components/businessMoudle/dataManagement/oePromoterData/hooks/index.ts

@@ -0,0 +1,41 @@
+import { Api } from "@/api/api"
+import http from "@/http/http"
+import { ElMessage } from "element-plus"
+import { reactive, ref } from "vue"
+import { getDay } from "@/common/common"
+
+export const ExpIndex = () => {
+  const dataListRef = ref()
+  const acTrendRef = ref<{change: ()=>void}>()
+  const costRef = ref()
+  const userRef = ref()
+  const pageInfo = reactive({
+    data_group: 'account',
+    time_type: 'day',
+    time: [ getDay(-7), getDay(0) ],
+    keyword: '',
+    has_cost: '',
+    acList: [],
+    userList: [],
+    promoter_id: '',//投手
+  })
+
+  /**获取操作人列表 */
+  const getUserList = async () => {
+    let res: any = await http.get(Api.user_list, {})
+    if (res && res.errNo == '0') {
+      pageInfo.userList = res.rst
+    } else {
+      ElMessage.error(res.errMsg)
+    }
+  }
+
+  return {
+    dataListRef,
+    acTrendRef,
+    userRef,
+    costRef,
+    pageInfo,
+    getUserList,
+  }
+}

src/components/businessMoudle/dataManagement/oePromoterData/hooks/trend.ts

@@ -0,0 +1,357 @@
+import { Api } from "@/api/api"
+import http from "@/http/http"
+import { ElMessage } from "element-plus"
+import { reactive, ref } from "vue"
+
+export interface IReportTrend {
+  st_date: string,
+  en_date: string,
+  date_group?: string,
+  dimension: string,
+  keyword?: string,
+  user_ids?: any[],
+  account_ids?: any[],
+  team_ids?: any[],
+  top_num: number,
+  project_ids?: any[],
+  department_ids?: any[]
+}
+
+export const ExpTrend = () => {
+  const isCollapsed = ref(false)
+  const trendLoading = ref(false)
+  const overviewRef = ref()
+  const topNumRef = ref()
+  const tabInfo = reactive({
+    value: 'trend',
+    list: [
+      { name: '趋势分析', id: 'trend' },
+      { name: '占比分析', id: 'ratio' },
+    ]
+  })
+  const overviewData = reactive<{ list: any[], [key: string]: any }>({
+    list: [
+      { name: '消耗', key: 'cost', unit: '元' },
+      { name: '展示数', key: 'view_count' },
+      { name: '千次展示均价(CPM)', key: 'thousand_display_price', unit: '元' },
+      { name: '点击数', key: 'valid_click_count' },
+      { name: '点击率', key: 'ctr' },
+      { name: '点击均价', key: 'cpc' },
+      { name: '转化数', key: 'conversions_count' },
+      { name: '转化率', key: 'conversions_rate' },
+      { name: '转化成本', key: 'conversions_cost', unit: '元' },
+      { name: '激活数', key: 'activated_count' },
+      { name: '注册数', key: 'app_register_count' },
+    ],
+    legendArr: [],
+    trendDataList: [],
+    ratioDataList: []
+  })
+  const topNumList = reactive([
+    { name: 'Top5数据', val: 5 },
+    { name: 'Top10数据', val: 10 },
+  ])
+  const trendInfo = reactive({
+    option: {},
+    heights: '320px',
+  })
+  const ratioInfo = reactive({
+    option: {},
+    heights: '320px',
+  })
+
+  /**数据报表 - 趋势分析 */
+  const reportTrendEvent = async (params: IReportTrend) => {
+    trendLoading.value = true;
+    let res: any = await http.get(Api.report_trend, params)
+    trendLoading.value = false;
+    if (res && res.errNo == '0') {
+      overviewData.trendDataList = res.rst;
+      getTrend(params.dimension)
+    } else {
+      ElMessage.error(res.errMsg)
+    }
+  }
+
+  /**数据报表 - 占比分析 */
+  const reportRatioEvent = async (params: IReportTrend) => {
+    trendLoading.value = true;
+    let res: any = await http.get(Api.report_ratio, params)
+    trendLoading.value = false;
+    if (res && res.errNo == '0') {
+      overviewData.ratioDataList = res.rst;
+      radiuCharts(params.dimension)
+    } else {
+      ElMessage.error(res.errMsg)
+    }
+  }
+
+  const trendColor = ['#3B9FFF', '#4ECB73', '#F9D336', '#F1637B', '#9760E4', '#EF69FF', '#FCB161', '#62DDFF', '#C7C655', '#318730']
+  const getTrendOption = (yAxis, date, data) => {
+    return {
+      tooltip: {
+        trigger: 'axis',
+      },
+      grid: {
+        left: '7%',
+        right: '4%',
+        bottom: '10%'
+      },
+      xAxis: {
+        type: 'category',
+        boundaryGap: false,
+        data: date,
+        axisTick: {
+          show: false
+        },
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: '#cccccc'
+          }
+        },
+        axisLabel: {
+          color: '#666',
+        },
+      },
+      yAxis: yAxis,
+      series: data
+    }
+  }
+  /** 获取曲线数据 */
+  const getTrend = (dimension) => {
+    let time: any[] = [];
+    let dataInfo: any = {
+      trend_name: '',
+      trend: [],
+      data: []
+    };
+    overviewData.list.forEach((item) => {
+      if (item.key == overviewRef.value!.value) {
+        dataInfo.trend_name = item.name + (item.unit ? `(${item.unit})` : '')
+      }
+    });
+
+    let legendArr: any[] = []
+    let yAxis: any[] = []
+    yAxis.push({
+      name: dataInfo.trend_name,
+      type: 'value',
+      splitNumber: 4,
+      nameTextStyle: {
+        align: dataInfo.trend_name.length > 7 ? 'center' : 'right',
+      }
+    })
+
+    if (topNumRef.value?.value == 0) {//汇总
+      overviewData.trendDataList.forEach((item: any) => {
+        time.push(item.time)
+        dataInfo.trend.push(item[overviewRef.value!.value])
+      });
+      dataInfo.data.push({
+        name: '汇总',
+        type: 'line',
+        smooth: true,
+        itemStyle: {
+          color: trendColor[0]
+        },
+        data: dataInfo.trend
+      })
+      legendArr.push({
+        name: '汇总',
+        color: trendColor[0]
+      })
+    } else {
+      if (overviewData.trendDataList?.length > 0) {
+        overviewData.trendDataList[0].data.forEach((item: any) => {
+          time.push(item.time)
+        });
+      }
+      let name = '';
+      let id = '';
+      overviewData.trendDataList.forEach((item: any, index) => {
+        if (dimension == 'account') {//数据维度
+          name = item.account_name
+          id = item.account_id
+        }
+        if (dimension == 'user') {
+          name = item.username
+        }
+        if (dimension == 'team') {
+          name = item.name
+        }
+        if (dimension == 'project') {
+          name = item.name
+        }
+        let trendData: any[] = []
+        item.data?.forEach((s_item) => {
+          trendData.push(s_item[overviewRef.value!.value])
+        });
+        dataInfo.data.push({
+          name: `${name}${id != '' ? `(${id})` : ''}`,
+          type: 'line',
+          smooth: true,
+          itemStyle: {
+            color: trendColor[index]
+          },
+          data: trendData
+        })
+        legendArr.push({
+          name: name,
+          id: id,
+          color: trendColor[index]
+        })
+      });
+    }
+
+    overviewData.legendArr = legendArr
+
+    trendInfo.option = getTrendOption(yAxis, time, dataInfo.data)
+  }
+  /**占比图 */
+  const radiuCharts = (dimension) => {
+    let trend_name = ''
+    let totalValue = ''
+    overviewData.list.forEach((item) => {
+      if (item.key == overviewRef.value!.value) {
+        trend_name = item.name
+      }
+    });
+    let data: any[] = []
+    overviewData.ratioDataList.data.forEach((item) => {
+      if (dimension == 'account') {//数据维度
+        data.push({
+          value: item[`${overviewRef.value!.value}_pro`],
+          name: item.account_name,
+          id: item.account_id,
+        })
+      }
+      if (dimension == 'user') {
+        data.push({
+          value: item[`${overviewRef.value!.value}_pro`],
+          name: item.username,
+        })
+      }
+      if (dimension == 'team') {
+        data.push({
+          value: item[`${overviewRef.value!.value}_pro`],
+          name: item.name,
+        })
+      }
+      if (dimension == 'project') {
+        data.push({
+          value: item[`${overviewRef.value!.value}_pro`],
+          name: item.name,
+        })
+      }
+    });
+    totalValue = overviewData.ratioDataList.total[overviewRef.value!.value];
+    let option = {
+      title: {
+        zlevel: 0,
+        text: [`{name|${trend_name}}`, '{value|' + totalValue + '}'].join('\n'),
+        top: '38%',
+        left: '49.5%',
+        textAlign: 'center',
+        textStyle: {
+            rich: {
+                value: {
+                    color: '#303133',
+                    fontSize: 20,
+                    lineHeight: 24,
+                },
+                name: {
+                    color: '#303133',
+                    fontSize: 20,
+                    lineHeight: 35,
+                },
+            },
+        },
+      },
+      tooltip: {
+        trigger: 'item',
+        show: false
+      },
+      legend: {
+        top: '5%',
+        left: 'center',
+        show: false,
+      },
+      series: [
+        {
+          name: trend_name,
+          type: 'pie',
+          radius: ['40%', '70%'],
+          width: 600,
+          left: 'center',
+          itemStyle: {
+            normal: {
+              borderRadius: 10,
+              borderColor: '#fff',
+              borderWidth: 2,
+              color: function (colors) {
+                return trendColor[colors.dataIndex];
+              }
+            }
+          },
+          label: {
+            show: true,
+            alignTo: 'edge',
+            formatter(param) {
+              return `{name|${param.name}}\n${param.data.id ? `{id|${param.data.id}}：` : ''}{val|${param.percent}%}`
+            },
+            minMargin: 5,
+            edgeDistance: 10,
+            lineHeight: 15,
+            rich: {
+              name: {
+                color: '#888',
+              },
+            },
+          },
+          emphasis: {
+            label: {
+              show: true,
+              fontSize: 15,
+              fontWeight: 'bold'
+            }
+          },
+          labelLine: {
+            length: 15,
+            length2: 0,
+            maxSurfaceAngle: 80
+          },
+          labelLayout: function (params) {
+            const isLeft = params.labelRect.x < 600;
+            const points = params.labelLinePoints;
+            // Update the end point.
+            points[2][0] = isLeft
+              ? params.labelRect.x
+              : params.labelRect.x + params.labelRect.width;
+            return {
+              labelLinePoints: points
+            };
+          },
+          data: data
+        }
+      ]
+    };
+    ratioInfo.option = option
+  }
+
+  return {
+    isCollapsed,
+    tabInfo,
+    trendLoading,
+    topNumRef,
+    overviewRef,
+    overviewData,
+    topNumList,
+    trendInfo,
+    ratioInfo,
+    getTrend,
+    radiuCharts,
+    reportTrendEvent,
+    reportRatioEvent,
+  }
+}

src/components/businessMoudle/dataManagement/oePromoterData/index.vue

@@ -0,0 +1,128 @@
+<template>
+  <div class="flex_between">
+    <div class="page_title">投手数据</div>
+    
+  </div>
+  <div class="screen_box">
+    <div class="flex tMar15">
+      <div class="label lMar20 rMar10">账户名称</div>
+      <el-input v-model="pageInfo.keyword" style="width: 200px" placeholder="请输入账户名称" clearable @clear="init" >
+        <template #append>
+          <el-button :icon="Search" @click="init"/>
+        </template>
+      </el-input>
+      <div class="label lMar20 rMar10">投手</div>
+      <Select ref="userRef"
+            selectWidth="180px"
+            @changeEvent="selectChange('userRef')" @clearEvent="selectChange('userRef')"
+            :filterFlag="true"
+            :optObj="{k:'id',la:'username',val:'id'}"
+            :options="pageInfo.userList"/>
+      <div class="label lMar20 rMar10">是否有消耗</div>
+      <Select ref="costRef"
+            selectWidth="180px"
+            @changeEvent="selectChange('costRef')" @clearEvent="selectChange('costRef')"
+            :filterFlag="true"
+            :optObj="{k:'value',la:'name',val:'value'}"
+            :options="hasCost.list"/>
+      <div class="flex">
+        <div class="label lMar20 rMar10">投放时间</div>
+        <el-date-picker v-model="pageInfo.time" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
+          size="default" style="width: 280px;" @change="init" :clearable="false" class="lMar10" />
+      </div>
+    </div>
+  </div>
+  <dataList ref="dataListRef" :mainPageInfo="pageInfo"></dataList>
+</template>
+<script setup lang="ts">
+import { Search } from '@element-plus/icons-vue'
+import { nextTick, onBeforeMount, reactive, ref } from 'vue';
+import { ExpIndex }  from './hooks/index'
+import { getCookie } from '@/common/common';
+import Select from '@/components/capsulationMoudle/_select.vue'
+import dataList from './dataList.vue'
+
+const userInfo = ref()
+const hasCost = ref({
+    list:[
+      {name:'否',value: 0},
+      {name:'是',value: 1},
+    ]
+})
+const {
+  dataListRef,
+  acTrendRef,
+  userRef,
+  costRef,
+  pageInfo,
+  getUserList,
+} = ExpIndex()
+
+/**点击select筛选 */
+const selectChange = (key) => {
+  if(key == 'userRef') {
+    pageInfo.promoter_id = userRef.value?.value;
+  }
+  if(key == 'costRef') {
+    pageInfo.has_cost = costRef.value?.value;
+  }
+  init()
+}
+
+const init = () => {
+  nextTick(()=>{
+    if(acTrendRef.value) {
+      acTrendRef.value.change()
+    }
+
+    if(dataListRef.value) {
+      dataListRef.value.init(1)
+    }
+  })
+}
+
+onBeforeMount(()=>{
+  userInfo.value = JSON.parse(getCookie('userInfo') as string)
+  getUserList()
+  init()
+})
+
+</script>
+<style lang="scss" scoped>
+.page_title {
+  font-size: 16px;
+  font-weight: bold;
+}
+
+.screen_box {
+  background-color: #fff;
+  padding: 20px;
+  margin-top: 10px;
+}
+
+.btn {
+  border: var(--el-border);
+  height: 30px;
+  line-height: 30px;
+  box-sizing: border-box;
+  border-radius: 4px;
+  padding: 0 15px;
+  margin-right: 10px;
+  font-size: 13px;
+  cursor: pointer;
+
+  &:hover {
+    color: #3173FF;
+  }
+
+  &.active {
+    background-color: #3173FF;
+    border-color: #3173FF;
+    color: #fff;
+
+    &:hover {
+      color: #fff;
+    }
+  }
+}
+</style>

src/router/index.ts

@@ -32,6 +32,7 @@ const menuList = () => import('@/components/businessMoudle/menu/index.vue')
 const document = () => import('@/components/document/index.vue')
 const oeAdAccount = () => import('@/components/businessMoudle/oeAdAccount/index.vue')
 const adAccountGroup = () => import('@/components/businessMoudle/adAccountGroup/index.vue')
+const oePromoterData = () => import('@/components/businessMoudle/dataManagement/oePromoterData/index.vue')
 
 //数据报表
 const acStatement = () => import('@/components/businessMoudle/dataManagement/acStatement/index.vue')
@@ -269,6 +270,14 @@ const constantRoutes: Array<RouteRecordRaw> = [
           title: '账户组'
         }
       },
+      {
+        path: '/oePromoterData',
+        component: oePromoterData,
+        name: 'oePromoterData',
+        meta: {
+          title: '投手数据'
+        }
+      },
     ],
   },
 ]