From 7975c7bdd7fc06f954cdf6bfe263f839d5dee33b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=97=E5=BF=97=E5=86=9B?= <543024265@qq.com>
Date: Fri, 27 Jun 2025 09:34:21 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=99=BA=E8=83=BD=E6=96=B9=E6=A1=88?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../enterpriseKnowledge/brandMaterials.less               | 8 ++++++++
 .../enterpriseKnowledge/brandMaterials.vue                | 2 +-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.less b/src/views/property-marketing/enterpriseKnowledge/brandMaterials.less
index 23e6a7c..26aec80 100644
--- a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.less
+++ b/src/views/property-marketing/enterpriseKnowledge/brandMaterials.less
@@ -56,12 +56,14 @@
     margin: 20px 20px;
   }
 
+  //添加按钮
   .add-btn {
     font-size: 16px;
     padding: 0 24px;
     border-radius: 4px;
   }
 
+  //分页
   .materials-page {
     background: #fff;
     border-radius: 8px;
@@ -179,4 +181,10 @@
   .a-modal .a-modal-footer {
     justify-content: flex-end;
   }
+
+  //弹窗样式
+  .a-modal-title {
+    position: absolute;
+    left: 10px;
+  }
 }
diff --git a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue b/src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue
index 3beb3aa..5c541d9 100644
--- a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue
+++ b/src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue
@@ -87,7 +87,7 @@
         @cancel="handleModalCancel"
       >
         <template #title>
-          <span title="测试">{{ form.id > 0 ? '编辑品牌' : '新增品牌' }}</span>
+          <span class="a-modal-title">{{ form.id > 0 ? '编辑品牌' : '新增品牌' }}</span>
         </template>
         <a-form
           :model="form"

From 404d4812b108ac1eee06cd03d9eeb2cd9f60d7cd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=97=E5=BF=97=E5=86=9B?= <543024265@qq.com>
Date: Fri, 27 Jun 2025 16:26:03 +0800
Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E6=8A=95?=
 =?UTF-8?q?=E6=94=BE=E6=8C=87=E5=8D=97=E7=BB=84=E4=BB=B6=E5=92=8C=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E5=93=81=E7=89=8C=E7=89=A9=E6=96=99=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/upload/ImageUpload.vue         |  65 +-
 .../routes/modules/propertyMarketing.ts       |   4 +-
 .../index.vue}                                | 144 +++--
 .../style.scss}                               |  52 +-
 .../action-guide-distribution/index.vue       | 233 ++++++++
 .../action-guide-distribution/style.scss      |   0
 .../components/month-data/index.vue           |  35 ++
 .../components/month-data/style.scss          |   0
 .../placement-suggestions/index.vue           |  73 +++
 .../placement-suggestions/style.scss          |   0
 .../table-data/guideListHistory.vue           | 117 ++++
 .../components/table-data/listSearchForm.vue  |  98 +++
 .../table-data/placementGuideList.vue         | 217 +++++++
 .../investment-guidelines/index.vue           |  71 +++
 .../investment-guidelines/style.scss          | 196 ++++++
 .../put-account/investmentGuidelines.less     | 198 -------
 .../put-account/investmentGuidelines.vue      | 560 ------------------
 17 files changed, 1167 insertions(+), 896 deletions(-)
 rename src/views/property-marketing/enterpriseKnowledge/{brandMaterials.vue => brand-materials/index.vue} (60%)
 rename src/views/property-marketing/enterpriseKnowledge/{brandMaterials.less => brand-materials/style.scss} (83%)
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/index.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/style.scss
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/month-data/index.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/month-data/style.scss
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/index.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/style.scss
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/table-data/guideListHistory.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/table-data/listSearchForm.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/components/table-data/placementGuideList.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/index.vue
 create mode 100644 src/views/property-marketing/put-account/investment-guidelines/style.scss
 delete mode 100644 src/views/property-marketing/put-account/investmentGuidelines.less
 delete mode 100644 src/views/property-marketing/put-account/investmentGuidelines.vue

diff --git a/src/components/upload/ImageUpload.vue b/src/components/upload/ImageUpload.vue
index 450ac52..0054575 100644
--- a/src/components/upload/ImageUpload.vue
+++ b/src/components/upload/ImageUpload.vue
@@ -107,54 +107,27 @@ const handleError = (error) => {
   console.error(error);
 };
 
-const customRequest = (option) => {
+const customRequest = async (option) => {
   const { onProgress, onError, onSuccess, fileItem, name } = option;
-  const xhr = new XMLHttpRequest();
-  if (xhr.upload) {
-    xhr.upload.onprogress = function (event) {
-      let percent;
-      if (event.total > 0) {
-        // 0 ~ 1
-        percent = event.loaded / event.total;
-      }
-      onProgress(percent, event);
-    };
-  }
-  xhr.onerror = function error(e) {
-    onError(e);
-  };
-  xhr.onload = function onload() {
-    if (xhr.status < 200 || xhr.status >= 300) {
-      return onError(xhr.responseText);
-    }
-    let response = JSON.parse(xhr.response);
-    if (response && response.data.upload_url) {
-      const blob = new Blob([fileItem.file], { type: fileItem.file.type });
-      axios
-        .put(response.data.upload_url, blob, {
-          headers: { 'Content-Type': fileItem.file.type },
-        })
-        .then(() => {
-          onSuccess(xhr.response);
-        })
-        .catch((error) => {
-          onError(error);
-        });
-    } else {
-      onError(xhr.response);
-    }
-  };
+  try {
+    // 1. 获取预签名上传URL
+    const response = await fetchImageUploadFile({ suffix: getFileExtension(fileItem.file.name) });
+    const preSignedUrl = response?.data?.upload_url;
 
-  const formData = new FormData();
-  formData.append(name || 'file', fileItem.file);
-  xhr.open('get', '/api/v1/oss/image-pre-signed-url?suffix=png', true);
-  xhr.send(formData);
-  let extension = getFileExtension(fileItem.file.name);
-  return {
-    abort() {
-      xhr.abort();
-    },
-  };
+    if (!preSignedUrl) {
+      throw new Error('未能获取有效的预签名上传地址');
+    }
+    console.log('preSignedUrl', preSignedUrl);
+    // 2. 使用预签名URL上传文件
+    const blob = new Blob([fileItem.file], { type: fileItem.file.type });
+    await axios.put(preSignedUrl, blob, {
+      headers: { 'Content-Type': fileItem.file.type },
+    });
+
+    onSuccess(JSON.stringify(response));
+  } catch (error) {
+    onError(error);
+  }
 };
 
 function getFileExtension(filename: string): string {
diff --git a/src/router/routes/modules/propertyMarketing.ts b/src/router/routes/modules/propertyMarketing.ts
index 33e6b63..affcb1e 100644
--- a/src/router/routes/modules/propertyMarketing.ts
+++ b/src/router/routes/modules/propertyMarketing.ts
@@ -28,7 +28,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
           requiresAuth: true,
           roles: ['*'],
         },
-        component: () => import('@/views/property-marketing/enterpriseKnowledge/brandMaterials.vue'),
+        component: () => import('@/views/property-marketing/enterpriseKnowledge/brand-materials/index.vue'),
       },
     ],
   },
@@ -128,7 +128,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
           requiresAuth: true,
           roles: ['*'],
         },
-        component: () => import('@/views/property-marketing/put-account/investmentGuidelines'),
+        component: () => import('@/views/property-marketing/put-account/investment-guidelines'),
       },
     ],
   },
diff --git a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue b/src/views/property-marketing/enterpriseKnowledge/brand-materials/index.vue
similarity index 60%
rename from src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue
rename to src/views/property-marketing/enterpriseKnowledge/brand-materials/index.vue
index 5c541d9..0913a1a 100644
--- a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue
+++ b/src/views/property-marketing/enterpriseKnowledge/brand-materials/index.vue
@@ -1,53 +1,44 @@
 <template>
-  <view class="placement-guide-style">
+  <view class="view-body">
     <div class="part-div">
       <div class="part-div-header">
         <span class="part-div-header-title">品牌物料</span>
+        <div v-if="listResult.total > 0" style="position: absolute; right: 35px;margin-top: 10px">
+          <a-button style="float: right; width: 100px; height: 35px" type="primary" @click="handleAdd"
+            >+ 添加品牌
+          </a-button>
+        </div>
       </div>
-      <a-space v-if="listResult.data.length === 0" direction="vertical" class="non-data">
-        <a-space>
-          <a-image :src="noDataImage" />
-        </a-space>
-        <a-space>
-          <span class="non-data-str">暂无品牌</span>
-        </a-space>
-        <a-space>
-          <a-button class="add-btn" @click="handleAdd" type="primary">
-            <template #icon>
-              <icon-plus />
-            </template>
-            去添加
-          </a-button>
-        </a-space>
-      </a-space>
 
-      <a-space v-else>
-        <div class="header-row">
-          <h2 class="page-title">品牌物料</h2>
-          <a-button type="primary" @click="handleAdd" class="add-btn">+ 添加品牌</a-button>
-        </div>
+      <a-space direction="vertical">
+        <a-space size="medium" direction="content" style="margin-left: 24px; margin-bottom: 20px">
+          <a-space>
+            <span>品牌名称</span>
+            <a-input v-model="listQuery.name" placeholder="请搜索..." size="medium" allow-clear @change="handleSearch">
+              <template #prefix>
+                <icon-search />
+              </template>
+            </a-input>
+          </a-space>
 
-        <!-- 搜索栏 -->
-        <div class="search-row">
-          品牌名称
-          <a-input v-model="listQuery.name" placeholder="请搜索..." allow-clear class="search-input" />
-          <a-button type="outline" @click="handleSearch">
-            <template #icon>
-              <icon-search />
-            </template>
-            <template #default>搜索</template>
-          </a-button>
-          <a-button type="outline" @click="handleReset">
-            <template #icon>
-              <icon-refresh />
-            </template>
-            <template #default>重置</template>
-          </a-button>
-        </div>
+          <a-space style="margin-left: 20px">
+            <a-button type="outline" size="medium" class="search-btn" @click="handleSearch">
+              <template #icon>
+                <icon-search />
+              </template>
+              <template #default>搜索</template>
+            </a-button>
+            <a-button type="outline" size="medium" class="reset-btn" @click="handleSearch">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              <template #default>重置</template>
+            </a-button>
+          </a-space>
+        </a-space>
 
         <!-- 表格 -->
-
-        <a-table :data="listResult.list" :pagination="false">
+        <a-table :data="listResult.data" class="a-table" :pagination="false">
           <template #columns>
             <a-table-column title="品牌名称" data-index="name" />
             <a-table-column title="品牌logo" data-index="logo">
@@ -58,52 +49,53 @@
             <a-table-column title="Slogan" data-index="slogan" />
             <a-table-column title="操作" data-index="optional">
               <template #cell="{ record }">
-                <a-popconfirm
-                  content="确定删除吗?"
-                  type="warning"
-                  ok-text="确认删除"
-                  cancel-text="取消"
-                  @ok="deleteBrand(record.id)"
-                >
-                  <icon-delete></icon-delete>
-                </a-popconfirm>
-                <a-button type="outline" @click="handleEdit(record.id)">编辑</a-button>
+                <a-space size="medium">
+                  <a-space>
+                    <a-popconfirm
+                      content="确定删除吗?"
+                      type="warning"
+                      ok-text="确认删除"
+                      cancel-text="取消"
+                      @ok="deleteBrand(record.id)"
+                    >
+                      <icon-delete></icon-delete>
+                    </a-popconfirm>
+                  </a-space>
+                  <a-space>
+                    <a-button type="outline" @click="handleEdit(record.id)">编辑</a-button>
+                  </a-space>
+                </a-space>
               </template>
             </a-table-column>
           </template>
         </a-table>
 
-        <!-- 分页 -->
-        <a-space direction="vertical" size="large">
+        <div style="float: right; margin-right: 10px">
           <a-pagination :total="listResult.total" :size="listQuery.page_size" show-total show-jumper show-page-size />
-        </a-space>
+        </div>
       </a-space>
       <!-- 新增/编辑品牌弹窗 -->
       <a-modal
         v-model:visible="modalVisible"
         :mask-closable="false"
         :esc-to-close="false"
-        width="480px"
+        width="510px"
         @cancel="handleModalCancel"
       >
         <template #title>
-          <span class="a-modal-title">{{ form.id > 0 ? '编辑品牌' : '新增品牌' }}</span>
+          <span class="modal-title">{{ form.id > 0 ? '编辑品牌' : '新增品牌' }}</span>
         </template>
-        <a-form
-          :model="form"
-          :label-col-props="{ span: 5, offset: 0 }"
-          :wrapper-col-props="{ span: 19, offset: 0 }"
-          label-align="left"
-          :rules="formRule"
-          ref="formRef"
-          layout="left"
-        >
+        <a-form :model="form" :rules="formRule" ref="formRef" layout="horizontal" auto-label-width>
           <a-form-item field="name" label="品牌名称">
-            <a-input v-model="form.name" placeholder="请输入品牌名称" />
+            <a-input v-model="form.name" placeholder="请输入..." />
           </a-form-item>
           <a-form-item field="logo" class="form-item-logo" label="标准版Logo">
-            <ImageUpload v-model="form.logo" :limit="1"></ImageUpload>
-            <div class="form-tip">品牌常规展示标识，支持PNG、JPG格式</div>
+            <a-space>
+              <ImageUpload v-model="form.logo" :limit="1"></ImageUpload>
+            </a-space>
+            <a-space>
+              <span class="form-tip">（品牌常规展示使用，支持PNG，JPG格式）</span>
+            </a-space>
           </a-form-item>
           <a-form-item field="otherLogos" class="form-item-logo" label="其他Logo">
             <ImageUpload v-model="form.other_logos" :limit="3"></ImageUpload>
@@ -126,7 +118,7 @@ import { ref, computed, reactive, onMounted } from 'vue';
 import { Message } from '@arco-design/web-vue';
 import { IconDelete } from '@arco-design/web-vue/es/icon';
 import noDataImage from '@/assets/img/guide/no_data.png';
-import '@/views/property-marketing/enterpriseKnowledge/brandMaterials.less';
+import '@/views/property-marketing/enterpriseKnowledge/brand-materials/style.scss';
 
 import {
   addMaterials,
@@ -176,9 +168,7 @@ onMounted(() => {
 const handleSearch = () => {
   getMaterialsList(listQuery).then((response) => {
     listResult.data = response.data.data;
-    console.log(response.data, 'response.data');
-    console.log(listResult.data, 'listResult.data');
-    listResult.total = response.total;
+    listResult.total = response.data.total;
   });
 };
 
@@ -196,7 +186,6 @@ function handleReset() {
 }
 
 function handleAdd() {
-  modalTitle.value = '添加品牌';
   btn_str.value = '确认添加';
   form.id = 0;
   form.logo = '';
@@ -221,7 +210,8 @@ function handleModalOk() {
             handleSearch();
           });
         } else {
-          addMaterials(form).then(() => {
+          addMaterials(form).then((response) => {
+            console.log(response, 'response');
             Message.success('新增成功');
             handleSearch();
           });
@@ -236,12 +226,10 @@ function handleModalOk() {
 }
 
 function handleEdit(id) {
-  modalTitle.value = '编辑品牌';
-  formRef.value.resetFields();
   modalVisible.value = true;
-  btn_str.value = '确认修改';
+  btn_str.value = '确认';
   getMaterialsDetail(id).then((response) => {
-    Object.assign(form, response);
+    Object.assign(form, response.data);
   });
 }
 </script>
diff --git a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.less b/src/views/property-marketing/enterpriseKnowledge/brand-materials/style.scss
similarity index 83%
rename from src/views/property-marketing/enterpriseKnowledge/brandMaterials.less
rename to src/views/property-marketing/enterpriseKnowledge/brand-materials/style.scss
index 26aec80..4e5798f 100644
--- a/src/views/property-marketing/enterpriseKnowledge/brandMaterials.less
+++ b/src/views/property-marketing/enterpriseKnowledge/brand-materials/style.scss
@@ -1,4 +1,4 @@
-.placement-guide-style {
+.view-body {
   //每块div布局
   .part-div {
     width: 100%;
@@ -95,9 +95,14 @@
     width: 240px;
   }
 
-  .search-btn,
   .reset-btn {
     min-width: 72px;
+    color: black;
+  }
+
+  .search-btn,
+  {
+    min-width: 72px;
   }
 
   .brand-table {
@@ -167,12 +172,6 @@
     gap: 12px;
   }
 
-  .form-tip {
-    color: #999;
-    font-size: 13px;
-    margin-left: 8px;
-    line-height: 1.5;
-  }
 
   .a-form .a-form-item {
     margin-bottom: 24px;
@@ -182,9 +181,38 @@
     justify-content: flex-end;
   }
 
-  //弹窗样式
-  .a-modal-title {
-    position: absolute;
-    left: 10px;
+  .a-table {
+    margin-left: 24px;
+    margin-right: 24px;
   }
 }
+
+.modal-title {
+  position: absolute;
+  left: 10px;
+}
+
+.arco-textarea-wrapper,
+.arco-input-wrapper {
+  border-radius: 4px;
+  border-color: #d7d7d9;
+  background-color: #fff;
+
+  &:focus-within,
+  &.arco-input-focus {
+    background-color: var(--color-bg-2);
+    border-color: rgb(var(--primary-6));
+    box-shadow: 0 0 0 0 var(--color-primary-light-2);
+  }
+
+  &.arco-input-wrapper {
+    height: 35px;
+  }
+}
+
+.form-tip {
+  color: #999;
+  font-size: 13px;
+  margin-left: 8px;
+  line-height: 1.5;
+}
diff --git 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
new file mode 100644
index 0000000..38f5133
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/index.vue
@@ -0,0 +1,233 @@
+<template>
+  <view>
+    <div class="part-div">
+      <div class="part-div-header">
+        <span class="part-div-header-title">投放行动指南</span>
+        <a-popover position="tl">
+          <icon-question-circle />
+          <template #content>
+            <p style="margin: 0">投放建议优化。</p>
+          </template>
+        </a-popover>
+      </div>
+      <a-space>
+        <span class="player-title">表现分析</span>
+        <a-popover position="tl">
+          <icon-question-circle />
+          <template #content>
+            <p style="margin: 0">表现分析。</p>
+          </template>
+        </a-popover>
+      </a-space>
+      <div>
+        <a-row class="grid-demo" :gutter="24">
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">人群分析</span>
+              <a-space direction="vertical">
+                <a-space class="placement-optimization-str">
+                  <span>
+                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                    18-24岁女性，兴趣为“美妆/穿搭”，一线城市，抖音平台 ROI 3.2</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                    25-34岁男性，兴趣为“数码产品”，二线城市，巨量引擎 ROI 2.8</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                    18-24岁男性，兴趣为“运动/健身”，三线城市，抖音 ROI 2.3</span
+                  >
+                </a-space>
+              </a-space>
+            </div>
+          </a-col>
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">投放素材</span>
+              <a-space direction="vertical">
+                <a-space class="placement-optimization-str">
+                  <span>
+                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                    图文风格 + 明确福利点，CTR 3.2%、CVR 8.5%</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                    场景短视频 + 明确人设定位，CTR 2.7%、CVR 7.1%</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                    口播讲解类 + 产品对比，CTR 2.1%、CVR 6.0%</span
+                  >
+                </a-space>
+              </a-space>
+            </div>
+          </a-col>
+        </a-row>
+        <a-row class="grid-demo" :gutter="24">
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">投放时段</span>
+              <a-space direction="vertical">
+                <a-space class="placement-optimization-str">
+                  <span>
+                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                    晚高峰时段（19:00–21:00），ROI 3.1</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                    中午时段（11:30–13:00），ROI 2.5</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                    下午茶时段（15:00–17:00），ROI 2.3</span
+                  >
+                </a-space>
+              </a-space>
+            </div>
+          </a-col>
+
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">平台表现</span>
+              <a-space direction="vertical">
+                <a-space class="placement-optimization-str">
+                  <span>
+                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                    抖音 - ROI 3.2，CVR 8.5%</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                    聚光平台 - ROI 2.7，CVR 7.3%</span
+                  >
+                </a-space>
+                <a-space>
+                  <span>
+                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                    B站 - ROI 2.4，CVR 6.8%</span
+                  >
+                </a-space>
+              </a-space>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+      <a-space>
+        <span class="player-title">新投放建议生成</span>
+        <a-popover position="tl">
+          <icon-question-circle />
+          <template #content>
+            <p style="margin: 0">新投放建议生成。</p>
+          </template>
+        </a-popover>
+      </a-space>
+      <a-row class="grid-demo" :gutter="24">
+        <a-col :span="24">
+          <div class="overall-strategy">
+            <span class="placement-optimization-title">人群建议</span>
+            <a-space direction="vertical">
+              <a-space class="placement-optimization-str">
+                <span>
+                  <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                  集中在 18–24 岁女性 + 精准兴趣标签（如“护肤”、“口红”）</span
+                >
+              </a-space>
+              <a-space>
+                <span>
+                  <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                  24–30 岁男性 + 实用类内容受众（如“工具控”、“搞机党”）</span
+                >
+              </a-space>
+              <a-space>
+                <span>
+                  <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                  泛娱乐向受众 + 较大地域分布（兴趣“短剧”、“直播带货”）</span
+                >
+              </a-space>
+            </a-space>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row class="grid-demo" :gutter="24">
+        <a-col :span="24">
+          <div class="overall-strategy">
+            <span class="placement-optimization-title">素材建议</span>
+            <a-space direction="vertical">
+              <a-space class="placement-optimization-str">
+                <span>
+                  <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                  福利明确+钩子强的图文短视频，建议加限时优惠提示</span
+                >
+              </a-space>
+              <a-space>
+                <span>
+                  <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                  场景代入型视频，突出客户痛点与产品关联</span
+                >
+              </a-space>
+              <a-space>
+                <span>
+                  <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                  达人口播/测评，搭配标题党封面吸引点击</span
+                >
+              </a-space>
+            </a-space>
+          </div>
+        </a-col>
+      </a-row>
+
+      <a-row class="grid-demo" :gutter="24">
+        <a-col :span="24">
+          <div class="overall-strategy">
+            <span class="placement-optimization-title">投放策略建议</span>
+            <a-space direction="vertical">
+              <a-space class="placement-optimization-str">
+                <span>
+                  <img :src="topImages[0]" style="width: 25px; height: 17px" />
+                  预算前置在 ROI 最佳时段和平台，优先抢头部流量</span
+                >
+              </a-space>
+              <a-space>
+                <span>
+                  <img :src="topImages[1]" style="width: 25px; height: 17px" />
+                  中等预算组合投放 + 高点击素材A/B测试</span
+                >
+              </a-space>
+              <a-space>
+                <span>
+                  <img :src="topImages[2]" style="width: 25px; height: 17px" />
+                  低预算长周期测试，重点看 CVR，优胜劣汰</span
+                >
+              </a-space>
+            </a-space>
+          </div>
+        </a-col>
+      </a-row>
+    </div>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
+import top1 from '@/assets/img/captcha/top1.svg';
+import top2 from '@/assets/img/captcha/top2.svg';
+import top3 from '@/assets/img/captcha/top3.svg';
+
+const topImages = [top1, top2, top3];
+</script>
+
+<style scoped lang="less"></style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/style.scss b/src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/style.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/property-marketing/put-account/investment-guidelines/components/month-data/index.vue b/src/views/property-marketing/put-account/investment-guidelines/components/month-data/index.vue
new file mode 100644
index 0000000..2100587
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/month-data/index.vue
@@ -0,0 +1,35 @@
+<template>
+  <view>
+    <div class="part-div">
+      <div class="part-div-header">
+        <span class="part-div-header-title">本月摘要</span>
+        <a-popover position="tl">
+          <icon-question-circle />
+          <template #content>
+            <p style="margin: 0">本月摘要。</p>
+          </template>
+        </a-popover>
+      </div>
+      <div class="month-data-div">
+        <div style="align-self: stretch">
+          <span class="month-text-black">总消耗：</span>
+          <span class="month-text-blue">￥52,382.16</span>
+          <span class="month-normal-span">，较上周期</span><span class="month-text-red">↑12.6%</span>
+          <span class="month-normal-span">；<br />整体ROI：</span><span class="month-text-blue">2.84</span>
+          <span class="month-normal-span">，属于</span><span class="month-text-red">中等偏高水平</span>
+          <span class="month-text-black">，较上周期 </span><span class="month-text-red">+0.45</span>
+          <span class="month-normal-span">；<br />主要转化来源：</span><span class="month-text-blue">抖音 46.3%</span>
+          <span class="month-normal-span">，CTR 2.91%；<br />优质素材表现：</span>
+          <span class="month-text-blue">美团酒店爆款横版1号</span>
+          <span class="month-normal-spanw">。CTR 3.47%，CVR 5.92%。</span>
+        </div>
+      </div>
+    </div>
+
+  </view>
+</template>
+
+<script setup lang="ts">
+import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
+</script>
+<style scoped lang="less"></style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/components/month-data/style.scss b/src/views/property-marketing/put-account/investment-guidelines/components/month-data/style.scss
new file mode 100644
index 0000000..e69de29
diff --git 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
new file mode 100644
index 0000000..a688ebc
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/index.vue
@@ -0,0 +1,73 @@
+<template>
+  <view>
+    <div class="part-div">
+      <div class="part-div-header">
+        <span class="part-div-header-title">投放建议优化</span>
+        <a-popover position="tl">
+          <icon-question-circle />
+          <template #content>
+            <p style="margin: 0">投放建议优化。</p>
+          </template>
+        </a-popover>
+      </div>
+
+      <div>
+        <a-row>
+          <a-col :span="24">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">总体策略</span>
+              <span class="placement-optimization-str">本周建议</span>
+            </div>
+          </a-col>
+        </a-row>
+        <a-row class="grid-demo" :gutter="24">
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">预算分配</span>
+              <span class="placement-optimization-str"
+                >巨量ROI高，建议将预算提升至 ￥5,000元/日 <br />
+                聚光 ROAS明显下降，建议减少预算 30%</span
+              >
+            </div>
+          </a-col>
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">时段优化</span>
+              <span class="placement-optimization-str"
+                >过去7日 19:00-21:00 转化率最高，提升了12.6% <br />
+                建议设置定时投放，仅在高效时段曝光</span
+              >
+            </div>
+          </a-col>
+        </a-row>
+        <a-row class="grid-demo" :gutter="24">
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">人群包优化</span>
+              <span class="placement-optimization-str"
+                >18-24岁女性转化率最高，建议加预算 <br />
+                25-34岁男香表现较差，建议停投节省成本</span
+              >
+            </div>
+          </a-col>
+          <a-col :span="12">
+            <div class="overall-strategy">
+              <span class="placement-optimization-title">素材优化</span>
+              <span class="placement-optimization-str"
+                >替换当前点击率下降的xxxxx素材<br />
+                增加同类风格素材：xxxxx素材点击率更高 <br />
+                建议优化元素：视频封面/文案/开头引导，可提升CTR</span
+              >
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+    </div>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
+</script>
+
+<style scoped lang="less"></style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/style.scss b/src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/style.scss
new file mode 100644
index 0000000..e69de29
diff --git 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
new file mode 100644
index 0000000..7959801
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/table-data/guideListHistory.vue
@@ -0,0 +1,117 @@
+<template>
+  <view>
+    <a-table
+      class="account-table"
+      :columns="columns"
+      :data="listResult.data"
+      :filter-icon-align-left="alignLeft"
+      :pagination="false"
+    >
+
+    </a-table>
+  </view>
+</template>
+<script setup lang="ts">
+import top1 from '@/assets/img/captcha/top1.svg';
+import top2 from '@/assets/img/captcha/top2.svg';
+import top3 from '@/assets/img/captcha/top3.svg';
+
+const listQuery = reactive({
+  project_id: ref(''),
+  platform: ref(''),
+  page: ref(1),
+  name: ref(''),
+  page_size: ref('10'),
+});
+const columns = [
+  {
+    title: '生成日期',
+    dataIndex: 'date',
+    slotName: 'account_name',
+    width: 60,
+    minWidth: 60,
+  },
+  {
+    title: '账号',
+    dataIndex: 'account',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    titleSlotName: 'project_name',
+    width: 180,
+    minWidth: 180,
+    title: '项目',
+    dataIndex: 'project_name',
+  },
+  {
+    title: '平台',
+    titleSlotName: 'week_consumption',
+    dataIndex: 'platform',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    title: '操作',
+    dataIndex: 'date',
+    slotName: 'operation',
+    width: 60,
+    minWidth: 60,
+  },
+];
+const listResult = reactive({
+  data: [
+    {
+      date: '日期',
+      account: '账号',
+      project_name: '项目名称',
+      week_consumption: '本周总消耗',
+      week_consumption_rate: 0.1,
+      roi: '2.6',
+      ctr: '3.1%',
+    },
+    {
+      account_name: '全球旅行',
+      platform_name: '平台',
+      project_name: '项目名称',
+      week_consumption: '本周总消耗',
+      week_consumption_rate: -0.1,
+      roi: '2.6',
+      ctr: '3.1%',
+    },
+    {
+      account_name: '全球旅行',
+      platform_name: '平台',
+      project_name: '项目名称',
+      week_consumption: '本周总消耗',
+      week_consumption_rate: -0.1,
+      roi: '2.6',
+      ctr: '3.1%',
+    },
+  ],
+  total: ref(0),
+});
+
+const topImages = [top1, top2, top3];
+</script>
+
+<style scoped lang="less">
+.arco-textarea-wrapper,
+.arco-input-wrapper {
+  border-radius: 4px;
+  border-color: #d7d7d9;
+  background-color: #fff;
+
+  &:focus-within,
+  &.arco-input-focus {
+    background-color: var(--color-bg-2);
+    border-color: rgb(var(--primary-6));
+    box-shadow: 0 0 0 0 var(--color-primary-light-2);
+  }
+
+  &.arco-input-wrapper {
+    height: 35px;
+  }
+}
+
+</style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/components/table-data/listSearchForm.vue b/src/views/property-marketing/put-account/investment-guidelines/components/table-data/listSearchForm.vue
new file mode 100644
index 0000000..4100ba3
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/table-data/listSearchForm.vue
@@ -0,0 +1,98 @@
+<!--表单搜索组件-->
+<template>
+  <view>
+    <a-space size="large" direction="vertical" class="search-form">
+      <a-row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
+        <a-col :span="8">
+          <a-space>
+            <span>账户</span>
+            <a-select :style="{ width: '320px' }" placeholder="全部">
+              <a-option>Beijing</a-option>
+              <a-option>Shanghai</a-option>
+              <a-option>Guangzhou</a-option>
+            </a-select>
+          </a-space>
+        </a-col>
+        <a-col :span="8">
+          <a-space>
+            <span>项目</span>
+            <a-select :style="{ width: '320px' }" placeholder="全部">
+              <a-option>Beijing</a-option>
+              <a-option>Shanghai</a-option>
+              <a-option>Guangzhou</a-option>
+            </a-select>
+          </a-space>
+        </a-col>
+        <a-col :span="8">
+          <a-space>
+            <span>平台</span>
+            <a-select :style="{ width: '320px' }" placeholder="全部">
+              <a-option>Beijing</a-option>
+              <a-option>Shanghai</a-option>
+              <a-option>Guangzhou</a-option>
+            </a-select>
+          </a-space>
+        </a-col>
+      </a-row>
+
+      <a-row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
+        <a-col :span="10">
+          <a-space>
+            <span>时间筛选</span>
+            <a-range-picker
+              showTime
+              :time-picker-props="{
+                defaultValue: ['00:00:00', '00:00:00'],
+              }"
+              @change="onChange"
+              @select="onSelect"
+              style="width: 380px"
+            />
+          </a-space>
+        </a-col>
+        <a-col :span="8">
+          <a-space>
+            <a-button type="outline" @click="handleSearch">
+              <template #icon>
+                <icon-search />
+              </template>
+              <template #default>搜索</template>
+            </a-button>
+            <a-button type="outline" @click="handleSearch">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              <template #default>重置</template>
+            </a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+    </a-space>
+  </view>
+</template>
+
+<script setup lang="ts">
+const handleSearch = () => {
+  console.log('handleSearch');
+};
+</script>
+
+<style scoped lang="scss">
+:deep(.arco-select-view-single),
+:deep(.arco-select-view-multiple),
+:deep(.arco-picker),
+:deep(.arco-input-wrapper) {
+  border-radius: 4px;
+  border-color: #d7d7d9;
+  background-color: #fff;
+  width: 224px;
+  height: 32px;
+
+  &:focus-within,
+  &.arco-input-focus {
+    background-color: var(--color-bg-2);
+    border-color: rgb(var(--primary-6));
+    box-shadow: 0 0 0 0 var(--color-primary-light-2);
+  }
+}
+</style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/components/table-data/placementGuideList.vue b/src/views/property-marketing/put-account/investment-guidelines/components/table-data/placementGuideList.vue
new file mode 100644
index 0000000..4f1708e
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/components/table-data/placementGuideList.vue
@@ -0,0 +1,217 @@
+<template>
+  <view>
+    <a-table
+      class="account-table"
+      :columns="columns"
+      :data="listResult.data"
+      :filter-icon-align-left="alignLeft"
+      :pagination="false"
+    >
+      <template #week_consumption>
+        <a-space>
+          <span>本周总消耗</span>
+          <a-popover position="tl">
+            <icon-question-circle />
+            <template #content>
+              <p>本周总消耗</p>
+            </template>
+          </a-popover>
+        </a-space>
+      </template>
+      <template #weekConsumptionRateTitle>
+        <a-space>
+          <span>本周总消耗环比</span>
+          <a-popover position="tl">
+            <icon-question-circle />
+            <template #content>
+              <p>本周总消耗环比</p>
+            </template>
+          </a-popover>
+        </a-space>
+      </template>
+      <template #roi>
+        <a-space>
+          <span>roi</span>
+          <a-popover position="tl">
+            <icon-question-circle />
+            <template #content>
+              <p>roi</p>
+            </template>
+          </a-popover>
+        </a-space>
+      </template>
+      <template #ctr>
+        <a-space>
+          <span>ctr</span>
+          <a-popover position="tl">
+            <icon-question-circle />
+            <template #content>
+              <p>ctr</p>
+            </template>
+          </a-popover>
+        </a-space>
+      </template>
+
+      <template #weekConsumptionRate="{ record }">
+        <a-statistic
+          style="font-size: 14px !important"
+          :value="record.week_consumption_rate * 100"
+          :value-style="{
+            color: record.week_consumption_rate > 0 ? '#F64B31' : '#25C883',
+            fontStyle: 'normal',
+            fontSize: '14px !important',
+          }"
+        >
+          <template #prefix>
+            <icon-arrow-rise v-if="record.week_consumption_rate > 0" />
+            <icon-arrow-down v-else />
+          </template>
+          <template #suffix>%</template>
+        </a-statistic>
+      </template>
+    </a-table>
+    <div>
+      <a-pagination
+        class="account-page"
+        :total="listResult.total"
+        :size="listQuery.page_size"
+        show-total
+        show-jumper
+        show-page-size
+      />
+    </div>
+  </view>
+</template>
+<script setup lang="ts">
+import top1 from '@/assets/img/captcha/top1.svg';
+import top2 from '@/assets/img/captcha/top2.svg';
+import top3 from '@/assets/img/captcha/top3.svg';
+
+const listQuery = reactive({
+  project_id: ref(''),
+  platform: ref(''),
+  page: ref(1),
+  name: ref(''),
+  page_size: ref('10'),
+});
+const columns = [
+  {
+    title: '账户名称',
+    dataIndex: 'account_name',
+    slotName: 'account_name',
+    width: 60,
+    minWidth: 60,
+  },
+  {
+    titleSlotName: 'project_name',
+    width: 180,
+    minWidth: 180,
+    title: '项目名称',
+    dataIndex: 'project_name',
+  },
+  {
+    title: '平台',
+    dataIndex: 'platform_name',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    title: '本周总消耗',
+    titleSlotName: 'week_consumption',
+    dataIndex: 'week_consumption',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    title: '本周总消耗环比',
+    titleSlotName: 'weekConsumptionRateTitle',
+    dataIndex: 'week_consumption_rate',
+    width: 120,
+    minWidth: 120,
+    slotName: 'weekConsumptionRate',
+  },
+  {
+    title: 'ROI',
+    titleSlotName: 'roi',
+    dataIndex: 'roi',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    title: 'CTR',
+    titleSlotName: 'ctr',
+    dataIndex: 'ctr',
+    width: 120,
+    minWidth: 120,
+  },
+];
+const listResult = reactive({
+  data: [
+    {
+      account_name: '全球旅行',
+      platform_name: '平台',
+      project_name: '项目名称',
+      week_consumption: '本周总消耗',
+      week_consumption_rate: 0.1,
+      roi: '2.6',
+      ctr: '3.1%',
+    },
+    {
+      account_name: '全球旅行',
+      platform_name: '平台',
+      project_name: '项目名称',
+      week_consumption: '本周总消耗',
+      week_consumption_rate: -0.1,
+      roi: '2.6',
+      ctr: '3.1%',
+    },
+    {
+      account_name: '全球旅行',
+      platform_name: '平台',
+      project_name: '项目名称',
+      week_consumption: '本周总消耗',
+      week_consumption_rate: -0.1,
+      roi: '2.6',
+      ctr: '3.1%',
+    },
+  ],
+  total: ref(0),
+});
+
+const topImages = [top1, top2, top3];
+</script>
+
+<style scoped lang="less">
+.arco-textarea-wrapper,
+.arco-input-wrapper {
+  border-radius: 4px;
+  border-color: #d7d7d9;
+  background-color: #fff;
+
+  &:focus-within,
+  &.arco-input-focus {
+    background-color: var(--color-bg-2);
+    border-color: rgb(var(--primary-6));
+    box-shadow: 0 0 0 0 var(--color-primary-light-2);
+  }
+
+  &.arco-input-wrapper {
+    height: 35px;
+  }
+}
+
+//账户列表-分页
+.account-page {
+  padding: 10px 24px 20px 24px;
+  background-color: #fff;
+  float: right;
+}
+
+// 分页器 - 页码下拉菜单样式穿透
+:deep(.arco-select-item),
+:deep(.arco-select-item) {
+  background-color: #fff !important;
+  height: 30px;
+  color: white !important;
+}
+</style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/index.vue b/src/views/property-marketing/put-account/investment-guidelines/index.vue
new file mode 100644
index 0000000..c1cb55c
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/index.vue
@@ -0,0 +1,71 @@
+<template>
+  <view class="placement-guide-style">
+    <div class="part-div">
+      <div>
+        <a-tabs v-model:activeKey="tabData" class="a-tab-class" default-active-key="placement_guide">
+          <a-tab-pane key="placement_guide" title="投放指南"></a-tab-pane>
+          <a-tab-pane key="guide_history">
+            <template #title>历史投放指南</template>
+          </a-tab-pane>
+        </a-tabs>
+      </div>
+      <!--表单组件搜索-->
+      <listSearchForm></listSearchForm>
+      <!--      投放指南-->
+      <PlacementGuideList v-if="tabData == 'placement_guide'"></PlacementGuideList>
+      <!--      历史指南列表-->
+      <GuideListHistory v-if="tabData == 'guide_history'"></GuideListHistory>
+    </div>
+
+    <!--    本月摘要-->
+    <MonthData></MonthData>
+
+    <!--    投放建议-->
+    <PlacementSuggestions></PlacementSuggestions>
+    <ActionGuideDistribution></ActionGuideDistribution>
+    <div>
+      <a-space style="float: right; margin-top: 10px; margin-bottom: 20px">
+        <a-button type="outline" @click="handleSearch">
+          <template #icon>
+            <icon-download />
+          </template>
+          <template #default>下载</template>
+        </a-button>
+        <a-button type="primary" @click="handleSearch">
+          <template #icon>
+            <icon-drive-file />
+          </template>
+          <template #default>保存</template>
+        </a-button>
+      </a-space>
+    </div>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref } from 'vue';
+import top1 from '@/assets/img/captcha/top1.svg';
+import top2 from '@/assets/img/captcha/top2.svg';
+import top3 from '@/assets/img/captcha/top3.svg';
+import '@/views/property-marketing/put-account/investment-guidelines/style.scss';
+import PlacementGuideList from './components/table-data/placementGuideList.vue';
+import listSearchForm from './components/table-data/listSearchForm.vue';
+import GuideListHistory from './components/table-data/guideListHistory.vue';
+import MonthData from './components/month-data/index.vue';
+import PlacementSuggestions from './components/placement-suggestions/index.vue';
+import ActionGuideDistribution from './components/action-guide-distribution';
+
+const tabData = ref('placement_guide');
+
+const listQuery = reactive({
+  project_id: ref(''),
+  platform: ref(''),
+  page: ref(1),
+  name: ref(''),
+  page_size: ref('10'),
+});
+
+const topImages = [top1, top2, top3];
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/property-marketing/put-account/investment-guidelines/style.scss b/src/views/property-marketing/put-account/investment-guidelines/style.scss
new file mode 100644
index 0000000..d392652
--- /dev/null
+++ b/src/views/property-marketing/put-account/investment-guidelines/style.scss
@@ -0,0 +1,196 @@
+.part-div {
+  width: 100%;
+  background: var(--BG-white, white);
+  overflow: hidden;
+  border-radius: 8px;
+  outline: 1px var(--BG-300, #E6E6E8) solid;
+  outline-offset: -1px;
+  flex-direction: column;
+  justify-content: flex-start;
+  display: inline-flex;
+  margin: 10px;
+}
+
+.part-div-header {
+  align-self: stretch;
+  height: 64px;
+  padding: 10px 24px 10px 24px;
+  justify-content: flex-start;
+  align-items: center;
+  display: inline-flex
+}
+
+.a-tab-class {
+  color: var(--Brand-6, #6D4CFE);
+  font-size: 66px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 30px;
+  word-wrap: break-word;
+
+}
+
+//每块div 标题
+.part-div-header-title {
+  justify-content: center;
+  display: flex;
+  flex-direction: column;
+  color: var(--Text-1, #211F24);
+  font-size: 18px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 26px;
+  word-wrap: break-word;
+}
+
+//账户指南-搜索div
+.search-form {
+  padding: 10px 24px 20px 24px;
+
+}
+
+//账户列表-表格
+.account-table {
+  padding: 1px 24px 20px 24px;
+  width: 100%;
+}
+
+
+
+.month-data-body {
+  width: 100%;
+  padding-bottom: 20px;
+  padding-left: 24px;
+  padding-right: 24px;
+  background: var(--BG-white, white);
+  overflow: hidden;
+  border-radius: 8px;
+  outline: 1px var(--BG-300, #E6E6E8) solid;
+  outline-offset: -1px;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  display: inline-flex;
+  margin: 10px;
+}
+
+//本周摘要div
+.month-body-div {
+  align-self: stretch;
+  height: 64px;
+  padding-top: 10px;
+  padding-bottom: 10px;
+  justify-content: space-between;
+  align-items: center;
+  display: inline-flex
+}
+
+//本月摘要标题
+.month-data-title {
+  justify-content: center;
+  display: flex;
+  flex-direction: column;
+  color: var(--Text-1, #211F24);
+  font-size: 18px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 26px;
+  word-wrap: break-word
+}
+
+//本月摘要-蓝色字体
+.month-text-blue {
+  color: var(--Brand-Brand-6, #6D4CFE);
+  font-size: 16px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 24px;
+  word-wrap: break-word
+}
+
+//红色字体
+.month-text-red {
+  color: var(--Functional-Danger-6, #F64B31);
+  font-size: 16px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 24px;
+  word-wrap: break-word
+}
+
+//黑色字体
+.month-text-black {
+  color: var(--Text-1, #211F24);
+  font-size: 16px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 24px;
+  word-wrap: break-word
+}
+
+//本月摘要数据-div
+.month-data-div {
+  align-self: stretch;
+  padding: 16px 30px 16px 16px;
+  margin-left: 20px;
+  margin-right: 20px;
+  margin-bottom: 20px;
+  background: var(--Brand-Brand-1, #F0EDFF);
+  overflow: hidden;
+  border-radius: 8px;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: flex-start;
+  gap: 12px;
+  display: flex;
+}
+
+//投放建议-总体策略
+.overall-strategy {
+  width: 100%;
+  height: 40%;
+  padding: 20px 24px 20px 16px;
+  background: var(--BG-100, #F7F8FA);
+  overflow: hidden;
+  border-radius: 8px;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: flex-start;
+  gap: 12px;
+  display: inline-flex;
+  margin: 10px 0px 15px 20px;
+
+}
+
+//投放优化每块div小标题
+.placement-optimization-title {
+  // 总体策略
+  color: var(--Text-1, #211F24);
+  font-size: 16px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 22px;
+  word-wrap: break-word
+}
+
+.placement-optimization-str {
+  align-self: stretch;
+  color: var(--Text-2, #3C4043);
+  font-size: 14px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 22px;
+  word-wrap: break-word
+}
+
+//表现分析标题
+.player-title {
+  margin: 10px 0px 15px 20px;
+  // 表现分析
+  color: var(--Text-1, #211F24);
+  font-size: 16px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 22px;
+  word-wrap: break-word
+}
diff --git a/src/views/property-marketing/put-account/investmentGuidelines.less b/src/views/property-marketing/put-account/investmentGuidelines.less
deleted file mode 100644
index fd746cf..0000000
--- a/src/views/property-marketing/put-account/investmentGuidelines.less
+++ /dev/null
@@ -1,198 +0,0 @@
-.placement-guide-style {
-  //每块div布局
-  .part-div {
-    width: 100%;
-    background: var(--BG-white, white);
-    overflow: hidden;
-    border-radius: 8px;
-    outline: 1px var(--BG-300, #E6E6E8) solid;
-    outline-offset: -1px;
-    flex-direction: column;
-    justify-content: flex-start;
-    display: inline-flex;
-    margin: 10px;
-  }
-
-  //每块div 头部
-  .part-div-header {
-    align-self: stretch;
-    height: 64px;
-    padding: 10px 24px 10px 24px;
-    justify-content: flex-start;
-    align-items: center;
-    display: inline-flex
-  }
-
-  //每块div 标题
-  .part-div-header-title {
-    justify-content: center;
-    display: flex;
-    flex-direction: column;
-    color: var(--Text-1, #211F24);
-    font-size: 18px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 26px;
-    word-wrap: break-word;
-  }
-
-  //账户指南-搜索div
-  .search-form {
-    padding: 10px 24px 20px 24px;
-
-  }
-
-  //账户列表-表格
-  .account-table {
-    padding: 1px 24px 20px 24px;
-    width: 100%;
-  }
-
-  //账户列表-分页
-  .account-page {
-    padding: 10px 24px 20px 24px;
-    border: 1px;
-    border-color: red;
-    float: right;
-
-  }
-
-  .month-data-body {
-    width: 100%;
-    padding-bottom: 20px;
-    padding-left: 24px;
-    padding-right: 24px;
-    background: var(--BG-white, white);
-    overflow: hidden;
-    border-radius: 8px;
-    outline: 1px var(--BG-300, #E6E6E8) solid;
-    outline-offset: -1px;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: center;
-    display: inline-flex;
-    margin: 10px;
-  }
-
-  //本周摘要div
-  .month-body-div {
-    align-self: stretch;
-    height: 64px;
-    padding-top: 10px;
-    padding-bottom: 10px;
-    justify-content: space-between;
-    align-items: center;
-    display: inline-flex
-  }
-
-  //本月摘要标题
-  .month-data-title {
-    justify-content: center;
-    display: flex;
-    flex-direction: column;
-    color: var(--Text-1, #211F24);
-    font-size: 18px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 26px;
-    word-wrap: break-word
-  }
-
-  //本月摘要-蓝色字体
-  .month-text-blue {
-    color: var(--Brand-Brand-6, #6D4CFE);
-    font-size: 16px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 24px;
-    word-wrap: break-word
-  }
-
-  //红色字体
-  .month-text-red {
-    color: var(--Functional-Danger-6, #F64B31);
-    font-size: 16px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 24px;
-    word-wrap: break-word
-  }
-
-  //黑色字体
-  .month-text-black {
-    color: var(--Text-1, #211F24);
-    font-size: 16px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 24px;
-    word-wrap: break-word
-  }
-
-  //本月摘要数据-div
-  .month-data-div {
-    align-self: stretch;
-    padding: 16px 30px 16px 16px;
-    margin-left: 20px;
-    margin-right: 20px;
-    margin-bottom: 20px;
-    background: var(--Brand-Brand-1, #F0EDFF);
-    overflow: hidden;
-    border-radius: 8px;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: flex-start;
-    gap: 12px;
-    display: flex;
-  }
-
-  //投放建议-总体策略
-  .overall-strategy {
-    width: 100%;
-    height: 40%;
-    padding: 20px 24px 20px 16px;
-    background: var(--BG-100, #F7F8FA);
-    overflow: hidden;
-    border-radius: 8px;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: flex-start;
-    gap: 12px;
-    display: inline-flex;
-    margin: 10px 0px 15px 20px;
-
-  }
-
-  //投放优化每块div小标题
-  .placement-optimization-title {
-    // 总体策略
-    color: var(--Text-1, #211F24);
-    font-size: 16px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 22px;
-    word-wrap: break-word
-  }
-
-  .placement-optimization-str {
-    align-self: stretch;
-    color: var(--Text-2, #3C4043);
-    font-size: 14px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 22px;
-    word-wrap: break-word
-  }
-
-  //表现分析标题
-  .player-title {
-    margin: 10px 0px 15px 20px;
-    // 表现分析
-    color: var(--Text-1, #211F24);
-    font-size: 16px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 400;
-    line-height: 22px;
-    word-wrap: break-word
-  }
-
-}
diff --git a/src/views/property-marketing/put-account/investmentGuidelines.vue b/src/views/property-marketing/put-account/investmentGuidelines.vue
deleted file mode 100644
index 9e98c59..0000000
--- a/src/views/property-marketing/put-account/investmentGuidelines.vue
+++ /dev/null
@@ -1,560 +0,0 @@
-<template>
-  <view class="placement-guide-style">
-    <div class="part-div">
-      <div class="part-div-header">
-        <span class="part-div-header-title">投放指南</span>
-      </div>
-
-      <a-space size="large" class="search-form">
-        <a-space>
-          <span>账户</span>
-          <a-select :style="{ width: '320px' }" placeholder="全部">
-            <a-option>Beijing</a-option>
-            <a-option>Shanghai</a-option>
-            <a-option>Guangzhou</a-option>
-          </a-select>
-        </a-space>
-        <a-space>
-          <span>项目</span>
-          <a-select :style="{ width: '320px' }" placeholder="全部">
-            <a-option>Beijing</a-option>
-            <a-option>Shanghai</a-option>
-            <a-option>Guangzhou</a-option>
-          </a-select>
-        </a-space>
-        <a-space>
-          <span>平台</span>
-          <a-select :style="{ width: '320px' }" placeholder="全部">
-            <a-option>Beijing</a-option>
-            <a-option>Shanghai</a-option>
-            <a-option>Guangzhou</a-option>
-          </a-select>
-        </a-space>
-        <a-space>
-          <a-button type="outline" class="search-btn" @click="handleSearch">
-            <template #icon>
-              <icon-search />
-            </template>
-            <template #default>搜索</template>
-          </a-button>
-          <a-button type="outline" class="reset-btn" @click="handleSearch">
-            <template #icon>
-              <icon-refresh />
-            </template>
-            <template #default>重置</template>
-          </a-button>
-        </a-space>
-      </a-space>
-    </div>
-
-    <div class="part-div">
-      <div class="part-div-header">
-        <span class="part-div-header-title">账户列表</span>
-      </div>
-
-      <a-table
-        class="account-table"
-        :columns="columns"
-        :data="listResult.data"
-        :filter-icon-align-left="alignLeft"
-        @change="handleChange"
-        :pagination="false"
-      >
-        <template #week_consumption>
-          <a-space>
-            <span>本周总消耗</span>
-            <a-popover position="tl">
-              <icon-question-circle />
-              <template #content>
-                <p>本周总消耗</p>
-              </template>
-            </a-popover>
-          </a-space>
-        </template>
-        <template #weekConsumptionRateTitle>
-          <a-space>
-            <span>本周总消耗环比</span>
-            <a-popover position="tl">
-              <icon-question-circle />
-              <template #content>
-                <p>本周总消耗环比</p>
-              </template>
-            </a-popover>
-          </a-space>
-        </template>
-        <template #roi>
-          <a-space>
-            <span>roi</span>
-            <a-popover position="tl">
-              <icon-question-circle />
-              <template #content>
-                <p>roi</p>
-              </template>
-            </a-popover>
-          </a-space>
-        </template>
-        <template #ctr>
-          <a-space>
-            <span>ctr</span>
-            <a-popover position="tl">
-              <icon-question-circle />
-              <template #content>
-                <p>ctr</p>
-              </template>
-            </a-popover>
-          </a-space>
-        </template>
-
-        <template #weekConsumptionRate="{ record }">
-          <a-statistic
-            style="font-size: 15px"
-            v-if="record.week_consumption_rate > 0"
-            :value="record.week_consumption_rate * 100"
-            :value-style="{ color: '#F64B31' }"
-          >
-            <template #prefix>
-              <icon-arrow-rise />
-            </template>
-            <template #suffix>%</template>
-          </a-statistic>
-          <a-statistic
-            v-else
-            style="font-size: 14px"
-            :value="record.week_consumption_rate * 100"
-            :value-style="{ color: '#25C883' }"
-          >
-            <template #prefix>
-              <icon-arrow-down />
-            </template>
-            <template #suffix>%</template>
-          </a-statistic>
-        </template>
-      </a-table>
-      <!-- 分页 -->
-      <div>
-        <a-pagination
-          class="account-page"
-          :total="listResult.total"
-          :size="listQuery.page_size"
-          show-total
-          show-jumper
-          show-page-size
-        />
-      </div>
-    </div>
-    <div class="part-div">
-      <div class="part-div-header">
-        <span class="part-div-header-title">本月摘要</span>
-        <a-popover position="tl">
-          <icon-question-circle />
-          <template #content>
-            <p style="margin: 0">本月摘要。</p>
-          </template>
-        </a-popover>
-      </div>
-      <div class="month-data-div">
-        <div style="align-self: stretch">
-          <span class="month-text-black">总消耗：</span>
-          <span class="month-text-blue">￥52,382.16</span>
-          <span class="month-normal-span">，较上周期</span><span class="month-text-red">↑12.6%</span>
-          <span class="month-normal-span">；<br />整体ROI：</span><span class="month-text-blue">2.84</span>
-          <span class="month-normal-span">，属于</span><span class="month-text-red">中等偏高水平</span>
-          <span class="month-text-black">，较上周期 </span><span class="month-text-red">+0.45</span>
-          <span class="month-normal-span">；<br />主要转化来源：</span><span class="month-text-blue">抖音 46.3%</span>
-          <span class="month-normal-span">，CTR 2.91%；<br />优质素材表现：</span>
-          <span class="month-text-blue">美团酒店爆款横版1号</span>
-          <span class="month-normal-spanw">。CTR 3.47%，CVR 5.92%。</span>
-        </div>
-      </div>
-    </div>
-
-    <div class="part-div">
-      <div class="part-div-header">
-        <span class="part-div-header-title">投放建议优化</span>
-        <a-popover position="tl">
-          <icon-question-circle />
-          <template #content>
-            <p style="margin: 0">投放建议优化。</p>
-          </template>
-        </a-popover>
-      </div>
-
-      <div>
-        <a-row>
-          <a-col :span="24">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">总体策略</span>
-              <span class="placement-optimization-str">本周建议</span>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row class="grid-demo" :gutter="24">
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">预算分配</span>
-              <span class="placement-optimization-str"
-                >巨量ROI高，建议将预算提升至 ￥5,000元/日 <br />
-                聚光 ROAS明显下降，建议减少预算 30%</span
-              >
-            </div>
-          </a-col>
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">时段优化</span>
-              <span class="placement-optimization-str"
-                >过去7日 19:00-21:00 转化率最高，提升了12.6% <br />
-                建议设置定时投放，仅在高效时段曝光</span
-              >
-            </div>
-          </a-col>
-        </a-row>
-        <a-row class="grid-demo" :gutter="24">
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">人群包优化</span>
-              <span class="placement-optimization-str"
-                >18-24岁女性转化率最高，建议加预算 <br />
-                25-34岁男香表现较差，建议停投节省成本</span
-              >
-            </div>
-          </a-col>
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">素材优化</span>
-              <span class="placement-optimization-str"
-                >替换当前点击率下降的xxxxx素材<br />
-                增加同类风格素材：xxxxx素材点击率更高 <br />
-                建议优化元素：视频封面/文案/开头引导，可提升CTR</span
-              >
-            </div>
-          </a-col>
-        </a-row>
-      </div>
-    </div>
-
-    <div class="part-div">
-      <div class="part-div-header">
-        <span class="part-div-header-title">投放行动指南</span>
-        <a-popover position="tl">
-          <icon-question-circle />
-          <template #content>
-            <p style="margin: 0">投放建议优化。</p>
-          </template>
-        </a-popover>
-      </div>
-      <a-space>
-        <span class="player-title">表现分析</span>
-        <a-popover position="tl">
-          <icon-question-circle />
-          <template #content>
-            <p style="margin: 0">表现分析。</p>
-          </template>
-        </a-popover>
-      </a-space>
-      <div>
-        <a-row class="grid-demo" :gutter="24">
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">人群分析</span>
-              <a-space direction="vertical">
-                <a-space class="placement-optimization-str">
-                  <span>
-                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                    18-24岁女性，兴趣为“美妆/穿搭”，一线城市，抖音平台 ROI 3.2</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                    25-34岁男性，兴趣为“数码产品”，二线城市，巨量引擎 ROI 2.8</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                    18-24岁男性，兴趣为“运动/健身”，三线城市，抖音 ROI 2.3</span
-                  >
-                </a-space>
-              </a-space>
-            </div>
-          </a-col>
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">投放素材</span>
-              <a-space direction="vertical">
-                <a-space class="placement-optimization-str">
-                  <span>
-                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                    图文风格 + 明确福利点，CTR 3.2%、CVR 8.5%</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                    场景短视频 + 明确人设定位，CTR 2.7%、CVR 7.1%</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                    口播讲解类 + 产品对比，CTR 2.1%、CVR 6.0%</span
-                  >
-                </a-space>
-              </a-space>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row class="grid-demo" :gutter="24">
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">投放时段</span>
-              <a-space direction="vertical">
-                <a-space class="placement-optimization-str">
-                  <span>
-                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                    晚高峰时段（19:00–21:00），ROI 3.1</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                    中午时段（11:30–13:00），ROI 2.5</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                    下午茶时段（15:00–17:00），ROI 2.3</span
-                  >
-                </a-space>
-              </a-space>
-            </div>
-          </a-col>
-
-          <a-col :span="12">
-            <div class="overall-strategy">
-              <span class="placement-optimization-title">平台表现</span>
-              <a-space direction="vertical">
-                <a-space class="placement-optimization-str">
-                  <span>
-                    <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                    抖音 - ROI 3.2，CVR 8.5%</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                    聚光平台 - ROI 2.7，CVR 7.3%</span
-                  >
-                </a-space>
-                <a-space>
-                  <span>
-                    <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                    B站 - ROI 2.4，CVR 6.8%</span
-                  >
-                </a-space>
-              </a-space>
-            </div>
-          </a-col>
-        </a-row>
-      </div>
-      <a-space>
-        <span class="player-title">新投放建议生成</span>
-        <a-popover position="tl">
-          <icon-question-circle />
-          <template #content>
-            <p style="margin: 0">新投放建议生成。</p>
-          </template>
-        </a-popover>
-      </a-space>
-      <a-row class="grid-demo" :gutter="24">
-        <a-col :span="24">
-          <div class="overall-strategy">
-            <span class="placement-optimization-title">人群建议</span>
-            <a-space direction="vertical">
-              <a-space class="placement-optimization-str">
-                <span>
-                  <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                  集中在 18–24 岁女性 + 精准兴趣标签（如“护肤”、“口红”）</span
-                >
-              </a-space>
-              <a-space>
-                <span>
-                  <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                  24–30 岁男性 + 实用类内容受众（如“工具控”、“搞机党”）</span
-                >
-              </a-space>
-              <a-space>
-                <span>
-                  <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                  泛娱乐向受众 + 较大地域分布（兴趣“短剧”、“直播带货”）</span
-                >
-              </a-space>
-            </a-space>
-          </div>
-        </a-col>
-      </a-row>
-      <a-row class="grid-demo" :gutter="24">
-        <a-col :span="24">
-          <div class="overall-strategy">
-            <span class="placement-optimization-title">素材建议</span>
-            <a-space direction="vertical">
-              <a-space class="placement-optimization-str">
-                <span>
-                  <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                  福利明确+钩子强的图文短视频，建议加限时优惠提示</span
-                >
-              </a-space>
-              <a-space>
-                <span>
-                  <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                  场景代入型视频，突出客户痛点与产品关联</span
-                >
-              </a-space>
-              <a-space>
-                <span>
-                  <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                  达人口播/测评，搭配标题党封面吸引点击</span
-                >
-              </a-space>
-            </a-space>
-          </div>
-        </a-col>
-      </a-row>
-
-      <a-row class="grid-demo" :gutter="24">
-        <a-col :span="24">
-          <div class="overall-strategy">
-            <span class="placement-optimization-title">投放策略建议</span>
-            <a-space direction="vertical">
-              <a-space class="placement-optimization-str">
-                <span>
-                  <img :src="topImages[0]" style="width: 25px; height: 17px" />
-                  预算前置在 ROI 最佳时段和平台，优先抢头部流量</span
-                >
-              </a-space>
-              <a-space>
-                <span>
-                  <img :src="topImages[1]" style="width: 25px; height: 17px" />
-                  中等预算组合投放 + 高点击素材A/B测试</span
-                >
-              </a-space>
-              <a-space>
-                <span>
-                  <img :src="topImages[2]" style="width: 25px; height: 17px" />
-                  低预算长周期测试，重点看 CVR，优胜劣汰</span
-                >
-              </a-space>
-            </a-space>
-          </div>
-        </a-col>
-      </a-row>
-    </div>
-  </view>
-</template>
-
-<script setup lang="ts">
-import { reactive, ref } from 'vue';
-import { IconDelete, IconQuestionCircle } from '@arco-design/web-vue/es/icon';
-import top1 from '@/assets/img/captcha/top1.svg';
-import top2 from '@/assets/img/captcha/top2.svg';
-import top3 from '@/assets/img/captcha/top3.svg';
-import '@/views/property-marketing/put-account/investmentGuidelines.less';
-
-const columns = [
-  {
-    title: '账户名称',
-    dataIndex: 'account_name',
-    slotName: 'account_name',
-    width: 60,
-    minWidth: 60,
-  },
-  {
-    title: '平台',
-    dataIndex: 'platform_name',
-    width: 120,
-    minWidth: 120,
-  },
-  {
-    titleSlotName: 'project_name',
-    width: 180,
-    minWidth: 180,
-    title: '项目名称',
-    dataIndex: 'project_name',
-  },
-  {
-    title: '本周总消耗',
-    titleSlotName: 'week_consumption',
-    dataIndex: 'week_consumption',
-    width: 120,
-    minWidth: 120,
-  },
-  {
-    title: '本周总消耗环比',
-    titleSlotName: 'weekConsumptionRateTitle',
-    dataIndex: 'week_consumption_rate',
-    width: 120,
-    minWidth: 120,
-    slotName: 'weekConsumptionRate',
-  },
-  {
-    title: 'ROI',
-    titleSlotName: 'roi',
-    dataIndex: 'roi',
-    width: 120,
-    minWidth: 120,
-  },
-  {
-    title: 'CTR',
-    titleSlotName: 'ctr',
-    dataIndex: 'ctr',
-    width: 120,
-    minWidth: 120,
-  },
-];
-
-const listQuery = reactive({
-  project_id: ref(''),
-  platform: ref(''),
-  page: ref(1),
-  name: ref(''),
-  page_size: ref('10'),
-});
-
-const listResult = reactive({
-  data: [
-    {
-      account_name: '全球旅行',
-      platform_name: '平台',
-      project_name: '项目名称',
-      week_consumption: '本周总消耗',
-      week_consumption_rate: 0.1,
-      roi: '2.6',
-      ctr: '3.1%',
-    },
-    {
-      account_name: '全球旅行',
-      platform_name: '平台',
-      project_name: '项目名称',
-      week_consumption: '本周总消耗',
-      week_consumption_rate: -0.1,
-      roi: '2.6',
-      ctr: '3.1%',
-    },
-    {
-      account_name: '全球旅行',
-      platform_name: '平台',
-      project_name: '项目名称',
-      week_consumption: '本周总消耗',
-      week_consumption_rate: -0.1,
-      roi: '2.6',
-      ctr: '3.1%',
-    },
-  ],
-  total: ref(0),
-});
-
-const topImages = [top1, top2, top3];
-</script>
-
-<style lang="less" scoped></style>