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

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(() => {