renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 组件库替换

Browse Source
This commit is contained in:
rd
2025-09-05 16:41:50 +08:00
parent f6b91fce4f
commit 3451546280
61 changed files with 549 additions and 548 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/views/property-marketing/put-account/investment-guidelines/components/action-guide-distribution/index.vue
View File

@ -3,25 +3,19 @@
<div class="part-div">
<div class="part-div-header">
<span class="part-div-header-title">投放行动指南</span>
<a-popover position="tl">
<Tooltip position="tl" title="投放建议优化。">
<icon-question-circle />
<template #content>
<p>投放建议优化。</p>
</template>
</a-popover>
</Tooltip>
</div>
<Space>
<span class="player-title">表现分析</span>
<a-popover position="tl">
<Tooltip position="tl" title="表现分析。">
<icon-question-circle />
<template #content>
<p>表现分析。</p>
</template>
</a-popover>
</Tooltip>
</Space>
<div style="margin-right: 24px">
<a-row :gutter="24">
<a-col :span="12">
<Row :gutter="24">
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title">人群分析</span>
<Space direction="vertical">
@ -34,8 +28,8 @@
</Space>
</Space>
</div>
</a-col>
<a-col :span="12">
</Col>
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title">投放素材</span>
<Space direction="vertical">
@ -48,10 +42,10 @@
</Space>
</Space>
</div>
</a-col>
</a-row>
<a-row class="grid-demo" :gutter="24">
<a-col :span="12">
</Col>
</Row>
<Row class="grid-demo" :gutter="24">
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title">投放时段</span>
<Space direction="vertical">
@ -64,9 +58,9 @@
</Space>
</Space>
</div>
</a-col>
</Col>
<a-col :span="12">
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title">平台表现</span>
<Space direction="vertical">
@ -79,20 +73,17 @@
</Space>
</Space>
</div>
</a-col>
</a-row>
</Col>
</Row>
</div>
<Space>
<span class="player-title">新投放建议生成</span>
<a-popover position="tl">
<Tooltip position="tl" title="新投放建议生成。">
<icon-question-circle />
<template #content>
<p style="margin: 0">新投放建议生成。</p>
</template>
</a-popover>
</Tooltip>
</Space>
<a-row class="grid-demo" :gutter="24">
<a-col :span="24">
<Row class="grid-demo" :gutter="24">
<Col :span="24">
<div class="overall-strategy">
<span class="placement-optimization-title">人群建议</span>
<Space direction="vertical">
@ -105,10 +96,10 @@
</Space>
</Space>
</div>
</a-col>
</a-row>
<a-row class="grid-demo" :gutter="24">
<a-col :span="24">
</Col>
</Row>
<Row class="grid-demo" :gutter="24">
<Col :span="24">
<div class="overall-strategy">
<span class="placement-optimization-title">素材建议</span>
<Space direction="vertical">
@ -121,11 +112,11 @@
</Space>
</Space>
</div>
</a-col>
</a-row>
</Col>
</Row>
<a-row class="grid-demo" :gutter="24">
<a-col :span="24">
<Row class="grid-demo" :gutter="24">
<Col :span="24">
<div class="overall-strategy">
<span class="placement-optimization-title">投放策略建议</span>
<Space direction="vertical">
@ -138,14 +129,14 @@
</Space>
</Space>
</div>
</a-col>
</a-row>
</Col>
</Row>
</div>
</view>
</template>
<script setup lang="ts">
import { Space } from "ant-design-vue"
import { Space, Tooltip, Row, Col } from "ant-design-vue"
import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
const props = defineProps({

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

@ -2,12 +2,9 @@
<div class="part-div">
<div class="part-div-header">
<span class="part-div-header-title">总体摘要</span>
<a-popover position="tl">
<Tooltip position="tl" title="于筛选出来的投流账户/计划的情况生成的总体描述。">
<icon-question-circle />
<template #content>
<p style="margin: 0">基于筛选出来的投流账户/计划的情况生成的总体描述。</p>
</template>
</a-popover>
</Tooltip>
<span @click="copyData" class="copybtn">
<icon-copy :style="{ fontSize: '14px' }" />
复制
@ -29,7 +26,7 @@
<script setup lang="ts">
import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
import { defineProps } from 'vue';
import { Space, message } from "ant-design-vue"
import { Space, message, Tooltip } from "ant-design-vue"
const props = defineProps({
overview: {

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

@ -2,97 +2,80 @@
<div class="part-div">
<div class="part-div-header">
<span class="part-div-header-title">投放建议优化</span>
<a-popover position="tl">
<Tooltip position="tl" title="基于筛选出来的投流账户/计划的情况生成的优化建议。">
<icon-question-circle />
<template #content>
<p style="margin: 0">基于筛选出来的投流账户/计划的情况生成的优化建议。</p>
</template>
</a-popover>
</Tooltip>
</div>
<NoData v-if="isEmptyData" style="height: 100px" text="暂无数据" />
<div v-else>
<a-row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
<a-col :span="24">
<Row class="grid-demo" :gutter="{ md: 8, lg: 24, xl: 32 }">
<Col :span="24">
<div class="overall-strategy">
<span class="placement-optimization-title"
>总体策略
<a-popover position="tl">
<Tooltip position="tl" title="优化建议的整体调整概述。">
<icon-question-circle />
<template #content>
<p style="margin: 0">优化建议的整体调整概述。</p>
</template>
</a-popover>
</Tooltip>
</span>
<span class="placement-optimization-str">{{ props.optimization?.[0]?.['content'] }}</span>
</div>
</a-col>
</a-row>
<a-row class="grid-demo" style="margin-right: 10px" :gutter="{ md: 8, lg: 24, xl: 32 }">
<a-col :span="12">
</Col>
</Row>
<Row class="grid-demo" style="margin-right: 10px" :gutter="{ md: 8, lg: 24, xl: 32 }">
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title"
>预算分配
<a-popover position="tl">
<Tooltip position="tl" title="优化建议在预算分配部分的详细描述。">
<icon-question-circle />
<template #content>
<p style="margin: 0">优化建议在预算分配部分的详细描述。</p>
</template>
</a-popover>
</Tooltip>
</span>
<span class="placement-optimization-str">{{ props.optimization?.[1]?.['content'] }}</span>
</div>
</a-col>
<a-col :span="12">
</Col>
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title"
>时段优化
<a-popover position="tl">
<Tooltip position="tl" title="优化建议在时段优化部分的详细描述。">
<icon-question-circle />
<template #content>
<p style="margin: 0">优化建议在时段优化部分的详细描述。</p>
</template>
</a-popover>
</Tooltip>
</span>
<span class="placement-optimization-str">{{ props.optimization?.[2]?.['content'] }}</span>
</div>
</a-col>
</a-row>
<a-row class="grid-demo" style="margin-right: 10px" :gutter="{ md: 8, lg: 24, xl: 32 }">
<a-col :span="12">
</Col>
</Row>
<Row class="grid-demo" style="margin-right: 10px" :gutter="{ md: 8, lg: 24, xl: 32 }">
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title"
>人群包优化
<a-popover position="tl">
<Tooltip position="tl" title="优化建议在人群包优化部分的详细描述。">
<icon-question-circle />
<template #content>
<p style="margin: 0">优化建议在人群包优化部分的详细描述。</p>
</template>
</a-popover>
</Tooltip>
</span>
<span class="placement-optimization-str">{{ props?.optimization?.[3]?.['content'] }}</span>
</div>
</a-col>
<a-col :span="12">
</Col>
<Col :span="12">
<div class="overall-strategy">
<span class="placement-optimization-title"
>素材优化
<a-popover position="tl">
<Tooltip position="tl" title="优化建议在素材优化部分的详细描述。">
<icon-question-circle />
<template #content>
<p style="margin: 0">优化建议在素材优化部分的详细描述。</p>
</template>
</a-popover>
</Tooltip>
</span>
<span class="placement-optimization-str">{{ props?.optimization?.[4]?.['content'] }}</span>
</div>
</a-col>
</a-row>
</Col>
</Row>
</div>
</div>
</template>
<script setup lang="ts">
import { Tooltip, Row, Col } from "ant-design-vue"
import { defineProps } from 'vue';
const props = defineProps({

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

@ -42,15 +42,14 @@
<template #customRender="{ record }">
<Space>
<Space>
<a-popconfirm
content="确定删除吗?"
type="warning"
ok-text="确认删除"
cancel-text="取消"
@ok="deleteData(record.id)"
<Popconfirm
title="确定删除吗?"
okText="确认删除"
cancelText="取消"
@confirm="deleteData(record.id)"
>
<icon-delete></icon-delete>
</a-popconfirm>
</Popconfirm>
</Space>
<Space>
<Button type="primary" ghost @click="downLoad(record.file_url)" class="operation-btn">下载</Button>
@ -63,7 +62,7 @@
</view>
</template>
<script setup lang="ts">
import { Button, Space, Table, message } from 'ant-design-vue';
import { Button, Space, Table, message, Popconfirm } from 'ant-design-vue';
import { IconDelete } from '@arco-design/web-vue/es/icon';
import { PLATFORM_LIST } from '@/utils/platform';
@ -122,4 +121,7 @@ const props = defineProps({
line-height: 22px;
word-wrap: break-word;
}
:deep(.ant-popconfirm-buttons) {
display: flex;
}
</style>

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

@ -1,6 +1,6 @@
<!--表单搜索组件-->
<template>
<div class="container px-24px">
<div class="container px-24px pt-24px">
<div class="filter-row flex mb-20px">
<div class="filter-row-item flex items-center">
<span class="label">账户名称</span>
@ -25,7 +25,7 @@
<div class="filter-row flex mb-20px">
<div class="filter-row-item flex items-center">
<span class="label">时间筛选</span>
<a-range-picker v-model="query.data_time" size="medium" allow-clear format="YYYY-MM-DD" class="w-310" />
<DatePicker.RangePicker v-model:value="query.data_time" size="medium" allowClear format="YYYY-MM-DD" class="w-310" />
</div>
<div class="filter-row-item flex items-center">
@ -48,7 +48,7 @@
<script setup lang="ts">
import { defineEmits, defineProps } from 'vue';
import { Button, Select } from 'ant-design-vue';
import { Button, Select, DatePicker } from 'ant-design-vue';
import { PLATFORM_LIST } from '@/utils/platform';
import AccountSelect from '@/views/components/common/AccountSelect.vue';
import PlanSelect from '@/views/components/common/PlanSelect.vue';

34
src/views/property-marketing/put-account/investment-guidelines/components/table-data/placementGuideList.vue
View File

@ -46,12 +46,9 @@
<template #title>
<Space>
<span>本周总消耗</span>
<a-popover position="tl">
<Tooltip position="tl" title="当前周内所有投流账户的累计广告花费，反映整体投放规模。">
<icon-question-circle />
<template #content>
<p>当前周内所有投流账户的累计广告花费，反映整体投放规模。</p>
</template>
</a-popover>
</Tooltip>
</Space>
</template>
<template #customRender="{ record }">
@ -68,16 +65,13 @@
<template #title>
<Space>
<span>本周总消耗环比</span>
<a-popover position="tl">
<Tooltip position="tl" title="本周消耗金额与上周对比的变化百分比，用于衡量预算投放趋势。">
<icon-question-circle />
<template #content>
<p>本周消耗金额与上周对比的变化百分比，用于衡量预算投放趋势。</p>
</template>
</a-popover>
</Tooltip>
</Space>
</template>
<template #customRender="{ record }">
<a-statistic
<Statistic
:value="record.pre_total_use_amount_chain * 100"
:value-style="{
color: record.pre_total_use_amount_chain > 0 ? '#F64B31' : '#25C883',
@ -90,7 +84,7 @@
<icon-arrow-down v-else />
</template>
<template #suffix>%</template>
</a-statistic>
</Statistic>
</template>
</Table.Column>
<Table.Column
@ -103,12 +97,9 @@
<template #title>
<Space>
<span>ROI</span>
<a-popover position="tl">
<Tooltip position="tl" title="投资回报率（ROI）= 收益 ÷ 投入成本，反映整体投流账户的收益效率。">
<icon-question-circle />
<template #content>
<p>投资回报率（ROI）= 收益 ÷ 投入成本，反映整体投流账户的收益效率。</p>
</template>
</a-popover>
</Tooltip>
</Space>
</template>
</Table.Column>
@ -122,12 +113,9 @@
<template #title>
<Space>
<span>CTR</span>
<a-popover position="tl">
<Tooltip position="tl" title="点击率（CTR）= 点击量 ÷ 展示量，是衡量广告素材吸引力的关键指标。">
<icon-question-circle />
<template #content>
<p>点击率（CTR）= 点击量 ÷ 展示量，是衡量广告素材吸引力的关键指标。</p>
</template>
</a-popover>
</Tooltip>
</Space>
</template>
<template #customRender="{ record }">
@ -138,7 +126,7 @@
</view>
</template>
<script setup lang="ts">
import { Space, Table } from "ant-design-vue"
import { Space, Table, Tooltip, Statistic } from "ant-design-vue"
import { PLATFORM_LIST } from '@/utils/platform';
const props = defineProps({

26
src/views/property-marketing/put-account/investment-guidelines/detail.vue
View File

@ -6,27 +6,27 @@
</div>
<div class="container px-24px pt-12px pb-24px">
<a-row class="grid-demo" :gutter="24">
<a-col :span="12">
<Row class="grid-demo" :gutter="24">
<Col :span="12">
<div class="">
<Space direction="vertical">
<span class="span-title">账户</span>
<span class="span-content">{{ detailData?.account }}</span>
</Space>
</div>
</a-col>
</Col>
<a-col :span="12">
<Col :span="12">
<div class="">
<Space direction="vertical">
<span class="span-title">计划</span>
<span class="span-content">{{detailData.plan}}</span>
</Space>
</div>
</a-col>
</a-row>
<a-row class="grid-demo" :gutter="24" style="margin-top: 30px">
<a-col :span="12">
</Col>
</Row>
<Row class="grid-demo" :gutter="24" style="margin-top: 30px">
<Col :span="12">
<div class="">
<Space direction="vertical">
<span class="span-title">平台</span>
@ -42,17 +42,17 @@
</Space>
</Space>
</div>
</a-col>
</Col>
<a-col :span="12">
<Col :span="12">
<div class="">
<Space direction="vertical">
<span class="span-title">生成时间</span>
<span class="span-content">{{ detailData.created_at }}</span>
</Space>
</div>
</a-col>
</a-row>
</Col>
</Row>
</div>
</div>
<MonthData :overview="aiResult.overview"></MonthData>
@ -74,7 +74,7 @@
<script setup lang="ts">
import { reactive, ref } from 'vue';
import { Button, Space, message } from 'ant-design-vue';
import { Button, Space, message, Row, Col } from 'ant-design-vue';
import MonthData from './components/month-data/index.vue';
import PlacementSuggestions from './components/placement-suggestions/index.vue';
import { PLATFORM_LIST } from '@/utils/platform';

4
src/views/property-marketing/put-account/investment-guidelines/index.vue
View File

@ -28,7 +28,7 @@
@onSearch="onSearch"
@updateQuery="handleUpdateQuery"
/>
<a-spin v-if="loading" tip="AI分析中" />
<Spin v-if="loading" tip="AI分析中" />
<div v-if="listData.total > 0" class="pagination-box flex justify-end ignore-export">
<Pagination
@ -72,7 +72,7 @@
<script setup lang="ts">
import { reactive, ref } from 'vue';
import { Button, Tabs, Space, Pagination } from 'ant-design-vue';
import { Button, Tabs, Space, Pagination, Spin } from 'ant-design-vue';
const { TabPane } = Tabs;
import PlacementGuideList from './components/table-data/placementGuideList.vue';
import listSearchForm from './components/table-data/listSearchForm.vue';