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

feat: 新增svg组件，批量替换

Browse Source
This commit is contained in:
rd
2025-09-25 15:26:42 +08:00
parent 9e5bf07c1f
commit 9894380ba9
122 changed files with 414 additions and 370 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue
View File

@ -16,7 +16,7 @@
</div>
<div class="flex items-center">
<Button type="outline" class="w-110px mr-12px" size="medium" @click="handleExport">
<template #icon> <icon-download class="mr-8px" /> </template>
<template #icon> <SvgIcon name="xt-download" class="mr-8px" /> </template>
<template #default>导出数据</template>
</Button>
<Button type="outline" class="w-110px" size="medium" @click="openCustomColumn">
@ -63,7 +63,7 @@
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
<span class="cts mr-4px">{{ column.title }}</span>
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
<SvgIcon name="xt-question-circle" class="tooltip-icon color-#737478" size="16" />
</Tooltip>
</template>
@ -114,8 +114,8 @@
<template v-else-if="column.isRateField" #customRender="{ record }">
<div class="flex items-center rate-row justify-end" :class="record[column.dataIndex] > 0 ? 'up' : 'down'">
<icon-arrow-up v-if="record[column.dataIndex] > 0" size="16" />
<icon-arrow-down v-else size="16" />
<SvgIcon name="xt-arrow-up" v-if="record[column.dataIndex] > 0" size="16" />
<SvgIcon name="xt-arrow-down" v-else size="16" />
{{ formatTableField(column, record) }}
</div>
</template>

4
src/views/property-marketing/media-account/account-dashboard/components/custom-column-modal/index.vue
View File

@ -54,10 +54,10 @@
:class="isRequiredColumn(item) ? '!display-none' : ''"
>
<div class="flex items-center">
<icon-menu size="16" class="mr-8px" />
<SvgIcon name="xt-menu" size="16" class="mr-8px"/>
<span>{{ getCheckColumnLabel(item) }}</span>
</div>
<icon-close size="16" class="color-#737478 cursor-pointer" @click="removeCheckedField(item)" />
<SvgIcon name="xt-close" size="16" class="color-#737478 cursor-pointer" @click="removeCheckedField(item)" />
</div>
</VueDraggable>
</div>

8
src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue
View File

@ -10,7 +10,7 @@
<span class="label">账号名称</span>
<Input v-model:value="query.name" placeholder="请搜索..." class="!w-240px" allowClear @change="handleSearch">
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</div>
@ -37,7 +37,7 @@
<div class="filter-row-item flex items-center">
<span class="label">时间筛选</span>
<Select v-model:value="query.type" size="middle" placeholder="全部" class="!w-240px" @change="handleSearch">
<template #suffixIcon> <icon-calendar size="16" /> </template>
<template #suffixIcon> <SvgIcon name="xt-calendar" size="16" /> </template>
<Option :value="7" label="近7天">近7天</Option>
<!-- <Option :value="14" label="近14天">近14天</Option> -->
<Option :value="30" label="近30天">近30天</Option>
@ -46,13 +46,13 @@
<div class="filter-row-item flex items-center">
<Button type="primary" ghost class="w-84px mr-12px" @click="handleSearch">
<template #icon>
<icon-search class="mr-8px" />
<SvgIcon name="xt-search" class="mr-8px" />
</template>
<template #default>搜索</template>
</Button>
<Button class="w-84px" @click="handleReset">
<template #icon>
<icon-refresh class="mr-8px" />
<SvgIcon name="xt-refresh" class="mr-8px" />
</template>
<template #default>重置</template>
</Button>

2
src/views/property-marketing/media-account/account-dashboard/index.vue
View File

@ -10,7 +10,7 @@
<div class="flex items-center">
<p class="text-18px font-400 lh-26px color-#211F24 mr-4px title">数据总览</p>
<Tooltip title="展示所筛选的账号的信息汇总">
<icon-question-circle size="16" class="color-#737478" />
<SvgIcon name="xt-question-circle" size="16" class="color-#737478" />
</Tooltip>
</div>
</div>

8
src/views/property-marketing/media-account/account-detail/components/account-info/index.vue
View File

@ -48,7 +48,7 @@
<div class="flex items-center mb-4px">
<p class="cts !color-#737478 !mr-4px">{{ field.title }}</p>
<Tooltip v-if="field.tooltip" :title="field.tooltip" position="top">
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
<SvgIcon name="xt-question-circle" class="tooltip-icon color-#737478" size="16" />
</Tooltip>
</div>
<p class="cts">
@ -104,8 +104,8 @@
class="flex items-center"
:class="detailData[field.dataIndex] > 0 ? 'color-#F64B31' : 'color-#25C883'"
>
<icon-arrow-up v-if="detailData[field.dataIndex] > 0" size="16" />
<icon-arrow-down v-else size="16" />
<SvgIcon name="xt-arrow-up" v-if="detailData[field.dataIndex] > 0" size="16" />
<SvgIcon name="xt-arrow-down" v-else size="16" />
{{ `${detailData[field.dataIndex]}%` }}
</div>
</template>
@ -125,7 +125,7 @@
@click="showMore = !showMore"
>
<span class="cts mr-8px !color-#6D4CFE"> {{ showMore ? '收起' : '更多' }} </span>
<icon-down
<SvgIcon name="xt-down"
size="13"
class="!color-#6D4CFE transform transition-transform duration-300 ease-in-out"
:class="showMore ? 'rotate-180' : ''"

10
src/views/property-marketing/media-account/account-detail/components/note-table/index.vue
View File

@ -8,7 +8,7 @@
<div class="flex items-center">
<span class="cts !text-18px !lh-26px mr-4px title">作品列表</span>
<Tooltip title="展示笔记层级的详细数据，如曝光、互动等，是内容精细分析入口。">
<icon-question-circle class="color-#737478" size="14" />
<SvgIcon name="xt-question-circle" class="color-#737478" size="14" />
</Tooltip>
</div>
</div>
@ -17,7 +17,7 @@
<span class="label">作品标题</span>
<Input v-model:value="query.title" class="!w-240px" placeholder="请搜索..." allowClear @change="handleSearch">
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</div>
@ -34,13 +34,13 @@
</div>
<Button type="primary" ghost class="w-84px mr-12px" @click="handleSearch">
<template #icon>
<icon-search class="mr-8px" />
<SvgIcon name="xt-search" class="mr-8px" />
</template>
<template #default>搜索</template>
</Button>
<Button class="w-84px" @click="handleReset">
<template #icon>
<icon-refresh class="mr-8px" />
<SvgIcon name="xt-refresh" class="mr-8px" />
</template>
<template #default>重置</template>
</Button>
@ -68,7 +68,7 @@
<template #title>
<span class="cts mr-4px">{{ column.title }}</span>
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
<icon-question-circle class="tooltip-icon color-#737478" size="14" />
<SvgIcon name="xt-question-circle" class="tooltip-icon color-#737478" size="14" />
</Tooltip>
</template>
<template #customRender="{ record }">

2
src/views/property-marketing/media-account/account-detail/index.vue
View File

@ -5,7 +5,7 @@
<template>
<div class="account-detail-wrap">
<div class="flex items-center mb-16px cursor-pointer" @click="handleBack">
<icon-left size="16" />
<SvgIcon name="xt-left" size="16" />
<span class="cts title ml-8px">账号列表</span>
</div>
<AccountInfo />

2
src/views/property-marketing/media-account/account-manage/components/account-table/card.vue
View File

@ -13,7 +13,7 @@
:wrapperClassName="`card-item ${isSelected(item) ? 'checked' : ''}`"
>
<template #icon>
<icon-sync size="24" />
<SvgIcon name="xt-sync" size="24" />
</template>
<Checkbox
:checked="isSelected(item)"

2
src/views/property-marketing/media-account/account-manage/components/account-table/table.vue
View File

@ -29,7 +29,7 @@
<template #title>
<span class="cts mr-4px">{{ column.title }}</span>
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
<SvgIcon name="xt-question-circle" class="tooltip-icon color-#737478" size="16" />
</Tooltip>
</template>
<template v-if="column.dataIndex === 'name'" #customRender="{ record }">

3
src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue
View File

@ -24,6 +24,7 @@ import AuthorizedAccountModal from '../authorized-account-modal';
import StatusBox from '@/views/property-marketing/media-account/components/status-select/status-box.tsx';
import SyncDataModal from '../sync-data-modal';
import CommonSelect from '@/components/common-select';
import SvgIcon from '@/components/svg-icon/index.vue';
// import { downloadByUrl } from '@/utils/tools';
import { showExportNotification } from '@/utils/notification';
@ -265,7 +266,7 @@ export default {
<>
<span class="label">{label}</span>
<Tooltip content={tooltipContent}>
<icon-question-circle size="14" class="ml-4px color-#737478" />
<SvgIcon name="xt-question-circle" size="14" class="ml-4px color-#737478" />
</Tooltip>
</>
);

9
src/views/property-marketing/media-account/account-manage/components/authorized-account-modal/index.vue
View File

@ -50,7 +50,7 @@
height="24"
class="mb-13px"
/>
<icon-loading v-else size="24" class="color-#6D4CFE mb-13px" />
<Loading3QuartersOutlined spin v-else class="color-#6D4CFE mb-13px text-24px" />
<span
:class="modalState === MODAL_STATE.QR_FAILED ? '!color-#F64B31' : '!color-#6D4CFE'"
class="s2"
@ -66,7 +66,7 @@
<Image v-else :src="qrCodeUrl" :width="160" :height="160" />
<!-- 二维码失效遮罩 -->
<div v-if="modalState === MODAL_STATE.QR_EXPIRED" class="mask cursor-pointer" @click="handleRefreshQrCode">
<icon-refresh size="24" class="mb-13px" />
<SvgIcon name="xt-refresh" size="24" class="mb-13px" />
<p class="s1">二维码失效</p>
<p class="s1">请点击刷新</p>
</div>
@ -77,9 +77,7 @@
</div>
<template #footer>
<Button v-if="modalState === MODAL_STATE.QR_READY" size="large" @click="handleRefreshQrCode">
重新生成
</Button>
<Button v-if="modalState === MODAL_STATE.QR_READY" size="large" @click="handleRefreshQrCode"> 重新生成 </Button>
<Button v-if="[MODAL_STATE.SUCCESS, MODAL_STATE.FAILED].includes(modalState)" size="large" @click="close">
取消
</Button>
@ -95,6 +93,7 @@
<script setup>
import { defineExpose, ref, computed } from 'vue';
import { Button, Modal, message, Image, Progress } from 'ant-design-vue';
import { Loading3QuartersOutlined } from '@ant-design/icons-vue';
import { getAuthorizedImage, getMediaAccountsAuthorizedStatus } from '@/api/all/propertyMarketing';
import SyncDataModal from '../sync-data-modal';

6
src/views/property-marketing/media-account/account-manage/components/filter-block/index.vue
View File

@ -10,7 +10,7 @@
<span class="label">账号名称/ID/手机号</span>
<Input v-model:value="query.search" class="w-240px" placeholder="请搜索..." allowClear @change="handleSearch">
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</div>
@ -66,13 +66,13 @@
<div class="filter-row-item">
<Button type="primary" ghost class="w-84px mr-12px" @click="handleSearch">
<template #icon>
<icon-search class="mr-8px" />
<SvgIcon name="xt-search" class="mr-8px" />
</template>
<template #default>搜索</template>
</Button>
<Button class="w-84px" @click="handleReset">
<template #icon>
<icon-refresh class="mr-8px" />
<SvgIcon name="xt-refresh" class="mr-8px" />
</template>
<template #default>重置</template>
</Button>

6
src/views/property-marketing/media-account/account-manage/components/group-manage-modal/index.vue
View File

@ -19,14 +19,14 @@
<Space size="medium" class="w-240px">
<Input v-model:value="query.name" placeholder="请搜索..." size="middle" allowClear @change="reload">
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</Space>
</div>
<Button type="primary" size="middle" @click="openAdd"
><template #icon>
<icon-plus size="16" class="mr-8px" />
<SvgIcon name="xt-plus" size="16" class="mr-8px" />
</template>
<template #default>添加新分组</template>
</Button>
@ -72,7 +72,7 @@
<span class="s1 mb-16px">暂无分组</span>
<Button type="primary" class="mb-16px" size="middle" @click="openAdd"
><template #icon>
<icon-plus size="16" class="mr-8px" />
<SvgIcon name="xt-plus" size="16" class="mr-8px" />
</template>
<template #default>去添加</template>
</Button>

5
src/views/property-marketing/media-account/account-manage/components/reauthorize-account-modal/index.vue
View File

@ -64,7 +64,7 @@
height="24"
class="mb-13px"
/>
<icon-loading v-else size="24" class="color-#6D4CFE mb-13px" />
<Loading3QuartersOutlined spin v-else size="24" class="color-#6D4CFE mb-13px text-24px" />
<span
:class="modalState === MODAL_STATE.QR_FAILED ? '!color-#F64B31' : '!color-#6D4CFE'"
class="s2"
@ -82,7 +82,7 @@
<!-- 二维码失效遮罩 -->
<div v-if="modalState === MODAL_STATE.QR_EXPIRED" class="mask cursor-pointer" @click="handleRefreshQrCode">
<icon-refresh size="24" class="mb-13px" />
<SvgIcon name="xt-refresh" size="24" class="mb-13px" />
<p class="s1">二维码失效</p>
<p class="s1">请点击刷新</p>
</div>
@ -113,6 +113,7 @@
<script setup>
import { defineExpose, ref, computed } from 'vue';
import { Button, Modal, message, Image, Progress } from 'ant-design-vue';
import { Loading3QuartersOutlined } from '@ant-design/icons-vue';
import { getMediaAccountsAuthorizedStatus, getAuthorizedImage } from '@/api/all/propertyMarketing';
import SyncDataModal from '../sync-data-modal';

6
src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/index.vue
View File

@ -25,13 +25,13 @@
@change="handleSearch"
>
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</div>
<Button type="primary" @click="openAdd">
<template #icon>
<icon-plus size="16" class="mr-8px" />
<SvgIcon name="xt-plus" size="16" class="mr-8px" />
</template>
<template #default>添加新标签</template>
</Button>
@ -51,7 +51,7 @@
<span class="s1 mb-16px">暂无标签</span>
<Button type="primary" class="mb-16px" @click="openAdd">
<template #icon>
<icon-plus size="16" class="mr-8px" />
<SvgIcon name="xt-plus" size="16" class="mr-8px" />
</template>
<template #default>去添加</template>
</Button>

2
src/views/property-marketing/media-account/account-manage/index.vue
View File

@ -22,7 +22,7 @@
</Button>
<Button type="primary" class="w-112px" size="middle" @click="handleOpenAccountModal">
<template #icon>
<icon-plus size="16" class="mr-8px" />
<SvgIcon name="xt-plus" size="16" class="mr-8px" />
</template>
<template #default>添加账号</template>
</Button>

10
src/views/property-marketing/media-account/node-detail/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="note-detail-wrap h-full flex flex-col">
<div class="flex items-center mb-16px cursor-pointer" @click="handleBack">
<icon-left size="16" />
<SvgIcon name="xt-left" size="16" />
<span class="cts ml-8px bold">账号详情</span>
</div>
@ -11,7 +11,7 @@
<div class="flex items-center">
<span class="cts !text-18px !lh-26px mr-4px bold">作品详情</span>
<Tooltip title="展示作品的标题、图文、视频等详细内容">
<icon-question-circle class="color-#737478" size="14" />
<SvgIcon name="xt-question-circle" class="color-#737478" size="14" />
</Tooltip>
</div>
</div>
@ -42,7 +42,7 @@
<div class="flex items-center">
<span class="cts !text-18px !lh-26px mr-4px bold">评论列表</span>
<Tooltip title="展示用户对作品的评论">
<icon-question-circle class="color-#737478" size="14" />
<SvgIcon name="xt-question-circle" class="color-#737478" size="14" />
</Tooltip>
</div>
</div>
@ -76,7 +76,7 @@
<div class="flex items-center">
<span class="cts !text-18px !lh-26px mr-4px bold">作品数据</span>
<Tooltip title="展示作品的曝光量、点赞量等数据指标">
<icon-question-circle class="color-#737478" size="14" />
<SvgIcon name="xt-question-circle" class="color-#737478" size="14" />
</Tooltip>
</div>
</div>
@ -85,7 +85,7 @@
<div class="flex items-center mb-4px">
<span class="cts !color-#737478 mr-4px">{{ item.label }}</span>
<Tooltip :title="item.tooltip">
<icon-question-circle class="color-#737478" size="16" />
<SvgIcon name="xt-question-circle" class="color-#737478" size="16" />
</Tooltip>
</div>
<span class="cts num">{{ formatNumberShow(dataSource[item.prop]) }}</span>