diff --git a/src/api/all/propertyMarketing.ts b/src/api/all/propertyMarketing.ts index fd66057..063d2ce 100644 --- a/src/api/all/propertyMarketing.ts +++ b/src/api/all/propertyMarketing.ts @@ -322,6 +322,11 @@ export const getPlacementAccountsList = (params = {}) => { return Http.get('/v1/placement-accounts/list', params); }; +// 投放账号计划 +export const getplacementAccountProjectsLlist = (params = {}) => { + return Http.get('/v1/placement-account-projects/list', params); +}; + // 投放账号-同步数据 export const postPlacementAccountsSync = (id: string) => { return Http.post(`/v1/placement-accounts/${id}/sync-data`); diff --git a/src/views/components/common/PlanSelect.vue b/src/views/components/common/PlanSelect.vue new file mode 100644 index 0000000..426c9c5 --- /dev/null +++ b/src/views/components/common/PlanSelect.vue @@ -0,0 +1,58 @@ + + + diff --git a/src/views/property-marketing/put-account/account-dashboard/components/echarts-item/index.vue b/src/views/property-marketing/put-account/account-dashboard/components/echarts-item/index.vue index a6d0f78..e6355a8 100644 --- a/src/views/property-marketing/put-account/account-dashboard/components/echarts-item/index.vue +++ b/src/views/property-marketing/put-account/account-dashboard/components/echarts-item/index.vue @@ -1,141 +1,158 @@ - diff --git a/src/views/property-marketing/put-account/account-dashboard/index.vue b/src/views/property-marketing/put-account/account-dashboard/index.vue index 0166607..3356ba9 100644 --- a/src/views/property-marketing/put-account/account-dashboard/index.vue +++ b/src/views/property-marketing/put-account/account-dashboard/index.vue @@ -8,22 +8,21 @@
-
- {{ accountType == 1 ? '账号名称' : '计划名称' }} +
+ 计划名称 - + + +
+
+ 账号名称 + +
平台 - + {{ item.label }} @@ -60,14 +59,14 @@
- - - + + +
+ +
@@ -84,6 +83,7 @@ import { } from '@/api/all/propertyMarketing'; import OperatorSelect from '@/views/property-marketing/media-account/components/operator-select/index.vue'; import AccountSelect from '@/views/components/common/AccountSelect.vue'; +import PlanSelect from '@/views/components/common/PlanSelect.vue'; const accountType = ref(1); @@ -100,20 +100,32 @@ const query = reactive({ platform: '', operator_id: '', data_time: [], + ids: [], + placement_account_id: [], }); -const xhlEcharts = reactive({}); const getAccountsTrends = async () => { const { code, data } = await getPlacementAccountsTrend(query); if (code === 200) { - Object.assign(xhlEcharts, data); + mergeChartData(data); } onLoading.value = false; }; +const mergeChartData = (apiResponse) => { + console.log(apiResponse, 'apiResponse'); + chartConfigs.value = chartConfigs.value.map((config) => { + const apiItem = apiResponse[config.dataKey] || {}; + return { + ...config, + date: Array.isArray(apiItem.date) ? [...apiItem.date] : [], + series_data: Array.isArray(apiItem.series_data) ? [...apiItem.series_data] : [], + }; + }); +}; const getAccountProjectsTrend = async () => { const { code, data } = await getPlacementAccountProjectsTrend(query); if (code === 200) { - Object.assign(xhlEcharts, data); + mergeChartData(data); } onLoading.value = false; }; @@ -126,37 +138,92 @@ const handleSearch = async () => { } }; // 定义图表配置 -const chartConfigs = [ +const chartConfigs = ref([ { dataKey: 'total_use_amount', title: { name: '消耗量', popover: '广告投放期间已使用的预算总额,代表该账户的实际广告花费。' }, + date: [], + series_data: [], }, { - dataKey: 'avg_conversion_cost', + dataKey: 'show_number', title: { name: '展示量', popover: '广告被用户看到的总次数,是衡量广告曝光覆盖的核心指标。' }, + date: [], + series_data: [], }, - { dataKey: 'click_number', title: { name: '点击量', popover: '用户点击广告的次数,表示广告对用户产生了实际吸引。' } }, + { + dataKey: 'click_number', + title: { name: '点击量', popover: '用户点击广告的次数,表示广告对用户产生了实际吸引。' }, + date: [], + series_data: [], + }, + { dataKey: 'click_rate', title: { name: '点击率', popover: '点击率(CTR)= 点击量 ÷ 展示量,衡量广告吸引力与内容质量。' }, + date: [], + series_data: [], }, { dataKey: 'avg_click_cost', - title: { name: '平均点击成本', popover: '每次点击广告的平均花费(CPC),= 消耗量 ÷ 点击量。' }, + title: { + name: '平均点击成本', + popover: '每次点击广告的平均花费(CPC),= 消耗量 ÷ 点击量。 ', + date: [], + series_data: [], + }, }, { dataKey: 'thousand_show_cost', - title: { name: '千次展示成本', popover: '每千次展示带来的平均成本(CPM),= 消耗量 ÷ 展示量 × 1000。' }, + title: { name: '千次展现费用', popover: '每千次展示带来的平均成本(CPM),= 消耗量 ÷ 展示量 × 1000。' }, + date: [], + series_data: [], }, { dataKey: 'conversion_number', title: { name: '转化数', popover: '用户完成设定行为(如注册、下单)的总次数,衡量广告实际效果。' }, + date: [], + series_data: [], }, + { dataKey: 'conversion_rate', title: { name: '转化率', popover: '转化率(CVR)= 转化数 ÷ 点击量,代表广告引导行为转化的能力。' }, + date: [], + series_data: [], }, -]; + { + dataKey: 'avg_conversion_cost', + title: { name: '平均转化成本', popover: '每次转化所花费的平均广告费用(CPA),= 消耗量 ÷ 转化数。' }, + date: [], + series_data: [], + }, + { + dataKey: 'deep_conversion_number', + title: { + name: '深度转化数', + popover: '完成更高价值行为(如支付、留资等)的用户数量,是衡量广告质量的进阶指标。', + }, + date: [], + series_data: [], + }, + { + dataKey: 'deep_conversion_rate', + title: { + name: '深度转化率', + popover: '深度转化率 = 深度转化数 ÷ 点击量,用于评估优质转化的效率。', + }, + date: [], + series_data: [], + }, + + { + dataKey: 'roi', + title: { name: '投资回报率', popover: 'ROI = 收益 ÷ 投入,衡量广告投放的整体经济回报情况。' }, + date: [], + series_data: [], + }, +]); const handleReset = async () => {}; const operators = ref([]); diff --git a/src/views/property-marketing/put-account/investment-guidelines/index.vue b/src/views/property-marketing/put-account/investment-guidelines/index.vue index 6d05295..b0aba6a 100644 --- a/src/views/property-marketing/put-account/investment-guidelines/index.vue +++ b/src/views/property-marketing/put-account/investment-guidelines/index.vue @@ -142,16 +142,16 @@ const onSearch = async () => { if (tabData.value === 'placement_guide') { result = await getPlacementGuide(query); placementGuideList.value = result?.data?.data || []; + if (placementGuideList.value.length > 0 && isGetAi.value) { + loading.value = true; + syncGetAiResult(); + startTask(); + } } else { result = await getPlacementGuideHistory(query); guideHistoryList.value = result?.data?.data || []; } listData.total = result.data.total; - if (placementGuideList.value.length > 0 && isGetAi.value) { - loading.value = true; - syncGetAiResult(); - startTask(); - } isGetAi.value = true; }; const aiResult = reactive({