feat: 样式调整
This commit is contained in:
@ -1,6 +1,6 @@
|
|||||||
## template-admin-ts
|
## template-admin-ts
|
||||||
|
|
||||||
基于 Arco Design Pro 的中后台管理模板
|
基于 Ant Design Vue 的中后台管理模板
|
||||||
|
|
||||||
- vite 4.x
|
- vite 4.x
|
||||||
- vue 3.x
|
- vue 3.x
|
||||||
@ -10,7 +10,7 @@
|
|||||||
- axios
|
- axios
|
||||||
- dayjs
|
- dayjs
|
||||||
- lodash
|
- lodash
|
||||||
- arco-design
|
- ant-design-vue
|
||||||
- less
|
- less
|
||||||
- eslint + prettier
|
- eslint + prettier
|
||||||
|
|
||||||
@ -183,7 +183,7 @@ export { default as Comp } from './comp/index.vue';
|
|||||||
</template>
|
</template>
|
||||||
```
|
```
|
||||||
|
|
||||||
### `ui` 框架 [`ArcoVue`](https://arco.design/vue/docs/start)
|
### `ui` 框架 [`Ant Design Vue`](https://antdv.com/)
|
||||||
|
|
||||||
- 自动导入组件,无需再次导入
|
- 自动导入组件,无需再次导入
|
||||||
- 图标库已配置,同组件使用
|
- 图标库已配置,同组件使用
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<a-config-provider :locale="zhCN" size="small" :theme="redTheme">
|
<ConfigProvider :locale="zhCN" :theme="redTheme">
|
||||||
<router-view v-if="$route.path === '/login' || ['ExploreList', 'ExploreDetail'].includes($route.name)" />
|
<router-view v-if="$route.path === '/login' || ['ExploreList', 'ExploreDetail'].includes($route.name)" />
|
||||||
<LayoutBasic v-else />
|
<LayoutBasic v-else />
|
||||||
</a-config-provider>
|
</ConfigProvider>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
@ -12,7 +12,8 @@ import { useChatStore } from '@/stores/modules/chat';
|
|||||||
import { initApp } from '@/utils/user';
|
import { initApp } from '@/utils/user';
|
||||||
import { useSidebarStore } from '@/stores/modules/side-bar';
|
import { useSidebarStore } from '@/stores/modules/side-bar';
|
||||||
|
|
||||||
import zhCN from '@arco-design/web-vue/es/locale/lang/zh-cn'; // 已移除
|
import { ConfigProvider } from 'ant-design-vue';
|
||||||
|
import zhCN from 'ant-design-vue/es/locale/zh_CN';
|
||||||
|
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|||||||
@ -297,14 +297,14 @@ export default {
|
|||||||
align={column.align}
|
align={column.align}
|
||||||
ellipsis
|
ellipsis
|
||||||
title={() => (
|
title={() => (
|
||||||
<div class="flex items-center">
|
<>
|
||||||
<span class="cts mr-4px">{column.title}</span>
|
<span class="cts mr-4px">{column.title}</span>
|
||||||
{column.tooltip && (
|
{column.tooltip && (
|
||||||
<Tooltip title={column.tooltip} placement="top">
|
<Tooltip title={column.tooltip} placement="top">
|
||||||
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
)}
|
)}
|
||||||
</div>
|
</>
|
||||||
)}
|
)}
|
||||||
customRender={({ record }) => {
|
customRender={({ record }) => {
|
||||||
if (column.dataIndex === 'status') {
|
if (column.dataIndex === 'status') {
|
||||||
|
|||||||
@ -145,14 +145,14 @@ export default {
|
|||||||
align={column.align}
|
align={column.align}
|
||||||
ellipsis
|
ellipsis
|
||||||
title={() => (
|
title={() => (
|
||||||
<div class="flex items-center">
|
<>
|
||||||
<span class="cts mr-4px">{column.title}</span>
|
<span class="cts mr-4px">{column.title}</span>
|
||||||
{column.tooltip && (
|
{column.tooltip && (
|
||||||
<Tooltip title={column.tooltip} placement="top">
|
<Tooltip title={column.tooltip} placement="top">
|
||||||
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
)}
|
)}
|
||||||
</div>
|
</>
|
||||||
)}
|
)}
|
||||||
customRender={({ record }) => {
|
customRender={({ record }) => {
|
||||||
if (column.dataIndex === 'status') {
|
if (column.dataIndex === 'status') {
|
||||||
|
|||||||
@ -11,8 +11,8 @@ import NoData from '@/components/no-data/index.vue';
|
|||||||
import SvgIcon from '@/components/svg-icon/index.vue';
|
import SvgIcon from '@/components/svg-icon/index.vue';
|
||||||
|
|
||||||
import '@/api/index';
|
import '@/api/index';
|
||||||
import '@arco-design/web-vue/dist/arco.css'; // 已移除 Arco 样式
|
|
||||||
import './core';
|
import './core';
|
||||||
|
import '@arco-design/web-vue/dist/arco.css'; // 已移除 Arco 样式
|
||||||
|
|
||||||
import 'normalize.css';
|
import 'normalize.css';
|
||||||
import 'uno.css';
|
import 'uno.css';
|
||||||
|
|||||||
@ -26,12 +26,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template v-if="column.dataIndex === 'customer_opinion'" #customRender="{ record }">
|
<template v-if="column.dataIndex === 'customer_opinion'" #customRender="{ record }">
|
||||||
|
|||||||
@ -219,7 +219,7 @@ export const INITIAL_QUERY = {
|
|||||||
title: '',
|
title: '',
|
||||||
created_at: [],
|
created_at: [],
|
||||||
audit_started_at: [],
|
audit_started_at: [],
|
||||||
audit_platform: '',
|
audit_platform: undefined,
|
||||||
sort_column: undefined,
|
sort_column: undefined,
|
||||||
sort_order: undefined,
|
sort_order: undefined,
|
||||||
};
|
};
|
||||||
|
|||||||
@ -121,16 +121,13 @@ export default {
|
|||||||
<Upload
|
<Upload
|
||||||
ref={uploadRef}
|
ref={uploadRef}
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
|
||||||
class="w-fit"
|
class="w-fit"
|
||||||
custom-request={(option) => uploadImage(option, action)}
|
customRequest={(option) => uploadImage(option, action)}
|
||||||
accept=".jpg,.jpeg,.png,.gif,.webp"
|
accept=".jpg,.jpeg,.png,.gif,.webp"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
multiple
|
multiple
|
||||||
>
|
>
|
||||||
{{
|
<UploadBtn />
|
||||||
'upload-button': () => <UploadBtn />,
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,7 +1,6 @@
|
|||||||
<script lang="jsx">
|
<script lang="jsx">
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { Button, Form, FormItem, Input, message } from 'ant-design-vue';
|
import { Button, Form, FormItem, Input, message, Upload } from 'ant-design-vue';
|
||||||
import { Upload } from 'ant-design-vue';
|
|
||||||
// import CommonSelect from '@/components/common-select';
|
// import CommonSelect from '@/components/common-select';
|
||||||
// import { VueDraggable } from 'vue-draggable-plus';
|
// import { VueDraggable } from 'vue-draggable-plus';
|
||||||
import TextOverTips from '@/components/text-over-tips';
|
import TextOverTips from '@/components/text-over-tips';
|
||||||
@ -202,25 +201,18 @@ export default {
|
|||||||
<Upload
|
<Upload
|
||||||
ref={uploadRef}
|
ref={uploadRef}
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
customRequest={uploadVideo}
|
||||||
custom-request={uploadVideo}
|
|
||||||
accept=".mp4,.mov,.avi,.flv,.wmv"
|
accept=".mp4,.mov,.avi,.flv,.wmv"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
>
|
>
|
||||||
{{
|
{formData.value.videoInfo.uploadStatus === ENUM_UPLOAD_STATUS.DEFAULT ? (
|
||||||
'upload-button': () => {
|
|
||||||
if (formData.value.videoInfo.uploadStatus === ENUM_UPLOAD_STATUS.DEFAULT) {
|
|
||||||
return (
|
|
||||||
<div class="upload-box">
|
<div class="upload-box">
|
||||||
<icon-plus size="14" class="mb-16px color-#3C4043" />
|
<icon-plus size="14" class="mb-16px color-#3C4043" />
|
||||||
<span class="cts !color-#211F24">上传视频</span>
|
<span class="cts !color-#211F24">上传视频</span>
|
||||||
</div>
|
</div>
|
||||||
);
|
) : (
|
||||||
} else {
|
<Button type="text">替换视频</Button>
|
||||||
return <Button type="text">替换视频</Button>;
|
)}
|
||||||
}
|
|
||||||
},
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -74,34 +74,34 @@ export default {
|
|||||||
reset();
|
reset();
|
||||||
};
|
};
|
||||||
|
|
||||||
const renderColumn = () => {
|
// const renderColumn = () => {
|
||||||
return TABLE_COLUMNS.map((column) => (
|
// return TABLE_COLUMNS.map((column) => (
|
||||||
<TableColumn
|
// <TableColumn
|
||||||
key={column.dataIndex}
|
// key={column.dataIndex}
|
||||||
data-index={column.dataIndex}
|
// data-index={column.dataIndex}
|
||||||
fixed={column.fixed}
|
// fixed={column.fixed}
|
||||||
width={column.width}
|
// width={column.width}
|
||||||
min-width={column.minWidth}
|
// min-width={column.minWidth}
|
||||||
sortable={column.sortable}
|
// sortable={column.sortable}
|
||||||
align={column.align}
|
// align={column.align}
|
||||||
ellipsis
|
// ellipsis
|
||||||
tooltip
|
// tooltip
|
||||||
v-slots={{
|
// v-slots={{
|
||||||
title: () => (
|
// title: () => (
|
||||||
<div class="flex items-center">
|
// <>
|
||||||
<span class="cts mr-4px">{column.title}</span>
|
// <span class="cts mr-4px">{column.title}</span>
|
||||||
{column.tooltip && (
|
// {column.tooltip && (
|
||||||
<Tooltip title={column.tooltip} placement="top">
|
// <Tooltip title={column.tooltip} placement="top">
|
||||||
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
// <IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
||||||
</Tooltip>
|
// </Tooltip>
|
||||||
)}
|
// )}
|
||||||
</div>
|
// </>
|
||||||
),
|
// ),
|
||||||
cell: ({ record }) => renderCell(record),
|
// cell: ({ record }) => renderCell(record),
|
||||||
}}
|
// }}
|
||||||
/>
|
// />
|
||||||
));
|
// ));
|
||||||
};
|
// };
|
||||||
|
|
||||||
const onShare = () => {
|
const onShare = () => {
|
||||||
shareModalRef.value?.open(selectedRowKeys.value);
|
shareModalRef.value?.open(selectedRowKeys.value);
|
||||||
@ -187,14 +187,14 @@ export default {
|
|||||||
align={column.align}
|
align={column.align}
|
||||||
ellipsis
|
ellipsis
|
||||||
title={() => (
|
title={() => (
|
||||||
<div class="flex items-center">
|
<>
|
||||||
<span class="cts mr-4px bold color-#211F24">{column.title}</span>
|
<span class="cts mr-4px bold color-#211F24">{column.title}</span>
|
||||||
{column.tooltip && (
|
{column.tooltip && (
|
||||||
<Tooltip title={column.tooltip} placement="top">
|
<Tooltip title={column.tooltip} placement="top">
|
||||||
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
<IconQuestionCircle class="tooltip-icon color-#737478" size={16} />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
)}
|
)}
|
||||||
</div>
|
</>
|
||||||
)}
|
)}
|
||||||
customRender={({ record }) => {
|
customRender={({ record }) => {
|
||||||
if (column.dataIndex === 'audit_status') {
|
if (column.dataIndex === 'audit_status') {
|
||||||
|
|||||||
@ -7,6 +7,7 @@ import { slsWithCatch } from '@/utils/stroage.ts';
|
|||||||
|
|
||||||
import TextOverTips from '@/components/text-over-tips';
|
import TextOverTips from '@/components/text-over-tips';
|
||||||
import icon1 from '@/assets/img/media-account/icon-feedback-fail.png';
|
import icon1 from '@/assets/img/media-account/icon-feedback-fail.png';
|
||||||
|
import icon2 from '@/assets/img/media-account/icon-download.png';
|
||||||
|
|
||||||
const { TextArea } = Input;
|
const { TextArea } = Input;
|
||||||
|
|
||||||
@ -232,24 +233,20 @@ export default {
|
|||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<Upload
|
<Upload
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
|
||||||
multiple
|
multiple
|
||||||
customRequest={handleUpload}
|
customRequest={handleUpload}
|
||||||
|
class="w-full"
|
||||||
accept=".xlsx,.xls,.docx,.doc,.mp4,.mov,.avi,.flv,.wmv,.m4v"
|
accept=".xlsx,.xls,.docx,.doc,.mp4,.mov,.avi,.flv,.wmv,.m4v"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
>
|
>
|
||||||
{{
|
|
||||||
'upload-button': () => (
|
|
||||||
<div class="upload-box">
|
<div class="upload-box">
|
||||||
<icon-plus size="14" class="mb-16px" />
|
<icon-plus size="14" class="mb-16px" />
|
||||||
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
||||||
<span class="tip">支持文档(文本+图), 视频批量上传</span>
|
<span class="tip">支持文档(文本+图), 视频批量上传</span>
|
||||||
</div>
|
</div>
|
||||||
),
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
<div class="flex items-center cursor-pointer mt-8px" onClick={handleDownloadTemplate}>
|
<div class="flex items-center cursor-pointer mt-8px" onClick={handleDownloadTemplate}>
|
||||||
<icon-download size="14" class="mr-4px !color-#6D4CFE" />
|
<img src={icon2} width="16" height="16" class="mr-4px" />
|
||||||
<span class="cts color-#6D4CFE">下载示例文档</span>
|
<span class="cts color-#6D4CFE">下载示例文档</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -28,4 +28,8 @@
|
|||||||
border: 1px dashed var(--Border-1, #d7d7d9);
|
border: 1px dashed var(--Border-1, #d7d7d9);
|
||||||
background: var(--BG-200, #f2f3f5);
|
background: var(--BG-200, #f2f3f5);
|
||||||
}
|
}
|
||||||
|
.ant-upload {
|
||||||
|
cursor: pointer;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -25,12 +25,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template v-if="column.dataIndex === 'create_at'" #customRender="{ record }">
|
<template v-if="column.dataIndex === 'create_at'" #customRender="{ record }">
|
||||||
|
|||||||
@ -26,12 +26,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<template v-if="column.dataIndex === 'name'" #customRender="{ record }">
|
<template v-if="column.dataIndex === 'name'" #customRender="{ record }">
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
|
|||||||
@ -60,13 +60,11 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
|
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template v-if="column.dataIndex === 'platform'" #customRender="{ record }">
|
<template v-if="column.dataIndex === 'platform'" #customRender="{ record }">
|
||||||
@ -216,8 +214,6 @@ const tableColumns = computed(() => {
|
|||||||
return _result;
|
return _result;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const handleDetail = (record) => {
|
const handleDetail = (record) => {
|
||||||
router.push(`/media-account/detail/${record.id}?type=${dateType.value}`);
|
router.push(`/media-account/detail/${record.id}?type=${dateType.value}`);
|
||||||
};
|
};
|
||||||
@ -230,7 +226,7 @@ const handleTableChange = (pagination, filters, sorter) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleSelect = (record, selected, selectedRows, nativeEvent) => {
|
const handleSelect = (record, selected, selectedRows, nativeEvent) => {
|
||||||
selectedItems.value = selectedRows.map(row => row.id);
|
selectedItems.value = selectedRows.map((row) => row.id);
|
||||||
emit('selectionChange', selectedRows);
|
emit('selectionChange', selectedRows);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -18,7 +18,7 @@ export const TABLE_COLUMNS = [
|
|||||||
{
|
{
|
||||||
title: '笔记标题',
|
title: '笔记标题',
|
||||||
dataIndex: 'title',
|
dataIndex: 'title',
|
||||||
width: 240,
|
width: 280,
|
||||||
fixed: 'left',
|
fixed: 'left',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -30,42 +30,42 @@ export const TABLE_COLUMNS = [
|
|||||||
{
|
{
|
||||||
title: '曝光量',
|
title: '曝光量',
|
||||||
dataIndex: 'exposure_number',
|
dataIndex: 'exposure_number',
|
||||||
width: 180,
|
width: 160,
|
||||||
tooltip: '内容被展示给用户的总次数,不代表用户实际观看。',
|
tooltip: '内容被展示给用户的总次数,不代表用户实际观看。',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '观看量',
|
title: '观看量',
|
||||||
dataIndex: 'view_number',
|
dataIndex: 'view_number',
|
||||||
width: 180,
|
width: 160,
|
||||||
tooltip: '用户点击内容并实际观看的次数,是内容实际触达的重要指标。',
|
tooltip: '用户点击内容并实际观看的次数,是内容实际触达的重要指标。',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '点赞量',
|
title: '点赞量',
|
||||||
dataIndex: 'like_number',
|
dataIndex: 'like_number',
|
||||||
width: 180,
|
width: 160,
|
||||||
tooltip: '单篇笔记获得的点赞总数,反映用户喜好程度。',
|
tooltip: '单篇笔记获得的点赞总数,反映用户喜好程度。',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '收藏量',
|
title: '收藏量',
|
||||||
dataIndex: 'collect_number',
|
dataIndex: 'collect_number',
|
||||||
width: 180,
|
width: 160,
|
||||||
tooltip: '用户将内容保存到收藏夹的次数,代表内容被认可为“值得保留”。',
|
tooltip: '用户将内容保存到收藏夹的次数,代表内容被认可为“值得保留”。',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '评论数',
|
title: '评论数',
|
||||||
dataIndex: 'comment_number',
|
dataIndex: 'comment_number',
|
||||||
width: 180,
|
width: 160,
|
||||||
tooltip: '内容下方用户留言的总数,体现用户参与度与讨论热度。',
|
tooltip: '内容下方用户留言的总数,体现用户参与度与讨论热度。',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '分享量',
|
title: '分享量',
|
||||||
dataIndex: 'share_number',
|
dataIndex: 'share_number',
|
||||||
width: 180,
|
width: 160,
|
||||||
tooltip: '内容被转发或分享至其他平台或私信的次数,代表外扩传播意愿。',
|
tooltip: '内容被转发或分享至其他平台或私信的次数,代表外扩传播意愿。',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
},
|
},
|
||||||
|
|||||||
@ -66,12 +66,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<template #customRender="{ record }">
|
<template #customRender="{ record }">
|
||||||
<template v-if="column.dataIndex === 'published_at'">
|
<template v-if="column.dataIndex === 'published_at'">
|
||||||
@ -80,6 +78,9 @@
|
|||||||
<template v-else-if="column.dataIndex === 'exposure_number'">
|
<template v-else-if="column.dataIndex === 'exposure_number'">
|
||||||
{{ formatNumberShow({ value: record.view_number * 10, showExactValue: true }) }}
|
{{ formatNumberShow({ value: record.view_number * 10, showExactValue: true }) }}
|
||||||
</template>
|
</template>
|
||||||
|
<template v-else-if="column.dataIndex === 'title'">
|
||||||
|
<TextoverTips :context="record.title" />
|
||||||
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
{{ formatTableField(column, record, true) }}
|
{{ formatTableField(column, record, true) }}
|
||||||
</template>
|
</template>
|
||||||
@ -110,6 +111,7 @@ import { TABLE_COLUMNS, INITIAL_QUERY, INITIAL_PAGE_INFO } from './constants';
|
|||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import { formatTableField, exactFormatTime, formatNumberShow } from '@/utils/tools';
|
import { formatTableField, exactFormatTime, formatNumberShow } from '@/utils/tools';
|
||||||
import { getMediaAccountBoardWorks } from '@/api/all/propertyMarketing';
|
import { getMediaAccountBoardWorks } from '@/api/all/propertyMarketing';
|
||||||
|
import TextoverTips from '@/components/text-over-tips/index.vue';
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const id = route.params.id;
|
const id = route.params.id;
|
||||||
|
|||||||
@ -117,7 +117,7 @@ export default defineComponent({
|
|||||||
return renderUpdateBtn();
|
return renderUpdateBtn();
|
||||||
} else if ([EnumErrorStatus.REQUEST, EnumErrorStatus.FREEZE].includes(error_status)) {
|
} else if ([EnumErrorStatus.REQUEST, EnumErrorStatus.FREEZE].includes(error_status)) {
|
||||||
return (
|
return (
|
||||||
<Tooltip title={statusInfo.value?.disabledBtnTooltip}>
|
<Tooltip title={statusInfo.value.disabledBtnTooltip}>
|
||||||
<Button type="primary" ghost size="small" disabled>
|
<Button type="primary" ghost size="small" disabled>
|
||||||
重新授权
|
重新授权
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@ -4,7 +4,19 @@
|
|||||||
-->
|
-->
|
||||||
<script lang="jsx">
|
<script lang="jsx">
|
||||||
import { ref, computed } from 'vue';
|
import { ref, computed } from 'vue';
|
||||||
import { Button, Modal, Form, FormItem, RadioGroup, Radio, Input, message, Tooltip, Upload, Switch } from 'ant-design-vue';
|
import {
|
||||||
|
Button,
|
||||||
|
Modal,
|
||||||
|
Form,
|
||||||
|
FormItem,
|
||||||
|
RadioGroup,
|
||||||
|
Radio,
|
||||||
|
Input,
|
||||||
|
message,
|
||||||
|
Tooltip,
|
||||||
|
Upload,
|
||||||
|
Switch,
|
||||||
|
} from 'ant-design-vue';
|
||||||
const { TextArea } = Input;
|
const { TextArea } = Input;
|
||||||
import AuthorizedAccountModal from '../authorized-account-modal';
|
import AuthorizedAccountModal from '../authorized-account-modal';
|
||||||
// import ImportPromptModal from '../import-prompt-modal';
|
// import ImportPromptModal from '../import-prompt-modal';
|
||||||
@ -275,6 +287,7 @@ export default {
|
|||||||
model={form.value}
|
model={form.value}
|
||||||
rules={rules}
|
rules={rules}
|
||||||
layout="horizontal"
|
layout="horizontal"
|
||||||
|
labelAlign="right"
|
||||||
labelCol={{ span: 4 }}
|
labelCol={{ span: 4 }}
|
||||||
wrapperCol={{ span: 20 }}
|
wrapperCol={{ span: 20 }}
|
||||||
>
|
>
|
||||||
@ -293,19 +306,14 @@ export default {
|
|||||||
<Upload
|
<Upload
|
||||||
ref={uploadRef}
|
ref={uploadRef}
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
customRequest={handleUpload}
|
||||||
custom-request={handleUpload}
|
|
||||||
accept=".xlsx,.xls"
|
accept=".xlsx,.xls"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
>
|
>
|
||||||
{{
|
|
||||||
'upload-button': () => (
|
|
||||||
<div class="upload-box">
|
<div class="upload-box">
|
||||||
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
||||||
<span class="tip">支持 xls, xlsx格式</span>
|
<span class="tip">支持 xls, xlsx格式</span>
|
||||||
</div>
|
</div>
|
||||||
),
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
) : (
|
) : (
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
|
|||||||
@ -36,15 +36,8 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.arco-upload-drag {
|
.ant-upload {
|
||||||
height: 120px;
|
width: 100%;
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
.arco-icon {
|
|
||||||
margin-bottom: 16px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.upload-box {
|
.upload-box {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -77,13 +70,13 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.upload-dragger {
|
// .upload-dragger {
|
||||||
border: 1px dashed #d9d9d9;
|
// border: 1px dashed #d9d9d9;
|
||||||
padding: 24px 0;
|
// padding: 24px 0;
|
||||||
text-align: center;
|
// text-align: center;
|
||||||
background: #fafafa;
|
// background: #fafafa;
|
||||||
cursor: pointer;
|
// cursor: pointer;
|
||||||
}
|
// }
|
||||||
.upload-error {
|
.upload-error {
|
||||||
color: #f53f3f;
|
color: #f53f3f;
|
||||||
margin-left: 8px;
|
margin-left: 8px;
|
||||||
|
|||||||
@ -67,12 +67,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #customRender="{ record }">
|
<template #customRender="{ record }">
|
||||||
|
|||||||
@ -22,13 +22,9 @@
|
|||||||
allowClear
|
allowClear
|
||||||
@change="handleSearch"
|
@change="handleSearch"
|
||||||
>
|
>
|
||||||
<Option
|
<Option v-for="(item, index) in PLATFORM_LIST" :key="index" :value="item.value" :label="item.label">{{
|
||||||
v-for="(item, index) in PLATFORM_LIST"
|
item.label
|
||||||
:key="index"
|
}}</Option>
|
||||||
:value="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
>{{ item.label }}</Option
|
|
||||||
>
|
|
||||||
</Select>
|
</Select>
|
||||||
<Select
|
<Select
|
||||||
v-model:value="query.operator_id"
|
v-model:value="query.operator_id"
|
||||||
@ -71,12 +67,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #customRender="{ record }">
|
<template #customRender="{ record }">
|
||||||
@ -89,7 +83,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</Table.Column>
|
</Table.Column>
|
||||||
<template #emptyText>
|
<template #emptyText>
|
||||||
<NoData text="暂无账户"/>
|
<NoData text="暂无账户" />
|
||||||
</template>
|
</template>
|
||||||
</Table>
|
</Table>
|
||||||
</div>
|
</div>
|
||||||
@ -147,12 +141,11 @@ const props = defineProps({
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const { dataSource, selectedRowKeys, selectedRows, handleSelect, handleSelectAll } =
|
const { dataSource, selectedRowKeys, selectedRows, handleSelect, handleSelectAll } = useTableSelectionWithPagination({
|
||||||
useTableSelectionWithPagination({
|
|
||||||
onSelectChange: () => {
|
onSelectChange: () => {
|
||||||
updateFormQuery();
|
updateFormQuery();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const query = ref({
|
const query = ref({
|
||||||
name: '',
|
name: '',
|
||||||
|
|||||||
@ -70,12 +70,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<template #customRender="{ record }">
|
<template #customRender="{ record }">
|
||||||
<template v-if="column.dataIndex === 'platform'">
|
<template v-if="column.dataIndex === 'platform'">
|
||||||
@ -87,7 +85,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</Table.Column>
|
</Table.Column>
|
||||||
<template #emptyText>
|
<template #emptyText>
|
||||||
<NoData text="暂无账号"/>
|
<NoData text="暂无账号" />
|
||||||
</template>
|
</template>
|
||||||
</Table>
|
</Table>
|
||||||
</div>
|
</div>
|
||||||
@ -143,12 +141,11 @@ const props = defineProps({
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const { dataSource, selectedRowKeys, selectedRows, handleSelect, handleSelectAll } =
|
const { dataSource, selectedRowKeys, selectedRows, handleSelect, handleSelectAll } = useTableSelectionWithPagination({
|
||||||
useTableSelectionWithPagination({
|
|
||||||
onSelectChange: () => {
|
onSelectChange: () => {
|
||||||
updateFormQuery();
|
updateFormQuery();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const query = ref({
|
const query = ref({
|
||||||
name: '',
|
name: '',
|
||||||
|
|||||||
@ -43,11 +43,13 @@
|
|||||||
class="account-table w-100%"
|
class="account-table w-100%"
|
||||||
bordered
|
bordered
|
||||||
:showSorterTooltip="false"
|
:showSorterTooltip="false"
|
||||||
@change="(pagination, filters, sorter) => {
|
@change="
|
||||||
|
(pagination, filters, sorter) => {
|
||||||
if (sorter && sorter.columnKey) {
|
if (sorter && sorter.columnKey) {
|
||||||
handleSorterChange(sorter.columnKey, sorter.order === 'ascend' ? 'asc' : 'desc');
|
handleSorterChange(sorter.columnKey, sorter.order === 'ascend' ? 'asc' : 'desc');
|
||||||
}
|
}
|
||||||
}"
|
}
|
||||||
|
"
|
||||||
>
|
>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
v-for="column in tableColumns"
|
v-for="column in tableColumns"
|
||||||
@ -61,13 +63,11 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
|
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template v-if="column.dataIndex === 'platform'" #customRender="{ record }">
|
<template v-if="column.dataIndex === 'platform'" #customRender="{ record }">
|
||||||
@ -75,9 +75,7 @@
|
|||||||
</template>
|
</template>
|
||||||
<template v-else-if="column.dataIndex === 'status'" #customRender="{ record }">
|
<template v-else-if="column.dataIndex === 'status'" #customRender="{ record }">
|
||||||
<div class="status-tag" :class="`status-tag-${record.status}`">
|
<div class="status-tag" :class="`status-tag-${record.status}`">
|
||||||
<span class="cts status-tag-text">{{
|
<span class="cts status-tag-text">{{ STATUS_LIST.find((item) => item.value === record.status)?.label }}</span>
|
||||||
STATUS_LIST.find((item) => item.value === record.status)?.label
|
|
||||||
}}</span>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="column.dataIndex === 'ai_evaluate'" #customRender="{ record }">
|
<template v-else-if="column.dataIndex === 'ai_evaluate'" #customRender="{ record }">
|
||||||
|
|||||||
@ -58,13 +58,11 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
|
<img v-if="column.dataIndex === 'ai_evaluate'" width="16" height="16" :src="icon5" class="mr-4px" />
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<template #customRender="{ record }">
|
<template #customRender="{ record }">
|
||||||
<template v-if="column.dataIndex === 'platform'">
|
<template v-if="column.dataIndex === 'platform'">
|
||||||
|
|||||||
@ -42,13 +42,11 @@
|
|||||||
accept=".xlsx,.xls,.docx,.doc"
|
accept=".xlsx,.xls,.docx,.doc"
|
||||||
:showUploadList="false"
|
:showUploadList="false"
|
||||||
>
|
>
|
||||||
<template #default>
|
|
||||||
<div class="upload-box">
|
<div class="upload-box">
|
||||||
<icon-plus size="14" class="mb-16px" />
|
<icon-plus size="14" class="mb-16px" />
|
||||||
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
||||||
<span class="tip">支持 xls, xlsx格式</span>
|
<span class="tip">支持 xls, xlsx格式</span>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
|
||||||
</Upload>
|
</Upload>
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
@ -154,7 +152,19 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { Modal, Form, FormItem, Button, Input, RadioGroup, Radio, Tooltip, message, Switch, Upload } from 'ant-design-vue';
|
import {
|
||||||
|
Modal,
|
||||||
|
Form,
|
||||||
|
FormItem,
|
||||||
|
Button,
|
||||||
|
Input,
|
||||||
|
RadioGroup,
|
||||||
|
Radio,
|
||||||
|
Tooltip,
|
||||||
|
message,
|
||||||
|
Switch,
|
||||||
|
Upload,
|
||||||
|
} from 'ant-design-vue';
|
||||||
import { ref, defineEmits } from 'vue';
|
import { ref, defineEmits } from 'vue';
|
||||||
|
|
||||||
import AuthorizedAccountModal from '../authorized-account-modal';
|
import AuthorizedAccountModal from '../authorized-account-modal';
|
||||||
|
|||||||
@ -70,12 +70,10 @@
|
|||||||
:ellipsis="true"
|
:ellipsis="true"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="flex items-center">
|
|
||||||
<span class="cts mr-4px">{{ column.title }}</span>
|
<span class="cts mr-4px">{{ column.title }}</span>
|
||||||
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
<Tooltip v-if="column.tooltip" :title="column.tooltip" placement="top">
|
||||||
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
<icon-question-circle class="tooltip-icon color-#737478" size="16" />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #customRender="{ record }">
|
<template #customRender="{ record }">
|
||||||
|
|||||||
@ -209,7 +209,7 @@ export const INITIAL_QUERY = {
|
|||||||
title: '',
|
title: '',
|
||||||
created_at: [],
|
created_at: [],
|
||||||
audit_started_at: [],
|
audit_started_at: [],
|
||||||
audit_platform: '',
|
audit_platform: undefined,
|
||||||
sort_column: undefined,
|
sort_column: undefined,
|
||||||
sort_order: undefined,
|
sort_order: undefined,
|
||||||
};
|
};
|
||||||
|
|||||||
@ -122,16 +122,13 @@ export default {
|
|||||||
<Upload
|
<Upload
|
||||||
ref={uploadRef}
|
ref={uploadRef}
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
|
||||||
class="w-fit"
|
class="w-fit"
|
||||||
custom-request={(option) => uploadImage(option, action)}
|
customRequest={(option) => uploadImage(option, action)}
|
||||||
accept=".jpg,.jpeg,.png,.gif,.webp"
|
accept=".jpg,.jpeg,.png,.gif,.webp"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
multiple
|
multiple
|
||||||
>
|
>
|
||||||
{{
|
<UploadBtn />
|
||||||
'upload-button': () => <UploadBtn />,
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -202,25 +202,18 @@ export default {
|
|||||||
<Upload
|
<Upload
|
||||||
ref={uploadRef}
|
ref={uploadRef}
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
customRequest={uploadVideo}
|
||||||
custom-request={uploadVideo}
|
|
||||||
accept=".mp4,.mov,.avi,.flv,.wmv"
|
accept=".mp4,.mov,.avi,.flv,.wmv"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
>
|
>
|
||||||
{{
|
{formData.value.videoInfo.uploadStatus === ENUM_UPLOAD_STATUS.DEFAULT ? (
|
||||||
'upload-button': () => {
|
|
||||||
if (formData.value.videoInfo.uploadStatus === ENUM_UPLOAD_STATUS.DEFAULT) {
|
|
||||||
return (
|
|
||||||
<div class="upload-box">
|
<div class="upload-box">
|
||||||
<icon-plus size="14" class="mb-16px color-#3C4043" />
|
<icon-plus size="14" class="mb-16px color-#3C4043" />
|
||||||
<span class="cts !color-#211F24">上传视频</span>
|
<span class="cts !color-#211F24">上传视频</span>
|
||||||
</div>
|
</div>
|
||||||
);
|
) : (
|
||||||
} else {
|
<Button type="text">替换视频</Button>
|
||||||
return <Button type="text">替换视频</Button>;
|
)}
|
||||||
}
|
|
||||||
},
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -12,6 +12,7 @@ import { slsWithCatch } from '@/utils/stroage.ts';
|
|||||||
|
|
||||||
import TextOverTips from '@/components/text-over-tips';
|
import TextOverTips from '@/components/text-over-tips';
|
||||||
import icon1 from '@/assets/img/media-account/icon-feedback-fail.png';
|
import icon1 from '@/assets/img/media-account/icon-feedback-fail.png';
|
||||||
|
import icon2 from '@/assets/img/media-account/icon-download.png';
|
||||||
|
|
||||||
// 状态枚举
|
// 状态枚举
|
||||||
const TASK_STATUS = {
|
const TASK_STATUS = {
|
||||||
@ -201,24 +202,19 @@ export default {
|
|||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<Upload
|
<Upload
|
||||||
action="/"
|
action="/"
|
||||||
draggable
|
|
||||||
multiple
|
multiple
|
||||||
customRequest={handleUpload}
|
customRequest={handleUpload}
|
||||||
accept=".xlsx,.xls,.docx,.doc,.mp4,.mov,.avi,.flv,.wmv,.m4v"
|
accept=".xlsx,.xls,.docx,.doc,.mp4,.mov,.avi,.flv,.wmv,.m4v"
|
||||||
show-file-list={false}
|
showUploadList={false}
|
||||||
>
|
>
|
||||||
{{
|
|
||||||
'upload-button': () => (
|
|
||||||
<div class="upload-box">
|
<div class="upload-box">
|
||||||
<icon-plus size="14" class="mb-16px" />
|
<icon-plus size="14" class="mb-16px" />
|
||||||
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
|
||||||
<span class="tip">支持文档(文本+图), 视频批量上传</span>
|
<span class="tip">支持文档(文本+图), 视频批量上传</span>
|
||||||
</div>
|
</div>
|
||||||
),
|
|
||||||
}}
|
|
||||||
</Upload>
|
</Upload>
|
||||||
<div class="flex items-center cursor-pointer mt-8px" onClick={handleDownloadTemplate}>
|
<div class="flex items-center cursor-pointer mt-8px" onClick={handleDownloadTemplate}>
|
||||||
<icon-download size="14" class="mr-4px !color-#6D4CFE" />
|
<img src={icon1} width="16" height="16" class="mr-4px" />
|
||||||
<span class="cts color-#6D4CFE">下载示例文档</span>
|
<span class="cts color-#6D4CFE">下载示例文档</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user