Merge branch 'test' into wang

# Conflicts:
#	src/views/adManage/sp/campaigns/chartComponents/adStruct.vue

.prettierrc.js

@@ -6,7 +6,7 @@ module.exports = {
 	// 使用制表符而不是空格缩进行
 	useTabs: true,
 	// 在语句末尾打印分号
-	semi: true,
+	semi: false,
 	// 使用单引号而不是双引号
 	singleQuote: true,
 	// 更改引用对象属性的时间 可选值"<as-needed|consistent|preserve>"

src/components/MetricsCards/index.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="metrics-cards" v-loading="loading">
+  <div class="metrics-cards">
     <MCard
      v-model="info.metric"
-     :metric-items="allMetricItems"
+     :metric-items="props.metricItems"
      :color="info.color"
      v-for="info in displayMetrics"
      @change-metric="changedMetric"
@@ -22,31 +22,24 @@ interface Props {
 const colorsMap: { [key: string]: boolean } = {}
 const props = defineProps<Props>()
 const emits = defineEmits(['change', 'update:modelValue'])
-const allMetricItems = ref(props.metricItems)
+// const allMetricItems = ref(props.metricItems)
 const selectedMetric = ref(props.modelValue)
 const displayMetrics: Ref<{metric:string, color?: string}[]> = ref([])
 
 const metricMap = computed(():{[key: string]: string} => {
   const tmp:{[key: string]: string} = {}
-  for (const info of allMetricItems.value) {
+  for (const info of props.metricItems) {
     tmp[info.value] = info.label
   }
   return tmp
 })
-const loading = computed(() => {
-  return displayMetrics.value.length !== 6
-})
 onBeforeMount(()=> {
   const dup:{[key: string]: boolean} = {}
+  // 初始显示图线的三个维度
   for (const info of selectedMetric.value) {
     displayMetrics.value.push({ metric: info.metric, color: info.color })
     dup[info.metric] = true
-    if (info.color) {
-      colorsMap[info.color] = true
-    }
-  }
-  for (const info of allMetricItems.value) {
-    if (info.disabled && !dup[info.value]) { displayMetrics.value.push({ metric: info.value }) }
+    if (info.color) { colorsMap[info.color] = true }
   }
 })
 
@@ -65,7 +58,7 @@ const unsetColor = (color: string ) => {
   }
 }
 const changedMetric = (newVal: string, oldVal: string) => {
-  for (const info of allMetricItems.value) {
+  for (const info of props.metricItems) {
     if (info.value === newVal) {
       info.disabled = true 
     } else if (info.value === oldVal) {
@@ -117,14 +110,28 @@ watch(selectedMetric.value, () => {
 })
 
 watch(
-  allMetricItems.value,
+  props.metricItems,
   () => {
-    const tmp:{[key: string]: boolean} = {}
-    for (const info of displayMetrics.value) {
-      tmp[info.metric] = true
+    const dup:{[key: string]: boolean} = {}
+    for (const info of displayMetrics.value) { dup[info.metric] = true }
+    let needNum = 6 - displayMetrics.value.length
+    if (needNum > 0) {  
+      // 从所有维度中选择剩余
+      for (const info of props.metricItems) {
+        if (!dup[info.value]) {
+          displayMetrics.value.push({ metric: info.value })
+          dup[info.value] = true
+          needNum --
+          if (needNum === 0) break
+        }
+      }
     }
-    for (const info of allMetricItems.value) {
-      if (info.disabled && !tmp[info.value]) { displayMetrics.value.push({ metric: info.value }) }
+    for (const info of props.metricItems) {
+      if (dup[info.value]) {
+        info.disabled = true
+      } else {
+        info.disabled = false
+      }  
     }
   }
 )

src/router/backEnd.ts

@@ -3,6 +3,7 @@ import { storeToRefs } from 'pinia';
 import pinia from '/@/stores/index';
 import { useUserInfo } from '/@/stores/userInfo';
 import { useShopInfo } from '/@/stores/shopInfo';
+import { usePublicData } from '/@/stores/publicData'
 import { useRequestOldRoutes } from '/@/stores/requestOldRoutes';
 import { Session } from '/@/utils/storage';
 import { NextLoading } from '/@/utils/loading';
@@ -47,6 +48,7 @@ export async function initBackEndControlRoutes() {
 	// https://gitee.com/lyt-top/vue-next-admin/issues/I5F1HP
 	await useUserInfo().setUserInfos();
 	await useShopInfo().initShopInfo();
+	usePublicData().initData();
 	// 获取路由菜单数据
 	const res = await getBackEndControlRoutes();
 

src/stores/publicData.ts

@@ -1,18 +1,26 @@
 import { defineStore } from 'pinia'
 import { ref, Ref } from 'vue'
-import XEUtils from 'xe-utils'
 import { Session } from '/@/utils/storage'
+import { recentDaysRange } from '/@/views/adManage/utils/tools'
+import { useShopInfo } from './shopInfo'
 
 export const usePublicData = defineStore('publicData', () => {
-  const data: any = ref(Session.get('publicData') ?? {})
+  const dateRange: Ref<string[]> = ref([])
 
-  function updateData(obj: any) {
-    XEUtils.objectEach(obj, (val, key) => {
-      data.value[key] = val
-    })
-    Session.set('publicData', data.value)
+  function setDateRange(val: string[]) {
+    dateRange.value = val
+    Session.set('dateRange', val)
   }
 
-  return { data, updateData }
+  function initData() {
+    const dateRangeVal = Session.get('dateRange')
+    if (dateRangeVal) {
+      dateRange.value = dateRangeVal
+    } else {
+      setDateRange(recentDaysRange(useShopInfo().profile.time_zone, 7))
+    }
+  }
+
+  return { dateRange, initData, setDateRange }
 })
 

src/theme/app.scss

@@ -332,16 +332,33 @@ body,
 	position: initial !important;
 }
 
-// 最外层的tabs
-.asj-tabs > .el-tabs__header.is-top {
+.asj-tabs {
   background-color: #fff;
   position: sticky;
   top: 32px;
   z-index: 9;
   box-shadow: 0px 0px 12px rgba(51,89,181,0.16);
+	
+	padding: 0 12px;
+	display: flex;
+	height: 40px;
+	gap: 24px;
 }
-.asj-tabs .el-tabs__nav {
-  padding-left: 10px;
+
+.asj-tab {
+	display: flex;
+	align-items: center;
+	padding: 0 4px;
+	height: 40px;
+	font-weight: 700;
+	line-height: 40px;
+	cursor: pointer;
+	border-bottom: 2px solid #fff;
+}
+
+.asj-tab.active {
+	color: #409eff;
+	border-color: #409eff
 }
 
 // 详细页里面的样式
@@ -379,6 +396,10 @@ body,
   width: 100%;
   background-color: #f8f8f8;
   box-shadow: 0px 0px 0px rgba(51,89,181,0.16);
+
+	.el-input__wrapper {
+		border-radius: 0;
+	}
 }
 
 .chart-tabs {

src/types/pinia.d.ts

@@ -89,3 +89,8 @@ declare interface ThemeConfigState {
 		globalComponentSize: string;
 	};
 }
+
+declare interface publicData {
+	dateRange: string[],
+	[key:string]: any
+}

src/views/adManage/sp/adGroups/index.vue

@@ -29,7 +29,7 @@ interface Props {
   campaignId: LocationQueryValue | LocationQueryValue[]
 }
 const props = defineProps<Props>()
-const dateRange: Ref<string[]> = ref(publicData.data.dateRange)
+const dateRange: Ref<string[]> = ref(publicData.dateRange)
 const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { campaignId: props.campaignId } })
 
 onMounted(() => {

src/views/adManage/sp/advertisedProducts/index.vue

@@ -0,0 +1,12 @@
+<template>
+
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+
+</script>
+
+<style scoped>
+
+</style>

src/views/adManage/sp/campaigns/campaignDetail/placement/index.vue

@@ -49,7 +49,7 @@ defineOptions({
 })
 const publicData = usePublicData()
 const shopInfo = useShopInfo()
-const dateRange: Ref<string[]> = ref(publicData.data.dateRange)
+const dateRange: Ref<string[]> = ref(publicData.dateRange)
 interface Props {
   campaignId: LocationQueryValue | LocationQueryValue[]
 }

src/views/adManage/sp/campaigns/chartComponents/adStruct.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref, inject, computed } from "vue"
+import { onMounted, ref, inject, watch, nextTick } from "vue"
 import * as echarts from "echarts"
 import TextSelector from '/@/components/TextSelector/index.vue'
 import { getAdStructureData } from "/@/views/adManage/sp/campaigns/api"
@@ -36,7 +36,12 @@ const loading = ref(true)
 
 let dateRange = inject('dateRange')
 console.log('dateRange', dateRange.value)
-
+watch(
+    dateRange,
+    () => {
+        console.log('-------watch dateRange', dateRange.value)
+    }
+)
 // 下拉框相关
 const pieOptions = [
     {

src/views/adManage/sp/campaigns/chartComponents/dataTendency.vue

@@ -1,6 +1,8 @@
 <template>
-	<MetricsCards v-model="metrics" :metric-items="metricsItems" @change="changeMetric"></MetricsCards>
-  <div style="height: 350px;" ref="chartRef"></div>
+  <div v-loading="loading">
+    <MetricsCards v-model="metrics" :metric-items="metricsItems" @change="changeMetric"></MetricsCards>
+    <div style="height: 350px;" ref="chartRef"></div>
+</div>
 </template>
 
 <script lang="ts" setup>
@@ -12,18 +14,19 @@ import { spCampaignMetricsEnum } from '/@/views/adManage/utils/enum.js'
 import MetricsCards from '/@/components/MetricsCards/index.vue'
 import XEUtils from 'xe-utils'
 import { buildChartOpt } from '/@/views/adManage/utils/tools.js'
+import { usePublicData } from '/@/stores/publicData'
+import { storeToRefs } from 'pinia'
 
 defineOptions({
   name: "DataTendencyChart"
 })
 
-onBeforeMount(async () => {
-	await getMetricsItems()
-})
 onMounted(() => {
-	initLine()
+  getMetricsItems()
 	addResize()
-});
+  // initLine()
+  setTimeout(() => { initLine() }, 0)
+})
 onBeforeUnmount(() => {
 	if(chartObj) {
 		chartObj.dispose()
@@ -32,6 +35,7 @@ onBeforeUnmount(() => {
   removeResize()
 })
 
+const publicData = usePublicData()
 const metrics = ref([
   {metric: 'Impression', color: '#0085ff', 'label': '曝光量'},
   {metric: 'Click', color: '#3fd4cf', 'label': '点击量'},
@@ -177,23 +181,31 @@ const option: any = {
     }
   ]
 }
+const { dateRange } = storeToRefs(publicData)
+const loading = ref(true)
+
 const getDataset = async () => {
-	const resp = await getLineData({profile: shopInfo.profile.profile_id, start: '2023-11-01', end: '2023-11-04'})
+	const resp = await getLineData({profile: shopInfo.profile.profile_id, start: dateRange.value[0], end: dateRange.value[1]})
 	return resp.data
 }
 const initLine = async () => {
 	chartObj = echarts.init(chartRef.value)
 	const items = await getDataset()
 	option.dataset.source = items
+  XEUtils.arrayEach(metricsItems.value, info => {
+    option.legend.selected[info.label] = false
+  })
   for(const info of metrics.value) {
     option.legend.selected[info.label] = true
   }
 	chartObj.setOption(option)
+  loading.value = false
 }
 
 const getMetricsItems = async () => {
-	const resp = await getCardData({start: '2023-11-01', end: '2023-11-04', profile: shopInfo.profile.profile_id})
+	const resp = await getCardData({start: dateRange.value[0], end: dateRange.value[1], profile: shopInfo.profile.profile_id})
 	const data = resp.data
+  metricsItems.value.length = 0
 	XEUtils.arrayEach(spCampaignMetricsEnum, info => {
 		const tmp:MetricData = {
 			label: info.label,
@@ -201,10 +213,8 @@ const getMetricsItems = async () => {
 			metricVal: data[info.value],
 			gapVal: data[`gap${info.value}`],
 			preVal: data[`prev${info.value}`],
-			disabled: info.initShow ? true : false
 		}
 		metricsItems.value.push(tmp)
-    option.legend.selected[info.label] = false
 	})
 }
 
@@ -213,13 +223,23 @@ const changeMetric = () => {
   chartObj.setOption(opt)
 }
 
+watch(
+  dateRange, 
+  async () => {
+    loading.value = true
+    await getMetricsItems()
+    const items = await getDataset()
+    const opt = { dataset: { source: items } }
+    chartObj.setOption(opt)
+    loading.value = false
+  }
+)
+
 const resizeChart = () => { chartObj.resize() }
 const addResize = () => { window.addEventListener('resize', resizeChart) }
 const removeResize = () => { window.removeEventListener('resize', resizeChart) }
 
 
-defineExpose({resizeChart})
-
 </script>
 
 <style scoped>

src/views/adManage/sp/campaigns/index.vue

@@ -2,14 +2,16 @@
 	<fs-page class="fs-page-custom">
     <fs-crud ref="crudRef" v-bind="crudBinding">
 			<template #header-middle>
-				<el-tabs v-model="tabActiveName" class="chart-tabs" type="border-card" @tab-change="changeTab">
+				<el-tabs v-model="tabActiveName" class="chart-tabs" type="border-card">
 					<el-tab-pane label="数据趋势" name="dataTendency">
-						<DataTendencyChart ref="dataTendencyRef"></DataTendencyChart>
+						<DataTendencyChart v-if="tabActiveName === 'dataTendency'"></DataTendencyChart>
 					</el-tab-pane>
-					<el-tab-pane label="广告结构" name="adStruct" :lazy="true">
-						<AdStructChart ref="adStructChartRef"/>
+					<el-tab-pane label="广告结构" name="adStruct" >
+						<AdStructChart v-if="tabActiveName === 'adStruct'"/>
+					</el-tab-pane>
+					<el-tab-pane label="散点视图" name="scatterView">
+						<div v-if="tabActiveName === 'adStruct'">散点视图</div>
 					</el-tab-pane>
-					<el-tab-pane label="散点视图" name="scatterView" :lazy="true"></el-tab-pane>
 				</el-tabs>
 			</template>
 			<template #cell_percentTimeInBudget="scope">
@@ -27,13 +29,12 @@
 			<template #cell_MissedSales="scope">
         {{ scope.row.MissedSalesLower ?? '0' }} ~ {{ scope.row.MissedSalesUpper ?? '0' }}
       </template>
-
 		</fs-crud>
 	</fs-page>
 </template>
 
 <script lang="ts" setup>
-import {ref, onMounted, Ref, nextTick, onBeforeMount, inject} from 'vue'
+import {ref, onMounted, Ref, nextTick, onBeforeMount} from 'vue'
 import { useFs, FsPage } from '@fast-crud/fast-crud';
 import { createCrudOptions } from './crud';
 import { useShopInfo } from '/@/stores/shopInfo'
@@ -43,34 +44,19 @@ import DataTendencyChart from './chartComponents/dataTendency.vue'
 
 const tabActiveName = ref("dataTendency")
 const shopInfo = useShopInfo()
-const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { profileId: shopInfo.profile.profile_id } });
-
-const adStructChartRef = ref()
-const dataTendencyRef = ref()
+const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { profileId: shopInfo.profile.profile_id } })
 const router = useRouter()
 
 onMounted(async () => {
 	crudExpose.doRefresh()
 })
 
-const resizeTabChart = () => {
-	if (adStructChartRef.value) adStructChartRef.value.resizeChart()
-	if (dataTendencyRef.value) dataTendencyRef.value.resizeChart()
-}
-const changeTab = () => {
-	nextTick(() => {
-		resizeTabChart()
-	})
-}
 const jumpGroup = (row: any) => {
 	router.push({
 		name: 'CampaignDetail',
 		query: { id: row.id, campaignId: row.campaignId, tagsViewName: row.campaignName },
 	})
 }
-
-
-defineExpose({ resizeTabChart })
 </script>
 
 <style lang="scss">

src/views/adManage/sp/index.vue

@@ -1,75 +1,83 @@
 <template>
-    <div class="asj-container">
-        <div class="public-search">
-            <DateRangePicker v-model="dateRange" :timezone="shopInfo.profile.time_zone"></DateRangePicker>
-            <el-select v-model="selectedPortfolios" placeholder="广告组合" clearable multiple>
-                <el-option v-for="info of portfolios" :label="info.name" :value="info.portfolioId"></el-option>
-            </el-select>
-        </div>
-        <el-tabs v-model="tabActiveName" class="asj-tabs" @tab-change="changeTab">
-            <el-tab-pane label="广告活动" name="campaigns">
-                <Campaigns ref="campaignsRef"/>
-            </el-tab-pane>
-            <el-tab-pane label="关键词投放" name="keywords" :lazy="true">
-                <Keywords ref="keywordsRef"/>
-            </el-tab-pane>
-            <el-tab-pane label="商品投放" name="targets" :lazy="true">
-                <Targets ref="targetsRef"/>
-            </el-tab-pane>
-            <el-tab-pane label="搜索词" :lazy="true"></el-tab-pane>
-            <el-tab-pane label="广告位" :lazy="true"></el-tab-pane>
-        </el-tabs>
-    </div>
+	<div class="asj-container">
+		<div class="public-search">
+			<DateRangePicker v-model="dateRange" :timezone="shopInfo.profile.time_zone"></DateRangePicker>
+			<el-select
+				v-model="selectedPortfolios"
+				placeholder="广告组合"
+				clearable
+				multiple
+				style="width: 400px"
+				collapse-tags
+				collapse-tags-tooltip
+				:max-collapse-tags="3"
+			>
+				<el-option v-for="info of portfolios" :label="info.name" :value="info.portfolioId"></el-option>
+			</el-select>
+		</div>
+
+		<div class="asj-tabs">
+			<div v-for="tab of tabs" :key="tab.name" :class="['asj-tab', { active: tabActiveName === tab.name }]" @click="tabActiveName = tab.name">
+				{{ tab.label }}
+			</div>
+		</div>
+		<component :is="tabsComponents[tabActiveName]"></component>
+	</div>
 </template>
 
 <script lang="ts" setup>
+import { ref, onBeforeMount, Ref, watch, provide } from 'vue'
+import { useShopInfo } from '/@/stores/shopInfo'
+import { usePublicData } from '/@/stores/publicData'
+import { GetList } from '/@/views/adManage/portfolios/api'
+import { storeToRefs } from 'pinia'
 import DateRangePicker from '/@/components/DateRangePicker/index.vue'
+import { recentDaysRange } from '/@/views/adManage/utils/tools'
 import Campaigns from './campaigns/index.vue'
 import Keywords from './keywords/index.vue'
 import Targets from './targets/index.vue'
-import {onBeforeMount, provide, Ref, ref, watch} from 'vue'
-import {useShopInfo} from '/@/stores/shopInfo'
-import {usePublicData} from '/@/stores/publicData'
-import {GetList} from '/@/views/adManage/portfolios/api'
-import {nextTick} from 'process'
-
+import SearchTerm from './searchTerm/index.vue'
+import AdvertisedProducts from './advertisedProducts/index.vue'
+import PurchasedProducts from './purchasedProducts/index.vue'
+import Placement from './placement/index.vue'
 
 const shopInfo = useShopInfo()
 const publicData = usePublicData()
 const selectedPortfolios: Ref<string[]> = ref([])
 const portfolios: Ref<Portfolio[]> = ref([])
-const dateRange: Ref<string[]> = ref(['2023-11-01', '2023-11-04'])
-const tabActiveName = ref('campaigns')
-const campaignsRef = ref()
-const keywordsRef = ref()
-const targetsRef = ref()
+const { dateRange } = storeToRefs(publicData)
+const tabActiveName = ref('Campaigns')
+const tabs = [
+	{ label: '广告活动', name: 'Campaigns' },
+	{ label: '关键词投放', name: 'Keywords' },
+	{ label: '商品投放', name: 'Targets' },
+	{ label: '推广商品', name: 'AdvertisedProducts' },
+	{ label: '购买的其他商品', name: 'PurchasedProducts' },
+	{ label: '搜索词', name: 'SearchTerm' },
+	{ label: '广告位', name: 'Placement' }
+]
+const tabsComponents: any = {
+	Campaigns,
+	Keywords,
+	Targets,
+	AdvertisedProducts,
+	PurchasedProducts,
+	SearchTerm,
+	Placement
+}
 
-publicData.updateData({dateRange: dateRange.value})
 provide('dateRange', dateRange)
 
 onBeforeMount(async () => {
-    console.log(shopInfo.profile)
-    // dateRange.value = recentDaysRange(shopInfo.profile.time_zone, 7)
-
-    const resp: APIResponseData = await GetList({limit: 999})
-    portfolios.value = resp.data
+	const resp: APIResponseData = await GetList({ limit: 999 })
+	portfolios.value = resp.data
 })
-const changeTab = () => {
-    nextTick(() => {
-        campaignsRef.value.resizeTabChart()
-        keywordsRef.value.resizeTabChart()
-        targetsRef.value.resizeTabChart()
-    })
-}
-watch(
-        dateRange,
-        () => {
-            publicData.updateData({dateRange: dateRange.value})
-        }
-)
 
+publicData.$subscribe((mutation, state) => {
+	// console.log(mutation)
+	// console.log(state.dateRange)
+	publicData.setDateRange(state.dateRange)
+})
 </script>
 
-<style>
-
-</style>
+<style scoped></style>

src/views/adManage/sp/keywords/chartComponents/adStruct.vue

@@ -393,8 +393,6 @@ function resizeChart() {
     barChart.resize()
 }
 
-defineExpose({ resizeChart })
-
 </script>
 
 <style scoped>

src/views/adManage/sp/keywords/chartComponents/dataTendency.vue

@@ -21,7 +21,7 @@ onBeforeMount(async () => {
 	await getMetricsItems()
 })
 onMounted(() => {
-	initLine()
+	setTimeout(() => { initLine() }, 0)
 	addResize()
 });
 onBeforeUnmount(() => {
@@ -200,8 +200,7 @@ const getMetricsItems = async () => {
 			value: info.value,
 			metricVal: data[info.value],
 			gapVal: data[`gap${info.value}`],
-			preVal: data[`prev${info.value}`],
-			disabled: info.initShow ? true : false
+			preVal: data[`prev${info.value}`]
 		}
 		metricsItems.value.push(tmp)
     option.legend.selected[info.label] = false
@@ -218,8 +217,6 @@ const addResize = () => { window.addEventListener('resize', resizeChart) }
 const removeResize = () => { window.removeEventListener('resize', resizeChart) }
 
 
-defineExpose({resizeChart})
-
 </script>
 
 <style scoped>

src/views/adManage/sp/keywords/index.vue

@@ -1,28 +1,27 @@
 <template>
-    <fs-page class="fs-page-custom">
-        <fs-crud ref="crudRef" v-bind="crudBinding">
-            <template #header-middle>
-                <el-tabs v-model="tabActiveName" class="chart-tabs" type="border-card" @tab-change="changeTab">
-                    <el-tab-pane label="数据趋势" name="dataTendency">
-                        <DataTendencyChart ref="dataTendencyRef"/>
-                    </el-tab-pane>
-                    <el-tab-pane label="广告结构" name="adStruct" :lazy="true">
-                        <AdStructChart ref="adStructChartRef"/>
-                    </el-tab-pane>
-                    <el-tab-pane label="散点视图" name="scatterView" :lazy="true"></el-tab-pane>
-                </el-tabs>
-            </template>
-        </fs-crud>
-    </fs-page>
+	<fs-page class="fs-page-custom">
+		<fs-crud ref="crudRef" v-bind="crudBinding">
+			<template #header-middle>
+				<el-tabs v-model="tabActiveName" class="chart-tabs" type="border-card">
+					<el-tab-pane label="数据趋势" name="dataTendency">
+						<DataTendencyChart v-if="tabActiveName === 'dataTendency'" />
+					</el-tab-pane>
+					<el-tab-pane label="广告结构" name="adStruct">
+						<AdStructChart v-if="tabActiveName === 'adStruct'" />
+					</el-tab-pane>
+					<el-tab-pane label="散点视图" name="scatterView"></el-tab-pane>
+				</el-tabs>
+			</template>
+		</fs-crud>
+	</fs-page>
 </template>
 
 <script lang="ts" setup>
-import {ref, onMounted, onBeforeUnmount, watch, nextTick, onActivated, inject} from 'vue'
-import {useFs, FsPage} from '@fast-crud/fast-crud'
-import {createCrudOptions} from './crud'
-import {useRoute, useRouter} from 'vue-router'
+import { ref, onMounted, inject } from 'vue'
+import { useFs, FsPage } from '@fast-crud/fast-crud'
+import { createCrudOptions } from './crud'
 import DataTendencyChart from './chartComponents/dataTendency.vue'
-import {useShopInfo} from '/@/stores/shopInfo'
+import { useShopInfo } from '/@/stores/shopInfo'
 import AdStructChart from './chartComponents/adStruct.vue'
 
 const tabActiveName = ref('dataTendency')
@@ -32,39 +31,17 @@ const start = dateRange.value[0]
 const end = dateRange.value[1]
 const {crudBinding, crudRef, crudExpose} = useFs({createCrudOptions, context: {profileId: shopInfo.profile.profile_id, start: start, end: end}})
 
-const route = useRoute()
-const router = useRouter()
-const adStructChartRef = ref()
-const dataTendencyRef = ref()
-
-console.log(111, dateRange.value)
-
 onMounted(() => {
-    crudExpose.doRefresh()
+	crudExpose.doRefresh()
 })
-
-const resizeTabChart = () => {
-    if (tabActiveName.value === 'dataTendency') {
-        dataTendencyRef.value.resizeChart()
-    } else if (tabActiveName.value === 'adStruct') {
-        adStructChartRef.value.resizeChart()
-    }
-}
-const changeTab = () => {
-    nextTick(() => {
-        resizeTabChart()
-    })
-}
-defineExpose({resizeTabChart})
 </script>
 
 <style lang="scss">
 .chart-tabs {
-    margin: 5px 0;
+	margin: 5px 0;
 
-    .el-tabs__nav {
-        padding-left: 0 !important;
-    }
+	.el-tabs__nav {
+		padding-left: 0 !important;
+	}
 }
-
 </style>

src/views/adManage/sp/placement/index.vue

@@ -0,0 +1,12 @@
+<template>
+
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+
+</script>
+
+<style scoped>
+
+</style>

src/views/adManage/sp/purchasedProducts/index.vue

@@ -0,0 +1,12 @@
+<template>
+
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+
+</script>
+
+<style scoped>
+
+</style>

src/views/adManage/sp/searchTerm/index.vue

@@ -0,0 +1,12 @@
+<template>
+
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+
+</script>
+
+<style scoped>
+
+</style>

src/views/adManage/utils/enum.ts

@@ -1,10 +1,10 @@
 export const spCampaignMetricsEnum = [
-  {label: '曝光量', value: 'Impression', initShow: true},
-  {label: '点击量', value: 'Click', initShow: true},
-  {label: '花费', value: 'Spend', initShow: true},
-  {label: '订单量', value: 'TotalPurchases', initShow: true},
-  {label: '销售额', value: 'TotalSales', initShow: true},
-  {label: '销量', value: 'TotalUnitOrdered', initShow: true},
+  {label: '曝光量', value: 'Impression'},
+  {label: '点击量', value: 'Click'},
+  {label: '花费', value: 'Spend'},
+  {label: '订单量', value: 'TotalPurchases'},
+  {label: '销售额', value: 'TotalSales'},
+  {label: '销量', value: 'TotalUnitOrdered'},
   {label: '点击率', value: 'CTR'},
   {label: '点击成本', value: 'CPC'},
   {label: '转化率', value: 'PurchasesRate'},