feat: 新增账户仪表盘组件和优化投放指南操作功能

src/views/property-marketing/put-account/investment-guidelines/components/month-data/index.vue

@@ -25,11 +25,11 @@
         </div>
       </div>
     </div>
-
   </view>
 </template>
 
 <script setup lang="ts">
 import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
+import './style.scss';
 </script>
 <style scoped lang="less"></style>

src/views/property-marketing/put-account/investment-guidelines/components/month-data/style.scss

@@ -0,0 +1,46 @@
+//本月摘要数据-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;
+}
+
+//本月摘要-蓝色字体
+.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
+}

src/views/property-marketing/put-account/investment-guidelines/components/placement-suggestions/index.vue

@@ -12,7 +12,7 @@
       </div>
 
       <div>
-        <a-row>
+        <a-row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
           <a-col :span="24">
             <div class="overall-strategy">
               <span class="placement-optimization-title">总体策略</span>
@@ -20,7 +20,7 @@
             </div>
           </a-col>
         </a-row>
-        <a-row class="grid-demo" :gutter="24">
+        <a-row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
           <a-col :span="12">
             <div class="overall-strategy">
               <span class="placement-optimization-title">预算分配</span>
@@ -40,7 +40,7 @@
             </div>
           </a-col>
         </a-row>
-        <a-row class="grid-demo" :gutter="24">
+        <a-row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
           <a-col :span="12">
             <div class="overall-strategy">
               <span class="placement-optimization-title">人群包优化</span>

src/views/property-marketing/put-account/investment-guidelines/components/table-data/guideListHistory.vue

@@ -7,7 +7,25 @@
       :filter-icon-align-left="alignLeft"
       :pagination="false"
     >
-
+      <template #operation="{ record }">
+        <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" class="operation-btn">下载</a-button>
+            <a-button type="outline" class="operation-btn">详情</a-button>
+          </a-space>
+        </a-space>
+      </template>
     </a-table>
   </view>
 </template>
@@ -15,6 +33,7 @@
 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 { IconDelete } from '@arco-design/web-vue/es/icon';
 
 const listQuery = reactive({
   project_id: ref(''),
@@ -53,7 +72,7 @@ const columns = [
   },
   {
     title: '操作',
-    dataIndex: 'date',
+    dataIndex: 'operation',
     slotName: 'operation',
     width: 60,
     minWidth: 60,
@@ -114,4 +133,13 @@ const topImages = [top1, top2, top3];
   }
 }
 
+.operation-btn {
+  // 下载
+  color: var(--Brand-6, #6d4cfe);
+  font-size: 14px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 22px;
+  word-wrap: break-word;
+}
 </style>

src/views/property-marketing/put-account/investment-guidelines/components/table-data/listSearchForm.vue

@@ -52,13 +52,13 @@
         </a-col>
         <a-col :span="8">
           <a-space>
-            <a-button type="outline" @click="handleSearch">
+            <a-button type="outline" class="search-btn" @click="handleSearch">
               <template #icon>
                 <icon-search />
               </template>
               <template #default>搜索</template>
             </a-button>
-            <a-button type="outline" @click="handleSearch">
+            <a-button type="outline" class="reset-btn" @click="handleSearch">
               <template #icon>
                 <icon-refresh />
               </template>
@@ -95,4 +95,28 @@ const handleSearch = () => {
     box-shadow: 0 0 0 0 var(--color-primary-light-2);
   }
 }
+
+.search-btn {
+  // 搜索
+  color: var(--Brand-6, #6d4cfe);
+  font-size: 14px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 22px;
+  height: 32px;
+  border-radius: 3px;
+  word-wrap: break-word;
+}
+
+.reset-btn {
+  // 重置
+  color: var(--Text-2, #3c4043);
+  font-size: 14px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 22px;
+  height: 32px;
+  border-radius: 3px;
+  word-wrap: break-word;
+}
 </style>