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

3
src/views/writer-material-center/components/finished-products/index.vue
View File

@ -3,6 +3,7 @@ import { Tabs, TabPane, Button } from 'ant-design-vue';
import ManuscriptList from './manuscript/list/index.vue';
import ManuscriptCheckList from './manuscript/check-list/index.vue';
import UploadManuscriptModal from '@/views/writer-material-center/components/finished-products/manuscript/components/upload-manuscript-modal/index.vue';
import SvgIcon from '@/components/svg-icon/index.vue';
import { TABS_LIST, AuditStatus } from './constants';
@ -34,7 +35,7 @@ export default defineComponent({
class="ml-12px"
onClick={openUploadModal}
v-slots={{
icon: () => <icon-plus size="16" class="mr-8px"/>,
icon: () => <SvgIcon name="xt-plus" size="16" class="mr-8px"/>,
default: () => '上传内容稿件',
}}
/>

8
src/views/writer-material-center/components/finished-products/manuscript/check-list/components/filter-block/index.vue
View File

@ -18,7 +18,7 @@
@change="handleSearch"
>
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</Space>
@ -35,7 +35,7 @@
<!-- @change="handleSearch"-->
<!-- >-->
<!-- <template #prefix>-->
<!-- <icon-search />-->
<!-- <SvgIcon name="xt-search" />-->
<!-- </template>-->
<!-- </Input>-->
<!-- </Space>-->
@ -83,13 +83,13 @@
<div class="filter-row-item">
<Button type="primary" ghost class="mr-12px" @click="handleSearch">
<template #icon>
<icon-search class="mr-8px" />
<SvgIcon name="xt-search" class="mr-8px" />
</template>
<template #default>搜索</template>
</Button>
<Button @click="handleReset">
<template #icon>
<icon-refresh class="mr-8px" />
<SvgIcon name="xt-refresh" class="mr-8px" />
</template>
<template #default>重置</template>
</Button>

2
src/views/writer-material-center/components/finished-products/manuscript/check-list/components/manuscript-check-table/index.vue
View File

@ -29,7 +29,7 @@
<div class="flex items-center">
<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>
</div>
</template>

8
src/views/writer-material-center/components/finished-products/manuscript/check/components/check-list-drawer/index.vue
View File

@ -1,6 +1,7 @@
<script lang="jsx">
import { Drawer, Image } from 'ant-design-vue';
import TextOverTips from '@/components/text-over-tips';
import SvgIcon from '@/components/svg-icon/index.vue';
import icon1 from '@/assets/img/error-img.png';
@ -45,7 +46,12 @@ export default {
<span class="mr-8px cts bold">批量审核列表</span>
<span class="mr-8px cts !lh-22px !text-14px">{`共${dataSource.value.length}个`}</span>
</div>
<icon-menu-unfold size={16} class="color-##55585F cursor-pointer hover:color-#6D4CFE" onClick={onClose} />
<SvgIcon
name="xt-menu-unfold"
size={16}
class="color-##55585F cursor-pointer hover:color-#6D4CFE"
onClick={onClose}
/>
</div>
<div class="flex-1 overflow-y-auto px-24px">
{dataSource.value.map((item) => (

12
src/views/writer-material-center/components/finished-products/manuscript/check/components/content-card/index.vue
View File

@ -2,12 +2,13 @@
import axios from 'axios';
import { Swiper, SwiperSlide } from 'swiper/vue';
import { Button, Form, FormItem, Input, Tabs, message, Image, Upload, Spin } from 'ant-design-vue';
import SvgIcon from '@/components/svg-icon/index.vue';
const { TextArea } = Input;
const { TabPane } = Tabs;
import { IconLoading } from '@arco-design/web-vue/es/icon'; // 图标保留不更换
import TextOverTips from '@/components/text-over-tips';
import { LoadingOutlined } from '@ant-design/icons-vue';
import 'swiper/css';
import 'swiper/css/navigation';
@ -175,7 +176,7 @@ export default {
<Button type="primary" ghost class="w-123px check-btn" onClick={onAiReplace} disabled={isDisabled.value}>
{aiReplaceLoading.value ? (
<>
<IconLoading size={14} />
<LoadingOutlined style={{ fontSize: '14px' }} spin />
<span class="ml-8px check-text">AI生成中</span>
</>
) : (
@ -272,7 +273,8 @@ export default {
}}
/>
</div>
<icon-close-circle-fill
<SvgIcon
name="xt-close-circle-fill"
size={16}
class="close-icon absolute top--8px right--8px hidden cursor-pointer color-#737478 hover:!color-#211F24 z-50"
onClick={(e) => onDeleteImage(e, item, index)}
@ -296,7 +298,7 @@ export default {
<div class="flex justify-center mb-16px">
{renderUpload(
<div class="upload-box">
<icon-plus size="14" class="mb-16px color-#3C4043" />
<SvgIcon name="xt-plus" size="14" class="mb-16px color-#3C4043" />
<span class="cts !color-#211F24">上传图片</span>
</div>,
)}
@ -427,7 +429,7 @@ export default {
<span>{item.label}</span>
{
// activeTab.value === item.value && aiReview.value?.violation_items.length > 0 && (
// <icon-exclamation-circle-fill size={14} class="color-#F64B31 absolute right--10px top-0" />
// <SvgIcon name="xt-exclamation-circle-fill" size={14} class="color-#F64B31 absolute right--10px top-0" />
// )
}
</div>

6
src/views/writer-material-center/components/finished-products/manuscript/check/index.vue
View File

@ -5,6 +5,7 @@ import CheckSuccessModal from './check-success-modal.vue';
import HeaderCard from './components/header-card';
import ContentCard from './components/content-card';
import CheckListDrawer from './components/check-list-drawer';
import SvgIcon from '@/components/svg-icon/index.vue';
import { slsWithCatch, rlsWithCatch, glsWithCatch } from '@/utils/stroage.ts';
import useGetAiReviewResult from '@/hooks/useGetAiReviewResult.ts';
@ -211,7 +212,7 @@ export default {
<span class="cts color-#4E5969 cursor-pointer" onClick={onExit}>
成品库
</span>
<icon-oblique-line size="12" class="color-#C9CDD4 mx-4px" />
<SvgIcon name="xt-oblique-line" size="12" class="color-#C9CDD4 mx-4px" />
<span class="cts bold !color-#1D2129">{`${workIds.value.length > 0 ? '批量' : ''}审核内容稿件`}</span>
</div>
{dataSource.value.length > 1 && (
@ -219,7 +220,8 @@ export default {
class="check-list-icon"
onClick={() => checkListDrawerRef.value.open(dataSource.value, selectCardInfo.value)}
>
<icon-menu-fold size={16} class="color-#55585F mr-4px icon" />
<SvgIcon name="xt-menu-fold" size={16} class="color-#55585F icon mr-4px" />
<span class="cts !color-#211F24">审核列表</span>
</div>
)}

5
src/views/writer-material-center/components/finished-products/manuscript/components/edit-form/img-box.vue
View File

@ -16,7 +16,8 @@
>
<div class="group-container relative rounded-8px w-100px h-100px">
<img :src="file.url" class="object-cover w-full h-full border-1px border-#E6E6E8 rounded-8px" />
<icon-close-circle-fill
<SvgIcon
name="xt-close-circle-fill"
:size="16"
class="absolute top--8px right--8px cursor-pointer hidden color-#939499 hidden group-hover:block z-50"
@click="() => handleDeleteFile(index)"
@ -35,7 +36,7 @@
>
<template #default>
<div class="upload-box">
<icon-plus size="14" class="mb-16px color-#3C4043" />
<SvgIcon name="xt-plus" size="14" class="mb-16px color-#3C4043" />
<span class="cts !color-#211F24">上传图片</span>
</div>
</template>

9
src/views/writer-material-center/components/finished-products/manuscript/components/edit-form/index.vue
View File

@ -2,10 +2,13 @@
import axios from 'axios';
import { Button, Form, FormItem, Input, message, Upload } from 'ant-design-vue';
const { TextArea } = Input;
import { Loading3QuartersOutlined } from '@ant-design/icons-vue';
import CommonSelect from '@/components/common-select';
import { VueDraggable } from 'vue-draggable-plus';
import TextOverTips from '@/components/text-over-tips';
import ImgBox from './img-box';
import SvgIcon from '@/components/svg-icon/index.vue';
import { formatFileSize, getVideoInfo, formatDuration, formatUploadSpeed } from '@/utils/tools';
import { EnumManuscriptType } from '@/views/writer-material-center/components/finished-products/manuscript/list/constants.ts';
@ -206,7 +209,7 @@ export default {
>
{formData.value.videoInfo.uploadStatus === ENUM_UPLOAD_STATUS.DEFAULT ? (
<div class="upload-box">
<icon-plus size="14" class="mb-16px color-#3C4043" />
<SvgIcon name="xt-plus" size="14" class="mb-16px color-#3C4043" />
<span class="cts !color-#211F24">上传视频</span>
</div>
) : (
@ -237,7 +240,7 @@ export default {
<div class="flex items-center mr-12px">
{isUploading ? (
<div class="w-80px h-80px flex items-center justify-center bg-#fff rounded-8px mr-16px">
<icon-loading size="24" class="color-#B1B2B5" />
<Loading3QuartersOutlined spin class="color-#B1B2B5 text-24px" />
</div>
) : (
<img src={formData.value.videoInfo.poster} class="w-80 h-80 object-cover mr-16px rounded-8px" />
@ -255,7 +258,7 @@ export default {
) : (
<div class="flex items-center">
<div class="flex items-center mr-24px w-100px">
<icon-loading size="16" class="color-#6D4CFE mr-8px" />
<Loading3QuartersOutlined spin class="color-#6D4CFE mr-8px text-16px" />
<span class="cts !color-#6D4CFE mr-4px">上传中</span>
<span class="cts !color-#6D4CFE ">{formData.value.videoInfo.percent}%</span>
</div>

11
src/views/writer-material-center/components/finished-products/manuscript/components/upload-manuscript-modal/index.vue
View File

@ -1,6 +1,8 @@
<script lang="jsx">
import { Modal, Button, Form, FormItem, Input, message, Upload } from 'ant-design-vue';
const { TextArea } = Input;
import { Loading3QuartersOutlined } from '@ant-design/icons-vue';
import {
getTemplateUrlWriter,
postWorksByLinkWriter,
@ -11,6 +13,8 @@ import { getTemplateUrl } from '@/api/all/generationWorkshop';
import { slsWithCatch } from '@/utils/stroage.ts';
import TextOverTips from '@/components/text-over-tips';
import SvgIcon from '@/components/svg-icon/index.vue';
import icon1 from '@/assets/img/media-account/icon-feedback-fail.png';
import icon2 from '@/assets/img/media-account/icon-download.png';
@ -208,7 +212,7 @@ export default {
showUploadList={false}
>
<div class="upload-box">
<icon-plus size="14" class="mb-16px" />
<SvgIcon name="xt-plus" size="14" class="mb-16px" />
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
<span class="tip">支持文档（文本+图）, 视频批量上传</span>
</div>
@ -224,7 +228,7 @@ export default {
// 渲染加载状态
const renderLoadingState = () => (
<div class="flex flex-col items-center justify-center rounded-8px bg-#F7F8FA h-208px">
<icon-loading size="48" class="!color-#6D4CFE mb-16px" />
<Loading3QuartersOutlined spin class="!color-#6D4CFE mb-16px text-48px" />
<p class="tip !text-#768893">上传过程耗时可能较长，请耐心等待；</p>
<p class="tip !text-#768893">刷新页面将会终止本次数据的上传，请谨慎操作</p>
</div>
@ -250,7 +254,8 @@ export default {
<img src={item.cover} width="32" height="32" class="rounded-3px mr-8px" />
<TextOverTips class="text !text-left" context={item.title} />
</div>
<icon-delete
<SvgIcon
name="xt-delete"
size="16px"
class="color-#737478 cursor-pointer hover:!color-#211F24"
onClick={() => onDelete(index)}

2
src/views/writer-material-center/components/finished-products/manuscript/detail/index.vue
View File

@ -175,7 +175,7 @@ export default {
<span class="cts color-#4E5969 cursor-pointer" onClick={onBack}>
{sourceInfo.value.title}
</span>
<icon-oblique-line size="12" class="color-#C9CDD4 mx-4px" />
<SvgIcon name="xt-oblique-line" size="12" class="color-#C9CDD4 mx-4px" />
<span class="cts bold !color-#1D2129">内容稿件详情</span>
</div>
<div class="flex-1 bg-#fff rounded-8px content">

2
src/views/writer-material-center/components/finished-products/manuscript/edit/index.vue
View File

@ -102,7 +102,7 @@ export default {
<span class="cts color-#4E5969 cursor-pointer" onClick={onCancel}>
成品库
</span>
<icon-oblique-line size="12" class="color-#C9CDD4 mx-4px" />
<SvgIcon name="xt-oblique-line" size="12" class="color-#C9CDD4 mx-4px" />
<span class="cts bold !color-#1D2129">编辑内容稿件</span>
</div>
<div class="flex-1 overflow-y-auto p-24px bg-#fff rounded-8px ">

8
src/views/writer-material-center/components/finished-products/manuscript/list/components/filter-block/index.vue
View File

@ -12,7 +12,7 @@
@change="handleSearch"
>
<template #prefix>
<icon-search />
<SvgIcon name="xt-search" />
</template>
</Input>
</div>
@ -38,7 +38,7 @@
<!-- @change="handleSearch"-->
<!-- >-->
<!-- <template #prefix>-->
<!-- <icon-search />-->
<!-- <SvgIcon name="xt-search" />-->
<!-- </template>-->
<!-- </Input>-->
<!-- </Space>-->
@ -68,13 +68,13 @@
<div class="filter-row-item">
<Button type="primary" ghost class="mr-12px" @click="handleSearch">
<template #icon>
<icon-search class="mr-8px" />
<SvgIcon name="xt-search" class="mr-8px" />
</template>
<template #default>搜索</template>
</Button>
<Button @click="handleReset">
<template #icon>
<icon-refresh class="mr-8px" />
<SvgIcon name="xt-refresh" class="mr-8px" />
</template>
<template #default>重置</template>
</Button>

2
src/views/writer-material-center/components/finished-products/manuscript/list/components/manuscript-table/index.vue
View File

@ -28,7 +28,7 @@
<div class="flex items-center">
<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>
</div>
</template>

4
src/views/writer-material-center/components/finished-products/manuscript/upload/index.vue
View File

@ -4,6 +4,7 @@ import TextOverTips from '@/components/text-over-tips';
import EditForm, { ENUM_UPLOAD_STATUS, INITIAL_VIDEO_INFO } from '../components/edit-form';
import CancelUploadModal from './cancel-upload-modal.vue';
import UploadSuccessModal from './upload-success-modal.vue';
import SvgIcon from '@/components/svg-icon/index.vue';
import { EnumManuscriptType } from '@/views/writer-material-center/components/finished-products/manuscript/list/constants';
import { postWorksBatchWriter } from '@/api/all/generationWorkshop-writer.ts';
@ -276,7 +277,8 @@ export default {
)}`}
onClick={() => onSelect(item)}
>
<icon-close-circle-fill
<SvgIcon
name="xt-close-circle-fill"
size={16}
class="absolute top--8px right--8px color-#737478 hover:color-#211F24 hidden group-hover:block"
onClick={(e) => onDelete(e, item, index)}