diff --git a/src/assets/coc-card-empty.pdf b/src/assets/coc-card-empty.pdf new file mode 100644 index 0000000..f01a193 Binary files /dev/null and b/src/assets/coc-card-empty.pdf differ diff --git a/src/components/coc-card/SkillTable.vue b/src/components/coc-card/SkillTable.vue index b7834ee..0d54217 100644 --- a/src/components/coc-card/SkillTable.vue +++ b/src/components/coc-card/SkillTable.vue @@ -262,12 +262,14 @@ function getTotal(points: SkillPoint, init: number) { 'td-color-1': (index + 1) % 2, }" > - - {{ row.initPlaceholder }} - + + {{ row.initPlaceholder }} + + {{ row.init }} @@ -427,5 +429,14 @@ function getTotal(points: SkillPoint, init: number) { .init-placeholder { color: var(--color-placeholder); + display: inline-flex; + width: 0; + justify-content: center; +} +.init-placeholder-content { + display: block; + transform: scale(0.88); + transform-origin: center center; + white-space: nowrap; } diff --git a/src/utils/file.ts b/src/utils/file.ts new file mode 100644 index 0000000..ed1cb11 --- /dev/null +++ b/src/utils/file.ts @@ -0,0 +1,6 @@ +export function downloadFile(url: string, title: string) { + const a = document.createElement('a'); + a.href = url; + a.download = title; + a.click(); +} diff --git a/src/utils/image.ts b/src/utils/image.ts index cb15bb9..3f0f640 100644 --- a/src/utils/image.ts +++ b/src/utils/image.ts @@ -1,3 +1,5 @@ +import { downloadFile } from './file'; + export function getImageSize(url: string) { return new Promise<{ width: number; height: number }>((resolve) => { const img = document.createElement('img'); @@ -13,8 +15,5 @@ export function getImageSize(url: string) { } export function downloadImage(url: string, title: string = 'image') { - const a = document.createElement('a'); - a.href = url; - a.download = title; - a.click(); + downloadFile(url, title); } diff --git a/src/views/COCCardSections/ControlSection.vue b/src/views/COCCardSections/ControlSection.vue index 843ba13..614e0f1 100644 --- a/src/views/COCCardSections/ControlSection.vue +++ b/src/views/COCCardSections/ControlSection.vue @@ -15,6 +15,7 @@ import { KnifeFork, IceCream, Guide, + Brush, } from '@element-plus/icons-vue'; // components @@ -35,10 +36,12 @@ import { import { usePC, useViewData, usePageData } from '@/hooks/useCOCCardProviders'; import usePrintPaper from '@/hooks/usePrintPaper'; +import { downloadFile } from '@/utils/file'; import type { COCCardViewData } from '@/types/coc-card/viewData'; import qrWechat from '@/assets/qr-wechat.jpg'; import qrAlipay from '@/assets/qr-alipay.jpg'; +import cardPdf from '@/assets/coc-card-empty.pdf'; interface Props { paperEls: { @@ -221,37 +224,36 @@ const cleanPreloadFn = watch(morePanelVisible, (visible) => { +