feat: 新媒体账号状态处理
This commit is contained in:
rd
@ -3,58 +3,74 @@
|
||||
* @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,
|
||||
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,
|
||||
},
|
||||
{
|
||||
text: '即将过期',
|
||||
label: '即将过期',
|
||||
value: EnumStatus.ABNORMAL_EXPIRED,
|
||||
},
|
||||
{
|
||||
text: '暂停同步',
|
||||
label: '暂停同步',
|
||||
value: EnumStatus.PAUSE,
|
||||
},
|
||||
{
|
||||
text: '未授权',
|
||||
label: '未授权',
|
||||
value: EnumStatus.UNAUTHORIZED,
|
||||
},
|
||||
{
|
||||
text: '异常',
|
||||
text: '全部异常',
|
||||
label: '异常',
|
||||
value: EnumStatus.ABNORMAL,
|
||||
},
|
||||
{
|
||||
text: '数据缺失',
|
||||
label: '数据缺失',
|
||||
value: EnumStatus.ABNORMAL_MISSING,
|
||||
text: '异常（未授权）',
|
||||
label: '异常',
|
||||
value: EnumStatus.UNAUTHORIZED,
|
||||
tooltip: '未授权',
|
||||
class: '!pl-24px',
|
||||
},
|
||||
{
|
||||
text: '异常-登录状态失效',
|
||||
text: '异常（数据缺失）',
|
||||
label: '异常',
|
||||
value: EnumStatus.ABNORMAL_MISSING,
|
||||
tooltip: '数据缺失',
|
||||
class: '!pl-24px',
|
||||
},
|
||||
{
|
||||
text: '异常（登录状态失效）',
|
||||
label: '异常',
|
||||
value: EnumStatus.ABNORMAL_LOGIN,
|
||||
tooltip: '登录状态失效，需重新扫码授权',
|
||||
tooltip: '登录状态失效',
|
||||
class: '!pl-24px',
|
||||
},
|
||||
{
|
||||
text: '异常-请求过于频繁',
|
||||
text: '异常（请求频繁）',
|
||||
label: '异常',
|
||||
value: EnumStatus.ABNORMAL_REQUEST,
|
||||
tooltip: '请求过于频繁，需等待24小时后重试',
|
||||
tooltip: '请求频繁，等待24小时后重试',
|
||||
class: '!pl-24px',
|
||||
},
|
||||
{
|
||||
text: '异常-账号被冻结/封禁',
|
||||
text: '异常（账号被封）',
|
||||
label: '异常',
|
||||
value: EnumStatus.ABNORMAL_FREEZE,
|
||||
tooltip: '账号被冻结/封禁',
|
||||
tooltip: '账号被封',
|
||||
class: '!pl-24px',
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
allow-clear
|
||||
@change="handleChange"
|
||||
>
|
||||
<a-option v-for="(item, index) in STATUS_LIST" :key="index" :value="item.value" :label="item.text">
|
||||
<a-option v-for="(item, index) in STATUS_LIST" :key="index" :value="item.value" :label="item.text" :class="item.class">
|
||||
{{ item.text }}
|
||||
</a-option>
|
||||
</a-select>
|
||||
|
||||
@ -0,0 +1,147 @@
|
||||
import { defineComponent, computed } from 'vue';
|
||||
import { Tooltip } from '@arco-design/web-vue';
|
||||
// import { STATUS_LIST } from '@/views/property-marketing/media-account/components/status-select/constants';
|
||||
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',
|
||||
};
|
||||
|
||||
const tooltipMap = new Map([
|
||||
[1, { tooltip: '未授权' }],
|
||||
[2, { tooltip: '登录状态失效' }],
|
||||
[3, { tooltip: '请求频繁，等待24小时后重试', btnTooltip: '请求频繁，等待24小时后重试' }],
|
||||
[4, { tooltip: '账号被冻结', btnTooltip: '账号被封，解封后才能操作' }],
|
||||
[5, { tooltip: '数据缺失' }],
|
||||
[6, { tooltip: '未知错误' }],
|
||||
]);
|
||||
|
||||
/**
|
||||
*
|
||||
* @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 = tooltipMap.get(error_status);
|
||||
statusInfo.tooltip = target?.tooltip ?? '';
|
||||
statusInfo.disabledBtnTooltip = target?.btnTooltip ?? '';
|
||||
}
|
||||
|
||||
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 = '即将过期';
|
||||
}
|
||||
}
|
||||
|
||||
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 (
|
||||
<div class="flex items-center">
|
||||
{to_be_expire_for_cookie === EnumExpireForCookie.EXPIRE && (
|
||||
<div class="flex items-center rounded-2px px-8px mr-8px" style={{ background, color }}>
|
||||
<img src={icon1} width="12" height="12" class="mr-4px" />
|
||||
<span class="text-12px lh-20px font-400">{label}</span>
|
||||
</div>
|
||||
)}
|
||||
<div
|
||||
class="flex items-center rounded-2px px-8px"
|
||||
style={{ background: normalStyle.background, color: normalStyle.color }}
|
||||
>
|
||||
<span class="text-12px lh-20px font-400">正常</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div class="flex items-center rounded-2px px-8px" style={{ background, color }}>
|
||||
<span class="text-12px lh-20px font-400">{label}</span>
|
||||
{status === EnumStatus.PAUSE ? (
|
||||
<img src={iconWarn1} width="12" height="12" class="ml-4px" />
|
||||
) : (
|
||||
<Tooltip content={statusInfo.value.tooltip}>
|
||||
<img src={iconWarn2} width="12" height="12" class="ml-4px" />
|
||||
</Tooltip>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
return () => renderContent();
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user