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

25
src/components/hover-image-preview/index.vue
View File

@ -3,13 +3,13 @@
* @Date: 2025-08-11 22:15:35
-->
<template>
<a-popover
:trigger="'hover'"
class="hover-big-image-preview-popover"
:position="props.position"
:mouse-enter-delay="props.enterDelay"
:mouse-leave-delay="props.leaveDelay"
:disabled="!props.src"
<Popover
trigger="hover"
:placement="props.position"
:mouseEnterDelay="props.enterDelay / 1000"
:mouseLeaveDelay="props.leaveDelay / 1000"
:open="props.src ? undefined : false"
overlayClassName="hover-big-image-preview-popover"
>
<template #content>
<div class="preview-container">
@ -18,17 +18,18 @@
</template>
<slot />
</a-popover>
</Popover>
</template>
<script lang="ts" setup>
import { Popover } from 'ant-design-vue';
// import { computed, onMounted, ref, watch } from 'vue';
// import type { ImageOrientation } from '@/utils/tools';
// import { getImageOrientationByUrl } from '@/utils/tools';
interface Props {
src: string;
position?: 'top' | 'tl' | 'tr' | 'bottom' | 'bl' | 'br' | 'left' | 'lt' | 'lb' | 'right' | 'rt' | 'rb';
position?: 'top' | 'topLeft' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom';
enterDelay?: number;
leaveDelay?: number;
}
@ -67,7 +68,11 @@ const props = withDefaults(defineProps<Props>(), {
<style lang="scss">
.hover-big-image-preview-popover {
.arco-popover-popup-content {
.ant-popover-content {
padding: 0 !important;
}
.ant-popover-inner {
padding: 16px !important;
border-radius: 8px;
background: #fff;

35
src/components/upload/FileUpload.vue
View File

@ -1,18 +1,16 @@
<template>
<a-upload
:custom-request="customRequest"
<Upload
:customRequest="customRequest"
action="/"
:limit="limit"
:maxCount="limit"
:fileList="fileList"
@change="onChange"
@success="handleSuccess"
@error="handleError"
/>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { Message } from '@arco-design/web-vue';
import { Upload, message } from 'ant-design-vue';
import { fetchImageUploadFile, fetchUploadFile } from '@/api/all';
import axios from 'axios';
@ -70,8 +68,10 @@ watch(
);
let previousFileListLength = 0;
//删除图片
const onChange = (fileList) => {
const onChange = (info) => {
const { fileList } = info;
// 如果删除了文件
if (fileList.length < previousFileListLength) {
if (props.limit === 1) {
if (fileList.length === 0) {
@ -87,27 +87,34 @@ const onChange = (fileList) => {
}
}
// 处理上传成功的文件
if (info.file.status === 'done' && info.file.response) {
handleSuccess(info.file);
} else if (info.file.status === 'error') {
handleError(info.file.error);
}
previousFileListLength = fileList.length;
};
const beforeUpload = (file, files) => {
if (props.limit > 0 && files.length >= props.limit) {
Message.warning(`最多只能上传 ${props.limit} 张图片`);
message.warning(`最多只能上传 ${props.limit} 张图片`);
return false; // 阻止上传
}
return true;
};
const handleError = (error) => {
Message.error('上传失败');
message.error('上传失败');
console.error(error);
};
const customRequest = async (option) => {
const { onProgress, onError, onSuccess, fileItem, name } = option;
const { onProgress, onError, onSuccess, file, name } = option;
try {
// 1. 获取预签名上传URL
const response = await fetchUploadFile({ suffix: getFileExtension(fileItem.file.name) });
const response = await fetchUploadFile({ suffix: getFileExtension(file.name) });
const preSignedUrl = response?.data?.upload_url;
if (!preSignedUrl) {
@ -115,9 +122,9 @@ const customRequest = async (option) => {
}
console.log('preSignedUrl', preSignedUrl);
// 2. 使用预签名URL上传文件
const blob = new Blob([fileItem.file], { type: fileItem.file.type });
const blob = new Blob([file], { type: file.type });
await axios.put(preSignedUrl, blob, {
headers: { 'Content-Type': fileItem.file.type },
headers: { 'Content-Type': file.type },
});
onSuccess(JSON.stringify(response));

36
src/components/upload/ImageUpload.vue
View File

@ -1,20 +1,19 @@
<template>
<a-upload
:custom-request="customRequest"
list-type="picture-card"
<Upload
:customRequest="customRequest"
listType="picture-card"
action="/"
:limit="limit"
:maxCount="limit"
:fileList="fileList"
image-preview
:showUploadList="{ showPreviewIcon: true, showRemoveIcon: true }"
@change="onChange"
@success="handleSuccess"
@error="handleError"
@preview="handlePreview"
/>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { Message } from '@arco-design/web-vue';
import { Upload, message } from 'ant-design-vue';
import { fetchImageUploadFile } from '@/api/all';
import axios from 'axios';
@ -72,8 +71,14 @@ watch(
);
let previousFileListLength = 0;
//删除图片
const onChange = (fileList) => {
const handlePreview = (file) => {
console.log('Preview file:', file);
};
const onChange = (info) => {
const { fileList } = info;
// 如果删除了文件
if (fileList.length < previousFileListLength) {
if (props.limit === 1) {
if (fileList.length === 0) {
@ -89,19 +94,26 @@ const onChange = (fileList) => {
}
}
// 处理上传成功的文件
if (info.file.status === 'done' && info.file.response) {
handleSuccess(info.file);
} else if (info.file.status === 'error') {
handleError(info.file.error);
}
previousFileListLength = fileList.length;
};
const beforeUpload = (file, files) => {
if (props.limit > 0 && files.length >= props.limit) {
Message.warning(`最多只能上传 ${props.limit} 张图片`);
message.warning(`最多只能上传 ${props.limit} 张图片`);
return false; // 阻止上传
}
return true;
};
const handleError = (error) => {
Message.error('上传失败');
message.error('上传失败');
console.error(error);
};

12
src/layouts/NotFound.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { Button } from 'ant-design-vue';
import { Button, Result } from 'ant-design-vue';
import { useRouter } from 'vue-router';
const router = useRouter();
@ -10,7 +10,7 @@ const back = () => {
<template>
<div class="content">
<a-result class="result" status="404" subtitle="页面跑路了" />
<Result class="result" status="404" sub-title="页面跑路了" />
<div class="operation-row flex justify-center">
<Button key="back" type="primary" @click="back">返回</Button>
</div>
@ -22,8 +22,10 @@ const back = () => {
position: absolute;
top: 50%;
left: 50%;
margin-left: -95px;
margin-top: -121px;
text-align: center;
transform: translate(-50%, -50%);
padding: 32px 32px 24px;
// margin-left: -95px;
// margin-top: -121px;
// text-align: center;
}
</style>

22
src/layouts/components/navbar/components/middle-side/style.scss
View File

@ -8,42 +8,42 @@
width: 560px;
height: 36px;
padding: 0 2px 0 16px;
border-radius: 50px;
background: rgba(255, 255, 255, 0.6);
border-radius: 50px !important;
background-color: rgba(255, 255, 255, 0.6) !important;
backdrop-filter: blur(8px);
border-color: #fff;
border-color: #fff !important;
box-shadow: none;
transition: all 0.3s;
display: flex;
align-items: center;
&.ant-input-affix-wrapper-focused {
border-color: #6d4cfe;
caret-color: #6d4cfe;
border-color: #6d4cfe !important;
caret-color: #6d4cfe !important;
}
&:hover {
border-color: #6d4cfe;
border-color: #6d4cfe !important;
}
.ant-input-suffix {
margin-inline-start: 0;
margin-inline-start: 0 !important;
}
.ant-input {
padding-right: 16px;
border: none !important;
background-color: transparent;
background-color: transparent !important;
box-shadow: none;
font-family: $font-family-regular;
color: #211f24;
font-size: 12px;
font-size: 12px !important;
font-style: normal;
font-weight: 400;
line-height: 20px;
&::placeholder {
color: #939499;
color: #939499 !important;
}
&:focus-within {
&::after {
border-width: 1px;
border-width: 1px !important;
}
}
}

101
src/layouts/components/navbar/components/right-side/index.vue
View File

@ -10,13 +10,11 @@
<div class="agent-entry mx-16px" :class="isAgentRoute ? 'agent' : ''" @click="handleAgentClick"></div>
<!-- 头像设置 -->
<a-dropdown trigger="click" class="layout-avatar-dropdown">
<a-avatar class="cursor-pointer" :size="32">
<img alt="avatar" src="@/assets/avatar.svg" />
</a-avatar>
<template #content>
<div>
<a-doption>
<Dropdown trigger="click" overlayClassName="layout-avatar-dropdown">
<img alt="avatar" src="@/assets/avatar.svg" class="cursor-pointer w-32px h-32px rounded-50%" />
<template #overlay>
<Menu>
<MenuItem>
<div class="h-full flex justify-between items-center w-100%" @click="setServerMenu">
<div class="flex items-center">
<img :src="icon1" class="w-16px h-16px mr-8px" />
@ -24,9 +22,10 @@
</div>
<icon-right size="12" />
</div>
</a-doption>
<a-dsubmenu value="option-1" position="lt" trigger="hover" class="enterprises-dsubmenu">
<a-doption class="enterprises-doption">
</MenuItem>
<MenuItem>
<SubMenu value="option-1" position="lt" trigger="hover" popupClassName="enterprises-dsubmenu">
<template #title>
<div class="flex justify-between w-100% h-full items-center">
<div class="flex items-center">
<img :src="icon3" class="w-16px h-16px mr-8px" />
@ -34,9 +33,8 @@
</div>
<icon-right size="12" />
</div>
</a-doption>
<template #content>
<a-doption
</template>
<MenuItem
v-for="(item, index) in enterprises"
:key="index"
class="rounded-8px hover:bg-#F2F3F5"
@ -49,10 +47,10 @@
<span>{{ item.name }}</span>
<icon-check v-if="enterpriseInfo?.id === item.id" size="16" />
</div>
</a-doption>
</template>
</a-dsubmenu>
<a-doption>
</MenuItem>
</SubMenu>
</MenuItem>
<MenuItem>
<div class="flex justify-between w-100% h-full items-center" @click="clickExit">
<div class="flex items-center">
<img :src="icon2" class="w-16px h-16px mr-8px" />
@ -60,10 +58,10 @@
</div>
<icon-right size="12" />
</div>
</a-doption>
</div>
</MenuItem>
</Menu>
</template>
</a-dropdown>
</Dropdown>
<ExitAccountModal ref="exitAccountModalRef" />
<DownloadCenterModal ref="downloadCenterModalRef" />
@ -71,6 +69,7 @@
</template>
<script setup>
import { Dropdown, Menu, MenuItem, SubMenu } from 'ant-design-vue';
import router from '@/router';
import { useEnterpriseStore } from '@/stores/modules/enterprise';
import { useSidebarStore } from '@/stores/modules/side-bar';
@ -137,20 +136,37 @@ const handleAgentClick = () => {
<style lang="scss">
.layout-avatar-dropdown,
.enterprises-dsubmenu {
.arco-dropdown {
.ant-dropdown-menu {
border-radius: 8px;
border: 1px solid var(--BG-300, #e6e6e8);
background: var(--BG-white, #fff);
padding: 12px 0px;
.arco-dropdown-option {
.ant-dropdown-menu-item {
padding: 0 12px;
margin-bottom: 4px;
&-content {
.ant-dropdown-menu-title-content {
display: flex;
height: 40px;
width: 100%;
padding: 10px 24px;
align-items: center;
.ant-dropdown-menu-submenu {
width: 100%;
.ant-dropdown-menu-submenu-title {
padding: 0;
&:hover {
background: none;
}
.ant-dropdown-menu-title-content {
padding: 0 !important;
}
}
.ant-dropdown-menu-submenu-arrow {
display: none;
}
}
}
.menu-item-text {
color: var(--Text-2, #3c4043);
font-family: $font-family-regular;
@ -159,13 +175,12 @@ const handleAgentClick = () => {
font-weight: 400;
line-height: 22px;
}
}
.arco-dropdown-option-content {
.ant-dropdown-menu-title-content {
border-radius: 8px !important;
}
&:not(.arco-dropdown-option-disabled):hover {
&:not(.ant-dropdown-menu-item):hover {
background-color: transparent;
.arco-dropdown-option-content {
.ant-dropdown-menu-title-content {
background: var(--BG-200, #f2f3f5);
}
}
@ -175,29 +190,29 @@ const handleAgentClick = () => {
.layout-avatar-dropdown,
.enterprises-dsubmenu {
width: 200px;
.arco-dropdown {
.ant-dropdown-menu {
padding: 12px 4px;
.arco-dropdown-option {
.ant-dropdown-menu-item {
padding: 0 !important;
&-content {
.ant-dropdown-menu-title-content {
padding: 0 12px !important;
}
}
}
.arco-dropdown-option-suffix {
.ant-dropdown-option-suffix {
display: none;
}
.enterprises-doption {
.arco-dropdown-option-content {
padding: 0 !important;
border-radius: 8px;
}
&:not(.arco-dropdown-option-disabled):hover {
background-color: transparent;
.arco-dropdown-option-content {
background: var(--BG-200, #f2f3f5);
}
}
}
// .enterprises-doption {
// .ant-dropdown-menu-title-content {
// padding: 0 !important;
// border-radius: 8px;
// }
// &:not(.ant-dropdown-option-disabled):hover {
// background-color: transparent;
// .ant-dropdown-menu-title-content {
// background: var(--BG-200, #f2f3f5);
// }
// }
// }
}
</style>

10
src/styles/components/ant-switch.scss Normal file
View File

@ -0,0 +1,10 @@
.ant-switch {
&.ant-switch-checked {
background: $color-primary;
&:not(ant-switch-disabled) {
&:hover {
background: $color-primary !important;
}
}
}
}

1
src/styles/components/index.scss
View File

@ -24,3 +24,4 @@
@import './ant-tabs.scss';
@import "./ant-notification.scss";
@import "./ant-tag.scss";
@import "./ant-switch.scss";

10
src/views/agent/index/index.vue
View File

@ -14,8 +14,8 @@
</Input>
<div v-for="(item, index) in list" :key="index">
<p class="span-title w-fit mb-16px">{{ item.name }}</p>
<a-row class="grid-demo" :gutter="[20, 16]" v-if="item.agent_products.length > 0">
<a-col :xs="24" :sm="12" :md="8" :lg="5" :xl="6" :xxl="4" v-for="(product, k) in item.agent_products" :key="k">
<Row class="grid-demo" :gutter="[20, 16]" v-if="item.agent_products.length > 0">
<Col :xs="24" :sm="12" :md="8" :lg="5" :xl="6" :xxl="4" v-for="(product, k) in item.agent_products" :key="k">
<div class="card-container cursor-pointer !h-252px" @click="goDetail(product?.type, product?.id)">
<div class="card-image h-120px w-100% bg-cover bg-center mb-8px" v-image-main-color="product.image_url">
<img class="object-contain h-full w-100%" :src="product?.image_url" />
@ -56,8 +56,8 @@
</div>
</div>
</div>
</a-col>
</a-row>
</Col>
</Row>
<NoData v-else />
</div>
@ -65,7 +65,7 @@
</template>
<script setup lang="ts">
import { Input } from 'ant-design-vue';
import { Input, Row, Col } from 'ant-design-vue';
import { useRouter } from 'vue-router';
import { getAgentList } from '@/api/all/agent';
import { formatNumberShow } from '@/utils/tools';

16
src/views/agent/work-flow/components/DynamicForm.vue
View File

@ -1,11 +1,11 @@
<template>
<div class="form-container">
<a-form :model="formData" ref="formRef" layout="vertical">
<a-form-item
<Form :model="formData" ref="formRef" layout="vertical">
<FormItem
v-for="(field, index) in formFields"
:key="index"
:label="field.props.label"
:field="field.props.name"
:name="field.props.name"
:rules="field.props.rules"
:tooltip="field.props.tip"
>
@ -21,9 +21,6 @@
v-model:value="formData[field.props.name]"
:placeholder="field?.props?.placeholder"
/>
<!-- <a-color-picker v-if="field.type === 'color_picker'"
style="width: 500px; height: 200px"
v-model="formData[field.props.name]" /> -->
<ImageUpload
v-if="field.type == 'upload_image'"
v-model="formData[field.props.name]"
@ -43,8 +40,8 @@
{{ option.label }}
</Option>
</Select>
</a-form-item>
</a-form>
</FormItem>
</Form>
<Button class="submit-btn" type="primary" :disabled="loading" @click="handleSubmit">提交执行</Button>
</div>
</template>
@ -52,9 +49,10 @@
import { defineProps, defineEmits } from 'vue';
import ImageUpload from '@/components/upload/ImageUpload.vue';
import FileUpload from '@/components/upload/FileUpload.vue';
import { Button, Input, Select } from 'ant-design-vue';
import { Button, Input, Select, Row, Col, Form } from 'ant-design-vue';
const { TextArea } = Input;
const { Option } = Select;
const { Item: FormItem } = Form;
const props = defineProps({
formFields: {

26
src/views/agent/work-flow/index.vue
View File

@ -42,15 +42,14 @@
{{ item.title }}
</div>
<div class="trigger-container">
<a-trigger
mouse-leave-delay="200"
position="top"
<Dropdown
:mouseLeaveDelay="200"
placement="top"
trigger="hover"
:auto-fit-position="false"
:unmount-on-close="true"
:overlayStyle="{ width: 'auto' }"
>
<SvgIcon size="12" name="svg-more" class="icon-more" />
<template #content>
<template #overlay>
<div class="">
<div class="history-item-dropdown">
<div class="dropdown-item">
@ -61,18 +60,19 @@
</div>
<div class="dropdown-item">
<SvgIcon size="12" name="svg-delete" class="icon color-#6D4CFE" />
<a-popconfirm
<Popconfirm
content="你确认删除该历史对话吗"
@ok="deleteHistory(item.id, index)"
type="error"
@confirm="deleteHistory(item.id, index)"
ok-text="确定"
cancel-text="取消"
>
<div class="text delete">删除</div>
</a-popconfirm>
</Popconfirm>
</div>
</div>
</div>
</template>
</a-trigger>
</Dropdown>
</div>
</div>
</div>
@ -95,7 +95,7 @@
<DynamicForm :formFields="formFields.form" :formData="formData" :loading="loading" @submit="handleSubmit" />
</div>
<div class="res h-full">
<a-spin v-if="loading" class="spin-center" tip="生成中。。。" />
<Spin v-if="loading" class="spin-center" tip="生成中。。。" />
<div
class="markdown-container"
v-if="workFlowRes.output != '' && loading === false"
@ -116,7 +116,7 @@
<script setup>
import { ref, reactive } from 'vue';
import { Modal, Tooltip, message } from 'ant-design-vue';
import { Modal, Tooltip, message, Popconfirm, Spin, Dropdown } from 'ant-design-vue';
import DynamicForm from './components/DynamicForm.vue';
import {
executeWorkFlow,

7
src/views/components/dataEngine/hotTranslation.vue
View File

@ -134,9 +134,9 @@
<p class="!mr-16px w-48px cts relative top-2px">原始来源</p>
<div class="flex flex-col">
<div v-for="item in topicInfo.industry_topic_sources" :key="item" class="mb-18px flex items-center">
<a-link style="background-color: initial" :href="item.link" target="_blank" class="!text-12px">{{
<Link :href="item.link" target="_blank" class="!text-12px">{{
item.title
}}</a-link>
}}</Link>
<img src="@/assets/img/hottranslation/xhs.png" width="16" height="16" />
</div>
</div>
@ -153,7 +153,8 @@
<script setup>
import topHeader from './topHeader.vue';
import { Modal, Button, Tooltip, Space, Table, Tag } from 'ant-design-vue';
import { Modal, Button, Tooltip, Space, Table, Tag, Typography } from 'ant-design-vue';
const { Link } = Typography;
import { ref, computed } from 'vue';
import { fetchIndustriesTree, fetchIndustryTopics, fetchIndustryTopicDetail } from '@/api/all/index';
import star1 from '@/assets/img/hottranslation/star-fill1.png';

4
src/views/components/dataEngine/keyBrandMovement.vue
View File

@ -48,7 +48,7 @@
</div>
</template>
<template v-else-if="column.slotName === 'volumeRate'" #customRender="{ record }">
<a-statistic :value="record.volume_rate * 100" />%
<Statistic :value="record.volume_rate * 100" />%
</template>
<template v-else-if="column.titleSlotName === 'hotTitle'" #title>
<Space>
@ -118,7 +118,7 @@
<script setup>
import topHeader from './topHeader.vue';
import { Tooltip, Space, Table } from 'ant-design-vue';
import { Tooltip, Space, Table, Statistic } from 'ant-design-vue';
import { fetchFocusBrandsList, fetchEventDynamicsList } from '@/api/all/index';
import { ref, onMounted, computed } from 'vue';
import star1 from '@/assets/img/hottranslation/star-fill1.png';

7
src/views/components/dataEngine/keyWord.vue
View File

@ -250,9 +250,9 @@
<p class="!mr-16px w-83px cts relative top-2px">原始来源</p>
<div class="flex flex-col">
<div v-for="item in topicInfo.industry_new_keyword_sources" :key="item" class="mb-18px flex items-center">
<a-link style="background-color: initial" :href="item.link" target="_blank" class="!text-12px">{{
<Link :href="item.link" target="_blank" class="!text-12px">{{
item.title
}}</a-link>
}}</Link>
<img src="@/assets/img/hottranslation/xhs.png" width="16" height="16" />
</div>
</div>
@ -269,7 +269,8 @@
<script setup>
import topHeader from './topHeader.vue';
import { Checkbox, Modal, Button, Tooltip, Space, Table, Tag } from 'ant-design-vue';
import { Modal, Button, Tooltip, Space, Table, Tag, Typography } from 'ant-design-vue';
const { Link } = Typography;
import {
fetchKeywordTrendsList,
fetchIndustryEmotions,

7
src/views/components/dataEngine/userPainPoints.vue
View File

@ -108,9 +108,9 @@
<p class="cts !mr-16px flex-shrink-0 w-60px">原始来源</p>
<div class="flex flex-col">
<div v-for="item in topicInfo.user_pain_point_sources" :key="item" class="mb-18px flex items-center">
<a-link style="background-color: initial" :href="item.link" target="_blank" class="!text-12px">{{
<Link :href="item.link" target="_blank" class="!text-12px">{{
item.title
}}</a-link>
}}</Link>
<img src="@/assets/img/hottranslation/xhs.png" width="16" height="16" />
</div>
</div>
@ -127,7 +127,8 @@
<script setup>
import topHeader from './topHeader.vue';
import { Modal, Button, Tooltip, Space, Table, Tag } from 'ant-design-vue';
import { Modal, Button, Tooltip, Space, Table, Tag, Typography } from 'ant-design-vue';
const { Link } = Typography;
import { fetchUserPainPointsDetail, fetchUserPainPointsList } from '@/api/all/index';
import { ref, onMounted, computed } from 'vue';
import top1 from '@/assets/img/captcha/top1.svg';

27
src/views/components/login/index.vue
View File

@ -65,9 +65,9 @@
<Space class="text-12px color-#737478 justify-start items-center">
<Checkbox v-model:checked="hasCheck" class="!text-12px mr-8px"></Checkbox>
<span class="text-12px color-#737478">{{ isLogin ? '登录' : '注册' }}即代表同意</span>
<a-link href="link" class="form-link color-#211F24" target="_blank">用户协议</a-link>
<Link href="link" class="form-link color-#211F24" target="_blank">用户协议</Link>
<span class="text-12px color-#737478">和</span>
<a-link href="link" class="form-link color-#211f24" target="_blank">隐私政策</a-link>
<Link href="link" class="form-link color-#211f24" target="_blank">隐私政策</Link>
</Space>
</Space>
</div>
@ -87,13 +87,13 @@
<span style="text-align: left; width: 100%">选择账号</span>
</template>
<div class="account-bind-container">
<a-card :bordered="false" class="bind-card">
<Card :bordered="false" class="bind-card">
<div class="bind-header">
<a-typography-text class="mobile-number">{{ mobileNumber }} 已在以下企业绑定了账号</a-typography-text>
<Typography.Text class="mobile-number">{{ mobileNumber }} 已在以下企业绑定了账号</Typography.Text>
</div>
<a-list :bordered="false" :split="false" class="account-list">
<a-list-item
<List :bordered="false" :split="false" class="account-list">
<List.Item
v-for="(account, index) in accounts"
:key="index"
class="account-item"
@ -104,17 +104,17 @@
}"
@click="selectAccount(account, index)"
>
<a-list-item-meta>
<List.Item.Meta>
<template #title>
<div style="display: flex; align-items: center; gap: 12px">
<Checkbox :checked="selectedAccountIndex === index" />
<a-typography-text>{{ account.name || '-' }}</a-typography-text>
<Typography.Text>{{ account.name || '-' }}</Typography.Text>
</div>
</template>
</a-list-item-meta>
</a-list-item>
</a-list>
</a-card>
</List.Item.Meta>
</List.Item>
</List>
</Card>
</div>
<template #footer>
<div class="flex">
@ -125,7 +125,8 @@
</template>
<script setup lang="ts">
import { Checkbox, Modal, Button, Form, FormItem, Input, Space, message } from 'ant-design-vue';
import { Checkbox, Modal, Button, Form, FormItem, Input, Space, message, Typography, Card, List } from 'ant-design-vue';
const { Link } = Typography;
import PuzzleVerification from './components/PuzzleVerification.vue';
import { fetchLoginCaptCha, fetchAuthorizationsCaptcha, fetchProfileInfo } from '@/api/all/login';
import { joinEnterpriseByInviteCode } from '@/api/all';

4
src/views/components/login/style.scss
View File

@ -69,6 +69,7 @@
width: 100%;
flex-direction: column;
align-items: start;
box-shadow: none;
}
.bind-header {
@ -111,6 +112,9 @@
background-color: rgba(109, 76, 254, 0.1);
box-shadow: 0 2px 4px 0 rgba(109, 76, 254, 0.5);
}
:deep(.ant-list-item-meta-title) {
margin: 0;
}
}
.account-item:deep(.arco-list-item-main) {

6
src/views/components/management/person/index.vue
View File

@ -7,7 +7,7 @@
<Table.Column title="用户信息" dataIndex="info">
<template #customRender="{ record }">
<div class="pt-3px pb-3px">
<a-avatar :image-url="record.head_image" :size="32" />
<Avatar :src="record.head_image" :size="32" />
{{ record.name || '-' }}
<icon-edit size="13" class="ml-8px" @click="openEditInfoModal" />
</div>
@ -33,7 +33,7 @@
>
<FormItem name="head_image" label="头像">
<div class="flex items-center">
<a-avatar :image-url="userInfoForm.file_url" :size="48" />
<Avatar :src="userInfoForm.file_url" :size="48" />
<span class="upload-button" @click="triggerFileInput">
<input
ref="uploadInputRef"
@ -85,7 +85,7 @@
</div>
</template>
<script setup lang="ts">
import { Button, Form, FormItem, Input, Table, message } from 'ant-design-vue';
import { Button, Form, FormItem, Input, Table, message, Avatar } from 'ant-design-vue';
import Container from '@/components/container.vue';
import Modal from '@/components/modal.vue';
import PuzzleVerification from '@/views/components/login/components/PuzzleVerification.vue';

4
src/views/components/workplace/index.vue
View File

@ -6,7 +6,7 @@
<div class="m-auto mt-24px max-w-1000px">
<Container title="推荐产品" class="container-body">
<div class="grid grid-cols-3 gap-20px">
<Product v-for="product in products" :key="product.id" :product="product" @refresh="getProductList" />
<!-- <Product v-for="product in products" :key="product.id" :product="product" @refresh="getProductList" /> -->
</div>
<NoData v-if="products.length === 0" />
</Container>
@ -20,7 +20,7 @@
</template>
<script setup lang="ts">
import Container from '@/components/container.vue';
import Product from '@/views/components/workplace/modules/product.vue';
// import Product from '@/views/components/workplace/modules/product.vue';
import Case from '@/views/components/workplace/modules/case.vue';
import { fetchProductList, fetchSuccessCaseList } from '@/api/all/index';
import { ref, onMounted } from 'vue';

15
src/views/components/workplace/modules/product.vue
View File

@ -6,12 +6,11 @@
<Tag v-if="props.product.status === Status.Disable" class="status status-disable">未开通</Tag>
<Tag v-if="props.product.status === Status.EXPIRED" class="status status-expired">已到期</Tag>
<Tag v-if="props.product.status === Status.TRIAL_ENDS" class="status status-expired">试用结束</Tag>
<a-countdown
<Countdown
v-if="props.product.status === Status.ON_TRIAL"
class="status-on-trill"
title="试用中"
:value="1000 * (props.product.expired_at ?? 0)"
:now="now()"
format="D天H时m分s秒"
/>
</div>
@ -60,9 +59,10 @@
>
联系客服
</Button>
<a-popconfirm focusLock title="试用产品" content="确定试用该产品吗？" @ok="handleTrial(props.product.id)">
<Popconfirm title="试用产品" ok-text="确定" cancel-text="取消" @confirm="handleTrial(props.product.id)">
<template #description>确定试用该产品吗？</template>
<Button v-if="props.product.status === Status.Disable" size="small" type="default" ghost> 免费试用7天 </Button>
</a-popconfirm>
</Popconfirm>
</div>
<CustomerServiceModal v-model:open="visible" centered/>
</div>
@ -73,7 +73,8 @@ import { now } from '@vueuse/core';
import { trialProduct } from '@/api/all';
import { useRouter } from 'vue-router';
import CustomerServiceModal from '@/components/customer-service-modal.vue';
import { Button, message, Tag } from 'ant-design-vue';
import { Button, message, Tag, Statistic, Popconfirm } from 'ant-design-vue';
const { Countdown } = Statistic;
import { useSidebarStore } from '@/stores/modules/side-bar';
import { useEnterpriseStore } from '@/stores/modules/enterprise';
@ -177,7 +178,7 @@ const gotoModule = (menuId: number) => {
border-radius: 4px;
background: rgba(255, 245, 222, 1);
:deep(.arco-statistic-title) {
:deep(.ant-statistic-title) {
font-family: $font-family-medium;
font-weight: 400;
font-size: 12px;
@ -187,7 +188,7 @@ const gotoModule = (menuId: number) => {
padding: 0;
}
:deep(.arco-statistic-value) {
:deep(.ant-statistic-content) {
font-family: $font-family-medium;
font-weight: 400;
font-size: 10px;

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

@ -42,7 +42,7 @@
</div>
<div class="filter-row-item" v-if="query.audit_status === AuditStatus.Pending">
<span class="label">上传时间</span>
<a-range-picker
<DatePicker.RangePicker
v-model="created_at"
size="medium"
allow-clear
@ -69,7 +69,7 @@
</div>
<div class="filter-row-item">
<span class="label">审核时间</span>
<a-range-picker
<DatePicker.RangePicker
v-model="audit_started_at"
size="medium"
allow-clear
@ -99,7 +99,7 @@
</template>
<script setup>
import { Button, Input, Select, Space } from 'ant-design-vue';
import { Button, Input, Select, Space, DatePicker } from 'ant-design-vue';
const { Option } = Select;
import { defineEmits, defineProps } from 'vue';
import { PLATFORMS } from '@/views/material-center/components/finished-products/manuscript/check-list/constants';

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

@ -1,5 +1,5 @@
<script lang="jsx">
import { Drawer, Image } from '@arco-design/web-vue';
import { Drawer, Image } from 'ant-design-vue';
import TextOverTips from '@/components/text-over-tips';
import icon1 from '@/assets/img/error-img.png';
@ -32,12 +32,12 @@ export default {
return () => (
<Drawer
title="审核列表"
visible={visible.value}
v-model:open={visible.value}
width={420}
class="check-list-drawer-xt"
footer={false}
header={false}
onCancel={onClose}
rootClassName="check-list-drawer-xt"
footer={null}
closable={false}
onClose={onClose}
>
<div class="flex justify-between items-center h-56px px-24px">
<div class="flex items-center">
@ -61,13 +61,12 @@ export default {
height={48}
preview={false}
src={item.cover}
class="!rounded-4px mr-8px"
fit="cover"
class="!rounded-4px"
v-slots={{
error: () => <img src={icon1} class="w-full h-full" />,
}}
/>
<div class="flex-1 overflow-hidden flex flex-col items-start">
<div class="flex-1 overflow-hidden flex flex-col items-start ml-8px">
<TextOverTips context={item.title} class={`cts !color-#211F24 title mb-4px !text-14px`} />
<p class="cts !text-14px">{`合规程度：${
item.ai_review?.compliance_level ? `${item.ai_review?.compliance_level}%` : '-'

8
src/views/material-center/components/finished-products/manuscript/check/components/check-list-drawer/style.scss
View File

@ -1,10 +1,9 @@
.check-list-drawer-xt {
.arco-drawer-mask {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
.ant-drawer-mask {
background-color: transparent;
}
.arco-drawer {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
.arco-drawer-body {
.ant-drawer-body {
overflow: hidden;
display: flex;
flex-direction: column;
@ -42,4 +41,3 @@
}
}
}
}

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

@ -137,9 +137,7 @@ export default {
};
const uploadImage = async (option, action = 'upload') => {
const {
fileItem: { file },
} = option;
const { file } = option;
const { name, size, type } = file;
const response = await getImagePreSignedUrl({ suffix: getFileExtension(name) });

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

@ -1,5 +1,5 @@
<script lang="jsx">
import { Image } from '@arco-design/web-vue';
import { Image } from 'ant-design-vue';
import { Swiper, SwiperSlide } from 'swiper/vue';
import TextOverTips from '@/components/text-over-tips';
@ -56,13 +56,13 @@ export default {
height={48}
preview={false}
src={item.cover}
class="!rounded-4px mr-8px"
class="!rounded-4px"
fit="cover"
v-slots={{
error: () => <img src={icon1} class="w-full h-full" />,
}}
/>
<div class="flex-1 overflow-hidden flex flex-col items-start">
<div class="flex-1 overflow-hidden flex flex-col items-start ml-8px">
<TextOverTips context={item.title} class={`cts !color-#211F24 title mb-4px`} />
<p class="cts">{`合规程度：${item.ai_review?.compliance_level ? `${item.ai_review?.compliance_level}%` : '-'}`}</p>
</div>

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

@ -23,25 +23,23 @@
/>
</div>
</div>
<a-upload
<Upload
v-if="files.length < 18"
ref="uploadRef"
action="/"
draggable
:custom-request="(option) => emit('upload', option)"
:customRequest="(option) => emit('upload', option)"
accept=".jpg,.jpeg,.png,.gif,.webp"
:show-file-list="false"
:showUploadList="false"
multiple
class="!flex !items-center"
:limit="18 - files.length"
>
<template #upload-button>
<template #default>
<div class="upload-box">
<icon-plus size="14" class="mb-16px color-#3C4043" />
<span class="cts !color-#211F24">上传图片</span>
</div>
</template>
</a-upload>
</Upload>
</VueDraggable>
</div>
</FormItem>
@ -49,7 +47,7 @@
<script setup>
import { VueDraggable } from 'vue-draggable-plus';
import { FormItem} from 'ant-design-vue';
import { FormItem, Upload } from 'ant-design-vue';
const props = defineProps({
files: {

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

@ -131,9 +131,7 @@ export default {
formData.value.videoInfo.uploadStatus = ENUM_UPLOAD_STATUS.UPLOADING;
emit('updateVideoInfo', formData.value.videoInfo);
const {
fileItem: { file },
} = option;
const { file } = option;
setVideoInfo(file);
const response = await getVideoPreSignedUrl({ suffix: getFileExtension(file.name) });
@ -164,9 +162,7 @@ export default {
};
// 文件上传处理
const uploadImage = async (option) => {
const {
fileItem: { file },
} = option;
const { file } = option;
// 验证文件数量
if (formData.value.files?.length >= 18) {

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

@ -52,7 +52,7 @@
</div>
<div class="filter-row-item">
<span class="label">上传时间</span>
<a-range-picker
<DatePicker.RangePicker
v-model="created_at"
size="medium"
allow-clear
@ -80,7 +80,7 @@
</template>
<script setup>
import { Button, Input } from 'ant-design-vue';
import { Button, Input, DatePicker } from 'ant-design-vue';
import { defineEmits, defineProps } from 'vue';
import { CHECK_STATUS } from '@/views/material-center/components/finished-products/manuscript/list/constants';
import CommonSelect from '@/components/common-select';

6
src/views/material-center/components/raw-material/components/filter-block/index.vue
View File

@ -25,8 +25,8 @@
</div>
<div class="filter-row-item">
<span class="label">上传时间</span>
<a-range-picker
v-model="created_at"
<DatePicker.RangePicker
v-model:value="created_at"
size="medium"
allow-clear
format="YYYY-MM-DD"
@ -54,7 +54,7 @@
<script setup>
import { defineEmits, defineProps, ref, nextTick } from 'vue';
import { Button, Input } from 'ant-design-vue';
import { Button, Input, DatePicker } from 'ant-design-vue';
import dayjs from 'dayjs';
const props = defineProps({

15
src/views/property-marketing/brands/brand-materials/index.vue
View File

@ -92,15 +92,14 @@
<Table.Column :width="80" title="操作" dataIndex="optional">
<template #customRender="{ record }">
<Space>
<a-popconfirm
content="确定删除吗?"
type="warning"
ok-text="确认删除"
cancel-text="取消"
@ok="deleteBrand(record.id)"
<Popconfirm
title="确定删除吗?"
okText="确认删除"
cancelText="取消"
@confirm="deleteBrand(record.id)"
>
<icon-delete></icon-delete>
</a-popconfirm>
</Popconfirm>
<Button type="outline" class="edit-btn" size="small" @click="handleEdit(record.id)">编辑</Button>
</Space>
</template>
@ -127,7 +126,7 @@
<script setup>
import { ref, computed, reactive, onMounted } from 'vue';
import { IconDelete } from '@arco-design/web-vue/es/icon';
import { Button, Modal, Space, Form, FormItem, Pagination, Input, Table, message } from 'ant-design-vue';
import { Button, Modal, Space, Form, FormItem, Pagination, Input, Table, message, Popconfirm } from 'ant-design-vue';
const { TextArea } = Input;
import {

3
src/views/property-marketing/brands/brand-materials/style.scss
View File

@ -37,6 +37,9 @@
}
:deep(.ant-popconfirm-buttons) {
display: flex;
}
:deep(.arco-input-wrapper),
:deep(.arco-select-view-single),

4
src/views/property-marketing/intelligent-solution/businessAnalysisReport.vue
View File

@ -18,7 +18,7 @@
<div class="filter-row-item flex items-center">
<span class="label">时间筛选</span>
<Space class="w-240px">
<a-range-picker size="medium" allow-clear format="YYYY-MM-DD HH:mm" class="w-100%" />
<DatePicker.RangePicker allowClear format="YYYY-MM-DD HH:mm" class="w-100%" />
</Space>
</div>
@ -70,7 +70,7 @@
<script setup lang="ts">
import { reactive, ref } from 'vue';
import { Button, Input, Space, Table, Pagination } from 'ant-design-vue';
import { Button, Input, Space, Table, Pagination, DatePicker } from 'ant-design-vue';
const pageInfo = reactive({
page: 1,

4
src/views/property-marketing/intelligent-solution/competitiveProductAnalysisReport.vue
View File

@ -20,7 +20,7 @@
<div class="filter-row-item flex items-center">
<span class="label">时间筛选</span>
<Space class="w-240px">
<a-range-picker size="medium" allow-clear format="YYYY-MM-DD HH:mm" class="w-100%" />
<DatePicker.RangePicker allow-clear format="YYYY-MM-DD HH:mm" class="w-100%" />
</Space>
</div>
@ -99,7 +99,7 @@
</template>
<script setup lang="ts">
import { Button, Input, Space, Pagination, Table } from 'ant-design-vue';
import { Button, Input, Space, Pagination, Table, DatePicker } from 'ant-design-vue';
import { reactive, ref } from 'vue';
const pageInfo = reactive({

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

@ -23,8 +23,8 @@
</div>
<div class="filter-row-item flex items-center">
<span class="label">发布日期</span>
<a-range-picker
v-model="published_at"
<DatePicker.RangePicker
v-model:value="published_at"
size="medium"
class="!w-260px"
allow-clear
@ -105,7 +105,7 @@
</template>
<script setup>
import { Button, Input, Tooltip, Table, Pagination } from 'ant-design-vue';
import { Button, Input, Tooltip, Table, Pagination, DatePicker } from 'ant-design-vue';
import { TABLE_COLUMNS, INITIAL_QUERY, INITIAL_PAGE_INFO } from './constants';
import { useRoute } from 'vue-router';
import { formatTableField, exactFormatTime, formatNumberShow } from '@/utils/tools';

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

@ -4,20 +4,17 @@
-->
<template>
<div class="card-container">
<a-spin
<Spin
v-for="(item, index) in dataSource"
:key="index"
:loading="isSyncing(item)"
:spinning="isSyncing(item)"
tip="更新数据中..."
class="card-item"
:class="{
checked: isSelected(item),
}"
:wrapperClassName="`card-item ${isSelected(item) ? 'checked' : ''}`"
>
<template #icon>
<icon-sync size="24" />
</template>
<Checkbox :checked="isSelected(item)" :value="item.id" @change="toggleSelect(item)"></Checkbox>
<Checkbox :checked="isSelected(item)" :value="item.id" @change="toggleSelect(item)" class="relative top--2px"></Checkbox>
<div class="ml-8px flex-1">
<Tooltip title="点击查看账号详情">
<p class="name cursor-pointer hover:!color-#6d4cfe" @click="goDetail(item)">{{ item.name || '-' }}</p>
@ -121,7 +118,7 @@
}}</Button>
</div>
</div>
</a-spin>
</Spin>
<PauseAccountPatchModal ref="pauseAccountPatchModalRef" @success="emits('update')" />
<ReauthorizeAccountModal ref="reauthorizeAccountModalRef" @update="emits('update')" />
<AuthorizedAccountModal ref="authorizedAccountModalRef" @update="emits('update')" />
@ -130,7 +127,7 @@
<script setup>
import { defineProps, ref, computed, inject } from 'vue';
import { Checkbox, Button, Tooltip } from 'ant-design-vue';
import { Checkbox, Button, Tooltip, Spin } from 'ant-design-vue';
import { useRouter } from 'vue-router';
import { deleteSyncStatus } from '@/api/all/propertyMarketing';
import { exactFormatTime } from '@/utils/tools';

8
src/views/property-marketing/media-account/account-manage/components/account-table/style.scss
View File

@ -4,13 +4,17 @@
// grid-template-rows: repeat(2, 1fr); /* 2行 */
grid-template-columns: repeat(4, 1fr); /* 4列 */
gap: 20px;
:deep(.ant-spin-container) {
height: 100%;
width: 100%;
display: flex;
align-items: flex-start;
}
.card-item {
border-radius: 8px;
// border: 1px solid var(--BG-300, #e6e6e8);
background: var(--BG-white, #fff);
padding: 12px 16px 16px;
display: flex;
align-items: flex-start;
position: relative;
.name {
color: var(--Text-1, #211f24);

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

@ -16,12 +16,12 @@
<div class="flex flex-col items-center">
<!-- 加载中状态 -->
<template v-if="modalState === MODAL_STATE.LOADING">
<a-progress
<Progress
:percent="progress"
color="#6D4CFE"
trackColor="#E6E6E8"
size="large"
:stroke-width="4"
strokeColor="#6D4CFE"
trailColor="#E6E6E8"
size="default"
:strokeWidth="4"
type="circle"
/>
<p class="s2 mt-16px">数据同步和初始化中，请勿关闭窗口。</p>
@ -41,7 +41,7 @@
<!-- 二维码加载中或失败 -->
<template v-if="modalState === MODAL_STATE.QR_LOADING || modalState === MODAL_STATE.QR_FAILED">
<div class="relative w-160px h-160px">
<a-image :src="icon1" width="160" height="160" />
<Image :src="icon1" :width="160" :height="160" />
<div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center">
<img
v-if="modalState === MODAL_STATE.QR_FAILED"
@ -63,7 +63,7 @@
</div>
</template>
<!-- 正常二维码 -->
<a-image v-else :src="qrCodeUrl" width="160" height="160" />
<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" />
@ -94,7 +94,7 @@
<script setup>
import { defineExpose, ref, computed } from 'vue';
import { Button, Modal, message } from 'ant-design-vue';
import { Button, Modal, message, Image, Progress } from 'ant-design-vue';
import { getAuthorizedImage, getMediaAccountsAuthorizedStatus } from '@/api/all/propertyMarketing';
import SyncDataModal from '../sync-data-modal';
@ -242,12 +242,12 @@ const getAuthorizedStatus = async () => {
const startFakeProgressPolling = () => {
clearFakeProgressTimer();
progressTimer = setInterval(() => {
if (modalState.value === MODAL_STATE.LOADING && progress.value < 0.99) {
const step = Math.random() * 0.04 + 0.01;
progress.value = Math.min(progress.value + step, 0.99);
if (modalState.value === MODAL_STATE.LOADING && progress.value < 99) {
const step = Math.random() * 4 + 1;
progress.value = Math.min(progress.value + step, 99);
progress.value = Number(progress.value.toFixed(2));
} else if (modalState.value === MODAL_STATE.LOADING && progress.value >= 0.99) {
progress.value = 0.99; // 卡在99%
} else if (modalState.value === MODAL_STATE.LOADING && progress.value >= 99) {
progress.value = 99; // 卡在99%
} else {
clearFakeProgressTimer();
clearStatusPollingTimer();

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

@ -16,12 +16,12 @@
<div class="flex flex-col items-center">
<!-- 加载中状态 -->
<template v-if="modalState === MODAL_STATE.LOADING">
<a-progress
<Progress
:percent="progress"
color="#6D4CFE"
trackColor="#E6E6E8"
size="large"
:stroke-width="4"
strokeColor="#6D4CFE"
trailColor="#E6E6E8"
size="default"
:strokeWidth="4"
type="circle"
/>
<p class="s2 mt-16px">数据同步和初始化中，请勿关闭窗口。</p>
@ -55,7 +55,7 @@
<!-- 二维码加载中或失败 -->
<template v-if="modalState === MODAL_STATE.QR_LOADING || modalState === MODAL_STATE.QR_FAILED">
<div class="relative w-160px h-160px">
<a-image :src="icon1" width="160" height="160" />
<Image :src="icon1" :width="160" :height="160" />
<div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center">
<img
v-if="modalState === MODAL_STATE.QR_FAILED"
@ -78,7 +78,7 @@
</template>
<!-- 正常二维码 -->
<a-image v-else :src="qrCodeUrl" width="160" height="160" />
<Image v-else :src="qrCodeUrl" :width="160" :height="160" />
<!-- 二维码失效遮罩 -->
<div v-if="modalState === MODAL_STATE.QR_EXPIRED" class="mask cursor-pointer" @click="handleRefreshQrCode">
@ -112,7 +112,7 @@
<script setup>
import { defineExpose, ref, computed } from 'vue';
import { Button, Modal, message } from 'ant-design-vue';
import { Button, Modal, message, Image, Progress } from 'ant-design-vue';
import { getMediaAccountsAuthorizedStatus, getAuthorizedImage } from '@/api/all/propertyMarketing';
import SyncDataModal from '../sync-data-modal';
@ -259,12 +259,12 @@ const getAuthorizedStatus = async () => {
const startFakeProgressPolling = () => {
clearFakeProgressTimer();
progressTimer = setInterval(() => {
if (modalState.value === MODAL_STATE.LOADING && progress.value < 0.99) {
const step = Math.random() * 0.04 + 0.01;
progress.value = Math.min(progress.value + step, 0.99);
if (modalState.value === MODAL_STATE.LOADING && progress.value < 99) {
const step = Math.random() * 4 + 1;
progress.value = Math.min(progress.value + step, 99);
progress.value = Number(progress.value.toFixed(2));
} else if (modalState.value === MODAL_STATE.LOADING && progress.value >= 0.99) {
progress.value = 0.99; // 卡在99%
} else if (modalState.value === MODAL_STATE.LOADING && progress.value >= 99) {
progress.value = 99; // 卡在99%
} else {
clearFakeProgressTimer();
clearStatusPollingTimer();

8
src/views/property-marketing/project-manage/project-list/components/add-project-modal/index.vue
View File

@ -9,9 +9,9 @@
@cancel="onClose"
>
<div class="content">
<a-steps changeable :current="currentStep" @change="setCurrent" class="mb-24px mx-79px">
<a-step v-for="(step, index) in STEPS" :key="index">{{ step.label }}</a-step>
</a-steps>
<Steps changeable :current="currentStep" @change="setCurrent" class="mb-24px mx-79px w-full">
<Steps.Step v-for="(step, index) in STEPS" :key="index" :title="step.label" />
</Steps>
<component :is="activeComp" v-model:formQuery="formQuery" ref="compRef" />
</div>
@ -31,7 +31,7 @@
<script setup>
import { postAddProject, putProject, getProjectDetail } from '@/api/all/propertyMarketing';
import { Button, Modal } from 'ant-design-vue';
import { Button, Modal, Steps } from 'ant-design-vue';
import StepOne from './stepOne.vue';
import StepTwo from './stepTwo.vue';

13
src/views/property-marketing/put-account/account-dashboard/components/echarts-item/index.vue
View File

@ -1,21 +1,20 @@
<template>
<a-card :bordered="false" class="chart-container" ref="chartContainer">
<Card :bordered="false" class="chart-container !p-0" ref="chartContainer">
<template #title>
<span class="a-card-title">{{ title.name }}</span>
<a-popover position="tl">
<Tooltip position="tl" :title="title.popover">
<icon-question-circle />
<template #content>
<p style="margin: 0">{{ title.popover }}</p>
</template>
</a-popover>
</Tooltip>
</template>
<NoData v-if="isChartEmpty" text="暂无数据" />
<div v-else class="chart" ref="chartEl" :style="{ height: height + 'px' }"></div>
</a-card>
</Card>
</template>
<script setup>
import { Tooltip, Card } from "ant-design-vue"
import { ref, onMounted, watch, onBeforeUnmount } from 'vue';
import * as echarts from 'echarts';

12
src/views/property-marketing/put-account/account-dashboard/index.vue
View File

@ -33,7 +33,7 @@
<div class="filter-row flex">
<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-240px" />
<DatePicker.RangePicker v-model:value="query.data_time" allowClear format="YYYY-MM-DD" class="!w-240px" />
</div>
<Button type="primary" ghost class="mr-12px" @click="handleSearch">
<template #icon>
@ -51,23 +51,23 @@
</div>
</div>
<div class="table-wrap rounded-8px py-5px flex-1 flex flex-col" v-if="onLoading == false">
<a-row :gutter="[24, 24]">
<a-col v-for="(chart, key) in chartConfigs" :key="chart.dataKey" :span="12">
<Row :gutter="[24, 24]">
<Col v-for="(chart, key) in chartConfigs" :key="chart.dataKey" :span="12">
<div>
<EchartsItem
:chartData="{ date: chart.date, series_data: chart.series_data }"
:title="{ name: chart.title.name, popover: chart.title.popover }"
/>
</div>
</a-col>
</a-row>
</Col>
</Row>
</div>
</div>
</template>
<script setup lang="ts">
import EchartsItem from './components/echarts-item/index';
import { PLATFORM_LIST } from '@/utils/platform';
import { Button, Select, Tabs } from 'ant-design-vue';
import { Button, Select, Tabs, Row, Col, DatePicker } from 'ant-design-vue';
import {
getPlacementAccountsTrend,
getPlacementAccountProjectsTrend,

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

@ -52,8 +52,8 @@
</div>
<div class="filter-row-item">
<span class="label">时间筛选</span>
<a-range-picker
v-model="query.data_time"
<DatePicker.RangePicker
v-model:value="query.data_time"
size="medium"
:allow-clear="false"
format="YYYY-MM-DD"
@ -81,7 +81,7 @@
<script setup>
import { reactive, defineEmits, defineProps } from 'vue';
import { Button, Input } from 'ant-design-vue';
import { Button, Input, DatePicker } from 'ant-design-vue';
import {
getPlacementAccountProjectGroupsList,
getPlacementAccountsList,

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

@ -35,22 +35,21 @@
<!-- 默认状态 -->
<div class="upload-block">
<template v-if="uploadStatus === UploadStatus.DEFAULT">
<a-upload
<Upload
ref="uploadRef"
action="/"
draggable
:custom-request="handleUpload"
:customRequest="handleUpload"
accept=".xlsx,.xls,.docx,.doc"
:show-file-list="false"
:showUploadList="false"
>
<template #upload-button>
<template #default>
<div class="upload-box">
<icon-plus size="14" class="mb-16px" />
<span class="text mb-4px">点击或拖拽文件到此处上传</span>
<span class="tip">支持 xls, xlsx格式</span>
</div>
</template>
</a-upload>
</Upload>
</template>
<template v-else>
<div class="flex items-center">
@ -138,7 +137,7 @@
<icon-question-circle size="14" class="ml-4px color-#737478" />
</Tooltip>
</template>
<a-switch v-model="form.is_sync_project" size="medium" :checked-value="1" :unchecked-value="0" />
<Switch v-model:checked="form.is_sync_project" size="middle" :checkedValue="1" :unCheckedValue="0" />
</FormItem>
</template>
</Form>
@ -155,7 +154,7 @@
</template>
<script setup>
import { Modal, Form, FormItem, Button, Input, RadioGroup, Radio, Tooltip, message } 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 AuthorizedAccountModal from '../authorized-account-modal';
@ -239,12 +238,12 @@ const confirmBtnText = computed(() => {
});
const handleUpload = async (option) => {
const { fileItem } = option;
const { file: uploadedFile } = option;
uploadStatus.value = UploadStatus.WAITING;
file.value = fileItem.file;
fileName.value = fileItem.name;
file.value = uploadedFile;
fileName.value = uploadedFile.name;
};
function removeFile() {

6
src/views/property-marketing/put-account/account-manage/components/add-account-modal/style.scss
View File

@ -36,8 +36,8 @@
}
}
}
.arco-upload-drag {
height: 120px;
.ant-upload {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
@ -47,6 +47,8 @@
}
}
.upload-box {
cursor: pointer;
width: 100%;
display: flex;
height: 120px;
padding: 0 16px;

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

@ -15,12 +15,12 @@
>
<div class="flex flex-col items-center">
<template v-if="isLoading">
<a-progress
<Progress
:percent="progress"
color="#6D4CFE"
trackColor="#E6E6E8"
size="large"
:stroke-width="4"
strokeColor="#6D4CFE"
trailColor="#E6E6E8"
size="default"
:strokeWidth="4"
type="circle"
/>
<p class="s2 mt-16px">数据同步和初始化中，请勿关闭窗口。</p>
@ -61,7 +61,7 @@
<script setup>
// 添加Modal导入
import { Modal, Form, FormItem, Input } from 'ant-design-vue';
import { Modal, Form, FormItem, Input, Progress } from 'ant-design-vue';
import dayjs from 'dayjs';
import { Button } from 'ant-design-vue';
import { defineExpose, ref, computed, defineEmits } from 'vue';
@ -217,12 +217,12 @@ const startLoading = async () => {
const startFakeProgressPolling = () => {
clearFakeProgressTimer();
progressTimer = setInterval(() => {
if (!isCompleted.value && progress.value < 0.99) {
const step = Math.random() * 0.04 + 0.01;
progress.value = Math.min(progress.value + step, 0.99);
if (!isCompleted.value && progress.value < 99) {
const step = Math.random() * 4 + 1;
progress.value = Math.min(progress.value + step, 99);
progress.value = Number(progress.value.toFixed(2));
} else if (!isCompleted.value && progress.value >= 0.99) {
progress.value = 0.99; // 卡在99%
} else if (!isCompleted.value && progress.value >= 99) {
progress.value = 99; // 卡在99%
} else {
clearFakeProgressTimer();
clearStatusPollingTimer();

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';

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

@ -42,7 +42,7 @@
</div>
<div class="filter-row-item" v-if="query.audit_status === AuditStatus.Pending">
<span class="label">上传时间</span>
<a-range-picker
<DatePicker.RangePicker
v-model="created_at"
size="medium"
allow-clear
@ -69,7 +69,7 @@
</div>
<div class="filter-row-item">
<span class="label">审核时间</span>
<a-range-picker
<DatePicker.RangePicker
v-model="audit_started_at"
size="medium"
allow-clear
@ -100,7 +100,7 @@
<script setup>
import { defineEmits, defineProps } from 'vue';
import { Button, Input, Select, Space } from 'ant-design-vue';
import { Button, Input, Select, Space, DatePicker } from 'ant-design-vue';
const { Option } = Select;
import { PLATFORMS } from '@/views/writer-material-center/components/finished-products/manuscript/check-list/constants';
import { AuditStatus } from '@/views/writer-material-center/components/finished-products/constants';

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

@ -1,5 +1,5 @@
<script lang="jsx">
import { Drawer, Image } from '@arco-design/web-vue';
import { Drawer, Image } from 'ant-design-vue';
import TextOverTips from '@/components/text-over-tips';
import icon1 from '@/assets/img/error-img.png';
@ -32,12 +32,12 @@ export default {
return () => (
<Drawer
title="审核列表"
visible={visible.value}
v-model:open={visible.value}
width={420}
class="check-list-drawer-xt"
footer={false}
header={false}
onCancel={onClose}
rootClassName="check-list-drawer-xt"
footer={null}
closable={false}
onClose={onClose}
>
<div class="flex justify-between items-center h-56px px-24px">
<div class="flex items-center">
@ -61,13 +61,13 @@ export default {
height={48}
preview={false}
src={item.cover}
class="!rounded-4px mr-8px"
class="!rounded-4px"
fit="cover"
v-slots={{
error: () => <img src={icon1} class="w-full h-full" />,
}}
/>
<div class="flex-1 overflow-hidden flex flex-col items-start">
<div class="flex-1 overflow-hidden flex flex-col items-start ml-8px">
<TextOverTips context={item.title} class={`cts !color-#211F24 title mb-4px !text-14px`} />
<p class="cts !text-14px">{`合规程度：${
item.ai_review?.compliance_level ? `${item.ai_review?.compliance_level}%` : '-'

9
src/views/writer-material-center/components/finished-products/manuscript/check/components/check-list-drawer/style.scss
View File

@ -1,17 +1,15 @@
.check-list-drawer-xt {
.arco-drawer-mask {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
.ant-drawer-mask {
background-color: transparent;
}
.arco-drawer {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
.arco-drawer-body {
.ant-drawer-body {
overflow: hidden;
display: flex;
flex-direction: column;
padding: 0 0 24px;
.cts {
color: var(--Text-1, #939499);
font-family: $font-family-regular;
font-size: 16px;
font-style: normal;
@ -42,4 +40,3 @@
}
}
}
}

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

@ -138,9 +138,7 @@ export default {
};
const uploadImage = async (option, action = 'upload') => {
const {
fileItem: { file },
} = option;
const { file } = option;
const { name, size, type } = file;
const response = await getImagePreSignedUrl({ suffix: getFileExtension(name) });

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

@ -1,5 +1,5 @@
<script lang="jsx">
import { Image } from '@arco-design/web-vue';
import { Image } from 'ant-design-vue';
import { Swiper, SwiperSlide } from 'swiper/vue';
import TextOverTips from '@/components/text-over-tips';
@ -56,13 +56,13 @@ export default {
height={48}
preview={false}
src={item.cover}
class="!rounded-4px mr-8px"
class="!rounded-4px"
fit="cover"
v-slots={{
error: () => <img src={icon1} class="w-full h-full" />,
}}
/>
<div class="flex-1 overflow-hidden flex flex-col items-start">
<div class="flex-1 overflow-hidden flex flex-col items-start ml-8px">
<TextOverTips context={item.title} class={`cts !color-#211F24 title mb-4px`} />
<p class="cts">{`合规程度：${item.ai_review?.compliance_level ? `${item.ai_review?.compliance_level}%` : '-'}`}</p>
</div>

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

@ -23,25 +23,23 @@
/>
</div>
</div>
<a-upload
<Upload
v-if="files.length < 18"
ref="uploadRef"
action="/"
draggable
:custom-request="(option) => emit('upload', option)"
:customRequest="(option) => emit('upload', option)"
accept=".jpg,.jpeg,.png,.gif,.webp"
:show-file-list="false"
:showUploadList="false"
multiple
class="!flex !items-center"
:limit="18 - files.length"
>
<template #upload-button>
<template #default>
<div class="upload-box">
<icon-plus size="14" class="mb-16px color-#3C4043" />
<span class="cts !color-#211F24">上传图片</span>
</div>
</template>
</a-upload>
</Upload>
</VueDraggable>
</div>
</FormItem>
@ -49,7 +47,7 @@
<script setup>
import { VueDraggable } from 'vue-draggable-plus';
import { FormItem} from 'ant-design-vue';
import { FormItem, Upload } from 'ant-design-vue';
const props = defineProps({
files: {

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

@ -132,9 +132,7 @@ export default {
formData.value.videoInfo.uploadStatus = ENUM_UPLOAD_STATUS.UPLOADING;
emit('updateVideoInfo', formData.value.videoInfo);
const {
fileItem: { file },
} = option;
const { file } = option;
setVideoInfo(file);
const response = await getVideoPreSignedUrlWriter(writerCode.value, { suffix: getFileExtension(file.name) });
@ -165,9 +163,7 @@ export default {
};
// 文件上传处理
const uploadImage = async (option) => {
const {
fileItem: { file },
} = option;
const { file } = option;
// 验证文件数量
if (formData.value.files?.length >= 18) {

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

@ -56,7 +56,7 @@
</div>
<div class="filter-row-item">
<span class="label">上传时间</span>
<a-range-picker
<DatePicker.RangePicker
v-model="created_at"
size="medium"
allow-clear
@ -85,7 +85,7 @@
<script setup>
import { defineEmits, defineProps } from 'vue';
import { Button, Input, Space } from 'ant-design-vue';
import { Button, Input, Space, DatePicker } from 'ant-design-vue';
import { CHECK_STATUS } from '@/views/writer-material-center/components/finished-products/manuscript/list/constants';
import CommonSelect from '@/components/common-select';
// import { getProjectList } from '@/api/all/propertyMarketing';