From 80c6b30701e66dc99b79141bbc4fc815bd8b6915 Mon Sep 17 00:00:00 2001 From: rd <> Date: Fri, 27 Jun 2025 18:37:42 +0800 Subject: [PATCH 1/7] =?UTF-8?q?feat:=20=E6=95=B0=E6=8D=AE=E7=9C=8B?= =?UTF-8?q?=E6=9D=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/all/propertyMarketing.ts | 10 + src/assets/img/media-account/icon-custom.png | Bin 0 -> 483 bytes src/assets/img/media-account/icon1.png | Bin 0 -> 1210 bytes src/assets/img/media-account/icon2.png | Bin 0 -> 1408 bytes src/assets/img/media-account/icon3.png | Bin 0 -> 1041 bytes src/assets/img/media-account/icon4.png | Bin 0 -> 1161 bytes .../routes/modules/propertyMarketing.ts | 4 +- src/utils/tools.ts | 56 ++++ .../components/account-table/index.vue | 131 ++++++++ .../components/account-table/style.scss | 10 + .../components/filter-block/index.vue | 129 ++++++++ .../components/filter-block/style.scss | 36 +++ .../components/group-select/index.vue | 64 ++++ .../account-dashboard/constants.ts | 94 ++++++ .../media-account/account-dashboard/index.vue | 284 +++++++++++++++++- .../account-dashboard/style.scss | 84 ++++++ .../components/filter-block/index.vue | 5 +- .../media-account/account-manage/constants.ts | 7 + 18 files changed, 907 insertions(+), 7 deletions(-) create mode 100644 src/assets/img/media-account/icon-custom.png create mode 100644 src/assets/img/media-account/icon1.png create mode 100644 src/assets/img/media-account/icon2.png create mode 100644 src/assets/img/media-account/icon3.png create mode 100644 src/assets/img/media-account/icon4.png create mode 100644 src/utils/tools.ts create mode 100644 src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue create mode 100644 src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss create mode 100644 src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue create mode 100644 src/views/property-marketing/media-account/account-dashboard/components/filter-block/style.scss create mode 100644 src/views/property-marketing/media-account/account-dashboard/components/group-select/index.vue create mode 100644 src/views/property-marketing/media-account/account-dashboard/constants.ts diff --git a/src/api/all/propertyMarketing.ts b/src/api/all/propertyMarketing.ts index bae28e9..9364a8b 100644 --- a/src/api/all/propertyMarketing.ts +++ b/src/api/all/propertyMarketing.ts @@ -121,3 +121,13 @@ export const startPatchAccount = (id: string) => { export const getAuthorizedImage = (id: string) => { return Http.get(`/v1/media-accounts/${id}/authorized-image`); }; + +// 账号看板-数据总览 +export const getAccountBoardOverview = (params = {}) => { + return Http.get('/v1/media-account-boards/overview', params); +}; + +// 账号看板-分页 +export const getAccountBoardList = (params = {}) => { + return Http.get('/v1/media-account-boards', params); +}; diff --git a/src/assets/img/media-account/icon-custom.png b/src/assets/img/media-account/icon-custom.png new file mode 100644 index 0000000000000000000000000000000000000000..2f2fe8a799291fb9a507aa0af4dc437a5e646348 GIT binary patch literal 483 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 LNkvXXu0mjf30mU6 literal 0 HcmV?d00001 diff --git a/src/assets/img/media-account/icon4.png b/src/assets/img/media-account/icon4.png new file mode 100644 index 0000000000000000000000000000000000000000..164776bfd27af849b053714e7a5df689661bcedb GIT binary patch literal 1161 zcmV;41a|w0P)Y=yBJ@=Em$f$bD@hfZ;Kq%l5||U={cnRhIT7QB1s%RDKB@o2y`-6(xFU-gHSH+ z3}?2_kF~tN5ra-9oggkL*CK%d!MnTQ<%iw66;(W*tjA-+f&zM-8=N>px#Xu;+;PRV zdc|0k+YzeGxt#q@#>J&TzVs_1)= z^=$^?!$h?*ejcTtGM%ln{yb3ZHA95cdXgjp4T_EIRdlR*#aj(tUo+z9gA?ZJfw&b~ zD%FM-$I5y`zs`b=SH)HSyoFLO8{jF33toGw=7~huXmQ4J$M-BJK0S+|2>D{8DAo6o zU-?_%51FD$YEjg2!mCfrjO49N1SQB9BG7ZyM$1xD#a8n<(Rh)%I2tv}2u9vf(>4m| zy71l|$mK=w$}$E5W64rK^Qw5Mr9oTNRW5J(u-6wNF1xM!gswSW9|*Dqk+kuaA|Uf3 zHf!hA?!SmWG08x;KAVB!yP&n1UCfUkpNJ{9rF;!rT>*{0XL7spts9W{{;IzG(NgRE z`wKu#vckP0inxiUnl|)l` zOHkIE*5Y)zv39tY%!Uz*Ay7a?PSz_8f!c~Hi=D(9Mr){BPt&sc4&SzOZ_?G0c`A0t zo^HP9c{bx*I5Wq7XLWek!?*uE(|*(Q`?VA0%SzzkE#QQ_K0NYn>cHm3v7D&wt_Fp6 z>#;lbfyXT!&j*jq{*zHb`wjHW3YqGP!9R2or}1?J?3_y`WQ4M+^VbLgZMBgj$a import('@/views/property-marketing/repository/test'), + component: () => import('@/views/property-marketing/media-account/account-dashboard'), }, { path: 'accountDetails', diff --git a/src/utils/tools.ts b/src/utils/tools.ts new file mode 100644 index 0000000..395b1b3 --- /dev/null +++ b/src/utils/tools.ts @@ -0,0 +1,56 @@ +/* + * @Author: RenXiaoDong + * @Date: 2025-06-27 17:36:31 + */ +export function toFixed(num: number | string, n: number): number { + return parseFloat(parseFloat(num.toString()).toFixed(n)); +} + +export function isNotData(n: number): boolean { + if (n === undefined) { + return true; + } + return n === -2147483648; +} + +export function splitNumber(num: number): string | number { + if (!num) { + return num; + } + const parts = num.toString().split('.'); + parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ','); + return parts.join('.'); +} + +export function formatNumberShow(...args: any[]): string | number { + const [_args] = args; + const { value, len = 2, split = true, showExactValue = false } = typeof _args === 'object' ? _args : { value: _args }; + const getNumber = (value: number) => { + return split ? splitNumber(value) : value; + }; + + if (isNotData(value)) { + return '-'; + } + if (value < 0) { + return `-${formatNumberShow({ + value: -value, + len, + split, + showExactValue, + })}`; + } + if (showExactValue) { + return getNumber(toFixed(value, len)); + } + if (value < 10000) { + return getNumber(toFixed(value, len)); + } else if (value < 100000000) { + const _n = Math.round((value / 10000) * 100) / 100; + return split ? `${splitNumber(_n)}w` : `${toFixed(_n, len)}w`; + } else { + const _n = Math.round((value / 100000000) * 100) / 100; + + return split ? `${splitNumber(_n)}亿` : `${toFixed(_n, len)}亿`; + } +} diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue b/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue new file mode 100644 index 0000000..b159b9a --- /dev/null +++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue @@ -0,0 +1,131 @@ + + + + + + diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss b/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss new file mode 100644 index 0000000..475cd8b --- /dev/null +++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss @@ -0,0 +1,10 @@ +.container { + width: 100%; + .action-row { + :deep(.arco-btn) { + .arco-btn-icon { + line-height: 14px; + } + } + } +} diff --git a/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue b/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue new file mode 100644 index 0000000..df72627 --- /dev/null +++ b/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue @@ -0,0 +1,129 @@ + + + + + + + diff --git a/src/views/property-marketing/media-account/account-dashboard/components/filter-block/style.scss b/src/views/property-marketing/media-account/account-dashboard/components/filter-block/style.scss new file mode 100644 index 0000000..3a33894 --- /dev/null +++ b/src/views/property-marketing/media-account/account-dashboard/components/filter-block/style.scss @@ -0,0 +1,36 @@ +.container { + :deep(.arco-input-wrapper), + :deep(.arco-select-view-single), + :deep(.arco-select-view-multiple) { + border-radius: 4px; + border-color: #d7d7d9; + background-color: #fff; + &:focus-within, + &.arco-input-focus { + background-color: var(--color-bg-2); + border-color: rgb(var(--primary-6)); + box-shadow: 0 0 0 0 var(--color-primary-light-2); + } + } + .filter-row { + .filter-row-item { + &:not(:last-child) { + margin-right: 24px; + } + .label { + margin-right: 8px; + color: #211f24; + font-family: 'Alibaba PuHuiTi'; + font-size: 14px; + font-style: normal; + font-weight: 400; + flex-shrink: 0; + line-height: 22px; /* 157.143% */ + } + :deep(.arco-space-item) { + width: 100%; + } + } + } + +} diff --git a/src/views/property-marketing/media-account/account-dashboard/components/group-select/index.vue b/src/views/property-marketing/media-account/account-dashboard/components/group-select/index.vue new file mode 100644 index 0000000..a736c92 --- /dev/null +++ b/src/views/property-marketing/media-account/account-dashboard/components/group-select/index.vue @@ -0,0 +1,64 @@ + + + + diff --git a/src/views/property-marketing/media-account/account-dashboard/constants.ts b/src/views/property-marketing/media-account/account-dashboard/constants.ts new file mode 100644 index 0000000..97bf6bc --- /dev/null +++ b/src/views/property-marketing/media-account/account-dashboard/constants.ts @@ -0,0 +1,94 @@ +/* + * @Author: RenXiaoDong + * @Date: 2025-06-27 17:23:56 + */ + +import icon1 from '@/assets/img/media-account/icon1.png'; +import icon2 from '@/assets/img/media-account/icon2.png'; +import icon3 from '@/assets/img/media-account/icon3.png'; +import icon4 from '@/assets/img/media-account/icon4.png'; + +export const CARD_FIELDS = [ + { + label: '账号总数', + prop: 'total_number', + icon: icon1, + }, + { + label: '总粉丝数', + prop: 'total_fans_number', + icon: icon2, + tooltip: '总粉丝数', + }, + { + label: '总赞藏数', + prop: 'total_like_number', + icon: icon3, + tooltip: '总赞藏数', + }, + { + label: '近7日观看数', + prop: 'in_the_past_seven_days_view_number', + icon: icon4, + tooltip: '近7日观看数', + }, +]; + +export const INITIAL_QUERY = { + name: '', + status: '', + operator_id: '', + group_ids: [], + date_range: '', +}; + +export enum EnumStatus { + NORMAL = 1, + PAUSE = 3, + UNAUTHORIZED = 0, + ABNORMAL = 2, + ABNORMAL_LOGIN = 4, + ABNORMAL_REQUEST = 5, + ABNORMAL_FREEZE = 6, +} + +export const STATUS_LIST = [ + { + text: '正常', + label: '正常', + value: EnumStatus.NORMAL, + }, + { + text: '暂停同步', + label: '暂停同步', + value: EnumStatus.PAUSE, + }, + { + text: '未授权', + label: '未授权', + value: EnumStatus.UNAUTHORIZED, + }, + { + text: '异常', + label: '异常', + value: EnumStatus.ABNORMAL, + }, + { + text: '异常-登录状态失效', + label: '异常', + value: EnumStatus.ABNORMAL_LOGIN, + tooltip: '登录状态失效，需重新扫码授权', + }, + { + text: '异常-请求过于频繁', + label: '异常', + value: EnumStatus.ABNORMAL_REQUEST, + tooltip: '请求过于频繁，需等待24小时后重试', + }, + { + text: '异常-账号被冻结/封禁', + label: '异常', + value: EnumStatus.ABNORMAL_FREEZE, + tooltip: '账号被冻结/封禁', + }, +]; diff --git a/src/views/property-marketing/media-account/account-dashboard/index.vue b/src/views/property-marketing/media-account/account-dashboard/index.vue index d7d4473..e6b3750 100644 --- a/src/views/property-marketing/media-account/account-dashboard/index.vue +++ b/src/views/property-marketing/media-account/account-dashboard/index.vue @@ -3,9 +3,289 @@ * @Date: 2025-06-25 10:02:20 --> - + - + diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss b/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss index 475cd8b..cfdf11c 100644 --- a/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss +++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/style.scss @@ -1,10 +1,63 @@ -.container { - width: 100%; - .action-row { - :deep(.arco-btn) { - .arco-btn-icon { - line-height: 14px; - } +.action-row { + :deep(.arco-btn) { + .arco-btn-icon { + line-height: 14px; + } + } +} + +.account-table { + .cts { + color: var(--Text-1, #211f24); + font-family: 'Alibaba PuHuiTi'; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 22px; + } + .status-tag { + width: fit-content; + display: flex; + height: 28px; + padding: 0px 8px; + align-items: center; + border-radius: 2px; + background: var(--Functional-Red-1, #ffe9e7); + + .status-tag-text { + color: var(--Functional-Red-6, #f64b31); + } + &-3 { + background: #fff7e5; + .status-tag-text { + color: var(--Functional-yellow-6, #ffae00); + } + } + &-1 { + background: var(--Functional-Green-1, #ebf7f2); + .status-tag-text { + color: var(--Functional-Green-6, #25c883); + } + } + &-0 { + background: var(--BG-200, #f2f3f5); + .status-tag-text { + color: var(--Text-2, #3c4043); + } + } + } + .ai-evaluation-row { + .icon { + position: relative; + top: 1px; + } + } + .rate-row { + &.up { + color: var(--Functional-Red-6, #f64b31); + } + &.down { + color: var(--Functional-Green-6, #25c883); } } } diff --git a/src/views/property-marketing/media-account/account-dashboard/constants.ts b/src/views/property-marketing/media-account/account-dashboard/constants.ts index 97bf6bc..916b6a0 100644 --- a/src/views/property-marketing/media-account/account-dashboard/constants.ts +++ b/src/views/property-marketing/media-account/account-dashboard/constants.ts @@ -40,6 +40,8 @@ export const INITIAL_QUERY = { operator_id: '', group_ids: [], date_range: '', + column: '', + order: '', }; export enum EnumStatus { diff --git a/src/views/property-marketing/media-account/account-dashboard/index.vue b/src/views/property-marketing/media-account/account-dashboard/index.vue index e6b3750..6bbb143 100644 --- a/src/views/property-marketing/media-account/account-dashboard/index.vue +++ b/src/views/property-marketing/media-account/account-dashboard/index.vue @@ -21,7 +21,7 @@ - {{ + {{ item.prop === 'total_like_number' ? formatNumberShow(overviewData.total_like_number + overviewData.total_collect_number) : formatNumberShow(overviewData[item.prop]) @@ -35,9 +35,9 @@
{ reload(); }; -const handleEdit = (record) => { - console.log('编辑账号:', record); - // 这里可以打开编辑弹窗 -}; - -const handleDelete = (record) => { - console.log('删除账号:', record); - // 这里可以打开删除确认弹窗 -}; - const handleSelectionChange = (selectedRows) => { - selectedItems.value = selectedRows; - console.log('选中的账号:', selectedRows); + selectedRowKeys.value = selectedRows; + console.log('选中的账号:', selectedRowKeys.value); +}; + +const handleExport = () => { + postAccountBoardExport({ + ...query.value, + }).then((res) => { + const { code, data } = res; + if (code === 200) { + console.log(data.download_url); + } + }); +}; + +const handleSorterChange = (column, order) => { + query.value.column = column; + query.value.order = order; + reload(); }; onMounted(() => { diff --git a/src/views/property-marketing/media-account/account-dashboard/style.scss b/src/views/property-marketing/media-account/account-dashboard/style.scss index af55f63..63b0e45 100644 --- a/src/views/property-marketing/media-account/account-dashboard/style.scss +++ b/src/views/property-marketing/media-account/account-dashboard/style.scss @@ -40,6 +40,7 @@ } .table-wrap { + width: 100%; .pagination-box { display: flex; width: 100%; diff --git a/src/views/property-marketing/media-account/account-detail/index.vue b/src/views/property-marketing/media-account/account-detail/index.vue new file mode 100644 index 0000000..40fd2bf --- /dev/null +++ b/src/views/property-marketing/media-account/account-detail/index.vue @@ -0,0 +1,32 @@ + + + + + + diff --git a/src/views/property-marketing/media-account/account-detail/style.scss b/src/views/property-marketing/media-account/account-detail/style.scss new file mode 100644 index 0000000..e69de29 From 4873cedefeccf82d245c9961c9dba9d0125f5771 Mon Sep 17 00:00:00 2001 From: rd <> Date: Sat, 28 Jun 2025 11:42:54 +0800 Subject: [PATCH 3/7] =?UTF-8?q?feat:=20=E7=BB=9F=E4=B8=80=E5=88=86?= =?UTF-8?q?=E9=A1=B5=E7=BB=84=E4=BB=B6=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/components/index.scss | 3 +- src/styles/components/pagination.scss | 41 +++++++++++++++++++ .../account-dashboard/style.scss | 33 --------------- .../media-account/account-manage/style.scss | 32 --------------- .../put-account/account-manage/style.scss | 33 --------------- 5 files changed, 43 insertions(+), 99 deletions(-) create mode 100644 src/styles/components/pagination.scss diff --git a/src/styles/components/index.scss b/src/styles/components/index.scss index 5422233..746da5b 100644 --- a/src/styles/components/index.scss +++ b/src/styles/components/index.scss @@ -1,3 +1,4 @@ @import './input.scss'; @import './table.scss'; -@import './checkbox.scss'; \ No newline at end of file +@import './checkbox.scss'; +@import './pagination.scss'; \ No newline at end of file diff --git a/src/styles/components/pagination.scss b/src/styles/components/pagination.scss new file mode 100644 index 0000000..5ac8023 --- /dev/null +++ b/src/styles/components/pagination.scss @@ -0,0 +1,41 @@ +.arco-pagination { + .arco-pagination-list { + .arco-pagination-item { + border-radius: 4px; + border: 1px solid var(--BG-300, #e6e6e8); + &.arco-pagination-item-ellipsis { + border: none; + } + + &.arco-pagination-item-active { + background-color: transparent; + border: 1px solid var(--Brand-Brand-6, #6d4cfe); + } + } + } + .arco-pagination-options { + .arco-select { + background-color: transparent; + border-radius: 4px; + border: 1px solid var(--BG-300, #e6e6e8); + } + } + .arco-pagination-jumper { + &-input { + border-radius: 4px; + border: 1px solid var(--BG-300, #e6e6e8); + } + &-prepend { + color: var(--Text-2, #3c4043); + text-align: right; + font-family: 'Alibaba PuHuiTi'; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 22px; + } + .arco-input-wrapper { + background-color: transparent; + } + } +} diff --git a/src/views/property-marketing/media-account/account-dashboard/style.scss b/src/views/property-marketing/media-account/account-dashboard/style.scss index 63b0e45..f56c5bb 100644 --- a/src/views/property-marketing/media-account/account-dashboard/style.scss +++ b/src/views/property-marketing/media-account/account-dashboard/style.scss @@ -47,39 +47,6 @@ padding: 16px 24px; justify-content: flex-end; align-items: center; - :deep(.arco-pagination) { - .arco-pagination-list { - .arco-pagination-item { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - &.arco-pagination-item-ellipsis { - border: none; - } - - &.arco-pagination-item-active { - background-color: transparent; - border: 1px solid var(--Brand-Brand-6, #6d4cfe); - } - } - } - .arco-pagination-jumper-input { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - } - .arco-pagination-jumper-prepend { - color: var(--Text-2, #3c4043); - text-align: right; - font-family: 'Alibaba PuHuiTi'; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 22px; /* 157.143% */ - } - .arco-select-view-single { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - } - } } } } diff --git a/src/views/property-marketing/media-account/account-manage/style.scss b/src/views/property-marketing/media-account/account-manage/style.scss index 1d9c9cb..9258844 100644 --- a/src/views/property-marketing/media-account/account-manage/style.scss +++ b/src/views/property-marketing/media-account/account-manage/style.scss @@ -84,39 +84,7 @@ padding: 16px 24px; justify-content: flex-end; align-items: center; - :deep(.arco-pagination) { - .arco-pagination-list { - .arco-pagination-item { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - &.arco-pagination-item-ellipsis { - border: none; - } - &.arco-pagination-item-active { - background-color: transparent; - border: 1px solid var(--Brand-Brand-6, #6d4cfe); - } - } - } - .arco-pagination-jumper-input { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - } - .arco-pagination-jumper-prepend { - color: var(--Text-2, #3c4043); - text-align: right; - font-family: 'Alibaba PuHuiTi'; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 22px; /* 157.143% */ - } - .arco-select-view-single { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - } - } } } } diff --git a/src/views/property-marketing/put-account/account-manage/style.scss b/src/views/property-marketing/put-account/account-manage/style.scss index 97d0462..b0eb844 100644 --- a/src/views/property-marketing/put-account/account-manage/style.scss +++ b/src/views/property-marketing/put-account/account-manage/style.scss @@ -68,39 +68,6 @@ padding: 16px 24px; justify-content: flex-end; align-items: center; - :deep(.arco-pagination) { - .arco-pagination-list { - .arco-pagination-item { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - &.arco-pagination-item-ellipsis { - border: none; - } - - &.arco-pagination-item-active { - background-color: transparent; - border: 1px solid var(--Brand-Brand-6, #6d4cfe); - } - } - } - .arco-pagination-jumper-input { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - } - .arco-pagination-jumper-prepend { - color: var(--Text-2, #3c4043); - text-align: right; - font-family: 'Alibaba PuHuiTi'; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 22px; /* 157.143% */ - } - .arco-select-view-single { - border-radius: 4px; - border: 1px solid var(--BG-300, #e6e6e8); - } - } } } } From cfd86b1408f4fcef72c5bf8d7447fb921ab11874 Mon Sep 17 00:00:00 2001 From: rd <> Date: Sat, 28 Jun 2025 15:28:54 +0800 Subject: [PATCH 4/7] =?UTF-8?q?feat:=20=E8=B4=A6=E5=8F=B7=E6=95=B0?= =?UTF-8?q?=E6=8D=AE=E7=9C=8B=E6=9D=BF=E3=80=81=E8=B4=A6=E6=88=B7=E8=AF=A6?= =?UTF-8?q?=E6=83=85=E3=80=81=E6=8A=95=E6=94=BE=E6=95=B0=E6=8D=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../routes/modules/propertyMarketing.ts | 6 +- src/styles/components/index.scss | 3 +- src/styles/components/pagination.scss | 4 +- src/styles/components/tabs.scss | 29 +++ src/utils/tools.ts | 11 + .../components/account-table/constants.ts | 4 +- .../components/account-table/index.vue | 21 +- .../media-account/account-dashboard/index.vue | 15 +- .../components/account-info/index.vue | 139 ++++++++++ .../components/account-info/style.scss | 3 + .../components/note-table/constants.ts | 73 ++++++ .../components/note-table/index.vue | 158 +++++++++++ .../components/note-table/style.scss | 44 ++++ .../media-account/account-detail/constants.ts | 23 ++ .../media-account/account-detail/index.vue | 28 +- .../media-account/account-detail/style.scss | 40 +++ .../components/account-table/style.scss | 2 +- .../media-account/account-manage/index.vue | 6 +- .../media-account/account-manage/style.scss | 2 - .../components/account-table/constants.ts | 239 +++++++++++++++++ .../components/account-table/index.vue | 213 +++++++++++++++ .../components/account-table/style.scss | 63 +++++ .../components/filter-block/index.vue | 123 +++++++++ .../components/filter-block/style.scss | 37 +++ .../components/group-select/index.vue | 64 +++++ .../put-account/account-data/constants.ts | 65 +++++ .../put-account/account-data/index.vue | 245 ++++++++++++++++++ .../put-account/account-data/style.scss | 58 +++++ 28 files changed, 1684 insertions(+), 34 deletions(-) create mode 100644 src/styles/components/tabs.scss create mode 100644 src/views/property-marketing/media-account/account-detail/components/account-info/index.vue create mode 100644 src/views/property-marketing/media-account/account-detail/components/account-info/style.scss create mode 100644 src/views/property-marketing/media-account/account-detail/components/note-table/constants.ts create mode 100644 src/views/property-marketing/media-account/account-detail/components/note-table/index.vue create mode 100644 src/views/property-marketing/media-account/account-detail/components/note-table/style.scss create mode 100644 src/views/property-marketing/media-account/account-detail/constants.ts create mode 100644 src/views/property-marketing/put-account/account-data/components/account-table/constants.ts create mode 100644 src/views/property-marketing/put-account/account-data/components/account-table/index.vue create mode 100644 src/views/property-marketing/put-account/account-data/components/account-table/style.scss create mode 100644 src/views/property-marketing/put-account/account-data/components/filter-block/index.vue create mode 100644 src/views/property-marketing/put-account/account-data/components/filter-block/style.scss create mode 100644 src/views/property-marketing/put-account/account-data/components/group-select/index.vue create mode 100644 src/views/property-marketing/put-account/account-data/constants.ts create mode 100644 src/views/property-marketing/put-account/account-data/index.vue create mode 100644 src/views/property-marketing/put-account/account-data/style.scss diff --git a/src/router/routes/modules/propertyMarketing.ts b/src/router/routes/modules/propertyMarketing.ts index a3f8edf..e7636ba 100644 --- a/src/router/routes/modules/propertyMarketing.ts +++ b/src/router/routes/modules/propertyMarketing.ts @@ -93,7 +93,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [ }, children: [ { - path: 'accountManagement', + path: 'manage', name: 'PutAccountAccountManagement', meta: { locale: '账号管理', @@ -103,14 +103,14 @@ const COMPONENTS: AppRouteRecordRaw[] = [ component: () => import('@/views/property-marketing/put-account/account-manage'), }, { - path: 'accountData', + path: 'data', name: 'PutAccountAccountData', meta: { locale: '账号数据', requiresAuth: true, roles: ['*'], }, - component: () => import('@/views/property-marketing/repository/test'), + component: () => import('@/views/property-marketing/put-account/account-data'), }, { path: 'accountDashboard', diff --git a/src/styles/components/index.scss b/src/styles/components/index.scss index 746da5b..4655cb9 100644 --- a/src/styles/components/index.scss +++ b/src/styles/components/index.scss @@ -1,4 +1,5 @@ @import './input.scss'; @import './table.scss'; @import './checkbox.scss'; -@import './pagination.scss'; \ No newline at end of file +@import './pagination.scss'; +@import './tabs.scss'; \ No newline at end of file diff --git a/src/styles/components/pagination.scss b/src/styles/components/pagination.scss index 5ac8023..d0fa4f8 100644 --- a/src/styles/components/pagination.scss +++ b/src/styles/components/pagination.scss @@ -3,11 +3,11 @@ .arco-pagination-item { border-radius: 4px; border: 1px solid var(--BG-300, #e6e6e8); - &.arco-pagination-item-ellipsis { + &-ellipsis { border: none; } - &.arco-pagination-item-active { + &-active { background-color: transparent; border: 1px solid var(--Brand-Brand-6, #6d4cfe); } diff --git a/src/styles/components/tabs.scss b/src/styles/components/tabs.scss new file mode 100644 index 0000000..422d644 --- /dev/null +++ b/src/styles/components/tabs.scss @@ -0,0 +1,29 @@ +.arco-tabs { + .arco-tabs-nav-tab { + &-list { + .arco-tabs-tab { + .arco-tabs-tab-title { + color: var(--Text-2, #3c4043); + font-family: 'Alibaba PuHuiTi'; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 24px; + } + &-active { + .arco-tabs-tab-title { + color: #6d4cfe; + } + } + &:hover { + .arco-tabs-tab-title::before { + display: none; + } + } + } + .arco-tabs-nav-ink { + background-color: #6d4cfe; + } + } + } +} diff --git a/src/utils/tools.ts b/src/utils/tools.ts index b38731a..256ec57 100644 --- a/src/utils/tools.ts +++ b/src/utils/tools.ts @@ -2,6 +2,8 @@ * @Author: RenXiaoDong * @Date: 2025-06-27 17:36:31 */ +import dayjs from 'dayjs'; + export function toFixed(num: number | string, n: number): number { return parseFloat(parseFloat(num.toString()).toFixed(n)); } @@ -82,3 +84,12 @@ export function formatTableField(fieldItem: any, rowValue: any, showExactValue = return `${fieldItem.prefix || ''}${value}${fieldItem.suffix || ''}`; } + +export function exactFormatTime(val: number, curYearFmt = 'MM-DD HH:mm', otherYearFmt = 'YYYY-MM-DD HH:mm') { + if (!val) return '-'; + const year = dayjs(val * 1000).year(); + const currYear = dayjs().year(); + const diff = year - currYear; + const fmt = diff === 0 ? curYearFmt : otherYearFmt; + return dayjs(val * 1000).format(fmt); +} diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts b/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts index d9fd2f9..48b93fb 100644 --- a/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts +++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts @@ -2,7 +2,7 @@ * @Author: RenXiaoDong * @Date: 2025-06-28 10:33:06 */ -export const tableColumns = [ +export const TABLE_COLUMNS = [ { title: '账号名称', dataIndex: 'name', @@ -147,7 +147,7 @@ export const tableColumns = [ { title: '操作', dataIndex: 'operation', - width: 120, + width: 100, fixed: 'right', }, ]; diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue b/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue index 57f3e16..00a60a2 100644 --- a/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue +++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue @@ -4,7 +4,9 @@ -->