feat(property-marketing): 优化投放指南删除功能并添加页面下载功能

2025-07-07 21:37:27 +08:00
parent de9a5abcd5
commit 1100d1a891
4 changed files with 42 additions and 24 deletions
--- a/src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/index.vue
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/index.vue
@ -164,7 +164,6 @@ const MODEL_PLACEMENT_SUGGESTION = '新投放建议生成';

 // 封装通用方法来获取 submodules 的内容
 const getSubmoduleContent = (moduleName: string, submoduleName: string) => {
-  console.log(props.action_guide, 'getSubmoduleContent');
  const module = props.action_guide
    .find((item) => item.title === moduleName)
    ?.submodules.find((mod) => mod.subtitle === submoduleName);
--- a/src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/index.vue
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/index.vue
@ -16,7 +16,7 @@
          <a-col :span="24">
            <div class="overall-strategy">
              <span class="placement-optimization-title">总体策略</span>
-              <span class="placement-optimization-str">{{props.optimization?.[0]?.['content']}}</span>
+              <span class="placement-optimization-str">{{ props.optimization?.[0]?.['content'] }}</span>
            </div>
          </a-col>
        </a-row>
@ -24,13 +24,13 @@
          <a-col :span="12">
            <div class="overall-strategy">
              <span class="placement-optimization-title">预算分配</span>
-              <span class="placement-optimization-str">{{props.optimization?.[1]?.['content']}}</span>
+              <span class="placement-optimization-str">{{ props.optimization?.[1]?.['content'] }}</span>
            </div>
          </a-col>
          <a-col :span="12">
            <div class="overall-strategy">
              <span class="placement-optimization-title">时段优化</span>
-              <span class="placement-optimization-str">{{props.optimization?.[2]?.['content']}}</span>
+              <span class="placement-optimization-str">{{ props.optimization?.[2]?.['content'] }}</span>
            </div>
          </a-col>
        </a-row>
@ -38,14 +38,13 @@
          <a-col :span="12">
            <div class="overall-strategy">
              <span class="placement-optimization-title">人群包优化</span>
-              <span class="placement-optimization-str">{{props?.optimization?.[3]?.['content']}}</span>
+              <span class="placement-optimization-str">{{ props?.optimization?.[3]?.['content'] }}</span>
            </div>
          </a-col>
          <a-col :span="12">
            <div class="overall-strategy">
              <span class="placement-optimization-title">素材优化</span>
-              <span class="placement-optimization-str">{{props?.optimization?.[4]?.['content']}}</span>
-
+              <span class="placement-optimization-str">{{ props?.optimization?.[4]?.['content'] }}</span>
            </div>
          </a-col>
        </a-row>
@ -66,7 +65,7 @@ const props = defineProps({
  },
 });

-console.log(props.optimization,'optimization')
+console.log(props.optimization, 'optimization');
 </script>

 <style scoped lang="scss">
--- a/src/views/property-marketing/put-account/investment-guidelines/components/table-data/guideListHistory.vue
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/table-data/guideListHistory.vue
@ -70,7 +70,9 @@ const columns = [
 ];
 // hotTranslation.vue
 import { useRouter } from 'vue-router';
-import { deleteHistorylog } from '@/api/all/propertyMarketing'; // 引入 useRouter
+import { deleteHistorylog } from '@/api/all/propertyMarketing';
+import { defineEmits } from 'vue'; // 引入 useRouter
+const emits = defineEmits(['onSearch']);

 const router = useRouter(); // 创建 router 实例

@ -101,10 +103,11 @@ const downloadDetailAsImage = (id) => {
  };
 };
 const deleteData = async (id) => {
-  const { code, data } = await deleteHistorylog(id);
-
+  const { code, message } = await deleteHistorylog(id);
  if (code === 200) {
-    Message.success('删除成功');
+    Message.success(message);
+    emits('onSearch');
+    console.log('onsearch')
  }
 };

--- a/src/views/property-marketing/put-account/investment-guidelines/index.vue
+++ b/src/views/property-marketing/put-account/investment-guidelines/index.vue
@ -40,7 +40,7 @@
      </div>
    </div>

-    <div v-if="loading === false">
+    <div v-if="loading === false && tabData === 'placement_guide'">
      <!--    本月摘要-->
      <MonthData :overview="aiResult.overview"></MonthData>

@ -49,9 +49,9 @@
      <!--      投放行动指南-->
      <ActionGuideDistribution :action_guide="aiResult.action_guide" :tmp="tmp"></ActionGuideDistribution>
    </div>
-    <div>
+    <div v-if="tabData == 'placement_guide'">
      <a-space class="down-btn">
-        <a-button type="outline" @click="onSearch">
+        <a-button type="outline" @click="downPage">
          <template #icon>
            <icon-download />
          </template>
@ -82,6 +82,8 @@ import {
  getPlacementGuideHistory,
  savePlacementGuide,
 } from '@/api/all/propertyMarketing';
+import { Message } from '@arco-design/web-vue';
+import html2canvas from 'html2canvas';

 const tabData = ref('placement_guide');

@ -133,6 +135,12 @@ const onSearch = async () => {
    listData.total = data.total;
    if (tabData.value === 'placement_guide') {
      getSyncAiResult();
+      if (listData.list.length != 0) {
+        // 设置定时器每5秒执行一次
+        timer.value = setInterval(() => {
+          getSyncAiResult();
+        }, 5000);
+      }
    }
  }
 };
@ -142,13 +150,26 @@ const aiResult = reactive({
  overview: [], //新投放建议生成
 });

+// 下载当前页面
+
+const downPage = async () => {
+  await nextTick(); // 确保 DOM 更新完成
+  html2canvas(document.querySelector('.guidelines-data-wrap')).then(canvas => {
+    const imgData = canvas.toDataURL('image/png');
+    const link = document.createElement('a');
+    link.href = imgData;
+    const timestamp = new Date().getTime();
+    link.download = `投放指南-${timestamp}.png`;
+    link.click();
+  });
+};
 const saveForm = reactive({
  account: [],
  plan: [],
  platform: [],
  aiResult: [],
 });
-const timer = ref(null);
+const timer = ref<number | null>(null); // 定时器引用
 const getSyncAiResult = async () => {
  if (listData.list.length == 0) {
    return;
@ -156,8 +177,8 @@ const getSyncAiResult = async () => {
  const { code, data } = await getAiResult(query);
  if (code === 200) {
    // 成功或者失败清除定时任务
-    if ((data.status && data.status === 3) || data.status === 2) {
-      // clearInterval(timer);
+    if ((data.ai_result_status && data.ai_result_status === 3) || data.ai_result_status === 2) {
+      clearInterval(timer.value);
    }
    aiResult.optimization = data.result.optimization.modules;
    aiResult.action_guide = data.result?.action_guide?.modules;
@ -165,11 +186,6 @@ const getSyncAiResult = async () => {
    Object.assign(saveForm, data);
  }
  loading.value = false;
-  // 定时任务请求接口
-  timer.value = setInterval(() => {
-    getSyncAiResult();
-  }, 5000);
-  console.log(loading.value, 'loading.value');
 };

 const handleSave = async () => {
@ -177,8 +193,9 @@ const handleSave = async () => {
    ...saveForm,
    ai_result: aiResult,
  };
-  const { code, data } = await savePlacementGuide(updatedSaveForm);
+  const { code, message, data } = await savePlacementGuide(updatedSaveForm);
  if (code === 200) {
+    Message.success(message);
  }
 };
 onMounted(() => {