diff --git a/src/assets/img/media-account/icon-schedule.png b/src/assets/img/media-account/icon-schedule.png new file mode 100644 index 0000000..3dade8c Binary files /dev/null and b/src/assets/img/media-account/icon-schedule.png differ diff --git a/src/components/_base/navbar/components/navbar-menu/index.vue b/src/components/_base/navbar/components/navbar-menu/index.vue index 8611b4c..d5be9d6 100644 --- a/src/components/_base/navbar/components/navbar-menu/index.vue +++ b/src/components/_base/navbar/components/navbar-menu/index.vue @@ -9,7 +9,12 @@ @@ -26,12 +31,14 @@ diff --git a/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue b/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue index 7f9dab5..cfbe000 100644 --- a/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue +++ b/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue @@ -21,7 +21,7 @@ import { } from '@arco-design/web-vue'; import AuthorizedAccountModal from '../authorized-account-modal'; // import ImportPromptModal from '../import-prompt-modal'; -import StatusBox from '../status-box'; +import StatusBox from '@/views/property-marketing/media-account/components/status-select/status-box.tsx'; import SyncDataModal from '../sync-data-modal'; import CommonSelect from '@/components/common-select'; @@ -353,7 +353,7 @@ export default { - + )} diff --git a/src/views/property-marketing/media-account/account-manage/components/status-box/index.vue b/src/views/property-marketing/media-account/account-manage/components/status-box/index.vue deleted file mode 100644 index 174bd1f..0000000 --- a/src/views/property-marketing/media-account/account-manage/components/status-box/index.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - - - - diff --git a/src/views/property-marketing/media-account/account-manage/index.vue b/src/views/property-marketing/media-account/account-manage/index.vue index 43ac764..ae128f4 100644 --- a/src/views/property-marketing/media-account/account-manage/index.vue +++ b/src/views/property-marketing/media-account/account-manage/index.vue @@ -132,8 +132,8 @@ import BatchGroupModal from './components/batch-group-modal'; import { INITIAL_QUERY, INITIAL_PAGE_INFO } from './constants'; import { showImportResultNotification } from '@/utils/arcoD'; -import { EnumStatus } from '@/views/property-marketing/media-account/components/status-select/constants'; import { getTaskStatus } from '@/api/all/common'; +import { EnumStatus } from '@/views/property-marketing/media-account/components/status-select/status-box.tsx'; import { getMediaAccounts, getMediaAccountsHealth, @@ -167,7 +167,7 @@ const healthData = ref({}); const syncMediaAccounts = ref([]); const isLoadingTaskStatus = ref(false); // 正在查询状态中 -const isAbNormalStatus = computed(() => healthData.value?.total_abnormal_number > 0); +const isAbNormalStatus = computed(() => healthData.value?.abnormal_number > 0); const isDisabledBatchSyncData = computed(() => selectedItems.value.some((item) => item.status !== EnumStatus.NORMAL)); const checkedAll = computed(() => selectedItems.value.length === dataSource.value.length); @@ -181,12 +181,11 @@ const tipLabel = computed(() => { } const { - total_abnormal_number = 0, + abnormal_number = 0, login_invalid_number = 0, too_many_requests_number = 0, account_frozen_number = 0, miss_data_number = 0, - abnormal_number = 0, } = healthData.value; // 定义异常类型映射 @@ -195,13 +194,13 @@ const tipLabel = computed(() => { { count: too_many_requests_number, label: '请求频繁' }, { count: account_frozen_number, label: '账号被封' }, { count: miss_data_number, label: '数据缺失' }, - { count: abnormal_number, label: '其他异常' }, + // { count: abnormal_number, label: '其他异常' }, ]; // 过滤出有异常的项并格式化 const abnormalLabels = abnormalTypes.filter(({ count }) => count > 0).map(({ count, label }) => `${count}个${label}`); - return `共有 ${total_abnormal_number} 个账号存在授权异常，其中：${abnormalLabels.join('，')}。`; + return `共有 ${abnormal_number} 个账号存在授权异常，其中：${abnormalLabels.join('，')}。`; }); const getData = () => { @@ -297,11 +296,11 @@ const getAsyncStatus = async () => { } } }; + const handleUpdateSyncStatus = (item) => { const target = syncMediaAccounts.value.find((v) => v.id === item.id); - // 点击取消，设置状态为成功 if (target) { - target.status = 1; + target.status = EnumStatus.NORMAL; } }; @@ -346,7 +345,7 @@ const onBatchSuccess = () => { getData(); }; const handleOpenAbnormalAccount = () => { - query.value.status = 2; + query.value.status = 3; reload(); }; diff --git a/src/views/property-marketing/media-account/components/status-select/constants.ts b/src/views/property-marketing/media-account/components/status-select/constants.ts index 7049295..fdfd154 100644 --- a/src/views/property-marketing/media-account/components/status-select/constants.ts +++ b/src/views/property-marketing/media-account/components/status-select/constants.ts @@ -2,59 +2,82 @@ * @Author: RenXiaoDong * @Date: 2025-07-04 11:18:11 */ -export enum EnumStatus { - UNAUTHORIZED = 0, - NORMAL = 1, - ABNORMAL = 3, - PAUSE = 2, - ABNORMAL_LOGIN = 4, - ABNORMAL_REQUEST = 5, - ABNORMAL_FREEZE = 6, - ABNORMAL_MISSING = 7, +export enum EnumAccountStatus { + UNAUTHORIZED = 0, // 未授权 + NORMAL = 1, // 正常 + PAUSE = 2, // 暂停同步 + ABNORMAL = 3, // 全部异常 + ABNORMAL_LOGIN = 4, // 异常（登录状态失效） + ABNORMAL_REQUEST = 5, // 异常（请求频繁） + ABNORMAL_FREEZE = 6, // 异常（账号被封） + ABNORMAL_MISSING = 7, // 异常（数据缺失） + ABNORMAL_EXPIRED = 8, // 即将过期 } export const STATUS_LIST = [ { text: '正常', label: '正常', - value: EnumStatus.NORMAL, + value: EnumAccountStatus.NORMAL, + }, + { + text: '即将过期', + label: '即将过期', + value: EnumAccountStatus.ABNORMAL_EXPIRED, }, { text: '暂停同步', label: '暂停同步', - value: EnumStatus.PAUSE, + value: EnumAccountStatus.PAUSE, }, { - text: '未授权', - label: '未授权', - value: EnumStatus.UNAUTHORIZED, - }, - { - text: '异常', + text: '全部异常', label: '异常', - value: EnumStatus.ABNORMAL, + value: EnumAccountStatus.ABNORMAL, }, { - text: '数据缺失', - label: '数据缺失', - value: EnumStatus.ABNORMAL_MISSING, - }, - { - text: '异常-登录状态失效', + text: '异常（未授权）', label: '异常', - value: EnumStatus.ABNORMAL_LOGIN, - tooltip: '登录状态失效，需重新扫码授权', + value: EnumAccountStatus.UNAUTHORIZED, + tooltip: '未授权', + style: { + 'padding-left': '24px', + }, }, { - text: '异常-请求过于频繁', + text: '异常（数据缺失）', label: '异常', - value: EnumStatus.ABNORMAL_REQUEST, - tooltip: '请求过于频繁，需等待24小时后重试', + value: EnumAccountStatus.ABNORMAL_MISSING, + tooltip: '数据缺失', + style: { + 'padding-left': '24px', + }, }, { - text: '异常-账号被冻结/封禁', + text: '异常（登录状态失效）', label: '异常', - value: EnumStatus.ABNORMAL_FREEZE, - tooltip: '账号被冻结/封禁', + value: EnumAccountStatus.ABNORMAL_LOGIN, + tooltip: '登录状态失效', + style: { + 'padding-left': '24px', + }, + }, + { + text: '异常（请求频繁）', + label: '异常', + value: EnumAccountStatus.ABNORMAL_REQUEST, + tooltip: '请求频繁，等待24小时后重试', + style: { + 'padding-left': '24px', + }, + }, + { + text: '异常（账号被封）', + label: '异常', + value: EnumAccountStatus.ABNORMAL_FREEZE, + tooltip: '账号被封', + style: { + 'padding-left': '24px', + }, }, ]; diff --git a/src/views/property-marketing/media-account/components/status-select/index.vue b/src/views/property-marketing/media-account/components/status-select/index.vue index b327655..811e3e0 100644 --- a/src/views/property-marketing/media-account/components/status-select/index.vue +++ b/src/views/property-marketing/media-account/components/status-select/index.vue @@ -11,7 +11,13 @@ allow-clear @change="handleChange" > - + {{ item.text }} diff --git a/src/views/property-marketing/media-account/components/status-select/status-box.tsx b/src/views/property-marketing/media-account/components/status-select/status-box.tsx new file mode 100644 index 0000000..3b6c5e8 --- /dev/null +++ b/src/views/property-marketing/media-account/components/status-select/status-box.tsx @@ -0,0 +1,147 @@ +import { defineComponent, computed } from 'vue'; +import { Tooltip } from '@arco-design/web-vue'; + +import iconWarn1 from '@/assets/img/media-account/icon-warn-1.png'; +import iconWarn2 from '@/assets/img/media-account/icon-warn-2.png'; +import icon1 from '@/assets/img/media-account/icon-schedule.png'; + +export enum EnumErrorStatus { + NORMAL = 0, // 正常 + UNAUTHORIZED = 1, // 未授权 + LOGIN = 2, // 登录状态失效 + REQUEST = 3, // 请求过于频繁 + FREEZE = 4, // 账号被冻结/封禁 + MISSING = 5, // 数据缺失 + UNKNOWN = 6, // 未知异常 +} + +export enum EnumStatus { + ABNORMAL = 0, // 异常 + NORMAL = 1, // 正常 + PAUSE = 2, // 暂停同步 +} + +export enum EnumExpireForCookie { + NORMAL = 0, // 正常 + EXPIRE = 1, // 即将过期 +} + +const normalStyle = { + color: '#25c883', + background: '#ebf7f2', +}; + +const abnormalStyle = { + color: '#f64b31', + background: '#ffe7e4', +}; + +const pauseStyle = { + color: '#ffae00', + background: '#fff7e5', +}; + +export const errorStatusMap = new Map([ + [1, { tooltip: '未授权', text: '未授权' }], + [2, { tooltip: '登录状态失效', text: '登录状态失效' }], + [3, { tooltip: '请求频繁，等待24小时后重试', btnTooltip: '请求频繁，等待24小时后重试', text: '请求过于频繁' }], + [4, { tooltip: '账号被冻结', btnTooltip: '账号被封，解封后才能操作', text: '账号被冻结' }], + [5, { tooltip: '数据缺失', text: '数据缺失' }], + [6, { tooltip: '未知错误', text: '未知错误' }], +]); + +/** + * + * @param status 状态 0-异常，1-正常，2-暂停同步 + * @param error_status 异常状态 0-无异常，1-未授权，2-登录状态失效，3-请求过于频繁，4-账号被冻结/封禁，5-数据缺失，6-未知错误 + * @param to_be_expire_for_cookie cookie是否即将过期 0-否，1-是 + * @returns + */ + +export const getStatusInfo = ( + status: EnumStatus, + error_status: EnumErrorStatus, + to_be_expire_for_cookie: EnumExpireForCookie, +) => { + const statusInfo = { color: '', background: '', label: '', tooltip: '', disabledBtnTooltip: '' }; + if (status === EnumStatus.ABNORMAL) { + statusInfo.color = abnormalStyle.color; + statusInfo.background = abnormalStyle.background; + statusInfo.label = '异常'; + + const target = errorStatusMap.get(error_status); + statusInfo.tooltip = target?.tooltip ?? ''; + statusInfo.disabledBtnTooltip = target?.btnTooltip ?? ''; + } else if (status === EnumStatus.NORMAL) { + if (to_be_expire_for_cookie === EnumExpireForCookie.NORMAL) { + statusInfo.color = normalStyle.color; + statusInfo.background = normalStyle.background; + statusInfo.label = '正常'; + } else { + statusInfo.color = abnormalStyle.color; + statusInfo.background = abnormalStyle.background; + statusInfo.label = '即将过期'; + } + } else if (status === EnumStatus.PAUSE) { + statusInfo.color = pauseStyle.color; + statusInfo.background = pauseStyle.background; + statusInfo.label = '暂停同步'; + statusInfo.tooltip = '暂停同步'; + } + + return statusInfo; +}; + +export default defineComponent({ + name: 'StatusBox', + props: { + item: { + type: Object, + default: () => ({}), + }, + }, + setup(props) { + const statusInfo = computed(() => { + const { status, error_status, to_be_expire_for_cookie } = props.item; + return getStatusInfo(status, error_status, to_be_expire_for_cookie) ?? {}; + }); + + const renderContent = () => { + const { to_be_expire_for_cookie, status } = props.item; + const { background, color, label } = statusInfo.value; + if (status === EnumStatus.NORMAL) { + return ( +
+ {to_be_expire_for_cookie === EnumExpireForCookie.EXPIRE && ( +
+ + {label} +
+ )} +
+ 正常 +
+
+ ); + } + + return ( +
+ {label} + {status === EnumStatus.PAUSE ? ( + + ) : ( + + + + )} +
+ ); + }; + + return () => renderContent(); + }, +}); diff --git a/src/views/property-marketing/put-account/account-data/components/board-table/index.vue b/src/views/property-marketing/put-account/account-data/components/board-table/index.vue index 3c59006..a7ba0a1 100644 --- a/src/views/property-marketing/put-account/account-data/components/board-table/index.vue +++ b/src/views/property-marketing/put-account/account-data/components/board-table/index.vue @@ -135,7 +135,7 @@ diff --git a/src/views/property-marketing/put-account/account-manage/components/filter-block/index.vue b/src/views/property-marketing/put-account/account-manage/components/filter-block/index.vue index 9293455..a052d91 100644 --- a/src/views/property-marketing/put-account/account-manage/components/filter-block/index.vue +++ b/src/views/property-marketing/put-account/account-manage/components/filter-block/index.vue @@ -73,7 +73,7 @@ import { defineEmits, defineProps } from 'vue'; import { getPlacementAccountOperators, getProjectList } from '@/api/all/propertyMarketing'; import { PLATFORM_LIST } from '@/utils/platform'; -import StatusSelect from '@/views/property-marketing/media-account/components/status-select'; +import StatusSelect from '@/views/property-marketing/put-account/components/status-select'; import CommonSelect from '@/components/common-select'; const props = defineProps({ diff --git a/src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/style.scss b/src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/style.scss index 25d027e..d8c0813 100644 --- a/src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/style.scss +++ b/src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/style.scss @@ -22,7 +22,7 @@ .label { margin-right: 12px; color: #211f24; - font-family: 'PuHuiTi-Regular'; + font-family: $font-family-regular; font-size: 14px; font-style: normal; font-weight: 400; diff --git a/src/views/property-marketing/put-account/account-manage/components/status-box/index.vue b/src/views/property-marketing/put-account/account-manage/components/status-box/index.vue index df9d526..6599f0f 100644 --- a/src/views/property-marketing/put-account/account-manage/components/status-box/index.vue +++ b/src/views/property-marketing/put-account/account-manage/components/status-box/index.vue @@ -13,7 +13,7 @@ @@ -75,7 +75,7 @@ const isDisabledReauthorize = (status) => { } } - &-2, + &-3, &-4, &-5, &-6 { @@ -85,7 +85,7 @@ const isDisabledReauthorize = (status) => { } } - &-3 { + &-2{ background: #fff7e5; color: #ffae00; .text { diff --git a/src/views/property-marketing/put-account/components/status-select/constants.ts b/src/views/property-marketing/put-account/components/status-select/constants.ts new file mode 100644 index 0000000..9f757ca --- /dev/null +++ b/src/views/property-marketing/put-account/components/status-select/constants.ts @@ -0,0 +1,60 @@ +/* + * @Author: RenXiaoDong + * @Date: 2025-07-04 11:18:11 + */ +export enum EnumPutAccountStatus { + UNAUTHORIZED = 0, + NORMAL = 1, + ABNORMAL = 3, + PAUSE = 2, + ABNORMAL_LOGIN = 4, + ABNORMAL_REQUEST = 5, + ABNORMAL_FREEZE = 6, + ABNORMAL_MISSING = 7, +} + +export const STATUS_LIST = [ + { + text: '正常', + label: '正常', + value: EnumPutAccountStatus.NORMAL, + }, + { + text: '暂停同步', + label: '暂停同步', + value: EnumPutAccountStatus.PAUSE, + }, + { + text: '未授权', + label: '未授权', + value: EnumPutAccountStatus.UNAUTHORIZED, + }, + { + text: '异常', + label: '异常', + value: EnumPutAccountStatus.ABNORMAL, + }, + { + text: '数据缺失', + label: '数据缺失', + value: EnumPutAccountStatus.ABNORMAL_MISSING, + }, + { + text: '异常-登录状态失效', + label: '异常', + value: EnumPutAccountStatus.ABNORMAL_LOGIN, + tooltip: '登录状态失效，需重新扫码授权', + }, + { + text: '异常-请求过于频繁', + label: '异常', + value: EnumPutAccountStatus.ABNORMAL_REQUEST, + tooltip: '请求过于频繁，需等待24小时后重试', + }, + { + text: '异常-账号被冻结/封禁', + label: '异常', + value: EnumPutAccountStatus.ABNORMAL_FREEZE, + tooltip: '账号被冻结/封禁', + }, +]; diff --git a/src/views/property-marketing/put-account/components/status-select/index.vue b/src/views/property-marketing/put-account/components/status-select/index.vue new file mode 100644 index 0000000..cadf39a --- /dev/null +++ b/src/views/property-marketing/put-account/components/status-select/index.vue @@ -0,0 +1,60 @@ + + + +