index.vue 1.31 KB
<template>
  <view class="h-page">
    <CustomNavBar :title="t('PreMallChart.mall_flow_conversion.funnel')" />
    <PageOptions @change="handleOptionsChange"></PageOptions>
    <view class="h-c-container">
      <FlowTrans ref="flowTransRef"></FlowTrans>
    </view>
  </view>
</template>

<script setup>
  import {
    ref,
    onMounted
  } from 'vue'
  import PageOptions from '@/components/PageOptions.vue'
  import CardNvue from '@/pages/flow/components/Card.nvue'
  import CustomNavBar from '@/components/CustomNav.nvue'
  import FlowTrans from '@/pages/flow/components/FlowTrans.nvue';
  import { t } from '@/plugins/index.js'
  import { onPullDownRefresh } from '@dcloudio/uni-app'

  const params = ref({})
  const handleOptionsChange = (e) => {
    params.value = e
    initFaceAnalyzeCharts()
  }

  onMounted(() => {
    initFaceAnalyzeCharts()
  })

  const flowTransRef = ref(null)
  const initFaceAnalyzeCharts = () => {
    flowTransRef.value?.initData(params.value)
  }

  onPullDownRefresh(() => {
    initFaceAnalyzeCharts()
    uni.stopPullDownRefresh()
  })
</script>

<style lang="scss">
  .h-page {
    /* #ifdef H5 */
    min-height: 100vh;
    /* #endif */
    /* #ifndef H5 */
    min-height: 100vh;
    /* #endif */
    background-color: #f2f3f6;

    .h-c-container {
      padding: 0 20rpx 20rpx;
    }
  }
</style>