From 2a15298cf8e2a4ac69e0651c6922d90420f39e7e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=80=E4=B8=87?= <52823142+Ten-K@users.noreply.github.com> Date: Thu, 26 May 2022 21:29:26 +0800 Subject: [PATCH] feat: add pdf preview demo (#282) * feat: add pdf preview demo --- locales/en.yaml | 1 + locales/zh-CN.yaml | 1 + package.json | 1 + pnpm-lock.yaml | 34 +++++++--------- src/router/modules/able.ts | 8 ++++ src/views/able/pdf.vue | 80 ++++++++++++++++++++++++++++++++++++++ 6 files changed, 105 insertions(+), 20 deletions(-) create mode 100644 src/views/able/pdf.vue diff --git a/locales/en.yaml b/locales/en.yaml index 9841faebe..dce886244 100644 --- a/locales/en.yaml +++ b/locales/en.yaml @@ -83,5 +83,6 @@ menus: hsCascader: Area Cascader hsSwiper: Swiper Plugin hsVirtualList: Virtual List + hsPdf: PDF Preview status: hsLoad: Loading... diff --git a/locales/zh-CN.yaml b/locales/zh-CN.yaml index 9dc4b4aba..82cd5fbb8 100644 --- a/locales/zh-CN.yaml +++ b/locales/zh-CN.yaml @@ -83,5 +83,6 @@ menus: hsCascader: 区域级联选择器 hsSwiper: Swiper插件 hsVirtualList: 虚拟列表 + hsPdf: PDF预览 status: hsLoad: 加载中... diff --git a/package.json b/package.json index fb74cf38d..0d61c1a4a 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "vue-form-create2": "^1.2.8", "vue-i18n": "^9.2.0-beta.35", "vue-json-pretty": "^2.0.2", + "vue-pdf-embed": "^1.1.2", "vue-router": "^4.0.15", "vue-types": "^4.1.1", "vue-virtual-scroller": "^2.0.0-alpha.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 38b6a7416..fe816e91b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -105,6 +105,7 @@ specifiers: vue-form-create2: ^1.2.8 vue-i18n: ^9.2.0-beta.35 vue-json-pretty: ^2.0.2 + vue-pdf-embed: ^1.1.2 vue-router: ^4.0.15 vue-types: ^4.1.1 vue-virtual-scroller: ^2.0.0-alpha.1 @@ -155,6 +156,7 @@ dependencies: vue-form-create2: 1.2.9 vue-i18n: 9.2.0-beta.35_vue@3.2.35 vue-json-pretty: 2.0.6_vue@3.2.35 + vue-pdf-embed: 1.1.2_vue@3.2.35 vue-router: 4.0.15_vue@3.2.35 vue-types: 4.1.1_vue@3.2.35 vue-virtual-scroller: 2.0.0-alpha.1_vue@3.2.35 @@ -2173,10 +2175,6 @@ packages: peerDependencies: eslint: ^6.2.0 || ^7.0.0 || ^8.0.0 eslint-plugin-vue: ^8.0.1 - typescript: "*" - peerDependenciesMeta: - typescript: - optional: true dependencies: "@typescript-eslint/eslint-plugin": 5.23.0_17b6d2ce7129f0b36f2c30ae592c16e7 "@typescript-eslint/parser": 5.23.0_eslint@8.15.0+typescript@4.6.4 @@ -2186,6 +2184,7 @@ packages: vue-eslint-parser: 8.3.0_eslint@8.15.0 transitivePeerDependencies: - supports-color + - typescript dev: true /@vue/reactivity-transform/3.2.33: @@ -3280,8 +3279,6 @@ packages: finalhandler: 1.1.2 parseurl: 1.3.3 utils-merge: 1.0.1 - transitivePeerDependencies: - - supports-color dev: true /consola/2.15.3: @@ -3412,8 +3409,6 @@ packages: color: 0.11.4 debug: 3.2.7 rgb: 0.1.0 - transitivePeerDependencies: - - supports-color dev: false /css-declaration-sorter/6.2.2_postcss@8.4.13: @@ -3628,11 +3623,6 @@ packages: { integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== } - peerDependencies: - supports-color: "*" - peerDependenciesMeta: - supports-color: - optional: true dependencies: ms: 2.0.0 dev: true @@ -3642,11 +3632,6 @@ packages: { integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ== } - peerDependencies: - supports-color: "*" - peerDependenciesMeta: - supports-color: - optional: true dependencies: ms: 2.1.3 dev: false @@ -4784,8 +4769,6 @@ packages: parseurl: 1.3.3 statuses: 1.5.0 unpipe: 1.0.0 - transitivePeerDependencies: - - supports-color dev: true /find-up/4.1.0: @@ -8645,6 +8628,17 @@ packages: vue: 3.2.35 dev: false + /vue-pdf-embed/1.1.2_vue@3.2.35: + resolution: + { + integrity: sha512-puXchZBqS3I/h+rPmqDYxMfE+UKtpOk2aRtGcl/BOgexNEPAggt1AghNOl8bmI/NY6M1+dS7YClQvWMvb9DJCA== + } + peerDependencies: + vue: ^2.x || ^3.x + dependencies: + vue: 3.2.35 + dev: false + /vue-resize/2.0.0-alpha.1_vue@3.2.35: resolution: { diff --git a/src/router/modules/able.ts b/src/router/modules/able.ts index 2941b4474..7ed3bb367 100644 --- a/src/router/modules/able.ts +++ b/src/router/modules/able.ts @@ -130,6 +130,14 @@ const ableRouter = { meta: { title: $t("menus.hsVirtualList") } + }, + { + path: "/able/pdf", + name: "Pdf", + component: () => import("/@/views/able/pdf.vue"), + meta: { + title: $t("menus.hsPdf") + } } ] }; diff --git a/src/views/able/pdf.vue b/src/views/able/pdf.vue new file mode 100644 index 000000000..cfa31cedb --- /dev/null +++ b/src/views/able/pdf.vue @@ -0,0 +1,80 @@ + + +